/* Site-wide theme — matches the premium zukroventures.in reference typography
   (Inter body + Plus Jakarta Sans headings), keeping the green farm brand. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap');

:root{ --zukro-green:#2d5b32; --zukro-green-dark:#1e4022; --zukro-gold:#fde047; }

/* One consistent type system across every page */
body{ font-family:'Inter', system-ui, -apple-system, sans-serif !important; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4,h5,h6,
.p-title,.card-title,.hp-title,.rev-h2,.rec-t,.page-header h1,.policy-hero h1,.about-hero h1,.hero h1{
  font-family:'Plus Jakarta Sans','Inter',system-ui,sans-serif !important;
  font-weight:700 !important;          /* reference uses bold headings, not regular */
  line-height:1.06 !important;
  letter-spacing:-0.03em !important;
}
/* hero / page titles read even bolder, like the reference display type */
.hero h1,.about-hero h1,.page-header h1,.policy-hero h1,.p-title{ font-weight:800 !important; }

/* ===== Phase A: reference fluid type scale ===== */
/* Hero / page titles scale fluidly (also fixes mobile overflow from fixed px sizes) */
.hero h1,.about-hero h1{ font-size:clamp(2.6rem,6vw,5rem) !important; }
.page-header h1,.policy-hero h1{ font-size:clamp(2.1rem,4.5vw,3.4rem) !important; }
/* Section headings */
.story-text h2,.process-section h2,.recs-section h2,.rev-h2,
section h2,.cta-section h2,.cta h2{ font-size:clamp(1.7rem,3.4vw,2.6rem) !important; }
/* Hero / intro paragraphs → calm, refined "lead" type */
.hero p,.about-hero p,.page-header p,.policy-hero p{
  font-size:clamp(1.05rem,1.6vw,1.3rem) !important; line-height:1.55 !important; opacity:.92; max-width:62ch;
}
/* Reusable reference utilities (for future/section use) */
.display{ font-size:clamp(2.6rem,7vw,6rem); font-weight:800; line-height:1; letter-spacing:-0.04em; }
.h-xl{ font-size:clamp(2.2rem,5vw,4rem); }
.h-lg{ font-size:clamp(1.8rem,3.5vw,2.8rem); }
.h-md{ font-size:clamp(1.3rem,2.2vw,1.8rem); }
.lead{ font-size:clamp(1.05rem,1.5vw,1.35rem); color:#475569; max-width:56ch; line-height:1.55; }

/* ===== Phase B: consistent section rhythm (generous, even whitespace like the
   reference) — content sections only; heroes keep their own spacing ===== */
section:not(.hero):not(.about-hero):not(.policy-hero):not(.modal-overlay){
  padding-top:clamp(56px,7vw,96px) !important;
  padding-bottom:clamp(56px,7vw,96px) !important;
}

/* ===== Phase C: component refinement ===== */
/* Cards — one consistent soft radius across the mixed card classes */
.card,.product-card,.hp-card,.process-card,.rec-card,.addr-card,.reward-card,
.order-card,.faq-item,.vip-bstat,.policy-box,.summary,.ci,.member-card{
  border-radius:10px !important;   /* professional radius — not bubble UI */
}
/* Soft, even shadows + a gentle hover lift on product cards */
.product-card,.hp-card,.rec-card,.process-card,.card{
  box-shadow:0 6px 22px rgba(16,24,40,.06) !important;
}
.product-card:hover,.hp-card:hover,.rec-card:hover{ box-shadow:0 14px 32px rgba(16,24,40,.11) !important; }

/* Buttons — unified pill shape + smooth motion across every button variant */
.btn,.btn-primary,.btn-view,.checkout-btn,.hp-btn,.btn-pay,.rev-submit,
.btn-action-main,.btn-track,.cta .btn,.ty-actions a{
  border-radius:8px !important;   /* structured button, not pill */
  transition:transform .18s ease, box-shadow .2s ease, background .2s ease !important;
}
.btn:hover,.btn-primary:hover,.btn-view:hover,.checkout-btn:hover,.hp-btn:hover,.btn-action-main:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(45,91,50,.18);
}

/* ===== Phase D: on-scroll reveal (set by reveal.js) ===== */
.zk-reveal{ opacity:0; transform:translateY(20px); transition:opacity .6s ease, transform .6s cubic-bezier(.22,1,.36,1); will-change:opacity,transform; }
.zk-reveal.zk-in{ opacity:1; transform:none; }
@media(prefers-reduced-motion:reduce){ .zk-reveal{ opacity:1 !important; transform:none !important; transition:none !important; } }

/* Brand green replaces stray Bootstrap / ad-hoc blue */
a{ color:#2d5b32; }
.navbar-nav .nav-link, .nav-link{ color:#1a1a1a !important; }
.navbar-nav .nav-link:hover{ color:#2d5b32 !important; }
.btn-primary{ background-color:#2d5b32 !important; border-color:#2d5b32 !important; color:#fff !important; }
.btn-primary:hover{ background-color:#1e4022 !important; border-color:#1e4022 !important; }
.text-primary{ color:#2d5b32 !important; }
.bg-primary{ background-color:#2d5b32 !important; }
.btn-pay.online{ background:#2d5b32 !important; }
:focus-visible{ outline-color:#2d5b32 !important; }
::selection{ background:#2d5b32; color:#fff; }

/* ===== Strict green/gold/white: square inputs (8px) + remove Bootstrap blue focus glow ===== */
input, textarea, select, .form-control{ border-radius:8px !important; }
input:focus, textarea:focus, select:focus, .form-control:focus{
  border-color:#2d5b32 !important;
  box-shadow:0 0 0 .18rem rgba(45,91,50,.20) !important;
  outline:none !important;
}
/* neutralise Bootstrap's blue link/info/check accents */
.text-info, .text-info:hover{ color:#2d5b32 !important; }
.bg-info{ background-color:#2d5b32 !important; }
.custom-control-input:checked ~ .custom-control-label::before,
.form-check-input:checked{ background-color:#2d5b32 !important; border-color:#2d5b32 !important; }
a.text-primary, a.text-info{ color:#2d5b32 !important; }

/* ===== Phase #2: mobile touch-target audit fixes ===== */
/* Mobile nav menu links were ~21px tall — give every menu item a comfortable
   44px+ tap zone (Apple/Google guideline) so the open hamburger menu is usable. */
@media (max-width:991px){
  .navbar-collapse a, .navbar-nav a, .navbar-nav .nav-link, #navMenu a, .nav-links a{
    min-height:44px !important; display:flex !important; align-items:center;
    padding:11px 16px !important; line-height:1.3;
  }
  .navbar-toggler{ min-width:44px; min-height:44px; padding:9px 12px !important; }
  /* Footer links: roomier vertical hit area */
  footer a, .footer a, .site-footer a{ display:inline-block; padding:7px 0; line-height:1.5; }
}
/* Any small icon/text button gets a minimum comfortable tap size on touch screens */
@media (max-width:991px) and (pointer:coarse){
  .btn, .hp-btn, .btn-view, button{ min-height:40px; }
}