/* Layout: white page, one serif voice, wide quiet margins; grey rounded tiles carry
   every grouped thing; a drawn creek current is the only image the brand owns. */
:root{
  color-scheme:light;
  --paper:#ffffff; --ink:#1D2934; --muted:#46586A; --tile:#e2ded7; --tile-2:#eae8e4;
  --rule:#d6dbd6; --foot:#1D2934; --foot-ink:#eef1ed; --foot-muted:#9fb0bd; --creek:#2f4a4a; --navy:#1D2934;
  --display:"Marcellus","Trajan Pro","Cinzel",Georgia,serif;
  --text:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --gutter:clamp(16px,5vw,110px); --max:1280px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--text);font-size:18px;line-height:1.55;font-weight:400;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--creek);outline-offset:3px}
h1,h2,h3{font-weight:400;margin:0;text-wrap:balance;line-height:1.15}
p{margin:0}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}

/* header */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(255,255,255,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .35s}
.site-head.over{background:rgba(255,255,255,0);backdrop-filter:none;-webkit-backdrop-filter:none}
.site-head .bar{display:flex;align-items:center;flex-wrap:wrap;gap:6px 28px;padding-block:14px;padding-inline:clamp(16px,4vw,62px)}
.mark{display:block;text-decoration:none;padding-right:28px;border-right:1px solid var(--ink)}
.mark .ce-logo{display:block;height:54px;width:auto}
.nav{display:flex;flex-wrap:wrap;gap:4px 34px;font-size:19px}
.nav a{text-decoration:none;padding-block:4px;border-bottom:1px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{border-bottom-color:var(--ink)}
@media (max-width:640px){.mark{border-right:0;padding-right:0}.mark .ce-logo{height:44px}.nav{gap:2px 20px;font-size:17px;width:100%}}

/* hero: full-viewport video, nav floats over it like iconiq.com */
.hero{position:relative;width:100%;aspect-ratio:16/9;max-height:100svh;min-height:380px;margin-top:-82px;overflow:hidden;background:#dcd7cf}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.hero .cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);width:1px;height:48px;background:rgba(52,48,52,.45);animation:cue 2.4s ease-in-out infinite}
@keyframes cue{0%,100%{transform:translateX(-50%) scaleY(.4);transform-origin:top;opacity:.3}50%{transform:translateX(-50%) scaleY(1);opacity:.8}}
@media (max-width:700px){.hero{min-height:0;margin-top:0}.hero .cue{display:none}}
@media (prefers-reduced-motion:reduce){.hero video{display:none}.hero{background:#dcd7cf url("/img/video/creek-equity-hero-poster.jpg") center/cover no-repeat}.hero .cue{animation:none}}

/* sections */
.statement{padding-block:clamp(56px,9vw,120px);text-align:center}
.statement p{font-size:clamp(20px,2.15vw,28px);line-height:1.42;max-width:44ch;margin-inline:auto;max-width:1180px}
.rule{border:0;border-top:1px solid var(--rule);margin:0}
.section{padding-block:clamp(48px,7vw,96px)}
.section > .wrap{display:grid;gap:clamp(24px,3vw,40px)}
.h-page{font-size:clamp(38px,5vw,60px)}
.h-sec{font-size:clamp(28px,3.2vw,42px)}
.lede{font-size:clamp(19px,1.7vw,23px);max-width:62ch;color:var(--ink)}
.prose{display:grid;gap:18px;max-width:66ch}
.muted{color:var(--muted)}
.more{font-size:19px;text-underline-offset:5px;text-decoration-thickness:1px}
.more:hover{color:var(--creek)}

/* tiles */
.tile{border-radius:6px;background-color:var(--tile);
  background-image:
    repeating-linear-gradient(90deg,rgba(84,78,70,.075) 0 1px,transparent 1px 7px),
    repeating-linear-gradient(0deg,rgba(84,78,70,.075) 0 1px,transparent 1px 7px),
    repeating-linear-gradient(90deg,rgba(84,78,70,.045) 0 1px,transparent 1px 3.5px),
    repeating-linear-gradient(0deg,rgba(84,78,70,.045) 0 1px,transparent 1px 3.5px)}
.trio{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.trio .tile{padding:clamp(26px,3vw,44px);display:grid;gap:14px;align-content:start;min-width:0}
.trio h3{font-size:30px}
.feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);align-items:center;overflow:hidden}
.feature .txt{padding:clamp(28px,5vw,96px);display:grid;gap:16px}
.feature .txt h2{font-size:clamp(28px,3vw,40px)}
.feature canvas{width:100%;height:100%;min-height:300px;display:block}
@media (max-width:760px){.feature{grid-template-columns:1fr}.feature canvas{min-height:200px}}

/* strategy */
.quad{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}
.quad .tile{padding:clamp(24px,2.6vw,36px);display:grid;gap:12px;align-content:start;min-width:0}
.quad h3{font-size:26px}
.quad p{font-size:17px}
.tier .kicker{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.tier dl{margin:0;display:grid;gap:10px;font-size:16px}
.tier dt{color:var(--muted);font-size:14px;letter-spacing:.08em;text-transform:uppercase}
.tier dd{margin:0}
.list{margin:0;padding-left:1.1em;display:grid;gap:10px;max-width:66ch}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(24px,4vw,64px);align-items:start}

/* scrolling logo line (home) */
.marquee{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee .track{display:flex;gap:20px;width:max-content;animation:marquee 46s linear infinite}
.marquee:hover .track{animation-play-state:paused}
.marquee .logo{flex:0 0 240px;aspect-ratio:2/1}
.marquee .logo img{max-height:76px}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 10px))}}
@media (prefers-reduced-motion:reduce){.marquee .track{animation:none;flex-wrap:wrap;width:auto}.marquee{mask-image:none;-webkit-mask-image:none}}

/* credential lockup */
.crest{display:inline-grid;justify-self:start;justify-items:center;gap:8px;padding:16px 28px 14px;border:1px solid var(--rule);border-top:3px solid #A6E017;border-radius:4px;background:#fff;margin:20px 0 4px}
.crest .u{font-family:var(--display);font-size:clamp(15px,1.5vw,18px);letter-spacing:.16em;text-transform:uppercase;color:var(--ink);line-height:1.25;text-align:center}
.crest .r{width:36px;height:1px;background:#A6E017}
.crest .d{font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);text-align:center;line-height:1.5}

/* jerseys */
.osu-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start;margin-top:14px}
.osu-grid .prose{display:grid;gap:18px}
.frame{margin:0;background:var(--navy);border-top:3px solid #A6E017;border-radius:5px;padding:5px;box-shadow:0 3px 12px rgba(29,41,52,.28);overflow:hidden}
.frame img{width:100%;display:block;border-radius:2px}
.frame.tall img{aspect-ratio:3/4;object-fit:cover}
.frame.wide{margin-top:clamp(26px,3.5vw,40px)}
.frame.wide img{aspect-ratio:16/9;object-fit:cover}
@media (max-width:760px){.osu-grid{grid-template-columns:1fr}.frame.tall{max-width:420px}}

/* photo reel: continuous filmstrip band */
.reel{overflow:hidden;position:relative;margin-top:clamp(28px,4vw,46px);background:var(--navy);border-top:3px solid #A6E017;padding:7px 0}
.reel .track{display:flex;gap:7px;width:max-content;animation:reel 52s linear infinite}
.reel:hover .track{animation-play-state:paused}
.shot{margin:0;flex:0 0 clamp(190px,21vw,290px)}
.shot img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;filter:saturate(.9)}
@keyframes reel{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 3.5px))}}
@media (prefers-reduced-motion:reduce){.reel .track{animation:none}}

/* insights */
.posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}
.post-card{padding:clamp(24px,2.8vw,36px);display:grid;gap:12px;align-content:start;min-width:0;text-decoration:none}
.post-card:hover h3{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.post-card .date{font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.post-card h3{font-size:24px}
.post-card p{font-size:17px}
.article{max-width:720px;margin-inline:auto}
.article .meta{font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);display:flex;gap:18px;flex-wrap:wrap}
.article h1{font-size:clamp(34px,4.4vw,52px);margin-top:14px}
.article .body{display:grid;gap:18px;margin-top:28px}
.article .body h2{font-size:clamp(24px,2.6vw,32px);margin-top:14px}
.article .body ul{margin:0;padding-left:1.1em;display:grid;gap:10px}
.article .body p,.article .body li{font-size:19px;line-height:1.6}
.author{display:grid;grid-template-columns:96px minmax(0,1fr);gap:20px;align-items:center;padding:clamp(22px,3vw,32px);margin-top:40px}
.author img{border-radius:6px}
.author p{font-size:16px}
@media (max-width:480px){.author{grid-template-columns:72px minmax(0,1fr);gap:14px}}

/* investment focus */
.criteria{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(36px,5vw,72px) clamp(24px,4vw,56px);text-align:center;margin-top:clamp(24px,4vw,56px);align-items:start}
.criteria .c{display:grid;justify-items:center;gap:26px;grid-template-rows:172px auto}
.criteria svg{width:168px;height:168px;align-self:center}
.criteria p{font-size:19px;line-height:1.5;max-width:30ch}
.focus-lede{text-align:center;max-width:62ch;margin-inline:auto}

/* companies */
.logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}
.logo{aspect-ratio:2/1;display:grid;place-items:center;padding:18px;text-align:center;font-size:21px;text-decoration:none;min-width:0}
.logo img{max-height:100px;max-width:80%;width:auto;object-fit:contain}
.logos .logo img{max-height:72px}
.logo.ph{background:transparent;border:1px dashed #bdbab4;color:var(--muted);font-style:italic}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{font:inherit;font-size:16px;background:var(--paper);color:var(--ink);border:1px solid #bdbab4;border-radius:999px;padding:6px 18px;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:36px 24px}
.card{display:grid;gap:12px;align-content:start;min-width:0}
.card h3{font-size:26px}
.card .status{font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.card p{font-size:17px}
.card .deck{margin-top:4px}
.card .deck .more{font-size:16px}
.note{font-size:16px;color:var(--muted);border-left:2px solid var(--rule);padding-left:14px;max-width:70ch}

/* person */
.person{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:start}
.person img{border-radius:6px;width:100%}
.person .role{font-size:21px;color:var(--muted)}
@media (max-width:760px){.person{grid-template-columns:1fr}.person img{max-width:320px}}
.lead{display:grid;grid-template-columns:120px minmax(0,1fr);gap:24px;align-items:center}
.lead img{border-radius:6px}
@media (max-width:480px){.lead{grid-template-columns:84px minmax(0,1fr);gap:16px}}

/* contact */
.contact-line{font-size:clamp(24px,3.4vw,44px);overflow-wrap:anywhere;text-underline-offset:8px;text-decoration-thickness:1px}
dl.facts{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:10px 28px;margin:0;font-size:19px}
dl.facts dt{color:var(--muted)}
dl.facts dd{margin:0}

/* footer */
.site-foot{background:var(--foot);color:var(--foot-ink);margin-top:clamp(40px,6vw,80px)}
.site-foot .cols{display:flex;flex-wrap:wrap;gap:28px 80px;padding-block:56px 36px}
.site-foot h4{font-weight:500;font-size:20px;margin:0 0 12px}
.site-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.site-foot a{text-decoration:none}
.site-foot a:hover{text-decoration:underline;text-underline-offset:4px}
.site-foot .fmark{margin-right:auto;color:var(--foot-ink)}
.site-foot .fmark .ce-logo{display:block;height:50px;width:auto}
.site-foot .fine{border-top:1px solid #5c5a56;padding-block:24px 44px;display:flex;flex-wrap:wrap;gap:12px 40px;justify-content:space-between;font-size:13px;line-height:1.5;color:var(--foot-muted)}
.site-foot .fine p{max-width:74ch}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}