/* Elf Watch homepage (29 Oct 2026 rebuild, Head of Design review approved by Paul).
   Six panels on the night sky (css/site-theme.css): the hero with the Elf HQ camera, how it works,
   the real Studio videos, last year in numbers, the Christmas shop waiting list, questions.
   One file for the whole page; loaded after site-theme.css. Phones: 16px side gutter. */

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:16px}
html,body{overflow-x:clip;max-width:100%}
body.ew-home{margin:0;color:var(--ewn-ink);font:400 16px/1.55 'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.ew-home img{display:block;max-width:100%;height:auto}
.ew-home a{color:inherit}
.ew-home h1,.ew-home h2,.ew-home h3,.ew-home p{margin:0}
.ew-home h1,.ew-home h2,.ew-home h3{font-family:'Plus Jakarta Sans','Inter',sans-serif;font-weight:800;letter-spacing:-.01em;color:var(--ewn-night)}
.ew-home em{font-style:normal;color:#B3122A}
.skip-link{position:fixed;top:8px;left:10px;z-index:100;background:#fff;color:#172744;padding:10px 15px;border-radius:8px}
.skip-link:not(:focus-visible){width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.ew-home :is(a,button,summary,input):focus-visible{outline:3px solid #2F5FB8;outline-offset:3px}

/* the header: on this page the hero holds the one "Spot my elf" button, so the header's copy is hidden */
body.ew-home .ew-header a.ew-header__cta{display:none}
body.ew-home .ew-header button.ew-header__toggle{margin-left:auto}
/* the language picker (1 Nov 2026, home/home-i18n.js): the Elf Tracker's dark see-through pill with white words */
.ew-home .ew-lang{flex:0 0 auto;display:inline-flex;margin:0}
.ew-home .ew-lang select{-webkit-appearance:none;appearance:none;min-height:44px;max-width:170px;margin:0;padding:0 38px 0 16px;border-radius:999px;border:1.5px solid rgba(255,255,255,.55);
  color:#fff;font:700 14px/1.2 'Inter',system-ui,sans-serif;cursor:pointer;
  background:rgba(8,20,58,.55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") right 14px center/12px 8px no-repeat;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ew-home .ew-lang select option{color:#0B1D4D;background:#fff}
.ew-home .ew-lang select:focus-visible{outline:3px solid var(--ewn-gold,#F5C24A);outline-offset:3px}
@media(max-width:960px){body.ew-home .ew-header .ew-lang{margin-left:auto}body.ew-home .ew-header .ew-lang~button.ew-header__toggle{margin-left:0}}
@media(max-width:400px){.ew-home .ew-lang select{padding:0 30px 0 12px;font-size:13px;background-position:right 11px center}}
/* the words are being swapped into the visitor's language (2 seconds at most) */
html.ew-i18n-wait body.ew-home main,html.ew-i18n-wait body.ew-home .ew-header nav,html.ew-i18n-wait body.ew-home .ew-footer{opacity:0}

/* ---------- buttons (words only, no arrows) ---------- */
.ew-home .button{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 28px;border:0;border-radius:999px;
  background:var(--ewn-red);color:#fff;font:800 18px/1.1 'Plus Jakarta Sans','Inter',sans-serif;text-decoration:none;cursor:pointer;
  box-shadow:0 5px 0 #9F1D2B,0 12px 24px rgba(0,0,0,.28);transition:transform .15s,background .15s}
.ew-home .button:hover{background:#B81F33;transform:translateY(-1px)}
.ew-home .button:active{transform:translateY(3px);box-shadow:0 2px 0 #9F1D2B,0 6px 14px rgba(0,0,0,.25)}

/* ---------- the panels ---------- */
main>section.hm{position:relative;max-width:1200px;margin:44px max(24px,calc((100% - 1200px) / 2));padding:clamp(22px,4vw,48px);border-radius:var(--ewn-r);
  background:var(--ewn-cream);box-shadow:0 18px 40px rgba(0,0,0,.4)}
/* the snow cap, as on the tracker's cards */
main>section.hm::after{content:"";position:absolute;left:-6px;right:-6px;top:-15px;height:36px;z-index:3;pointer-events:none;
  background:var(--ewn-cap) repeat-x left top/260px 36px;border-radius:16px 16px 6px 6px;filter:drop-shadow(0 2px 2px rgba(10,22,56,.28))}
main>section.hm:first-child{margin-top:20px}
.hm h2{font-size:clamp(28px,3.6vw,44px);line-height:1.1}
.hm h3{font-size:20px;line-height:1.25}

/* ---------- 1. hero ---------- */
.hm-hero{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:center}
.hm-hero h1{font-size:clamp(34px,4.2vw,56px);line-height:1.04;text-wrap:balance}
.hm-hero h1 em{display:block}
.hm-lead{margin-top:18px;font-size:clamp(17px,1.6vw,20px);line-height:1.5;color:#26365F;max-width:30em}
.hm-cta{margin-top:22px}
.hm-hero__cam{position:relative;border-radius:22px;overflow:hidden;background:#06102E;border:6px solid var(--ewn-night);box-shadow:0 18px 36px rgba(11,29,77,.35)}
.hm-hero__cam #heroSpot{display:block;width:100%}
.hm-hero__cam .rc-sound{margin:8px auto;background:#fff}
/* the line-up covers the camera screen for the first 3 seconds on the site (Paul, 30 Oct 2026); home.js fades it */
.hm-lineup{position:absolute;left:0;top:0;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;z-index:30;transition:opacity .8s}
.hm-lineup.gone{opacity:0;pointer-events:none}

/* ---------- 2. how it works ---------- */
.hm-steps{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.hm-step{display:flex;flex-direction:column;border-radius:20px;background:#fff;overflow:hidden;box-shadow:0 10px 26px -14px rgba(11,29,77,.45)}
.hm-step__pic{position:relative;aspect-ratio:4/3;background:#0B1D4D}
.hm-step__pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hm-step__tag{position:absolute;left:10px;top:10px;padding:5px 10px;border-radius:999px;background:rgba(8,20,58,.82);color:#fff;
  font:700 12px/1 'Plus Jakarta Sans','Inter',sans-serif;letter-spacing:.04em;text-transform:uppercase}
.hm-step__body{padding:16px 18px 20px;display:grid;gap:8px;align-content:start}
.hm-step__when{display:flex;align-items:center;gap:10px;font:700 14px/1.2 'Plus Jakarta Sans','Inter',sans-serif;color:#B3122A}
.hm-step__when .hm-num{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--ewn-night);color:var(--ewn-gold);font-size:15px;font-weight:800}
.hm-step h3{display:flex;align-items:center;flex-wrap:wrap}
.hm-step p{font-size:16px;color:#26365F}
.hm-step p a{color:#B3122A;font-weight:700}
.hm-quiet{font-size:14px!important;color:#4A5B7D!important}
.hm-legal{font-size:14px!important;line-height:1.45;color:#33456F!important;padding:10px 12px;border-radius:12px;background:#F3F6FD}

/* ---------- 3. the advert (Billboard, Paul 29 Oct 2026): huge words, a real iPhone, the date ---------- */
.hm-videos{display:grid;grid-template-columns:minmax(0,1fr) auto;justify-content:center;gap:clamp(28px,6vw,96px);align-items:center;
  background:radial-gradient(60% 55% at 88% 8%,rgba(148,197,255,.38),transparent 60%),radial-gradient(50% 50% at 6% 100%,rgba(231,25,64,.35),transparent 60%),linear-gradient(#031F47,#042D63)!important;border:0}
.hm-videos::after{display:none}
.hm-videos__copy{display:grid;gap:22px;justify-items:start;max-width:680px}
.hm-videos h2.hm-bill{color:#fff;font:800 clamp(44px,5.6vw,76px)/.98 'Plus Jakarta Sans','Inter',sans-serif;letter-spacing:-.025em;margin:0}
.hm-videos h2.hm-bill em{font-style:normal;color:#FF5C77}
.hm-bill__sub{margin:0;font:600 clamp(19px,2.1vw,25px)/1.35 'Inter',sans-serif;color:#DCE7FF;max-width:24em}
.hm-date{margin:0;display:inline-block;background:#E71940;color:#fff;font:800 clamp(18px,2vw,24px)/1.2 'Plus Jakarta Sans','Inter',sans-serif;padding:12px 20px;border-radius:14px}
.hm-bill__cta{display:inline-flex;align-items:center;min-height:52px;padding:0 26px;border-radius:999px;background:#fff;color:#042D63;
  font:800 18px/1.2 'Plus Jakarta Sans','Inter',sans-serif;text-decoration:none;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.hm-bill__cta:hover,.hm-bill__cta:focus-visible{background:#EDF3FE}
/* The longer "Watch the North Pole CCTV free" can wrap on phones: two centred lines with room before the phone (copy changes, 7 Nov 2026). */
.hm-bill__cta{justify-content:center;text-align:center;padding-block:8px;margin-bottom:22px}
.hm-phone{--w:min(300px,70vw);position:relative;width:var(--w);aspect-ratio:9/19.5;border-radius:calc(var(--w)*.17);padding:calc(var(--w)*.035);justify-self:center;
  background:linear-gradient(135deg,#d9dde3,#8c939d 30%,#f3f5f7 50%,#7d848e 70%,#c9ced5);box-shadow:0 34px 70px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.45)}
.hm-phone__screen{position:relative;width:100%;height:100%;border-radius:calc(var(--w)*.14);overflow:hidden;background:#000;box-shadow:0 0 0 calc(var(--w)*.012) #000}
.hm-phone video{display:block;width:100%;height:100%;object-fit:contain;background:#000}
.hm-phone__island{position:absolute;top:calc(var(--w)*.035);left:50%;transform:translateX(-50%);width:32%;height:calc(var(--w)*.085);background:#000;border-radius:999px}
.hm-phone__btn{position:absolute;width:4px;background:#9aa1ab;border-radius:2px}
.hm-phone__btn--a{left:-3px;top:17%;height:5%}.hm-phone__btn--b{left:-3px;top:26%;height:9%}.hm-phone__btn--c{left:-3px;top:37%;height:9%}.hm-phone__btn--d{right:-3px;top:29%;height:13%}
.hm-pause{position:absolute;right:14px;bottom:16px;min-height:36px;padding:0 14px;border-radius:999px;border:1.5px solid rgba(255,255,255,.7);
  background:rgba(8,20,58,.75);color:#fff;font:700 13px/1 'Inter',sans-serif;cursor:pointer}

/* ---------- 4. last year in numbers ---------- */
.hm-numbers{background:linear-gradient(180deg,#14306F,#0F2459)!important;border:2px solid rgba(245,194,74,.7);color:#fff}
.hm-numbers::after{display:none}
.hm-numbers h2{color:#fff}
.hm-stats{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.hm-stat{display:grid;gap:4px;align-content:start;padding:18px 16px;border-radius:18px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16)}
.hm-stat__n{font:800 clamp(30px,3.2vw,44px)/1 'Plus Jakarta Sans','Inter',sans-serif;color:var(--ewn-gold);font-variant-numeric:tabular-nums}
.hm-stat__l{font-size:15px;line-height:1.35;color:var(--ewn-pale)}
.hm-source{margin-top:16px;font-size:14px;color:var(--ewn-pale)}
.hm-source a{color:#fff;font-weight:700;margin-left:6px}

/* ---------- 5. the Christmas shop ---------- */
.hm-products{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;text-align:center}
.hm-products li{display:grid;justify-items:center;gap:4px;align-content:start}
.hm-products img{width:auto;max-height:200px;margin-bottom:6px}
.hm-products h3{font-size:17px}
.hm-products small{font-size:13px;color:#4A5B7D}
.shop-waitlist{max-width:640px;margin:24px auto 0;padding:20px;border-radius:22px;background:#fff;box-shadow:0 18px 40px -26px #17274466;text-align:center}
.shop-waitlist h3{margin:0 0 12px;font-size:19px}
.shop-waitlist__row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.shop-waitlist__row input{flex:1 1 220px;min-width:0;font:inherit;font-size:16px;min-height:50px;padding:0 16px;border-radius:999px;border:1.5px solid #17274455;background:#fff;color:#172744}
.shop-waitlist .button{font-size:16px;min-height:50px}
.shop-waitlist__consent{display:flex;gap:10px;align-items:flex-start;text-align:left;font-size:14px;margin-top:12px;color:#172744}
.shop-waitlist__consent input{margin-top:3px;flex:0 0 auto;width:18px;height:18px}
.shop-waitlist__consent a{color:#B3122A}
.shop-waitlist .formnote{font-size:14px;margin:10px 0 0;min-height:1px}
.shop-waitlist .formnote.ok{color:#14603a}
.shop-waitlist .formnote.err{color:#c81e3a}
.shop-waitlist .shop-typo{background:none;border:0;padding:6px 2px;font:inherit;font-weight:700;color:#16296A;text-decoration:underline;cursor:pointer}

/* ---------- 6. questions ---------- */
.hm-faq{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:8px 40px;align-items:start}
.hm-faq h2{grid-row:span 2}
.hm-faq__list{display:grid;gap:10px}
.hm-faq details{border-radius:16px;background:#fff;box-shadow:0 8px 20px -14px rgba(11,29,77,.45)}
.hm-faq summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:12px 18px;cursor:pointer;list-style:none;
  font:700 17px/1.3 'Plus Jakarta Sans','Inter',sans-serif;color:var(--ewn-night)}
.hm-faq summary::-webkit-details-marker{display:none}
.hm-faq summary::after{content:"+";flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#EEF3FF;color:var(--ewn-night);font-size:20px;line-height:1}
.hm-faq details[open] summary::after{content:"\2212"}
.hm-faq details p{padding:0 18px 16px;color:#26365F}
.hm-more{justify-self:start;margin-top:6px;font-weight:700;color:#B3122A}
.hm-faq .hm-more{grid-column:2}

/* ---------- computers and tablets ---------- */
@media(max-width:1000px){
  .hm-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:860px){
  .hm-hero{grid-template-columns:minmax(0,1fr);gap:20px}
  .hm-steps{grid-template-columns:minmax(0,1fr);max-width:560px}
  .hm-step{display:grid;grid-template-columns:minmax(0,1fr)}
  .hm-videos{grid-template-columns:minmax(0,1fr);text-align:center}
  .hm-videos__copy{justify-items:center;margin:0 auto}
  .hm-faq{grid-template-columns:minmax(0,1fr)}
  .hm-faq h2{grid-row:auto}
  .hm-faq .hm-more{grid-column:auto}
}
/* ---------- phones ---------- */
@media(max-width:760px){
  main>section.hm{margin:36px 16px;padding:22px 18px;--ewn-r:22px}
  main>section.hm:first-child{margin-top:16px}
  .hm-hero h1{font-size:34px}
  .hm-lead{margin-top:12px;font-size:17px}
  .hm-cta{display:flex;width:100%;margin-top:18px}
  .hm-hero__cam{border-width:4px;border-radius:18px;margin:0 -6px}
  .hm-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .hm-stat{padding:14px 12px}
  .hm-stat--big{grid-column:1/-1}
  .hm-products{gap:8px}
  .hm-products img{max-height:130px}
  .hm-products h3{font-size:15px}
  .hm-products small{font-size:12px}
  .shop-waitlist{padding:16px 14px;margin-top:18px}
  .shop-waitlist .button{width:100%}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ew-home .button{transition:none}
  .ew-home .button:hover{transform:none}
}

/* Coming this month (Paul, 31 Oct 2026): two looping thumbnails, tracker stays the star */
.hm-coming__list{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.hm-coming__list li{display:flex;flex-direction:column;gap:6px;background:#fff;border-radius:18px;padding:12px 12px 16px;box-shadow:0 8px 20px -14px rgba(11,29,77,.45)}
.hm-coming__vid{aspect-ratio:4/5;max-width:100%;border-radius:12px;overflow:hidden;background:#0F2459}
.hm-coming__vid video{width:100%;height:100%;object-fit:cover;display:block}
.hm-coming__list h3{margin:6px 4px 0;font-size:clamp(16px,2vw,20px);line-height:1.25;color:#0B1F45}
.hm-coming__list .hm-coming__when{margin:0 4px;font-weight:800;color:#C3102F;font-size:15px}

/* "This is not the Elf Tracker" above the doll and camera form, and the button on to the tracker after joining (Paul, 1 Nov 2026) */
.shop-tracker{max-width:640px;margin:22px auto 0;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;text-align:center;font-weight:700;color:#172744}
.shop-waitlist .shop-next{display:inline-flex;margin-top:12px}
@media(max-width:600px){.shop-tracker .button,.shop-waitlist .shop-next{width:100%;justify-content:center}}
/* Pressed (sound playing): navy with white words; the white above made it white on white (Paul, 1 Nov 2026). */
.hm-hero__cam .rc-sound[aria-pressed="true"]{background:#16296A;color:#fff;border-color:#16296A}

/* ---------- QA layout pass (1 Nov 2026, third round) ---------- */
/* "Open now" (before the day: "From 1st November") is a status label, not a button: an outlined badge with a live dot. */
.hm-date{display:inline-flex;align-items:center;gap:10px;background:transparent;border:2px solid rgba(255,92,119,.9);color:#fff;
  font:800 clamp(13px,1.3vw,15px)/1.2 'Plus Jakarta Sans','Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;padding:7px 14px 7px 12px;border-radius:999px;cursor:default}
.hm-date::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:#FF5C77;box-shadow:0 0 0 4px rgba(255,92,119,.25)}
/* A heading's "why?" circle never drops onto a line of its own ("Coming soon: the Elf Watch doll and camera"):
   the last word comes down with it. */
.hm :is(h2,h3):has(>.why){text-wrap:pretty}
.hm h2:has(>.why:last-child){padding-right:79px}.hm h2>.why:last-child{margin-right:-79px}   /* the circle (43-71px wide) adds no width to the line, so it never wraps alone */
/* The "Track my elf" row under the shop: room above it for its stamp, clear of the product captions. */
.shop-tracker{margin-top:34px}

/* ---------- Nov 2026 copy update: the new sections ---------- */
.hm-lead .tc-r{color:#B3122A}
.hm-videos .hm-bill__more{margin:0;font:500 clamp(16px,1.5vw,19px)/1.5 'Inter',sans-serif;color:#C9D8F5;max-width:32em}

/* one banner instead of last year's numbers */
.hm-families{text-align:center;background:linear-gradient(180deg,#14306F,#0F2459)!important;border:2px solid rgba(245,194,74,.7);padding:clamp(26px,4vw,44px)!important}
.hm-families::after{display:none}
.hm-families__line{font:800 clamp(24px,3.4vw,42px)/1.15 'Plus Jakarta Sans','Inter',sans-serif;color:#fff;text-wrap:balance}
.hm-families__line .hm-families__n{color:var(--ewn-gold);font-weight:800}
.hm-families__link{display:inline-block;margin-top:12px;font-size:15px;font-weight:700;color:var(--ewn-pale)!important}

/* two-column feature panels: the elf on camera, the elf calls */
.hm-feature{display:grid;grid-template-columns:minmax(0,1.15fr) auto;gap:clamp(24px,5vw,72px);align-items:center}
.hm-calls{grid-template-columns:auto minmax(0,1.15fr)}
.hm-feature__copy{display:grid;gap:16px;justify-items:start;max-width:600px}
.hm-feature__copy p{font-size:clamp(17px,1.5vw,19px);line-height:1.55;color:#26365F}
.hm-feature__copy p.hm-feature__lead{font-weight:700;color:var(--ewn-night);font-size:clamp(19px,1.8vw,23px)}
.hm-launch{margin:0;display:inline-block;background:#E71940;color:#fff!important;font:800 15px/1.2 'Plus Jakarta Sans','Inter',sans-serif;padding:8px 14px;border-radius:999px;letter-spacing:.02em;text-transform:uppercase}
.hm-calls .hm-calls__form{margin:4px 0 0;max-width:100%;text-align:left}
.hm-calls__form .hm-calls__note{font-size:15px;margin:-4px 0 12px;color:#26365F}
.hm-calls__vid{width:min(280px,70vw);aspect-ratio:9/16;border-radius:26px;overflow:hidden;border:6px solid var(--ewn-night);box-shadow:0 24px 50px -18px rgba(11,29,77,.6);background:#000;justify-self:center}
.hm-calls__vid video{width:100%;height:100%;object-fit:cover;display:block}

/* the CCTV monitor */
.hm-cctv{position:relative;width:min(300px,72vw);aspect-ratio:9/16;border-radius:18px;overflow:hidden;background:#000;justify-self:center;
  border:10px solid #1d2230;box-shadow:0 0 0 2px #3a4050,0 26px 50px -16px rgba(0,0,0,.65)}
.hm-cctv video{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.35) contrast(1.15) brightness(.92) sepia(.15) hue-rotate(60deg)}
.hm-cctv::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.55) 100%)}
.hm-cctv span{position:absolute;z-index:2;font:700 13px/1 ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.08em;color:#E8F5E0;text-shadow:0 0 6px rgba(0,0,0,.9)}
.hm-cctv__rec{top:14px;left:14px;display:flex;align-items:center;gap:6px}
.hm-cctv__rec i{width:11px;height:11px;border-radius:50%;background:#FF2A3D;box-shadow:0 0 10px #FF2A3D;animation:hmRec 1.1s steps(1) infinite}
.hm-cctv__cam{top:14px;right:14px}
.hm-cctv__time{bottom:14px;left:14px}
.hm-cctv__corners{inset:10px;border:0}
.hm-cctv__corners::before,.hm-cctv__corners::after{content:"";position:absolute;width:22px;height:22px;border:2px solid rgba(232,245,224,.75)}
.hm-cctv__corners::before{right:0;bottom:0;border-left:0;border-top:0}
.hm-cctv__corners::after{left:0;bottom:24px;border-right:0;border-top:0;display:none}
@keyframes hmRec{50%{opacity:0}}

/* a note from the founders */
.hm-note{text-align:center;
  background:repeating-linear-gradient(transparent 0 33px,rgba(59,111,224,.12) 33px 34px),var(--ewn-cream)!important}
.hm-note h2{margin-bottom:14px}
.hm-note p{font-size:clamp(17px,1.6vw,20px);line-height:1.65;color:#26365F;max-width:34em;margin:0 auto 12px}
.hm-note p.hm-note__sign{font:700 clamp(28px,3vw,38px)/1.2 'Caveat',cursive;color:#B3122A;margin-top:8px}

/* the closing banner */
.hm-finale{text-align:center;border:10px solid transparent!important;padding:clamp(30px,5vw,60px)!important;
  background:linear-gradient(var(--ewn-cream),var(--ewn-cream)) padding-box,var(--ewn-cane) border-box!important}
.hm-finale h2{font-size:clamp(32px,4.6vw,58px)!important;text-wrap:balance}
.hm-finale h2 em{display:block}
.hm-finale__three{margin:18px 0 0!important;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 26px;font:700 clamp(17px,1.8vw,22px)/1.3 'Plus Jakarta Sans','Inter',sans-serif;color:var(--ewn-night)}
.hm-finale__three span::before{content:"\2605";color:var(--ewn-gold);margin-right:8px}
.hm-finale__welcome{margin:16px 0 22px!important;font:800 clamp(22px,2.4vw,30px)/1.2 'Plus Jakarta Sans','Inter',sans-serif;color:#B3122A}

@media(max-width:860px){
  .hm-feature,.hm-calls{grid-template-columns:minmax(0,1fr)}
  .hm-calls .hm-calls__vid{order:2}
  .hm-feature__copy{max-width:none}
}
@media(prefers-reduced-motion:reduce){.hm-cctv__rec i{animation:none}}

/* ---------- phones on their side: wide but short, so side-by-side again and smaller headings ---------- */
@media(orientation:landscape) and (min-width:600px) and (max-width:960px) and (max-height:520px){
  main>section.hm{margin:32px 20px;padding:22px 26px;--ewn-r:22px}
  main>section.hm:first-child{margin-top:12px}
  .hm h2{font-size:28px}
  .hm-hero{grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:22px}
  .hm-hero h1{font-size:30px}
  .hm-lead{margin-top:10px;font-size:15px;line-height:1.45}
  .hm-cta{display:inline-flex;width:auto;margin-top:14px;min-height:46px;font-size:16px}
  .hm-hero__cam{margin:0}
  .hm-steps{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none;gap:12px;margin-top:16px}
  .hm-step__body{padding:12px 12px 14px;gap:6px}
  .hm-step h3{font-size:16px}
  .hm-step p{font-size:14px}
  .hm-step__when{font-size:12px}
  .hm-videos{grid-template-columns:minmax(0,1fr) auto;text-align:left;gap:26px}
  .hm-videos__copy{justify-items:start;margin:0;gap:14px}
  .hm-videos h2.hm-bill{font-size:40px}
  .hm-bill__sub{font-size:17px}
  .hm-videos .hm-bill__more{font-size:14px}
  .hm-phone{--w:min(190px,26vw)}
  .hm-feature{grid-template-columns:minmax(0,1fr) auto;gap:26px}
  .hm-calls{grid-template-columns:auto minmax(0,1fr)}
  .hm-calls .hm-calls__vid{order:0}
  .hm-cctv,.hm-calls__vid{width:min(180px,24vw)}
  .hm-feature__copy{gap:10px}
  .hm-feature__copy p{font-size:15px}
  .hm-feature__copy p.hm-feature__lead{font-size:17px}
  .hm-families__line{font-size:24px}
  .hm-products img{max-height:120px}
  .hm-faq{grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr)}
  .hm-faq h2{grid-row:span 2}
  .hm-note p{font-size:16px}
  .hm-finale h2{font-size:34px!important}
  .hm-finale__three{font-size:16px}
  .hm-note__pic{max-height:62vh;object-fit:cover}
}

/* ---------- two elves holding on to the founders' note (computers: the gaps either side of the narrow panel) ----------
   Both are the peeking elf, gripping the panel's edge with both hands; the left one is flipped and sits higher.
   The picture's own straight edge (where the elf's body goes behind) is 34% in from its side: that line sits exactly
   on the panel's edge, and the hands (30-33%) wrap round onto the panel. */
/* (.ew-home img would otherwise show these at full size everywhere) */
.ew-home .hm-note__elf,.ew-home .hm-note__float{display:none}
@media(min-width:1380px){
  .ew-home .hm-note__elf{display:block}
  /* js/pizzazz.js moves them down the note as you scroll; the transition makes them glide, and slide at the end */
  .hm-note__elf{--w:clamp(170px,calc((100vw - 1200px) / 2 / .66 + 30px),400px);position:absolute;transition:top .5s cubic-bezier(.2,.8,.2,1);z-index:5;width:var(--w);height:auto;pointer-events:none;
    filter:drop-shadow(0 12px 16px rgba(0,0,0,.45))}
  .hm-note__elf--right{left:calc(100% - var(--w) * .34);top:22%;animation:hmPeekUp 4.8s ease-in-out infinite}
  .hm-note__elf--left{right:calc(100% - var(--w) * .34);top:2%;transform:scaleX(-1);animation:hmPeekUp 4.8s ease-in-out -2.4s infinite}
}
/* they peek up and down along the edge, so the hands and the edge stay flush with the panel */
@keyframes hmPeekUp{0%,100%{translate:0 0}35%,55%{translate:0 -22px}75%{translate:0 4px}}
@media(prefers-reduced-motion:reduce){.hm-note__elf{animation:none!important}}

/* ---------- 1 Nov 2026 changes ---------- */
/* the new camera video carries its own REC light, brackets and scanlines, so the monitor adds nothing over it */
.hm-cctv--own video{filter:none}
.hm-cctv--own::before{content:none}
.hm-packages{margin-top:6px}
/* the step numbers stand on their own now the dates have gone */
.hm-step__when:empty,.hm-step__when:not(:has(*:not(.hm-num))){min-height:30px}
/* the FREE tag pinned to the "spot your elf 5 times" picture */
html .hm-step__pic .pz-tag.pz-tag--pic{left:auto;right:12px;top:12px;transform-origin:50% 0;scale:1;animation:pzTag 3.2s ease-in-out infinite}

/* ---------- the founders' note with Kirsten and Andrea's picture ---------- */
.hm-note__pic{width:100%;max-width:820px;height:auto;border-radius:18px;margin:2px auto 22px;box-shadow:0 14px 30px -12px rgba(11,29,77,.55);position:relative;z-index:1}
.hm-note__text{max-width:38em;margin:0 auto;text-align:left}
.hm-note .hm-note__text p{margin:0 0 14px;max-width:none}

/* ---------- the flagship: catch your elf on camera ---------- */
.hm-flagship{background:radial-gradient(60% 80% at 88% 45%,rgba(60,220,130,.20),transparent 60%),radial-gradient(55% 60% at 0% 100%,rgba(231,25,64,.28),transparent 60%),
  linear-gradient(160deg,#071a46,#0b2560 55%,#06163d)!important;border:3px solid #F5C24A;
  box-shadow:0 0 0 6px rgba(245,194,74,.16),0 0 70px rgba(245,194,74,.35),0 24px 50px rgba(0,0,0,.5)!important}
/* a slow green scan line sweeping down the panel, like a security monitor */
.hm-flagship::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
  background:linear-gradient(180deg,transparent 0,rgba(120,255,170,.11) 50%,transparent 100%) no-repeat;background-size:100% 160px;animation:hmScan 6s linear infinite}
@keyframes hmScan{from{background-position:0 -160px}to{background-position:0 calc(100% + 160px)}}
.hm-flagship>:is(.hm-feature__copy,.hm-cctv){position:relative;z-index:1}
.hm-flagship h2{color:#fff;font-size:clamp(34px,4.4vw,58px)!important;line-height:1.05}
.hm-flagship h2 em{display:block;color:var(--ewn-gold)}
.hm-flagship .hm-feature__copy p{color:#C9D8F5}
.hm-flagship .hm-feature__copy p.hm-feature__lead{color:#fff}
.hm-flagship__badges{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0}
.hm-flagship__new{display:inline-block;padding:8px 14px;border-radius:999px;background:var(--ewn-gold);color:#0B1D4D;font:900 15px/1.2 'Plus Jakarta Sans','Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;
  animation:hmGlow 2.2s ease-in-out infinite}
@keyframes hmGlow{0%,100%{box-shadow:0 0 0 0 rgba(245,194,74,.6)}50%{box-shadow:0 0 0 10px rgba(245,194,74,0)}}
.hm-flagship__btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.hm-flagship__btns .hm-packages{margin-top:0}
.hm-flagship .hm-calls__form{margin-top:4px}
.hm-flagship .hm-cctv{width:min(340px,76vw);rotate:2deg;box-shadow:0 0 0 2px #3a4050,0 0 44px rgba(110,255,160,.4),0 30px 60px -16px rgba(0,0,0,.7);animation:hmMonitor 3.4s ease-in-out infinite}
@keyframes hmMonitor{0%,100%{box-shadow:0 0 0 2px #3a4050,0 0 30px rgba(110,255,160,.28),0 30px 60px -16px rgba(0,0,0,.7)}50%{box-shadow:0 0 0 2px #3a4050,0 0 60px rgba(110,255,160,.55),0 30px 60px -16px rgba(0,0,0,.7)}}
@media(max-width:760px){.hm-flagship__btns .button{flex:1 1 100%}}
@media(prefers-reduced-motion:reduce){.hm-flagship::before,.hm-flagship__new,.hm-flagship .hm-cctv{animation:none}}

/* ---------- phones and small screens: no room outside the note, so the elves hold on from the inside ----------
   One on the left at the start of the note, one on the right further down, each gripping the panel's edge (the
   picture's straight edge, 34% in, sits on the edge) with the words wrapping round them. */
@media(max-width:1379px){
  .hm-note{--pad:clamp(26px,5.5vw,60px);padding-left:var(--pad)!important;padding-right:var(--pad)!important}
  .hm-note__text{max-width:none}
  .ew-home .hm-note__float{display:block;--w:clamp(110px,27vw,150px);width:var(--w);height:auto;margin-top:2px;margin-bottom:4px;
    filter:drop-shadow(0 6px 8px rgba(0,0,0,.3));animation:hmPeekSmall 4.8s ease-in-out infinite}
  .hm-note__float--left{float:left;margin-left:calc(-1 * var(--pad) - var(--w) * .34);margin-right:6px}
  .hm-note__float--right{float:right;transform:scaleX(-1);margin-right:calc(-1 * var(--pad) - var(--w) * .34);margin-left:6px;animation-delay:-2.4s!important}
}
@keyframes hmPeekSmall{0%,100%{translate:0 0}35%,55%{translate:0 -10px}75%{translate:0 2px}}
@media(prefers-reduced-motion:reduce){.hm-note__float{animation:none!important}}

/* ---------- colour: navy words, with a few words picked out in green and red ---------- */
.tc-g{color:#17803F!important}
.tc-r{color:#C8102E!important}
.hm-hero h1 em{color:var(--ewn-night)}
.hm-lead .tc-g{color:#17803F!important}
/* on the dark panels the same idea, in brighter shades */
:is(.hm-videos,.hm-flagship) .tc-g{color:#4BE08A!important}
:is(.hm-videos,.hm-flagship) .tc-r{color:#FF5C77!important}
.hm-videos h2.hm-bill em{color:var(--ewn-gold)}

/* ---------- Questions: the Elf Watch logo under the heading ---------- */
.hm-faq .hm-faq__head{grid-row:span 2;display:grid;gap:18px;align-content:start;justify-items:start}
.hm-faq .hm-faq__head h2{grid-row:auto}
.ew-home .hm-faq__logo{width:min(240px,60%);height:auto;filter:drop-shadow(0 12px 16px rgba(11,29,77,.25));transform-origin:50% 0;animation:hmLogoBob 4s ease-in-out infinite}
@keyframes hmLogoBob{0%,100%{translate:0 0;rotate:-2deg}50%{translate:0 -8px;rotate:2deg}}
@media(max-width:860px){.hm-faq .hm-faq__head{grid-row:auto;justify-items:center;text-align:center}.ew-home .hm-faq__logo{width:170px}}

/* ---------- the closing box: words on the left, promises and the button on the right ---------- */
.hm-finale{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center;text-align:left!important}
.hm-finale h2{font-size:clamp(34px,4.4vw,58px)!important;line-height:1.05}
.hm-finale h2 em{display:block;color:var(--ewn-night)}
.hm-finale .hm-finale__welcome{margin:18px 0 0!important;color:var(--ewn-night);font:800 clamp(22px,2.4vw,30px)/1.2 'Plus Jakarta Sans','Inter',sans-serif}
.hm-finale__right{display:grid;gap:22px;justify-items:start;padding-left:clamp(0px,3vw,40px);border-left:3px dashed rgba(11,29,77,.18)}
.hm-finale ul.hm-finale__three{list-style:none;margin:0!important;padding:0;display:grid;gap:12px;justify-content:start;font:800 clamp(19px,2vw,25px)/1.25 'Plus Jakarta Sans','Inter',sans-serif;color:var(--ewn-night)}
.hm-finale ul.hm-finale__three li{display:flex;align-items:center;gap:12px}
.hm-finale ul.hm-finale__three li::before{content:"\2605";flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#0B1D4D;color:var(--ewn-gold);font-size:18px;margin:0}
.hm-finale ul.hm-finale__three li:nth-child(2)::before{background:#C8102E;color:#fff}
.hm-finale ul.hm-finale__three li:nth-child(3)::before{background:#17803F;color:#fff}
.hm-finale__three span::before{content:none!important}
@media(max-width:860px){
  .hm-finale{grid-template-columns:minmax(0,1fr);text-align:center!important}
  .hm-finale__right{justify-items:center;padding-left:0;border-left:0;border-top:3px dashed rgba(11,29,77,.18);padding-top:20px}
  .hm-finale ul.hm-finale__three{justify-content:center}
}

/* ---------- baubles dropping into the empty space either side of the founders' note (wide screens) ---------- */
.hm-note__deco{display:none}
/* only where the note's words are a narrow column (1380px and up; below that the words fill the box) */
@media(min-width:1380px){
  .hm-note__text{position:relative}
  .hm-note__deco{display:block;position:absolute;inset:0;pointer-events:none}
  .hm-note__deco i{position:absolute;top:-30px;width:var(--s);height:calc(var(--len) + var(--s) + 12px);display:block;transform-origin:50% 0;
    translate:0 calc(-1 * var(--len) - 260px);opacity:0;transition:translate 1.3s cubic-bezier(.3,1.5,.5,1) var(--d),opacity .4s ease var(--d);
    animation:hmBaubleSwing 3.6s ease-in-out calc(var(--d) + 1.2s) infinite}
  .hm-note__deco.drop i{translate:0 0;opacity:1}
  /* the gold string, the cap and the bauble */
  .hm-note__deco i::before{content:"";position:absolute;left:50%;top:0;width:2px;height:var(--len);margin-left:-1px;background:linear-gradient(#C9963A,#F7DC8C)}
  .hm-note__deco b{position:absolute;left:0;bottom:0;width:var(--s);height:var(--s);border-radius:50%;
    background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.95) 0,rgba(255,255,255,.35) 9%,transparent 24%),radial-gradient(circle at 40% 35%,var(--c) 0,var(--c) 42%,var(--c2) 100%);
    box-shadow:0 10px 18px rgba(11,29,77,.3),inset 0 -6px 12px rgba(0,0,0,.22)}
  .hm-note__deco b::before{content:"";position:absolute;top:-8px;left:50%;width:calc(var(--s) * .34);height:10px;margin-left:calc(var(--s) * -.17);border-radius:3px 3px 2px 2px;
    background:linear-gradient(90deg,#9A6B1F,#F7DC8C 45%,#C9963A 70%,#9A6B1F)}
}
@keyframes hmBaubleSwing{0%,100%{rotate:-5deg}50%{rotate:5deg}}
@media(prefers-reduced-motion:reduce){.hm-note__deco i{translate:none!important;opacity:1!important;animation:none!important;transition:none!important}}

/* ---------- merge notes (1 Nov 2026) ---------- */
/* No separate waiting lists for calls or videos (Paul, 1 Nov 2026): "Notify me when live" and "Discover Elf Calls" are links
   to the free Elf Tracker, green like the design's next-step buttons (css/pizzazz.css colours [data-opens] buttons). */
.ew-home a.button.hm-go{background:#1E9A4F!important;color:#fff!important;box-shadow:0 5px 0 #11663A,0 12px 24px rgba(0,0,0,.28)!important}
.ew-home a.button.hm-go:hover{background:#18833F!important}
.ew-home a.button.hm-go:active{box-shadow:0 2px 0 #11663A,0 6px 14px rgba(0,0,0,.25)!important}
.hm-calls .hm-calls__open{justify-self:start}
/* The founders' note Elves and the snow caps hang over the panels' edges by design; on narrow phones that reached past
   the screen and let the page scroll sideways. Clip sideways only (overflow-x:clip keeps the caps above the panels). */
body.ew-home main,body.ew-home footer.ew-footer{overflow-x:clip}
/* With the bauble header (css/pizzazz.css) the language pill ran 4px off a 320px screen: a little narrower there. */
@media(max-width:360px){.ew-home .ew-lang select{max-width:104px;padding:0 24px 0 10px;background-position:right 9px center}}
/* Jay, 1 Nov 2026 preview: the FREE gift tag hanging from "Track my Elf" covered the waiting-list heading. */
.hm-shop .shop-waitlist + .shop-tracker{margin-top:28px;padding-bottom:56px}
/* Jay, 2nd November 2026 preview (phone): more room between the headline and the line under it; the camera
   screen straight, not tilted; on phones the Elf Calls date and button sit in the middle. */
.hm-hero h1{margin-bottom:6px}
@media(max-width:760px){.hm-hero h1{line-height:1.1}.hm-lead{margin-top:18px!important}}
.hm-flagship .hm-cctv{rotate:0deg}
@media(max-width:760px){.hm-calls .hm-launch{display:table;margin-left:auto;margin-right:auto}.hm-calls .hm-calls__open{justify-self:center;margin-left:auto;margin-right:auto}}
/* After joining the doll and camera list (2 Nov 2026): the next step sells the free tracker, picture first. */
.shop-nextcard{display:flex;gap:16px;align-items:center;margin-top:14px;padding:14px;border-radius:18px;background:#0B1D4D;color:#fff;text-align:left}
.shop-nextcard img{width:112px;height:112px;flex:0 0 112px;border-radius:14px;object-fit:cover;border:2px solid #E7B54A}
.shop-nextcard h4{margin:0 0 6px;font:800 18px/1.2 'Plus Jakarta Sans',sans-serif;color:#fff}
.shop-nextcard p{margin:0 0 12px;font-size:15px;line-height:1.45;color:#DCE6FF}
.shop-nextcard .shop-next{display:inline-flex}
@media(max-width:480px){.shop-nextcard{flex-direction:column;text-align:center}.shop-nextcard img{width:100%;height:150px;flex:none}.shop-nextcard .shop-next{width:100%;justify-content:center}}
.shop-nextcard h4{margin-bottom:12px}
/* The calls notify button now lives in css/site-chrome.css (.ew-callnotify, js/calls-gate.js); centred here on phones. */
@media(max-width:760px){#calls .ew-callnotify{justify-items:center}#calls .ew-callnotify__row .button{width:100%;justify-content:center}}
/* The Elf calls section from launch (launch/calls/launch/home-calls.html; Paul, 2 Nov 2026): what a call is,
   the sample, the two calls, the price and one big button. Phone first. */
.hm-callx{gap:14px}
.hm-callx h2{margin:0}
.hm-callx .hm-callx__lead{margin:0;font-weight:700;color:var(--ewn-night);font-size:clamp(18px,1.7vw,21px)}
.hm-callx__two{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
.hm-callx__two li{display:flex;gap:10px;align-items:center;padding:12px;border-radius:16px;background:#fff;border:1px solid #0B1D4D1A;box-shadow:0 4px 14px -8px rgba(11,29,77,.35)}
.hm-callx__ic{font-size:26px;line-height:1}
.hm-callx__k{display:block;font:800 15px/1.25 'Plus Jakarta Sans',sans-serif;color:var(--ewn-night)}
.hm-callx__when{display:block;font-size:14px;color:#26365F}
.hm-feature__copy p.hm-callx__price{margin:0;font:800 clamp(18px,1.7vw,21px)/1.35 'Plus Jakarta Sans',sans-serif;color:#C8102E}
.hm-feature__copy p.hm-callx__gift{margin:0;padding:10px 14px;border-radius:14px;background:#FFF3D1;color:#5B3A00;font-size:16px;line-height:1.45}
.hm-callx .hm-calls__open{min-width:min(100%,320px);justify-content:center}
@media(max-width:760px){.hm-callx{justify-items:center;text-align:center}.hm-callx .ew-sample{justify-items:center}.hm-callx__two li{text-align:left}.hm-callx .hm-calls__open{width:100%}}
@media(max-width:380px){.hm-callx__two{grid-template-columns:1fr}}
/* Round 1 (2 Nov 2026): the doll and camera boxes at one height, so the three titles line up (375 wide: the
   Dual Camera Pack title was hidden behind its box picture). */
.hm-products img{height:200px;max-height:none;width:100%;object-fit:contain}
@media(max-width:760px){.hm-products img{height:130px}}
@media(max-width:400px){.hm-products img{height:112px}}
.hm-products h3{margin:0}
/* Round 1: the three finale lines read left, all alike, on phones too. */
.hm-finale__line{text-align:left}
/* Round 2 (2 Nov 2026). The camera section: "Packages coming soon" in light text on the night sky, at the left, so the
   hanging FREE! tag (at the button's right end) stays clear of it. */
#camera .hm-flagship__btns .ew-soon{color:#FFF3D1!important;align-self:flex-start;justify-self:start;text-align:left;width:auto!important;margin-top:6px}
/* The doll and camera titles take the same height, so the small lines under them line up too (320 wide). */
@media(max-width:480px){.hm-products h3{min-height:2.5em;display:flex;align-items:center;justify-content:center;line-height:1.2}}
/* The calls card before launch: on wide screens the words and button fill the card, centred (no empty right side). */
@media(min-width:900px){#calls .hm-calls__soon{max-width:none;align-content:center;justify-items:center;text-align:center;align-self:stretch}#calls .hm-calls__soon h2{font-size:clamp(40px,3.8vw,60px)}#calls .hm-calls__soon .hm-callnotify{justify-items:center}#calls .hm-calls__soon .button{min-height:64px;padding:0 36px;font-size:20px}}
/* The language wait (index.html): the header and the cookie bar wait too, so no English shows first. */
html.ew-i18n-wait body.ew-home .ew-header,html.ew-i18n-wait body.ew-home .ewck{opacity:0}
/* (phones) the tag hangs at the button's left end and the words sit at the right, so they never meet */
@media(max-width:760px){#camera .hm-flagship__btns .pz-tag{right:auto;left:22px}#camera .hm-flagship__btns .ew-soon{text-align:right!important;justify-content:flex-end!important;align-self:stretch;width:100%!important}}

/* Round 3 (2 Nov 2026). The camera section: one short centred button and a small line under it (no wrapping at 320). */
#camera .hm-cam-cta{display:grid;justify-items:center;gap:6px;width:100%;text-align:center}
#camera .hm-cam-cta .button{justify-content:center;min-width:min(100%,280px)}
#camera .hm-cam-cta .hm-cam-from{margin:0;font-size:14px;font-weight:700;color:#FFF3D1;text-align:center}
#camera .hm-cam-cta .free-stamp-wrap{justify-content:center}
@media(min-width:761px){#camera .hm-cam-cta{justify-items:start;text-align:left}#camera .hm-cam-cta .hm-cam-from{text-align:left}}
/* The doll and camera list: email, then the consent tick, then the button (consent always above the button). */
.shop-waitlist__row input{flex:1 1 100%}
.shop-waitlist .shop-waitlist__go{display:flex;width:100%;justify-content:center;margin-top:12px}
.shop-waitlist__consent{min-height:44px;align-items:center;cursor:pointer}
.shop-waitlist__consent input{width:24px;height:24px;margin:0;flex:0 0 24px}
/* 44px tap targets */
.hm-families__link,.hm-more{display:inline-flex;align-items:center;min-height:44px}
/* The menu's "Elf Tracker (free)" link is for the phone menu; the top row on computers has its own Track my Elf. */
/* (Round 4: the "Elf Tracker (free)" bauble shows on computers too, first in the row.) */
.ew-header nav.ew-nav a.ew-nav__tracker{font-weight:800}
/* The doll and camera boxes bob: room under them so they never touch the titles (375). */
@media(max-width:760px){.hm-products li{gap:10px}.hm-products img{margin-bottom:10px}}

/* Round 4: the advert's Play/Pause is a 44px button. */
.hm-pause{min-height:44px;min-width:44px}
/* The camera section's FREE! tag hangs above the button's top right corner, clear of "Videos from 16th November". */
#camera .hm-cam-cta .free-stamp-wrap .pz-tag,#camera .hm-flagship__btns .pz-tag{top:auto!important;bottom:calc(100% - 6px);right:18px!important;left:auto!important;flex-direction:column-reverse}

/* Round 5 (2 Nov 2026). The camera button's FREE! tag hangs above its top corner: room above the button so it never covers
   the paragraph (320, 375, 768). */
#camera .hm-cam-cta{margin-top:70px}
@media(min-width:1100px){#camera .hm-cam-cta{margin-top:58px}}
/* The German hero button: centred, on one line on phones. */
@media(max-width:480px){html:lang(de) .hm-hero .hm-cta{justify-content:center;text-align:center;font-size:17px;white-space:nowrap;padding-left:14px;padding-right:14px}}
/* 44px everywhere, whatever the pointer */
.ew-footer a,.ew-footer__links a{display:inline-flex;align-items:center;min-height:44px}
/* The Elf HQ CCTV sightings in the phone (Paul, 3 Nov 2026): the 9:16 video sits whole in the taller phone screen, so
   Pause and Tap for sound go in the dark band under it, clear of the camera's REC, CAM and place labels and the caption */
.hm-phone__screen.hm-sightings{background:#000}
.hm-phone__screen.hm-sightings .hm-pause{top:auto;bottom:8px;right:12px}
.hm-sound{position:absolute;left:12px;bottom:8px;min-height:44px;padding:0 14px;border-radius:999px;border:1.5px solid #fff;background:#D0353C;color:#fff;
  font:800 13px/1 'Inter',sans-serif;cursor:pointer;animation:hmSnd 1.4s ease-in-out infinite}
.hm-sound.on{background:rgba(8,20,58,.75);border-color:rgba(255,255,255,.7);animation:none}
@keyframes hmSnd{50%{transform:scale(1.06)}}
@media (prefers-reduced-motion:reduce){.hm-sound{animation:none}}
/* 5 Nov 2026 site walk: the icicles hung over the heading on phones ("Track", "Elf calls"), and on laptops the Elf on the
   bauble sat on the language picker so it read "Eng". The panel's first words start below the icicles; the bauble hangs lower. */
@media(max-width:760px){.hm-hero.pz-capped{padding-top:48px}#calls.pz-capped{padding-top:56px}}
@media(min-width:961px) and (max-width:1700px){body.ew-home .pz-slider{top:112px}}
/* "New: get a call from your Elf, now live" (Paul, 7 Nov 2026): one bright line under the hero's heading (phones: under the red button), leading to
   #calls, with the sample beside it. Smaller than the red button, so that stays the one main button. */
.hm-callstrip{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:14px;padding:8px 10px 8px 12px;border-radius:16px;background:#FFF6DA;border:2px solid #C8102E;box-shadow:0 4px 0 rgba(4,32,76,.12);max-width:34em;animation:hmStripPulse 1.8s ease-in-out infinite}
.hm-callstrip__go{display:flex;align-items:center;gap:10px;flex:1 1 15em;min-height:44px;color:#16296A;text-decoration:none;font:800 clamp(16px,1.5vw,19px)/1.25 'Plus Jakarta Sans',Inter,system-ui,sans-serif}
.hm-callstrip__go:hover .hm-callstrip__t,.hm-callstrip__go:focus-visible .hm-callstrip__t{text-decoration:underline;text-underline-offset:3px}
.hm-callstrip__go:focus-visible{outline:3px solid #16296A;outline-offset:3px;border-radius:10px}
.hm-callstrip__ic{flex:0 0 auto;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#C8102E;color:#fff;font-size:18px;animation:hmRing 2.4s ease-in-out infinite}
.hm-callstrip__t .tc-r{color:#B3122A}.hm-callstrip__t .tc-g{color:#17803F}
.hm-callstrip__sample{margin:0;flex:0 0 auto}
.hm-callstrip .ew-sample__btn{min-height:44px;padding:4px 14px 4px 6px;font-size:15px}
.hm-callstrip .ew-sample__play{width:32px;height:32px;flex-basis:32px}
.hm-callstrip .ew-sample__play::after{left:11px;top:7px}
.hm-callstrip .ew-sample__btn.is-playing .ew-sample__play::after{left:9px;top:9px}
@keyframes hmRing{0%,70%,100%{transform:rotate(0)}75%{transform:rotate(-14deg)}80%{transform:rotate(14deg)}85%{transform:rotate(-10deg)}90%{transform:rotate(8deg)}}
/* The pulsing red line round the calls strip (Paul, 7 Nov 2026); still for reduced motion. */
@keyframes hmStripPulse{0%,100%{box-shadow:0 0 0 0 rgba(200,16,46,.55),0 4px 14px rgba(11,29,77,.18)}50%{box-shadow:0 0 0 7px rgba(200,16,46,0),0 4px 14px rgba(11,29,77,.18)}}
@media(prefers-reduced-motion:reduce){.hm-callstrip__ic,.hm-callstrip{animation:none}}
/* From 16th November (html.studio-open, js/calls-gate.js): the "Launching 16th November" badge goes (copy changes, 6 Nov 2026). */
html.studio-open .hm-flagship__badges{display:none}
@media(min-width:761px){.hm-callstrip+.hm-lead{margin-top:14px}.hm-callstrip{flex-wrap:nowrap;max-width:none;margin-top:10px;padding:5px 6px 5px 10px}.hm-callstrip__go{flex:1 1 auto;min-height:40px;font-size:16px}.hm-callstrip__ic{width:30px;height:30px;font-size:15px}.hm-callstrip .ew-sample__btn{min-height:40px;font-size:14px}.hm-callstrip .ew-sample__play{width:28px;height:28px;flex-basis:28px}.hm-callstrip .ew-sample__play::after{left:10px;top:6px;border-width:8px 0 8px 12px}.hm-callstrip .ew-sample__btn.is-playing .ew-sample__play::after{left:8px;top:8px;width:12px;height:12px}}
/* Short laptop screens (768px high and so on): under the red button too, so the button stays on the first screen.
   The space above the strip clears the FREE tag hanging from the button (free-stamp.js). */
@media(min-width:761px) and (max-height:940px){.hm-hero__copy{display:flex;flex-direction:column;align-items:flex-start}.hm-hero__copy>h1{margin-bottom:0}.hm-hero__copy>.hm-callstrip{order:3;margin-top:66px}.hm-hero__copy>.hm-lead{margin-top:18px}}
/* Phones: the strip sits just under the red button, so the button stays on the first screen (it is the page's one main button). */
@media(max-width:760px){.hm-hero__copy{display:flex;flex-direction:column}.hm-hero__copy>h1{margin-bottom:0}.hm-hero__copy>.hm-callstrip{order:3}.hm-callstrip{margin-top:68px;flex-wrap:wrap;justify-content:center;gap:8px;padding:10px 12px}.hm-callstrip__go{flex:1 1 100%;justify-content:center;text-align:center;font-size:16px;gap:8px}.hm-callstrip__ic{width:30px;height:30px;font-size:15px}.hm-callstrip .ew-sample__btn{font-size:14px}}

/* Small phones: the shorter hero headline, so the red button stays on the first screen (Paul, 7 Nov 2026). */
.hm-hero h1 .hm-t-short{display:none}
@media(max-width:480px){.hm-hero h1 .hm-t-long{display:none}.hm-hero h1 .hm-t-short{display:inline}}
/* Early bird strip (Paul, 9 Nov 2026): slim, above the first panel; index.html removes it after 16th November. */
.ebl{position:relative;z-index:5;display:block;box-sizing:border-box;width:calc(100% - 20px);max-width:660px;margin:6px auto -10px;padding:24px;border-radius:24px;background:rgba(4,14,44,.92);text-decoration:none;box-shadow:0 12px 30px rgba(0,0,0,.5)}
.ebl__in{position:relative;z-index:2;display:block;background:#FFF3D1;border:2px solid #E7C873;border-radius:14px;padding:8px 10px 9px;text-align:center;font-family:'Plus Jakarta Sans',Inter,system-ui,sans-serif}
.ebl .ebl__t{display:block;font-weight:800;color:#0B1D4D;font-size:clamp(17px,4.6vw,25px);line-height:1.16;letter-spacing:-.01em;text-wrap:balance}
.ebl .ebl__o{display:block;font-weight:800;color:#C8102E;font-size:clamp(20px,5.6vw,30px);line-height:1.12;margin-top:3px;letter-spacing:-.01em}
.ebl:focus-visible{outline:3px solid #fff;outline-offset:3px}
.ebl__wire{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:visible}
.ebl__b{position:absolute;z-index:1;width:11px;height:15px;margin:-7.5px 0 0 -5.5px;border-radius:50% 50% 46% 46%;background:var(--c);box-shadow:0 0 6px 2px var(--g),0 0 16px 6px var(--g);animation:eblF var(--d) ease-in-out var(--w) infinite}
.ebl__b::after{content:"";position:absolute;left:3px;top:-3px;width:5px;height:4px;border-radius:1px;background:#20301F}
.ebl__b::before{content:"";position:absolute;left:2.5px;top:2.5px;width:3px;height:5px;border-radius:50%;background:rgba(255,255,255,.75)}
@keyframes eblF{0%,38%{opacity:1;filter:brightness(1.15)}50%,72%{opacity:.22;filter:brightness(.55);box-shadow:none}86%,100%{opacity:1;filter:brightness(1.15)}}
@media(prefers-reduced-motion:reduce){.ebl__b{animation:none}}
@media(min-width:761px){.ebl{margin:-16px auto -52px;max-width:860px;padding:22px}.ebl__in{display:flex;justify-content:center;align-items:baseline;gap:14px;padding:7px 14px 8px}.ebl .ebl__t{font-size:21px}.ebl .ebl__o{font-size:23px;margin-top:0}}

/* ---------- Version C (Paul, 10 Nov 2026): the hero film, then one timeline, "Your Elf's Christmas" ---------- */
main>section.hm.hm-c{display:grid;gap:20px;align-items:center}
.hm-c__film{border:4px solid #39E27A;border-radius:18px;overflow:hidden;line-height:0;background:#0B1D4D;box-shadow:0 14px 30px -14px rgba(11,29,77,.6)}
.hm-c__film video{display:block;width:100%;aspect-ratio:1;object-fit:cover}
.hm-c__copy{display:grid;gap:12px;min-width:0}
.hm-c__copy h1{margin:0}
.hm-c__copy h1 .tc-g{text-transform:uppercase}   /* "for FREE" in green capitals (Paul, 11 Nov 2026) */
.hm-c__copy .hm-lead{margin:0}
.hm-c__copy .hm-cta{margin-top:6px;justify-self:start}
.hm-c__tiny{margin:0;font-size:14px;color:#26365F;font-weight:600}
.hm-c__eb{font:700 15px/1.3 Inter,sans-serif;color:#C8102E;text-decoration:underline;text-underline-offset:3px}
@media(min-width:761px){main>section.hm.hm-c{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);column-gap:clamp(28px,4vw,56px)}.hm-c__film{grid-column:2;grid-row:1}.hm-c__copy{grid-column:1;grid-row:1}}
@media(max-width:760px){.hm-c__copy{text-align:center;justify-items:center}.hm-c__copy .hm-cta{justify-self:stretch}}
.hm-c-line h2{margin:0 0 18px;text-align:center}
.hm-c-steps{position:relative;list-style:none;margin:0 auto;padding:0;max-width:620px;display:grid}
.hm-c-steps::before{content:"";position:absolute;left:19px;top:16px;bottom:34px;width:4px;border-radius:2px;background:repeating-linear-gradient(#C8102E 0 10px,#F5B32F 10px 20px)}
.hm-c-steps li{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr);gap:14px;padding-bottom:24px}
.hm-c-dot{position:relative;z-index:1;width:42px;height:42px;box-sizing:border-box;border-radius:50%;background:#fff;border:3px solid #C8102E;display:flex;align-items:center;justify-content:center;font:800 17px 'Plus Jakarta Sans',sans-serif;color:#C8102E}
.hm-c-steps li.is-now .hm-c-dot{background:#17803F;border-color:#17803F;color:#fff}
.hm-c-when{margin:0;font:800 13px 'Plus Jakarta Sans',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#C8102E}
.hm-c-steps li.is-now .hm-c-when{color:#17803F}
.hm-c-steps h3{margin:2px 0 0;font:800 20px/1.25 'Plus Jakarta Sans',sans-serif;color:var(--ewn-night,#0B1D4D)}
.hm-c-steps p{margin:4px 0 0;color:#26365F;line-height:1.45}
.hm-c-steps .hm-c-price{font:800 16px 'Plus Jakarta Sans',sans-serif;color:#C8102E}
.hm-c-steps .hm-c-note{font-size:14.5px}
.hm-c-sample{margin-top:10px}
.hm-c-btn{display:flex;align-items:center;justify-content:center;min-height:48px;margin-top:12px;padding:0 22px;box-sizing:border-box;border-radius:999px;border:2px solid #C8102E;background:#fff;color:#C8102E!important;font:800 16px 'Plus Jakarta Sans',sans-serif;text-decoration:none;max-width:320px}
.hm-c-btn:hover{background:#FFF1F4}
@media(max-width:760px){.hm-c-btn{max-width:none}}
/* the gold Free! tag hangs above the button's right end, clear of the small line under it */
.hm-c .free-stamp-wrap .pz-tag{top:auto!important;bottom:calc(100% - 6px);right:22px!important;left:auto!important;flex-direction:column-reverse}
.hm-c .free-stamp-wrap:has(.pz-tag){margin-top:44px}
@media(max-width:760px){.hm-c .free-stamp-wrap{display:block;width:100%}.hm-c .free-stamp-wrap .hm-cta{width:100%}}
.hm-c__copy h1{font:800 clamp(32px,3.8vw,54px)/1.08 'Plus Jakarta Sans',Inter,sans-serif;letter-spacing:-.02em;text-wrap:balance}
.hm-c__copy .hm-lead{font-size:clamp(17px,1.5vw,20px)}
@media(min-width:761px){.hm-c__copy .hm-cta{min-height:60px;font-size:19px;padding:0 34px}}
/* 5 North Pole sightings, all free (Paul, 10 Nov 2026: "1 2 3 4 5 next to each other") */
.hm-five{display:grid;gap:14px;justify-items:center;margin:0 0 30px;padding:0 0 26px;border-bottom:2px dashed #E7DCC2;text-align:center}
.hm-five h2{margin:0}
.hm-five__row{list-style:none;margin:0;padding:12px 0 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(6px,1.6vw,18px);width:100%;max-width:760px}
.hm-five__row li{position:relative;display:grid;justify-items:center;gap:6px;min-width:0}
.hm-five__row img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:12px;border:3px solid #39E27A;box-shadow:0 6px 14px -6px rgba(11,29,77,.5);filter:saturate(.85)}
.hm-five__n{position:absolute;z-index:1;top:-12px;left:50%;transform:translateX(-50%);width:clamp(28px,4vw,42px);height:clamp(28px,4vw,42px);border-radius:50%;background:#C8102E;color:#fff;border:3px solid #fff;display:flex;align-items:center;justify-content:center;font:800 clamp(15px,2vw,21px) 'Plus Jakarta Sans',sans-serif;box-shadow:0 3px 8px rgba(0,0,0,.3)}
.hm-five__free{font:900 clamp(11px,1.4vw,15px)/1 'Plus Jakarta Sans',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#7A4A00;background:linear-gradient(160deg,#FFE7A3,#F5C24A 60%,#E3A92B);border-radius:6px;padding:5px 8px}
.hm-five__note{margin:0;color:#26365F;font-weight:600;max-width:46ch}
.hm-c-line__h{margin-top:4px}
/* laptop: the wrap hugs the button, so the Free! tag hangs from the button itself, not the column's edge */
@media(min-width:761px){.hm-c .free-stamp-wrap{justify-self:start;width:max-content;max-width:100%}}
/* the early bird lights strip inside step 3 of the timeline (Paul, 10 Nov 2026) */
.hm-c-steps .ebl{width:100%;max-width:none;margin:14px 0 4px;padding:16px;border-radius:18px}
.hm-c-steps .ebl__in{display:block;padding:8px 10px 9px}
.hm-c-steps .ebl .ebl__t{font-size:clamp(15px,2vw,18px)}
.hm-c-steps .ebl .ebl__o{font-size:clamp(18px,2.4vw,22px);margin-top:3px}
/* "No thanks" and the grumpy snowman (Paul, 10 Nov 2026) */
.hm-c__no{justify-self:start;background:none;border:0;padding:8px 4px;min-height:44px;font:700 16px Inter,sans-serif;color:#26365F;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
@media(max-width:760px){.hm-c__no{justify-self:center}}
.grump{position:fixed;inset:0;z-index:90;display:flex;align-items:flex-end;justify-content:center;padding:16px;padding-bottom:max(16px,env(safe-area-inset-bottom,0px));background:rgba(4,14,44,0);transition:background .3s}
.grump.on{background:rgba(4,14,44,.6)}
.grump__box{position:relative;width:100%;max-width:420px;box-sizing:border-box;background:#FFF8EC;border-radius:24px;padding:18px 22px 20px;text-align:center;display:grid;gap:10px;justify-items:center;box-shadow:0 20px 50px rgba(0,0,0,.5);transform:translateY(120%);transition:transform .45s cubic-bezier(.2,1.4,.4,1)}
.grump.on .grump__box{transform:none}
.grump__man{width:130px;height:auto;margin-top:-90px;animation:grumpShake 2.4s ease-in-out .6s infinite;transform-origin:50% 100%}
@keyframes grumpShake{0%,70%,100%{transform:rotate(0)}74%{transform:rotate(-5deg)}78%{transform:rotate(5deg)}82%{transform:rotate(-4deg)}86%{transform:rotate(3deg)}90%{transform:rotate(0)}}
.grump__t{margin:0;font:800 24px/1.15 'Plus Jakarta Sans',sans-serif;color:#0B1D4D;text-wrap:balance}
.grump__p{margin:0;color:#26365F;line-height:1.45}
.grump__yes{width:100%;margin-top:6px}
.grump__x{background:none;border:0;min-height:44px;font:700 15px Inter,sans-serif;color:#26365F;text-decoration:underline;cursor:pointer}
@media(min-width:761px){.grump{align-items:center}}
@media(prefers-reduced-motion:reduce){.grump__box{transition:none}.grump__man{animation:none}}
.grump[hidden]{display:none!important}
/* See more (Paul, 10 Nov 2026) */
.hm-more-wrap{display:flex;justify-content:center;margin:-18px 16px 40px}
.hm-seemore{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;border:2px solid #F5C24A;background:rgba(11,29,77,.75);color:#fff;font:800 17px 'Plus Jakarta Sans',Inter,sans-serif;cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,.35)}
.hm-seemore::after{content:"";width:9px;height:9px;border-right:3px solid #F5C24A;border-bottom:3px solid #F5C24A;transform:rotate(45deg) translateY(-3px)}
.hm-seemore:hover{background:rgba(11,29,77,.9)}
.hm-morehome[hidden]{display:none!important}
main>section[data-more][hidden]{display:none!important}
.hm-more-wrap[hidden]{display:none!important}

/* ---------- Jay's version (10 Nov 2026): one line, three matching product cards in phone screens ---------- */
main>section.hm.hm-j{display:grid;gap:22px}
.hm-j__h{margin:0;text-align:center;font:800 clamp(28px,4vw,46px)/1.1 'Plus Jakarta Sans',Inter,sans-serif;letter-spacing:-.02em;text-wrap:balance;color:var(--ewn-night,#0B1D4D)}
.hm-j__cards{display:grid;gap:22px;grid-template-columns:1fr}
@media(min-width:900px){.hm-j__cards{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}}
.jcard{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;background:#fff;border:1px solid #E7DCC2;border-radius:22px;padding:20px 18px 18px;min-width:0}
.jcard--main{border:3px solid #F5C24A;box-shadow:0 12px 26px -12px rgba(11,29,77,.45)}
.jcard h2{margin:4px 0 0;font:800 22px/1.2 'Plus Jakarta Sans',sans-serif;color:var(--ewn-night,#0B1D4D)}
.jcard p{margin:0;color:#26365F;line-height:1.45}
.jcard .jprice{font:800 15px/1.35 'Plus Jakarta Sans',sans-serif;color:#C8102E}
.jcard .jtiny{font-size:13px;font-weight:600}
.jphone{position:relative;width:min(210px,62vw);aspect-ratio:9/18;border-radius:30px;padding:8px;box-sizing:border-box;background:#0B1D4D;box-shadow:0 12px 24px -10px rgba(11,29,77,.6)}
.jphone__isl{position:absolute;z-index:2;top:14px;left:50%;width:56px;height:14px;margin-left:-28px;border-radius:10px;background:#000}
.jphone__scr{position:relative;width:100%;height:100%;border-radius:23px;overflow:hidden;background:#0B1D4D}
.jphone__scr video{display:block;width:100%;height:100%;object-fit:cover}
.jstamp{display:inline-block;margin-top:-26px;position:relative;z-index:3;transform:rotate(-3deg);background:linear-gradient(160deg,#FFE7A3,#F5C24A 60%,#E3A92B);color:#7A1020;font:900 13px/1.2 'Plus Jakarta Sans',sans-serif;letter-spacing:.04em;text-transform:uppercase;padding:7px 12px;border-radius:8px;box-shadow:0 4px 10px rgba(0,0,0,.25)}
.jstamp--now{background:#17803F;color:#fff}
.jbtn{display:flex;align-items:center;justify-content:center;width:100%;max-width:320px;min-height:54px;margin-top:auto;padding:0 18px;box-sizing:border-box;border-radius:999px;background:#D9283E;color:#fff!important;font:800 17px 'Plus Jakarta Sans',sans-serif;text-decoration:none;box-shadow:0 5px 0 #9E1426}
.jbtn--free{background:#17803F;box-shadow:0 5px 0 #0E5A2B}
.jcard .jtiny{margin-top:-2px}
.jcall{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:linear-gradient(#1B3478,#0B1D4D);color:#fff;padding:20px 10px}
.jcall__k{margin:0;font:600 13px Inter,sans-serif;opacity:.8;color:#fff!important}
.jcall img{width:92px;height:92px;border-radius:50%;object-fit:cover;border:3px solid #F5C24A;animation:jring 1.6s ease-in-out infinite}
.jcall__n{margin:4px 0 0;font:800 20px 'Plus Jakarta Sans',sans-serif;color:#fff!important}
.jcall__f{margin:0;font-size:13px;color:#C9D3EE!important}
.jcall__btns{display:flex;gap:44px;margin-top:auto}
.jcall__btns span{width:46px;height:46px;border-radius:50%}
.jcall__no{background:#E5484D}.jcall__yes{background:#30C35C;animation:jring 1.6s ease-in-out infinite}
@keyframes jring{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@media(prefers-reduced-motion:reduce){.jcall img,.jcall__yes{animation:none}}

/* Signed-in homepage: "Does Sofia want a call from Elfie?" (Paul, 10 Nov 2026) */
.hm-c-want{display:grid;gap:6px;justify-items:center;text-align:center;margin-top:14px;padding:16px;border-radius:18px;background:#FFF3D1;border:2px solid #F5C24A}
.hm-c-want__q{margin:0;font:800 20px/1.25 'Plus Jakarta Sans',sans-serif;color:#0B1D4D;text-wrap:balance}
.hm-c-want__p{margin:0;color:#26365F}.hm-c-want__p b{color:#C8102E}
.hm-c-want .hm-c-btn{width:100%;max-width:320px}
main>section#tracker[hidden]{display:none!important}

.hm-c-want__price{font-weight:800;color:#C8102E}

/* Returning families (Paul, 11 Nov 2026): Welcome back, the Elf call and the early bird app credits, side by side on a laptop */
#back{display:none}
html.ew-back #back{display:block}
html.ew-back #tracker,html.ew-back #seeMoreWrap{display:none!important}
.hm-back__top{display:grid;gap:10px;justify-items:center;text-align:center;margin:0 auto 22px;max-width:760px}
.hm-back__film{width:min(340px,72vw);border:5px solid #39E27A;border-radius:26px;overflow:hidden;line-height:0;background:#0B1D4D;box-shadow:0 12px 26px -14px rgba(11,29,77,.6)}
.hm-back__film video{display:block;width:100%;aspect-ratio:9/16;object-fit:cover}
.hm-back__h{margin:6px 0 0;font:800 clamp(30px,4vw,46px)/1.08 'Plus Jakarta Sans',Inter,sans-serif;color:#0B1D4D;letter-spacing:-.02em}
.hm-back__sub{margin:0;font-size:clamp(17px,1.6vw,20px);color:#26365F}
.hm-back__open{margin-top:4px}
.hm-back__cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:stretch;max-width:980px;margin:0 auto}
.bcard{position:relative;display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center;padding:22px 18px 20px;border-radius:22px;background:#fff;border:3px solid #E3DCCB;box-shadow:0 12px 26px -16px rgba(11,29,77,.5)}
.bcard h2{margin:0;font:800 clamp(21px,2vw,26px)/1.18 'Plus Jakarta Sans',sans-serif;color:#0B1D4D;text-wrap:balance}
.bcard p{margin:0;color:#26365F;line-height:1.45}
.bcard__price{font-weight:800;color:#C8102E!important}
.bcard__left{font:800 16px 'Plus Jakarta Sans',sans-serif;color:#17803F!important;min-height:1.4em}
.bcard__btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;margin-top:auto}
.bcard .bcard__go{margin-top:auto;width:100%;justify-content:center}
.bcard__btns .bcard__go{margin-top:0}
.bcard__hear{min-height:52px;border-radius:999px;border:2px solid #0B1D4D;background:#fff;color:#0B1D4D;font:800 15px 'Plus Jakarta Sans',sans-serif;cursor:pointer}
.bcard__hear[aria-pressed="true"]{background:#0B1D4D;color:#fff}
.bcard__hear:focus-visible{outline:3px solid #F5C24A;outline-offset:2px}
.bcard__ring{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#17803F;box-shadow:0 0 0 8px rgba(23,128,63,.15);animation:bRing 1.8s ease-in-out infinite}
.bcard__ring svg{width:30px;height:30px}
@keyframes bRing{0%,60%,100%{transform:rotate(0)}10%{transform:rotate(-12deg)}20%{transform:rotate(12deg)}30%{transform:rotate(-8deg)}40%{transform:rotate(8deg)}}
.bcard--eb{border-color:#F2C14E;background:linear-gradient(180deg,#FFF8E3,#fff 55%)}
.bcard__stamp{font:900 13px 'Plus Jakarta Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#7A4A00;background:linear-gradient(160deg,#FFE7A3,#F5C24A 60%,#E3A92B);border-radius:8px;padding:6px 12px;transform:rotate(-3deg)}
.bcard--eb h2{font-size:clamp(26px,2.6vw,34px)}
@media (max-width:760px){.hm-back__cards{grid-template-columns:minmax(0,1fr)}.hm-back__open{justify-self:stretch}.hm-back__film{width:min(270px,72vw)}.bcard__btns{grid-template-columns:minmax(0,1fr)}.bcard__btns .bcard__go{order:-1}}
@media (prefers-reduced-motion:reduce){.bcard__ring{animation:none}}
/* Welcome back on a laptop: a big phone beside the words, so the button stays in view (Paul, 11 Nov 2026: "needs to be a bigger phone") */
@media (min-width:900px){.hm-back__top{grid-template-columns:auto minmax(0,420px);grid-template-areas:"film ." "film h" "film sub" "film open" "film .";grid-template-rows:1fr auto auto auto 1fr;column-gap:48px;row-gap:14px;justify-content:center;align-content:center;align-items:center;max-width:900px}.hm-back__top .hm-back__film{grid-area:film;width:300px}.hm-back__h{grid-area:h;align-self:end;text-align:left;justify-self:start}.hm-back__sub{grid-area:sub;text-align:left;justify-self:start}.hm-back__open{grid-area:open;align-self:start;justify-self:start}}

/* The 2025 footage in an iPhone, above "Enjoyed by over 40,000 families" (Paul, 11 Nov 2026: "in a Iphone casing", bigger on a laptop) */
.iph{position:relative;width:min(280px,72vw);aspect-ratio:496/1080;margin:0 auto 26px;padding:11px;box-sizing:content-box;border-radius:52px;background:linear-gradient(145deg,#4A4F5A,#1C1F26 45%,#3A3F49);box-shadow:inset 0 0 0 2px #6B717D,inset 0 0 0 5px #0B0C10,0 30px 60px -20px rgba(0,0,0,.75)}
.iph__scr{position:relative;width:100%;height:100%;border-radius:42px;overflow:hidden;background:#000}
.iph__scr video{display:block;width:100%;height:100%;object-fit:cover}
.iph__isl{position:absolute;z-index:2;top:12px;left:50%;width:30%;height:26px;transform:translateX(-50%);border-radius:20px;background:#000}
.iph__btn{position:absolute;width:4px;border-radius:2px;background:linear-gradient(90deg,#2A2D35,#5A5F6B)}
.iph__btn--a{left:-3px;top:15%;height:5%}.iph__btn--b{left:-3px;top:23%;height:9%}.iph__btn--c{left:-3px;top:34%;height:9%}.iph__btn--p{right:-3px;top:27%;height:13%}
@media (min-width:900px){
 .hm-families:has(.iph){display:grid;grid-template-columns:auto minmax(0,460px);grid-template-areas:"ph ." "ph line" "ph link" "ph .";grid-template-rows:1fr auto auto 1fr;column-gap:64px;justify-content:center;align-items:center;text-align:left}
 .hm-families .iph{grid-area:ph;margin:0;width:calc(min(80vh,760px) * 496 / 1080)}
 .hm-families:has(.iph) .hm-families__line{grid-area:line;text-align:left}
 .hm-families:has(.iph) .hm-families__link{grid-area:link;justify-self:start}
}

/* Returning families (Paul, 11 Nov 2026): the top sells the packs and the call; the tracker is only a quiet way in */
.hm-back__film--ad{width:min(340px,86vw)}
.hm-back__film--ad video{aspect-ratio:4/5}
.hm-back__open--quiet{background:transparent!important;color:#0B1D4D!important;border:2px solid #0B1D4D!important;box-shadow:none!important;min-height:48px;font-size:16px!important}
@media (min-width:900px){.hm-back__top .hm-back__film.hm-back__film--ad{width:420px}}