/* Approximate screen palette; replace tokens with approved brand specifications. */
:root{color-scheme:dark;--bg:#141615;--text:#f5f6f2;--muted:#a5aaa5;--green:#2f7d46;--citrus:#c2cf45;--line:#363b37;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--citrus);outline-offset:5px}.page{max-width:1600px;margin:auto;padding:0 6%}.header{min-height:132px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:24px}.wordmark{font-weight:900;font-size:46px;letter-spacing:-3px;font-style:italic;line-height:1}.wordmark span{color:var(--green);padding-left:7px}.eyebrow{text-transform:uppercase;font-size:12px;font-weight:600;letter-spacing:2.2px;line-height:1.6}.launch-label{color:var(--muted)}.hero{display:grid;grid-template-columns:1.12fr 1fr;gap:9%;padding:78px 0 72px;align-items:center}.positioning{margin:0 0 28px}h1{margin:0;font-weight:700}.dose{display:block;font-size:clamp(130px,16vw,238px);line-height:.8;letter-spacing:-.075em;font-weight:800}.unit{font-size:.7em;letter-spacing:-.06em;margin-left:.09em}.creatine{display:table;text-transform:uppercase;font-size:clamp(30px,4.4vw,64px);letter-spacing:-2px;line-height:1.1;margin-top:29px;padding:12px 0 11px;border-top:3px solid var(--green);border-bottom:3px solid var(--green)}.additions{display:block;font-size:clamp(23px,2.65vw,38px);font-weight:400;line-height:1.35;letter-spacing:-1px;margin-top:24px}.flavor{display:flex;align-items:center;gap:18px;margin-top:36px}.flavor-tag{background:var(--citrus);color:var(--bg);padding:9px 17px;text-transform:uppercase;font-size:12px;letter-spacing:1.8px;font-weight:700}.flavor-note{color:var(--muted);font-size:12px}.coming{color:var(--text);margin:0 0 19px;display:flex;align-items:center;gap:12px}.coming:before{content:"";width:24px;height:2px;background:var(--green)}h2{font-size:clamp(40px,4.6vw,66px);font-weight:500;letter-spacing:-2.7px;line-height:1.05;margin:0 0 26px}.intro{font-size:18px;line-height:1.55;margin:0 0 22px}.invitation{font-size:14px;color:var(--muted);line-height:1.7;margin-bottom:27px}label{display:block;font-size:13px;margin-bottom:10px}.input-row{display:flex;border:1px solid #727a72;padding:5px;gap:4px;transition:border-color .2s}.input-row:focus-within{border-color:var(--citrus)}input{min-width:0;width:100%;color:var(--text);background:transparent;border:0;padding:13px 10px;font-size:16px;border-radius:0}input::placeholder{color:#969d97}button{flex-shrink:0;border:0;border-radius:0;background:#ecede6;color:#171b17;padding:13px 17px;font-size:13px;font-weight:700;cursor:pointer;transition:background .2s,transform .2s}button span{margin-left:12px}button:hover{background:var(--citrus)}button:active{transform:translateY(1px)}button:disabled{opacity:.65;cursor:wait}.fine-print{color:var(--muted);font-size:12px;line-height:1.6;margin:12px 0 0}.form-status{font-size:13px;line-height:1.5;margin:10px 0 0}.form-status:empty{display:none}.form-status[data-state=error]{color:#f3b7a7}.form-status[data-state=success]{color:#dce7b4}.signature{display:flex;gap:12px;align-items:center;color:var(--muted);font-size:12px;margin-top:37px}.signature-rule{width:29px;height:3px;background:var(--green)}.details{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);padding:24px 0;gap:16px}.details p{margin:0;font-size:13px}.details p span{color:var(--muted);font-size:11px;margin-right:16px}.details p:nth-child(2){text-align:center}.details p:last-child{text-align:right}footer{padding:33px 0 37px;display:flex;justify-content:space-between;align-items:center;gap:22px;color:var(--muted);font-size:12px}footer>div{display:flex;align-items:center;gap:24px}.footer-brand{font-weight:800;font-style:italic;font-size:20px;color:var(--text);letter-spacing:-1px}footer p{margin:0}.footer-links{gap:30px}footer a{color:var(--text)}footer a:hover{text-decoration:underline;text-underline-offset:5px}.skip-link{position:absolute;top:-100px;left:20px;padding:12px;background:var(--text);color:var(--bg);z-index:10}.skip-link:focus{top:16px}.hero{animation:arrive .65s ease-out both}@keyframes arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1500px){.hero{padding-top:95px;padding-bottom:95px}}
@media(max-width:900px){.page{padding:0 6%}.hero{gap:6%;padding:58px 0}.input-row{flex-direction:column;padding:6px}button{min-height:48px}.desktop-break{display:none}footer,footer>div{gap:16px}.footer-links{flex-direction:column;align-items:flex-end}}
@media(max-width:640px){.header{min-height:96px}.wordmark{font-size:36px}.launch-label{font-size:10px;letter-spacing:1.3px;max-width:100px;text-align:right}.hero{grid-template-columns:1fr;gap:56px;padding:43px 0}.positioning{margin-bottom:29px}.dose{font-size:166px}.creatine{font-size:43px;margin-top:24px}.additions{font-size:28px}.flavor{margin-top:27px}.signup{border-top:1px solid var(--line);padding-top:35px}h2{font-size:48px;letter-spacing:-2px}.input-row{flex-direction:row}button{padding:12px}button span{margin-left:5px}.details{grid-template-columns:1fr;gap:20px}.details p:nth-child(2),.details p:last-child{text-align:left}footer{align-items:flex-start}footer>div{align-items:flex-start;flex-direction:column}footer p{max-width:160px;line-height:1.6}.footer-links{align-items:flex-end;text-align:right;line-height:1.6}.signature{margin-top:27px}}
@media(max-width:370px){.input-row{flex-direction:column}.flavor{gap:12px}.flavor-note{font-size:12px}.dose{font-size:148px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Supplied FORTH artwork; retain its natural aspect ratio at every breakpoint. */
.wordmark{display:block;flex-shrink:0}.wordmark img{display:block;width:180px;height:auto}.footer-brand{display:block;width:86px;height:auto;flex-shrink:0}
@media(max-width:640px){.wordmark img{width:145px}}

/* Product render sits immediately to the right of the formula. */
.hero{grid-template-columns:minmax(0,.9fr) minmax(0,.85fr) minmax(0,1fr);gap:3%;padding-top:60px;padding-bottom:60px}
.formula,.signup{min-width:0}.dose{font-size:clamp(130px,14vw,210px)}
.creatine{font-size:clamp(30px,3.5vw,50px)}
.additions{font-size:clamp(22px,2.2vw,32px)}
.product-render{margin:0;align-self:center}.product-render img{display:block;width:100%;height:auto}
.flavor{flex-wrap:wrap;gap:12px}.signup h2{font-size:clamp(38px,3.8vw,58px)}
.input-row{flex-direction:column}.input-row button{min-height:48px}
@media(min-width:1500px){.input-row{flex-direction:row}}
@media(min-width:641px) and (max-width:1099px){.hero{grid-template-columns:1fr 1fr;gap:40px}.product-render{max-width:320px;justify-self:center}.signup{grid-column:1/-1;max-width:620px;width:100%;justify-self:center;border-top:1px solid var(--line);padding-top:36px}.input-row{flex-direction:row}}
@media(max-width:640px){.hero{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:35px 12px;padding:40px 0}.positioning{font-size:10px;letter-spacing:1.2px}.dose{font-size:clamp(100px,27vw,166px)}.creatine{font-size:clamp(24px,6vw,38px);letter-spacing:-1px;margin-top:22px}.additions{font-size:clamp(17px,4.2vw,26px);letter-spacing:-.5px}.flavor-note{line-height:1.5}.product-render{align-self:center}.signup{grid-column:1/-1;padding-top:35px}.signup h2{font-size:48px}.input-row{flex-direction:row}}
@media(max-width:370px){.input-row{flex-direction:column}}