/* Readable content is the baseline; motion is an optional enhancement. */
#preloader { display:none !important; }
#mainNav, .hero-title-line, .hero-contact-btn, .hero-scroll-indicator,
[data-animate="fade-up"], .about-card { opacity:1; }
.hero-title-line { transform:none; }
body.no-scroll { overflow:auto; }
html { scroll-padding-top:90px; }
body, a, button, input, textarea, select { cursor:auto; }
a, button { cursor:pointer; }
:focus-visible { outline:3px solid var(--accent, #00d77c); outline-offset:5px; }
.skip-link { position:fixed;top:8px;left:8px;z-index:100000;background:#fff;color:#111;padding:12px 20px;transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.view-switch { display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:0 8px;font:500 .65rem var(--font-body,sans-serif);color:var(--text-secondary);white-space:nowrap;transition:color .2s; }
.view-switch:hover { color:var(--text-primary); }
.view-switch svg { width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5; }
.nav-right .nav-contact-btn { min-height:40px;padding:0 18px;border:1px solid var(--border);border-radius:100px;font-size:.62rem;font-weight:500;letter-spacing:.01em;background:transparent; }
.nav-contact-btn .btn-corners { display:none; }
.nav-right .nav-contact-btn:hover { border-color:var(--accent); }
.hero { min-height:760px;height:100svh; }
.hero-content { padding-top:95px;padding-bottom:145px; }
/* The full-width decorative row must not intercept clicks on the hero actions. */
.hero-bottom { pointer-events:none; }
.hero-bottom a { pointer-events:auto; }
.hero-intro { max-width:570px;font-size:clamp(1rem,1.5vw,1.25rem);line-height:1.6;color:var(--text-primary);margin:24px 0; }
.hero-actions { display:flex;flex-wrap:wrap;gap:28px;align-items:center;margin-top:28px; }
.hero-work-btn { display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:52px;padding:7px 7px 7px 24px;border:1px solid rgba(240,239,233,.45);border-radius:100px;background:rgba(10,12,14,.18);color:var(--text-primary);font:500 .8rem var(--font-body,sans-serif);transition:border-color .2s,background .2s; }
.hero-work-btn:hover { border-color:var(--accent);background:rgba(10,12,14,.35); }
.hero-button-arrow { display:grid;place-items:center;flex-shrink:0;width:36px;height:36px;border-radius:50%;background:var(--accent);color:#071c13; }
.hero-actions svg { width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s; }
.hero-work-btn:hover svg { transform:translate(1px,1px); }
.hero-actions .hero-contact-btn { display:inline-flex;align-items:center;gap:8px;margin:0;min-height:48px;padding:8px 0;border:0;box-shadow:none;background:transparent;color:var(--text-primary);font:500 .8rem var(--font-body,sans-serif);letter-spacing:0;text-transform:none;transition:color .2s;text-decoration:underline;text-underline-offset:6px;text-decoration-color:rgba(128,128,128,.6); }
.hero-actions .hero-contact-btn:hover { color:var(--accent);transform:none;background:transparent;box-shadow:none; }
.hero-location { font-size:.875rem;line-height:1.8;color:var(--text-primary); }
.hero-tagline-cycler { display:grid;width:380px;max-width:100%;pointer-events:auto; }
.hero-tagline-cycler .hero-tagline-slide { position:relative;grid-area:1 / 1;font-size:inherit;line-height:1.7; }
.hero-location a { color:var(--accent);text-decoration:underline;text-underline-offset:4px; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0; }
.hero-video-overlay { background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.22)),linear-gradient(0deg,rgba(0,0,0,.9),transparent 60%); }
.contact-modal { margin:0;padding:0;border:0;width:100%;height:100%;max-width:none;max-height:none;background:transparent;color:var(--text-primary); }
.contact-modal:not([open]) { display:none; }
.contact-modal::backdrop { background:rgba(0,0,0,.2); }
.contact-modal-panel { max-width:590px;padding:70px 36px 36px; }
.contact-modal-title { font-size:2rem;line-height:1.15;margin:14px 0; }
.contact-modal-sub { margin-bottom:24px;line-height:1.6; }
.contact-modal-panel { background:linear-gradient(155deg,#1c271f,#101713 55%);border:1px solid #b6cbb326;box-shadow:inset 0 1px 0 #f0ffe810,0 32px 100px #0008;color:#edf0e5; }
.contact-modal-content { padding-top:12px; }
.contact-modal :is(.contact-modal-sub,.form-group label,.service-picker legend) { color:#a4b1a8; }
.contact-modal .contact-modal-close { color:#c6d2c5; }
.contact-modal :is(input:not([type=radio]),textarea) { background:#0c130f;border:1px solid #b6cbb326;border-radius:10px;color:#edf0e5;box-shadow:inset 0 2px 6px #0002; }
.contact-modal :is(input:not([type=radio]),textarea):focus { border-color:#b8d9b7;box-shadow:0 0 0 3px #b8d9b712;outline:none; }
.contact-modal :is(button,a):focus-visible { outline:2px solid #b8d9b7;outline-offset:4px; }
.service-picker { min-width:0;margin:0 0 22px;padding:0;border:0; }
.service-picker legend { padding:0;margin-bottom:12px;font:500 10px/1.6 var(--font-body,sans-serif);letter-spacing:.13em;text-transform:uppercase; }
.service-options { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px; }
.service-options label { position:relative;min-width:0;cursor:pointer; }
.service-options input { position:absolute;width:1px;height:1px;opacity:0;clip-path:inset(50%); }
.service-options label > span { display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:50px;height:100%;padding:12px 14px;border:1px solid #b6cbb326;border-radius:10px;background:linear-gradient(150deg,#202b23,#141d17);color:#d7e2d5;font:400 12px/1.4 var(--font-body,sans-serif);box-shadow:inset 0 1px 0 #eaffdb08,0 2px 0 #07100a;transition:border-color .18s,background .18s,color .18s; }
.service-options label > span::after { content:'';flex:none;width:12px;height:12px;border:1px solid #91a58e66;border-radius:50%; }
.service-options label:hover > span { border-color:#b8d9b766; }
.service-options input:checked + span { color:#192b1d;background:linear-gradient(140deg,#cadfbd,#aac7a3);border-color:#c6dfbd;box-shadow:inset 0 1px 0 #f5ffea66,0 2px 0 #587253; }
.service-options input:checked + span::after { width:10px;height:6px;border:0;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;border-radius:0;transform:rotate(-45deg); }
.service-options input:focus-visible + span { outline:2px solid #d0e6c7;outline-offset:3px; }
.contact-modal .form-submit { background:linear-gradient(140deg,#cadfbd,#aac7a3);color:#192b1d;border:1px solid #c6dfbd;border-radius:12px;box-shadow:inset 0 1px 0 #f5ffea66,0 3px 0 #526b4e; }
.contact-modal .form-submit:hover { background:#d0e4c4;box-shadow:inset 0 1px 0 #f5ffea66,0 3px 0 #526b4e; }
.contact-modal .form-submit-alt { color:#c4d4c1; }
@media(max-width:380px) { .service-options label > span { padding:11px 10px;gap:6px;font-size:11px; } }
.enquiry-open { overflow:hidden; }
.enquiry-status,.direct-email { font-size:.85rem;line-height:1.65;margin-top:14px; }
.direct-email a { text-decoration:underline; }
.form-submit,.form-submit-alt { min-height:48px; }
.form-group label span { font-weight:400; }
.physics-container { display:flex;flex-wrap:wrap;gap:12px; }
html.reduced-motion .physics-pill { position:relative !important;top:auto !important;left:auto !important;transform:none !important; }
html.reduced-motion .physics-container { height:auto;min-height:220px;align-items:center;padding:30px; }
html.reduced-motion #heroCanvas,html.reduced-motion #rocketExhaustCanvas,html.reduced-motion .cursor-dot,html.reduced-motion .cursor-ring { display:none; }
@media(max-width:768px) {
    .hero { min-height:640px;height:100svh; }
    .hero-content { padding:120px 24px 170px;align-items:center;text-align:center; }
    .hero-title,.hero-title-line { text-align:center;align-items:center; }
    .hero-title-line { font-size:clamp(4rem,24vw,9rem); }
    .hero-intro { font-size:1rem;line-height:1.65;margin:24px 0; }
    .hero-actions { width:100%;gap:20px;justify-content:center; }
    .hero-work-btn { min-height:48px;padding-left:17px;gap:14px;font-size:.75rem; }
    .hero-button-arrow { width:32px;height:32px; }
    .hero-actions .hero-contact-btn { font-size:.75rem; }
    .hero-bottom { bottom:35px;left:24px;right:24px;align-items:center; }
    .hero-location { text-align:center;font-size:.8rem; }
    .view-switch { font-size:.65rem;padding:0 5px; }
    .nav-right { gap:4px !important; }
    .nav-right .nav-contact-btn { display:none; }
    .nav-burger { min-width:44px;min-height:44px; }
    .contact-modal-panel { padding:65px 24px 24px; }
}
@media(prefers-reduced-motion:reduce) {
    *,*::before,*::after { scroll-behavior:auto !important;animation:none !important;transition:none !important; }
    .work-card { position:relative !important;top:auto !important;transform:none !important;filter:none !important; }
    .cursor-dot,.cursor-ring,#heroCanvas,#rocketExhaustCanvas { display:none !important; }
    [data-animate],.about-card,.hero-title-line { opacity:1 !important;transform:none !important; }
}

#physicsContainer:not(.physics-live){display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;height:auto;min-height:240px;padding:30px}
#physicsContainer:not(.physics-live) .physics-pill{position:relative;left:auto;top:auto;transform:none}

/* Project stories live with their relevant experience entries. */
.roadmap-project-links { display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:14px;padding-top:8px;border-top:1px solid var(--border); }
.roadmap-project-link { display:inline-flex;align-items:center;gap:7px;min-height:32px;color:var(--accent);font:500 .65rem/1.5 var(--font-body,sans-serif);text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px; }
.roadmap-project-link:hover { text-decoration-color:currentColor; }
.roadmap-project-link span { transition:transform .2s; }
.roadmap-project-link:hover span { transform:translate(2px,-2px); }
.roadmap-card:focus-within .roadmap-card-expandable { grid-template-rows:1fr;opacity:1; }
/* Reserve room for the full details in the first two experience cards. */
@media(min-width:1025px) { #roadmapContainer { min-height:3130px !important; } }
@media(max-width:1024px) { .roadmap-project-link { min-height:44px;font-size:.75rem; } .roadmap-project-links { margin-top:18px;gap:0 20px; } }

/* Mobile experience cards use quiet color and clear type hierarchy. */
@media(max-width:1024px) {
    #roadmapCards #rc1 { --chapter-paper:#dce9dd;--chapter-accent:#285a40; }
    #roadmapCards #rc2 { --chapter-paper:#f0e4ce;--chapter-accent:#755526; }
    #roadmapCards #rc3 { --chapter-paper:#dce7ee;--chapter-accent:#385d76; }
    #roadmapCards #rcProof { --chapter-paper:#e8def1;--chapter-accent:#665080; }
    #roadmapCards #rc4 { --chapter-paper:#efdcd1;--chapter-accent:#81513c; }
    #roadmapCards #rc5 { --chapter-paper:#dce5e9;--chapter-accent:#385d68; }
    #roadmapCards #rc6 { --chapter-paper:#e9e4d7;--chapter-accent:#645a3c; }
    #roadmapCards .roadmap-card {
        --chapter-ink:#202b27;
        --chapter-muted:#48564f;
        --accent:var(--chapter-accent);
        padding:24px 22px 22px;
        background:var(--chapter-paper);
        color:var(--chapter-ink);
        border:1px solid transparent;
        border-radius:22px;
        box-shadow:none;
        overflow:hidden;
    }
    #roadmapCards .roadmap-card::before {
        content:counter(chapter, decimal-leading-zero) " / 07";
        top:25px;right:22px;bottom:auto;
        font-size:.62rem;font-weight:500;line-height:1.4;letter-spacing:.08em;
        color:var(--chapter-muted);-webkit-text-stroke:0;
    }
    #roadmapCards .roadmap-card-badge {
        max-width:calc(100% - 58px);
        padding:0;margin:0 0 23px;
        color:var(--chapter-accent);background:none;border:0;border-radius:0;
        font-size:.61rem;font-weight:700;line-height:1.4;letter-spacing:.12em;
    }
    #roadmapCards .roadmap-card-badge-icon { display:none; }
    #roadmapCards .roadmap-card-year {
        margin-bottom:8px;color:var(--chapter-muted);
        font-size:.61rem;font-weight:500;line-height:1.5;letter-spacing:.08em;
    }
    #roadmapCards .roadmap-card h4 {
        display:flex;flex-direction:column;gap:7px;
        margin:0 0 18px;color:var(--chapter-ink);
        font-size:1.5rem;font-weight:600;line-height:1.2;letter-spacing:-.035em;
    }
    #roadmapCards .roadmap-organisation { order:0; }
    #roadmapCards .roadmap-role {
        order:1;font-size:.78rem;font-weight:500;
        color:var(--chapter-accent);line-height:1.4;letter-spacing:0;
    }
    #roadmapCards .roadmap-role-join { display:none; }
    #roadmapCards #rc3 h4 { font-size:1.25rem;line-height:1.35;letter-spacing:-.025em; }
    #roadmapCards .roadmap-card p { color:var(--chapter-muted);font-size:.8125rem;line-height:1.7; }
    #roadmapCards .roadmap-card-details {
        margin-top:20px;padding-top:17px;
        border-top:1px solid rgba(32,43,39,.18);
    }
    #roadmapCards .roadmap-card-details h5 {
        margin-bottom:12px;color:var(--chapter-accent);
        font-size:.62rem;font-weight:700;letter-spacing:.12em;
    }
    #roadmapCards .roadmap-card-details ul { margin-bottom:0; }
    #roadmapCards .roadmap-card-details ul li {
        margin-bottom:10px;padding-left:13px;
        color:var(--chapter-muted);font-size:.77rem;line-height:1.6;
    }
    #roadmapCards .roadmap-card-details ul li:last-child { margin-bottom:0; }
    #roadmapCards .roadmap-card-details ul li::before {
        content:"";top:.62em;left:0;width:4px;height:4px;
        border-radius:50%;background:var(--chapter-accent);
    }
    #roadmapCards .roadmap-project-links { margin-top:23px;padding-top:0;gap:10px;border-top:0; }
    #roadmapCards .roadmap-project-link {
        min-height:44px;padding:10px 15px;gap:15px;
        color:var(--chapter-paper);background:var(--chapter-ink);
        border:1px solid var(--chapter-ink);border-radius:100px;
        font-size:.72rem;line-height:1.4;text-decoration:none;
    }
    #roadmapCards .roadmap-project-link:hover { background:var(--chapter-accent);border-color:var(--chapter-accent); }
    #roadmapCards .roadmap-project-link + .roadmap-project-link { color:var(--chapter-ink);background:transparent; }
    #roadmapCards .roadmap-project-link:focus-visible { outline-color:var(--chapter-ink);outline-offset:4px; }
    #roadmapCards .roadmap-card-tags { margin-top:auto;padding-top:25px;gap:6px; }
    #roadmapCards .roadmap-tag {
        padding:5px 7px;border:1px solid rgba(32,43,39,.2);border-radius:5px;
        color:var(--chapter-accent);background:transparent;
        font-size:.54rem;font-weight:600;line-height:1.2;letter-spacing:.055em;
    }
    #roadmapContainer .roadmap-dots { counter-reset:journey;gap:2px;margin-top:14px; }
    #roadmapContainer .roadmap-dots button {
        counter-increment:journey;width:36px;height:36px;
        border:1px solid var(--border);border-radius:50%;background:transparent;
        color:var(--text-secondary);font:500 .61rem var(--font-body,sans-serif);
    }
    #roadmapContainer .roadmap-dots button::before { content:counter(journey, decimal-leading-zero); }
    #roadmapContainer .roadmap-dots button.active { background:var(--text-primary);color:var(--bg);border-color:var(--text-primary); }
}
@media(max-width:360px) {
    #roadmapCards .roadmap-card { padding:22px 18px 20px; }
    #roadmapCards .roadmap-card::before { top:23px;right:18px; }
    #roadmapCards .roadmap-card h4 { font-size:1.35rem; }
}
