/* Preview controls belong to the utility row, outside the campaign composition. */
.shop-header .campaign-preview-control { display:inline-flex; align-items:center; gap:9px; flex-shrink:0; padding:3px 8px; border:1px solid var(--nav-line); border-radius:4px; color:var(--nav-muted); font:11px/1.4 Arial,sans-serif; }
.shop-header .campaign-preview-control > span { cursor:help; }
.shop-header .header-utility .campaign-preview-control a { color:var(--nav-muted); text-decoration:none; padding-left:9px; border-left:1px solid var(--nav-line); }
.shop-header .header-utility .campaign-preview-control a:hover { color:var(--nav-text); text-decoration:underline; }
.campaign-banner { position:relative; isolation:isolate; box-sizing:border-box; display:flex; align-items:center; overflow:hidden; width:calc(100% - 56px); max-width:1280px; min-height:270px; margin:24px auto; padding:36px clamp(24px,4vw,64px); background:var(--nav-field); color:var(--nav-text); border:1px solid var(--nav-line); border-radius:12px; text-align:left; }
.campaign-banner .campaign-copy { position:relative; z-index:2; box-sizing:border-box; width:54%; max-width:610px; padding:0; }
.campaign-banner .campaign-eyebrow { display:inline-flex; align-items:center; gap:9px; color:var(--nav-muted); text-transform:uppercase; font:700 10px/1.5 Arial,sans-serif; letter-spacing:.22em; }
.campaign-banner .campaign-eyebrow::before { content:''; width:18px; height:1px; background:currentColor; }
html .campaign-banner h2 { color:var(--nav-text); font:700 clamp(26px,2.7vw,38px)/1.14 Arial,sans-serif; letter-spacing:-.035em; margin:12px 0; padding:0; text-wrap:balance; }
.campaign-banner p { max-width:380px; font:13px/1.65 Arial,sans-serif; margin:0 0 22px; }
html .campaign-banner a.campaign-cta { display:inline-flex; align-items:center; gap:24px; padding:12px 19px; border:1px solid #ffbb73; border-radius:5px; background:linear-gradient(180deg,#ffb45f,#ef8d37); color:#291a19; font:700 13px/1.3 Arial,sans-serif; text-decoration:none; box-shadow:0 3px 14px #e97d1520; transition:filter .15s,box-shadow .15s; }
html .campaign-banner a.campaign-cta:hover { filter:brightness(1.08); color:#291a19; box-shadow:0 3px 20px #e97d1540; }
.campaign-banner a:focus-visible { outline:2px solid #fff1da; outline-offset:4px; }
.campaign-banner.campaign-halloween { background:#16121c; border-color:#49343d; box-shadow:inset 0 1px 0 #ffffff06,0 8px 28px #00000012; }
.campaign-halloween .campaign-art { position:absolute; z-index:0; top:0; right:0; height:100%; width:auto; aspect-ratio:3 / 1; pointer-events:none; background:url('g/halloween-campaign-v2.webp') center right / auto 100% no-repeat; -webkit-mask-image:linear-gradient(90deg,transparent,#000 24%); mask-image:linear-gradient(90deg,transparent,#000 24%); }
.campaign-halloween::after { content:''; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(90deg,#16121c 0%,#16121cf2 27%,#16121c80 48%,transparent 68%); }
html .campaign-banner.campaign-halloween h2 { color:#fff0dc; text-shadow:0 2px 20px #0008; }
.campaign-halloween .campaign-eyebrow { color:#e6a665; }
.campaign-halloween .campaign-copy p { color:#bdb1bf; }
.campaign-halloween-page .shop-header .shop-navigation { border-bottom-color:#e99144; }
.campaign-halloween-page .sale-price { color:#ffad63; }
.campaign-product-badge { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; margin:0 5px 0 0; padding:0; vertical-align:middle; border:0; background:transparent; filter:drop-shadow(0 1px 3px #e7812433); }
.campaign-product-badge img { display:block; width:28px !important; height:28px !important; max-width:none; max-height:none; float:none; position:static; margin:0; padding:0; border:0; object-fit:contain; }

@media(max-width:700px) {
 .campaign-banner { width:calc(100% - 28px); min-height:290px; margin:16px auto; padding:28px 22px; }
 .campaign-banner .campaign-copy { width:72%; }
 html .campaign-banner h2 { font-size:28px; }
 .campaign-banner p { font-size:12px; max-width:260px; }
 .campaign-halloween .campaign-art { background-size:auto 100%; background-position:68% center; opacity:.7; }
 .campaign-halloween::after { background:linear-gradient(90deg,#16121cf5,#16121ccc 38%,#16121c55 75%,#16121c33); }
}
@media(max-width:400px) {
 .campaign-banner { padding:25px 20px; }
 .campaign-banner .campaign-copy { width:90%; }
 .campaign-halloween .campaign-art { opacity:.45; }
}
@media(prefers-reduced-motion:reduce) { html .campaign-banner a.campaign-cta { transition:none; } }