/* MSME / Udyam Registration page styles
   Mobile-first, semantic, accessible and conversion-focused.
   Relies on global variables from `css/style.css` where available.
*/
:root{ --primary:#0b6ab0; --accent:#f4773a; --muted:#6b6b6b }
html,body{font-family:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;background:var(--bg, #fbfdfe);color:#122;margin:0}
.container{max-width:var(--container-max,1200px);margin:0 auto}

/* Global helpers */
.kicker{display:inline-block;font-weight:700;color:var(--primary);background:rgba(11,102,208,0.06);padding:.25rem .6rem;border-radius:999px;font-size:.85rem}
h1,h2,h3,h4{margin:0 0 .5rem}
h1{font-size:1.6rem;line-height:1.05}
.lead{color:var(--muted);margin-bottom:1rem}

/* Hero: full-bleed background but content aligned to site gutters (main provides padding)
   background illustration should be placed via CSS or inline image in production
*/
.msme-hero{position:relative;background-image:url('../assets/images/bg.jpg');background-size:cover;background-position:center center;color:#fff;margin-left:calc(var(--container-padding,32px) * -1);margin-right:calc(var(--container-padding,32px) * -1);width:calc(100% + (var(--container-padding,32px) * 2));padding:calc(var(--section-vertical,72px) - 4px) 0;box-sizing:border-box}
.msme-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg, rgba(3,50,94,0.62), rgba(3,50,94,0.28));z-index:0}
.msme-hero .hero-grid{display:grid;grid-template-columns:1fr 480px;gap:36px;align-items:center;position:relative;z-index:1;padding:28px var(--container-padding,32px);box-sizing:border-box}

/* Left column */
.msme-hero .kicker{background:rgba(255,255,255,0.06);color:#dff3ff;padding:.45rem .9rem;border-radius:999px;font-weight:800;display:inline-block;margin-bottom:12px}
.msme-hero h1{font-size:2.75rem;color:#fff;font-weight:900;margin-top:6px;line-height:1.02}
.msme-hero .lead{color:rgba(255,255,255,0.94);font-size:1.05rem;margin-bottom:18px}
.hero-highlights{display:flex;gap:.6rem;flex-wrap:wrap;margin:1rem 0 1.25rem;list-style:none;padding:0}
.hero-highlights li{background:rgba(255,255,255,0.08);padding:.55rem .95rem;border-radius:10px;font-weight:700;color:#fff}

/* CTAs */
.btn-primary{background:linear-gradient(90deg,var(--accent,#f4773a),#ff8a3c);color:#fff;padding:.9rem 1.1rem;border-radius:12px;text-decoration:none;display:inline-block;font-weight:900;box-shadow:0 14px 36px rgba(244,119,58,0.14)}
.btn-ghost{background:transparent;border:1px solid rgba(255,255,255,0.16);color:#fff;padding:.6rem .9rem;border-radius:10px;text-decoration:none}

/* Elevated form card (right column) */
.hero-right .form-card{background:#fff;padding:22px;border-radius:14px;box-shadow:0 26px 60px rgba(8,45,90,0.12);color:#04121a;max-width:480px;width:100%;transform:translateY(0)}
.hero-right .form-card h2{font-size:1.05rem;margin:0 0 8px;color:var(--primary)}
.hero-right .form-card form{display:flex;flex-direction:column;gap:12px}
.hero-right .form-card input{padding:12px;border:1px solid #e6eef7;border-radius:10px;font-size:1rem}
.hero-right .form-card input::placeholder{color:#9aa6b6}
.hero-right .form-card .btn-primary{width:100%;padding:12px;border-radius:10px;font-weight:900}
.hero-right .form-card .small{font-size:12px;color:var(--muted);margin-top:10px}

/* Overview */
.overview{padding:28px 0}
.overview-grid{display:grid;grid-template-columns:1fr 320px;gap:28px;align-items:start}
.overview-new .overview-left{display:flex;flex-direction:column;gap:14px}
.overview-features{list-style:none;padding:0;margin:0 0 8px;display:grid;gap:8px}
.overview-features li{background:linear-gradient(180deg,rgba(255,255,255,0.98),#fff);padding:10px;border-radius:8px;border:1px solid #eef4fb;color:var(--primary-dark,#10263a)}
.overview-stats{display:flex;gap:12px;margin-top:8px}
.overview-stats .stat{background:linear-gradient(180deg,#fff,#fbfdfe);padding:10px;border-radius:8px;border:1px solid #eef4fb;text-align:center}
.overview-stats .num{display:block;font-weight:800;font-size:1.05rem;color:var(--primary)}
.overview-stats .label{font-size:0.85rem;color:var(--muted)}
.info-cards{display:grid;gap:12px}
.info-card{display:flex;gap:12px;align-items:flex-start;background:#fff;padding:12px;border-radius:10px;border:1px solid #eef4fb}
.info-card i{font-size:20px;color:var(--primary);min-width:42px}
.info-card .ic-body h4{margin:0 0 6px;font-size:1rem;color:var(--primary-dark,#10263a)}
.info-card .ic-body p{margin:0;color:var(--muted);font-size:0.95rem}

/* Who grid */
.who{padding:22px 0}
.who-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.who-grid.enhanced .who-card{background:#fff;padding:18px;border-radius:12px;text-align:left;border:1px solid #eef4fb;box-shadow:0 8px 28px rgba(16,24,40,0.04);transition:transform .18s ease,box-shadow .18s ease}
.who-card{display:flex;flex-direction:column;gap:8px}
.who-card:hover{transform:translateY(-6px);box-shadow:0 20px 60px rgba(16,24,40,0.08)}
.who-icon{width:56px;height:56px;border-radius:10px;background:linear-gradient(180deg,rgba(11,102,208,0.08),rgba(11,102,208,0.02));display:flex;align-items:center;justify-content:center;color:var(--primary);font-size:20px}
.who-card h3{margin:0;font-size:1.05rem;color:var(--primary-dark,#10263a)}
.who-card .muted{color:var(--muted);margin:0}
.who-card .examples{font-size:0.9rem;color:var(--muted);margin:4px 0 0}

/* Documents */
.documents{padding:22px 0}
.documents-redesign{background:linear-gradient(180deg, rgba(3,50,94,0.03), rgba(3,50,94,0.02));padding:22px;border-radius:10px}
.docs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:12px}
.doc-tile{background:#fff;padding:16px;border-radius:12px;border:1px solid #eef4fb;display:flex;gap:12px;align-items:flex-start}
.doc-tile .icon{width:56px;height:56px;border-radius:10px;background:linear-gradient(180deg,rgba(11,102,208,0.08),rgba(11,102,208,0.02));display:flex;align-items:center;justify-content:center;color:var(--primary);font-size:20px}
.doc-tile .body h4{margin:0 0 6px;font-size:1rem}
.doc-tile .body p{margin:0;color:var(--muted);font-size:0.95rem}
.doc-tile .body .sample{display:inline-block;margin-top:8px;color:var(--primary);font-weight:700;text-decoration:none}
.doc-tile:hover{transform:translateY(-6px);box-shadow:0 18px 50px rgba(11,102,208,0.06)}

/* Benefits */
.benefits{padding:22px 0}
.benefits-redesign{background:linear-gradient(180deg,var(--primary,#0b6ab0),var(--primary-dark,#0a5a98));padding:28px;border-radius:10px;color:#fff;margin-top:18px}
.benefits-redesign .section-head h2{color:#fff}
.benefits-redesign .section-head .muted{color:rgba(255,255,255,0.95)}
.benefits-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:12px}
.benefits-redesign .benefit-card{background:#fff;padding:16px;border-radius:12px;border:1px solid rgba(255,255,255,0.06);text-align:left;color:var(--primary-dark,#10263a);box-shadow:0 12px 36px rgba(16,24,40,0.06)}
.benefits-redesign .benefit-card i{font-size:24px;color:var(--accent);display:block;margin-bottom:10px}
.benefits-redesign .benefit-card h4{margin:0 0 8px}
.benefits-redesign .benefit-card .muted{color:var(--muted);font-size:0.95rem;margin:0}

/* Plans */
.packages{padding:28px 0}
.plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.plan.card{padding:18px;border-radius:12px;border:1px solid #eef4fb;background:#fff;box-shadow:0 10px 30px rgba(16,24,40,0.04)}
.plan.recommended{border-color:rgba(11,102,208,0.12);box-shadow:0 18px 50px rgba(11,102,208,0.06);transform:translateY(-6px)}
.ribbon{position:absolute;left:16px;top:-12px;background:var(--accent);color:#fff;padding:6px 8px;border-radius:6px;font-size:12px}
.plan-price{font-weight:800;font-size:1.4rem;margin:10px 0}
.plan-cta .btn-primary{display:inline-block}

/* Plan features list */
.plan-features{list-style:none;padding:0;margin:12px 0 14px;color:var(--muted)}
.plan-features li{padding:8px 0;border-top:1px dashed #f1f6fb}
.plan-features li:first-child{border-top:0;padding-top:0}
.packages-note{margin-top:14px;color:var(--muted)}

@media (max-width:900px){
  .plans-grid{grid-template-columns:1fr}
  .plan.recommended{transform:none}
}

/* Process / stepper */
.process{background:linear-gradient(180deg,var(--primary,#0b6ab0), #0a5a98);color:#fff;padding:24px;border-radius:10px;margin-top:10px}
.stepper{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.step{background:#fff;padding:12px;border-radius:10px;color:var(--primary-dark,#10263a);text-align:center}
.step-circle{width:48px;height:48px;border-radius:50%;background:linear-gradient(180deg,rgba(11,102,208,0.12),rgba(11,102,208,0.04));display:flex;align-items:center;justify-content:center;margin:0 auto 8px;color:var(--primary)}

/* FAQ accordion (CSS only) */
.accordion{margin-top:12px}
.acc-item{border-bottom:1px solid #f0f4f8;padding:6px 0}
.acc-item input{display:none}
.acc-item label{display:flex;align-items:center;justify-content:space-between;padding:12px 0;color:var(--primary-dark,#10263a);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:0.92rem}
.acc-panel{max-height:0;overflow:hidden;transition:max-height .32s ease,padding .28s ease}
.acc-item input:checked + label + .acc-panel{max-height:420px;padding:8px 0}
.acc-item input:checked + label .chev{transform:rotate(180deg);color:var(--primary)}
.acc-panel p{margin:0;color:var(--muted)}

/* Testimonials & blog */
.testi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.testi{background:#fff;padding:14px;border-radius:10px;border:1px solid #eef4fb}
.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.post{background:#fff;padding:14px;border-radius:10px;border:1px solid #eef4fb}

/* Responsive */
@media (max-width:900px){
  .msme-hero .hero-grid{grid-template-columns:1fr;gap:12px;padding:16px var(--container-padding-tablet,20px)}
  h1{font-size:1.25rem}
  .who-grid{grid-template-columns:repeat(2,1fr)}
  .stepper{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .msme-hero{margin-left:calc(var(--container-padding-mobile,16px) * -1);margin-right:calc(var(--container-padding-mobile,16px) * -1);width:calc(100% + (var(--container-padding-mobile,16px) * 2))}
  .msme-hero .hero-grid{padding:12px var(--container-padding-mobile,16px)}
  .who-grid{grid-template-columns:1fr}
  .plans-grid{grid-template-columns:1fr}
  .stepper{grid-template-columns:1fr}
}

/* Small visual polish */
.muted{color:var(--muted)}
.small{font-size:12px;color:var(--muted)}
