/* ---------- Design tokens — butter · gold · coral · cherry · sage --- */
  :root{
    --paper:     #FFFCF5;  /* soft ivory, near-white              */
    --paper-2:   #FFFFFF;  /* cards                               */
    --ink:       #54473E;  /* warm soft charcoal                  */
    --ink-soft:  #8E7E71;  /* secondary text                      */

    --butter:    #F7DE90;  /* Whipped Butter                      */
    --gold:      #FFC907;  /* Gold Dust                           */
    --coral:     #FA6653;  /* Coral — primary accent              */
    --coral-2:   #FF8270;
    --cherry:    #c42b34;  /* Cherry Red                          */
    --sage:      #8FAE7E;  /* the green, kept light               */
    --sage-d:    #9e982b;  /* deeper green for text               */

    /* component aliases */
    --pink:      #DE232E;  /* cherry, used for secondary accents  */
    --pink-soft: #FFF3E0;  /* butter tint (section wash)          */
    --green:     #8FAE7E;
    --green-2:   #5F8558;
    --mint:      #F2F7EC;  /* sage tint (section wash)            */
    --yellow:    #FCAD40;
    --rust:      #E2683F;

    --maxw: 1080px;
    --display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
    --script: "Petit Formal Script", "Snell Roundhand", cursive;
    --body: "Karla", system-ui, -apple-system, sans-serif;
    --ease: cubic-bezier(.22,.61,.36,1);
    --line: rgba(107,74,52,.20);
  }

  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{
    margin:0; background:var(--paper); color:var(--ink);
    font-family:var(--body); font-size:17px; line-height:1.65;
    -webkit-font-smoothing:antialiased; overflow-x:hidden;
  }
  /* soft garden glow behind everything */
  body::before{
    content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
    background:
      radial-gradient(900px 480px at 84% -8%, rgba(242,100,58,.12), transparent 60%),
      radial-gradient(820px 460px at -8% 18%, rgba(233,85,142,.10), transparent 60%),
      radial-gradient(900px 520px at 50% 116%, rgba(111,165,60,.12), transparent 60%);
  }
  .wrap{ max-width:var(--maxw); margin:0 auto; padding:0 24px; position:relative; z-index:1; }

  h1,h2,h3{ font-family:var(--display); font-weight:500; line-height:1.05; margin:0; }
  a{ color:inherit; }
  .eyebrow{
    font-family:var(--body); font-size:.72rem; letter-spacing:.3em; text-transform:uppercase;
    color:var(--coral); font-weight:700; margin:0 0 .9rem;
  }

  /* ---------- Top bar / nav ------------------------------------------- */
  header.bar{
    position:sticky; top:0; z-index:40;
    background:color-mix(in srgb, var(--paper) 88%, transparent);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  .bar-inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 24px; max-width:var(--maxw); margin:0 auto; }
  .monogram{ font-family:var(--display); font-size:1.2rem; letter-spacing:.04em; font-style:italic; }
  .monogram .s{ color:var(--coral); } .monogram .j{ color:var(--pink); } .monogram .amp{ color:var(--green); font-style:normal; }
  nav.links{ display:flex; gap:20px; }
  nav.links a{
    font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; text-decoration:none;
    color:var(--ink-soft); position:relative; padding:4px 0; transition:color .25s;
  }
  nav.links a::after{ content:""; position:absolute; left:0; bottom:-2px; height:2px; width:0; background:var(--coral); transition:width .3s var(--ease); }
  nav.links a:hover{ color:var(--ink); } nav.links a:hover::after{ width:100%; }
  @media(max-width:960px){ nav.links{ display:none; } }

  .lang{ display:inline-flex; border:1.5px solid var(--coral); border-radius:999px; overflow:hidden; }
  .lang button{
    background:transparent; border:0; color:var(--coral); font-family:var(--body);
    font-size:.74rem; letter-spacing:.08em; font-weight:700; padding:7px 13px; cursor:pointer; transition:.2s;
  }
  .lang button[aria-pressed="true"]{ background:var(--coral); color:#fff; }

  /* ---------- Hero ---------------------------------------------------- */
  .hero{ position:relative; text-align:center; padding:64px 24px 30px; overflow:hidden; }
  /* soft garden arch behind the names */
  .hero .inner{ position:relative; z-index:2; }

  .hero .place{ font-size:.78rem; letter-spacing:.3em; text-transform:uppercase; color:var(--green-2); font-weight:700; }
  .names{ margin:16px 0 4px; }
  .names .nm{ font-size:clamp(2.8rem,9vw,6rem); font-style:italic; line-height:.95; }
  .names .nm.s{ color:var(--coral); } .names .nm.j{ color:var(--pink); }
  .names .amp{ display:block; font-size:clamp(1.4rem,4vw,2.2rem); color:var(--green); font-style:normal; margin:2px 0; }
  .hero .date{ font-size:1.05rem; letter-spacing:.05em; color:var(--ink-soft); margin-top:8px; }
  .hero .tag{ font-family:var(--display); font-style:italic; font-size:1.25rem; color:var(--ink); margin-top:16px; }

  .cta-row{ margin-top:24px; display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
  .btn{
    display:inline-block; font-family:var(--body); font-weight:700; letter-spacing:.05em;
    text-decoration:none; cursor:pointer; border:0; font-size:.92rem;
    padding:14px 30px; border-radius:999px; transition:transform .2s var(--ease), box-shadow .2s, background .2s, color .2s;
  }
  .btn-primary{ background:var(--coral); color:#fff; box-shadow:0 12px 26px -12px rgba(242,100,58,.7); }
  .btn-primary:hover{ transform:translateY(-2px); background:var(--coral-2); }
  .btn-ghost{ background:transparent; color:var(--green-2); border:1.5px solid var(--green); }
  .btn-ghost:hover{ transform:translateY(-2px); background:var(--mint); }


  /* ---------- Section scaffolding ------------------------------------ */
  section.block{ padding:74px 0; position:relative; }
  .tint-blush{ background:linear-gradient(var(--pink-soft),transparent); }
  .tint-mint{ background:linear-gradient(var(--mint),transparent); }
  .tint-mint-up{ background:linear-gradient(transparent,var(--mint)); }
  .section-head{ text-align:center; max-width:640px; margin:0 auto 30px; }
  .section-head h2{ font-size:clamp(2rem,5vw,3rem); }
  .section-head p{ color:var(--ink-soft); margin:12px 0 0; }
  .garland{ display:block; margin:14px auto 30px; }

  /* Story */
  .story{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
  @media(max-width:760px){ .story{ grid-template-columns:1fr; } }
  .story .card{ border-radius:20px; padding:30px; border:1.5px solid var(--line); }
  .story .card.a{ background:linear-gradient(160deg,#FFF1E8,#FFFDF8); }
  .story .card.b{ background:linear-gradient(160deg,var(--pink-soft),#FFFDF8); }
  .story .card h3{ font-size:1.5rem; margin-bottom:10px; font-style:italic; }
  .story .card.a h3{ color:var(--coral); } .story .card.b h3{ color:var(--pink); }
  .story .card .from{ font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--green-2); font-weight:700; margin-bottom:14px; }

  /* Schedule timeline */
  .timeline{ max-width:760px; margin:0 auto; position:relative; }
  .timeline::before{ content:""; position:absolute; left:18px; top:8px; bottom:8px; width:3px; border-radius:3px; background:linear-gradient(var(--coral),var(--pink),var(--green)); }
  @media(max-width:560px){ .timeline::before{ left:14px; } }
  .event{ position:relative; padding:0 0 36px 56px; }
  .event:last-child{ padding-bottom:0; }
  .event .dot{ position:absolute; left:9px; top:4px; width:20px; height:20px; border-radius:50%; background:var(--paper-2); border:3px solid var(--coral); }
  @media(max-width:560px){ .event{ padding-left:48px; } .event .dot{ left:5px; } }
  .event .when{ font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--green-2); font-weight:700; }
  .event h3{ font-size:1.5rem; margin:5px 0 4px; font-style:italic; color:var(--pink); }
  .event .where{ color:var(--ink); font-size:.95rem; font-weight:500; }
  .event .desc{ color:var(--ink-soft); margin-top:6px; font-size:.95rem; }

  /* Travel / map */
  .travel{ display:grid; grid-template-columns:1.05fr .95fr; gap:34px; align-items:center; }
  @media(max-width:820px){ .travel{ grid-template-columns:1fr; } }
  .map-frame{ border-radius:20px; overflow:hidden; border:1.5px solid var(--line); box-shadow:0 26px 50px -30px rgba(58,42,34,.5); }
  .map-frame iframe{ display:block; width:100%; height:360px; border:0; }
  .travel-list{ list-style:none; padding:0; margin:0; display:grid; gap:18px; }
  .travel-list li{ padding-left:18px; border-left:3px solid var(--green); }
  .travel-list li h3{ font-size:1.2rem; color:var(--coral); margin-bottom:4px; }
  .travel-list li p{ margin:0; color:var(--ink-soft); font-size:.95rem; }

  /* Things to do */
  .poi-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; }
  .poi{ background:var(--paper-2); border:1.5px solid var(--line); border-radius:18px; padding:24px; transition:transform .25s var(--ease), border-color .25s, box-shadow .25s; }
  .poi:hover{ transform:translateY(-4px); border-color:var(--coral); box-shadow:0 18px 30px -22px rgba(242,100,58,.7); }
  .poi .kicker{ font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--pink); font-weight:700; }
  .poi h3{ font-size:1.25rem; margin:8px 0 8px; font-style:italic; }
  .poi p{ margin:0; color:var(--ink-soft); font-size:.92rem; }

  /* FAQ */
  .faq{ max-width:780px; margin:0 auto; }
  .qa{ border-bottom:1.5px solid var(--line); }
  .qa button{
    width:100%; text-align:left; background:transparent; border:0; color:var(--ink); cursor:pointer;
    font-family:var(--display); font-size:1.18rem; padding:22px 40px 22px 0; position:relative;
  }
  .qa button::after{ content:"+"; position:absolute; right:6px; top:50%; transform:translateY(-50%); color:var(--coral); font-family:var(--body); font-size:1.6rem; transition:transform .3s; }
  .qa.open button::after{ transform:translateY(-50%) rotate(45deg); }
  .qa .ans{ max-height:0; overflow:hidden; transition:max-height .35s var(--ease); }
  .qa .ans p{ margin:0 0 22px; color:var(--ink-soft); }

  /* ---------- RSVP ---------------------------------------------------- */
  .rsvp-shell{ max-width:680px; margin:0 auto; background:var(--paper-2); border:1.5px solid var(--line); border-radius:24px; padding:40px; box-shadow:0 30px 60px -40px rgba(58,42,34,.5); }
  @media(max-width:560px){ .rsvp-shell{ padding:26px; } }
  .field{ margin-bottom:20px; }
  .field label{ display:block; font-size:.76rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); font-weight:700; margin-bottom:8px; }
  .input, select.input, textarea.input{
    width:100%; background:var(--paper); color:var(--ink); border:1.5px solid var(--line);
    border-radius:12px; padding:13px 15px; font-family:var(--body); font-size:1rem; transition:border-color .2s, box-shadow .2s;
  }
  .input:focus, select.input:focus, textarea.input:focus{ outline:0; border-color:var(--coral); box-shadow:0 0 0 3px rgba(242,100,58,.18); }
  textarea.input{ resize:vertical; min-height:84px; }
  .seg{ display:flex; gap:12px; }
  .seg label{ flex:1; margin:0; }
  .seg input{ position:absolute; opacity:0; }
  .seg .pill{
    display:flex; align-items:center; justify-content:center; padding:14px; border-radius:12px;
    border:1.5px solid var(--line); cursor:pointer; transition:.2s; font-weight:700; color:var(--ink-soft);
  }
  .seg input:checked + .pill{ border-color:var(--coral); background:#FFF1E8; color:var(--coral); }
  .seg input:focus-visible + .pill{ box-shadow:0 0 0 3px rgba(242,100,58,.25); }

  .guests{ display:grid; gap:14px; }
  .guest-row{ background:var(--paper); border:1.5px solid var(--line); border-radius:14px; padding:16px; }
  .guest-row .gr-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  @media(max-width:520px){ .guest-row .gr-grid{ grid-template-columns:1fr; } }
  .mini-label{ font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); font-weight:700; margin-bottom:6px; display:block; }
  .attending-only{ transition:opacity .3s, max-height .3s; }
  .rsvp-msg{ margin-top:18px; padding:14px 16px; border-radius:12px; font-size:.94rem; display:none; }
  .rsvp-msg.ok{ display:block; background:var(--mint); border:1.5px solid var(--green); color:var(--green-2); }
  .rsvp-msg.err{ display:block; background:var(--pink-soft); border:1.5px solid var(--pink); color:#a82a5c; }

  /* ---------- Footer + admin ------------------------------------------ */
  footer.foot{ text-align:center; padding:58px 24px 40px; border-top:1.5px solid var(--line); margin-top:10px; }
  footer .mono{ font-family:var(--display); font-style:italic; font-size:1.9rem; }
  footer .mono .s{ color:var(--coral); } footer .mono .j{ color:var(--pink); } footer .mono .amp{ color:var(--green); }
  footer .small{ color:var(--ink-soft); font-size:.84rem; margin-top:12px; }
  .admin-link{ background:none; border:0; color:var(--ink-soft); opacity:.7; cursor:pointer; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; margin-top:18px; }
  .admin-link:hover{ color:var(--coral); opacity:1; }

  .modal{ position:fixed; inset:0; z-index:90; display:none; align-items:flex-start; justify-content:center; padding:40px 18px; background:rgba(58,42,34,.45); backdrop-filter:blur(4px); overflow:auto; }
  .modal.show{ display:flex; }
  .panel{ background:var(--paper-2); border:1.5px solid var(--line); border-radius:22px; padding:30px; width:100%; max-width:860px; box-shadow:0 40px 80px -30px rgba(58,42,34,.6); }
  .panel h3{ font-size:1.6rem; margin-bottom:6px; font-style:italic; color:var(--coral); }
  .panel .x{ float:right; background:none; border:0; color:var(--ink-soft); font-size:1.7rem; cursor:pointer; line-height:1; }
  .stats{ display:flex; gap:14px; flex-wrap:wrap; margin:18px 0 22px; }
  .stat{ background:var(--paper); border:1.5px solid var(--line); border-radius:14px; padding:14px 18px; }
  .stat b{ display:block; font-family:var(--display); font-size:1.8rem; color:var(--coral); }
  .stat span{ font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); }
  table.resp{ width:100%; border-collapse:collapse; font-size:.86rem; }
  table.resp th, table.resp td{ text-align:left; padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top; }
  table.resp th{ color:var(--green-2); text-transform:uppercase; font-size:.64rem; letter-spacing:.1em; }
  .pill-yes{ color:var(--green-2); font-weight:700; } .pill-no{ color:var(--pink); font-weight:700; }

  /* ---------- Gallery ------------------------------------------------- */
  .gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:150px; gap:14px; }
  @media(max-width:820px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); } }
  .gtile{ position:relative; border-radius:18px; overflow:hidden; cursor:pointer; border:1.5px solid var(--line);
    display:flex; align-items:center; justify-content:center; text-align:center; transition:transform .25s var(--ease), box-shadow .25s; }
  .gtile:hover{ transform:translateY(-3px); box-shadow:0 18px 34px -22px rgba(58,42,34,.6); }
  .gtile.wide{ grid-column:span 2; } .gtile.tall{ grid-row:span 2; }
  .gtile img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .gtile .ph{ padding:16px; }
  .gtile .ph .lab{ font-family:var(--display); font-style:italic; font-size:1.1rem; color:#fff; text-shadow:0 1px 6px rgba(0,0,0,.25); }
  .gtile .ph .hint{ font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.85); margin-top:6px; }
  .gtile .leaf{ position:absolute; inset:0; opacity:.5; pointer-events:none; }

  .lightbox{ position:fixed; inset:0; z-index:95; display:none; align-items:center; justify-content:center; padding:30px;
    background:rgba(58,42,34,.7); backdrop-filter:blur(6px); }
  .lightbox.show{ display:flex; }
  .lightbox .lb-card{ max-width:860px; width:100%; border-radius:20px; overflow:hidden; background:var(--paper-2);
    box-shadow:0 40px 90px -30px rgba(0,0,0,.6); }
  .lightbox .lb-visual{ height:min(60vh,520px); display:flex; align-items:center; justify-content:center; position:relative; }
  .lightbox .lb-visual img{ width:100%; height:100%; object-fit:cover; }
  .lightbox .lb-cap{ padding:16px 22px; font-family:var(--display); font-style:italic; font-size:1.15rem; color:var(--ink); }
  .lightbox .lb-x{ position:absolute; top:18px; right:22px; background:rgba(0,0,0,.35); color:#fff; border:0; width:40px; height:40px;
    border-radius:50%; font-size:1.4rem; cursor:pointer; z-index:2; }

  /* ---------- RSVP invitation lookup ---------------------------------- */
  .lookup{ display:flex; gap:12px; }
  @media(max-width:520px){ .lookup{ flex-direction:column; } }
  .lookup .input{ flex:1; }
  .choices{ display:grid; gap:10px; margin-top:16px; }
  .choice{ text-align:left; background:var(--paper); border:1.5px solid var(--line); border-radius:12px; padding:14px 16px; cursor:pointer; font-family:var(--body); transition:.2s; }
  .choice:hover{ border-color:var(--coral); }
  .choice b{ display:block; } .choice span{ font-size:.82rem; color:var(--ink-soft); }
  .party-head{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:6px; flex-wrap:wrap; }
  .party-head h3{ font-family:var(--display); font-style:italic; font-size:1.4rem; color:var(--coral); }
  .party-head .change{ background:none; border:0; color:var(--green-2); font-weight:700; cursor:pointer; font-size:.84rem; }
  .invitee{ background:var(--paper); border:1.5px solid var(--line); border-radius:14px; padding:16px; margin-top:12px; }
  .invitee .nm{ font-weight:700; font-size:1.05rem; margin-bottom:10px; }
  .att{ display:flex; gap:10px; margin-bottom:12px; }
  .att label{ flex:1; margin:0; position:relative; }
  .att input{ position:absolute; opacity:0; }
  .att .pill{ display:flex; align-items:center; justify-content:center; padding:11px; border-radius:10px; border:1.5px solid var(--line); cursor:pointer; font-weight:700; font-size:.9rem; color:var(--ink-soft); transition:.2s; }
  .att .yes input:checked + .pill{ border-color:var(--green); background:var(--mint); color:var(--green-2); }
  .att .no input:checked + .pill{ border-color:var(--pink); background:var(--pink-soft); color:#a82a5c; }
  .att input:focus-visible + .pill{ box-shadow:0 0 0 3px rgba(242,100,58,.22); }
  .meal-row{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
  @media(max-width:520px){ .meal-row{ grid-template-columns:1fr; } }
  .meal-row.hide{ display:none; }

  /* =====================================================================
     v4 — invitation styling: arch, letterpress caps, folk-art decorations
     ===================================================================== */
  .hero{ background:linear-gradient(180deg,#FFF3DC 0%,#FFF9EC 46%,var(--paper) 100%);
         padding:56px 20px 64px; text-align:center; overflow:visible; }
  .arch-wrap{ --cardw: min(700px, calc(100vw - 40px)); max-width:700px; margin:0 auto; }
  .arch-card{
    position:relative; background:var(--paper-2);
    /* oversized radii scale down proportionally -> a true semicircular arch at any width */
    border-radius:350px 350px 20px 20px;
    padding: calc(.36 * var(--cardw)) 40px calc(.20 * var(--cardw));
    overflow:hidden;
    box-shadow:0 46px 90px -46px rgba(0,0,0,.55);
  }

  .deco{ position:absolute; inset:0; pointer-events:none; }
  .deco > span{ position:absolute; display:block; }
  .deco svg, .deco img{ width:100%; height:auto; display:block; }
  /* placements verified against the arch curve and the centred text column */
  .d-sun{ top:2%; left:50%; transform:translateX(-50%); width:20%; }
  .d-swallow{ top:16%; left:14%; width:16%; }
  .d-seagull{ top:15%; right:15%; width:15%; }
  .d-lemon{ top:38%; left:3%; width:12%; }
  .d-pom{ top:38%; right:3%; width:12%; }
  .d-fish{ top:52%; left:2%; width:15%; }
  .d-lobster{ top:50%; right:3%; width:9%; }
  .d-tree{ bottom:3%; left:4%; width:17%; }
  .d-moon{ bottom:4%; left:45%; width:10%; }
  .d-sailboat{ bottom:3%; right:5%; width:15%; }
  @media(max-width:700px){
    .d-fish,.d-lobster{ display:none; }
    .d-sun{ width:24%; }
    .d-swallow,.d-seagull{ width:18%; }
  }

  .divider-motif{ display:flex; align-items:center; justify-content:center; gap:14px;
    width:210px; margin:12px auto 28px; }
  .divider-motif .rule{ flex:1; height:1px; background:var(--line); }
  .divider-motif img{ width:34px; height:auto; display:block; }

  .arch-content{ position:relative; z-index:2; max-width:min(400px,100%); margin:0 auto; }
  .invite-line, .invite-sub, .venue, .date-block{
    font-family:var(--display); text-transform:uppercase; color:var(--ink);
    letter-spacing:.2em; line-height:1.7;
  }
  .invite-line{ font-size:.82rem; letter-spacing:.28em; color:var(--ink-soft); }
  .names{ margin:14px 0 18px; }
  .names .nm{
    font-family:var(--display); font-style:normal; text-transform:uppercase;
    font-size:clamp(1.5rem,4.6vw,2.3rem); letter-spacing:.09em; line-height:1.15;
    color:var(--ink); font-weight:500; display:block;
  }
  .names .amp{ display:block; font-size:clamp(1.2rem,3vw,1.7rem); color:var(--coral); margin:0; font-family:var(--display); }
  @media(min-width:620px){
    .names{ display:flex; align-items:baseline; justify-content:center; gap:16px; flex-wrap:wrap; }
    .names .nm{ display:inline-block; }
    .names .amp{ display:inline-block; }
  }
  .invite-sub{ font-size:.8rem; letter-spacing:.18em; color:var(--ink-soft); max-width:26ch; margin:0 auto; }
  .date-block{ margin-top:22px; font-size:.86rem; }
  .date-block span{ display:block; }
  .venue{ margin-top:18px; font-size:.8rem; color:var(--ink-soft); }
  .script-line{ font-family:var(--script); font-size:1.5rem; color:var(--coral); margin-top:20px; }

  .hero .cta-row{ margin-top:34px; }
  .hero .btn-ghost{ color:var(--sage-d); border-color:var(--sage); }
  .hero .btn-ghost:hover{ background:var(--mint); }

  /* ---------- Countdown page (its own screen, over a photo) ----------- */
  .cd-page{
    position:relative; min-height:92vh; display:flex; align-items:center; justify-content:center;
    text-align:center; background-size:cover; background-position:center; background-color:#3a3128;
  }
  @media(min-width:900px){ .cd-page{ background-attachment:fixed; } }
  .cd-page::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(44,34,26,.46), rgba(44,34,26,.58));
  }
  .cd-inner{ position:relative; z-index:2; width:100%; padding:70px 20px; }
  .cd-title{
    font-family:"Oswald",var(--body); text-transform:uppercase; color:#fff; font-weight:600;
    font-size:clamp(1.3rem,4.2vw,2.8rem); letter-spacing:.04em; line-height:1.15;
    display:flex; gap:.34em; justify-content:center; align-items:baseline; flex-wrap:wrap;
  }
  .cd-script{
    font-family:"Kaushan Script",cursive; text-transform:none; color:var(--coral);
    font-size:1.2em; letter-spacing:0; font-weight:400;
  }
  .cd-clock{ display:flex; align-items:flex-start; justify-content:center;
    gap:clamp(4px,1.4vw,18px); margin-top:clamp(26px,4vw,44px); }
  .cd-unit{ display:flex; flex-direction:column; align-items:center; }
  .cd-unit .n{ font-family:"Oswald",var(--body); font-weight:300; color:#fff;
    font-size:clamp(1.9rem,7.6vw,5rem); line-height:1; font-variant-numeric:tabular-nums; }
  .cd-unit .l{ font-family:"Oswald",var(--body); color:rgba(255,255,255,.88); text-transform:uppercase;
    letter-spacing:.12em; font-size:clamp(.5rem,1.45vw,.8rem); margin-top:clamp(8px,1.4vw,14px); }
  .cd-sep{ font-family:"Oswald",var(--body); font-weight:300; color:rgba(255,255,255,.7);
    font-size:clamp(1.5rem,5.6vw,3.6rem); line-height:1.05; }
  .cd-credit{ position:absolute; right:14px; bottom:12px; z-index:2; font-size:.6rem;
    letter-spacing:.08em; color:rgba(255,255,255,.55); }
  .cd-credit a{ color:inherit; text-decoration:underline; }

  /* letterpress headings across the page */
  .section-head h2{
    text-transform:uppercase; letter-spacing:.15em; font-weight:500;
    font-size:clamp(1.5rem,3.6vw,2.3rem);
  }
  .story .card h3, .event h3, .poi h3, .party-head h3, .panel h3, .gtile .lab{ font-style:normal; }
  .story .card h3, .event h3, .poi h3{ text-transform:uppercase; letter-spacing:.1em; font-size:1.15rem; }
  .qa button{ font-size:1.05rem; letter-spacing:.04em; }
  footer .mono{ font-style:normal; text-transform:uppercase; letter-spacing:.18em; font-size:1.2rem; }
  footer .mono .s, footer .mono .j{ color:var(--ink); }
  footer .mono .amp{ color:var(--coral); }
  .monogram{ font-style:normal; letter-spacing:.14em; }
  .monogram .s{ color:var(--ink); } .monogram .j{ color:var(--ink); } .monogram .amp{ color:var(--coral); }
  .eyebrow{ color:var(--coral); }

  /* arched gallery tiles, like little chapel windows */
  .gtile{ border-radius:150px 150px 14px 14px; }
  .gtile.wide{ border-radius:110px 110px 14px 14px; }
  .divider-motif{ display:block; margin:10px auto 26px; width:170px; height:auto; }

  /* timeline in invitation colors */
  .timeline::before{ background:linear-gradient(var(--coral),var(--yellow),var(--green)); }
  .event .dot{ border-color:var(--coral); }

  /* ---------- Reveal animations --------------------------------------- */
  .reveal{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
  .reveal.in{ opacity:1; transform:none; }
  .draw{ stroke-dasharray:1; stroke-dashoffset:1; }
  .draw.in{ animation:draw 2.4s var(--ease) forwards; }
  @keyframes draw{ to{ stroke-dashoffset:0; } }

  @media (prefers-reduced-motion: reduce){
    *{ scroll-behavior:auto !important; }
    .reveal{ opacity:1 !important; transform:none !important; transition:none; }
    .draw{ stroke-dashoffset:0 !important; animation:none !important; }
  }