/* Nova Ridge LLC — Swiss editorial. No JS: motion is CSS scroll-driven only. */
:root{
  --paper:oklch(97.2% 0.007 85);
  --paper-2:oklch(94.3% 0.009 85);
  --paper-3:oklch(91.2% 0.010 85);
  --ink:oklch(20% 0.013 258);
  --ink-2:oklch(40% 0.012 258);
  --ink-3:oklch(56% 0.010 258);
  --accent:oklch(41% 0.105 248);
  --accent-2:oklch(56% 0.088 248);
  --rule:oklch(87% 0.008 85);
  --rule-2:oklch(79% 0.009 85);
  --glow:oklch(41% 0.105 248 / 0.05);

  --serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;

  --t-micro:0.6875rem;
  --t-small:0.8125rem;
  --t-body:clamp(0.975rem, 0.93rem + 0.2vw, 1.0625rem);
  --t-lead:clamp(1.15rem, 1rem + 0.7vw, 1.5rem);
  --t-h3:clamp(1.35rem, 1.15rem + 0.8vw, 1.85rem);
  --t-h2:clamp(2rem, 1.4rem + 2.4vw, 3.5rem);
  --t-hero:clamp(2.9rem, 1.35rem + 6.5vw, 7.5rem);

  --gutter:clamp(1.25rem, 0.6rem + 3.2vw, 5rem);
  --section:clamp(4.5rem, 3rem + 6vw, 10rem);
  --ease:cubic-bezier(0.16, 1, 0.3, 1);
  --dur:420ms;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:oklch(16.5% 0.014 258);
    --paper-2:oklch(20.5% 0.016 258);
    --paper-3:oklch(25% 0.018 258);
    --ink:oklch(94.5% 0.006 85);
    --ink-2:oklch(74% 0.008 85);
    --ink-3:oklch(60% 0.010 85);
    --accent:oklch(80% 0.090 248);
    --accent-2:oklch(66% 0.080 248);
    --rule:oklch(29% 0.014 258);
    --rule-2:oklch(38% 0.016 258);
    --glow:oklch(80% 0.090 248 / 0.07);
  }
}
:root[data-theme="dark"]{
  --paper:oklch(16.5% 0.014 258);--paper-2:oklch(20.5% 0.016 258);--paper-3:oklch(25% 0.018 258);
  --ink:oklch(94.5% 0.006 85);--ink-2:oklch(74% 0.008 85);--ink-3:oklch(60% 0.010 85);
  --accent:oklch(80% 0.090 248);--accent-2:oklch(66% 0.080 248);
  --rule:oklch(29% 0.014 258);--rule-2:oklch(38% 0.016 258);--glow:oklch(80% 0.090 248 / 0.07);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:var(--t-body);line-height:1.62;
  font-synthesis-weight:none;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* atmosphere: grain + a single soft field behind the hero */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}
body::after{
  content:"";position:absolute;top:-18rem;right:-14rem;width:min(70rem,110vw);aspect-ratio:1;
  pointer-events:none;z-index:0;border-radius:50%;
  background:radial-gradient(circle,var(--glow) 0%,transparent 68%);
}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-0.017em;line-height:1.06;margin:0}
p{margin:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:2px}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--paper);padding:.8rem 1.4rem;z-index:99}
.skip:focus{left:.5rem;top:.5rem}
.wrap{max-width:78rem;margin-inline:auto;padding-inline:var(--gutter);position:relative;z-index:1}
.label{font-family:var(--mono);font-size:var(--t-micro);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2)}

/* ---- scroll reveal (CSS only; invisible only where supported) ---- */
@keyframes rise{from{opacity:0;transform:translateY(1.6rem)}to{opacity:1;transform:none}}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .reveal{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 52%}
  }
}

/* ---- masthead ---- */
.masthead{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--rule);
  background:color-mix(in oklab,var(--paper) 86%,transparent);backdrop-filter:blur(14px) saturate(1.3)}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-block:1.05rem}
.mark{display:flex;align-items:baseline;gap:.5rem;text-decoration:none;font-family:var(--serif);font-size:1.32rem;letter-spacing:-0.01em}
.mark b{font-weight:400}
.mark span{font-family:var(--mono);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.masthead nav{display:flex;gap:1.9rem}
.masthead nav a{font-size:var(--t-small);text-decoration:none;color:var(--ink-2);position:relative;padding-block:.2rem}
.masthead nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--accent);
  transform:scaleX(0);transform-origin:left;transition:transform var(--dur) var(--ease)}
.masthead nav a:hover{color:var(--accent)}
.masthead nav a:hover::after{transform:scaleX(1)}
@media(max-width:700px){.masthead nav{display:none}}

/* ---- hero ---- */
.hero{padding-block:clamp(3.5rem,2rem + 7vw,9rem) 0}
.hero h1{font-size:var(--t-hero);max-width:13ch;margin-top:1.8rem}
.hero h1 em{font-style:italic;color:var(--accent)}
.hero-body{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(2rem,5vw,6rem);align-items:end;margin-top:clamp(2rem,4vw,3.5rem)}
@media(max-width:860px){.hero-body{grid-template-columns:1fr;gap:2.5rem}}
.hero-lead{font-size:var(--t-lead);color:var(--ink-2);max-width:44ch;line-height:1.45}
.hero-card{border:1px solid var(--rule);background:var(--paper-2);padding:1.6rem 1.7rem}
.hero-card dt{margin-bottom:.35rem}
.hero-card dd{margin:0 0 1.25rem;font-size:.95rem}
.hero-card dd:last-of-type{margin-bottom:0}

/* index strip under hero */
.strip{margin-top:clamp(3.5rem,6vw,6rem);border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);
  display:grid;grid-template-columns:repeat(4,1fr)}
@media(max-width:760px){.strip{grid-template-columns:repeat(2,1fr)}}
.strip div{padding:1.4rem 1.2rem 1.4rem 0;border-right:1px solid var(--rule)}
.strip div:last-child{border-right:0}
.strip b{display:block;font-family:var(--serif);font-size:1.7rem;font-weight:400;margin-top:.4rem;letter-spacing:-0.01em}

/* ---- sections ---- */
section{border-top:1px solid var(--rule);padding-block:var(--section);position:relative}
section:first-of-type{border-top:0}
.sec-head{margin-bottom:clamp(2.5rem,5vw,4.5rem);display:grid;grid-template-columns:5rem 1fr;gap:1rem;align-items:start}
@media(max-width:620px){.sec-head{grid-template-columns:1fr;gap:.6rem}}
.sec-head h2{font-size:var(--t-h2);max-width:18ch}
.sec-head .label{padding-top:.7rem}
.sec-note{grid-column:2;color:var(--ink-3);font-size:var(--t-small);max-width:52ch;margin-top:1.1rem}
@media(max-width:620px){.sec-note{grid-column:1}}

/* ---- capability rows (editorial, not cards) ---- */
.rows{border-top:1px solid var(--rule-2)}
.row{display:grid;grid-template-columns:5rem 1fr 1.05fr;gap:clamp(1rem,3vw,3rem);
  padding-block:clamp(1.8rem,3vw,2.8rem);border-bottom:1px solid var(--rule);
  transition:background var(--dur) var(--ease);margin-inline:calc(var(--gutter) * -0.5);
  padding-inline:calc(var(--gutter) * 0.5)}
.row:hover{background:var(--paper-2)}
@media(max-width:860px){.row{grid-template-columns:1fr;gap:.9rem}}
.row .n{font-family:var(--serif);font-size:1.5rem;color:var(--rule-2);line-height:1;padding-top:.35rem;
  transition:color var(--dur) var(--ease)}
.row:hover .n{color:var(--accent)}
.row h3{font-size:var(--t-h3);margin-bottom:.7rem}
.row p{color:var(--ink-2);font-size:.96rem;max-width:44ch}
.tags{display:flex;flex-wrap:wrap;gap:.4rem;align-content:start;padding-top:.45rem}
.tags span{font-family:var(--mono);font-size:var(--t-micro);letter-spacing:.04em;color:var(--ink-3);
  border:1px solid var(--rule-2);padding:.28rem .6rem;border-radius:999px;white-space:nowrap}

/* ---- work bento ---- */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule)}
.bento article{background:var(--paper);padding:clamp(1.5rem,3vw,2.6rem);display:flex;flex-direction:column;
  transition:background var(--dur) var(--ease)}
.bento article:hover{background:var(--paper-2)}
.bento article:nth-child(1){grid-column:span 6}
.bento article:nth-child(2),.bento article:nth-child(3),.bento article:nth-child(4){grid-column:span 2}
@media(max-width:860px){.bento article,.bento article:nth-child(1){grid-column:span 6}}
.bento h3{font-size:var(--t-h3);margin:.6rem 0 .8rem}
.bento article:nth-child(1) h3{font-size:clamp(1.7rem,1.2rem + 1.6vw,2.6rem);max-width:16ch}
.bento p{color:var(--ink-2);font-size:.94rem;max-width:56ch}
.bento .tags{margin-top:auto;padding-top:1.6rem}

/* ---- engagement timeline ---- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1.2rem,2.5vw,2.5rem);
  border-top:1px solid var(--ink);padding-top:2.2rem}
@media(max-width:860px){.steps{grid-template-columns:repeat(2,1fr);row-gap:2.6rem}}
@media(max-width:520px){.steps{grid-template-columns:1fr}}
.step{position:relative}
.step::before{content:"";position:absolute;top:-2.2rem;left:0;width:.5rem;height:.5rem;
  background:var(--accent);transform:translateY(-50%) rotate(45deg)}
.step h3{font-family:var(--sans);font-weight:500;font-size:1.02rem;letter-spacing:0;margin:.9rem 0 .5rem}
.step p{color:var(--ink-2);font-size:.9rem}

/* ---- record ---- */
.record{border:1px solid var(--rule);background:var(--paper-2)}
.record dl{margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule)}
@media(max-width:760px){.record dl{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.record dl{grid-template-columns:1fr}}
.record dl>div{background:var(--paper-2);padding:1.5rem 1.6rem}
.record dt{margin-bottom:.45rem}
.record dd{margin:0;font-size:.95rem;line-height:1.5}
.record a{color:var(--accent);text-underline-offset:3px;text-decoration-thickness:1px}

/* ---- contact ---- */
.contact{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:end}
@media(max-width:860px){.contact{grid-template-columns:1fr;gap:2.5rem}}
.contact h2{font-size:var(--t-h2);max-width:14ch}
.cta{display:inline-flex;align-items:center;gap:.7rem;margin-top:2rem;text-decoration:none;
  font-family:var(--mono);font-size:var(--t-small);letter-spacing:.05em;
  border:1px solid var(--ink);padding:.95rem 1.5rem;color:var(--ink);
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease),gap var(--dur) var(--ease)}
.cta:hover{background:var(--ink);color:var(--paper);gap:1.1rem}
.cta span{transition:transform var(--dur) var(--ease)}
.cta:hover span{transform:translateX(3px)}
.contact-aside{font-size:.92rem;color:var(--ink-2)}
.contact-aside .label{display:block;margin-bottom:.5rem}
.contact-aside p+ .label{margin-top:1.6rem}

/* ---- footer ---- */
footer{border-top:1px solid var(--ink);padding-block:3.2rem 2.4rem;font-size:var(--t-small);color:var(--ink-3)}
footer .wrap{display:flex;flex-wrap:wrap;gap:1.2rem 2.5rem;justify-content:space-between;align-items:baseline}
footer p{margin:0}
footer a{color:var(--ink-3);text-decoration:none;transition:color var(--dur) var(--ease)}
footer a:hover{color:var(--accent)}
footer nav{display:flex;gap:1.5rem}

/* ---- legal pages ---- */
.prose{max-width:47rem;padding-block:clamp(3rem,5vw,6rem) var(--section)}
.prose h1{font-size:clamp(2.2rem,1.5rem + 2.6vw,3.6rem);margin-bottom:.7rem}
.prose .updated{margin:0 0 3.2rem}
.prose h2{font-size:1.45rem;margin:3.2rem 0 1rem;padding-top:1.7rem;border-top:1px solid var(--rule)}
.prose p,.prose li{color:var(--ink-2);font-size:.96rem}
.prose p+p{margin-top:.9rem}
.prose ul{padding-left:1.1rem;margin:.9rem 0}
.prose li{margin-bottom:.55rem}
.prose a{color:var(--accent);text-underline-offset:3px}
.prose strong{color:var(--ink);font-weight:500}
