/* Buy-box style chooser: five 2/6/3 styles. Palette follows the V2 FOCUS page (navy / amber) so it previews in context. */
:root{--h:#13294B;--acc:#1F6FB2;--gold:#D4A72C;--gold2:#B28900;--ink:#17181C;--mute:#5B6170;--line:#E3E6EB;--bg:#F3F5F8;--o1:#F7941D;--o2:#E8411E;--g:#1E8A4C;--char:#2B2F36;
 --disp:Oswald,Impact,sans-serif;--sans:"Open Sans",system-ui,sans-serif;--serif:"Libre Baskerville",Georgia,serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 var(--sans);overflow-x:hidden}
img{max-width:100%;display:block}a{color:inherit}.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.show-focus .p-collagen,.show-collagen .p-focus{display:none}
/* page chrome */
.hero{background:linear-gradient(160deg,#0F2240,#1B3A68);color:#fff;padding:60px 0 46px}
.kick{font:700 12px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin:0 0 10px}
.hero h1{font:700 clamp(40px,6vw,72px)/1 var(--disp);text-transform:uppercase;margin:0 0 14px}
.lede{font-size:18px;color:rgba(255,255,255,.85);max-width:760px;margin:0 0 24px}
.rules{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.rules b{width:100%;font-size:13px;color:var(--gold);letter-spacing:.06em;text-transform:uppercase}
.rules span{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:5px 12px;font-size:13px}
.bar{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 6px 18px -14px rgba(0,0,0,.4)}
.bar .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:10px;padding-bottom:10px}
.bar nav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}.bar nav a{white-space:nowrap;text-decoration:none;font-size:13px;font-weight:700;color:var(--h);padding:6px 10px;border-radius:8px}
.bar nav a:hover{background:var(--bg)}.bar nav b{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--h);color:#fff;font-size:11px;margin-right:6px}
.tg{display:flex;border:2px solid var(--h);border-radius:999px;overflow:hidden;flex:none}.tg button{border:0;background:#fff;color:var(--h);font:700 13px var(--sans);padding:7px 14px;cursor:pointer}.tg button[aria-pressed=true]{background:var(--h);color:#fff}
.sty{padding:64px 0;border-bottom:1px solid var(--line)}.sty:nth-of-type(even){background:#fff}
.sh{display:flex;gap:18px;align-items:center}.no{flex:none;width:58px;height:58px;border-radius:16px;background:var(--h);color:#fff;display:grid;place-items:center;font:700 30px var(--disp)}
.sh h2{font:700 clamp(28px,3.4vw,40px)/1 var(--disp);text-transform:uppercase;color:var(--h);margin:0}.tag{margin:4px 0 0;color:var(--acc);font-weight:700}
.meta{display:grid;grid-template-columns:1.4fr 1fr;gap:6px 30px;margin:18px 0 30px;color:var(--mute);font-size:15px}.meta p{margin:0}.bf{grid-row:span 2}.bf b{color:var(--ink)}
.src{font-size:12px}.src span{display:inline-block;background:#E8EEF7;color:var(--h);border-radius:4px;padding:2px 8px;margin:3px 4px 0 0;font-weight:700}
footer{padding:30px 24px 60px;color:var(--mute);font-size:13px}
/* shared parts */
.bb{display:grid;grid-template-columns:1fr 1.14fr 1fr;gap:18px;align-items:center}
.bb .art img{margin:0 auto;width:100%;max-height:190px;object-fit:contain}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;color:#fff;background:var(--char);font:700 18px var(--disp);text-transform:uppercase;letter-spacing:.02em;border-radius:6px;padding:14px 12px;min-height:50px;transition:transform .12s,box-shadow .12s}
.btn:hover{transform:translateY(-1px)}.btn.hot{background:linear-gradient(90deg,var(--o1),var(--o2));box-shadow:0 12px 22px -12px rgba(232,65,30,.95)}
.btn span{font-size:24px;line-height:0}.g{color:var(--g)}
.save{display:inline-block;background:#E5F5EC;color:var(--g);font-weight:800;font-size:12px;border-radius:4px;padding:2px 7px}
/* 1 House standard */
.s1 .c{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 20px 40px -32px rgba(0,0,0,.5);display:flex;flex-direction:column;position:relative;height:100%}
.s1 .c.best{border:2px solid var(--gold);transform:translateY(-14px) scale(1.02);box-shadow:0 34px 60px -30px rgba(19,41,75,.55);z-index:1}
.s1 .rib{position:absolute;top:12px;right:-34px;transform:rotate(38deg);background:var(--gold);color:#3D2B00;font:700 11px var(--sans);letter-spacing:.08em;text-transform:uppercase;padding:4px 40px;z-index:2}
.s1 .band{background:var(--char);color:#fff;text-align:center;padding:11px}.s1 .best .band{background:#B8202B}
.s1 .band b{display:block;font:700 26px/1 var(--disp);text-transform:uppercase}.s1 .band small{font-size:12.5px;opacity:.85}
.s1 .art{padding:10px 8px 0}.s1 .strip{background:#F4F6F9;margin:8px 0 0;padding:10px 14px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.s1 .per{font:700 40px/1 var(--disp);color:var(--h)}.s1 .per small{font:600 13px var(--sans);color:var(--mute)}.s1 .reg{font-size:12px;color:var(--mute);text-align:right}
.s1 .rows{list-style:none;margin:0;padding:6px 14px;font-size:13.5px}.s1 .rows li{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dashed var(--line)}
.s1 .tot{display:flex;justify-content:space-between;padding:8px 14px 12px;font:700 19px var(--disp);color:var(--h)}.s1 .btn{margin:auto 14px 16px}
/* 2 Receipt */
.s2 .c{background:#fff;border:1px solid var(--line);border-radius:6px;padding:20px 20px 16px;display:flex;flex-direction:column;height:100%}
.s2 .c.best{border:2px solid var(--h);box-shadow:0 30px 50px -34px rgba(19,41,75,.6);padding-top:24px}
.s2 .hd{text-align:center;font:700 12px var(--sans);letter-spacing:.32em;color:var(--mute);padding-bottom:12px;border-bottom:1px solid var(--line)}.s2 .best .hd{color:var(--h)}
.s2 .art{padding:12px 0;border-bottom:1px solid var(--line);margin-bottom:8px}
.s2 .li{display:flex;justify-content:space-between;font-size:14px;padding:5px 0;color:#333}.s2 .li.big{border-top:2px solid var(--ink);margin-top:6px;padding-top:10px;font:700 22px var(--disp);color:var(--h)}
.s2 .tint{background:#EAF2FB;color:var(--h);font-weight:700;font-size:13px;text-align:center;border-radius:4px;padding:7px;margin:10px 0 4px}.s2 .tint.q{background:#F4F6F9;color:var(--mute)}
.s2 .ck{list-style:none;padding:0;margin:8px 0 14px;font-size:13px;color:var(--mute)}.s2 .ck li:before{content:"\2713  ";color:var(--g);font-weight:800}
.s2 .btn{margin-top:auto;background:var(--h);font-size:16px}.s2 .btn.hot{background:linear-gradient(90deg,var(--o1),var(--o2))}
.s2 .li-ic{width:16px;height:16px}.s2 .sec{text-align:center;color:var(--mute);font-size:11.5px;margin-top:6px}
/* 3 Per-bottle hero */
.s3{align-items:end}
.s3 .c{background:#fff;border:1px solid var(--line);border-radius:10px;text-align:center;padding:0 16px 16px;position:relative;box-shadow:0 18px 36px -30px rgba(0,0,0,.5)}
.s3 .tab{margin:0 -16px 10px;background:#EEF2F7;color:var(--h);font:700 14px var(--sans);letter-spacing:.16em;padding:9px;border-radius:10px 10px 0 0}
.s3 .c.best{border:3px solid var(--gold);padding-bottom:22px}.s3 .best .tab{background:var(--h);color:#fff;font-size:18px;padding:13px}
.s3 .lim{display:inline-block;background:#FFF3D6;color:#8A5A00;font:700 11px var(--sans);letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:3px 10px}
.s3 .big{font:700 58px/1 var(--serif);color:var(--h);margin-top:6px}.s3 .best .big{font-size:70px}
.s3 .unit{font:700 11.5px var(--sans);letter-spacing:.14em;color:var(--mute);margin-top:6px}.s3 .pd{color:var(--acc);font-weight:700;font-size:14px;margin-top:4px}
.s3 .shipl{font-size:13.5px;margin-top:8px;font-weight:700}.s3 .tt{font-size:14px;margin:4px 0}.s3 .tt s{color:#999}.s3 .gt{font-size:12.5px;color:var(--g);font-weight:700;margin-bottom:12px}
.s3 .btn{background:linear-gradient(#FFC94A,#F2A900);color:#2A1D00;box-shadow:0 3px 0 #C98A00;font-size:20px}.s3 .cards{font-size:10.5px;letter-spacing:.12em;color:var(--mute);margin-top:8px}
/* 4 Rows */
.s4{display:block;max-width:880px;margin:0 auto}
.s4 .r{display:grid;grid-template-columns:120px 1fr auto 170px;gap:18px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 18px 12px 12px;margin-bottom:12px;position:relative}
.s4 .r.best{border:2px solid var(--o2);background:linear-gradient(90deg,#FFF6EE,#fff 60%);box-shadow:0 20px 40px -30px rgba(232,65,30,.7);padding-top:18px}
.s4 .flag{position:absolute;top:-11px;left:16px;background:var(--o2);color:#fff;font:700 11px var(--sans);letter-spacing:.1em;text-transform:uppercase;border-radius:999px;padding:3px 12px}
.s4 .art img{max-height:92px}.s4 .nm b{display:block;font:700 22px/1.1 var(--disp);text-transform:uppercase;color:var(--h)}.s4 .nm small{display:block;color:var(--mute);font-size:13px;margin:2px 0 6px}
.s4 .pr{text-align:right}.s4 .pr b{display:block;font:700 34px/1 var(--disp);color:var(--h)}.s4 .pr small{display:block;color:var(--mute);font-size:12px}.s4 .pr em{font-style:normal;font-size:13px;font-weight:700}
.s4 .foot{text-align:center;color:var(--mute);font-size:13px;margin:16px 0 0}
/* 5 Savings showcase */
.s5{grid-template-columns:1fr 1.3fr 1fr}
.s5 .c{background:#fff;border-radius:16px;text-align:center;padding:0 16px 18px;box-shadow:0 16px 34px -28px rgba(0,0,0,.5);border:1px solid var(--line);overflow:hidden}
.s5 .c.best{border:0;padding-bottom:24px;background:linear-gradient(#FFF8E6,#fff 45%);box-shadow:0 0 0 3px var(--o2),0 40px 70px -36px rgba(232,65,30,.75)}
.s5 .top{margin:0 -16px 8px;padding:12px;background:#EEF2F7}.s5 .best .top{background:linear-gradient(90deg,var(--o1),var(--o2));color:#fff;padding:16px}
.s5 .top b{display:block;font:700 26px/1 var(--disp);text-transform:uppercase}.s5 .best .top b{font-size:34px}.s5 .top small{font-size:12.5px}
.s5 .art{position:relative}.s5 .best .art img{max-height:240px}
.s5 .pill{position:absolute;top:4px;left:6px;z-index:1;background:var(--g);color:#fff;font:700 15px var(--disp);text-transform:uppercase;border-radius:999px;padding:6px 14px;transform:rotate(-6deg);box-shadow:0 8px 16px -8px rgba(0,0,0,.5)}
.s5 .was{color:#999;text-decoration:line-through;font-size:14px;margin-top:6px}.s5 .now{font:700 46px/1 var(--disp);color:var(--h)}.s5 .best .now{font-size:60px;color:#B8202B}
.s5 .now small{font:600 14px var(--sans);color:var(--mute)}.s5 .pd{color:var(--acc);font-weight:700;font-size:14px}
.s5 .chips{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin:10px 0}.s5 .chips span{background:#F1F3F6;border-radius:999px;font-size:12px;font-weight:700;padding:4px 10px}
.s5 .best .chips span{background:#E5F5EC;color:var(--g)}
.s5 .seal{width:96px;height:96px;margin:4px auto 12px;border-radius:50%;background:radial-gradient(circle,#F5D46A 0 52%,#B98A0B 53% 58%,#F0C64B 59% 100%);display:grid;place-items:center;font:700 10px/1.05 var(--disp);text-transform:uppercase;color:#5A3D00}.s5 .seal b{display:block;font-size:13px}
.s5 .btn.two{flex-direction:column;gap:2px;padding:11px 10px}.s5 .btn.two b{font:700 19px var(--disp)}.s5 .btn.two small{font:600 12px var(--sans);text-transform:none;opacity:.92}
.s5 .best .btn.two b{font-size:22px}
/* phones */
@media(max-width:860px){
 .bar .wrap{flex-wrap:wrap}.bar nav{width:100%;order:2}.meta{grid-template-columns:1fr}.bf{grid-row:auto}
 .bb{grid-template-columns:1fr;gap:16px}.bb .c[data-n="6"]{order:-2}.bb .c[data-n="3"]{order:-1}
 .s1 .c.best{transform:none}.s3 .c,.s5 .c{max-width:440px;margin:0 auto;width:100%}
 .s1 .c,.s2 .c{max-width:440px;margin:0 auto;width:100%}
 .s4 .r{grid-template-columns:84px 1fr auto;gap:10px;padding:12px}.s4 .r .btn{grid-column:1/-1}.s4 .art img{max-height:70px}.s4 .nm b{font-size:19px}.s4 .pr b{font-size:28px}
 .s5{grid-template-columns:1fr}
}
/* ---- Style 5 = house standard (Cody 2026-11-07) ---- */
.std{display:block;text-decoration:none;background:linear-gradient(90deg,var(--o1),var(--o2));color:#fff;border-radius:12px;padding:12px 18px;margin:0 0 22px;max-width:760px;box-shadow:0 14px 30px -16px rgba(232,65,30,.9)}
.std b{display:block;font:700 20px var(--disp);text-transform:uppercase}.std span{font-size:14px}
#s5{background:#FFFDF8;box-shadow:inset 0 4px 0 var(--o2)}#s5 .no{background:linear-gradient(135deg,var(--o1),var(--o2))}
.s5 .info{display:block}.s5 .pz{display:block}
.ti{width:18px;height:18px;flex:none}
.s5 .chips span{display:inline-flex;align-items:center;gap:5px}.s5 .chips .ti{width:15px;height:15px}
.s5 .trust{display:flex;justify-content:center;gap:8px;margin:4px 0 14px}
.s5 .trust span{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;background:#fff;border:1px solid #F3D9C9;border-radius:10px;padding:8px 4px;font:700 11px/1.15 var(--sans);color:var(--h);text-align:center}
.s5 .trust .ti{width:24px;height:24px;color:var(--o2)}
/* Amazon-style secondary buttons: lighter, warm, clearly clickable, quieter than the orange 6-pack button */
.btn.alt{background:linear-gradient(#FFE58A,#FFD43B);color:#1F1A0A;border:1px solid #F2BE1C;box-shadow:0 2px 0 #D9A50F,0 8px 16px -12px rgba(160,110,0,.7)}
.btn.alt:hover{background:linear-gradient(#FFE07A,#FFCB1F)}.s5 .btn.alt small{opacity:.8}
@media(max-width:860px){
 .s5{gap:12px}
 /* compact side rows (about half the height of the 6-pack) */
 .s5 .c:not(.best){display:grid;grid-template-columns:92px 1fr;grid-template-areas:"top top" "art info" "btn btn";gap:0 12px;padding:0 12px 12px;text-align:left;max-width:none}
 .s5 .c:not(.best) .top{grid-area:top;display:flex;align-items:baseline;justify-content:space-between;margin:0 -12px 8px;padding:9px 12px}
 .s5 .c:not(.best) .top b{font-size:21px}.s5 .c:not(.best) .art{grid-area:art;align-self:center}.s5 .c:not(.best) .art img{max-height:84px}
 .s5 .c:not(.best) .info{grid-area:info;align-self:center}.s5 .c:not(.best) .was{margin:0;font-size:12px}.s5 .c:not(.best) .now{font-size:34px}
 .s5 .c:not(.best) .pd{font-size:12.5px}.s5 .c:not(.best) .chips{justify-content:flex-start;margin:6px 0 0}.s5 .c:not(.best) .chips span{font-size:11px;padding:3px 8px}
 .s5 .c:not(.best) .btn{grid-area:btn;margin-top:10px;padding:9px}.s5 .c:not(.best) .btn b{font-size:17px}
 /* the 6-pack: first, full, about twice as tall, with seal + trust icons */
 .s5 .c.best{max-width:none;padding:0 14px 18px}.s5 .best .top{padding:14px}.s5 .best .top b{font-size:34px}
 .s5 .best .art img{max-height:200px}.s5 .best .pill{font-size:14px}
 .s5 .best .info{display:grid;grid-template-columns:1fr 92px;align-items:center;gap:4px 10px;text-align:left;margin-top:4px}
 .s5 .best .info .chips{grid-column:1/-1;justify-content:flex-start;margin:4px 0 8px}
 .s5 .best .now{font-size:56px}.s5 .best .seal{width:92px;height:92px;margin:0}
 .s5 .best .btn.two{padding:14px 10px}.s5 .best .btn.two b{font-size:23px}
}
.s5 .seal span{display:block;padding:0 8px;line-height:1.05}.s5 .seal b{font-size:12px}
@media(max-width:860px){.s5 .best .seal{font-size:9px}.s5 .best .seal b{font-size:11px}}
