/* ===== Tokens ===== */
:root{
  --cream:#FAF6ED;
  --paper:#FFFDF8;
  --ink:#1E2B26;
  --teal:#1F4D43;
  --teal-dark:#163A32;
  --gold:#D9A23B;
  --gold-deep:#B9822A;
  --coral:#E2654B;
  --line:#DED2B3;
  --muted:#6B6F62;
  --ok:#3C7A52;
  --radius:14px;
  --display: 'Fraunces', serif;
  --body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--cream); color:var(--ink);
  font-family:var(--body); line-height:1.55;
}
img{max-width:100%; display:block;}
a{color:var(--teal); text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{max-width:1120px; margin:0 auto; padding:0 20px;}
h1,h2,h3,h4{font-family:var(--display); font-weight:600; line-height:1.15; margin:0 0 .5em;}
.skip-link{position:absolute; left:-999px; top:0; background:var(--ink); color:#fff; padding:10px 16px; z-index:100;}
.skip-link:focus{left:10px; top:10px;}
:focus-visible{outline:3px solid var(--gold); outline-offset:2px;}

/* ===== Header ===== */
.site-header{background:var(--teal); border-bottom:4px solid var(--gold);}
.header-row{display:flex; align-items:center; justify-content:space-between; padding:16px 20px;}
.logo{font-family:var(--display); font-size:1.5rem; font-weight:700; color:#fff;}
.logo span{color:var(--gold);}
.logo:hover{text-decoration:none;}
.main-nav a{color:#EFE9D8; margin-left:22px; font-weight:600; font-size:.95rem;}
.main-nav a:hover{color:var(--gold); text-decoration:none;}

/* ===== Hero ===== */
.hero{background:linear-gradient(180deg, var(--teal) 0%, var(--teal-dark) 100%); color:#fff; padding:56px 0 64px;}
.hero h1{font-size:clamp(2rem,4.5vw,3rem); color:#fff; max-width:16ch;}
.hero p{max-width:56ch; color:#DDEAE3; font-size:1.1rem;}
.hero .stat-row{display:flex; gap:28px; margin-top:28px; flex-wrap:wrap;}
.stat{font-family:var(--display);}
.stat b{display:block; font-size:1.8rem; color:var(--gold);}
.stat span{font-size:.85rem; color:#C7D8CF;}

/* ===== Section labels ===== */
.section{padding:48px 0;}
.section-head{display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:22px; flex-wrap:wrap;}
.section-head h2{font-size:1.6rem;}
.eyebrow{text-transform:uppercase; letter-spacing:.12em; font-size:.75rem; color:var(--coral); font-weight:700; margin-bottom:6px; display:block;}

/* ===== Category chips ===== */
.chip-row{display:flex; flex-wrap:wrap; gap:10px; margin:8px 0 8px;}
.chip{background:var(--paper); border:1px solid var(--line); border-radius:999px; padding:7px 16px; font-size:.85rem; font-weight:600; color:var(--teal);}
.chip:hover{background:var(--teal); color:#fff; text-decoration:none; border-color:var(--teal);}
.chip.active{background:var(--gold); color:var(--ink); border-color:var(--gold);}

/* ===== Deal ticket cards (signature element) ===== */
.deal-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:22px;}
.ticket{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  position:relative; overflow:hidden; display:flex; flex-direction:column;
  box-shadow:0 1px 3px rgba(30,43,38,.06);
  transition:transform .15s ease, box-shadow .15s ease;
}
.ticket:hover{transform:translateY(-3px); box-shadow:0 10px 24px rgba(30,43,38,.12);}
.ticket-top{padding:20px 20px 16px;}
.ticket-store{font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-weight:700;}
.ticket-title{font-family:var(--display); font-size:1.25rem; margin:6px 0 8px; color:var(--teal-dark);}
.ticket-desc{color:var(--muted); font-size:.92rem;}
.ticket-perf{
  position:relative; border-top:2px dashed var(--line); margin:4px 20px 0;
}
.ticket-perf::before,.ticket-perf::after{
  content:''; position:absolute; top:-11px; width:22px; height:22px; border-radius:50%;
  background:var(--cream); border:1px solid var(--line);
}
.ticket-perf::before{left:-31px;}
.ticket-perf::after{right:-31px;}
.ticket-bottom{display:flex; align-items:center; justify-content:space-between; padding:16px 20px 20px; gap:12px;}
.ticket-reward{font-family:var(--display); font-weight:700; color:var(--coral); font-size:1.15rem;}
.btn{display:inline-block; background:var(--gold); color:var(--ink); font-weight:700; padding:10px 18px; border-radius:999px; font-size:.9rem; border:none; cursor:pointer;}
.btn:hover{background:var(--gold-deep); text-decoration:none;}
.btn-outline{background:transparent; border:2px solid var(--teal); color:var(--teal);}
.btn-outline:hover{background:var(--teal); color:#fff;}
.featured-badge{position:absolute; top:14px; right:-34px; background:var(--coral); color:#fff; font-size:.7rem; font-weight:700; padding:4px 40px; transform:rotate(35deg); text-transform:uppercase; letter-spacing:.05em;}

/* ===== Store page ===== */
.store-hero{background:var(--paper); border-bottom:1px solid var(--line); padding:40px 0;}
.store-hero h1{font-size:2.2rem; color:var(--teal-dark);}
.breadcrumb{font-size:.85rem; color:var(--muted); margin-bottom:14px;}
.breadcrumb a{color:var(--muted);}
.prose{max-width:72ch;}
.prose h2{font-size:1.4rem; color:var(--teal-dark); margin-top:1.6em;}
.prose h3{font-size:1.15rem; color:var(--teal-dark); margin-top:1.4em;}
.prose p{margin:0 0 1.1em;}
.prose ul,.prose ol{padding-left:1.3em; margin:0 0 1.1em;}
.two-col{display:grid; grid-template-columns:2fr 1fr; gap:40px;}
@media(max-width:820px){.two-col{grid-template-columns:1fr;}}
.two-col > *{min-width:0;}
.prose table{display:block; max-width:100%; overflow-x:auto;}
.prose img{max-width:100%; height:auto;}
h1,h2,h3,.prose{overflow-wrap:break-word;}
.side-card{background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:20px; margin-bottom:20px;}
.faq-item{border-bottom:1px solid var(--line); padding:16px 0;}
.faq-item summary{font-weight:700; cursor:pointer; color:var(--teal-dark); font-family:var(--display); font-size:1.02rem;}
.faq-item p{margin:10px 0 0; color:var(--muted);}

/* ===== Blog ===== */
.post-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:26px;}
.post-card{background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:22px;}
.post-card .eyebrow{margin-bottom:10px;}
.post-card h3{font-size:1.2rem; color:var(--teal-dark);}
.post-card p{color:var(--muted); font-size:.92rem;}
.post-body{max-width:70ch; margin:0 auto;}
.post-body h2{font-size:1.5rem; color:var(--teal-dark); margin-top:1.8em;}
.post-body h3{font-size:1.2rem; color:var(--teal-dark);}
.post-meta{color:var(--muted); font-size:.85rem; margin-bottom:6px;}

/* ===== Forms (admin) ===== */
.form-wrap{max-width:640px; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:32px; margin:0 auto;}
.field{margin-bottom:18px;}
.field label{display:block; font-weight:700; margin-bottom:6px; font-size:.9rem;}
.field .hint{color:var(--muted); font-size:.8rem; margin-top:4px;}
.field input[type=text],.field input[type=url],.field input[type=number],.field input[type=date],.field input[type=password],.field select,.field textarea{
  width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:8px; font-family:var(--body); font-size:.95rem; background:#fff;
}
.field textarea{min-height:110px; resize:vertical;}
.checkbox-row{display:flex; align-items:center; gap:8px;}
.checkbox-row input{width:auto;}
.alert{padding:14px 16px; border-radius:8px; margin-bottom:20px; font-size:.9rem;}
.alert-ok{background:#E6F2EA; color:var(--ok); border:1px solid #BFE0CB;}
.alert-err{background:#FBEAE6; color:#B4402A; border:1px solid #F3C9BE;}
.admin-bar{background:var(--ink); color:#fff; padding:10px 0; font-size:.85rem;}
.admin-bar .wrap{display:flex; justify-content:space-between;}
.admin-bar a{color:var(--gold);}

/* ===== Footer ===== */
.site-footer{background:var(--teal-dark); color:#CFE0D6; padding:40px 0 20px; margin-top:40px;}
.footer-row{display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap;}
.footer-row .logo{color:#fff;}
.disclosure{max-width:52ch; font-size:.82rem; color:#A9C2B4; margin-top:10px;}
.footer-links{display:flex; flex-direction:column; gap:8px;}
.footer-links a{color:#CFE0D6; font-size:.9rem;}
.copyright{text-align:center; font-size:.78rem; color:#7E9C8C; margin-top:30px;}
.copyright.affiliate-line{margin:24px auto -18px; max-width:640px; padding:0 16px;}
.copyright.affiliate-line a{color:inherit; text-decoration:underline;}

@media(max-width:600px){
  .main-nav a{margin-left:14px; font-size:.85rem;}
  .hero{padding:40px 0 48px;}
}

/* ===== Post components (used by review posts) ===== */
.post-body .oc-lede{font-size:1.15rem; color:var(--muted); margin:.4em 0 1.2em;}
.oc-hero{display:flex; align-items:center; gap:18px; flex-wrap:wrap; background:var(--teal); color:#EFE9D8; border-radius:var(--radius); padding:18px 22px; margin:0 0 1.6em;}
.oc-hero-amount{font-family:var(--display); font-weight:700; font-size:2.6rem; line-height:1; color:var(--gold);}
.oc-hero p{margin:0; flex:1 1 14rem;}
.oc-hero a{color:var(--gold); font-weight:700; text-decoration:underline;}
.oc-steps{counter-reset:step; list-style:none; padding:0 !important; margin:0 0 1.3em;}
.oc-steps li{counter-increment:step; position:relative; padding:0 0 .9em 2.7em;}
.oc-steps li::before{content:counter(step); position:absolute; left:0; top:.05em; width:1.9em; height:1.9em; border-radius:50%; background:var(--teal); color:#fff; font-weight:700; font-size:.9rem; display:grid; place-items:center;}
.oc-procon{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:0 0 1.3em;}
.oc-procon > div{background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px;}
.oc-procon h3{margin-top:0 !important;}
.oc-procon ul{margin:0; padding-left:1.2em;}
@media(max-width:600px){.oc-procon{grid-template-columns:1fr;}}
.oc-offer{background:var(--paper); border:2px dashed var(--gold); border-radius:var(--radius); padding:20px 22px; margin:0 0 1.6em;}
.oc-offer p:last-child{margin-bottom:0;}
.oc-btn{display:inline-block; background:var(--gold); color:var(--ink) !important; font-weight:700; padding:12px 22px; border-radius:999px; text-decoration:none !important;}
.oc-btn:hover{background:var(--gold-deep);}
.oc-faq details{border-bottom:1px solid var(--line); padding:14px 0;}
.oc-faq summary{font-weight:700; cursor:pointer; color:var(--teal-dark); font-family:var(--display); font-size:1.02rem;}
.oc-faq details p{margin:10px 0 0; color:var(--muted);}
.oc-final{text-align:center; margin-top:2.4em; padding-top:1.6em; border-top:1px solid var(--line);}

/* ===== Images ===== */
.post-hero-img{width:100%; height:auto; border-radius:var(--radius); margin:.4em 0 1.4em; border:1px solid var(--line);}
.prose img, .post-body img{max-width:100%; height:auto; border-radius:10px;}
.prose figure{margin:1.4em 0;}
.prose figcaption{font-size:.85rem; color:var(--muted); margin-top:6px; text-align:center;}
.post-card-img{width:calc(100% + 44px); margin:-22px -22px 16px; aspect-ratio:16/9; object-fit:cover; border-radius:var(--radius) var(--radius) 0 0; max-width:none;}
.store-title{display:flex; align-items:center; gap:16px;}
.store-title h1{margin:0;}
.store-logo{width:64px; height:64px; object-fit:contain; background:#fff; border:1px solid var(--line); border-radius:12px; padding:6px;}

/* ===== Header search ===== */
.header-row{flex-wrap:wrap; gap:10px 16px;}
.header-search{display:flex; align-items:center; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25); border-radius:999px; padding:2px 4px 2px 14px; flex:0 1 240px;}
.header-search input{background:transparent; border:none; color:#fff; font:inherit; font-size:16px; padding:7px 0; width:100%; min-width:0; outline:none;}
.header-search input::placeholder{color:#C7D8CF;}
.header-search button{background:none; border:none; color:var(--gold); padding:6px 8px; cursor:pointer; display:grid; place-items:center;}
.header-search:focus-within{background:rgba(255,255,255,.2); border-color:var(--gold);}
@media(max-width:760px){
  .header-search{order:3; flex:1 1 100%;}
}
.search-page-form{display:flex; gap:10px; max-width:560px; margin:6px 0 26px;}
.search-page-form input{flex:1; min-width:0; padding:11px 14px; border:1px solid var(--line); border-radius:999px; font:inherit; font-size:16px; background:var(--paper);}
.search-head{font-size:1.3rem; color:var(--teal-dark); margin-top:10px;}
.muted{color:var(--muted);}

/* ===== Promo code button + popup ===== */
.btn-code{display:inline-flex; align-items:stretch; padding:0; overflow:hidden; font-family:var(--body);}
.btn-code span:first-child{padding:10px 14px 10px 18px;}
.btn-code-peek{padding:10px 12px; background:var(--paper); color:var(--teal-dark); border:2px dashed var(--gold); border-left:none; border-radius:0 999px 999px 0; font-family:ui-monospace,Menlo,monospace; letter-spacing:.08em;}
.promo-dialog{border:none; border-radius:18px; padding:28px 24px 24px; width:min(420px, calc(100vw - 32px)); background:var(--paper); color:var(--ink); text-align:center; box-shadow:0 20px 60px rgba(0,0,0,.3);}
.promo-dialog::backdrop{background:rgba(22,58,50,.55);}
.promo-dialog h2{font-size:1.4rem; color:var(--teal-dark);}
.promo-close{position:absolute; top:8px; right:12px; background:none; border:none; font-size:1.8rem; line-height:1; color:var(--muted); cursor:pointer;}
.promo-code{display:block; width:100%; margin:14px 0 10px; padding:16px; border:2px dashed var(--gold); border-radius:12px; background:#fff; font-family:ui-monospace,Menlo,monospace; font-size:1.8rem; font-weight:700; letter-spacing:.12em; color:var(--teal-dark); cursor:pointer;}
.promo-code.is-copied{border-style:solid; border-color:var(--ok); background:#E6F2EA;}
.promo-hint{color:var(--muted); font-size:.9rem; margin:0 0 16px;}
.promo-go{display:block; padding:14px 18px; font-size:1rem;}

/* ===== Promo strip on posts ===== */
.post-promo{display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; background:var(--paper); border:2px dashed var(--gold); border-radius:var(--radius); padding:14px 18px; margin:0 0 1.4em;}
.post-promo p{margin:0; font-weight:600;}
.post-promo small{display:block; font-weight:400; color:var(--muted);}
.oc-offer .btn-code{margin:8px 0 0 4px; vertical-align:middle;}

/* ===== Livelier look: hero art, brand strip, logo cards ===== */
.hero{position:relative; overflow:hidden; background:
  radial-gradient(circle at 85% 20%, rgba(217,162,59,.28), transparent 45%),
  radial-gradient(circle at 10% 90%, rgba(226,101,75,.18), transparent 40%),
  linear-gradient(180deg, var(--teal) 0%, var(--teal-dark) 100%);}
.hero-grid{display:grid; grid-template-columns:1.2fr .8fr; gap:36px; align-items:center;}
.hero-text{min-width:0;}
.hero h1{max-width:13ch;}
.hero-accent{color:var(--gold); display:block;}
.hero-search{display:flex; gap:8px; max-width:460px; margin-top:22px; background:#fff; padding:6px; border-radius:999px; box-shadow:0 10px 30px rgba(0,0,0,.2);}
.hero-search input{flex:1; min-width:0; border:none; outline:none; padding:8px 14px; font:inherit; font-size:16px; background:transparent; color:var(--ink);}
.hero-search .btn{white-space:nowrap;}
.hero-art{position:relative; justify-self:center; width:min(100%, 320px);}
.hero-art img{width:100%; height:auto; border-radius:28px; transform:rotate(3deg); box-shadow:0 24px 50px rgba(0,0,0,.35); border:4px solid rgba(255,255,255,.12);}
.coin{position:absolute; width:46px; height:46px; border-radius:50%; display:grid; place-items:center; font-family:var(--display); font-weight:700; font-size:1.3rem;
  color:#7A4E0F; background:radial-gradient(circle at 35% 30%, #FBE3A2, #D9A23B 60%, #B9822A); box-shadow:0 6px 14px rgba(0,0,0,.3), inset 0 -3px 0 rgba(0,0,0,.15);
  animation:coin-float 4s ease-in-out infinite;}
.coin-1{top:-12px; left:-14px;}
.coin-2{bottom:18%; right:-16px; width:38px; height:38px; font-size:1.05rem; animation-delay:-1.3s;}
.coin-3{bottom:-14px; left:22%; width:32px; height:32px; font-size:.9rem; animation-delay:-2.6s;}
@keyframes coin-float{0%,100%{transform:translateY(0) rotate(-8deg);} 50%{transform:translateY(-10px) rotate(8deg);}}
@media (prefers-reduced-motion: reduce){.coin, .brand-track{animation:none !important;}}
@media(max-width:820px){
  .hero-grid{grid-template-columns:1fr; gap:28px;}
  .hero-art{order:-1; justify-self:start; width:120px; margin:4px 0 -8px 6px;}
  .hero-art img{border-radius:22px;}
  .coin-1{width:34px; height:34px; font-size:1rem; top:-10px; left:-12px;} .coin-2{width:28px; height:28px; font-size:.8rem;} .coin-3{display:none;}
  .hero h1{max-width:none;}
}

.brand-strip{background:#fff; border-bottom:1px solid var(--line); overflow:hidden; padding:14px 0;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);}
.brand-track{display:flex; gap:14px; width:max-content; animation:brand-scroll 38s linear infinite;}
.brand-strip:hover .brand-track{animation-play-state:paused;}
.brand-logo{display:grid; place-items:center; width:120px; height:64px; border-radius:12px; background:var(--paper); border:1px solid var(--line); padding:8px 12px; flex-shrink:0;}
.brand-logo img{max-width:100%; max-height:46px; object-fit:contain;}
@keyframes brand-scroll{to{transform:translateX(-50%);}}

/* Deal cards: brand panel on top, buttons that never squash */
.ticket-brand{display:grid; place-items:center; height:96px; margin:0; background:#fff; border-bottom:1px solid var(--line); padding:12px 20px;}
.ticket-brand img{max-height:70px; max-width:70%; object-fit:contain;}
.ticket-brand:hover{text-decoration:none;}
.ticket-initial{width:58px; height:58px; border-radius:16px; display:grid; place-items:center; background:var(--teal); color:var(--gold); font-family:var(--display); font-weight:700; font-size:1.8rem;}
.ticket-bottom .btn{white-space:nowrap; flex-shrink:0;}
.ticket-reward{line-height:1.2;}
.featured-badge{z-index:1;}

/* Blog cards with a store logo instead of a photo */
.post-card-logo{margin:-22px -22px 16px; height:120px; display:grid; place-items:center; background:#fff; border-bottom:1px solid var(--line); border-radius:var(--radius) var(--radius) 0 0;}
.post-card-logo img{max-height:72px; max-width:60%; object-fit:contain;}

/* ===== New logo + colors matched to it (teal + orange) ===== */
:root{
  --teal:#1E7A82;
  --teal-dark:#145860;
  --gold:#EE8A2F;
  --gold-deep:#D9711A;
  --coral:#E3672A;
}
.site-header{background:#fff; border-bottom:4px solid var(--gold); box-shadow:0 2px 10px rgba(20,88,96,.06);}
.logo-img img{height:44px; width:auto; display:block;}
.main-nav a{color:var(--teal-dark);}
.main-nav a:hover{color:var(--gold-deep);}
.header-search{background:var(--cream); border-color:var(--line);}
.header-search input{color:var(--ink);}
.header-search input::placeholder{color:var(--muted);}
.header-search button{color:var(--teal);}
.header-search:focus-within{background:#fff; border-color:var(--teal);}
.footer-logo{display:inline-block; background:#fff; padding:8px 14px; border-radius:12px;}
.footer-logo img{height:34px; width:auto; display:block;}
.hero-art img{border:4px solid rgba(255,255,255,.9);}
.btn-code-peek{color:var(--teal-dark);}
@media(max-width:600px){ .logo-img img{height:36px;} }

/* =====================================================================
   Zal style pass (sample): brand fonts, one-color headline, simple buttons,
   deal squares with pop-ups, no gimmicks, quiet edges.
   ===================================================================== */
h1, h2, h3, h4, .ticket-title, .ticket-reward, .stat b, .faq-item summary, .oc-faq summary,
.oc-hero-amount, .deal-sq-reward, .admin-reward, .quick-card span, .stat-card b {
  font-family: var(--display); font-weight: 700; letter-spacing: -0.01em;
}
.btn, .chip, .eyebrow, .main-nav a, .link-more, .deal-sq-more, .btn-code-peek, .promo-code,
.ticket-store, .post-meta, .breadcrumb, .tag, .admin-nav a, .serp-label { font-family: var(--label); }
body { font-family: var(--body); }

/* Header: no orange stripe; the edge blends into the section below */
.site-header { border-bottom: 0; box-shadow: none; }

/* Hero: one color, two lines, two buttons, no coins or stats */
.hero { background: var(--teal-dark); padding: 56px 0 60px; }
.hero h1 { color: #fff; font-size: clamp(2.3rem, 5.5vw, 3.6rem); line-height: 1.08; max-width: none; margin-bottom: 14px; }
.hero p { color: #D7E9EA; font-size: 1.1rem; max-width: 42ch; }
.hero-art img { transform: none; border-radius: 28px; border: 0; box-shadow: 0 20px 44px rgba(0,0,0,.28); }
.coin, .stat-row, .hero-search { display: none !important; }

/* Buttons: gold main + solid white second, same height, one line, side by side on phones */
.btn-pair { display: flex; gap: 12px; margin-top: 22px; flex-wrap: nowrap; }
.btn-pair .btn { flex: 0 1 auto; display: inline-flex; align-items: center; justify-content: center;
  height: 48px; padding: 0 22px; white-space: nowrap; font-size: .95rem; font-weight: 600; border: 0; border-radius: 999px; }
.btn { background: var(--gold); color: #fff; }
.btn:hover { background: var(--gold-deep); color: #fff; }
.btn-white { background: #fff; color: var(--teal-dark) !important; }
.btn-white:hover { background: #F1F5F5; color: var(--teal-dark) !important; }
@media (max-width: 480px) { .btn-pair .btn { flex: 1 1 0; padding: 0 12px; font-size: .9rem; } }
.btn-pair .btn-code { padding: 0; }
.btn-pair .btn-code span:first-child { padding: 0 14px 0 18px; display: flex; align-items: center; }
.btn-pair .btn-code .btn-code-peek { display: flex; align-items: center; height: 100%; }

/* Brand strip blends into the deals section (same background, no lines) */
.brand-strip { background: var(--cream); border: 0; padding: 22px 0 6px; }
.brand-logo { background: #fff; border-color: transparent; }

/* Gimmicks removed */
.featured-badge { display: none !important; }
.eyebrow { display: none; }

/* Section headings: plain */
.section-head { align-items: center; }
.section-head h2 { font-size: 1.7rem; margin: 0; }
.link-more { color: var(--teal); font-weight: 600; font-size: .95rem; }
.section-paper { background: var(--paper); }

/* Deal squares: 3 columns on desktop, 2 on phones; details in a pop-up */
.deal-squares { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 18px; }
@media (max-width: 760px) { .deal-squares { grid-template-columns: repeat(2, 1fr); gap: 12px; } }
.deal-sq-btn { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px;
  background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 18px 12px 16px; cursor: pointer; font: inherit; color: var(--ink);
  transition: border-color .15s, transform .15s; }
.deal-sq-btn:hover { border-color: var(--teal); transform: translateY(-2px); }
.deal-sq-btn:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
.deal-sq-logo { width: 100%; aspect-ratio: 16 / 9; display: grid; place-items: center; margin-bottom: 4px; }
.deal-sq-logo img { max-width: 78%; max-height: 100%; object-fit: contain; }
.deal-sq-name { font-family: var(--label); font-weight: 600; font-size: .95rem; color: var(--teal-dark); line-height: 1.25; }
.deal-sq-reward { font-size: 1.05rem; color: var(--coral); line-height: 1.25; overflow-wrap: anywhere; }
.deal-sq-more { margin-top: auto; padding-top: 6px; font-size: .85rem; font-weight: 600; color: var(--teal); }
@media (max-width: 480px) { .deal-sq-reward { font-size: .95rem; } .deal-sq-name { font-size: .88rem; } }

.deal-dialog { border: 0; border-radius: 20px; padding: 28px 22px 22px; width: min(440px, calc(100vw - 32px)); background: #fff; color: var(--ink); text-align: center; }
.deal-dialog::backdrop { background: rgba(20,88,96,.55); }
.deal-pop-logo { height: 70px; display: grid; place-items: center; margin-bottom: 10px; }
.deal-pop-logo img { max-height: 70px; max-width: 60%; object-fit: contain; }
.deal-pop-store { font-family: var(--label); font-weight: 600; color: var(--muted); margin: 0; font-size: .9rem; }
.deal-pop-title { font-size: 1.35rem; color: var(--teal-dark); margin: 4px 0 6px; }
.deal-pop-reward { font-family: var(--display); font-weight: 700; color: var(--coral); font-size: 1.15rem; margin: 0 0 10px; }
.deal-pop-desc { color: var(--muted); margin: 0; }
.deal-pop .btn-pair { justify-content: center; }
.deal-pop .btn-white { border: 2px solid var(--line); }

/* Codes in the brand font, not monospace */
.btn-code-peek, .promo-code { font-family: var(--label); }
/* Same-size logo area in every square, so app icons and wordmarks look even */
.deal-sq-logo { aspect-ratio: auto; height: 76px; }
.deal-sq-logo img { max-height: 64px; max-width: 72%; width: auto; height: auto; }
@media (max-width: 480px) { .deal-sq-logo { height: 64px; } .deal-sq-logo img { max-height: 52px; } }
.deal-sq-reward { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* In a button pair, the code button is a plain one-line button (the code shows in the next pop-up) */
.btn-pair .btn-code { padding: 0 18px; justify-content: center; overflow: hidden; }
.btn-pair .btn-code .btn-code-peek { display: none; }
.btn-pair .btn-code span:first-child { padding: 0; white-space: nowrap; }
.side-card .btn-white{border:2px solid var(--line);}

/* ===== Stores menu (header, A to Z) ===== */
.main-nav { display: flex; align-items: center; }
.stores-nav { position: relative; margin-left: 22px; }
.stores-nav summary { list-style: none; cursor: pointer; color: var(--teal-dark); font-family: var(--label); font-weight: 600; font-size: .95rem; display: flex; align-items: center; gap: 5px; }
.stores-nav summary::-webkit-details-marker { display: none; }
.stores-nav summary:hover, .stores-nav[open] summary { color: var(--gold-deep); }
.stores-nav summary svg { transition: transform .15s; }
.stores-nav[open] summary svg { transform: rotate(180deg); }
.stores-menu { position: absolute; top: calc(100% + 14px); left: 50%; transform: translateX(-50%); z-index: 50; width: 420px;
  background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 16px 40px rgba(20,88,96,.16); padding: 10px; }
.stores-menu ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 2px; max-height: min(60vh, 420px); overflow-y: auto; }
.stores-menu li a { display: flex; align-items: center; gap: 10px; margin: 0; padding: 8px 10px; border-radius: 10px; color: var(--ink); font-family: var(--body); font-weight: 600; font-size: .92rem; line-height: 1.2; }
.stores-menu li a:hover { background: var(--cream); color: var(--teal-dark); text-decoration: none; }
.stores-menu-logo { width: 44px; height: 28px; flex-shrink: 0; display: grid; place-items: center; }
.stores-menu-logo img { max-width: 44px; max-height: 28px; object-fit: contain; }
.main-nav .stores-menu-all { display: block; margin: 8px 0 0; padding: 10px; border-top: 1px solid var(--line); text-align: center; color: var(--teal); font-size: .9rem; }
@media (max-width: 600px) {
  .stores-nav { margin-left: 14px; position: static; }
  .stores-nav summary { font-size: .85rem; }
  .site-header .header-row { position: relative; }
  .stores-menu { left: 12px; right: 12px; width: auto; transform: none; top: auto; margin-top: 10px; }
  .stores-menu ul { max-height: 60vh; }
}

/* ===== All stores page (A to Z) ===== */
.az-jump { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 6px; }
.az-jump a { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; background: #fff; border: 1px solid var(--line);
  font-family: var(--label); font-weight: 600; color: var(--teal-dark); }
.az-jump a:hover { border-color: var(--teal); text-decoration: none; }
.az-group { scroll-margin-top: 16px; }
.az-flat { margin-top: 20px; }
.az-letter { font-size: 1.4rem; color: var(--teal-dark); margin: 26px 0 10px; }
.az-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 760px) { .az-list { grid-template-columns: repeat(2, 1fr); gap: 10px; } }
@media (max-width: 420px) { .az-list { grid-template-columns: 1fr; } }
.az-store { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; color: var(--ink); min-width: 0; }
.az-store:hover { border-color: var(--teal); text-decoration: none; }
.az-logo { width: 56px; height: 42px; flex-shrink: 0; display: grid; place-items: center; }
.az-logo img { max-width: 56px; max-height: 42px; object-fit: contain; }
.az-initial { width: 42px; height: 42px; border-radius: 10px; background: var(--cream); display: grid; place-items: center; font-family: var(--display); font-weight: 700; color: var(--teal); }
.az-text { display: flex; flex-direction: column; min-width: 0; }
.az-name { font-family: var(--label); font-weight: 600; color: var(--teal-dark); line-height: 1.25; }
.az-reward { color: var(--coral); font-weight: 600; font-size: .88rem; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ===== Contact page ===== */
.contact-section { padding-top: 40px; }
.contact-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
@media (max-width: 760px) { .contact-wrap { grid-template-columns: 1fr; gap: 22px; } .contact-section { padding-top: 26px; } }
.contact-intro h1 { color: var(--teal-dark); font-size: clamp(2rem, 4.5vw, 2.8rem); line-height: 1.1; margin-bottom: 12px; }
.contact-intro p { font-size: 1.08rem; color: var(--ink); max-width: 44ch; }
.contact-points { list-style: none; padding: 0; margin: 18px 0 0; display: flex; flex-direction: column; gap: 10px; }
.contact-points li { position: relative; padding-left: 30px; font-weight: 600; color: var(--teal-dark); }
.contact-points li::before { content: ''; position: absolute; left: 0; top: .2em; width: 18px; height: 18px; border-radius: 50%; background: var(--gold); }
.contact-points li::after { content: ''; position: absolute; left: 6px; top: calc(.2em + 4px); width: 5px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.contact-card { background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 26px; }
@media (max-width: 480px) { .contact-card { padding: 20px 16px; } }
.contact-form .field input { width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; font: inherit; font-size: 16px; background: #fff; }
.contact-form .field input:focus { outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px rgba(30,122,130,.15); }
.contact-form .field input[aria-invalid="true"] { border-color: #B4402A; }
.contact-form .optional { font-weight: 400; color: var(--muted); }
.field-err { color: #B4402A; font-size: .85rem; margin: 6px 0 0; }
.contact-send { width: 100%; height: 50px; font-size: 1rem; font-weight: 600; border: 0; border-radius: 999px; cursor: pointer; margin-top: 4px; }
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.contact-done { text-align: center; padding: 10px 0; }
.contact-done h2 { color: var(--teal-dark); }
.contact-done .btn { display: inline-flex; align-items: center; height: 48px; padding: 0 24px; margin-top: 8px; border-radius: 999px; }
.contact-form .field textarea { width: 100%; min-height: 110px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; font: inherit; font-size: 16px; background: #fff; resize: vertical; }
.contact-form .field textarea:focus { outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px rgba(30,122,130,.15); }

/* Tables inside posts and store pages */
.oc-table { width: 100%; max-width: 480px; border-collapse: collapse; margin: 0 0 1.3em; background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; font-size: .95rem; }
.oc-table th, .oc-table td { text-align: left; padding: 10px 14px; border-bottom: 1px solid var(--line); }
.oc-table th { background: var(--teal-dark); color: #fff; font-family: var(--label); font-weight: 600; }
.oc-table tr:last-child td { border-bottom: 0; }
.oc-table td:last-child { font-weight: 700; color: var(--teal-dark); }
.contact-email { font-size: 1rem; margin-top: -4px; }
.contact-email a { color: var(--teal); font-weight: 600; }

/* ===== Offer cards, claim steps, eligibility (Opencare and other store pages) ===== */
.oc-figure { margin: 0 0 1.4em; }
.oc-figure img { display: block; width: 100%; max-width: 440px; height: auto; border-radius: 18px; }
.offer-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 0 0 1.2em; }
.offer-card { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 18px; }
.offer-amount { font-family: var(--display); font-weight: 700; font-size: 2.2rem; line-height: 1; color: var(--teal-dark); }
.offer-kind { font-family: var(--label); font-weight: 600; color: var(--muted); margin-bottom: 12px; }
.offer-card .oc-btn { margin-top: auto; display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 18px; width: 100%; text-align: center; color: #fff !important; }
.oc-btn-white { background: #fff !important; color: var(--teal-dark) !important; border: 2px solid var(--line); }
.oc-btn-white:hover { border-color: var(--teal); }
@media (max-width: 520px) { .offer-pair { grid-template-columns: 1fr; } }
.claim-steps { list-style: none; padding: 0 !important; margin: 0 0 1.4em; display: flex; flex-direction: column; gap: 14px; counter-reset: claim; }
.claim-steps li { counter-increment: claim; display: flex; align-items: flex-start; gap: 14px; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 14px 16px; }
.claim-steps li img { width: 52px; height: 52px; flex-shrink: 0; }
.claim-steps li span { display: block; line-height: 1.5; }
.claim-steps li strong { display: block; color: var(--teal-dark); font-family: var(--display); font-size: 1.05rem; margin-bottom: 2px; }
.claim-steps li strong::before { content: counter(claim) ". "; color: var(--gold-deep); }
.oc-eligible { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 18px 20px 8px; margin: 0 0 1.4em; }
.oc-eligible h3 { margin-top: 0 !important; color: var(--teal-dark); }
.check-list { list-style: none; padding: 0 !important; margin: 0; }
.check-list li { position: relative; padding: 0 0 12px 30px; }
.check-list li::before { content: ''; position: absolute; left: 0; top: .25em; width: 18px; height: 18px; border-radius: 50%; background: var(--teal); }
.check-list li::after { content: ''; position: absolute; left: 6px; top: calc(.25em + 4px); width: 5px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.oc-final-cta { text-align: center; margin-top: 1.6em; }

/* The white offer button keeps dark text (the card's button rule sets white text) */
.offer-card .oc-btn-white { background: #fff !important; color: var(--teal-dark) !important; border: 2px solid var(--line); }
.offer-card .oc-btn-white:hover { border-color: var(--teal); background: #F1F5F5 !important; }

/* Deal label (e.g. "App only") and expiry date */
.deal-label { display: inline-block; align-self: center; font-family: var(--label); font-weight: 600; font-size: .72rem; letter-spacing: .02em; color: var(--teal-dark); background: #E7F1F1; border-radius: 999px; padding: 3px 10px; margin: 2px 0 6px; }
.deal-exp { font-size: .82rem; font-weight: 600; color: var(--gold-deep); margin: 6px 0 0; }
.deal-pop .deal-exp { margin-top: 10px; }
.no-deals { background: #fff; border: 1px dashed var(--line); border-radius: 14px; padding: 16px 18px; color: var(--muted); margin: 0 0 28px; }

.deal-dates { font-size: .8rem; color: var(--muted); margin: 8px 0 0; line-height: 1.5; }
.deal-dates .deal-expires { color: var(--gold-deep); font-weight: 600; }
.deal-pop .deal-dates { margin-top: 10px; }

/* About / Privacy / Terms */
.text-page { padding-top: 36px; }
.text-page-body { max-width: 720px; }
.text-page-body h1 { color: var(--teal-dark); font-size: clamp(2rem, 4.5vw, 2.6rem); margin-bottom: 6px; }
.text-page-updated { color: var(--muted); font-size: .9rem; margin-top: 0; }
.text-page-lede { font-size: 1.12rem; }
.text-page-body h2 { color: var(--teal-dark); margin-top: 1.6em; }

/* Email signup box */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
.signup-section { padding-top: 10px; }
.signup-box { background: var(--teal-dark); color: #fff; border-radius: 20px; padding: 26px 24px; }
.signup-title { color: #fff; font-size: 1.45rem; margin: 0 0 6px; }
.signup-sub { color: #D7E9EA; margin: 0 0 14px; }
.signup-form { display: flex; gap: 10px; flex-wrap: wrap; }
.signup-form input[type=email] { flex: 1 1 220px; min-width: 0; height: 48px; padding: 0 16px; border-radius: 999px; border: 0; font: inherit; font-size: 16px; color: var(--ink); background: #fff; }
.signup-form .btn { height: 48px; padding: 0 24px; border: 0; border-radius: 999px; font-weight: 600; cursor: pointer; }
.signup-msg { background: rgba(255,255,255,.14); border-radius: 12px; padding: 10px 14px; margin: 0 0 12px; font-weight: 600; }
.signup-msg-bad { background: #FBEAE6; color: #7A2E1F; }
aside .signup-box { margin-top: 16px; padding: 20px 18px; }
aside .signup-title { font-size: 1.15rem; }
aside .signup-form .btn { flex: 1 1 100%; }

/* Phones: on the homepage, deals come first, above the hero */
@media (max-width: 760px) {
  body.home main { display: flex; flex-direction: column; }
  body.home #deals { order: -2; padding-top: 18px; }
  body.home .hero { order: -1; padding: 30px 0 34px; }
  body.home .hero h1 { font-size: 2rem; }
  body.home .hero-art { display: none; }
  body.home #deals .section-head h2 { font-size: 1.4rem; }
}

@media (max-width: 760px) {
  body.home #deals .chip-row { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; margin-right: -20px; padding-right: 20px; }
  body.home #deals .chip-row::-webkit-scrollbar { display: none; }
  body.home #deals .chip { flex-shrink: 0; }
}

.deal-disclosure{font-size:.8rem; color:var(--muted); margin:10px 0 36px;}