:root{color-scheme:dark;--ink:#080f1b;--navy:#101f33;--paper:#f3f8fb;--cyan:#43d4ff;--muted:#b8c8d8;font-family:"Noto Sans JP","Yu Gothic",Meiryo,sans-serif;background:#080f1b;color:#f5faff}*{box-sizing:border-box}body{margin:0}main{max-width:1200px;margin:auto;overflow:hidden}img{max-width:100%;display:block}a{color:inherit}p{font-size:clamp(.95rem,1.6vw,1.08rem);line-height:1.85;margin:0 0 1em}p:last-child{margin-bottom:0}.hero{min-height:660px;position:relative;isolation:isolate;padding:54px 7% 28px;background:linear-gradient(135deg,#08101d 22%,#122746 80%);display:grid;grid-template-columns:1.2fr .8fr;align-items:end;gap:16px 0}.hero-photo{position:absolute;inset:0 0 22% 31%;z-index:-2;clip-path:polygon(26% 0,100% 0,100% 80%,0 100%);overflow:hidden}.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 42%}.hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#08101d 0%,transparent 56%),linear-gradient(0deg,#101f33,transparent 48%)}.hero:after,.section:before{content:"";position:absolute;pointer-events:none;height:45px;width:36%;transform:skewY(-12deg);background:linear-gradient(180deg,var(--cyan) 0 4px,transparent 4px 13px,#2485e3 13px 17px,transparent 17px 25px,#38d5ff80 25px 28px,transparent 28px)}.hero:after{top:40px;right:-3%;z-index:-1}.hero-copy{align-self:center;padding-top:22px}.brand{color:var(--cyan);font:italic 900 clamp(1.35rem,3vw,2.1rem)/1 Arial,sans-serif;letter-spacing:.09em;margin-bottom:20px}.hero h1{font-weight:950;font-size:clamp(2.15rem,6vw,5rem);line-height:1.1;letter-spacing:-.06em;margin:0;text-shadow:0 3px 18px #08101daa}.model{font:900 clamp(.82rem,2.2vw,1.3rem)/1.2 Arial,sans-serif;letter-spacing:.14em;color:var(--cyan);margin-top:22px}.hero-product{justify-self:end;align-self:end;width:min(82%,300px);filter:drop-shadow(0 14px 21px #0009);margin:68px 0 0}.hero-info{grid-column:1/-1;border-top:2px solid var(--cyan);padding-top:18px}.hero-info p{margin-top:10px;color:var(--muted);font-size:.92rem}.stats{display:grid;grid-template-columns:repeat(3,1fr);max-width:660px}.stats div{font-size:clamp(.66rem,1.5vw,.9rem);border-left:1px solid #73c6ff55;padding:0 12px;color:#e0eef9}.stats b{display:block;font:italic 900 clamp(2rem,5vw,3.7rem)/1 Arial,sans-serif;color:var(--cyan)}.stats small{font-size:.44em;padding-left:.13em}.action{padding:20px 7% 24px;background:#101f33}.cta{display:flex;align-items:center;justify-content:space-between;gap:.8em;background:var(--cyan);color:#071322;max-width:560px;margin:auto;padding:.9em 1.2em;font-weight:900;font-size:clamp(.95rem,2.5vw,1.2rem);text-decoration:none;border-right:9px solid #1877db;box-shadow:0 8px 24px #0003}.cta span{font:900 1.45em/1 Arial,sans-serif}.cta:hover{background:#8ae7ff}.cta:focus-visible,summary:focus-visible{outline:3px solid #ffbc46;outline-offset:4px}.section{position:relative;isolation:isolate;padding:clamp(36px,6vw,76px) 7%;background:#0c1726;border-top:1px solid #284767}.section:nth-of-type(even){background:#101f33}.section:before{z-index:-1;right:-3%;top:24px;width:24%;opacity:.38}.section h2{margin:0 0 22px;font-size:clamp(1.45rem,3.7vw,2.75rem);line-height:1.25;letter-spacing:-.045em;border-left:5px solid var(--cyan);padding-left:.45em}.section p{max-width:780px}.split{display:grid;grid-template-columns:1.3fr .7fr;align-items:center;gap:25px}.athlete{width:100%;clip-path:polygon(14% 0,100% 0,100% 90%,0 100%)}.light{background:#f3f8fb!important;color:#101e30}.products{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.products article{background:#fff;border-top:4px solid #178ad5;padding:12px;box-shadow:0 4px 14px #11294116}.products img{width:100%;height:180px;object-fit:contain}.products h3{font-size:1rem;margin:12px 0 5px}.products p{font-size:.85rem;line-height:1.6}.reasons{list-style:none;counter-reset:reason;margin:0;padding:0}.reasons li{counter-increment:reason;display:grid;grid-template-columns:auto 1fr;gap:12px;border-top:1px solid #3c5976;padding:14px 0;line-height:1.75}.reasons li:before{content:"0" counter(reason);color:var(--cyan);font:italic 900 1.35rem Arial,sans-serif}.voices{display:grid;grid-template-columns:1fr 2fr;gap:14px;margin-bottom:15px}.voices div{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:14px;background:#13263e;border-top:3px solid #299ce1}.voices img{width:60px;aspect-ratio:1;object-fit:cover}.voices blockquote{flex-basis:100%;margin:0;font-size:.93rem;line-height:1.65}details{border-top:1px solid #b2c5d5;padding:12px 0}summary{cursor:pointer;font-weight:800}details p{margin:8px 0 0 17px}.closing img{width:min(100%,180px);justify-self:center}.last{padding-bottom:58px}.sticky{position:fixed;z-index:2;bottom:0;left:0;right:0;padding:8px 12px max(8px,env(safe-area-inset-bottom));background:#08101de8;transition:opacity .18s}.sticky.hidden{visibility:hidden;opacity:0;pointer-events:none}.sticky .cta{max-width:430px;padding:.58em 1em}noscript+div{display:none}@media(max-width:650px){.hero{padding:30px 5% 22px;min-height:0;grid-template-columns:1.35fr .65fr;gap:15px 0}.hero-photo{inset:0 0 30% 12%;clip-path:polygon(20% 0,100% 0,100% 84%,0 100%)}.hero-photo:after{background:linear-gradient(90deg,#08101ded,transparent 80%),linear-gradient(0deg,#101f33,transparent 46%)}.hero-copy{padding-top:27px}.hero-product{width:100%;margin-top:80px}.hero h1{font-size:clamp(1.65rem,6.7vw,2.75rem)}.hero-info p{font-size:.82rem}.brand{margin-bottom:15px}.model{margin-top:15px}.products{grid-template-columns:1fr 1fr}.products img{height:135px}.split{grid-template-columns:1fr}.split img{max-height:260px;object-fit:cover}.closing .split{grid-template-columns:1fr .45fr}.closing img{object-fit:contain}.voices{grid-template-columns:1fr 1.5fr}.section:before{width:30%}}@media(prefers-reduced-motion:reduce){.sticky{transition:none}}
.voices img{border-radius:50%}
.hero-product{background:#f4f4f4;box-shadow:0 0 0 1px #8edfff70;filter:none}.hero-product img{width:100%;height:auto}.closing img{border:1px solid #7bd7ff55}.survey{background:#102643;border-block:1px solid #3a85a8;padding:20px 7%;display:grid;grid-template-columns:auto 1fr;gap:clamp(14px,4vw,42px);align-items:center}.survey-number{color:var(--cyan);white-space:nowrap;font:italic 900 clamp(2.5rem,8vw,5rem)/1 Arial,sans-serif}.survey-number span{font-size:.45em}.survey h2{font-size:clamp(1.08rem,2.6vw,1.65rem);line-height:1.35;margin:0 0 6px}.survey p,.survey a,.caption{font-size:.86rem;color:#d1e4f4}.survey p{margin-bottom:5px}.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.products article{padding:0;display:flex;flex-direction:column}.products img{height:auto;aspect-ratio:1;max-height:290px;background:#f4f4f4}.product-copy{padding:14px 18px 18px}.products h3{font-size:clamp(1.06rem,2vw,1.3rem);margin:0 0 12px}.products p{font-size:.94rem}.product-copy a{font-size:.91rem;font-weight:800;color:#07538a}.audience{padding:8px 10px;background:#e6f3fc;border-left:3px solid #178ad5}.voices{grid-template-columns:repeat(2,minmax(0,1fr))}.voices div{align-content:start}.voices blockquote{padding-top:5px}.caption{margin-bottom:12px}.hero-photo img{object-position:62% 48%}@media(max-width:570px){.products,.voices{grid-template-columns:1fr}.survey{gap:12px;padding-inline:5%}.survey p,.survey a{font-size:.77rem}.products img{max-height:240px}.hero-product{margin-top:86px}}
.worries{list-style:none;margin:0 0 1.25rem;padding:0;display:grid;gap:8px}
.worries li{background:#122b45;border-left:4px solid var(--cyan);padding:.66em .85em;font-weight:800;line-height:1.5;overflow-wrap:anywhere}
.zone{margin:0 -8.2% clamp(34px,6vw,64px);position:relative;isolation:isolate;overflow:hidden;padding:clamp(34px,7vw,76px) 8.2%;background:#112743}
.zone::before,.zone::after{content:"";position:absolute;left:-10%;right:-10%;height:36px;transform:skewY(-9deg);z-index:-1;background:linear-gradient(to bottom,#24a7e9 0 6px,transparent 6px 12px,#42d4ff 12px 15px,transparent 15px 24px,#247be0 24px 28px,transparent 28px)}
.zone::before{top:10%;opacity:.45}.zone::after{bottom:8%;opacity:.64}
.zone-brand{font-weight:900;color:var(--cyan);letter-spacing:.08em}
.zone-message{font-size:clamp(1.42rem,4.8vw,3.6rem);line-height:1.27;font-weight:950;text-shadow:0 2px 12px #0b192b;overflow-wrap:anywhere}
.original-panel img{display:block;width:100%;height:auto;max-width:768px;margin:auto}
.original-lineup{background:#fafafa;color:#142236}
.original-worries{background:#050505}
.lineup-image{display:block;max-width:768px;margin:auto}
.lineup-text{max-width:768px;margin:auto;padding:16px clamp(16px,5vw,40px) 24px}
.lineup-text h3{margin:18px 0 5px}
.lineup-text p{margin:0 0 10px}
.hero-photo img{object-fit:contain;object-position:right center}
.hero-photo{clip-path:none}
.hero-photo:after{background:linear-gradient(90deg,#08101d 0%,transparent 44%),linear-gradient(0deg,#101f33,transparent 31%)}
.original-qa{background:#ead9b8;color:#152137}
.original-qa .lineup-text>details{margin-top:.75rem;border-color:#927a58}
.section.closing{background:linear-gradient(155deg,#2e9cfb 0%,#2e9cfb 16%,#38bfe3 16%,#38bfe3 25%,#193e84 25%,#112c5e 100%);padding-top:clamp(72px,10vw,122px)}
.closing:before{top:24%;width:52%;height:36px;opacity:.8}
.closing h2{max-width:34ch;text-shadow:0 1px 8px #112c5e}
.closing-copy{max-width:750px}
.action{padding-block:clamp(22px,5vw,42px);background:linear-gradient(150deg,#2e9cfb 0 19%,#38bfe3 19% 23%,#10264a 23% 100%)}
.action.last{padding-bottom:70px}
.cta{max-width:680px;min-height:64px;padding:.8em 1.15em;background:#1d418f;color:#fff;border:2px solid #fff;border-radius:999px;box-shadow:0 6px 0 #091f4d,0 0 0 3px #39cce988;font-size:clamp(1.05rem,3vw,1.48rem)}
.cta span{color:#42d4ff}
.cta:hover{background:#265ab9}
.sticky{padding:9px 14px max(10px,env(safe-area-inset-bottom))}
.sticky .cta{max-width:460px;min-height:46px;font-size:clamp(.93rem,3.6vw,1.08rem)}
.hero .brand{color:#f2d286;font-size:clamp(2.15rem,6.7vw,5.6rem);letter-spacing:.015em;text-shadow:0 2px 16px #080f1b,0 2px 0 #805b28}
.hero .model{display:grid;gap:.18em;width:fit-content;max-width:100%;border-left:4px solid #e4bd68;padding:.1em 0 .1em .55em;font-size:clamp(1.25rem,3.9vw,3.4rem);font-weight:900;letter-spacing:.015em;text-shadow:0 2px 10px #080f1b}
.hero .model span{color:#e0e7ef}
.hero .model strong{color:#f2d286}
.hero .hero-product{border:2px solid #d8b05f;box-shadow:0 0 0 1px #593f1c,0 12px 28px #0008}
@media(max-width:650px){.hero .brand{font-size:clamp(1.85rem,8vw,3.25rem)}.hero .model{font-size:clamp(1rem,4.35vw,1.7rem)}}
.hero{grid-template-columns:minmax(0,1fr);min-height:650px;align-content:end}
.hero-copy{position:relative;max-width:58%;padding-bottom:30px}
.hero-photo{inset:0 0 17% 25%}
.hero-photo img{object-fit:cover;object-position:56% 30%}
.hero-photo:after{background:linear-gradient(90deg,#08101d 0%,#08101d75 26%,transparent 55%),linear-gradient(0deg,#101f33,transparent 34%)}
.hero-info{position:relative}
.stats{grid-template-columns:repeat(3,minmax(0,1fr));max-width:680px}
.stats div{min-width:0;padding-inline:clamp(5px,1.6vw,16px);white-space:nowrap}
.stats b{white-space:nowrap;font-size:clamp(1.65rem,5vw,3.7rem);line-height:1}
.stats .approx{font:900 .32em/1 "Yu Gothic",Meiryo,sans-serif;vertical-align:baseline;margin-right:.12em}
@media(max-width:650px){
.hero{min-height:490px}
.hero-copy{max-width:78%;padding-bottom:14px}
.hero-photo{inset:0 0 18% 16%}
.hero-photo img{object-position:51% 0}
.hero-photo:after{background:linear-gradient(90deg,#08101deb,transparent 67%),linear-gradient(0deg,#101f33,transparent 37%)}
}
.zone{background:#124b82;padding-block:clamp(72px,10vw,120px)}
.zone::before,.zone::after{left:auto;right:-24px;width:clamp(125px,29%,320px);height:20px;transform:skewY(-9deg);opacity:1;background:linear-gradient(to bottom,#2e9cfb 0 5px,transparent 5px 9px,#61e5ff 9px 12px,transparent 12px 16px,#38bfe3 16px 19px,transparent 19px)}
.zone::before{top:32px;bottom:auto}
.zone::after{left:-24px;right:auto;top:auto;bottom:32px}
.zone-brand{color:#8defff}
.zone::before{
  inset:50% -32px auto;
  width:auto;
  height:24px;
  transform:translateY(-50%) skewY(-9deg);
  background:linear-gradient(to bottom,#2e9cfb 0 5px,transparent 5px 10px,#61e5ff 10px 13px,transparent 13px 19px,#38bfe3 19px 23px,transparent 23px);
  opacity:.62;
}
.zone::after{content:none}
.zone-message,.zone-brand{position:relative;text-shadow:0 1px 6px #102c4e,0 0 12px #102c4e}
.original-worries::before,.original-worries::after,.section:has(>.zone)::before{content:none}
.zone::before{
  height:57px;
  opacity:.83;
  background:linear-gradient(to bottom,#2e9cfb 0 5px,transparent 5px 10px,#fff 10px 13px,transparent 13px 19px,#38bfe3 19px 25px,transparent 25px 31px,#61e5ff 31px 34px,transparent 34px 40px,#fff 40px 42px,transparent 42px 49px,#2e9cfb 49px 55px,transparent 55px);
}
.zone-message,.zone-brand{text-shadow:0 1px 4px #102c4e,0 0 5px #102c4e,0 0 14px #102c4e}
.action{background:linear-gradient(150deg,#2e9cfb 0 12%,#38bfe3 12% 15%,transparent 15% 85%,#38bfe3 85% 88%,#2e9cfb 88% 100%),#10264a}
.cta{white-space:nowrap;gap:.45em}
.cta .cta-label{color:inherit;font:inherit;white-space:nowrap}
@media(max-width:390px){.cta,.sticky .cta{font-size:clamp(.76rem,4.25vw,1rem);padding-inline:.85em}}
.zone{padding-inline:clamp(16px,7%,84px);text-align:center}
.zone .zone-brand,.zone .zone-message{margin-inline:auto;overflow-wrap:normal;line-break:strict}
.zone .zone-message{font-size:clamp(1.2rem,4.25vw,3.3rem)}
.zone::before{
  height:34px;
  opacity:.58;
  background:linear-gradient(to bottom,#2e9cfb 0 2px,transparent 2px 6px,#fff 6px 7px,transparent 7px 12px,#38bfe3 12px 14px,transparent 14px 19px,#61e5ff 19px 20px,transparent 20px 25px,#fff 25px 26px,transparent 26px 31px,#2e9cfb 31px 33px,transparent 33px);
}
.hero-photo{inset:0 0 14% 0}
.hero-photo img{object-position:center;object-fit:contain;object-position:right center}
.hero-photo:after{background:linear-gradient(90deg,#08101d 0%,#08101de8 21%,#08101d26 65%,transparent),linear-gradient(0deg,#101f33,transparent 36%)}
.cta{display:grid;grid-template-columns:1.25em minmax(0,1fr) 1.25em;align-items:center;gap:.4em;text-align:center}
.cta-label{grid-column:2}
.cta [aria-hidden]{grid-column:3;justify-self:center}
@media(max-width:650px){
  .hero-photo img{object-position:center 14%}
  .hero-photo:after{background:linear-gradient(90deg,#08101dbe,transparent 88%),linear-gradient(0deg,#101f33 16%,transparent 69%)}
}
.readable-lineup{position:relative;padding:clamp(38px,7vw,84px) clamp(18px,7vw,84px);background:linear-gradient(155deg,#2e9cfb 0 2%,#37c8eb 2% 2.5%,transparent 2.5%),#fafafa;color:#142236}
.readable-lineup h2{font-size:clamp(1.85rem,5vw,3.2rem);text-align:center;margin:0 0 1em;text-decoration:underline;text-decoration-color:#2e9cfb;text-underline-offset:.22em}
.readable-lineup article{display:grid;grid-template-columns:minmax(0,235px) minmax(0,1fr);align-items:start;gap:clamp(18px,4vw,45px);padding:clamp(24px,5vw,54px) 0;border-top:2px solid #b7e8fb}
.readable-lineup .pack{width:100%;max-width:235px;height:auto;justify-self:center}
.readable-lineup h3{margin:0 0 .65em;font-size:clamp(1.25rem,3.2vw,2rem);line-height:1.35;overflow-wrap:anywhere}
.readable-lineup p{font-size:clamp(1.07rem,2vw,1.25rem);line-height:1.85;margin:0 0 .6em}
.flavor-photos{display:flex;flex-wrap:wrap;gap:12px;align-items:start;margin-top:18px}
.flavor-photos img{height:auto;max-width:100%}
@media(max-width:650px){.readable-lineup article{grid-template-columns:1fr}.readable-lineup .pack{max-width:175px}}
.brand-original{background:#162137;color:#fff}
.brand-original h2{margin:0;padding:clamp(26px,5vw,62px) 4% 0}
.brand-original h2 img{width:min(100%,760px);height:auto;margin:auto}
.brand-art{display:block;max-width:960px;margin:auto;overflow:hidden}
.brand-art img{width:100%;height:auto;margin-top:-19.5%}
.brand-cert{background:#203f68;padding:clamp(16px,4vw,40px) max(5%,calc((100% - 840px)/2));}
.brand-cert h3{margin:0 0 .5em;font-size:clamp(1.2rem,3vw,1.65rem)}
.brand-cert p{font-size:clamp(1rem,2vw,1.2rem)}
.readable-lineup article{grid-template-columns:minmax(0,320px) minmax(0,1fr);align-items:start}
.pack-stage{margin:0;min-width:0;display:grid;place-items:center;background:#edf6fc;border-bottom:3px solid #2e9cfb;padding:12px}
.readable-lineup .pack-stage .pack{width:100%;max-width:300px;height:clamp(230px,30vw,320px);object-fit:contain;filter:drop-shadow(0 8px 9px #193b5726)}
.readable-lineup .pack-type{display:inline-block;margin:0 0 9px;padding:.25em .55em;background:#193e84;color:white;font-size:clamp(.88rem,2vw,1.05rem);font-weight:800}
.readable-lineup .pack-feature{color:#135d91;font-weight:800}
@media(max-width:650px){
 .readable-lineup article{grid-template-columns:minmax(0,1fr)}
 .pack-stage{grid-row:2}
 .readable-lineup .pack-stage .pack{height:clamp(240px,68vw,300px)}
}
.brand-art,.original-qa img{width:100%;max-width:none;margin-inline:0}
.brand-art img{display:block;width:100%}
.original-qa img{height:auto}
.hero::after{content:none}
.hero-photo{display:flex;justify-content:flex-end;align-items:center}
.hero-photo img{width:min(100%,764px);height:auto;object-fit:contain;object-position:center}
.hero-photo::after{background:linear-gradient(90deg,#08101d 0%,#08101d80 29%,transparent 65%),linear-gradient(0deg,#101f33,transparent 23%)}
@media(max-width:650px){.hero-photo{align-items:flex-start}.hero-photo::after{background:linear-gradient(90deg,#08101db3,transparent 85%),linear-gradient(0deg,#101f33 20%,transparent 77%)}}
.hero{background:#fdfdfd;color:#152135;min-height:0;padding-top:0;gap:0}
.hero-photo{position:relative;inset:auto;justify-content:center;margin:0 -8.15%;background:#fdfdfd}
.hero-photo img{width:min(100%,764px);height:auto}
.hero-photo::after{content:none}
.hero-copy{max-width:none;width:100%;padding:clamp(22px,5vw,48px) 0;position:relative}
.hero-copy::before,.hero-info::after{
  content:"";position:absolute;width:clamp(74px,23vw,240px);height:13px;
  transform:rotate(-13deg);pointer-events:none;
  background:linear-gradient(#2e9cfb 0 3px,transparent 3px 7px,#38bfe3 7px 10px,transparent 10px);
}
.hero-copy::before{top:17px;right:-5%}
.hero-info::after{bottom:4px;right:-5%}
.hero h1{color:#152135;text-shadow:none}
.hero .brand,.hero .model strong{color:#805714;text-shadow:none}
.hero .model,.hero .model span{color:#1c3558;text-shadow:none}
.hero-info{border-color:#2e9cfb;padding-bottom:20px}
.hero-info p,.hero .stats div{color:#243750}
.hero .stats b{color:#164f90}
@media(max-width:650px){.hero-copy{padding-top:30px}.hero-photo{margin-inline:-5.55%}}
.hero-photo{
  isolation:isolate;
  overflow:hidden;
  background:#101f33;
}
.hero-photo::before{
  content:"";
  position:absolute;
  inset:-24px;
  background:linear-gradient(#101f33a6,#101f33a6),url("assets/training-native.png") center/cover;
  filter:blur(22px);
  z-index:-1;
}
.hero-photo img{mask-image:linear-gradient(90deg,transparent 0%,#000 13%,#000 87%,transparent 100%)}
@media(max-width:650px){
  .hero-photo img{mask-image:linear-gradient(90deg,transparent 0%,#000 6%,#000 94%,transparent 100%)}
}
.nutrients{display:grid;grid-template-columns:2fr 1fr;gap:18px;padding:12px 0 22px}
.nutrients>div{min-width:0;border-top:2px solid #38bfe3;padding-top:12px}
.nutrients h2{font-size:clamp(1.04rem,2.3vw,1.5rem);margin:0 0 8px}
.nutrients ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.nutrients li{background:#e8f5fc;color:#183f74;padding:.3em .55em;font-size:.88rem}
.survey{grid-template-columns:minmax(0,373px) minmax(0,1fr)}
.survey-badge{width:100%;height:auto}
@media(max-width:650px){.nutrients,.survey{grid-template-columns:1fr}}
.hero{background:linear-gradient(135deg,#08101d 22%,#122746 80%);color:#f5faff}
.hero h1{color:#f5faff;text-shadow:0 3px 18px #08101daa}
.hero .brand,.hero .model strong{color:#f2d286}
.hero .model,.hero .model span{color:#e0e7ef}
.hero-info p,.hero .stats div{color:#d1e4f4}
.hero .stats b{color:#43d4ff}
.nutrients li{background:#183858;color:#eef8ff}
.hero{display:grid;grid-template-columns:minmax(0,.83fr) minmax(0,1.17fr);grid-template-areas:"copy photo" "info info" "nutrients nutrients";align-items:center;gap:24px 28px;padding:clamp(24px,5vw,64px) 6% 22px;background:linear-gradient(125deg,#08101d,#122746)}
.hero-copy{grid-area:copy;margin:0;padding:0;width:auto;max-width:none}
.hero-copy::before,.hero-info::after,.hero-photo::before,.hero-photo::after{content:none}
.hero .brand{font-size:clamp(2rem,5vw,4rem);margin:0 0 16px}
.hero h1{font-size:clamp(1.6rem,3.65vw,3.4rem);line-height:1.15;letter-spacing:-.035em}
.hero .model{font-size:clamp(1rem,2.15vw,1.85rem);margin:18px 0 0}
.hero-photo{grid-area:photo;inset:auto;position:relative;margin:0;background:#101e34;display:block;isolation:auto;clip-path:none}
.hero-photo img{display:block;width:100%;height:auto;max-width:764px;margin:auto;mask-image:none}
.hero-info{grid-area:info;align-self:start;padding-bottom:0}
.stats div{text-align:center}
.nutrients{grid-area:nutrients;padding:0}
@media(max-width:650px){
  .hero{grid-template-columns:minmax(0,1fr);grid-template-areas:"photo" "copy" "info" "nutrients";padding:0 5% 24px;gap:20px}
  .hero-photo{margin-inline:-5.56%}
  .hero-copy{padding-top:3px}
  .hero h1{font-size:clamp(1.6rem,7vw,2.6rem)}
  .hero .brand{margin-bottom:10px}
}
.hero{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-areas:"photo photo" "copy diagram" "info info";padding-top:0;gap:clamp(14px,3vw,30px)}
.hero-photo{margin-inline:-6.82%;background:#101e34}
.hero-photo img{width:100%;max-width:none;object-fit:contain}
.nutrient-figures{grid-area:diagram;margin:0;background:#fff;display:flex;align-items:center;justify-content:center;gap:clamp(5px,1.5vw,18px);padding:clamp(6px,1.5vw,16px)}
.nutrient-figures img:first-child{width:55%;height:auto}
.nutrient-figures img:last-child{width:42%;height:auto}
@media(max-width:650px){.hero-photo{margin-inline:-5.56%}.hero h1{font-size:clamp(1rem,4.05vw,1.55rem)}.hero .brand{font-size:clamp(1.1rem,5.6vw,2rem)}.hero .model{font-size:clamp(.65rem,2.6vw,1rem);margin-top:10px}.nutrient-figures{flex-direction:column}.nutrient-figures img:first-child{width:min(100%,165px)}.nutrient-figures img:last-child{width:min(85%,140px)}}
.section.closing{background:#193e84;padding-top:clamp(52px,8vw,96px)}
.section.closing::before,.section.closing::after{content:"";position:absolute;width:clamp(85px,23%,240px);height:10px;transform:skewY(-12deg);pointer-events:none;background:linear-gradient(to bottom,#2e9cfb 0 2px,transparent 2px 5px,#38bfe3 5px 7px,transparent 7px)}
.section.closing::before{top:20px;right:0;opacity:1}
.section.closing::after{bottom:16px;left:0}
.hero{grid-template-areas:"photo photo" "info diagram";grid-template-rows:auto auto;isolation:isolate}
.hero-photo,.hero-copy{grid-area:photo}
.hero-photo{margin-inline:-6.82%;z-index:-1;min-height:clamp(225px,46vw,490px)}
.hero-photo img{height:100%;width:100%;object-fit:cover;position:absolute;inset:0}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#08101de8, #08101d73 43%,transparent 74%)}
.hero-copy{width:auto;max-width:64%;justify-self:start;padding:20px 0}
.hero .model{font-size:clamp(.72rem,2.15vw,1.65rem)}
.nutrient-figures{background:none;padding:0}
.nutrient-figures img{filter:drop-shadow(0 0 1px #eaf8ff) drop-shadow(0 0 2px #eaf8ff)}
.survey{background:#fff;color:#172d47;border-color:#dae5ee}
.survey p,.survey a{color:#244d72}
.brand-intro{display:block;width:100%;height:auto}
.pride{padding:clamp(24px,5vw,58px) 7%;background:linear-gradient(155deg,#35c4e5,#2798ef);color:#101e36}
.pride h3{margin:0 0 18px;font-size:clamp(1.35rem,4vw,2.4rem);color:#122347}
.pride ol{display:grid;gap:10px;list-style:none;margin:0;padding:0}
.pride li{display:grid;grid-template-columns:8em minmax(0,1fr);align-items:center;gap:12px;background:#fff;padding:14px clamp(12px,3vw,26px)}
.pride li span{font-size:.78rem;color:#175f9a;font-weight:800}
.brand-cert{position:relative;isolation:isolate;overflow:hidden}
.choice-mark{position:absolute;z-index:-1;right:5%;top:50%;width:clamp(88px,18vw,190px);height:auto;opacity:.23;transform:translateY(-50%);mix-blend-mode:screen}
.readable-lineup h2,.no-break{white-space:nowrap}
.readable-lineup h2{font-size:clamp(1.4rem,5vw,3.2rem)}
.readable-lineup h3{overflow-wrap:normal}
.pack-stage{background:none;border:0;padding:0}
.readable-lineup .pack-stage .pack{filter:none}
@media(max-width:650px){
 .hero{grid-template-columns:minmax(0,1fr);grid-template-areas:"photo" "diagram" "info";gap:16px}
 .hero-photo{margin-inline:-5.56%}
 .hero-copy{max-width:75%}
 .nutrient-figures{flex-direction:row;gap:12px}
 .pride li{grid-template-columns:1fr;gap:3px}
}
.hero .brand{font-size:clamp(2rem,8vw,6rem);line-height:1}
.hero-nutrition-copy{font-size:clamp(1.1rem,2.7vw,1.8rem);line-height:1.6;font-weight:850;color:#75dbff;margin-bottom:10px}
.nutrient-ring{position:relative;isolation:isolate;flex:1 1 0;max-width:255px;aspect-ratio:1;color:white;text-align:center}
.nutrient-ring strong{position:absolute;inset:0;display:grid;place-content:center;font-size:clamp(.85rem,2vw,1.25rem);line-height:1.2}
.nutrient-ring ul{list-style:none;margin:0;padding:0}
.nutrient-ring li{position:absolute;left:var(--x);top:var(--y);translate:-50% -50%;width:23%;aspect-ratio:1;border-radius:50%;background:#125785;border:1px solid #66caff;display:grid;place-content:center;font-size:clamp(.44rem,1vw,.75rem);line-height:1.12}
.nutrient-ring.min{max-width:190px}
.nutrient-ring.min li{width:28%;background:#2079a6}
.brand-original h2{padding:clamp(18px,3.7vw,44px) 4% 0}
.brand-intro-copy{position:relative;isolation:isolate;overflow:hidden;padding:clamp(18px,3.4vw,40px) 8%;color:#fff;text-align:center}
.brand-intro-copy::before,.brand-intro-copy::after{content:"";position:absolute;z-index:-1;width:30%;height:8px;background:linear-gradient(#32b7e6 0 2px,transparent 2px 5px,#2e9cfb 5px 7px,transparent 7px);transform:skewY(-10deg)}
.brand-intro-copy::before{left:0;bottom:18%}.brand-intro-copy::after{right:0;top:22%}
.brand-intro-copy p{max-width:48rem;margin-inline:auto;font-size:clamp(1.02rem,2.3vw,1.4rem);line-height:1.65}
.brand-intro-copy .brand-lead{margin:clamp(12px,2vw,24px) auto 0;font-size:clamp(1.16rem,3.6vw,2.45rem);line-height:1.38}
.brand-lead strong{color:#ffe0a0}
@media(max-width:650px){.hero .brand{font-size:clamp(1.8rem,9vw,3.4rem)}.nutrient-ring{max-width:200px}.nutrient-ring.min{max-width:155px}}
.nutrition-primary,.nutrition-secondary{display:flex;align-items:baseline;gap:.38em;white-space:nowrap}
.nutrition-primary span{font-size:.76em}
.nutrition-primary strong{font-size:1.65em;line-height:1.12}
.nutrition-secondary{gap:.9em}
.nutrition-secondary span{white-space:nowrap}
.feature-original{width:124px;height:auto}
.pack-stage figcaption{text-align:center;margin-top:10px}
@media(max-width:650px){.pack-stage{grid-row:auto}}
.closing-group{background:#122746}
.closing-group .closing,.closing-group .last{background:transparent}
.closing-group .closing{padding-top:clamp(30px,5vw,64px);padding-bottom:12px}
.closing-group .closing::before,.closing-group .closing::after{content:none}
.closing-group .last{padding-top:18px}
.survey-banner{display:grid;grid-template-columns:clamp(52px,9vw,84px) minmax(0,1fr);align-items:center;gap:8px;background:#bc151b;padding:7px 9px}
.survey-banner img{width:100%;height:auto;border-radius:50%;background:white}
.survey-banner p{display:flex;align-items:baseline;gap:.15em;margin:0;color:white;font-size:clamp(.81rem,2.1vw,1.2rem);font-weight:850;white-space:nowrap}
.survey-banner strong{color:#ffe639;font:900 clamp(1.4rem,4.5vw,2.45rem)/1 Arial,sans-serif}
.hero{grid-template-areas:"photo photo" "info info"}
@media(max-width:650px){.hero{grid-template-areas:"photo" "info"}}
.feature-original{width:86px}
.choice-heading{display:flex;align-items:center;gap:clamp(12px,3vw,24px);margin-bottom:14px}
.choice-heading .choice-mark{position:static;width:clamp(70px,13vw,110px);height:auto;opacity:1;transform:none;mix-blend-mode:normal;border-radius:6px;flex:none}
.choice-heading h3{margin:0}

.readable-lineup article{grid-template-columns:minmax(0,1fr);gap:clamp(12px,2vw,22px)}
.readable-lineup article h3{text-align:center;margin:0}
.readable-lineup .pack-stage{grid-row:auto}
.readable-lineup .pack-stage .pack{max-width:360px;height:clamp(250px,43vw,360px)}
.readable-lineup .flavor-photos{justify-content:center;margin:0}
.readable-lineup .flavor-photos img{max-width:min(100%,420px)}
.readable-lineup .lineup-description{width:min(100%,700px);margin-inline:auto}
.survey-badge{justify-self:center;max-width:373px}
.brand-intro-copy::before,.brand-intro-copy::after{
  left:0;right:0;width:100%;height:23px;
  transform:skewY(-5deg);
  background:linear-gradient(to bottom,#32b7e6 0 2px,transparent 2px 7px,#2e9cfb 7px 8px,transparent 8px 14px,#32b7e6 14px 16px,transparent 16px 21px,#2e9cfb 21px 23px);
}
.brand-intro-copy::before{top:auto;bottom:10%;opacity:.48}
.brand-intro-copy::after{top:16%;bottom:auto;opacity:.48}

.readable-lineup .perfect-flavors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(6px,2vw,14px);width:min(100%,315px);margin-inline:auto}
.readable-lineup .perfect-flavors img{width:100%;max-width:none;aspect-ratio:1;object-fit:contain}
.readable-lineup .lineup-description .pack-type{margin-bottom:12px}
.brand-original{position:relative;isolation:isolate;overflow:hidden}
.brand-original h2{position:relative;isolation:isolate}
.brand-intro-copy::after{content:none}
.brand-original h2::before{
  content:"";position:absolute;z-index:-1;left:0;right:0;bottom:-8px;height:23px;
  transform:skewY(-5deg);opacity:.48;pointer-events:none;
  background:linear-gradient(to bottom,#32b7e6 0 2px,transparent 2px 7px,#2e9cfb 7px 8px,transparent 8px 14px,#32b7e6 14px 16px,transparent 16px 21px,#2e9cfb 21px 23px);
}

:root{
  --winzone-stripes:linear-gradient(to bottom,#32b7e6 0 2px,transparent 2px 7px,#2e9cfb 7px 8px,transparent 8px 14px,#32b7e6 14px 16px,transparent 16px 21px,#2e9cfb 21px 23px);
}
.brand-original h2::before,.brand-intro-copy::before,.section::before{
  height:23px;
  background:var(--winzone-stripes);
  transform:skewY(-5deg);
}
.readable-lineup{background:#fafafa}
.action:not(.last){background:#122746}
.original-qa{padding-block:clamp(18px,3vw,36px)}

.action .cta{font-size:clamp(1.2rem,3.4vw,1.7rem)}
.sticky .cta{font-size:clamp(1rem,4vw,1.2rem)}
@media(max-width:390px){
  .action .cta,.sticky .cta{font-size:clamp(.86rem,4.8vw,1.15rem)}
}

.original-qa{padding-block:0}
.original-qa::before,.original-qa::after{
  content:"";
  display:block;
  height:clamp(12px,2vw,30px);
  background:url("assets/qa-clean-edge.png") center top / 100% auto no-repeat;
  transform:scaleY(-1);
}
.original-qa::after{background-position:center bottom}

.hero{grid-template-areas:"photo photo" "info diagram"}
.hero .nutrient-figures{background:transparent;min-width:0}
.nutrient-ring strong{pointer-events:none}
@media(max-width:650px){
  .hero{grid-template-areas:"photo" "info" "diagram"}
  .hero .nutrient-figures{width:min(100%,380px);justify-self:center}
}

.nutrient-ring .vitamin-label{display:block;white-space:nowrap;word-break:keep-all}

.readable-lineup .flavor-hd{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,2vw,20px);width:min(100%,640px);margin-inline:auto}
.readable-lineup .flavor-gentle{grid-template-columns:repeat(2,minmax(0,1fr));max-width:426px}
.flavor-hd figure{margin:0;min-width:0}
.readable-lineup .flavor-hd img{width:100%;max-width:none;height:auto}
.flavor-hd figcaption{text-align:center;font-weight:750;font-size:clamp(.68rem,1.7vw,1rem);line-height:1.4;margin-top:6px}
.readable-lineup article h3,.flavor-hd figcaption{text-wrap:balance}
.readable-lineup .lineup-description p{text-wrap:pretty;line-break:strict}
.flavor-hd figcaption{word-break:keep-all}

.hero .brand{
  width:max-content;
  max-width:none;
  white-space:nowrap;
  padding-inline-end:.15em;
  font-size:clamp(2.7rem,9vw,6.75rem);
  color:#f2d286;
  letter-spacing:.015em;
  text-shadow:none;
  filter:drop-shadow(0 2px 5px #08101db0);
}
@supports(background-clip:text){
  .hero .brand{
    background:linear-gradient(180deg,#fff3ce 8%,#f5d78e 45%,#c99442 100%);
    background-clip:text;
    color:transparent;
  }
}
@media(max-width:650px){.hero .brand{font-size:clamp(2.15rem,10.5vw,4.15rem)}}

.hero{grid-template-areas:"photo photo" "info diagram";grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.hero .hero-pack{grid-area:photo;justify-self:end;align-self:end;width:min(36%,340px);margin:0 0 12px;z-index:1;filter:drop-shadow(0 12px 16px #050a15a8)}
.hero .hero-pack img{width:100%;height:auto}
.hero .hero-copy{z-index:2;max-width:62%}
@media(max-width:650px){
  .hero{grid-template-columns:minmax(0,1fr);grid-template-areas:"photo" "info" "diagram"}
  .hero-photo{min-height:clamp(245px,76vw,420px)}
  .hero .hero-pack{width:min(37%,200px);margin-bottom:8px}
  .hero .hero-copy{max-width:65%}
}

.hero .hero-pack img {
  transform: rotate(7deg);
  transform-origin: 55% 75%;
}

.hero .hero-pack{width:min(47%,440px);margin:0 2% 10px 0}
.hero .hero-copy{max-width:54%}
@media(max-width:650px){
  .hero{grid-template-columns:minmax(0,1fr);grid-template-areas:"photo" "pack" "info" "diagram"}
  .hero .hero-copy{max-width:95%}
  .hero .hero-pack{grid-area:pack;justify-self:center;width:min(76%,330px);margin:-18px 0 8px}
}

.hero .hero-pack{position:relative;left:clamp(6px,1.4vw,16px)}
