/* Edith F Gibson website. Layout: sticky nav, full-width navy hero with framed portrait, airy sections with large photography. */
:root{--bg:#FFFFFF;--soft:#F5F7FB;--fg:#1F2937;--muted:#5B6678;--navy:#1E3350;--navy2:#142339;--gold:#F0CB3F;--gold-d:#C99A10;--tint:#FDF6DD;--tint-line:#F0E2A8;--line:#E3E8F0;--link:#1A5FB4;--on-navy:#FFFFFF;--on-navy-m:#C7D2E3;
--display:'Bricolage Grotesque',system-ui,sans-serif;--body:'Plus Jakarta Sans',system-ui,sans-serif}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0E1522;--soft:#131D2E;--fg:#E5EAF2;--muted:#9AA7BA;--navy:#0A1220;--navy2:#070D18;--tint:#2A2614;--tint-line:#5A4F1E;--line:#243350;--link:#7FB3F0;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0E1522;--soft:#131D2E;--fg:#E5EAF2;--muted:#9AA7BA;--navy:#0A1220;--navy2:#070D18;--tint:#2A2614;--tint-line:#5A4F1E;--line:#243350;--link:#7FB3F0;color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.7 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:var(--link)}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.w{max-width:1160px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--navy2);z-index:60}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--navy2);border-bottom:1px solid rgba(255,255,255,.08)}
.top .w{display:flex;align-items:center;justify-content:space-between;min-height:68px;gap:18px}
.logo{font:700 1.15rem var(--display);color:#fff;text-decoration:none;letter-spacing:.01em;line-height:1.1}
.logo small{display:block;font:500 .66rem var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-top:3px}
.menu{display:flex;gap:26px;align-items:center}
.menu a{color:var(--on-navy-m);text-decoration:none;font-size:.9rem;font-weight:500;padding:6px 0;border-bottom:2px solid transparent}
.menu a:hover,.menu a[aria-current="page"]{color:#fff;border-bottom-color:var(--gold)}
.menu .cta{background:var(--gold);color:#1E3350;padding:9px 18px;border-radius:999px;border:0;font-weight:700}
.menu .cta:hover{background:#fff;color:#1E3350}
.burger{display:none;background:none;border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:8px;padding:8px 12px;font:600 .85rem var(--body);cursor:pointer}
.hero{background:var(--navy);color:var(--on-navy);overflow:hidden}
.hero .w{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;padding-block:72px}
.eyebrow{font:600 .78rem var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
h1,h2,h3{font-family:var(--display);line-height:1.08;margin:0;text-wrap:balance}
h1{font-size:clamp(2.6rem,6vw,4.4rem);font-weight:700;margin:14px 0 18px}
.hero .sub{font-size:1.2rem;color:var(--on-navy-m);max-width:34ch;margin:0 0 30px}
.hero .sub b{color:#fff}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-block;font-weight:700;text-decoration:none;padding:14px 26px;border-radius:999px;font-size:.95rem;border:2px solid var(--gold);background:var(--gold);color:#1E3350}
.btn.ghost{background:transparent;color:#fff}
.btn:hover{transform:translateY(-1px)}
.frame{position:relative;max-width:440px;justify-self:end;width:100%}
.frame::before{content:"";position:absolute;inset:22px -22px -22px 22px;background:var(--gold);border-radius:6px}
.frame img{position:relative;display:block;width:100%;height:auto;border-radius:6px}
.pagehead{background:var(--navy);color:var(--on-navy);padding-block:64px 56px}
.pagehead h1{font-size:clamp(2.2rem,5vw,3.4rem);margin:12px 0 14px}
.pagehead p{max-width:60ch;color:var(--on-navy-m);font-size:1.15rem;margin:0}
.strip{background:var(--navy2);color:#fff}
.strip .w{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.strip .s{padding:30px 22px;border-left:1px solid rgba(255,255,255,.12)}
.strip .s:first-child{border-left:0;padding-left:0}
.strip b{display:block;font:700 2.4rem/1 var(--display);color:var(--gold);font-variant-numeric:tabular-nums}
.strip span{display:block;margin-top:8px;font-size:.88rem;color:var(--on-navy-m);line-height:1.45}
section{padding-block:88px}
section.soft{background:var(--soft)}
.kick{font:600 .75rem var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--gold-d)}
h2{font-size:clamp(1.9rem,4vw,2.9rem);font-weight:700;margin:10px 0 18px}
h3{font-size:1.35rem;font-weight:700;margin-bottom:8px}
.lede{font-size:1.2rem;color:var(--muted);max-width:60ch;margin:0 0 8px}
p{margin:0 0 1em}
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split.rev>:first-child{order:2}
.split>*{min-width:0}
.chain{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:44px;counter-reset:c}
.chain div{padding:26px 24px;border-top:4px solid var(--gold);background:var(--soft)}
section.soft .chain div{background:var(--bg)}
.chain b{display:block;font:700 1.4rem var(--display);margin-bottom:6px}
.chain p{margin:0;font-size:.95rem;color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:44px}
.card{background:var(--bg);border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:inherit;min-width:0}
section.soft .card{background:var(--bg)}
.card img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center 30%}
.card .t{padding:24px 24px 26px;display:flex;flex-direction:column;gap:6px;flex:1}
.card h3{margin:0}
.card p{margin:0;color:var(--muted);font-size:.97rem}
.card .more{margin-top:auto;padding-top:12px;font-weight:700;font-size:.92rem;color:var(--link)}
.tint{background:var(--tint);border:1px solid var(--tint-line);border-radius:10px;padding:26px 28px}
.quote{font:600 clamp(1.5rem,3vw,2.2rem)/1.3 var(--display);max-width:26ch;margin:0}
.band{background:var(--navy);color:#fff;text-align:center;padding-block:76px}
.band h2{color:#fff;margin-inline:auto;max-width:20ch}
.band p{color:var(--on-navy-m);max-width:52ch;margin:0 auto 28px;font-size:1.1rem}
.pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.pills span{background:var(--tint);border:1px solid var(--tint-line);border-radius:999px;padding:7px 16px;font-size:.92rem}
.tl{margin:36px 0 0;padding:0;list-style:none;border-left:3px solid var(--gold)}
.tl li{padding:0 0 28px 28px;position:relative}
.tl li::before{content:"";position:absolute;left:-10px;top:8px;width:17px;height:17px;border-radius:50%;background:var(--bg);border:4px solid var(--gold)}
.tl b{display:block;font:700 1.05rem var(--display);color:var(--gold-d)}
.tl span{color:var(--fg)}
.gal{columns:3 280px;column-gap:18px;margin-top:36px}
.gal.two{columns:2 340px}
.gal figure{margin:0 0 18px;break-inside:avoid}
.gal button,.photo button{all:unset;display:block;cursor:zoom-in;width:100%}
.gal img,.photo img{display:block;width:100%;height:auto;border-radius:8px}
figcaption{font-size:.84rem;color:var(--muted);margin-top:8px;line-height:1.45}
.photo{margin:0}
.facts{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:14px}
.facts li{padding-left:22px;position:relative}
.facts li::before{content:"";position:absolute;left:0;top:.7em;width:10px;height:3px;background:var(--gold)}
.facts b{font-family:var(--display)}
.two4{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:36px}
.two4 .tint b{display:block;font:700 1.2rem var(--display);margin-bottom:6px}
.two4 .tint p{margin:0;color:var(--muted)}
table{width:100%;border-collapse:collapse;margin-top:26px;font-size:.98rem}
th,td{text-align:left;padding:14px 14px;border-bottom:1px solid var(--line);vertical-align:top}
th{font:600 .75rem var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
td:first-child{font:700 1rem var(--display);color:var(--gold-d);width:80px}
.tw{overflow-x:auto}
.links{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:12px}
.links a{display:block;padding:18px 22px;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--fg);background:var(--bg);font-weight:600}
.links a small{display:block;font-weight:500;color:var(--muted);margin-top:2px}
.links a:hover{border-color:var(--gold)}
.contactbox{display:grid;gap:18px;margin-top:20px}
.contactbox div{border-top:1px solid var(--line);padding-top:16px}
.contactbox small{display:block;font:600 .72rem var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.contactbox a,.contactbox span{font-size:1.1rem;font-weight:600}
footer{background:var(--navy2);color:var(--on-navy-m);padding-block:56px 36px;font-size:.92rem}
footer .w{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
footer h4{margin:0 0 12px;color:#fff;font:700 .95rem var(--display)}
footer a{color:var(--on-navy-m);text-decoration:none;display:block;margin-bottom:8px}
footer a:hover{color:var(--gold)}
footer .fine{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:20px;margin-top:10px;font-size:.82rem}
dialog{border:0;padding:0;background:transparent;max-width:96vw;max-height:94vh;color:#fff}
dialog::backdrop{background:rgba(6,10,18,.9)}
dialog img{max-width:96vw;max-height:84vh;display:block;margin:0 auto;border-radius:6px}
dialog p{text-align:center;font-size:.9rem;margin:10px 0 0}
dialog button{position:fixed;top:max(14px,env(safe-area-inset-top,0px));right:14px;background:var(--gold);color:#1E3350;border:0;border-radius:999px;padding:9px 18px;font-weight:700;cursor:pointer}
@media (max-width:900px){
.hero .w{grid-template-columns:1fr;padding-block:48px;gap:44px}.frame{justify-self:center;max-width:340px;margin-right:22px}
.strip .w{grid-template-columns:repeat(2,1fr)}.strip .s:nth-child(3){border-left:0;padding-left:0}
.split,.split.rev{grid-template-columns:1fr;gap:34px}.split.rev>:first-child{order:0}
.chain{grid-template-columns:repeat(2,1fr)}.cards{grid-template-columns:1fr}
footer .w{grid-template-columns:1fr}
section{padding-block:60px}
.burger{display:block}
.menu{display:none;position:absolute;left:0;right:0;top:100%;background:var(--navy2);flex-direction:column;align-items:stretch;gap:0;padding:8px max(20px,env(safe-area-inset-left,0px)) 20px}
.menu.open{display:flex}
.menu a{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.menu .cta{text-align:center;margin-top:14px;border-radius:999px}
}
@media (max-width:560px){.chain,.two4{grid-template-columns:1fr}.strip b{font-size:1.9rem}.strip .s{padding:22px 14px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn:hover{transform:none}}
.m-home{display:none}
@media (max-width:760px){
.d-home{display:none}.m-home{display:block}
.hero .w{padding-block:36px;gap:28px}
.hero h1{font-size:2.3rem}
.hero .btns{display:grid;grid-template-columns:1fr 1fr}
.mb{padding-block:36px 8px}.mb.soft{background:var(--soft)}
.mb h2{font-size:1.7rem;margin:8px 0 10px}.mb p{margin:0 0 18px;color:var(--muted)}
.mchain{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:24px}
.mchain div{background:var(--soft);border-top:4px solid var(--gold);padding:16px 14px}
.mchain b{display:block;font:700 1.25rem var(--display);margin-bottom:4px}
.mchain span{font-size:.88rem;color:var(--muted);line-height:1.4;display:block}
.car{margin:0 0 6px}
.trk{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-inline:max(16px,env(safe-area-inset-left,0px))}
.trk::-webkit-scrollbar{display:none}
.sl{flex:0 0 88%;scroll-snap-align:center;margin:0}
.sl button{all:unset;display:flex;width:100%;height:280px;background:var(--soft);border-radius:10px;align-items:center;justify-content:center;cursor:zoom-in}
.mb.soft .sl button{background:var(--bg)}
.sl img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:10px}
.sl figcaption{font-size:.84rem;color:var(--muted);margin-top:8px;line-height:1.4;min-height:2.4em}
.cbar{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:6px}
.cbar button{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--fg);font-size:1.5rem;line-height:1;cursor:pointer}
.cc{font:600 .85rem var(--body);color:var(--muted);min-width:54px;text-align:center}
.solo{margin:0 0 14px;padding-inline:max(16px,env(safe-area-inset-left,0px))}
.solo button{all:unset;display:block;width:100%;cursor:zoom-in}
.solo img{display:block;width:100%;height:auto;border-radius:10px}
.solo figcaption{font-size:.84rem;color:var(--muted);margin-top:8px}
.mlink{display:inline-block;margin:12px 0 26px;font-weight:700;color:var(--link);text-decoration:none}
}
