/* Bubbles Window Cleaning - design system
   Ground: deep indigo from the sail of the logo. Floor: clean-glass white.
   Accent: the sky blue of the swoosh, doing one job - pointing at the next action. */
:root{
  --ink:#0B1242; --ground:#141E63; --ground2:#1B2A7A; --deep:#080D33;
  --floor:#F4F8FD; --paper:#FFFFFF; --line:rgba(20,30,99,.12); --line-d:rgba(255,255,255,.14);
  --body:#3A4470; --muted:#6B7499; --muted-d:#A9B3DA;
  --accent:#5BB8F2; --accent-d:#2E8FD0; --bloom:rgba(91,184,242,.28);
  --serif:"Instrument Serif", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --sans:"Inter Tight", "Inter", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --pad:clamp(20px, 5vw, 64px); --max:1240px; --r:4px;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none !important}
html{scroll-behavior:smooth; scroll-padding-top:72px; -webkit-text-size-adjust:100%}
body{font-family:var(--sans); color:var(--body); background:var(--floor); font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden}
img,video{display:block; max-width:100%}
a{color:inherit}
button{font:inherit; cursor:pointer; border:0; background:none; color:inherit}
h1,h2,h3,h4{color:var(--ink); font-weight:400; line-height:1.05; letter-spacing:-.01em}
.serif{font-family:var(--serif)}
.mono,.kicker{font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase}
.kicker{color:var(--accent-d)}
.wrap{max-width:var(--max); margin:0 auto; padding:0 var(--pad)}
.still{background:radial-gradient(90% 90% at 50% 35%, #2B3C94, #0B1242); position:relative; overflow:hidden}
.still.light{background:radial-gradient(90% 90% at 50% 35%, #EAF3FC, #BCD6EE)}
.still img,.still video{width:100%; height:100%; object-fit:cover; position:absolute; inset:0}

/* ribbon + nav */
.ribbon{background:var(--deep); color:var(--muted-d); font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-align:center; padding:8px 14px; line-height:1.5}
.ribbon b{color:#fff; font-weight:500}
.nav{position:sticky; top:0; z-index:40; background:rgba(8,13,51,.94); backdrop-filter:saturate(1.4) blur(14px); -webkit-backdrop-filter:saturate(1.4) blur(14px); border-bottom:1px solid var(--line-d)}
.nav .wrap{display:flex; align-items:center; gap:24px; height:64px}
.logo{display:flex; align-items:center; gap:10px; text-decoration:none; color:#fff; margin-right:auto}
.logo svg{width:38px; height:38px; flex:none}
.logo b{display:block; font-family:var(--sans); font-weight:800; font-size:21px; letter-spacing:-.02em; line-height:1}
.logo b{color:#fff}
.logo>span{display:block}
.logo>span>span{display:block; font-family:var(--mono); font-size:9.5px; letter-spacing:.2em; color:var(--accent); margin-top:3px}
.nav-links{display:flex; gap:26px; font-size:15px}
.nav-links a{color:#DCE2FA; text-decoration:none}
.nav-links a:hover,.nav-links a[aria-current]{color:#fff}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; height:48px; padding:0 22px; border-radius:var(--r); font-weight:600; font-size:15px; text-decoration:none; transition:transform .15s, background .15s; white-space:nowrap}
.btn:active{transform:scale(.98)}
.btn-accent{background:var(--accent); color:var(--deep)}
.btn-accent:hover{background:#7CC8F6}
.btn-ghost{border:1px solid rgba(255,255,255,.35); color:#fff}
.btn-ghost:hover{border-color:#fff}
.btn-ink{background:var(--ground); color:#fff}
.btn-ink:hover{background:var(--ground2)}
.btn-line{border:1px solid var(--line); color:var(--ink); background:var(--paper)}
.nav .btn{height:40px; padding:0 16px; font-size:14px}
.menu-btn{display:none; width:40px; height:40px; color:#fff}
@media (max-width:959px){
  .nav-links{display:none}
  .nav-links.open{display:flex; position:absolute; top:64px; left:0; right:0; flex-direction:column; gap:0; background:var(--deep); border-bottom:1px solid var(--line-d)}
  .nav-links.open a{padding:16px var(--pad); border-top:1px solid var(--line-d)}
  .menu-btn{display:grid; place-items:center}
  .nav .btn-call{display:none}
}

/* scroll hero */
.sh{position:relative; height:calc(100vh - 64px); height:calc(100svh - 64px); max-height:100svh; background:var(--deep); overflow:hidden}
.sh-stage{position:relative; height:100%; overflow:hidden}
.sh-layer{position:absolute; inset:0; opacity:0; transition:opacity .9s ease; will-change:opacity}
.sh-layer.on{opacity:1}
.sh-layer .still{position:absolute; inset:0; transform:scale(var(--k,1.08)); transform-origin:50% 50%}
.sh-shade{position:absolute; inset:0; background:radial-gradient(120% 70% at 0% 100%, rgba(8,13,51,.7), rgba(8,13,51,0) 60%), linear-gradient(180deg, rgba(8,13,51,.5) 0%, rgba(8,13,51,.05) 30%, rgba(8,13,51,.3) 55%, rgba(8,13,51,.9) 100%); pointer-events:none}
.sh-copy{position:absolute; inset:auto 0 0 0; padding:0 var(--pad) clamp(28px,6vh,64px); max-width:var(--max); margin:0 auto; right:0; left:0}
.sh-beat{text-shadow:0 2px 28px rgba(8,13,51,.6), 0 1px 3px rgba(8,13,51,.35); position:absolute; left:var(--pad); right:var(--pad); bottom:clamp(128px,20vh,190px); opacity:0; transform:translateY(18px); transition:opacity .7s, transform .7s; pointer-events:none; max-width:880px}
.sh-beat.on{opacity:1; transform:none; pointer-events:auto}
.sh-beat .kicker{color:var(--accent); margin-bottom:14px}
.sh-beat h1,.sh-beat h2{font-family:var(--serif); color:#fff; font-size:clamp(46px, 8.4vw, 112px); line-height:.95}
.sh-beat h1 em,.sh-beat h2 em{font-style:italic; color:var(--accent)}
.sh-beat p{color:#DCE2FA; font-size:clamp(16px,1.6vw,19px); max-width:560px; margin-top:16px}
.sh-cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:22px}
.sh-bar{position:relative; display:flex; align-items:center; gap:16px; flex-wrap:wrap}
#shRail{display:flex; gap:8px; flex:1; min-width:180px}
#shRail button{flex:1; height:34px; position:relative; font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; color:rgba(255,255,255,.55); text-align:left; padding-top:12px}
#shRail button:before{content:""; position:absolute; top:0; left:0; right:0; height:2px; background:rgba(255,255,255,.22)}
#shRail button i{position:absolute; top:0; left:0; height:2px; width:0; background:var(--accent)}
#shRail button.on{color:#fff}
.sh-film{font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:#fff; border:1px solid rgba(255,255,255,.3); height:34px; padding:0 14px; border-radius:var(--r); background:rgba(8,13,51,.35)}
.sh-film:hover{border-color:#fff}
@media (max-width:959px){ #shRail button span{display:none} }

/* status strip */
.status{background:var(--ground); color:#fff}
.status .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:0}
.status .cell{padding:22px 20px 22px 0; border-right:1px solid var(--line-d)}
.status .cell + .cell{padding-left:20px}
.status .cell:last-child{border-right:0}
.status .mono{color:var(--muted-d); font-size:10.5px}
.status .v{font-size:17px; font-weight:600; margin-top:6px; display:flex; align-items:center; gap:8px}
.dot{width:9px; height:9px; border-radius:50%; background:#6EE7A8; box-shadow:0 0 0 4px rgba(110,231,168,.18)}
.dot.closed{background:#F2A65B; box-shadow:0 0 0 4px rgba(242,166,91,.18)}
@media (max-width:959px){ .status .wrap{grid-template-columns:1fr 1fr} .status .cell{padding:16px 12px 16px 0; border-right:0; border-bottom:1px solid var(--line-d)} .status .cell + .cell{padding-left:0} .status .cell:nth-child(even){padding-left:14px; border-left:1px solid var(--line-d)} }

/* sections */
.sec{padding:clamp(72px,11vw,140px) 0}
.sec-head{max-width:760px; margin-bottom:clamp(36px,5vw,56px)}
.sec-head h2{font-family:var(--serif); font-size:clamp(40px,6vw,76px); margin-top:14px}
.sec-head h2 em{font-style:italic; color:var(--accent-d)}
.sec-head p{font-size:clamp(17px,1.5vw,19px); margin-top:18px; max-width:620px}
.dark{background:var(--ground); color:var(--muted-d)}
.dark h1,.dark h2,.dark h3,.dark h4{color:#fff}
.dark .desk-panel h4,.dark .desk-panel h3,.dark .side h3{color:var(--ink)}
.dark .desk-panel .kicker{color:var(--accent-d)}
.dark .kicker{color:var(--accent)}
.dark .sec-head h2 em{color:var(--accent)}
.deep{background:var(--deep)}

/* price guide */
.prices{display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); background:var(--paper); border-radius:var(--r)}
.price{padding:30px 28px; border-right:1px solid var(--line)}
.price:last-child{border-right:0}
.price .mono{color:var(--muted)}
.price .fig{white-space:nowrap; font-family:var(--serif); font-size:clamp(46px,4.3vw,66px); color:var(--ink); line-height:1; margin:14px 0 6px}
.price .fig small{font-size:.45em; color:var(--muted)}
.price p{font-size:15px}
.price .btn{margin-top:18px; width:100%}
.incl{display:flex; flex-wrap:wrap; gap:10px 26px; margin-top:22px; font-size:15px; color:var(--ink)}
.incl span:before{content:""; display:inline-block; width:14px; height:8px; border-left:2px solid var(--accent-d); border-bottom:2px solid var(--accent-d); transform:rotate(-45deg) translateY(-3px); margin-right:10px}
.fine{font-size:14px; color:var(--muted); margin-top:14px}
@media (max-width:959px){ .prices{grid-template-columns:1fr} .price{border-right:0; border-bottom:1px solid var(--line)} .price:last-child{border-bottom:0} }

/* chapters */
.ch{display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(28px,5vw,80px); align-items:center; padding:clamp(56px,8vw,110px) 0; border-top:1px solid var(--line)}
.ch:first-child{border-top:0}
.ch.flip .ch-media{order:2}
.ch-media{aspect-ratio:4/3; border-radius:var(--r)}
.ch-media .pair{position:absolute; right:14px; bottom:14px; width:38%; aspect-ratio:4/3; border:2px solid #fff; border-radius:var(--r); overflow:hidden; box-shadow:0 18px 40px rgba(8,13,51,.35)}
.ch-media .pair-label,.ch-media .tag{position:absolute; left:14px; bottom:14px; font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; color:#fff; background:rgba(8,13,51,.6); padding:6px 10px; border-radius:3px; z-index:2}
.ch-media .pair .pair-label{left:8px; bottom:8px; font-size:9.5px}
.ch-num{font-family:var(--serif); font-style:italic; color:var(--accent-d); font-size:28px; display:flex; align-items:baseline; gap:14px}
.ch-num .kicker{font-style:normal}
.ch h3{font-family:var(--serif); font-size:clamp(36px,4.4vw,58px); margin:14px 0 20px}
.ch p{margin-bottom:14px}
.ch blockquote{margin-top:26px; padding-left:18px; border-left:2px solid var(--accent); font-family:var(--serif); font-style:italic; font-size:clamp(20px,2vw,24px); color:var(--ink); line-height:1.35}
.ch blockquote cite{display:block; font-family:var(--mono); font-style:normal; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-top:12px}
.dark .ch{border-top-color:var(--line-d)}
.dark .ch blockquote{color:#fff}
.dark .ch-num{color:var(--accent)}
@media (max-width:959px){ .ch{grid-template-columns:1fr} .ch.flip .ch-media{order:0} }

/* crew */
.crew{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(240px, 22%); gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:16px; scrollbar-width:thin}
.crew figure{scroll-snap-align:start}
.crew .still{aspect-ratio:9/15; border-radius:var(--r)}
.crew figcaption{font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted-d); margin-top:10px}
.real{display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:#fff; border:1px solid var(--line-d); padding:7px 12px; border-radius:3px}
.real:before{content:""; width:7px; height:7px; border-radius:50%; background:#6EE7A8}
@media (max-width:700px){ .crew{grid-auto-columns:72%} }

/* desk */
.desk-panel{background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:clamp(22px,4vw,44px); color:var(--body)}
.desk-steps{display:flex; gap:8px; margin-bottom:28px}
.desk-steps span{flex:1; font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); padding-top:10px; border-top:2px solid var(--line)}
.desk-steps span.on{color:var(--ink); border-top-color:var(--accent-d)}
.desk h4{font-family:var(--serif); font-size:clamp(28px,3vw,38px); margin-bottom:6px}
.desk .sub{color:var(--muted); font-size:15px; margin-bottom:22px}
.opts{display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:10px}
.opt{border:1px solid var(--line); border-radius:var(--r); padding:16px; text-align:left; background:var(--floor); transition:border-color .15s, background .15s}
.opt:hover{border-color:var(--accent-d)}
.opt.on{border-color:var(--ground); background:#EAF1FE; box-shadow:inset 0 0 0 1px var(--ground)}
.opt b{display:block; color:var(--ink); font-size:16px}
.opt small{display:block; color:var(--muted); font-size:13px; margin-top:2px}
.opt .p{font-family:var(--mono); font-size:13px; color:var(--accent-d); margin-top:8px; display:block}
.opt:disabled{opacity:.42; cursor:not-allowed}
.row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:22px}
.field label,.lbl{display:block; font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:8px}
.field input,.field select,.field textarea{width:100%; font:inherit; font-size:16px; color:var(--ink); background:var(--floor); border:1px solid var(--line); border-radius:var(--r); padding:12px 14px}
.field textarea{min-height:84px; resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--accent); outline-offset:1px}
.stepper{display:flex; align-items:center; border:1px solid var(--line); border-radius:var(--r); background:var(--floor); width:max-content}
.stepper button{width:46px; height:46px; font-size:20px; color:var(--ink)}
.stepper output{min-width:48px; text-align:center; font-weight:700; color:var(--ink); font-size:18px}
.toggle{display:flex; align-items:center; gap:14px; margin-top:22px; padding:16px; border:1px solid var(--line); border-radius:var(--r); background:var(--floor); cursor:pointer}
.toggle input{width:22px; height:22px; accent-color:var(--ground)}
.toggle b{color:var(--ink)}
.rule{margin-top:14px; padding:16px 18px; border-radius:var(--r); background:#EAF6EF; border:1px solid #BFE5CF; color:#1F5A3B; font-size:15px}
.rule b{color:#12402A}
.weeks{display:grid; grid-template-columns:repeat(3,1fr); gap:8px}
.week{border:1px solid var(--line); border-radius:var(--r); padding:12px 10px; background:var(--floor); text-align:left}
.week b{display:block; color:var(--ink); font-size:15px}
.week small{color:var(--muted); font-size:12px}
.week.on{border-color:var(--ground); background:#EAF1FE; box-shadow:inset 0 0 0 1px var(--ground)}
.week:disabled{opacity:.45; cursor:not-allowed; background:repeating-linear-gradient(135deg, var(--floor) 0 8px, #EDF1F8 8px 16px)}
.week:disabled small{color:#9A5B20}
.desk-nav{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:30px; padding-top:22px; border-top:1px solid var(--line)}
.band{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap}
.band .fig{font-family:var(--serif); font-size:clamp(40px,5vw,58px); color:var(--ink); line-height:1}
.band small{color:var(--muted); font-size:14px}
.summary{display:grid; grid-template-columns:1fr 1fr; gap:10px 24px; padding:20px; background:var(--floor); border:1px solid var(--line); border-radius:var(--r); margin:18px 0}
.summary div{font-size:15px}
.summary span{display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted)}
.summary b{color:var(--ink)}
.routes{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:8px}
.routes .btn{width:100%}
.refcode{font-family:var(--mono); color:var(--accent-d); font-size:14px; letter-spacing:.08em}
@media (max-width:700px){ .row,.summary{grid-template-columns:1fr} .routes{grid-template-columns:1fr} .weeks{grid-template-columns:1fr 1fr} .desk-nav .btn{flex:1} }

/* modal */
.modal{position:fixed; inset:0; z-index:80; background:rgba(8,13,51,.72); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); display:flex; align-items:flex-start; justify-content:center; overflow-y:auto; padding:clamp(0px,3vw,40px)}
.modal .desk-panel{width:100%; max-width:860px; position:relative; min-height:100%; }
@media (min-width:700px){ .modal .desk-panel{min-height:0} }
.x{position:absolute; top:14px; right:14px; width:40px; height:40px; border-radius:50%; background:var(--floor); color:var(--ink); font-size:22px; line-height:40px}

/* film */
.film{position:fixed; inset:0; z-index:90; background:#000; display:flex; flex-direction:column}
.film video{flex:1; width:100%; height:100%; object-fit:contain; background:#000}
.film-bar{display:flex; gap:6px; padding:12px var(--pad) 18px; background:#000}
.film-bar button{flex:1; text-align:left; font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.5); padding-top:10px; position:relative}
.film-bar button:before{content:""; position:absolute; top:0; left:0; right:0; height:2px; background:rgba(255,255,255,.2)}
.film-bar button.on{color:#fff}
.film-bar button.on:before{background:var(--accent)}
.film .x{background:rgba(255,255,255,.14); color:#fff; z-index:2}
.film-cap{position:absolute; left:var(--pad); top:22px; font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:#fff; z-index:2}

/* areas */
.finder{display:flex; gap:10px; margin-bottom:26px}
.finder input{flex:1; font:inherit; font-size:17px; padding:14px 16px; border:1px solid var(--line); border-radius:var(--r); background:var(--paper); color:var(--ink)}
.area-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px}
.area{border:1px solid var(--line); background:var(--paper); border-radius:var(--r); padding:22px}
.area .mono{color:var(--muted); font-size:10.5px}
.area h3{font-family:var(--serif); font-size:30px; margin:8px 0 8px}
.area p{font-size:14.5px; color:var(--muted)}
.area .links{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px}
.chip{display:inline-flex; align-items:center; height:32px; padding:0 12px; border:1px solid var(--line); border-radius:999px; font-size:13.5px; text-decoration:none; color:var(--ink); background:var(--floor)}
.chip:hover{border-color:var(--accent-d)}
.more-areas{margin-top:30px; font-size:15px; color:var(--muted)}

/* ledger page */
.lp-hero{position:relative; min-height:62vh; display:flex; align-items:flex-end; color:#fff}
.lp-hero .still{position:absolute; inset:0}
.lp-hero .sh-shade{background:linear-gradient(180deg, rgba(8,13,51,.35), rgba(8,13,51,.9))}
.lp-hero .wrap{position:relative; padding-top:120px; padding-bottom:56px; width:100%}
.lp-hero h1{font-family:var(--serif); color:#fff; font-size:clamp(48px,7.5vw,100px)}
.lp-hero h1 em{font-style:italic; color:var(--accent)}
.lp-hero p{color:#DCE2FA; max-width:620px; margin-top:16px; font-size:18px}
.lp-hero .kicker{color:var(--accent)}
.two{display:grid; grid-template-columns:1.3fr 1fr; gap:clamp(28px,5vw,72px)}
.two h2{font-family:var(--serif); font-size:clamp(34px,4vw,50px); margin-bottom:18px}
.two p{margin-bottom:14px}
.side{background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:26px; align-self:start}
.side h3{font-family:var(--serif); font-size:28px; margin-bottom:10px}
.side ul{list-style:none; margin:14px 0}
.side li{padding:10px 0; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:12px; font-size:15px}
.side li b{color:var(--ink)}
.faq details{border-top:1px solid var(--line); padding:18px 0}
.faq summary{cursor:pointer; color:var(--ink); font-weight:600; font-size:17px; list-style:none; display:flex; justify-content:space-between; gap:16px}
.faq summary:after{content:"+"; font-family:var(--mono); color:var(--accent-d)}
.faq details[open] summary:after{content:"-"}
.faq p{margin-top:10px}
.crumbs{font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-d); margin-bottom:18px}
.crumbs a{text-decoration:none}
@media (max-width:959px){ .two{grid-template-columns:1fr} }

/* visit */
.visit-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
.vcard{background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:26px; text-decoration:none; display:block}
.vcard .mono{color:var(--muted)}
.vcard b{display:block; font-family:var(--serif); font-weight:400; font-size:32px; color:var(--ink); margin:10px 0 6px; line-height:1.1}
.vcard p{font-size:14.5px; color:var(--muted)}
.vcard:hover{border-color:var(--accent-d)}
.hours{width:100%; border-collapse:collapse; margin-top:10px}
.hours td{padding:12px 0; border-top:1px solid var(--line); font-size:15.5px}
.hours td:last-child{text-align:right; font-family:var(--mono); font-size:14px}
.hours tr.today td{color:var(--ink); font-weight:700}
@media (max-width:959px){ .visit-grid{grid-template-columns:1fr} }

/* sticky bar + footer */
.sticky{position:fixed; left:0; right:0; bottom:0; z-index:50; display:none; gap:8px; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); background:rgba(8,13,51,.94); border-top:1px solid var(--line-d); transform:translateY(110%); transition:transform .35s}
.sticky.show{transform:none}
.sticky .btn{flex:1; height:46px; padding:0 10px; font-size:14px}
@media (max-width:959px){ .sticky{display:flex} body{padding-bottom:70px} }
.foot{background:var(--deep); color:var(--muted-d); padding:64px 0 90px; font-size:15px}
.foot .grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px}
.foot h5{font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:#fff; margin-bottom:14px; font-weight:500}
.foot a{text-decoration:none; display:block; padding:3px 0}
.foot a:hover{color:#fff}
.foot .legal{margin-top:44px; padding-top:22px; border-top:1px solid var(--line-d); font-size:13px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap}
@media (max-width:959px){ .foot .grid{grid-template-columns:1fr 1fr} .foot .grid > div:first-child{grid-column:1 / -1} }

/* admin */
.adm{background:var(--floor); min-height:100vh}
.adm-top{background:var(--deep); color:#fff}
.adm-top .wrap{display:flex; align-items:center; gap:16px; height:64px}
.adm-head{display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; padding:36px 0 22px}
.adm-head h1{font-family:var(--serif); font-size:clamp(40px,5vw,64px)}
.tabs{display:flex; gap:6px}
.tabs button{height:38px; padding:0 14px; border:1px solid var(--line); border-radius:var(--r); background:var(--paper); font-size:14px; color:var(--ink)}
.tabs button.on{background:var(--ground); color:#fff; border-color:var(--ground)}
.kpis{display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:22px}
.kpi{background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:16px 18px}
.kpi .mono{color:var(--muted); font-size:10.5px}
.kpi b{display:block; white-space:nowrap; font-family:var(--serif); font-weight:400; font-size:clamp(26px,2.2vw,34px); color:var(--ink); line-height:1.1; margin-top:6px}
.board{display:grid; grid-template-columns:1fr 340px; gap:18px; align-items:start; padding-bottom:60px}
.stop{background:var(--paper); border:1px solid var(--line); border-radius:var(--r); margin-bottom:14px; overflow:hidden}
.stop-h{display:flex; align-items:center; gap:14px; padding:14px 18px; background:#EEF3FC; border-bottom:1px solid var(--line)}
.stop-h .n{width:30px; height:30px; border-radius:50%; background:var(--ground); color:#fff; display:grid; place-items:center; font-family:var(--mono); font-size:13px; flex:none}
.stop-h h3{font-family:var(--serif); font-size:26px}
.stop-h small{margin-left:auto; font-family:var(--mono); font-size:11px; color:var(--muted); letter-spacing:.1em; text-transform:uppercase}
.job{display:grid; grid-template-columns:1fr auto; gap:6px 16px; padding:14px 18px; border-top:1px solid var(--line)}
.job:first-of-type{border-top:0}
.job b{color:var(--ink)}
.job .meta{font-size:14px; color:var(--muted); grid-column:1}
.job .flags{display:flex; gap:6px; flex-wrap:wrap; grid-column:1 / -1}
.flag{font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; padding:4px 8px; border-radius:3px; background:#EEF3FC; color:var(--ground)}
.flag.tree{background:#EAF6EF; color:#1F5A3B}
.flag.new{background:#FFF1DF; color:#8A4B10}
.flag.visit{background:#F1EAFE; color:#4B2A8A}
.flag.demo{background:#F2F2F2; color:#777}
.job .amt{font-family:var(--mono); color:var(--ink); font-size:14px; text-align:right}
.job select{font:inherit; font-size:13px; padding:4px 6px; border:1px solid var(--line); border-radius:3px; background:var(--floor)}
.load{background:var(--ground); color:#DCE2FA; border-radius:var(--r); padding:22px; position:sticky; top:16px}
.load h3{color:#fff; font-family:var(--serif); font-size:30px; margin-bottom:4px}
.load .mono{color:var(--accent); font-size:10.5px}
.load ul{list-style:none; margin:16px 0}
.load li{display:flex; justify-content:space-between; gap:10px; padding:10px 0; border-top:1px solid var(--line-d); font-size:15px}
.load li b{color:#fff; font-family:var(--mono)}
.load h4{color:#fff; font-size:15px; font-weight:600; margin-top:18px}
.load .spring{font-size:14px; margin-top:8px; line-height:1.7}
.empty{padding:40px; text-align:center; color:var(--muted); border:1px dashed var(--line); border-radius:var(--r)}
@media (max-width:959px){ .kpis{grid-template-columns:1fr 1fr} .board{grid-template-columns:1fr} .load{position:static} }
@media print{ .adm-top,.tabs,.ribbon{display:none} .board{grid-template-columns:1fr 300px} }

@media (prefers-reduced-motion:reduce){ *{transition:none !important; animation:none !important} html{scroll-behavior:auto} }

/* phone refinements */
.logo>span>span{white-space:nowrap}
@media (max-width:959px){
  .ribbon .rb-more{display:none}
  .sh-beat{bottom:168px}
  .sh-beat h1,.sh-beat h2{font-size:clamp(40px,11vw,64px)}
  .sh-beat p{font-size:15.5px; margin-top:10px}
  #shRail{order:-1; flex:1 1 100%; min-width:0; gap:6px}
  #shRail button{height:14px; padding-top:0}
  .sh-bar{gap:10px}
  .sh .sh-cta{margin-top:0; width:100%; flex-wrap:nowrap}
  .sh .sh-cta .btn{flex:1; padding:0 12px}
  .sh .sh-cta .cta-long{display:none}
  .lp-hero .sh-cta{flex-direction:column; align-items:stretch}
  .lp-hero .sh-cta .btn{width:100%}
  .btn{white-space:normal; text-align:center; line-height:1.25; height:auto; min-height:48px; padding-top:10px; padding-bottom:10px}
  .nav .btn{min-height:40px; padding-top:6px; padding-bottom:6px}
  .visit-grid{grid-template-columns:minmax(0,1fr)}
  .vcard b{overflow-wrap:anywhere; font-size:26px}
  .two,.board{grid-template-columns:minmax(0,1fr)}
  .lp-hero{min-height:56vh}
  .lp-hero .wrap{padding-top:90px; padding-bottom:40px}
  .sec{padding:64px 0}
  .ch{padding:44px 0}
  .desk-panel{padding:20px 16px}
  .sh-film{flex:1}
  .logo>span>span{font-size:8.5px; letter-spacing:.14em}
}
@media (min-width:960px){ .cta-short{display:none} }
.sh-beat .kicker{display:inline-block; background:rgba(8,13,51,.55); padding:6px 10px; border-radius:3px; text-shadow:none}
@media (max-width:959px){ .sh-copy{padding-bottom:64px} .sh-beat{bottom:210px} }
@media (max-width:380px){
  :root{--pad:16px}
  .nav .wrap,.adm-top .wrap{gap:10px}
  .logo svg{width:32px; height:32px}
  .logo b{font-size:18px}
  .logo>span>span{font-size:7.5px; letter-spacing:.1em}
  .nav .btn{padding:0 10px; font-size:13px}
  .adm-top .btn{padding:0 10px; font-size:13px}
  .menu-btn{width:34px}
  .sticky .btn{font-size:13px; padding:0 6px}
  .weeks{grid-template-columns:1fr 1fr}
  .sh-film{font-size:10px; padding:0 8px}
}
.foot a{overflow-wrap:anywhere}
@media (max-width:959px){ .foot .grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .kpis{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} }
@media (max-width:380px){ .kpi b{white-space:normal; font-size:24px} .foot .grid{grid-template-columns:minmax(0,1fr)} }


/* Timed hero - beats rotate on their own; the rail fills over each beat */
.sh-layer .still{transform:scale(1.06); transition:transform 3.4s ease-out}
.sh-layer.on .still{transform:scale(1)}
#shRail button i{width:100%; transform:scaleX(0); transform-origin:left center}
#shRail button.on i{animation:sh-fill var(--beat,2.8s) linear forwards}
#shRail button.done i{transform:scaleX(1)}
.sh.paused #shRail button.on i{animation-play-state:paused}
@keyframes sh-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){ #shRail button.on i{animation:none; transform:scaleX(1)} .sh-layer .still{transform:none} }

/* Powered by HigherMindAI - footer credit. Brand: navy #0B1A3A / #0F1729, teal #3FE0B5 / #0D9488 */
.hm-credit-row{margin:18px 0 0;text-align:center}
.hm-credit{--hm-teal:#3FE0B5;--hm-word:#FFFFFF;
  display:inline-flex;align-items:center;gap:.5em;padding:6px 13px;border-radius:999px;
  font:500 12px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;letter-spacing:.02em;
  color:inherit;text-decoration:none;opacity:.9;
  border:1px solid rgba(63,224,181,.42);background:rgba(15,23,41,.35);
  box-shadow:0 0 0 1px rgba(63,224,181,.08),0 0 16px rgba(63,224,181,.18);
  animation:hm-glow 5s ease-in-out infinite;
  transition:opacity .35s ease,border-color .35s ease,box-shadow .35s ease}
.hm-credit:hover,.hm-credit:focus-visible{opacity:1;border-color:rgba(63,224,181,.62);animation:none;
  box-shadow:0 0 0 1px rgba(63,224,181,.14),0 0 26px rgba(63,224,181,.34);outline:none}
.hm-dot{width:6px;height:6px;border-radius:50%;background:var(--hm-teal);
  box-shadow:0 0 8px var(--hm-teal);animation:hm-breathe 3.4s ease-in-out infinite}
.hm-mark{font-weight:700;color:var(--hm-word);letter-spacing:.01em}
.hm-ai{color:var(--hm-teal);
  background:linear-gradient(100deg,#3FE0B5 8%,#9BF4DD 30%,#0D9488 52%,#7FF0D2 74%,#3FE0B5 94%);
  background-size:230% 100%;-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;animation:hm-liquid 7s linear infinite}
.hm-credit:hover .hm-ai{text-shadow:0 0 12px rgba(63,224,181,.45)}
/* light footers: the wordmark goes navy, the glow stays teal */
.hm-credit.on-light{--hm-word:#0B1A3A;background:rgba(255,255,255,.7);border-color:rgba(13,148,136,.4)}
.hm-credit.on-light .hm-ai{background-image:linear-gradient(100deg,#0D9488 8%,#3FE0B5 35%,#0B7C72 60%,#0D9488 94%)}
@keyframes hm-liquid{to{background-position:-230% 0}}
@keyframes hm-breathe{0%,100%{opacity:.5;transform:scale(.85)}50%{opacity:1;transform:scale(1)}}
@keyframes hm-glow{0%,100%{box-shadow:0 0 0 1px rgba(63,224,181,.08),0 0 14px rgba(63,224,181,.14)}
  50%{box-shadow:0 0 0 1px rgba(63,224,181,.12),0 0 20px rgba(63,224,181,.24)}}
@media (prefers-reduced-motion:reduce){.hm-credit,.hm-dot,.hm-ai{animation:none}}
/* keep the footer's generic link rule off the credit pill */
.foot .hm-credit{display:inline-flex;padding:6px 13px}