/* dhrudha responsive.css — all breakpoints */

/* ====================================================
   NAV — the full link row needs ~900px, so collapse to the
   hamburger menu below 1024px (phones and tablets)
   ==================================================== */
@media(max-width:1023.98px){
  .nlinks{display:none;}
  .ham{display:flex;}
}
@media(min-width:1024px){
  .mob{display:none!important;}
}

/* ====================================================
   NARROW COLUMNS — ≤1024px
   Justified text makes wide word gaps in narrow columns,
   so body copy is ragged-right here (desktop keeps justify).
   ==================================================== */
@media(max-width:1024.98px){
  [style*="text-align:justify"],
  [style*="text-align: justify"],
  .legal-p,.lp,.phase-body,.faq-a{text-align:left!important;-webkit-hyphens:manual;hyphens:manual;}

  /* HERO STATS — even grid, no orphaned items */
  .hstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:20px 16px;}
  .hst{padding-right:0;}
  .hst-sep{display:none;}
}

/* ====================================================
   TOUCH DEVICES — no sticky hover lifts, comfortable targets
   ==================================================== */
@media(hover:none){
  .val:hover,.svc:hover,.team:hover,.pill-card:hover,.feat:hover,.why-card:hover,.prog-card:hover,.pd:hover,.ps-card:hover,.jstep:hover,.role-card:hover,.mentor-card:hover,.vm:hover,
  .btn-p:hover,.fsub:hover,.ncta:hover,.tt:hover{transform:none;}
}
@media(pointer:coarse){
  .tt{width:44px;height:44px;}
  .fr a{padding:10px 0;}
  .fr span a{padding:10px 4px;}
  .mob a{padding:16px 0;}
}

/* ====================================================
   MOBILE — 0 to 600px (small phones)
   ==================================================== */
@media(max-width:600px){
  .hero-hl{letter-spacing:-1px;}
  .btn-p,.btn-g{width:100%;text-align:center;padding:14px 20px;}
  .hero-acts{flex-direction:column;gap:10px;}
  .roles-grid{grid-template-columns:1fr;}
  .pilot-pillars{grid-template-columns:1fr 1fr;}
}

/* ====================================================
   MOBILE — 0 to 720px
   ==================================================== */
@media(max-width:720px){

  /* NAV */
  .ni{height:64px;padding:0 20px;gap:12px;}
  html{scroll-padding-top:72px;}

  /* HERO */
  .hero{padding:36px 20px 28px;}
  .hero-hl{font-size:34px;letter-spacing:-1.5px;}
  .hero-sub{font-size:15px;}
  .hero-acts{gap:10px;flex-wrap:wrap;}
  .btn-p,.btn-g{font-size:14px;padding:13px 24px;}
  .hstats{padding-top:24px;margin-top:24px;}
  .hst-n{font-size:28px;}

  /* SECTIONS */
  .sec{padding:44px 20px;}
  .wrap{padding-left:20px;padding-right:20px;}
  .sec-title{font-size:26px;letter-spacing:-0.5px;}
  .sec-lead{font-size:15px;}

  /* ALL GRIDS — single column */
  .vals,
  .vm-wrap,
  .svcs,
  .teams,
  .pills,
  .roles-grid,
  .contact-grid,
  .mentor-grid,
  .frow{
    grid-template-columns:1fr;
  }

  /* MENTOR */
  .mentor-card{padding:16px 18px;gap:12px;}
  .mentor-ic{width:38px;height:38px;}

  /* FOOTER */
  .fi{flex-direction:column;align-items:flex-start;gap:20px;}
  .fr{text-align:left;}

  /* VISION */
  .vm{padding:22px 18px;}
  .v1 .vm-tx,.v2 .vm-tx{font-size:17px;}
  .v1 .vm-sub,.v2 .vm-sub{font-size:14px;}

  /* CONTACT */
  .contact-grid{gap:24px;}
  .cdl{gap:14px;}
  .cdi{gap:12px;}
  .cd-ic{width:38px;height:38px;}
  .cform{padding:22px 18px;}

  /* BLOG LISTING */
  .page-header{padding:80px 20px 16px;}
  .page-header h1{font-size:24px;}
  .page-header p{font-size:14px;}
  .blog-grid{grid-template-columns:1fr !important;gap:16px;}
  .bc-img-wrap{height:140px;}
  .bc-body{padding:16px;}
  .bc-title{font-size:15px;}
  .bc-excerpt{font-size:13px;margin-bottom:10px;}

  /* BLOG POST */
  .post-wrap{padding:0 16px;}
  .post-title{font-size:22px !important;}
  .post-body{font-size:15px;}
  .post-body h2{font-size:18px;}
  .post-body h3{font-size:15px;}
  .post-body pre{padding:12px;font-size:12px;overflow-x:auto;}
  .post-img{border-radius:10px;margin-bottom:24px;}
  .share-buttons{gap:6px;flex-wrap:wrap;}
  .share-btn{padding:10px 12px;font-size:12px;}
  .share-btn svg{width:14px;height:14px;}
  .post-cta{padding:20px;margin-top:28px;}
  .post-cta-title{font-size:15px;}
  .post-cta-sub{font-size:13px;}
  .post-back{margin-bottom:20px;}
}

/* ====================================================
   VERY SMALL PHONES — ≤380px (e.g. 320px devices)
   ==================================================== */
@media(max-width:380px){
  .ni{padding:0 16px;gap:8px;}
  .nl{padding:8px 14px;}
  .nl .wm{font-size:20px;}
  .nr{gap:6px;}
}

/* ====================================================
   TABLET — 721px to 1024px
   ==================================================== */
@media(min-width:721px) and (max-width:1024px){

  .ni{padding:0 28px;}
  .wrap{padding-left:28px;padding-right:28px;}
  .sec{padding:56px 28px;}
  .hero{padding:52px 28px 44px;}

  /* 2-column grids */
  .vals{grid-template-columns:1fr 1fr;}
  .teams{grid-template-columns:1fr 1fr;}
  .pills{grid-template-columns:1fr 1fr;}
  .roles-grid{grid-template-columns:1fr 1fr;}
  .svcs{grid-template-columns:1fr;}

  /* Vision stacks on tablet */
  .vm-wrap{grid-template-columns:1fr;gap:16px;}

  /* Contact & mentor stack */
  .contact-grid{grid-template-columns:1fr;gap:32px;}
  .mentor-grid{grid-template-columns:1fr;gap:24px;}

  /* Footer */
  .fi{align-items:flex-start;}
}

/* ====================================================
   TEXT JUSTIFICATION — DESKTOP ONLY
   ==================================================== */
@media(min-width:1025px){
.sec p,.sec-lead,.hero-sub,.val-tx,.svc-d,.svc-pts li,.tf,.pill-tx,.vm-sub,.v1 .vm-sub,.v2 .vm-sub,.why-tx,.role-tx,.mentor-tx,.story-body,.contact-intro,.fnote{text-align:justify;text-justify:inter-word;-webkit-hyphens:auto;hyphens:auto;}
}