/* ===== Homepage 6-Section Trim — page-specific (shared base comes from the loader) ===== */

/* media placeholder */
.ff-media{position:relative;overflow:hidden;background:#E7E5DC;isolation:isolate;}
.ff-media image-slot{width:100%;height:100%;display:block;background:#E7E5DC;}
.ff-media .scrim{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.30),rgba(0,0,0,0) 32%,rgba(0,0,0,0) 60%,rgba(0,0,0,.46));}
.ff-media.on-dark{background:#15140f;}
.ff-media.on-dark image-slot{background:#15140f;}
.ff-media.on-dark .scrim{background:linear-gradient(180deg,rgba(11,11,11,.72),rgba(11,11,11,.34) 40%,rgba(11,11,11,.30) 60%,rgba(11,11,11,.70));}
.ff-media.nat image-slot img{filter:contrast(1.04) saturate(.98);}
.slot-tag,.needs{display:none !important;}
image-slot::part(empty){opacity:0;}

/* HERO */
.ff-hero{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;background:var(--void);color:#fff;overflow:hidden;margin-top:-68px;}
.ff-hero .ff-media{position:absolute;inset:0;z-index:0;}
.ff-hero .ff-media .scrim{background:linear-gradient(180deg,rgba(8,8,8,.55),rgba(8,8,8,.15) 34%,rgba(8,8,8,.25) 60%,rgba(8,8,8,.82));}
.ff-hero-in{position:relative;z-index:5;max-width:var(--maxw);margin:0 auto;width:100%;padding:0 var(--mx) clamp(40px,5vw,68px);}
.ff-hero-top{position:absolute;top:calc(68px + clamp(14px,2vw,22px));left:50%;transform:translateX(-50%);width:100%;max-width:var(--maxw);padding-inline:var(--mx);box-sizing:border-box;display:flex;flex-direction:column;gap:5px;z-index:5;}
.ff-hero-top .mono{font-size:10.5px;color:rgba(255,255,255,.82);}
.ff-hero-eye{font-family:var(--mono);font-size:clamp(11px,1.1vw,13px);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#fff;display:flex;align-items:center;gap:9px;margin:0 0 clamp(20px,2.4vw,34px);}
.ff-hero-eye i{width:8px;height:8px;background:var(--acid);border-radius:1px;box-shadow:0 0 10px var(--acid);}
.ff-hero h1{font-family:var(--disp);font-weight:700;text-transform:uppercase;line-height:.84;letter-spacing:-.035em;font-size:clamp(56px,13.6vw,196px);margin:0 0 0 -.045em;color:#fff;white-space:nowrap;}
.ff-hero h1 .dot{color:var(--acid);}
.ff-hero-sub{max-width:36ch;margin:24px 0 0;font-size:clamp(16px,1.8vw,23px);line-height:1.42;color:rgba(255,255,255,.78);}
.ff-hero-sub b{color:#fff;font-weight:600;}
.ff-hero-edge{position:absolute;z-index:5;top:50%;right:clamp(14px,1.6vw,26px);transform:translateY(-50%);writing-mode:vertical-rl;white-space:nowrap;font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.58);}
.ff-hero-cta{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;margin-top:28px;}
.ff-hero .qc{background:rgba(251,250,246,.06);color:#fff;border-color:rgba(255,255,255,.5);}
.ff-hero .qc.accent{background:var(--cobalt);color:#fff;border-color:var(--cobalt);}
.ff-hero .qc-lite{color:#fff;}
.ff-hero .qc-lite::before{background:var(--cobalt);}
.ff-furn{display:flex;flex-wrap:wrap;gap:8px 26px;margin-top:30px;padding-top:18px;border-top:1px solid rgba(255,255,255,.22);align-items:baseline;}
.ff-furn span{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.72);white-space:nowrap;line-height:1.7;}
.ff-furn span:last-child{white-space:normal;}
.ff-furn span.furn-q{font-size:10px;color:rgba(255,255,255,.44);}
.ff-furn span.furn-q b{color:rgba(255,255,255,.66);}
.ff-furn span b{color:#fff;font-weight:700;}

/* DEVELOP ROUTE (§2) */
.ff-develop{background:var(--cobalt);color:#fff;}
.ff-develop .ff-h2{color:#fff;}
.ff-develop .ff-mast{color:rgba(255,255,255,.7);}
.ff-develop .ff-mast .idx{color:#fff;}
.ff-develop .ff-mast .ln{background:rgba(255,255,255,.3);}
.ff-dev-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(28px,4vw,64px);align-items:center;}
.ff-dev-lead p{max-width:44ch;font-size:16px;line-height:1.55;color:rgba(255,255,255,.9);margin:16px 0 0;}
.ff-dev-lead.tr-lead p{max-width:44ch;}
.ff-dev-cta{display:flex;flex-wrap:wrap;gap:14px 20px;margin-top:30px;align-items:center;}
.ff-develop .qc{background:#fff;color:var(--cobalt);border-color:#fff;}
.ff-develop .qc-lite{color:#fff;}.ff-develop .qc-lite::before{background:#fff;}
.ff-routes{display:grid;gap:2px;background:rgba(255,255,255,.35);border:1.5px solid rgba(255,255,255,.35);}
.ff-route{display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--cobalt);padding:20px 22px;}
.ff-route .rt-t{display:block;font-family:var(--grot);font-weight:900;letter-spacing:-.02em;font-size:22px;text-transform:uppercase;}
.ff-route .rt-d{display:block;font-family:var(--sans);font-size:12.5px;line-height:1.5;color:rgba(255,255,255,.82);margin-top:6px;max-width:46ch;}
.ff-route .rt-cta{display:inline-block;margin-top:10px;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.05em;color:#fff;border-bottom:1.5px solid rgba(255,255,255,.55);padding-bottom:2px;}
.ff-route:hover{background:#0a4fd8;}

/* WHY GRAINATION (§3) helpers */
.tr-why{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;margin-top:clamp(28px,4vw,48px);}
.tr-why .tr-img{position:relative;aspect-ratio:4/3;border:1px solid var(--line);overflow:hidden;background:#e9e7df;}
.tr-why .tr-img .mk{position:absolute;left:12px;bottom:10px;font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:#8a887e;z-index:2;}
.tr-plist{list-style:none;margin:0;padding:0;}
.tr-plist li{display:grid;grid-template-columns:34px 1fr;gap:14px;padding:16px 0;border-top:1px solid var(--line);}
.tr-plist li:last-child{border-bottom:1px solid var(--line);}
.tr-plist .n{font-family:var(--mono);font-size:12px;color:var(--cobalt);letter-spacing:.06em;}
.tr-plist .h{font-family:var(--grot);font-weight:800;font-size:clamp(15px,1.7vw,19px);letter-spacing:-.01em;text-transform:uppercase;margin:0 0 4px;}
.tr-plist .d{font-family:var(--sans);font-size:14px;line-height:1.5;color:#4a4a46;margin:0;}
.tr-flow{display:flex;flex-wrap:wrap;gap:10px 8px;align-items:center;margin-top:clamp(24px,3.5vw,40px);font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);}
.tr-flow .step{border:1px solid var(--line);padding:8px 13px;}
.tr-flow .ar{color:var(--cobalt);font-weight:700;}
.tr-why-link{margin-top:20px;}
@media(max-width:820px){.tr-why{grid-template-columns:1fr;}}

/* TURNAROUND + EVIDENCE (§4) */
.ff-turn-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,5vw,70px);align-items:center;}
.ff-turn-lead h2{font-family:var(--disp);font-weight:700;text-transform:uppercase;line-height:.84;letter-spacing:-.03em;font-size:clamp(52px,8vw,120px);margin:0;color:#fff;}
.ff-turn-poem{font-size:clamp(16px,1.6vw,20px);font-weight:600;color:#fff;margin:14px 0 12px;max-width:30ch;line-height:1.4;}
.ff-turn-note{font-size:14.5px;line-height:1.65;color:#c9c7be;margin:22px 0 0;max-width:42ch;}
.ff-turn-note b{color:#fff;font-weight:700;}
.ff-turn-list{border-top:2px solid var(--line-dark);}
.ff-turn-row{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:16px 0;border-bottom:1px solid var(--line-dark);}
.ff-turn-row .p{font-family:var(--mono);font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#fff;}
.ff-turn-row .t{font-family:var(--grot);font-weight:900;font-size:19px;text-transform:uppercase;letter-spacing:-.02em;color:var(--acid);white-space:nowrap;}
.ff-turn-cta{margin-top:26px;}
#turnaround .ff-turn-lead h2{font-family:var(--grot);font-weight:900;letter-spacing:-.035em;line-height:.9;text-transform:uppercase;}
#turnaround .qc-lite{color:#f4f4f0;}
#turnaround .qc-lite:hover{color:#fff;}
#turnaround .qc-lite .arw{color:var(--acid);}

/* ---- §3 LIVE TURNAROUND -------------------------------------------------
   The section's live half. The four-process rows themselves are the shared
   .lt-rows--dark component owned by mu-plugins/gn2-live-turnaround; only the
   homepage-specific framing lives here, so the two surfaces cannot drift.
   Nothing in this block hard-codes a date — see the comment in home-content.html. */
#turnaround .ff-turn-grid{align-items:start;}
/* The two-line statement is the loudest thing in the section; give it room and
   let a long weekday ("WEDNESDAY") shrink rather than overflow the column. */
#turnaround .ff-turn-lead h2{overflow-wrap:break-word;hyphens:none;}
.ff-turn-cut{font-size:clamp(16px,1.7vw,21px);font-weight:700;color:#fff;margin:clamp(18px,2.6vw,28px) 0 0;max-width:30ch;line-height:1.35;}
.ff-turn-live{min-width:0;}
#turnaround .lt-eye{color:#fff;margin-bottom:14px;}
#turnaround .lt-eye-note{color:rgba(255,255,255,.5);}
#turnaround .lt-rows{border-top-width:1px;}
#turnaround .lt-row{padding-top:14px;padding-bottom:14px;}
#turnaround .lt-date{font-size:clamp(18px,2.3vw,34px);}
.ff-turn-foot{display:flex;flex-wrap:wrap;gap:4px 14px;margin:16px 0 0;
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(255,255,255,.45);}
/* Live values are absent until the binding script answers; keep the row heights
   stable so the section does not jump when they arrive. */
#turnaround .lt-row-v{min-height:2.6em;}
/* The fourth proof tile holds a WORD, not a figure. At the numeric tiles' scale it
   breaks mid-word ("Canada-" / "wide"), so give the text tile its own smaller ramp;
   it then sits on one line at every breakpoint, as the reference shows. */
.tr-ev .v.acc{font-size:clamp(19px,2.2vw,34px);hyphens:none;}
.tr-ev{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#2a2a28;border:1px solid #2a2a28;margin-top:clamp(28px,4vw,48px);}
.tr-ev .c{background:var(--void);padding:clamp(18px,2.4vw,28px);}
.tr-ev .v{font-family:var(--grot);font-weight:900;font-size:clamp(28px,3.6vw,46px);letter-spacing:-.03em;color:#fff;line-height:.95;font-variant-numeric:tabular-nums;}
.tr-ev .v.acc{color:var(--acid);}
.tr-ev .k{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-top:10px;line-height:1.35;}
@media(max-width:720px){.tr-ev{grid-template-columns:repeat(2,1fr);}}
.tr-est{margin-top:clamp(24px,3.5vw,40px);border-top:1px solid #2a2a28;padding-top:clamp(22px,3vw,32px);}
.tr-est .big{font-family:var(--grot);font-weight:900;font-size:clamp(46px,8.5vw,120px);line-height:.86;letter-spacing:-.05em;color:var(--acid);font-variant-numeric:tabular-nums;}
.tr-est .el{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-top:12px;}
.tr-est .en{font-family:var(--sans);font-size:12.5px;line-height:1.5;color:rgba(255,255,255,.55);margin:7px 0 0;max-width:56ch;}
.tr-est .en b{color:rgba(255,255,255,.8);font-weight:600;}

/* BEYOND THE LAB ORDER (§5) — directory */
.ff-dir{border-top:2px solid var(--ink);}
.ff-dir-row{display:grid;grid-template-columns:64px 150px 1fr auto;gap:clamp(14px,2.5vw,36px);align-items:center;padding:clamp(16px,2vw,26px) 0;border-bottom:1.5px solid var(--line);position:relative;}
.ff-dir-row .d-idx{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--mut);}
.ff-dir-thumb{aspect-ratio:16/10;}
.ff-dir-name .nm{font-family:var(--grot);font-weight:900;letter-spacing:-.025em;font-size:clamp(26px,3vw,42px);text-transform:uppercase;line-height:.94;display:block;}
.ff-dir-name .de{font-size:13.5px;color:#3a3a3a;margin-top:8px;display:block;max-width:52ch;}
.ff-dir-row .d-go{font-size:22px;color:var(--ink);transition:transform .2s,color .2s;}
.ff-dir-row:hover .nm{color:var(--cobalt);}
.ff-dir-row:hover .d-go{color:var(--cobalt);transform:translate(3px,-3px);}
.tr-nerd{margin-top:clamp(24px,3vw,36px);padding-top:20px;border-top:1px solid var(--line);font-family:var(--sans);font-size:15px;color:#4a4a46;}
.tr-nerd a{color:var(--cobalt);text-decoration:none;font-weight:600;}
.tr-nerd a:hover{text-decoration:underline;}

/* FINAL (§6) */
.ff-final{background:var(--void);color:#fff;text-align:left;}
.ff-final h2{font-family:var(--grot);font-weight:900;text-transform:uppercase;line-height:.86;letter-spacing:-.03em;font-size:clamp(44px,9vw,132px);margin:0;color:#fff;max-width:16ch;}
.ff-final .kick{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--acid);display:flex;align-items:center;gap:9px;margin:0 0 20px;}
.ff-final .kick i{width:8px;height:8px;background:var(--acid);border-radius:1px;box-shadow:0 0 10px var(--acid);}
.ff-final .ff-hero-cta{margin-top:30px;}
.ff-final .qc{background:rgba(255,255,255,.06);color:#fff;border-color:rgba(255,255,255,.5);}
.ff-final .qc.accent{background:var(--cobalt);color:#fff;border-color:var(--cobalt);}
.ff-final .qc-lite{color:#fff;}.ff-final .qc-lite::before{background:var(--acid);}

/* responsive */
@media (max-width:1080px){
  .ff-dev-grid,.ff-turn-grid{grid-template-columns:1fr;}
  .ff-dir-row{grid-template-columns:44px 1fr auto;}
  .ff-dir-thumb{display:none;}
}
@media (max-width:600px){
  .ff-route{flex-direction:column;align-items:flex-start;gap:8px;}
  .ff-hero{min-height:100vh;min-height:100svh;justify-content:flex-end;}
  .ff-hero-in{padding-top:0;padding-bottom:clamp(40px,12vw,72px);}
  .ff-hero h1{font-size:clamp(46px,15.5vw,78px);}
  .ff-hero-edge{display:none;}
  .ff-hero-sub{margin-top:16px;}
  .ff-hero-cta{margin-top:22px;}
  .ff-furn{gap:6px 16px;margin-top:24px;}
  .ff-final h2{font-size:clamp(38px,11vw,66px);}
}

