:root { --ink:#1d2a3b; --ink-soft:#35445a; --cream:#f7f2e9; --paper:#fffdf8; --orange:#ec633b; --blue:#3b67f5; --yellow:#f4c44e; --muted:#70798a; --line:#d9d2c7; --max:1180px; color:var(--ink); background:var(--cream); font-family:"Manrope",system-ui,sans-serif; font-size:16px; scroll-behavior:smooth; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; overflow-x:hidden; background:var(--cream); line-height:1.65; }
a { color:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.skip-link { position:fixed; z-index:50; left:1rem; top:-5rem; padding:.75rem 1rem; background:white; }
.skip-link:focus { top:1rem; }
.site-header,.hero,.now-strip,.explore,.contact,footer { width:min(calc(100% - 3rem),var(--max)); margin-inline:auto; }
.site-header { min-height:86px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.wordmark { text-decoration:none; font-size:1.05rem; font-weight:800; letter-spacing:-.035em; }
.wordmark span { color:var(--orange); }
.header-links { display:flex; gap:1.7rem; align-items:center; }
.header-links a { text-decoration:none; font-size:.86rem; font-weight:700; }
.header-links a:hover,.header-links a:focus-visible,.text-link:hover,.text-link:focus-visible { color:var(--orange); }
.hero { min-height:720px; display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(3rem,7vw,7rem); align-items:center; padding:5.5rem 0; }
.kicker,.section-number,.mono-label { margin:0 0 1.2rem; color:var(--orange); font:500 .75rem "DM Mono",monospace; letter-spacing:.09em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:1.6rem; font-size:clamp(3.35rem,6.7vw,6.6rem); line-height:.98; letter-spacing:-.067em; font-weight:800; }
h1 em { color:var(--blue); font-family:Georgia,serif; font-weight:400; }
.hero-intro { max-width:650px; margin-bottom:2rem; color:var(--ink-soft); font-size:clamp(1.05rem,1.5vw,1.28rem); }
.hero-links,.professional-actions { display:flex; flex-wrap:wrap; gap:1.2rem; align-items:center; }
.button { min-height:50px; display:inline-flex; align-items:center; justify-content:center; padding:.75rem 1rem; text-decoration:none; font-size:.88rem; font-weight:800; border:1px solid var(--ink); transition:transform .2s ease,box-shadow .2s ease; }
.button:hover,.button:focus-visible { transform:translateY(-2px); box-shadow:6px 6px 0 rgba(29,42,59,.14); }
.primary { color:white; background:var(--ink); }
.primary span { margin-left:1.2rem; }
.text-link { font-weight:800; text-underline-offset:.25em; }
.instagram-link { display:inline-flex; align-items:center; gap:.5rem; }
.instagram-icon { width:1.05rem; height:1.05rem; flex:none; }
.portrait-wrap { margin:0; justify-self:end; width:min(100%,500px); }
.portrait-frame { position:relative; aspect-ratio:4/5; overflow:hidden; background:#d9d1c6; box-shadow:18px 18px 0 var(--yellow); transform:rotate(1.5deg); }
.portrait-frame::after { content:""; position:absolute; inset:0; border:1px solid rgba(29,42,59,.18); }
.portrait-frame img { width:100%; height:100%; object-fit:cover; object-position:53% 50%; display:block; transform:scale(1.03); }
.now-strip { display:grid; grid-template-columns:.65fr 1.35fr 1.35fr 1fr; gap:1.5rem; padding:1.4rem 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.now-strip p { margin:0; font-size:.82rem; }
.now-strip .mono-label { color:var(--orange); }
.explore { padding-top:5rem; }
.tab-list { position:sticky; top:0; z-index:10; display:grid; grid-template-columns:1fr 1fr; padding:.55rem; background:rgba(247,242,233,.94); border:1px solid var(--line); backdrop-filter:blur(12px); }
.tab-list button { min-height:54px; border:0; background:transparent; color:var(--muted); cursor:pointer; font:800 1rem "Manrope",sans-serif; }
.tab-list button[aria-selected="true"] { color:white; background:var(--ink); }
.tab-list button:focus-visible { outline:3px solid var(--orange); outline-offset:2px; }
.tab-panel:focus { outline:none; }
.section { padding:7rem 0; border-bottom:1px solid var(--line); }
.intro-grid,.professional-intro { display:grid; grid-template-columns:.5fr 1.5fr; gap:clamp(2rem,8vw,8rem); }
.section-number { color:var(--orange); }
.section h2 { margin-bottom:1.5rem; font-size:clamp(2.5rem,5.2vw,5rem); line-height:1.04; letter-spacing:-.057em; }
.lead { max-width:850px; font-size:clamp(1.12rem,1.8vw,1.45rem); line-height:1.55; color:var(--ink-soft); }
.intro-grid div>p:last-child { max-width:800px; color:var(--muted); }
.court-section { width:100vw; margin-left:calc(50% - 50vw); padding-inline:max(1.5rem,calc((100vw - var(--max))/2)); display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(3rem,9vw,9rem); color:white; background:var(--blue); border:0; }
.section-number.light { color:#d8e0ff; }
.court-copy p:not(.section-number) { max-width:680px; color:#e7ebff; }
.light-button { margin-top:.7rem; color:var(--ink); background:var(--yellow); border-color:var(--yellow); }
.court-facts { align-self:center; border-top:1px solid rgba(255,255,255,.3); }
.court-facts div { display:grid; grid-template-columns:.7fr 1.3fr; align-items:baseline; padding:1.5rem 0; border-bottom:1px solid rgba(255,255,255,.3); }
.court-facts strong { color:var(--yellow); font-size:2rem; letter-spacing:-.04em; }
.court-facts span { color:#eef1ff; }
.interest-grid { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.interest-grid article { min-height:260px; padding:2rem; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.interest-grid article:nth-child(2) { background:var(--yellow); }
.interest-grid article:nth-child(3) { color:white; background:var(--ink); }
.interest-grid span,.toolkit-grid span { color:var(--orange); font:500 .7rem "DM Mono",monospace; text-transform:uppercase; letter-spacing:.1em; }
.interest-grid h3 { max-width:420px; margin:2.4rem 0 .7rem; font-size:1.55rem; letter-spacing:-.035em; }
.interest-grid p { max-width:470px; margin:0; color:var(--muted); }
.interest-grid article:nth-child(2) p { color:#55451f; }
.interest-grid article:nth-child(3) p { color:#bac5d5; }
.professional-kicker { margin-bottom:.8rem; color:var(--blue); font-weight:800; }
.impact-grid { display:grid; grid-template-columns:1.25fr 1fr 1fr; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.impact-grid article { padding:2rem; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.impact-grid .impact-feature { color:white; background:var(--blue); }
.impact-grid strong { display:block; margin-bottom:3rem; color:var(--orange); font-size:clamp(3.2rem,7vw,6.5rem); line-height:1; letter-spacing:-.07em; }
.impact-grid .impact-feature strong { color:var(--yellow); }
.impact-grid h3 { font-size:1.25rem; }
.impact-grid p { margin:0; color:var(--muted); }
.impact-grid .impact-feature p { color:#e0e6ff; }
.timeline { border-top:1px solid var(--line); }
.timeline article { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2rem,6vw,6rem); padding:2rem 0; border-bottom:1px solid var(--line); }
.timeline span { color:var(--orange); font:500 .68rem "DM Mono",monospace; text-transform:uppercase; letter-spacing:.08em; }
.timeline h3 { margin:.4rem 0 .1rem; font-size:1.35rem; }
.timeline div p,.timeline article>p { margin:0; color:var(--muted); }
.toolkit-grid { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.toolkit-grid div { padding:1.7rem; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.toolkit-grid p { margin:.7rem 0 0; font-weight:600; }
.contact { padding-top:7rem; padding-bottom:4rem; }
.contact h2 { max-width:900px; margin-bottom:2rem; font-size:clamp(2.8rem,6vw,6rem); line-height:1; letter-spacing:-.06em; }
.contact-email { display:inline-block; color:var(--blue); font-size:clamp(1.1rem,3vw,2.1rem); font-weight:800; text-underline-offset:.25em; }
.social-links { display:flex; gap:1.7rem; margin-top:4rem; }
.social-links a { font-size:.86rem; font-weight:800; }
footer { display:flex; justify-content:space-between; padding:2rem 0; border-top:1px solid var(--line); color:var(--muted); font-size:.78rem; }
@media (prefers-reduced-motion:reduce) { :root{scroll-behavior:auto}.button{transition:none} }
@media (max-width:880px) { .hero{grid-template-columns:1fr;padding-top:4rem}.hero-copy{max-width:780px}.portrait-wrap{justify-self:start;width:min(80vw,500px)}.now-strip{grid-template-columns:1fr 1fr}.now-strip .mono-label{grid-column:1/-1}.intro-grid,.professional-intro,.court-section{grid-template-columns:1fr;gap:2rem}.impact-grid{grid-template-columns:1fr} }
@media (max-width:620px) { .site-header,.hero,.now-strip,.explore,.contact,footer{width:min(calc(100% - 2rem),var(--max))}.site-header{min-height:72px}.header-links a:first-child{display:none}h1{font-size:clamp(3.1rem,16vw,4.6rem)}.hero{min-height:auto;padding:3.5rem 0 5rem}.portrait-wrap{width:calc(100% - .6rem)}.portrait-frame{box-shadow:10px 10px 0 var(--yellow)}.now-strip{grid-template-columns:1fr}.section{padding:5rem 0}.interest-grid,.toolkit-grid{grid-template-columns:1fr}.timeline article{grid-template-columns:1fr;gap:1rem}.court-section{width:100vw;padding:5rem 1.5rem}.court-facts div{grid-template-columns:1fr;gap:.35rem}.social-links,footer{flex-wrap:wrap} }