/* FSSAI Registration & License page styles
   Mobile-first, semantic, accessible and conversion-focused.
   Uses global variables defined in `css/style.css` where available.
*/
:root{ --fssai-primary:#128a3d; --fssai-accent:#f4773a; --muted:#58616a }
html,body{font-family:Poppins, Inter, Roboto, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;background:#fff;color:#042029}
.container{max-width:var(--container-max,1200px);margin:0 auto}

/* Helpers */
.kicker{display:inline-block;font-weight:700;color:var(--fssai-primary);background:rgba(18,138,61,0.06);padding:.25rem .6rem;border-radius:999px;font-size:.86rem}
h1,h2,h3{margin:0 0 .5rem}
.lead{color:var(--muted);margin-bottom:1rem}

/* Hero (full-bleed background with inner gutters) */
.fssai-hero{position:relative;margin-left:calc(var(--container-padding,32px) * -1);margin-right:calc(var(--container-padding,32px) * -1);width:calc(100% + (var(--container-padding,32px) * 2));background-image:url('../assets/images/bg.jpg');background-size:cover;background-position:center center;padding:64px 0;box-sizing:border-box}
.fssai-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg, rgba(2,30,18,0.42), rgba(2,30,18,0.18));mix-blend-mode:normal;z-index:0}
.hero-grid{display:grid;grid-template-columns:1fr 360px;gap:28px;align-items:center;position:relative;z-index:1;padding:28px calc(var(--container-padding,32px) + 48px);box-sizing:border-box}
.hero-left h1{font-size:2rem;color:#ffffff;font-weight:800}
.hero-left .lead{color:rgba(255,255,255,0.92)}
.hero-highlights{display:flex;gap:.6rem;flex-wrap:wrap;margin:1rem 0 1.25rem;padding:0;list-style:none}
.hero-highlights li{background:rgba(255,255,255,0.08);padding:.45rem .75rem;border-radius:9px;font-weight:700;color:#fff}
.hero-ctas a{display:inline-block;margin-right:10px}

/* Form card (right) */
.hero-right .form-card{background:#fff;padding:18px;border-radius:12px;box-shadow:0 18px 44px rgba(6,40,28,0.06);color:#042029}
.hero-right .form-card h2{font-size:1.05rem;margin:0 0 10px;color:var(--fssai-primary)}
.hero-right .form-card form{display:flex;flex-direction:column;gap:10px}
.hero-right .form-card input{padding:12px;border:1px solid #e7efea;border-radius:10px;font-size:0.98rem}
.hero-right .form-card input::placeholder{color:#95a2a1}
.hero-right .form-card .btn-primary{background:linear-gradient(90deg,var(--fssai-accent),#ff8a3c);color:#fff;padding:12px;border-radius:10px;border:none;font-weight:800}
.hero-right .form-card .small{font-size:12px;color:var(--muted);margin-top:8px}

/* Overview */
.overview-grid{display:grid;grid-template-columns:1fr 320px;gap:22px;align-items:start;padding:28px 0}
.info-card{display:flex;gap:12px;align-items:flex-start;background:#fff;padding:12px;border-radius:10px;border:1px solid #eef6f0}
.info-card i{font-size:20px;color:var(--fssai-primary);min-width:36px}
.ic-body h4{margin:0;font-size:1rem}
.ic-body p{margin:0;color:var(--muted)}

/* Overview specifics */
.importance-list{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:8px}
.importance-list li{background:linear-gradient(180deg,#fff,#fbfffc);padding:10px;border-radius:8px;border:1px solid #eef6f0;color:#063827}
.overview-stats{display:flex;gap:12px;margin-top:14px}
.overview-stats .stat{background:linear-gradient(180deg,#fff,#fbfffc);padding:10px;border-radius:8px;border:1px solid #eef6f0;text-align:center;min-width:110px}
.overview-stats .num{display:block;font-weight:900;color:var(--fssai-primary);font-size:1.1rem}
.overview-stats .label{display:block;font-size:0.85rem;color:var(--muted)}

.overview-cards{display:grid;gap:12px}
.overview-cards .info-card{align-items:center}

/* Types */
.types-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:18px 0}
.type-card{background:#fff;padding:18px;border-radius:12px;border:1px solid #eef6f0;text-align:left;display:flex;flex-direction:column;gap:10px}
.type-card.premium{border-color:rgba(18,138,61,0.12);box-shadow:0 18px 50px rgba(18,138,61,0.06)}
.type-head{display:flex;align-items:center;gap:12px}
.type-icon{width:52px;height:52px;border-radius:10px;background:rgba(18,138,61,0.06);display:flex;align-items:center;justify-content:center;color:var(--fssai-primary);font-size:20px}
.type-features{list-style:none;padding:0;margin:8px 0;color:var(--muted);font-size:0.95rem}
.type-features li{padding:8px 0;border-top:1px dashed #f1f6f0}
.type-features li:first-child{border-top:0;padding-top:0}
.type-footer{display:flex;align-items:center;justify-content:space-between;margin-top:auto}
.type-footer .elig{font-size:0.86rem;color:var(--muted)}
.type-footer .btn-ghost{padding:.55rem .8rem;border-radius:8px}

/* Who */
.who-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:18px 0}
.who-card{background:#fff;padding:14px;border-radius:10px;border:1px solid #eef6f0;display:flex;align-items:flex-start;gap:12px}
.who-card div{flex:1}
.who-icon{width:56px;height:56px;border-radius:10px;background:linear-gradient(180deg,rgba(11,102,208,0.06),rgba(11,102,208,0.02));display:flex;align-items:center;justify-content:center;color:#0b6ab0;font-size:20px}

/* Blue band variant for Who section (full-bleed background, inner container keeps gutters) */
.who-blue{position:relative;margin-left:calc(var(--container-padding,32px) * -1);margin-right:calc(var(--container-padding,32px) * -1);width:calc(100% + (var(--container-padding,32px) * 2));background:linear-gradient(180deg,#0b6ab0,#0a5a98);padding:44px 0;box-sizing:border-box;margin-top:24px}
.who-blue .container{padding:0 calc(var(--container-padding,32px) + 48px)}
.who-blue .who-card{background:#fff;padding:16px;border-radius:10px;border:1px solid rgba(255,255,255,0.06)}
.who-blue .who-card h4{margin:0;color:#062a3a}
.who-blue .who-card .muted{color:#4b6b7b}
.who-blue .section-head{margin-bottom:12px;color:#fff}

/* Documents */
.docs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;padding:12px 0}
.doc-tile{background:#fff;padding:16px;border-radius:12px;border:1px solid #eef6f0;display:flex;gap:14px;align-items:flex-start;transition:transform .18s ease,box-shadow .18s ease}
.doc-tile:hover{transform:translateY(-6px);box-shadow:0 20px 60px rgba(8,45,90,0.06)}
.doc-tile .icon{width:56px;height:56px;border-radius:10px;background:rgba(18,138,61,0.06);display:flex;align-items:center;justify-content:center;color:var(--fssai-primary);font-size:20px}
.doc-tile .body h4{margin:0 0 6px;display:flex;align-items:center;gap:8px}
.doc-tile .body p{margin:0;color:var(--muted)}
.doc-tile .badge{display:inline-block;background:linear-gradient(90deg,var(--fssai-accent),#ff8a3c);color:#fff;padding:4px 8px;border-radius:999px;font-size:0.75rem;font-weight:700;margin-left:8px}
.doc-tile .sample{display:inline-block;margin-top:8px;color:var(--fssai-primary);font-weight:700;text-decoration:none}
.doc-tile .sample:hover{text-decoration:underline}

/* Add space below Documents section so following band has breathing room */
.documents{margin-bottom:40px}

/* Benefits */
.benefits-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:12px 0}
.benefit-card{background:#fff;padding:16px;border-radius:12px;border:1px solid #eef6f0;text-align:left;display:flex;gap:12px;align-items:flex-start;transition:transform .18s ease,box-shadow .18s ease}
.benefit-card:hover{transform:translateY(-6px);box-shadow:0 22px 60px rgba(8,45,90,0.06)}
.benefit-icon{width:56px;height:56px;border-radius:12px;background:linear-gradient(180deg,rgba(18,138,61,0.08),rgba(18,138,61,0.03));display:flex;align-items:center;justify-content:center;color:var(--fssai-primary);font-size:20px;flex:0 0 56px}
.benefit-body h4{margin:0 0 6px}
.benefit-body p{margin:0;color:var(--muted);font-size:0.95rem}

/* Plans */
.plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;padding:18px 0}
.plan.card{padding:16px;border-radius:12px;border:1px solid #eef6f0;background:#fff}
.plan.recommended{box-shadow:0 18px 50px rgba(18,138,61,0.06);transform:translateY(-6px)}
.plan-price{font-weight:800;font-size:1.3rem;margin:12px 0}
.ribbon{position:absolute;left:12px;top:-10px;background:var(--fssai-accent);color:#fff;padding:6px 8px;border-radius:6px;font-size:12px}

/* Enhanced pricing card styles */
.plan.card{position:relative;padding:18px}
.plan-head h3{margin:0;font-size:1.05rem}
.plan-head p{margin:4px 0 0}
.plan-features{list-style:none;padding:0;margin:10px 0 14px}
.plan-features li{padding:8px 0;border-top:1px dashed #f1f6f0;display:flex;align-items:flex-start;gap:10px;font-size:0.96rem}
.plan-features li:first-child{border-top:0;padding-top:0}
.plan-features li i{color:var(--fssai-primary);min-width:20px;font-size:1rem}
.plan-meta{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px}
.plan-footer .btn-primary{display:inline-block;width:100%;padding:10px;border-radius:10px;text-align:center}
.plan.recommended .plan-price{color:#062a3a}
.plan.recommended .ribbon{left:auto;right:12px;top:-10px;background:linear-gradient(90deg,var(--fssai-accent),#ff8a3c)}


/* Process / stepper (redesigned) */
.process{background:linear-gradient(180deg,rgba(18,138,61,0.04),rgba(18,138,61,0.01));padding:28px;border-radius:12px;margin-top:18px}
.stepper{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:start}
.step{background:#fff;padding:18px;border-radius:12px;border:1px solid #eef6f0;display:flex;gap:14px;align-items:flex-start;transition:transform .18s ease,box-shadow .18s ease}
.step:hover{transform:translateY(-6px);box-shadow:0 20px 60px rgba(6,40,28,0.06)}
.step-circle{width:64px;height:64px;border-radius:12px;background:linear-gradient(180deg,rgba(18,138,61,0.08),rgba(18,138,61,0.02));display:flex;align-items:center;justify-content:center;color:var(--fssai-primary);font-size:20px;flex:0 0 64px}
.step-body h4{margin:0 0 6px}
.step-body p{margin:0;color:var(--muted);font-size:0.95rem}
.step-meta{margin-top:8px;display:flex;gap:8px}
.step-meta .small{background:#fbfffc;padding:6px 8px;border-radius:8px;border:1px solid #eef6f0}
.process-cta .btn-primary{padding:12px 20px;border-radius:10px;font-weight:800}

@media (max-width:900px){
  .stepper{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .stepper{grid-template-columns:1fr}
  .step{flex-direction:row}
  .step-circle{flex:0 0 52px;width:52px;height:52px}
}

/* FAQ accordion */
.accordion{margin-top:12px}
.acc-item{border-bottom:1px solid #f0f4f4;padding:6px 0}
.acc-item input{display:none}
.acc-item label{display:flex;align-items:center;justify-content:space-between;padding:12px 0;color:#07261f;cursor:pointer;font-weight:700}
.acc-item label .question{flex:1;text-align:left}
.acc-item .chev{margin-left:12px;color:var(--muted);transition:transform .28s cubic-bezier(.2,.9,.2,1);transform-origin:50% 50%;font-size:.95rem}
.acc-panel{max-height:0;overflow:hidden;transition:max-height .32s ease,padding .28s ease;padding:0}
.acc-item input:checked + label + .acc-panel{max-height:420px;padding:8px 0}
.acc-item input:checked + label .chev{transform:rotate(180deg);color:var(--fssai-primary)}
.acc-panel p{margin:0;color:var(--muted)}

/* Testimonials & blog */
.testi-grid,.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;padding:12px 0}
.testi,.post{background:#fff;padding:14px;border-radius:10px;border:1px solid #eef6f0}
.stars{color:gold;font-weight:800;margin-top:8px}

/* Responsive */
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;gap:18px;padding:16px calc(var(--container-padding-tablet,20px) + 24px)}
  .overview-grid{grid-template-columns:1fr}
  .who-grid{grid-template-columns:repeat(2,1fr)}
  .types-grid{grid-template-columns:repeat(2,1fr)}
  .stepper{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .who-grid{grid-template-columns:1fr}
  .plans-grid{grid-template-columns:1fr}
  .types-grid{grid-template-columns:1fr}
  .hero-left h1{font-size:1.4rem}
  .hero-grid{padding:12px calc(var(--container-padding-mobile,16px) + 12px)}
}

/* Small helpers */
.muted{color:var(--muted)}
.small{font-size:12px;color:var(--muted)}

/* Accessibility: focus outlines for keyboard users */
input:focus, .btn-primary:focus, a:focus {outline:3px solid rgba(18,138,61,0.12);outline-offset:2px}

/* End of fssai-license.css */