/* =====================================================================
   Sugar & Slice — shared styles
   Same design language as aletheanobleugc.co.uk, re-coloured for S&S.
   ===================================================================== */
:root{
  --shell:#FDF9F6;
  --mist:#F4EDE8;
  --blush:#F9E3E2;
  --rose:#F1ADB3;        /* brand pink from the original site */
  --apricot:#FAE3C6;
  --pistachio:#E5EDE0;
  --sky:#E3E9EE;
  --ink:#3B2F2C;         /* cocoa */
  --body-ink:#5C504B;
  --muted:#8D7F78;
  --line:rgba(59,47,44,.11);
  --berry:#B25D6A;
  --green:#7C9483;

  --display:"Newsreader", Georgia, serif;
  --body:"Figtree", ui-sans-serif, system-ui, sans-serif;
  --hand:"Caveat", cursive;

  --gutter:clamp(20px, 5vw, 70px);
  --maxw:1280px;
  --r:26px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--shell);color:var(--ink);
  font-family:var(--body);font-weight:300;font-size:17px;line-height:1.75;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,video{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter)}
.narrow{max-width:760px}

h1,h2,h3,h4{font-family:var(--display);font-weight:300;line-height:1.14;letter-spacing:-.012em;margin:0}
h1{font-size:clamp(36px,5vw,64px)}
h2{font-size:clamp(28px,3.6vw,44px)}
h3{font-size:21px;line-height:1.3}
h4{font-size:18px;line-height:1.3}
em{font-style:italic;color:var(--berry)}
p{margin:0 0 18px}
strong,b{font-weight:500}
.lede{font-size:clamp(16.5px,1.4vw,19px);color:var(--body-ink);max-width:52ch}
.hand{font-family:var(--hand);font-size:clamp(20px,2vw,25px);color:var(--berry);line-height:1.2}
.muted{color:var(--muted)}
.small{font-size:14.5px}

.mark-hl{position:relative;display:inline-block;white-space:nowrap;font-style:italic;z-index:0}
.mark-hl::before{
  content:"";position:absolute;left:-.14em;right:-.14em;top:.14em;bottom:.1em;
  background:var(--rose);opacity:.55;border-radius:100px;z-index:-1;
  transform-origin:left center;animation:swipe .8s .35s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes swipe{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.label{
  display:inline-flex;align-items:center;gap:9px;font-size:12.5px;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin:0 0 18px;
}
.label::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--berry)}
.label.g::before{background:var(--green)}
.label.b::before{background:#9FB8C4}
.label.a::before{background:#E0A969}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;font:inherit;font-size:15px;font-weight:400;text-decoration:none;cursor:pointer;border:0;
  padding:14px 30px;border-radius:100px;background:var(--ink);color:var(--shell);
  transition:transform .3s cubic-bezier(.2,.7,.2,1), background .3s ease, color .3s ease;
}
.btn:hover{transform:translateY(-3px) rotate(-1deg);background:var(--berry)}
.btn--light{background:var(--blush);color:var(--ink)}
.btn--light:hover{background:var(--rose);color:var(--ink)}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px rgba(59,47,44,.25)}
.btn--ghost:hover{background:var(--apricot)}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.textlink{text-decoration:none;border-bottom:1px solid rgba(59,47,44,.3);padding-bottom:2px;transition:color .3s,border-color .3s}
.textlink:hover{color:var(--berry);border-color:var(--berry)}
:focus-visible{outline:2px solid var(--green);outline-offset:4px;border-radius:8px}
.skip{position:absolute;left:-999px;top:10px;background:var(--ink);color:var(--shell);padding:10px 18px;border-radius:100px;z-index:100}
.skip:focus{left:10px}

/* ---------- header ---------- */
.site-head{position:sticky;top:0;z-index:60;background:rgba(253,249,246,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;height:80px;gap:20px}
.logo{display:block;flex-shrink:0}
.logo img{height:46px;width:auto}
.site-nav{display:flex;gap:4px;align-items:center;font-size:15px}
.site-nav a{text-decoration:none;color:var(--muted);padding:8px 13px;border-radius:100px;transition:background .3s ease,color .3s ease;white-space:nowrap}
.site-nav a:hover,.site-nav a[aria-current="page"]{background:var(--blush);color:var(--ink)}
.site-nav a.cta{background:var(--ink);color:var(--shell);margin-left:8px}
.site-nav a.cta:hover{background:var(--berry)}
.nav-toggle{display:none;background:var(--blush);border:0;border-radius:100px;padding:10px 18px;font:inherit;font-size:15px;color:var(--ink);cursor:pointer}
@media (max-width:1180px){
  .nav-toggle{display:inline-block}
  .site-nav{
    position:absolute;top:80px;left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;
    background:var(--shell);padding:14px var(--gutter) 26px;border-bottom:1px solid var(--line);
    box-shadow:0 20px 30px rgba(59,47,44,.08);display:none;
  }
  .site-nav.open{display:flex}
  .site-nav a{padding:12px 16px;font-size:17px}
  .site-nav a.cta{margin:10px 0 0;text-align:center}
}

/* ---------- breadcrumbs ---------- */
.crumbs{font-size:13.5px;color:var(--muted);padding-top:22px}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.crumbs li+li::before{content:"/";margin-right:6px;opacity:.5}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--berry)}

/* ---------- media ---------- */
.shot{overflow:hidden;border-radius:var(--r);background:var(--mist)}
.shot img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.shot:hover img{transform:scale(1.03)}
.cap{font-family:var(--hand);font-size:20px;color:var(--muted);margin-top:10px;display:block}
.pin{
  position:absolute;z-index:4;background:var(--shell);border-radius:100px;
  padding:9px 18px;font-size:14px;box-shadow:0 8px 20px rgba(59,47,44,.1);white-space:nowrap;
}

/* ---------- hero ---------- */
.hero{padding-block:clamp(28px,4vw,56px) 0}
.hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,72px);align-items:center}
@media (max-width:940px){.hero .wrap{grid-template-columns:1fr}}
.hero-note{margin-top:24px;display:block}
.hero-media{
  height:clamp(380px,56vw,640px);
  margin-right:calc(var(--gutter) * -1);
  border-radius:var(--r) 0 0 var(--r);
}
@media (max-width:940px){
  .hero-media{margin-inline:calc(var(--gutter) * -1);border-radius:0;height:clamp(320px,90vw,520px)}
}
.hero-wrap-media{position:relative}
.hero-wrap-media .pin.p1{top:26px;left:-14px;transform:rotate(-3deg);background:var(--apricot)}
.hero-wrap-media .pin.p2{bottom:30px;left:-18px;transform:rotate(2deg);background:var(--blush)}
@media (max-width:940px){.hero-wrap-media .pin{left:14px}}

/* inner-page hero */
.page-hero{padding-block:clamp(26px,4vw,50px) clamp(40px,6vw,80px)}
.page-hero .wrap.two{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,72px);align-items:center}
@media (max-width:900px){.page-hero .wrap.two{grid-template-columns:1fr}}
.page-hero h1{margin-top:6px}
.page-hero .lede{margin-top:22px}
.page-hero .shot{aspect-ratio:4/4.4;transform:rotate(1.4deg);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.page-hero .shot:hover{transform:rotate(0)}
.page-hero .media{position:relative}
.page-hero .media .pin{top:-14px;left:-10px;transform:rotate(-4deg);background:var(--apricot)}

/* ---------- marquee ---------- */
.marquee{
  margin-top:clamp(44px,6vw,80px);border-block:1px solid var(--line);
  overflow:hidden;padding:16px 0;background:var(--mist);
}
.marquee-track{display:flex;gap:36px;width:max-content;animation:slide 38s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee span{display:flex;align-items:center;gap:36px;white-space:nowrap;font-size:16px;color:var(--body-ink)}
.marquee span::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--berry);opacity:.7}
.marquee span:nth-child(3n)::after{background:var(--green)}
.marquee span:nth-child(3n+1)::after{background:#E0A969}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- sections ---------- */
section{padding-block:clamp(58px,8vw,112px)}
section.tight-top{padding-top:0}
.split{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(30px,5vw,80px);align-items:start}
@media (max-width:940px){.split{grid-template-columns:1fr}}
.split-head{position:sticky;top:110px}
.split-head p{margin-top:16px;color:var(--muted);font-size:15.5px;max-width:34ch}
@media (max-width:940px){.split-head{position:static}}
.section-head{max-width:60ch;margin-bottom:clamp(30px,4vw,50px)}
.section-head p{margin-top:14px;color:var(--body-ink)}
.prose{max-width:66ch}
.prose h2{margin:44px 0 16px;font-size:clamp(26px,3vw,36px)}
.prose h3{margin:30px 0 10px}
.prose ul,.prose ol{padding-left:1.2em;margin:0 0 18px}
.prose li{margin-bottom:6px}
.prose a{color:var(--berry)}

/* ---------- bands ---------- */
.band{background:var(--pistachio)}
.band--blush{background:var(--blush)}
.band--apricot{background:var(--apricot)}
.band--mist{background:var(--mist)}
.band--sky{background:var(--sky)}
.point{
  display:grid;grid-template-columns:.36fr 1fr;gap:clamp(18px,3vw,50px);
  padding:26px 0;border-top:1px solid rgba(59,47,44,.14);
}
.point:last-child{border-bottom:1px solid rgba(59,47,44,.14)}
@media (max-width:700px){.point{grid-template-columns:1fr;gap:6px}}
.point p{margin:0;font-size:15.5px;color:var(--body-ink);max-width:54ch}

/* ---------- facts / tags ---------- */
.facts{margin:34px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.facts li{list-style:none;padding:12px 20px;border-radius:20px;font-size:15px;background:var(--mist)}
.facts li:nth-child(4n+1){background:var(--pistachio)}
.facts li:nth-child(4n+2){background:var(--apricot)}
.facts li:nth-child(4n+3){background:var(--blush)}
.facts li:nth-child(4n+4){background:var(--sky)}
.facts li b{display:block;font-weight:500;color:var(--muted);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase}

.tags{display:flex;flex-wrap:wrap;gap:11px;padding:0;margin:0}
.tags li,.tags a{
  list-style:none;font-size:16px;padding:11px 22px;border-radius:100px;background:var(--mist);text-decoration:none;display:inline-block;
  transition:transform .3s cubic-bezier(.2,.7,.2,1);
}
.tags li:hover,.tags a:hover{transform:translateY(-4px) rotate(-1.5deg)}
.tags > :nth-child(4n+1), .tags > li:nth-child(4n+1) > a{background:var(--apricot)}
.tags > :nth-child(4n+2), .tags > li:nth-child(4n+2) > a{background:var(--pistachio)}
.tags > :nth-child(4n+3), .tags > li:nth-child(4n+3) > a{background:var(--blush)}
.tags > :nth-child(4n+4), .tags > li:nth-child(4n+4) > a{background:var(--sky)}
.tags li > a{padding:0;background:none!important}

/* ---------- steps ---------- */
.step{display:grid;grid-template-columns:.3fr 1fr;gap:clamp(18px,3vw,50px);padding:24px 0;border-top:1px solid var(--line)}
.step:last-child{border-bottom:1px solid var(--line)}
@media (max-width:700px){.step{grid-template-columns:1fr;gap:8px}}
.step .num{
  font-family:var(--display);font-style:italic;font-size:17px;color:var(--ink);
  width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;
}
.step:nth-child(4n+1) .num{background:var(--apricot)}
.step:nth-child(4n+2) .num{background:var(--pistachio)}
.step:nth-child(4n+3) .num{background:var(--blush)}
.step:nth-child(4n+4) .num{background:var(--sky)}
.step p{margin:0;font-size:15.5px;color:var(--body-ink);max-width:54ch}

/* ---------- cards ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.6vw,34px)}
.cards.two{grid-template-columns:repeat(2,1fr)}
.cards.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:1000px){.cards.four{grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.cards,.cards.two,.cards.four{grid-template-columns:1fr}}
.card{
  background:var(--mist);border-radius:var(--r);padding:clamp(24px,3vw,36px);position:relative;
  transition:transform .45s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column;
}
.cards > .card:nth-child(4n+1){background:var(--apricot)}
.cards > .card:nth-child(4n+2){background:var(--pistachio)}
.cards > .card:nth-child(4n+3){background:var(--blush)}
.cards > .card:nth-child(4n+4){background:var(--sky)}
.cards.tilt > .card:nth-child(odd){transform:rotate(-.8deg)}
.cards.tilt > .card:nth-child(even){transform:rotate(.9deg)}
.cards.tilt > .card:hover{transform:rotate(0) translateY(-6px)}
.card h3{margin-bottom:10px}
.card p{font-size:15.5px;color:var(--body-ink)}
.card .more{margin-top:auto;padding-top:10px;font-size:15px}
a.card{text-decoration:none}
a.card:hover{transform:translateY(-6px)}
.card .kicker{font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:8px;display:block}

/* package cards */
.pkg{background:var(--shell)!important;box-shadow:inset 0 0 0 1px var(--line)}
.pkg .for{display:inline-block;font-size:13px;padding:5px 14px;border-radius:100px;background:var(--blush);margin-bottom:16px;align-self:flex-start}
.cards > .pkg:nth-child(2) .for{background:var(--pistachio)}
.cards > .pkg:nth-child(3) .for{background:var(--apricot)}
.pkg .price{font-family:var(--display);font-size:46px;line-height:1;margin:18px 0 4px}
.pkg .price small{font-family:var(--body);font-size:14px;color:var(--muted);margin-left:6px}
.pkg ul{list-style:none;padding:0;margin:8px 0 18px;font-size:14.5px}
.pkg li{padding:7px 0;border-top:1px dashed var(--line);display:flex;justify-content:space-between;gap:12px}
.pkg li span{color:var(--muted);white-space:nowrap}
.pkg .fine{font-size:13px;color:var(--muted);margin:0}
.pkg.featured{box-shadow:inset 0 0 0 2px var(--rose)}
.pkg.featured::after{content:"most popular";position:absolute;top:-14px;right:22px;font-family:var(--hand);font-size:20px;background:var(--rose);padding:2px 14px;border-radius:100px;transform:rotate(3deg)}

/* menu grid */
.menu{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,3vw,40px)}
@media (max-width:900px){.menu{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.menu{grid-template-columns:1fr}}
.menu-item .shot{aspect-ratio:1/1;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.menu-item:nth-child(odd) .shot{transform:rotate(-1deg)}
.menu-item:nth-child(even) .shot{transform:rotate(1.1deg)}
.menu-item:hover .shot{transform:rotate(0) translateY(-5px)}
.menu-item h3{margin-top:20px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.menu-item h3 small{font-family:var(--body);font-size:12.5px;font-weight:500;letter-spacing:.04em;color:var(--ink);background:var(--apricot);padding:4px 12px;border-radius:100px;white-space:nowrap}
.menu-item:nth-child(3n+2) h3 small{background:var(--pistachio)}
.menu-item:nth-child(3n+3) h3 small{background:var(--blush)}
.menu-item .flav{display:block;margin:14px 0 6px;font-size:11.5px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.menu-item ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;column-gap:22px;border-top:1px solid var(--line)}
.menu-item li{position:relative;font-size:14.5px;line-height:1.4;padding:9px 0 9px 15px;border-bottom:1px solid var(--line)}
.menu-item li::before{content:"";position:absolute;left:0;top:15px;width:6px;height:6px;border-radius:50%;background:var(--berry)}
.menu-item:nth-child(3n+2) li::before{background:var(--green)}
.menu-item:nth-child(3n+3) li::before{background:#E0A969}
@media (max-width:380px){.menu-item ul{grid-template-columns:1fr}}
.menu-item .note{font-family:var(--hand);color:var(--berry);font-size:20px;margin-top:10px;display:block}

/* ---------- FAQ ---------- */
.faq details{border-top:1px solid var(--line);padding:4px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{
  list-style:none;cursor:pointer;padding:20px 44px 20px 0;position:relative;
  font-family:var(--display);font-size:clamp(19px,1.8vw,23px);line-height:1.3;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;border-radius:50%;background:var(--blush);display:flex;align-items:center;justify-content:center;
  font-family:var(--body);font-size:20px;transition:transform .3s ease,background .3s ease;
}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg);background:var(--rose)}
.faq .answer{padding:0 0 22px;color:var(--body-ink);max-width:64ch}
.faq .answer p:last-child{margin-bottom:0}

/* ---------- areas list ---------- */
.areas{columns:3 200px;column-gap:30px;padding:0;margin:0;list-style:none}
.areas li{break-inside:avoid;padding:9px 0;border-bottom:1px solid var(--line)}
.areas a{text-decoration:none;display:flex;justify-content:space-between;gap:10px}
.areas a::after{content:"→";color:var(--berry);transition:transform .3s}
.areas a:hover::after{transform:translateX(4px)}

/* ---------- wide banner ---------- */
.banner{padding-block:0}
.banner .shot{aspect-ratio:16/7}
@media (max-width:700px){.banner .shot{aspect-ratio:4/3}}
.banner .cap{text-align:right}

/* photo pair */
.pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,30px);margin-top:clamp(30px,4vw,48px)}
@media (max-width:600px){.pair{grid-template-columns:1fr}}
.pair .shot{aspect-ratio:4/5;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.pair figure{margin:0}
.pair figure:first-child .shot{transform:rotate(-1.6deg)}
.pair figure:last-child .shot{transform:rotate(1.8deg);margin-top:clamp(20px,4vw,54px)}
.pair figure:hover .shot{transform:rotate(0)}

/* ---------- forms / tools ---------- */
.panel{background:var(--shell);border-radius:var(--r);padding:clamp(22px,3.4vw,44px);box-shadow:0 20px 50px rgba(59,47,44,.07), inset 0 0 0 1px var(--line)}
.field{margin-bottom:20px}
.field label,.field .lbl{display:block;font-size:14px;font-weight:500;margin-bottom:8px}
.field .hint{font-size:13px;color:var(--muted);margin-top:6px;display:block}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
@media (max-width:600px){.grid2{grid-template-columns:1fr}}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=date],select,textarea{
  width:100%;font:inherit;font-size:16px;font-weight:400;color:var(--ink);background:var(--shell);
  border:1px solid rgba(59,47,44,.2);border-radius:14px;padding:13px 16px;transition:border-color .2s, box-shadow .2s;
}
textarea{min-height:140px;resize:vertical;line-height:1.6}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--berry);box-shadow:0 0 0 3px rgba(241,173,179,.35)}
.chips{display:flex;flex-wrap:wrap;gap:9px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;cursor:pointer}
.chip span{display:inline-block;padding:9px 18px;border-radius:100px;background:var(--mist);font-size:15px;transition:background .2s, transform .2s;cursor:pointer;user-select:none}
.chip input:checked + span{background:var(--rose)}
.chip input:focus-visible + span{outline:2px solid var(--green);outline-offset:3px}
.chip:hover span{transform:translateY(-2px)}
.range-row{display:flex;align-items:center;gap:16px}
.range-row input[type=range]{flex:1;accent-color:var(--berry)}
.range-row output{font-family:var(--display);font-size:28px;min-width:3ch;text-align:right}
.hp{position:absolute;left:-5000px}
.form-status{margin-top:16px;font-size:15px}
.form-status.ok{color:var(--green)}
.form-status.err{color:var(--berry)}

/* tool results */
.tool{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,3vw,40px);align-items:start}
@media (max-width:900px){.tool{grid-template-columns:1fr}}
.result{background:var(--blush);border-radius:var(--r);padding:clamp(22px,3.4vw,40px);position:sticky;top:100px}
@media (max-width:900px){.result{position:static}}
.big-num{font-family:var(--display);font-size:clamp(54px,7vw,84px);line-height:1;margin:6px 0 4px}
.stat-row{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0 22px}
.stat{background:var(--shell);border-radius:18px;padding:12px 18px;min-width:120px}
.stat b{display:block;font-weight:500;color:var(--muted);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase}
.stat span{font-family:var(--display);font-size:26px}
table.mix{width:100%;border-collapse:collapse;font-size:15px;margin:8px 0 18px}
table.mix th{text-align:left;font-weight:500;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:6px 0}
table.mix td{padding:10px 0;border-top:1px solid rgba(59,47,44,.12)}
table.mix td:last-child,table.mix th:last-child{text-align:right}
.suggest{background:var(--shell);border-radius:18px;padding:16px 20px;margin-bottom:18px;font-size:15px}
.suggest b{font-family:var(--display);font-weight:400;font-size:19px}
.months{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:10px 0 20px}
@media (max-width:480px){.months{grid-template-columns:repeat(3,1fr)}}
.months div{background:var(--shell);border-radius:14px;padding:10px 12px;font-size:13px;line-height:1.35}
.months div b{display:block;font-family:var(--display);font-weight:400;font-size:17px}

/* ---------- contact ---------- */
.contact{background:var(--blush)}
.contact .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,4vw,64px);align-items:start}
@media (max-width:900px){.contact .wrap{grid-template-columns:1fr}}
.mail{
  font-family:var(--display);font-size:clamp(20px,2.4vw,28px);text-decoration:none;
  word-break:break-word;border-bottom:1px solid rgba(59,47,44,.25);padding-bottom:5px;
  transition:border-color .3s ease,color .3s ease;
}
.mail:hover{border-color:var(--berry);color:var(--berry)}
.socials{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.socials a{
  text-decoration:none;font-size:14.5px;padding:10px 20px;border-radius:100px;
  background:var(--shell);transition:transform .3s cubic-bezier(.2,.7,.2,1);
}
.socials a:hover{transform:translateY(-3px) rotate(-1.5deg)}
.socials a:nth-child(2){background:var(--apricot)}

/* CTA strip */
.cta-strip{background:var(--apricot);border-radius:var(--r);padding:clamp(30px,5vw,60px);display:grid;grid-template-columns:1.4fr auto;gap:24px;align-items:center}
@media (max-width:800px){.cta-strip{grid-template-columns:1fr}}
.cta-strip p{margin:12px 0 0;color:var(--body-ink)}

/* ---------- footer ---------- */
footer{background:var(--ink);color:#E9DFDA;padding:clamp(50px,6vw,80px) 0 30px;font-size:15px}
footer a{text-decoration:none;color:#E9DFDA}
footer a:hover{color:var(--rose)}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:clamp(24px,4vw,56px)}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot-grid{grid-template-columns:1fr}}
.foot-grid h4{font-family:var(--body);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:#B7A8A1;margin-bottom:14px}
.foot-grid ul{list-style:none;padding:0;margin:0}
.foot-grid li{padding:4px 0}
.foot-logo img{height:52px;width:auto;margin-bottom:16px}
.foot-base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:50px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);font-size:13.5px;color:#B7A8A1}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .85s ease,transform .85s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .marquee-track{animation:none}
  .mark-hl::before{animation:none;transform:none}
  .split-head{position:static}
  *{transition:none!important}
}

/* ---------- video clips ---------- */
.clips{display:grid;grid-template-columns:repeat(3,minmax(0,300px));gap:clamp(18px,2.6vw,34px);margin-top:clamp(30px,4vw,50px)}
@media (max-width:760px){.clips{grid-template-columns:repeat(3,68%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter)}}
.clip{margin:0;scroll-snap-align:center}
.clip .frame{aspect-ratio:9/16;border-radius:22px;overflow:hidden;background:var(--mist);transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.clip:nth-child(odd) .frame{transform:rotate(-1deg)}
.clip:nth-child(even) .frame{transform:rotate(1.2deg);margin-top:clamp(0px,3vw,40px)}
.clip:hover .frame{transform:rotate(0) translateY(-6px)}
.clip video{width:100%;height:100%;object-fit:cover;display:block}
.clip figcaption{margin-top:12px}

/* ---------- Concept 1 wordmark (used when logo_style = "wordmark") ---------- */
.wm-link{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-decoration:none}
.wm{font-family:var(--display);font-weight:300;font-size:31px;line-height:1;letter-spacing:-.02em;color:var(--ink);white-space:nowrap}
.wm em{color:var(--berry)}
.wm-sub{font-family:var(--body);font-weight:500;font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--body-ink);white-space:nowrap}
footer .wm-link{margin-bottom:16px}
footer .wm{font-size:36px;color:#FDF9F6}
footer .wm em{color:var(--rose)}
footer .wm-sub{color:#D9CEC8;font-size:10.5px}
@media (max-width:420px){.site-head .wm{font-size:26px}.site-head .wm-sub{font-size:8.5px;letter-spacing:.24em}}

/* ---------- Christmas bar (shown when christmas_live = True) ---------- */
.xmas-bar{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 18px;padding:11px var(--gutter);background:#2E4336;color:#FDF9F6;text-decoration:none;font-size:14.5px;text-align:center}
.xmas-bar-cta{color:var(--rose);font-weight:500}
.xmas-bar:hover .xmas-bar-cta{text-decoration:underline}


/* ---------- Bake Shop nav pill ---------- */
.site-nav a.club{color:var(--ink);background:var(--apricot)}
.site-nav a.club:hover,.site-nav a.club[aria-current="page"]{background:var(--rose)}
.soon{display:inline-block;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;background:rgba(241,173,179,.22);color:var(--rose);border-radius:100px;padding:1px 8px;margin-left:4px;vertical-align:1px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- mailing list form ---------- */
.join{margin-top:24px;max-width:520px}
.join-row{display:flex;flex-wrap:wrap;gap:10px}
.join-row input{flex:1 1 200px;min-width:0}
.join-row .btn{flex:0 0 auto;border:0;cursor:pointer;font:inherit}
.join-note{font-size:13px;color:var(--muted);margin:10px 0 0}
.join-note a{color:inherit}
.join-status{font-size:15px;margin:10px 0 0;min-height:1em}
.join-status.ok{color:var(--green)}
.join-status.err{color:var(--berry)}
.join.done .join-row,.join.done .join-note{display:none}
.join--dark input{background:rgba(253,249,246,.08);border-color:rgba(253,249,246,.28);color:var(--shell)}
.join--dark input::placeholder{color:rgba(253,249,246,.6)}
.join--dark .btn{background:var(--rose);color:var(--ink)}
.join--dark .btn:hover{background:var(--shell);color:var(--ink)}
.join--dark .join-note{color:#D9CEC8}
.join--dark .join-status.ok{color:var(--pistachio)}
.join--dark .join-status.err{color:var(--rose)}

/* ---------- welcome popup ---------- */
.pop{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:rgba(59,47,44,.42)}
.pop[hidden]{display:none}
.pop-card{position:relative;background:var(--shell);border-radius:var(--r);max-width:480px;width:100%;padding:38px 32px 28px;box-shadow:0 30px 70px rgba(59,47,44,.3);text-align:left;animation:pop-in .45s cubic-bezier(.2,.8,.2,1)}
.pop-card::before{content:"";position:absolute;inset:0 0 auto;height:8px;border-radius:var(--r) var(--r) 0 0;background:linear-gradient(90deg,var(--apricot),var(--blush),var(--pistachio))}
.pop-card h2{font-size:clamp(28px,4.4vw,36px);margin-top:12px}
.pop-card h2 em,.club-hero h1 em,.club-final h2 em,.why h2 em,.meet h2 em,.club-cards + p em,.section-head h2 em{color:var(--berry)}
.pop-card p{color:var(--body-ink);margin:12px 0 0}
.pop-card .join{margin-top:18px}
.pop-x{position:absolute;top:14px;right:14px;width:40px;height:40px;border-radius:50%;border:0;background:var(--mist);color:var(--ink);font-size:24px;line-height:1;cursor:pointer}
.pop-x:hover{background:var(--blush)}
.pop-no{border:0;background:none;color:var(--muted);font:inherit;font-size:14px;text-decoration:underline;cursor:pointer;padding:4px 0;margin-top:6px}
.pop-hand{position:absolute;right:26px;bottom:24px;font-size:20px;transform:rotate(-3deg)}
.pop .join.done ~ .pop-no{display:none}
@keyframes pop-in{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
@media (max-width:480px){.pop-card{padding:34px 22px 22px}.pop-hand{display:none}}
@media (prefers-reduced-motion:reduce){.pop-card{animation:none}}

/* ---------- photo placeholder (until real photos are added) ---------- */
.ph{width:100%;height:100%;min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:repeating-linear-gradient(-45deg,var(--blush),var(--blush) 14px,#F6DCDB 14px,#F6DCDB 28px);color:var(--body-ink);text-align:center;padding:20px}
.ph span{font-family:var(--display);font-size:22px}
.ph small{font-size:12px;color:var(--muted)}

/* ---------- why book ---------- */
.why-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(30px,5vw,80px);align-items:center}
.why-photo{margin:0;position:relative}
.why-photo .shot{aspect-ratio:4/5;transform:rotate(-1.6deg)}
.why-photo figcaption{position:absolute;right:-6px;bottom:-18px;background:var(--apricot);padding:8px 18px;border-radius:100px;transform:rotate(-3deg);box-shadow:0 8px 20px rgba(59,47,44,.1);font-size:22px}
.why .points{margin-top:26px}
@media (max-width:900px){.why-grid{grid-template-columns:1fr}.why-photo{max-width:440px}}

/* ---------- Bake Shop page ---------- */
.club-hero{background:var(--ink);color:var(--shell);padding:clamp(56px,8vw,110px) 0 clamp(64px,8vw,110px);overflow:hidden}
.club-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,72px);align-items:center}
.club-hero h1{color:var(--shell)}
.club-hero h1 em{color:var(--rose)}
.club-hero .lede{color:#E9DFDA;margin-top:22px}
.club-label{color:#D9CEC8}
.club-label::before{background:var(--rose)}
.club-note{display:block;margin-top:18px;color:var(--rose);transform:rotate(-2deg);transform-origin:left}
.club-collage{position:relative;height:clamp(340px,40vw,520px)}
.club-collage .shot{position:absolute;box-shadow:0 24px 50px rgba(0,0,0,.28)}
.club-collage .c1{left:0;top:6%;width:62%;aspect-ratio:4/3;transform:rotate(-3deg)}
.club-collage .c2{right:0;top:0;width:48%;aspect-ratio:4/3;transform:rotate(3deg)}
.club-collage .c3{right:12%;bottom:0;width:42%;aspect-ratio:4/5;transform:rotate(-1.5deg)}
.club-pin{position:absolute;left:8%;bottom:10%;z-index:3;background:var(--apricot);color:var(--ink);border-radius:100px;padding:10px 20px;font-size:15px;transform:rotate(-3deg);box-shadow:0 8px 20px rgba(0,0,0,.2)}
.club-cards .card{display:flex;flex-direction:column}
.club-cards .when{align-self:flex-start;font-size:12px;letter-spacing:.13em;text-transform:uppercase;font-weight:500;background:rgba(253,249,246,.7);border-radius:100px;padding:5px 12px;margin-bottom:14px}
.club-final{background:var(--blush);text-align:center;padding:clamp(60px,8vw,100px) 0}
.club-final h2{margin-top:12px}
.club-final p{color:var(--body-ink);margin:14px auto 0;max-width:46ch}
.club-final .club-label{color:var(--muted)}
.club-final .club-label::before{background:var(--berry)}
.club-final .join{margin:24px auto 0;text-align:left}
.club-final .label{justify-content:center}
@media (max-width:940px){.club-hero-grid{grid-template-columns:1fr}.club-collage{height:380px;max-width:560px}}
@media (max-width:480px){.club-collage{height:300px}}

/* cards sitting on a coloured band: keep each card visible against it */
.band .cards > .card:nth-child(4n+2){background:var(--shell)}

/* ---------- Bake Club (subscribe and save) on the Bake Shop page ---------- */
.band--apricot{background:var(--apricot)}
.club-sub h2 em{color:var(--berry)}
.club-sub-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,80px);align-items:center}
.club-perks{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:10px}
.club-perks li{position:relative;padding-left:22px;font-size:17px;color:var(--body-ink)}
.club-perks li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:9px;border-radius:50%;background:var(--berry)}
.club-perks b{font-weight:500;color:var(--ink)}
.club-examples{position:relative;display:grid;gap:22px;padding:10px 0 40px}
.club-ex{background:var(--shell);border-radius:var(--r);padding:24px 28px;box-shadow:0 20px 50px rgba(59,47,44,.1);display:flex;flex-direction:column;gap:4px}
.club-ex.ex1{transform:rotate(-1.6deg)}
.club-ex.ex2{transform:rotate(1.8deg);margin-left:clamp(0px,4vw,48px)}
.club-ex .ex-k{font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);font-weight:500}
.club-ex b{font-family:var(--display);font-weight:300;font-size:clamp(28px,3vw,36px);line-height:1.1}
.club-ex span:last-child{color:var(--body-ink)}
.club-ex-note{position:absolute;right:6px;bottom:0;transform:rotate(-3deg)}
@media (max-width:900px){.club-sub-grid{grid-template-columns:1fr}}