/* Frameless original-pack compositions, with space for the products and the words. */
.hero-v4.hero-universe {
  position:relative; display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:5%; min-height:730px; height:auto; padding:54px 6% 100px; overflow:hidden;
  border-radius:0; isolation:isolate; background:#ffdf70;
}
.hero-v4.hero-universe.hero-v11[data-world]::before {
  content:''; display:block; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(ellipse at 79% 15%,#fffaf5ad,transparent 50%),radial-gradient(ellipse at 22% 100%,#f0a1a12e,transparent 56%);
}
.hero-v4.hero-universe::after { display:none; }
.hero-v4.hero-universe .hero-copy { position:relative; left:auto; top:auto; width:100%; max-width:none; z-index:3; align-self:center; padding:10px 0 32px; min-width:0; }
.hero-v4.hero-universe .eyebrow { display:inline-block; font-size:10px; line-height:1.75; letter-spacing:1.4px; padding:0; background:none; border:0; border-radius:0; }
.hero-v4.hero-universe h1 { font:650 clamp(53px,5.9vw,92px)/1.015 'DM Sans',Arial,sans-serif; letter-spacing:-4.5px; margin:25px 0 23px; }
.hero-v4.hero-universe h1 em { font:italic 400 1em/1.07 'Playfair Display',Georgia,serif; letter-spacing:-3.5px; }
.hero-v4.hero-universe p { font-size:16px; line-height:1.85; max-width:420px; margin:22px 0; }
.hero-v4 .hero-ctas { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:30px; }
.hero-v4 .hero-ctas .button { display:inline-flex; align-items:center; min-height:52px; padding:15px 25px; border-radius:30px; background:#392029; color:#fff; font-size:13px; box-shadow:0 10px 25px #34202b12; transition:transform .2s,box-shadow .2s; }
.hero-v4 .hero-ctas .button:hover { transform:translateY(-3px); box-shadow:0 15px 30px #34202b22; }
.hero-v4 .hero-secondary { display:inline-flex; align-items:center; min-height:44px; font-size:13px; text-decoration:underline; text-underline-offset:5px; color:inherit; }
.hero-v4 .hero-proof { display:flex; flex-wrap:wrap; gap:9px; margin-top:25px; line-height:1.6; }
.hero-v4 .hero-proof span { font:600 9px/1.6 'DM Sans',Arial,sans-serif; border:1px solid currentColor; border-radius:20px; padding:8px 12px; background:#fff9ec21; opacity:.86; }
.hero-v4.hero-universe .hero-worldline { font-size:11px; line-height:1.7; letter-spacing:.4px; margin:22px 0 0; opacity:.8; }
.hero-v4 .hero-stage { position:relative; width:100%; height:548px; isolation:isolate; overflow:visible; margin:0; --mx:0px; --my:0px; transform:translateZ(0); }
.scene-ambient { position:absolute; inset:-4% -8% -1%; z-index:-3; pointer-events:none; }
.ambient-orb { position:absolute; display:block; border-radius:50%; }
.ambient-one { inset:9% 1% 15% 1%; background:radial-gradient(ellipse at 40% 38%,#fff8dca3,#ffc98842 53%,transparent 72%); }
.ambient-two { width:38%; aspect-ratio:1; right:-3%; top:0; background:radial-gradient(circle at 35% 35%,#ffdedac2,#e8bdcd4d 48%,transparent 71%); }
.ambient-three { width:35%; aspect-ratio:1; left:-7%; bottom:-1%; background:radial-gradient(circle at 40% 40%,#ffefbdac,#fbac8945 54%,transparent 72%); }
.scene-disc { position:absolute; inset:9% 1% 12%; z-index:-2; background:radial-gradient(ellipse at 50% 47%,#fff9ec65,transparent 71%); border:0; border-radius:50%; box-shadow:none; }
.scene-orbit { position:absolute; inset:9% -5% 10%; border:1px solid currentColor; border-radius:50%; opacity:.13; transform:rotate(-27deg); z-index:-1; pointer-events:none; }
.scene-word { position:absolute; top:0; left:2%; font:800 clamp(64px,8.1vw,116px)/1 'DM Sans',Arial,sans-serif; letter-spacing:-6px; color:inherit; -webkit-text-stroke:0; opacity:.075; z-index:-1; pointer-events:none; }
.hero-v4.hero-universe .hero-img.hero-main {
  position:absolute; inset:3% -6% auto auto; width:112%; height:87%; min-height:0; max-width:none;
  padding:0; border:0; border-radius:0; box-shadow:none; background:transparent; object-fit:contain; object-position:center;
  mix-blend-mode:normal; opacity:1; filter:drop-shadow(0 20px 17px #4831241c);
  transform:translate(var(--mx),var(--my)); transition:transform .4s,opacity .2s; z-index:2;
}
.scene-product { position:absolute; width:30%; height:63%; top:13%; padding:0; border:0; border-radius:0; box-shadow:none; background:transparent; object-fit:contain; object-position:center; filter:drop-shadow(0 14px 10px #3559541c); z-index:1; }
.scene-product.left { left:0; transform:rotate(-13deg); }
.scene-product.right { right:-2%; top:19%; transform:rotate(13deg); }
.scene-photo-label { display:none; }
.scene-spark { position:absolute; font:normal 59px/1 Georgia,serif; color:currentColor; opacity:.65; z-index:1; pointer-events:none; }
.spark-one { top:1%; right:0; transform:rotate(15deg); }
.spark-two { bottom:14%; left:5%; font-size:35px; transform:rotate(-12deg); }
.hero-spotlight { position:absolute; right:0; bottom:5%; width:225px; z-index:4; display:block; text-decoration:none; color:inherit; background:transparent; border:0; border-top:1px solid currentColor; border-radius:0; padding:13px 0 0; box-shadow:none; backdrop-filter:none; transform:none; transition:transform .2s; }
.hero-spotlight:hover,.hero-spotlight:focus-visible { transform:translateY(-4px); }
.hero-spotlight>span { display:block; font-size:9px; line-height:1.7; letter-spacing:1.5px; font-weight:600; margin-bottom:7px; }
.hero-spotlight strong { font:600 14px/1.5 'DM Sans',Arial,sans-serif; display:block; }
.hero-spotlight small { display:block; font-size:10px; line-height:1.7; margin-top:5px; color:inherit; opacity:.78; }
.hero-art-credit { position:absolute; bottom:-2%; left:0; right:1%; font-size:9px; letter-spacing:.2px; opacity:.77; line-height:1.7; }
.hero-bottom { position:absolute; bottom:25px; left:6%; right:6%; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.hero-hint { font-size:9px; letter-spacing:1.3px; line-height:1.7; opacity:.77; }
.hero-v4 .hero-controls { position:static; display:flex; align-items:center; gap:13px; background:#ffffff19; padding:6px; border:1px solid #ffffff91; border-radius:40px; }
.hero-v4 .hero-controls button { width:44px; height:44px; border:1px solid currentColor; border-radius:50%; background:transparent; color:inherit; font-size:17px; display:grid; place-items:center; }
.hero-v4 .hero-controls #heroPlay { width:auto; min-width:67px; padding:0 17px; border-radius:24px; font-size:11px; }
.hero-v4 #heroCounter { font-size:11px; min-width:51px; text-align:center; }
/* Alpha artworks are complete PNG compositions, never framed or cropped. */
.hero-v4.hero-universe .hero-stage[data-format="alpha"] .hero-img.hero-main { inset:0 -8% auto auto; width:116%; height:90%; border:0; border-radius:0; background:transparent; box-shadow:none; object-fit:contain; padding:0; transform:translate(var(--mx),var(--my)); }
.hero-v4.hero-universe .hero-stage[data-format="alpha"] .scene-product { border:0; border-radius:0; background:transparent; box-shadow:none; padding:0; object-fit:contain; }
.hero-v4[data-world="pagoto"] .scene-disc { background:radial-gradient(ellipse,#f7c7df4d,transparent 70%); }
.hero-v4[data-world="pagoto"] .scene-orbit,.hero-v4[data-world="organics"] .scene-orbit { opacity:.2; }
.hero-v4[data-world="pagoto"] .scene-word { opacity:.11; }
.hero-v4[data-world="pagoto"] .ambient-one { background:radial-gradient(ellipse at 45% 40%,#ffd2e76b,#cf9be635 55%,transparent 74%); }
.hero-v4[data-world="pagoto"] .hero-ctas .button,.hero-v4[data-world="organics"] .hero-ctas .button { background:#fff3d8; color:#47224d; }
.hero-v4[data-world="aqua-mist"] .scene-disc { background:radial-gradient(ellipse,#c4efe059,transparent 70%); }
.hero-v4[data-world="aqua-mist"] .ambient-one { background:radial-gradient(ellipse at 50% 40%,#e8fff57d,#90cfc231 57%,transparent 74%); }
.hero-v4[data-world="aqua-mist"] .ambient-two { background:radial-gradient(circle,#b9ded94a,transparent 70%); }
.hero-v4[data-world="aqua-mist"] .hero-stage:not([data-format="alpha"]) .hero-img.hero-main { width:69%; right:15%; height:85%; top:2%; }
.hero-v4[data-world="kbeauty"] .scene-disc { background:radial-gradient(ellipse,#f6efff7d,#d3a9df28 60%,transparent 73%); }
.hero-v4[data-world="kbeauty"] .ambient-one { background:radial-gradient(ellipse at 45% 35%,#fff4f983,#d9aad644 55%,transparent 74%); }
.hero-v4[data-world="organics"] .hero-img.hero-main,.hero-v4[data-world="lifestyle"] .hero-img.hero-main { width:92%; height:82%; right:3%; top:3%; object-fit:contain; border-radius:0; }
.hero-v4.hero-universe .hero-stage[data-focused="true"] .hero-img.hero-main { inset:0 9% auto auto; width:82%; height:85%; padding:0; object-fit:contain; border:0; border-radius:0; background:transparent; box-shadow:none; }
.hero-stage[data-focused="true"] .scene-product { opacity:.16; }
.hero-stage[data-focused="true"] .hero-spotlight { transform:none; }
.hero-stage[data-format="range"] .hero-img.hero-main { object-fit:contain; }
.universe-tabs { border:0; border-bottom:1px solid #e8d8de; background:#fffaf3; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); padding:0 4%; gap:0; }
.universe-tabs button { border:0; border-right:1px solid #e8d8de; border-radius:0; background:none; padding:22px 17px; text-align:left; position:relative; font:600 14px/1.5 'DM Sans',Arial,sans-serif; min-height:106px; color:#4e2b40; }
.universe-tabs button:last-child { border-right:0; }
.universe-tabs button span { font-size:9px; display:block; margin-bottom:7px; color:#9a7c8b; }
.universe-tabs button small { font-size:10px; font-weight:400; line-height:1.6; margin-top:6px; display:block; }
.universe-tabs .active { background:#f9e6db; }
.universe-tabs .active::after { content:''; position:absolute; height:3px; background:#dd784d; left:17px; right:17px; bottom:0; }
.universe-tabs button:hover { background:#faeee6; }
.hero-shopping { padding:37px 6% 29px; background:#fffaf3; }
.hero-shopping-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:20px; }
.hero-shopping-heading h2 { font:600 26px/1.5 'DM Sans',Arial,sans-serif; letter-spacing:-1px; margin:5px 0 0; }
.hero-shopping-heading .eyebrow { font-size:9px; letter-spacing:1.5px; line-height:1.6; }
.rail-controls { display:flex; gap:9px; }
.rail-controls button { width:44px; height:44px; border:1px solid #ded0da; border-radius:50%; background:transparent; color:#65314f; font-size:17px; }
.hero-products { display:flex; gap:17px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:#d6b8c4 transparent; padding:5px 3px 18px; overscroll-behavior-x:contain; }
.hero-product-card { flex:0 0 276px; scroll-snap-align:start; display:grid; grid-template-columns:91px 1fr; gap:16px; align-items:center; min-height:145px; padding:16px; position:relative; border:1px solid #ebdcd2; border-radius:20px; background:#fff6ed; color:#3a2a3d; text-decoration:none; transition:border-color .2s,background .2s; }
.hero-product-card img { width:91px; height:105px; object-fit:contain; border:0; border-radius:0; background:transparent; filter:none; }
.hero-product-card strong,.hero-product-card>span { display:block; font-size:12px; line-height:1.5; font-weight:600; padding-right:31px; }
.hero-product-card small { display:block; margin:7px 0 8px; font-size:10px; color:#816f85; line-height:1.6; }
.hero-product-card .card-links { display:flex; gap:14px; align-items:center; }
.hero-product-card .card-links button { border:0; border-bottom:1px solid #b194bf; background:none; color:#5d1e73; font:500 11px 'DM Sans',Arial,sans-serif; padding-block:10px; min-height:40px; cursor:pointer; }
.hero-product-card .card-links a { font-size:11px; min-height:40px; display:inline-flex; align-items:center; padding-block:10px; white-space:nowrap; text-decoration:underline; text-underline-offset:3px; }
.hero-product-card .rail-add { position:absolute; right:5px; top:4px; width:44px; height:44px; border:1px solid #d5bbb2; border-radius:50%; font-size:21px; background:#fffaf4; color:#612876; }
.hero-product-card.active { border-color:#d58864; background:#fbe9dc; }
.hero-product-card:hover { border-color:#bc826c; }
.rail-tail { display:flex; justify-content:space-between; align-items:center; gap:18px; font-size:11px; line-height:1.7; margin-top:10px; color:#766372; }
.rail-tail a { color:#65314f; min-height:44px; display:inline-flex; align-items:center; text-decoration:underline; text-underline-offset:4px; }
.egg-series { padding:28px 6%; background:#fffaf3; border-top:1px solid #ecdbd3; }
.egg-series-heading { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:16px; }
.egg-series-heading h2 { font:600 21px/1.5 'DM Sans',Arial,sans-serif; letter-spacing:-.6px; margin:0; }
.egg-series-heading p { font-size:11px; line-height:1.7; color:#816b76; margin:0; }
.egg-series-buttons { display:flex; flex-wrap:wrap; gap:9px; }
.egg-series-buttons button { display:inline-flex; align-items:center; gap:10px; min-height:46px; padding:10px 16px; border:1px solid #dec9c9; border-radius:26px; background:transparent; color:#553344; font:500 12px/1.5 'DM Sans',Arial,sans-serif; cursor:pointer; }
.egg-series-buttons button::before { content:''; width:12px; height:12px; border-radius:50%; background:var(--flavour-color,#e9b75c); box-shadow:inset 0 0 0 1px #0000000d; }
.egg-series-buttons button[aria-pressed="true"] { border-color:#804d59; background:#fff1e4; box-shadow:0 0 0 1px #804d5917; }
.egg-series-buttons button:hover { background:#faeee6; }
.hero-v4 button:focus-visible,.hero-products button:focus-visible,.universe-tabs button:focus-visible,.egg-series button:focus-visible { outline:3px solid currentColor; outline-offset:4px; }
.footer-privacy { display:block; margin-top:12px; padding:8px 0; border:0; background:none; color:inherit; text-align:left; font-size:12px; text-decoration:underline; }
.privacy-buttons { display:flex; gap:10px; flex-wrap:wrap; margin:25px 0; }
.consent-bar { position:fixed; bottom:15px; left:5%; right:5%; z-index:60; display:flex; align-items:center; gap:20px; padding:20px; background:#fff9ed; border:1px solid #d2badb; box-shadow:0 15px 50px #0002; border-radius:15px; font-size:12px; }
.consent-bar p { flex:1; margin:0; }
.consent-bar button { font-size:11px; border:1px solid #d2badb; background:#f1e4f6; padding:10px; border-radius:20px; }
button:disabled { opacity:.5; cursor:default; }
@media(min-width:1600px) {
  .hero-v4.hero-universe { padding-inline:8%; min-height:780px; }
  .hero-v4 .hero-stage { height:585px; }
  .hero-v4.hero-universe h1 { font-size:100px; }
  .hero-v4 .hero-bottom { left:8%; right:8%; }
}
@media(max-width:1100px) {
  .hero-v4.hero-universe { gap:3%; padding:45px 5% 94px; min-height:640px; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); }
  .hero-v4 .hero-stage { height:470px; }
  .hero-v4.hero-universe h1 { font-size:clamp(46px,6vw,68px); letter-spacing:-3.3px; }
  .hero-v4.hero-universe h1 em { letter-spacing:-2.8px; }
  .hero-v4.hero-universe p { font-size:14px; }
  .hero-v4 .hero-ctas { gap:17px; }
  .hero-v4 .hero-ctas .button { font-size:12px; padding-inline:20px; }
  .hero-v4 .hero-secondary { font-size:12px; }
  .hero-spotlight { width:185px; }
  .hero-spotlight strong { font-size:13px; }
  .scene-spark { font-size:49px; }
  .universe-tabs { padding:0; }
  .universe-tabs button { padding-inline:12px; font-size:12px; }
}
@media(max-width:700px) {
  .hero-v4.hero-universe { display:block; min-height:0; padding:31px 6% 88px; }
  .hero-v4.hero-universe .hero-copy { padding:0; }
  .hero-v4.hero-universe h1 { font-size:clamp(46px,10.3vw,66px); letter-spacing:-2.6px; margin:20px 0 17px; }
  .hero-v4.hero-universe h1 em { letter-spacing:-2.2px; }
  .hero-v4.hero-universe .eyebrow { font-size:9px; letter-spacing:1px; }
  .hero-v4.hero-universe p { font-size:14px; line-height:1.8; max-width:410px; margin:13px 0 0; }
  .hero-v4 .hero-ctas { gap:18px; margin-top:22px; }
  .hero-v4 .hero-ctas .button { min-height:49px; font-size:12px; padding:13px 19px; }
  .hero-v4 .hero-proof { margin-top:19px; gap:7px; }
  .hero-v4 .hero-proof span { font-size:8px; padding:8px 10px; }
  .hero-v4.hero-universe .hero-worldline { display:none; }
  .hero-v4 .hero-stage { height:375px; max-width:500px; margin:20px auto 16px; }
  .hero-v4.hero-universe .hero-stage[data-format="alpha"] .hero-img.hero-main { inset:0 -7% auto auto; width:114%; height:87%; }
  .scene-word { font-size:77px; letter-spacing:-4px; top:2%; }
  .scene-product { width:29%; height:63%; }
  .scene-spark { font-size:39px; }
  .spark-one { top:2%; right:1%; }
  .spark-two { font-size:28px; bottom:18%; left:7%; }
  .hero-spotlight { width:170px; right:0; bottom:1%; padding-top:9px; }
  .hero-spotlight>span { font-size:8px; letter-spacing:1.1px; margin-bottom:4px; }
  .hero-spotlight strong { font-size:12px; line-height:1.45; }
  .hero-spotlight small { font-size:9px; margin-top:5px; }
  .hero-art-credit { font-size:8px; bottom:-9%; left:0; right:0; max-width:100%; }
  .hero-bottom { bottom:17px; left:6%; right:6%; justify-content:center; }
  .hero-hint { display:none; }
  .hero-v4 .hero-controls { gap:11px; padding:6px; }
  .hero-v4 .hero-controls #heroPlay { font-size:10px; padding-inline:13px; min-width:63px; }
  .hero-v4 #heroCounter { font-size:10px; min-width:45px; }
  .universe-tabs { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
  .universe-tabs button { flex:0 0 136px; scroll-snap-align:start; min-height:95px; padding:16px 13px; font-size:12px; }
  .universe-tabs button small { font-size:10px; }
  .hero-shopping { padding:28px 5% 25px; }
  .hero-shopping-heading h2 { font-size:22px; }
  .hero-shopping-heading .eyebrow { font-size:8px; }
  .hero-product-card { flex-basis:259px; grid-template-columns:85px 1fr; gap:14px; padding:14px; }
  .hero-product-card img { width:85px; height:100px; }
  .rail-tail { font-size:10px; align-items:start; gap:15px; }
  .rail-tail a { margin-top:-9px; }
  .egg-series { padding:24px 5%; }
  .egg-series-heading { display:block; }
  .egg-series-heading p { margin-top:5px; }
  .egg-series-buttons { flex-wrap:nowrap; overflow-x:auto; padding:5px 3px 12px; scrollbar-width:thin; scroll-snap-type:x proximity; }
  .egg-series-buttons button { white-space:nowrap; flex-shrink:0; scroll-snap-align:start; }
  .consent-bar { flex-wrap:wrap; padding:15px; gap:10px; font-size:11px; }
  .consent-bar p { flex-basis:100%; }
}
@media(max-width:390px) {
  .hero-v4 .hero-stage { height:330px; }
  .hero-spotlight { width:156px; }
  .hero-spotlight strong { font-size:11px; }
  .hero-spotlight small { font-size:8px; }
  .hero-v4 .hero-ctas { gap:13px; }
  .hero-v4 .hero-secondary { font-size:11px; }
  .hero-art-credit { font-size:7px; }
}
@media(prefers-reduced-motion:reduce) {
  .hero-v4 *, .hero-products *, .universe-tabs *, .egg-series * { transition:none!important; animation:none!important; }
  .hero-v4 .hero-stage,.hero-v4 .hero-img.hero-main,.hero-v4 .scene-product,.hero-v4 .hero-spotlight { transform:none!important; }
  .hero-v4 .hero-ctas .button:hover { transform:none; }
  .hero-products { scroll-behavior:auto; }
}

/* Square alpha exports include air around narrow bottles. Give side bottles their full height. */
.hero-v11[data-world="eggsential"] .hero-stage[data-format="alpha"] .scene-product{width:88%;height:74%;top:15%}
.hero-v11[data-world="eggsential"] .scene-product.left{left:-25%;transform:rotate(-12deg)}
.hero-v11[data-world="eggsential"] .scene-product.right{right:-25%;top:20%;transform:rotate(12deg)}
@media(max-width:600px){.hero-v11[data-world="eggsential"] .hero-stage[data-format="alpha"] .scene-product{height:70%;top:15%}}

/* Product focus belongs to the reading column so every pack stays clear. */
.hero-v11 .hero-copy .hero-spotlight{position:static;width:min(100%,320px);margin:24px 0 0;padding-top:14px;transform:none}
.hero-v11 .hero-copy .hero-spotlight:hover,.hero-v11 .hero-copy .hero-spotlight:focus-visible{transform:none}

/* The same playful floating language connects every transparent campaign. */
.hero-v4.hero-universe.hero-v12{min-height:690px;padding-top:48px;padding-bottom:97px}
.hero-v12 .hero-stage[data-bubble-stage]{cursor:default}
.hero-v12 .scene-orbit{inset:8% -6% 10%;transform:rotate(-21deg);opacity:.12}
.hero-v12 .scene-word{top:1%;left:0;font-size:clamp(73px,8.5vw,124px);opacity:.08;letter-spacing:-5px}
.hero-v12 .scene-disc{background:radial-gradient(ellipse at 50% 47%,#fffbf54d,transparent 68%)}
.hero-v12.hero-universe .hero-img.hero-main{animation:hero-v12-float 7s ease-in-out infinite;filter:drop-shadow(0 25px 20px #3527351b)}
.hero-v12 .scene-product{animation:hero-v12-side-float 8s ease-in-out infinite;--float-tilt:12deg}
.hero-v12 .scene-product.left{--float-tilt:-12deg;animation-delay:-2.5s}
.hero-v12 .scene-product.right{animation-delay:-5s}
.hero-v12 .scene-spark{animation:hero-v12-spark 16s ease-in-out infinite}
.hero-v12 .spark-two{animation-delay:-7s}
.hero-v12.hero-universe h1{font-weight:700;line-height:1.04;letter-spacing:-3.9px;max-width:590px}
.hero-v12.hero-universe h1 em{line-height:1.08}
.hero-v12.hero-universe p{line-height:1.85}
.hero-v12 .hero-proof span{padding:9px 13px;font-size:9px;letter-spacing:.5px;background:#fffaf01c}
.hero-v12 .hero-copy .hero-spotlight{border-top-color:currentColor;padding-top:13px;width:min(100%,340px)}
.hero-v12 .hero-copy .hero-spotlight>span{font-size:10px;letter-spacing:1.25px;opacity:.78}
.hero-v12 .hero-copy .hero-spotlight strong{font-size:15px;line-height:1.55}
.hero-v12 .hero-copy .hero-spotlight small{font-size:11px;line-height:1.75;opacity:.82}
.hero-v12 .hero-art-credit{font-size:10px;line-height:1.75;max-width:480px;text-align:center;margin:auto;left:0;right:0;bottom:0}
.hero-v12[data-world="pagoto"] .hero-stage[data-format="alpha"] .hero-img.hero-main{width:122%;right:-11%;height:98%;top:-2%;filter:drop-shadow(0 25px 23px #2b142d40)}
.hero-v12[data-world="pagoto"] .ambient-one{background:radial-gradient(ellipse at 48% 47%,#f9bdb43d,#c86faf25 56%,transparent 73%)}
.hero-v12[data-world="pagoto"] .ambient-two{background:radial-gradient(circle,#eccefb31,transparent 70%)}
.hero-v12[data-world="pagoto"] .ambient-three{background:radial-gradient(circle,#edaf7540,transparent 73%)}
.hero-v12[data-world="pagoto"] .scene-spark{color:#ffc8dc;opacity:.73}
.hero-v12[data-world="pagoto"] .hero-proof span{background:#ffe8ec0d}
.hero-v12[data-world="kbeauty"] .hero-stage[data-format="alpha"] .hero-img.hero-main{width:112%;right:-6%;height:94%;top:0}
.hero-v12[data-world="kbeauty"] .ambient-one{background:radial-gradient(ellipse at 50% 47%,#fff8fc8a,#d9bad749 54%,transparent 73%)}
.hero-v12[data-world="aqua-mist"] .hero-stage[data-format="alpha"] .hero-img.hero-main{width:116%;right:-8%;height:91%;top:0}
.hero-v12[data-world="aqua-mist"] .ambient-three{background:radial-gradient(circle,#b2e2d28f,transparent 72%)}
.hero-v12[data-world="eggsential"] .scene-spark{color:#714330;opacity:.62}
.hero-v12.hero-universe .hero-stage[data-focused="true"][data-format="alpha"] .hero-img.hero-main{width:108%;right:-4%;top:0;height:93%}
.hero-v12 .hero-controls{background:#fffdf413;border-color:currentColor;box-shadow:0 5px 18px #48324208}
.hero-v12 .hero-controls button{border-color:currentColor;transition:background .2s,transform .2s}
.hero-v12 .hero-controls button:hover{background:#ffffff26;transform:translateY(-2px)}
.hero-v12.light-slide .hero-controls button:hover{background:#ffffff6b}
@keyframes hero-v12-float{0%,100%{transform:translate(var(--mx),var(--my)) rotate(-.8deg)}50%{transform:translate(var(--mx),calc(var(--my) - 9px)) rotate(.8deg)}}
@keyframes hero-v12-side-float{0%,100%{transform:translateY(0) rotate(var(--float-tilt))}50%{transform:translateY(-7px) rotate(calc(var(--float-tilt) + 1.5deg))}}
@keyframes hero-v12-spark{0%,100%{transform:rotate(10deg) scale(.94)}50%{transform:rotate(52deg) scale(1.08)}}
@media(min-width:1600px){.hero-v4.hero-universe.hero-v12{min-height:740px}.hero-v12.hero-universe h1{font-size:95px}}
@media(max-width:1100px){.hero-v4.hero-universe.hero-v12{min-height:640px;padding-top:39px}.hero-v12.hero-universe h1{font-size:clamp(45px,5.6vw,66px);letter-spacing:-3px}.hero-v12 .hero-art-credit{font-size:9px}.hero-v12 .hero-copy .hero-spotlight strong{font-size:14px}}
@media(max-width:700px){.hero-v4.hero-universe.hero-v12{min-height:0;padding:30px 5% 86px}.hero-v12.hero-universe h1{font-size:clamp(45px,10.2vw,67px);letter-spacing:-2.6px;line-height:1.045}.hero-v12 .hero-stage{margin-top:20px;height:360px}.hero-v12 .hero-copy .hero-spotlight{margin-top:20px;max-width:340px}.hero-v12 .hero-copy .hero-spotlight>span{font-size:9px}.hero-v12 .hero-copy .hero-spotlight strong{font-size:14px}.hero-v12 .hero-copy .hero-spotlight small{font-size:10px}.hero-v12 .hero-art-credit{font-size:9px;bottom:-4%;max-width:350px}.hero-v12 .scene-word{font-size:77px;top:3%;letter-spacing:-4px}.hero-v12[data-world="pagoto"] .hero-stage[data-format="alpha"] .hero-img.hero-main{width:112%;right:-6%;top:-4%;height:97%}.hero-v12 .hero-proof span{font-size:8px;padding:8px 11px}}
@media(max-width:390px){.hero-v12 .hero-stage{height:307px}.hero-v12.hero-universe h1{font-size:46px}.hero-v12 .hero-art-credit{font-size:8px;bottom:-7%}}
@media(prefers-reduced-motion:reduce){.hero-v12.hero-universe .hero-img.hero-main,.hero-v12 .scene-product,.hero-v12 .scene-spark{animation:none!important;transform:none!important}.hero-v12 .hero-controls button{transition:none!important}.hero-v12 .hero-controls button:hover{transform:none!important}}

/* A compact first screen, with the artwork and controls sized as one composition. */
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) {
  --banner-target:clamp(410px,calc(100vh - 238px),530px);
  box-sizing:border-box; display:grid; grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr);
  grid-template-rows:minmax(0,1fr) auto; column-gap:4%; row-gap:10px;
  min-height:var(--banner-target); height:auto; max-height:none; padding:16px 6%;
}
@supports(height:100svh) {
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) { --banner-target:clamp(410px,calc(100svh - 238px),530px); }
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy {
  display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); column-gap:16px;
  align-items:start; align-self:center; padding:0; min-width:0;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy>.eyebrow,
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy>h1,
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy>p,
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy>.hero-ctas { grid-column:1/-1; }
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) h1 {
  font-size:clamp(34px,3.85vw,58px); line-height:1.05; letter-spacing:-2.2px;
  margin:10px 0 12px; max-width:590px; overflow-wrap:normal;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) h1 em { line-height:1.08; letter-spacing:-1.8px; }
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy>p {
  font-size:14px; line-height:1.65; margin:0 0 14px; max-width:470px;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-ctas { gap:16px; margin:0 0 14px; }
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-ctas .button {
  min-height:44px; padding:11px 20px; font-size:12px; line-height:1.6;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-secondary { min-height:44px; font-size:12px; }
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-proof {
  grid-column:1; margin:0; gap:7px; align-content:start; align-self:start;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-proof span {
  font-size:8px; line-height:1.5; padding:6px 10px; letter-spacing:.4px; max-width:100%;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy .hero-spotlight {
  grid-column:2; position:static; width:100%; max-width:none; margin:0; padding:6px 0 0;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-spotlight>span {
  font-size:8.5px; line-height:1.5; letter-spacing:1.1px; margin-bottom:4px;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-spotlight strong { font-size:14px; line-height:1.45; }
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-spotlight small { font-size:10px; line-height:1.5; margin-top:4px; }
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy>.hero-worldline { display:none; }
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-stage {
  height:calc(var(--banner-target) - 100px); min-height:230px; width:100%; max-width:none;
  margin:0; align-self:center;
}
.hero-v4.hero-universe .hero-stage[data-format="alpha"] .hero-img.hero-main,
.hero-v4.hero-universe .hero-stage[data-format="alpha"][data-focused]:where(:not([data-has-pack="true"])) .hero-img.hero-main {
  inset:0 0 auto; width:100%; height:calc(100% - 28px); object-fit:contain; object-position:center;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-art-credit {
  bottom:0; left:0; right:0; max-width:420px; margin:auto;
  font-size:9px; line-height:1.5; text-align:center;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .scene-word { font-size:clamp(56px,6.4vw,96px); letter-spacing:-3.5px; }
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .scene-spark { font-size:42px; }
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .spark-two { font-size:28px; }
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-bottom {
  grid-column:1/-1; position:static; inset:auto; align-self:end; margin:0; gap:16px;
}
.hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-controls { flex-shrink:0; }

@media(min-width:701px) and (max-width:1100px) {
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) { padding-inline:5%; column-gap:3%; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy>p { font-size:13.5px; line-height:1.6; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-ctas { gap:12px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-ctas .button { padding-inline:16px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-spotlight strong { font-size:13px; }
}
@media(min-width:701px) and (max-height:720px) {
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) h1 { font-size:clamp(32px,3.35vw,44px); margin:8px 0 10px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy>p { font-size:13px; line-height:1.6; margin-bottom:10px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-ctas { margin-bottom:10px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .eyebrow { font-size:9px; }
}
@media(min-width:701px) and (max-height:620px) {
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) { --banner-target:clamp(340px,calc(100vh - 150px),420px); }
  @supports(height:100svh) {
    .hero-v4.hero-universe:is(.hero-v11,.hero-v12) { --banner-target:clamp(340px,calc(100svh - 150px),420px); }
  }
}
@media(max-width:700px) {
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) {
    display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto;
    min-height:0; height:auto; max-height:none; padding:18px 5% 14px; row-gap:12px;
  }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy { column-gap:14px; align-self:start; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .eyebrow { font-size:9px; line-height:1.75; letter-spacing:.85px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) h1 {
    max-width:60%; min-height:172px; margin:12px 0 10px;
    font-size:clamp(30px,7.7vw,36px); line-height:1.08; letter-spacing:-1.35px;
  }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) h1 em { line-height:1.1; letter-spacing:-1px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy>p {
    max-width:none; font-size:13px; line-height:1.6; margin:0 0 12px;
  }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-ctas { gap:13px; margin:0 0 12px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-ctas .button { padding:11px 17px; font-size:11px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-secondary { font-size:11px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-proof span { font-size:8px; padding:6px 9px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-spotlight strong { font-size:12px; line-height:1.45; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-spotlight small { font-size:10px; line-height:1.5; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-stage {
    position:absolute; width:44%; height:190px; min-height:180px; max-width:none;
    right:0; top:34px; margin:0;
  }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-art-credit { max-width:100%; font-size:9px; line-height:1.4; bottom:0; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .scene-word { font-size:42px; letter-spacing:-2px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .scene-spark { font-size:27px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .spark-two { font-size:20px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-bottom { justify-content:center; }
}
@media(max-width:700px) and (max-height:740px) {
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) { padding-top:12px; padding-bottom:12px; row-gap:10px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) h1 { min-height:156px; font-size:30px; margin-top:10px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-stage { height:180px; top:24px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-copy>p { font-size:12.5px; line-height:1.55; margin-bottom:8px; }
  .hero-v4.hero-universe:is(.hero-v11,.hero-v12) .hero-ctas { margin-bottom:8px; }
}