
:root{
  --granite:#26292D;
  --granite-2:#3A3E43;
  --stone:#EEEFEC;
  --stone-2:#E2E4E0;
  --steel:#C7CBCF;
  --patina:#7A4152;
  --patina-lt:#A35D72;
  --brass:#A9874F;
  --ink:#26292D;
  --ink-soft:#5A5F64;
  --bg:#F6F6F3;
  --surface:#FFFFFF;
  --line:#D6D8D4;
  --display:"Marcellus", "Trajan Pro", Georgia, serif;
  --body:"Source Sans 3", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --measure:38rem;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#E9EAE7; --ink-soft:#A9AEB2; --bg:#1E2124; --surface:#272A2E; --line:#3A3E43;
    --stone:#24272A; --stone-2:#2C3034; --patina-lt:#D49AAB;
  }
}
:root[data-theme="dark"]{
  --ink:#E9EAE7; --ink-soft:#A9AEB2; --bg:#1E2124; --surface:#272A2E; --line:#3A3E43;
  --stone:#24272A; --stone-2:#2C3034; --patina-lt:#D49AAB;
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 84px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.6 var(--body);}
img,svg{max-width:100%}
a{color:var(--patina-lt)}
:focus-visible{outline:3px solid var(--brass);outline-offset:3px;border-radius:2px}
.wrap{width:min(1120px,100% - 2.5rem);margin-inline:auto}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.12;letter-spacing:.01em;margin:0 0 .6em}
h1{font-size:clamp(2.3rem,5.4vw,4rem)}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem)}
h3{font-size:1.3rem}
p{margin:0 0 1em;max-width:var(--measure)}
.lede{font-size:1.2rem;color:var(--ink-soft)}

/* header */
.top{display:flex;align-items:center;justify-content:space-between;padding:.8rem 0;position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--bg);box-shadow:0 0 0 100vmax var(--bg),0 1px 0 100vmax var(--line);clip-path:inset(0 -100vmax -1px)}
.brand{display:flex;align-items:center;gap:.6rem;font-family:var(--display);font-size:1.3rem;color:var(--ink);text-decoration:none}
.brand svg{width:28px;height:28px}
.top nav{display:flex;gap:1.4rem;align-items:center}
.top nav a{color:var(--ink);text-decoration:none;font-weight:600;font-size:.98rem}
.top nav a:hover{color:var(--patina-lt)}
@media (max-width:720px){.top nav a:not(.btn){display:none}}

.btn{display:inline-block;font:600 1rem/1 var(--body);padding:.95rem 1.4rem;border-radius:6px;text-decoration:none;border:2px solid transparent;cursor:pointer}
.btn-primary{background:var(--patina);color:#F3F5F3}
.btn-primary:hover{background:#5E3140}
.btn-quiet{border-color:var(--line);color:var(--ink);background:transparent}
.btn-quiet:hover{border-color:var(--ink-soft)}
.btn-sm{padding:.6rem 1rem;font-size:.92rem}

/* hero */
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:3.5rem;align-items:center;padding:3rem 0 5rem}
@media (max-width:900px){.hero{grid-template-columns:1fr;gap:2.5rem;padding-top:1.5rem}}
.hero .actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.8rem}

/* the plaque — the one memorable thing */
.stage{background:radial-gradient(120% 90% at 30% 20%,#4A4F55 0%,var(--granite) 55%,#1C1F22 100%);border-radius:14px;padding:clamp(1.6rem,4vw,3rem);position:relative;overflow:hidden}
.stage::after{content:"";position:absolute;inset:0;background:
  radial-gradient(1px 1px at 12% 30%,rgba(255,255,255,.18),transparent 60%),
  radial-gradient(1px 1px at 72% 64%,rgba(255,255,255,.14),transparent 60%),
  radial-gradient(1px 1px at 40% 82%,rgba(255,255,255,.12),transparent 60%),
  radial-gradient(1px 1px at 88% 18%,rgba(255,255,255,.16),transparent 60%);pointer-events:none}
.plaque{width:min(260px,70%);aspect-ratio:1;margin:0 auto;border-radius:12px;padding:9%;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.07) 0 1px,rgba(0,0,0,.035) 1px 2px),
    linear-gradient(135deg,#E7E9EB 0%,#BFC4C9 45%,#DADDE0 60%,#AEB3B8 100%);
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 -2px 0 rgba(0,0,0,.18) inset,0 18px 30px rgba(0,0,0,.45);
  display:grid;grid-template-rows:minmax(0,1fr) auto;gap:5%;padding-bottom:7%}
.plaque .qr{width:100%;height:100%;min-height:0;fill:#23262A;opacity:.92;filter:drop-shadow(0 .5px 0 rgba(255,255,255,.55))}
.plaque .cap{font:400 .82rem/1 var(--display);text-align:center;color:#3B3F44;letter-spacing:.06em}
.dest{margin-top:1.8rem;position:relative;z-index:1}
.dest-label{color:#B9BEC2;font-size:.92rem;margin:0 0 .6rem;text-align:center;max-width:none}
.tabs{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.tabs button{font:600 .9rem/1 var(--body);color:#D9DCDE;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);padding:.55rem .8rem;border-radius:999px;cursor:pointer}
.tabs button[aria-selected="true"]{background:#E7E9EB;color:var(--granite);border-color:#E7E9EB}
.phone{margin:1.2rem auto 0;max-width:330px;background:#F7F7F5;color:#26292D;border-radius:10px;padding:.9rem 1rem;display:flex;gap:.8rem;align-items:center;min-height:74px}
.phone .url{font-size:.8rem;color:#6A6F74;word-break:break-all}
.phone strong{display:block;font-size:1rem;line-height:1.25}
.phone .dot{flex:0 0 38px;height:38px;border-radius:8px;background:var(--patina)}
@media (prefers-reduced-motion:no-preference){.phone.swap{animation:swap .35s ease}@keyframes swap{from{opacity:.2;transform:translateY(4px)}to{opacity:1;transform:none}}}

/* sections */
section{padding:4.5rem 0}
.band{background:var(--stone)}
.split{display:grid;grid-template-columns:1fr 1.2fr;gap:3rem;align-items:start}
@media (max-width:860px){.split{grid-template-columns:1fr;gap:1.5rem}}

.compare{width:100%;border-collapse:collapse;font-size:1rem;background:var(--surface)}
.compare th,.compare td{padding:.85rem 1rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.compare thead th{font-weight:700;font-size:.95rem;color:var(--ink-soft)}
.compare td:last-child{color:var(--ink);font-weight:600}
.compare td:nth-child(2){color:var(--ink-soft)}
.table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:8px}

.steps{list-style:none;padding:0;margin:2rem 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;counter-reset:s}
@media (max-width:860px){.steps{grid-template-columns:1fr;gap:1.6rem}}
.steps li{counter-increment:s;border-top:2px solid var(--ink);padding-top:1rem}
.steps li::before{content:counter(s);font:400 2.2rem/1 var(--display);color:var(--patina-lt);display:block;margin-bottom:.6rem}
.steps p{font-size:1rem;color:var(--ink-soft)}

.dests{margin-top:2rem;border-top:1px solid var(--line)}
.dests a{display:grid;grid-template-columns:minmax(10rem,14rem) 1fr auto;gap:1.5rem;align-items:baseline;padding:1.2rem 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.dests a:hover h3{color:var(--patina-lt)}
.dests h3{margin:0;font-size:1.35rem}
.dests p{margin:0;color:var(--ink-soft);font-size:1rem}
.dests .site{font-weight:600;font-size:.92rem;color:var(--ink-soft);white-space:nowrap}
@media (max-width:720px){.dests a{grid-template-columns:1fr;gap:.3rem}}

.products{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:1.5rem;margin-top:2.2rem;align-items:stretch}
@media (max-width:960px){.products{grid-template-columns:1fr}}
.product{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:1.8rem;display:flex;flex-direction:column}
.product.feature{border:2px solid var(--patina);border-radius:12px;padding:2.2rem}
.product .price{font:400 2.4rem/1 var(--display);margin:.2rem 0 .3rem}
.product .note{font-size:.95rem;color:var(--ink-soft);margin-bottom:1.2rem}
.product ul{padding-left:1.1rem;margin:0 0 1.6rem;font-size:1rem}
.product li{margin-bottom:.45rem}
.product .btn{margin-top:auto;text-align:center}
.tag{display:inline-block;align-self:flex-start;font-size:.85rem;font-weight:700;color:var(--patina);background:#F4E4E8;padding:.25rem .6rem;border-radius:4px;margin-bottom:.8rem}

.specs{display:grid;grid-template-columns:repeat(2,1fr);gap:0 3rem;margin:0}
@media (max-width:640px){.specs{grid-template-columns:1fr}}
.specs div{border-top:1px solid var(--line);padding:.9rem 0}
.specs dt{font-weight:700}
.specs dd{margin:.2rem 0 0;color:var(--ink-soft)}

.activate{background:var(--granite);color:#E9EAE7;border-radius:14px;padding:clamp(1.8rem,4vw,3rem);display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center}
@media (max-width:860px){.activate{grid-template-columns:1fr}}
.activate p{color:#B9BEC2}
.activate form{display:grid;gap:.9rem}
.activate label{font-weight:600;font-size:.95rem}
.activate input{width:100%;font:600 1.15rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase;padding:.9rem 1rem;border-radius:6px;border:1px solid #555B61;background:#1E2124;color:#F2F3F1}
.activate .btn-primary{background:#E7E9EB;color:var(--granite)}
.activate .btn-primary:hover{background:#fff}
.hint{font-size:.9rem;color:#A3A8AC;margin:0}

.faq details{border-bottom:1px solid var(--line);padding:1.1rem 0}
.faq summary{cursor:pointer;font-weight:700;font-size:1.1rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 1.5rem/1 var(--display);color:var(--patina-lt)}
.faq details[open] summary::after{content:"\2212"}
.faq details p{margin:.7rem 0 0;color:var(--ink-soft)}

footer{padding:3rem 0 3.5rem;border-top:1px solid var(--line);font-size:.95rem;color:var(--ink-soft)}
.foot{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.foot nav{display:flex;gap:1.2rem;flex-wrap:wrap}
.foot a{color:var(--ink-soft)}

/* inner pages */
.crumbs{font-size:.9rem;color:var(--ink-soft);padding-top:1.2rem}
.crumbs a{color:var(--ink-soft)}
.hero.inner{padding:1.5rem 0 4rem}
.uses{display:grid;grid-template-columns:repeat(2,1fr);gap:0 3rem;margin:2rem 0 0;padding:0;list-style:none}
@media (max-width:720px){.uses{grid-template-columns:1fr}}
.uses li{border-top:1px solid var(--line);padding:1rem 0}
.uses strong{display:block;font-size:1.08rem;margin-bottom:.2rem}
.uses span{color:var(--ink-soft);font-size:1rem}
.products.two{grid-template-columns:1.25fr 1fr}
.products.one{grid-template-columns:minmax(0,26rem)}
@media (max-width:960px){.products.two{grid-template-columns:1fr}}
.cta{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap}
.cta p{margin:0}
.prose{max-width:44rem}
.prose h2{font-size:1.6rem;margin-top:2.2rem}
.prose p,.prose li{color:var(--ink)}
.prose ul{padding-left:1.2rem}
.prose li{margin-bottom:.4rem}
.updated{color:var(--ink-soft);font-size:.95rem}
.others{margin:.8rem 0 0;font-size:.9rem;max-width:none}
.foot nav{justify-content:flex-start}
.herofull{text-align:center;padding:3rem 0 2.2rem;max-width:56rem}
.herofull h1{font-size:clamp(2.3rem,5.2vw,3.9rem);margin-bottom:.5em}
.herofull .lede{margin:0 auto;max-width:44rem}
.offers{display:grid;grid-template-columns:1fr 1fr;gap:1.8rem;padding-bottom:4.5rem}
@media (max-width:820px){.offers{grid-template-columns:1fr}}
.offer{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.04),0 14px 34px rgba(38,41,45,.08)}
.offer-media{display:grid;place-items:center;height:clamp(300px,34vw,420px);text-decoration:none;border-radius:0}
.offer-media.stage{padding:2rem}
.offer-media.stage .plaque{width:min(240px,62%)}
.cardmedia{background:linear-gradient(160deg,#EEF2EF 0%,#E7E2D6 100%);padding:1.6rem}
.cardmedia{overflow:hidden}
.cardmedia img{height:calc(clamp(300px,34vw,420px) - 3.4rem);width:auto;max-width:100%;aspect-ratio:5/7;object-fit:cover;border-radius:10px;box-shadow:0 16px 36px rgba(38,41,45,.28);transform:rotate(-2deg);transition:transform .2s}
.offer:hover .cardmedia img{transform:rotate(0deg) translateY(-3px)}
.offer-body{display:flex;flex-direction:column;gap:.9rem;padding:1.6rem 1.7rem 1.8rem;flex:1}
.offer-body p{margin:0;color:var(--ink-soft)}
.offer-body .btn{align-self:flex-start;margin-top:auto}
.offer-top{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.offer-top h2{margin:0;font-size:1.65rem}
.pricepill{display:inline-block;background:#F4E4E8;color:var(--patina);font-weight:700;font-size:.92rem;padding:.3rem .8rem;border-radius:999px;white-space:nowrap}
.cardpromo{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
@media (max-width:860px){.cardpromo{grid-template-columns:1fr}}
.cardpromo img{width:100%;max-width:360px;border-radius:8px;box-shadow:0 18px 40px rgba(0,0,0,.25);justify-self:center}

/* Wedding palette */
:root{--patina:#7A4152;--patina-lt:#A35D72;--brass:#B8956A;--bg:#FBF8F5;--stone:#F5EEEA;--stone-2:#EEE4DE;--line:#E3D8D2;--ink:#2E2629;--ink-soft:#6A5E62}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#201B1D;--surface:#2A2427;--line:#3E3438;--stone:#262022;--ink:#F1E9EC;--ink-soft:#B8A9AE;--patina-lt:#D49AAB}}
.brand svg rect:first-child{fill:#7A4152}

/* single offering on the landing page */
.offers.solo{grid-template-columns:1fr;max-width:62rem}
.offers.solo .offer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.offers.solo .offer-media{height:auto;min-height:26rem}
.offers.solo .cardmedia img{height:22rem}
.offers.solo .offer-body{justify-content:center;padding:2.2rem 2.4rem}
@media (max-width:820px){.offers.solo .offer{grid-template-columns:1fr}.offers.solo .offer-media{min-height:0;height:clamp(300px,80vw,420px)}.offers.solo .cardmedia img{height:calc(clamp(300px,80vw,420px) - 3.4rem)}}
.offers.solo .offer-body .btn{margin-top:.6rem}

/* landing tiles */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;padding-bottom:1rem}
@media (max-width:1000px){.tiles{grid-template-columns:1fr 1fr}}@media (max-width:520px){.tiles{grid-template-columns:1fr}}
.tile{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 10px 28px rgba(46,38,41,.07);transition:transform .15s,box-shadow .15s}
.tile:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(46,38,41,.12)}
.tile-media{display:grid;place-items:center;height:250px;background:linear-gradient(160deg,#F6EEEA 0%,#EBDDD6 100%);padding:1.1rem}
.tile-media{overflow:hidden}
.tile-media img{height:calc(250px - 2.2rem);width:auto;aspect-ratio:5/7;object-fit:cover;border-radius:8px;box-shadow:0 10px 24px rgba(46,38,41,.25)}
.tile-body{display:grid;gap:.35rem;padding:1rem 1.1rem 1.2rem}.tile-body strong{font-family:var(--display);font-weight:400;font-size:1.3rem}.tile-body span{color:var(--ink-soft);font-size:.95rem}
.tiles-note{text-align:center;color:var(--ink-soft);padding-bottom:4rem;max-width:none}
