/* self-hosted (not Google Fonts CDN) so every typeface renders reliably with no external
     network dependency -- all three are variable fonts, one file per style covers all weights used. */
  @font-face{
    font-family:'Space Grotesk';font-style:normal;font-weight:400 700;font-display:swap;
    src:url('fonts/space-grotesk-variable.woff2') format('woff2');
  }
  @font-face{
    font-family:'Inter';font-style:normal;font-weight:400 600;font-display:swap;
    src:url('fonts/inter-variable.woff2') format('woff2');
  }
  @font-face{
    font-family:'Fraunces';font-style:normal;font-weight:400 600;font-display:swap;
    src:url('fonts/fraunces-variable.woff2') format('woff2');
  }
  @font-face{
    font-family:'Fraunces';font-style:italic;font-weight:400 600;font-display:swap;
    src:url('fonts/fraunces-italic-variable.woff2') format('woff2');
  }
  :root{
    --parchment:#f4efe2;
    --parchment-deep:#ece2cb;
    --stone:#eae3d2;
    --stone-card:#f2ecdf;
    --stone-line:#d8cfb6;
    --slate:#23262c;
    --slate-deep:#191b20;
    --slate-line:rgba(244,239,228,.14);
    --charcoal:#24272c;
    --charcoal-soft:#5b5d55;
    --paper-line:rgba(36,39,44,.14);
    --offwhite:#f4efe2;
    --offwhite-soft:#b9b3a0;
    --teal:#1a8c8c;
    --teal-deep:#106868;
    --teal-bright:#22a3a3; /* AA-contrast teal for text set on slate/slate-deep backgrounds */
    --font-head:'Space Grotesk','Arial Narrow',sans-serif;
    --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --font-display:'Fraunces',Georgia,'Times New Roman',serif; /* used sparingly: the full formal
      name and a handful of institutional moments -- everything else stays on the architectural
      sans so the two voices read as a deliberate pairing, not a fight (Task 20) */
    --max:1180px;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *{animation:none!important;transition:none!important} }
  body{
    font-family:var(--font-body);
    color:var(--charcoal);
    background:var(--parchment);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  body.landing-active{overflow:hidden}
  img{max-width:100%;display:block}
  a{color:inherit}
  .wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
  section{position:relative}
  .eyebrow{
    font-family:var(--font-head);font-weight:600;font-size:12px;letter-spacing:.24em;
    text-transform:uppercase;color:var(--teal-deep);margin-bottom:14px;
  }
  .eyebrow.on-dark{color:var(--teal-bright)}
  h1,h2,h3{font-family:var(--font-head);font-weight:600;letter-spacing:.01em;line-height:1.12}
  h1{font-size:clamp(34px,5vw,58px);font-weight:700;letter-spacing:-.01em}
  h2{font-size:clamp(26px,3.4vw,38px)}
  h3{font-size:18px;letter-spacing:.02em}
  p{max-width:62ch}
  p.lede{font-size:18px;color:var(--charcoal-soft);max-width:52ch}
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    font-family:var(--font-head);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;
    padding:14px 26px;border-radius:2px;text-decoration:none;cursor:pointer;border:1px solid transparent;
    transition:background .18s ease,color .18s ease,border-color .18s ease;
  }
  .btn-primary{background:var(--charcoal);color:var(--parchment)}
  .btn-primary:hover{background:var(--teal-deep)}
  .btn-ghost{border-color:var(--paper-line);color:var(--charcoal)}
  .btn-ghost:hover{border-color:var(--charcoal)}
  .btn-ghost.on-dark{border-color:var(--slate-line);color:var(--offwhite)}
  .btn-ghost.on-dark:hover{border-color:var(--offwhite)}
  .btn:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

  /* ---- texture ---- */
  .texture{position:absolute;inset:0;pointer-events:none;background-repeat:repeat;background-size:220px 220px}
  .texture.paper{opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E")}
  .texture.slate{opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E")}

  /* ---- decorative embossed stamp / oversized fragments (Task 20 editorial rhythm) ---- */
  .emboss-stamp{
    position:absolute;pointer-events:none;opacity:.05;filter:grayscale(1);
    width:640px;height:640px;top:50%;transform:translateY(-50%);
  }
  .emboss-stamp.right{right:-160px}
  .ghost-num{
    position:absolute;font-family:var(--font-display);font-weight:500;font-style:italic;
    color:var(--charcoal);opacity:.05;font-size:min(30vw,320px);line-height:1;pointer-events:none;
    top:-.1em;right:-.05em;
  }
  .section.slate .ghost-num,.section.stone .ghost-num{opacity:.06}

  /* ---- landing screen (Task 20, mandatory) ---- */
  .landing{
    position:fixed;inset:0;z-index:1000;
    background:linear-gradient(175deg,var(--parchment) 0%,var(--stone) 100%);
    display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
    padding:40px;opacity:1;visibility:visible;transition:opacity .5s ease;
  }
  .landing.hidden{opacity:0;visibility:hidden;pointer-events:none}
  .landing .texture{opacity:.05}
  .landing-stamp{width:clamp(64px,10vw,96px);height:clamp(64px,10vw,96px);margin-bottom:34px;position:relative;z-index:1}
  .landing-rule{width:2px;height:44px;background:var(--teal);margin:0 auto 30px;position:relative;z-index:1}
  .landing-name{
    font-family:var(--font-display);font-weight:500;font-size:clamp(28px,4.4vw,52px);line-height:1.18;
    color:var(--charcoal);max-width:16ch;position:relative;z-index:1;
  }
  .landing-name em{font-style:italic;color:var(--teal-deep)}
  .landing-sub{
    margin-top:20px;font-family:var(--font-head);font-size:11px;letter-spacing:.28em;text-transform:uppercase;
    color:var(--charcoal-soft);position:relative;z-index:1;
  }
  .landing-enter{
    margin-top:52px;background:none;border:1px solid var(--charcoal);color:var(--charcoal);
    font-family:var(--font-head);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
    padding:15px 34px;border-radius:2px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:10px;
    position:relative;z-index:1;transition:background .18s ease,color .18s ease;
  }
  .landing-enter:hover{background:var(--charcoal);color:var(--parchment)}
  .landing-enter:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
  .landing-enter .chevron{font-size:14px;line-height:1}
  noscript .landing{display:none}

  /* ---- draft ribbon ---- */
  .draft-ribbon{
    background:var(--slate-deep);color:var(--offwhite-soft);
    text-align:center;font-family:var(--font-head);font-size:11px;letter-spacing:.18em;text-transform:uppercase;
    padding:8px 16px;
  }
  .draft-ribbon strong{color:var(--teal-bright)}

  /* ---- nav ---- */
  header.site{
    position:sticky;top:0;z-index:50;
    background:rgba(244,239,226,.92);backdrop-filter:blur(6px);
    border-bottom:1px solid var(--paper-line);
  }
  .nav{display:flex;align-items:center;justify-content:space-between;padding:18px 28px;max-width:var(--max);margin:0 auto;gap:24px}
  .brand{display:flex;align-items:center;gap:16px;text-decoration:none}
  .brand img{height:46px;width:46px} /* +35% over the pre-Task-20 34px, per brief */
  .brand-text{font-family:var(--font-head);font-weight:700;font-size:17px;letter-spacing:.09em;color:var(--charcoal);line-height:1.3}
  .brand-text small{display:block;font-weight:500;font-size:11px;letter-spacing:.11em;color:var(--charcoal-soft);text-transform:uppercase}
  .nav-groups{display:flex;align-items:baseline;gap:28px;flex-wrap:wrap}
  nav.links{display:flex;gap:22px;flex-wrap:wrap}
  nav.links a{
    font-family:var(--font-head);font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
    text-decoration:none;color:var(--charcoal-soft);padding:6px 2px;border-bottom:2px solid transparent;
  }
  nav.links a:hover,nav.links a:focus-visible{color:var(--charcoal);border-color:var(--teal)}
  nav.links-secondary{display:flex;gap:18px}
  nav.links-secondary a{
    font-family:var(--font-head);font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;
    text-decoration:none;color:var(--charcoal-soft); /* no opacity dimming -- these are real nav
      links (not decorative), so visual weight comes from size/weight only, keeping AA contrast */
  }
  nav.links-secondary a:hover,nav.links-secondary a:focus-visible{color:var(--teal-deep)}
  /* single distinct header action (Task 25) -- not a duplicate of the hero's audience CTAs,
     which scroll to #providers/#employers rather than starting the application journey */
  .nav-cta{flex-shrink:0}
  .menu-btn{display:none;background:none;border:1px solid var(--paper-line);border-radius:2px;padding:8px 12px;font-family:var(--font-head);font-size:11px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
  @media (max-width:920px){
    .nav-groups{position:absolute;top:100%;left:0;right:0;background:var(--parchment);border-bottom:1px solid var(--paper-line);flex-direction:column;align-items:flex-start;padding:16px 28px;gap:16px;display:none}
    .nav-groups.open{display:flex}
    nav.links,nav.links-secondary{flex-direction:column;gap:14px}
    .menu-btn{display:inline-flex}
    .nav-cta .btn span.long{display:none}
  }
  @media (max-width:480px){ .nav-cta{display:none} }

  /* ---- hero ---- */
  .hero{background:var(--parchment);padding:96px 0 100px;overflow:hidden}
  .hero .wrap{position:relative;z-index:1}
  .hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
  .trust-line{
    margin-top:26px;font-family:var(--font-head);font-weight:600;font-size:15px;letter-spacing:.02em;
    color:var(--charcoal);border-left:3px solid var(--teal);padding-left:16px;max-width:44ch;
  }
  .cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
  .prop-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:var(--paper-line);margin-top:56px;border:1px solid var(--paper-line)}
  .prop-card{background:var(--parchment);padding:22px 22px 26px}
  .prop-card .num{font-family:var(--font-head);color:var(--teal-deep);font-weight:700;font-size:13px;letter-spacing:.1em}
  .prop-card h3{margin-top:10px}
  .prop-card p{margin-top:8px;font-size:14px;color:var(--charcoal-soft)}
  /* ---- statement (slate) -- the one full dark "proposition moment" the brief keeps ---- */
  .statement{background:var(--slate);color:var(--offwhite);padding:90px 0;text-align:center}
  .statement .wrap{max-width:760px;position:relative;z-index:1}
  .statement blockquote{font-family:var(--font-display);font-style:italic;font-weight:500;font-size:clamp(26px,4vw,44px);line-height:1.3}
  .statement .rule{width:64px;height:2px;background:var(--teal);margin:0 auto 26px}

  /* ---- generic section paddings ---- */
  .section{padding:84px 0;overflow:hidden}
  .section.stone{background:var(--stone)}
  .section.parchment{background:var(--parchment)}
  .section.slate{background:var(--slate);color:var(--offwhite)}
  .section.slate p{color:var(--offwhite-soft)}
  .section.slate .card{background:rgba(244,239,226,.05);border:1px solid var(--slate-line)}
  .section-head{max-width:640px;margin-bottom:44px;position:relative;z-index:1}
  .section-head p{margin-top:14px}

  /* ---- ethos chips (loosened from a rigid equal-box grid, Task 20 rhythm) ---- */
  .chip-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
  .chip{
    background:var(--stone-card);border:1px solid var(--stone-line);padding:9px 16px;font-family:var(--font-head);
    font-size:13px;font-weight:600;letter-spacing:.02em;border-radius:999px;
  }
  blockquote.principle{
    margin-top:36px;font-family:var(--font-display);font-style:italic;font-size:clamp(19px,2.2vw,24px);font-weight:500;line-height:1.45;
    border-left:3px solid var(--teal);padding-left:22px;max-width:56ch;
  }

  /* ---- registration model (replaces the old three-question framework, Task 20) ---- */
  .model-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:1px;background:var(--stone-line);border:1px solid var(--stone-line);margin-top:8px}
  @media (max-width:880px){ .model-grid{grid-template-columns:1fr} }
  .model-card{background:var(--parchment);padding:32px 28px}
  .model-card.core{background:var(--parchment-deep)}
  .model-card .m-num{font-family:var(--font-head);font-weight:700;font-size:13px;letter-spacing:.1em;color:var(--teal-deep)}
  .model-card h3{margin-top:12px;font-size:19px}
  .model-card p{margin-top:10px;font-size:14px;color:var(--charcoal-soft)}

  .incentive-block{
    margin-top:48px;background:var(--stone-card);border:1px solid var(--stone-line);border-left:3px solid var(--teal);
    padding:30px 32px;position:relative;z-index:1;
  }
  .incentive-block blockquote{font-family:var(--font-display);font-style:italic;font-weight:500;font-size:clamp(18px,2.1vw,22px);line-height:1.4}
  .incentive-block ul{list-style:none;margin-top:18px;display:flex;flex-direction:column;gap:8px}
  .incentive-block ul li{padding-left:20px;position:relative;font-size:13.5px;color:var(--charcoal-soft)}
  .incentive-block ul li::before{content:"";position:absolute;left:0;top:7px;width:7px;height:7px;background:var(--teal)}

  /* ---- HSE guidance torn-paper visual ---- */
  .hse-block{margin-top:56px;display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center;position:relative;z-index:1}
  @media (max-width:880px){ .hse-block{grid-template-columns:1fr} }
  .hse-visual{width:100%;height:auto;border-radius:2px;box-shadow:0 18px 40px rgba(36,39,44,.16)}
  /* below ~640px the full landscape asset renders its torn-paper text too small to read
     comfortably -- crop in on the two extracts themselves (object-fit) rather than shrink
     the whole frame, trading the image's own internal caption for the adjacent copy's eyebrow,
     which says the same thing at a readable size. */
  @media (max-width:640px){
    .hse-visual{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center 62%}
  }
  .hse-copy h3{font-size:21px}
  .hse-copy p{margin-top:12px;font-size:14.5px;color:var(--charcoal-soft)}
  .hse-disclaimer{
    margin-top:18px;font-size:12px;color:var(--charcoal-soft);font-style:italic;border-top:1px solid var(--stone-line);
    padding-top:14px;
  }
  .steps-note{margin-top:26px;font-size:13px;color:var(--charcoal-soft);font-style:italic;max-width:70ch}

  /* ---- two column + asymmetric layout ---- */
  .cols-2{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:start;position:relative;z-index:1}
  @media (max-width:880px){ .cols-2{grid-template-columns:1fr} }
  ul.check{list-style:none;margin-top:24px;display:flex;flex-direction:column;gap:14px}
  ul.check li{padding-left:26px;position:relative;font-size:15px}
  ul.check li::before{content:"";position:absolute;left:0;top:7px;width:9px;height:9px;background:var(--teal)}
  .section.slate ul.check li::before{background:var(--teal)}

  /* ---- benefit cards (replaces long flat bullet lists, Task 20 bullet-fatigue fix) ---- */
  .benefit-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px}
  @media (max-width:760px){ .benefit-row{grid-template-columns:1fr} }
  .benefit-card{background:var(--stone-card);border:1px solid var(--stone-line);padding:24px 22px}
  .section.slate .benefit-card{background:rgba(244,239,226,.06);border-color:var(--slate-line)}
  .benefit-card h3{font-size:16px}
  .benefit-card p{margin-top:8px;font-size:13.5px;color:var(--charcoal-soft)}
  .section.slate .benefit-card p{color:var(--offwhite-soft)}
  ul.quiet{list-style:none;margin-top:22px;display:flex;flex-direction:column;gap:9px}
  ul.quiet li{padding-left:16px;position:relative;font-size:13px;color:var(--charcoal-soft)}
  ul.quiet li::before{content:"—";position:absolute;left:0;color:var(--teal-deep)}
  .section.slate ul.quiet li{color:var(--offwhite-soft)}
  .section.slate ul.quiet li::before{color:var(--teal-bright)}

  /* ---- cards ---- */
  .card{background:var(--stone-card);border:1px solid var(--stone-line);padding:26px 24px}
  .card h3{margin-bottom:10px}
  .card p{font-size:14px;color:var(--charcoal-soft)}
  .card .tag-label{
    display:inline-block;margin-bottom:12px;font-family:var(--font-head);font-size:10px;font-weight:700;
    letter-spacing:.1em;text-transform:uppercase;color:var(--teal-deep);background:rgba(26,140,140,.12);padding:4px 10px;
  }
  .section.slate .card .tag-label{color:var(--teal-bright);background:rgba(26,140,140,.18)}
  .tag-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:20px}

  /* ---- due diligence preview card ---- */
  .preview-card{
    display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;
    background:var(--stone-card);border:1px solid var(--stone-line);padding:26px 28px;margin-top:36px;
  }
  @media (max-width:640px){ .preview-card{grid-template-columns:1fr} }
  .preview-icon{
    width:52px;height:52px;border:1.5px solid var(--charcoal);border-radius:2px;
    display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700;color:var(--charcoal);
  }
  .btn-disabled{
    font-family:var(--font-head);font-weight:600;font-size:12px;letter-spacing:.06em;text-transform:uppercase;
    padding:12px 20px;border:1px solid var(--stone-line);color:var(--charcoal-soft);cursor:not-allowed;white-space:nowrap;
  }

  /* ---- register search placeholder ---- */
  .search-demo{margin-top:34px;background:var(--stone-card);border:1px solid var(--stone-line);padding:26px;position:relative;z-index:1}
  .search-row{display:flex;gap:10px;flex-wrap:wrap}
  .search-row input{
    flex:1;min-width:220px;font-family:var(--font-body);font-size:14px;padding:12px 14px;
    border:1px solid var(--stone-line);background:var(--parchment);color:var(--charcoal);
  }
  .search-row input:focus-visible{outline:2px solid var(--teal);outline-offset:1px}
  .search-row button{border:none}
  .search-result{margin-top:16px;font-size:13px;color:var(--charcoal-soft);display:none}
  .search-result.show{display:block}
  .demo-tag{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--teal-deep);font-family:var(--font-head);font-weight:700}

  /* ---- governance council cards -- moved to stone/parchment, dark cards (Task 20) ---- */
  .council-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:36px;position:relative;z-index:1}
  .council-card{background:var(--slate);color:var(--offwhite);border:1px solid var(--slate-line);padding:22px}
  .council-avatar{
    width:44px;height:44px;border-radius:50%;border:1.5px solid var(--offwhite-soft);
    display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700;color:var(--offwhite-soft);
    margin-bottom:16px;font-size:13px;
  }
  .council-card h3{font-size:15px;color:var(--offwhite)}
  .council-card .role-tag{display:block;margin-top:4px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--teal-bright);font-family:var(--font-head);font-weight:600}
  .council-card p{margin-top:10px;font-size:13px;color:var(--offwhite-soft);max-width:none}
  .status-chip{
    display:inline-block;margin-top:12px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;
    font-family:var(--font-head);font-weight:700;color:var(--offwhite-soft);border:1px solid var(--slate-line);padding:3px 9px;
  }
  .gov-note{margin-top:28px;font-size:13px;color:var(--charcoal-soft);max-width:64ch;border-left:2px solid var(--stone-line);padding-left:16px;position:relative;z-index:1}
  .gov-principles{margin-top:44px;position:relative;z-index:1}
  .gov-principles ul{margin-top:18px;grid-template-columns:1fr 1fr;display:grid;gap:12px 32px}

  /* ---- register interest form ---- */
  .form-card{background:var(--stone-card);border:1px solid var(--stone-line);padding:36px;max-width:640px}
  .form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
  @media (max-width:560px){ .form-row{grid-template-columns:1fr} }
  .field{display:flex;flex-direction:column;gap:6px}
  .field label{font-family:var(--font-head);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--charcoal-soft)}
  .field input,.field select,.field textarea{
    font-family:var(--font-body);font-size:14px;padding:11px 13px;border:1px solid var(--stone-line);
    background:var(--parchment);color:var(--charcoal);width:100%;
  }
  .field textarea{resize:vertical;min-height:88px}
  .field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:2px solid var(--teal);outline-offset:1px}
  .form-note{margin-top:18px;font-size:12px;color:var(--charcoal-soft)}
  .form-success{
    display:none;background:rgba(26,140,140,.1);border:1px solid var(--teal);padding:18px 20px;font-size:14px;margin-top:18px;
  }
  .form-success.show{display:block}

  /* ---- footer ---- */
  footer{background:var(--slate-deep);color:var(--offwhite-soft);padding:60px 0 30px;font-size:13px}
  .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
  @media (max-width:800px){ .footer-grid{grid-template-columns:1fr 1fr} }
  @media (max-width:480px){ .footer-grid{grid-template-columns:1fr} }
  footer h4{font-family:var(--font-head);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--offwhite);margin-bottom:14px}
  footer ul{list-style:none;display:flex;flex-direction:column;gap:9px}
  footer a{text-decoration:none;color:var(--offwhite-soft)}
  footer a:hover{color:var(--teal-bright)}
  .footer-brand{display:flex;align-items:center;gap:10px;margin-bottom:14px}
  .footer-brand img{height:28px;width:28px}
  .footer-legal{
    margin-top:44px;padding-top:22px;border-top:1px solid var(--slate-line);font-size:12.5px;color:#948d7c;
    display:flex;flex-direction:column;gap:9px;
  }
  .footer-legal strong{color:var(--offwhite-soft)}

  .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  .skip-link{
    position:absolute;left:8px;top:-60px;background:var(--charcoal);color:var(--parchment);padding:10px 16px;z-index:1100;
    transition:top .15s ease;text-decoration:none;font-family:var(--font-head);font-size:12px;
  }
  .skip-link:focus{top:8px}
  @media (prefers-reduced-motion:reduce){ .landing{transition:none} }

  /* ========================================================================
     Task 25 additions: IVOSA application & buyer-assurance prototype pages
     ======================================================================== */

  /* ---- sub-page chrome ---- */
  .subpage-head{background:var(--stone);padding:44px 0 36px;border-bottom:1px solid var(--paper-line)}
  .subpage-head .back-link{
    font-family:var(--font-head);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
    color:var(--teal-deep);text-decoration:none;display:inline-flex;align-items:center;gap:6px;margin-bottom:18px;
  }
  .subpage-head .back-link:hover{color:var(--charcoal)}
  .subpage-head h1{font-size:clamp(28px,4vw,42px)}
  .subpage-head p.lede{margin-top:12px}
  .fictional-tag{
    display:inline-block;margin-bottom:14px;font-family:var(--font-head);font-size:10px;font-weight:700;
    letter-spacing:.1em;text-transform:uppercase;color:var(--teal-deep);background:rgba(26,140,140,.12);padding:5px 12px;
  }
  .subpage-body{padding:64px 0}

  /* ---- callout panels (used for the mandatory "registration basis" panel etc.) ---- */
  .panel{background:var(--stone-card);border:1px solid var(--stone-line);border-left:3px solid var(--teal);padding:22px 26px;margin:28px 0}
  .panel strong{font-family:var(--font-head)}

  /* ---- IVOSA-administered facts vs provider-declared arrangements split
     (Legal Desk Review v0.2 redline: keep these two kinds of information visually distinct) ---- */
  .fact-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:28px 0}
  @media (max-width:760px){ .fact-grid{grid-template-columns:1fr} }
  .fact-col{background:var(--stone-card);border:1px solid var(--stone-line);padding:22px}
  .fact-col h3{font-size:13px;letter-spacing:.05em;text-transform:uppercase}
  .fact-col.administered{border-top:3px solid var(--charcoal)}
  .fact-col.declared{border-top:3px solid var(--teal)}
  .fact-list{list-style:none;margin-top:14px;display:flex;flex-direction:column;gap:11px}
  .fact-list li{font-size:13.5px;color:var(--charcoal-soft)}
  .fact-list li strong{color:var(--charcoal);display:block;font-size:12px;font-family:var(--font-head);letter-spacing:.02em}

  /* ---- neutral status labels -- never a verification-style tick (Legal Desk Review v0.2 redline) ---- */
  .status-label{
    display:inline-block;font-family:var(--font-head);font-size:11px;font-weight:700;letter-spacing:.05em;
    text-transform:uppercase;padding:3px 10px;border:1px solid var(--stone-line);color:var(--charcoal-soft);background:var(--parchment);
  }
  .status-label.on-dark{background:transparent;border-color:var(--slate-line);color:var(--offwhite-soft)}
  .status-label.model-adopted{border-color:var(--teal);color:var(--teal-deep);background:rgba(26,140,140,.08)}
  .status-label.active{border-color:var(--teal);color:var(--teal-deep);background:rgba(26,140,140,.08)}

  /* ---- accessible FAQ (native details/summary, no JS required) ---- */
  .faq{margin-top:16px;border-top:1px solid var(--stone-line)}
  .faq details{border-bottom:1px solid var(--stone-line);padding:16px 0}
  .faq summary{font-family:var(--font-head);font-weight:600;font-size:15px;cursor:pointer;list-style:none}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary::before{content:"+ ";color:var(--teal-deep)}
  .faq details[open] summary::before{content:"– "}
  .faq p{margin-top:10px;font-size:14px;color:var(--charcoal-soft)}

  /* ---- long-form prose (model documents) ---- */
  .prose h2{margin-top:36px;font-size:20px}
  .prose h2:first-child{margin-top:0}
  .prose p,.prose li{font-size:14.5px;color:var(--charcoal-soft);max-width:70ch}
  .prose ul,.prose ol{margin-top:10px;padding-left:22px}
  .prose li{margin-top:6px}

  /* ---- record / pack document layout ---- */
  .record-card{background:var(--parchment);border:1px solid var(--stone-line);padding:40px;max-width:820px;margin:0 auto}
  .record-header{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;border-bottom:1px solid var(--stone-line);padding-bottom:20px;margin-bottom:8px}
  .record-meta{font-size:13px;color:var(--charcoal-soft)}
  .record-meta strong{color:var(--charcoal);display:block;font-family:var(--font-head);font-size:11px;letter-spacing:.04em;text-transform:uppercase}
  .record-section{margin-top:30px}
  .record-section h3{font-size:15px}
  .declaration-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:11px 0;border-bottom:1px solid var(--paper-line);font-size:13.5px}
  .declaration-row:last-child{border-bottom:none}
  .declaration-row .d-label{color:var(--charcoal-soft);max-width:32ch}

  @media print{
    header.site,.draft-ribbon,footer,.subpage-head,.no-print{display:none!important}
    body{background:#fff}
    .subpage-body{padding:0}
    .record-card{border:none;box-shadow:none;max-width:none;padding:0}
  }

  /* ---- apply-now demonstration wizard ---- */
  .wizard{max-width:760px;margin:0 auto}
  .wizard-progress{display:flex;gap:4px;margin-bottom:10px}
  .wizard-progress span{flex:1;height:4px;background:var(--stone-line)}
  .wizard-progress span.done{background:var(--teal)}
  .wizard-step-label{font-size:12px;color:var(--charcoal-soft);font-family:var(--font-head);letter-spacing:.06em;text-transform:uppercase;margin-bottom:28px}
  .wizard-panel{background:var(--stone-card);border:1px solid var(--stone-line);padding:34px}
  .wizard-panel h2{font-size:22px}
  .wizard-panel>p.wizard-intro{margin-top:10px;font-size:14px;color:var(--charcoal-soft)}
  .wizard-panel .q-item{margin-top:22px;padding-top:20px;border-top:1px solid var(--stone-line)}
  .wizard-panel .q-item:first-of-type{border-top:none;padding-top:0}
  .wizard-panel .q-item .q-label{font-family:var(--font-head);font-weight:600;font-size:14.5px}
  .wizard-panel .q-item p{font-size:13.5px;color:var(--charcoal-soft);margin-top:4px}
  .q-declare{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px}
  .q-declare label{
    font-family:var(--font-head);font-size:12px;font-weight:600;letter-spacing:.02em;
    border:1px solid var(--stone-line);padding:8px 14px;cursor:pointer;display:flex;align-items:center;gap:6px;
    background:var(--parchment);
  }
  .q-declare label.checked{border-color:var(--teal);color:var(--teal-deep);background:rgba(26,140,140,.06)}
  .q-declare input{accent-color:var(--teal)}
  .q-declare input:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
  .wizard-nav{display:flex;justify-content:space-between;margin-top:28px}
  .wizard-summary-row{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--paper-line);font-size:13px}
  .wizard-summary-row:last-child{border-bottom:none}
  .wizard-summary-row .a-val{font-family:var(--font-head);font-size:12px;font-weight:600;color:var(--teal-deep);text-align:right}
  .wizard-summary-row .a-val.readiness-flag{color:#8a4a1c}
  .wizard-flag{margin-top:16px;font-size:13px;color:#8a4a1c;background:rgba(168,84,31,.08);border:1px solid rgba(168,84,31,.25);padding:12px 16px}
  .org-type-note{margin-top:14px;font-size:13px;color:var(--charcoal-soft);font-style:italic;background:var(--parchment);border:1px solid var(--stone-line);padding:12px 16px;display:none}
  .org-type-note.show{display:block}
  .q-declare-inline{margin-top:10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
  .policy-view-btn{
    font-family:var(--font-head);font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
    color:var(--teal-deep);background:none;border:1px solid var(--stone-line);padding:6px 12px;cursor:pointer;
  }
  .policy-view-btn:hover{border-color:var(--teal);color:var(--charcoal)}
  .policy-view-btn:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

  /* ---- policy-viewer modal ---- */
  .doc-modal-backdrop{
    position:fixed;inset:0;background:rgba(20,20,18,.55);display:flex;align-items:center;justify-content:center;
    padding:24px;z-index:200;
  }
  .doc-modal{
    background:var(--parchment);max-width:640px;width:100%;max-height:82vh;overflow-y:auto;
    border:1px solid var(--stone-line);box-shadow:0 18px 48px rgba(0,0,0,.28);padding:32px;position:relative;
  }
  .doc-modal-close{
    position:absolute;top:16px;right:16px;background:none;border:1px solid var(--stone-line);width:32px;height:32px;
    font-size:18px;line-height:1;cursor:pointer;color:var(--charcoal);
  }
  .doc-modal-close:hover{border-color:var(--teal);color:var(--teal-deep)}
  .doc-modal-close:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
  .doc-modal h2{font-size:19px;padding-right:36px}
  .doc-modal .doc-modal-status{font-size:12px;color:var(--charcoal-soft);margin-top:6px}
  .doc-modal .doc-modal-body{margin-top:18px;font-size:13.5px;line-height:1.6}
  .doc-modal .doc-modal-body h2{font-size:15px;margin-top:20px}
  .doc-modal .doc-modal-body h2:first-child{margin-top:0}
  .doc-modal .doc-modal-body p{margin-top:8px;color:var(--charcoal-soft)}
  .doc-modal .doc-modal-body ul{margin-top:8px;padding-left:20px;color:var(--charcoal-soft)}
  .doc-modal .doc-modal-body li{margin-top:4px}
  .doc-modal-actions{margin-top:22px;display:flex;gap:10px;flex-wrap:wrap}

  /* ---- review-reference widget (local-only, never transmitted) ---- */
  .review-widget{position:fixed;right:18px;bottom:18px;z-index:150}
  .review-toggle{
    font-family:var(--font-head);font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
    background:var(--charcoal);color:var(--offwhite);border:none;padding:11px 16px;cursor:pointer;
    box-shadow:0 6px 18px rgba(0,0,0,.22);
  }
  .review-toggle:hover{background:var(--teal-deep)}
  .review-toggle:focus-visible{outline:2px solid var(--teal-bright);outline-offset:2px}
  .review-panel{
    position:absolute;right:0;bottom:calc(100% + 10px);width:280px;background:var(--stone-card);
    border:1px solid var(--stone-line);box-shadow:0 12px 30px rgba(0,0,0,.22);padding:16px;
  }
  .review-panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
  .review-panel-head strong{font-family:var(--font-head);font-size:13px}
  .review-close{background:none;border:none;font-size:18px;line-height:1;cursor:pointer;color:var(--charcoal-soft)}
  .review-close:hover{color:var(--charcoal)}
  .review-ref-code{display:block;margin-top:8px;font-size:12px;background:var(--parchment);border:1px solid var(--stone-line);padding:6px 8px;word-break:break-all}
  .review-note-label{display:block;margin-top:12px;font-size:11.5px;color:var(--charcoal-soft)}
  .review-note{width:100%;margin-top:6px;font:inherit;font-size:12.5px;padding:8px;border:1px solid var(--stone-line);background:var(--parchment);resize:vertical}
  .review-hint{margin-top:8px;font-size:11px;color:var(--charcoal-soft)}
  @media (max-width:480px){ .review-panel{width:calc(100vw - 36px)} }

  /* ========================================================================
     WI-341 — the phone reading pass for the public register and the public
     registrant record.

     HIERARCHY, SPACING AND TYPOGRAPHY ONLY. No wording is changed anywhere,
     and no claim or caveat is removed, hidden, collapsed, put behind a tap or
     made smaller or fainter than it already was.

     EVERY rule in this block is scoped by the `data-review-ref` attribute that
     those two pages, and only those two pages, carry on <body>. Nothing here
     can reach index.html, apply/, what-registration-means/, the model
     documents or the due-diligence pack.
     ======================================================================== */

  /* ---- both register pages, all widths ---- */
  body[data-review-ref="REGISTRANT-RECORD"] .subpage-body,
  body[data-review-ref="PUBLIC-REGISTER"] .subpage-body{padding:48px 0 60px}

  /* The provider name carried its size inline. Moved into the stylesheet, at the
     same 24px, so a phone can hold it on one line without an !important. */
  body[data-review-ref="REGISTRANT-RECORD"] .record-header h2{font-size:24px}

  @media (max-width:760px){

    /* A 28px gutter on a 390px screen spends 14% of the line on nothing. The
       header and the footer keep theirs, so the page chrome is unchanged. */
    body[data-review-ref="REGISTRANT-RECORD"] main .wrap,
    body[data-review-ref="PUBLIC-REGISTER"] main .wrap{padding:0 18px}

    /* The page head is a signpost, not a chapter opening. */
    body[data-review-ref="REGISTRANT-RECORD"] .subpage-head,
    body[data-review-ref="PUBLIC-REGISTER"] .subpage-head{padding:16px 0 14px}
    body[data-review-ref="REGISTRANT-RECORD"] .subpage-head .back-link,
    body[data-review-ref="PUBLIC-REGISTER"] .subpage-head .back-link{margin-bottom:12px}
    body[data-review-ref="REGISTRANT-RECORD"] .subpage-head .fictional-tag,
    body[data-review-ref="PUBLIC-REGISTER"] .subpage-head .fictional-tag{margin-bottom:10px}
    body[data-review-ref="REGISTRANT-RECORD"] .subpage-head h1,
    body[data-review-ref="PUBLIC-REGISTER"] .subpage-head h1{font-size:24px}
    body[data-review-ref="REGISTRANT-RECORD"] .subpage-head p.lede,
    body[data-review-ref="PUBLIC-REGISTER"] .subpage-head p.lede{font-size:15px;line-height:1.45;margin-top:8px}
    body[data-review-ref="REGISTRANT-RECORD"] .subpage-body,
    body[data-review-ref="PUBLIC-REGISTER"] .subpage-body{padding:12px 0 40px}

    /* Panels keep their rule and their fill -- they are how a caveat is marked
       as a caveat -- and lose the padding a desktop column could afford. */
    body[data-review-ref="REGISTRANT-RECORD"] .panel,
    body[data-review-ref="PUBLIC-REGISTER"] .panel{font-size:15px;padding:12px 14px;margin:10px 0}

    /* Two caveats and one claim ride on .steps-note at 13px. Raised to the body
       size on these two pages: "Registration is a provider declaration. IVOSA has
       not audited this provider." is the register's load-bearing caveat and was
       the smallest thing on the row it qualifies. */
    body[data-review-ref="REGISTRANT-RECORD"] .steps-note,
    body[data-review-ref="PUBLIC-REGISTER"] .steps-note{font-size:15px}

    /* Values are the facts; labels are furniture. Read the value first. */
    body[data-review-ref="REGISTRANT-RECORD"] .fact-list li,
    body[data-review-ref="PUBLIC-REGISTER"] .fact-list li{font-size:15px;color:var(--charcoal);line-height:1.45}
    body[data-review-ref="REGISTRANT-RECORD"] .fact-list li strong,
    body[data-review-ref="PUBLIC-REGISTER"] .fact-list li strong{font-size:12px;color:var(--charcoal-soft);margin-bottom:0}

    /* ---- the registrant record ---- */

    /* On a phone the screen is already the card. The border and its 40px inset
       buy nothing and cost a fifth of the line. */
    body[data-review-ref="REGISTRANT-RECORD"] .record-card{border:none;padding:0}
    body[data-review-ref="REGISTRANT-RECORD"] .record-header{padding-bottom:6px;margin-bottom:0;gap:8px}
    body[data-review-ref="REGISTRANT-RECORD"] .record-header h2{font-size:22px}
    body[data-review-ref="REGISTRANT-RECORD"] .record-header p{font-size:15px}

    /* The plain-words summary is the lead. It is the one block that answers all
       three questions a stranger arrives with, so it is given the weight. */
    body[data-review-ref="REGISTRANT-RECORD"] .panel-lead{
      font-size:16px;line-height:1.45;border-left-width:5px;padding:14px 15px;margin:10px 0 12px;
    }

    /* The two kinds of fact stay visually distinct -- that distinction is a
       Legal Desk Review redline -- but the distinction is now the coloured rule
       alone rather than a full box inside another full box. */
    body[data-review-ref="REGISTRANT-RECORD"] .fact-grid{margin:10px 0;gap:4px}
    body[data-review-ref="REGISTRANT-RECORD"] .fact-col{background:transparent;border:none;padding:6px 0 4px}
    body[data-review-ref="REGISTRANT-RECORD"] .fact-col.administered{border-top:3px solid var(--charcoal)}
    body[data-review-ref="REGISTRANT-RECORD"] .fact-col.declared{border-top:3px solid var(--teal)}
    body[data-review-ref="REGISTRANT-RECORD"] .fact-list{margin-top:6px;gap:7px}

    body[data-review-ref="REGISTRANT-RECORD"] .record-section{margin-top:24px}
    body[data-review-ref="REGISTRANT-RECORD"] .record-section h3{font-size:16px}

    /* Nine declaration rows squeezed into two columns wrapped to three and four
       lines each. One column per row, label then status, same reading order. */
    body[data-review-ref="REGISTRANT-RECORD"] .declaration-row{
      flex-direction:column;align-items:flex-start;gap:4px;padding:10px 0;font-size:15px;
    }
    body[data-review-ref="REGISTRANT-RECORD"] .declaration-row .d-label{
      max-width:none;font-size:15px;color:var(--charcoal);
    }
    body[data-review-ref="REGISTRANT-RECORD"] .declaration-row .status-label{
      border:none;background:transparent;padding:0;font-size:12px;letter-spacing:.06em;
    }

    /* ---- the public register ---- */
    body[data-review-ref="PUBLIC-REGISTER"] .search-demo{padding:18px 16px;margin-top:20px}
    body[data-review-ref="PUBLIC-REGISTER"] .search-row{gap:8px}
  }