/* Figma comment audit, 22.09.2026. Only the two reviewed pages load this file. */
/* #103, #106, #124, #132: orange CTAs with bold black labels. */
.btn{font-weight:700}
.btn:not(.ghost){background:var(--apricot);color:var(--display-ink)}
/* #100: center the guarantee below the hero action, including its own label. */
.hero-action{display:inline-flex;flex-direction:column;align-items:center;max-width:100%}
.hero-action .cta-note{align-self:stretch;text-align:center}
.hero-action .badge{display:inline-flex;justify-content:center;align-items:center}
/* #116: make the six-absorbencies line distinct from the capacity footnote. */
.capacity-note{text-align:center;font-size:calc(18px * var(--fs,1));color:var(--ink-soft);margin-top:20px}
.capacity-note strong{display:block;margin-bottom:8px;color:var(--ink)}
.capacity-note span{display:block}
/* #227: retain the approved cups and ladder, label the cup units explicitly. */
.cups{gap:12px;margin-bottom:16px}
.cup-unit{display:flex;flex-direction:column;align-items:center;gap:8px;width:58px}
.cup{display:block}
.cup::before{content:"";position:absolute;left:100%;top:10px;width:12px;height:24px;border:2px solid var(--ink);border-left:0;border-radius:0 9px 9px 0}
.cup-label{font-size:calc(18px * var(--fs,1));line-height:1.3;white-space:nowrap;color:var(--ink)}
@media(max-width:620px){.hero-action{width:100%}.hero-action>.btn{width:100%}}

/* Allow the offer grid to shrink to a 320px viewport without clipping its copy. */
.buybox>div{min-width:0}

@media(max-width:374px){.cups{gap:8px}}
/* The existing corrected square asset has extra photographic margin. Match the
   original pack's displayed size and let its white backdrop blend into each band. */
img[src="assets/ultimate-pack-clear.jpg"]{mix-blend-mode:multiply;transform:scale(1.2)}
.hero-art{overflow:hidden;mix-blend-mode:multiply}
.buybox>div:first-child{overflow:hidden}
@media(max-width:900px){.buybox img[src="assets/ultimate-pack-clear.jpg"]{max-width:min(250px,100%)}}
