/* =================================================================
   Kiran Messe Designer — WordPress theme stylesheet
   Hand-built CSS replicating the original Tailwind v4 + custom utilities.
   ================================================================= */

/* ---------- Design Tokens ---------- */
:root{
  --background: oklch(0.08 0.005 60);
  --foreground: oklch(0.97 0.005 80);
  --card: oklch(0.12 0.006 60);
  --muted: oklch(0.16 0.005 60);
  --muted-foreground: oklch(0.68 0.01 80);
  --border: oklch(0.22 0.006 70 / 0.6);
  --gold: oklch(0.78 0.12 80);
  --gold-soft: oklch(0.86 0.08 85);
  --charcoal: oklch(0.18 0.005 60);
  --onyx: oklch(0.06 0.004 60);
  --font-display: "Cormorant Garamond","Times New Roman",serif;
  --font-sans: "Inter", system-ui, sans-serif;
}

/* ---------- Reset / Base ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;border:0 solid var(--border)}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img,video{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none;transition:color .3s}
button{font:inherit;color:inherit;background:transparent;border:0;cursor:pointer}
ul,ol{list-style:none}
input,textarea,select{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:500;letter-spacing:-0.01em;line-height:1.1}

/* ---------- Utility classes ---------- */
.font-display{font-family:var(--font-display);font-weight:500;letter-spacing:-0.01em}
.text-gold-gradient{
  background: linear-gradient(135deg, oklch(0.86 0.08 85), oklch(0.72 0.14 75), oklch(0.86 0.08 85));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  font-style:normal;
}
em.text-gold-gradient{font-style:normal}
.glass{
  background: color-mix(in oklab, var(--card) 50%, transparent);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  border: 1px solid color-mix(in oklab, var(--gold) 18%, transparent);
}
.hairline{background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent);height:1px;display:block}
.noise-bg{
  background-image:
    radial-gradient(ellipse at top, oklch(0.14 0.01 70 / .6), transparent 60%),
    linear-gradient(180deg, var(--onyx), var(--background));
}
.container{max-width:1280px;margin:0 auto;padding:0 1.5rem}
.section-pad{padding-top:8rem;padding-bottom:8rem}
.section-label{
  display:inline-flex;align-items:center;gap:.75rem;
  font-size:11px;letter-spacing:.4em;text-transform:uppercase;
  color: var(--gold);margin-bottom:1.5rem;
}
.section-label::before{content:"";width:2rem;height:1px;background:color-mix(in oklab,var(--gold) 60%, transparent)}
.section-title{font-size:clamp(2.25rem,5vw,3.75rem);max-width:48rem}
.row-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1.5rem;margin-bottom:4rem}
.lead{margin-top:2rem;color:var(--muted-foreground);font-size:1.125rem;line-height:1.7}
.body{margin-top:1rem;color:var(--muted-foreground);line-height:1.7}
.center-cta{margin-top:3rem;display:flex;justify-content:center}
.btn-mt-lg{margin-top:2.5rem}
.card-eyebrow{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:.25rem}
.card-title{font-size:1.25rem}

/* ---------- Buttons ---------- */
.btn-gold,.btn-ghost{
  display:inline-flex;align-items:center;gap:.6rem;
  text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;
  font-weight:600;padding:.95rem 2rem;border-radius:2px;
  transition: all .4s cubic-bezier(.2,.8,.2,1);
  cursor:pointer;
}
.btn-gold{
  background: linear-gradient(135deg, oklch(0.82 0.11 82), oklch(0.7 0.14 75));
  color: var(--onyx);
  box-shadow: 0 10px 30px -10px oklch(0.78 0.12 80 / 0.35);
  border:0;
}
.btn-gold-hover:hover{transform:translateY(-2px);box-shadow:0 18px 40px -10px oklch(0.78 0.12 80 / .5)}
.btn-ghost{
  border:1px solid color-mix(in oklab, var(--gold) 40%, transparent);
  color: var(--foreground);font-weight:500;background:transparent;
}
.btn-ghost:hover{background: color-mix(in oklab, var(--gold) 10%, transparent); border-color: var(--gold)}

/* ---------- Header ---------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:50;padding:.75rem 0}
.site-header__inner{max-width:1280px;margin:0 auto;padding:0 1rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.brand{display:flex;align-items:center;gap:.75rem;min-width:0}
.brand__logo{height:3.5rem;width:auto;flex-shrink:0}
.brand__text{display:none;flex-direction:column;line-height:1.1;min-width:0}
.brand__name{font-size:1rem;letter-spacing:.28em;text-transform:uppercase;font-family:var(--font-display);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brand__sub{font-size:11px;letter-spacing:.3em;color:var(--muted-foreground);text-transform:uppercase}
.primary-nav{display:none;align-items:center;gap:2.25rem}
.primary-nav__link{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted-foreground)}
.primary-nav__link:hover,.primary-nav__link.is-active{color:var(--gold)}
.header-cta{display:none}
.menu-toggle{padding:.5rem;color:var(--gold);display:block;flex-shrink:0}
.menu-toggle span{display:block;height:1px;background:currentColor;width:1.5rem;margin-bottom:6px}
.menu-toggle span:last-child{width:1rem;margin-left:auto;margin-bottom:0}

.mobile-menu{display:none;margin:.75rem 1rem 0;padding:1.5rem;animation: kmd-fade .3s ease}
.mobile-menu.is-open{display:block}
.mobile-menu__link{display:block;padding:.75rem 0;font-size:.875rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted-foreground)}
.mobile-menu__link:hover{color:var(--gold)}

@media (min-width: 640px){.brand__logo{height:5rem}}
@media (min-width: 768px){.brand__logo{height:6rem}.brand__text{display:flex}}
@media (min-width: 1024px){
  .primary-nav{display:flex}
  .header-cta{display:inline-flex}
  .menu-toggle{display:none}
  .mobile-menu{display:none!important}
}

/* ---------- Intro animation ---------- */
.kmd-intro{
  position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;
  background: color-mix(in oklab, var(--onyx) 96%, transparent);
  backdrop-filter: blur(24px);-webkit-backdrop-filter: blur(24px);
  transition: opacity .6s ease;
}
.kmd-intro.is-hidden{opacity:0;pointer-events:none}
.kmd-intro__inner{text-align:center;padding:0 1.5rem}
.kmd-intro__title{
  font-size: clamp(1.875rem, 7vw, 4.5rem);
  text-transform:uppercase;letter-spacing:.1em;
  opacity:0;animation: kmd-intro-title 1.2s cubic-bezier(.2,.8,.2,1) forwards;
}
@keyframes kmd-intro-title{
  from{opacity:0;letter-spacing:.1em}
  to  {opacity:1;letter-spacing:.35em}
}
.kmd-intro__sub{margin-top:1rem;font-size:.75rem;letter-spacing:.5em;text-transform:uppercase;color:var(--muted-foreground);opacity:0;animation: kmd-fade .8s ease .4s forwards}
.kmd-intro__line{
  height:1px;width:12rem;margin:2rem auto 0;
  background: linear-gradient(90deg,transparent,var(--gold),transparent);
  transform:scaleX(0);transform-origin:left;
  animation: kmd-line 1.2s ease .2s forwards;
}
@keyframes kmd-line{to{transform:scaleX(1)}}
@keyframes kmd-fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* ---------- Scroll progress ---------- */
.kmd-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:60;pointer-events:none}
.kmd-progress__bar{height:100%;width:0;background:linear-gradient(90deg,transparent,var(--gold),transparent);transition: width .15s}

/* ---------- Hero ---------- */
.hero{position:relative;height:100vh;min-height:720px;overflow:hidden}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.05)}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(to bottom, color-mix(in oklab, var(--onyx) 80%, transparent), color-mix(in oklab, var(--onyx) 60%, transparent), var(--background))}
.hero__vignette{position:absolute;inset:0;background:radial-gradient(ellipse at center, transparent 30%, oklch(0.06 0 0 / .9))}
.hero__inner{position:relative;z-index:10;height:100%;display:flex;flex-direction:column;justify-content:center;max-width:1280px;margin:0 auto;padding:0 1.5rem}
.hero__title{
  font-size:clamp(3rem,7vw,5.5rem);line-height:1.02;max-width:64rem;
  opacity:0;transform:translateY(30px);
  animation: kmd-hero 1.2s cubic-bezier(.2,.8,.2,1) .15s forwards;
}
@keyframes kmd-hero{to{opacity:1;transform:translateY(0)}}
.hero__copy{margin-top:2rem;max-width:36rem;font-size:1.125rem;color:var(--muted-foreground);line-height:1.7;opacity:0;animation: kmd-hero 1.2s cubic-bezier(.2,.8,.2,1) .35s forwards}
.hero__cta{margin-top:3rem;display:flex;flex-wrap:wrap;gap:1rem;opacity:0;animation: kmd-hero 1.2s cubic-bezier(.2,.8,.2,1) .55s forwards}
.hero__meta{
  position:absolute;bottom:2.5rem;left:1.5rem;right:1.5rem;max-width:1232px;margin:0 auto;
  display:flex;justify-content:space-between;align-items:flex-end;
  font-size:10px;letter-spacing:.4em;text-transform:uppercase;color:var(--muted-foreground);
  opacity:0;animation: kmd-fade 1s ease 1.5s forwards;
}
.reveal-up{animation-delay:0s}

/* ---------- Marquee ---------- */
.marquee-section__head{margin-bottom:3rem}
.marquee{position:relative;overflow:hidden}
.marquee__track{display:flex;width:max-content;animation: kmd-marquee 40s linear infinite}
.marquee:hover .marquee__track,.marquee__track:hover{animation-play-state:paused}
@keyframes kmd-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee__item{flex-shrink:0;padding:0 .75rem}
.marquee__card{position:relative;width:420px;height:300px;overflow:hidden;border-radius:2px}
.marquee__card img{width:100%;height:100%;object-fit:cover;transition:transform 1.6s}
.marquee__card:hover img{transform:scale(1.1)}
.marquee__overlay{position:absolute;inset:0;background:linear-gradient(to top,var(--onyx),color-mix(in oklab,var(--onyx) 10%, transparent),transparent);opacity:.8;transition:opacity .4s}
.marquee__card:hover .marquee__overlay{opacity:.6}
.marquee__caption{position:absolute;bottom:1.5rem;left:1.5rem;right:1.5rem}
@media (min-width:768px){.marquee__card{width:560px;height:380px}}

.hover-zoom img{transition:transform 1.6s}
.hover-zoom:hover img{transform:scale(1.1)}

/* ---------- Founder section ---------- */
.founder{display:grid;gap:4rem;align-items:center}
@media (min-width:768px){.founder{grid-template-columns:1fr 1fr}}
.founder__frame{position:relative}
.founder__border{position:absolute;inset:-1rem;border:1px solid color-mix(in oklab,var(--gold) 30%, transparent);z-index:-1}
.founder__img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(1);transition:filter 1s}
.founder__img:hover{filter:grayscale(0)}
.founder__badge{position:absolute;bottom:-1.5rem;right:-1.5rem;padding:1rem 1.5rem}
.founder__badge-eyebrow{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.founder__badge-name{font-size:1.5rem;margin-top:.25rem}

/* ---------- Stats ---------- */
.stats{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:color-mix(in oklab,var(--charcoal) 40%, transparent)}
.stats__grid{display:grid;grid-template-columns:repeat(2,1fr)}
@media (min-width:768px){.stats__grid{grid-template-columns:repeat(4,1fr)}}
.stats__cell{padding:2.5rem;border-right:1px solid color-mix(in oklab,var(--border) 70%, transparent)}
.stats__cell:nth-child(2n){border-right:0}
.stats__cell:nth-child(odd){border-bottom:1px solid color-mix(in oklab,var(--border) 70%, transparent)}
@media (min-width:768px){
  .stats__cell{border-right:1px solid color-mix(in oklab,var(--border) 70%, transparent)!important;border-bottom:0!important}
  .stats__cell:last-child{border-right:0!important}
}
.stats__num{font-size:clamp(3rem,6vw,3.75rem)}
.stats__label{margin-top:.75rem;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted-foreground)}

/* ---------- Services grid (home) ---------- */
.services-grid{display:grid;grid-template-columns:1fr;gap:1px;background:color-mix(in oklab,var(--border) 70%, transparent)}
@media (min-width:768px){.services-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.services-grid{grid-template-columns:repeat(3,1fr)}}
.service-card{display:block;padding:2.5rem;background:var(--background);transition:background .5s;height:100%}
.service-card:hover{background:color-mix(in oklab,var(--charcoal) 50%, transparent)}
.service-card__num{font-size:10px;letter-spacing:.4em;text-transform:uppercase;color:var(--gold);margin-bottom:1.5rem}
.service-card__title{font-size:1.875rem;margin-bottom:1rem;transition:color .3s}
.service-card:hover .service-card__title{background: linear-gradient(135deg, oklch(0.86 0.08 85), oklch(0.72 0.14 75), oklch(0.86 0.08 85));-webkit-background-clip:text;background-clip:text;color:transparent}
.service-card__line{width:3rem;transition: width .5s}
.service-card:hover .service-card__line{width:6rem}

/* ---------- Gallery ---------- */
.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
@media (min-width:768px){.gallery-grid{grid-template-columns:repeat(3,1fr)}}
.gallery-cell{position:relative;display:block;aspect-ratio:4/3;overflow:hidden}
.gallery-cell img{width:100%;height:100%;object-fit:cover}
.gallery-cell__overlay{position:absolute;inset:0;background:linear-gradient(to top,color-mix(in oklab,var(--onyx) 80%, transparent),transparent);opacity:.7;transition:opacity .4s}
.gallery-cell:hover .gallery-cell__overlay{opacity:.4}

/* ---------- Why ---------- */
.why{background:color-mix(in oklab,var(--charcoal) 30%, transparent);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.why__head{margin-bottom:4rem}
.why-grid{display:grid;grid-template-columns:1fr;gap:1.5rem}
@media (min-width:768px){.why-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.why-grid{grid-template-columns:repeat(3,1fr)}}
.why-card{padding:2rem;height:100%;transition:transform .5s}
.why-card:hover{transform:translateY(-4px)}
.why-card__num{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.why-card__title{font-size:1.5rem;margin-bottom:.75rem}
.why-card__desc{font-size:.875rem;color:var(--muted-foreground);line-height:1.7}

/* ---------- Testimonials ---------- */
.testimonials{display:grid;grid-template-columns:1fr;gap:1.5rem}
@media (min-width:768px){.testimonials{grid-template-columns:repeat(3,1fr)}}
.testimonial{padding:2.5rem;height:100%}
.testimonial__mark{color:var(--gold);font-size:3rem;line-height:1}
.testimonial__q{margin-top:1rem;font-size:1.125rem;line-height:1.6}
.testimonial__a{margin-top:2rem;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted-foreground)}

/* ---------- Final CTA ---------- */
.cta-final{position:relative;padding:10rem 0;overflow:hidden}
.cta-final__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cta-final__overlay{position:absolute;inset:0;background:linear-gradient(to bottom, color-mix(in oklab,var(--onyx) 90%, transparent), color-mix(in oklab,var(--onyx) 85%, transparent), var(--background))}
.cta-final__inner{position:relative;max-width:64rem;margin:0 auto;padding:0 1.5rem;text-align:center}
.cta-final__inner--narrow{max-width:56rem}
.cta-final__title{font-size:clamp(2.5rem,7vw,4.5rem);line-height:1.1}
.cta-final__copy{margin-top:2rem;font-size:1.125rem;color:var(--muted-foreground);max-width:40rem;margin-left:auto;margin-right:auto}
.cta-final__buttons{margin-top:3rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}

/* ---------- Site footer ---------- */
.site-footer{position:relative;border-top:1px solid var(--border);margin-top:8rem}
.site-footer__grid{max-width:1280px;margin:0 auto;padding:5rem 1.5rem;display:grid;gap:3rem;grid-template-columns:1fr}
@media (min-width:768px){.site-footer__grid{grid-template-columns:repeat(4,1fr)}.site-footer__brand{grid-column:span 2}}
.site-footer__brand-row{display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem}
.site-footer__logo{height:3rem;width:auto}
.site-footer__name{font-size:.875rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.site-footer__sub{font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--muted-foreground)}
.site-footer__copy{color:var(--muted-foreground);max-width:28rem;font-size:.875rem;line-height:1.7}
.site-footer__heading{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:1.25rem}
.site-footer__list li{margin-bottom:.75rem;font-size:.875rem;color:var(--muted-foreground)}
.site-footer__list a:hover{color:var(--gold)}
.site-footer__address{font-style:normal;font-size:.875rem;color:var(--muted-foreground);line-height:1.7;display:flex;flex-direction:column;gap:1rem}
.site-footer__label{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:color-mix(in oklab,var(--gold) 80%, transparent);margin-bottom:.25rem}
.site-footer__address a:hover{color:var(--gold)}
.site-footer__contact-line{padding-top:.5rem}
.site-footer__bottom{border-top:1px solid color-mix(in oklab,var(--border) 60%, transparent)}
.site-footer__bottom-inner{max-width:1280px;margin:0 auto;padding:1.5rem;display:flex;flex-direction:column;gap:.75rem;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-foreground)}
.site-footer__bottom-inner a:hover{color:var(--gold)}
@media (min-width:640px){.site-footer__bottom-inner{flex-direction:row;justify-content:space-between}}

/* ---------- Floating UI ---------- */
.float-whatsapp{
  position:fixed;bottom:1.5rem;right:1.5rem;z-index:50;
  width:3.5rem;height:3.5rem;border-radius:9999px;
  background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 40px -5px rgba(37,211,102,.5);
  transition:transform .3s;
}
.float-whatsapp:hover{transform:scale(1.1)}
.float-whatsapp svg{width:2rem;height:2rem}
.back-to-top{
  position:fixed;bottom:6rem;right:1.5rem;z-index:50;
  width:2.75rem;height:2.75rem;border-radius:9999px;color:var(--gold);
  background: color-mix(in oklab, var(--card) 50%, transparent);
  backdrop-filter: blur(20px) saturate(140%);
  border:1px solid color-mix(in oklab, var(--gold) 18%, transparent);
  transition:all .3s;
}
.back-to-top:hover{background:var(--gold);color:var(--onyx)}

/* ---------- Page hero ---------- */
.page-hero{padding-top:10rem;padding-bottom:6rem}
.page-hero--tight{padding-bottom:4rem}
.page-hero__title{font-size:clamp(3rem,7vw,4.5rem);line-height:1.05;max-width:60rem}
.page-hero__copy{margin-top:2rem;color:var(--muted-foreground);max-width:36rem;font-size:1.125rem}

/* ---------- About page ---------- */
.about-story{display:grid;gap:4rem;padding-bottom:6rem}
@media (min-width:768px){.about-story{grid-template-columns:1fr 1fr}}
.about-story__img{width:100%;aspect-ratio:4/5;object-fit:cover}
.about-story__text{display:flex;flex-direction:column;justify-content:center}
.about-story__title{font-size:1.875rem;margin-bottom:1.5rem}
.mission-vision{background:color-mix(in oklab,var(--charcoal) 30%, transparent);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:6rem 0}
.mission-vision__grid{display:grid;gap:4rem}
@media (min-width:768px){.mission-vision__grid{grid-template-columns:1fr 1fr}}
.mv__h{font-size:clamp(1.875rem,3vw,2rem);margin-bottom:1rem}
.founder-msg{display:grid;gap:4rem;align-items:start}
@media (min-width:768px){.founder-msg{grid-template-columns:1fr 2fr}}
.founder-msg__img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(1);transition:filter 1s}
.founder-msg__img:hover{filter:grayscale(0)}
.founder-msg__q{font-size:clamp(1.5rem,3vw,1.875rem);line-height:1.5}
.founder-msg__sig{margin-top:2rem;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.timeline-sec{padding:6rem 0;background:color-mix(in oklab,var(--charcoal) 30%, transparent);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.timeline-sec__inner{max-width:64rem;margin:0 auto;padding:0 1.5rem}
.timeline-sec__h{font-size:clamp(2.25rem,4vw,3rem);margin-bottom:4rem}
.timeline{position:relative;border-left:1px solid color-mix(in oklab,var(--gold) 30%, transparent);padding-left:2.5rem;display:flex;flex-direction:column;gap:3rem}
.timeline li{position:relative}
.timeline__dot{position:absolute;left:-46px;top:.5rem;width:.75rem;height:.75rem;border-radius:9999px;background:var(--gold);box-shadow:0 0 20px oklch(0.78 0.12 80)}
.timeline__year{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:.5rem}
.timeline__t{font-size:1.5rem;margin-bottom:.25rem}
.timeline__d{color:var(--muted-foreground)}
.team-cta{text-align:center}
.team-cta__h{font-size:clamp(2.25rem,4vw,3rem);margin-bottom:1.5rem}
.team-cta__p{max-width:36rem;margin:0 auto 3rem}

/* ---------- Services page ---------- */
.systems{padding:5rem 0;background:color-mix(in oklab,var(--charcoal) 30%, transparent);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.systems__inner{max-width:64rem;margin:0 auto;padding:0 1.5rem}
.systems__h{font-size:clamp(1.875rem,4vw,3rem);margin-bottom:2rem}
.systems strong{color:var(--foreground)}
.service-row{padding:6rem 0}
.service-row--alt{background:color-mix(in oklab,var(--charcoal) 30%, transparent);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.service-row__grid{display:grid;gap:4rem;align-items:center}
@media (min-width:768px){.service-row__grid{grid-template-columns:1fr 1fr}}
.service-row__img{width:100%;aspect-ratio:4/3;object-fit:cover}
@media (min-width:768px){.service-row__img--right{order:2}}
.service-row__num{font-size:12px;letter-spacing:.4em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.service-row__h{font-size:clamp(2.25rem,4vw,3rem);margin-bottom:1.5rem}
.service-row__d{color:var(--muted-foreground);margin-bottom:2rem;line-height:1.7}
.service-row__bullets{margin-bottom:2.5rem;display:flex;flex-direction:column;gap:.75rem}
.service-row__bullets li{display:flex;align-items:center;gap:.75rem;font-size:.875rem}
.bullet-dash{width:1.5rem;height:1px;background:var(--gold);display:inline-block}

/* ---------- Portfolio page ---------- */
.portfolio-filter-wrap{margin-bottom:2.5rem}
.portfolio-filter{display:flex;flex-wrap:wrap;gap:.5rem}
.portfolio-filter__btn{
  padding:.5rem 1.25rem;font-size:11px;letter-spacing:.25em;text-transform:uppercase;
  border:1px solid var(--border);color:var(--muted-foreground);transition:all .3s;
}
.portfolio-filter__btn:hover{border-color:var(--gold);color:var(--gold)}
.portfolio-filter__btn.is-active{border-color:var(--gold);background:var(--gold);color:var(--onyx)}
.portfolio-section{padding-bottom:6rem}
.portfolio-masonry{columns:1;column-gap:1.5rem}
@media (min-width:768px){.portfolio-masonry{columns:2}}
@media (min-width:1024px){.portfolio-masonry{columns:3}}
.portfolio-item{margin-bottom:0;break-inside:avoid;display:block;width:100%}
.portfolio-item.is-hidden{display:none}
.portfolio-card{display:block;width:100%;margin-bottom:1.5rem;position:relative;overflow:hidden;text-align:left;break-inside:avoid}
.portfolio-card img,.portfolio-card video{width:100%;object-fit:cover;transition:transform 1.6s}
.portfolio-card:hover img,.portfolio-card:hover video{transform:scale(1.05)}
.portfolio-card__overlay{position:absolute;inset:0;background:linear-gradient(to top, var(--onyx), color-mix(in oklab,var(--onyx) 20%, transparent), transparent);opacity:.9;transition:opacity .4s}
.portfolio-card:hover .portfolio-card__overlay{opacity:.6}
.portfolio-card__caption{position:absolute;bottom:1.25rem;left:1.25rem;right:1.25rem}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:70;background:color-mix(in oklab,var(--onyx) 95%, transparent);display:flex;align-items:center;justify-content:center;padding:1.5rem;animation: kmd-fade .3s}
.lightbox[hidden]{display:none}
.lightbox__close{position:absolute;top:1.5rem;right:1.5rem;color:var(--gold);font-size:2rem;z-index:1;line-height:1}
.lightbox__inner{max-width:64rem;width:100%}
.lightbox__media img,.lightbox__media video{width:100%;max-height:80vh;object-fit:contain;margin:0 auto}
.lightbox__caption{margin-top:1.5rem;text-align:center}
.lightbox__cat{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:.5rem}
.lightbox__title{font-size:1.5rem}

/* ---------- Process page ---------- */
.process-sec{padding:4rem 0;position:relative}
.process-sec__inner{max-width:64rem;margin:0 auto;padding:0 1.5rem}
.process-list{position:relative;border-left:1px solid color-mix(in oklab,var(--gold) 30%, transparent);padding-left:2.5rem;display:flex;flex-direction:column;gap:4rem}
@media (min-width:768px){.process-list{padding-left:4.5rem}}
.process-list li{position:relative}
.process-list__num{
  position:absolute;left:-48px;top:.25rem;width:2.5rem;height:2.5rem;
  border-radius:9999px;background:var(--onyx);border:1px solid var(--gold);
  color:var(--gold);display:flex;align-items:center;justify-content:center;font-size:.875rem;
}
@media (min-width:768px){.process-list__num{left:-72px}}
.process-list__t{font-size:clamp(1.875rem,3vw,2.25rem);margin-bottom:.75rem}
.process-list__d{color:var(--muted-foreground);line-height:1.7;max-width:36rem}

/* ---------- Contact page ---------- */
.contact-grid{display:grid;gap:4rem;padding-bottom:8rem}
@media (min-width:1024px){.contact-grid{grid-template-columns:1.2fr 1fr}}
.contact-form{padding:2rem;display:flex;flex-direction:column;gap:1.5rem}
@media (min-width:768px){.contact-form{padding:3rem}}
.contact-form__h{font-size:1.5rem;margin-bottom:.5rem}
.contact-form__sub{font-size:.875rem;color:var(--muted-foreground);margin-bottom:1rem}
.contact-form__row{display:grid;gap:1.25rem}
@media (min-width:768px){.contact-form__row{grid-template-columns:1fr 1fr}}
.field label{display:block;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:.5rem}
.field input,.field textarea{
  width:100%;background:transparent;border:1px solid var(--border);
  padding:.75rem;color:var(--foreground);outline:none;transition:border-color .3s;
  font-family:inherit;
}
.field input:focus,.field textarea:focus{border-color:var(--gold)}
.field textarea{resize:vertical;min-height:120px}
.contact-form__submit{width:100%;justify-content:center}
.contact-info{display:flex;flex-direction:column;gap:2.5rem}
.contact-info address{font-style:normal;color:var(--muted-foreground);line-height:1.7;margin-top:0}
.contact-info__list{display:flex;flex-direction:column;gap:.5rem;color:var(--muted-foreground)}
.contact-info__list a:hover{color:var(--gold)}

/* ---------- 404 ---------- */
.not-found{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:0 1rem}
.not-found__inner{max-width:28rem;text-align:center}
.not-found__title{font-size:6rem}
.not-found__sub{margin-top:1rem;color:var(--muted-foreground)}
.not-found .btn-gold{margin-top:2rem}

/* ---------- Reveal animation ---------- */
.reveal{opacity:0;transform:translateY(40px);transition: opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1)}
.reveal.is-visible{opacity:1;transform:translateY(0)}

/* ---------- Misc small screens ---------- */
@media (max-width: 640px){
  .section-pad{padding-top:5rem;padding-bottom:5rem}
  .founder__badge{right:-.5rem;bottom:-1rem;padding:.75rem 1rem}
  .marquee__card{width:320px;height:240px}
  .hero{min-height:600px}
  .stats__cell{padding:1.75rem}
}