/*
Theme Name: ShakSobji
Theme URI: https://shaksobji.com
Author: ShakSobji
Description: Premium custom theme for ShakSobji, a Bangladesh-based rescued-veg subscription box company. Bilingual (Bangla/English) with a language toggle, built for WooCommerce (products, cart, checkout, orders).
Version: 1.1
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
Text Domain: shaksobji
*/

:root{
  --orange:#FF4405; --orange-deep:#E63900; --orange-soft:#FF6B33;
  --charcoal:#1B1410; --charcoal-2:#241B15;
  --gold:#FFC94D; --gold-deep:#F0AE1F;
  --cream:#FFF6EC; --white:#FFFFFF;
  --ink:#1B1410; --ink-soft:rgba(27,20,16,0.65);
  --line:rgba(27,20,16,0.10);
  --radius:22px; --shadow:0 20px 60px rgba(27,20,16,0.14);
  --shadow-lg:0 30px 80px rgba(27,20,16,0.22);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{ background:var(--white); color:var(--ink); font-family:'Hind Siliguri','Manrope',sans-serif; overflow-x:hidden; }
body.en [class*="bn-block"]{display:none !important;}
body:not(.en) [class*="en-block"]{display:none !important;}
.display{ font-family:'Baloo Da 2','Hind Siliguri',sans-serif; letter-spacing:-0.01em; }
.mono{ font-family:'IBM Plex Mono',monospace; letter-spacing:0.03em; }
.wrap{ max-width:1200px; margin:0 auto; padding:0 28px; }
a{ color:inherit; }
img{ max-width:100%; }

/* Header (no longer wraps the ticker — ticker sits under the hero instead) */
header{ position:sticky; top:0; z-index:60; background:rgba(255,255,255,0.97); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.ticker{ background:var(--charcoal); color:var(--gold); overflow:hidden; white-space:nowrap; padding:12px 0; }
.ticker-track{ display:inline-block; animation:ticker-scroll 28s linear infinite; }
.ticker-track span{ display:inline-block; padding:0 28px; font-family:'IBM Plex Mono'; font-size:12.5px; font-weight:500; letter-spacing:0.03em; }
.ticker-track span::after{ content:"•"; margin-left:28px; color:var(--orange); }
@keyframes ticker-scroll{ 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }
@media (prefers-reduced-motion: reduce){ .ticker-track{ animation:none; } }

/* Header */
.nav{ display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:1200px; margin:0 auto; }
.logo{ font-family:'Baloo Da 2'; font-weight:800; font-size:24px; color:var(--ink); display:flex; align-items:center; gap:6px; text-decoration:none; letter-spacing:-0.02em; }
.logo .dot{ color:var(--orange); }
.nav-links{ display:flex; gap:26px; list-style:none; }
.nav-links a{ text-decoration:none; color:var(--ink); font-weight:600; font-size:14.5px; opacity:0.75; }
.nav-links a:hover{ opacity:1; color:var(--orange-deep); }
.nav-right{ display:flex; align-items:center; gap:16px; }
.nav-login{ display:flex; align-items:center; gap:6px; font-weight:700; font-size:14px; text-decoration:none; color:var(--ink); opacity:0.8; }
.nav-login:hover{ opacity:1; }
.lang-toggle{ display:flex; border:1.5px solid var(--ink); border-radius:999px; overflow:hidden; font-size:12.5px; font-weight:700; }
.lang-toggle button{ border:none; background:transparent; padding:6px 13px; cursor:pointer; font-family:'Hind Siliguri'; font-weight:700; color:var(--ink); }
.lang-toggle button.active{ background:var(--ink); color:var(--white); }

/* Buttons */
.btn{ display:inline-flex; align-items:center; gap:8px; background:var(--charcoal); color:var(--white) !important; padding:14px 30px; border-radius:999px; font-weight:700; font-size:14.5px; text-decoration:none; border:none; cursor:pointer; transition:transform .18s ease,box-shadow .18s ease,background .18s ease; box-shadow:0 8px 20px rgba(27,20,16,0.18); }
.btn:hover{ background:#000; transform:translateY(-2px); box-shadow:0 14px 30px rgba(27,20,16,0.26); }
.btn-orange{ background:var(--orange); }
.btn-orange:hover{ background:var(--orange-deep); }
.btn-dark{ background:var(--charcoal); }
.btn-ghost{ background:transparent; color:var(--charcoal) !important; border:2px solid var(--charcoal); padding:12px 28px; box-shadow:none; }
.btn-ghost:hover{ background:var(--charcoal); color:var(--white) !important; }
.btn-ghost-light{ background:transparent; color:var(--white) !important; border:2px solid rgba(255,255,255,0.55); padding:12px 28px; box-shadow:none; }
.btn-ghost-light:hover{ background:rgba(255,255,255,0.15); border-color:var(--white); }
.btn-sm{ padding:9px 18px; font-size:13.5px; }
.btn-block{ width:100%; justify-content:center; }

/* ---------- Hero — full-bleed premium orange, Oddbox-style ---------- */
.hero{ position:relative; padding:76px 0 84px; background:var(--orange); overflow:hidden; }
.hero::before{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 85% 15%, rgba(255,255,255,0.14), transparent 55%); pointer-events:none; }
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center; position:relative; z-index:1; }
.eyebrow{ display:inline-flex; align-items:center; gap:8px; background:rgba(27,20,16,0.14); border:1px solid rgba(255,255,255,0.4); padding:7px 16px; border-radius:999px; font-size:12.5px; font-weight:700; margin-bottom:22px; color:var(--charcoal); }
.eyebrow .dot{ width:6px; height:6px; border-radius:50%; background:var(--charcoal); }
h1.hero-head{ font-family:'Baloo Da 2'; font-weight:800; font-size:clamp(34px,4.8vw,58px); line-height:1.1; margin-bottom:22px; color:var(--charcoal); letter-spacing:-0.02em; }
h1.hero-head .accent{ color:var(--white); -webkit-text-stroke:1px var(--charcoal); }
.hero p.sub{ font-size:18px; color:rgba(27,20,16,0.82); max-width:480px; margin-bottom:30px; line-height:1.7; font-weight:500; }
.hero-cta-row{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:28px; }

.area-check-wrap{ max-width:440px; }
.area-check{ display:flex; gap:6px; background:var(--white); padding:7px; border-radius:999px; box-shadow:var(--shadow-lg); border:1px solid rgba(27,20,16,0.08); }
.area-check input{ flex:1; border:none; outline:none; background:transparent; padding:12px 18px; font-size:14.5px; font-family:inherit; }
.area-check button{ border:none; background:var(--charcoal); color:var(--white); font-weight:700; padding:12px 24px; border-radius:999px; cursor:pointer; font-family:inherit; }
.area-result{ margin-top:12px; font-size:14px; font-weight:700; padding:10px 18px; border-radius:14px; display:none; }
.area-result.show{ display:block; }
.area-result.ok{ background:rgba(27,20,16,0.9); color:var(--gold); }
.area-result.no{ background:rgba(255,255,255,0.85); color:var(--orange-deep); }

.hero-visual{ position:relative; height:420px; }
.crate{ position:absolute; border-radius:24px; box-shadow:var(--shadow-lg); overflow:hidden; }
.crate-1{ width:280px; height:280px; background:var(--charcoal); top:10px; left:54px; }
.crate-2{ width:200px; height:200px; background:var(--white); bottom:4px; right:10px; }
.produce-tag{ position:absolute; background:var(--white); border-radius:16px; padding:12px 16px; box-shadow:var(--shadow); font-size:12.5px; font-weight:700; display:flex; align-items:center; gap:8px; }
.tag-1{ top:44px; right:0; } .tag-2{ bottom:30px; left:0; } .tag-3{ top:170px; right:26px; }
.produce-emoji{ font-size:19px; }

section{ padding:72px 0; }
.section-head{ max-width:640px; margin-bottom:40px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-eyebrow{ font-family:'IBM Plex Mono'; font-size:12.5px; letter-spacing:.1em; color:var(--orange-deep); text-transform:uppercase; margin-bottom:12px; display:block; font-weight:700; }
h2{ font-family:'Baloo Da 2'; font-weight:700; font-size:clamp(28px,3.4vw,40px); line-height:1.15; color:var(--charcoal); letter-spacing:-0.015em; }
.section-head p{ margin-top:14px; font-size:16.5px; color:var(--ink-soft); line-height:1.7; }

/* Why us */
.why-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.why-card{ background:var(--cream); border-radius:var(--radius); padding:28px 24px; border:1px solid var(--line); transition:transform .2s; }
.why-card:hover{ transform:translateY(-4px); }
.why-card .icon{ width:46px; height:46px; border-radius:14px; background:var(--white); display:flex; align-items:center; justify-content:center; font-size:22px; margin-bottom:16px; box-shadow:var(--shadow); }
.why-card h3{ font-family:'Baloo Da 2'; font-size:17.5px; margin-bottom:8px; color:var(--charcoal); }
.why-card p{ font-size:14px; color:var(--ink-soft); line-height:1.6; }

/* Journey — dark charcoal section for premium contrast */
.journey{ background:var(--charcoal); color:var(--white); border-radius:32px; margin:0 20px; padding:64px 40px; }
.journey .wrap{ padding:0; max-width:1080px; }
.journey .section-eyebrow{ color:var(--gold); }
.journey h2{ color:var(--white); }
.journey .section-head p{ color:rgba(255,255,255,.72); }
.journey-steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; position:relative; margin-top:18px; }
.journey-steps::before{ content:""; position:absolute; top:24px; left:6%; right:6%; height:2px; background-image:repeating-linear-gradient(90deg,var(--orange) 0 10px,transparent 10px 20px); }
.j-step{ position:relative; padding-right:16px; }
.j-num{ width:48px; height:48px; border-radius:50%; background:var(--orange); color:var(--charcoal); display:flex; align-items:center; justify-content:center; font-weight:800; font-family:'IBM Plex Mono'; margin-bottom:18px; position:relative; z-index:2; font-size:14px; }
.j-step h3{ font-family:'Baloo Da 2'; font-size:17.5px; margin-bottom:7px; }
.j-step p{ font-size:13.8px; color:rgba(255,255,255,.72); line-height:1.6; }

/* Rescue list */
.rescue-callout{ display:grid; grid-template-columns:1fr 1fr; gap:52px; align-items:center; }
.rescue-mock{ background:var(--white); border-radius:24px; padding:28px; box-shadow:var(--shadow-lg); border:1px solid var(--line); }
.rescue-mock .rm-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; padding-bottom:14px; border-bottom:1px solid var(--line); }
.rescue-mock .rm-head strong{ font-family:'Baloo Da 2'; font-size:16px; color:var(--charcoal); }
.rescue-mock .rm-tag{ background:var(--cream); color:var(--orange-deep); font-size:11.5px; padding:4px 12px; border-radius:999px; font-weight:700; }
.rescue-item{ display:flex; justify-content:space-between; align-items:center; padding:12px 0; border-bottom:1px dashed var(--line); font-size:14px; }
.rescue-item:last-child{ border-bottom:none; }
.rescue-item .swap{ font-size:12px; color:var(--orange-deep); font-weight:700; }
.cutoff-note{ margin-top:14px; font-size:12.5px; color:var(--ink-soft); }

/* Bazaar */
.bazaar-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.bazaar-card{ background:var(--cream); border-radius:18px; padding:20px; border:1px solid var(--line); text-align:center; transition:transform .2s; }
.bazaar-card:hover{ transform:translateY(-3px); }
.bazaar-emoji{ font-size:30px; margin-bottom:10px; }
.bazaar-card h4{ font-family:'Baloo Da 2'; font-size:14.5px; margin-bottom:4px; color:var(--charcoal); }
.bazaar-card p{ font-size:12.5px; color:var(--ink-soft); }

/* Box / pricing cards */
.box-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.box-card{ background:var(--white); border-radius:var(--radius); padding:34px 28px; border:2px solid var(--line); position:relative; transition:transform .2s,box-shadow .2s; box-shadow:var(--shadow); }
.box-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.box-card.popular{ border-color:var(--orange); }
.ribbon{ position:absolute; top:-15px; left:28px; background:var(--charcoal); color:var(--gold); font-size:11.5px; font-weight:700; padding:6px 15px; border-radius:999px; }
.box-card .box-emoji{ font-size:32px; margin-bottom:12px; }
.box-card h3{ font-family:'Baloo Da 2'; font-size:22px; margin-bottom:6px; color:var(--charcoal); }
.box-card .desc{ font-size:14px; color:var(--ink-soft); margin-bottom:20px; line-height:1.6; min-height:42px; }
.box-card .price{ font-family:'IBM Plex Mono'; font-size:32px; color:var(--charcoal); font-weight:600; }
.box-card .price span{ font-size:13.5px; color:var(--ink-soft); font-family:'Hind Siliguri'; }
.box-card .btn-row{ display:flex; gap:10px; margin-top:22px; }
.box-card .btn-row .btn{ flex:1; justify-content:center; padding:12px 16px; font-size:13.5px; box-shadow:none; }
.freq-note{ text-align:center; margin-top:28px; font-size:14px; color:var(--ink-soft); }

/* Impact */
.impact{ background:var(--charcoal); color:var(--white); border-radius:32px; margin:0 20px; padding:60px 40px; }
.impact .wrap{ padding:0; max-width:1080px; }
.impact .section-eyebrow{ color:var(--gold); }
.impact h2{ color:var(--white); }
.impact-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:center; margin-top:22px; }
.impact-stat h3{ font-family:'IBM Plex Mono'; font-size:38px; color:var(--orange); }
.impact-stat p{ font-size:13.5px; color:rgba(255,255,255,.72); margin-top:6px; }

/* Referral */
.referral{ background:var(--gold); border-radius:28px; margin:0 20px; padding:46px 40px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.referral h3{ font-family:'Baloo Da 2'; font-size:23px; color:var(--charcoal); }
.referral p{ font-size:14px; color:rgba(27,20,16,0.75); margin-top:6px; }

/* Reviews */
.reviews-strip{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.review-card{ background:var(--cream); border-radius:20px; padding:26px; border:1px solid var(--line); }
.stars{ color:var(--orange); font-size:14px; margin-bottom:12px; letter-spacing:1px; }
.review-card p.quote{ font-size:14.5px; line-height:1.65; color:var(--charcoal); margin-bottom:16px; }
.review-card .who{ font-size:13px; font-weight:700; color:var(--orange-deep); }

/* FAQ */
.faq-list{ max-width:760px; margin:0 auto; }
.faq-item{ background:var(--cream); border-radius:16px; padding:20px 24px; margin-bottom:12px; border:1px solid var(--line); }
.faq-item summary{ font-weight:700; cursor:pointer; font-size:15px; color:var(--charcoal); }
.faq-item p{ margin-top:10px; font-size:14px; color:var(--ink-soft); line-height:1.65; }

/* Footer CTA + footer */
.footer-cta{ background:var(--orange); border-radius:32px; margin:0 20px; padding:64px 40px; text-align:center; }
.footer-cta h2{ color:var(--charcoal); margin-bottom:12px; }
.footer-cta p{ color:rgba(27,20,16,0.75); margin-bottom:26px; }
footer{ padding:56px 0 28px; background:var(--white); }
.foot-grid{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:30px; padding-bottom:28px; border-bottom:1px solid var(--line); }
.foot-col h5{ font-size:12.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--orange-deep); margin-bottom:14px; font-family:'IBM Plex Mono'; }
.foot-col a{ display:block; color:var(--ink); text-decoration:none; font-size:14px; margin-bottom:9px; opacity:.75; }
.foot-bottom{ padding-top:22px; font-size:12.5px; color:var(--ink-soft); text-align:center; }

/* Inner page hero */
.page-hero{ background:var(--charcoal); color:var(--white); padding:60px 0; text-align:center; border-radius:0 0 32px 32px; margin-bottom:12px; }
.page-hero h1{ font-family:'Baloo Da 2'; font-size:clamp(30px,4.2vw,44px); margin-bottom:14px; }
.page-hero p{ color:rgba(255,255,255,.75); max-width:560px; margin:0 auto; font-size:15.5px; line-height:1.7; }

@media (max-width:900px){
  .hero-grid{ grid-template-columns:1fr; } .hero-visual{ display:none; }
  .why-grid{ grid-template-columns:repeat(2,1fr); }
  .journey-steps{ grid-template-columns:1fr; gap:32px; } .journey-steps::before{ display:none; }
  .rescue-callout{ grid-template-columns:1fr; }
  .bazaar-grid{ grid-template-columns:repeat(2,1fr); }
  .box-grid{ grid-template-columns:1fr; }
  .impact-grid{ grid-template-columns:repeat(2,1fr); }
  .reviews-strip{ grid-template-columns:1fr; }
  .nav-links{ display:none; }
}

/* =========================================================
   WooCommerce overrides
   ========================================================= */
.woocommerce ul.products li.product{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; box-shadow:var(--shadow); }
.woocommerce ul.products li.product .price{ color:var(--charcoal); font-family:'IBM Plex Mono'; }
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce-page a.button{
  background:var(--orange) !important; color:var(--white) !important; border-radius:999px !important;
  padding:12px 26px !important; font-weight:700 !important; border:none !important; font-family:'Hind Siliguri','Manrope';
}
.woocommerce a.button:hover, .woocommerce button.button:hover{ background:var(--orange-deep) !important; }
.woocommerce-checkout #payment div.payment_box, .woocommerce-cart-form, .woocommerce-checkout-review-order{
  background:var(--cream); border-radius:var(--radius); padding:20px; border:1px solid var(--line);
}
.woocommerce table.shop_table{ border-radius:16px; overflow:hidden; border:1px solid var(--line); }
.woocommerce-message, .woocommerce-info{ border-top-color:var(--orange) !important; }
.woocommerce-message::before, .woocommerce-info::before{ color:var(--orange) !important; }
.woocommerce ul.products li.product .price ins{ background:none; color:var(--orange-deep); }