@font-face { font-family: "Cormorant Garamond"; src: url("assets/fonts/cormorant-garamond-roman.woff2") format("woff2"); font-style: normal; font-weight: 500 700; font-display: swap; }
@font-face { font-family: "Cormorant Garamond"; src: url("assets/fonts/cormorant-garamond-italic.woff2") format("woff2"); font-style: italic; font-weight: 500; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("assets/fonts/ibm-plex-sans-regular.woff2") format("woff2"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("assets/fonts/ibm-plex-sans-medium.woff2") format("woff2"); font-style: normal; font-weight: 500; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("assets/fonts/ibm-plex-mono-regular.woff2") format("woff2"); font-style: normal; font-weight: 400; font-display: swap; }

:root { --paper:#f1ece6; --paper-light:#f6f2ec; --ink:#172d40; --ink-soft:#2b3b44; --mist:#798590; --text-muted:#596873; --stone:#9fa2a4; --rule:#ccc8c1; --coral:#c16e69; --coral-text:#934844; --moss:#697058; --cyan:#a6cedb; --attention:#eb9990; --serif:"Cormorant Garamond",Georgia,serif; --sans:"IBM Plex Sans",Arial,sans-serif; --mono:"IBM Plex Mono",ui-monospace,monospace; --shell:1328px; --edge:56px; --rule-line:1px solid var(--rule); }
:root { --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-6:24px; --space-8:32px; --space-12:48px; --space-16:64px; --space-24:96px; --radius-surface:2px; --radius-control:3px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:400 18px/1.55 var(--sans); }
body,button,input { font-family:var(--sans); }
a { color:inherit; text-decoration:none; }
button { color:inherit; }
h1,h2,h3,p { margin-top:0; }
img { max-width:100%; }
.shell { width:min(calc(100% - (var(--edge) * 2)),var(--shell)); margin-inline:auto; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip-link { position:fixed; top:.75rem; left:.75rem; z-index:10; padding:.75rem 1rem; background:var(--ink); color:var(--paper); transform:translateY(-150%); }
.skip-link:focus { transform:translateY(0); }

.site-header { min-height:144px; border-bottom:var(--rule-line); background:var(--paper); }
.header-inner { min-height:144px; display:flex; align-items:center; justify-content:space-between; }
.wordmark { font:600 72px/1 var(--serif); letter-spacing:8px; }
.header-wordmark { display:block; width:190px; line-height:0; }
.header-wordmark img { display:block; width:100%; height:auto; }
.site-nav { display:flex; align-items:center; gap:clamp(1.1rem,2.6vw,2.65rem); font:600 14px/1 var(--serif); letter-spacing:2px; text-transform:uppercase; }
.site-nav a,.text-link { transition:color 160ms ease; }
.site-nav a:hover,.site-nav a:focus-visible,.text-link:hover,.text-link:focus-visible { color:var(--coral-text); }
.menu-toggle { display:none; min-width:44px; min-height:44px; padding:11px; border:0; background:transparent; }
.menu-toggle > span:not(.sr-only) { display:block; width:22px; height:1px; margin:5px auto; background:currentColor; transition:transform 160ms ease; }

.hero { display:grid; grid-template-columns:minmax(0,550px) minmax(0,1fr); gap:clamp(2rem,3.9vw,52px); padding-top:51px; padding-bottom:120px; }
.hero-copy { padding-top:4px; }
.eyebrow { margin-bottom:18px; color:var(--ink); font:600 14px/1.2 var(--serif); letter-spacing:2px; text-transform:uppercase; }
h1,h2 { font-family:var(--serif); font-weight:500; letter-spacing:-.035em; line-height:1.06; }
h1 { margin-bottom:28px; font-size:clamp(64px,5.15vw,74px); }
h1 em { color:var(--ink); font-style:italic; font-weight:500; }
.hero-copy > p:not(.eyebrow) { max-width:440px; margin-bottom:31px; color:var(--ink-soft); font-size:20px; }
.hero-copy .hero-promise { margin-top:-13px; margin-bottom:27px; color:var(--ink); font:italic 500 26px/1.15 var(--serif); }
.hero-copy .hero-detail { max-width:390px; margin-top:-11px; margin-bottom:28px; color:var(--text-muted); font-size:14px; line-height:1.45; }
.actions { display:flex; align-items:center; gap:28px; }
.button { display:inline-flex; min-height:var(--space-12); align-items:center; justify-content:center; gap:var(--space-4); padding:var(--space-3) var(--space-4); border:1px solid var(--ink); border-radius:var(--radius-control); background:var(--ink); color:var(--paper-light); font:500 15px/1 var(--sans); transition:background 160ms ease,color 160ms ease; }
.button:hover,.button:focus-visible { background:var(--ink-soft); border-color:var(--ink-soft); }
.text-link { display:inline-flex; gap:8px; align-items:center; border-bottom:1px solid currentColor; padding-bottom:3px; font:500 15px/1.2 var(--sans); }
.hero-image { min-height:730px; margin:0; overflow:hidden; background:transparent; }
.hero-image img { display:block; width:100%; height:100%; object-fit:cover; object-position:73% center; }
@supports ((mask-image:url("")) or (-webkit-mask-image:url(""))) {
  .hero-image {
    -webkit-mask-image:url("assets/masks/hero-tree-profile-mask.webp");
    -webkit-mask-mode:luminance;
    -webkit-mask-position:center;
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-size:100% 100%;
    mask-image:url("assets/masks/hero-tree-profile-mask.webp");
    mask-mode:luminance;
    mask-position:center;
    mask-repeat:no-repeat;
    mask-size:100% 100%;
  }
}

@media (min-width:1100px) {
  .hero { grid-template-columns:minmax(0,460px) minmax(0,1fr); gap:40px; }
}

.rule-section { display:grid; grid-template-columns:minmax(250px,1fr) minmax(300px,1.12fr); gap:32px; padding:64px 0 72px; border-top:var(--rule-line); }
h2 { margin-bottom:25px; font-size:clamp(48px,4.85vw,70px); }
.prose { max-width:516px; padding-top:6px; color:var(--ink-soft); }
.prose p + p { margin-top:24px; color:var(--text-muted); }
.narrative { display:grid; grid-template-columns:minmax(300px,.82fr) minmax(410px,1fr); align-items:center; gap:clamp(50px,12vw,190px); padding:56px 8.5% 64px; border-top:var(--rule-line); }
.narrative-reverse { grid-template-columns:minmax(410px,1fr) minmax(300px,.82fr); }
.narrative-reverse .narrative-art { order:2; }
.narrative-art { display:grid; min-height:300px; place-items:center; }
.narrative-art img { display:block; width:min(100%,300px); height:auto; }
.narrative-copy { max-width:530px; }
.narrative-copy > p:not(.eyebrow) { color:var(--ink-soft); }
.inventory { width:100%; margin-top:var(--space-8); border-collapse:collapse; text-align:left; font-size:14px; }
.inventory th,.inventory td { padding:var(--space-3) var(--space-2) var(--space-3) 0; border-bottom:var(--rule-line); font-weight:400; vertical-align:top; }
.inventory th:first-child { width:40%; }
.inventory th:nth-child(2) { width:25%; }
.inventory caption { text-align:left; }
.illustrative { margin:12px 0 10px; color:var(--text-muted); font:400 12px/1.25 var(--mono); text-transform:uppercase; }
.inventory-row { display:grid; grid-template-columns:1.35fr .9fr 1fr; gap:12px; padding:11px 0; border-top:var(--rule-line); font-size:14px; }
.inventory-head { padding-top:8px; color:var(--text-muted); border-top:0; font:400 11px/1.2 var(--mono); text-transform:uppercase; }
.status { display:inline-block; width:9px; height:9px; margin-right:7px; border:1px solid var(--ink); vertical-align:1px; }
.status-good { background:var(--moss); }
.status-watch { background:var(--attention); }
.pull-quote { max-width:410px; margin-top:38px; color:var(--coral-text) !important; font:italic 500 31px/1.15 var(--serif); }
.record-list { margin:32px 0 0; padding:0; list-style:none; border-top:var(--rule-line); }
.record-list li { padding:14px 0; border-bottom:var(--rule-line); }
.record-list b,.record-list small { display:block; }
.record-list b { font:500 16px/1.3 var(--sans); }
.record-list small { margin-top:3px; color:var(--text-muted); font-size:14px; }

.onboarding { padding:64px 0 72px; background:var(--paper-light); border-top:var(--rule-line); }
.onboarding-grid { display:grid; grid-template-columns:minmax(0,.88fr) minmax(350px,1fr); gap:clamp(32px,5vw,64px); align-items:start; }
.onboarding-copy > p:not(.eyebrow) { max-width:450px; color:var(--ink-soft); }
.onboarding-copy > p + p { margin-top:20px; }
.byline { margin-top:28px !important; color:var(--text-muted) !important; font-size:15px; }
.byline a { border-bottom:1px solid currentColor; }
.onboarding-preview { position:relative; padding:29px 31px; border:var(--rule-line); background:var(--paper); scroll-margin-top:24px; }
.onboarding-preview h3 { margin:0 0 24px; font:500 30px/1.05 var(--serif); letter-spacing:-.02em; }
.onboarding-preview .onboarding-disclaimer { margin:-10px 0 22px; color:var(--coral-text); font-size:14px; font-weight:500; line-height:1.4; }
fieldset { margin:0; padding:0 0 22px; border:0; border-bottom:var(--rule-line); }
legend { margin-bottom:15px; font:500 20px/1.2 var(--serif); }
.asset-options { display:flex; gap:10px; }
.asset-options label { position:relative; flex:1 1 0; min-width:0; min-height:44px; }
.asset-options input { position:absolute; opacity:0; inset:0; }
.asset-options span { display:grid; height:44px; place-items:center; border:1px solid var(--mist); font-size:15px; transition:none; }
.asset-options input:checked + span { border-color:var(--ink); background:var(--ink); color:var(--paper-light); }
.asset-options input:focus-visible + span { outline:3px solid var(--coral); outline-offset:2px; }
.preview-line { display:flex; justify-content:space-between; gap:20px; margin:0; padding:13px 0; border-bottom:var(--rule-line); font-size:14px; }
.preview-line span { color:var(--text-muted); }
.preview-line b { font-weight:500; }
.onboarding-preview > .illustrative { margin:20px 0 8px; }
.cli-example { margin:20px 0 0; padding:18px; overflow-wrap:anywhere; background:var(--ink); color:var(--paper-light); }
.onboarding-preview > .illustrative + .cli-example { margin-top:0; }
.cli-example code { display:block; overflow-wrap:anywhere; white-space:pre-wrap; font:400 13px/1.65 var(--mono); }
.cli-example code span { color:var(--cyan); }
.cli-example code b { color:var(--attention); font-weight:400; }
.preview-note { margin:13px 0 0; color:var(--text-muted); font-size:12px; }
.final-cta { padding:80px 0 88px; border-top:var(--rule-line); background:var(--paper); color:var(--ink); }
.final-cta > .shell { max-width:900px; text-align:center; }
.final-cta .eyebrow { color:var(--ink); }
.final-cta h2 { margin-bottom:33px; font-size:clamp(54px,6vw,82px); }
.button-light { border-color:var(--paper-light); background:var(--paper-light); color:var(--ink); }
.button-light:hover,.button-light:focus-visible { color:var(--paper-light); background:var(--coral); border-color:var(--coral); }
.site-footer { overflow:hidden; background:var(--paper); }
.footer-landscape { display:block; width:100%; height:auto; pointer-events:none; }
.footer-inner { display:grid; grid-template-columns:1fr 1fr 1fr; align-items:end; padding:18px 0 27px; border-top:var(--rule-line); color:var(--ink-soft); font-size:14px; }
.story-edge-art { display:none; }
.site-footer .wordmark { font-size:44px; color:var(--ink); }
.footer-inner p { margin:0; }
.footer-inner p:nth-child(2) { text-align:center; }
.footer-inner p:last-child { text-align:right; }
.footer-inner p a { border-bottom:1px solid currentColor; }

/* Optional alternate hero: /?view=forest-story. The repeated edge is decorative;
   it never contains content or clips focusable controls. */
.forest-story .site-header { position:absolute; z-index:5; width:100%; border-color:rgba(246,242,236,.35); background:linear-gradient(180deg,rgba(23,45,64,.68),rgba(23,45,64,0)); color:var(--paper-light); }
.forest-story .site-nav a:hover,.forest-story .site-nav a:focus-visible { color:var(--cyan); }
.forest-story .header-wordmark { padding:5px 8px; background:var(--paper); }
.forest-story .hero { --story-edge-depth:clamp(250px,22vw,300px); --story-leaf-clearance:clamp(150px,12vw,170px); --story-tile:clamp(400px,31vw,443px); position:relative; isolation:isolate; display:block; width:100%; max-width:none; min-height:100svh; margin:0; padding:0; background:var(--paper) url("assets/board-1.webp") 73% center / cover no-repeat; }
.forest-story .hero::before { position:absolute; z-index:0; inset:0; content:""; background:linear-gradient(90deg,rgba(23,45,64,.95) 0%,rgba(23,45,64,.83) 35%,rgba(23,45,64,.3) 66%,rgba(23,45,64,.06) 100%); }
.forest-story .hero-copy { position:relative; z-index:3; width:min(calc(100% - (var(--edge) * 2)),var(--shell)); min-height:720px; margin:auto; padding-top:238px; padding-bottom:calc(48px + var(--story-leaf-clearance)); }
.forest-story .hero-image { display:none; }
.forest-story .hero-copy h1,.forest-story .hero-copy h1 em,.forest-story .hero-copy .eyebrow,.forest-story .hero-copy > p:not(.eyebrow),.forest-story .hero-copy .hero-promise,.forest-story .hero-copy .hero-detail { color:var(--paper-light); }
.forest-story .hero-copy .hero-detail { color:rgba(246,242,236,.78); }
.forest-story .hero-copy .button { border-color:var(--paper-light); background:var(--paper-light); color:var(--ink); }
.forest-story .hero-copy .text-link { color:var(--paper-light); }
.forest-story .hero-copy .button:hover,.forest-story .hero-copy .button:focus-visible { border-color:var(--ink-soft); background:var(--ink-soft); color:var(--paper-light); }
.forest-story .onboarding { background:var(--paper); }

@supports ((mask-image:url("")) or (-webkit-mask-image:url(""))) {
  /* Keep the alternate-hero wordmark legible without changing its link hitbox. */
  .forest-story .header-wordmark { position:relative; isolation:isolate; background:transparent; }
  .forest-story .header-wordmark::before { position:absolute; inset:-14px -20px; z-index:-1; content:""; background:var(--paper); pointer-events:none; -webkit-mask-image:url("assets/masks/hero-tree-profile-mask.webp"); -webkit-mask-mode:luminance; -webkit-mask-repeat:no-repeat; -webkit-mask-position:center; -webkit-mask-size:100% 100%; mask-image:url("assets/masks/hero-tree-profile-mask.webp"); mask-mode:luminance; mask-repeat:no-repeat; mask-position:center; mask-size:100% 100%; }

  .forest-story .story-edge { position:relative; isolation:isolate; border-top:0; }
  .forest-story .story-edge:not(.story-edge--hero) { --story-edge-depth:clamp(220px,18vw,270px); --story-tile:clamp(400px,31vw,443px); }
  .forest-story .story-edge-art { display:block; position:absolute; right:0; bottom:-42px; left:0; z-index:1; height:var(--story-edge-depth); overflow:clip; pointer-events:none; }
  .forest-story .story-edge-art::before,.forest-story .story-edge-art::after {
    position:absolute; inset:0; content:""; background:var(--paper);
    -webkit-mask-image:url("assets/masks/story-leaf-edge.webp"); -webkit-mask-mode:alpha; -webkit-mask-repeat:repeat-x; -webkit-mask-position:center bottom; -webkit-mask-size:var(--story-tile) auto;
    mask-image:url("assets/masks/story-leaf-edge.webp"); mask-mode:alpha; mask-repeat:repeat-x; mask-position:center bottom; mask-size:var(--story-tile) auto;
  }
  .forest-story .story-edge-art::before { opacity:.94; transform:rotate(-1.15deg); transform-origin:center bottom; -webkit-mask-position:32% bottom; mask-position:32% bottom; }
  .forest-story .story-edge-art::after { transform:rotate(.8deg); transform-origin:center bottom; }
  .forest-story .story-edge--hero .story-edge-art { right:0; bottom:0; left:0; z-index:2; height:var(--story-edge-depth); background:linear-gradient(to top,var(--paper) 16px,transparent 32px); }
  .forest-story .story-edge--hero .hero-image { display:none; }

  .forest-story .story-edge--canopy { --story-canopy-height:clamp(104px,10vw,142px); padding-top:calc(56px + var(--story-canopy-height)); }
  .forest-story .story-edge--canopy .story-edge-art,.forest-story .site-footer .story-edge-art--top { top:0; bottom:auto; height:var(--story-canopy-height,clamp(104px,10vw,142px)); }
  .forest-story .story-edge--canopy .story-edge-art { background:url("assets/landscapes/forest-canopy.webp") center 58% / cover no-repeat; -webkit-mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 45%,transparent); mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 45%,transparent); }
  .forest-story .story-edge--canopy .story-edge-art::before,.forest-story .site-footer .story-edge-art--top::before { transform:rotate(178.85deg); transform-origin:center center; }
  .forest-story .story-edge--canopy .story-edge-art::after,.forest-story .site-footer .story-edge-art--top::after { transform:rotate(180.8deg); transform-origin:center center; }
  .forest-story .story-edge > :not(.story-edge-art) { position:relative; z-index:2; }
  .forest-story .site-footer .footer-landscape { z-index:0; }
  .forest-story .site-footer .story-edge-art { z-index:1; }
}

:focus-visible { outline:3px solid var(--coral); outline-offset:3px; }
.onboarding-preview { border-radius:var(--radius-surface); }
@media (max-width:1000px) { .forest-story .site-nav a:hover,.forest-story .site-nav a:focus-visible { color:var(--coral-text); } html:not(.js).forest-story .site-header { position:relative; background:var(--ink); } }
@media (max-width:900px) { :root { --edge:32px; } .site-header,.header-inner { min-height:112px; } .wordmark { font-size:57px; } .site-nav { gap:16px; font-size:13px; letter-spacing:1.3px; } .hero { grid-template-columns:minmax(280px,.85fr) minmax(330px,1fr); padding-bottom:85px; } .hero-image { min-height:490px; } .narrative,.narrative-reverse { gap:50px; padding-inline:4%; } .onboarding-grid { grid-template-columns:1fr; gap:40px; } }
@media (min-width:701px) and (max-width:1000px) {
  .site-header,.header-inner { min-height:112px; }
  .site-header { position:relative; }
  .js .menu-toggle { display:block; }
  .js .site-nav { display:none; position:absolute; top:112px; right:0; left:0; z-index:2; padding:16px 32px 24px; border-bottom:var(--rule-line); background:var(--paper-light); color:var(--ink); }
  .js .site-nav.is-open { display:grid; }
  .js .site-nav a { display:flex; min-height:44px; align-items:center; border-bottom:var(--rule-line); }
  html:not(.js) .header-inner { min-height:auto; flex-wrap:wrap; padding-top:12px; }
  html:not(.js) .site-nav { order:4; flex-basis:100%; display:grid; padding:12px 0 20px; }
  .narrative,.narrative-reverse { grid-template-columns:minmax(0,.82fr) minmax(0,1fr); gap:50px; padding-inline:0; }
  .narrative-reverse .narrative-art { order:2; }
}
@media (max-width:700px) {
  .forest-story .header-wordmark::before { top:-4px; }
  :root { --edge:24px; } body { font-size:17px; } .site-header { position:relative; } .site-header,.header-inner { min-height:auto; } .header-inner { flex-wrap:wrap; padding-top:6px; } .wordmark { font-size:43px; letter-spacing:5px; } .header-wordmark { width:155px; } .js .menu-toggle { display:block; } .site-nav { display:grid; padding:12px 24px 20px; border-bottom:var(--rule-line); background:var(--paper-light); } .js .site-nav { display:none; position:absolute; top:100%; right:0; left:0; z-index:6; } .js .site-nav.is-open { display:grid; } html:not(.js) .site-header { min-height:auto; } html:not(.js) .header-inner { min-height:auto; } html:not(.js) .site-nav { order:4; flex-basis:100%; } .site-nav a { display:flex; min-height:44px; align-items:center; border-bottom:var(--rule-line); } .menu-toggle[aria-expanded="true"] span:nth-of-type(2) { transform:translateY(3px) rotate(45deg); } .menu-toggle[aria-expanded="true"] span:nth-of-type(3) { transform:translateY(-3px) rotate(-45deg); }
  .hero { display:flex; flex-direction:column; gap:43px; padding-top:56px; padding-bottom:72px; } h1 { font-size:clamp(48px,13vw,54px); } h2 { font-size:clamp(45px,12vw,58px); } .hero-copy > p:not(.eyebrow) { font-size:18px; } .hero-copy .hero-promise { font-size:24px; } .hero-image { position:relative; aspect-ratio:4/3; min-height:385px; width:100%; } .hero-image img { position:absolute; inset:0; object-position:70% center; } .rule-section { grid-template-columns:1fr; gap:16px; padding:48px 0 56px; } .rule-section .prose { padding-top:5px; } .narrative,.narrative-reverse { grid-template-columns:1fr; gap:23px; padding:48px 0 56px; } .narrative-reverse .narrative-art { order:0; } .narrative-art { min-height:220px; } .narrative-art img { width:min(80%,300px); } .inventory-row { grid-template-columns:1.16fr .8fr .85fr; gap:8px; font-size:12px; }
  .onboarding { padding:48px 0 56px; } .onboarding-grid { grid-template-columns:1fr; gap:32px; } .onboarding-preview { padding:20px; } .onboarding-preview h3 { margin-bottom:20px; } .final-cta { padding:64px 0 72px; } .footer-inner { grid-template-columns:1fr auto; gap:7px; padding:14px 0 20px; font-size:12px; } .site-footer .wordmark { font-size:35px; } .footer-inner p:nth-child(2) { display:none; } .footer-inner p:last-child { text-align:right; }
  .forest-story .site-header { position:absolute; background:linear-gradient(180deg,rgba(23,45,64,.58),rgba(23,45,64,0)); } .forest-story .site-nav { color:var(--ink); } .forest-story .hero { --story-edge-depth:235px; --story-leaf-clearance:130px; --story-tile:clamp(300px,88vw,380px); min-height:640px; background-position:68% center; } .forest-story .hero::before { width:100%; background:linear-gradient(90deg,rgba(23,45,64,.94),rgba(23,45,64,.8) 52%,rgba(23,45,64,.6)); } .forest-story .hero-copy { min-height:640px; padding-top:150px; padding-bottom:calc(48px + var(--story-leaf-clearance)); }
  @supports ((mask-image:url("")) or (-webkit-mask-image:url(""))) { .forest-story .story-edge:not(.story-edge--hero) { --story-edge-depth:220px; --story-tile:clamp(300px,88vw,380px); } .forest-story .story-edge-art { height:var(--story-edge-depth); } .forest-story .story-edge--canopy { --story-canopy-height:110px; padding-top:calc(48px + var(--story-canopy-height)); } }
}
@media (max-width:390px) { .actions { align-items:flex-start; flex-direction:column; gap:20px; } .inventory-row { font-size:11px; } }
@media (max-width:700px) { .inventory { font-size:12px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; } }
