@font-face{font-family:"Fraunces";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/Fraunces-500.ttf) format("truetype")}
@font-face{font-family:"Fraunces";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/Fraunces-700.ttf) format("truetype")}
@font-face{font-family:"Public Sans";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/PublicSans-400.ttf) format("truetype")}
@font-face{font-family:"Public Sans";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/PublicSans-500.ttf) format("truetype")}
@font-face{font-family:"Public Sans";font-weight:600;font-style:normal;font-display:swap;src:url(fonts/PublicSans-600.ttf) format("truetype")}
:root{--navy:#0f2a4a;--navy-deep:#0a1c33;--gold:#b8892b;--gold-soft:#e6c777;--paper:#fbfaf6;--cream:#f3eee0;--ink:#1b2635;--muted:#566275;--line:#ddd6c3;--display:"Fraunces",Georgia,serif;--body:"Public Sans",system-ui,sans-serif;color-scheme:light}
*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font:400 17px/1.65 var(--body)}
a{color:inherit}
img{display:block}
.wrap{max-width:70rem;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.read{max-width:44rem}
/* nav */
nav.bar{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:env(safe-area-inset-top,0px);z-index:5}
nav.bar .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 2rem;padding-block:.5rem}
nav.bar a.brand{margin-right:auto;line-height:0}
nav.bar img{width:84px;height:84px;object-fit:contain}
nav.bar ul{display:flex;flex-wrap:wrap;gap:.2rem 1.6rem;list-style:none;margin:0;padding:0;font-size:.92rem;font-weight:500}
nav.bar ul a{text-decoration:none;padding:.3rem 0;border-bottom:2px solid transparent;color:var(--navy)}
nav.bar ul a:hover,nav.bar ul a[aria-current]{border-color:var(--gold)}
a:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
/* type */
h1,h2,h3{text-wrap:balance}
h1{font:700 clamp(2.2rem,5.6vw,3.6rem)/1.08 var(--display);margin:.5rem 0 1.1rem;letter-spacing:-.01em}
h2{font:700 clamp(1.6rem,3.6vw,2.2rem)/1.15 var(--display);margin:0 0 1rem;color:var(--navy)}
h3{font:600 1.08rem/1.3 var(--body);margin:0 0 .35rem;color:var(--navy)}
p{margin:0 0 1rem}
.lead{font-size:1.15rem;color:var(--muted)}
.eyebrow{font:600 .78rem var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.on-navy .eyebrow,.hero .eyebrow,.ph .eyebrow{color:var(--gold-soft)}
.btn{display:inline-block;background:var(--gold-soft);color:#13243b;font-weight:600;text-decoration:none;padding:.8rem 1.5rem;border-radius:2px;margin-right:.6rem;margin-bottom:.5rem}
.btn.ghost{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px var(--gold-soft)}
.btn.dark{background:var(--navy);color:#fff}
/* hero */
.hero{background:var(--navy);color:#f3efe3;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:3rem;align-items:center;padding-block:4rem}
.hero p{color:#d3d8e0;max-width:31rem;font-size:1.12rem;margin-bottom:1.8rem}
.hero-media{position:relative;aspect-ratio:4/5;max-height:34rem}
.hero-media::before{content:"";position:absolute;inset:-6px -6px -6px 0;background:var(--gold-soft);clip-path:polygon(16% 0,100% 0,100% 100%,0 100%)}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 35%;clip-path:polygon(16% 0,100% 0,100% 100%,0 100%)}
.ph{background:var(--navy);color:#f3efe3}
.ph .wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:2.5rem;align-items:center;padding-block:3.2rem}
.ph.solo .wrap{grid-template-columns:1fr}
.ph p{color:#d3d8e0;max-width:36rem;margin:0;font-size:1.08rem}
.ph img{width:100%;aspect-ratio:3/2;object-fit:cover;border-bottom:4px solid var(--gold-soft)}
/* sections */
section{padding-block:4rem}
section.alt{background:var(--cream)}
section.navy{background:var(--navy);color:#f3efe3}
section.navy h2,section.navy h3{color:#fff}
.head{max-width:40rem;margin-bottom:2.2rem}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;padding-block:2.2rem;border-bottom:1px solid var(--line)}
.pillars div{border-left:3px solid var(--gold);padding-left:1rem}
.pillars b{display:block;font:700 1.25rem var(--display);color:var(--navy)}
.pillars span{color:var(--muted);font-size:.95rem}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));gap:2rem}
.card{min-width:0;text-decoration:none;display:block}
.card .pic{position:relative;overflow:hidden;aspect-ratio:4/3;margin-bottom:1rem;background:var(--navy-deep)}
.card .pic img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.card:hover .pic img{transform:scale(1.04)}
.card .pic::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--gold)}
.card p{color:var(--muted);font-size:.97rem;margin:0}
.card .go{display:inline-block;margin-top:.5rem;font-weight:600;font-size:.9rem;color:var(--gold)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center}
.split>*{min-width:0}
.split.rev>:first-child{order:2}
.frame{position:relative}
.frame>img.main{width:100%;aspect-ratio:4/3.4;object-fit:cover}
.frame img.inset{position:absolute;right:-14px;bottom:-22px;width:42%;aspect-ratio:3/2;object-fit:cover;border:5px solid var(--paper);box-shadow:0 8px 24px rgba(10,28,51,.28)}
section.alt .frame img.inset{border-color:var(--cream)}
ul.list{padding-left:0;margin:0 0 1.2rem;list-style:none}
ul.list li{padding-left:1.5rem;position:relative;margin-bottom:.45rem}
ul.list li::before{content:"";position:absolute;left:0;top:.7em;width:.7rem;height:2px;background:var(--gold)}
.brandband{display:grid;grid-template-columns:auto 1fr;gap:3rem;align-items:center}
.brandband img{width:min(260px,40vw);height:auto}
.note{background:var(--cream);padding:1.1rem 1.3rem;border-left:3px solid var(--gold);font-size:.95rem;color:var(--muted)}
section.navy .note{background:rgba(255,255,255,.07);color:#d3d8e0}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1.6rem 2rem}
.tile{border-top:2px solid var(--gold);padding-top:.8rem;min-width:0}
.tile p{color:var(--muted);font-size:.95rem;margin:0}
section.navy .tile p{color:#c4ccd8}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1.6rem 2rem;counter-reset:s;padding:0;list-style:none;margin:0}
.steps li{counter-increment:s;border-top:2px solid var(--gold);padding-top:.7rem;min-width:0}
.steps li::before{content:counter(s);font:700 2rem var(--display);color:var(--gold);display:block;line-height:1.1}
.steps b{display:block;color:var(--navy)}
.steps span{color:var(--muted);font-size:.95rem}
section.navy .steps b{color:#fff}section.navy .steps span{color:#c4ccd8}
.cta{text-align:center}
.cta .read{margin:0 auto}
dl{display:grid;grid-template-columns:max-content 1fr;gap:.7rem 1.6rem;margin:0}
dt{font:600 .78rem var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding-top:.25rem}
dd{margin:0;min-width:0;overflow-wrap:anywhere}
footer{background:var(--navy-deep);color:#b9c2cf;padding-block:2.4rem;font-size:.88rem}
footer .wrap{display:grid;grid-template-columns:auto 1fr auto;gap:1.5rem 2.5rem;align-items:center}
footer img{width:84px;height:84px;object-fit:contain;background:var(--paper);border-radius:50%;padding:4px}
footer a{color:var(--gold-soft)}
@media(max-width:820px){
 .hero .wrap,.ph .wrap,.split,.brandband{grid-template-columns:1fr;gap:2rem}
 .split.rev>:first-child{order:0}
 .hero .wrap{padding-block:2.6rem}.hero-media{max-height:24rem;aspect-ratio:4/3}
 .pillars{grid-template-columns:1fr;gap:1rem}
 section{padding-block:2.8rem}
 .frame img.inset{right:8px}
 dl{grid-template-columns:1fr;gap:.1rem}dd{margin-bottom:.8rem}
 footer .wrap{grid-template-columns:1fr}
 nav.bar img{width:64px;height:64px}
}

section.bigbrand{padding-block:3.2rem}
section.bigbrand .brandband{grid-template-columns:minmax(0,380px) 1fr;gap:4rem}
section.bigbrand .brandband img{width:100%;max-width:380px}
footer .wrap{grid-template-columns:auto 1fr 1.4fr;align-items:start}
footer .legal{font-size:.84rem;line-height:1.7}
footer b{color:#fff}
@media(max-width:820px){section.bigbrand .brandband{grid-template-columns:1fr;gap:1.5rem;justify-items:start}section.bigbrand .brandband img{max-width:240px}}
