/* ============================================================
   CALIFORNIA HOME TECHNOLOGY — "OBSIDIAN"
   Luxury black, editorial, sleek. Monochrome + champagne accent.
   ============================================================ */

:root {
  --black:#000000;
  --bg:#050505;
  --panel:#0a0a0b;
  --panel-2:#101012;
  --line:rgba(255,255,255,.09);
  --line-2:rgba(255,255,255,.05);
  --line-strong:rgba(255,255,255,.18);
  --text:#f3f2ee;
  --muted:#8d8c86;
  --muted-2:#56554f;

  /* the single, restrained accent — champagne / platinum */
  --gold:#c8a86b;
  --gold-soft:rgba(200,168,107,.14);
  --gold-line:rgba(200,168,107,.45);
  --metal:linear-gradient(120deg,#efe2c4,#c8a86b 45%,#9c7f4a);

  /* logo red — vivid secondary accent */
  --red:#e0402e;
  --red-soft:rgba(224,64,46,.16);
  --red-line:rgba(224,64,46,.5);

  --serif:"Fraunces", "Times New Roman", Georgia, serif;
  --sans:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --maxw:1320px;
  --ease:cubic-bezier(.16,1,.3,1);
}

* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; scroll-padding-top:108px; -webkit-text-size-adjust:100%; }

body {
  font-family:var(--sans);
  background:var(--black);
  color:var(--text);
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"ss01","cv01";
}

/* fine film grain + vignette over everything */
body::after{
  content:""; position:fixed; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(120% 90% at 50% 0%, transparent 55%, rgba(0,0,0,.55) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-blend-mode:overlay;
  opacity:.04;
  mix-blend-mode:overlay;
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
button{ font-family:inherit; cursor:pointer; }
::selection{ background:var(--gold); color:#000; }

.container{ width:min(100% - 48px, var(--maxw)); margin-inline:auto; position:relative; z-index:2; }
.section{ padding:clamp(80px,11vw,170px) 0; position:relative; }
.hr{ height:1px; background:var(--line); border:0; }

/* ---------- custom cursor (instant, no-lag) ---------- */
@media (hover:hover) and (pointer:fine){
  html.has-cursor, html.has-cursor *{ cursor:none; }
  .cur-ring{ position:fixed; top:0; left:0; width:30px; height:30px; border:1.5px solid var(--red); border-radius:50%;
    transform:translate(-50%,-50%); pointer-events:none; z-index:9999; opacity:0;
    transition:width .22s var(--ease), height .22s var(--ease), background-color .22s, opacity .25s; }
  .cur-dot{ position:fixed; top:0; left:0; width:5px; height:5px; background:var(--red); border-radius:50%;
    transform:translate(-50%,-50%); pointer-events:none; z-index:9999; opacity:0; transition:opacity .25s; }
  .cur-ring.on, .cur-dot.on{ opacity:1; }
  .cur-ring.hover{ width:50px; height:50px; background:var(--red-soft); }
  .cur-ring.down{ width:22px; height:22px; }
  .cur-dot.hover{ opacity:0; }
}

/* ---------- type ---------- */
h1,h2,h3{ font-family:var(--serif); font-weight:300; letter-spacing:-.015em; line-height:1.02; font-optical-sizing:auto; }
.serif{ font-family:var(--serif); }
.display{ font-size:clamp(2.7rem,5.6vw,5rem); font-weight:300; letter-spacing:-.03em; }
.display em{ font-style:italic; font-weight:400; }
.h-xl{ font-size:clamp(2.4rem,5.5vw,5rem); font-weight:300; }
.h-lg{ font-size:clamp(2rem,4vw,3.4rem); font-weight:300; }

.kicker{
  font-family:var(--sans); font-size:.72rem; font-weight:600; letter-spacing:.32em;
  text-transform:uppercase; color:var(--muted); display:inline-flex; align-items:center; gap:14px;
}
.kicker .idx{ color:var(--gold); font-variant-numeric:tabular-nums; }
.kicker::before{ content:""; width:30px; height:1px; background:var(--red); }

.lead{ font-size:clamp(1.05rem,1.5vw,1.3rem); color:var(--muted); max-width:62ch; font-weight:300; }
.text-gold{ color:var(--gold); }
.metal-text{ background:var(--metal); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:12px;
  padding:16px 30px; border:1px solid var(--line-strong); border-radius:100px;
  font-family:var(--sans); font-size:.78rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--text); background:transparent; position:relative; overflow:hidden;
  transition:color .4s var(--ease), border-color .4s var(--ease);
}
.btn::after{ content:""; position:absolute; inset:0; background:var(--text); transform:translateY(101%); transition:transform .5s var(--ease); z-index:-1; }
.btn:hover{ color:#000; border-color:var(--text); }
.btn:hover::after{ transform:translateY(0); }
.btn .arw{ transition:transform .4s var(--ease); }
.btn:hover .arw{ transform:translateX(5px); }
.btn.solid{ background:var(--text); color:#000; border-color:var(--text); }
.btn.solid::after{ background:var(--red); }
.btn.solid:hover{ color:#fff; }
.btn.gold{ border-color:var(--gold-line); color:var(--gold); }
.btn.gold::after{ background:var(--gold); }
.btn.gold:hover{ color:#000; }
.btn.sm{ padding:11px 20px; font-size:.7rem; }

/* a text link with animated underline */
.tlink{ font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; display:inline-flex; gap:10px; align-items:center; position:relative; padding-bottom:4px; }
.tlink::after{ content:""; position:absolute; left:0; bottom:0; height:1px; width:100%; background:var(--red); transform-origin:right; transform:scaleX(0); transition:transform .45s var(--ease); }
.tlink:hover::after{ transform-origin:left; transform:scaleX(1); }

/* ---------- header ---------- */
.site-header{ position:fixed; top:0; left:0; right:0; z-index:200; transition:background .5s var(--ease), border-color .5s; border-bottom:1px solid transparent; }
.site-header.scrolled{ background:rgba(0,0,0,.6); backdrop-filter:blur(18px) saturate(120%); border-bottom-color:var(--line-2); }
.nav{ display:flex; align-items:center; justify-content:space-between; height:152px; transition:height .45s var(--ease); }
.brand{ display:inline-flex; align-items:center; transition:transform .3s; }
.brand img{ height:124px; width:auto; transition:height .45s var(--ease); filter:drop-shadow(0 6px 22px rgba(0,0,0,.55)); }
.brand:hover{ transform:translateY(-2px); }
.site-header.scrolled .nav{ height:94px; }
.site-header.scrolled .brand img{ height:64px; }
.nav-links{ display:flex; gap:40px; list-style:none; align-items:center; }
.nav-links a{ font-size:.76rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:500; transition:color .3s; position:relative; }
.nav-links a:hover, .nav-links a.active{ color:var(--text); }
.nav-links a.active::before{ content:""; position:absolute; left:-14px; top:50%; width:5px; height:5px; border-radius:50%; background:var(--red); transform:translateY(-50%); }
.nav-right{ display:flex; align-items:center; gap:20px; }
.nav-toggle{ display:none; background:none; border:0; color:var(--text); width:44px; height:44px; }
.nav-toggle svg{ width:26px; height:26px; }

@media (max-width:960px){
  .nav{ height:104px; }
  .brand img{ height:74px; }
  .site-header.scrolled .nav{ height:84px; }
  .site-header.scrolled .brand img{ height:56px; }
  .nav-links{ position:fixed; inset:104px 0 auto 0; flex-direction:column; gap:0; align-items:stretch; background:rgba(0,0,0,.97); backdrop-filter:blur(20px); border-bottom:1px solid var(--line); transform:translateY(-130%); transition:transform .5s var(--ease); padding:10px 0; }
  .nav-links.open{ transform:translateY(0); }
  .nav-links a{ padding:18px 28px; font-size:.9rem; }
  .nav-toggle{ display:inline-flex; align-items:center; justify-content:center; }
  .nav-right .btn{ display:none; }
}

/* ---------- hero ---------- */
.hero{ display:flex; align-items:center; padding-top:200px; padding-bottom:70px; position:relative; overflow:hidden; }
.hero .ghost{ position:absolute; right:-4%; bottom:-12%; font-family:var(--serif); font-size:34vw; line-height:.8; color:rgba(255,255,255,.025); font-style:italic; pointer-events:none; z-index:0; white-space:nowrap; }
.hero-inner{ position:relative; z-index:2; width:100%; }
.hero-grid{ display:grid; grid-template-columns:1fr .9fr; gap:44px; align-items:center; max-width:1080px; margin-inline:auto; }
.hero-grid .hero-copy{ max-width:560px; }
.hero-photo{ position:relative; border-radius:20px; overflow:hidden; border:1px solid var(--line); box-shadow:0 50px 110px -45px rgba(0,0,0,1); }
.hero-photo img{ width:100%; height:clamp(380px,62vh,620px); object-fit:cover; display:block; transform:scale(1.001); transition:transform 1.2s var(--ease); filter:brightness(.86) saturate(1.02); }
.hero-photo:hover img{ transform:scale(1.05); }
.hero-photo::before{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none; background:linear-gradient(180deg, transparent 55%, rgba(0,0,0,.5)); }
.hero-photo .glow{ position:absolute; right:-18%; top:-18%; width:60%; height:60%; z-index:1; background:radial-gradient(circle, var(--red-soft), transparent 70%); pointer-events:none; }
.hero-photo .tag{ position:absolute; left:18px; bottom:16px; z-index:3; display:inline-flex; align-items:center; gap:9px; padding:9px 15px; border-radius:100px; background:rgba(6,7,10,.6); backdrop-filter:blur(10px); border:1px solid var(--line); font-size:.72rem; letter-spacing:.04em; color:#fff; }
.hero-photo .tag::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--red); box-shadow:0 0 8px var(--red); }
@media (max-width:920px){ .hero-grid{ grid-template-columns:1fr; gap:40px; } .hero{ padding-top:140px; } .hero-photo img{ height:clamp(300px,50vh,440px); } }
.hero .kicker{ margin-bottom:34px; }
.hero h1{ margin-bottom:38px; }
.hero .lead{ margin-bottom:46px; }
.hero-actions{ display:flex; gap:18px; flex-wrap:wrap; align-items:center; }
.hero-scroll{ position:absolute; left:24px; bottom:34px; z-index:2; display:flex; flex-direction:column; align-items:center; gap:14px; color:var(--muted-2); font-size:.66rem; letter-spacing:.3em; text-transform:uppercase; }
.hero-scroll .line{ width:1px; height:60px; background:linear-gradient(var(--gold-line), transparent); position:relative; overflow:hidden; }
.hero-scroll .line::after{ content:""; position:absolute; top:-40%; left:0; width:100%; height:40%; background:var(--red); animation:drip 2.4s var(--ease) infinite; }
@keyframes drip{ to{ top:120%; } }

/* big stat strip under hero */
.hero-meta{ display:flex; gap:60px; flex-wrap:wrap; margin-top:60px; padding-top:34px; border-top:1px solid var(--line); }
.hero-meta .m .n{ font-family:var(--serif); font-size:2.2rem; font-weight:300; }
.hero-meta .m .l{ font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin-top:2px; }

/* ---------- logo marquee ---------- */
.rail{ padding:46px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.rail-label{ text-align:center; font-size:.68rem; letter-spacing:.34em; text-transform:uppercase; color:var(--muted-2); margin-bottom:34px; }
.marquee{ overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); }
.marquee-track{ display:flex; align-items:center; gap:80px; width:max-content; animation:scrollx 80s linear infinite; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
.marquee-track img{ height:26px; width:auto; filter:brightness(0) invert(1); opacity:.55; transition:opacity .35s; }
.marquee-track img:hover{ opacity:1; }
@keyframes scrollx{ to{ transform:translateX(-50%); } }

/* ---------- section heading block ---------- */
.sec-head{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:end; margin-bottom:70px; }
.sec-head .lead{ justify-self:end; }
@media (max-width:820px){ .sec-head{ grid-template-columns:1fr; gap:24px; } .sec-head .lead{ justify-self:start; } }

/* ---------- capabilities (photo cards) ---------- */
.cap-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:16px; }
.cap-card{ position:relative; grid-column:span 2; min-height:320px; border-radius:18px; overflow:hidden; display:flex; align-items:flex-end; border:1px solid var(--line); isolation:isolate; }
.cap-card.wide{ grid-column:span 3; min-height:400px; }
.cap-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; filter:brightness(.66) saturate(.92); transition:transform .9s var(--ease), filter .6s; }
.cap-card::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(0,0,0,.05) 25%, rgba(0,0,0,.55) 65%, rgba(0,0,0,.9) 100%); }
.cap-card:hover img{ transform:scale(1.07); filter:brightness(.78) saturate(1); }
.cap-card .cc-body{ padding:30px; width:100%; }
.cap-card .cc-line{ width:0; height:2px; background:var(--red); margin-bottom:16px; transition:width .6s var(--ease); }
.cap-card:hover .cc-line{ width:54px; }
.cap-card h3{ font-size:clamp(1.5rem,2.3vw,2.3rem); font-weight:300; color:#fff; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.cap-card h3 .cc-go{ font-size:1.3rem; color:var(--gold); opacity:0; transform:translateX(-8px); transition:opacity .4s, transform .5s var(--ease); }
.cap-card:hover h3 .cc-go{ opacity:1; transform:none; }
.cap-card p{ color:#cfcec8; font-size:.95rem; font-weight:300; max-width:46ch; margin-top:12px; opacity:0; max-height:0; overflow:hidden; transition:opacity .5s var(--ease), max-height .6s var(--ease), margin .5s; }
.cap-card:hover p{ opacity:1; max-height:90px; margin-top:12px; }
@media (max-width:820px){ .cap-grid{ grid-template-columns:1fr; } .cap-card, .cap-card.wide{ grid-column:1; min-height:260px; } .cap-card p{ opacity:1; max-height:90px; } }

/* ---------- platforms / showcase ---------- */
.platforms{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); }
.platform{ background:var(--black); padding:clamp(34px,5vw,64px); min-height:440px; display:flex; flex-direction:column; justify-content:space-between; position:relative; overflow:hidden; transition:background .6s; }
.platform::before{ content:""; position:absolute; inset:0; background:radial-gradient(120% 80% at 50% 120%, var(--gold-soft), transparent 60%); opacity:0; transition:opacity .6s; z-index:1; }
.platform:hover::before{ opacity:1; }
/* faint brand watermark behind the text */
.platform .p-watermark{ position:absolute; right:-8%; bottom:-6%; width:82%; max-width:560px; z-index:0; pointer-events:none;
  filter:brightness(0) invert(1); opacity:.06; transition:opacity .6s; }
.platform:hover .p-watermark{ opacity:.1; }
.platform .p-top, .platform .p-body{ position:relative; z-index:2; }
.platform .p-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.platform .p-logo{ height:30px; filter:brightness(0) invert(1); }
.platform .p-dealer{ font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); border:1px solid var(--gold-line); border-radius:100px; padding:7px 14px; display:inline-flex; gap:8px; align-items:center; white-space:nowrap; }
.platform .p-dealer::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--gold); }
.platform .p-body h3{ font-size:clamp(2.2rem,4vw,3.4rem); font-weight:300; margin-bottom:16px; }
.platform .p-body p{ color:var(--muted); max-width:42ch; margin-bottom:30px; font-weight:300; }
.platform .p-num{ position:absolute; right:30px; bottom:18px; font-family:var(--serif); font-size:8rem; line-height:1; color:rgba(255,255,255,.03); font-style:italic; pointer-events:none; }
@media (max-width:820px){ .platforms{ grid-template-columns:1fr; } .platform{ min-height:auto; } }

/* ---------- experience / quote ---------- */
.quote-block{ text-align:center; max-width:1000px; margin:0 auto; }
.quote-block blockquote{ font-family:var(--serif); font-weight:300; font-size:clamp(1.8rem,4.2vw,3.6rem); line-height:1.18; letter-spacing:-.01em; }
.quote-block blockquote em{ font-style:italic; color:var(--gold); }
.quote-block cite{ display:block; margin-top:34px; font-style:normal; font-size:.74rem; letter-spacing:.24em; text-transform:uppercase; color:var(--muted); }

/* ---------- process ---------- */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); }
.step{ padding:44px 30px 44px 0; border-top:1px solid var(--line); }
.step .s-n{ font-family:var(--serif); font-size:1rem; color:var(--gold); margin-bottom:60px; }
.step h4{ font-family:var(--serif); font-size:1.5rem; font-weight:300; margin-bottom:12px; }
.step p{ color:var(--muted); font-size:.92rem; font-weight:300; }
@media (max-width:820px){ .steps{ grid-template-columns:1fr 1fr; } .step{ padding:30px 20px 30px 0; } .step .s-n{ margin-bottom:30px; } }
@media (max-width:520px){ .steps{ grid-template-columns:1fr; } }

/* ---------- CTA ---------- */
.cta{ text-align:center; padding:clamp(70px,10vw,140px) 0; }
/* faded photo backdrop behind the CTA — text stays readable */
.cta-bg{ position:relative; overflow:hidden; }
.cta-bg::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(0,0,0,.74), rgba(0,0,0,.8)), url("../assets/img/hero-living.jpg");
  background-size:cover; background-position:center; }
.cta-bg::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(80% 70% at 50% 50%, transparent 40%, rgba(0,0,0,.55)); }
.cta-bg .container{ position:relative; z-index:2; }
.cta h2{ font-size:clamp(2.6rem,7vw,6rem); font-weight:300; margin-bottom:30px; }
.cta .lead{ margin:0 auto 44px; }
.cta-actions{ display:flex; gap:18px; justify-content:center; flex-wrap:wrap; }

/* ---------- contact ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:70px; align-items:start; }
.contact-info{ display:flex; flex-direction:column; }
.info-row{ display:flex; gap:22px; align-items:center; padding:26px 0; border-top:1px solid var(--line); transition:padding .4s var(--ease); }
.info-row:last-child{ border-bottom:1px solid var(--line); }
.info-row:hover{ padding-left:12px; }
.info-row .ir-n{ font-family:var(--serif); font-size:.9rem; color:var(--gold); width:30px; }
.info-row .ir-l{ font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); }
.info-row .ir-v{ font-size:1.15rem; font-weight:300; }
form.contact-form{ display:grid; gap:24px; }
.field{ display:flex; flex-direction:column; gap:10px; }
.field.row2{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
label{ font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); }
input,textarea,select{ font-family:inherit; font-size:1rem; color:var(--text); background:transparent; border:0; border-bottom:1px solid var(--line-strong); padding:12px 2px; transition:border-color .3s; font-weight:300; }
input::placeholder,textarea::placeholder{ color:var(--muted-2); }
input:focus,textarea:focus,select:focus{ outline:none; border-bottom-color:var(--gold); }
select{ appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%238d8c86' stroke-width='1.5'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 4px center; }
select option{ background:#0a0a0b; }
textarea{ resize:vertical; min-height:90px; }
.form-note{ font-size:.78rem; color:var(--muted-2); font-weight:300; }
@media (max-width:820px){ .contact-grid{ grid-template-columns:1fr; gap:44px; } .field.row2{ grid-template-columns:1fr; } }

/* ---------- footer ---------- */
.site-footer{ border-top:1px solid var(--line); padding:80px 0 40px; }
.footer-top{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; margin-bottom:70px; }
.footer-top img{ height:96px; margin-bottom:24px; display:inline-block; }
.footer-top p{ color:var(--muted); font-weight:300; max-width:34ch; }
.fcol h5{ font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:20px; }
.fcol a{ display:block; color:var(--muted); font-size:.92rem; font-weight:300; padding:7px 0; transition:color .3s; }
.fcol a:hover{ color:var(--text); }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; padding-top:30px; border-top:1px solid var(--line); color:var(--muted-2); font-size:.78rem; letter-spacing:.06em; }
@media (max-width:820px){ .footer-top{ grid-template-columns:1fr 1fr; gap:32px; } }
@media (max-width:520px){ .footer-top{ grid-template-columns:1fr; } }

/* ---------- floating call button (mobile) ---------- */
.fab-call{ position:fixed; bottom:22px; right:22px; z-index:150; width:58px; height:58px; border-radius:50%; border:1px solid var(--red-line); background:rgba(224,64,46,.16); backdrop-filter:blur(10px); color:#fff; display:none; align-items:center; justify-content:center; box-shadow:0 12px 30px -10px var(--red-line); }
.fab-call svg{ width:22px; height:22px; }
@media (max-width:960px){ .fab-call{ display:inline-flex; } }

/* ---------- reveal ---------- */
.reveal{ opacity:0; transform:translateY(34px); transition:opacity 1s var(--ease), transform 1s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.1s; } .reveal.d2{ transition-delay:.2s; } .reveal.d3{ transition-delay:.3s; } .reveal.d4{ transition-delay:.4s; }

/* word-by-word headline reveal */
.split .w{ display:inline-block; overflow:hidden; vertical-align:top; }
.split .w i{ display:inline-block; font-style:inherit; transform:translateY(110%); transition:transform .9s var(--ease); }
.split.in .w i{ transform:translateY(0); }
.split.in .w:nth-child(2) i{ transition-delay:.06s; } .split.in .w:nth-child(3) i{ transition-delay:.12s; } .split.in .w:nth-child(4) i{ transition-delay:.18s; } .split.in .w:nth-child(5) i{ transition-delay:.24s; } .split.in .w:nth-child(6) i{ transition-delay:.3s; } .split.in .w:nth-child(7) i{ transition-delay:.36s; } .split.in .w:nth-child(8) i{ transition-delay:.42s; }

/* page hero for subpages */
.page-hero{ padding-top:200px; padding-bottom:40px; }
.page-hero .crumb{ font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); margin-bottom:30px; }
.page-hero .crumb a:hover{ color:var(--text); }
.page-hero h1{ font-size:clamp(2.8rem,8vw,6.5rem); font-weight:300; margin-bottom:26px; }

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition-duration:.01ms !important; }
  .reveal{ opacity:1; transform:none; }
  .split .w i{ transform:none; }
  @media (hover:hover){ *{ cursor:auto; } .cursor{ display:none; } }
}

/* ---------- Residential / Commercial pages ---------- */
.feature{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,60px); align-items:center; margin-bottom:clamp(54px,8vw,100px); }
.feature-img{ border-radius:18px; overflow:hidden; border:1px solid var(--line); aspect-ratio:4/3; }
.feature-img img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.feature-img:hover img{ transform:scale(1.05); }
.feature.rev .feature-img{ order:2; }
.feature-txt .kicker{ margin-bottom:18px; }
.feature-txt h3{ font-size:clamp(1.7rem,3.2vw,2.6rem); font-weight:300; margin-bottom:18px; }
.feature-txt p{ color:var(--muted); font-weight:300; margin-bottom:18px; }
.feature-txt ul{ list-style:none; display:flex; flex-direction:column; gap:10px; }
.feature-txt li{ color:var(--muted); font-weight:300; display:flex; gap:12px; align-items:flex-start; }
.feature-txt li::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--gold); margin-top:9px; flex:none; }
@media (max-width:820px){ .feature{ grid-template-columns:1fr; } .feature.rev .feature-img{ order:0; } }

.app-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.app-card{ border:1px solid var(--line); border-radius:16px; overflow:hidden; background:linear-gradient(165deg,var(--panel),var(--ink-2)); transition:transform .4s var(--ease), border-color .4s; }
.app-card:hover{ transform:translateY(-6px); border-color:var(--gold-line); }
.app-card .ac-img{ aspect-ratio:16/10; overflow:hidden; }
.app-card .ac-img img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.app-card:hover .ac-img img{ transform:scale(1.06); }
.app-card .ac-b{ padding:24px; }
.app-card h4{ font-size:1.2rem; font-weight:500; margin-bottom:10px; }
.app-card p{ color:var(--muted); font-size:.93rem; font-weight:300; }
@media (max-width:880px){ .app-cards{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .app-cards{ grid-template-columns:1fr; } }

/* ---------- mobile fixes ---------- */
.contact-info, .contact-form{ min-width:0; }
.info-row .ir-v, .info-row .ir-l{ overflow-wrap:anywhere; word-break:break-word; }
.fcol a{ overflow-wrap:anywhere; }
@media (max-width:560px){
  .platform .p-top{ flex-wrap:wrap; gap:12px; }
}

/* ---------- Gallery ---------- */
.gallery-grid{ columns:3 300px; column-gap:16px; }
.g-item{ position:relative; display:block; break-inside:avoid; margin:0 0 16px; border-radius:14px; overflow:hidden; border:1px solid var(--line); cursor:pointer; }
.g-item img{ width:100%; display:block; transition:transform .9s var(--ease), filter .5s; filter:brightness(.92); }
.g-item:hover img{ transform:scale(1.06); filter:brightness(1); }
.g-item::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(0,0,0,.72), transparent 50%); opacity:0; transition:opacity .4s; }
.g-item:hover::after{ opacity:1; }
.g-cap{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:16px 18px; font-size:.82rem; font-weight:500; letter-spacing:.04em; color:#fff; opacity:0; transform:translateY(8px); transition:opacity .4s, transform .4s; }
.g-cap span{ display:block; font-size:.64rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin-top:4px; }
.g-item:hover .g-cap{ opacity:1; transform:none; }
@media (max-width:640px){ .gallery-grid{ columns:2 150px; column-gap:12px; } .g-item{ margin-bottom:12px; } }
@media (max-width:430px){ .gallery-grid{ columns:1; } }

.lightbox{ position:fixed; inset:0; z-index:500; background:rgba(0,0,0,.93); backdrop-filter:blur(10px); display:none; align-items:center; justify-content:center; padding:clamp(16px,4vw,40px); }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:92vw; max-height:84vh; border-radius:10px; box-shadow:0 40px 100px -20px rgba(0,0,0,.9); }
.lightbox .lb-close{ position:absolute; top:16px; right:20px; color:#fff; background:none; border:0; font-size:2.4rem; line-height:1; opacity:.8; }
.lightbox .lb-close:hover{ opacity:1; }
.lightbox .lb-cap{ position:absolute; bottom:20px; left:0; right:0; text-align:center; color:var(--muted); font-size:.84rem; letter-spacing:.06em; }
.lightbox .lb-nav{ position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.08); border:1px solid var(--line-strong); color:#fff; width:48px; height:48px; border-radius:50%; font-size:1.5rem; line-height:1; transition:background .25s; }
.lightbox .lb-nav:hover{ background:rgba(255,255,255,.18); }
.lightbox .lb-prev{ left:14px; } .lightbox .lb-next{ right:14px; }
@media (max-width:560px){ .lightbox .lb-nav{ width:40px; height:40px; } }