*{box-sizing:border-box}html,body{margin:0;padding:0;background:#ef001c}body{min-width:320px;font-family:Arial,Helvetica,sans-serif}.page-shell{width:100%;display:flex;justify-content:center}.campaign{position:relative;width:min(100vw,670px);overflow:hidden;line-height:0;background:#ef001c}.campaign-artwork{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}.burger-overlay{position:absolute;z-index:2;left:3.1%;top:14.28%;width:93.8%;height:auto;transform:scale(1);transform-origin:50% 50%;transition:transform .38s cubic-bezier(.2,.75,.2,1);cursor:pointer}.burger-overlay:hover{transform:scale(1.045)}@media(hover:none),(pointer:coarse){.burger-overlay:hover{transform:scale(1)}.burger-overlay.is-mobile-zoomed{transform:scale(1.08)}}.promo-button{position:absolute;z-index:5;left:6.57%;top:39.36%;width:87.16%;height:4.74%;padding:0;border:0;border-radius:12px;overflow:hidden;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}.promo-state{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block;pointer-events:none}.promo-before{z-index:1}.promo-hover-grey{position:absolute;inset:0;z-index:2;background:#666;mix-blend-mode:screen;opacity:0;pointer-events:none;transition:opacity .18s ease}.promo-button:not(.is-revealed):hover .promo-hover-grey{opacity:1}.promo-reveal-mask{position:absolute;inset:0;z-index:3;overflow:hidden;clip-path:inset(0 50% 0 50%);opacity:0;transition:clip-path .52s cubic-bezier(.22,.8,.2,1),opacity .16s ease}.promo-button.is-revealed .promo-reveal-mask{clip-path:inset(0);opacity:1}.copy-toast{position:absolute;z-index:6;left:50%;bottom:8%;transform:translate(-50%,8px);padding:.55em .9em;border-radius:999px;background:rgba(0,0,0,.88);color:#fff;font-size:clamp(8px,2.2vw,14px);font-weight:800;line-height:1;opacity:0;pointer-events:none;white-space:nowrap;transition:.16s ease}.copy-toast.is-visible{opacity:1;transform:translate(-50%,0)}.video-wrap{position:absolute;z-index:5;left:15.37%;top:47.66%;width:69.55%;height:17.14%;overflow:hidden;background:#000}.campaign-video{width:100%;height:100%;object-fit:cover;display:block;background:#000}.video-toggle{position:absolute;inset:0;z-index:3;border:0;background:transparent;display:grid;place-items:center;cursor:pointer}.video-control-icon{width:70px;aspect-ratio:1;border:5px solid #fff;border-radius:50%;background:rgba(0,0,0,.15);display:grid;place-items:center;transition:opacity .16s ease,transform .16s ease}.play-icon:before{content:"";width:0;height:0;border-top:13px solid transparent;border-bottom:13px solid transparent;border-left:21px solid #fff;margin-left:5px}.pause-icon{position:relative;display:block}.pause-icon:before,.pause-icon:after{content:"";position:absolute;top:50%;width:9px;height:30px;border-radius:2px;background:#fff;transform:translateY(-50%)}.pause-icon:before{left:calc(50% - 12px)}.pause-icon:after{left:calc(50% + 3px)}.video-wrap.is-playing .video-control-icon{opacity:0;transform:scale(.92)}.video-wrap.show-controls .video-control-icon,.video-wrap.is-paused .video-control-icon{opacity:1;transform:scale(1)}.fullscreen-button{position:absolute;z-index:4;right:10px;bottom:10px;width:40px;height:40px;border:0;border-radius:50%;background:rgba(0,0,0,.65);color:#fff;font-size:21px;cursor:pointer;opacity:1}.video-wrap:fullscreen,.video-wrap:-webkit-full-screen{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;background:#000!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important}.video-wrap:fullscreen .campaign-video,.video-wrap:-webkit-full-screen .campaign-video{width:100%!important;height:100%!important;object-fit:contain!important;background:#000!important}.video-wrap:fullscreen .fullscreen-button,.video-wrap:-webkit-full-screen .fullscreen-button{position:fixed!important;right:max(16px,env(safe-area-inset-right))!important;bottom:max(16px,env(safe-area-inset-bottom))!important;z-index:2147483647!important;width:48px;height:48px;pointer-events:auto!important}.store-map-section{position:absolute;z-index:3;left:0;top:72.70%;width:100%;height:20.80%;background:#fff;overflow:hidden;line-height:normal}.store-map-shell{position:relative;width:100%;height:100%;background:#f7f7f4;overflow:hidden}.store-map-svg{width:100%;height:100%;display:block}.map-road{fill:none;stroke:#dddcd6;stroke-width:4;stroke-linecap:round}.map-road.minor{stroke-width:2;stroke:#e9e8e3}.map-river{fill:none;stroke:#d8e4e7;stroke-width:15;stroke-linecap:round}.map-label{font-size:22px;font-weight:800;fill:#b8b7b0;letter-spacing:.08em}.store-pin{cursor:pointer;transform-box:fill-box;transform-origin:center;transition:transform .15s ease}.store-pin:hover,.store-pin:focus{transform:scale(1.18)}.pin-dot{fill:#ef001c;stroke:#fff;stroke-width:5;filter:drop-shadow(0 4px 5px rgba(0,0,0,.16))}.pin-core{fill:#fff}.store-popover{position:absolute;z-index:20;min-width:220px;max-width:265px;padding:14px 42px 14px 16px;border-radius:14px;background:#fff;color:#111;box-shadow:0 10px 28px rgba(0,0,0,.18);border:1px solid rgba(0,0,0,.07);line-height:1.25}.store-popover strong{display:block;font-size:15px;margin-bottom:5px}.store-popover span{display:block;font-size:11px;color:#666;margin-bottom:10px}.store-popover a{font-size:10px;font-weight:900;color:#ef001c;text-decoration:none}.store-popover-close{position:absolute;top:7px;right:8px;width:28px;height:28px;border:0;background:#f1f1ee;border-radius:50%;font-size:18px;cursor:pointer}.map-legend{position:absolute;left:15px;bottom:12px;display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.93);box-shadow:0 4px 16px rgba(0,0,0,.08);font-size:9px;font-weight:900;color:#555}.legend-pin{width:12px;height:12px;border-radius:50%;background:#ef001c;box-shadow:0 0 0 3px #fff,0 0 0 4px rgba(0,0,0,.08)}.bristol-inset{fill:#fff;stroke:#e4e4df;stroke-width:2}.bristol-label{font-size:19px;font-weight:900;fill:#a5a5a0;letter-spacing:.06em}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}@media(max-width:520px){.store-popover{min-width:185px;max-width:220px;padding:12px 36px 12px 13px}.store-popover strong{font-size:13px}.store-popover span{font-size:10px}}

/* V21 mobile-safe burger alignment */
.burger-underlay-img,
.burger-overlay {
  position: absolute;
  left: .30% !important;
  top: 14.26% !important;
  width: 99.40% !important;
  height: auto !important;
  transform-origin: 50% 50% !important;
  -webkit-transform-origin: 50% 50% !important;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.burger-underlay-img {
  z-index: 2;
  pointer-events: none;
  transform: translateZ(0) scale(1.012);
  -webkit-transform: translateZ(0) scale(1.012);
}

.burger-overlay {
  z-index: 3 !important;
  cursor: pointer;
  touch-action: manipulation;
  transform: translateZ(0) scale(1);
  -webkit-transform: translateZ(0) scale(1);
  transition: transform .38s cubic-bezier(.2,.75,.2,1);
  -webkit-transition: -webkit-transform .38s cubic-bezier(.2,.75,.2,1);
  will-change: transform;
}

@media (hover:hover) and (pointer:fine) {
  .burger-overlay:hover {
    transform: translateZ(0) scale(1.045) !important;
    -webkit-transform: translateZ(0) scale(1.045) !important;
  }
}

@media (hover:none), (pointer:coarse) {
  .burger-overlay:hover {
    transform: translateZ(0) scale(1) !important;
    -webkit-transform: translateZ(0) scale(1) !important;
  }

  .burger-overlay.is-mobile-zoomed {
    transform: translateZ(0) scale(1.08) !important;
    -webkit-transform: translateZ(0) scale(1.08) !important;
  }
}

/* Lock the campaign to the exact source-artwork ratio on all mobile browsers. */
.campaign {
  width: min(100vw, 670px) !important;
  aspect-ratio: 670 / 2048;
}

.campaign-artwork {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain;
}

/* V17 real interactive map */
.store-map-section {
  position: absolute;
  z-index: 4;
  left: 0;
  top: 72.70%;
  width: 100%;
  height: 20.80%;
  background: #fff;
  overflow: hidden;
  line-height: normal;
}

.store-map {
  width: 100%;
  height: 100%;
  background: #f3f3f0;
}

.store-map .leaflet-control-zoom {
  border: 0 !important;
  border-radius: 10px !important;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0,0,0,.14) !important;
}

.store-map .leaflet-control-zoom a {
  color: #111 !important;
  border: 0 !important;
  font-weight: 800;
}

.store-map .leaflet-control-attribution {
  font-size: 8px;
  background: rgba(255,255,255,.82);
}

.cm-pin-wrap {
  background: transparent !important;
  border: 0 !important;
}

.cm-pin {
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #ef001c;
  border: 4px solid #fff;
  box-shadow: 0 4px 10px rgba(0,0,0,.24);
  position: relative;
}

.cm-pin-core {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.cm-popup {
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.28;
  min-width: 180px;
}

.cm-popup strong {
  display: block;
  font-size: 14px;
  margin-bottom: 5px;
  color: #111;
}

.cm-popup span {
  display: block;
  font-size: 11px;
  color: #666;
  margin-bottom: 10px;
}

.cm-popup a {
  font-size: 10px;
  font-weight: 900;
  color: #ef001c;
  text-decoration: none;
  letter-spacing: .04em;
}

.leaflet-popup-content-wrapper {
  border-radius: 14px !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.18) !important;
}

.cm-locate {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 9px;
  background: #fff;
  color: #111;
  font-size: 23px;
  line-height: 36px;
  box-shadow: 0 4px 14px rgba(0,0,0,.15);
  cursor: pointer;
}

.cm-user-dot {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #111;
  border: 4px solid #ef001c;
  box-shadow: 0 0 0 3px #fff, 0 4px 10px rgba(0,0,0,.25);
}


/* V18 — restrained Cheat Meals map treatment */
.map-monochrome .leaflet-tile-pane {
  filter: grayscale(1) saturate(0) brightness(1.08) contrast(.88);
  -webkit-filter: grayscale(1) saturate(0) brightness(1.08) contrast(.88);
}

/* Soften the overall map without affecting red store markers */
.map-monochrome {
  background: #f2f2f0;
}

.map-monochrome .leaflet-control-zoom a,
.map-monochrome .cm-locate {
  background: #f7f7f5 !important;
  color: #2d2d2d !important;
}

.map-monochrome .leaflet-control-attribution {
  color: #777;
  background: rgba(247,247,245,.88);
}

/* Keep the only strong map colour on-brand */
.map-monochrome .cm-pin {
  background: #ef001c;
}

.map-monochrome .cm-user-dot {
  background: #555;
  border-color: #ef001c;
}


/* V19 refined map treatment */
.map-monochrome .leaflet-tile-pane {
  filter:
    grayscale(.62)
    saturate(.62)
    sepia(.06)
    hue-rotate(330deg)
    brightness(1.04)
    contrast(.92);
  -webkit-filter:
    grayscale(.62)
    saturate(.62)
    sepia(.06)
    hue-rotate(330deg)
    brightness(1.04)
    contrast(.92);
}

/* Soften dense map detail without making it flat */
.map-monochrome .leaflet-tile {
  opacity: .92;
}

/* Proper teardrop location pins */
.cm-pin {
  position: relative;
  display: block;
  width: 30px;
  height: 30px;
  background: #ef001c;
  border: 4px solid #fff;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  box-shadow: 0 5px 12px rgba(0,0,0,.22);
}

.cm-pin-core {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}

/* Keep the map controls visually quiet */
.store-map .leaflet-control-zoom a,
.store-map .cm-locate {
  background: rgba(250,250,248,.96) !important;
  color: #333 !important;
  box-shadow: none !important;
}

.store-map .leaflet-control-zoom,
.store-map .cm-locate {
  border: 1px solid rgba(0,0,0,.08) !important;
}

.store-map .leaflet-popup-content-wrapper {
  background: #fffdfb !important;
}

/* Tone down secondary text/attribution */
.store-map .leaflet-control-attribution {
  opacity: .72;
}

/* Slightly warmer map canvas so it doesn't feel sterile */
.store-map {
  background: #f2f0ed !important;
}


/* V20 — clean two-grey interactive map, no API-key watermark */
.map-monochrome .leaflet-tile-pane {
  filter:
    grayscale(.88)
    saturate(.18)
    sepia(.025)
    brightness(1.09)
    contrast(.78);
  -webkit-filter:
    grayscale(.88)
    saturate(.18)
    sepia(.025)
    brightness(1.09)
    contrast(.78);
}

/* Gives the map a second visible grey level without overpowering the red pins */
.map-monochrome .leaflet-tile {
  opacity: .82;
}

.store-map {
  background: #dededb !important;
}

/* Keep map labels/roads readable but visually subordinate */
.store-map .leaflet-map-pane {
  background: #e5e5e2;
}

/* Brand pins remain the strongest colour */
.store-map .cm-pin {
  background: #ef001c !important;
  border-color: #fff !important;
}

/* Cleaner controls */
.store-map .leaflet-control-zoom,
.store-map .cm-locate {
  background: #e7e7e4 !important;
}

.store-map .leaflet-control-zoom a,
.store-map .cm-locate {
  background: #f2f2f0 !important;
  color: #3d3d3d !important;
}

/* Keep required map attribution discreet but legible */
.store-map .leaflet-control-attribution {
  background: rgba(232,232,229,.88) !important;
  color: #777 !important;
  font-size: 7px !important;
}


/* V21 iOS/Safari rendering safeguards */
.promo-button,
.video-wrap,
.store-map-section {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  overflow-x: hidden;
}


/* V23 — OpenFreeMap Positron.
   This is the map style matching the preferred reference:
   pale grey/off-white land, soft road hierarchy, subdued labels,
   and enough detail to orient around London. */
.store-map,
.map-monochrome {
  background: #f3f2ef !important;
}

.map-monochrome .leaflet-tile-pane,
.map-monochrome .leaflet-tile {
  filter: none !important;
  -webkit-filter: none !important;
  opacity: 1 !important;
}

/* MapLibre canvas should render untouched. */
.store-map .maplibregl-canvas,
.store-map .maplibregl-canvas-container {
  filter: none !important;
  -webkit-filter: none !important;
}

/* Keep our red pins visually dominant. */
.store-map .cm-pin {
  background: #ef001c !important;
  border: 4px solid #fff !important;
  box-shadow: 0 5px 12px rgba(0,0,0,.22) !important;
}

/* Clean controls to match the reference screenshot. */
.store-map .leaflet-control-zoom {
  border: 1px solid rgba(0,0,0,.08) !important;
  border-radius: 10px !important;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0,0,0,.10) !important;
}

.store-map .leaflet-control-zoom a,
.store-map .cm-locate {
  background: rgba(255,255,255,.96) !important;
  color: #333 !important;
}

/* MapLibre already handles OpenFreeMap/OpenStreetMap attribution. */
.store-map .maplibregl-ctrl-attrib,
.store-map .leaflet-control-attribution {
  font-size: 7px !important;
  color: #888 !important;
  background: rgba(248,247,244,.86) !important;
}

/* Ensure the vector canvas sits behind Leaflet markers/popups. */
.store-map .maplibregl-map {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.store-map .leaflet-marker-pane,
.store-map .leaflet-popup-pane,
.store-map .leaflet-control-container {
  z-index: 500;
}


/* V27 — HD T&Cs placed only over the original footer area */
.hd-terms {
  position: absolute;
  z-index: 20;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 6.55%;
  background: #ef001c;
  color: #fff;
  text-align: center;
  line-height: normal;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 1.45% 5.7% 0;
  pointer-events: none;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

.hd-terms h2 {
  margin: 0 0 .95%;
  padding: 0;
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(10px, 2.45vw, 16px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.025em;
}

.hd-terms p {
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 590px;
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(5.5px, 1.33vw, 8.9px);
  font-weight: 700;
  line-height: .98;
  letter-spacing: -.025em;
}