/* ═══════════════════════════════════════════════════════════════════
 * page-layouts.css — Website content layout styles (IISDVT v5)
 *   data-layout = responsive | grid | card_based | single_column |
 *     two_column | three_column | full_width | sidebar | split_screen |
 *     landing_page | one_page
 *   Index <section> tags + grid divs par target karta hai (public pages).
 * ═══════════════════════════════════════════════════════════════════ */

/* saare content grids (index me .grid-3/.grid-4 + koi bhi grid div) */
body[data-layout] section > div[style*="grid-template-columns"],
body[data-layout] .grid-2,body[data-layout] .grid-3,body[data-layout] .grid-4,
body[data-layout] .course-grid,body[data-layout] .courses-grid,body[data-layout] .feature-grid{transition:all .2s;}

/* ── RESPONSIVE (default) — baseline ── */

/* ── FULL-WIDTH — sections poori chaudai ── */
body[data-layout="full_width"] section{padding-left:3%!important;padding-right:3%!important;}
body[data-layout="full_width"] section > div[style*="max-width"],
body[data-layout="full_width"] .grid-3,body[data-layout="full_width"] .grid-4{max-width:100%!important;}

/* ── SINGLE COLUMN ── */
body[data-layout="single_column"] section > div[style*="grid-template-columns"],
body[data-layout="single_column"] .grid-2,body[data-layout="single_column"] .grid-3,body[data-layout="single_column"] .grid-4,
body[data-layout="single_column"] .course-grid,body[data-layout="single_column"] .courses-grid,
body[data-layout="single_column"] .feature-grid{grid-template-columns:1fr!important;max-width:620px!important;margin-left:auto!important;margin-right:auto!important;}

/* ── TWO COLUMN ── */
body[data-layout="two_column"] section > div[style*="grid-template-columns"],
body[data-layout="two_column"] .grid-3,body[data-layout="two_column"] .grid-4,
body[data-layout="two_column"] .course-grid,body[data-layout="two_column"] .courses-grid,
body[data-layout="two_column"] .feature-grid{grid-template-columns:1fr 1fr!important;}

/* ── THREE COLUMN ── */
body[data-layout="three_column"] section > div[style*="grid-template-columns"],
body[data-layout="three_column"] .grid-2,body[data-layout="three_column"] .grid-4,
body[data-layout="three_column"] .course-grid,body[data-layout="three_column"] .courses-grid,
body[data-layout="three_column"] .feature-grid{grid-template-columns:repeat(3,1fr)!important;}

/* ── GRID — auto-fit ── */
body[data-layout="grid"] section > div[style*="grid-template-columns"],
body[data-layout="grid"] .course-grid,body[data-layout="grid"] .courses-grid,
body[data-layout="grid"] .feature-grid,body[data-layout="grid"] .grid-4,body[data-layout="grid"] .grid-3{
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr))!important;gap:18px!important;}

/* ── CARD-BASED — har section ek card ── */
body[data-layout="card_based"] section{
  max-width:1120px!important;margin:22px auto!important;background:var(--card)!important;
  border:1px solid var(--border)!important;border-radius:18px!important;
  box-shadow:0 6px 24px rgba(15,23,42,.06)!important;padding:30px 34px!important;}

/* ── SIDEBAR — content left column ── */
body[data-layout="sidebar"] section > div[style*="grid-template-columns"],
body[data-layout="sidebar"] .grid-3,body[data-layout="sidebar"] .grid-4,
body[data-layout="sidebar"] .course-grid{grid-template-columns:repeat(2,1fr)!important;max-width:74%!important;margin-left:0!important;}
@media(max-width:860px){body[data-layout="sidebar"] section > div[style*="grid-template-columns"]{max-width:100%!important;}}

/* ── SPLIT SCREEN — hero do-panel ── */
body[data-layout="split_screen"] .hero-section{display:grid!important;grid-template-columns:1fr 1fr;align-items:center;gap:30px;}
@media(max-width:820px){body[data-layout="split_screen"] .hero-section{grid-template-columns:1fr;}}

/* ── LANDING PAGE — focused, center ── */
body[data-layout="landing_page"] section{max-width:1000px!important;margin:0 auto!important;padding-top:56px!important;padding-bottom:56px!important;text-align:center;}
body[data-layout="landing_page"] section > div[style*="grid-template-columns"]{justify-items:center;}

/* ── ONE PAGE — smooth scroll + compact ── */
html:has(body[data-layout="one_page"]){scroll-behavior:smooth;}
body[data-layout="one_page"] section{padding-top:40px!important;padding-bottom:40px!important;}
body[data-layout="one_page"] section + section{border-top:1px solid var(--border);}