/* ===== Map of EYOS — cinematic document + colored globe (v3) ===== */
:root{
  --space:#04060c; --ink:#080b13;
  --white:#F4F6FA; --soft:#B4BDCC; --dim:#727C90;
  --blue:#A2D8E8; --blue-2:#7FB9D6; --navy:#0B1F3A; --gold:#D4A853;
  --line:rgba(255,255,255,.12); --line-2:rgba(255,255,255,.07);
  --glass:rgba(9,12,20,.74);
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--space);color:var(--white);font-family:var(--sans);
  line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;
  background:rgba(255,255,255,.08);padding:2px 6px;border-radius:4px}

/* type */
.display{font-weight:300;letter-spacing:-.025em;line-height:1.05;margin:0;font-size:clamp(36px,5.6vw,68px)}
.h-sec{font-weight:400;letter-spacing:-.02em;line-height:1.08;margin:0;font-size:clamp(28px,3.8vw,46px)}
.lead{font-weight:400;line-height:1.5;color:#DCE2EC;margin:22px 0 0;font-size:clamp(17px,1.8vw,22px);max-width:50ch}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin:0}

/* reveal */
.reveal{opacity:1;transform:none}
.anim .reveal{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.anim .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.anim .reveal{opacity:1;transform:none;transition:none}}

/* nav: just the floating logo, no bar ever */
.nav{position:fixed;top:0;left:0;right:0;z-index:30;pointer-events:none}
.nav .brand{pointer-events:auto}
.nav.scrolled .logo{filter:brightness(1.1) drop-shadow(0 2px 14px rgba(0,0,0,.85))}
.nav-in{max-width:none;margin:0;padding:18px 26px;display:flex;align-items:center;justify-content:space-between}
.brand{display:inline-flex;align-items:center;line-height:0}
.logo{height:26px;width:auto;filter:brightness(1.1) drop-shadow(0 1px 10px rgba(0,0,0,.6))}
.nav-link{font-family:inherit;font-size:12.5px;font-weight:600;letter-spacing:.02em;color:#fff;cursor:pointer;
  background:rgba(255,255,255,.08);border:1px solid var(--line);border-radius:999px;padding:8px 15px;
  backdrop-filter:blur(10px);transition:border-color .15s,background .15s}
.nav-link:hover{border-color:rgba(162,216,232,.5);background:rgba(255,255,255,.14)}

/* photo scenes */
.scene{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden}
.scene .bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0;
  transform:scale(1.06);transition:transform 14s cubic-bezier(.16,.7,.2,1)}
.scene.seen .bg{transform:scale(1)}
.scene .scrim{position:absolute;inset:0;z-index:1}
.scrim-hero{background:linear-gradient(180deg,rgba(4,6,12,.5) 0%,rgba(4,6,12,.15) 26%,rgba(4,6,12,.35) 60%,rgba(4,6,12,.92) 100%)}
.scrim-left{background:linear-gradient(100deg,rgba(4,6,12,.9) 0%,rgba(4,6,12,.6) 42%,rgba(4,6,12,.12) 78%),
  linear-gradient(180deg,rgba(4,6,12,.3),rgba(4,6,12,0) 30%,rgba(4,6,12,.6) 100%)}
.scrim-bottom{background:linear-gradient(180deg,rgba(4,6,12,.75) 0%,rgba(4,6,12,.5) 35%,rgba(4,6,12,.85) 100%)}
.scene .inner{position:relative;z-index:2;max-width:1240px;margin:0 auto;padding:120px 44px;width:100%}
.scene .inner.wide{max-width:1240px}

/* hero — title sits lower-left, hard against the edge */
.hero{align-items:flex-end}
.hero .inner{max-width:none;width:100%;padding:0 26px 13vh;align-self:flex-end}
.hero .eyebrow{margin-bottom:20px}
.hero .display{max-width:18ch;text-shadow:0 2px 40px rgba(0,0,0,.6)}
.hero-stats{display:flex;gap:50px;margin-top:46px;flex-wrap:wrap}
.hs{display:flex;flex-direction:column}
.hs-n{font-size:clamp(34px,4vw,52px);font-weight:300;letter-spacing:-.03em;line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.hs-l{margin-top:8px;font-size:13px;color:var(--soft)}
.scrollcue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:3;width:1px;height:44px;
  background:linear-gradient(rgba(255,255,255,0),rgba(255,255,255,.4));overflow:hidden}
.scrollcue::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,0),#fff);animation:drop 2.4s cubic-bezier(.6,0,.3,1) infinite}
@keyframes drop{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}

/* workflow: step cards built from the real artifacts */
.workflow2{background:var(--space);padding:120px 0 100px}
.workflow2 .inner{max-width:1240px;margin:0 auto;padding:0 44px}
.wf-grid{margin-top:48px;display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.wf-s2{grid-column:span 2}.wf-s4{grid-column:span 4}.wf-s6{grid-column:span 6}
/* card 2: text together at the top, no stretch gap between line and chips */
.wf-tight .wf-demo{margin-top:0}
.wf-tight .wf-demo.chips{gap:5px}
.wf-tight .chip2{font-size:11px;padding:4px 8px}
.wf-card{display:flex;flex-direction:column;border:1px solid var(--line-2);border-radius:16px;overflow:hidden;
  background:rgba(255,255,255,.03);transition:border-color .2s,transform .2s}
.wf-card:hover{border-color:rgba(162,216,232,.35);transform:translateY(-2px)}
.wf-shot{height:290px;background-size:cover;background-position:center;border-bottom:1px solid var(--line-2)}
.wf-img.wf-s2 .wf-shot{height:300px}          /* 4 Edit: lengthened */
.wf-img.wf-s2 .wf-shot.wf-shot-sm{height:260px} /* 7 Publish: lengthened */
.wf-shot.wf-shot-tall{height:560px}
/* The eight steps read DOWN, in order. The old rule placed card 4 in row 2 and card 3
   in row 3, so the eye went 1, 2, 4, 3, 5, 6, 7 — Carson, 2026-08-10: "the one through
   eight isn't really organized at all, it jumps from side to side." Two per row, in DOM
   order, no exceptions: a numbered list has one job. */
@media (min-width:821px){
  .wf-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:auto}
  .wf-grid>.wf-card{grid-column:auto !important;grid-row:auto !important}
  .wf-grid>.wf-card:nth-child(8){grid-column:1 / -1 !important}
  .wf-img .wf-shot{height:280px}
  .wf-shot.wf-shot-tall,
  .wf-img.wf-s2 .wf-shot,
  .wf-img.wf-s2 .wf-shot.wf-shot-sm{height:280px}
}
.wf-body{display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:start;padding:20px 22px 18px}
.wf-n{font-size:20px;font-weight:300;color:var(--blue);font-variant-numeric:tabular-nums;line-height:1.3}
.wf-body b{display:block;font-size:16px;font-weight:600;color:#fff}
.wf-body span{display:block;margin-top:5px;font-size:13.5px;line-height:1.5;color:var(--soft)}
.wf-body span span{display:inline;margin:0}
.wf-demo{padding:0 22px 20px;margin-top:auto}
.wf-demo.chips{display:flex;flex-wrap:wrap;gap:7px}
.wf-gates{list-style:none;margin:auto 0 0;padding:0 22px 18px}
.wf-gates li{padding:9px 0;border-top:1px solid var(--line-2);font-size:13px;color:#DCE2EC}
.wf-gates li::before{content:"✓";color:var(--blue);margin-right:10px;font-weight:600}
.wf-approve{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:#7fe0a8;
  border:1px solid rgba(127,224,168,.32);background:rgba(127,224,168,.08);border-radius:999px;padding:8px 15px}
.wf-approve::before{content:"✓"}
.wf-url{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;color:#fff;
  border:1px solid var(--line);background:rgba(255,255,255,.05);border-radius:999px;padding:8px 15px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:500}
.wf-url .dot{width:7px;height:7px;border-radius:50%;background:#7fe0a8;box-shadow:0 0 8px rgba(127,224,168,.8)}
.wf-wide .wf-body{padding:22px}

/* globe section (the map) */
.globe-section{position:relative;height:100vh;min-height:620px;background:var(--space);overflow:hidden}
#globe{position:absolute;inset:0}
/* daytime: gentle lift on the ESRI imagery */
#globe .mapboxgl-canvas{filter:brightness(1.12) saturate(1.05)}
.globe-overlay{position:absolute;top:96px;left:44px;z-index:4;pointer-events:none;max-width:34ch}
.globe-overlay .eyebrow{color:var(--blue)}
.globe-tagline{margin:8px 0 0;font-size:16px;color:#E4EAF2;text-shadow:0 1px 16px rgba(0,0,0,.9)}
.mapboxgl-ctrl-logo,.mapboxgl-ctrl-attrib{opacity:.28}
.loading{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;color:var(--dim);font-size:14px;letter-spacing:.04em;pointer-events:none;transition:opacity .6s}
.loading.gone{opacity:0}
.fleet-pill{position:absolute;bottom:32px;left:44px;z-index:5;font-family:inherit;cursor:pointer;
  font-size:12.5px;font-weight:600;color:#fff;background:var(--glass);border:1px solid var(--line);border-radius:999px;
  padding:9px 16px;backdrop-filter:blur(14px);box-shadow:0 6px 24px rgba(0,0,0,.4)}
.fleet-pill:hover{border-color:rgba(162,216,232,.5)}
.fleet-pill .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--blue);margin-right:8px;vertical-align:middle;box-shadow:0 0 8px var(--blue)}

/* click-to-engage hint (off-center, lower) */
.engage{position:absolute;left:50%;bottom:15%;transform:translateX(-50%);z-index:5;pointer-events:none;transition:opacity .3s}
.engage.hidden{opacity:0}
.engage.pulse span{animation:hintpulse .5s ease}
@keyframes hintpulse{40%{transform:scale(1.07)}}
/* engaged state: a quiet ring says the wheel belongs to the map now */
.globe-section.engaged::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;
  box-shadow:inset 0 0 0 2px rgba(162,216,232,.45),inset 0 0 44px rgba(162,216,232,.12)}
.engage span{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;letter-spacing:.02em;color:#fff;
  background:rgba(9,12,20,.6);border:1px solid var(--line);border-radius:999px;padding:9px 18px;backdrop-filter:blur(12px);
  box-shadow:0 6px 24px rgba(0,0,0,.4);text-shadow:0 1px 8px rgba(0,0,0,.8)}
.engage span::before{content:"";width:9px;height:9px;border-radius:50%;border:1.5px solid var(--blue);box-shadow:0 0 8px rgba(162,216,232,.7)}

/* back to overview */
.globe-btn{position:absolute;top:96px;right:44px;z-index:6;font-family:inherit;cursor:pointer;
  font-size:12.5px;font-weight:600;letter-spacing:.02em;color:#fff;background:var(--glass);
  border:1px solid var(--line);border-radius:999px;padding:9px 16px;backdrop-filter:blur(14px);
  box-shadow:0 6px 24px rgba(0,0,0,.4);transition:border-color .15s,background .15s}
.globe-btn:hover{border-color:rgba(162,216,232,.5);background:rgba(14,20,34,.86)}

/* sub line */
.sub{margin:16px 0 0;font-size:clamp(15px,1.6vw,18px);color:var(--soft);max-width:46ch}

/* ending */
.ending{text-align:center}
.inner.center{text-align:center;display:flex;flex-direction:column;align-items:center}
.logo-lg{height:40px;width:auto;filter:brightness(1.1) drop-shadow(0 2px 16px rgba(0,0,0,.6));margin-bottom:30px}
.ending-line{margin:0 auto;max-width:40ch;font-size:clamp(19px,2.2vw,26px);font-weight:300;line-height:1.4;color:#EDF1F6;letter-spacing:-.01em;text-shadow:0 2px 20px rgba(0,0,0,.7)}
.cta{margin-top:34px;display:inline-block;font-size:13.5px;font-weight:600;letter-spacing:.02em;color:var(--navy);
  background:var(--blue);border-radius:999px;padding:13px 26px;text-decoration:none;transition:background .15s,transform .15s}
.cta:hover{background:#b8e3ef;transform:translateY(-1px)}

/* pins (pop on colored earth) */
.map-pin{cursor:pointer;transform:translate(-50%,-50%);width:14px;height:14px}
.map-pin-dot{position:absolute;inset:0;border-radius:50%;background:var(--blue);border:2px solid #fff;
  box-shadow:0 0 0 2px rgba(0,0,0,.45),0 0 12px 3px rgba(162,216,232,.8),0 1px 5px rgba(0,0,0,.6);
  transition:transform .18s ease,box-shadow .18s ease}
.map-pin::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:1px solid rgba(162,216,232,.4);opacity:0;transition:opacity .2s,transform .2s}
.map-pin:hover .map-pin-dot,.map-pin.active .map-pin-dot{transform:scale(1.25);box-shadow:0 0 0 2px rgba(0,0,0,.5),0 0 20px 5px rgba(162,216,232,.95),0 1px 6px rgba(0,0,0,.7)}
.map-pin:hover::after,.map-pin.active::after{opacity:1;transform:scale(1.1)}
.map-pin-label{position:absolute;left:50%;top:calc(100% + 7px);transform:translateX(-50%);white-space:nowrap;
  font-size:11.5px;font-weight:600;color:#fff;text-shadow:0 1px 8px #000,0 0 10px rgba(0,0,0,.95);opacity:0;pointer-events:none;transition:opacity .18s}
.map-pin-count{position:absolute;top:-6px;right:-9px;min-width:15px;height:15px;padding:0 4px;background:#fff;color:var(--navy);
  border-radius:8px;font-size:10px;font-weight:700;line-height:15px;text-align:center;box-shadow:0 1px 6px rgba(0,0,0,.6)}
.map-pin:hover .map-pin-label,.map-pin.active .map-pin-label{opacity:1}

/* doc panel */
.panel{position:fixed;top:0;right:0;bottom:0;width:420px;max-width:92vw;z-index:40;background:var(--glass);
  backdrop-filter:blur(24px);border-left:1px solid var(--line);box-shadow:-24px 0 60px rgba(0,0,0,.55);
  transform:translateX(104%);transition:transform .42s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column}
.panel.open{transform:none}
.panel-close{position:absolute;top:16px;right:16px;z-index:3;width:32px;height:32px;border:none;border-radius:50%;
  background:rgba(255,255,255,.1);color:#fff;font-size:19px;line-height:30px;cursor:pointer;backdrop-filter:blur(8px)}
.panel-close:hover{background:rgba(255,255,255,.2)}
.panel-scroll{overflow-y:auto;height:100%;padding:0 0 26px;overscroll-behavior:contain;scrollbar-gutter:stable}
.panel-scroll::-webkit-scrollbar{width:9px}
.panel-scroll::-webkit-scrollbar-track{background:rgba(255,255,255,.04)}
.panel-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.28);border-radius:99px;border:2px solid transparent;background-clip:content-box}
.panel-scroll::-webkit-scrollbar-thumb:hover{background:rgba(162,216,232,.55);border:2px solid transparent;background-clip:content-box}
.ph{position:relative;height:190px;background-size:cover;background-position:center;background-color:var(--navy)}
.ph.grad{background:linear-gradient(150deg,#0b2036,#123a5c 55%,#1f5f7e)}
.ph-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,6,12,.15) 0%,rgba(4,6,12,0) 30%,rgba(9,12,20,.5) 62%,var(--glass) 100%)}
.ph-txt{position:absolute;left:26px;right:26px;bottom:18px;z-index:2}
.ph-name{font-size:25px;font-weight:600;letter-spacing:-.02em;text-shadow:0 2px 18px rgba(0,0,0,.7)}
.ph-count{font-size:12.5px;color:var(--soft);margin-top:3px;text-shadow:0 1px 10px rgba(0,0,0,.8)}
.ph-expert{font-size:12.5px;color:#cfe3ec;margin-top:4px;text-shadow:0 1px 10px rgba(0,0,0,.85)}

/* panel sections (Stein layout: yachts / expert / activities / documents / generate) */
.panel-sec{padding:16px 22px;border-bottom:1px solid var(--line-2)}
.panel-sec:last-child{border-bottom:none}
.sec-label{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--dim);margin-bottom:11px}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip2{font-size:12px;font-weight:500;color:var(--soft);background:rgba(255,255,255,.05);border:1px solid var(--line-2);
  border-radius:7px;padding:5px 10px;line-height:1.2}
.chip2.ice{color:#cfe9f4;border-color:rgba(162,216,232,.3)}
.chip2.ice::before{content:"❄ ";color:var(--blue);font-size:10px}
.chip2.type{color:#fff;background:rgba(162,216,232,.1);border-color:rgba(162,216,232,.28);cursor:pointer;transition:background .15s}
.chip2.type:hover{background:rgba(162,216,232,.2)}
.sec-empty{font-size:13px;color:var(--dim)}
.panel-sec .docs{padding:0}
.panel-sec .gen{margin:0;width:100%}
.gen{margin:16px 22px 6px;display:flex;align-items:center;gap:10px;width:calc(100% - 44px);padding:13px 16px;border-radius:11px;
  border:1px dashed rgba(162,216,232,.4);background:rgba(162,216,232,.06);color:var(--blue);font-family:inherit;font-size:13.5px;font-weight:600;cursor:pointer;text-align:left}
.gen:hover{background:rgba(162,216,232,.12);border-color:rgba(162,216,232,.7)}
.gen .plus{font-size:18px;line-height:1}
.gen .soon{margin-left:auto;font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);border:1px solid var(--line);border-radius:5px;padding:2px 6px}
/* the generate form (engine flow) */
.chip2.type.sel{background:var(--blue);color:var(--navy);border-color:var(--blue);font-weight:600}
.gen-form{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.gen-form.hidden{display:none}
.gf-hint{font-size:12px;line-height:1.5;color:var(--soft)}
.gf-prompt{width:100%;box-sizing:border-box;resize:vertical;min-height:84px;padding:10px 12px;border-radius:10px;
  border:1px solid var(--line-2);background:rgba(255,255,255,.04);color:#fff;font:inherit;font-size:13px;line-height:1.5}
.gf-prompt:focus{outline:none;border-color:rgba(162,216,232,.6)}
.gf-drop{padding:16px 12px;border:1px dashed var(--line);border-radius:10px;text-align:center;
  font-size:12.5px;color:var(--soft);transition:border-color .15s,background .15s}
.gf-drop.over{border-color:var(--blue);background:rgba(162,216,232,.08)}
.gf-browse{color:var(--blue);cursor:pointer;text-decoration:underline}
.gf-files{display:flex;flex-wrap:wrap;gap:6px}
.gf-file{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;color:#DCE2EC;
  border:1px solid var(--line-2);border-radius:7px;padding:4px 8px;background:rgba(255,255,255,.04)}
.gf-file b{cursor:pointer;color:var(--dim);font-weight:600}
.gf-file b:hover{color:#fff}
.gf-row{display:flex;align-items:center;gap:12px}
.gf-status{font-size:12px;line-height:1.5;color:var(--soft)}
.gf-status code{font-size:11px;color:#DCE2EC}
.gf-open{color:var(--blue);font-weight:600}
.gf-gate{font-weight:600}
.gf-gate.pass{color:#7fe0a8}
.gf-gate.warn{color:#e8c87a}
.gf-gate.block{color:#e88a7a}
.gf-findings{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.gf-findings li{font-size:11.5px;line-height:1.45;color:var(--soft);border-left:2px solid rgba(232,200,122,.5);padding-left:9px}
.gf-findings li.block{border-left-color:rgba(232,138,122,.7)}
.gf-findings li b{color:#DCE2EC;font-weight:600}
.docs{padding:14px 18px 4px}
.doc{border:1px solid var(--line-2);border-radius:13px;overflow:hidden;margin-bottom:14px;background:rgba(255,255,255,.03);transition:border-color .15s,transform .15s}
.doc:hover{border-color:rgba(162,216,232,.4);transform:translateY(-2px)}
.doc-thumb{height:132px;background-size:cover;background-position:center;background-color:#0e1728;border-bottom:1px solid var(--line-2)}
.doc-thumb.none{background:linear-gradient(150deg,#0d1c30,#123a5c)}
.doc-body{padding:14px 15px 15px}
.doc-top{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:8px}
.badge{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:3px 8px;border-radius:5px;background:rgba(162,216,232,.16);color:var(--blue)}
.chip{font-size:10px;font-weight:600;letter-spacing:.04em;padding:3px 7px;border-radius:5px;border:1px solid var(--line);color:var(--soft);text-transform:uppercase}
.chip.live{color:#7fe0a8;border-color:rgba(127,224,168,.32);background:rgba(127,224,168,.08)}
.doc h4{margin:0 0 5px;font-size:15.5px;font-weight:600;letter-spacing:-.01em;color:#fff;line-height:1.3}
.doc-meta{font-size:12.5px;color:var(--soft);line-height:1.5}
.doc-actions{display:flex;gap:8px;margin-top:13px;flex-wrap:wrap}
.btn{font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer;padding:7px 14px;border-radius:8px;border:1px solid var(--line);
  background:rgba(255,255,255,.04);color:#fff;text-decoration:none;display:inline-flex;align-items:center;gap:5px;transition:background .15s,border-color .15s}
.btn:hover{border-color:rgba(162,216,232,.6);background:rgba(255,255,255,.09)}
.btn.primary{background:var(--blue);color:var(--navy);border-color:var(--blue)}
.btn.primary:hover{background:#b8e3ef}
.btn.ghost{color:var(--dim);border-style:dashed;cursor:not-allowed}
.btn.regen.open{border-color:rgba(162,216,232,.6);background:rgba(162,216,232,.12)}
/* the regenerate form sits inside its own doc card, under that card's actions */
.doc .gen-form{margin-top:14px;padding-top:14px;border-top:1px solid var(--line-2)}

/* every-document directory: place label left, doc rows right */
.dir{background:var(--ink);border-top:1px solid var(--line-2);padding:104px 0 90px}
.dir .inner{max-width:1240px;margin:0 auto;padding:0 44px}
.dir-groups{margin-top:40px}
.dgroup{display:grid;grid-template-columns:230px 1fr;gap:20px 40px;padding:26px 0;border-top:1px solid var(--line-2);align-items:start}
.dg-name{font-size:19px;font-weight:600;letter-spacing:-.015em;color:#fff;position:sticky;top:24px;display:flex;align-items:baseline;gap:10px}
.dg-name .n{font-size:12px;font-weight:600;color:var(--dim);font-variant-numeric:tabular-nums}
.dg-docs{display:flex;flex-direction:column}
.drow{display:grid;grid-template-columns:96px 1fr auto;gap:18px;align-items:center;padding:11px 10px;margin:0 -10px;
  border-radius:12px;text-decoration:none;transition:background .15s}
.drow:hover{background:rgba(255,255,255,.05)}
.drow + .drow{border-top:1px solid var(--line-2)}
.drow-thumb{width:96px;height:60px;border-radius:8px;background-size:cover;background-position:center;background-color:#0e1728;border:1px solid var(--line-2)}
.drow-thumb.none{background:linear-gradient(150deg,#0d1c30,#123a5c)}
.drow-main b{display:block;font-size:14.5px;font-weight:600;color:#fff;line-height:1.35}
.drow-meta{display:block;margin-top:4px;font-size:12px;color:var(--soft);line-height:1.4}
.drow-open{font-size:12.5px;font-weight:600;color:var(--blue);opacity:0;transition:opacity .15s}
.drow:hover .drow-open{opacity:1}

/* footer */
.foot{padding:56px 0 74px;border-top:1px solid var(--line-2);background:var(--ink)}
.foot .inner{max-width:1240px;margin:0 auto;padding:0 44px}
.foot p{margin:0;font-size:13.5px;line-height:1.7;color:var(--soft);max-width:82ch}

@media (max-width:820px){
  .scene .inner{padding:110px 24px}
  .nav-in{padding:18px 24px}
  .workflow2 .inner{padding:0 24px}
  .wf-grid{grid-template-columns:1fr}
  .wf-s2,.wf-s4,.wf-s6{grid-column:span 1}
  .wf-shot,.wf-img.wf-s2 .wf-shot,.wf-shot.wf-shot-tall{height:200px}
  /* portrait publish artifact: title band sits low in the frame; !important beats the inline position */
  .wf-grid>.wf-card:nth-child(7) .wf-shot{background-position:center bottom !important}
  .globe-overlay{left:24px;top:84px}
  .panel{width:100vw}
  .dir .inner{padding:0 24px}
  .dgroup{grid-template-columns:1fr;gap:12px}
  .dg-name{position:static}
  .drow{grid-template-columns:72px 1fr;gap:14px}
  .drow-thumb{width:72px;height:46px}
  .drow-open{display:none}
}

/* ===== PDF documents, bios, and clickable group headers (2026-08-03) ===== */

/* a place whose every document is a PDF: amber pin, not the live blue */
.map-pin.pdf-only .map-pin-dot{background:var(--gold,#d4a853)}
.map-pin.pdf-only:hover .map-pin-dot,.map-pin.pdf-only.active .map-pin-dot{
  box-shadow:0 0 0 2px rgba(0,0,0,.5),0 0 20px 5px rgba(212,168,83,.9),0 1px 6px rgba(0,0,0,.7)}
.map-pin-label .pin-pdf{font-style:normal;font-size:9px;font-weight:700;letter-spacing:.08em;
  margin-left:7px;padding:1px 5px;border-radius:4px;color:#f0d9a8;background:rgba(212,168,83,.22);
  border:1px solid rgba(212,168,83,.45)}

.chip.pdf{color:#f0d9a8;border-color:rgba(212,168,83,.4);background:rgba(212,168,83,.1)}

/* no link preview to show, so the thumbnail says what it is */
.doc-thumb.none.pdf,.drow-thumb.none.pdf{
  background:linear-gradient(150deg,#2a2213,#4a3a1c);
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;letter-spacing:.1em;color:rgba(240,217,168,.75)}
.drow-thumb.none.pdf{font-size:10px}
.doc.is-pdf{border-color:rgba(212,168,83,.24)}
.drow.is-pdf .drow-open{color:#f0d9a8}

/* group headers are buttons now: they open that group in the panel */
.dg-name{background:none;border:0;padding:0;font-family:inherit;cursor:pointer;text-align:left;width:100%;flex-wrap:wrap}
.dg-name .n{order:2}
.dg-name .dg-go{order:3;margin-left:auto;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--dim);border:1px solid var(--line);border-radius:999px;padding:4px 11px;transition:.18s}
.dg-name:hover .dg-go{color:#fff;border-color:rgba(162,216,232,.5)}
.dg-name:hover{color:var(--blue)}

/* second pill sits above the first */
.fleet-pill.bios{bottom:78px}
.fleet-pill.bios .dot{background:var(--gold,#d4a853);box-shadow:0 0 8px rgba(212,168,83,.8)}

/* ===== review layer: what landed on the map today ===== */
.chip.new{color:#8fe3ff;border-color:rgba(143,227,255,.45);background:rgba(143,227,255,.12)}
.doc.is-new{border-color:rgba(143,227,255,.38);box-shadow:0 0 0 1px rgba(143,227,255,.16)}
.doc-why{font-size:11.5px;line-height:1.45;color:#8fe3ff;opacity:.85;margin-top:6px}

.drow-new{display:inline-block;margin-left:9px;font-size:9.5px;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:#8fe3ff;background:rgba(143,227,255,.13);border:1px solid rgba(143,227,255,.4);
  border-radius:4px;padding:1px 6px;vertical-align:middle}
.drow.is-new{background:rgba(143,227,255,.045)}

/* a pin holding something new keeps a soft ring until it has been looked at */
.map-pin.has-new .map-pin-dot{box-shadow:0 0 0 3px rgba(143,227,255,.4),0 0 16px 4px rgba(143,227,255,.5),0 1px 6px rgba(0,0,0,.7)}
.map-pin.has-new::after{content:"";position:absolute;inset:-9px;border-radius:50%;
  border:1.5px solid rgba(143,227,255,.55);animation:newring 2.4s ease-out infinite;pointer-events:none}
@keyframes newring{0%{transform:scale(.75);opacity:.9}70%{transform:scale(1.5);opacity:0}100%{opacity:0}}

.fleet-pill.review{bottom:124px}
.fleet-pill.review .dot{background:#8fe3ff;box-shadow:0 0 8px rgba(143,227,255,.9)}
.ph.grad.new{background:linear-gradient(150deg,#08243a,#0d4a63)}

@media (prefers-reduced-motion:reduce){.map-pin.has-new::after{animation:none;opacity:.5}}


/* ===== left rail: every document type, one click ===== */
.type-rail{position:absolute;left:44px;top:186px;z-index:6;
  display:flex;flex-direction:column;gap:6px;max-height:calc(100% - 250px);overflow-y:auto;padding-right:6px;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}
.type-rail::-webkit-scrollbar{width:6px}
.type-rail::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:3px}

.rail-pill{display:flex;align-items:center;gap:9px;width:236px;font-family:inherit;cursor:pointer;
  font-size:12.5px;font-weight:600;color:#fff;text-align:left;
  background:var(--glass);border:1px solid var(--line);border-radius:999px;padding:8px 14px;
  backdrop-filter:blur(14px);box-shadow:0 6px 24px rgba(0,0,0,.4);transition:border-color .16s,background .16s}
.rail-pill:hover{border-color:rgba(162,216,232,.5);background:rgba(255,255,255,.09)}
.rail-pill.sel{border-color:var(--blue);background:rgba(162,216,232,.14)}
.rail-pill .dot{width:7px;height:7px;border-radius:50%;background:var(--blue);flex:0 0 auto;box-shadow:0 0 8px var(--blue)}
.rail-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rail-n{font-size:11px;font-weight:700;color:var(--dim);font-variant-numeric:tabular-nums}
.rail-pill:hover .rail-n,.rail-pill.sel .rail-n{color:#fff}

.rail-pill.review .dot{background:#8fe3ff;box-shadow:0 0 8px rgba(143,227,255,.9)}
.rail-pill.pdf .dot{background:var(--gold);box-shadow:0 0 8px rgba(212,168,83,.85)}
.rail-pill.all .dot{background:#fff;box-shadow:0 0 8px rgba(255,255,255,.7)}
.rail-pill.co .dot{background:#9aa7b8;box-shadow:none}
.rail-pill.review{order:-2}
.rail-pill.all{order:-1}

@media (max-width:900px){
  .type-rail{position:static;transform:none;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;
    max-height:none;padding:12px 16px;gap:8px}
  .rail-pill{width:auto;flex:0 0 auto}
}

/* ===== generate: type, then yacht, then the brief ===== */
.rail-pill.gen-pill{background:rgba(162,216,232,.16);border-color:rgba(162,216,232,.55);order:-3}
.rail-pill.gen-pill:hover{background:rgba(162,216,232,.24)}
.rail-pill.gen-pill .dot{background:#fff;box-shadow:0 0 10px rgba(255,255,255,.85)}
.ph.grad.gen-hero{background:linear-gradient(150deg,#0a2233,#10465e)}

.gen-step{display:flex;align-items:center;gap:8px;margin:16px 0 8px;
  font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.gen-step-n{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;
  border-radius:50%;background:rgba(162,216,232,.16);border:1px solid rgba(162,216,232,.4);
  color:var(--blue);font-size:9.5px;letter-spacing:0}

.chips.gen-yachts .chip2.yacht{cursor:pointer}
.chip2.yacht.here{border-color:rgba(162,216,232,.42);color:#dff2f8}
.chip2.yacht.sel{background:rgba(162,216,232,.2);border-color:var(--blue);color:#fff}
.chip2.yacht.new-y{border-style:dashed;color:var(--blue)}

.new-yacht[hidden]{display:none}
.new-yacht{margin-top:12px;padding:14px;border:1px solid rgba(162,216,232,.28);border-radius:12px;
  background:rgba(162,216,232,.05);display:flex;flex-direction:column;gap:9px}
.new-yacht input,.new-yacht textarea{width:100%;font-family:inherit;font-size:13px;color:#fff;
  background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:9px;padding:9px 11px;resize:vertical}
.new-yacht input:focus,.new-yacht textarea:focus{outline:none;border-color:var(--blue)}
.new-yacht input::placeholder,.new-yacht textarea::placeholder{color:var(--dim)}
.ny-note{font-size:11.5px;color:var(--dim)}

/* the type is already decided when you arrive from a type pill */
.gen-locked{margin-left:2px;font-size:12px;font-weight:600;letter-spacing:0;text-transform:none;color:#fff;
  background:rgba(162,216,232,.18);border:1px solid rgba(162,216,232,.5);border-radius:999px;padding:3px 11px}
.gen-change{margin-left:auto;font-family:inherit;font-size:10px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--dim);background:none;border:0;cursor:pointer;padding:2px 0;text-decoration:underline}
.gen-change:hover{color:#fff}
.chips.gen-types[hidden]{display:none}


/* A place EYOS works that has no document yet. Dimmer, hollow, and still clickable —
   clicking it opens the generate panel for that place, which is the point. */
.map-pin.empty .map-pin-dot{background:transparent;border:1.5px solid rgba(162,216,232,.6);box-shadow:none}
.map-pin.empty .map-pin-label{opacity:.62}
.map-pin.empty:hover .map-pin-label{opacity:1}


/* The number goes at the TOP of every card, image beneath. On an image card the body
   sat under the photo, so step 2's number was higher up the page than step 1's and the
   sequence still read 2, 1, 3 — the numbers have to descend or the list is not a list. */
.wf-card{position:relative}
.wf-card .wf-body{order:0}
.wf-card .wf-shot{order:1}
.wf-card .wf-demo,
.wf-card .wf-gates{order:2}


/* The finished draft, shown as the document it is rather than a list of gate findings. */
.gf-done{display:flex;gap:16px;align-items:stretch;margin-top:12px}
.gf-thumb{flex:0 0 132px;height:96px;border-radius:10px;background-size:cover;
  background-position:center;border:1px solid var(--line-2)}
.gf-done-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.gf-done-title{font-size:16px;font-weight:500;color:#fff;line-height:1.25}
.gf-done-sub{font-size:12px;color:var(--muted)}
.gf-done-btns{display:flex;gap:8px;margin-top:4px}
.gf-done-btns .btn{padding:9px 20px;font-size:13px}
.gf-toggle{align-self:flex-start;margin-top:6px;background:none;border:0;padding:0;
  color:var(--blue);font-size:12px;cursor:pointer;text-decoration:underline}
.gf-report{margin-top:12px}


/* Delete, and the are-you-sure it always goes through. */
.btn.danger{border-color:rgba(232,120,120,.5);color:#f0a3a3}
.btn.danger:hover{background:rgba(232,120,120,.16);border-color:rgba(232,120,120,.8);color:#fff}
.eyos-confirm{position:fixed;inset:0;z-index:100000;background:rgba(5,10,18,.72);
  display:flex;align-items:center;justify-content:center}
.ec-box{background:#0d1724;border:1px solid rgba(162,216,232,.35);border-radius:12px;
  padding:24px;width:min(460px,90vw);color:#fff}
.ec-title{font-size:17px;font-weight:500;margin-bottom:8px}
.ec-name{font-size:14px;color:var(--blue);margin-bottom:10px;word-break:break-word}
.ec-sub{font-size:12.5px;color:var(--muted);line-height:1.5;margin-bottom:18px}
.ec-btns{display:flex;gap:10px;justify-content:flex-end}