/*
 * "Ad style" theme — matches the Black Bear advertising flyer (lime + black, bold condensed type,
 * real photo). Only applies when <html data-theme="ad">; switch in Admin → Settings → Website look.
 * Delete this file and the theme still falls back to Classic.
 */
.ad-only { display: none !important; }
.brand-tree { display: none; }

html[data-theme="ad"] {
  --forest-900: #0e1209;
  --forest-800: #161d10;
  --forest-700: #2c4a1e;
  --forest-600: #3b6a25;
  --forest-500: #5a8f30;
  --wood: #3b6a25;
  --wood-dark: #2c4a1e;
  --wood-light: #9bd14a;
  --lime: #8cc63f;
  --lime-bright: #a6dc55;
  --cream: #f1f3ec;
  --cream-2: #e1e5d8;
  --paper: #fafbf7;
  --charcoal: #0b0d0a;
  --font-display: "Oswald", "Arial Narrow", Impact, sans-serif;
}
html[data-theme="ad"] .ad-only { display: revert !important; }

/* Type: bold, condensed, uppercase headlines like the flyer */
html[data-theme="ad"] h1,
html[data-theme="ad"] h2 { text-transform: uppercase; font-weight: 700; letter-spacing: .005em; line-height: 1.02; }
html[data-theme="ad"] h3 { font-weight: 600; letter-spacing: .01em; }
html[data-theme="ad"] .hero h1 em,
html[data-theme="ad"] h1 em { font-style: normal; font-weight: 700; color: var(--lime); }
html[data-theme="ad"] .eyebrow { letter-spacing: .2em; }

/* Buttons: lime with black text */
html[data-theme="ad"] .btn { border-radius: 8px; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; font-size: .92rem; }
html[data-theme="ad"] .btn--primary { background: var(--lime); color: #0e1209; box-shadow: 0 6px 18px rgba(140,198,63,.35); }
html[data-theme="ad"] .btn--primary:hover { background: var(--lime-bright); color: #0e1209; }
html[data-theme="ad"] .btn--forest { background: #0e1209; color: #fff; }
html[data-theme="ad"] .btn--outline { border-color: #0e1209; color: #0e1209; }
html[data-theme="ad"] .btn--outline:hover { background: #0e1209; color: #fff; }

/* Promo bar + header */
html[data-theme="ad"] .promo-bar { background: var(--lime); color: #0e1209; }
html[data-theme="ad"] .promo-bar a { color: #0e1209; }
html[data-theme="ad"] .site-header { background: rgba(11,13,10,.94); border-bottom: 3px solid var(--forest-700); }
html[data-theme="ad"] .brand img { content: url("../img/logo-ad.svg"); }
html[data-theme="ad"] .brand-name { font-family: "Oswald", sans-serif; font-weight: 700; text-transform: uppercase; font-size: 1.45rem; letter-spacing: .01em; display: inline-flex; align-items: center; }
html[data-theme="ad"] .brand-tree { display: inline-block; width: 14px; height: 18px; margin: 0 2px -1px; color: var(--lime); }
html[data-theme="ad"] .brand-sub { color: #fff; letter-spacing: .32em; display: flex; align-items: center; gap: 6px; }
html[data-theme="ad"] .brand-sub::before,
html[data-theme="ad"] .brand-sub::after { content: ""; height: 1.5px; width: 10px; background: var(--lime); }
html[data-theme="ad"] .nav-phone a { color: var(--lime) !important; font-weight: 700 !important; letter-spacing: .02em; display: inline-flex; align-items: center; white-space: nowrap; }
html[data-theme="ad"] .nav-phone svg { width: 16px; height: 16px; vertical-align: -3px; margin-right: 6px; }

/* Hero: the real photo */
html[data-theme="ad"] .hero { background: #0e1209 url("../images/ad-hero.jpg") 62% 40% / cover no-repeat; }
html[data-theme="ad"] .hero .hero-art { display: none; }
html[data-theme="ad"] .hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8,10,6,.92) 0%, rgba(8,10,6,.78) 42%, rgba(8,10,6,.25) 75%, rgba(8,10,6,.1) 100%), linear-gradient(0deg, rgba(8,10,6,.85) 0%, rgba(8,10,6,0) 35%); }
html[data-theme="ad"] .hero-content { z-index: 2; }
html[data-theme="ad"] .hero h1 { font-size: clamp(2.8rem, 7vw, 5.2rem); }
html[data-theme="ad"] .hero-tagline { font: 600 .9rem/1.4 "Inter", sans-serif; letter-spacing: .24em; text-transform: uppercase; color: #fff; margin: -6px 0 22px; }
html[data-theme="ad"] .town-bar { display: inline-flex !important; gap: 0; background: var(--forest-700); border: 1.5px solid var(--lime); border-radius: 6px; margin-bottom: 22px; overflow: hidden; }
html[data-theme="ad"] .town-bar span { padding: 7px 16px; font: 700 .95rem "Oswald", sans-serif; letter-spacing: .08em; text-transform: uppercase; color: #fff; }
html[data-theme="ad"] .town-bar span + span { border-left: 1.5px solid rgba(255,255,255,.35); }
html[data-theme="ad"] .hero .eyebrow { display: none; }

/* "$85 a month" brush-stroke badge */
html[data-theme="ad"] .price-tag {
  background: var(--lime); color: #0e1209; border: 0; padding: 12px 26px 12px 22px;
  border-radius: 4px 18px 6px 22px / 18px 6px 20px 8px; transform: rotate(-2deg);
  font: 700 .95rem "Oswald", sans-serif; text-transform: uppercase; letter-spacing: .06em;
  box-shadow: 6px 6px 0 rgba(0,0,0,.35);
}
html[data-theme="ad"] .price-tag strong { color: #0e1209; font: 700 2rem "Oswald", sans-serif; }

/* Page headers use the photo too */
html[data-theme="ad"] .page-hero { background: #0e1209 url("../images/ad-hero.jpg") 60% 45% / cover no-repeat; }
html[data-theme="ad"] .page-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8,10,6,.94), rgba(8,10,6,.72) 60%, rgba(8,10,6,.5)); }
html[data-theme="ad"] .page-hero .container { position: relative; z-index: 1; }

/* Icons: round badges with a lime ring (like the flyer) */
html[data-theme="ad"] .icon-badge { border-radius: 50%; background: #0e1209; color: #fff; box-shadow: 0 0 0 3px var(--lime); }
html[data-theme="ad"] .hero-meta svg { color: var(--lime); }

/* Cards / sections */
html[data-theme="ad"] .card { border-radius: 12px; }
html[data-theme="ad"] .section--dark { background: #0e1209; }
html[data-theme="ad"] .step::before { color: var(--lime); font-weight: 700; }
html[data-theme="ad"] .plan { border-radius: 12px; border-top: 4px solid var(--forest-700); }
html[data-theme="ad"] .plan--featured { background: #0e1209; border-top-color: var(--lime); }
html[data-theme="ad"] .plan-flag { background: var(--lime); color: #0e1209; }
html[data-theme="ad"] .plan-price { font-weight: 700; }
html[data-theme="ad"] .plan--featured .plan-promo { color: var(--lime); }
html[data-theme="ad"] .plan--featured .bag-meter i.on { background: var(--lime); }
html[data-theme="ad"] .plan--featured li svg { color: var(--lime); }
html[data-theme="ad"] .town { background: #0e1209; border-top: 4px solid var(--lime); }
html[data-theme="ad"] .town h3 { text-transform: uppercase; font-weight: 700; }
html[data-theme="ad"] .recycle-list .dot { background: var(--forest-700); }
html[data-theme="ad"] .section--dark .recycle-list .dot { background: var(--lime); color: #0e1209; }
html[data-theme="ad"] .notice { border-left-color: var(--lime); }
html[data-theme="ad"] .notice svg { color: var(--forest-600); }

/* Launch promo: black panel with a lime brush number */
html[data-theme="ad"] .promo { background: #0e1209 url("../images/ad-hero.jpg") 50% 70% / cover; position: relative; }
html[data-theme="ad"] .promo::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8,10,6,.95), rgba(8,10,6,.8)); border-radius: inherit; }
html[data-theme="ad"] .promo > * { position: relative; }
html[data-theme="ad"] .promo .eyebrow { color: var(--lime) !important; }
html[data-theme="ad"] .promo-big { color: #0e1209; background: var(--lime); padding: 18px 26px 14px; transform: rotate(-3deg); border-radius: 4px 20px 6px 24px / 20px 6px 22px 8px; box-shadow: 8px 8px 0 rgba(0,0,0,.4); }
html[data-theme="ad"] .promo-count { background: var(--lime); color: #0e1209; }

/* CTA band + footer */
html[data-theme="ad"] .cta-band { background: #0e1209 url("../images/ad-hero.jpg") 50% 35% / cover; }
html[data-theme="ad"] .cta-band::before { content: ""; position: absolute; inset: 0; background: rgba(8,10,6,.82); }
html[data-theme="ad"] .cta-band .ridge { display: none; }
html[data-theme="ad"] .site-footer { border-top: 4px solid var(--lime); }
html[data-theme="ad"] .site-footer h4 { color: var(--lime); }

/* Forms */
html[data-theme="ad"] .tier-option input:checked + .box { border-color: var(--forest-600); box-shadow: 0 0 0 4px rgba(140,198,63,.3); }
html[data-theme="ad"] .tier-option .box strong { font-weight: 700; text-transform: uppercase; }

/* Header fit: never wrap; drop the phone on mid-size screens where space is tight */
html[data-theme="ad"] .nav-links a,
html[data-theme="ad"] .brand-sub,
html[data-theme="ad"] .brand-name { white-space: nowrap; }
html[data-theme="ad"] .nav-links a { padding: 10px 11px; }
@media (min-width: 961px) and (max-width: 1240px) { html[data-theme="ad"] .nav-phone { display: none !important; } }
@media (max-width: 960px) { html[data-theme="ad"] .nav-phone a { font-size: 1.1rem; } }
/* Labels sitting on the photo */
html[data-theme="ad"] .page-hero .eyebrow,
html[data-theme="ad"] .section--dark .eyebrow,
html[data-theme="ad"] .cta-band .eyebrow { color: var(--lime); }