:root{
    --brown:#8B4A24; --cream:#FFF8ED; --gold:#F4B942; --ink:#1C1A17; --grey:#B8B1A7;
    --cream-2:#FBEEDB;            /* slightly deeper cream for panels */
    --gold-soft:#FBE3AE;          /* tint of gold for placeholders */
    --line:#E9DFD1;               /* hairlines, from grey on cream */
    --radius:clamp(14px,12px + .6vw,22px);
    --wrap:1120px;
  }
  *,*::before,*::after{box-sizing:border-box}
  html{scroll-behavior:smooth;scroll-padding-top:84px}
  body{margin:0;background:var(--cream);color:var(--ink);font-family:"Figtree",system-ui,sans-serif;font-size:var(--step-0);line-height:1.6;-webkit-font-smoothing:antialiased}
  img{max-width:100%;display:block}
  a{color:var(--brown)}
  h1,h2,h3,.serif{font-family:"Fraunces",Georgia,serif;font-weight:600;font-variation-settings:"SOFT" 100,"WONK" 1;color:var(--brown);line-height:1.15;margin:0;letter-spacing:-.01em}
  h1{font-size:clamp(2.3rem,1.5rem + 3.4vw,4.5rem);line-height:1.05}
  h2{font-size:var(--step-4)}
  h3{font-size:var(--step-2)}
  p{margin:0}
  .wrap{max-width:none;margin:0;padding-inline:var(--gutter)}
  section{padding:var(--space-xl) 0}
  .eyebrow{font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--brown);opacity:.8;margin-bottom:12px}
  .lede{font-size:1.1rem;color:#4a3f36;max-width:36em}
  .section-head{max-width:640px;margin-bottom:40px}
  .section-head p{margin-top:14px}

  /* Buttons */
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 1rem/1 "Figtree",sans-serif;background:var(--gold);color:var(--ink);border:0;border-radius:999px;padding:16px 28px;text-decoration:none;cursor:pointer;transition:transform .15s ease,background .15s ease}
  .btn:hover{background:#efac2a;transform:translateY(-1px)}
  .btn:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--brown);outline-offset:3px}
  .btn-sm{padding:11px 20px;font-size:.95rem}
  .link{font-weight:600;color:var(--brown);text-decoration:none;border-bottom:1.5px solid rgba(139,74,36,.35);padding-bottom:2px}
  .link:hover{border-color:var(--brown)}

  /* TBC placeholders */
  .tbc{display:inline-block;font:700 .68rem/1 "Figtree",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--brown);background:var(--gold-soft);border-radius:6px;padding:4px 7px;vertical-align:.12em;margin-right:6px}
  .tbc-note{color:#7a6f64;font-style:italic}
  .example{display:inline-block;font:600 .7rem/1 "Figtree",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#7a6f64;border:1px dashed var(--grey);border-radius:6px;padding:4px 7px}

  /* Header */
  header.site{position:sticky;top:0;z-index:10;background:rgba(255,248,237,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
  header.site .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
  header.site .logo img{height:30px;width:auto}

  /* Photo placeholders */
  .ph{position:relative;border-radius:var(--radius);background:var(--gold-soft);display:grid;place-items:center;overflow:hidden}
  .ph img{width:28%;max-width:150px;opacity:.55}
  .ph.cream{background:var(--cream-2)}
  .ph::after{content:"Photo placeholder";position:absolute;bottom:14px;left:16px;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--brown);opacity:.55}

  /* Hero */
  .hero{padding:48px 0 72px}
  .hero .wrap{display:grid;gap:40px}
  .hero p.lede{margin-top:20px}
  .hero .actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 26px;margin-top:32px}
  .hero .ph{aspect-ratio:4/3;border-radius:200px 200px var(--radius) var(--radius)}

  /* Order */
  #order{background:var(--cream-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .order-grid{display:grid;gap:24px}
  .card{background:#FFFCF6;border-radius:var(--radius);padding:24px;box-shadow:0 1px 0 var(--line),0 10px 30px -18px rgba(139,74,36,.35)}
  .bake{background:var(--brown);color:var(--cream);position:relative;overflow:hidden}
  .bake .eyebrow{color:var(--gold);opacity:1}
  .bake .date{font-family:"Fraunces",serif;font-weight:600;font-variation-settings:"SOFT" 100,"WONK" 1;font-size:2.1rem;line-height:1.1;color:var(--cream)}
  .bake dl{margin:24px 0 0;display:grid;gap:14px}
  .bake dt{font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
  .bake dd{margin:2px 0 0}
  .bake .tbc{background:rgba(244,185,66,.25);color:var(--cream)}
  .bake .example{color:var(--cream);border-color:rgba(255,248,237,.5);margin-top:22px}
  .bake .mark{position:absolute;right:-30px;bottom:-26px;width:150px;opacity:.12;filter:brightness(0) invert(1)}

  form h3{margin-bottom:6px}
  .form-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:8px}
  .product{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px 16px;padding:18px 0;border-bottom:1px solid var(--line)}
  .product .name{font-weight:600}
  .product .desc{font-size:.9rem;color:#7a6f64}
  .product .price{font-weight:600;color:var(--brown);font-size:.95rem;margin-top:2px}
  .stepper{display:inline-flex;align-items:center;border:1.5px solid var(--line);border-radius:999px;background:var(--cream)}
  .stepper button{width:38px;height:38px;border:0;background:none;font:600 1.25rem/1 "Figtree",sans-serif;color:var(--brown);cursor:pointer;border-radius:999px}
  .stepper button:hover{background:var(--gold-soft)}
  .stepper button:disabled{color:var(--grey);cursor:default;background:none}
  .stepper output{min-width:28px;text-align:center;font-weight:600}
  .total{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0 4px;font-weight:600}
  .total strong{font-family:"Fraunces",serif;font-variation-settings:"SOFT" 100,"WONK" 1;font-size:1.7rem;color:var(--brown)}
  fieldset{border:0;padding:0;margin:26px 0 0}
  legend,label{font-weight:600;font-size:.92rem;display:block;margin-bottom:6px}
  .fields{display:grid;gap:16px;margin-top:26px}
  input[type=text],input[type=email],input[type=tel]{width:100%;font:inherit;padding:13px 16px;border:1.5px solid var(--line);border-radius:12px;background:var(--cream);color:var(--ink)}
  input[type=text]:focus,input[type=email]:focus,input[type=tel]:focus{border-color:var(--brown);outline:none;background:#FFFCF6}
  .choices{display:grid;gap:10px}
  .choice{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1.5px solid var(--line);border-radius:12px;cursor:pointer;font-weight:400;margin:0;background:var(--cream)}
  .choice:has(input:checked){border-color:var(--brown);background:#FFFCF6}
  .choice input{accent-color:var(--brown);margin-top:4px}
  .choice b{display:block;font-weight:600}
  .choice span{font-size:.9rem}
  .pay{margin-top:28px}
  .pay .btn{width:100%;padding:18px;font-size:1.05rem}
  .pay p{font-size:.85rem;color:#7a6f64;text-align:center;margin-top:12px}
  .pay .msg{display:none;margin-top:14px;padding:12px 16px;border-radius:12px;background:var(--gold-soft);color:var(--ink);font-size:.9rem;text-align:left}

  /* Steps */
  .steps{display:grid;gap:20px;counter-reset:step;list-style:none;padding:0;margin:0}
  .steps li{padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:#FFFCF6}
  .steps .num{width:44px;height:44px;border-radius:50%;background:var(--gold);color:var(--ink);display:grid;place-items:center;font-family:"Fraunces",serif;font-variation-settings:"SOFT" 100,"WONK" 1;font-weight:600;font-size:1.25rem;margin-bottom:18px}
  .steps p,.why p{margin-top:8px;color:#4a3f36}
  .after{margin-top:32px}

  /* Why */
  #why{padding-top:24px}
  .why{display:grid;gap:36px}
  .why .ph{aspect-ratio:16/9;margin-bottom:20px}
  .side-ph{display:none}
  .why .ph img{width:22%}

  /* About */
  #about{background:var(--cream-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .about{display:grid;gap:36px;align-items:center}
  .about .ph{aspect-ratio:1/1;border-radius:50%;max-width:280px;width:100%;margin:0 auto}
  .about .ph::after{left:50%;transform:translateX(-50%);bottom:12%;white-space:nowrap}
  .about p{margin-top:18px;color:#4a3f36}
  .about details{margin-top:22px}
  .about summary{list-style:none;cursor:pointer;display:inline-block}
  .about summary::-webkit-details-marker{display:none}
  .about details[open] summary{margin-bottom:4px}

  /* FAQ */
  .faq{max-width:780px}
  .faq details{border-bottom:1px solid var(--line)}
  .faq details:first-of-type{border-top:1px solid var(--line)}
  .faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-weight:600;font-size:1.05rem}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary::after{content:"";flex:none;width:30px;height:30px;border-radius:50%;background:var(--gold-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 3v10M3 8h10' stroke='%238B4A24' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat;transition:transform .2s ease}
  .faq details[open] summary::after{transform:rotate(45deg)}
  .faq .a{padding:0 50px 24px 0;color:#4a3f36}
  /* FAQ centred: heading one line >=700px, accordion ~760px column */
  #faq .faq-head{max-width:none;margin-left:auto;margin-right:auto;text-align:center}
  #faq .faq-head h2{text-wrap:balance}
  #faq .faq{max-width:760px;margin-left:auto;margin-right:auto}
  @media (min-width:700px){#faq .faq-head h2{white-space:nowrap}}

  /* Footer */
  footer{background:var(--brown);color:var(--cream);padding:56px 0 36px}
  footer .logo img{height:34px;width:auto}
  footer .cols{display:grid;gap:22px;margin-top:22px}
  footer p{opacity:.9;font-size:.95rem}
  footer .tbc{background:rgba(244,185,66,.25);color:var(--cream)}
  footer .tbc-note{color:rgba(255,248,237,.75)}
  footer .legal{margin-top:36px;padding-top:22px;border-top:1px solid rgba(255,248,237,.2);font-size:.85rem;opacity:.8}

  /* Larger screens */
  @media (min-width:720px){
    section{padding:104px 0}
    .wrap{padding:0 40px}
    .steps,.why{grid-template-columns:repeat(3,1fr)}
    .why .ph{aspect-ratio:3/2}
    .card{padding:28px}
    .about .ph{max-width:440px}
    .fields.two{grid-template-columns:1fr 1fr}
    .choices{grid-template-columns:1fr 1fr}
    footer .cols{grid-template-columns:1.2fr 1fr}
  }
  @media (min-width:960px){
    header.site .wrap{height:76px}
    header.site .logo img{height:34px}
    .hero{padding:72px 0 112px}
    .hero .wrap{grid-template-columns:1.1fr .9fr;align-items:center;gap:64px}
    .order-grid{grid-template-columns:360px 1fr;align-items:start;gap:32px}
    .order-side{position:sticky;top:104px;display:grid;gap:24px}
    .side-ph{display:grid;aspect-ratio:1/1}
    .side-ph img{width:34%}
    .card.formcard{padding:40px}
    .about{grid-template-columns:.9fr 1.1fr;gap:72px}
  }

  p{max-width:65ch}
  .preview-note{background:var(--gold);color:var(--ink);text-align:center;font:600 var(--step--1)/1.4 "Figtree",sans-serif;padding:8px var(--gutter)}
  .notfound{min-height:60vh;display:grid;place-items:center;text-align:center}
  .notfound p{margin:18px auto 28px}
#payBtn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;pointer-events:auto}

  /* Collect or delivery */
  .fulfil{border:0;margin:28px 0 0;padding:0;min-width:0}
  .fulfil legend{font-family:"Fraunces",Georgia,serif;font-weight:600;font-variation-settings:"SOFT" 100,"WONK" 1;color:var(--brown);font-size:var(--step-1,1.25rem);line-height:1.2;letter-spacing:-.01em;padding:0;margin:0 0 16px}
  .pills{display:grid;grid-template-columns:1fr;gap:12px}
  .pill{position:relative;display:block;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .pill input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
  .pill>span{display:flex;flex-direction:column;justify-content:center;gap:6px;min-height:76px;border:2px solid var(--line);border-radius:18px;background:#fff;padding:16px 20px 16px 64px;box-sizing:border-box;position:relative;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}
  .pill>span::before{content:"";position:absolute;left:22px;top:50%;width:24px;height:24px;margin-top:-12px;border-radius:50%;border:2px solid var(--grey);box-sizing:border-box;background:#fff;transition:border-color .15s ease,box-shadow .15s ease}
  .pill strong{display:block;color:var(--ink);font-family:"Figtree",system-ui,sans-serif;font-weight:700;font-size:1.02rem;line-height:1.35}
  .pill small{display:block;color:#6e655b;font-size:.9rem;line-height:1.45}
  .pill:hover>span{border-color:var(--gold)}
  .pill:hover>span::before{border-color:var(--brown)}
  .pill input:checked+span{border-color:var(--brown);background:var(--cream);box-shadow:0 4px 14px rgba(139,74,36,.12)}
  .pill input:checked+span::before{border-color:var(--brown);box-shadow:inset 0 0 0 4px #fff,inset 0 0 0 12px var(--brown)}
  .pill input:focus-visible+span{outline:3px solid var(--gold);outline-offset:3px}
  .fulfil-note{margin:14px 0 0;font-size:.9rem;color:#6e655b}
  .fulfil-err{margin:10px 0 0;font-weight:600;color:#a3321b;font-size:.92rem}
  .sums{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);font-size:.95rem}
  .sums>div{display:flex;justify-content:space-between;gap:16px;padding:5px 0}
  .nudge{margin:12px 0 4px;padding:12px 16px;border-radius:12px;line-height:1.45;background:var(--gold-soft);color:var(--brown);font-weight:600;font-size:.9rem}

  /* ===== Polish pass (24 Oct 2026) ===== */
  /* Consistent section rhythm: one fluid value for every colour transition */
  section{padding:clamp(48px,36px + 3vw,80px) 0}
  @media (min-width:720px){ section{padding:clamp(56px,40px + 3vw,84px) 0} }
  .hero{padding:40px 0 48px}
  @media (min-width:960px){ .hero{padding:64px 0 72px} }
  #why{padding-top:clamp(48px,36px + 3vw,80px)}
  .section-head{margin-bottom:32px}
  .after{margin-top:24px}

  /* Hero headline highlight: hand-drawn Golden underline */
  .hl{position:relative;white-space:nowrap;z-index:0}
  .hl::after{content:"";position:absolute;left:-2%;right:-2%;bottom:-.06em;height:.34em;z-index:-1;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 24' preserveAspectRatio='none'%3E%3Cpath d='M4 15 C 60 6, 120 5, 180 9 S 270 14, 296 8' fill='none' stroke='%23F4B942' stroke-width='11' stroke-linecap='round'/%3E%3Cpath d='M18 20 C 90 14, 170 13, 260 17' fill='none' stroke='%23F4B942' stroke-width='4' stroke-linecap='round' opacity='.7'/%3E%3C/svg%3E") center/100% 100% no-repeat}
  @media (max-width:400px){ .hl{white-space:normal} }

  /* Product rows: small square thumbnail | name+desc | stepper. Hard-capped sizes so it can never blow up. */
  .product{display:flex;align-items:center;gap:16px;max-width:620px}
  .product>.info,.product>div:not(.thumb):not(.stepper){flex:1 1 auto;min-width:0}
  .product .stepper{flex:none;margin-left:auto}
  .thumb{flex:none;box-sizing:border-box;width:72px;height:72px;min-width:72px;max-width:72px;max-height:72px;border-radius:14px;background:var(--gold-soft);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border:1.5px dashed rgba(139,74,36,.3)}
  .thumb img{display:block;flex:none;width:32px;height:32px;max-width:32px;max-height:32px;object-fit:contain;opacity:.5}
  .thumb::after{content:"Photo";position:absolute;bottom:4px;left:0;right:0;text-align:center;font:700 .55rem/1 "Figtree",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--brown);opacity:.6}
  @media (max-width:600px){
    .product{gap:12px}
    .thumb{width:56px;height:56px;min-width:56px;max-width:56px;max-height:56px;border-radius:12px}
    .thumb img{width:26px;height:26px;max-width:26px;max-height:26px}
    .thumb::after{display:none}
  }

  .fill{background:rgba(244,185,66,.35);border-radius:4px;padding:0 4px;font-style:italic;color:#5a3a20}
  .story-grid{display:grid;gap:36px;align-items:start}
  .story-grid .ph{aspect-ratio:4/5;max-width:420px;width:100%}
  @media (min-width:960px){ .story-grid{grid-template-columns:1.2fr .8fr;gap:64px} .story-grid .ph{position:sticky;top:104px} }
  .page-cta{margin-top:36px;display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center}
  @media (max-width:420px){
    .stepper button{width:34px;height:34px}
    .stepper output{min-width:22px}
  }