/* novialia v3: "la hoja" (the sheet). Editorial stationery: letterpress ink on warm white paper, wine accent,
   sage for confirmed states, one gold hairline. Loaded after /_kit/kit.css and overrides it. Mobile first. */
:root{
  --paper:#FAF6F1;--paper-2:#F3ECE3;--ink:#2E1B26;--ink-2:#5B4650;--ink-3:#8A7580;
  --wine:#7A2D3F;--wine-deep:#5E2130;--wine-soft:#F1E3E6;--sage:#6F8A72;--sage-soft:#E7EDE6;--gold:#C9A56A;
  --rule:#E2D8CC;--rule-2:#CDBFB0;
  --accent:var(--wine);--accent-strong:var(--wine-deep);--accent-soft:var(--wine-soft);--on-accent:#fff;
  --bg:var(--paper);--bg-soft:var(--paper-2);--line:var(--rule);--line-2:var(--rule-2);
  --ink-2:#5B4650;--ink-3:#8A7580;--ok:#4F6E53;--no:#8C2B2B;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,"Times New Roman",serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,Inter,sans-serif;
  --font:var(--sans);--radius:6px;--radius-sm:4px;--shadow:none;--shadow-sm:none;--shadow-lg:none;
  --ease:cubic-bezier(.2,.7,.2,1);
}
html{background:var(--paper)}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.55}
h1,h2,h3,.serif{font-family:var(--serif);font-weight:400;letter-spacing:-.01em}
h1{font-size:clamp(2.1rem,7.6vw,3.6rem);line-height:1.08;margin:0 0 .5em}
h1 em,h2 em,.hero-title em{font-style:italic;color:var(--wine)}
h2{font-size:clamp(1.6rem,4.6vw,2.3rem);line-height:1.15;margin:0 0 .5em}
h3{font-size:1.25rem;margin:0 0 .35em}
p{margin:0 0 1em}
a{color:var(--wine)}
.eyebrow{display:block;font:600 .72rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--wine);margin:0 0 14px}
.lead{font-size:1.1rem;color:var(--ink-2);max-width:34em}
.wrap{max-width:1120px}
.narrow{max-width:760px}

/* header */
.site-header{position:sticky;top:0;z-index:20;background:rgba(250,246,241,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--rule);box-shadow:none}
.site-header .wrap{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px;padding-top:10px;padding-bottom:10px}
.brand{display:inline-flex;align-items:center;gap:0;min-height:44px;color:var(--ink);text-decoration:none;font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.45rem;letter-spacing:-.02em}
.brand svg{width:40px;height:40px;border-radius:0;box-shadow:none}
.brand .tld{display:none}
.nav{display:flex;gap:2px;width:auto;margin:0;overflow-x:auto;mask-image:none;scrollbar-width:none}
.nav a{font:500 .9rem/1 var(--sans);color:var(--ink-2);padding:12px 10px;border-radius:0;min-height:44px;border-bottom:1.5px solid transparent;background:none}
.nav a:hover{background:none;color:var(--ink)}
.nav a[aria-current="page"]{background:none;color:var(--wine);border-bottom-color:var(--wine)}
@media (max-width:640px){.nav a:not(.nav-key){display:none}}

/* buttons */
.btn{font:600 .98rem/1.2 var(--sans);min-height:50px;padding:13px 26px;border-radius:999px;background:var(--wine);background-image:none;border-color:var(--wine);color:#fff;box-shadow:none;transition:background .18s,transform .18s var(--ease)}
.btn:hover{background:var(--wine-deep);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--wine);border:1px solid var(--rule-2)}
.btn.ghost:hover{background:var(--wine-soft);border-color:var(--wine)}
.btn.sm{min-height:40px;padding:8px 16px;font-size:.88rem}
.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--wine);outline-offset:3px}

/* the dateline: the signature. A monogram strip that updates live with the couple's plan */
.dateline{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-family:var(--serif);color:var(--ink-2);font-size:1rem;border-top:1px solid var(--gold);border-bottom:1px solid var(--gold);padding:10px 0}
.dateline .mono{font-size:1.9rem;line-height:1;color:var(--ink);font-style:italic;letter-spacing:-.03em}
.dateline .mono .amp{color:var(--wine);font-style:italic;margin:0 .08em}
.dateline .sep{color:var(--gold)}
.dateline .dim{color:var(--ink-3)}

/* hero */
.hero{padding:24px 0 28px}
.hero .lead{margin-bottom:18px;font-size:1.02rem}
.hero .dateline{margin-bottom:4px}
@media (min-width:900px){.hero .lead{font-size:1.1rem;margin-bottom:28px}}
.hero-grid{display:grid;gap:28px}
@media (min-width:900px){.hero{padding:72px 0 48px}.hero-grid{grid-template-columns:1fr 1.05fr;gap:56px;align-items:start}}

/* the sheet: paper card with letterpress rule */
.sheet{background:#fff;border:1px solid var(--rule);border-radius:var(--radius);padding:22px 20px;position:relative}
.sheet::before{content:"";position:absolute;inset:6px;border:1px solid var(--rule);border-radius:3px;pointer-events:none}
.sheet>*{position:relative}
.sheet .sheet-title{font-family:var(--serif);font-style:italic;font-size:1.05rem;color:var(--ink-3);text-align:center;margin:0 0 18px}
.field{margin:0 0 14px}
.field label{display:block;font:600 .74rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin:0 0 7px}
.field input,.field select,.field textarea{width:100%;box-sizing:border-box;min-height:48px;padding:10px 12px;border:0;border-bottom:1.5px solid var(--rule-2);border-radius:0;background:transparent;font:400 1.15rem/1.2 var(--serif);color:var(--ink);transition:border-color .15s}
.field input::placeholder{color:#B7A9AE;font-style:italic}
.field input:focus,.field select:focus{border-bottom-color:var(--wine);outline:none}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.names{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:8px}
.names .amp{font-family:var(--serif);font-style:italic;font-size:1.9rem;color:var(--wine);padding-bottom:6px}
.hint{font-size:.84rem;color:var(--ink-3);margin:6px 0 0}

/* the overview the mini planner produces */
.glance{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--rule);border:1px solid var(--rule);margin:20px 0 18px}
.glance>div{background:var(--paper);padding:14px 14px 12px}
.glance b{display:block;font:400 1.75rem/1.05 var(--serif);color:var(--ink);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.glance b.over{color:var(--no)}
.glance b.under{color:var(--ok)}
.glance small{display:block;font:500 .74rem/1.25 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-top:4px}
.glance .note{grid-column:1/-1;font:400 .95rem/1.4 var(--sans);color:var(--ink-2);padding-top:12px}
.glance .note em{font-family:var(--serif);color:var(--wine)}
.sheet .actions{display:flex;flex-direction:column;gap:10px}
.sheet .actions .btn{width:100%}
.saved{font-size:.8rem;color:var(--ink-3);text-align:center;margin:12px 0 0}
.saved::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--sage);margin-right:7px;vertical-align:middle}

/* index tabs section (the planner's parts), presented as stationery divider tabs */
.section{padding:48px 0}
.section.alt{background:var(--paper-2)}
.section.dark{background:var(--ink);color:#EEE3DA}
.section.dark h2,.section.dark .eyebrow{color:#F3E4D8}
.section.dark .eyebrow{color:var(--gold)}
.section-head{max-width:620px;margin:0 0 28px}
.tabs-index{display:grid;gap:10px;list-style:none;padding:0;margin:0}
.tabs-index li a{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:16px 18px;background:#fff;border:1px solid var(--rule);border-left:4px solid var(--wine);border-radius:0 var(--radius) var(--radius) 0;color:var(--ink);text-decoration:none;transition:transform .2s var(--ease),border-color .2s}
.tabs-index li a:hover{transform:translateX(4px);border-color:var(--rule-2);border-left-color:var(--wine-deep)}
.tabs-index .lab{font:600 .72rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);writing-mode:vertical-rl;transform:rotate(180deg)}
.tabs-index h3{margin:0 0 2px;font-size:1.2rem}
.tabs-index p{margin:0;color:var(--ink-2);font-size:.95rem}
.tabs-index .arrow{font-family:var(--serif);font-size:1.4rem;color:var(--wine)}
@media (min-width:900px){.tabs-index{grid-template-columns:1fr 1fr}}
.tabs-index li:nth-child(2) a{border-left-color:var(--sage)}
.tabs-index li:nth-child(3) a{border-left-color:var(--gold)}
.tabs-index li:nth-child(4) a{border-left-color:var(--ink-3)}
.tabs-index li:nth-child(5) a{border-left-color:var(--ink)}

/* three facts */
.trio{display:grid;gap:22px}
@media (min-width:640px){.trio{grid-template-columns:repeat(3,1fr)}}
.trio h3{font-size:1.2rem}
.trio p{color:var(--ink-2);margin:0}
.trio .ornament{font-family:var(--serif);color:var(--gold);font-size:1.5rem;line-height:1;margin:0 0 10px}

/* money row */
.offers{display:grid;gap:16px}
@media (min-width:640px){.offers{grid-template-columns:1fr 1fr}}
.offer{background:#fff;border:1px solid var(--rule);border-radius:var(--radius);padding:22px 20px;display:flex;flex-direction:column;gap:8px}
.offer h3{margin:0}
.offer p{margin:0;color:var(--ink-2)}
.offer .btn{align-self:flex-start;margin-top:8px}
.disclosure{font-size:.8rem;color:var(--ink-3);margin:12px 0 0}

/* faq on kit, tuned */
.faq details{background:#fff;border-radius:var(--radius);border-color:var(--rule)}
.faq details[open]{border-color:var(--rule-2)}
.faq summary h3{font-size:1.08rem}
.faq p{padding:0 18px 16px;color:var(--ink-2);margin:0}

/* footer */
.site-footer{background:var(--paper-2);border-top:1px solid var(--rule);padding:36px 0 28px;color:var(--ink-2);font-size:.92rem}
.site-footer .cols{display:grid;gap:22px}
@media (min-width:640px){.site-footer .cols{grid-template-columns:1.4fr 1fr 1fr}}
.site-footer h2{font:600 .72rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin:0 0 10px}
.site-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.site-footer a{color:var(--ink-2);text-decoration:none}
.site-footer a:hover{color:var(--wine)}
.site-footer .legal{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:26px;padding-top:16px;border-top:1px solid var(--rule);font-size:.82rem;color:var(--ink-3)}
.site-footer .legal a{color:var(--ink-3)}

/* planner page */
.plan-head{padding:26px 0 12px}
.plan-head h1{font-size:clamp(1.8rem,6vw,2.6rem);margin:12px 0 6px}
.plan-nav{position:sticky;top:64px;z-index:15;background:rgba(250,246,241,.95);backdrop-filter:blur(8px);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.plan-nav .wrap{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;padding-left:10px}
.plan-nav .wrap::-webkit-scrollbar{display:none}
.plan-nav a{flex:none;padding:14px 12px;font:600 .82rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);text-decoration:none;border-bottom:2px solid transparent;min-height:44px;display:inline-flex;align-items:center}
.plan-nav a.on,.plan-nav a:hover{color:var(--wine);border-bottom-color:var(--wine)}
.plan-sec{padding:36px 0 20px;scroll-margin-top:120px}
.plan-sec+.plan-sec{border-top:1px solid var(--rule)}
.plan-sec h2{font-size:clamp(1.5rem,5vw,2rem)}
.plan-sec .sub{color:var(--ink-2);margin:0 0 20px;max-width:40em}
.two{display:grid;gap:22px}
@media (min-width:900px){.two{grid-template-columns:1fr 1fr;align-items:start}}

/* ledger lines (budget) */
.ledger{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.ledger th{text-align:left;font:600 .7rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding:0 0 10px;border-bottom:1px solid var(--rule-2)}
.ledger th:last-child,.ledger td:last-child{text-align:right}
.ledger td{padding:9px 0;border-bottom:1px dotted var(--rule-2);vertical-align:middle}
.ledger td input{width:7.2rem;max-width:100%;text-align:right;border:0;border-bottom:1.5px solid var(--rule-2);background:transparent;font:400 1.05rem/1.2 var(--serif);color:var(--ink);padding:6px 4px;min-height:40px}
.ledger td input:focus{outline:none;border-bottom-color:var(--wine)}
.ledger td .paid{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;color:var(--ink-3);margin-left:8px;cursor:pointer}
.ledger td .paid input{width:18px;height:18px;min-height:0;accent-color:var(--sage);border:0}
.ledger tfoot td{font-family:var(--serif);font-size:1.3rem;border:0;padding-top:14px}
.ledger .muted{color:var(--ink-3);font-size:.85rem}
.bar{height:10px;background:var(--rule);border-radius:999px;overflow:hidden;margin:12px 0 6px}
.bar i{display:block;height:100%;background:var(--sage);transition:width .5s var(--ease)}
.bar i.over{background:var(--no)}
.ref{font-size:.85rem;color:var(--ink-3)}

/* guests */
.addrow{display:grid;grid-template-columns:1fr auto;gap:8px;margin:0 0 14px}
.addrow .field{margin:0}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px;padding:0}
.chips>.chip{display:inline-flex;align-items:center}
.chip{border:1px solid var(--rule-2);background:#fff;border-radius:999px;padding:7px 12px;font:500 .82rem/1 var(--sans);color:var(--ink-2);cursor:pointer;min-height:36px}
.chip[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.rsvp-sum{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin:0 0 16px}
.rsvp-sum div{background:#fff;padding:12px 10px;text-align:center}
.rsvp-sum b{display:block;font:400 1.6rem/1 var(--serif)}
.rsvp-sum small{font:500 .68rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.guests{list-style:none;padding:0;margin:0}
.guests li{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:9px 0;border-bottom:1px dotted var(--rule-2)}
.guests .gname{font-family:var(--serif);font-size:1.08rem}
.guests .ggroup{display:block;font-size:.75rem;color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase}
.guests select{min-height:38px;border:1px solid var(--rule-2);border-radius:999px;background:#fff;font:500 .8rem var(--sans);color:var(--ink-2);padding:6px 10px}
.guests select.si{border-color:var(--sage);color:var(--ok);background:var(--sage-soft)}
.guests select.no{border-color:var(--rule-2);color:var(--ink-3);text-decoration:line-through}
.guests .del{border:0;background:none;color:var(--ink-3);font-size:1.2rem;min-width:36px;min-height:36px;cursor:pointer;border-radius:50%}
.guests .del:hover{background:var(--wine-soft);color:var(--wine)}
.empty{border:1px dashed var(--rule-2);border-radius:var(--radius);padding:22px;text-align:center;color:var(--ink-3);font-family:var(--serif);font-style:italic}

/* tables */
.tables{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.table{background:#fff;border:1px solid var(--rule);border-radius:50% 50% 50% 50% / 46% 46% 46% 46%;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px;text-align:center;position:relative}
.table.full{border-color:var(--sage)}
.table.over{border-color:var(--no)}
.table b{font:400 1.5rem/1 var(--serif);display:block}
.table small{font:500 .68rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin:4px 0 8px;display:block}
.table ul{list-style:none;padding:0;margin:0;font-size:.78rem;color:var(--ink-2);line-height:1.35;max-height:5.5em;overflow:hidden}
.table .more{color:var(--wine);font-size:.75rem}
.seat-ctl{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:0 0 18px}
.seat-ctl .field{margin:0;min-width:120px}
.unseated{margin:16px 0 0;font-size:.9rem;color:var(--ink-2)}

/* tasks */
.months{display:grid;gap:10px}
.month{background:#fff;border:1px solid var(--rule);border-radius:var(--radius);padding:14px 16px}
.month.now{border-color:var(--wine);box-shadow:inset 3px 0 0 var(--wine)}
.month.past{opacity:.75}
.month h3{display:flex;justify-content:space-between;align-items:baseline;font-size:1.1rem;margin:0 0 8px}
.month h3 small{font:500 .7rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.month.now h3 small{color:var(--wine)}
.month ul{list-style:none;padding:0;margin:0}
.month li label{display:flex;gap:12px;align-items:flex-start;padding:7px 0;cursor:pointer;line-height:1.4}
.month li input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--sage)}
.month li input:checked+span{color:var(--ink-3);text-decoration:line-through}
.progress{display:flex;align-items:center;gap:12px;margin:0 0 18px;font-family:var(--serif);font-size:1.1rem}
.progress .bar{flex:1;margin:0}

/* day timeline */
.timeline{list-style:none;padding:0;margin:0}
.timeline li{display:grid;grid-template-columns:4.4rem 1fr;gap:12px;padding:10px 0;border-bottom:1px dotted var(--rule-2);align-items:baseline}
.timeline time{font:400 1.25rem/1 var(--serif);color:var(--wine);font-variant-numeric:tabular-nums}
.timeline li.key time{color:var(--ink)}
.timeline li.key span{font-weight:600}

/* sticky share bar on the planner (thumb reach) */
.plan-bar{position:sticky;bottom:0;z-index:14;background:rgba(250,246,241,.96);border-top:1px solid var(--rule);padding:10px 0}
.plan-bar .wrap{display:flex;gap:8px;flex-wrap:wrap}
.plan-bar .btn{flex:1 1 auto}
.plan-bar #share{flex-basis:100%}
@media (min-width:640px){.plan-bar .btn,.plan-bar #share{flex:none}}
.toast{position:fixed;left:50%;bottom:84px;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:12px 18px;border-radius:999px;font-size:.9rem;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s var(--ease);z-index:30;max-width:calc(100vw - 32px)}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* reveals */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}*{transition:none!important;animation:none!important}}

/* print: the plan as a clean printed sheet */
@media print{
  .site-header,.plan-nav,.plan-bar,.toast,.site-footer,.no-print,.addrow,.seat-ctl,.chips,.del,.hint{display:none!important}
  body{background:#fff;color:#000;font-size:11pt}
  .plan-sec{padding:14pt 0;break-inside:avoid;scroll-margin:0}
  .dateline{border-color:#000}
  .sheet::before{display:none}
  .table{border-radius:0}
  a{color:#000;text-decoration:none}
}

.site-footer .brand{color:var(--ink)}
/* subpages (24 Oct): the kit page-head on this site's paper, and every left edge on the header's line */
.page-head{background:transparent;border-bottom:1px solid var(--rule)}
.page-head::before,.page-head::after{display:none}
main:has(>.page-head) .wrap.narrow,main.section>.wrap.narrow{max-width:1120px}
main:has(>.page-head) .wrap.narrow>*,main.section>.wrap.narrow>*{max-width:712px}
main:has(>.page-head) .wrap.narrow.center,main.section>.wrap.narrow.center{max-width:760px}
main:has(>.page-head) .wrap.narrow.center>*,main.section>.wrap.narrow.center>*{margin-inline:auto}
.center .actions,.actions.center{justify-content:center}
