:root{
    --sand-25:#FDFBF5; --sand-50:#FBF7EF; --sand-100:#F6EFE1; --sand-200:#EDE2CC;
    --ink:#16343C; --ink-soft:#48605F; --ink-mute:#5B6E6B;
    --teal:#0F8585; --teal-deep:#0B6165; --teal-tint:#E3F2EF;
    --sun:#FFB703; --sun-deep:#E89A00; --sun-tint:#FFF3D6;
    --coral:#E76F51; --coral-tint:#FCEAE3;
    --leaf:#3E9B6E; --leaf-tint:#E4F2E9;
    --amber:#F5A623;
    --shadow-lg: 0 24px 60px -18px rgba(22,52,60,.30), 0 4px 18px rgba(22,52,60,.08);
    --shadow-sm: 0 2px 10px rgba(22,52,60,.10);
    --font-serif: 'Fraunces',"Fraunces Fallback: Noto Serif","Fraunces Fallback: Times New Roman",serif;
    --font-sans: 'Plus Jakarta Sans',"Plus Jakarta Sans Fallback: Roboto","Plus Jakarta Sans Fallback: Arial",system-ui,sans-serif;
  }
  
  @font-face{font-family:"Fraunces Fallback: Noto Serif";
    src:local("Noto Serif"),local("NotoSerif"),local("NotoSerif-Regular"),local("Noto Serif Regular");
    size-adjust:97.5052%;ascent-override:100.3023%;descent-override:26.1525%;line-gap-override:0%}
  @font-face{font-family:"Fraunces Fallback: Times New Roman";
    src:local("Times New Roman"),local("TimesNewRomanPSMT");
    size-adjust:115.4462%;ascent-override:84.7148%;descent-override:22.0882%;line-gap-override:0%}
  @font-face{font-family:"Plus Jakarta Sans Fallback: Roboto";
    src:local("Roboto"),local("Roboto-Regular"),local("Roboto Regular");
    size-adjust:105.2101%;ascent-override:98.6597%;descent-override:21.1006%;line-gap-override:0%}
  @font-face{font-family:"Plus Jakarta Sans Fallback: Arial";
    src:local("Arial"),local("ArialMT");
    size-adjust:104.9796%;ascent-override:98.8763%;descent-override:21.147%;line-gap-override:0%}
  @font-face{font-family:"Fraunces Fallback: Noto Serif";font-weight:600 700;
    src:local("Noto Serif Bold"),local("NotoSerif-Bold");
    size-adjust:94.6289%;ascent-override:103.3511%;descent-override:26.9474%;line-gap-override:0%}
  @font-face{font-family:"Fraunces Fallback: Times New Roman";font-weight:600 700;
    src:local("Times New Roman Bold"),local("TimesNewRomanPS-BoldMT");
    size-adjust:111.9928%;ascent-override:87.3271%;descent-override:22.7693%;line-gap-override:0%}
  @font-face{font-family:"Plus Jakarta Sans Fallback: Roboto";font-weight:600 800;
    src:local("Roboto Bold"),local("Roboto-Bold");
    size-adjust:107.0445%;ascent-override:96.969%;descent-override:20.739%;line-gap-override:0%}
  @font-face{font-family:"Plus Jakarta Sans Fallback: Arial";font-weight:600 800;
    src:local("Arial Bold"),local("Arial-BoldMT");
    size-adjust:100.8374%;ascent-override:102.938%;descent-override:22.0156%;line-gap-override:0%}

  *{margin:0;padding:0;box-sizing:border-box}
  /* A display: rule on a component beats the UA sheet's [hidden]{display:none},
     which silently leaves "hidden" panels open (this bit the story-page claim
     form). Keep the attribute authoritative everywhere. */
  [hidden]{display:none!important}
  /* Keyboard users were tabbing the whole nav on every page before reaching any
     content. Visible only once focused, as the convention expects. */
  .skip-link{position:absolute;left:-9999px;top:0;z-index:100;padding:12px 18px;border-radius:0 0 12px 0;
    background:var(--ink);color:#fff;font-size:14px;font-weight:750;text-decoration:none}
  .skip-link:focus{left:0}
  html{scroll-behavior:smooth}
  body{font-family:var(--font-sans);color:var(--ink);background:var(--sand-50);
    -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
  a{color:inherit;text-decoration:none}
  ::selection{background:var(--sun-tint)}
  .wrap{max-width:1160px;margin:0 auto;padding:0 32px}

  /* ---------- Summit Labs bar (top of every page — the studio behind the site) ---------- */
  .sl-bar{display:block;background:linear-gradient(90deg,#192a4a,#0e1626);text-decoration:none;
    border-bottom:1px solid rgba(201,169,80,.32)}
  /* Top and bottom only: the bar's inner row is also a .wrap, and the side
     padding is the .wrap's, as the header's is. The shorthand "padding:7px 0"
     zeroed it, so from 861px to 1160px the logo and the CTA sat flush with
     the viewport's edges. Below 861px the mobile .wrap rule, later in this
     sheet, sets all four sides, as it did before. */
  .sl-bar-in{display:flex;align-items:center;gap:16px;min-height:44px;padding-top:7px;padding-bottom:7px}
  .sl-bar-logo{height:20px;width:auto;flex-shrink:0}
  .sl-bar-txt{font-size:12.5px;line-height:1.3;color:rgba(255,255,255,.72);white-space:nowrap;
    overflow:hidden;text-overflow:ellipsis}
  .sl-bar-txt b{color:#fff;font-weight:700}
  .sl-bar-txt em{color:#c9a950;font-style:normal;font-weight:600}
  .sl-bar-txt-mob{display:none;font-size:12px;line-height:1.3;color:rgba(255,255,255,.8);white-space:nowrap}
  .sl-bar-txt-mob b{color:#fff;font-weight:700}
  /* A fixed line-height: on its own row (phones) the CTA's line box set the
     bar's height, and line-height:normal is 15-18px depending on which face
     paints it, which moved the whole page 2-3px at the font swap. */
  .sl-bar-cta{margin-left:auto;flex-shrink:0;display:inline-flex;align-items:center;gap:6px;
    font-size:12.5px;font-weight:800;line-height:16px;color:#c9a950;white-space:nowrap;transition:color .15s}
  .sl-bar:hover .sl-bar-cta{color:#fff}
  /* Mobile: swap the full pitch for a short one — never hide Summit Labs entirely.
     The row may wrap. The logo (116.6px), "Built by Summit Labs" and the CTA
     need ~383px in the web font, plus the 40px of .wrap padding, and a phone
     is 320-430px wide: one non-wrapping row ran 45-84px past the right edge,
     gave every page a horizontal scroll and put the CTA off-screen. */
  @media (max-width:760px){.sl-bar-txt{display:none}.sl-bar-txt-mob{display:inline}
    .sl-bar-in{min-height:40px;flex-wrap:wrap;row-gap:6px}}
  /* Below 440px the CTA always takes a line of its own, right-aligned. A fixed
     breakpoint, not natural wrapping: the three faces that can paint the bar
     (the web font, Arial, Roboto) differ by up to 23px across the text and the
     CTA, so natural wrapping would flip the bar between one row and two at the
     font swap near 423px and move everything under it. From 441px the widest
     face still has 18px to spare on one row. The two rows get the 7px of
     vertical padding the bar has on desktop; the mobile .wrap rule, which
     comes later in this sheet, had zeroed it, and one row never showed that
     because min-height centred it. */
  @media (max-width:440px){.sl-bar-cta{flex-basis:100%;justify-content:flex-end}
    .sl-bar .sl-bar-in{padding-top:7px;padding-bottom:7px}}
  /* The bridge line: the same bar on project and city pages (bridgeLineHtml),
     saying one sentence in place of the pitch. Like the bar, nothing in it is
     hidden or shortened at any width, and it changes rows only at fixed
     widths, never where the text happens to break, so the font swap cannot
     move the page. Widest of the three faces, measured in Chrome: the logo
     116.6px, the sentence 200px, the CTA 191px, 16px between each. One row
     needs 537px plus the 40px of .wrap padding, so the CTA takes its own line
     from 600px down (24px to spare at 601). The logo and the sentence need
     333px, so from 390px down the sentence takes two lines, broken after "by"
     (18px to spare at 391; 34px at 320). The bar is then 57px tall, or 69px
     with the two-line sentence, in every face. */
  .sl-bar-line{font-size:12.5px;line-height:16px;color:rgba(255,255,255,.8);white-space:nowrap}
  .sl-bar-line b{color:#fff;font-weight:700}
  @media (max-width:600px){.sl-bridge .sl-bar-cta{flex-basis:100%;justify-content:flex-end}
    .sl-bridge .sl-bar-in{padding-top:7px;padding-bottom:7px}}
  @media (max-width:390px){.sl-bar-line>span{display:block}}

  /* ---------- header ---------- */
  .site-head{position:sticky;top:0;z-index:50;background:rgba(251,247,239,.88);backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(22,52,60,.08)}
  .head-in{display:flex;align-items:center;height:68px;gap:28px}
  .brand{display:flex;align-items:center;gap:12px}
  .brand-mark{width:38px;height:38px;border-radius:12px;flex-shrink:0;overflow:hidden;
    background:linear-gradient(145deg,#129893 0%,#0B6165 100%);
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 4px 10px rgba(11,97,101,.30), inset 0 1px 0 rgba(255,255,255,.25)}
  /* The tower fills the tile; the tile's corners clip the roof (see BRAND_MARK_SVG). */
  .brand-mark svg{display:block;width:100%;height:100%}
  .brand-name{font-family:var(--font-serif);font-weight:650;font-size:23px;letter-spacing:-.02em;line-height:1}
  .brand-name .accent{color:var(--teal)}
  .site-nav{margin-left:auto;display:flex;align-items:center;gap:28px}
  .site-nav a{font-size:14px;font-weight:700;color:var(--ink-soft);letter-spacing:.005em;white-space:nowrap}
  .site-nav a:hover{color:var(--teal-deep)}
  .site-nav a.active{color:var(--ink);position:relative}
  .site-nav a.active::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:3px;border-radius:2px;background:var(--sun)}
  .nav-ask{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 15px;border-radius:11px;
    background:var(--teal-tint);color:var(--teal-deep) !important;font-size:13.5px;font-weight:800;
    letter-spacing:.005em;transition:background .15s ease,color .15s ease,transform .15s ease}
  .nav-ask svg{opacity:.85}
  .nav-ask:hover{background:var(--teal-deep);color:#fff !important;transform:translateY(-1px)}
  .nav-gold{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 19px;border-radius:13px;
    background:linear-gradient(180deg,#FFC42E,#FFB000);color:var(--ink) !important;
    font-size:13.5px;font-weight:800;letter-spacing:.01em;
    box-shadow:0 8px 18px -6px rgba(232,154,0,.55), inset 0 1px 0 rgba(255,255,255,.4);
    transition:transform .15s ease, box-shadow .15s ease}
  .nav-gold:hover{transform:translateY(-1px);box-shadow:0 12px 22px -6px rgba(232,154,0,.6), inset 0 1px 0 rgba(255,255,255,.4)}

  /* ---------- nav items + dropdown menus ---------- */
  .site-nav .nav-item{display:inline-flex;align-items:center;gap:5px;background:none;border:none;cursor:pointer;
    font-family:inherit;font-size:14px;font-weight:700;color:var(--ink-soft);letter-spacing:.005em;
    white-space:nowrap;padding:0;line-height:1;position:relative;transition:color .15s}
  .site-nav .nav-item:hover{color:var(--teal-deep)}
  .site-nav .nav-item .caret{opacity:.7;transition:transform .18s ease}
  .site-nav .nav-item.active{color:var(--ink)}
  .site-nav .nav-item.active::after{content:'';position:absolute;left:0;right:14px;bottom:-24px;height:3px;
    border-radius:2px;background:var(--sun)}
  .nav-drop{position:relative;display:inline-flex;align-items:center}
  .nav-drop:hover .nav-item .caret,.nav-drop.open .nav-item .caret{transform:rotate(180deg)}
  .nav-menu{position:absolute;top:100%;left:50%;transform:translate(-50%,6px);margin-top:14px;min-width:216px;
    background:#fff;border:1px solid rgba(22,52,60,.08);border-radius:16px;padding:8px;
    box-shadow:0 18px 44px -14px rgba(22,52,60,.30), 0 4px 14px rgba(22,52,60,.07);
    opacity:0;visibility:hidden;transition:opacity .16s ease, transform .16s ease;z-index:60}
  .nav-menu::before{content:'';position:absolute;top:-16px;left:0;right:0;height:16px} /* hover bridge */
  .nav-drop:hover .nav-menu,.nav-drop:focus-within .nav-menu,.nav-drop.open .nav-menu{
    opacity:1;visibility:visible;transform:translate(-50%,0)}
  .nav-menu a{display:block;padding:9px 13px;border-radius:10px;font-size:13.5px;font-weight:650;
    color:var(--ink-soft);white-space:nowrap;transition:background .12s, color .12s}
  /* These two sat inside the rule above, unclosed, from 2026-07: the Map
     menu's section heads lost their style, and their rule used a --line
     the sheet never defined (review, 19 Oct 2026). */
  .nav-menu-head{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
    color:var(--ink-mute);padding:9px 14px 4px;margin-top:4px;border-top:1px solid rgba(22,52,60,.08)}
  .nav-menu-head:first-of-type{border-top:0;margin-top:0}
  .nav-menu a:hover{background:var(--sand-50);color:var(--teal-deep)}
  .nav-menu .nav-menu-lead{display:flex;align-items:center;gap:7px;color:var(--teal-deep);font-weight:750;
    margin-bottom:6px;padding-bottom:11px;border-bottom:1px solid rgba(22,52,60,.08);border-radius:10px 10px 0 0}

  /* ---------- hamburger + mobile menu ---------- */
  .nav-toggle{display:none;margin-left:auto;width:44px;height:44px;border:none;background:none;cursor:pointer;
    align-items:center;justify-content:center}
  .nt-bars{position:relative;width:22px;height:16px;display:block}
  .nt-bars span{position:absolute;left:0;width:22px;height:2.4px;border-radius:2px;background:var(--ink);
    transition:transform .22s ease, opacity .18s ease;top:50%}
  .nt-bars span:nth-child(1){transform:translateY(-7px)}
  .nt-bars span:nth-child(3){transform:translateY(7px)}
  .nav-toggle[aria-expanded="true"] .nt-bars span:nth-child(1){transform:rotate(45deg)}
  .nav-toggle[aria-expanded="true"] .nt-bars span:nth-child(2){opacity:0}
  .nav-toggle[aria-expanded="true"] .nt-bars span:nth-child(3){transform:rotate(-45deg)}
  .mobile-nav{position:fixed;left:0;right:0;top:60px;bottom:0;background:var(--sand-50);z-index:45;
    overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-10px);
    transition:opacity .2s ease, transform .2s ease;border-top:1px solid rgba(22,52,60,.08)}
  .mobile-nav.open{opacity:1;visibility:visible;transform:none}
  .mnav-in{display:flex;flex-direction:column;gap:6px;padding:22px 20px 40px}
  .mnav-group{display:flex;flex-direction:column;padding-bottom:12px;margin-bottom:6px;
    border-bottom:1px solid rgba(22,52,60,.08)}
  .mnav-head{font-family:var(--font-serif);font-weight:600;font-size:21px;color:var(--ink);padding:11px 0}
  .mnav-sub{font-size:15px;font-weight:650;color:var(--ink-soft);padding:9px 0 9px 16px}
  .mnav-sub:active,.mnav-head:active{color:var(--teal-deep)}
  .mnav-gold{align-self:flex-start;margin-top:14px;height:48px;font-size:15px}
  body.mnav-open{overflow:hidden}
  /* "Ask anything": the plain-English search, first in the phone menu and as
     its own button beside it, so no page is a dead end for finding things. */
  .nav-new{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:6px;margin-left:2px;
    background:var(--sun);color:var(--ink);font-family:var(--font-sans);font-size:10.5px;font-weight:800;
    letter-spacing:.06em;text-transform:uppercase}
  /* The pill says "Ask anything" and carries the New tag where the row has
     room for them: the tag goes under 1181px and "anything" under 1061px.
     From 1060px down the pill is as wide as the plain "Ask" pill the
     861-1040px spacing below was measured with (#50), and from 1041px the
     full spacing had 73px to spare for the words that come back. */
  @media (max-width:1180px){.nav-ask .nav-new{display:none}}
  @media (max-width:1060px){.nav-ask-more{display:none}}
  .m-ask{display:none;position:relative;align-items:center;gap:6px;height:44px;padding:0 13px;margin-left:auto;
    border-radius:12px;background:var(--teal-tint);color:var(--teal-deep);font-size:14px;font-weight:800}
  .m-ask:active{background:var(--teal-deep);color:#fff}
  .m-ask .new-dot{position:absolute;top:-3px;right:-3px;width:11px;height:11px;border-radius:50%;
    background:var(--sun);border:2px solid var(--sand-25)}
  /* Under 420px the brand, "Ask" and the menu no longer fit one row with their
     44px targets: the button keeps its search icon, at 44px square. */
  @media (max-width:420px){.m-ask{width:44px;height:44px;padding:0;justify-content:center}.m-ask span{display:none}
    .m-ask svg{width:19px;height:19px}}
  /* With the Ask button in the row (#51) the brand, Ask and the menu need
     338px between the side paddings: at 360px the menu button ran into the
     right padding, and at 320px 38px past the edge, so every page scrolled
     sideways (measured 19 Oct 2026). Narrower spacing and a smaller wordmark
     make the row 307px under 401px, and 285px with 16px sides under 351px;
     nothing is hidden. The selectors carry .site-head to beat the home
     page's own header rules. */
  @media (max-width:400px){.site-head .head-in{gap:10px}.site-head .m-ask + .nav-toggle{margin-left:0}
    .site-head .brand{gap:10px}.site-head .brand-mark{width:34px;height:34px}.site-head .brand-name{font-size:21px}}
  @media (max-width:350px){.site-head .head-in{padding-left:16px;padding-right:16px}.site-head .brand-name{font-size:18px}}
  .mnav-ask{display:flex;align-items:flex-start;gap:12px;padding:15px 16px;margin-bottom:10px;border-radius:14px;
    background:var(--teal-tint);color:var(--teal-deep)}
  .mnav-ask svg{width:20px;height:20px;flex-shrink:0;margin-top:3px}
  /* The child span only: the New tag is a span inside it, and took this
     rule's size and colour over its own (3.9:1 on its amber). */
  .mnav-ask>span{display:flex;flex-direction:column;gap:3px;font-size:13.5px;font-weight:650;color:var(--ink-soft);line-height:1.4}
  .mnav-ask b{display:flex;align-items:center;gap:6px;font-family:var(--font-serif);font-weight:600;font-size:21px;color:var(--ink)}

  /* ---------- page hero ---------- */
  .page-hero{padding:52px 0 8px;
    background:
      radial-gradient(900px 420px at 82% -10%, rgba(255,183,3,.13), rgba(255,183,3,0) 62%),
      radial-gradient(800px 400px at 12% -14%, rgba(15,133,133,.10), rgba(15,133,133,0) 60%)}
  .page-eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:800;
    letter-spacing:.16em;text-transform:uppercase;color:var(--teal-deep);margin-bottom:14px}
  .page-eyebrow .edot{width:6px;height:6px;border-radius:50%;background:var(--sun)}
  .page-hero h1{font-family:var(--font-serif);font-weight:600;font-size:clamp(36px,4.2vw,54px);
    line-height:1.06;letter-spacing:-.02em;max-width:820px;text-wrap:balance}
  .page-lede{max-width:720px;margin-top:16px;font-size:17.5px;line-height:1.62;color:var(--ink-soft)}
  .page-lede b{color:var(--ink);font-weight:700}
  .asof{display:inline-flex;align-items:center;gap:8px;margin-top:18px;height:34px;padding:0 14px;border-radius:999px;
    background:#fff;border:1px solid rgba(22,52,60,.10);box-shadow:var(--shadow-sm);
    font-size:12.5px;font-weight:700;color:var(--ink-soft)}
  .asof .adot{width:8px;height:8px;border-radius:50%;background:#2BAE66;box-shadow:0 0 0 3px rgba(43,174,102,.22)}

  /* ---------- digest band ---------- */
  .digest{padding:80px 0 84px}
  .digest-card{position:relative;overflow:hidden;border-radius:28px;background:linear-gradient(140deg,#0E7276 0%,#0B6165 55%,#0A5257 100%);
    color:#fff;padding:52px 60px;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:48px}
  .digest-card::after{content:'';position:absolute;right:-70px;top:-90px;width:340px;height:340px;border-radius:50%;
    background:radial-gradient(closest-side, rgba(255,209,102,.28), rgba(255,209,102,0))}
  .digest-copy{flex:1;min-width:0}
  .digest-copy .d-eyebrow{font-size:11.5px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:#FFD166;margin-bottom:12px}
  .digest-copy h2{font-family:var(--font-serif);font-weight:600;font-size:32px;letter-spacing:-.015em;line-height:1.12}
  .digest-copy p{font-size:15.5px;line-height:1.6;color:rgba(255,255,255,.82);margin-top:12px;max-width:480px}
  .digest-form{display:flex;flex-direction:column;gap:10px;flex-shrink:0;width:360px;position:relative;z-index:1}
  .digest-form .row{display:flex;gap:10px}
  .digest-form input{flex:1;height:52px;padding:0 18px;border:none;border-radius:14px;outline:none;min-width:0;
    font-family:inherit;font-size:14.5px;font-weight:500;color:var(--ink);background:rgba(253,251,245,.97)}
  .digest-form input::placeholder{color:var(--ink-mute)}
  .digest-form button{height:52px;padding:0 22px;border:none;border-radius:14px;cursor:pointer;
    background:#fff;color:var(--teal-deep);font-family:inherit;font-size:14.5px;font-weight:800;
    box-shadow:0 6px 16px -4px rgba(6,45,48,.45)}
  .digest-form button:hover{background:var(--sun-tint)}
  .digest-form small{font-size:12px;font-weight:600;color:rgba(255,255,255,.62)}
  .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
  .digest-err{background:#E76F51 !important;color:#fff !important}

  /* ---------- footer ---------- */
  .site-foot{border-top:1px solid rgba(22,52,60,.09);background:var(--sand-100);padding:44px 0 38px}
  .foot-top{display:flex;gap:48px;align-items:flex-start}
  .foot-brand{max-width:340px}
  /* Every footer link is a 44px tap target (plan 3.3). The column links
     measured 17px tall at 360px, the phone and email 16px and the brand 38px;
     the 44px box holds the space the 9px margin used to. The links in the
     bottom line are inline-flex, so each keeps its place in the sentence. */
  .foot-brand .brand{min-height:44px;margin-bottom:12px}
  .foot-brand p{font-size:13.5px;line-height:1.6;color:var(--ink-soft)}
  .foot-cols{margin-left:auto;display:flex;gap:64px}
  .foot-col h4{font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:12px}
  .foot-col a{display:flex;align-items:center;min-height:44px;font-size:13.5px;font-weight:650;color:var(--ink-soft)}
  .foot-col a:hover{color:var(--teal-deep)}
  /* The box a page may give its own .src (on /ask/ an answer's source is a
     bordered card with 13px of side padding) is reset here: the footer's
     source names took it, and at 861px the widened column ran /ask/ 7px
     past the right edge. */
  .foot-col .src,.foot-col .src:hover{display:block;font-size:13px;font-weight:600;color:var(--ink-soft);margin-bottom:9px;
    padding:0;border:0;border-radius:0;background:none}
  /* Summit Labs — the studio behind Lakelandmarks (their gold/navy brand) */
  .foot-summit{display:flex;align-items:center;gap:22px;margin-top:34px;padding:20px 24px;border-radius:16px;
    background:#fff;border:1px solid rgba(25,42,74,.16);box-shadow:0 2px 12px rgba(25,42,74,.06);
    transition:border-color .15s, box-shadow .15s, transform .15s}
  .foot-summit:hover{border-color:#c9a950;box-shadow:0 10px 26px -10px rgba(25,42,74,.28);transform:translateY(-1px)}
  .fs-logo{height:38px;width:auto;flex-shrink:0}
  .fs-copy{font-size:13px;line-height:1.55;color:var(--ink-soft)}
  .fs-copy b{display:block;font-family:'Roboto Mono','Plus Jakarta Sans',monospace;font-size:11.5px;font-weight:600;
    letter-spacing:.04em;text-transform:uppercase;color:#c9a950;margin-bottom:5px}
  .fs-copy strong{color:#192a4a;font-weight:750}
  .fs-cta{margin-left:auto;flex-shrink:0;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
    font-size:13.5px;font-weight:800;color:#fff;background:#192a4a;padding:11px 18px;border-radius:11px}
  .foot-summit:hover .fs-cta{background:#c9a950;color:#192a4a}
  .foot-bottom{display:flex;align-items:center;gap:16px;margin-top:26px;padding-top:20px;
    border-top:1px solid rgba(22,52,60,.08);font-size:12.5px;font-weight:600;color:var(--ink-mute)}
  .foot-bottom .built{margin-left:auto}
  .foot-bottom a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink-soft);font-weight:700}
  .foot-bottom a:hover{color:var(--teal-deep)}
  @media (max-width:620px){.foot-summit{flex-direction:column;align-items:flex-start;gap:14px}.fs-cta{margin-left:0}}

  /* ---------- narrow desktop, 861-1040px ---------- */
  /* The desktop header shows from 861px, and at its full spacing it needs
     896px of content (904px on the home page, whose nav gaps are 30px) plus
     64px of side padding: at 861px the nav ran 67px past the right edge and
     every page scrolled sideways. In this band the spacing tightens and
     nothing is hidden: 24px of side padding, 16px between the brand and the
     nav, 12px between nav items, slimmer Ask and Weekly buttons and a 21px
     wordmark bring the row to about 791px, 22px to spare at 861px. The
     selectors carry .site-head so a page that re-declares .head-in, .wrap or
     the nav after this sheet (the home page) cannot undo them. From 1041px
     the full spacing has 73px to spare. The bar takes the same side padding
     so its logo lines up with the brand. */
  @media (min-width:861px) and (max-width:1040px){
    .site-head .head-in{gap:16px;padding-left:24px;padding-right:24px}
    .site-head .site-nav{gap:12px}
    .site-head .nav-ask{padding:0 12px}
    .site-head a.nav-gold{padding:0 15px}
    .site-head .brand-name{font-size:21px}
    .sl-bar .sl-bar-in{padding:7px 24px}
  }
  /* The full pitch is 661px wide, and one row with the logo, the CTA and the
     side padding needs 989px. Below that the pitch was cut off with an
     ellipsis from 761px (where the short pitch stops) up, so in that band it
     takes two lines instead, in a box narrow enough that every face breaks
     it onto exactly two: the bar is the same height in every face, so the
     font swap cannot move the page. */
  @media (min-width:761px) and (max-width:1040px){
    .sl-bar-txt{white-space:normal;max-width:420px;text-wrap:balance}
  }

  /* ---------- mobile chrome ---------- */
  @media (max-width: 860px){
    .wrap{padding:0 20px}
    .head-in{height:60px;gap:14px}
    .site-nav{display:none}
    .nav-toggle{display:inline-flex}
    .m-ask{display:inline-flex}
    .m-ask + .nav-toggle{margin-left:2px}
    /* Neither button gives way to the brand: at 375px the menu button was
       squeezed to 22px wide (17 Oct 2026), under a 44px tap target. */
    .m-ask,.nav-toggle{flex-shrink:0}
    .nav-gold{height:38px;padding:0 14px;font-size:12.5px}
    .page-hero{padding-top:40px}
    .page-lede{font-size:15.5px}
    .digest{padding:60px 0 64px}
    .digest-card{flex-direction:column;padding:38px 26px;gap:26px;align-items:stretch}
    .digest-copy h2{font-size:26px}
    .digest-form{width:100%}
    .digest-form .row{flex-direction:column}
    .foot-top{flex-direction:column;gap:32px}
    .foot-cols{margin-left:0;flex-wrap:wrap;gap:32px 48px}
    .foot-bottom{flex-wrap:wrap;row-gap:6px}
    .foot-bottom .built{margin-left:0;width:100%}
    /* 16px stops iOS zooming the field. flex:0 0 auto keeps its 52px: in the
       column the row becomes here, flex:1 made the basis 0 and the row's
       content its size, and the email field collapsed to 21px on every page
       (measured at 360px). The honeypot beside it sits out of flow and never
       showed it. */
    .digest-form input{font-size:16px;flex:0 0 auto}
  }
  /* Visible keyboard focus (WCAG 2.4.7). */
  a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,[role="button"]:focus-visible,[tabindex]:focus-visible{
    outline:2px solid var(--teal-deep);outline-offset:2px;border-radius:5px}
  /* Respect the OS "reduce motion" setting. */
  @media (prefers-reduced-motion: reduce){
    *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
      transition-duration:.001ms!important;scroll-behavior:auto!important}
  }

/* Lakelandmarks story pages — "Florida Modern" design system */
:root{
  --sand-25:#FDFBF5; --sand-50:#FBF7EF; --sand-100:#F6EFE1; --sand-200:#EDE2CC;
  --ink:#16343C; --ink-soft:#48605F; --ink-mute:#5B6E6B;
  --teal:#0F8585; --teal-deep:#0B6165; --teal-tint:#E3F2EF;
  --sun:#FFB703; --sun-deep:#E89A00; --sun-tint:#FFF3D6;
  --coral:#E76F51; --coral-tint:#FCEAE3;
  --leaf:#3E9B6E; --leaf-tint:#E4F2E9;
  --shadow-lg:0 24px 60px -18px rgba(22,52,60,.33), 0 4px 18px rgba(22,52,60,.10);
  --shadow-sm:0 2px 10px rgba(22,52,60,.10);
  --radius-panel:24px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-sans);color:var(--ink);background:var(--sand-50);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--teal-deep)}
::selection{background:var(--sun-tint)}

/* Header + footer chrome come from the shared CHROME_CSS (prepended at build). */

/* ---------- hero cover ---------- */
.shell{max-width:1120px;margin:0 auto;padding:0 24px}
.cover-panel{position:relative;margin-top:22px;border-radius:var(--radius-panel);overflow:hidden;
  box-shadow:var(--shadow-lg);aspect-ratio:1200/460;background:var(--ink)}
.cover-panel svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.cover-pills{position:absolute;top:16px;left:16px;right:16px;display:flex;gap:8px}
.cpill{display:flex;align-items:center;gap:7px;height:30px;padding:0 13px;border-radius:999px;
  background:rgba(253,251,245,.92);backdrop-filter:blur(8px);
  font-size:12.5px;font-weight:700;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.cpill .dot{width:8px;height:8px;border-radius:50%}
.cpill.right{margin-left:auto;font-weight:600;color:var(--ink-soft)}
.cpill.cat{margin-left:auto;gap:5px;padding-left:9px;color:var(--ink);font-weight:750}
.cpill.cat .cic{display:inline-flex;align-items:center}
.cover-panel .cicon{position:static;inset:auto;width:14px;height:14px;display:block}

/* ---------- layout ---------- */
.grid{display:grid;grid-template-columns:minmax(0,1fr) 344px;gap:56px;padding:38px 0 24px}
article{max-width:660px}

/* ---------- story typography ---------- */
.eyebrow{font-size:11px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--sun-deep);margin-bottom:12px}
h1{font-family:var(--font-serif);font-weight:620;font-size:clamp(30px,4.6vw,42px);line-height:1.12;letter-spacing:-.016em;margin-bottom:14px;text-wrap:balance}
.story-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--ink-mute);margin-bottom:22px}
.story-meta .sep{width:3px;height:3px;border-radius:50%;background:var(--ink-mute);opacity:.6}
.story-meta svg{flex-shrink:0}
.lede{font-size:19px;line-height:1.55;color:var(--ink-soft);margin-bottom:22px}
.lede b{color:var(--ink);font-weight:700}

/* ---------- where it is ---------- */
/* The one block that answers "next to what?" — under the title, before the lede,
   because that is the question most readers arrived with. */
.where{margin:-6px 0 22px;padding:13px 16px;border-radius:14px;background:var(--teal-tint);
  border:1px solid rgba(15,133,133,.18)}
.where-line{font-size:15.5px;line-height:1.55;color:var(--ink);overflow-wrap:anywhere}
.where-line b{font-weight:800;color:var(--teal-deep)}
.where-line i{font-style:normal;font-size:13.5px;font-weight:600;color:var(--ink-mute)}
.where-src{margin-top:6px;font-size:12.5px;line-height:1.5;color:var(--ink-mute);overflow-wrap:anywhere}
.summary p{font-size:16px;line-height:1.72;color:var(--ink-soft);margin-bottom:16px}
.summary p.summary-dated{font-size:13.5px;font-weight:650;color:var(--ink-mute);line-height:1.5;margin-bottom:10px}

/* ---------- what happens next ---------- */
.next-callout{display:flex;gap:14px;margin:26px 0 30px;padding:18px 20px;border-radius:18px;
  background:var(--sun-tint);border:1px solid rgba(232,154,0,.28)}
.next-ic{width:38px;height:38px;border-radius:12px;flex-shrink:0;background:#fff;
  display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}
.next-callout h2{font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--sun-deep);margin-bottom:5px}
.next-callout p{font-size:15px;line-height:1.55;font-weight:600;color:var(--ink)}
/* A promised date that has come and gone: keep the sentence, but stop it
   reading as a future. */
.next-callout.overdue{background:var(--sand-100);border-color:rgba(22,52,60,.14)}
.next-callout.overdue h2{color:var(--ink-mute)}
.next-callout.overdue p{color:var(--ink-soft);font-weight:600}
.next-overdue,.next-revised{margin-top:8px;font-size:13.5px;font-weight:650;color:var(--ink-mute);line-height:1.5}

/* ---------- timeline ---------- */
.sec-head{font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);margin:0 0 16px}
.timeline{position:relative;padding-left:26px;margin-bottom:34px}
.timeline::before{content:'';position:absolute;left:6px;top:8px;bottom:12px;width:2.4px;border-radius:2px;
  background:linear-gradient(180deg,var(--teal) 0%, var(--sand-200) 100%)}
.tl-item{position:relative;padding-bottom:20px}
.tl-item:last-child{padding-bottom:0}
.tl-item .tdot{position:absolute;left:-26px;top:4px;width:14px;height:14px;border-radius:50%;
  background:var(--teal);border:3px solid var(--sand-50);box-shadow:0 0 0 1.6px var(--teal)}
.tl-item.next .tdot{background:var(--sand-50);box-shadow:0 0 0 1.6px var(--sun-deep)}
.tl-item .tdate{font-size:11.5px;font-weight:800;color:var(--teal-deep);letter-spacing:.05em;text-transform:uppercase}
.tl-item.next .tdate{color:var(--sun-deep)}
.tl-item.next .tdate::after{content:'· upcoming';font-weight:700;letter-spacing:.03em;margin-left:4px;opacity:.8}
.tl-item.next.est .tdate::after{content:'· estimate'}
.tl-item .tev{font-size:15px;font-weight:600;color:var(--ink);line-height:1.45;margin-top:3px}
.tl-item .tsrc{display:inline-flex;align-items:center;gap:5px;margin-top:5px;font-size:12.5px;font-weight:600;
  color:var(--ink-mute);text-decoration:none;border-bottom:1px dotted rgba(22,52,60,.25);padding-bottom:1px}
.tl-item .tsrc:hover{color:var(--teal-deep);border-color:var(--teal-deep)}
/* A citation that does not open straight to the record reads as muted and
   dashed, matching the receipts panel's gated cards, so the two surfaces stop
   disagreeing about the same URL. */
.tl-item .tsrc.gated{color:var(--ink-soft);border-style:dashed;font-weight:500}
.tl-item .tsrc.gated:hover{color:var(--ink);border-color:var(--ink-soft)}
/* The state licence number on a City of Lakeland permit, linked to the how-to
   page with the number already in its box. Only the number is printed. Each
   link is an inline block with 13px above and below the text, so its tap box
   is 44px tall and lies inside this line, below the citation, not over it. */
.tl-item .tlic{display:block;margin-top:4px;font-size:12.5px;font-weight:600;color:var(--ink-mute);line-height:1.5}
.tl-item .tlic a{display:inline-block;vertical-align:middle;padding:13px 0;color:var(--teal-deep);font-weight:700;
  text-decoration:underline;text-decoration-color:rgba(11,97,101,.35);text-underline-offset:2px}
.tl-item .tlic a:hover{text-decoration-color:var(--teal-deep)}

/* ---------- receipts ---------- */
.receipts{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.receipt{display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:15px;
  background:#fff;border:1px solid rgba(22,52,60,.09);box-shadow:var(--shadow-sm);
  text-decoration:none;color:var(--ink);transition:border-color .15s, transform .15s}
.receipt:hover{border-color:rgba(15,133,133,.45);transform:translateY(-1px)}
.receipt .r-ic{width:34px;height:34px;border-radius:10px;background:var(--teal-tint);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.receipt .r-t{font-size:13.5px;font-weight:700;line-height:1.35}
.receipt .r-s{font-size:11.5px;font-weight:600;color:var(--ink-mute);margin-top:2px}
.receipt .r-arrow{margin-left:auto;flex-shrink:0;opacity:.55}
/* A record that no longer opens for the public still belongs on the page as
   provenance, but it must not look like a link that works. */
.receipt.gated{opacity:.72;border-style:dashed}
.receipt.gated .r-ic{background:var(--sand-100)}
.receipt.gated .r-s b{color:var(--ink);font-weight:750}
.r-note{font-size:13px;color:var(--ink-mute);margin:-4px 0 12px;line-height:1.5}
.receipt:hover .r-arrow{opacity:1}
.pipeline-note{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--ink-mute);margin:16px 0 6px}

/* ---------- sidebar ---------- */
aside{display:flex;flex-direction:column;gap:20px}
.side-card{background:#fff;border-radius:20px;box-shadow:var(--shadow-sm);border:1px solid rgba(22,52,60,.07);overflow:hidden}
.map-card svg{display:block;width:100%;height:auto}
.map-cap{padding:14px 18px 16px;border-top:1px solid rgba(22,52,60,.08)}
.map-cap .addr{font-size:14px;font-weight:750;line-height:1.35}
.map-cap .area{font-size:12.5px;font-weight:600;color:var(--ink-mute);margin-top:3px}
.facts{padding:18px 20px}
.facts h2{font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:13px}
.fact{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:9px 0;border-top:1px solid rgba(22,52,60,.07)}
.fact:first-of-type{border-top:none;padding-top:0}
.fact .k{font-size:12px;font-weight:700;color:var(--ink-mute);flex-shrink:0}
.fact .v{font-size:13px;font-weight:700;text-align:right;line-height:1.4}
.stage-pill{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px;border-radius:999px;
  font-size:12px;font-weight:800}
.stage-pill .dot{width:7px;height:7px;border-radius:50%}
.btn-follow{display:flex;align-items:center;justify-content:center;gap:9px;height:48px;border-radius:14px;
  background:linear-gradient(180deg,#FFC42E,#FFB000);color:var(--ink);text-decoration:none;
  font-size:14.5px;font-weight:800;letter-spacing:.01em;
  box-shadow:0 6px 16px -4px rgba(232,154,0,.55), inset 0 1px 0 rgba(255,255,255,.4)}
.btn-follow:hover{filter:brightness(1.03)}
.side-note{font-size:11.5px;font-weight:600;color:var(--ink-mute);text-align:center;line-height:1.5;padding:0 8px}
.side-actions{display:flex;flex-direction:column;gap:10px}
.follow-form{display:flex;gap:8px}
.follow-form[hidden]{display:none}
.follow-form input{flex:1;min-width:0;height:44px;padding:0 14px;border-radius:14px;
  background:var(--sand-100);border:1px solid rgba(22,52,60,.14);color:var(--ink);
  font-family:inherit;font-size:16px;font-weight:600}
.follow-form input::placeholder{color:var(--ink-mute);font-weight:600}
.follow-form input:focus{outline:none;border-color:var(--teal);background:#fff;box-shadow:0 0 0 3px var(--teal-tint)}
.follow-go{flex-shrink:0;height:44px;padding:0 18px;border-radius:14px;border:none;cursor:pointer;
  background:var(--teal-deep);color:#fff;font-family:inherit;font-size:14px;font-weight:800;letter-spacing:.01em;
  box-shadow:0 2px 8px rgba(11,97,101,.28)}
.follow-go:hover{filter:brightness(1.06)}
.follow-status{font-size:11.5px;font-weight:700;color:var(--teal-deep);text-align:center;line-height:1.5;padding:0 8px}
.follow-status[hidden]{display:none}
.btn-ghost{position:relative;display:flex;align-items:center;justify-content:center;gap:9px;width:100%;height:44px;border-radius:14px;
  background:#fff;border:1px solid rgba(22,52,60,.14);color:var(--ink);font-family:inherit;font-size:14px;font-weight:750;cursor:pointer;
  box-shadow:0 2px 8px rgba(22,52,60,.06)}
.btn-ghost:hover{border-color:rgba(15,133,133,.4);color:var(--teal-deep)}
.share-wrap{position:relative}
.share-menu{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;border:1px solid rgba(22,52,60,.12);
  border-radius:14px;box-shadow:0 16px 40px -12px rgba(22,52,60,.3);padding:6px;z-index:30;display:flex;flex-direction:column;gap:2px}
.share-menu[hidden]{display:none}
.share-opt{display:flex;align-items:center;gap:9px;height:40px;padding:0 13px;border-radius:10px;border:none;background:none;
  font-family:inherit;font-size:13.5px;font-weight:650;color:var(--ink-soft);text-decoration:none;cursor:pointer;text-align:left;width:100%}
.share-opt:hover{background:var(--sand-100);color:var(--ink)}
.claim-card{padding:18px 18px 16px}
.claim-h{font-size:14px;font-weight:800;color:var(--ink)}
.claim-p{font-size:12.5px;line-height:1.5;color:var(--ink-soft);margin:6px 0 12px}
.claim-card .btn-ghost{width:100%}
.claim-form{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.claim-form[hidden]{display:none}
.claim-form input,.claim-form textarea{width:100%;padding:10px 12px;border:1px solid rgba(22,52,60,.16);border-radius:10px;
  font-family:inherit;font-size:16px;color:var(--ink);background:var(--sand-25);resize:vertical}
.claim-form input:focus,.claim-form textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-tint)}
.claim-go{height:42px;border:none;border-radius:12px;background:var(--teal-deep);color:#fff;font-family:inherit;
  font-size:13.5px;font-weight:800;cursor:pointer}
.claim-go:hover{filter:brightness(1.05)}
.claim-status{font-size:12.5px;font-weight:650;color:var(--teal-deep);margin-top:10px;line-height:1.5}
.claim-status.err{color:var(--coral)}
.claim-form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
/* owner-proposed public content (inside the claim form) */
.claim-pub{display:flex;flex-direction:column;gap:8px;margin-top:4px;padding-top:12px;
  border-top:1px dashed rgba(22,52,60,.18)}
.claim-pub-head{display:flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;line-height:1.4;color:var(--ink-mute)}
.claim-pub-head::before{content:'👁';font-size:12px;filter:grayscale(1);opacity:.7}

/* ---------- verified owner panel ---------- */
#ownerPanel{position:relative;margin-bottom:26px;padding:22px 22px 22px 26px;border-radius:18px;overflow:hidden;
  background:linear-gradient(180deg,var(--teal-tint),#fff 64%);
  border:1px solid rgba(15,133,133,.30);box-shadow:var(--shadow-sm)}
#ownerPanel[hidden]{display:none}
#ownerPanel::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--teal),var(--sun))}
.owner-badge{display:flex;align-items:center;gap:9px}
.owner-check{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;flex-shrink:0;
  background:var(--teal-deep);color:#fff;font-size:12.5px;font-weight:800;box-shadow:0 2px 6px rgba(11,97,101,.35)}
.owner-who{font-size:14.5px;font-weight:600;color:var(--ink-soft)}
.owner-who strong{color:var(--teal-deep);font-weight:800}
.owner-img{margin-top:14px;border-radius:14px;overflow:hidden;border:1px solid rgba(22,52,60,.08)}
.owner-img img{display:block;width:100%;height:auto}
.owner-statement{margin-top:14px;font-size:15px;line-height:1.6;color:var(--ink)}
.owner-meta{display:flex;align-items:baseline;gap:9px;margin-top:13px}
.owner-meta .owner-k{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--sun-deep)}
.owner-meta .owner-v{font-size:14px;font-weight:700;color:var(--ink)}
.owner-link{display:inline-flex;align-items:center;gap:6px;margin-top:16px;height:38px;padding:0 16px;border-radius:12px;
  background:var(--teal-deep);color:#fff;text-decoration:none;font-size:13.5px;font-weight:800;
  box-shadow:0 2px 8px rgba(11,97,101,.28)}
.owner-link:hover{filter:brightness(1.06)}

/* ---------- footer ---------- */
/* ---------- keep looking (related projects) ---------- */
.related{margin-top:40px;padding:32px 0 30px;background:var(--sand-25);
  border-top:1px solid rgba(22,52,60,.08)}
.related .wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.rel-head{font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-mute);margin-bottom:16px}
.rel-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:26px}
.rel-col h3{font-family:var(--font-serif);font-weight:600;font-size:17px;margin-bottom:10px;
  letter-spacing:-.01em}
.rel-item{display:flex;gap:10px;align-items:flex-start;padding:10px 0;text-decoration:none;
  border-bottom:1px solid rgba(22,52,60,.07)}
.rel-item:last-of-type{border-bottom:none}
.rel-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:6px}
.rel-t{display:block;font-size:14px;font-weight:650;color:var(--ink);line-height:1.4}
.rel-item:hover .rel-t{color:var(--teal-deep)}
.rel-s{display:block;font-size:11.5px;font-weight:650;color:var(--ink-mute);margin-top:2px}
.rel-more{display:inline-block;margin-top:10px;font-size:12.5px;font-weight:750;color:var(--teal-deep)}
.rel-all{display:inline-block;margin-top:22px;font-size:13.5px;font-weight:750;color:var(--teal-deep)}
@media (max-width:640px){ .rel-cols{gap:20px} .related{padding:26px 0 24px} }

/* Per-page corrections/sources band, above the shared footer. */
.story-corrections{margin-top:44px;background:var(--sand-100);border-top:1px solid rgba(22,52,60,.08);
  padding:30px 0 26px}
.story-corrections .wrap{max-width:1160px}
.story-corrections p{font-size:12.5px;line-height:1.65;color:var(--ink-soft);max-width:760px;margin-bottom:9px}
.story-corrections a{color:var(--teal-deep);font-weight:600}
.story-fixed{border-left:3px solid var(--teal-deep);padding:2px 0 2px 15px;margin:0 0 18px;max-width:760px}
.story-fixed h3{font-size:13px;font-weight:750;letter-spacing:.02em;color:var(--ink);margin:0 0 7px}
.story-fixed ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.story-fixed li{font-size:12.5px;line-height:1.65;color:var(--ink-soft)}
.story-fixed time{font-weight:700;color:var(--ink)}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .grid{grid-template-columns:1fr;gap:34px;padding-top:30px}
  article{max-width:none}
}
/* On a phone the sidebar stacks under the whole article, which left "Follow this
   project" — the only way a reader ever comes back — 2,690px down, past the
   timeline and every receipt. Reordering the cards fixed the depth but pushed the
   headline below a facts panel, which is worse: people came here to read.
   A dock keeps the reading order intact and puts the action one tap away. */
@media (max-width:960px){
  .follow-dock{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;gap:10px;
    align-items:center;padding:10px 16px calc(10px + env(safe-area-inset-bottom));
    background:rgba(251,247,239,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    border-top:1px solid rgba(22,52,60,.12);
    transform:translateY(110%);transition:transform .22s ease}
  .follow-dock.on{transform:none}
  .follow-dock span{font-size:12.5px;font-weight:700;color:var(--ink-soft);line-height:1.3;flex:1;min-width:0}
  .follow-dock button{height:42px;padding:0 18px;border:none;border-radius:12px;flex-shrink:0;
    background:var(--teal-deep);color:#fff;font-family:inherit;font-size:14px;font-weight:750;cursor:pointer}
  body{padding-bottom:64px}
}
@media (min-width:961px){ .follow-dock{display:none} }
@media (prefers-reduced-motion:reduce){ .follow-dock{transition:none} }
@media (max-width:860px){
  .head-nav{gap:14px}
  .head-nav a.hide-m{display:none}
}
@media (max-width:640px){
  .shell{padding:0 16px}
  .site-head{padding:10px 16px}
  .brand-tag{display:none}
  .head-nav a{font-size:12.5px}
  .head-nav a.nav-gold{height:34px;padding:0 12px;font-size:12px}
  .cover-panel{margin-top:14px;border-radius:18px;aspect-ratio:1200/560}
  .grid{padding-top:24px}
  .lede{font-size:17px}
  .summary p{font-size:15.5px}
  .head-back span{display:none}
  .follow-form input,.claim-form input,.claim-form textarea{font-size:16px}
}