/*========================
    THEME VARIABLES
    Change values here to re-skin the whole site (colors, fonts, spacing).
==========================*/

:root {
    --color-bg: #f6f4ee;
    --color-surface: #ffffff;
    --color-surface-alt: #ececec;
    --color-ink: #1a1a1a;
    --color-ink-muted: #666666;
    --color-border: #d8d8d8;
    --color-code: #163a2d;
    --color-canvas: #ff6a3d;
    --color-accent-text: #ee8cb8;

    --font-family: "Courier New", Courier, monospace;
    --font-mono: "Courier New", Courier, monospace;

    --nav-height: 70px;
    --max-width: 1120px;
    --radius: 8px;
    --transition: 0.2s ease;
}

/*========================
    GLOBAL STYLES
==========================*/

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: var(--nav-height);
}

body {
    font-family: var(--font-family);
    font-size: 1rem;
    line-height: 1.6;
    color: var(--color-ink);
    background-color: var(--color-bg);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
}

main {
    flex: 1;
    padding-top: var(--nav-height);
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    line-height: 1.3;
}

.mono {
    font-family: var(--font-mono);
}

a {
    text-decoration: none;
    color: var(--color-code);
}

a:hover {
    text-decoration: underline;
}

img {
    max-width: 100%;
    display: block;
}

ul {
    list-style: none;
}

.wrap {
    max-width: var(--max-width);
    margin: 0 auto;
    padding: 0 24px;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 11px 24px;
    border-radius: 6px;
    border: 1px solid var(--color-ink);
    color: var(--color-ink);
    font-size: 0.9rem;
    font-weight: 600;
    background: transparent;
    cursor: pointer;
    transition: background-color var(--transition), color var(--transition);
}

.btn:hover {
    background-color: var(--color-ink);
    color: #fff;
    text-decoration: none;
}

.btn-solid {
    background-color: var(--color-code);
    border-color: var(--color-code);
    color: #fff;
}

.btn-solid:hover {
    background-color: var(--color-ink);
    border-color: var(--color-ink);
}

#contact .btn:hover {
    background-color: var(--color-accent-text);
    border-color: var(--color-accent-text);
}

#contact-preview .btn:hover {
    background-color: var(--color-accent-text);
    border-color: var(--color-accent-text);
}

section {
    padding: 70px 0;
}

.section-alt {
    background-color: rgba(22, 58, 45, 0.82);
}

#work-preview .section-title {
    color: #fff;
}

#work-preview .section-cta .btn {
    background: transparent;
    border-color: #fff;
    color: #fff;
}

#work-preview .section-cta .btn:hover {
    background: var(--color-accent-text);
    color: #fff;
    border-color: var(--color-accent-text);
    text-decoration: none;
}

.section-title {
    text-align: center;
    font-size: 1.8rem;
    margin-bottom: 14px;
}

#work-preview .section-title {
    margin-bottom: 48px;
}

.section-intro {
    max-width: 620px;
    margin: 0 auto 40px;
    text-align: center;
    color: var(--color-ink-muted);
}

#pitch {
    background-color: #0a1f16;
    text-align: center;
}

#pitch .section-intro {
    margin-bottom: 0;
    color: #fff;
}

#pitch .section-intro p {
    font-size: clamp(1.2rem, 2.4vw, 1.6rem);
}

#pitch .section-intro .accent {
    color: var(--color-accent-text);
}

.section-cta {
    display: flex;
    justify-content: center;
    margin-top: 48px;
}

.preview-section {
    text-align: center;
    background-color: rgba(246, 244, 238, 0.48);
}

.preview-section .btn {
    margin-top: 10px;
}

.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Per-item delay/duration are set inline by js/scroll-reveal.js (not just
   a bare transition-delay — an element that also has its own unrelated
   hover transition, like a fee card's background-color, would have that
   transition's cascade-won property list silently replace this one's,
   losing the reveal animation and picking up its stagger delay instead;
   the script sets the complete transition for those elements directly). */
.reveal-item {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}

.reveal-item.reveal-item-visible {
    opacity: 1;
    transform: none;
}

/* #fees-page and #contact are excluded here — their entrance animation
   (js/scroll-reveal.js) plays regardless of this preference, since it's a
   single short one-time effect the user explicitly asked to always see,
   not a continuous or scroll-linked one. */
@media (prefers-reduced-motion: reduce) {

    .reveal,
    .reveal-visible,
    .reveal-item:not(#fees-page *):not(#contact *),
    .reveal-item.reveal-item-visible:not(#fees-page *):not(#contact *) {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/*========================
    PAGE LOADER
    Full-screen splash shown instantly on load — lives in the critical/base
    CSS list so it renders before the async stylesheet or any JS-driven
    layout finishes, covering the brief window where a slow connection
    would otherwise show a half-styled page. js/main.js removes it once the
    window's `load` event fires (everything, including images, is ready);
    the noscript rule in each page's markup hides it outright when JS is
    disabled, since nothing would ever remove it otherwise.
==========================*/

#page-loader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-code);
    transition: opacity 0.4s ease, visibility 0.4s ease;
}

.page-loader-logo {
    font-family: var(--font-mono);
    font-size: clamp(1rem, 2.6vw, 1.3rem);
    font-weight: 700;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-loader-amp {
    position: relative;
    display: inline-block;
    width: 3.9rem;
    height: 3.6rem;
    margin: 0 -0.55em;
}

.page-loader-amp-base,
.page-loader-amp-fill {
    position: absolute;
    inset: 0;
    /* Inlined as a data URI (not a url() file reference) so this renders
       with zero network round-trips — it's part of the critical CSS
       inlined in <head>, and the whole point of the loader is to appear
       before anything else, including its own image, has had time to
       load. The source PNG is a tiny 120px mask-only asset (~11KB), not
       the full-resolution logo. */
    -webkit-mask-image: url("data:image/png;base64,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");
    mask-image: url("data:image/png;base64,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");
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.page-loader-amp-base {
    background-color: rgba(255, 255, 255, 0.18);
}

.page-loader-amp-fill {
    background-color: var(--color-accent-text);
    clip-path: inset(100% 0 0 0);
    animation: page-loader-fill 2.8s ease-in-out infinite;
}

@keyframes page-loader-fill {
    0%, 100% {
        clip-path: inset(100% 0 0 0);
    }
    50% {
        clip-path: inset(0 0 0 0);
    }
}

body.page-loaded #page-loader {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

body:not(.page-loaded) {
    overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
    .page-loader-amp-fill {
        animation: none;
        clip-path: inset(0 0 0 0);
    }
}

/*========================
    FEES PAGE
==========================*/

/* isolation: isolate gives #fees-page its own stacking context, so the
   smudge canvas's z-index: -1 stays behind its own siblings (.wrap) instead
   of escaping further back to sit behind #fees-page itself. */
#fees-page {
    position: relative;
    overflow: hidden;
    padding-top: 40px;
    isolation: isolate;
}

#fees-page .wrap {
    position: relative;
    z-index: 1;
}

/* The smudge canvas (js/fees-header-smudge.js) covers the whole page — a
   persistent-pixel-buffer canvas, built the same way as the homepage hero,
   that gets physically smudged as the cursor drags across it — so dragging
   never hits an edge; the green fill it draws is confined to the header
   band's own area, but a drag that continues past it keeps smudging behind
   the fee cards below. */
.fees-header-smudge {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    pointer-events: none;
    z-index: -1;
}

/* .page-header's own base padding would stack with .fees-header-band's,
   making this frame taller than Contact's — zeroed out here since the band
   provides all the framing padding itself. */
#fees-page .page-header {
    padding: 0;
}

/* Full-bleed (breaks out of .wrap's max-width) wrapper for the header text,
   tall enough to contain the eyebrow, title and pricing note — matched by
   the leaves photo the canvas draws behind it (js/fees-header-smudge.js).
   Padding matches Contact's .page-header exactly so both hero frames come
   out the same height. */
.fees-header-band {
    position: relative;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    padding: 90px 24px;
}

#fees-page .fees-header-band .eyebrow,
#fees-page .fees-header-band h1,
#fees-page .fees-header-band p {
    position: relative;
    color: #fff;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.65);
}

/*========================
    CHALK TRAIL background (js/chalk-trail.js) — used on the Websites
    page's List mode. Each [data-chalk-container] just needs
    position: relative + overflow: hidden and its real content raised
    above the canvas with z-index.
==========================*/

.chalk-trail-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    pointer-events: none;
}

/*========================
    PAGE HEADER (non-home pages)
==========================*/

.page-header {
    text-align: center;
    padding: 56px 0 10px;
}

.page-header .eyebrow {
    display: block;
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.75rem;
    color: var(--color-code);
    margin-bottom: 12px;
}

.page-header h1 {
    font-size: clamp(1.7rem, 4vw, 2.3rem);
    margin-bottom: 12px;
}

.page-header p {
    max-width: 600px;
    margin: 0 auto;
    color: var(--color-ink-muted);
}

/* Contact page: a full-bleed photo behind the header text (js/contact-hero-
   smudge.js), shown at full color with no dimming overlay — legibility
   comes from a text-shadow on the text itself instead of a scrim over the
   image. The canvas covers the whole section — exactly like the Fees page
   header band's green rectangle — but draws the river photo in place of a
   flat color, confined to wherever .page-header renders. */
#contact {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

#contact .page-header {
    position: relative;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    z-index: 1;
    color: #fff;
    padding: 90px 24px;
}

.contact-hero-smudge {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    pointer-events: none;
    z-index: -1;
}

#contact .page-header .eyebrow,
#contact .page-header h1,
#contact .page-header p {
    position: relative;
    color: #fff;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.65);
}

/*========================
    TOP NAVIGATION
==========================*/

.site-nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    background-color: var(--color-code);
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.nav-bar {
    max-width: var(--max-width);
    margin: 0 auto;
    height: var(--nav-height);
    padding: 0 24px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    column-gap: 20px;
}

.nav-logo {
    grid-column: 1;
    justify-self: start;
    font-family: var(--font-mono);
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
}

.nav-logo .accent {
    color: var(--color-accent-text);
}

/* The brush-stroke "&" mark replaces the plain text ampersand everywhere,
   at twice the logo's own font-size — sized separately per breakpoint
   since the logo's own font-size differs too. Rendered as a CSS mask
   (the source PNG's alpha channel as the shape) filled with
   background-color instead of as an <img>, so its color is driven by the
   same --color-accent-text variable as the language switch's active pill
   — an exact match, not an eyeballed approximation of the PNG's own
   baked-in pink. */
.nav-logo-amp {
    display: none;
}

.nav-logo-mark,
.nav-logo-mark-mobile {
    display: none;
    background-color: var(--color-accent-text);
    -webkit-mask-image: url('../images/logo.png');
    mask-image: url('../images/logo.png');
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

@media (min-width: 769px) {
    .nav-logo-mark {
        display: inline-block;
        height: 2.6rem;
        width: 2.8rem;
        vertical-align: middle;
        margin: -0.3rem -0.25em;
    }
}

@media (max-width: 768px) {
    .nav-logo-mark-mobile {
        display: inline-block;
        height: 2.1rem;
        width: 2.26rem;
        vertical-align: middle;
        margin: -0.25rem -0.42em;
    }
}

.nav-links {
    grid-column: 2;
    justify-self: center;
    display: flex;
    align-items: center;
    gap: 4px;
}

.nav-link {
    display: inline-block;
    padding: 10px 14px;
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.95rem;
    border-radius: 6px;
    transition: background-color var(--transition);
}

.nav-link:hover,
.nav-link.active {
    background-color: rgba(255, 255, 255, 0.12);
    color: #fff;
    text-decoration: none;
}

.nav-cta {
    grid-column: 3;
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* three-way language switch — EN / DE / FR, one plain link per
   language pointing at the same page in that language's folder (the
   folders mirror each other file-for-file, so it's just a path swap).
   The active language is marked with class="active" directly in the
   markup, per page — no JS needed. */
.lang-switch {
    display: inline-flex;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 999px;
    overflow: hidden;
    flex-shrink: 0;
}

.lang-switch-option {
    padding: 7px 10px;
    font-size: 0.72rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.75);
}

.lang-switch-option:hover {
    background-color: rgba(255, 255, 255, 0.15);
    text-decoration: none;
}

.lang-switch-option.active {
    background-color: var(--color-accent-text);
    color: #fff;
}

.lang-switch-option.active:hover {
    background-color: var(--color-accent-text);
}

.nav-toggle {
    grid-column: 2;
    justify-self: center;
    display: none;
    background: none;
    border: none;
    width: 40px;
    height: 40px;
    cursor: pointer;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.nav-toggle span {
    display: block;
    width: 22px;
    height: 2px;
    background-color: #fff;
}

/*========================
    HERO (homepage)
==========================*/

#hero {
    position: relative;
    overflow: hidden;
    min-height: calc(100vh - var(--nav-height));
    /* dvh accounts for the mobile browser's own UI (address bar, tab
       switcher, etc.) — 100vh is the *largest* possible viewport, as if
       that UI were hidden, so sizing the hero to it pushes content
       (notably .hero-scroll-cue, anchored to the hero's bottom edge) below
       what's actually visible whenever that UI is showing, which by
       default it is. Browsers that don't support dvh keep the vh value
       above instead of ignoring the whole declaration. */
    min-height: calc(100dvh - var(--nav-height));
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 50px 24px;
    color: #fff;
}

.hero-canvas {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    display: block;
    z-index: -1;
}

.hero-scrim {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    background: radial-gradient(ellipse at center, rgba(22, 58, 45, 0.08) 0%, rgba(22, 58, 45, 0.22) 100%);
    pointer-events: none;
    z-index: -1;
}

.hero-scroll-cue {
    position: absolute;
    left: 50%;
    bottom: 28px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: #fff;
    background-color: rgba(22, 58, 45, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 50%;
    animation: hero-scroll-bounce 1.8s ease-in-out infinite;
}

.hero-scroll-cue svg {
    width: 24px;
    height: 24px;
}

@keyframes hero-scroll-bounce {

    0%,
    100% {
        transform: translate(-50%, 0);
    }

    50% {
        transform: translate(-50%, 10px);
    }
}

/* Mobile: stays put and pulses in size instead of bouncing up and down —
   a bounce reads as "swipe" on touch, which is misleading since dragging
   the hero smudges rather than scrolling there. */
@keyframes hero-scroll-pulse {

    0%,
    100% {
        transform: translate(-50%, 0) scale(1);
    }

    50% {
        transform: translate(-50%, 0) scale(1.18);
    }
}

/* No translateX here — on mobile the cue is back in normal flow (see
   below), centered by .hero-inner's flexbox rather than left: 50%. */
@keyframes hero-scroll-pulse-mobile {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.18);
    }
}

@media (max-width: 768px) {
    /* A large tap band pinned to the bottom of the viewport instead of a
       small circular button — `fixed` (not `absolute`) so it always sits
       at the actual bottom of the screen even when #hero itself runs
       taller than the viewport, matching how .hero-canvas/.hero-scrim are
       already anchored. Only the icon pulses (see .hero-scroll-cue svg
       below); scaling the whole band would stretch the gradient oddly. */
    .hero-scroll-cue {
        position: fixed;
        left: 0;
        right: 0;
        top: auto;
        bottom: 0;
        z-index: 2;
        width: 100%;
        height: 12vh;
        min-height: 80px;
        margin-top: 0;
        border-radius: 0;
        border: none;
        background-color: rgba(22, 58, 45, 0.32);
        align-items: flex-end;
        padding-bottom: 18px;
        animation: none;
    }

    .hero-scroll-cue svg {
        width: 32px;
        height: 32px;
        animation: hero-scroll-pulse-mobile 1.6s ease-in-out infinite;
    }

}

.hero-inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-shadow: 0 2px 14px rgba(22, 58, 45, 0.8);
    pointer-events: none;
}

.hero-inner .btn,
.hero-inner .view-toggle {
    pointer-events: auto;
}

#hero .eyebrow {
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.8rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 16px;
}

#hero h1 {
    font-size: clamp(1.9rem, 5vw, 3rem);
    max-width: 760px;
    margin-bottom: 18px;
    font-weight: 700;
    color: #fff;
}

#hero h1 .accent {
    color: var(--color-accent-text);
}

/* Placed after the base rules above (not inside the earlier mobile media
   block) — same specificity as those, so declared-later-wins would let
   the base font-weight: 700 silently cancel this out otherwise. */
@media (max-width: 768px) {
    #hero .eyebrow,
    #hero h1 {
        font-weight: 900;
        /* Stronger and tighter than .hero-inner's own shadow — Courier
           New only has a couple of real weight steps, so a heavier
           shadow (rather than relying on font-weight alone) is what
           actually keeps the text readable over the busiest parts of
           the marble photo. */
        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 2px 10px rgba(0, 0, 0, 0.7);
    }

    #hero h1 .accent {
        color: #fff;
    }
}

#hero p {
    max-width: 540px;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 30px;
}

#hero .btn {
    border-color: rgba(255, 255, 255, 0.7);
    color: #fff;
}

#hero .btn:hover {
    background-color: var(--color-accent-text);
    border-color: var(--color-accent-text);
    color: #fff;
}

.hero-actions {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 46px;
}

/*========================
    WEBSITES PAGE
    The fixed, negative-z-index canvas board sits behind every normal
    in-flow ancestor box all the way up to <body> — not just <main> —
    since none of them are positioned/stacking contexts that would box
    it in locally. Each of those ancestor boxes is invisible but still
    hit-testable, so without this they silently swallow every
    click/drag/wheel meant for the board. pointer-events: none from
    <body> down, scoped to this page, restored on the nav (always
    needed) and the actual interactive pieces, lets events fall through.
==========================*/

body[data-page="websites"] {
    pointer-events: none;
}

body[data-page="websites"] .site-nav,
body[data-page="websites"] .view-toggle,
body[data-page="websites"] .mode-list,
body[data-page="websites"] .canvas-board,
body[data-page="websites"] #websites-page {
    pointer-events: auto;
}

/* In List mode the title sits above the List/Canvas toggle as usual; in
   Canvas mode it's dropped entirely so the toggle is the very first thing
   under the nav bar, matching the mobile page (which never reaches Canvas
   mode, and always keeps its own title). */
.wrap:has(.preview-modes[data-mode="canvas"]) .page-header {
    display: none;
}

/* The palm-tree hero band behind the header text (js/websites-header-
   smudge.js) — same technique as the Fees page header band: the canvas
   covers the whole page so dragging near the photo's edges pulls its
   color out into the background beyond it, and the photo itself is
   confined to wherever .websites-header-band renders. */
#websites-page {
    position: relative;
    overflow: hidden;
    padding-top: 40px;
    isolation: isolate;
}

#websites-page .page-header {
    padding: 0;
}

.websites-header-band {
    position: relative;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    padding: 90px 24px;
}

.websites-header-smudge {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    pointer-events: none;
    z-index: -1;
}

#websites-page .websites-header-band .eyebrow,
#websites-page .websites-header-band h1 {
    position: relative;
    color: #fff;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.65);
}

/*========================
    VIEW TOGGLE (list / canvas switch)
    A simple two-option pill switch, used on the Websites page.
==========================*/

.view-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    width: 150px;
    height: 38px;
    border-radius: 999px;
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    cursor: pointer;
    font: inherit;
    padding: 0;
    overflow: hidden;
}

.view-toggle-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: calc(50% - 4px);
    height: calc(100% - 6px);
    border-radius: 999px;
    background-color: var(--color-code);
    transition: left var(--transition);
}

.view-toggle[data-active="canvas"] .view-toggle-thumb {
    left: calc(50% + 1px);
    background-color: var(--color-code);
}

.view-toggle-option {
    position: relative;
    z-index: 1;
    flex: 1;
    text-align: center;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--color-ink-muted);
    pointer-events: none;
}

.view-toggle[data-active="list"] .view-toggle-option:nth-child(2),
.view-toggle[data-active="canvas"] .view-toggle-option:nth-child(3) {
    color: #fff;
}

.view-toggle-row {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-top: 48px;
    margin-bottom: 36px;
}

.view-toggle-subtitle {
    font-size: 0.85rem;
    color: var(--color-ink-muted);
}

/* Only makes sense in List mode — hidden once Canvas mode is active. */
.wrap:has(.preview-modes[data-mode="canvas"]) .view-toggle-subtitle {
    display: none;
}

/*========================
    PREVIEW MODES (list <-> canvas swap)
==========================*/

.preview-modes[data-mode="list"] .mode-canvas {
    display: none;
}

.preview-modes[data-mode="canvas"] .mode-list {
    display: none;
}

.mode-list {
    position: relative;
    overflow: hidden;
}

/*========================
    SITE LIST (list mode)
==========================*/

.site-list {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
    text-align: left;
}

@media (max-width: 480px) {
    .site-list {
        grid-template-columns: 1fr;
    }
}

.site-card {
    display: flex;
    flex-direction: column;
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    overflow: hidden;
    color: var(--color-ink);
}

.site-card:hover {
    border-color: var(--color-code);
    text-decoration: none;
}

.site-card--placeholder {
    border-style: dashed;
}

.site-card-thumb {
    aspect-ratio: 16 / 9;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--thumb-color, var(--color-code));
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: 1.2rem;
    color: #fff;
    overflow: hidden;
}

.site-card-thumb img,
.site-card-thumb video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
}

.site-card-body {
    padding: 14px 16px 4px;
    flex: 1;
}

.site-card-body h3 {
    font-size: 1rem;
    margin-bottom: 4px;
}

.site-card-body p {
    font-size: 0.85rem;
    color: var(--color-ink-muted);
}

.site-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px 14px;
    font-family: var(--font-mono);
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--color-code);
}

/*========================
    SITE LIST — compact mode ([data-compact])
    A plain list: name + one-sentence tagline on the left, a Preview
    button on the right that reveals the thumbnail video/image inline
    when clicked. Used for the Websites page's List mode.
==========================*/

.site-list[data-compact] {
    display: block;
    border-top: 1px solid var(--color-border);
}

.site-row-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 4px;
    border-bottom: 1px solid var(--color-border);
}

.site-row-info {
    min-width: 0;
}

.site-row-name {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--color-ink);
}

.site-row-name:hover {
    color: var(--color-code);
    text-decoration: none;
}

.site-row-tagline {
    font-size: 0.85rem;
    color: var(--color-ink-muted);
    margin-top: 2px;
}

.site-row-status {
    font-family: var(--font-mono);
    font-size: 0.78rem;
    color: var(--color-ink-muted);
    flex-shrink: 0;
}

.site-row-actions {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    gap: 10px;
}

.site-row-preview-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 8px 20px;
    border-radius: 6px;
    border: 1px solid var(--color-ink);
    background: transparent;
    color: var(--color-ink);
    font-family: var(--font-mono);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--transition), color var(--transition);
}

.site-row-preview-btn:hover,
.site-row-preview-btn[aria-expanded="true"] {
    background-color: var(--color-code);
    border-color: var(--color-code);
    color: #fff;
}

.site-row-visit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 8px 20px;
    border-radius: 6px;
    border: 1px solid var(--color-code);
    background-color: var(--color-code);
    color: #fff;
    font-family: var(--font-mono);
    font-size: 0.85rem;
    font-weight: 600;
    transition: background-color var(--transition), border-color var(--transition);
}

.site-row-visit-btn:hover {
    background-color: var(--color-accent-text);
    border-color: var(--color-accent-text);
    color: #fff;
    text-decoration: none;
}

.site-row-media {
    aspect-ratio: 16 / 9;
    margin: 18px 4px;
    border-radius: var(--radius);
    overflow: hidden;
    background-color: var(--color-code);
}

.site-row-media img,
.site-row-media video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/*========================
    CANVAS BOARD (canvas mode)
    A large pannable 2D surface: code-canvas.ch sits at the center,
    the other sites are positioned around it (js/canvas-board.js), a
    corner minimap shows every node plus the current viewport, and a
    small directional pad offers a non-drag way to pan.
==========================*/

.canvas-board {
    position: relative;
    height: 420px;
    border-radius: var(--radius);
    overflow: hidden;
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    cursor: grab;
    touch-action: none;
    user-select: none;
}

/* Hero-style full-bleed variant (Websites page canvas mode): fixed behind
   everything, filling the viewport from the nav bar to the very bottom of
   the screen — the toggle switch and footer float on top of it. */
.canvas-board--tall {
    position: fixed;
    top: var(--nav-height);
    left: 0;
    width: 100vw;
    height: calc(100vh - var(--nav-height));
    margin: 0;
    border-radius: 0;
    border: none;
    z-index: -1;
}

.canvas-board.is-dragging {
    cursor: grabbing;
}

.canvas-viewport {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.canvas-surface {
    position: absolute;
    top: 0;
    left: 0;
    width: 2200px;
    height: 1500px;
}

/* The hero-replica mural (js/canvas-board.js) lives on its own layer,
   separate from the nodes/lines drawn on top, so its opacity can be
   lowered without fading the actual content. */
.canvas-mural {
    position: absolute;
    inset: 0;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: top left;
    opacity: 0.5;
}

.canvas-lines {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
}

.canvas-lines line {
    stroke: var(--color-border);
    stroke-width: 1.5;
}

.canvas-node {
    position: absolute;
    width: 180px;
    transform: translate(-50%, -50%);
    background-color: var(--color-code);
    border: 1px solid var(--color-code);
    border-radius: var(--radius);
    padding: 12px 14px;
    color: #fff;
}

.canvas-node:hover {
    border-color: var(--color-accent-text);
    text-decoration: none;
}

.canvas-node h3 {
    font-size: 0.9rem;
    margin-bottom: 4px;
}

.canvas-node p {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.75);
}

.canvas-node--placeholder {
    border-style: dashed;
}

.canvas-node-badge {
    display: inline-block;
    font-family: var(--font-mono);
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 6px;
}

/* First-visit-only overlay, shown the first time Canvas mode is opened
   after a page load (see js/view-toggle.js) — fades in, holds briefly,
   fades out, and never blocks dragging underneath it. */
.canvas-tutorial {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-align: center;
    background-color: rgba(10, 20, 16, 0.85);
    color: #fff;
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}

.canvas-tutorial.is-visible {
    opacity: 1;
}

.canvas-tutorial[hidden] {
    display: none;
}

.canvas-tutorial p {
    font-size: 1.1rem;
    font-weight: 600;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.canvas-tutorial.is-visible p {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.3s;
}

/* directional pad — bottom-left, opposite the minimap */
.canvas-pad {
    position: fixed;
    left: 12px;
    bottom: 12px;
    z-index: 3;
    display: grid;
    grid-template-columns: repeat(3, 28px);
    grid-template-rows: repeat(3, 28px);
    gap: 3px;
}

.canvas-pad-btn {
    grid-column: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 4px;
    color: var(--color-ink-muted);
    cursor: pointer;
}

.canvas-pad-btn[data-dir="left"] {
    grid-column: 1;
    grid-row: 2;
}

.canvas-pad-btn[data-dir="right"] {
    grid-column: 3;
    grid-row: 2;
}

.canvas-pad-btn[data-dir="up"] {
    grid-row: 1;
}

.canvas-pad-btn[data-dir="down"] {
    grid-row: 3;
}

.canvas-pad-btn:hover {
    color: var(--color-code);
    border-color: var(--color-code);
}

/* corner minimap — dots for every node's fixed position, a highlighted
   dot for code-canvas.ch, and a rectangle tracking the visible area */
.canvas-minimap {
    position: fixed;
    right: 12px;
    bottom: 12px;
    z-index: 3;
    width: 120px;
    height: 82px;
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 6px;
    overflow: hidden;
}

.canvas-minimap-dot {
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--color-ink);
    transform: translate(-50%, -50%);
}

.canvas-minimap-dot--center {
    width: 8px;
    height: 8px;
    background-color: var(--color-code);
}

.canvas-minimap-viewport {
    position: absolute;
    border: 1.5px solid var(--color-canvas);
    pointer-events: none;
}

@media (max-width: 700px) {
    .canvas-board,
    .canvas-board--tall {
        height: 340px;
    }
}

/*========================
    FEES PAGE
==========================*/

.fee-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    align-items: stretch;
    margin-top: 28px;
}

.fee-card {
    display: flex;
    flex-direction: column;
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 28px 24px;
}

.fee-card--featured {
    border-color: var(--color-code);
    border-width: 2px;
}

.fee-card-badge {
    display: inline-block;
    align-self: flex-start;
    font-family: var(--font-mono);
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #fff;
    background-color: var(--color-code);
    padding: 4px 10px;
    border-radius: 999px;
    margin-bottom: 14px;
}

.fee-card h3 {
    font-size: 1.1rem;
    margin-bottom: 6px;
}

.fee-card-tagline {
    color: var(--color-ink-muted);
    font-size: 0.87rem;
    margin-bottom: 16px;
}

.fee-card-price {
    font-family: var(--font-mono);
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 4px;
}

.fee-card-price span {
    font-size: 0.82rem;
    font-weight: 400;
    color: var(--color-ink-muted);
}

.fee-card-includes {
    margin: 18px 0 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.fee-card-includes li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 0.88rem;
}

.fee-card-includes li::before {
    content: '+';
    flex-shrink: 0;
    color: var(--color-code);
    font-weight: 700;
}

.fee-card .btn {
    align-self: flex-start;
}

/* Left to right: light green, dark green, light green — each switches to
   its "pink equivalent" (same lightness, pink instead of green) on hover.
   The middle card is dark enough that its text/border/bullet colors need
   to flip to light for contrast, on both its base and hover backgrounds.
   On the Fees page these cards are also .reveal-item — js/scroll-reveal.js
   sets their complete transition (this background-color plus the reveal's
   opacity/transform) inline, so it always wins outright over this rule
   rather than the two cascading unpredictably against each other. */
.fee-grid .fee-card:nth-child(1),
.fee-grid .fee-card:nth-child(3) {
    background-color: #e3f0e8;
    transition: background-color var(--transition);
}

.fee-grid .fee-card:nth-child(1):hover,
.fee-grid .fee-card:nth-child(3):hover {
    background-color: #f8dcea;
}

.fee-grid .fee-card:nth-child(2) {
    background-color: var(--color-code);
    color: #fff;
    transition: background-color var(--transition);
}

/* Mobile only: each fee card enters from a different direction — the
   first slides up (the .reveal-item default), the second in from the
   left, the third in from the right. The reset selectors below carry one
   extra class each (5 vs 4) than the entrance rules above them, so
   reveal-item-visible's transform: none actually wins the cascade instead
   of losing to the more specific entrance rule — without that, the cards
   would fade in opacity but stay stuck at their sideways offset forever.
   Desktop keeps the uniform slide-up for all three. */
@media (max-width: 768px) {
    .fee-grid .fee-card:nth-child(2).reveal-item {
        transform: translateX(-45px);
    }

    .fee-grid .fee-card:nth-child(3).reveal-item {
        transform: translateX(45px);
    }

    .fee-grid .fee-card:nth-child(2).reveal-item.reveal-item-visible,
    .fee-grid .fee-card:nth-child(3).reveal-item.reveal-item-visible {
        transform: none;
    }
}

.fee-grid .fee-card:nth-child(2):hover {
    background-color: #7a2450;
    border-color: var(--color-accent-text);
}

.fee-grid .fee-card:nth-child(2) .fee-card-tagline,
.fee-grid .fee-card:nth-child(2) .fee-card-price span {
    color: rgba(255, 255, 255, 0.75);
}

.fee-grid .fee-card:nth-child(2) .fee-card-includes li::before {
    color: var(--color-accent-text);
}

.fee-grid .fee-card:nth-child(2) .btn {
    border-color: rgba(255, 255, 255, 0.7);
    color: #fff;
}

.fee-grid .fee-card:nth-child(2) .btn:hover {
    background-color: var(--color-accent-text);
    border-color: var(--color-accent-text);
    color: #fff;
}


/*========================
    CONTACT PAGE
==========================*/

.contact-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: start;
    margin-top: 40px;
}

.contact-info h2,
.contact-form h2 {
    font-size: 1.15rem;
    margin-bottom: 14px;
}

@media (max-width: 768px) {
    .contact-info h2 {
        font-size: 1.3rem;
        font-weight: 800;
    }
}

.contact-info p {
    color: var(--color-ink-muted);
    margin-bottom: 10px;
}

.contact-form form {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.contact-form label {
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 6px;
    display: block;
}

.contact-form input,
.contact-form textarea {
    width: 100%;
    padding: 11px 13px;
    border: 1px solid var(--color-border);
    border-radius: 6px;
    font-family: inherit;
    font-size: 0.95rem;
    background-color: var(--color-surface);
    color: var(--color-ink);
}

.contact-form textarea {
    min-height: 120px;
    resize: vertical;
}

.contact-form .form-status {
    font-size: 0.85rem;
    color: var(--color-code);
    min-height: 1.2em;
}

/*========================
    FOOTER
==========================*/

footer {
    text-align: center;
    padding: 26px 20px;
    background-color: rgba(246, 244, 238, 0.6);
    color: var(--color-ink-muted);
    font-size: 0.85rem;
}

/* Matches .preview-section's opacity so the homepage's last section and
   the footer right after it read as one continuous translucent block. */
body[data-page="home"] footer {
    background-color: rgba(246, 244, 238, 0.48);
}

/* Canvas mode's board is its own fixed, full-screen background (see
   .canvas-board--tall) — let it show straight through the footer instead
   of the usual translucent page-background fill, with white text so it
   still reads against the dark mural. */
body[data-page="websites"]:has(.preview-modes[data-mode="canvas"]) footer {
    background-color: transparent;
    color: #fff;
}

/*========================
    RESPONSIVE — MOBILE
==========================*/

@media (max-width: 860px) {
    .contact-layout {
        grid-template-columns: 1fr;
        gap: 34px;
    }
}

@media (max-width: 768px) {
    /* Turns the hero into the smudge surface: a drag here smudges
       (js/hero-canvas.js) instead of scrolling the page. .hero-scroll-cue
       (js/hero-canvas.js again) provides the escape route with its own
       JS-driven scroll, unaffected by this. */
    #hero {
        touch-action: none;
    }

    /* Logo, toggle and language switch share the nav bar's two equal 1fr
       side columns; the logo's own min-content width was crowding the
       toggle/language switch toward the edges, so it's trimmed down here. */
    .nav-logo {
        font-size: 1.05rem;
    }

    /* The three hero-band pages (fees, contact, websites) each carry their
       own top padding above .page-header (#fees-page/#websites-page's own
       padding-top override, #contact's inherited from the global
       `section { padding: 70px 0; }`) — flat background-colored space the
       smudge canvas fills before the actual photo starts. Zeroed here so
       the photo sits flush against the nav bar with no gap on mobile. */
    #fees-page,
    #contact,
    #websites-page {
        padding-top: 0;
    }

    /* Reveal animations play noticeably quicker on mobile than the desktop
       defaults above (js/scroll-reveal.js mirrors this split for the
       per-item stagger timing) — mobile is scroll-triggered, so a slow
       cascade reads as the content being stuck rather than animating in. */
    .reveal {
        transition: opacity 0.4s ease, transform 0.4s ease;
    }

    .reveal-item {
        transition: opacity 0.35s ease, transform 0.35s ease;
    }

    /* Contact's two items are large screen-filling blocks — the base 20px
       slide barely registers at that scale, so it's a "down to up" motion
       worth actually seeing (js/scroll-reveal.js gives it a slightly
       longer duration to match). */
    #contact .reveal-item {
        transform: translateY(48px);
    }

    .hero-actions {
        display: none;
    }

    /* Canvas mode is drag/pan-driven and never shown by default anyway
       (data-mode starts at "list") — hiding the toggle just removes the
       only way to reach it, leaving List mode as the whole experience. */
    .view-toggle-row {
        display: none;
    }

    .nav-toggle {
        display: flex;
    }

    .nav-links {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        background-color: var(--color-code);
        border-top: 1px solid rgba(255, 255, 255, 0.15);
        max-height: 0;
        overflow: hidden;
        transition: max-height var(--transition);
    }

    .site-nav.nav-open .nav-links {
        max-height: 80vh;
        overflow-y: auto;
    }

    .nav-links > li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }

    .nav-link {
        display: block;
        border-radius: 0;
        padding: 14px 24px;
    }

    .section-title {
        font-size: 1.5rem;
    }

    /* Name + tagline stack as two lines, with the action buttons below
       them instead of squeezed alongside on the same row. */
    .site-row-main {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .site-row-actions {
        flex-wrap: wrap;
    }
}

.legal-content {
    max-width: 720px;
    margin: 0 auto;
    padding: 56px 24px 90px;
}

.legal-content h2 {
    font-size: 1.3rem;
    margin: 40px 0 12px;
}

.legal-content h2:first-child {
    margin-top: 0;
}

.legal-content p {
    color: var(--color-ink-muted);
    margin-bottom: 10px;
}

.legal-content address {
    font-style: normal;
    color: var(--color-ink-muted);
    margin-bottom: 10px;
}

.legal-content .placeholder {
    color: var(--color-canvas);
    font-weight: 600;
}