/* ===== ELEGANT AUTOMATION DESIGN SYSTEM ===== */
:root{
  --black:#0a0a0a; --ink:#0d0d0c; --surface:#1a1a1a; --surface-2:#2a2a2a;
  --line:#2a2a2a; --line-soft:#222220; --white:#f5f4f0; --muted:#8a877e; --muted-2:#b8b5ac;
  --accent:#c8c0a8; --accent-bright:#d8d0b8; --accent-dim:#3a3830; --success:#27ae60; --danger:#c0392b;
  --font-display:'Cormorant Garamond',Georgia,serif; --font-util:'Barlow Condensed',sans-serif; --font-body:'Barlow',sans-serif;
  --maxw:1180px; --gutter:clamp(1.25rem,4vw,3rem); --radius:4px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--black);color:var(--white);font-family:var(--font-body);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
h1,h2,h3{font-family:var(--font-display);font-weight:600;line-height:1.06;}
a{color:inherit;text-decoration:none;}
/* height:auto keeps the intrinsic width/height attributes (which reserve space
   and prevent layout shift) from fighting CSS-driven sizing. */
img{display:block;max-width:100%;height:auto;}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter);}
.section{padding-block:clamp(4rem,9vw,7rem);}
.section--alt{background:var(--ink);border-block:1px solid var(--line-soft);}
.eyebrow{font-family:var(--font-util);font-size:0.78rem;font-weight:600;letter-spacing:0.28em;text-transform:uppercase;color:var(--accent);display:inline-flex;align-items:center;gap:0.7rem;}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--accent-dim);}
.section-head{max-width:640px;margin-bottom:clamp(2.5rem,5vw,3.5rem);}
.section-head h2{font-size:clamp(2rem,4.2vw,3.1rem);margin-top:1rem;}
.section-head p{color:var(--muted-2);margin-top:1rem;}
.btn{font-family:var(--font-util);font-weight:700;font-size:0.86rem;letter-spacing:0.14em;text-transform:uppercase;padding:0.95rem 1.6rem;border-radius:var(--radius);cursor:pointer;border:1px solid transparent;transition:.18s;display:inline-flex;align-items:center;gap:.6rem;}
.btn--solid{background:var(--accent);color:var(--black);}
.btn--solid:hover{background:var(--accent-bright);}
.btn--ghost{background:rgba(10,10,10,0.25);color:var(--white);border-color:rgba(245,244,240,0.35);backdrop-filter:blur(4px);}
.btn--ghost:hover{border-color:var(--accent);color:var(--accent);}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
.monogram{width:44px;height:44px;flex-shrink:0;}

/* ===== NAV (transparent over hero → solid on scroll) ===== */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .3s ease,border-color .3s ease;border-bottom:1px solid transparent;}
.nav.scrolled{background:rgba(10,10,10,0.82);backdrop-filter:blur(14px);border-bottom-color:var(--line-soft);}
.nav__inner{display:flex;align-items:center;justify-content:space-between;height:74px;}
.brand{display:flex;align-items:center;gap:12px;}
.brand__name{font-family:var(--font-display);font-weight:600;font-size:1.12rem;letter-spacing:0.05em;line-height:1;}
.brand__name small{display:block;font-family:var(--font-util);font-size:0.58rem;letter-spacing:0.34em;color:var(--muted-2);text-transform:uppercase;margin-top:4px;}
.nav__links{display:flex;align-items:center;gap:clamp(1rem,2.2vw,2rem);}
.nav__links a{font-family:var(--font-util);font-size:0.82rem;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--white);opacity:.85;transition:opacity .16s,color .16s;}
.nav__links a:hover{opacity:1;color:var(--accent);}
.nav__login{font-family:var(--font-util);font-size:0.78rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--white);opacity:.75;cursor:pointer;background:none;border:none;display:inline-flex;align-items:center;gap:.45rem;}
.nav__login:hover{opacity:1;color:var(--accent);}
.nav__login svg{width:13px;height:13px;}
.nav__customer{font-family:var(--font-util);font-weight:600;font-size:0.8rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--accent);background:transparent;border:1px solid var(--accent-dim);border-radius:var(--radius);padding:.55rem 1rem;cursor:pointer;transition:.16s;}
.nav__customer:hover{border-color:var(--accent);background:rgba(200,192,168,0.08);}
.nav__login-mobile{display:none;}
@media(max-width:940px){.nav__links.open .nav__login-mobile{display:inline-block;font-family:var(--font-util);font-size:0.9rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--accent);background:none;border:none;text-align:left;cursor:pointer;padding:0;}}
.callout{background:linear-gradient(180deg,rgba(200,192,168,0.07),rgba(200,192,168,0.01));border:1px solid var(--accent-dim);border-radius:12px;padding:clamp(1.5rem,4vw,2.5rem);}
.nav__burger{display:none;background:none;border:none;cursor:pointer;padding:8px;}
.nav__burger span{display:block;width:22px;height:1.5px;background:var(--white);margin:5px 0;transition:.2s;}
@media(max-width:940px){
  .nav__links,.nav__login-desktop{display:none;}
  .nav__burger{display:block;}
  .nav__links.open{display:flex;flex-direction:column;align-items:flex-start;position:absolute;top:74px;left:0;right:0;background:var(--ink);padding:1.25rem var(--gutter) 1.75rem;border-bottom:1px solid var(--line);gap:1.1rem;}
  .nav__links.open a{opacity:1;}
}

/* ===== HERO (full-bleed photo) ===== */
.hero{position:relative;min-height:92vh;display:flex;align-items:flex-end;padding-bottom:clamp(3rem,7vw,6rem);padding-top:120px;}
.hero__bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0;}
.hero__scrim{position:absolute;inset:0;z-index:1;background:
  linear-gradient(180deg, rgba(10,10,10,0.55) 0%, rgba(10,10,10,0.15) 30%, rgba(10,10,10,0.35) 62%, rgba(10,10,10,0.92) 100%),
  linear-gradient(90deg, rgba(10,10,10,0.65) 0%, rgba(10,10,10,0.1) 55%, rgba(10,10,10,0) 100%);}
.hero__inner{position:relative;z-index:2;width:100%;}
.hero h1{font-size:clamp(2.7rem,6.2vw,5rem);font-weight:600;max-width:16ch;text-shadow:0 2px 30px rgba(0,0,0,0.5);}
.hero h1 em{font-style:italic;color:var(--accent-bright);}
.hero__lead{color:#e8e6df;font-size:1.16rem;max-width:46ch;margin-top:1.5rem;text-shadow:0 1px 16px rgba(0,0,0,0.6);}
.hero__actions{display:flex;flex-wrap:wrap;gap:0.85rem;margin-top:2.2rem;}
.hero__scroll{position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);z-index:2;font-family:var(--font-util);font-size:0.68rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--muted-2);display:flex;flex-direction:column;align-items:center;gap:.5rem;}
.hero__scroll span{width:1px;height:34px;background:linear-gradient(var(--accent),transparent);}

/* ===== FEATURED SPOTLIGHT (updatable) ===== */
.feat{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:hidden;}
.feat__media{position:relative;min-height:340px;}
.feat__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.feat__body{padding:clamp(1.75rem,4vw,3rem);display:flex;flex-direction:column;justify-content:center;}
.feat__tag{display:inline-flex;align-items:center;gap:.5rem;align-self:flex-start;font-family:var(--font-util);font-size:0.7rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:var(--black);background:var(--accent);padding:.35rem .8rem;border-radius:100px;margin-bottom:1.2rem;}
.feat__body h2{font-size:clamp(1.9rem,3.5vw,2.7rem);}
.feat__body p{color:var(--muted-2);margin-top:1rem;}
.feat__cta{margin-top:1.6rem;display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;}
.feat__text-link{font-family:var(--font-util);font-size:0.82rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--accent);}
@media(max-width:820px){.feat{grid-template-columns:1fr;}.feat__media{min-height:240px;}}

/* ---- Carousel ---- */
.carousel{position:relative;}
.carousel__viewport{overflow:hidden;border-radius:10px;border:1px solid var(--line);box-shadow:0 30px 70px -50px rgba(0,0,0,0.9);}
.carousel__track{display:flex;transition:transform .75s cubic-bezier(.4,0,.2,1);}
.carousel__slide{min-width:100%;}
.carousel__slide .feat{border:none;border-radius:0;box-shadow:none;}
.carousel__controls{display:flex;align-items:center;justify-content:center;gap:1.1rem;margin-top:1.15rem;}
.carousel__nav{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--white);cursor:pointer;display:grid;place-items:center;transition:.16s;}
.carousel__nav:hover{border-color:var(--accent);color:var(--accent);}
.carousel__nav:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.carousel__nav svg{width:18px;height:18px;}
.carousel__dots{display:flex;gap:.5rem;align-items:center;}
.carousel__dot{width:9px;height:9px;border-radius:50%;border:none;background:var(--surface-2);cursor:pointer;padding:0;transition:width .2s,background .16s;}
.carousel__dot[aria-current="true"]{background:var(--accent);width:26px;border-radius:5px;}
.carousel__dot:hover{background:var(--muted);}
.carousel__dot:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
/* WCAG 2.2.2 — anything that moves automatically needs a way to stop it.
   Hover-to-pause doesn't exist on a touch screen, so this button is the real one. */
.carousel__pause{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--muted-2);cursor:pointer;display:grid;place-items:center;transition:.16s;margin-left:.35rem;}
.carousel__pause:hover{border-color:var(--accent);color:var(--accent);}
.carousel__pause:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.carousel__pause svg{width:15px;height:15px;}
.carousel__pause .icon-play{display:none;}
.carousel__pause[aria-pressed="true"] .icon-play{display:block;}
.carousel__pause[aria-pressed="true"] .icon-pause{display:none;}
@media(prefers-reduced-motion:reduce){.carousel__track{transition:none;}}

/* ===== SERVICES GRID ===== */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;}
.svc{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:1.6rem;transition:border-color .18s,transform .18s;}
.svc:hover{border-color:var(--accent-dim);transform:translateY(-3px);}
.svc__ic{width:34px;height:34px;color:var(--accent);margin-bottom:1rem;}
.svc__ic svg{width:100%;height:100%;}
.svc h3{font-size:1.5rem;}
.svc__tag{font-family:var(--font-body);font-style:italic;color:var(--accent);font-size:0.98rem;margin:.15rem 0 .6rem;}
.svc p{color:var(--muted-2);font-size:0.95rem;}
@media(max-width:820px){.svc-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.svc-grid{grid-template-columns:1fr;}}

/* ===== PROCESS ===== */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2.5vw,2rem);}
.step__num{font-family:var(--font-display);font-size:2.6rem;font-weight:500;color:var(--accent-dim);line-height:1;}
.step h3{font-size:1.3rem;margin:.6rem 0 .4rem;}
.step p{color:var(--muted-2);font-size:0.94rem;}
@media(max-width:820px){.steps{grid-template-columns:1fr 1fr;gap:2rem;}}
@media(max-width:440px){.steps{grid-template-columns:1fr;}}

/* ===== BUILDERS BAND ===== */
.band{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center;}
.band__media{border-radius:10px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3;}
.band__media img{width:100%;height:100%;object-fit:cover;}
.band__body p{color:var(--muted-2);margin:1rem 0;}
.band__partners{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem;}
.band__partners span,.band__partners a{font-family:var(--font-util);font-size:0.78rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--muted-2);border:1px solid var(--line);border-radius:100px;padding:.4rem .9rem;transition:.16s;}
.band__partners a:hover{border-color:var(--accent);color:var(--accent);}
.litetouch-wrap{background:linear-gradient(180deg,rgba(200,192,168,0.07),rgba(200,192,168,0.01));border:1px solid var(--accent-dim);border-radius:12px;padding:clamp(1.5rem,4vw,2.75rem);}
@media(max-width:760px){.band{grid-template-columns:1fr;}.band__media{order:-1;}}

/* ===== BRANDS STRIP ===== */
.brands{display:flex;flex-wrap:wrap;gap:.7rem 1.5rem;align-items:center;}
.brands span{font-family:var(--font-util);font-size:1.05rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted-2);}
.brands span::after{content:"·";color:var(--accent-dim);margin-left:1.5rem;}
.brands span:last-child::after{content:"";}

/* ===== AREAS ===== */
.areas{display:flex;flex-wrap:wrap;gap:.55rem;}
.areas span{font-family:var(--font-util);font-size:0.82rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted-2);border:1px solid var(--line);border-radius:var(--radius);padding:.45rem .85rem;transition:.16s;}
.areas span:hover{border-color:var(--accent-dim);color:var(--white);}

/* ===== TESTIMONIALS ===== */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;}
.quote{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:1.75rem;}
.quote__mark{font-family:var(--font-display);font-size:3rem;line-height:.5;color:var(--accent-dim);height:1.2rem;}
.quote p{color:var(--white);font-size:1.02rem;margin:1rem 0 1.2rem;}
.quote cite{font-family:var(--font-util);font-size:0.8rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--accent);font-style:normal;}
@media(max-width:820px){.quotes{grid-template-columns:1fr;}}

/* ===== ABOUT ===== */
.about__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,4rem);align-items:center;}
.about__body p{color:var(--muted-2);margin-bottom:1.1rem;}
.about__body p strong{color:var(--white);font-weight:600;}
.team{display:grid;gap:.9rem;}
.member{display:flex;align-items:center;gap:1rem;padding:1rem 1.2rem;background:var(--surface);border:1px solid var(--line);border-radius:6px;}
.member__ini{width:48px;height:48px;flex-shrink:0;border-radius:50%;border:1px solid var(--accent-dim);display:grid;place-items:center;font-family:var(--font-display);font-size:1.2rem;color:var(--accent);}
.member b{display:block;font-family:var(--font-body);font-weight:600;}
.member span{font-family:var(--font-util);font-size:0.74rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--muted);}
@media(max-width:760px){.about__grid{grid-template-columns:1fr;}}
.legacy{margin-top:clamp(2rem,5vw,3.25rem);border-top:1px solid var(--line-soft);padding-top:clamp(1.75rem,4vw,2.5rem);}
.legacy__label{display:block;font-family:var(--font-util);font-size:0.72rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--muted);margin-bottom:1.1rem;}
.legacy__row{display:flex;flex-wrap:wrap;gap:1rem;align-items:stretch;}
.legacy__chip{display:inline-flex;align-items:center;justify-content:center;background:#fff;border-radius:8px;padding:14px 22px;height:80px;min-width:160px;flex:0 1 auto;}
.legacy__chip img{max-height:48px;width:auto;max-width:190px;object-fit:contain;display:block;}
@media(max-width:520px){.legacy__chip{flex:1 1 40%;min-width:0;}}

/* ===== CONTACT ===== */
.contact__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,4rem);}
.contact__aside p{color:var(--muted-2);margin:1rem 0 1.75rem;}
.contact__line{display:flex;align-items:center;gap:.8rem;padding:.55rem 0;color:var(--muted-2);}
.contact__line svg{width:16px;height:16px;color:var(--accent);flex-shrink:0;}
.form{display:grid;gap:1.1rem;}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem;}
.field label{display:block;font-family:var(--font-util);font-size:0.72rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--muted);margin-bottom:.4rem;}
.field input,.field select,.field textarea{width:100%;background:var(--surface-2);border:1px solid #333;border-radius:3px;color:var(--white);font-family:var(--font-body);font-size:1rem;padding:.8rem .9rem;outline:none;transition:border-color .15s;}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent);}
.field textarea{resize:vertical;min-height:110px;}
.form__note{font-size:0.8rem;color:var(--muted);}
.form__success{display:none;background:rgba(39,174,96,0.08);border:1px solid rgba(39,174,96,0.35);border-radius:4px;padding:1rem 1.1rem;color:#9ad9b1;font-size:0.95rem;}
.form__success.show{display:block;}
.form__error{display:none;background:rgba(192,57,43,0.09);border:1px solid rgba(192,57,43,0.4);border-radius:4px;padding:1rem 1.1rem;color:#eaa79f;font-size:0.95rem;}
.form__error.show{display:block;}
.field__error{display:block;font-family:var(--font-body);font-size:0.82rem;color:#eaa79f;margin-top:.35rem;min-height:0;}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:var(--danger);}
.btn[disabled]{opacity:.6;cursor:progress;}
/* Honeypot: off-screen rather than display:none, because some bots skip fields
   that are display:none. Hidden from AT and from the tab order. */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
@media(max-width:760px){.contact__grid,.form__row{grid-template-columns:1fr;}}

/* ===== FOOTER ===== */
.footer{border-top:1px solid var(--line-soft);padding-block:3rem;}
.footer__grid{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem;}
.footer__links{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center;}
.footer__links a,.footer__links button{font-family:var(--font-util);font-size:0.78rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted);background:none;border:none;cursor:pointer;padding:0;}
.footer__links a:hover,.footer__links button:hover{color:var(--accent);}
/* #45443d measured 2.02:1 against the page black — below the 4.5:1 AA floor.
   #7c7a72 keeps the line quiet but readable. */
.footer__legal{font-family:var(--font-util);font-size:0.72rem;letter-spacing:0.14em;text-transform:uppercase;color:#7c7a72;margin-top:1.5rem;}
.footer__credit{display:inline-flex;align-items:center;gap:.75rem;margin-top:.8rem;text-decoration:none;}
.footer__credit-label{font-family:var(--font-util);font-size:0.74rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);}
.footer__credit-logo{display:inline-flex;background:#f5f4f0;border-radius:6px;padding:6px 11px;transition:background .16s,transform .16s;}
.footer__credit-logo svg{height:22px;width:auto;display:block;}
.footer__credit:hover .footer__credit-logo{background:#fff;transform:translateY(-1px);}

/* ===== MODAL ===== */
.modal{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:1.5rem;}
.modal.open{display:grid;}
.modal__scrim{position:absolute;inset:0;background:rgba(0,0,0,0.7);backdrop-filter:blur(3px);}
.modal__card{position:relative;width:100%;max-width:400px;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:2rem 1.9rem;text-align:center;}
.modal__card .monogram{margin:0 auto 1rem;}
.modal__card h3{font-size:1.6rem;}
.modal__card p{color:var(--muted-2);font-size:0.95rem;margin:.8rem 0 1.5rem;}
.modal__close{position:absolute;top:.9rem;right:1.1rem;background:none;border:none;color:var(--muted);font-size:1.4rem;cursor:pointer;line-height:1;}
.modal__close:hover{color:var(--white);}

/* ===== MOTION ===== */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease;}
.reveal.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}.reveal{opacity:1;transform:none;transition:none;}.svc,.btn{transition:none;}}