/* Scanline Aerials · restructured homepage + supporting pages (Oct 30, 2026). Same brand tokens. */
html{scroll-padding-top:96px}
.old-anchor{position:relative;top:-96px;display:block;height:0;width:0;overflow:hidden}
main{display:block}

/* ---------- header ---------- */
.nav{gap:1rem}
.nav-links a.is-current{color:var(--text-primary)}
.nav-actions{display:flex;align-items:center;gap:.5rem}
.nav-ic{display:none;place-items:center;width:44px;height:44px;border-radius:12px;border:1px solid var(--panel-line);color:var(--text-primary);background:rgba(255,255,255,.04);text-decoration:none}
.nav-ic:hover{border-color:var(--accent-hover)}
.nav-book{display:inline-flex!important;min-height:44px;padding:.7em 1.25em!important}
@media (max-width:859px){
  .nav-ic{display:grid}
  .nav-book{padding:.6em 1em!important}
  .nav-book-x{display:none}
  .nav{padding-inline:clamp(.75rem,3vw,1.2rem)!important}
}
@media (max-width:520px){.brand-word{display:none}}
.nav-toggle{min-width:44px;min-height:44px}
.mobile-panel{position:fixed;inset:72px 0 auto 0;z-index:99;padding:1.2rem;background:rgba(10,21,38,.97);backdrop-filter:blur(14px);border-bottom:1px solid var(--panel-line)}
.mobile-panel ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4rem;font-size:1.05rem}
.mobile-panel li a:not(.btn){display:block;padding:.7rem .2rem;min-height:44px;box-sizing:border-box}
.mobile-panel .btn{width:100%;justify-content:center;margin-top:.4rem}

/* ---------- hero v2 ---------- */
.hz-v2{padding-bottom:clamp(2.6rem,6vw,4.5rem)}
.hz-v2 .hz-h1{font-size:clamp(2.3rem,4.8vw,4.1rem);max-width:12.5em}
.hz-v2 .hz-chips{margin-top:1.6rem}
.hz-v2 .hz-actions{margin-top:1.8rem}
.hz-v2 .hz-frame{aspect-ratio:16/11}
.hz-v2 .hz-actions .btn{min-height:48px}

/* ---------- homepage sections ---------- */
.hm-sec{position:relative;max-width:1180px;margin:0 auto;padding:clamp(3rem,6vw,5rem) clamp(1.2rem,5vw,3rem)}
.hm-tight{padding-top:clamp(1.4rem,3vw,2.2rem);padding-bottom:clamp(1.4rem,3vw,2.2rem)}
.hm-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.6rem}
.hm-head h2,.bk-form-wrap h2,.ar-box h2{font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.1;margin:0}
.hm-more{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;color:var(--accent-hover);font-weight:600;text-decoration:none}
.hm-more svg{transition:transform .4s var(--fl-lift)}
.hm-more:hover svg{transform:translateX(4px)}

/* recent work grid */
.wk-grid{list-style:none;margin:0;padding:0;display:grid;gap:.8rem;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:900px){.wk-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}}
.wk-item{position:relative;display:block;width:100%;padding:0;border:1px solid var(--panel-line);border-radius:18px;overflow:hidden;cursor:zoom-in;background:#0C1B30;aspect-ratio:4/3}
.wk-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.1s var(--fl-glide)}
.wk-item:hover img,.wk-item:focus-visible img{transform:scale(1.06)}
.wk-item::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,11,20,0) 50%,rgba(6,11,20,.8));pointer-events:none}
.wk-lbl{position:absolute;z-index:1;left:.8rem;right:.8rem;bottom:.7rem;text-align:left;font:600 .86rem/1.25 'Space Grotesk',sans-serif;color:#fff}
@media (max-width:520px){.wk-lbl{font-size:.74rem;left:.55rem;right:.55rem;bottom:.5rem}.wk-item{border-radius:14px}}

/* before / after */
.ba{margin:1.6rem 0 0}
.ba-stage{position:relative;aspect-ratio:16/9;border-radius:22px;overflow:hidden;border:1px solid var(--panel-line);background:#0C1B30;--pos:50%;touch-action:pan-y}
.ba-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ba-top{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.ba-lbl{position:absolute;z-index:2;top:14px;font:500 .7rem/1 'IBM Plex Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#F2F5FA;background:rgba(6,11,20,.66);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:.5rem .7rem}
.ba-lbl-l{left:14px}.ba-lbl-r{right:14px}
.ba-handle{position:absolute;z-index:2;top:0;bottom:0;left:var(--pos);width:2px;margin-left:-1px;background:#fff;pointer-events:none;box-shadow:0 0 12px rgba(0,0,0,.5)}
.ba-handle i{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:#2F6FED;border:3px solid #fff;box-shadow:0 8px 20px rgba(0,0,0,.45)}
.ba-handle i::before,.ba-handle i::after{content:"";position:absolute;top:50%;width:0;height:0;margin-top:-6px;border:6px solid transparent}
.ba-handle i::before{left:6px;border-right-color:#fff}
.ba-handle i::after{right:6px;border-left-color:#fff}
.ba-range{position:absolute;z-index:3;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none;touch-action:pan-y}
.ba-range::-webkit-slider-thumb{-webkit-appearance:none;width:56px;height:100vh}
.ba-range:focus-visible + *,.ba-stage:has(.ba-range:focus-visible){outline:3px solid var(--accent-hover);outline-offset:3px}
.ba-stage:has(.ba-range:focus-visible) .ba-handle i{box-shadow:0 0 0 4px rgba(143,180,255,.7),0 8px 20px rgba(0,0,0,.45)}
.ba figcaption{margin-top:.7rem;font-size:.86rem;color:var(--text-secondary)}

/* packages */
.price-card .pc-name{font:600 .78rem/1 'IBM Plex Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-hover);margin:0}
.price-card .price .pc-unit{font:500 .78rem/1 'IBM Plex Mono',monospace!important;letter-spacing:.06em;color:var(--text-secondary);margin-left:.3em}
.pk-lines{list-style:none;margin:1.6rem 0 0;padding:0;display:grid;gap:.6rem}
.pk-lines li{padding:1rem 1.1rem;border:1px solid var(--panel-line);border-radius:16px;background:rgba(255,255,255,.025);color:var(--text-secondary)}
.pk-lines a{display:inline-flex;align-items:center;gap:.3rem;color:var(--accent-hover);font-weight:600;text-decoration:none;white-space:nowrap}
.pk-lines a svg{width:16px;height:16px}
.pk-card25{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem;margin-top:.8rem;padding:.8rem 1rem;border:1px dashed rgba(143,180,255,.55);border-radius:16px;background:rgba(47,111,237,.08)}
.pk-card25 p{margin:0;font-size:.92rem;color:var(--text-secondary)}
.pk-card25 strong{color:var(--accent-hover)}
.pk-card25 a{color:var(--text-primary)}

/* how it works strip */
.hw-strip{list-style:none;margin:0;padding:0;display:grid;gap:.8rem;grid-template-columns:1fr}
@media (min-width:820px){.hw-strip{grid-template-columns:repeat(3,minmax(0,1fr))}}
.hw-strip li{display:flex;gap:.9rem;align-items:flex-start;padding:1.1rem 1.2rem;border:1px solid var(--panel-line);border-radius:18px;background:linear-gradient(160deg,rgba(16,31,56,.92),rgba(10,21,38,.96))}
.hw-n{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;font:700 .95rem/1 'Space Grotesk',sans-serif;box-shadow:0 0 0 5px rgba(47,111,237,.18)}
.hw-strip b{display:block;font:600 1.05rem/1.2 'Space Grotesk',sans-serif;color:var(--text-primary)}
.hw-strip span:not(.hw-n){display:block;margin-top:.25rem;font-size:.92rem;color:var(--text-secondary)}
.hw-note{margin:.9rem 0 0;font-size:.9rem;color:var(--text-secondary)}

/* where we shoot */
.ar-box{padding:clamp(1.3rem,3vw,2rem);border:1px solid var(--panel-line);border-radius:22px;background:linear-gradient(160deg,rgba(16,31,56,.92),rgba(10,21,38,.96))}
.ar-box h2{font-size:clamp(1.4rem,2.6vw,1.9rem)!important}
.ar-list{margin:.9rem 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:.2rem .6rem;font:600 1.05rem/1.4 'Space Grotesk',sans-serif;color:var(--text-primary)}
.ar-list a{color:var(--text-primary);text-decoration:underline;text-decoration-color:rgba(95,168,255,.45);text-underline-offset:.25em;padding:.55rem 0;min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center}
.ar-list a:hover{color:var(--accent-hover)}
.ar-list i{font-style:normal;color:var(--accent-hover)}
.ar-fee{margin:.6rem 0 0;font-size:.92rem;color:var(--text-secondary);max-width:52rem}

/* FAQ + book */
.bk-grid{display:grid;gap:clamp(2rem,4vw,3rem);align-items:start}
@media (min-width:980px){.bk-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}.bk-faq{position:sticky;top:110px}}
@media (max-width:979px){.bk-faq{order:1}.bk-form-wrap{order:2}}
.bk-sub{font-size:1.25rem;margin:0 0 1rem}
.fq-list{border-top:0!important;display:flex;flex-direction:column;gap:.55rem}
.fq-list .faq-item{border:1px solid var(--panel-line)!important;border-radius:16px;background:rgba(16,31,56,.55)}
.fq-list .faq-item[data-open="true"]{border-color:rgba(95,168,255,.55)!important;background:linear-gradient(160deg,rgba(16,31,56,.92),rgba(10,21,38,.96))}
.fq-list .faq-q{padding:1rem 1.1rem!important;font-size:.98rem!important}
.fq-list .faq-q .plus{margin-left:auto;transform:none!important}
.fq-list .faq-item[data-open="true"] .plus::after{opacity:0}
.fq-list .faq-a p{padding:0 1.1rem 1.1rem!important}
.fq-list + .hm-more{margin-top:.8rem}
.bk-lead{margin:.6rem 0 1.2rem;color:var(--text-secondary)}
.bk-form .form-fields{display:flex;flex-direction:column;gap:.95rem}
.bk-form button[type=submit]{width:100%;justify-content:center;min-height:54px;font-size:1rem;margin-top:.3rem}
.bk-form input,.bk-form select,.bk-form textarea{min-height:48px;box-sizing:border-box}
.bk-form .slot-note:empty,.bk-form .slot-picker:empty{display:none}
.bk-contact{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.bk-contact a{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.5rem .9rem;border:1px solid var(--panel-line);border-radius:12px;color:var(--text-primary);text-decoration:none;font-size:.92rem;overflow-wrap:anywhere}
.bk-contact a:hover{border-color:var(--accent-hover)}
.bk-contact svg{flex:none;color:var(--accent-hover)}

/* photo viewer */
.pv{padding:0;border:0;background:transparent;max-width:min(1200px,94vw);width:100%;color:#fff}
.pv::backdrop{background:rgba(4,8,15,.9)}
.pv-inner{position:relative}
.pv-fig{margin:0}
.pv-img{display:block;width:100%;max-height:80vh;object-fit:contain;border-radius:14px;background:#000}
.pv-cap{margin-top:.6rem;font:600 .95rem/1.2 'Space Grotesk',sans-serif}
.pv-close{position:absolute;top:-52px;right:0;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(6,11,20,.6);color:#fff;font-size:1.6rem;cursor:pointer}
.pv-nav{position:absolute;top:calc(50% - 22px);width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(6,11,20,.66);color:#fff;font-size:1.2rem;cursor:pointer}
.pv-prev{left:10px}.pv-next{right:10px}

/* ---------- inner pages ---------- */
.pg{max-width:1180px;margin:0 auto;padding:clamp(6.5rem,12vw,8.5rem) clamp(1.2rem,5vw,3rem) clamp(2rem,4vw,3rem)}
.pg-hero h1{margin-top:1rem;font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.05;letter-spacing:-.02em}
.pg-lead{margin:1rem 0 0;max-width:42rem;font-size:1.08rem;color:var(--text-secondary)}
.pg-sec{padding:clamp(1.6rem,4vw,2.6rem) 0}
.pg-h2{font-size:clamp(1.4rem,2.6vw,1.9rem);margin:0 0 1.1rem}
.pg-cta{display:flex;flex-wrap:wrap;gap:.8rem}
.pg-cta .btn{min-height:48px}
.wk-filters{display:inline-flex;flex-wrap:wrap;gap:.3rem;padding:.35rem;border:1px solid var(--panel-line);border-radius:999px;background:rgba(255,255,255,.025);margin-bottom:1.4rem}
.wk-filter{min-height:44px;padding:.5rem 1.1rem;border:0;border-radius:999px;background:transparent;color:var(--text-secondary);font:600 .9rem/1 'IBM Plex Sans',sans-serif;cursor:pointer}
.wk-filter.is-on{background:var(--accent);color:#fff}
.wk-full{margin-top:0!important}
.ba-pair{display:grid;gap:1.4rem}
@media (min-width:900px){.ba-pair{grid-template-columns:1fr 1fr}}
.ba-pair .ba{margin:0}
.dr-who{list-style:none;margin:0;padding:0;display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.dr-who li{padding:1.1rem 1.2rem;border:1px solid var(--panel-line);border-radius:18px;background:linear-gradient(160deg,rgba(16,31,56,.92),rgba(10,21,38,.96))}
.dr-who b{display:block;font:600 1.05rem/1.2 'Space Grotesk',sans-serif;color:var(--text-primary)}
.dr-who span{display:block;margin-top:.3rem;font-size:.9rem;color:var(--text-secondary)}
.dr-note{margin:1.1rem 0 0;padding:.9rem 1.1rem;border-left:3px solid var(--accent);background:rgba(47,111,237,.08);border-radius:0 12px 12px 0;color:var(--text-secondary)}
.wk-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))!important}
.dr-form-wrap{max-width:760px}
.ls-sample{display:grid;grid-template-columns:minmax(0,1fr);border:1px solid var(--panel-line);border-radius:22px;overflow:hidden;text-decoration:none;color:var(--text-primary);background:#0B1729}
@media (min-width:760px){.ls-sample{grid-template-columns:1.2fr 1fr;align-items:center}}
.ls-sample img{width:100%;height:100%;max-height:320px;object-fit:cover;display:block;transition:transform 1s var(--fl-glide)}
.ls-sample:hover img{transform:scale(1.04)}
.ls-sample span{display:flex;flex-direction:column;gap:.5rem;padding:1.4rem}
.ls-sample b{font:600 1.3rem/1.2 'Space Grotesk',sans-serif}
.ls-sample small{display:inline-flex;align-items:center;gap:.3rem;color:var(--accent-hover);font-weight:600}
.fq-page .faq-q{font-size:1.02rem!important}

/* footer headings are h2 now (heading order); keep the old look */
footer .footer-col h2{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.16em;color:var(--accent-hover);margin:0 0 1rem;font-weight:500}
footer .footer-col a{display:inline-flex;align-items:center;min-height:44px}
footer .footer-col ul{gap:0!important}
.ft-cred{font:500 .72rem/1.4 'IBM Plex Mono',monospace;letter-spacing:.1em;color:var(--text-secondary)}
.footer-bottom a{color:var(--text-secondary);text-decoration:none}

@media (prefers-reduced-motion: reduce){.wk-item img,.ls-sample img,.hm-more svg{transition:none!important}}
@media (min-width:900px){#work .ba-stage{aspect-ratio:21/9}}
.footer-brand .brand-word{display:block!important}
.brand{min-height:44px}
.social-follow{min-height:44px;box-sizing:border-box}
.pk-lines a,.pk-card25 a{display:inline-flex;align-items:center;min-height:44px;vertical-align:middle}
@media (max-width:767px){.fl-top{width:48px;height:48px}}
@media (max-width:767px){.fl-top{bottom:calc(1rem + env(safe-area-inset-bottom))!important}}