:root { --navy:#062946; --navy-deep:#031d35; --gold:#d7a84b; --paper:#f7f5f0; --ink:#102e49; --muted:#647384; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--paper); font-family:"DM Sans",sans-serif; } a { color:inherit; } .site-header { position:absolute; z-index:2; top:0; left:0; right:0; display:flex; justify-content:space-between; align-items:center; max-width:1280px; margin:auto; padding:28px 54px; color:white; } .logo { text-decoration:none; font:700 29px "Playfair Display",serif; } .logo span { color:var(--gold); } nav { display:flex; gap:30px; } nav a { color:#e6edf1; font-size:13px; text-decoration:none; } nav a:hover,.text-link:hover { color:var(--gold); } .menu-button { display:none; }
.hero { position:relative; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(310px,.75fr); min-height:690px; padding:155px max(7vw,54px) 72px; overflow:hidden; color:#fff; background:radial-gradient(circle at 71% 17%,#164c70 0,transparent 23%),linear-gradient(120deg,#062b49 15%,#0a385a 100%); } .hero::after { position:absolute; inset:0; opacity:.15; background-image:linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px); background-size:75px 75px; content:""; } .hero-copy,.portrait-wrap { position:relative; z-index:1; } .eyebrow,.section-number { margin:0 0 16px; color:var(--gold); font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; } h1,h2,h3 { margin:0; font-family:"Playfair Display",serif; } h1 { max-width:760px; font-size:clamp(48px,6vw,84px); line-height:1; letter-spacing:-.04em; } em { font-weight:500; } .intro { max-width:550px; margin:29px 0; color:#d7e1e8; font-size:17px; line-height:1.65; } .hero-actions { display:flex; align-items:center; gap:28px; } .button { display:inline-flex; gap:18px; align-items:center; padding:15px 20px; font-size:13px; font-weight:700; text-decoration:none; transition:transform .2s,background .2s; } .button:hover { transform:translateY(-3px); } .button-gold { color:#0b2b47; background:var(--gold); } .text-link { color:white; font-size:13px; text-decoration:none; } .portrait-wrap { align-self:end; justify-self:end; width:min(100%,355px); } .portrait { height:405px; border:8px solid rgba(255,255,255,.94); outline:1px solid var(--gold); background-image:url("profile-reference.png"); background-position:left top; background-size:820px auto; } .portrait-wrap p { margin:20px 0 0; color:#f4cf80; font:italic 20px/1.25 "Playfair Display",serif; text-align:right; } .hero-mark { position:absolute; z-index:1; right:50px; bottom:35px; color:rgba(255,255,255,.28); font:600 15px "Playfair Display",serif; }
.section { padding:105px max(7vw,54px); } .about { background:#fff; } .about-grid { display:grid; grid-template-columns:1fr 1fr; gap:10vw; align-items:start; } h2 { font-size:clamp(37px,4.1vw,58px); line-height:1.06; letter-spacing:-.035em; } .about-grid h2 { color:var(--navy); } .lead { margin-top:5px!important; color:#183b58; font-size:20px!important; line-height:1.55!important; } .about-grid p:not(.section-number) { margin:0 0 20px; color:#536477; font:16px/1.7 "Playfair Display",serif; }.work { color:white; background:var(--navy-deep); }.section-heading { display:flex; align-items:end; justify-content:space-between; margin-bottom:43px; }.section-heading h2 { color:white; }.work-list { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(255,255,255,.22); }.work-list article { min-height:255px; padding:25px 25px 0 0; border-right:1px solid rgba(255,255,255,.22); }.work-list article:not(:first-child) { padding-left:25px; }.work-list article:last-child { border:0; }.work-list span { color:var(--gold); font:italic 15px "Playfair Display",serif; }.work-list h3 { margin:48px 0 16px; font-size:26px; line-height:1.06; }.work-list p { max-width:200px; color:#b7c8d4; font-size:13px; line-height:1.55; }.publication { display:grid; grid-template-columns:1.05fr .95fr; gap:8vw; align-items:center; background:#ece9e2; }.publication-copy .eyebrow { margin-top:35px; }.publication-copy h2 { color:#092d4a; }.subtitle { color:#876523; font:italic 23px "Playfair Display",serif; }.publication-copy p:not(.section-number):not(.eyebrow):not(.subtitle) { max-width:520px; color:#566575; line-height:1.65; }.button-outline { margin-top:12px; border:1px solid var(--ink); color:var(--ink); }.book-stage { position:relative; min-height:440px; display:grid; place-items:center; background:radial-gradient(circle at center,#5e8b82 0,transparent 54%),#082f3e; }.book-cover { display:flex; flex-direction:column; justify-content:space-between; width:235px; height:350px; padding:20px; color:#f7e7bc; text-align:center; background:linear-gradient(145deg,rgba(9,55,44,.82),rgba(6,23,28,.88)),url("profile-reference.png") center/cover; box-shadow:16px 15px 0 #cabd99,27px 26px 25px rgba(0,0,0,.35); }.book-cover strong { font:600 26px/1 "Playfair Display",serif; }.book-cover em { font:italic 13px "Playfair Display",serif; }.book-cover span,.book-cover small { font-size:10px; }.book-stage>p { position:absolute; right:-15px; bottom:0; color:#fff; font:italic 17px/1.4 "Playfair Display",serif; text-align:right; transform:translateY(32px); }
footer { display:grid; grid-template-columns:1.3fr 1fr; gap:30px; padding:75px max(7vw,54px) 25px; color:white; background:#062946; } footer h2 { font-size:40px; }.contact-links { display:flex; align-items:start; justify-content:center; flex-direction:column; gap:12px; color:#d9e1e7; font-size:14px; }.contact-links a { text-decoration:none; }.contact-links a:hover { color:var(--gold); }.copyright { grid-column:1/-1; margin:45px 0 0; padding-top:20px; border-top:1px solid rgba(255,255,255,.15); color:#9fb0bf; font-size:11px; }
@media(max-width:760px) { .site-header { padding:20px 25px; }.menu-button { z-index:3; display:block; padding:8px 0; border:0; color:#fff; background:transparent; font:600 12px "DM Sans",sans-serif; text-transform:uppercase; letter-spacing:.1em; cursor:pointer; } nav { position:absolute; top:0; left:0; right:0; display:none; flex-direction:column; gap:20px; padding:80px 25px 30px; background:#062946; } nav.open { display:flex; }.hero { grid-template-columns:1fr; min-height:760px; padding:135px 25px 45px; }.hero-copy { z-index:1; }.intro { font-size:15px; }.portrait-wrap { width:245px; margin:30px 0 0 auto; }.portrait { height:290px; background-size:600px auto; }.portrait-wrap p { font-size:16px; }.hero-mark { right:25px; bottom:25px; }.section { padding:70px 25px; }.about-grid,.publication { grid-template-columns:1fr; gap:35px; }.work-list { grid-template-columns:1fr 1fr; }.work-list article:nth-child(2) { border-right:0; }.work-list article:nth-child(n+3) { border-top:1px solid rgba(255,255,255,.22); }.work-list article { min-height:225px; padding:22px 15px 0 0!important; }.work-list article:nth-child(even) { padding-left:15px!important; }.work-list h3 { margin-top:35px; font-size:22px; }.book-stage { min-height:400px; }.book-stage>p { right:10px; font-size:14px; }footer { grid-template-columns:1fr; padding:60px 25px 25px; } }
@media(max-width:430px) { h1 { font-size:47px; }.hero-actions { align-items:start; flex-direction:column; gap:18px; }.portrait-wrap { width:215px; }.portrait { height:260px; background-size:530px auto; }.work-list { grid-template-columns:1fr; }.work-list article { min-height:190px; padding:20px 0!important; border-right:0; border-bottom:1px solid rgba(255,255,255,.22); }.work-list article:last-child { border-bottom:0; }.work-list h3 { margin:25px 0 10px; }.section-heading { display:block; }.section-heading h2 { margin-top:15px; } }

.articles { color:white; background:var(--navy-deep); }
.articles-intro { max-width:480px; color:#b7c8d4; font:16px/1.6 "Playfair Display",serif; }
.article-picker { display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-top:35px; padding:26px; border:1px solid rgba(255,255,255,.22); }
.article-picker label { width:100%; color:var(--gold); font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.article-picker select { flex:1 1 420px; min-height:49px; padding:0 15px; border:1px solid #b7c8d4; color:var(--ink); background:#fff; font:15px "DM Sans",sans-serif; }
.article-picker .button { border:0; cursor:pointer; }
@media(max-width:760px) { .article-picker { padding:20px; } }

/* Clean portrait crop: the source image includes a full profile sheet, so only the photograph is shown here. */
.portrait { background-position:-24px -32px; background-size:1370px auto; }
.portrait-caption { margin-top:20px; text-align:right; }
.portrait-caption h2 { color:#fff; font-size:25px; }
.portrait-caption p { max-width:310px; margin:6px 0 0 auto; color:#d7e1e8; font-size:12px; line-height:1.55; }
.article-submission { display:flex; justify-content:space-between; gap:30px; align-items:center; margin-top:28px; padding:30px; border-left:3px solid var(--gold); background:rgba(255,255,255,.06); }
.article-submission .eyebrow { margin-bottom:8px; }
.article-submission h3 { font-size:27px; }
.article-submission p:not(.eyebrow) { max-width:500px; margin:8px 0 0; color:#b7c8d4; font-size:14px; line-height:1.6; }
.legal-email-link { color:#f4cf80; font-weight:700; }
.legal-email-link:hover { color:#fff; }
.button-outline-light { flex:none; border:1px solid rgba(255,255,255,.7); color:#fff; }
@media(max-width:760px) { .article-submission { align-items:flex-start; flex-direction:column; padding:24px; } }

.petitions { color:#fff; background:#0a385a; }
.petition-picker { display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-top:35px; padding:26px; border:1px solid rgba(255,255,255,.28); }
.petition-picker label { width:100%; color:var(--gold); font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.petition-picker select { flex:1 1 420px; min-height:49px; padding:0 15px; border:1px solid #b7c8d4; color:var(--ink); background:#fff; font:15px "DM Sans",sans-serif; }
.petition-picker .button { border:0; cursor:pointer; }
.youtube { background:#fff; }
.youtube-heading { display:flex; align-items:end; justify-content:space-between; gap:25px; }
.youtube-heading h2 { color:var(--navy); }
.youtube-intro { max-width:550px; margin:24px 0 32px; color:#536477; font:16px/1.6 "Playfair Display",serif; }
.video-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.video-card { overflow:hidden; background:var(--navy-deep); box-shadow:0 10px 25px rgba(6,41,70,.13); }
.video-card iframe { display:block; width:100%; aspect-ratio:16/9; border:0; }
@media(max-width:760px) { .petition-picker { padding:20px; }.youtube-heading { align-items:flex-start; flex-direction:column; }.video-grid { grid-template-columns:1fr; } }

/* Reframe the portrait for smaller screens instead of using the desktop crop. */
@media(max-width:760px) {
  .hero { min-height:0; }
  .portrait { background-size:960px auto; background-position:-17px -23px; }
  .portrait-caption { margin-top:14px; }
  .portrait-caption h2 { font-size:22px; }
  .portrait-caption p { font-size:11px; }
}
@media(max-width:430px) {
  .portrait { background-size:845px auto; background-position:-14px -20px; }
  .portrait-caption { max-width:215px; }
  .portrait-caption h2 { font-size:20px; }
}

.featured-articles { color:#fff; background:#0a385a; }
.featured-articles .section-heading h2 { color:#fff; }
.featured-article-card { display:grid; grid-template-columns:1fr minmax(260px,.75fr); gap:42px; align-items:center; padding:32px; border:1px solid rgba(255,255,255,.24); background:rgba(3,29,53,.35); }
.featured-article-card h3 { max-width:590px; font-size:clamp(28px,3vw,42px); line-height:1.08; }
.featured-article-card p:not(.eyebrow) { color:#c4d3de; font:16px/1.65 "Playfair Display",serif; }
.featured-article-card .featured-byline { margin:14px 0; color:#f4cf80; font-style:italic; }
.featured-article-card .button { margin-top:12px; }
.featured-article-card img { width:100%; box-shadow:0 12px 30px rgba(0,0,0,.25); }
.health { background:#fff; }
.health .section-heading h2 { color:var(--navy); }
.health-links { border-top:1px solid #cdd5dc; }
.health-links a { display:grid; grid-template-columns:64px 1fr 28px; gap:20px; align-items:center; padding:25px 0; border-bottom:1px solid #cdd5dc; color:var(--navy); text-decoration:none; transition:padding .2s,color .2s; }
.health-links a:hover { padding-left:10px; color:#9a722b; }
.health-links span { color:var(--gold); font:italic 18px "Playfair Display",serif; }
.health-links strong { font:600 25px/1.15 "Playfair Display",serif; }
.health-links b { font-size:22px; }
.eobi { color:#fff; background:linear-gradient(120deg,#062b49 15%,#0a385a 100%); }
.eobi .section-heading h2 { color:#fff; max-width:740px; }
.eobi-grid { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(250px,.7fr); gap:7vw; align-items:center; }
.eobi-grid p { max-width:700px; color:#d7e1e8; font:16px/1.7 "Playfair Display",serif; }
.eobi-grid .lead { color:#fff; }
.eobi-actions { display:flex; align-items:flex-start; flex-direction:column; gap:14px; }
.eobi-actions .button { margin:0; }
@media(max-width:760px) { .eobi-grid { grid-template-columns:1fr; gap:28px; } }
.upcoming-publication { margin-top:43px; padding-top:27px; border-top:1px solid #c9c3b7; }
.upcoming-publication .eyebrow { margin:0 0 9px; }
.upcoming-publication h3 { color:var(--navy); font-size:27px; }
.upcoming-publication a { color:var(--navy); font-size:13px; font-weight:700; }
.upcoming-publication a:hover { color:#9a722b; }
.survey { display:grid; grid-template-columns:1fr minmax(260px,.65fr); gap:8vw; align-items:center; overflow:hidden; color:#fff; background:linear-gradient(120deg,#062b49 15%,#0a385a 100%); }
.survey-copy { position:relative; z-index:1; }
.survey-copy h2 { color:#fff; }
.survey-copy p:not(.section-number):not(.eyebrow) { max-width:570px; color:#d7e1e8; font:17px/1.7 "Playfair Display",serif; }
.survey-copy .button { margin-top:15px; }
.survey-mark { position:relative; min-height:300px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.36); background:radial-gradient(circle at center,rgba(215,168,75,.26),transparent 56%); }
.survey-mark::before,.survey-mark::after { position:absolute; border:1px solid rgba(215,168,75,.6); border-radius:50%; content:""; }
.survey-mark::before { width:180px; height:180px; }.survey-mark::after { width:245px; height:245px; opacity:.5; }
.survey-mark span { position:relative; z-index:1; color:#f4cf80; font:600 38px/.9 "Playfair Display",serif; letter-spacing:-.04em; text-align:center; }
.survey-mark b { position:absolute; right:18px; bottom:13px; color:rgba(255,255,255,.3); font:600 18px "Playfair Display",serif; }
@media(max-width:760px) { .featured-article-card { grid-template-columns:1fr; gap:25px; padding:24px; }.health-links a { grid-template-columns:42px 1fr 22px; gap:12px; }.health-links strong { font-size:21px; } }
@media(max-width:760px) { .survey { grid-template-columns:1fr; gap:35px; }.survey-mark { min-height:235px; }.survey-mark::after { width:195px; height:195px; }.survey-mark::before { width:145px; height:145px; } }
