:root{
  --bg:#F7F8F7; --surface:#FFFFFF; --soft:#F1F2F1; --ink:#323234; --muted:#767677; --line:#E3E6E4; --line-strong:#D8DBDA;
  --red:#DD2127; --red-dark:#B9161C; --red-soft:#FED7D8; --hero:#141416; --ok:#1E7A4C; --link:#0074B6;
  --nav-h:4.25rem;
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#18181A; --surface:#232325; --soft:#2B2B2E; --ink:#F2F3F2; --muted:#A9A9AB; --line:#333336; --line-strong:#444447;
    --red:#E3333A; --red-dark:#C4232A; --red-soft:#4A1C22; --hero:#0E0E10; --ok:#5BD192; --link:#5AB4E8;
    color-scheme:dark;
  }
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:calc(var(--nav-h) + env(safe-area-inset-top,0px) + 1rem)}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font:400 1rem/1.5 "Nunito Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.wrap{max-width:84rem;margin:0 auto;padding:0 clamp(1rem,4vw,3rem)}
svg.i{width:1.15em;height:1.15em;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--link);outline-offset:2px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.logo {
    display: block;
    background: url(./images/logo.png) no-repeat;
    width: 108px;
    height: 35px;
}

/* ---------- Top nav ---------- */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--surface);z-index:31}
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--surface);border-bottom:1px solid var(--line);box-shadow:0 1px 8px rgba(0,0,0,.04)}
.nav .wrap{display:flex;align-items:center;gap:1.5rem;height:var(--nav-h)}
.brand {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    text-decoration: none;
    flex: none;
    margin-right: 50px;
}
.brand .num{font:900 1.9rem/1 "Nunito Sans",sans-serif;color:var(--red);letter-spacing:-.04em}
.brand .bar{width:2.5px;height:1.9rem;background:var(--ink);border-radius:2px}
.brand .words{font:900 .82rem/.95 "Nunito Sans",sans-serif;text-transform:uppercase;margin-left:.2rem}
.links{display:flex;gap:1.4rem;margin:0;padding:0;list-style:none}
.links a{text-decoration:none;font-weight:700;padding:.4rem 0;border-bottom:2.5px solid transparent;white-space:nowrap}
.links a[aria-current="page"]{color:var(--red);border-color:var(--red)}
.links a:hover{color:var(--red)}
.count-dot{display:inline-grid;place-items:center;min-width:1.25rem;height:1.25rem;padding:0 .3rem;margin-left:.3rem;border-radius:1rem;background:var(--red);color:#fff;font-size:.72rem;font-weight:800;vertical-align:1px}
.navsearch{margin-left:auto;flex:0 1 20rem;min-width:0;display:flex;align-items:center;gap:.5rem;background:var(--soft);border-radius:.5rem;padding:0 .9rem;color:var(--muted)}
.navsearch input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:inherit;padding:.65rem 0}
.navsearch input:focus{outline:none}
.navsearch:focus-within{box-shadow:0 0 0 2px var(--ink)}

/* ---------- Carousel ---------- */
.carousel{position:relative;background:var(--hero);color:#fff;overflow:hidden}
.slides{display:flex;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.slide{flex:0 0 100%;position:relative;overflow:hidden;min-height:22rem;display:flex;align-items:center}
.slide .bgimg{position:absolute;inset:0 0 0 auto;width:min(60%,52rem);background-size:cover;background-position:center}
.slide .bgimg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--hero) 0%,rgba(20,20,22,.7) 30%,rgba(20,20,22,0) 70%)}
.slide .slash{position:absolute;right:-4rem;bottom:-1px;width:10rem;height:85%;background:var(--red);transform:skewX(-24deg);transform-origin:bottom right}
.slide .glow{position:absolute;inset:0;background:radial-gradient(55rem 28rem at 85% 15%,rgba(221,33,39,.25),transparent 60%)}
.slide .wrap{position:relative;width:100%;padding-top:2.5rem;padding-bottom:3.5rem;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:2rem;align-items:center}
.slide h1,.slide h2{font:900 clamp(2.2rem,5.5vw,4rem)/1.02 "Nunito Sans",sans-serif;letter-spacing:-.03em;margin:0 0 .8rem}
.slide .lede{font-size:clamp(1rem,1.7vw,1.25rem);max-width:36rem;margin:0 0 1.5rem;opacity:.95}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;color:#fff;background:rgba(255,255,255,.12);padding:.3rem .7rem;border-radius:2rem;margin-bottom:1rem}
.features{display:flex;flex-wrap:wrap;gap:1rem 0;margin:0;padding:0;list-style:none}
.features li{display:flex;align-items:center;gap:.75rem;padding:0 1.4rem;border-left:1px solid rgba(255,255,255,.35);font-weight:800;line-height:1.2;font-size:.95rem}
.features li:first-child{padding-left:0;border-left:0}
.features svg{width:2rem;height:2rem;color:var(--red);stroke-width:1.8}
.slide .art{justify-self:end;width:min(100%,20rem);aspect-ratio:1;border-radius:1.25rem;display:grid;place-items:center;position:relative;z-index:1;box-shadow:0 20px 50px rgba(0,0,0,.35);overflow:hidden}
.slide .art img.photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.slide .art .biglogo{width:45%;aspect-ratio:1;border-radius:50%;background:#fff;display:grid;place-items:center;overflow:hidden;font:900 3.5rem/1 "Nunito Sans",sans-serif;color:#323234;position:relative}
.slide .art .biglogo img{max-width:72%;max-height:72%;object-fit:contain}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-weight:800;text-decoration:none;border-radius:.45rem;padding:.8rem 1.3rem;border:0;cursor:pointer;line-height:1.2}
.btn.red{background:var(--red);color:#fff}
.btn.red:hover{background:var(--red-dark)}
.btn.outline{background:transparent;border:2px solid currentColor}
.cnav{position:absolute;left:0;right:0;bottom:1rem}
.cnav .wrap{display:flex;align-items:center;gap:.5rem}
.dot{width:2.25rem;height:.3rem;border-radius:1rem;border:0;padding:0;background:rgba(255,255,255,.35);cursor:pointer}
.dot[aria-current="true"]{background:#fff}
.carr{margin-left:auto;display:flex;gap:.5rem}
.carr button{width:2.4rem;height:2.4rem;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(0,0,0,.25);color:#fff;display:grid;place-items:center;cursor:pointer}

/* ---------- Sections & rows ---------- */
section.block{padding:2.25rem 0 .5rem}
.sechead{display:flex;align-items:center;gap:1rem;margin:0 0 1rem}
.sechead h2{font:800 1.6rem/1.2 "Nunito Sans",sans-serif;margin:0;letter-spacing:-.01em}
.sechead .see{margin-left:auto;font-weight:700;color:var(--red);text-decoration:none;white-space:nowrap}
.sechead .arrows{display:flex;gap:.4rem;margin-left:auto}
.sechead .see+.arrows{margin-left:0}
.sechead .arrows button{width:2.3rem;height:2.3rem;border-radius:50%;border:1px solid var(--line-strong);background:var(--surface);display:grid;place-items:center;cursor:pointer}
.sechead .arrows button:disabled{opacity:.35;cursor:default}
.row{display:grid;grid-auto-flow:column;grid-auto-columns:min(78vw,17.5rem);gap:1.1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:.25rem .25rem 1rem;margin:0 -.25rem;scrollbar-width:none}
.row::-webkit-scrollbar{display:none}
.row>*{scroll-snap-align:start}
.band{background:linear-gradient(180deg,#FDECEC 0%,transparent 100%)}
@media (prefers-color-scheme: dark){.band{background:linear-gradient(180deg,#2A1A1C 0%,transparent 100%)}}

/* ---------- Offer card ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:.7rem;overflow:hidden;display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.08)}
.media{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;text-decoration:none}
.media .photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.media .fill{position:absolute;inset:0;display:grid;place-items:center}
.media .fill .mid{width:5rem;height:5rem;border-radius:50%;background:#fff;display:grid;place-items:center;overflow:hidden;font:900 2.2rem/1 "Nunito Sans",sans-serif;color:#323234;box-shadow:0 6px 18px rgba(0,0,0,.08)}
.media .fill .mid img{max-width:72%;max-height:72%;object-fit:contain}
.corner{position:absolute;top:.6rem;right:.6rem;width:3.2rem;height:3.2rem;border-radius:.45rem;background:#fff;display:grid;place-items:center;overflow:hidden;font:900 1.3rem/1 "Nunito Sans",sans-serif;color:#323234;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.corner img{max-width:80%;max-height:80%;object-fit:contain}
.type{position:absolute;left:.6rem;bottom:.6rem;background:rgba(20,20,22,.72);color:#fff;font-size:.75rem;font-weight:700;padding:.2rem .55rem;border-radius:.3rem}
.tag{position:absolute;right:.6rem;bottom:.6rem;display:inline-flex;align-items:center;gap:.3rem;background:#fff;color:var(--red);font-size:.75rem;font-weight:800;padding:.2rem .55rem;border-radius:.3rem}
.tag svg{width:.95em;height:.95em}
.cbody{padding:.85rem 1rem 1rem;display:flex;flex-direction:column;gap:.35rem;flex:1}
.cbrand{font-size:.85rem;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.ctitle{font-weight:700;font-size:1.02rem;line-height:1.35;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.ctitle:hover{color:var(--red)}
.cact{display:flex;align-items:center;gap:.6rem;margin-top:auto;padding-top:.6rem}
.savebtn{background:var(--red);color:#fff;font-weight:800;font-size:.9rem;text-decoration:none;padding:.5rem 1rem;border-radius:.4rem;white-space:nowrap}
.savebtn:hover{background:var(--red-dark)}
.bm{width:2.3rem;height:2.3rem;border-radius:.4rem;border:1px solid var(--line-strong);background:var(--surface);display:grid;place-items:center;cursor:pointer;color:var(--ink)}
.bm[aria-pressed="true"]{color:var(--red);border-color:var(--red)}
.bm[aria-pressed="true"] svg{fill:currentColor}
.ends-mini{margin-left:auto;font-size:.8rem;color:var(--muted);white-space:nowrap}

/* ---------- Category tiles ---------- */
.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:.8rem}
.cattile{display:flex;align-items:center;gap:.8rem;background:var(--surface);border:1px solid var(--line);border-radius:.6rem;padding:1rem 1.1rem;text-decoration:none;font-weight:700}
.cattile:hover{border-color:var(--red);color:var(--red)}
.cattile svg{width:1.6rem;height:1.6rem;color:var(--red);stroke-width:1.7}
.cattile small{margin-left:auto;color:var(--muted);font-weight:600}

/* ---------- Listing page ---------- */
.pagehead{padding:2rem 0 1rem}
.pagehead h1{font:900 clamp(2rem,4vw,2.8rem)/1.1 "Nunito Sans",sans-serif;margin:0 0 .3rem;letter-spacing:-.02em}
.pagehead p{margin:0;color:var(--muted)}
.crumb{display:inline-flex;align-items:center;gap:.35rem;font-weight:700;text-decoration:none;color:var(--muted);margin-bottom:.75rem}
.crumb:hover{color:var(--red)}
.filters{display:flex;flex-wrap:wrap;gap:.75rem 1rem;align-items:center;margin:0 0 1.25rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{font-weight:700;font-size:.9rem;border:1px solid var(--line-strong);background:var(--surface);padding:.5rem 1.1rem;border-radius:2rem;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}
.sort{margin-left:auto;display:flex;align-items:center;gap:.5rem;font-weight:700}
.sort select{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:.4rem;padding:.45rem .6rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,16.5rem),1fr));gap:1.1rem;padding-bottom:3rem}
.empty{grid-column:1/-1;background:var(--surface);border:1px solid var(--line);border-radius:.6rem;padding:3rem 1rem;text-align:center;color:var(--muted)}
.resultnote{color:var(--muted);margin:-.25rem 0 1rem}

/* ---------- A–Z ---------- */
.letters{display:flex;flex-wrap:wrap;gap:.35rem;margin:0 0 1.5rem}
.letters a,.letters span{width:2.2rem;height:2.2rem;display:grid;place-items:center;border-radius:.4rem;font-weight:800;text-decoration:none;background:var(--surface);border:1px solid var(--line)}
.letters span{opacity:.35}
.letters a:hover{border-color:var(--red);color:var(--red)}
.azgroup{margin:0 0 1.75rem}
.azgroup h2{font:800 1.1rem "Nunito Sans",sans-serif;background:var(--soft);padding:.4rem .9rem;border-radius:.4rem;margin:0 0 1rem}
.brands{display:grid;grid-template-columns:repeat(auto-fill,minmax(9rem,1fr));gap:1rem}
.brandtile{display:flex;flex-direction:column;align-items:center;gap:.6rem;text-align:center;text-decoration:none;padding:1rem .5rem;border-radius:.6rem;border:1px solid transparent}
.brandtile:hover{background:var(--surface);border-color:var(--line)}
.brandtile .lg{width:5rem;height:5rem;border-radius:.7rem;background:#fff;border:1px solid var(--line);display:grid;place-items:center;overflow:hidden;font:900 2rem/1 "Nunito Sans",sans-serif;color:#323234}
.brandtile .lg img{max-width:78%;max-height:78%;object-fit:contain}
.brandtile b{font-weight:700}
.brandtile small{color:var(--muted)}

/* ---------- Offer detail ---------- */
.detail{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:2rem;align-items:start;padding-bottom:1rem}
.dmedia{position:relative;aspect-ratio:16/9;border-radius:.8rem;overflow:hidden}
.dmedia .photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dmedia .fill{position:absolute;inset:0;display:grid;place-items:center}
.dmedia .fill .mid{width:8rem;height:8rem;border-radius:50%;background:#fff;display:grid;place-items:center;overflow:hidden;font:900 3.5rem/1 "Nunito Sans",sans-serif;color:#323234;box-shadow:0 10px 30px rgba(0,0,0,.1)}
.dmedia .fill .mid img{max-width:72%;max-height:72%;object-fit:contain}
.dmedia .corner{width:4.5rem;height:4.5rem;top:1rem;right:1rem}
.acc{margin-top:1.25rem;display:flex;flex-direction:column;gap:.6rem}
.acc details{background:var(--surface);border:1px solid var(--line);border-radius:.55rem}
.acc summary{cursor:pointer;list-style:none;padding:.95rem 1.1rem;font-weight:800;display:flex;align-items:center;justify-content:space-between}
.acc summary::-webkit-details-marker{display:none}
.acc summary svg{transition:transform .2s}
.acc details[open] summary svg{transform:rotate(180deg)}
.acc .inner{padding:0 1.1rem 1.1rem;color:var(--ink)}
.acc .inner p{margin:0 0 .6rem;white-space:pre-line}
.acc ol{margin:0;padding-left:1.25rem}
.acc li{margin:.3rem 0}
.panel{position:sticky;top:calc(var(--nav-h) + env(safe-area-inset-top,0px) + 1rem);background:var(--surface);border:1px solid var(--line);border-radius:.8rem;padding:1.4rem;box-shadow:0 6px 24px rgba(0,0,0,.05);display:flex;flex-direction:column;gap:.9rem}
.panel .pill{align-self:flex-start;background:var(--red-soft);color:var(--red);font-weight:800;padding:.35rem .9rem;border-radius:2rem;letter-spacing:.02em}
.panel h1{font:800 1.6rem/1.2 "Nunito Sans",sans-serif;margin:0;letter-spacing:-.01em}
.panel .by{display:flex;align-items:center;gap:.6rem;font-weight:700;color:var(--muted)}
.panel .by .lg{width:2.2rem;height:2.2rem;border-radius:50%;background:#fff;border:1px solid var(--line);display:grid;place-items:center;overflow:hidden;font-weight:900;color:#323234}
.panel .by .lg img{max-width:72%;max-height:72%}
.facts{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.4rem 1rem;font-size:.95rem;border-top:1px solid var(--line);padding-top:.9rem}
.facts dt{color:var(--muted)}
.facts dd{margin:0;text-align:right;font-weight:700}
.code{display:flex;align-items:stretch;border:1.5px dashed var(--line-strong);border-radius:.45rem}
.code .val{flex:1;display:flex;align-items:center;gap:.6rem;padding:.7rem .9rem;font-weight:800;letter-spacing:.06em;min-width:0;overflow-wrap:anywhere}
.code button{display:flex;align-items:center;gap:.45rem;font-weight:700;border:0;border-left:1.5px dashed var(--line-strong);background:transparent;color:var(--red);padding:0 1rem;cursor:pointer;white-space:nowrap}
.code button.done{color:var(--ok)}
.nocode{color:var(--muted);font-size:.92rem;margin:0}
.panel .btn{width:100%}
.panel .small{font-size:.82rem;color:var(--muted);margin:0;text-align:center}
.savelater{background:transparent;border:1px solid var(--line-strong);color:var(--ink)}
.savelater[aria-pressed="true"]{color:var(--red);border-color:var(--red)}
.savelater[aria-pressed="true"] svg{fill:currentColor}

/*footer{border-top:1px solid var(--line);margin-top:2rem;padding:1.75rem 0 2.5rem;color:var(--muted);font-size:.85rem}
footer .wrap{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between}
footer .brand .bar{background:var(--muted)}*/
.footer {
    float: left;
    width: 100%;
    border-top: 1px solid var(--line);
    margin-top: 2rem;
    padding: 0;
    color: var(--muted);
    font-size: .85rem;
}

    .footer .wf-container-footer {
        padding: 50px 0 60px;
        display: flex;
        flex-direction: column;
        width: 100%
    }

        .footer .wf-container-footer .logo {
            margin-bottom: 10px;
            width: 180px;
        }

.footer_accordion {
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    color: #313a3f;
    padding: 20px 0 0;
    cursor: pointer;
    width: 100%;
    border: 0;
    text-align: left;
    outline: 0;
    transition: .4s;
    padding: 20px 0 0;
    margin: 0 0 20px;
}

    .footer_accordion:after {
        content: url(./images/downArrow.png);
        float: right;
        margin-left: 5px;
        line-height: 30px;
    }

.footer_active:after {
    content: url(./images/upArrow.png);
}

.footer_holder {
    border-bottom: 1px solid #e0e0e0;
}

.footer_panel {
    padding: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height .2s ease-out;
    font-size: 14px;
    line-height: 150%;
    letter-spacing: .012em;
    color: #767677;
    width: 100%
}

.footer .wf-container-footer ul li {
    margin: 0 0 5px;
    list-style:none;
}

    .footer .wf-container-footer ul li:last-child {
        border: 0;
    }

    .footer .wf-container-footer ul li a {
        color: #878f9d;
        font-size: 14px;
        font-weight: 400;
        display: inline-block;
        text-decoration:none;
    }

        .footer .wf-container-footer ul li a:hover {
            color: #7a818c;
        }

.footer .wf-container-footer .social {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin: 30px 0;
}

    .footer .wf-container-footer .social img {
        padding-right: 10px;
    }

.footer .footer-bottom {
    padding-top: 8px;
    padding-bottom: 8px;
    display: inline-block;
    width: 100%;
    font-size: 10px;
    font-weight: 400;
    color: #767677;
}

.footerPanel {
    display: flex;
    justify-content: space-between;
}

@media (max-width:60rem){
  .links{display:none}
  .slide .wrap{grid-template-columns:1fr}
  .slide .art{display:none}
  .detail{grid-template-columns:1fr}
  .panel{position:static}
}
@media (max-width:42rem){
  .nav .wrap{gap:.75rem}
  .navsearch{flex:1}
  .features{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
  .features li{padding:0;border-left:0}
  .slide .slash{width:4rem;height:35%}
  .slide .bgimg{width:100%;opacity:.35}
  .chips{flex-wrap:nowrap;overflow-x:auto;margin:0 -1rem;padding:0 1rem .25rem;scrollbar-width:none}
  .chip{flex:none}
  .sort{margin-left:0}
  .sechead .arrows{display:none}
}
/* Mobile bottom tabs, since the top links hide on small screens */
.tabs{display:none}
@media (max-width:60rem){
  .tabs{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--line);padding:.35rem 0 calc(.35rem + env(safe-area-inset-bottom,0px))}
  .tabs a{flex:1;display:flex;flex-direction:column;align-items:center;gap:.15rem;font-size:.72rem;font-weight:700;text-decoration:none;color:var(--muted);padding:.25rem}
  .tabs a svg{width:1.4rem;height:1.4rem}
  .tabs a[aria-current="page"]{color:var(--red)}
  body{padding-bottom:4.5rem}
}
@media (max-width:440px) {
    .brand {
        margin-right: 0px;
    }
}
    @media (prefers-reduced-motion:reduce) {
        .slides, .row {
            transition: none;
            scroll-behavior: auto
        }

        .card {
            transition: none
        }
    }
