/* ═══ CONTACT page CSS ═══ */
#hero{position:relative;min-height:min(66vh,560px);display:flex;align-items:center;overflow:hidden;padding:clamp(6rem,12vw,7.5rem) 0 clamp(3rem,7vw,4.5rem);background:var(--bg)}
#hero::after{display:none}
#threadCanvas{position:absolute;inset:0;width:100%;height:100%}
.hero-glow{position:absolute;inset:0;background:radial-gradient(ellipse 55% 50% at 30% 45%,var(--accent-glow),transparent 68%);pointer-events:none}
.hero-inner{position:relative;z-index:1;max-width:840px}
.hero-eye{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:1.6rem;display:flex;align-items:center;gap:.75rem;opacity:0;animation:fup .65s var(--ease) .15s forwards}
.hero-eye::before{content:'';width:28px;height:1px;background:var(--gold);opacity:.45}
h1.hero-h{font-size:clamp(2.1rem,6vw,3.9rem);font-weight:800;letter-spacing:-.033em;line-height:1.06;margin-bottom:1.3rem;opacity:0;animation:fup .72s var(--ease) .3s forwards}
h1.hero-h span{color:var(--accent-lt)}
.hero-sub{font-size:clamp(.92rem,2vw,1rem);line-height:1.72;color:var(--text-dim);max-width:560px;margin-bottom:2rem;opacity:0;animation:fup .72s var(--ease) .45s forwards}
.hero-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1.2rem 2rem;max-width:640px;opacity:0;animation:fup .72s var(--ease) .6s forwards}
.hmeta{border-left:1px solid var(--line);padding-left:1rem}
.hmeta-v{font-family:var(--mono);font-size:clamp(.92rem,2vw,1.05rem);color:var(--text)}
.hmeta-l{font-size:.72rem;color:var(--text-faint);margin-top:.2rem}
@keyframes fup{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}

/* S02 offices w/ live clocks */
#offices{background:var(--panel)}
.off-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:7px;overflow:hidden}
.off{background:var(--bg);padding:2.1rem 1.9rem;position:relative;overflow:hidden;transition:background .2s}
.off:hover{background:var(--panel-2)}
.off::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:repeating-linear-gradient(90deg,var(--gold) 0,var(--gold) 5px,transparent 5px,transparent 12px);opacity:0;transform:scaleX(0);transform-origin:left;transition:opacity .2s,transform .55s var(--ease)}
.off:hover::after{opacity:.8;transform:scaleX(1)}
.off-type{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin-bottom:.7rem}
.off-city{font-size:1.35rem;font-weight:800;letter-spacing:-.02em;color:var(--text);margin-bottom:1rem;display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.off-live{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;padding:.24rem .65rem;border-radius:100px;border:1px solid var(--line);color:var(--text-faint)}
.off-live.open{color:var(--verify);border-color:rgba(111,174,126,.4)}
.off-live .dot{width:6px;height:6px;border-radius:50%;background:currentColor;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.off-clock{font-family:var(--mono);font-size:.78rem;color:var(--accent-lt);margin-bottom:1.1rem}
.off-rows{display:flex;flex-direction:column;gap:.55rem;font-size:.82rem;color:var(--text-dim)}
.off-rows a{color:var(--text);text-decoration:none;font-weight:600}
.off-rows a:hover{color:var(--accent-lt)}
.off-hrs{margin-top:1rem;padding-top:1rem;border-top:1px dashed var(--line);font-family:var(--mono);font-size:.64rem;letter-spacing:.04em;color:var(--text-faint)}

/* S03 what happens next */
#next{background:var(--bg)}
.nx-track{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;position:relative;margin-top:2.6rem}
.nx-track::before{content:'';position:absolute;top:9px;left:12%;right:12%;height:1px;background:repeating-linear-gradient(90deg,var(--gold) 0,var(--gold) 5px,transparent 5px,transparent 12px);opacity:.35}
.nx{text-align:center;padding:0 .5rem}
.nx-dot{width:19px;height:19px;margin:0 auto 1rem;border-radius:50%;border:1px solid var(--line);background:var(--panel);position:relative;z-index:1;display:flex;align-items:center;justify-content:center;transition:border-color .3s}
.nx-dot::after{content:'';width:6px;height:6px;border-radius:50%;background:var(--text-faint);transition:all .3s}
.nx:hover .nx-dot{border-color:var(--accent-lt)}
.nx:hover .nx-dot::after{background:var(--accent-lt);box-shadow:0 0 8px var(--accent-glow)}
.nx-k{font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);margin-bottom:.35rem}
.nx-t{font-size:.86rem;font-weight:700;color:var(--text);margin-bottom:.35rem}
.nx-b{font-size:.7rem;line-height:1.55;color:var(--text-faint);max-width:200px;margin:0 auto}
@media(max-width:720px){.nx-track{grid-template-columns:repeat(2,1fr);row-gap:2rem}.nx-track::before{display:none}}
@media(max-width:400px){.nx-track{grid-template-columns:1fr}}

/* S04 form */
#enquiry{background:var(--panel)}
.form-layout{display:grid;grid-template-columns:1fr 1.35fr;gap:3.5rem;align-items:start}
.form-side{position:sticky;top:5rem}
.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.f-field{display:flex;flex-direction:column;gap:.4rem}
.f-field.full{grid-column:1/-1}
.f-label{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint)}
.f-input,.f-select,.f-area{background:var(--bg);border:1px solid var(--line);border-radius:7px;color:var(--text);font-family:var(--sans);font-size:.88rem;padding:.8rem 1rem;transition:border-color .2s;width:100%}
.f-input:focus,.f-select:focus,.f-area:focus{outline:none;border-color:var(--accent-lt)}
.f-area{min-height:130px;resize:vertical}
.f-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%239AA3AD' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center}
.f-note{font-size:.74rem;color:var(--text-faint);line-height:1.6;margin-top:.9rem}
.f-sent{display:none;margin-top:1rem;padding:1rem 1.2rem;border:1px solid rgba(111,174,126,.4);border-radius:7px;color:var(--verify);font-size:.84rem}
.f-sent.show{display:block}
@media(max-width:900px){.form-layout{grid-template-columns:1fr;gap:2.2rem}.form-side{position:static}}
@media(max-width:560px){.f-grid{grid-template-columns:1fr}}

/* S05 channels */
#channels{background:var(--bg)}
.chan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:7px;overflow:hidden}
.chan{background:var(--panel);padding:2rem 1.8rem;display:flex;flex-direction:column;transition:background .2s;position:relative;overflow:hidden}
.chan:hover{background:var(--panel-2)}
.chan::before{content:'';position:absolute;left:0;top:10px;bottom:10px;width:2px;background:repeating-linear-gradient(to bottom,var(--gold) 0,var(--gold) 5px,transparent 5px,transparent 11px);opacity:0;transform:scaleY(0);transform-origin:top;transition:opacity .2s,transform .5s var(--ease)}
.chan:hover::before{opacity:1;transform:scaleY(1)}
.chan-ico{width:38px;height:38px;border-radius:7px;border:1px solid var(--line);background:var(--bg);display:flex;align-items:center;justify-content:center;color:var(--accent-lt);margin-bottom:1.2rem}
.chan-ico svg{width:17px;height:17px}
.chan-t{font-size:.98rem;font-weight:700;color:var(--text);margin-bottom:.5rem}
.chan-b{font-size:.8rem;line-height:1.62;color:var(--text-dim);flex:1;margin-bottom:1.1rem}
.chan-cta{font-size:.86rem;font-weight:700;color:var(--text);text-decoration:none;display:inline-flex;align-items:center;gap:.4rem}
.chan-cta:hover{color:var(--accent-lt)}
.chan-sla{font-family:var(--mono);font-size:.6rem;letter-spacing:.05em;color:var(--text-faint);margin-top:.5rem}

/* CTA */
#cta{background:var(--bg);text-align:center;padding:clamp(5rem,10vw,7rem) 0;position:relative;overflow:hidden}
#cta::after{display:none}
.cta-glow{position:absolute;inset:0;background:radial-gradient(ellipse 60% 55% at 50% 60%,var(--gold-glow),transparent 70%);pointer-events:none}
.cta-eye{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:1.5rem}
.cta-h{font-size:clamp(1.8rem,4.5vw,3rem);font-weight:800;letter-spacing:-.028em;line-height:1.14;max-width:740px;margin:0 auto 1.3rem}
.cta-h em{font-style:normal;color:var(--accent-lt)}
.cta-sub{font-size:.95rem;line-height:1.75;color:var(--text-dim);max-width:520px;margin:0 auto 2.4rem}
.cta-note{margin-top:1.5rem;font-size:.76rem;color:var(--text-faint)}
.cta-note strong{color:var(--text-dim)}
#cta .cta-row{justify-content:center}
