/* Phones (<=899px): loaded last on every page. Mobile is designed on its own at 390x844;
   desktop never sees these rules. PlexM carries the real 500 and 600 cuts (desktop Plex is 400 only). */
@font-face { font-family:PlexM; src:url("/assets/plex-sans-500.woff2") format("woff2"); font-weight:500; font-display:swap; }
@font-face { font-family:PlexM; src:url("/assets/plex-sans-600.woff2") format("woff2"); font-weight:600; font-display:swap; }
@font-face { font-family:PlexM; src:url("/assets/plex-sans.woff2") format("woff2"); font-weight:400; font-display:swap; }
.m-only, .m-text { display:none; }
@media (max-width:899px) {
  :root { --m-green:#04a957; --m-green-ink:#0d0f0e; --m-ink:#0d0f0e; --m-pad:24px; --m-frame:calc(100svh - 53px); --m-full:100svh; --m-footer:298px; }
  @media (min-width:421px) { :root { --m-footer:279px; } } /* the five-link footer, measured 13 Oct; the legal line fits one line above 420px */
  body { font-family:PlexM,Plex,sans-serif; }
  .m-only { display:block; }
  .m-text { display:inline; }
  .d-text { display:none; }
  .m-hide { display:none !important; }  /* desktop copy that moves to its own phone frame */

  /* ---- home hero: the seal on top, the words centred under it, one frame, white ground (2026-10-12) ---- */
  .homepage .hero {
    min-height:var(--m-frame); box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; align-items:center;
    text-align:center; padding:24px var(--m-pad); margin:0; background:#fff; clip-path:none;
  }
  .homepage .hero-wheel {
    display:block; position:static; order:-1; flex:0 0 auto; transform:none; margin:0 auto 22px;
    width:min(84vw, calc((100svh - 53px) * .5), 420px); height:auto; aspect-ratio:1;
  }
  .homepage .hero-copy { width:100%; max-width:none; flex:0 0 auto; display:flex; flex-direction:column; align-items:center; }
  .homepage .hero h1 { margin:0; font-weight:600; font-size:clamp(36px,10vw,44px); line-height:1.04; letter-spacing:-.035em; color:#0d0f0e; text-wrap:balance; }
  .homepage .hero h1 span { display:block; }
  .homepage .hero .hero-tagline { display:none; }
  /* phones: the header is a centred mark that scrolls away with the page; no rule under it, no hide/show */
  .header { position:static !important; border-bottom:0 !important; background:#fff; transform:none !important; }
  .header-inner { justify-content:center; min-height:53px; }
  .header .company-wordmark { margin:0 auto; }
  .homepage .hero-tagline .m-line { display:block; }
  .homepage .hero .m-answers { display:none; }
  .homepage .hero-actions { margin-top:28px !important; width:100%; display:flex; flex-direction:column; align-items:center; gap:18px; }
  .homepage .hero-actions .button { display:flex; width:100%; min-height:60px; box-sizing:border-box; justify-content:space-between; font-weight:600; font-size:16px; }
  .homepage .hero-actions .text-link { display:inline-flex; font-weight:500; font-size:16px; color:#0d0f0e; }
  @media (max-height:700px) { .homepage .hero-wheel { width:min(86vw, calc((100svh - 53px) * .40), 400px); margin-bottom:16px; } .homepage .hero-actions { margin-top:20px !important; } }

  /* ---- interior heroes: no art, the title and its answer, then straight into the page ---- */
  /* interior hero is one frame like the home hero (12 Oct, interior pass): the seal, the title, the answer, centred */
  main .page-heading, main .page-heading:has(.page-wheel) {
    min-height:var(--m-frame) !important; height:auto !important; box-sizing:border-box; justify-content:center;
    padding:24px var(--m-pad) !important; margin:0; border-bottom:0; background:#fff;
  }
  main .page-heading, main .page-heading:has(.page-wheel) { display:flex; flex-direction:column; align-items:center; text-align:center; clip-path:none; }
  main .page-wheel, main .wheel-clear .page-wheel { display:block; position:static; order:-1; flex:0 0 auto; width:min(calc(100vw - 48px), calc((100svh - 53px) * .46), 400px); height:auto; aspect-ratio:1; margin:0 0 32px; transform:none; }
  @media (max-height:700px) { main .page-wheel, main .wheel-clear .page-wheel { width:min(56vw, calc((100svh - 53px) * .30), 260px); margin-bottom:20px; } }
  /* every phone frame: one claim, one exhibit, centred, its own ground */
  main .m-screen { min-height:var(--m-frame); box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:40px var(--m-pad) 44px !important; margin:0; border-top:0 !important; text-align:center; }
  /* the first frame sits under the 53px header; every later frame is exactly one viewport (brief 08, rule 1) */
  main .m-screen:not(.page-heading) { min-height:var(--m-full); }
  main .m-screen > * { width:100%; max-width:none; }
  main .m-screen h2 { margin:0; font-weight:600; font-size:30px !important; line-height:1.08 !important; letter-spacing:-.03em; color:var(--m-ink); text-wrap:balance; text-align:center; }
  main .m-screen .m-sub { margin:12px 0 0; font-weight:500; font-size:18px !important; line-height:1.35; color:var(--m-ink) !important; text-wrap:balance; text-align:center; }
  main .m-screen .m-fine { margin:18px 0 0; font-size:14px !important; line-height:1.4; color:var(--m-ink); text-wrap:balance; }
  main .m-screen .m-rows { list-style:none; width:100%; margin:28px 0 0; padding:0; border-top:2px solid var(--m-ink); text-align:left; }
  main .m-screen .m-rows li { border-bottom:1px solid var(--line); }
  main .m-screen .button { display:flex; width:100%; box-sizing:border-box; justify-content:center; margin-top:28px; min-height:56px; font-size:17px; }
  main .m-screen .m-big { display:block; margin:28px 0 0; font-weight:600; font-size:64px; line-height:1; letter-spacing:-.04em; color:var(--m-ink); }
  main .m-screen .m-big.m-ok { color:var(--m-green); }
  main .m-ground-green { background:#e6f5ec !important; }
  main .m-ground-grey { background:#f2f4f3 !important; }
  main .m-ground-ink { background:#18231e !important; color:#fff; }
  main .m-ground-ink h2, main .m-ground-ink .m-sub, main .m-ground-ink p, main .m-ground-ink li, main .m-ground-ink a { color:#fff !important; }
  main .page-heading h1 { margin:0; font-weight:600; font-size:clamp(40px,12vw,48px) !important; line-height:1; letter-spacing:-.04em; color:var(--m-ink); text-wrap:balance; }
  main .page-heading .lead { margin:16px 0 0 !important; max-width:none; font-weight:500; font-size:19px !important; line-height:1.35; letter-spacing:-.01em; color:var(--m-ink) !important; text-wrap:balance; }
  main .page-heading > p:not(.lead) { font-size:16px; line-height:1.5; color:var(--m-ink); }
  main .page-heading > .text-link { display:none; }

  /* ---- centred on phones (Jared, 12 Oct): titles, leads, CTAs; row lists stay left ---- */
  main .button, main .button.dark, .homepage .hero-actions .button, main .contact-inner .button, #finder button[type="submit"] { justify-content:center !important; gap:10px; }
  main h2:not(.film-sr), main .page-heading .lead, main .finder-intro, main .contact-inner .close-line, #open p, #open .home-built, main .m-sub, main .section-lead, main .page-heading > p { text-align:center; }
  main .hero-actions, main .contact-copy, main .finder-form, #finder .finder-helper, #finder .finder-field, #finder .finder-status { align-items:center; text-align:center; }
  main .contact-inner .contact-copy { display:flex; flex-direction:column; align-items:center; gap:12px; }
  main .page-heading > .text-link, main .page-heading .button { align-self:center; }
  /* ---- the shared phone type scale (12 Oct 2026): h1 36-44, h2 30, h3 20, sub 18, body 16, labels 14 ---- */
  main h2:not(.film-sr), main section h2:not(.film-sr), main .page-closing h2, main .commitments h2 { font-size:30px !important; line-height:1.1 !important; letter-spacing:-.03em; }
  main h3:not(.film-sr) { font-size:20px !important; line-height:1.2; }
  main p.m-sub, main p.m-result, main p.m-sublead, main p.m-claim-title, main .finder-intro, main .ref-intro { font-size:18px !important; line-height:1.35; }
  main .button { min-height:56px; font-size:17px; }
  #finder h2, #open h2, main .contact-inner h2 { font-size:30px !important; }
  /* ---- the shared phone type floor ---- */
  main { color:var(--m-ink); }
  main p, main li, main dd, main summary, main td { font-size:max(16px, 1em); line-height:1.5; }
  main h2 { font-weight:600; letter-spacing:-.03em; text-wrap:balance; }
  main .button { min-height:60px; font-weight:600; font-size:16px; }
  main .text-link { font-weight:500; font-size:16px; }

  /* ---- the film covers the whole frame under the header; the bar and the control sit on top of it ---- */
  #film.film-section, .film-pin > #film.film-section { position:relative; height:var(--m-full); min-height:0; padding:0; display:block; overflow:hidden; }
  .film-pin { height:auto; }
  #film .film, #film .film.film-portrait { position:absolute; inset:0; width:100% !important; height:100% !important; max-height:none; aspect-ratio:auto; margin:0; }
  #film .film video { display:block; width:100%; height:100%; object-fit:cover; }
  /* the control sits centred in the cut's bottom band (194 of 2200px), under the three outcome labels; the finder CTA leaves the film on phones (13 Oct) */
  #film .film .film-ctl { position:absolute; left:calc(50% - 22px); right:auto; top:auto; bottom:14px; width:44px; height:44px; opacity:1; z-index:3; }
  #film .film-bar { position:absolute; left:0; right:0; bottom:0; z-index:2; min-height:0; padding:0; background:none; }
  #film .film-cta { display:none !important; }
  #film .film-text { display:none; }

  /* ---- closing frames shared by every page: finder, open verifier, contact + footer (one frame together) ---- */
  #finder, #open, #contact { min-height:var(--m-full); box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:40px var(--m-pad) !important; margin:0; background:#fff !important; border-top:0; text-align:center; }
  #finder > *, #open > * { width:100%; max-width:none; }
  #finder { background:#e6f5ec !important; min-height:var(--m-full); }  /* phones: a full frame; as a 50svh part its 627px of content left a cut sliver of the verifier under it */
  #open { background:#f2f4f3 !important; min-height:34svh; }
  #finder::before, #open::before, #contact::before { display:none; }
  #finder .finder-form { margin-top:32px; }
  #finder .finder-field { gap:12px; }
  #finder .finder-form .button { margin-top:8px; min-height:64px; font-size:18px; }
  #finder .finder-helper { margin-top:20px; }
  #finder .finder-status { min-height:0; margin-top:0; }
  #finder .finder-status:not(:empty) { margin-top:16px; }
  /* the close shares the last frame with the footer: --m-footer is the footer's measured phone height */
  #contact { min-height:calc(100svh - var(--m-footer)); padding:28px var(--m-pad) !important; }  /* phones: close + footer = one frame; 40svh ran the pair 53px over */
  main .contact-inner { width:100%; display:flex; flex-direction:column; align-items:center; gap:16px; }
  main .contact-inner h2 { margin-top:0 !important; }
  main .contact-inner .close-line { margin:10px 0 0 !important; max-width:none; }
  main .contact-inner > div { width:100%; }
  main .contact-inner .contact-copy { padding-top:0; gap:8px; align-items:stretch; }
  main .contact-copy .contact-email { margin-top:0 !important; }
  #finder h2, #open h2, main .contact-inner h2 { margin:0; font-weight:600; font-size:30px !important; line-height:1.04; letter-spacing:-.035em; text-wrap:balance; color:var(--m-ink); }
  #finder h2 { font-size:36px !important; line-height:1.05; }
  #finder .finder-intro, #open > div > p:first-child, main .contact-inner .close-line { margin-top:14px; font-weight:500; font-size:18px !important; line-height:1.4; color:var(--m-ink) !important; }
  #finder .finder-intro { font-size:20px !important; margin-top:16px; }
  #finder p, #open p, main .contact-inner p { line-height:1.45; }
  #finder .finder-helper { font-size:16px; color:var(--m-ink); }
  #finder .finder-field { font-size:16px; font-weight:500; color:var(--m-ink); }
  #finder input[name="url"] { min-height:68px; font-size:19px; }
  #open { display:flex; flex-direction:column; align-items:center; }
  #open .home-built { order:-1; display:flex; flex-direction:column; align-items:center; gap:8px; font-size:14px !important; color:var(--m-ink); margin:0 0 20px !important; }
  #open .home-built img { height:34px; width:auto; }
  #open > div { margin-top:8px !important; }
  main .contact-inner .button, #finder button[type="submit"] { display:flex; width:100%; justify-content:space-between; box-sizing:border-box; min-height:60px; font-weight:600; font-size:16px; }
  main .contact-inner .contact-email { font-size:16px; font-weight:500; align-self:center; text-align:center; }
  main .contact-inner .contact-copy .text-link { align-self:center; min-height:44px; }  /* one axis: the link centres with the email (13 Oct) */
  #open .open-links { display:flex; flex-direction:column; align-items:center; gap:4px; margin-top:8px; }

  /* inline links in prose: vertical padding on an inline box widens the tap area without moving a line */
  main p a:not(.button):not(.text-link), main td a:not(.button) { padding-block:12px; }

  /* ---- footer: compact, 44px link rows, 14px floor; its height is --m-footer above ---- */
  .site-footer-inner { padding:20px var(--m-pad) 16px !important; }
  .site-footer-top { display:flex !important; flex-direction:column; gap:12px !important; }
  .site-footer-brand { min-height:0 !important; padding:16px 0 !important; margin:-16px 0; }  /* a 44px tap area with no change in height */
  .site-footer-nav { gap:12px 16px !important; }
  .site-footer-col h2 { padding:0 0 6px; font-size:14px !important; }
  .site-footer-col ul { margin:4px 0 0 !important; }
  .site-footer-col li { min-height:44px !important; }
  .site-footer-col a { min-height:44px; font-size:16px; }
  .site-footer-bottom { margin-top:12px !important; gap:6px !important; }
  .site-footer-bottom p, .site-footer-bottom .site-footer-tagline { font-size:14px !important; line-height:1.4; }
}

/* Tablets and landscape phones (600 to 899px) share the phone layer with a wider gutter and a capped measure. */
@media (min-width:600px) and (max-width:899px) {
  :root { --m-pad:40px; }
  main p, main li, main dd, main summary, main .lead, main .finder-intro { max-width:62ch; }
  .homepage .hero-wheel { width:min(60vw, calc((100svh - 53px) * .44), 400px); }
  .homepage .hero-copy { max-width:560px; }
  main .contact-inner { display:grid; grid-template-columns:1fr !important; gap:24px; }
}

/* No menu on phones or small tablets (Jared, 2026-10-09): the footer carries the links. */
@media (max-width:899px) { .menu-toggle, #navigation { display:none !important; } }

/* draft15 (13 Oct 2026): every close button sits on the frame's 24px gutter like every other bar;
   the .wrap inside #contact doubled the gutter to 48px. */
@media (max-width:899px) {
  main #contact .contact-inner { padding-inline:0 !important; }
  main #contact .contact-copy .button { width:100%; }
}

/* draft16 (13 Oct 2026, Jared): fewer words, smaller type, logos and photos; paired frames; every portrait grey. */
img[src*="/assets/team/"] { filter:grayscale(1); }
@media (min-width:900px) { .m-pair { display:contents; } }
@media (max-width:899px) {
  .m-drop { display:none !important; }
  main .page-heading h1 { font-size:clamp(34px,9.6vw,40px) !important; }
  main .page-heading .lead { font-size:17px !important; margin-top:12px !important; }
  main .page-heading > p:not(.lead) { font-size:15px; }
  main h2:not(.film-sr), main section h2:not(.film-sr), main .m-screen h2, #finder h2, #open h2, main .contact-inner h2 { font-size:26px !important; }
  #finder h2 { font-size:30px !important; }
  main h3:not(.film-sr) { font-size:18px !important; }
  main .m-screen .m-sub, main p.m-sub, main p.m-sublead, main .finder-intro, main .ref-intro, #finder .finder-intro, main .contact-inner .close-line, #open > div > p:first-child { font-size:17px !important; }
  main .m-screen .button, main .developer-actions .button { min-height:52px; font-size:16px; }
  main .m-screen .m-big { font-size:52px; }
  main .page-wheel, main .wheel-clear .page-wheel { width:min(calc(100vw - 96px), calc((100svh - 53px) * .38), 320px); }
  .homepage .hero-wheel { width:min(64vw, calc((100svh - 53px) * .38), 320px); }
  #open .ov-mark { width:120px; }
  /* a pair: two desktop sections on one phone frame */
  main .m-pair { display:flex; flex-direction:column; justify-content:center; align-items:center; min-height:var(--m-full); box-sizing:border-box; padding:36px var(--m-pad) 40px; margin:0; }
  main .m-pair > section.m-screen, main .m-pair > section { min-height:0 !important; height:auto !important; padding:0 !important; margin:0 !important; background:transparent !important; box-shadow:none !important; clip-path:none !important; width:100%; }
  main .m-pair > section + section { margin-top:36px !important; }
  main .m-pair.m-ground-ink h2, main .m-pair.m-ground-ink p, main .m-pair.m-ground-ink li, main .m-pair.m-ground-ink a, main .m-pair.m-ground-ink span, main .m-pair.m-ground-ink time, main .m-pair.m-ground-ink .m-verdicts .m-error b { color:#fff !important; }
  main .m-pair.m-ground-ink .m-verdicts, main .m-pair.m-ground-ink .m-verdicts li { border-color:rgba(255,255,255,.4); }
  main .m-pair.m-ground-ink .m-verdicts .m-ok b { color:#5fe0a8 !important; }
  main .m-pair.m-ground-ink .m-verdicts .m-reject b { color:#ff7b86 !important; }
  @media (max-height:700px) { main .m-pair { padding:24px var(--m-pad) 28px; } main .m-pair > section + section { margin-top:24px !important; } }
}

/* draft16 fit pass */
@media (max-width:899px) {
  main .m-pair > section + section { margin-top:0 !important; padding-top:32px !important; }
  /* who fits */
  main .m-pair .p-fit .row-list { margin-top:20px; }
  main .m-pair .p-fit .row-list > li { padding:14px 0 !important; }
  main .m-pair .p-days .partners-figure { margin:20px 0 0; }
  main .m-pair .p-days .gap-options { gap:10px; }
  main .m-pair .p-days .gap-option { grid-template-columns:72px minmax(0,1fr); column-gap:14px; align-items:center; }
  main .m-pair .p-days .gap-scene { max-width:72px; }
  main .m-pair .p-days .gap-label { align-self:center; font-size:17px; }
  /* what you shape + three questions */
  main .m-pair .p-shape .row-list { margin-top:20px; }
  main .m-pair .p-shape .row-list > li { padding:14px 0 !important; }
  main .m-pair .p-q .faq-q > summary { min-height:60px !important; padding:10px 0 !important; }
  main .m-pair .p-q .faq-q .page-row-title { font-size:18px !important; }
  /* the re-check + the timeline */
  main .m-pair .m-verdicts { margin-top:18px; }
  main .m-pair .m-verdicts li { min-height:54px; padding:14px 0 0; }
  main .m-pair .m-verdicts b { font-size:26px; }
  main .m-pair .m-verdicts span { font-size:16px; }
  main .m-pair .reg-m-recheck > .text-link, main .m-pair .reg-dates > .text-link { margin-top:14px; min-height:40px; }
  main .m-pair .reg-dates .reg-date-grid { margin:20px 0 0 8px; }
  main .m-pair .reg-dates .reg-date-grid > div { padding-bottom:16px; }
  main .m-pair .reg-dates .reg-date-grid > div::before { top:8px; }
  main .m-pair .reg-dates time { font-size:22px; }
  main .m-pair .reg-dates .reg-date-grid span { margin-top:2px; font-size:16px; }
  @media (max-height:700px) {
    main .m-pair .reg-m-recheck .m-sub { display:none; }
    main .m-pair .m-verdicts li { min-height:46px; padding:10px 0 0; }
    main .m-pair .reg-dates .reg-date-grid > div { padding-bottom:10px; }
    main .m-pair > section + section { padding-top:22px !important; }
    main .m-pair .p-q .faq-q > summary { min-height:50px !important; padding:6px 0 !important; }
  }
}
/* draft16 fit pass 2 */
@media (max-width:899px) {
  main .m-pair { padding:36px var(--m-pad) 36px; }
  main .m-pair .partners-figure, main .m-pair .gap-options, main .m-pair .p-shape > p:last-child, main .m-pair .faq-list { margin-bottom:0 !important; }
  @media (max-height:700px) { main #means.dv-frame.m-screen { padding:26px var(--m-pad) 28px !important; } }
}
@media (max-width:899px) { main .m-pair.m-screen { padding:36px var(--m-pad) 36px !important; } @media (max-height:700px) { main .m-pair.m-screen { padding:24px var(--m-pad) 24px !important; } } }
@media (max-width:899px) {
  main .m-pair > section.m-screen + section.m-screen { padding-top:32px !important; }
  main .m-pair .p-days .gap-option { grid-template-columns:52px minmax(0,1fr); column-gap:14px; }
  main .m-pair .p-days .gap-scene { max-width:52px; }
  @media (max-height:700px) { main .m-pair > section.m-screen + section.m-screen { padding-top:22px !important; } }
}
@media (max-width:899px) and (max-height:800px) {
  main .m-pair .reg-dates .reg-date-grid > div { padding-bottom:10px; }
  main .m-pair .m-verdicts li { min-height:48px; padding:10px 0 0; }
  main .m-pair .reg-m-recheck > .text-link, main .m-pair .reg-dates > .text-link { margin-top:10px; }
}