@media(max-width:991px){.navbar-collapse{padding:.5rem 0 1rem}}
/* buttons */
.btn{font-family:var(--font);font-weight:600;font-size:1rem;border-radius:3px;padding:.55rem 1.5rem;transition:background .25s,color .25s,border-color .25s}
.btn-solid{background:#2b2b2b;color:#fff}.btn-solid:hover{background:var(--accent);color:#fff}
.btn-ghost{border:1px solid #bbb;color:#222;background:transparent}.btn-ghost:hover{border-color:#222;background:#222;color:#fff}
.btn-outline-accent{border:1px solid var(--accent);color:var(--accent);background:transparent}
.btn-outline-accent:hover{background:var(--accent);color:#fff}
/* hero */
.hero{padding-top:.4rem}
.hero-card{background:var(--grey);border-radius:14px;display:grid;grid-template-columns:1.1fr 1fr;align-items:end;overflow:hidden;min-height:420px}
.hero-text{padding:clamp(1.5rem,5vw,4.5rem) clamp(1.25rem,4vw,3.5rem);align-self:center}
.hero h1{font-weight:100;font-size:clamp(2rem,4vw,4rem);line-height:1.15;margin:0 0 1.2rem;letter-spacing:.01em}
.lead-sm{font-size:1rem;line-height:1.6;color:#444;max-width:550px;margin-bottom:1.3rem}
.hero-img{height:100%;width: auto;margin-bottom:-20px;}
/* seeing */
.seeing{padding:clamp(3rem,7vw,5.5rem) 0 clamp(2.5rem,6vw,4rem)}
.seeing-title{font-weight:100;font-size:clamp(1.6rem,3vw,3rem);margin-bottom:1.5rem}
.seeing-img{position:relative;max-width:950px;margin:0 auto;overflow:hidden}
.seeing-img img{width:100%;height:500px;aspect-ratio:12/5;object-fit:cover}
.tag{position:absolute;font-size:.55rem;color:#fff;background:rgba(0,0,0,.6);padding:.2rem .5rem;border:1px solid rgba(255,255,255,.4);white-space:nowrap}
.t1{top:12%;right:6%}.t2{top:32%;right:14%}.t3{top:52%;right:20%}
.seeing-copy{font-size:1rem;color:#3B4B4B;max-width:620px;margin:1.3rem auto 0;line-height:1.6}
/* dark sections */
.dark-sec{background:var(--dark);color:#fff}
.h-light{font-weight:100;font-size:clamp(30px,3vw,3rem);line-height:1.2;margin-bottom:1rem}
.sh-light{font-weight:100;font-size:clamp(30px,4vw,4rem);line-height:1.2;margin-bottom:1rem}
.h-mid{font-weight:100;font-size:clamp(1.6rem,3vw,3rem);line-height:1.25;margin-bottom:1rem}
.work{padding:clamp(3rem,7vw,5.5rem) 0 clamp(2.5rem,5vw,4rem)}
.work-intro{padding-left:clamp(0px,6vw,0rem);margin-bottom:2.5rem}
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;grid-template-areas:"a b c" "d d e" "f g h"}
.w{margin:0;position:relative;overflow:hidden;background:#000}
.w img{width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    transition: transform .6s ease;}
.w:hover img{transform:scale(1.04)}
.w-a{grid-area:a}.w-b{grid-area:b}.w-c{grid-area:c}.w-f{grid-area:f}.w-g{grid-area:g}.w-h{grid-area:h}
.w-a,.w-b,.w-c,.w-f,.w-g,.w-h{aspect-ratio:4/3}
.w-d{grid-area:d;min-height:260px}.w-e{grid-area:e;min-height:260px}
.w figcaption {
    position: static;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .7rem .6rem;
    font-size: .7rem;
    background: #232323;
    color: #fff;
}

.w figcaption em {
    font-style: normal;
    color: var(--accent);
}
/* stats */
.stats{padding:3.2rem 0;background:#fff}
.stat{padding:.8rem 1rem}
@media(min-width:768px){.stat+.stat{border-left:1px solid #e3e3e3}}
.stat strong{display:block;font-weight:250;font-size:3rem}
.stat span{font-size:20px;color:#444}
/* marquee */
.marquee{overflow:hidden;background:#fff;border-top:1px solid #eee;border-bottom:1px solid #ddd;padding:2rem 0}
.marquee-track{display:flex;align-items:center;gap:2rem;width:max-content;font-size:20px;font-weight:400;animation:scroll 40s linear infinite}
.marquee-icon {
  display: block;
  width: 30px;
  height: 30px;
  object-fit: contain;
  flex: 0 0 16px;
  animation: rotateMarqueeIcon 17s linear infinite;
}

@keyframes rotateMarqueeIcon {
  from {
    transform: rotate(360deg);
  }
  to {
    transform: rotate(0deg);
  }
}
.marquee-track span{white-space:nowrap;text-transform:uppercase}
 
@keyframes scroll{to{transform:translateX(-50%)}}
/* about + academy */
.about{padding:clamp(3rem,6vw,5rem) 0}
.about .row>.col:first-child{padding-left:clamp(0px,5vw,4.5rem)}
.about-img{display:inline-block;max-width:380px;width:100%;aspect-ratio:7/8;object-fit:cover}
.academy{margin-top:clamp(2rem,5vw,4rem)}
.spiral{max-width:380px;width:100%;margin:0 auto;object-fit:cover;aspect-ratio:4/3}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:1.5rem;padding:0;margin:0 0 1.2rem;font-size:1rem;color:#fff}
.chips li{list-style:none;display:flex;flex-wrap:wrap;  }
/*.chips li::before{content:"";display:inline-block;width:8px;height:8px;border:1px solid #ccc;border-radius:50%;margin-right:6px}*/
/* testimonials */
.words{padding:clamp(3rem,6vw,4.5rem) 0;background:#fff}
.words-title{font-weight:100;font-size:clamp(1.6rem,3vw,3rem);margin:0}
.words-note{font-size:1rem;color:#333;text-align:right;margin:0}
.slider-wrap{position:relative}
.testi-panel{background:#eceded;border-radius:10px;padding:3rem clamp(1rem,5vw,3.5rem);display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;overflow:hidden}
.testi-col{display:flex;flex-direction:column;overflow:hidden;min-height:210px;border-radius: 10px;}
.testi{padding:3rem 3.5rem;min-height:210px;display:flex;flex-direction:column;overflow:hidden;flex:1}
.testi.is-hidden{display:none}
.testi-col-student .testi{background:#fff}
.testi-slide{display:flex;flex-direction:column;flex:1;min-height:100%}
.testi h3{font-size:1rem;letter-spacing:.04em;font-weight:400;display:flex;justify-content:space-between}
.stars{color:#e8a317;letter-spacing:2px}
.testi p{font-size:1rem;color:#858585;line-height:1.55;margin:1rem 0 auto}
.testi footer{display:flex;align-items:center;gap:.6rem;font-size:.8rem;margin-top:1rem}
.testi footer img{border-radius:50%}
.testi footer b img {border-radius:0%}
.testi small{display:block;color:#888}
.testi footer b{margin-left:auto;font-size:2.2rem;color:#ddd;font-weight:400}
.arrow{position:absolute;top:30%;transform:translateY(-50%);width:40px;height:40px;border:0;background:none;    font-size: 5.8rem;
  font-weight: 100;color:#e7e7e7;z-index:2;cursor:pointer}
.arrow:hover{color:var(--accent)}.prev{left:-60px}.next{right:-40px}
@keyframes testiDown{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}
@keyframes testiUp{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}
.testi-slide.is-prep{opacity:0}
.testi-slide.is-down{animation:testiDown .65s ease both}
.testi-slide.is-up{animation:testiUp .65s ease both}
/* begin */
.begin{background:url(img/ctaimage.webp) center/cover;color:#fff;padding:clamp(3.5rem,8vw,6rem) 0 clamp(3rem,6vw,4.5rem);position:relative;overflow:hidden}
/* .begin::before{content:"";position:absolute;inset:0 0 0 55%;background:url(https://picsum.photos/seed/city-window/900/900?grayscale) center/cover;opacity:.25;-webkit-mask-image:linear-gradient(90deg,transparent,#000);mask-image:linear-gradient(90deg,transparent,#000)} */
.begin .container-xl{position:relative}
.begin-intro{padding-left:0}
.cta-cards{padding:0}
.cta-card{border:1px solid #333;background:rgba(17,17,17,.7);padding:2.4rem;height:100%}
.cta-card h3{font-size:1.8rem;font-weight:400;margin:.4rem 0 .7rem}
.cta-link{font-size:1rem;color:var(--white);text-decoration:none;display: flex;
  margin-top: .6rem;
  align-items: center; }
.cta-link::after{content:"\2197";margin-left:10px; padding: 4px; border-radius: 50%; border: 1px solid var(--accent);width:30px;height:30px;display:flex;align-items:center;justify-content:center}
.cta-link:hover{color:var(--accent)}
.site-footer{height:120px;display:flex;background:#232323;color:#ddd;font-size:.9rem;padding:1rem 0;border-top:1px solid #222}
.social {
    display: flex;
    align-items: center;
    gap: 16px;
}

.social a img {
    width: 26px;
    height: 26px;
}

/* .social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
    font-size: 20px;
    text-decoration: none;
    transition: color 0.3s ease, transform 0.3s ease;
}

.social a:hover {
    color: #908786;
    transform: translateY(-3px);
} */


/* ===== PORTFOLIO MASONRY GRID ===== */

.masonry-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px 30px;
  align-items: start;
  background: #232323;
}

.project-card {
  overflow: hidden;
  min-width: 0;
  margin: 0;
}

.project-card > img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1.49 / 1;
  object-fit: cover;
  object-position: center;
  filter: grayscale(100%);
  transition: transform 0.4s ease, filter 0.45s ease;
}

/* Large image spanning two columns */
.project-wide {
  grid-column: span 2;
}

.project-wide > img {
  aspect-ratio: 2.1 / 1;
}

/* Square-ish food image */
.project-food > img {
  aspect-ratio: 1 / 1;
}

/* Labels below every image */
.project-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin-top: 8px;
  font-size: 16px;
  line-height: 1.4;
}

.project-meta span:first-child {
  color: #eeeeee;
  text-transform: uppercase;
}

.project-meta span:last-child {
  color: #FE3FFF;
  text-align: right;
  text-transform: none;
}

/* Image hover effect */
.project-card:hover > img {
  transform: scale(1.025);
  filter: grayscale(0);
}

.w80{
  width: 80%;
}

.w75{
  width: 75%;
}

.w100{
  width: 100%;
}
.muted-sm{
  font-weight: 100;
}

/* Tablet */
@media (max-width: 767px) {
  .masonry-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 16px;
  }

  .project-wide {
    grid-column: span 2;
  }

  .project-card > img {
    aspect-ratio: 1.25 / 1;
  }

  .project-wide > img {
    aspect-ratio: 2 / 1;
  }

  .project-food > img {
    aspect-ratio: 1 / 1;
  }

  .project-meta {
    font-size: 14px;
    gap: 5px;
  }
  .mw100{
    width: 100%;
  }
  .od2{
    order: 2;
  }
}

/* Small mobile */
@media (max-width: 420px) {
  .masonry-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .project-wide {
    grid-column: span 1;
  }

  .project-card > img,
  .project-wide > img,
  .project-food > img {
    aspect-ratio: 1.5 / 1;
  }

  .project-meta {
    font-size: 14px;
  }
  .stats {
    padding: 2rem 0;
  }
  .mw100{
    width: 100%;
  }
   
}

/* ===== END PORTFOLIO MASONRY GRID ===== */



/* responsive */
@media(max-width:991px){
 .hero-card{grid-template-columns:minmax(0,1fr)}
 .hero-img{margin:0 auto;max-width:360px;justify-self:center}
 .work-intro,.begin-intro,.about .row>.col:first-child{padding-left:0}
 .cta-cards{padding:0}
 .testi-panel{grid-template-columns:1fr}
}
@media(max-width:767px){
  .eyebrow {font-size: 0.8rem;}
  .hero-text {
  text-align: center;
  padding: 1.5rem 1rem 0;
  }
  .hero .eyebrow {
    font-size: 0.8rem;
    justify-content: center;
    text-align: center;
  }
  .hero .eyebrow.line::before,
  .hero .eyebrow.line::after {
    content: none !important;
    display: none !important;
    background: none !important;
  }
  .hero h1 {
    font-size: 2.125rem;
  }
  .btn {
    font-size: 0.8rem;
    padding: .55rem .5rem;
  }
  .hero .btn {
    flex: 1 1 0;
    min-width: 0;
    font-size: .8rem;
    padding: .55rem .25rem;
    white-space: nowrap;
  }
  .hero-img {.hero-img{width:100%;max-width:20rem;height:auto;margin:0 auto;display:block}}
  .hero-card{min-height:0}
  .hero-text{padding:1.5rem 1.25rem 0}
  .hero .btn{flex:1 1 0}
  .stat strong { 
    font-size: 2.5rem;
  }

  .seeing.container{padding-left:.75rem;padding-right:.75rem}
  .seeing-img img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:5px}
  .seeing .eyebrow{font-size:1rem}
  .seeing-title{font-size:1.625rem}

  .work-intro{text-align:center}
  .work .eyebrow{font-size:1rem;justify-content:center}
  .h-light{font-size:1.625rem}

  .work-intro,.begin-intro,.about .row>.col:first-child{padding-left:0}
  .about .row>.col{flex:0 0 100%;max-width:100%}
  .od2{order:2}
  .about .eyebrow{font-size:1rem;justify-content:center}
  .chips{justify-content:center}
  .about .row>.col{text-align:center}
  .about .row>.col:first-child{padding-left:.75rem}

  .words .d-flex{justify-content:center !important;text-align:center}
  .words .eyebrow{font-size:1rem;justify-content:center}
  .words-title{font-size:1.625rem}
  .words-note{text-align:center;width:100%}

  .begin-intro{text-align:center}
  .begin-intro .eyebrow{font-size:1rem;justify-content:center}
  .sh-light{font-size:1.625rem}
  .cta-card{text-align:center;padding:2rem 1.25rem}
  .cta-link{justify-content:center}
  .cta-card>img{display:block;margin-left:auto;margin-right:auto}

  .stat span {
    font-size: 16px;
    color: #333;
  }
  .stat {
    padding: 1.5rem 1rem;
  }
  .logo img{
    width:auto;
    height: 55px;
  }
  .arrow { 
    top: 29%;
    transform: translateY(-30%); 
    height: 80%;
  }
  .next {
    right: 20px;
  }
  .prev {
    left: -10px;
  }
  .testi-panel { 
    padding: 1.3rem clamp(1rem, 5vw, 3.5rem);
  }
  .testi {
    padding: 1.5rem 1.5rem;
  }
  .cta-card h3 {
    font-size: 1.6rem;
  }
  .cta-link::after {
    padding: 0px 0px 3px 0;
  }
  
  .site-footer {
    height: 130px;
    display: flex;
    background: #232323;
    color: #ddd;
    font-size: 0.7rem;
    padding: 1.5rem 0;
    flex-direction: column;
    align-items: center;
    justify-content: center; 
  }
  .work-grid{grid-template-columns:1fr 1fr;grid-template-areas:"a b" "c c" "d d" "e e" "f g" "h h"}
  .w-d,.w-e{min-height:0;aspect-ratio:4/3}
  .tag{font-size:.45rem}.t1{right:2%}.t2{right:6%}.t3{right:8%}
  .begin::before{inset:0;opacity:.15}
}
@media(max-width:400px){.work-grid{grid-template-columns:1fr;grid-template-areas:"a" "b" "c" "d" "e" "f" "g" "h"}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none}.testi-slide.is-down,.testi-slide.is-up{animation:none}html{scroll-behavior:auto}*{transition:none!important}}