:root{--navy:#0d1b3e;--navy-light:#174d86;--gold:#c9a84c;--off-white:#f5f7fa;--white:#fff;--text:#3d4259;--border:#dfe3eb}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--off-white);color:var(--navy);font-family:Inter,Arial,sans-serif;line-height:1.7}
.site-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.1rem max(1.25rem,calc((100% - 1120px)/2));background:rgba(13,27,62,.97);box-shadow:0 8px 28px rgba(0,0,0,.16)}
.brand{color:var(--white);font:700 1.4rem Georgia,serif;text-decoration:none}
.brand-name{margin-left:.5rem;color:var(--gold);font:500 .86rem Inter,Arial,sans-serif}
.brand-letter-d{color:var(--gold)!important}
.site-header nav,footer nav{display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem}
.site-header nav a,footer a{color:rgba(255,255,255,.78);font-size:.9rem;text-decoration:none}
.site-header nav a:hover,.site-header nav a:focus-visible,footer a:hover,footer a:focus-visible{color:var(--gold)}
.site-header .nav-cta{padding:.55rem .9rem;border:1px solid rgba(201,168,76,.55);border-radius:999px;color:var(--white)}
main{overflow:hidden}
.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(270px,.75fr);align-items:center;gap:4rem;min-height:680px;padding:5rem max(1.25rem,calc((100% - 1120px)/2));background:linear-gradient(135deg,var(--navy),#132d61);color:var(--white)}
.hero h1,.content-section h2,.expertise h2,.cta h2{margin:.25rem 0 1.2rem;font:700 clamp(2.2rem,6vw,4.8rem)/1.08 Georgia,serif}
.hero-lead{max-width:720px;color:rgba(255,255,255,.82);font-size:clamp(1.05rem,2vw,1.28rem)}
.hero-lead a{color:var(--gold);font-weight:700;text-underline-offset:4px}
.eyebrow{margin:0 0 .65rem;color:var(--gold);font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.hero-actions{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:2rem}
.button{display:inline-block;padding:.85rem 1.2rem;border-radius:7px;font-weight:700;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.button.primary{background:var(--gold);color:var(--navy)}
.button.secondary{border:1px solid rgba(255,255,255,.35);color:var(--white)}
.button:hover,.button:focus-visible{transform:translateY(-2px)}
.portrait{margin:0;padding:1rem;background:rgba(255,255,255,.07);border:1px solid rgba(201,168,76,.35);border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.28)}
.portrait img{display:block;width:100%;height:auto;max-height:490px;object-fit:cover;object-position:center top;border-radius:11px}
.portrait figcaption{padding:.8rem .3rem 0;color:rgba(255,255,255,.72);font-size:.84rem;text-align:center}
.content-section,.expertise,.cta{padding:5rem max(1.25rem,calc((100% - 1120px)/2))}
.section-heading{max-width:820px}
.content-section h2,.expertise h2,.cta h2{font-size:clamp(2rem,4vw,3.2rem)}
.story-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);gap:3rem;align-items:start;margin-top:2rem}
.story{color:var(--text);font-size:1.04rem}
.highlight{padding-left:1.2rem;border-left:3px solid var(--gold);color:var(--navy);font:700 1.2rem/1.65 Georgia,serif}
.relationship-card{padding:2rem;background:var(--white);border:1px solid var(--border);border-radius:14px;box-shadow:0 16px 45px rgba(13,27,62,.08)}
.card-kicker{color:var(--gold);font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.relationship-card h3{margin:.5rem 0;font:700 1.7rem Georgia,serif}
.relationship-card p{color:var(--text)}
.relationship-card a{color:var(--navy-light);font-weight:800;text-underline-offset:4px}
.expertise{background:var(--white)}
.expertise-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;padding:0;margin:2rem 0 0;list-style:none}
.expertise-list li{padding:1.2rem;border:1px solid var(--border);border-radius:10px;background:var(--off-white);color:var(--text);font-weight:700}
.credentials{padding:1.35rem max(1.25rem,calc((100% - 1120px)/2));background:linear-gradient(180deg,#f5f7fa,#eef2f8)}
.credentials-label{margin:0 0 .55rem;color:#74798b;font-size:.66rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.credential-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}
.credential-card{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:.75rem;padding:.85rem;background:rgba(255,255,255,.9);border:1px solid rgba(201,168,76,.35);border-radius:10px;box-shadow:0 6px 18px rgba(13,27,62,.05)}
.credential-mark{display:grid;place-items:center;width:38px;height:38px;border:2px solid rgba(201,168,76,.72);border-radius:50%;background:linear-gradient(135deg,var(--navy),#174d86)}
.credential-check{color:var(--gold);font:700 1.05rem/1 Georgia,serif}
.credential-monogram{color:var(--white);font-size:.68rem;font-weight:800;letter-spacing:.04em}
.credential-card--claude{border-color:rgba(218,119,85,.34)}
.credential-card--claude .credential-mark{border-color:rgba(218,119,85,.72);background:linear-gradient(135deg,#6b3326,#a94f37)}
.credential-card--claude .credential-kicker{color:#a94f37}
.credential-kicker{margin:0;color:var(--gold);font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.credential-copy h3{margin:.06rem 0 0;font:700 1rem/1.22 Georgia,serif}
.credential-validity{margin:.15rem 0 .35rem;color:#777c8d;font-size:.72rem;line-height:1.35}
.credential-link{color:var(--navy-light);font-size:.74rem;font-weight:800;text-decoration:none;white-space:nowrap}
.credential-link:hover,.credential-link:focus-visible{border-color:var(--gold);color:var(--navy-light)}
.cta{text-align:center;background:linear-gradient(135deg,#eef2f8,#fff)}
.cta p:not(.eyebrow){max-width:700px;margin:0 auto 1.7rem;color:var(--text)}
.cta .button.primary{box-shadow:0 12px 30px rgba(13,27,62,.14)}
footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.5rem;padding:2rem max(1.25rem,calc((100% - 1120px)/2));background:var(--navy);color:var(--white)}
footer span{color:rgba(255,255,255,.55);font-size:.88rem}
footer .brand-letter-d{color:var(--gold)}
.heading-with-mascot{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem}
.jds-mascot{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:50%;flex:0 0 auto;background:linear-gradient(135deg,#2a45b8,#4169e1);box-shadow:0 10px 24px rgba(65,105,225,.45),0 0 0 4px #1d3081;animation:jdsMascotFloat 5.5s ease-in-out infinite}
.jds-mascot-face{display:inline-block;font:700 .88rem/1 Georgia,serif;letter-spacing:-.04em;animation:jdsMascotBlink 4.2s ease-in-out infinite}
.jds-mascot-face .letter-white{color:var(--white)}
.jds-mascot-face .letter-gold{color:var(--gold)}
@keyframes jdsMascotFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(-5px,5px)}}
@keyframes jdsMascotBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.18)}}
@media(prefers-reduced-motion:reduce){.jds-mascot,.jds-mascot-face{animation:none}}
@media(max-width:850px){.site-header{align-items:flex-start}.site-header nav{justify-content:flex-end}.hero,.story-grid{grid-template-columns:1fr}.hero{gap:2.5rem}.portrait{max-width:420px}.expertise-list{grid-template-columns:repeat(2,minmax(0,1fr))}.credential-list{grid-template-columns:1fr}}
@media(max-width:560px){.site-header{position:static;display:block}.site-header nav{margin-top:.8rem;justify-content:flex-start;gap:.8rem}.brand-name{display:block;margin:.15rem 0 0}.hero{padding-top:3.5rem}.jds-mascot--hero{width:42px;height:42px}.jds-mascot-face{font-size:.78rem}.expertise-list{grid-template-columns:1fr}.credential-card{padding:.8rem}.credential-mark{width:36px;height:36px}.credential-copy h3{font-size:.96rem}footer{display:block}footer nav{margin-top:1rem}}
