:root{--brown:#3a2a25;--brick:#b4532a;--brick-dark:#8f3f1e;--cream:#fbf7f3;--paper:#fff;--ink:#2b2321;--muted:#6f625c;--line:#e8ddd5;
--sans:"Helvetica Neue",Helvetica,Arial,sans-serif;--serif:Georgia,"Times New Roman",serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);font-size:1.05rem;line-height:1.75}
img{max-width:100%;height:auto;display:block}
a{color:var(--brick);text-underline-offset:3px}
a:hover{color:var(--brick-dark)}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:.5rem 1rem;z-index:10}
.skip:focus{left:0}
.wrap{max-width:62rem;margin:0 auto;padding:0 1.25rem}

header.site{background:var(--cream);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.4rem 2rem;padding:1rem 1.25rem}
.brand{font-family:var(--serif);font-size:1.3rem;color:var(--brown);text-decoration:none;letter-spacing:.01em}
nav ul{list-style:none;margin:0;padding:0;display:flex;gap:1.6rem}
nav a{font-size:.9rem;color:var(--brown);text-decoration:none;padding:.3rem 0;border-bottom:2px solid transparent}
nav a:hover{border-bottom-color:var(--brick)}

.hero{padding:3.5rem 0 3rem}
.hero .wrap{display:grid;grid-template-columns:minmax(0,19rem) 1fr;gap:3rem;align-items:center}
.photo img{border-radius:6px;box-shadow:0 10px 30px rgba(58,42,37,.22)}
.eyebrow{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brick);margin:0 0 .5rem}
.hero h1{font-family:var(--serif);font-weight:normal;font-size:clamp(2.4rem,6vw,3.6rem);line-height:1.1;margin:0 0 .4rem;color:var(--brown)}
.role{font-size:1.15rem;color:var(--muted);margin:0 0 1.4rem}
.intro{font-size:1.2rem;line-height:1.65;margin:0 0 1.6rem}
.btn{display:inline-block;background:var(--brick);color:#fff;text-decoration:none;padding:.7rem 1.3rem;border-radius:4px;font-size:.95rem}
.btn:hover{background:var(--brick-dark);color:#fff}

.facts{background:var(--brown);color:#f3e9e2}
.facts .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1.2rem 2rem;padding-top:1.6rem;padding-bottom:1.6rem}
.facts b{display:block;font-family:var(--serif);font-weight:normal;font-size:1.25rem;color:#fff}
.facts span{font-size:.88rem;color:#d9c7bb}

section.about{padding:3.5rem 0}
.narrow{max-width:42rem}
h2{font-family:var(--serif);font-weight:normal;font-size:1.9rem;color:var(--brown);margin:0 0 1rem}
.about p{margin:0 0 1.15rem}

footer.site{background:var(--brown);color:#d9c7bb;font-size:.88rem;padding:1.6rem 0}
footer.site a{color:#f3e9e2}
footer.site p{margin:.2rem 0}
@media (max-width:760px){
 .hero .wrap{grid-template-columns:1fr;gap:1.8rem}
 .photo{max-width:15rem}
 header.site .wrap{flex-direction:column;align-items:flex-start}
}
@media print{header.site,footer.site{display:none}body{background:#fff}}

/* ---- Full-width professional hero ---- */
.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#2f211d 0%,#442e27 55%,#5e3a2e 100%);color:#fff;padding:4.2rem 0 4rem}
.hero::before{content:"";position:absolute;right:-8%;top:-40%;width:46rem;height:46rem;border-radius:50%;background:radial-gradient(circle,rgba(180,83,42,.38),rgba(180,83,42,0) 66%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,var(--brick),#e8a07c,var(--brick))}
.hero .wrap{position:relative;z-index:1;grid-template-columns:minmax(0,1fr) minmax(0,19rem);gap:4rem}
.hero .photo{order:2}
.hero .photo img{border-radius:6px;box-shadow:0 18px 44px rgba(0,0,0,.5);border:4px solid rgba(255,255,255,.9)}
.eyebrow{color:#f0a47f}
.hero h1{color:#fff;font-size:clamp(2.6rem,6.4vw,4.4rem)}
.role{color:#e3c9b9}
.intro{color:#f4e8e0;max-width:38rem}
.btn{background:var(--brick);box-shadow:0 4px 14px rgba(0,0,0,.25)}
.btn:hover{background:#cf6138}
.facts{background:#fff;color:var(--ink);border-bottom:1px solid var(--line)}
.facts b{color:var(--brown)}
.facts span{color:var(--muted)}
.facts .wrap>div{border-left:3px solid var(--brick);padding-left:.9rem}
@media (max-width:760px){
 .hero{padding:2.6rem 0 2.8rem}
 .hero .wrap{grid-template-columns:1fr;gap:1.8rem}
 .hero .photo{order:0;max-width:14rem}
}

footer.site .credit{margin:.6rem 0 0;font-size:.8rem;letter-spacing:.05em;opacity:.9}