@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,700;0,800;1,700&display=swap');

:root { --navy:#081224; --ink:#102242; --blue:#1b3158; --gold:#d9b65d; --cream:#f5f2ea; --white:#fff; --line:rgba(255,255,255,.16); --sans:'Manrope',Arial,sans-serif; --display:'Playfair Display',Georgia,serif; --mono:'DM Mono',monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--navy); background:var(--cream); font-family:var(--sans); }
a { color:inherit; text-decoration:none; }
.eyebrow { color:var(--gold); font:500 10px/1.25 var(--mono); letter-spacing:.14em; margin:0 0 16px; }

/* Link on bio */
.bio-page { min-height:100svh; background:#071225; color:var(--white); display:grid; place-items:center; overflow-x:hidden; }
.bio-shell { width:min(100%,620px); min-height:100svh; position:relative; display:flex; flex-direction:column; justify-content:center; padding:40px 21px 24px; isolation:isolate; }
.ambient { position:absolute; border-radius:999px; filter:blur(18px); opacity:.45; z-index:-1; }
.ambient-top { width:280px; height:280px; background:#183663; top:-145px; right:-135px; }
.ambient-bottom { width:280px; height:280px; background:#54401d; left:-190px; bottom:-120px; }
.bio-card { width:100%; text-align:center; }
.logo-frame { width:122px; height:122px; padding:5px; border-radius:50%; display:inline-grid; place-items:center; background:linear-gradient(135deg,var(--gold),#66542a 54%,var(--gold)); box-shadow:0 20px 50px rgba(0,0,0,.35); margin-bottom:20px; }
.logo-frame img { width:100%; height:100%; object-fit:cover; border-radius:50%; background:#0a101c; }
.bio-card h1 { font:800 clamp(27px,7vw,38px)/1.05 var(--display); letter-spacing:-.035em; margin:0; }
.bio-intro { max-width:390px; color:#c6d0e1; font-size:14px; line-height:1.7; margin:16px auto 28px; }
.quick-links { display:grid; gap:11px; }
.link-card { min-height:77px; text-align:left; border:1px solid var(--line); background:rgba(255,255,255,.055); display:grid; grid-template-columns:42px 1fr 24px; align-items:center; padding:11px 16px 11px 12px; border-radius:17px; transition:transform .2s ease, background .2s ease; }
.link-card:hover { transform:translateY(-2px); background:rgba(255,255,255,.12); }
.link-card-primary { color:#0b1a31; border-color:var(--gold); background:var(--gold); }
.link-icon { width:31px; height:31px; display:grid; place-items:center; border-radius:10px; background:rgba(255,255,255,.15); font-size:20px; }
.link-card-primary .link-icon { background:rgba(8,18,36,.11); }
.link-card strong,.link-card small { display:block; }
.link-card strong { font-size:13px; font-weight:700; }
.link-card small { opacity:.75; font-size:11px; margin-top:3px; }
.arrow { font-size:20px; justify-self:end; }
.service-chips { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:24px; }
.service-chips span { border:1px solid rgba(217,182,93,.38); color:#dfc984; padding:6px 9px; border-radius:999px; font:500 9px var(--mono); letter-spacing:.04em; }
.bio-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:31px; color:#8e9bb0; font-size:10px; }
.bio-footer a { color:#c2a457; }

/* Full website */
.site-header { min-height:78px; display:flex; align-items:center; justify-content:space-between; padding:12px clamp(20px,5vw,72px); color:var(--white); background:var(--navy); }
.brand-lockup { display:flex; gap:10px; align-items:center; font-weight:800; font-size:13px; line-height:1.05; }
.brand-lockup img { width:44px; height:44px; border-radius:50%; object-fit:cover; }
.brand-lockup small { display:block; color:var(--gold); font:500 8px var(--mono); letter-spacing:.08em; text-transform:uppercase; margin-top:5px; }
.header-call { display:inline-flex; gap:8px; font-size:12px; font-weight:700; color:#ebd389; }
.hero { overflow:hidden; position:relative; min-height:560px; background:linear-gradient(115deg,#081224 0%,#112d58 100%); color:var(--white); padding:clamp(64px,12vw,132px) clamp(20px,8vw,126px); display:grid; grid-template-columns:minmax(0,1.15fr) minmax(210px,.85fr); align-items:center; gap:30px; }
.hero:before { content:""; position:absolute; width:600px; height:600px; border:1px solid rgba(217,182,93,.25); border-radius:50%; right:-250px; top:-230px; }
.hero-copy { position:relative; z-index:1; max-width:690px; }
.hero h1,.section h2,.contact-band h2 { font:800 clamp(40px,6vw,82px)/.98 var(--display); letter-spacing:-.05em; margin:0; }
.hero-text { max-width:475px; color:#d3deed; font-size:16px; line-height:1.75; margin:24px 0 32px; }
.hero-actions { display:flex; gap:22px; align-items:center; flex-wrap:wrap; }
.button { min-height:49px; padding:0 19px; display:inline-flex; align-items:center; gap:18px; justify-content:center; border-radius:5px; font-weight:800; font-size:12px; }
.button span { font-size:18px; }
.button-gold { color:#101f38; background:var(--gold); }
.button-navy { background:var(--navy); color:var(--white); }
.text-link { font-size:12px; font-weight:800; color:inherit; border-bottom:1px solid currentColor; padding-bottom:5px; white-space:nowrap; }
.text-link span { padding-left:4px; }
.hero-mark { position:relative; justify-self:center; width:min(25vw,280px); aspect-ratio:1; display:grid; place-items:center; color:var(--gold); border:1px solid rgba(217,182,93,.4); border-radius:50%; }
.mark-ring { position:absolute; inset:15px; border:1px solid rgba(255,255,255,.16); border-radius:50%; }
.mark-lines { position:absolute; width:118%; height:1px; background:rgba(217,182,93,.6); transform:rotate(-39deg); }
.hero-mark span { font:800 clamp(56px,8vw,104px)/1 var(--display); letter-spacing:-.12em; margin-left:-.12em; z-index:1; }
.hero-mark p { position:absolute; bottom:44px; text-align:center; color:var(--white); font:500 9px/1.5 var(--mono); letter-spacing:.1em; }
.section { padding:clamp(66px,10vw,126px) clamp(20px,8vw,126px); }
.services-section { background:var(--cream); }
.section-heading { max-width:700px; margin-bottom:42px; }
.section h2 { font-size:clamp(35px,5.2vw,66px); color:var(--navy); }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.service-card { min-height:290px; position:relative; padding:25px; background:var(--white); border-top:3px solid var(--gold); box-shadow:0 10px 26px rgba(13,31,62,.07); }
.service-number { color:#a3adbc; font:500 10px var(--mono); }
.service-symbol { position:absolute; right:22px; top:15px; color:#d5b65d; font:35px/1 var(--display); }
.service-card h3 { margin:82px 0 12px; font:800 21px/1.15 var(--display); letter-spacing:-.025em; }
.service-card p { margin:0; color:#53617a; font-size:13px; line-height:1.75; }
.gallery-section { color:var(--white); background:var(--ink); }
.gallery-section h2 { color:var(--white); }
.split-heading { max-width:none; display:flex; justify-content:space-between; align-items:flex-end; gap:20px; }
.project-grid { display:grid; grid-template-columns:1.15fr .85fr .85fr; grid-auto-rows:220px; gap:12px; }
.project { margin:0; overflow:hidden; background:#0a1429; }
.project-tall { grid-row:span 2; }.project-wide { grid-column:span 2; }
.project img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.project:hover img { transform:scale(1.035); }
.contact-band { min-height:260px; padding:42px clamp(20px,8vw,126px); display:flex; gap:32px; justify-content:space-between; align-items:center; background:var(--gold); color:var(--navy); }
.contact-band .eyebrow { color:#5e4b1e; }
.contact-band h2 { font-size:clamp(35px,5vw,62px); }
.site-footer { color:#d5deed; background:var(--navy); padding:40px clamp(20px,8vw,126px) 20px; display:grid; grid-template-columns:1fr auto; gap:38px; }
.site-footer>div { display:flex; align-items:center; justify-content:flex-end; gap:19px; font-size:11px; font-weight:700; }
.site-footer p { grid-column:1/-1; border-top:1px solid rgba(255,255,255,.15); padding-top:16px; margin:0; color:#718099; font-size:10px; }.site-footer p a { color:#d4ba6f; }
@media (max-width:660px) { .hero { min-height:550px; grid-template-columns:1fr; }.hero-mark { opacity:.46; position:absolute; width:290px; right:-88px; bottom:-66px; }.hero-copy { padding-bottom:40px; }.service-grid { grid-template-columns:1fr; }.service-card { min-height:218px; }.service-card h3 { margin-top:58px; }.project-grid { grid-template-columns:1fr 1fr; grid-auto-rows:180px; }.project-tall { grid-row:span 2; }.project-wide { grid-column:span 1; }.contact-band { align-items:flex-start; flex-direction:column; padding:60px 20px; }.site-footer { grid-template-columns:1fr; }.site-footer>div { justify-content:flex-start; flex-wrap:wrap; }.split-heading { align-items:flex-start; flex-direction:column; }.bio-shell { padding-top:34px; }.bio-footer { margin-top:26px; } }
