/* spwr.css — stallion-power.com — crimson/ember + black, Anton display + Mulish body.
   Per build spec: base font sizes run larger throughout than prior builds in this portfolio. */
:root{
  --red:#D81E2C; --red2:#FF3B30; --ember:#FF6B35; --black:#0B0B0D; --black2:#1A1A1E;
  --ink:#18181C; --mut:#5E5A5C; --line:#E7E0DD; --ground:#FAF7F5; --cream:#FFFFFF;
  --deep:#0E0E11; --ok:#2E8F52; --arch:14px;
  --f-display:'Anton',sans-serif; --f-body:'Mulish',sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; font-size:19px;} /* larger base than prior builds (was 16-17px) */
body{margin:0; font-family:var(--f-body); color:var(--ink); background:var(--ground); line-height:1.65; font-size:1.08rem;}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
h1,h2,h3,h4{font-family:var(--f-display); letter-spacing:.02em; line-height:1.12; margin:0 0 .5em; text-transform:uppercase; overflow-wrap:break-word; word-break:break-word; hyphens:auto;}
h1{font-size:clamp(1.9rem,5.2vw,4.1rem)}
h2{font-size:clamp(1.5rem,3.6vw,2.75rem)}
h3{font-size:clamp(1.2rem,2.2vw,1.75rem)}
@media (max-width:400px){
  h1{font-size:clamp(1.6rem,8vw,2.2rem)}
}
p{margin:0 0 1.1em}
ul,ol{margin:0 0 1.1em; padding-left:1.4em}
li{margin-bottom:.45em}
.spwr-wrap{max-width:1220px; margin:0 auto; padding:0 24px}
.spwr-btn{display:inline-flex; align-items:center; justify-content:center; gap:.5em; padding:1em 1.9em; border-radius:999px; font-family:var(--f-display); text-transform:uppercase; letter-spacing:.03em; font-size:1.02rem; border:2px solid transparent; cursor:pointer; transition:transform .15s ease, box-shadow .15s ease;}
.spwr-btn--solid{background:linear-gradient(135deg,var(--red2),var(--red)); color:#fff; box-shadow:0 10px 26px -8px rgba(216,30,44,.55);}
.spwr-btn--solid:hover{transform:translateY(-2px) scale(1.02); box-shadow:0 14px 32px -8px rgba(216,30,44,.7);}
.spwr-btn--ghost{background:transparent; border-color:var(--black); color:var(--black);}
.spwr-btn--lg{padding:1.15em 2.4em; font-size:1.15rem}

/* header */
.spwr-hd{position:sticky; top:0; z-index:40; background:rgba(250,247,245,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--line);}
.spwr-hd__in{display:flex; align-items:center; gap:28px; padding:14px 24px;}
.spwr-logo{display:flex; align-items:center; gap:10px; font-family:var(--f-display); font-size:1.25rem; text-transform:uppercase; margin-right:auto;}
.spwr-logo b{color:var(--red)}
.spwr-nav{display:flex; gap:26px; font-weight:700; font-size:.98rem; text-transform:uppercase; letter-spacing:.02em;}
.spwr-nav a:hover{color:var(--red)}
.spwr-hd__cta{white-space:nowrap}
.spwr-burger{display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px;}
.spwr-burger span{width:24px; height:3px; background:var(--black); border-radius:2px}

@media (max-width:920px){
  .spwr-nav{position:fixed; inset:64px 0 auto 0; background:var(--cream); flex-direction:column; padding:20px 24px; gap:16px; border-bottom:1px solid var(--line); transform:translateY(-130%); transition:transform .25s ease; box-shadow:0 12px 24px -12px rgba(0,0,0,.2);}
  .spwr-nav.is-open{transform:translateY(0)}
  .spwr-hd__cta{display:none}
  .spwr-burger{display:flex; flex:none}
  .spwr-hd__in{gap:10px; padding:12px 16px;}
  .spwr-logo{font-size:1rem; min-width:0}
  .spwr-logo svg{flex:none}
}

/* hero */
.spwr-hero{background:radial-gradient(120% 140% at 80% 0%, #241014 0%, var(--black) 55%, var(--deep) 100%); color:#fff; padding:64px 0 80px; overflow:clip; position:relative;}
.spwr-hero__in{display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center;}
.spwr-eyebrow{display:inline-flex; align-items:center; gap:.5em; background:rgba(216,30,44,.16); border:1px solid rgba(216,30,44,.4); color:var(--red2); font-weight:600; font-size:.85rem; letter-spacing:.08em; text-transform:uppercase; padding:.5em 1em; border-radius:999px; margin-bottom:20px;}
.spwr-hero h1{color:#fff}
.spwr-hero h1 span{color:var(--red2)}
.spwr-hero__lede{font-size:1.2rem; color:#E7E1DE; max-width:56ch;}
.spwr-hero__list{list-style:none; padding:0; margin:22px 0 26px; display:grid; gap:12px;}
.spwr-hero__list li{display:flex; gap:.7em; align-items:flex-start; font-size:1.05rem; color:#F1EDEA; margin-bottom:0;}
.spwr-hero__list svg{flex:none; margin-top:.2em}
.spwr-hero__tblwrap{margin:26px 0; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14); border-radius:var(--arch); overflow:hidden;}
.spwr-hero__tbl{width:100%; border-collapse:collapse; font-size:.98rem;}
.spwr-hero__tbl caption{text-align:left; padding:14px 18px 0; font-weight:600; text-transform:uppercase; letter-spacing:.04em; font-size:.85rem; color:var(--ember);}
.spwr-hero__tbl th,.spwr-hero__tbl td{padding:12px 18px; text-align:left; border-top:1px solid rgba(255,255,255,.1);}
.spwr-hero__tbl th{color:#B9B3B0; font-weight:700; width:46%;}
.spwr-hero__tbl td{color:#fff; font-weight:700;}
.spwr-hero__cta{display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:8px;}
.spwr-hero__note{font-size:.9rem; color:#B9B3B0}
.spwr-hero__media{position:relative}
.spwr-hero__media img{border-radius:20px; position:relative; z-index:2;}
.spwr-hero__card{margin-top:-40px; position:relative; z-index:3; background:var(--cream); color:var(--ink); border-radius:var(--arch); padding:18px 20px; box-shadow:0 30px 60px -20px rgba(0,0,0,.5);}

@media (max-width:920px){
  .spwr-hero__in{grid-template-columns:1fr}
  .spwr-hero__card{margin-top:18px}
}

/* generic section rhythm */
.spwr-sec{padding:76px 0}
.spwr-sec--alt{background:var(--cream)}
.spwr-sec__head{max-width:760px; margin:0 auto 44px; text-align:center;}
.spwr-tag{display:inline-block; font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:.85rem; color:var(--red); margin-bottom:10px;}

/* why choose */
.spwr-why{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.spwr-why__card{background:var(--cream); border:1px solid var(--line); border-radius:var(--arch); padding:26px 20px; text-align:center; opacity:0; transform:translateY(16px); transition:opacity .5s ease, transform .5s ease;}
.spwr-why__card.is-in{opacity:1; transform:none}
.spwr-why__card img{width:88px; height:auto; margin:0 auto 14px;}
.spwr-why__card h3{font-size:1.1rem}
@media (max-width:920px){.spwr-why{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.spwr-why{grid-template-columns:1fr}}

/* wave cta */
.spwr-wave{background:linear-gradient(135deg,var(--red),var(--red2)); color:#fff; padding:52px 0; text-align:center;}
.spwr-wave h2{color:#fff; margin-bottom:.3em}
.spwr-wave p{max-width:60ch; margin:0 auto 22px; color:#FFE3E1}

/* what is / story / two col */
.spwr-2col{display:grid; grid-template-columns:1fr 1fr; gap:52px; align-items:center;}
.spwr-2col img{border-radius:var(--arch)}
@media (max-width:920px){.spwr-2col{grid-template-columns:1fr}}

/* pricing */
.spwr-pricing{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.spwr-pack{background:var(--cream); border:2px solid var(--line); border-radius:18px; padding:28px 22px; text-align:center; position:relative; opacity:0; transform:translateY(16px); transition:opacity .5s ease, transform .5s ease;}
.spwr-pack.is-in{opacity:1; transform:none}
.spwr-pack--hot{border-color:var(--red); box-shadow:0 24px 48px -22px rgba(216,30,44,.4); transform:scale(1.03);}
.spwr-pack__badge{position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:var(--red); color:#fff; font-size:.78rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase; padding:.4em 1em; border-radius:999px; white-space:nowrap;}
.spwr-pack img{max-width:150px; margin:0 auto 14px;}
.spwr-pack__was{text-decoration:line-through; color:var(--mut); font-size:.95rem;}
.spwr-pack__price{font-family:var(--f-display); font-size:2.6rem; color:var(--red); margin:.1em 0;}
.spwr-pack__price small{font-size:1rem; font-family:var(--f-body); color:var(--mut); font-weight:700; text-transform:none;}
.spwr-pack__total{font-size:.95rem; color:var(--mut); margin-bottom:16px;}
.spwr-pack__save{display:inline-block; background:#FFE9E7; color:var(--red); font-weight:600; font-size:.85rem; padding:.35em 1em; border-radius:999px; margin-bottom:14px;}
@media (max-width:920px){.spwr-pricing{grid-template-columns:1fr}.spwr-pack--hot{transform:none}}

/* guarantee */
.spwr-guar{display:grid; grid-template-columns:.9fr 1.1fr; gap:52px; align-items:center; background:var(--black); color:#fff; border-radius:24px; padding:48px; margin:0 24px;}
.spwr-guar img{max-width:220px; margin:0 auto}
.spwr-guar h2{color:#fff}
@media (max-width:920px){.spwr-guar{grid-template-columns:1fr; padding:32px 24px; margin:0 12px}}

/* shipping strip */
.spwr-strip{display:flex; justify-content:center; gap:44px; flex-wrap:wrap; padding:30px 0; background:var(--cream); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.spwr-strip span{display:flex; align-items:center; gap:.6em; font-weight:600; font-size:.95rem; text-transform:uppercase; letter-spacing:.02em;}

/* ingredients grid */
.spwr-ing{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-bottom:36px;}
.spwr-ing__card{background:var(--cream); border:1px solid var(--line); border-radius:var(--arch); padding:20px; opacity:0; transform:translateY(16px); transition:opacity .5s ease, transform .5s ease;}
.spwr-ing__card.is-in{opacity:1; transform:none}
.spwr-ing__card h3{font-size:1.02rem; margin-bottom:.3em}
.spwr-ing__card p{font-size:.95rem; color:var(--mut); margin:0}
@media (max-width:920px){.spwr-ing{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.spwr-ing{grid-template-columns:1fr}}

/* plates */
.spwr-plate__fig{margin:0; text-align:center; background:var(--cream); border:1px solid var(--line); border-radius:var(--arch); padding:24px;}
.spwr-plate__ttl{font-weight:600; letter-spacing:.05em; text-transform:uppercase; font-size:.85rem; color:var(--red); margin-bottom:14px;}
.spwr-plate__svg{width:100%; height:auto; max-width:520px;}
.spwr-plate__cap{font-size:.85rem; color:var(--mut); margin-top:12px;}
.spwr-plate__legend{display:flex; justify-content:center; gap:20px; flex-wrap:wrap; font-size:.85rem; margin-top:10px;}
.spwr-plate__legend span{display:flex; align-items:center; gap:.5em}
.spwr-dot{width:10px; height:10px; border-radius:50%; display:inline-block}
.spwr-fx-c{opacity:0; transition:opacity .6s ease}
.spwr-fx.is-in .spwr-fx-c{opacity:1}
.spwr-fx-c1{transition-delay:0ms} .spwr-fx-c2{transition-delay:180ms} .spwr-fx-c3{transition-delay:360ms}
.spwr-curve-line{stroke-dasharray:600; stroke-dashoffset:600; transition:stroke-dashoffset 1.1s ease}
.spwr-curve.is-in .spwr-curve-line{stroke-dashoffset:0}
.spwr-ig-bar{transform-origin:bottom; transform:scaleY(0); transition:transform .6s ease}
.spwr-ig.is-in .spwr-ig-bar{transform:scaleY(1)}
.spwr-nn-node{opacity:0; transform:scale(.5); transform-origin:center; transition:opacity .5s ease, transform .5s ease}
.spwr-nn-edge{stroke-dasharray:60; stroke-dashoffset:60; transition:stroke-dashoffset .6s ease}
.spwr-nn.is-in .spwr-nn-node{opacity:1; transform:scale(1)}
.spwr-nn.is-in .spwr-nn-edge{stroke-dashoffset:0}

/* benefits */
.spwr-ben{display:grid; grid-template-columns:repeat(2,1fr); gap:18px;}
.spwr-ben__card{display:flex; gap:14px; background:var(--cream); border:1px solid var(--line); border-radius:var(--arch); padding:20px;}
.spwr-ben__card svg{flex:none}
@media (max-width:700px){.spwr-ben{grid-template-columns:1fr}}

/* reviews */
.spwr-rev{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.spwr-rev__card{background:var(--cream); border:1px solid var(--line); border-radius:var(--arch); padding:24px;}
.spwr-rev__stars{color:var(--ember); font-size:1.1rem; margin-bottom:10px;}
.spwr-rev__name{font-weight:600; margin-top:14px}
.spwr-rev__tag{font-size:.85rem; color:var(--mut)}
@media (max-width:920px){.spwr-rev{grid-template-columns:1fr}}

/* faq */
.spwr-faq{max-width:820px; margin:0 auto;}
.spwr-faq__item{border-bottom:1px solid var(--line); padding:18px 0;}
.spwr-faq__item summary{cursor:pointer; font-weight:600; font-size:1.05rem; list-style:none; display:flex; justify-content:space-between; gap:16px;}
.spwr-faq__item summary::-webkit-details-marker{display:none}
.spwr-faq__item summary:after{content:'+'; font-family:var(--f-display); font-size:1.4rem; color:var(--red)}
.spwr-faq__item[open] summary:after{content:'\2212'}
.spwr-faq__item p{margin-top:12px; color:var(--mut)}

/* final cta */
.spwr-last{background:radial-gradient(120% 160% at 50% 0%, #241014 0%, var(--black) 60%); color:#fff; padding:64px 0; text-align:center;}
.spwr-last h2{color:#fff}
.spwr-last p{max-width:56ch; margin:0 auto 24px; color:#E7E1DE}

/* supplement facts */
.spwr-sfacts{max-width:480px; margin:0 auto; border:3px solid var(--black); border-radius:8px; padding:20px; background:var(--cream);}
.spwr-sfacts h3{border-bottom:8px solid var(--black); padding-bottom:8px; margin-bottom:4px; font-size:1.5rem;}
.spwr-sfacts table{width:100%; border-collapse:collapse; font-size:.95rem;}
.spwr-sfacts td{padding:6px 0; border-bottom:1px solid var(--line);}
.spwr-sfacts .spwr-sfacts__note{font-size:.8rem; color:var(--mut); border:none; padding-top:10px;}

/* checkout / trust */
.spwr-trust{text-align:center}
.spwr-trust img{margin:16px auto 0; max-width:260px}

/* references */
.spwr-refs{max-width:820px; margin:0 auto}
.spwr-refs h3{font-size:1.1rem; margin-top:1.4em}
.spwr-refs ul{font-size:.92rem; color:var(--mut)}

/* what/inner hero */
.spwr-what{background:var(--black); color:#fff; padding:56px 0 40px; text-align:center;}
.spwr-what h1{color:#fff}
.spwr-what p{color:#D9D3D0; max-width:64ch; margin:0 auto}

/* sticky mobile CTA */
.spwr-sticky{display:none; position:fixed; left:0; right:0; bottom:0; z-index:50; background:var(--black); padding:12px 16px; align-items:center; justify-content:space-between; gap:14px; box-shadow:0 -10px 24px -12px rgba(0,0,0,.5);}
@media (max-width:640px){.spwr-sticky{display:flex}}
.spwr-sticky p{margin:0; color:#fff; font-weight:600; font-size:.92rem}
.spwr-sticky .spwr-btn{padding:.75em 1.4em; font-size:.9rem}

/* countdown */
.spwr-timer{display:inline-flex; gap:10px; font-family:var(--f-display); font-size:1.4rem; color:var(--red2); margin:10px 0;}
.spwr-timer span{background:var(--black); color:#fff; padding:.3em .5em; border-radius:8px; min-width:1.8em; text-align:center;}

/* blog */
.spwr-blogcard{background:var(--cream); border:1px solid var(--line); border-radius:var(--arch); overflow:hidden;}
.spwr-blogcard img{aspect-ratio:16/10; object-fit:cover; width:100%;}
.spwr-blogcard__body{padding:20px}
.spwr-bloggrid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
@media (max-width:920px){.spwr-bloggrid{grid-template-columns:1fr}}

/* misc reveal */
.spwr-reveal{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease;}
.spwr-reveal.is-in{opacity:1; transform:none}

/* footer */
.spwr-ft{background:var(--black); color:#D9D3D0; padding:56px 0 24px;}
.spwr-ft__top{display:grid; grid-template-columns:1.6fr repeat(4,1fr); gap:28px; padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,.12);}
.spwr-ft__brand{display:flex; flex-direction:column; gap:14px; max-width:32ch;}
.spwr-ft__brand p{font-size:.85rem; color:#B9B3B0; margin:0;}
.spwr-ft__col{display:flex; flex-direction:column; gap:10px; min-width:0;}
.spwr-ft__col h4{font-family:var(--f-body); font-weight:600; text-transform:uppercase; letter-spacing:.05em; font-size:.85rem; color:#fff; margin:0 0 4px;}
.spwr-ft__col a{font-size:.9rem; color:#B9B3B0; word-break:break-word;}
.spwr-ft__col a:hover{color:var(--red2)}
.spwr-ft__bot{padding-top:20px; display:flex; flex-wrap:wrap; gap:8px 24px; font-size:.8rem; color:#8A8480;}
.spwr-ft__bot p{margin:0}
@media (max-width:920px){
  .spwr-ft__top{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .spwr-ft__top{grid-template-columns:1fr}
}

/* legal */
.spwr-legal{max-width:820px; margin:0 auto; padding:60px 24px}
.spwr-legal h2{margin-top:1.6em}

/* 404 */
.spwr-404{text-align:center; padding:120px 24px}
.spwr-404 h1{font-size:6rem}
