/* Blue Moss — interior page styles (about, resources, tools, insights index) */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Inter:wght@300;400;500;600&display=swap');
:root{--ink:#0e1a2b;--ink-2:#132135;--ink-3:#1f2c40;--paper:#f4f1ea;--moss:#5b7e6e;--moss-soft:#94aea3;--amber:#c08a3e;--muted:rgba(244,241,234,.55);--muted-2:rgba(244,241,234,.72);--rule:rgba(244,241,234,.15);--serif:'Cormorant Garamond',Georgia,serif;--sans:'Inter',-apple-system,BlinkMacSystemFont,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p,ul,figure{margin:0;padding:0}
ul{list-style:none}

/* ── nav (mirrors article.css) ── */
.nav{position:sticky;top:0;z-index:100;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:20px 48px;background:rgba(14,26,43,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--rule);font-size:13px}
.nav-brand{font-family:var(--serif);font-style:italic;font-weight:500;font-size:18px;letter-spacing:-.01em;white-space:nowrap}
.nav-links{display:flex;align-items:center;gap:34px}
.nav-item{position:relative}
.nav-link{position:relative;display:inline-block;padding-bottom:4px;opacity:.78;letter-spacing:.005em;transition:opacity .24s ease}
.nav-link:hover,.nav-link.is-active{opacity:1;color:var(--paper)}
.nav-link::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--moss-soft);transform:scaleX(0);transform-origin:left center;transition:transform .38s cubic-bezier(.22,.61,.36,1)}
.nav-link:hover::after,.nav-link.is-active::after{transform:scaleX(1)}
.nav-link .caret{display:inline-block;margin-left:6px;font-size:9px;opacity:.6;transform:translateY(-1px)}
.submenu{position:absolute;top:100%;left:-18px;padding-top:14px;min-width:186px;opacity:0;visibility:hidden;transform:translateY(-5px);transition:opacity .22s ease,transform .22s ease,visibility .22s}
.nav-item:hover .submenu,.nav-item:focus-within .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.submenu-inner{background:var(--ink-2);border:1px solid var(--rule);padding:8px 0}
.submenu a{display:block;padding:9px 18px;font-size:12.5px;color:var(--muted-2);transition:background .18s ease,color .18s ease}
.submenu a:hover{background:rgba(148,174,163,.1);color:var(--paper)}
.submenu .sub-note{display:block;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:2px}
.nav-flat{display:none}
.nav-burger{display:none;background:none;border:0;padding:0;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;margin-right:-10px}
.nav-burger span{display:block;width:20px;height:1.5px;background:var(--paper);transition:transform .3s cubic-bezier(.22,.61,.36,1),opacity .2s ease}
.nav.is-open .nav-burger span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav.is-open .nav-burger span:nth-child(2){opacity:0}
.nav.is-open .nav-burger span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* ── page shell ── */
.wrap{max-width:1120px;margin:0 auto;padding:0 48px}
@media(max-width:820px){.wrap{padding:0 24px}}
.phero{padding:104px 0 64px;border-bottom:1px solid var(--rule)}
@media(max-width:820px){.phero{padding:64px 0 44px}}
.eyebrow{display:flex;align-items:center;gap:12px;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--amber);margin-bottom:26px}
.eyebrow .dot{width:3px;height:3px;background:currentColor;opacity:.6;border-radius:50%}
.eyebrow .plain{color:var(--muted)}
h1.big{font-family:var(--serif);font-weight:400;font-size:clamp(42px,6.4vw,78px);line-height:1.04;letter-spacing:-.02em;max-width:17ch}
h1.big em{font-style:italic;color:var(--moss-soft)}
.lede{font-family:var(--serif);font-size:clamp(19px,2.1vw,24px);line-height:1.5;color:var(--muted-2);max-width:60ch;margin-top:28px}

.sect{padding:76px 0;border-bottom:1px solid var(--rule)}
.sect:last-of-type{border-bottom:none}
.sec-head{display:flex;align-items:baseline;gap:18px;margin-bottom:40px}
.sec-num{font-family:var(--sans);font-size:10.5px;letter-spacing:.22em;color:var(--amber)}
.sec-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3.4vw,40px);line-height:1.1;letter-spacing:-.01em}
.body{font-family:var(--serif);font-size:19px;line-height:1.62;color:var(--muted-2);max-width:66ch;display:flex;flex-direction:column;gap:18px}
.body b{color:var(--paper);font-weight:500}
.points{display:flex;flex-direction:column;gap:22px;max-width:68ch}
.points li{position:relative;padding-left:26px;font-family:var(--serif);font-size:19px;line-height:1.6;color:var(--muted-2)}
.points li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:1px;background:var(--moss-soft)}
.points b{color:var(--paper);font-weight:500}
.points.tight{gap:12px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tools-list{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.tool{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:44px;align-items:start;padding:32px 0;border-bottom:1px solid var(--rule)}
.tool h3{font-family:var(--serif);font-weight:400;font-size:25px;line-height:1.15;letter-spacing:-.01em}
.tool p{font-family:var(--serif);font-size:17.5px;line-height:1.55;color:var(--muted-2);margin-top:10px;max-width:56ch}
.tool-form{display:flex;gap:12px;align-items:center;padding-top:6px}
.tool-form input[type=email]{flex:1;min-width:0;background:transparent;border:none;border-bottom:1px solid var(--rule);color:var(--paper);font-family:var(--sans);font-size:16px;padding:9px 0;outline:none;transition:border-color .2s ease}
.tool-form input[type=email]:focus{border-bottom-color:var(--moss-soft)}
.tool-form button{background:var(--amber);color:#0e1a2b;border:0;padding:13px 24px;font-family:var(--sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:background .2s ease}
.tool-form button:hover{background:#d5a262}
.tool-form .hp{position:absolute;left:-9999px}
.tool-cta{font-family:var(--serif);font-size:18px;color:var(--muted-2);margin-top:38px}
.tool-cta a{color:var(--moss-soft);border-bottom:1px solid rgba(148,174,163,.35)}
.tool-cta a:hover{color:var(--paper);border-bottom-color:var(--paper)}
@media(max-width:820px){.tool{grid-template-columns:minmax(0,1fr);gap:18px;padding:26px 0}.tool-form{width:100%;flex-wrap:wrap;gap:16px}.tool-form input[type=email]{flex:1 1 100%}.tool-form button{width:100%;padding:15px 24px}.tool-cta{margin-top:30px;font-size:17px}}

/* ── list of things (articles, tools, arms) ── */
.rows{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.row{display:grid;grid-template-columns:78px 1fr 200px;gap:32px;align-items:start;padding:30px 0;border-bottom:1px solid var(--rule);transition:background .2s ease}
a.row:hover{background:rgba(148,174,163,.055)}
.row .idx{font-family:var(--sans);font-size:10.5px;letter-spacing:.2em;color:var(--amber);padding-top:7px}
.row h3{font-family:var(--serif);font-weight:400;font-size:27px;line-height:1.16;letter-spacing:-.01em}
.row h3 em{font-style:italic;color:var(--moss-soft)}
.row p{font-family:var(--serif);font-size:17px;line-height:1.5;color:var(--muted-2);margin-top:10px;max-width:58ch}
.row .meta{display:flex;flex-direction:column;gap:6px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);text-align:right;padding-top:8px}
.row .meta .stat{color:var(--moss-soft)}
.row .meta .soon{color:var(--muted)}
.row.dim{opacity:.5}
@media(max-width:820px){.row{grid-template-columns:1fr;gap:10px;padding:26px 0}.row .meta{flex-direction:row;gap:14px;text-align:left;flex-wrap:wrap;padding-top:2px}.row h3{font-size:23px}}

/* ── featured ── */
.feature{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:end;padding:64px 0;border-bottom:1px solid var(--rule)}
.feature h2{font-family:var(--serif);font-weight:400;font-size:clamp(32px,4.4vw,54px);line-height:1.06;letter-spacing:-.02em}
.feature h2 em{font-style:italic;color:var(--moss-soft)}
.feature .stand{font-family:var(--serif);font-size:19px;line-height:1.55;color:var(--muted-2);margin-top:22px;max-width:52ch}
.feature .badge{display:inline-block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);border:1px solid rgba(192,138,62,.4);padding:5px 11px;margin-bottom:22px}
.thumb{border:1px solid var(--rule);background:var(--ink-2);aspect-ratio:4/3;display:flex;flex-direction:column;justify-content:flex-end;padding:26px;gap:6px;position:relative;overflow:hidden}
.thumb .tline{position:absolute;inset:0}
.thumb .tnum{font-family:var(--serif);font-size:52px;line-height:1;color:var(--amber);position:relative}
.thumb .tcap{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);position:relative}
@media(max-width:820px){.feature{grid-template-columns:1fr;gap:32px;padding:44px 0}.thumb{aspect-ratio:16/9}}

/* ── arms ── */
.arms{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule)}
.arm{padding:34px 32px 38px;border-bottom:1px solid var(--rule);border-left:1px solid var(--rule);display:flex;flex-direction:column;gap:16px}
.arm:first-child{border-left:none}
.arm .tag{font-family:var(--serif);font-style:italic;font-size:26px;color:var(--amber);line-height:1}
.arm h3{font-family:var(--serif);font-weight:400;font-size:25px;line-height:1.1}
.arm .sub{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-top:5px}
.arm p{font-family:var(--serif);font-size:17px;line-height:1.5;color:var(--muted-2);flex:1}
.arm ul{display:flex;flex-direction:column;gap:8px;padding-top:16px;border-top:1px solid var(--rule)}
.arm li{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
@media(max-width:900px){.arms{grid-template-columns:1fr}.arm{border-left:none;padding:30px 0 32px}}

/* ── facts ── */
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:8px}
.fact{background:var(--ink);padding:30px 28px}
.fact .n{font-family:var(--serif);font-size:44px;line-height:1;color:var(--amber)}
.fact .l{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:12px}
@media(max-width:820px){.facts{grid-template-columns:1fr}}

/* ── signup ── */
.signup{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding:72px 0}
.signup h2{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3.4vw,40px);line-height:1.1;letter-spacing:-.01em}
.signup p{font-family:var(--serif);font-size:18px;line-height:1.55;color:var(--muted-2);margin-top:16px;max-width:44ch}
.signup form{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
.signup .f{flex:1;min-width:220px;display:flex;flex-direction:column;gap:8px}
.signup label{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.signup input{background:transparent;border:none;border-bottom:1px solid var(--rule);color:var(--paper);font-family:var(--sans);font-size:16px;padding:11px 0;outline:none;transition:border-color .2s ease;width:100%}
.signup input:focus{border-bottom-color:var(--moss-soft)}
.signup button{background:var(--paper);color:var(--ink);border:none;padding:14px 26px;font-family:var(--sans);font-size:12.5px;font-weight:500;letter-spacing:.04em;cursor:pointer;transition:background .2s ease}
.signup button:hover{background:#fff}
.signup .hp{position:absolute;left:-9999px}
@media(max-width:820px){.signup{grid-template-columns:1fr;gap:30px;padding:52px 0}.signup form{gap:16px}.signup .f{flex:1 1 100%}.signup button{width:100%;padding:15px 24px}.points li{font-size:17.5px;padding-left:22px}.sect{padding:52px 0}.sec-head{margin-bottom:28px}}

/* ── footer ── */
.foot{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:30px 48px;border-top:1px solid var(--rule);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.foot a:hover{color:var(--paper)}
@media(max-width:820px){.foot{padding:24px}}

/* ── entrance ── */
@media(prefers-reduced-motion:no-preference){
.rise{opacity:0;transform:translateY(10px);animation:rise .7s cubic-bezier(.22,.61,.36,1) forwards}
.rise:nth-child(1){animation-delay:.05s}.rise:nth-child(2){animation-delay:.14s}.rise:nth-child(3){animation-delay:.23s}
@keyframes rise{to{opacity:1;transform:none}}}

@media (max-width: 820px) {
  .nav{flex-direction:row;align-items:center;justify-content:space-between;gap:12px;height:54px;padding:0 22px}
  .nav-brand{font-size:17px}
  .nav-burger{display:flex}
  .nav-links{position:absolute;top:100%;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:4px 22px 14px;background:#132135;border-bottom:1px solid var(--rule)}
  .nav.is-open .nav-links{display:flex}
  .nav-item{width:100%}
  .nav-link{display:block;width:100%;padding:13px 0;font-size:15px;opacity:1}
  .nav-link::after{display:none}
  .nav-link.is-active{color:var(--moss-soft)}
  .nav-drop{display:none}
  .nav-flat{display:block}
  .submenu{display:none}
  .foot{flex-wrap:nowrap;gap:10px;padding:22px;font-size:9px;letter-spacing:.05em;white-space:nowrap}
}