@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=Playfair+Display:ital,wght@0,600;0,700;1,600;1,700&display=swap');

:root { --ink:#18263c; --paper:#f7f2e9; --cream:#fffdf8; --coral:#ed6a4a; --sun:#f7bf47; --mint:#c7e6cf; --line:#d9d0c2; --muted:#657080; --nav-h:76px; --sans:'DM Sans',sans-serif; --serif:'Playfair Display',serif; --mono:'DM Mono',monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + 18px); }
body { margin:0; padding-top:var(--nav-h); color:var(--ink); background:var(--paper); font-family:var(--sans); line-height:1.55; }
body::before { content:''; position:fixed; width:460px; height:460px; border-radius:50%; background:rgba(247,191,71,.18); filter:blur(12px); top:-280px; right:-140px; pointer-events:none; }
h1,h2,h3,h4,.navbar-brand { letter-spacing:-.04em; }
.navbar.site-nav { height:var(--nav-h); padding:0; background:rgba(247,242,233,.92)!important; border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.navbar.site-nav .navbar-brand { color:var(--ink); font-size:1.35rem; font-weight:700; }
.navbar.site-nav .navbar-brand::before { content:'✦'; margin-right:7px; color:var(--coral); font-size:.9rem; vertical-align:2px; }
.navbar.site-nav .nav-link { color:var(--ink)!important; font-size:.9rem; font-weight:600; margin-left:.35rem; padding:.4rem .7rem!important; }
.navbar.site-nav .nav-link:hover,.navbar.site-nav .nav-link.active { color:var(--coral)!important; }
.navbar.site-nav .navbar-toggler { border-color:var(--line); }.navbar.site-nav .navbar-toggler-icon { filter:invert(15%) sepia(18%) saturate(1641%); }

.hero { padding:4.5rem 0 3rem; text-align:center; }.hero-kopon { min-height:520px; display:flex; align-items:center; position:relative; overflow:hidden; background:linear-gradient(115deg,var(--cream) 0 58%,#f2d69f 58% 100%); }
.hero-kopon::after { content:'SAVE'; position:absolute; right:4%; bottom:-3.7rem; font-family:var(--serif); color:rgba(24,38,60,.08); font-size:clamp(7rem,19vw,16rem); font-weight:700; font-style:italic; line-height:1; pointer-events:none; }
.hero .container { position:relative; z-index:1; }.eyebrow { margin:0 0 .75rem; font:500 .72rem var(--mono); letter-spacing:.14em; color:var(--coral); }
.hero h1 { max-width:820px; margin:0 auto .9rem; font:700 clamp(2.6rem,6vw,5rem)/.98 var(--serif); }.hero h1 em { color:var(--coral); }
.hero .lead { max-width:510px; margin:auto; color:var(--muted); font-size:1.06rem; }
.search-wrap { display:flex; max-width:570px; margin:2rem auto 0; padding:5px; border:1px solid var(--ink); border-radius:4px; background:var(--cream); box-shadow:7px 7px 0 var(--ink); }
.search-wrap .form-control { border:0; background:transparent; color:var(--ink); box-shadow:none!important; padding:.8rem 1rem; }.search-wrap .form-control::placeholder { color:#8a8d91; }
.btn-search,.btn-accent { border:0; border-radius:2px; background:var(--coral); color:white; font-weight:700; }.btn-search { padding:.7rem 1.1rem; white-space:nowrap; }
.btn-search span,.btn-accent span { margin-left:8px; }.hero-proof { margin-top:1.5rem; color:var(--muted); font-size:.78rem; }.hero-proof span { color:var(--coral); margin:0 .45rem; }

.section-block { padding:5.5rem 0; }.section-intro { display:flex; align-items:end; justify-content:space-between; gap:2rem; margin-bottom:2.2rem; }
.section-intro h2,.how-it-works h2 { margin:0; font:700 clamp(2rem,4vw,3.35rem)/1 var(--serif); }.section-intro h2 span,.how-it-works h2 span { color:var(--coral); font-style:italic; }
.section-intro > p { max-width:330px; margin:0; color:var(--muted); font-size:.93rem; }.store-directory { background:var(--paper); }
.brand-tile { position:relative; display:flex; min-height:170px; padding:1.45rem; flex-direction:column; justify-content:center; align-items:center; background:var(--cream); border:1px solid var(--line); color:var(--ink); text-decoration:none; transition:transform .2s,box-shadow .2s,background .2s; }
.brand-tile:hover { transform:translate(-5px,-5px); box-shadow:7px 7px 0 var(--ink); background:#fff; color:var(--ink); }.brand-tile .brand-store-logo { max-width:135px; max-height:44px; width:auto; margin-bottom:1rem; }.brand-tile small { color:var(--muted); font-size:.75rem; }
.store-number { position:absolute; top:12px; left:14px; font:500 .7rem var(--mono); color:var(--coral); }.store-arrow { position:absolute; right:14px; top:11px; font-size:1.3rem; }.featured-store { background:var(--mint); border-color:var(--ink); }
.featured-store::after { content:'TOP PICK'; position:absolute; top:14px; right:40px; font:500 .58rem var(--mono); letter-spacing:.08em; }

.deal-spotlight { background:var(--ink); color:var(--cream); position:relative; overflow:hidden; }.deal-spotlight::before { content:''; position:absolute; width:500px; height:500px; border:1px solid rgba(255,255,255,.12); border-radius:50%; top:-260px; left:-130px; }
.deal-spotlight .section-intro { position:relative; }.deal-spotlight .section-intro h2 { color:var(--cream); }.deal-spotlight .section-intro > p { color:#b8c0cb; }
.feature-card { height:100%; background:#21334d; padding:1.65rem; border:1px solid rgba(255,255,255,.15); transition:transform .2s,background .2s; }.feature-card:hover { background:#2a405e; transform:translateY(-5px); }.feature-card .card-body { padding:0; }
.deal-chip { display:inline-block; margin-bottom:2.4rem; padding:.25rem .45rem; background:var(--sun); color:var(--ink); font:500 .62rem var(--mono); letter-spacing:.08em; }.feature-card .card-title { color:var(--cream); font:600 1.4rem/1.12 var(--serif); }
.feature-card .card-text { min-height:48px; color:#c5cbd5; font-size:.9rem; }.btn-accent { padding:.65rem .85rem; background:var(--sun); color:var(--ink); border-radius:0; font-size:.86rem; }.btn-accent:hover { background:var(--cream); color:var(--ink); }

.how-it-works { background:var(--cream); }.how-grid { display:grid; grid-template-columns:1fr 1.25fr; gap:6rem; align-items:center; }.how-grid ol { padding:0; margin:0; list-style:none; counter-reset:steps; }
.how-grid li { display:grid; grid-template-columns:47px 1fr; column-gap:14px; padding:1.1rem 0; border-top:1px solid var(--line); counter-increment:steps; }.how-grid li::before { content:'0' counter(steps); color:var(--coral); font:500 .78rem var(--mono); padding-top:3px; }
.how-grid li b { display:block; margin-bottom:.15rem; font-size:1rem; }.how-grid li span { grid-column:2; color:var(--muted); font-size:.9rem; }

/* Store coupon pages */
.breadcrumb-nav { padding:1.4rem 0 .2rem; }.breadcrumb { --bs-breadcrumb-divider-color:var(--muted); margin:0; }.breadcrumb-item,.breadcrumb-item a { color:var(--muted); font-size:.82rem; text-decoration:none; }.breadcrumb-item a:hover { color:var(--coral); }.breadcrumb-item.active { color:var(--ink); }
body:not(.homepage) .hero { padding:3rem 0 2.7rem; background:var(--cream); border-bottom:1px solid var(--line); }.brand-logo { display:block; max-width:160px; max-height:58px; width:auto; margin:0 auto 1.25rem; }
body:not(.homepage) .hero h1 { font-size:clamp(2.25rem,5vw,3.8rem); }body:not(.homepage) .hero .lead { color:var(--muted); }.coupons-section { padding:3.8rem 0 4.5rem; }
.coupon-card { height:100%; padding:1.55rem; background:var(--cream); border:1px solid var(--line); border-left:6px solid var(--accent,var(--coral)); box-shadow:0 3px 0 rgba(24,38,60,.04); transition:transform .2s,box-shadow .2s; }.coupon-card:hover { transform:translateY(-4px); box-shadow:0 12px 20px rgba(24,38,60,.10); }
.coupon-title { min-height:45px; font:600 1.23rem/1.15 var(--serif); color:var(--ink); }.coupon-code { display:inline-block; margin:1rem 0; padding:.65rem .8rem; border:1px dashed var(--ink); background:#f3eadc; color:var(--ink); font:500 .95rem var(--mono); letter-spacing:.1em; }
.btn-copy { display:block; width:100%; padding:.7rem; cursor:pointer; border:1px solid var(--ink); background:transparent; color:var(--ink); font-weight:700; transition:.2s; }.btn-copy:hover { background:var(--ink); color:var(--cream); }.copied-msg { display:none; margin-top:.55rem; color:#2d8560; font-size:.85rem; }
.pagination .page-link { margin:0 2px; border-color:var(--line); background:var(--cream); color:var(--ink); border-radius:0!important; }.pagination .page-item.active .page-link { background:var(--coral); border-color:var(--coral); }.pagination .page-item.disabled .page-link { background:transparent; }
body.brand-amazon { --accent:#f7a11b; } body.brand-namshi { --accent:#b45c8a; } body.brand-jumia { --accent:#ed7d24; } body.brand-shein { --accent:#ad607a; } body.brand-aliexpress { --accent:#e55349; } body.brand-carrefour { --accent:#1689bc; }
footer.site-footer { padding:2rem 1rem; background:var(--ink); color:#c5cbd5; text-align:center; font-size:.83rem; } footer.site-footer p { margin:0; }

@media (max-width:767px) { .navbar.site-nav { height:auto; min-height:var(--nav-h); }.navbar-collapse { padding:1rem 0; }.navbar.site-nav .nav-link { margin:0; }.hero-kopon { min-height:480px; background:var(--cream); }.hero-kopon::after { right:-35px; }.search-wrap { flex-direction:column; box-shadow:4px 4px 0 var(--ink); }.btn-search { width:100%; }.section-block { padding:3.7rem 0; }.section-intro { display:block; }.section-intro > p { margin-top:1rem; }.how-grid { grid-template-columns:1fr; gap:2.2rem; }.coupon-title { min-height:0; } }
