/* Shared by the advice pages (everything linked from /advice/). The welcome, gift and guide pages carry their own styles. */
:root{
  --paper:#CFDDE3; --card:#FBF7EE; --ink:#2B2622; --soft:#6F6A61; --line:#DDD2BC; --line-strong:#C9B98F;
  --wisteria:#3F5F8F; --wisteria-deep:#2E4A78; --gold:#B8944F; --gold-light:#E2CC96;
  --midnight:#060b1a; --radius:16px; --shadow:0 1px 2px rgba(43,38,34,.06), 0 18px 44px -20px rgba(43,38,34,.35);
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{ margin:0; background:var(--paper); color:var(--ink); font-family:"Jost", "Helvetica Neue", Arial, sans-serif; font-size:17px; line-height:1.65; }
#wall{ position:fixed; inset:0; z-index:0; pointer-events:none; background:var(--paper) url("/family/wallpaper.jpg") center top / cover no-repeat; }
#wall::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(207,221,227,.05), rgba(207,221,227,.35)); }
@media (max-width:640px){ #wall{ background-image:url("/family/wallpaper-small.jpg"); } }
h1,h2,h3{ font-family:"Cormorant Garamond", Georgia, serif; font-weight:600; letter-spacing:-0.005em; margin:0; line-height:1.1; }
h1{ font-size:clamp(2.2rem, 5vw, 3.3rem); }
h2{ font-size:clamp(1.7rem, 3vw, 2.2rem); margin-bottom:8px; }
h3{ font-size:1.35rem; margin:22px 0 6px; }
p{ margin:0; }
a{ color:var(--wisteria-deep); }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.kicker{ display:block; font-size:0.72rem; letter-spacing:0.24em; text-transform:uppercase; color:#8A6B2C; font-weight:500; margin-bottom:12px; }
.wordmark{ font-family:"Cormorant Garamond", Georgia, serif; font-weight:600; font-size:1.6rem; color:var(--ink); text-decoration:none; }
.wordmark em{ color:var(--gold); }

header.top{ position:sticky; top:0; z-index:5; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 5vw; background:rgba(251,247,238,.92); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--line-strong); }
header.top nav{ display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
header.top nav a{ margin-left:22px; text-decoration:none; color:var(--ink); font-size:0.95rem; }
header.top nav a:hover{ color:var(--wisteria-deep); }
header.top nav a.go{ padding:8px 16px; border-radius:10px; background:var(--wisteria-deep); color:#fff; }
@media (max-width:700px){ header.top{ padding:12px 4vw; } header.top nav{ flex-wrap:nowrap; } header.top nav a{ display:none; margin-left:12px; white-space:nowrap; } header.top nav a.keep, header.top nav a.go{ display:inline-block; } header.top nav a.go{ padding:8px 12px; } .wordmark{ white-space:nowrap; font-size:1.4rem; } }

main{ position:relative; z-index:1; }
section{ padding:30px 5vw 56px; }
.guide{ max-width:820px; margin:0 auto; }
.card{ background:rgba(251,247,238,.94); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border:1px solid var(--line-strong); border-radius:var(--radius); box-shadow:var(--shadow); padding:34px 36px; margin-top:18px; }
@media (max-width:640px){ .card{ padding:26px 22px; } }
.crumbs{ font-size:0.88rem; color:var(--soft); margin-bottom:14px; } .crumbs a{ color:inherit; }
.lede{ color:#4E4841; font-size:1.15rem; margin-top:14px; }
.byline{ margin-top:16px; font-size:0.92rem; color:var(--soft); }
.guide p + p{ margin-top:12px; }
.guide p, .guide li{ color:#4E4841; }
.guide ul, .guide ol{ padding-left:22px; margin:10px 0 0; } .guide li{ margin-bottom:10px; }
.guide li b, .guide p b{ color:var(--ink); font-weight:600; }
.tip{ border-left:3px solid var(--gold); padding:10px 16px; background:rgba(184,148,79,.08); border-radius:0 10px 10px 0; margin-top:16px; font-size:0.97rem; color:#4E4841; }
.toc{ display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; } .toc a{ text-decoration:none; font-size:0.93rem; padding:8px 14px; border:1px solid var(--line-strong); border-radius:999px; background:var(--card); color:var(--ink); } .toc a:hover{ border-color:var(--wisteria); }
.btn{ display:inline-flex; align-items:center; gap:10px; font:inherit; font-weight:500; text-decoration:none; padding:13px 24px; border-radius:12px; border:1px solid var(--line-strong); background:var(--card); color:var(--ink); }
.btn.primary{ background:var(--wisteria-deep); border-color:var(--wisteria-deep); color:#fff; }
.btn.primary:hover{ background:var(--wisteria); } .btn:hover{ border-color:var(--wisteria); }

table.compare{ width:100%; border-collapse:collapse; margin-top:16px; font-size:0.96rem; }
table.compare th, table.compare td{ text-align:left; vertical-align:top; padding:10px 12px; border-bottom:1px solid var(--line); color:#4E4841; }
table.compare th{ font-weight:600; color:var(--ink); }
.scroll{ overflow-x:auto; }

.photo{ max-width:380px; margin:22px auto 0; border-radius:14px; overflow:hidden; box-shadow:var(--shadow), inset 0 0 0 1px rgba(184,148,79,.5); }
.photo img{ display:block; width:100%; height:auto; }
.photo figcaption{ padding:10px 16px; font-size:0.9rem; color:var(--soft); background:var(--card); }

.offer{ border-color:var(--gold); box-shadow:var(--shadow), inset 0 0 0 6px var(--card), inset 0 0 0 7px var(--gold-light); text-align:center; padding:42px 36px; }
.offer .lede{ margin-left:auto; margin-right:auto; max-width:52ch; }
.offer .amt{ margin-top:20px; font-family:"Cormorant Garamond", Georgia, serif; font-weight:600; font-size:2.4rem; line-height:1; color:var(--ink); }
.offer .amt s{ font-size:.7em; font-weight:500; color:#5E5850; text-decoration-thickness:2px; margin-right:10px; }
.offer .until{ margin-top:8px; font-size:0.95rem; color:var(--soft); }
.offer .actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:22px; }
.offer .fine{ margin-top:14px; font-size:0.95rem; color:var(--ink); font-weight:500; }

.faq details{ border-top:1px solid var(--line); } .faq details:first-of-type{ margin-top:10px; }
.faq summary{ cursor:pointer; list-style:none; padding:14px 0; font-family:"Cormorant Garamond", Georgia, serif; font-weight:600; font-size:1.25rem; color:var(--ink); display:flex; justify-content:space-between; gap:12px; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; color:var(--gold); font-family:"Jost", sans-serif; font-weight:400; } .faq details[open] summary::after{ content:"\2013"; }
.faq details p{ padding:0 0 16px; }

.more a{ display:block; text-decoration:none; padding:14px 0; border-top:1px solid var(--line); color:var(--ink); }
.more a:first-of-type{ margin-top:10px; }
.more a b{ display:block; font-family:"Cormorant Garamond", Georgia, serif; font-size:1.3rem; font-weight:600; color:var(--wisteria-deep); }
.more a span{ color:#4E4841; font-size:0.97rem; }
.more a:hover b{ text-decoration:underline; }
.sign{ font-family:"Cormorant Garamond", Georgia, serif; font-size:1.25rem; margin-top:18px; color:var(--ink); } .sign i{ font-size:1.5rem; }
footer.foot{ position:relative; z-index:1; text-align:center; color:#57524A; font-size:0.9rem; padding:10px 5vw 44px; line-height:1.9; }
footer.foot a{ color:inherit; }