
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@600;700;800&display=swap');
:root{--bg:#090b0a;--ink:#f1efe7;--muted:#a2aaa3;--line:#29312c;--green:#38d98b;--gold:#c8a86a;--red:#a52a31}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.7 "DM Sans",sans-serif}a{color:inherit;text-decoration:none}.wrap{width:min(1180px,calc(100% - 44px));margin:auto}
header{height:78px;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10;background:#090b0aeF;backdrop-filter:blur(15px)}.nav{height:100%;display:flex;align-items:center;justify-content:space-between}.logo{font-weight:800;letter-spacing:.16em}.logo span{color:var(--green);font-size:24px;margin-right:9px}.logo small{display:block;margin-left:35px;margin-top:-5px;color:#69736b;font-size:8px;letter-spacing:.2em}.links{display:flex;gap:25px;color:#aab2ab;font-size:12px}.links a:hover,.links .on{color:var(--green)}
.hero{min-height:760px;display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}.eyebrow{color:var(--green);font-size:10px;font-weight:700;letter-spacing:.26em;text-transform:uppercase}.hero h1,.page h1{font:700 clamp(54px,7vw,94px)/.95 "Playfair Display",serif;letter-spacing:-.05em;margin:20px 0}.hero h1 em,.page h1 em{color:var(--green);font-style:normal}.lead{font-size:18px;color:var(--muted);max-width:640px}.buttons{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}.btn{padding:13px 19px;background:var(--green);color:#07100b;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.btn.alt{background:transparent;border:1px solid #475149;color:var(--ink)}
.photo{height:650px;position:relative;overflow:hidden;background:#121815;border:1px solid #303a33}.photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.82) contrast(1.05)}.photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#090b0a 0%,transparent 30%,transparent 72%,#090b0a 100%),linear-gradient(0deg,#090b0a 0%,transparent 28%)}.caption{position:absolute;z-index:2;bottom:25px;left:25px;right:25px;display:flex;justify-content:space-between;color:#d7d8d2;font-size:10px;text-transform:uppercase;letter-spacing:.13em}
section{padding:92px 0;border-top:1px solid var(--line)}.head{display:flex;justify-content:space-between;gap:50px;align-items:end;margin-bottom:38px}.head h2{font:700 48px/1.05 "Playfair Display",serif;margin:9px 0}.head p{max-width:540px;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}.card{background:#101411;padding:30px;min-height:240px}.card .num{color:var(--gold);font-size:10px;letter-spacing:.18em}.card h3{font:700 27px/1.15 "Playfair Display",serif}.card p{color:var(--muted)}
.statement{background:#101411;padding:70px;border:1px solid var(--line)}.statement h2{font:700 45px/1.1 "Playfair Display",serif;margin:0 0 18px}.statement p{max-width:850px;color:#c1c8c1;font-size:17px}.statement strong{color:var(--green)}
.page{padding-top:100px}.page h1{max-width:1000px}.prose{max-width:830px;color:#c1c8c1}.prose h2{font:700 35px/1.1 "Playfair Display",serif;color:var(--ink);margin:55px 0 12px}.prose li{margin:10px 0}.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.portrait{height:540px;overflow:hidden;border:1px solid var(--line)}.portrait img{width:100%;height:100%;object-fit:cover}.chips{display:flex;gap:12px;margin:30px 0}.chip{width:56px;height:56px;border-radius:50%;border:6px dashed #e5e2d9;display:grid;place-items:center;font-size:10px;font-weight:800;color:#fff}.r{background:var(--red)}.g{background:#16754d}.k{background:#20231f}.gold{background:#9e7a32}
footer{padding:34px 0;border-top:1px solid var(--line);color:#737d75;font-size:11px}.foot{display:flex;justify-content:space-between}
@media(max-width:900px){.links{display:none}.hero,.split{grid-template-columns:1fr}.hero{padding:55px 0}.photo{height:500px}.grid{grid-template-columns:1fr}.head{display:block}.page h1{font-size:53px}.statement{padding:35px}.wrap{width:min(100% - 30px,1180px)}}

/* v3 editorial additions */
.image-credit{position:absolute;left:16px;bottom:14px;z-index:2;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:#d7d8d2;opacity:.72}.portrait{position:relative}.quote-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}.quote-grid blockquote{margin:0;padding:22px;background:#0c100d;border:1px solid var(--line);font:600 21px/1.25 "Playfair Display",serif;color:var(--ink)}.quote-grid span{display:block;font:700 9px/1 "DM Sans",sans-serif;letter-spacing:.2em;color:var(--gold);margin-bottom:12px}.quote-grid small{display:block;margin-top:12px;color:var(--muted);font:400 11px/1.5 "DM Sans",sans-serif}.subnav{display:flex;gap:8px;flex-wrap:wrap;margin:38px 0 0}.subnav a{border:1px solid var(--line);padding:8px 12px;color:#aeb7b0;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.subnav a:hover{border-color:var(--green);color:var(--green)}.risk-visual{height:480px;position:relative;overflow:hidden;border:1px solid var(--line)}.risk-visual img{width:100%;height:100%;object-fit:cover;filter:grayscale(.7) contrast(1.12) brightness(.7)}.risk-overlay{position:absolute;inset:auto 25px 25px 25px;font:700 35px/1 "Playfair Display",serif;color:#f1efe7}.risk-overlay strong{color:var(--green)}.panel-list{display:grid;gap:1px;background:var(--line)}.panel-list div{background:#101411;padding:22px 25px}.panel-list b{display:block;font:700 23px/1.15 "Playfair Display",serif;margin-bottom:7px}.panel-list span{color:var(--muted);font-size:14px}.statement.danger{border-color:#493234;background:linear-gradient(135deg,#15100f,#101411)}.statement.danger .eyebrow{color:#e09b9b}.statement.danger h2{max-width:900px}.callout{padding:52px;border:1px solid var(--line);background:#101411}.callout h2{font:700 42px/1.08 "Playfair Display",serif;margin:10px 0}.callout p{max-width:850px;color:#c1c8c1}.small-note{border-left:2px solid var(--gold);padding:15px 20px;color:#9da69f;font-size:12px;max-width:900px}.small-note strong{color:#d7c18e}@media(max-width:900px){.quote-grid{grid-template-columns:1fr}.risk-visual{height:360px}.callout{padding:32px}.callout h2{font-size:34px}}

/* subtle motion: editorial, not casino-like */
.risk-visual:before{content:"";position:absolute;width:110px;height:110px;border:8px dashed rgba(56,217,139,.28);border-radius:50%;right:-28px;top:22px;z-index:1;animation:floatChip 7s ease-in-out infinite}.risk-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 35%,rgba(255,255,255,.06) 50%,transparent 65%);transform:translateX(-100%);animation:softSweep 9s ease-in-out infinite}.portrait:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,rgba(56,217,139,.08) 50%,transparent 70%);transform:translateX(-100%);animation:softSweep 11s ease-in-out infinite}
@keyframes floatChip{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(18px) rotate(22deg)}}
@keyframes softSweep{0%,55%{transform:translateX(-100%)}75%,100%{transform:translateX(100%)}}
.links{max-height:80px;overflow:auto;scrollbar-width:none}.links::-webkit-scrollbar{display:none}.links a{white-space:nowrap}
.grid{grid-template-columns:repeat(4,1fr)}
@media(max-width:1100px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.grid{grid-template-columns:1fr}}

/* v6 visual refinement */
.hero .photo img{object-position:center 28%;}
.hero .photo{box-shadow:0 24px 70px rgba(0,0,0,.32);}
.hero:first-of-type .photo img{filter:saturate(.9) contrast(1.08) brightness(.92);}
@media(min-width:901px){body:has(.hero) .hero{min-height:820px}.hero .photo{height:700px}}

/* v8 mobile-first cleanup */
html{overflow-x:hidden}
body{overflow-x:hidden}
img{max-width:100%}
header{height:auto;min-height:72px}
.nav{min-height:72px;gap:16px;padding:10px 0;flex-wrap:wrap}
.links{flex:1 1 100%;display:flex;gap:18px;overflow-x:auto;overflow-y:hidden;padding:2px 0 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.links::-webkit-scrollbar{display:none}
.hero{min-height:680px;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:48px;padding:70px 0}
.hero h1{font-size:clamp(48px,6vw,82px)}
.hero .photo{height:560px}
.hero .photo img{object-position:center 28%}
.photo{min-width:0}
section{padding:72px 0}
.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{min-width:0}
.statement,.callout{min-width:0}

@media(max-width:900px){
  .wrap{width:min(100% - 28px,1180px)}
  header{position:sticky;top:0}
  .nav{align-items:flex-start}
  .logo{flex:0 0 auto}
  .links{flex-basis:100%;order:3;font-size:11px;gap:16px;padding-top:7px}
  .hero{grid-template-columns:1fr;gap:32px;min-height:auto;padding:48px 0 62px}
  .hero>div:first-child{order:1}
  .hero>.photo{order:2}
  .hero h1{font-size:clamp(44px,11vw,66px);line-height:.98;margin:15px 0}
  .lead{font-size:16px;line-height:1.65}
  .hero .photo{height:390px;width:100%}
  .photo:after{background:linear-gradient(0deg,#090b0a 0%,transparent 35%),linear-gradient(90deg,#090b0a 0%,transparent 18%,transparent 82%,#090b0a 100%)}
  .caption{left:16px;right:16px;bottom:16px;font-size:8px;gap:10px}
  section{padding:58px 0}
  .head{margin-bottom:26px}
  .head h2{font-size:38px}
  .grid{grid-template-columns:1fr}
  .card{padding:24px;min-height:0}
  .statement{padding:28px 24px}
  .statement h2{font-size:35px}
  .page{padding-top:55px}
  .page h1{font-size:clamp(43px,11vw,62px);line-height:1}
  .prose h2{font-size:30px;margin-top:42px}
  .split{grid-template-columns:1fr;gap:28px}
  .portrait{height:380px}
  .risk-visual{height:330px}
  .quote-grid{grid-template-columns:1fr}
  .callout{padding:28px 24px}
  .callout h2{font-size:33px}
  .foot{flex-direction:column;gap:8px}
}

@media(max-width:480px){
  .wrap{width:calc(100% - 24px)}
  .logo{font-size:14px;letter-spacing:.12em}
  .logo span{font-size:20px;margin-right:6px}
  .logo small{margin-left:27px;font-size:7px}
  .links{margin-right:-12px;padding-right:12px}
  .hero{padding-top:38px}
  .hero h1{font-size:43px}
  .hero .photo{height:310px}
  .buttons{display:grid;grid-template-columns:1fr}
  .btn{text-align:center;width:100%}
  .head h2{font-size:34px}
  .statement h2{font-size:31px}
  .portrait{height:320px}
  .risk-visual{height:280px}
  .risk-overlay{left:18px;right:18px;bottom:18px;font-size:28px}
}

/* v9 mobile navigation + typography/image overflow fixes */
.links{overflow:visible;max-height:none;white-space:normal;flex-wrap:wrap;justify-content:flex-end;align-content:center}
.links a{white-space:normal;line-height:1.25}
.hero h1,.page h1,.statement h2,.head h2,.callout h2{max-width:100%;overflow-wrap:anywhere;word-break:normal}
.hero,.page,.section,.wrap,.card,.statement,.callout,.prose{min-width:0}

@media(max-width:900px){
  .nav{padding:10px 0 12px}
  .links{display:flex;flex:1 1 100%;width:100%;justify-content:flex-start;gap:7px 8px;padding:6px 0 0;overflow:visible}
  .links a{font-size:10px;padding:6px 8px;border:1px solid rgba(41,49,44,.9);background:#0d110f;flex:0 0 auto}
  .hero h1{font-size:clamp(40px,10vw,58px);letter-spacing:-.045em;max-width:100%;overflow-wrap:anywhere}
  .hero .photo{height:auto;aspect-ratio:4/3;overflow:hidden}
  .hero .photo img{object-fit:contain;object-position:center center;background:#121815}
}

@media(max-width:480px){
  .links{gap:6px 6px}
  .links a{font-size:9px;padding:5px 6px}
  .hero h1{font-size:40px;line-height:1.02;letter-spacing:-.04em}
  .hero .photo{height:auto;aspect-ratio:4/3;min-height:0}
  .hero .photo img{object-fit:contain}
}
