/* ==========================================================================
   Villa Breakfast · components
   Class names map 1:1 to theme partials (see WP-CONVERSION.md).
   JS never hooks these classes; it uses data-cb-* attributes.
   ========================================================================== */

/* ---------- Icons ---------- */
.i{width:1.25em;height:1.25em;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.i--fill{fill:currentColor;stroke:none}

/* ---------- Buttons ---------- */
.cb-btn{--bg:var(--terracotta);--fg:var(--paper);--bd:var(--espresso);--sh:var(--espresso);display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 26px;border-radius:var(--r-pill);border:2px solid var(--bd);background:var(--bg);color:var(--fg);font:800 .9375rem/1.1 var(--font-body);letter-spacing:.05em;text-transform:uppercase;text-decoration:none;text-align:center;box-shadow:0 4px 0 var(--sh);transition:transform var(--dur-1) var(--ease-spring),box-shadow var(--dur-1),background-color var(--dur-2);-webkit-tap-highlight-color:transparent;user-select:none}
.cb-btn:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--sh)}
.cb-btn:active{transform:translateY(4px);box-shadow:0 0 0 var(--sh)}
.cb-btn .i{width:20px;height:20px}
.cb-btn--sun{--bg:var(--sun);--fg:var(--espresso)}
.cb-btn--dark{--bg:var(--espresso);--fg:var(--paper);--sh:rgba(42,27,20,.35)}
.cb-btn--ghost{--bg:transparent;--fg:var(--espresso)}
.cb-btn--paper{--bg:var(--paper);--fg:var(--espresso)}
.on-dark .cb-btn--ghost{--fg:var(--cream);--bd:var(--cream);--sh:rgba(0,0,0,.4)}
.on-dark .cb-btn{--sh:rgba(0,0,0,.45)}
.cb-btn--sm{min-height:46px;padding:0 18px;font-size:.8125rem}
.cb-btn--block{display:flex;width:100%}
.cb-btn--split{justify-content:space-between}
.cb-btn>span:has(>.i){display:inline-flex;align-items:center;gap:10px}
.cb-btn:disabled,.cb-btn[aria-disabled="true"]{--bg:#E5DCCB;--fg:var(--espresso-2);--bd:#CDBFA8;box-shadow:none;transform:none}
.cb-btn.is-loading{pointer-events:none;color:transparent;position:relative}
.cb-btn.is-loading .cb-btn__loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--fg)}
.cb-btn.is-loading .cb-btn__loading::before{content:"";flex:none;width:20px;height:20px;border-radius:50%;border:3px solid currentColor;border-right-color:transparent;animation:cb-spin .7s linear infinite}
.cb-link{display:inline-flex;align-items:center;gap:6px;font-weight:800;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;min-height:var(--tap);background:none;border:0;padding:0}
.cb-link .i{transition:transform var(--dur-2) var(--ease-out)}
.cb-link:hover .i{transform:translateX(4px)}
.cb-icon-btn{position:relative;display:inline-grid;place-items:center;width:46px;height:46px;flex:0 0 46px;border-radius:50%;border:0;background:var(--paper);color:var(--espresso);box-shadow:0 2px 0 rgba(42,27,20,.14);text-decoration:none;transition:transform var(--dur-1) var(--ease-spring)}
.cb-icon-btn:active{transform:scale(.92)}
.cb-icon-btn .i{width:22px;height:22px}
.cb-icon-btn--plain{background:transparent;box-shadow:none}
.cb-count{position:absolute;top:-4px;right:-4px;min-width:21px;height:21px;padding:0 5px;border-radius:var(--r-pill);background:var(--terracotta);color:var(--paper);font-size:11px;font-weight:800;line-height:21px;text-align:center;box-shadow:0 0 0 2px var(--paper)}
.cb-count:empty,.cb-count[data-count="0"]{display:none}
.cb-count.is-pop{animation:cb-pop .4s var(--ease-spring)}

/* ---------- Logo ---------- */
.cb-logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:inherit;min-height:var(--tap);min-width:0}
.cb-logo__mark{width:42px;height:42px;--mk-bg:var(--espresso);--mk-sun:var(--sun);--mk-wave:var(--pool)}
.cb-logo>span{min-width:0}
.cb-logo__name{display:block;font:800 1.3125rem/.9 var(--font-display);font-variation-settings:"wdth" 82,"opsz" 96;letter-spacing:-.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb-logo__by{display:block;margin-top:4px;font-size:.59rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--espresso-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.on-dark .cb-logo__by{color:var(--sun)}
.on-dark .cb-logo__mark{--mk-bg:var(--sun);--mk-sun:var(--espresso);--mk-wave:var(--pool-deep)}

/* ---------- Header ---------- */
.cb-header{--hd-bg:var(--sun);position:sticky;top:0;z-index:var(--z-header);background:var(--hd-bg);transition:background-color var(--dur-2),box-shadow var(--dur-2)}
.cb-header--sun{--hd-bg:var(--sun)}
.cb-header.is-scrolled{box-shadow:0 1px 0 var(--line),0 10px 24px -18px rgba(42,27,20,.5)}
.cb-header__in{display:flex;align-items:center;gap:10px;min-height:72px}
.cb-header__in .cb-logo{margin-right:auto}
.cb-nav{display:none}
.cb-header .cb-icon-btn{background:var(--paper)}
.cb-header__order{min-height:46px;padding:0 16px;font-size:.8125rem}
.cb-header__cart{display:none}
.cb-header--app .cb-header__cart{display:inline-grid}
.cb-header--app .cb-header__order{display:none}
@media (max-width:359px){.cb-logo__by{display:none}.cb-logo__name{font-size:1.125rem}.cb-logo__mark{width:36px;height:36px}}
@media (min-width:1024px){.cb-header__in{min-height:88px;gap:14px}.cb-logo__mark{width:50px;height:50px}.cb-logo__name{font-size:1.5625rem}.cb-nav{display:flex;gap:30px;margin-right:18px}.cb-nav a{position:relative;display:inline-flex;align-items:center;min-height:var(--tap);padding:0;font-weight:700;font-size:.9375rem;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat;transition:background-size var(--dur-2) var(--ease-out)}.cb-nav a:hover,.cb-nav a[aria-current="page"]{background-size:100% 2px}.cb-nav a::after{content:"";position:absolute;inset:0 -8px}.cb-header__menu{display:none}.cb-header__cart{display:inline-grid}.cb-header__order{display:inline-flex;min-height:52px;padding:0 24px;font-size:.875rem}}

/* ---------- Mobile menu (native <dialog>) ---------- */
.cb-menu{width:100%;height:100%;max-height:100dvh;margin:0;background:var(--sun);color:var(--espresso);overscroll-behavior:contain}
.cb-menu[open]{display:flex;flex-direction:column;animation:cb-menu-in var(--dur-2) var(--ease-out)}
@keyframes cb-menu-in{from{opacity:0;transform:translateY(-12px)}}
.cb-menu__top{display:flex;align-items:center;justify-content:space-between;padding:12px var(--gutter);min-height:72px}
.cb-menu__links{list-style:none;padding:8px var(--gutter);display:grid;gap:2px}
.cb-menu__links a{display:flex;align-items:center;justify-content:space-between;min-height:64px;font:800 2.5rem/1 var(--font-display);font-variation-settings:"wdth" 80;letter-spacing:var(--track-head);text-decoration:none;border-bottom:2px solid rgba(42,27,20,.12)}
.cb-menu__links .i{width:28px;height:28px}
.cb-menu__foot{margin-top:auto;padding:24px var(--gutter) max(24px,env(safe-area-inset-bottom));display:grid;gap:12px}
.cb-menu__meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:var(--fs-sm);font-weight:700}

/* ---------- Stickers, badges, price tag ---------- */
.cb-sticker{--size:104px;position:absolute;z-index:4;display:grid;place-items:center;width:var(--size);height:var(--size);color:var(--terracotta);text-align:center;transform:rotate(var(--rot,-12deg));pointer-events:none}
.cb-sticker svg{position:absolute;inset:0;width:100%;height:100%;fill:currentColor;filter:drop-shadow(0 3px 0 rgba(42,27,20,.25))}
.cb-sticker span{position:relative;max-width:78%;color:var(--paper);font:800 calc(var(--size)*.16)/.95 var(--font-display);font-variation-settings:"wdth" 76;letter-spacing:-.01em;text-transform:uppercase}
.cb-sticker--sun{color:var(--sun)}
.cb-sticker--sun span{color:var(--espresso)}
.cb-sticker--pool{color:var(--pool)}
.cb-sticker--pool span{color:var(--espresso)}
.cb-sticker--olive{color:var(--olive)}
.cb-sticker--paper{color:var(--paper)}
.cb-sticker--paper span{color:var(--espresso)}
.cb-price-tag span{font:800 .8125rem/1 var(--font-body);letter-spacing:.06em}
.cb-price-tag strong{display:block;margin-top:2px;font:800 calc(var(--size)*.34)/.9 var(--font-display);font-variation-settings:"wdth" 76;letter-spacing:-.04em;color:var(--terracotta)}
.cb-badge{display:inline-flex;align-items:center;gap:5px;min-height:24px;padding:3px 10px;border-radius:var(--r-pill);background:var(--cream);color:var(--espresso);font-size:.6875rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.cb-badge .i{width:13px;height:13px}
.cb-badge--sun{background:var(--sun)}
.cb-badge--new{background:var(--pool-deep);color:var(--paper)}
.cb-badge--today{background:var(--sun);box-shadow:inset 0 0 0 1.5px var(--espresso)}
.cb-badge--soldout{background:var(--espresso);color:var(--paper)}
.cb-badge--olive{background:var(--olive);color:var(--paper)}
.cb-badge--terra{background:var(--terracotta);color:var(--paper)}
.cb-badge--line{background:transparent;box-shadow:inset 0 0 0 1.5px var(--line-strong)}

/* ---------- Doodles ---------- */
.cb-spin{animation:cb-spin 24s linear infinite}
@media (prefers-reduced-motion:reduce){.cb-spin{animation:none}}

/* ---------- Stamp (rotating circular text) ---------- */
.cb-stamp{position:relative;width:var(--size,132px);height:var(--size,132px);color:var(--espresso)}
.cb-stamp__ring{position:absolute;inset:0;width:100%;height:100%;fill:currentColor}
.cb-stamp__ring circle{fill:var(--stamp-bg,var(--paper))}
.cb-stamp__core{position:absolute;inset:32%;display:grid;place-items:center;--mk-bg:var(--espresso);--mk-sun:var(--sun);--mk-wave:var(--pool)}
.cb-stamp__core svg{width:100%;height:100%}

/* ---------- Dividers ---------- */
.cb-scallop{--sc-h:22px;--sc-c:var(--cream);display:block;height:var(--sc-h);background:radial-gradient(circle at 50% 100%,var(--sc-c) calc(var(--sc-h) - .5px),transparent var(--sc-h)) 50% 0/calc(var(--sc-h)*2) var(--sc-h) repeat-x,linear-gradient(var(--sc-c),var(--sc-c)) 0 100%/100% 22% no-repeat}
.cb-scallop--lg{--sc-h:clamp(22px,3vw,40px)}
/* Hero edge, used under every hero: flipped, so the hero-coloured bumps hang over the next section. --sc-under fills the gaps
   between the bumps and must match that section (cream by default). The 2px shadow hides the sub-pixel seam at the join. */
.cb-scallop--hang{--sc-c:var(--sun);transform:scaleY(-1);margin-top:-1px;background-color:var(--sc-under,var(--cream));box-shadow:0 2px 0 var(--sc-c)}

/* ---------- Marquee (CSS only, pauses with reduced motion) ---------- */
.cb-marquee{position:relative;z-index:4;overflow:hidden;margin-inline:-24px;padding:14px 0;background:var(--espresso);color:var(--sun);transform:rotate(-1.6deg)}
.cb-marquee__track{display:flex;width:max-content;animation:cb-marquee 40s linear infinite}
.cb-marquee:hover .cb-marquee__track{animation-play-state:paused}
.cb-marquee__group{display:flex;align-items:center;flex-shrink:0}
.cb-marquee__item{display:inline-flex;align-items:center;gap:22px;padding-right:22px;white-space:nowrap;font:800 1.625rem/1 var(--font-display);font-variation-settings:"wdth" 78;letter-spacing:-.01em;text-transform:uppercase}
.cb-marquee__item svg{width:22px;height:22px;color:var(--terracotta);fill:currentColor}
@media (min-width:768px){.cb-marquee{padding:20px 0}.cb-marquee__item{font-size:2.5rem;gap:30px;padding-right:30px}.cb-marquee__item svg{width:30px;height:30px}}
@media (prefers-reduced-motion:reduce){.cb-marquee__track{animation:none}}

/* ---------- Section heading ---------- */
.cb-section-heading{display:grid;gap:var(--s2);margin-bottom:clamp(32px,5vw,56px)}
.cb-section-heading h2{max-width:6.41em}
.cb-section-heading .lead{margin:0}
.cb-section-heading--center{justify-items:center;text-align:center}
.cb-section-heading--center h2{max-width:8.24em}
@media (min-width:1024px){.cb-section-heading--split{grid-template-columns:1fr auto;align-items:end}.cb-section-heading--split .eyebrow,.cb-section-heading--split h2{grid-column:1}.cb-section-heading--split>.cb-link,.cb-section-heading--split>.cb-btn{grid-column:2;grid-row:2}}
.cb-hl{display:inline-block;background:var(--terracotta);color:var(--paper);padding:.02em .12em .08em;margin-left:-.04em;border-radius:.16em;transform:rotate(-2.5deg);box-shadow:.05em .06em 0 var(--espresso)}
.cb-hl--sun{background:var(--sun);color:var(--espresso)}
.cb-hl--pool{background:var(--pool);color:var(--espresso)}

/* ---------- Form fields ---------- */
.cb-field{display:grid;grid-template-columns:minmax(0,1fr);gap:6px}
.cb-field>label,.cb-label{font-size:var(--fs-sm);font-weight:800}
.cb-label small,.cb-field>label small{font-weight:600;color:var(--ink-2)}
.cb-input{display:flex;align-items:center;gap:10px;min-height:56px;padding:0 16px;border-radius:var(--r-md);background:var(--cream);border:2px solid transparent;transition:border-color var(--dur-2),background-color var(--dur-2)}
.cb-input:hover{border-color:var(--line-strong)}
.cb-input:focus-within{border-color:var(--espresso);background:var(--paper)}
.cb-input>.i{width:22px;height:22px;color:var(--terracotta)}
.cb-input input,.cb-input select,.cb-input textarea{flex:1;min-width:0;min-height:52px;border:0;background:none;outline:0;font-size:1rem;font-weight:600}
.cb-input textarea{min-height:96px;padding:14px 0;resize:vertical;line-height:1.45}
.cb-input input::placeholder,.cb-input textarea::placeholder{color:var(--espresso-3);font-weight:500}
.cb-input select{appearance:none;padding-right:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%232A1B14' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") 100% 50%/12px no-repeat}
.cb-input--area{align-items:flex-start}
.cb-phone{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px}
.cb-phone .cb-input:first-child{padding-right:10px}
.cb-phone .cb-input:first-child select{width:92px}
.cb-hint{margin:0;font-size:var(--fs-sm);color:var(--ink-2)}
.cb-error{display:none;align-items:flex-start;gap:6px;margin:0;font-size:var(--fs-sm);font-weight:700;color:var(--error)}
.cb-error .i{width:18px;height:18px;margin-top:1px}
.cb-field.is-invalid .cb-input{border-color:var(--error);background:var(--error-bg)}
.cb-field.is-invalid .cb-error{display:flex}
.cb-check{position:relative;display:flex;align-items:flex-start;gap:12px;min-height:var(--tap);padding:10px 0;font-weight:600;cursor:pointer}
.cb-check input{position:absolute;opacity:0;width:24px;height:24px;margin:0}
.cb-check__box{flex:0 0 24px;width:24px;height:24px;margin-top:-1px;border-radius:7px;border:2px solid var(--espresso);background:var(--paper);display:grid;place-items:center;transition:background-color var(--dur-1)}
.cb-check__box .i{width:16px;height:16px;stroke-width:3;opacity:0;color:var(--paper)}
.cb-check input[type=radio]+.cb-check__box{border-radius:50%}
.cb-check input:checked+.cb-check__box{background:var(--espresso)}
.cb-check input:checked+.cb-check__box .i{opacity:1}
.cb-check input:focus-visible+.cb-check__box{outline:3px solid var(--focus);outline-offset:2px}

/* ---------- Alerts + banners ---------- */
.cb-alert{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--r-md);background:var(--cream);font-size:.9375rem;font-weight:600}
.cb-alert>.i{width:22px;height:22px;flex:0 0 22px;margin-top:1px}
.cb-alert strong{display:block}
.cb-alert p{margin:2px 0 0;font-weight:500}
.cb-alert ul{list-style:none;display:grid;gap:2px;margin:2px 0 0;font-weight:500}
.cb-alert--error{background:var(--error-bg);color:var(--terracotta-dark)}
.cb-alert--error p{color:var(--espresso)}
.cb-alert--warn{background:var(--sun-soft)}
.cb-alert--ok{background:var(--olive-soft)}
.cb-alert--ok>.i{color:var(--olive)}
.cb-alert--pool{background:var(--pool-soft)}
.cb-alert--pool>.i{color:var(--pool-deep)}
.cb-store-paused{background:var(--espresso);color:var(--cream)}
.cb-store-paused .cb-wrap{display:flex;gap:12px;align-items:flex-start;padding-block:14px}
.cb-store-paused .i{width:24px;height:24px;color:var(--sun);flex:0 0 24px}
.cb-store-paused strong{display:block;color:var(--sun)}
.cb-store-paused p{margin:2px 0 0;font-size:var(--fs-sm)}
.cb-paused-note{display:none;margin:10px 0 0;font-size:var(--fs-sm);font-weight:700;color:var(--terracotta-dark)}
.is-paused .cb-paused-note{display:block}

/* ---------- Villa / delivery context bar ---------- */
.cb-villa-banner{background:var(--pool-soft);border-bottom:1px solid rgba(14,124,118,.18)}
.cb-villa-banner .cb-wrap{display:flex;align-items:center;gap:10px;min-height:56px;padding-block:8px}
.cb-villa-banner__icon{width:28px;height:28px;color:var(--pool-deep);flex:0 0 28px}
.cb-villa-banner__txt{flex:1;min-width:0;font-size:var(--fs-sm);line-height:1.35}
.cb-villa-banner__txt strong{display:block;font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cb-villa-banner__txt span{color:var(--espresso-2);font-weight:700}
.cb-villa-banner__change{flex:0 0 auto;min-height:var(--tap);padding:0 14px;border-radius:var(--r-pill);border:2px solid var(--espresso);background:var(--paper);font-weight:800;font-size:var(--fs-sm)}
.cb-villa-banner--empty{background:var(--sun-soft);border-color:rgba(42,27,20,.1)}
.cb-villa-banner--empty .cb-villa-banner__icon{color:var(--terracotta)}
@media (min-width:768px){.cb-villa-banner__txt{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}.cb-villa-banner__txt strong{font-size:1rem}}

/* ---------- Delivery status (location results, zone card, villa recognised) ---------- */
.cb-delivery-status{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:start;padding:16px;border-radius:var(--r-md);background:var(--cream)}
.cb-delivery-status>.i{grid-row:span 2;width:28px;height:28px}
.cb-delivery-status__title{margin:0;font:800 1.25rem/1.1 var(--font-display);font-variation-settings:"wdth" 82;letter-spacing:-.02em}
.cb-delivery-status__meta{margin:0;font-size:var(--fs-sm);font-weight:600;color:var(--ink-2)}
.cb-delivery-status__facts{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;list-style:none}
.cb-delivery-status__facts li{padding:5px 10px;border-radius:var(--r-pill);background:var(--paper);font-size:.8125rem;font-weight:800}
.cb-delivery-status__actions{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:12px}
.cb-delivery-status--ok{background:var(--pool-soft)}
.cb-delivery-status--ok>.i{color:var(--pool-deep)}
.cb-delivery-status--out{background:var(--sun-soft)}
.cb-delivery-status--out>.i{color:var(--terracotta)}
.cb-delivery-status--error{background:var(--error-bg)}
.cb-delivery-status--error>.i{color:var(--terracotta-dark)}
.cb-delivery-status--checking>.i{border-radius:50%;border:3px solid var(--espresso);border-right-color:transparent;animation:cb-spin .8s linear infinite;width:24px;height:24px;margin:2px}
.cb-skel{display:block;height:12px;border-radius:6px;background:linear-gradient(90deg,rgba(42,27,20,.08) 0 40%,rgba(42,27,20,.16) 50%,rgba(42,27,20,.08) 60%) 0 0/200% 100%;animation:cb-shimmer 1.2s linear infinite}

/* ---------- Location checker ---------- */
.cb-location-checker{position:relative;display:grid;gap:14px;padding:20px;border-radius:28px;background:var(--paper);box-shadow:var(--sh-3)}
.cb-location-checker h2{font-size:1.625rem;letter-spacing:var(--track-head);font-variation-settings:"wdth" 80}
.cb-location-checker__intro p{margin:4px 0 0;font-size:var(--fs-sm);color:var(--ink-2)}
.cb-location-checker__form{display:grid;gap:10px}
.cb-location-checker__alt{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center;margin:0;font-size:.8125rem;font-weight:700;color:var(--ink-2)}
.cb-location-checker__alt .i{width:18px;height:18px;color:var(--pool-deep)}
.cb-location-checker__alt button{display:inline-flex;align-items:center;gap:6px;min-height:var(--tap);padding:0;border:0;background:none;font-weight:800;color:var(--espresso);text-decoration:underline;text-underline-offset:3px}
.cb-location-checker__alt span{display:inline-flex;align-items:center;gap:6px}
.cb-location-checker__result:empty{display:none}
/* Said to somebody who pressed the button with nothing typed. Not a status card: there is no status
   yet, only a sentence, and a card would read as an answer to a question nobody asked. */
.cb-location-checker__nudge{margin:0;font-size:var(--fs-sm);font-weight:700;color:var(--terracotta)}
/* The button while the lookup is out. Dimmed rather than greyed, because it is still the button it
   was a moment ago and will be again in a second, and the shadow flattens so it reads as pressed. */
.cb-btn[aria-busy=true]{opacity:.6;box-shadow:0 1px 0 var(--sh);transform:translateY(3px);cursor:progress}
@media (min-width:1024px){.cb-location-checker{grid-template-columns:.85fr 1.4fr;align-items:center;gap:18px 28px;padding:24px 24px 20px 32px;border-radius:var(--r-xl)}.cb-location-checker__form{grid-template-columns:1fr auto}.cb-location-checker__alt,.cb-location-checker__result{grid-column:1/-1}.cb-location-checker__alt{border-top:1px dashed var(--line-strong);padding-top:10px}}
/* The hero's copy of this box is a 540px column standing under a paragraph, not a band across the page, so the
   arrangement above has nothing to be two columns in: it would put the heading beside a field with no room left to
   type a villa name in. It stays a stack at every width. The field and its button still sit side by side, because
   that part of the rule is about the form and the form does fit. */
@media (min-width:1024px){.cb-location-checker--hero{grid-template-columns:1fr;align-items:stretch;gap:14px;padding:20px}.cb-location-checker--hero .cb-location-checker__alt{border-top:0;padding-top:0}}

/* ---------- Area board: the fallback under a checker that found nothing ----------
   Not .cb-areas: that class is already the home and Panormo pages' zone section,
   and sharing it gave this board's padding and dashed border to a whole page section.
   Printed hidden in every checker (components/area-picker.php) and revealed by
   location.js. A smaller cousin of the delivery-areas page ticket: same letter
   badge, same fact pills as the status card above it, no shadow of its own
   because it sits inside a card that already has one. */
.cb-area-board{display:grid;gap:12px;padding:16px;border-radius:var(--r-md);background:var(--cream);border:1.5px dashed var(--line-strong)}
.cb-area-board[hidden]{display:none}
.cb-area-board__title{margin:0;font:800 1.125rem/1.15 var(--font-display);font-variation-settings:"wdth" 82;letter-spacing:-.02em}
.cb-area-board__intro{margin:-8px 0 0;font-size:var(--fs-sm);color:var(--ink-2)}
.cb-area-board__list{display:grid;gap:10px;list-style:none;margin:0}
.cb-area-board__area{display:grid;gap:4px;padding:12px;border-radius:var(--r-sm);background:var(--paper)}
.cb-area-board__name{display:flex;align-items:center;gap:10px;margin:0;font-weight:800}
.cb-area-board__key{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--sun-soft);border:2px solid var(--espresso);font:800 .875rem/1 var(--font-display)}
/* The village names, now that each one can be pressed: chips rather than a run
   of text, so a row of them reads as a choice and not as a caption. Shaped on
   the fact pills below for the same reason - they are the same size of thing. */
.cb-area-board__places{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:2px 0 0}
.cb-area-board__place{padding:5px 11px;border-radius:var(--r-pill);background:var(--paper);border:1.5px solid var(--line-strong);font:700 .8125rem/1.2 inherit;color:var(--ink);cursor:pointer;transition:background var(--dur-1) var(--ease-out),border-color var(--dur-1) var(--ease-out)}
@media (hover:hover){.cb-area-board__place:hover{background:var(--sun-soft);border-color:var(--espresso)}}
.cb-area-board__place:active{background:var(--sun-soft)}
.cb-area-board__facts{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:2px 0 0}
.cb-area-board__facts li{padding:4px 10px;border-radius:var(--r-pill);background:var(--cream);font-size:.75rem;font-weight:800}
.cb-area-board__foot{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0}

/* ---------- Combo card ---------- */
.cb-combo-card{position:relative;display:flex;flex-direction:column;background:var(--paper);border-radius:var(--r-xl);box-shadow:var(--sh-3);transition:transform var(--dur-2) var(--ease-out)}
@media (hover:hover){.cb-combo-card:hover{transform:translateY(-4px) rotate(-.4deg)}}
.cb-combo-card__media{position:relative;aspect-ratio:5/3;margin:10px 10px 0;border-radius:var(--r-lg);background:radial-gradient(circle at 50% 62%,#FFD66E 0 38%,transparent 38.5%),var(--sun)}
.cb-combo-card__media img{position:absolute;left:-2%;top:-20%;width:104%;max-width:none;height:auto;transform:rotate(-6deg);filter:drop-shadow(0 18px 16px rgba(42,27,20,.28));transition:transform var(--dur-3) var(--ease-spring)}
@media (hover:hover){.cb-combo-card:hover .cb-combo-card__media img{transform:rotate(-3deg) scale(1.03)}}
/* A photograph fills the panel instead of floating over it: same box, same
   radius, cropped to fit. The drop shadow and the tilt go - a shadow under a
   rectangle that ends at the panel edge reads as a rendering fault - but the
   hover scale stays, because that one still looks deliberate. Written with
   the card class as well so it outranks .cb-cat's wider-screen nudge in
   page-order.css, which loads later. Set by inc/product-image.php. */
.cb-combo-card .cb-combo-card__media img.is-photo{left:0;top:0;width:100%;height:100%;border-radius:inherit;object-fit:cover;transform:none;filter:none}
@media (hover:hover){.cb-combo-card:hover .cb-combo-card__media img.is-photo{transform:scale(1.03)}}
.cb-combo-card--pool .cb-combo-card__media{background:radial-gradient(circle at 50% 62%,#7FDCD3 0 38%,transparent 38.5%),var(--pool)}
.cb-combo-card--olive .cb-combo-card__media{background:radial-gradient(circle at 50% 62%,#F6F0D8 0 38%,transparent 38.5%),var(--olive-soft)}
.cb-combo-card--terra .cb-combo-card__media{background:radial-gradient(circle at 50% 62%,#F0B49B 0 38%,transparent 38.5%),#E9876A}
.cb-combo-card .cb-sticker{--size:96px;left:-12px;top:-26px}
.cb-combo-card__body{display:flex;flex-direction:column;flex:1;padding:18px 22px 22px}
.cb-combo-card__kicker{margin:0;font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--pool-deep)}
.cb-combo-card h3{margin:6px 0 8px;font-size:2rem;font-variation-settings:"wdth" 80;overflow-wrap:anywhere}
.cb-combo-card h3 a{text-decoration:none}
.cb-combo-card h3 button{all:unset;cursor:pointer}
.cb-combo-card h3 :is(a,button)::after{content:"";position:absolute;inset:0;border-radius:inherit}
.cb-combo-card h3 :is(a,button):focus-visible{outline:none}
.cb-combo-card:has(h3 :focus-visible){outline:3px solid var(--focus);outline-offset:4px}
.cb-combo-card__desc{margin:0;font-size:.9375rem;color:var(--ink-2)}
.cb-combo-card__incl{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0}
.cb-combo-card__incl li{padding:5px 10px;border-radius:var(--r-pill);background:var(--cream);font-size:.78rem;font-weight:700}
.cb-combo-card__foot{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:18px}
.cb-price{font:800 var(--fs-price)/.9 var(--font-display);font-variation-settings:"wdth" 76;letter-spacing:-.04em;color:var(--price);white-space:nowrap}
.cb-price sup{font-size:.42em;vertical-align:.95em;letter-spacing:0;margin-left:1px}
.cb-price small{display:block;margin-top:4px;font:700 .75rem/1 var(--font-body);letter-spacing:.02em;color:var(--ink-2)}
.cb-add{position:relative;z-index:2;display:inline-flex;align-items:center;gap:8px;min-height:52px;padding:0 20px 0 12px;border-radius:var(--r-pill);border:2px solid var(--espresso);background:var(--espresso);color:var(--paper);font-weight:800;font-size:.875rem;letter-spacing:.05em;text-transform:uppercase;box-shadow:0 4px 0 rgba(42,27,20,.3);transition:transform var(--dur-1) var(--ease-spring),box-shadow var(--dur-1)}
.cb-add:hover{transform:translateY(-2px)}
.cb-add:active{transform:translateY(3px) scale(.98);box-shadow:none;background:var(--espresso-2);border-color:var(--espresso-2)}
.cb-add .i{width:26px;height:26px;padding:4px;border-radius:50%;background:var(--sun);color:var(--espresso);stroke-width:3}
.cb-add:disabled{background:#E5DCCB;border-color:#CDBFA8;color:var(--espresso-2);box-shadow:none;transform:none}
.cb-add:disabled .i{background:transparent}

/* ---------- Stepper (quick-add + cart) ---------- */
.cb-stepper{display:inline-flex;align-items:center;gap:2px;padding:3px;border-radius:var(--r-pill);background:var(--cream);font-weight:800}
.cb-stepper button{display:grid;place-items:center;width:var(--tap);height:var(--tap);border-radius:50%;border:0;background:var(--paper);box-shadow:0 1px 0 rgba(42,27,20,.12)}
.cb-stepper button .i{width:18px;height:18px;stroke-width:2.8}
.cb-stepper button:active{transform:scale(.9);background:var(--sun-soft)}
.cb-stepper--terra button:active{background:rgba(255,251,243,.4)}
.cb-stepper button:disabled{opacity:.4}
.cb-stepper output{min-width:30px;text-align:center;font-size:1.0625rem;font-variant-numeric:tabular-nums}
.cb-stepper--terra{background:var(--terracotta);color:var(--paper);box-shadow:0 4px 0 var(--espresso)}
.cb-stepper--terra button{background:rgba(255,251,243,.18);color:var(--paper);box-shadow:none}
.cb-stepper--sm button{width:38px;height:38px}
.cb-stepper.is-pop{animation:cb-pop .35s var(--ease-spring)}
.cb-quick{display:contents}
.cb-quick>.cb-stepper{display:none}
.cb-quick.is-added>.cb-stepper{display:inline-flex}
.cb-quick.is-added>[data-cb-add-to-cart]{display:none}
/* A combo's ADD has no stepper to turn into, so it shows the tick that is printed beside its
   plus and hidden here until cart.js says the tap has been taken. Printed rather than
   inserted, for the same reason the stepper is: the first add must not add an element. */
.cb-add .i--done{display:none}
.cb-add.is-done .i--done{display:block}
.cb-add.is-done .i:not(.i--done){display:none}
.cb-add.is-done{background:var(--espresso);border-color:var(--espresso)}
/* Why an add was refused, on the card it was refused for. A guest who tapped a plus on a row
   halfway down a long list should not have to read about it in a bar at the bottom. */
.cb-card-msg{position:relative;z-index:3;grid-column:1/-1;margin:8px 0 0;padding:6px 10px;border-radius:12px;background:var(--cream);color:var(--terracotta-dark);font-size:.8125rem;font-weight:700;text-wrap:pretty}

/* ---------- Product card (standard, horizontal) ---------- */
.cb-product-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 104px;gap:14px;align-items:start;padding:14px;border-radius:var(--r-lg);background:var(--paper);box-shadow:var(--sh-1);transition:box-shadow var(--dur-2)}
@media (hover:hover){.cb-product-card:hover{box-shadow:var(--sh-2)}}
.cb-product-card__badges{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:6px}
.cb-product-card h3{font-size:1.375rem;font-variation-settings:"wdth" 82;letter-spacing:-.025em;line-height:1;overflow-wrap:anywhere;hyphens:auto}
.cb-product-card h3 button{all:unset;cursor:pointer}
.cb-product-card h3 button::after{content:"";position:absolute;inset:0;border-radius:inherit}
.cb-product-card h3 button:focus-visible{outline:none}
.cb-product-card:has(h3 button:focus-visible){outline:3px solid var(--focus);outline-offset:3px}
.cb-product-card__desc{margin:6px 0 0;font-size:.875rem;line-height:1.45;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cb-product-card__foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:10px;font-weight:800}
.cb-product-card__price{font:800 1.375rem/1 var(--font-display);font-variation-settings:"wdth" 78;color:var(--price);letter-spacing:-.02em}
.cb-product-card__media{position:relative;aspect-ratio:1;border-radius:var(--r-md);background:var(--cream);display:grid;place-items:center}
.cb-product-card__media img{width:82%;height:82%;object-fit:contain;filter:drop-shadow(0 8px 8px rgba(42,27,20,.18))}
.cb-product-card__media img.is-photo{width:100%;height:100%;border-radius:inherit;object-fit:cover;filter:none}
.cb-product-card__add{position:absolute;right:-6px;bottom:-6px;z-index:2}
.cb-plus{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:2px solid var(--espresso);background:var(--sun);color:var(--espresso);box-shadow:0 3px 0 var(--espresso);transition:transform var(--dur-1) var(--ease-spring),box-shadow var(--dur-1)}
.cb-plus .i{width:22px;height:22px;stroke-width:3}
@media (hover:hover){.cb-plus:hover{transform:rotate(90deg)}}
.cb-plus:active{transform:translateY(3px) scale(.94);box-shadow:none;background:var(--sun-deep)}
.cb-plus:disabled{background:#E5DCCB;border-color:#CDBFA8;color:var(--espresso-2);box-shadow:none;transform:none}
.cb-product-card__add .cb-stepper{position:absolute;right:0;bottom:0}
.cb-product-card.is-sold-out .cb-product-card__media img{filter:grayscale(1) opacity(.45)}
.cb-product-card.is-sold-out h3,.cb-product-card.is-sold-out .cb-product-card__price{color:var(--espresso-3)}
.cb-product-card.is-sold-out .cb-product-card__price{text-decoration:line-through}
@media (min-width:768px){.cb-product-card{grid-template-columns:minmax(0,1fr) 132px;padding:16px}}

/* ---------- Compact row (menu-ticket, drinks + extras) ---------- */
.cb-product-row{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 0;border-top:2px dashed rgba(42,27,20,.16)}
.cb-product-row:first-child{border-top:0}
.cb-product-row__img{width:64px;height:64px;border-radius:50%;background:var(--cream);display:grid;place-items:center}
.cb-product-row__img img{width:84%;height:84%;object-fit:contain}
.cb-product-row__img img.is-photo{width:100%;height:100%;border-radius:50%;object-fit:cover}
.cb-product-row__line{display:flex;align-items:baseline;gap:8px;min-width:0}
.cb-product-row h3{font:800 1.0625rem/1.15 var(--font-body);letter-spacing:-.01em;overflow-wrap:break-word;min-width:0}
.cb-product-row h3 button{all:unset;cursor:pointer}
.cb-product-row h3 button::after{content:"";position:absolute;inset:0}
.cb-product-row:has(h3 button:focus-visible){outline:3px solid var(--focus);outline-offset:2px;border-radius:12px}
.cb-product-row__dots{flex:1;min-width:12px;border-bottom:2px dotted rgba(42,27,20,.35);transform:translateY(-4px)}
.cb-product-row__price{font:800 1.125rem/1 var(--font-display);font-variation-settings:"wdth" 78;color:var(--price);white-space:nowrap}
.cb-product-row__desc{margin:3px 0 0;font-size:.8125rem;color:var(--ink-2)}
.cb-product-row .cb-plus{position:relative;z-index:2;width:46px;height:46px}
.cb-product-row .cb-stepper{position:relative;z-index:2}
.cb-product-row.is-sold-out .cb-product-row__img img{filter:grayscale(1) opacity(.45)}
.cb-product-row.is-sold-out .cb-product-row__price{text-decoration:line-through;color:var(--espresso-3)}

/* ---------- Category chips (sticky, scroll-spy) ---------- */
.cb-chips{position:sticky;top:var(--hd-h,72px);z-index:20;background:var(--paper);border-bottom:1px solid var(--line)}
.cb-chips__list{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;padding:10px var(--gutter);list-style:none;scrollbar-width:none}
.cb-chips__list::-webkit-scrollbar{display:none}
.cb-chip{display:inline-flex;align-items:center;gap:8px;min-height:var(--tap);padding:0 16px;border-radius:var(--r-pill);background:var(--cream);font-size:.875rem;font-weight:800;white-space:nowrap;text-decoration:none;scroll-snap-align:start;transition:background-color var(--dur-2),color var(--dur-2)}
.cb-chip[aria-current="true"]{background:var(--espresso);color:var(--sun)}
.cb-chip img{width:26px;height:26px;margin-left:-8px}
@media (min-width:1024px){.cb-chips{top:88px}}

/* ---------- Choice tiles: group size, radios as pills ---------- */
.cb-choices{display:flex;flex-wrap:wrap;gap:8px}
.cb-choice{position:relative}
.cb-choice input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.cb-choice span{display:grid;place-items:center;min-width:64px;min-height:56px;padding:6px 16px;border-radius:var(--r-md);border:2px solid var(--line-strong);background:var(--paper);font-weight:800;line-height:1.1;text-align:center;transition:all var(--dur-1)}
.cb-choice small{display:block;font-size:.75rem;font-weight:700;color:var(--ink-2)}
.cb-choice input:checked+span{border-color:var(--espresso);background:var(--espresso);color:var(--sun)}
.cb-choice input:checked+span small{color:var(--cream)}
.cb-choice input:focus-visible+span{outline:3px solid var(--focus);outline-offset:2px}
.cb-choice input:disabled+span{opacity:.45;text-decoration:line-through}

/* ---------- Sticky mobile cart bar ---------- */
.cb-sticky-cart{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:var(--z-bar);transform:translateY(calc(100% + 24px));transition:transform var(--dur-3) var(--ease-spring)}
.cb-sticky-cart.is-visible{transform:none}
.cb-sticky-cart button{display:flex;align-items:center;gap:12px;width:100%;min-height:60px;padding:0 10px 0 10px;border-radius:var(--r-pill);border:2px solid var(--espresso);background:var(--terracotta);color:var(--paper);box-shadow:0 4px 0 var(--espresso),0 18px 30px -12px rgba(42,27,20,.55);font-weight:800;text-align:left}
.cb-sticky-cart__count{display:grid;place-items:center;min-width:40px;height:40px;padding:0 8px;border-radius:var(--r-pill);background:var(--sun);color:var(--espresso);font-size:1rem}
.cb-sticky-cart__label{flex:1;font-size:1rem;letter-spacing:.02em}
.cb-sticky-cart__label small{display:block;font-size:.75rem;font-weight:700}
.cb-sticky-cart__total{padding-right:10px;font:800 1.375rem/1 var(--font-display);font-variation-settings:"wdth" 78}
.cb-sticky-cart button.is-bump{animation:cb-bump .42s var(--ease-spring)}
.has-sticky-cart{padding-bottom:88px}
@media (min-width:1024px){.cb-sticky-cart{display:none}.has-sticky-cart{padding-bottom:0}}

/* ---------- FAQ (<details>) ---------- */
.cb-faq{display:grid;gap:10px}
.cb-faq details{border-radius:var(--r-lg);background:var(--paper);box-shadow:var(--sh-1);transition:background-color var(--dur-2)}
.cb-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:14px 18px 14px 22px;font:800 1.1875rem/1.2 var(--font-display);font-variation-settings:"wdth" 86;letter-spacing:-.015em;list-style:none}
.cb-faq summary::-webkit-details-marker{display:none}
.cb-faq summary::after{content:"";flex:0 0 36px;height:36px;border-radius:50%;background:var(--sun) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 6v12M6 12h12' stroke='%232A1B14' stroke-width='2.8' stroke-linecap='round'/%3E%3C/svg%3E") 50%/18px no-repeat;transition:transform var(--dur-2) var(--ease-spring)}
.cb-faq details[open]{background:var(--cream)}
.cb-faq details[open] summary::after{transform:rotate(135deg)}
.cb-faq__a{padding:0 22px 20px;color:var(--ink-2);max-width:64ch}

/* ---------- Reviews (a reviews plugin's own widget) ---------- */
/* The one rule the theme puts on somebody else's component, and it is not a style: a widget built for a
   wider column than this one would push the page sideways, and a page that scrolls sideways on a phone is
   broken in a way nobody reports. So the box is held to the column and anything still wider than it scrolls
   inside its own box instead of taking the document with it. Everything about how the reviews look - the
   cards, the stars, the type - is the plugin's, and restyling it from here would be undone by its next
   update. The body already carries overflow-x:clip; this keeps the overflow from reaching it at all. */
.cb-reviews__widget{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
.cb-reviews__widget>*{max-width:100%}
.cb-reviews__widget iframe,.cb-reviews__widget img{max-width:100%}

/* ---------- Steps ---------- */
.cb-steps{display:grid;gap:clamp(28px,4vw,40px);list-style:none;counter-reset:step}
.cb-step{position:relative;display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:start}
.cb-step__n{font:800 clamp(5rem,4rem + 5vw,9rem)/.78 var(--font-display);font-variation-settings:"wdth" 76;letter-spacing:-.06em;color:var(--sun);-webkit-text-stroke:2px var(--espresso);paint-order:stroke fill;text-shadow:5px 5px 0 var(--espresso)}
.cb-step h3{margin-top:6px;font-size:var(--fs-h3)}
.cb-step p{margin:8px 0 0;color:var(--ink-2);max-width:32ch}
.on-dark .cb-step p{color:var(--cream)}
.cb-step__doodle{width:44px;height:44px;margin-top:10px;color:var(--terracotta)}
@media (min-width:1024px){.cb-steps{grid-template-columns:repeat(3,1fr)}.cb-step{grid-template-columns:1fr}}

/* ---------- Media / photos ---------- */
.cb-photo{position:relative;overflow:hidden;border-radius:var(--r-xl);background:var(--pool)}
.cb-photo picture{display:contents}
.cb-photo img{width:100%;height:100%;object-fit:cover}

/* ---------- Zone map + zone cards ---------- */
.cb-zone-map{position:relative;border-radius:var(--r-xl);overflow:hidden;background:var(--pool);aspect-ratio:4/3}
.cb-zone-map svg{width:100%;height:100%}
.cb-zone-map text{font-family:var(--font-body);font-weight:800}
.cb-zones{display:grid;gap:12px;list-style:none}
.cb-zone{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:center;padding:16px 18px;border-radius:var(--r-lg);background:var(--paper);box-shadow:var(--sh-1)}
.cb-zone__key{grid-row:span 2;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--z,var(--sun));font:800 1.625rem/1 var(--font-display);border:2px solid var(--espresso)}
.cb-zone h3{font-size:1.375rem}
.cb-zone dl{display:flex;flex-wrap:wrap;gap:4px 14px;margin:0;font-size:var(--fs-sm)}
.cb-zone dl div{display:flex;gap:4px}
.cb-zone dt{color:var(--ink-2);font-weight:600}
.cb-zone dd{margin:0;font-weight:800}

/* ---------- Toast ---------- */
.cb-toast{position:fixed;left:50%;bottom:92px;z-index:var(--z-toast);display:flex;align-items:center;gap:10px;max-width:calc(100% - 32px);padding:12px 18px 12px 12px;border-radius:var(--r-pill);background:var(--espresso);color:var(--paper);font-weight:700;box-shadow:var(--sh-3);transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:all var(--dur-2) var(--ease-spring)}
.cb-toast.is-visible{transform:translate(-50%,0);opacity:1}
.cb-toast .i{width:26px;height:26px;color:var(--sun)}
@media (min-width:1024px){.cb-toast{bottom:32px}}

/* ---------- Footer ---------- */
.cb-footer{position:relative;background:var(--espresso);color:var(--cream);padding:clamp(56px,7vw,96px) 0 28px}
/* The bumps hang up over the section above, the way --hang hangs down over the one below, so the gaps between
   them show that section's own colour whatever it is. The footer used to carry a 22px top margin instead, which
   left a strip of page background the bumps could not reach: under a sun-coloured section that strip read as a
   white line between the yellow and the brown. The 1px is the same seam-closer --hang uses. */
.cb-footer>.cb-scallop{--sc-c:var(--espresso);position:absolute;left:0;right:0;top:calc(var(--sc-h)*-1 + 1px)}
/* Every page the design owns ends in one of its own padded blocks, which has room to spare for the bumps to hang
   over. A page that does not - a bare WooCommerce archive, whose last line is its pagination - gets that room
   reserved instead, so the bumps never sit on top of its content. */
#main:not(:has(>.cb-section:last-child,>.cb-wrap:last-child))+.cb-footer{margin-top:clamp(22px,3vw,40px)}
.cb-footer a{color:var(--cream)}
.cb-footer__top{display:grid;gap:36px}
.cb-footer__brand p{margin:14px 0 0;max-width:34ch;color:var(--cream)}
.cb-footer__cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}
.cb-footer h2{margin:0 0 10px;font:800 .75rem/1 var(--font-body);letter-spacing:.16em;text-transform:uppercase;color:var(--sun)}
.cb-footer ul{list-style:none;display:grid;gap:0}
.cb-footer li a{display:inline-flex;align-items:center;min-height:var(--tap);text-decoration:none;font-weight:600}
.cb-footer li a:hover{text-decoration:underline}
.cb-footer__hours{font-size:var(--fs-sm);line-height:1.7}
.cb-footer__hours b{color:var(--sun)}
/* The number reads as part of the address block, so it is weighted like the lines around it rather than like the
   links in the column. The ::after is the trick the legal line uses: a 24px line of text in a 44px hit area, with
   nothing to see for it. ---------- */
.cb-footer__tel{position:relative;display:inline-block;text-decoration:none;font-weight:600}
.cb-footer__tel:hover{text-decoration:underline}
.cb-footer__tel::after{content:"";position:absolute;inset:-10px -6px}
.cb-footer .cb-stamp{--size:128px;--stamp-bg:var(--sun);color:var(--espresso)}
.cb-footer__legal{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;justify-content:space-between;margin-top:48px;padding-top:20px;border-top:1px solid rgba(255,244,223,.18);font-size:.8125rem;color:rgba(255,244,223,.85)}
.cb-footer__legal p{margin:0}
.cb-footer__legal ul{display:flex;flex-wrap:wrap;gap:4px 18px}
.cb-footer__legal a{position:relative;min-height:var(--tap);display:inline-flex;align-items:center}
.cb-footer__legal a::after{content:"";position:absolute;inset:0 -6px} /* 44px wide hit area for short words, no visual change */
@media (min-width:1024px){.cb-footer__top{grid-template-columns:1.1fr 2fr auto;align-items:start}.cb-footer__cols{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- Small-screen utility ---------- */
@media (max-width:767px){.cb-hide-sm{display:none!important}}