:root {
    color-scheme: light;
    --night:#1D2233; --night2:#262C3F; --bone:#F6EEE4; --bone2:#EDE3D6; --amber:#D98A5B; --heather:#7A6E80; --slate:#3E4A56;
    --rule:rgba(29,34,51,.16); --rule-dark:rgba(246,238,228,.18);
    --serif:"Fraunces",Georgia,"Times New Roman",serif; --sans:"Manrope","Helvetica Neue",Arial,sans-serif;
    --gutter:clamp(20px,5vw,72px); --max:1320px;
  }
  * { box-sizing:border-box; }
  html { scroll-behavior:smooth; }
  @media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
  body { margin:0; background:var(--bone); color:var(--night); font-family:var(--sans); font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased; }
  a { color:inherit; }
  a:focus-visible, button:focus-visible, summary:focus-visible { outline:2px solid var(--amber); outline-offset:4px; }
  img { max-width:100%; display:block; }
  p { margin:0; max-width:60ch; }
  .wrap { max-width:var(--max); margin-inline:auto; padding-inline:var(--gutter); }

  /* Type */
  .lab { margin:0; font-size:.7rem; text-transform:uppercase; letter-spacing:.16em; font-weight:600; color:var(--heather); }
  .dark .lab { color:rgba(246,238,228,.7); }
  h1, h2, h3 { margin:0; font-family:var(--serif); font-weight:300; letter-spacing:-.02em; line-height:1.02; text-wrap:balance; }
  h1 i, h2 i, h3 i { font-style:italic; font-weight:400; }
  h2 { font-variation-settings:"opsz" 144; font-size:clamp(2.2rem,5vw,4.4rem); }
  h3 { font-size:clamp(1.35rem,2vw,1.7rem); line-height:1.15; }
  .lede { font-family:var(--serif); font-weight:300; font-size:clamp(1.25rem,2vw,1.6rem); line-height:1.35; max-width:36em; }
  .amber { color:var(--amber); }

  /* Nav */
  .nav { position:fixed; top:0; left:0; right:0; z-index:20; padding-top:env(safe-area-inset-top,0px); color:var(--bone); transition:background .35s ease, color .35s ease; }
  .nav .wrap { display:flex; justify-content:space-between; align-items:center; gap:1rem; min-height:72px; font-size:.72rem; text-transform:uppercase; letter-spacing:.16em; font-weight:600; }
  .nav .brand { font-weight:700; text-decoration:none; letter-spacing:.2em; }
  .nav ul { list-style:none; margin:0; padding:0; display:flex; gap:1.8rem; }
  .nav ul a { text-decoration:none; opacity:.85; }
  .nav ul a:hover { opacity:1; }
  @media (max-width:820px) { .nav ul { display:none; } }
  .nav.solid { background:rgba(246,238,228,.92); color:var(--night); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
  .pill { display:inline-block; border:1px solid currentColor; border-radius:999px; padding:.65em 1.2em; text-decoration:none; white-space:nowrap; font-size:.72rem; text-transform:uppercase; letter-spacing:.16em; font-weight:600; transition:background .25s, color .25s; }
  .pill:hover { background:currentColor; }
  .pill:hover span { color:var(--night); }
  .nav.solid .pill:hover span { color:var(--bone); }
  .btn { display:inline-block; font-size:.72rem; text-transform:uppercase; letter-spacing:.16em; font-weight:600; padding:1em 1.5em; border-radius:999px; background:var(--bone); color:var(--night); text-decoration:none; transition:transform .25s ease; }
  .btn:hover { transform:translateY(-1px); }
  .btn.ghost { background:transparent; color:inherit; border:1px solid currentColor; }
  .btn.night { background:var(--night); color:var(--bone); }

  /* Hero */
  .hero { position:relative; height:clamp(600px,100svh,960px); color:var(--bone); isolation:isolate; overflow:hidden; display:grid; align-items:end; }
  .hero > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
  .hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(29,34,51,.35) 0%, rgba(29,34,51,0) 30%, rgba(29,34,51,0) 50%, rgba(29,34,51,.6) 100%); }
  .hero .wrap { width:100%; padding-block:clamp(2rem,5vw,4rem); display:grid; gap:1.25rem; }
  .h1 { font-variation-settings:"opsz" 144; font-size:clamp(2.5rem,7.6vw,7rem); }
  .h1 .line { display:block; white-space:nowrap; }
  @media (max-width:480px) { .h1 .line { white-space:normal; } }
  .city { display:inline-block; font-style:italic; font-weight:400; color:var(--amber); }
  .city .w { display:inline-block; }
  @media (prefers-reduced-motion:no-preference) {
    .city .w { transition:opacity .3s ease, transform .3s ease; }
    .city .w.out { opacity:0; transform:translateY(.35em); }
    .city .w.in { opacity:0; transform:translateY(-.35em); }
    .hero .rise { animation:rise 1.1s cubic-bezier(.2,.7,.2,1) both; }
    .hero .rise:nth-child(2) { animation-delay:.12s; } .hero .rise:nth-child(3) { animation-delay:.24s; } .hero .rise:nth-child(4) { animation-delay:.36s; }
    @keyframes rise { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:none; } }
  }
  .sub { font-size:clamp(1.05rem,1.6vw,1.3rem); max-width:34em; line-height:1.4; }
  .cta { display:flex; flex-wrap:wrap; gap:.75rem; align-items:center; }
  .marks { display:flex; justify-content:space-between; align-items:end; gap:1rem; font-size:.68rem; text-transform:uppercase; letter-spacing:.16em; font-weight:600; margin-top:1.5rem; }
  .marks .chap { display:flex; gap:1.6rem; }
  .marks .chap a { text-decoration:none; opacity:.5; }
  .marks .chap a:first-child { opacity:1; }

  /* Sections */
  section { padding-block:clamp(4rem,9vw,8.5rem); }
  section + section { border-top:1px solid var(--rule); }
  .dark { background:var(--night); color:var(--bone); }
  .dark + section, section + .dark { border-top:0; }
  .split { display:grid; gap:2.5rem; }
  @media (min-width:900px) { .split { grid-template-columns:5fr 7fr; align-items:start; } }
  .head { display:grid; gap:1rem; }
  .body { display:grid; gap:1.5rem; }
  .photo { position:relative; overflow:hidden; }
  .photo img { width:100%; aspect-ratio:4/3; object-fit:cover; }
  .premise-grid { display:grid; gap:2.5rem; }
  @media (min-width:900px) { .premise-grid { grid-template-columns:7fr 5fr; align-items:center; } #why .premise-grid { grid-template-columns:5fr 7fr; align-items:start; } }

  /* Stack list */
  .stack { list-style:none; margin:0; padding:0; display:grid; }
  @media (min-width:760px) { .stack { grid-template-columns:1fr 1fr; column-gap:3rem; } }
  .stack li { display:grid; grid-template-columns:2.4rem 1fr; gap:.25rem 1rem; padding-block:1.4rem; border-top:1px solid var(--rule-dark); align-content:start; }
  .stack li .n { font-size:.7rem; letter-spacing:.14em; font-weight:600; opacity:.6; padding-top:.5rem; font-variant-numeric:tabular-nums; }
  .stack li h3 { grid-column:2; }
  .stack li p { grid-column:2; opacity:.8; font-size:.95rem; }

  /* Terms */
  .terms { display:grid; gap:2rem; }
  @media (min-width:760px) { .terms { grid-template-columns:repeat(3,1fr); gap:3rem; } }
  .term { display:grid; gap:.9rem; align-content:start; border-top:1px solid var(--rule); padding-top:1.25rem; }
  .term .big { font-family:var(--serif); font-variation-settings:"opsz" 144; font-weight:300; font-size:clamp(3rem,6vw,5.4rem); line-height:.95; letter-spacing:-.03em; }
  .term .big i { font-style:italic; font-weight:400; color:var(--amber); font-size:.5em; letter-spacing:0; vertical-align:baseline; margin-left:.15em; }

  /* Fit */
  .fit { display:grid; gap:2rem; }
  @media (min-width:760px) { .fit { grid-template-columns:1fr 1fr; gap:3rem; } }
  .fit ul { list-style:none; margin:0; padding:0; display:grid; gap:.9rem; }
  .fit li { padding-left:1.5rem; position:relative; }
  .fit li::before { content:""; position:absolute; left:0; top:.75em; width:.8rem; height:1px; background:currentColor; }
  .fit .no li { color:var(--heather); }
  .fit .no li::before { background:var(--amber); }

  /* Manifesto */
  .manifesto { position:relative; isolation:isolate; color:var(--bone); overflow:hidden; }
  .manifesto > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
  .manifesto::before { content:""; position:absolute; inset:0; z-index:-1; background:rgba(29,34,51,.72); }
  .laws { list-style:none; margin:0; padding:0; counter-reset:law; display:grid; }
  .laws li { counter-increment:law; display:grid; grid-template-columns:2.4rem 1fr; gap:.35rem 1rem; padding-block:1.5rem; border-top:1px solid var(--rule-dark); align-items:baseline; }
  .laws li::before { content:counter(law, decimal-leading-zero); font-size:.7rem; letter-spacing:.14em; font-weight:600; opacity:.6; font-variant-numeric:tabular-nums; }
  .laws .old { font-size:.85rem; opacity:.6; letter-spacing:.02em; }
  .laws .new { grid-column:2; font-family:var(--serif); font-weight:300; font-size:clamp(1.4rem,2.6vw,2.2rem); line-height:1.15; letter-spacing:-.01em; }
  .laws .new i { font-style:italic; font-weight:400; color:var(--amber); }

  /* Areas */
  .areas { list-style:none; margin:0; padding:0; display:grid; }
  .areas li { display:grid; grid-template-columns:1fr; gap:.35rem 2rem; padding-block:1.4rem; border-top:1px solid var(--rule-dark); align-items:baseline; }
  @media (min-width:760px) { .areas li { grid-template-columns:2fr 3fr; } }
  .areas h3 { display:flex; gap:.75rem; align-items:baseline; flex-wrap:wrap; }
  .areas .soon { font-family:var(--sans); font-size:.62rem; text-transform:uppercase; letter-spacing:.16em; font-weight:600; opacity:.55; }
  .areas p { opacity:.8; }
  .fee { grid-column:2; border-top:1px solid var(--rule-dark); padding-top:1.4rem; font-family:var(--serif); font-weight:300; font-size:1.25rem; line-height:1.3; }
  @media (max-width:899px) { .fee { grid-column:1; } }
  .areas li.off h3, .areas li.off p { opacity:.45; }
  /* Why */
  .why { display:grid; gap:2rem; }
  @media (min-width:760px) { .why { grid-template-columns:1fr 1fr; gap:3rem 4rem; } }
  .why > div { display:grid; gap:.75rem; align-content:start; border-top:1px solid var(--rule); padding-top:1.25rem; }
  .dark .why > div { border-top-color:var(--rule-dark); }
  .why .n { font-size:.7rem; letter-spacing:.14em; font-weight:600; color:var(--amber); }
  .close { text-align:left; }
  .close .lede { font-size:clamp(1.6rem,3.4vw,2.8rem); line-height:1.2; max-width:26em; }
  /* FAQ */
  details { border-top:1px solid var(--rule); }
  details:last-of-type { border-bottom:1px solid var(--rule); }
  summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:1.5rem; padding-block:1.25rem; font-family:var(--serif); font-weight:300; font-size:clamp(1.2rem,1.8vw,1.5rem); line-height:1.2; }
  summary::-webkit-details-marker { display:none; }
  summary::after { content:"+"; color:var(--amber); font-family:var(--sans); font-weight:400; flex:none; }
  details[open] summary::after { content:"–"; }
  details p { padding-bottom:1.5rem; color:var(--slate); }

  /* Contact */
  .contact .wrap { display:grid; gap:2rem; }
  .email { font-family:var(--serif); font-weight:300; font-size:clamp(1.6rem,4vw,3.2rem); text-decoration:none; letter-spacing:-.02em; word-break:break-all; }
  .email:hover { color:var(--amber); }
  .cities { font-size:.72rem; text-transform:uppercase; letter-spacing:.16em; font-weight:600; opacity:.7; line-height:2; }

  footer { background:var(--night); color:var(--bone); }
  footer .wrap { display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem 2rem; padding-block:2rem; font-size:.7rem; text-transform:uppercase; letter-spacing:.16em; font-weight:600; border-top:1px solid var(--rule-dark); }
  footer .brand { letter-spacing:.2em; font-weight:700; }
  footer a { text-decoration:none; opacity:.75; }

  /* Page headers (Why, Team) */
  .pagehead { position:relative; isolation:isolate; color:var(--bone); overflow:hidden; padding-top:72px; }
  .pagehead > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
  .pagehead::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(29,34,51,.45) 0%, rgba(29,34,51,.35) 60%, rgba(29,34,51,.7) 100%); }
  .pagehead .wrap { padding-block:clamp(5rem,12vw,10rem) clamp(3rem,6vw,5rem); display:grid; gap:1.25rem; min-height:min(70vh,640px); align-content:end; }
  .pagehead h1 { font-variation-settings:"opsz" 144; font-size:clamp(2.5rem,7vw,6rem); }
  .laws { list-style:none; margin:0; padding:0; counter-reset:law; display:grid; }
  .laws li { counter-increment:law; display:grid; grid-template-columns:2.4rem 1fr; gap:.35rem 1rem; padding-block:1.6rem; border-top:1px solid var(--rule); align-items:baseline; }
  .laws li::before { content:counter(law, decimal-leading-zero); font-size:.7rem; letter-spacing:.14em; font-weight:600; color:var(--heather); font-variant-numeric:tabular-nums; }
  .laws .old { position:relative; display:inline-block; width:fit-content; font-family:var(--serif); font-weight:300; font-style:italic; font-size:1.05rem; color:var(--heather); }
  .laws .old::after { content:""; position:absolute; left:-1%; right:-1%; top:55%; height:1.5px; background:var(--amber); }
  .laws .new { grid-column:2; font-family:var(--serif); font-weight:300; font-size:clamp(1.5rem,2.8vw,2.4rem); line-height:1.12; letter-spacing:-.015em; }
  .laws .new i { font-style:italic; font-weight:400; color:var(--amber); }
  .people { display:grid; gap:2.5rem 2rem; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); }
  .person { display:grid; gap:.75rem; align-content:start; }
  .person .portrait { aspect-ratio:4/5; background:var(--bone2); overflow:hidden; }
  .person .portrait img { width:100%; height:100%; object-fit:cover; }
  .person h3 { font-size:1.5rem; }
  .person .role { font-size:.7rem; text-transform:uppercase; letter-spacing:.16em; font-weight:600; color:var(--heather); }
  .person p { font-size:.95rem; color:var(--slate); }
  .nav.on-light { color:var(--night); }

  /* Going global: full copy first, then the ridges draw in while pinned; the scroll is the boundary to the next section */
  .global { padding-block:0; }
  .ridges { position:relative; margin:0; padding-top:72px; }
  .ridges .overlay { position:absolute; top:calc(72px + clamp(2.5rem,6vw,5rem)); left:0; right:0; z-index:2; }
  .ridges svg { display:block; width:100%; height:auto; }
  .ridges figcaption { padding-block:1.25rem clamp(2rem,5vw,4rem); }
  .chart-title { font-family:var(--serif); font-weight:300; font-size:clamp(1.05rem,1.6vw,1.3rem); color:rgba(246,238,228,.85); }
  @media (min-width:901px) {
    .global { height:230vh; }
    .ridges { position:sticky; top:0; height:100vh; display:flex; flex-direction:column; justify-content:flex-end; padding-top:0; }
    .ridges .overlay { position:absolute; top:calc(72px + clamp(2rem,5vw,4rem)); left:0; right:0; }
    .ridges svg { width:100%; height:auto; max-height:calc(100vh - 170px); }
    .ridges figcaption { padding-block:1rem 2rem; align-self:stretch; }
  }
  @media (max-width:900px) { .ridges .overlay { position:static; padding-block:clamp(2.5rem,6vw,5rem) 1rem; } .ridges svg { min-height:60vw; } }
  .tip { position:absolute; pointer-events:none; background:rgba(246,238,228,.96); color:var(--night); font-size:.72rem; line-height:1.45; padding:.55rem .7rem; min-width:10rem; opacity:0; transition:opacity .15s; z-index:3; }
  .tip b { display:block; font-family:var(--serif); font-weight:400; font-size:1rem; margin-bottom:.2rem; }
  .tip .r { display:flex; justify-content:space-between; gap:1rem; font-variant-numeric:tabular-nums; }
  .tip .r span:first-child { display:flex; align-items:center; gap:.4rem; }
  .tip .sw { width:.55rem; height:.55rem; display:inline-block; }

  /* Why page: the creed */
  .creed { display:grid; gap:2rem; max-width:44em; }
  .beliefs { list-style:none; margin:0; padding:0; display:grid; }
  .beliefs li { font-family:var(--serif); font-weight:300; font-size:clamp(1.25rem,2vw,1.6rem); line-height:1.4; padding-block:1.75rem; border-top:1px solid var(--rule-dark); letter-spacing:-.005em; }
  .beliefs li:last-child { border-bottom:1px solid var(--rule-dark); }
  .beliefs li i { font-style:italic; font-weight:400; color:var(--amber); }

  /* Blog */
  .more { font-family:var(--serif); font-weight:300; font-size:1.25rem; text-decoration:none; border-bottom:1px solid var(--amber); padding-bottom:.1em; }
  .more:hover { color:var(--amber); }
  .article { padding-top:calc(72px + clamp(3rem,7vw,6rem)); padding-bottom:clamp(4rem,9vw,8rem); }
  .art-head { display:grid; gap:1.25rem; }
  .art-head h1 { font-variation-settings:"opsz" 144; font-size:clamp(2.4rem,6vw,5rem); }
  .art-head .lab a { text-decoration:none; }
  .art-body { display:grid; gap:1.5rem; font-family:var(--serif); font-weight:300; font-size:clamp(1.2rem,1.8vw,1.45rem); line-height:1.45; }
  .art-body p { max-width:none; }
  .art-foot { border-top:1px solid var(--rule); padding-top:1.5rem; }
  .art-foot a { text-decoration:none; color:var(--night); }
  .posts { list-style:none; margin:0; padding:0; display:grid; }
  .posts li { border-top:1px solid var(--rule); }
  .posts li:last-child { border-bottom:1px solid var(--rule); }
  .posts a { display:grid; gap:.35rem; padding-block:1.5rem; text-decoration:none; }
  .post-title { font-family:var(--serif); font-weight:300; font-size:clamp(1.5rem,2.6vw,2.2rem); line-height:1.15; letter-spacing:-.015em; }
  .posts a:hover .post-title { color:var(--amber); }
  .post-sub { color:var(--slate); }
