/* =========================================================
   Sweets By Amanda — styles
   Palette pulled from the logo: watercolor orchid, gold foil,
   plum ink, sage leaf, on a sugar-white ground.
   ========================================================= */

:root{
  --sugar:      #FCF7F4;
  --cream:      #F6EBE3;
  --icing:      #FFFFFF;
  --plum:       #34142B;
  --plum-soft:  #6B4560;
  --orchid:     #C25FA5;
  --orchid-deep:#9B3F82;
  --blush:      #F4CDE4;
  --gold:       #C9A227;
  --gold-lt:    #E8CE7A;
  --sage:       #9BB59C;

  --ff-display: "Fraunces", "Cormorant Garamond", Georgia, serif;
  --ff-body:    "Karla", "Helvetica Neue", Arial, sans-serif;
  --ff-script:  "Parisienne", "Brush Script MT", cursive;

  --max: 1180px;
  --pad: clamp(1.25rem, 5vw, 4rem);
  --r:   18px;

  --shadow-sm: 0 2px 10px rgba(52,20,43,.06);
  --shadow-md: 0 18px 44px -20px rgba(52,20,43,.28);
  --shadow-lg: 0 40px 90px -40px rgba(52,20,43,.42);

  --ease: cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}

body{
  margin:0;
  background:var(--sugar);
  color:var(--plum);
  font-family:var(--ff-body);
  font-size:clamp(1rem, .96rem + .2vw, 1.075rem);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* paper grain over everything */
body::after{
  content:"";
  position:fixed; inset:0; z-index:9999; pointer-events:none;
  opacity:.5; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
}

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }

h1,h2,h3{
  font-family:var(--ff-display);
  font-weight:400;
  font-variation-settings:"SOFT" 60, "WONK" 1;
  line-height:1.02;
  letter-spacing:-.02em;
  margin:0;
}

.script{
  font-family:var(--ff-script);
  font-weight:400;
  letter-spacing:.01em;
  color:var(--orchid-deep);
  font-variation-settings:normal;
}

.eyebrow{
  font-size:.72rem;
  letter-spacing:.24em;
  text-transform:uppercase;
  font-weight:600;
  color:var(--orchid-deep);
  margin:0 0 1.1rem;
}

.skip{
  position:absolute; left:-9999px; top:0; z-index:10000;
  background:var(--plum); color:var(--sugar); padding:.75rem 1.25rem;
}
.skip:focus{ left:1rem; top:1rem; }

:focus-visible{
  outline:2px solid var(--orchid-deep);
  outline-offset:3px;
  border-radius:4px;
}

/* ---------------- Buttons ---------------- */
.btn{
  --bg:var(--plum); --fg:var(--sugar);
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.9rem 1.6rem;
  border:1px solid transparent;
  border-radius:999px;
  background:var(--bg); color:var(--fg);
  font-family:var(--ff-body); font-size:.86rem; font-weight:600;
  letter-spacing:.13em; text-transform:uppercase; text-decoration:none;
  cursor:pointer;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .3s, color .3s;
}
.btn--primary{ --bg:var(--plum); box-shadow:var(--shadow-md); }
.btn--primary:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lg); background:var(--orchid-deep); }
.btn--ghost{ --bg:transparent; --fg:var(--plum); border-color:rgba(52,20,43,.22); }
.btn--ghost:hover{ border-color:var(--orchid-deep); color:var(--orchid-deep); transform:translateY(-3px); }
.btn--gold{
  --fg:var(--plum);
  background:linear-gradient(115deg,var(--gold-lt),var(--gold) 45%,#F3E0A6 62%,#B98F1E);
}
.btn--gold:hover{ transform:translateY(-3px); box-shadow:0 20px 40px -22px rgba(201,162,39,.9); }
.btn--lg{ padding:1.05rem 2.4rem; font-size:.9rem; }
.btn[disabled]{ opacity:.55; pointer-events:none; }

/* ---------------- Nav ---------------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background .4s var(--ease), box-shadow .4s var(--ease), padding .4s var(--ease);
  padding:.85rem 0;
}
.nav.is-stuck{
  background:rgba(252,247,244,.88);
  backdrop-filter:blur(14px);
  box-shadow:0 1px 0 rgba(52,20,43,.08);
}
.nav__inner{
  max-width:var(--max); margin:0 auto; padding:0 var(--pad);
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.nav__brand{ display:flex; align-items:center; gap:.7rem; text-decoration:none; }
.nav__brand img{ border-radius:50%; box-shadow:0 0 0 1px rgba(201,162,39,.5); }
.nav__brand-text{
  font-family:var(--ff-display); font-size:1.05rem; letter-spacing:-.01em;
}
.nav__brand-text em{ font-family:var(--ff-script); font-style:normal; color:var(--orchid-deep); font-size:1.15em; }

.nav__menu{ display:flex; align-items:center; gap:2rem; }
.nav__menu a{
  text-decoration:none; font-size:.82rem; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; position:relative;
}
.nav__menu a:not(.nav__cta)::after{
  content:""; position:absolute; left:0; bottom:-6px; height:1px; width:0;
  background:var(--orchid-deep); transition:width .35s var(--ease);
}
.nav__menu a:not(.nav__cta):hover::after{ width:100%; }
.nav__cta{
  padding:.6rem 1.15rem; border-radius:999px;
  background:var(--plum); color:var(--sugar);
  transition:background .3s, transform .3s var(--ease);
}
.nav__cta:hover{ background:var(--orchid-deep); transform:translateY(-2px); }

.nav__toggle{
  display:none; flex-direction:column; gap:5px; padding:.55rem;
  background:none; border:0; cursor:pointer;
}
.nav__toggle span{ display:block; width:24px; height:2px; background:var(--plum); transition:transform .3s var(--ease), opacity .2s; }
.nav__toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav__toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav__toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:880px){
  .nav__toggle{ display:flex; }
  .nav{ background:rgba(252,247,244,.9); backdrop-filter:blur(14px); }
  .nav__menu{
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--sugar);
    border-top:1px solid rgba(52,20,43,.08);
    box-shadow:var(--shadow-md);
    max-height:0; overflow:hidden;
    transition:max-height .45s var(--ease);
  }
  .nav__menu.is-open{ max-height:26rem; }
  .nav__menu a{ padding:1.05rem var(--pad); border-bottom:1px solid rgba(52,20,43,.06); }
  .nav__cta{ margin:1rem var(--pad) 1.4rem; text-align:center; border-radius:999px; }
}

/* ---------------- Hero ---------------- */
.hero{
  position:relative;
  padding:clamp(8rem,16vh,11rem) 0 0;
  overflow:hidden;
  background:
    radial-gradient(60% 50% at 78% 18%, rgba(244,205,228,.55), transparent 70%),
    radial-gradient(50% 40% at 10% 78%, rgba(155,181,156,.22), transparent 70%),
    linear-gradient(180deg,var(--sugar) 0%, var(--cream) 100%);
}
.hero__glow{
  position:absolute; width:min(72vw,780px); aspect-ratio:1; right:-14vw; top:-12vh;
  background:radial-gradient(circle, rgba(194,95,165,.28), transparent 62%);
  filter:blur(30px);
  animation:drift 22s ease-in-out infinite alternate;
}
@keyframes drift{ to{ transform:translate3d(-4vw,4vh,0) scale(1.12); } }

.hero__inner{
  position:relative; z-index:2;
  max-width:var(--max); margin:0 auto; padding:0 var(--pad) clamp(3rem,7vw,5rem);
  display:grid; grid-template-columns:1.05fr .95fr; align-items:center;
  gap:clamp(2rem,5vw,4rem);
}
.hero__title{
  font-size:clamp(3rem,9vw,6.4rem);
  font-weight:300;
  margin:0 0 1.4rem;
}
.hero__title span{ display:block; }
.hero__title .script{ font-size:1.22em; line-height:.92; margin-left:.06em; }

.hero__lede{
  max-width:44ch; color:var(--plum-soft); font-size:1.06rem; margin:0 0 2rem;
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:.85rem; margin-bottom:2.4rem; }

.hero__meta{
  list-style:none; margin:0; padding:1.3rem 0 0; display:flex; flex-wrap:wrap; gap:.5rem 2rem;
  border-top:1px solid rgba(52,20,43,.14);
  font-size:.9rem; letter-spacing:.03em;
}
.hero__meta a{ text-decoration:none; color:var(--plum-soft); transition:color .25s; }
.hero__meta a:hover{ color:var(--orchid-deep); }

.hero__mark{ position:relative; display:grid; place-items:center; }
.hero__mark img{
  width:min(100%,430px); border-radius:50%;
  filter:drop-shadow(0 30px 50px rgba(155,63,130,.22));
}
.ring{
  position:absolute; inset:-6% ; width:112%; height:112%;
  animation:spin 46s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }

@media (max-width:900px){
  .hero__inner{ grid-template-columns:1fr; text-align:left; }
  .hero__mark{ order:-1; max-width:320px; }
}

/* ---------------- Marquee ---------------- */
.marquee{
  position:relative; z-index:2;
  background:var(--plum);
  border-top:1px solid rgba(201,162,39,.4);
  border-bottom:1px solid rgba(201,162,39,.4);
  overflow:hidden;
  padding:.85rem 0;
}
.marquee__track{ display:flex; width:max-content; animation:slide 42s linear infinite; }
.marquee__track span{
  font-family:var(--ff-display); font-size:1.1rem; letter-spacing:.16em;
  text-transform:uppercase; white-space:nowrap; padding-right:2rem;
  background:linear-gradient(100deg,var(--gold-lt),#F6E5B0,var(--gold),#F3E0A6,var(--gold));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
@keyframes slide{ to{ transform:translateX(-50%); } }

/* ---------------- Section shell ---------------- */
.section{
  max-width:var(--max); margin:0 auto;
  padding:clamp(4.5rem,11vw,8rem) var(--pad);
}
.section__title{ font-size:clamp(2.4rem,5.6vw,4rem); font-weight:300; margin:0 0 1.2rem; }
.section__title .script{ font-size:1.25em; }
.section__lede{ max-width:52ch; color:var(--plum-soft); margin:0; }
.section__head{ margin-bottom:clamp(2.5rem,5vw,4rem); }
.section__head--split{
  display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:end;
}
@media (max-width:760px){ .section__head--split{ grid-template-columns:1fr; } }

/* ---------------- The Case ---------------- */
.case__grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:clamp(1.1rem,2.4vw,1.9rem);
}
.card{
  position:relative;
  background:var(--icing);
  border:1px solid rgba(52,20,43,.07);
  border-radius:var(--r);
  padding:0 1.6rem 1.9rem;
  box-shadow:var(--shadow-sm);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .4s;
}
.card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-md); border-color:rgba(201,162,39,.55); }
.card__arch{
  height:132px; margin:0 -1.6rem 1.5rem;
  border-radius:var(--r) var(--r) 0 0;
  background:
    radial-gradient(ellipse at 50% 118%, rgba(255,255,255,.9), transparent 60%),
    linear-gradient(150deg, var(--blush), rgba(194,95,165,.55) 55%, rgba(155,63,130,.75));
  display:grid; place-items:center;
  position:relative; overflow:hidden;
}
.card__arch::after{
  content:""; position:absolute; left:50%; bottom:-46px; translate:-50% 0;
  width:78%; height:92px; border-radius:50% 50% 0 0 / 100% 100% 0 0;
  background:var(--icing);
}
.card__num{
  position:relative; z-index:1;
  font-family:var(--ff-display); font-size:2.6rem; font-weight:300;
  color:var(--icing); opacity:.92; text-shadow:0 2px 18px rgba(52,20,43,.25);
  margin-bottom:1.2rem;
}
.card h3{ font-size:1.5rem; margin:0 0 .6rem; }
.card p{ color:var(--plum-soft); font-size:.95rem; margin:0 0 1.1rem; }
.card__tags{ list-style:none; display:flex; flex-wrap:wrap; gap:.4rem; margin:0; padding:0; }
.card__tags li{
  font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600;
  padding:.3rem .65rem; border-radius:999px;
  background:rgba(244,205,228,.5); color:var(--orchid-deep);
}
/* Shipping banner — the flat rate is a selling point, so it gets the gold
   treatment rather than being buried as fine print. */
.ship{
  margin:clamp(2.2rem,4.5vw,3.4rem) 0 0;
  padding:clamp(1.5rem,3.5vw,2.4rem);
  text-align:center;
  border-radius:calc(var(--r) * 1.2);
  background:
    radial-gradient(80% 120% at 50% -20%, rgba(244,205,228,.55), transparent 70%),
    var(--icing);
  border:1px solid rgba(201,162,39,.45);
  box-shadow:var(--shadow-sm);
  position:relative; overflow:hidden;
}
.ship::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,transparent,var(--gold),var(--gold-lt),var(--gold),transparent);
}
.ship__lead{
  margin:0 0 .35rem;
  font-family:var(--ff-display); font-weight:300;
  font-size:clamp(1.4rem,3.2vw,2rem); line-height:1.15;
}
.ship__lead strong{
  font-weight:400; color:var(--orchid-deep);
}
.ship__rate{
  margin:0 0 .7rem;
  font-size:.8rem; letter-spacing:.2em; text-transform:uppercase; font-weight:700;
  color:var(--plum-soft);
}
.ship__rate span{
  font-family:var(--ff-display); font-size:1.55rem; font-weight:600;
  letter-spacing:0; vertical-align:-.12em;
  /* Solid, not the gold gradient used elsewhere: the pale stops in that
     gradient fall to roughly 1.8:1 on white, and this is the single most
     important number on the page. #7A6011 on white is ~6.4:1. */
  color:#7A6011;
}
.ship__fine{
  margin:0 auto; max-width:46ch;
  font-size:.9rem; color:var(--plum-soft);
}

/* "Ships" reads as a capability, so it is gold rather than another pink tag. */
.card__tags .tag--ship{
  background:linear-gradient(115deg,rgba(232,206,122,.4),rgba(201,162,39,.3));
  color:#7A6011;
  box-shadow:inset 0 0 0 1px rgba(201,162,39,.4);
}

.field__hint{
  font-size:.8rem; color:var(--plum-soft); margin-top:.15rem;
}

.case__note{
  margin:clamp(2rem,4vw,3rem) auto 0; max-width:56ch; text-align:center;
  color:var(--plum-soft);
  font-family:var(--ff-display); font-size:1.15rem; letter-spacing:.005em;
}

/* ---------------- Gallery ---------------- */
/* Explicit areas rather than CSS columns: with only four photos, column
   balancing left a large void under the short column. Named areas make the
   layout obvious to edit, and the two tall slots are ~0.60 aspect, which is
   almost exactly the shape of the two portrait cake photos — so the images
   that matter most are barely cropped. */
.gallery__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-template-rows:repeat(3,200px);
  grid-template-areas:
    "heart bread blue"
    "heart bread blue"
    "heart cups  blue";
  gap:clamp(.7rem,1.6vw,1.15rem);
}
.shot--heart{ grid-area:heart; }
.shot--bread{ grid-area:bread; }
.shot--blue { grid-area:blue;  }
.shot--cups { grid-area:cups;  }

.shot{
  margin:0; position:relative; overflow:hidden;
  border-radius:var(--r); box-shadow:var(--shadow-sm);
}
.shot img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .8s var(--ease);
}
/* The tray is wider than its slot; anchor on the middle rows of cupcakes. */
.shot--cups img{ object-position:center 45%; }
.shot:hover img{ transform:scale(1.04); }

.shot figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:2.4rem .95rem .85rem;
  background:linear-gradient(transparent, rgba(52,20,43,.75));
  color:#fff; font-size:.8rem; letter-spacing:.1em; text-transform:uppercase;
  transform:translateY(14px); opacity:0;
  transition:transform .45s var(--ease), opacity .45s var(--ease);
}
.shot:hover figcaption, .shot:focus-within figcaption{ transform:none; opacity:1; }

@media (max-width:760px){
  /* One per row at full width, uncropped — a phone has the vertical space,
     and food photography is the whole point of this section. */
  .gallery__grid{
    grid-template-columns:1fr;
    grid-template-rows:none;
    grid-template-areas:none;
  }
  .shot{ grid-area:auto; }
  .shot img{ height:auto; object-fit:fill; }
  /* No hover on touch, so captions have to be visible by default. */
  .shot figcaption{ transform:none; opacity:1; }
}

/* Photo buttons + zoom affordance */
.shot__btn{
  display:block; width:100%; height:100%;
  padding:0; margin:0; border:0; background:none;
  cursor:zoom-in;
  position:relative;
}
.shot__btn:focus-visible{
  outline:3px solid var(--orchid-deep);
  outline-offset:-3px;
  border-radius:var(--r);
}
.shot__zoom{
  position:absolute; top:.7rem; right:.7rem;
  width:34px; height:34px; border-radius:50%;
  display:grid; place-items:center;
  background:rgba(52,20,43,.55);
  backdrop-filter:blur(6px);
  color:#fff;
  opacity:0; transform:scale(.85);
  transition:opacity .3s var(--ease), transform .3s var(--ease);
  pointer-events:none;
}
.shot:hover .shot__zoom,
.shot__btn:focus-visible .shot__zoom{ opacity:1; transform:none; }

/* ---------------- Lightbox ---------------- */
.lb{
  position:fixed; inset:0; z-index:1000;
  display:grid; place-items:center;
  padding:clamp(.75rem,3vw,2.5rem);
}
.lb[hidden]{ display:none; }
.lb__backdrop{
  position:absolute; inset:0;
  background:rgba(28,10,23,.86);
  backdrop-filter:blur(6px);
  animation:lbFade .28s var(--ease);
}
.lb__panel{
  position:relative;
  display:flex; align-items:center; gap:clamp(.4rem,2vw,1.2rem);
  max-width:min(100%,1100px); max-height:100%;
}
.lb__figure{
  margin:0; position:relative;
  display:flex; flex-direction:column; align-items:center;
  min-width:0;
  animation:lbRise .34s var(--ease);
}
.lb__img{
  display:block;
  max-width:100%;
  /* Leave room for the caption and the padding on short screens. */
  max-height:calc(100vh - 9rem);
  width:auto; height:auto;
  border-radius:var(--r);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.7);
  background:var(--plum);
}
.lb__caption{
  margin-top:.9rem;
  color:var(--cream);
  font-size:.8rem; letter-spacing:.14em; text-transform:uppercase;
  text-align:center;
}
.lb__btn{
  flex:none;
  width:46px; height:46px; border-radius:50%;
  display:grid; place-items:center;
  border:1px solid rgba(246,235,227,.28);
  background:rgba(52,20,43,.55);
  color:var(--cream);
  cursor:pointer;
  transition:background .25s, border-color .25s, transform .25s var(--ease);
}
.lb__btn:hover{
  background:var(--orchid-deep);
  border-color:var(--orchid-deep);
  transform:scale(1.08);
}
.lb__btn:focus-visible{ outline:2px solid var(--gold-lt); outline-offset:3px; }
.lb__btn--close{
  position:absolute; top:-.5rem; right:-.5rem; z-index:2;
  width:40px; height:40px;
}
@keyframes lbFade{ from{ opacity:0; } }
@keyframes lbRise{ from{ opacity:0; transform:translateY(14px) scale(.98); } }

/* Scroll lock while the viewer is open. */
body.lb-open{ overflow:hidden; }

@media (max-width:760px){
  .lb__panel{ width:100%; }
  /* Thumb-reachable controls instead of arrows pinched beside the photo. */
  .lb__btn--prev, .lb__btn--next{
    position:absolute; bottom:-3.6rem; z-index:2;
  }
  .lb__btn--prev{ left:22%; }
  .lb__btn--next{ right:22%; }
  .lb__btn--close{ top:-.25rem; right:-.25rem; }
  .lb__img{ max-height:calc(100vh - 13rem); }
}

/* ---------------- About ---------------- */
.about{ position:relative; }
.about__inner{
  display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center;
  background:var(--icing);
  border:1px solid rgba(201,162,39,.35);
  border-radius:calc(var(--r) * 1.6);
  padding:clamp(1.6rem,4vw,3.4rem);
  box-shadow:var(--shadow-md);
}
.about__media{ position:relative; }
.about__media img{ border-radius:var(--r); box-shadow:var(--shadow-md); }
.about__stamp{
  position:absolute; left:-14px; top:-22px;
  width:96px; height:96px; border-radius:50%;
  display:grid; place-content:center; text-align:center;
  background:linear-gradient(115deg,var(--gold-lt),var(--gold) 50%,#B98F1E);
  color:var(--plum);
  font-family:var(--ff-display); font-size:.9rem; line-height:1.2; letter-spacing:.1em;
  text-transform:uppercase;
  box-shadow:var(--shadow-md);
  rotate:-8deg;
}
.about__copy p{ color:var(--plum-soft); max-width:56ch; }
.about__facts{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:1.2rem; margin:2rem 0 0; padding-top:1.6rem;
  border-top:1px solid rgba(52,20,43,.12);
}
.about__facts dt{
  font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--orchid-deep); font-weight:700; margin-bottom:.3rem;
}
.about__facts dd{ margin:0; font-family:var(--ff-display); font-size:1.05rem; }
@media (max-width:820px){
  .about__inner{ grid-template-columns:1fr; }
  .about__stamp{ left:8px; }
}

/* ---------------- Order form ---------------- */
.order{ position:relative; }
.order::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(50% 40% at 85% 8%, rgba(244,205,228,.5), transparent 70%),
    radial-gradient(40% 40% at 6% 92%, rgba(201,162,39,.14), transparent 70%);
  pointer-events:none;
}
.order__head{ position:relative; margin-bottom:clamp(2rem,4vw,3.2rem); max-width:60ch; }

.form{
  position:relative;
  background:var(--icing);
  border:1px solid rgba(52,20,43,.08);
  border-radius:calc(var(--r) * 1.4);
  padding:clamp(1.4rem,3.5vw,2.8rem);
  box-shadow:var(--shadow-md);
  display:grid; gap:1.25rem;
}
.form__row{ display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
@media (max-width:680px){ .form__row{ grid-template-columns:1fr; } }

.field{ display:grid; gap:.4rem; border:0; padding:0; margin:0; min-width:0; }
.field__label{
  font-size:.7rem; letter-spacing:.18em; text-transform:uppercase;
  font-weight:700; color:var(--plum-soft);
}
.field__label b{ color:var(--orchid); }
.field input, .field select, .field textarea{
  width:100%; font:inherit; color:var(--plum);
  background:var(--sugar);
  border:1px solid rgba(52,20,43,.14);
  border-radius:12px;
  padding:.8rem .95rem;
  transition:border-color .25s, box-shadow .25s, background .25s;
}
.field textarea{ resize:vertical; min-height:7rem; }
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; background:var(--icing);
  border-color:var(--orchid);
  box-shadow:0 0 0 4px rgba(194,95,165,.14);
}
.field input::placeholder, .field textarea::placeholder{ color:rgba(107,69,96,.5); }
.field.is-invalid input, .field.is-invalid select, .field.is-invalid textarea{
  border-color:#C0392B; box-shadow:0 0 0 4px rgba(192,57,43,.1);
}
.field__err{ font-size:.78rem; color:#C0392B; min-height:0; }

.field--choice legend{ padding:0; margin-bottom:.55rem; }
.choices{ display:flex; flex-wrap:wrap; gap:.5rem; }
.choices label{ position:relative; }
.choices input{ position:absolute; opacity:0; inset:0; cursor:pointer; }
.choices span{
  display:inline-block; padding:.72rem 1.1rem; border-radius:999px;
  border:1px solid rgba(52,20,43,.16); background:var(--sugar);
  font-size:.85rem; cursor:pointer; transition:all .25s var(--ease);
}
.choices input:checked + span{
  background:var(--plum); color:var(--sugar); border-color:var(--plum);
}
.choices input:focus-visible + span{ outline:2px solid var(--orchid-deep); outline-offset:3px; }

/* Spam trap — off-screen rather than display:none, which some bots skip. */
.hp{
  position:absolute; left:-9999px; top:auto;
  width:1px; height:1px; overflow:hidden;
}

.form__foot{
  display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.5rem;
  margin-top:.6rem; padding-top:1.4rem;
  border-top:1px solid rgba(52,20,43,.1);
}
.form__fine{ margin:0; font-size:.85rem; color:var(--plum-soft); }
.form__status{
  margin:0; font-size:.95rem; padding:.9rem 1.1rem; border-radius:12px; display:none;
}
.form__status.is-ok{ display:block; background:rgba(155,181,156,.2); color:#3E5B41; border:1px solid rgba(110,143,114,.4); }
.form__status.is-err{ display:block; background:rgba(192,57,43,.08); color:#8E2C20; border:1px solid rgba(192,57,43,.3); }

/* ---------------- FAQ ---------------- */
.faq__list{ display:grid; gap:.75rem; }
.qa{
  background:var(--icing);
  border:1px solid rgba(52,20,43,.08);
  border-radius:var(--r);
  padding:1.15rem 1.5rem;
  transition:border-color .3s, box-shadow .3s;
}
.qa[open]{ border-color:rgba(201,162,39,.5); box-shadow:var(--shadow-sm); }
.qa summary{
  cursor:pointer; list-style:none;
  font-family:var(--ff-display); font-size:1.2rem;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.qa summary::-webkit-details-marker{ display:none; }
.qa summary::after{
  content:"+"; font-size:1.4rem; color:var(--orchid-deep); line-height:1;
  transition:transform .35s var(--ease);
}
.qa[open] summary::after{ transform:rotate(45deg); }
.qa p{ margin:.85rem 0 0; color:var(--plum-soft); max-width:66ch; }

/* ---------------- Footer ---------------- */
.footer{
  background:var(--plum); color:var(--cream);
  margin-top:clamp(3rem,7vw,6rem);
  position:relative;
}
.footer::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,transparent,var(--gold),var(--gold-lt),var(--gold),transparent);
}
.footer__inner{
  max-width:var(--max); margin:0 auto;
  padding:clamp(3rem,7vw,5.5rem) var(--pad);
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:center;
}
.footer__brand img{ border-radius:50%; box-shadow:0 0 0 2px rgba(201,162,39,.55); }
.footer__script{ font-size:2.4rem; margin:1rem 0 .2rem; color:var(--blush); }
.footer__tag{ margin:0; font-size:.82rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(246,235,227,.6); }
.footer__contact h2{ font-size:clamp(1.9rem,4vw,2.8rem); font-weight:300; margin-bottom:1.4rem; }
.footer__link{
  display:block; text-decoration:none; font-family:var(--ff-display);
  font-size:1.2rem; margin-bottom:.5rem; color:var(--cream);
  transition:color .25s, transform .25s var(--ease);
}
.footer__link:hover{ color:var(--gold-lt); transform:translateX(4px); }
.footer__contact .btn{ margin-top:1.4rem; }
@media (max-width:760px){ .footer__inner{ grid-template-columns:1fr; } }

.footer__bar{
  border-top:1px solid rgba(246,235,227,.14);
  padding:1.2rem var(--pad);
  max-width:var(--max); margin:0 auto;
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:.6rem;
  font-size:.8rem; color:rgba(246,235,227,.6);
}
.footer__bar a{ text-decoration:none; }
.footer__bar a:hover{ color:var(--gold-lt); }

/* ---------------- Reveal ---------------- */
.reveal{ opacity:0; transform:translateY(26px); animation:rise .9s var(--ease) forwards; animation-delay:var(--d,0ms); }
/* Hero stagger. These live here rather than in style="" attributes so the
   Content-Security-Policy in _headers can omit style-src 'unsafe-inline'. */
.reveal--d1{ --d:0ms; }
.reveal--d2{ --d:80ms; }
.reveal--d3{ --d:180ms; }
.reveal--d4{ --d:220ms; }
.reveal--d5{ --d:280ms; }
.reveal--d6{ --d:380ms; }
.reveal--d7{ --d:480ms; }
.reveal--d8{ --d:580ms; }
.reveal--scale{ transform:scale(.94); }
@keyframes rise{ to{ opacity:1; transform:none; } }

.in-view{ animation:rise .9s var(--ease) both; }
.will-reveal{ opacity:0; }