
/* Layout: arched bakery-window hero, a plum "story" band, an interactive flavour dial as the signature moment, then menu → gifts → club → business. Single warm light look (brand has no dark mode). */
.hp{
  --plum:#49315D; --deep:#2f1f3d; --cherry:#A61C24; --cream:#FBF6F3; --paper:#F3E8E3;
  --gold:#C8912F; --ink:#2a2230; --muted:#6f6276; --line:#e8dbe1; --crust:#d9a35f;
  --f-display:'Amiri',Georgia,serif; --f-body:'Cairo',system-ui,sans-serif; --f-script:'Parisienne',cursive;
  --wrap:1180px; --r:20px;
  color-scheme:light;
}
.hp,.hp *{box-sizing:border-box}
.hp{margin:0;background:var(--cream);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.75}
.hp::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--cream)}
:where(.hp) img{max-width:100%;display:block}
:where(.hp) a{color:inherit}
.hp-wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}html .hp h1,html .hp h2,html .hp h3{font-family:var(--f-display);text-wrap:balance;margin:0;line-height:1.25;font-weight:700}html .hp h2{font-size:clamp(30px,4.2vw,48px);color:var(--plum)}
.hp-eyebrow{font-weight:800;font-size:13px;color:var(--cherry);letter-spacing:.3px;margin-bottom:6px}
.hp-lead{color:var(--muted);font-size:clamp(15px,1.4vw,17.5px);max-width:58ch;margin:10px 0 0}
:where(.hp) section{padding-block:clamp(56px,8vw,104px)}
.hp-btn{display:inline-flex;align-items:center;gap:8px;font:700 16px var(--f-body);padding:13px 26px;border-radius:999px;text-decoration:none;border:2px solid transparent;transition:transform .2s,background .2s,box-shadow .2s;cursor:pointer}
.hp-btn:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.hp-btn-primary{background:var(--cherry);color:#fff;box-shadow:0 8px 22px -10px rgba(166,28,36,.7)}
.hp-btn-primary:hover{transform:translateY(-2px);background:#8f171e}
.hp-btn-ghost{border-color:var(--plum);color:var(--plum)}
.hp-btn-ghost:hover{background:var(--plum);color:#fff}

/* header */
.hp-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(251,246,243,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hp-nav{display:flex;align-items:center;gap:24px;height:68px}
.hp-logo{display:flex;align-items:baseline;gap:8px;text-decoration:none}
.hp-logo .hp-s{font-family:var(--f-script);font-size:30px;color:var(--cherry);line-height:1}
.hp-logo .hp-a{font-family:var(--f-display);font-size:17px;color:var(--plum)}
.hp-links{display:flex;gap:22px;margin-inline-start:auto;font-weight:600;font-size:15px}
.hp-links a{text-decoration:none;color:var(--plum);opacity:.85}
.hp-links a:hover{opacity:1;color:var(--cherry)}
.hp-nav .hp-btn{padding:9px 20px;font-size:15px}
.hp-lang{font:700 13px var(--f-body);color:var(--muted);text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:4px 10px}
@media (max-width:900px){.hp-links{display:none}.hp-nav{gap:12px}.hp-nav .hp-btn{margin-inline-start:auto}}
.hp-nav .hp-btn{white-space:nowrap}
@media (max-width:480px){.hp-logo .hp-a{display:none}.hp-logo .hp-s{font-size:26px}}

/* hero */
.hp-hero{padding-block:clamp(28px,5vw,64px) clamp(48px,7vw,88px)}
.hp-hero .hp-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,72px);align-items:center}
.hp-hero .hp-eyebrow{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);padding:5px 14px;border-radius:999px;font-size:13px;color:var(--plum)}
.hp-hero .hp-eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--cherry);display:inline-block}html .hp .hp-hero h1{font-size:clamp(46px,7.4vw,92px);color:var(--plum);margin-top:18px;line-height:1.12}html .hp .hp-hero h1 em{font-style:normal;color:var(--cherry);position:relative}html .hp .hp-hero h1 em::after{content:"";position:absolute;inset:auto 0 .08em 0;height:.14em;background:var(--gold);opacity:.35;border-radius:4px;z-index:-1}
.hp-hero .hp-lead{font-size:clamp(16px,1.6vw,19px);margin-top:16px}
.hp-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hp-facts{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:34px;padding-top:22px;border-top:1px dashed var(--line)}
.hp-facts div{display:flex;flex-direction:column;line-height:1.3}
.hp-facts b{font-size:22px;color:var(--plum);font-weight:800}
.hp-facts span{font-size:13px;color:var(--muted)}
.hp-arch{position:relative}
.hp-arch .hp-frame{border-radius:999px 999px 28px 28px;overflow:hidden;aspect-ratio:4/5;max-width:100%;box-shadow:0 30px 60px -30px rgba(47,31,61,.55);border:8px solid #fff}
.hp-arch .hp-frame img{width:100%;height:100%;object-fit:cover;object-position:center 35%;animation:hp-slowzoom 16s ease-in-out infinite alternate}
@keyframes hp-slowzoom{to{transform:scale(1.06)}}
.hp-tag{position:absolute;background:#fff;border-radius:16px;padding:10px 14px;box-shadow:0 14px 30px -14px rgba(47,31,61,.45);font-size:13px;line-height:1.35;display:flex;gap:10px;align-items:center}
.hp-tag b{display:block;color:var(--plum);font-size:15px}
.hp-tag.hp-t1{bottom:9%;inset-inline-end:-4%}
.hp-tag.hp-t2{top:14%;inset-inline-start:-6%}
.hp-tag .hp-dot{width:34px;height:34px;border-radius:50%;flex:none;background:repeating-conic-gradient(#e2b779 0 9deg,#c9955a 9deg 18deg);display:grid;place-items:center}
.hp-tag .hp-dot::after{content:"";width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff7 0 18%,transparent 19%),var(--cherry)}
.hp-stamp{position:absolute;top:-14px;inset-inline-end:8%;width:92px;height:92px;border-radius:50%;background:var(--plum);color:var(--cream);display:grid;place-items:center;text-align:center;font-size:12px;line-height:1.3;font-weight:700;transform:rotate(-10deg);box-shadow:0 10px 24px -10px rgba(47,31,61,.7)}
.hp-stamp b{display:block;font-family:var(--f-display);font-size:22px;color:var(--gold)}
@media (max-width:860px){
  .hp-hero .hp-grid{grid-template-columns:1fr}
  .hp-arch{order:-1;max-width:340px;margin:0 auto;width:100%}
  .hp-tag.hp-t2{inset-inline-start:-2%}.hp-tag.hp-t1{inset-inline-end:-2%}
}
.hp-rise{animation:hp-rise .8s cubic-bezier(.2,.7,.2,1) both}
.hp-d1{animation-delay:.08s}.hp-d2{animation-delay:.18s}.hp-d3{animation-delay:.28s}.hp-d4{animation-delay:.4s}
@keyframes hp-rise{from{transform:translateY(16px);opacity:.01}to{transform:none;opacity:1}}

/* story */
.hp-story{background:var(--deep);color:var(--cream);position:relative;overflow:hidden}
.hp-story::before{content:"";position:absolute;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(166,28,36,.42),transparent 65%);top:-260px;inset-inline-start:-200px}
.hp-story .hp-grid{position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,5vw,72px);align-items:center}
.hp-story .hp-eyebrow{color:var(--gold)}
.hp-story blockquote{margin:0;font-family:var(--f-display);font-size:clamp(32px,4.6vw,56px);line-height:1.3;color:#fff}
.hp-story blockquote::before{content:"“";display:block;font-size:1.8em;line-height:.6;color:var(--gold);margin-bottom:6px}
.hp-story .hp-who{margin-top:14px;color:rgba(251,246,243,.75)}
.hp-chapters{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:18px;counter-reset:c}
.hp-chapters li{counter-increment:c;display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start}
.hp-chapters li::before{content:counter(c);width:44px;height:44px;border-radius:50%;border:1.5px solid var(--gold);color:var(--gold);display:grid;place-items:center;font-weight:800;font-size:18px}
.hp-chapters b{display:block;color:#fff;font-size:17px}
.hp-chapters span{color:rgba(251,246,243,.75);font-size:15px}
.hp-story .hp-photo{border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;position:relative}
.hp-story .hp-photo img{width:100%;height:100%;object-fit:cover}
.hp-play{position:absolute;inset:auto 16px 16px 16px;display:flex;align-items:center;gap:12px;background:rgba(47,31,61,.82);backdrop-filter:blur(6px);color:#fff;text-decoration:none;padding:12px 16px;border-radius:16px;font-weight:600}
.hp-play i{width:40px;height:40px;border-radius:50%;background:var(--cherry);display:grid;place-items:center;flex:none;font-style:normal}
.hp-play i::after{content:"";border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent #fff;margin-inline-start:3px}
.hp-play small{display:block;opacity:.75;font-weight:400}
@media (max-width:860px){.hp-story .hp-grid{grid-template-columns:1fr}.hp-story .hp-photo{aspect-ratio:4/3}}

/* flavour dial */
.hp-dial .hp-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:center}
.hp-cupwrap{display:grid;place-items:center;position:relative;padding:20px}
.hp-cupwrap::before{content:"";position:absolute;width:86%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,var(--fl-glow,rgba(166,28,36,.18)),transparent 68%);transition:background .6s}
.hp-cup{position:relative;width:min(380px,78vw);aspect-ratio:1;border-radius:50%;background:repeating-conic-gradient(#ecc890 0 4.5deg,#cf9b5c 4.5deg 9deg);box-shadow:0 30px 50px -24px rgba(90,52,35,.55),inset 0 0 0 3px #b9823f33;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.hp-cup .hp-crust{position:absolute;inset:7%;border-radius:50%;background:radial-gradient(circle at 40% 35%,#ecc58a,#c98d4c 70%,#b07838);box-shadow:inset 0 0 0 2px #a9733a55}
.hp-cup .hp-top{position:absolute;inset:15%;border-radius:50%;background:var(--fl,#3b2a7a);transition:background .6s,transform .7s cubic-bezier(.2,.7,.2,1);box-shadow:inset 0 -10px 24px rgba(0,0,0,.18),inset 0 8px 18px rgba(255,255,255,.18);overflow:hidden}
.hp-cup .hp-top::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 34% 22% at 34% 28%,rgba(255,255,255,.55),transparent 70%)}
.hp-cup .hp-top::after{content:"";position:absolute;inset:0;opacity:0;transition:opacity .5s;background-image:var(--deco,none);background-size:var(--deco-size,26px 26px)}
.hp-cup .hp-top.has-deco::after{opacity:1}
.hp-cup .hp-gar{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.6);opacity:0;transition:all .5s cubic-bezier(.3,1.6,.4,1)}
.hp-cup .hp-gar.hp-on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.hp-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.hp-chip{font:600 15px var(--f-body);border:1.5px solid var(--line);background:#fff;color:var(--plum);border-radius:999px;padding:7px 15px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:all .2s}
.hp-chip i{width:12px;height:12px;border-radius:50%;display:inline-block}
.hp-chip:hover{border-color:var(--plum)}
.hp-chip[aria-pressed="true"]{background:var(--plum);border-color:var(--plum);color:#fff}
.hp-chip:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.hp-flname{font-family:var(--f-display);font-size:clamp(34px,4vw,48px);color:var(--plum);margin-top:24px;line-height:1.2;min-height:1.2em}
.hp-fldesc{margin:16px 0;color:var(--muted);min-height:3.6em;max-width:44ch}
.hp-dial .hp-btn{margin-top:14px}
@media (max-width:860px){.hp-dial .hp-grid{grid-template-columns:1fr}.hp-cupwrap{order:-1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* menu */
.hp-menu{background:var(--paper)}
.hp-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.hp-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px}
.hp-card .hp-sz{align-self:flex-start;display:block;width:fit-content;margin-inline-end:auto;font-size:12px;font-weight:700;color:var(--plum);background:var(--paper);border-radius:999px;padding:2px 10px;margin-bottom:6px}
.hp-card{background:#fff;border-radius:var(--r);overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s;border:1px solid var(--line)}
.hp-card:hover{transform:translateY(-4px);box-shadow:0 22px 40px -24px rgba(47,31,61,.5)}
.hp-card .hp-im{aspect-ratio:1;overflow:hidden;background:#f6ece4;display:grid;place-items:center}
.hp-card .hp-im img{width:100%;height:100%;object-fit:cover}
.hp-card .hp-bd{padding:16px 18px 18px;display:flex;flex-direction:column;gap:2px;flex:1}html .hp .hp-card h3{font-size:22px;color:var(--plum)}
.hp-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.6;flex:1}
.hp-card .hp-pr{margin-top:10px;display:flex;justify-content:space-between;align-items:center;font-weight:700;color:var(--cherry);font-size:14px}
.hp-card .hp-pr span{font-size:13px;color:var(--plum);font-weight:700}
.hp-wholecake{width:72%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 50%,#3b2a7a 0 56%,#d4a066 57% 64%,#f3e2c4 65% 100%);box-shadow:0 18px 30px -16px rgba(90,52,35,.6),inset 0 0 0 6px #e7cfa3;position:relative}
.hp-wholecake::after{content:"";position:absolute;inset:18%;border-radius:50%;background:radial-gradient(ellipse 30% 20% at 35% 30%,rgba(255,255,255,.45),transparent 70%)}
@media (max-width:1000px){.hp-cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:440px){.hp-cards{gap:12px}.hp-card .hp-bd{padding:12px}html .hp .hp-card h3{font-size:19px}.hp-card p{display:none}}

/* gift */
.hp-gift .hp-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:center}
.hp-gift .hp-photo{border-radius:var(--r);overflow:hidden;aspect-ratio:5/4;position:relative}
.hp-gift .hp-photo img{width:100%;height:100%;object-fit:cover;object-position:center 45%}
.hp-note{position:absolute;bottom:18px;inset-inline-start:18px;background:var(--cream);border-radius:12px;padding:12px 16px;max-width:240px;box-shadow:0 14px 30px -16px rgba(0,0,0,.5);transform:rotate(-3deg)}
.hp-note .hp-to{font-family:var(--f-script);font-size:24px;color:var(--cherry);line-height:1;direction:ltr;text-align:left}
.hp-note p{margin:4px 0 0;font-family:var(--f-display);font-size:17px;color:var(--plum);line-height:1.4}
.hp-steps3{display:grid;gap:14px;margin-top:26px}
.hp-steps3 div{display:flex;gap:14px;align-items:flex-start}
.hp-steps3 b{flex:none;width:36px;height:36px;border-radius:50%;background:var(--paper);color:var(--cherry);display:grid;place-items:center;font-weight:800}
.hp-steps3 span{padding-top:5px}
@media (max-width:860px){.hp-gift .hp-grid{grid-template-columns:1fr}}

/* club */
.hp-club{background:linear-gradient(160deg,var(--plum),var(--deep));color:var(--cream)}html .hp .hp-club h2{color:#fff}
.hp-club .hp-lead{color:rgba(251,246,243,.78)}
.hp-club .hp-eyebrow{color:var(--gold)}
.hp-perks{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.hp-perk{border:1px solid rgba(251,246,243,.18);border-radius:var(--r);padding:20px;background:rgba(255,255,255,.04)}
.hp-perk .hp-ic{font-family:var(--f-display);font-size:34px;color:var(--gold);line-height:1}
.hp-perk b{display:block;color:#fff;font-size:17px;margin-top:10px}
.hp-perk span{font-size:14px;color:rgba(251,246,243,.75)}
.hp-ladder{margin-top:34px;display:flex;align-items:flex-end;gap:10px}
.hp-rung{flex:1;border-radius:14px 14px 4px 4px;background:rgba(255,255,255,.08);border:1px solid rgba(251,246,243,.18);padding:12px;display:flex;flex-direction:column;justify-content:flex-end;min-width:0}
.hp-rung b{color:var(--gold);font-size:20px;font-weight:800}
.hp-rung span{font-size:13px;color:#fff;line-height:1.4}
.hp-rung.hp-top{background:linear-gradient(180deg,rgba(200,145,47,.35),rgba(200,145,47,.08));border-color:var(--gold)}
.hp-club .hp-cta .hp-btn-ghost{border-color:var(--cream);color:var(--cream)}
.hp-club .hp-cta .hp-btn-ghost:hover{background:var(--cream);color:var(--plum)}
@media (max-width:860px){.hp-perks{grid-template-columns:1fr 1fr}}
@media (max-width:440px){.hp-perks{grid-template-columns:1fr}}

/* business */
.hp-biz .hp-cols{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:34px}
.hp-bz{position:relative;border-radius:var(--r);overflow:hidden;min-height:340px;display:flex;align-items:flex-end;color:#fff;text-decoration:none}
.hp-bz img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.hp-bz:hover img{transform:scale(1.05)}
.hp-bz::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(47,31,61,.92) 8%,rgba(47,31,61,.15) 70%)}
.hp-bz .hp-in{position:relative;z-index:1;padding:24px}html .hp .hp-bz h3{font-size:30px}
.hp-bz p{margin:4px 0 14px;opacity:.85;max-width:40ch}
.hp-bz .hp-go{display:inline-flex;gap:8px;align-items:center;font-weight:700;background:#fff;color:var(--plum);padding:8px 16px;border-radius:999px;font-size:14px}
@media (max-width:760px){.hp-biz .hp-cols{grid-template-columns:1fr}.hp-bz{min-height:280px}}

/* strip + footer */
.hp-strip{background:var(--cherry);color:#fff;padding-block:18px}
.hp-strip .hp-wrap{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 34px;font-weight:700}
.hp-strip span::before{content:"✦";color:var(--gold);margin-inline-end:8px}
.hp-footer{background:var(--deep);color:rgba(251,246,243,.8);padding-block:56px 110px;font-size:15px}
.hp-footer .hp-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}html .hp .hp-footer h4{color:#fff;margin:0 0 10px;font-size:16px}
.hp-footer a{text-decoration:none}
.hp-footer a:hover{color:#fff}
.hp-footer .hp-ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}
.hp-footer .hp-logo .hp-a{color:var(--cream)}
.hp-footer .hp-copy{margin-top:36px;padding-top:18px;border-top:1px solid rgba(251,246,243,.15);font-size:13px;opacity:.7}
@media (max-width:760px){.hp-footer .hp-cols{grid-template-columns:1fr}}

/* mobile order bar */
.hp-mbar{display:none}
@media (max-width:760px){
  .hp-mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:55;padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));background:rgba(251,246,243,.94);backdrop-filter:blur(10px);border-top:1px solid var(--line);gap:10px;align-items:center}
  .hp-mbar .hp-btn{flex:1;justify-content:center}
  .hp-mbar .hp-from{font-size:13px;color:var(--muted);line-height:1.3}
  .hp-mbar .hp-from b{display:block;color:var(--plum);font-size:16px}
}

/* offer: announcement bar + featured banner (only when an active offer exists) */
.hp-announce{background:var(--cherry);color:#fff;font-size:14px;font-weight:700;text-align:center;padding-block:8px}
.hp-announce a{color:#fff;text-decoration:underline;text-underline-offset:3px;margin-inline-start:8px}
.hp-offer{padding-block:0 clamp(40px,6vw,72px)}
.hp-ob{position:relative;display:grid;grid-template-columns:1.1fr .9fr;align-items:stretch;border-radius:28px;overflow:hidden;background:var(--plum);color:var(--cream);box-shadow:0 30px 60px -36px rgba(47,31,61,.8)}
.hp-ob .hp-tx{padding:clamp(24px,4vw,48px);position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;gap:6px}
.hp-ob .hp-tx::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(166,28,36,.55),transparent 65%);top:-200px;inset-inline-start:-160px;z-index:-1}
.hp-ob .hp-nm{font-weight:700;color:var(--gold);font-size:15px}
.hp-ob .hp-big{font-family:var(--f-display);font-size:clamp(48px,7vw,84px);line-height:1.05;color:#fff}
.hp-ob .hp-sub{color:rgba(251,246,243,.85);font-size:16px}
.hp-ob .hp-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:14px}
.hp-ob .hp-when{border:1px solid rgba(251,246,243,.35);border-radius:999px;padding:5px 14px;font-size:13px}
.hp-ob .hp-ph{position:relative;min-height:240px}
.hp-ob .hp-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hp-ob .hp-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(270deg,var(--plum) 0,rgba(73,49,93,0) 30%)}
.hp-ob .hp-tear{position:absolute;top:18px;inset-inline-end:18px;z-index:2;background:var(--gold);color:var(--deep);font-weight:800;font-size:13px;padding:6px 12px;border-radius:999px}
@media (max-width:760px){.hp-ob{grid-template-columns:1fr}.hp-ob .hp-ph{order:-1;min-height:200px}.hp-ob .hp-ph::after{background:linear-gradient(0deg,var(--plum) 0,rgba(73,49,93,0) 45%)}}
body.hp-no-offer .hp-announce,body.hp-no-offer .hp-offer{display:none}

/* account + cart in header; guest vs signed-in */
.hp-acct{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--plum);font:700 14px var(--f-body);border:1.5px solid var(--line);border-radius:999px;padding:5px 12px 5px 6px;background:#fff;white-space:nowrap}
.hp-acct:hover{border-color:var(--plum)}
.hp-acct .hp-av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--paper);color:var(--plum);flex:none}
.hp-acct .hp-av svg{width:16px;height:16px}
.hp-acct .hp-pts{background:var(--gold);color:#fff;border-radius:999px;padding:1px 8px;font-size:12px}
.hp-acct .hp-in{display:none}
.hp-acct .hp-out{display:contents}
.hp.hp-signed .hp-acct .hp-out{display:none}
.hp.hp-signed .hp-acct .hp-in{display:inline-flex;align-items:center;gap:8px}
.hp.hp-signed .hp-acct .hp-av{background:var(--plum);color:#fff;font-weight:800;font-size:13px}
.hp-cart{position:relative;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--line);background:#fff;display:grid;place-items:center;color:var(--plum);flex:none}
.hp-cart svg{width:19px;height:19px}
.hp-cart b{position:absolute;top:-4px;inset-inline-end:-4px;background:var(--cherry);color:#fff;font-size:11px;min-width:18px;height:18px;border-radius:999px;display:grid;place-items:center;padding:0 4px}
@media (max-width:900px){.hp-acct .hp-lbl,.hp-acct .hp-pts{display:none}.hp-acct{padding:5px}}
@media (max-width:480px){.hp-lang{display:none}.hp-nav .hp-btn{padding:8px 14px;font-size:14px}}
.hp-mypts{margin-top:30px;border-radius:var(--r);padding:20px 22px;background:rgba(255,255,255,.07);border:1px solid rgba(251,246,243,.2);display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;justify-content:space-between}
.hp-mypts .hp-big{font-size:30px;font-weight:800;color:#fff;line-height:1.1}
.hp-mypts .hp-big small{font-size:14px;color:var(--gold);font-weight:700}
.hp-mypts .hp-bar{flex:1 1 220px;min-width:0}
.hp-mypts .hp-track{height:10px;border-radius:999px;background:rgba(255,255,255,.15);overflow:hidden;margin-top:8px}
.hp-mypts .hp-track i{display:block;height:100%;width:80%;background:linear-gradient(90deg,var(--gold),#e7b860);border-radius:999px}
.hp-mypts .hp-mnote{font-size:14px;color:rgba(251,246,243,.85)}
.hp-mypts .hp-in{display:none}
.hp.hp-signed .hp-mypts .hp-out{display:none!important}
.hp.hp-signed .hp-mypts .hp-in{display:contents}

/* ---------------------------------------------------------------------------
   Additions the prototype does not draw (it is a static mock):
   the real flavour photo inside the dial, the smaller cards for the other
   active offers, and a few interop fixes against the shared stylesheet.
   --------------------------------------------------------------------------- */
html[lang="en"] .hp{--f-display:'Fraunces',Georgia,serif;--f-body:'Jost',system-ui,sans-serif}
html[lang="ar"] .hp{--f-display:'Amiri',Georgia,serif;--f-body:'Cairo',system-ui,sans-serif}
.hp{min-height:100vh}
html,body{overflow-x:clip}
.hp [hidden]{display:none!important}
.hp-arrowfix{display:inline-block}

/* dial: real photo in the same circular frame; the colour disc is the fallback */
.hp-top img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center 62%;opacity:0;transition:opacity .5s}
.hp-top img.on{opacity:1}
.hp-top.hp-has-photo::before{display:none}
.hp-top.hp-has-photo{box-shadow:inset 0 -10px 24px rgba(0,0,0,.12)}

/* header: the cart is the shared .cartbtn; keep it on the prototype's look */
.hp-cart.cartbtn{width:40px;height:40px;border:1.5px solid var(--line);background:#fff;color:var(--plum);transform:none}
.hp-cart.cartbtn:hover{border-color:var(--plum);transform:none}
.hp-nav .hp-lang{cursor:pointer;background:transparent}
.hp-acct{cursor:pointer}

/* offer banner: no photo -> single column */
.hp-ob.ohero--noimg{grid-template-columns:1fr}
.hp-ob.ohero--noimg .hp-ph{display:none}
.hp-ob .hp-big .pct{font-size:.5em;margin-inline-start:.1em;color:var(--gold)}

/* other active offers: small cards under the banner */
.hp-others{padding-block:0 clamp(40px,6vw,72px)}
.hp-others .hp-wrap{margin-top:calc(-1*clamp(16px,3vw,32px))}
.hp-ogrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.hp-others .offer-card,.hp-others .offer-card--feat,.hp-others .offer-card--glass{position:relative;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:none;display:flex;flex-direction:column;gap:2px;backdrop-filter:none;transition:transform .25s,box-shadow .25s}
.hp-others .offer-card:hover{transform:translateY(-3px);box-shadow:0 18px 34px -22px rgba(47,31,61,.5)}
.hp-others .offer-card__occ,.hp-others .offer-card--glass .offer-card__occ{font:700 14px var(--f-body);color:var(--plum);margin:0}
.hp-others .offer-card__disc{display:flex;align-items:baseline;gap:8px;margin:0}
.hp-others .offer-card__disc b,.hp-others .offer-card--glass .offer-card__disc b{font-family:var(--f-display);font-size:34px;line-height:1.1;color:var(--cherry)}
.hp-others .offer-card__disc>span,.hp-others .offer-card--glass .offer-card__disc>span{font:700 13px var(--f-body);color:var(--muted);text-transform:none;letter-spacing:0}
html .hp .hp-others .offer-card__name{font-family:var(--f-body);font-size:15px;line-height:1.5;font-weight:700;color:var(--ink);margin:0}
.hp-others .offer-card__line,.hp-others .offer-card--glass .offer-card__line,.hp-others .offer-card__min,.hp-others .offer-card--glass .offer-card__min{font:400 13px var(--f-body);color:var(--muted);margin:0}
.hp-others .offer-card__meta,.hp-others .offer-card--glass .offer-card__meta{font:700 12.5px var(--f-body);color:var(--cherry);margin:4px 0 0}
.hp-others .offer-card__cta{display:inline-flex;align-items:center;justify-content:center;margin-top:10px;width:auto;align-self:flex-start;font:700 14px var(--f-body);padding:7px 16px;border-radius:999px;text-decoration:none;border:2px solid var(--plum);background:transparent;color:var(--plum)}
.hp-others .offer-card__cta:hover{background:var(--plum);color:#fff;transform:none}

/* club strip: empty until the session answers */
.hp-mypts:empty{display:none}
.hp-mypts .hp-cta .hp-btn-ghost{border-color:var(--cream);color:var(--cream)}
.hp-mypts .hp-cta .hp-btn-ghost:hover{background:var(--cream);color:var(--plum)}
.hp-mypts .hp-btn-primary{white-space:nowrap}

/* ---------------------------------------------------------------------------
   HEADER — one line, always.
   Cause of the old wrap: the row was capped at the 1180px content wrapper and
   nothing in it was allowed to stay on one line, so when the signed-in chip
   (name + points) made the row longer than the cap, the logo and the section
   links shrank and broke onto two lines — on a 2560px monitor as much as on a
   1024px one. Now nothing in the row wraps or shrinks; the row may be wider
   than the page content; and when the links still do not fit they fold into
   the drawer (home.js measures this rather than guessing a breakpoint).
   --------------------------------------------------------------------------- */
.hp-header .hp-wrap{max-width:1360px}
.hp-nav{white-space:nowrap}
.hp-nav>*{flex:none}
.hp-logo,.hp-logo span,.hp-links a,.hp-lang,.hp-acct,.hp-acct span{white-space:nowrap}
.hp-links{flex:none}
.hp-acct .hp-lbl{max-width:150px;overflow:hidden;text-overflow:ellipsis}
.hp-acct .hp-ptsm{display:none;background:var(--gold);color:#fff;border-radius:999px;padding:1px 8px;font-size:12px}

/* section links fold away when they do not fit (JS adds .hp-compact) or on phones */
.hp-nav.hp-compact .hp-links{display:none}
.hp-nav.hp-compact .hp-hcta{margin-inline-start:auto}
.hp-burger{display:none;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--line);background:#fff;cursor:pointer;padding:0;align-items:center;justify-content:center;flex-direction:column;gap:4px}
.hp-burger span{display:block;width:18px;height:2px;border-radius:2px;background:var(--plum)}
.hp-burger:hover{border-color:var(--plum)}
.hp-burger:focus-visible,.hp-dx:focus-visible,.hp-dlang:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.hp-nav.hp-compact .hp-burger{display:inline-flex}

@media (max-width:900px){
  .hp-links{display:none}
  .hp-burger{display:inline-flex}
  .hp-nav{gap:10px}
  .hp-nav .hp-hcta{margin-inline-start:auto}
  .hp-acct .hp-lbl,.hp-acct .hp-pts{display:none}
  .hp-acct .hp-ptsm{display:inline-block}
}
@media (max-width:540px){.hp-lang{display:none}}   /* the drawer has the language switch */
@media (max-width:480px){.hp-nav{gap:8px}.hp-logo .hp-s{font-size:26px}.hp-nav .hp-btn{padding:8px 12px;font-size:14px}}
@media (max-width:420px){.hp-hcta{display:none}}   /* the sticky bottom bar and the drawer carry "order now" */
@media (max-width:360px){
  .hp-nav{gap:6px}
  .hp-logo .hp-s{font-size:20px}
  .hp-acct{padding:4px;gap:5px}
  .hp-acct .hp-av{width:26px;height:26px}
  .hp-acct .hp-ptsm{padding:1px 6px;font-size:11px}
  .hp-cart,.hp-burger{width:36px;height:36px}
}

/* DRAWER */
html.hp-lock{overflow:hidden}
.hp-drawer{position:fixed;inset:0;z-index:80}
.hp-dov{position:absolute;inset:0;background:rgba(47,31,61,.55);opacity:0;transition:opacity .25s}
.hp-dpanel{position:absolute;top:0;bottom:0;inset-inline-start:0;width:min(86vw,340px);background:var(--cream);color:var(--ink);box-shadow:0 0 40px rgba(47,31,61,.35);display:flex;flex-direction:column;gap:6px;padding:calc(14px + env(safe-area-inset-top,0px)) 18px calc(18px + env(safe-area-inset-bottom,0px));overflow-y:auto;transition:transform .28s cubic-bezier(.2,.7,.2,1);outline:0}
html[dir="rtl"] .hp-dpanel{transform:translateX(100%)}
html[dir="ltr"] .hp-dpanel{transform:translateX(-100%)}
.hp-drawer.hp-open .hp-dov{opacity:1}
.hp-drawer.hp-open .hp-dpanel{transform:none}
.hp-dhead{display:flex;align-items:center;justify-content:space-between;height:54px;margin-bottom:6px}
.hp-dhead .hp-s{font-family:var(--f-script);font-size:30px;color:var(--cherry);line-height:1}
.hp-dx{width:40px;height:40px;border-radius:50%;border:1.5px solid var(--line);background:#fff;color:var(--plum);font-size:24px;line-height:1;cursor:pointer}
.hp-dlinks{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.hp-dlinks a{padding:14px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--plum);font:700 17px var(--f-body)}
.hp-dlinks a:hover,.hp-dlinks a:focus-visible{color:var(--cherry)}
.hp-dacct{display:flex;align-items:center;gap:12px;margin-top:14px;padding:12px;border:1.5px solid var(--line);border-radius:16px;background:#fff;text-decoration:none;color:var(--plum)}
.hp-dacct .hp-av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--paper);color:var(--plum);flex:none;font-weight:800}
.hp-dacct .hp-av svg{width:20px;height:20px}
.hp.hp-signed .hp-dacct .hp-av{background:var(--plum);color:#fff}
.hp-dtx{display:flex;flex-direction:column;line-height:1.35;min-width:0}
.hp-dtx b{font:700 15px var(--f-body)}
.hp-dtx small{font:600 13px var(--f-body);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hp-dlang{margin-top:10px;padding:11px;border:1.5px solid var(--line);border-radius:14px;background:#fff;color:var(--plum);font:700 15px var(--f-body);cursor:pointer}
.hp-dcta{margin-top:auto;justify-content:center;width:100%}
.hp-dpanel .hp-dcta{margin-top:16px}
@media (prefers-reduced-motion:reduce){.hp-dpanel,.hp-dov{transition:none}}

/* Reward ladder (prototype update): every real prize, cheapest first */
.hp-ladder2{margin-top:30px}
html .hp .hp-ladder2 h3{font-size:24px;color:#fff}
.hp-ladder2 .hp-sub{color:rgba(251,246,243,.75);font-size:14px;margin:2px 0 14px}
.hp-rw{display:flex;gap:14px;overflow-x:auto;padding:12px 2px 6px;scroll-snap-type:x mandatory}
.hp-rwc{flex:0 0 200px;scroll-snap-align:start;background:var(--cream);color:var(--ink);border-radius:18px;padding:16px;position:relative;display:flex;flex-direction:column;gap:6px;border:2px solid transparent}
.hp-rwc .hp-pp{align-self:flex-start;background:var(--plum);color:#fff;font-weight:800;font-size:13px;border-radius:999px;padding:2px 10px}
.hp-rwc b{font-size:16px;color:var(--plum);line-height:1.4}
.hp-rwc span{font-size:13px;color:var(--muted)}
.hp-rwc.hp-top{border-color:var(--gold)}
.hp-rwc.hp-top::before{content:attr(data-top);position:absolute;top:-11px;inset-inline-end:14px;background:var(--gold);color:#fff;font-size:11px;font-weight:800;border-radius:999px;padding:2px 10px}
.hp-rwc .hp-st{display:none;font-size:12px;font-weight:700}
.hp.hp-signed .hp-rwc .hp-st{display:block}
.hp-rwc .hp-st.hp-ok{color:#2f7a45}
.hp-rwc .hp-st.hp-no{color:var(--cherry)}
.hp-rwc .hp-mt{height:6px;border-radius:999px;background:var(--line);overflow:hidden;display:none}
.hp.hp-signed .hp-rwc .hp-mt{display:block}
.hp-rwc .hp-mt i{display:block;height:100%;background:var(--gold)}
.hp-rwc>b{font-weight:700}
.hp-rw{max-width:100%}
