/* Walk Done marketing site: shared styles.
   Ported 1:1 from the Claude Design handoff bundle (walk-done-website-design).
   Holds the design tokens, base typography, keyframes, the 16-tile grid, the
   responsive nav rules, plus the real :hover / :focus rules that replace the
   prototype's inline style-hover / style-focus attributes, the scroll-reveal
   fade, and the Contact popup. No em dashes anywhere, per house style. */

@font-face {
  font-family: 'Caveat';
  src: url('fonts/Caveat-Medium.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
}

/* Newsreader / Geist / JetBrains Mono, self-hosted. Mirrored from the Google
   Fonts css2 payload (same subsets + unicode-range, so per-script fallback is
   identical); files live in assets/fonts/. No third-party requests. */
/* cyrillic-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/geist-normal-400-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/geist-normal-400-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/geist-normal-400-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/geist-normal-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/geist-normal-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/geist-normal-500-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/geist-normal-500-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/geist-normal-500-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/geist-normal-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/geist-normal-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/geist-normal-600-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/geist-normal-600-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/geist-normal-600-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/geist-normal-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/geist-normal-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-400-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-400-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-400-greek.woff2') format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-400-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-500-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-500-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-500-greek.woff2') format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-500-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/jetbrains-mono-normal-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/newsreader-italic-400-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/newsreader-italic-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/newsreader-italic-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/newsreader-italic-500-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/newsreader-italic-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/newsreader-italic-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/newsreader-normal-400-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/newsreader-normal-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/newsreader-normal-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/newsreader-normal-500-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/newsreader-normal-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/newsreader-normal-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/newsreader-normal-600-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/newsreader-normal-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/newsreader-normal-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --wd-paper: #F4EFE6; --wd-paper-raised: #FBF8F1; --wd-card: #FFFDF8;
  --wd-ink: #20231C; --wd-body: #3E4038; --wd-muted: #7C7C73;
  --wd-hairline: rgba(28,29,24,0.10); --wd-hairline2: rgba(28,29,24,0.14); --wd-hairline3: rgba(28,29,24,0.16); --wd-hairline22: rgba(28,29,24,0.22);
  --wd-moss: #5F7A4E; --wd-terra: #B35A3A; --wd-mist: #4DA3C7; --wd-ochre: #C69440;
  --wd-halo-moss: #D6DEC5; --wd-halo-terra: #E8C8B4; --wd-halo-mist: #C3D4DC;
  --wd-nav-bg: rgba(244,239,230,0.92);
  --wd-tile-bg: #FFFDF8;
  --wd-elev: #FFFDF8;
  --wd-navname: #5F7A4E;
  /* --wd-logo-edge (a light green rim on the nav's app-icon chip) is retired.
     It existed because the old mark was transparent artwork on a supplied
     white plate, which had no edge of its own against the paper. The app icon
     now carries its own opaque pale ground, so the chip supplies no plate and
     borrows no brand colour: it takes the ordinary --wd-hairline2 rule, which
     is all a pale ground needs to read as a tile on paper (#FFFFD0 on
     #F4EFE6 is 1.12:1 unaided) and which follows the theme. */
}
html[data-theme="dark"] {
  --wd-paper: #1D2A1F; --wd-paper-raised: #223020; --wd-card: #2A3A2A;
  --wd-ink: #F4EFE6; --wd-body: #D6DEC5; --wd-muted: #9FAE86;
  --wd-hairline: rgba(244,239,230,0.15); --wd-hairline2: rgba(244,239,230,0.18); --wd-hairline3: rgba(244,239,230,0.20); --wd-hairline22: rgba(244,239,230,0.28);
  --wd-moss: #8FA876; --wd-terra: #E8A083; --wd-mist: #9FC1CE; --wd-ochre: #E8C078;
  --wd-halo-moss: #2F4231; --wd-halo-terra: #42261B; --wd-halo-mist: #253A40;
  --wd-nav-bg: rgba(29,42,31,0.92);
  --wd-tile-bg: #FFFDF8;
  --wd-elev: #35482F;
  --wd-navname: #D6DEC5;
}

html { scroll-behavior: smooth; }
body { margin: 0; background: var(--wd-paper); color: var(--wd-ink); font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif; -webkit-font-smoothing: antialiased; transition: background 0.3s ease, color 0.3s ease; }
a { color: var(--wd-ink); }
a:hover { color: var(--wd-terra); }
::selection { background: #EAD8B3; }

@keyframes wd-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }

[data-grid16] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
@media (min-width: 720px) { [data-grid16] { grid-template-columns: repeat(4, 1fr); gap: 20px; } }

@media (max-width: 600px) {
  nav[aria-label="Main"] { gap: 8px !important; padding-left: 14px !important; padding-right: 14px !important; }
  [data-navmark] { font-size: 25px !important; }

  /* The language, theme, and Get-the-app controls are too crowded next to the
     wordmark on phones, so they collapse behind a hamburger. The SAME elements
     are relocated into a dropdown (not duplicated), so their JS wiring keeps
     working; only the toggle is new. */
  [data-nav-toggle] { display: inline-flex !important; }
  [data-nav-controls] {
    display: none !important;
    position: absolute;
    top: calc(100% + 10px);
    inset-inline-end: 14px;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px !important;
    width: min(248px, calc(100vw - 28px));
    padding: 16px !important;
    background: var(--wd-card);
    border: 1px solid var(--wd-hairline2);
    border-radius: 18px;
    box-shadow: 0 18px 44px rgba(21, 32, 26, 0.28);
  }
  nav[aria-label="Main"][data-nav-open] [data-nav-controls] { display: flex !important; }
  /* Get-the-app spans the panel on its own row; language + theme share the row above. */
  [data-nav-controls] [data-navcta] { flex-basis: 100%; justify-content: center; }

  /* Center the app-store badges and the wearable-OS pills once the sections stack. */
  .wd-hero-badges, .wd-wrist-pills { justify-content: center; }
}

/* ── Interaction states (replace the prototype's style-hover / style-focus) ── */
.wd-skip:focus { left: 12px !important; }
[data-navcta]:hover { color: #20231C; transform: translateX(3px); }
.wd-badge:hover { color: var(--wd-paper); transform: translateY(-1px); }
.wd-pill:hover { color: #20231C; transform: translateX(3px); }

/* ── Scroll reveal (replaces the per-page data-fade IntersectionObserver) ──
   The hidden start state is gated behind .wd-js (added by wd-site.js), so with
   JavaScript off or failed the content stays fully visible, matching the
   design, which applied opacity:0 from JS rather than in static CSS. */
.wd-fade { transition: opacity 0.7s ease, transform 0.7s ease; will-change: opacity, transform; }
.wd-js .wd-fade { opacity: 0; transform: translateY(14px); }
.wd-js .wd-fade.is-in { opacity: 1; transform: none; }

/* Tile hover lift + shadow. One stable transition so the reveal never drops
   opacity from the list (which would make it jump): opacity fades over 0.7s,
   the reveal slide + hover lift + shadow are the snappy 0.2s. Declared AFTER
   .wd-fade / .wd-fade.is-in so, at equal specificity, source order wins:
   .wd-tile's transition wins and .wd-tile:hover reclaims the transform. */
.wd-tile { transition: opacity 0.7s ease, transform 0.2s ease, box-shadow 0.2s ease; }
.wd-tile:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(32,35,28,0.08); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; transition: none !important; }
  .wd-js .wd-fade { opacity: 1; transform: none; }
}

/* ── Hero language strip ───────────────────────────────────────────────
   One slow seamless line of the 30 native language names under the hero
   badges. Two identical .wd-langstrip__set copies inside the track; the
   keyframe travels exactly one copy (-50%) so the loop never jumps. LTR is
   forced so the mixed-script list flows the same on Arabic/Hebrew pages.
   The global prefers-reduced-motion rule stops the animation, leaving a
   static edge-faded list. Native names are intentionally NOT translated. */
.wd-langstrip { overflow: hidden; direction: ltr;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%); }
.wd-langstrip__track { display: inline-block; white-space: nowrap; animation: wd-langscroll 70s linear infinite; will-change: transform; }
.wd-langstrip:hover .wd-langstrip__track { animation-play-state: paused; }
.wd-langstrip__set { display: inline-block; white-space: nowrap; font-family: 'JetBrains Mono', monospace; font-size: 13px; letter-spacing: 0.03em; color: var(--wd-body); }
@keyframes wd-langscroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ── Contact popup ─────────────────────────────────────────────────────── */
.wd-modal { position: fixed; inset: 0; z-index: 1000; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(21,32,26,0.55); backdrop-filter: blur(4px); }
.wd-modal.is-open { display: flex; }
.wd-modal__panel { position: relative; width: min(520px, 100%); max-height: 90vh; overflow-y: auto; background: var(--wd-card); border: 1px solid var(--wd-hairline2); border-radius: 24px; box-shadow: 0 24px 64px rgba(21,32,26,0.35); padding: clamp(24px,4vw,34px); }
.wd-modal__close { position: absolute; inset-inline-end: 16px; top: 16px; width: 38px; height: 38px; border: none; border-radius: 50%; background: var(--wd-paper-raised); color: var(--wd-ink); font-size: 22px; line-height: 1; cursor: pointer; }
.wd-modal__eyebrow { margin: 0 0 10px; font-family: 'JetBrains Mono', monospace; font-size: 14px; letter-spacing: 0.03em; color: var(--wd-terra); }
.wd-modal__title { margin: 0 0 8px; font-family: 'Newsreader', Georgia, serif; font-weight: 500; font-size: clamp(26px,4vw,32px); line-height: 1.1; color: var(--wd-ink); }
.wd-modal__sub { margin: 0 0 22px; font-size: 16px; line-height: 1.55; color: var(--wd-body); }
.wd-field { display: flex; flex-direction: column; gap: 7px; margin: 0 0 16px; }
.wd-field label { font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: 0.03em; color: var(--wd-muted); }
.wd-field input, .wd-field textarea { font-family: inherit; font-size: 16px; color: var(--wd-ink); background: var(--wd-paper-raised); border: 1.5px solid var(--wd-hairline2); border-radius: 12px; padding: 12px 14px; width: 100%; box-sizing: border-box; transition: border-color 0.15s ease, box-shadow 0.15s ease; }
.wd-field textarea { resize: vertical; min-height: 120px; }
.wd-field input:focus, .wd-field textarea:focus { outline: none; border-color: #F28C38; box-shadow: 0 0 0 3px rgba(242,140,56,0.22); }
.wd-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.wd-modal__submit { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; width: 100%; padding: 12px 32px; background: #F28C38; color: #20231C; border: none; border-radius: 999px; font-family: inherit; font-weight: 600; font-size: 18px; cursor: pointer; transition: transform 0.15s ease, opacity 0.15s ease; }
.wd-modal__submit:hover { transform: translateY(-1px); }
.wd-modal__submit:disabled { opacity: 0.6; cursor: default; transform: none; }
.wd-modal__note { margin: 14px 0 0; font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: 0.03em; color: var(--wd-muted); text-align: center; min-height: 1em; }
.wd-modal__note.is-error { color: var(--wd-terra); }
.wd-modal__note.is-ok { color: var(--wd-moss); }
.wd-modal__success { text-align: center; padding: 8px 0 4px; }
.wd-modal__success h2 { margin: 0 0 10px; font-family: 'Newsreader', Georgia, serif; font-weight: 500; font-size: clamp(26px,4vw,32px); color: var(--wd-ink); }
.wd-modal__success p { margin: 0 0 20px; font-size: 16px; line-height: 1.55; color: var(--wd-body); }