/* Homepage below-the-fold styles — loaded non-blocking from index.html. Above-the-fold (critical) CSS stays inline. Redesign 2026-10-26. */
/* ---------- Courses ---------- */
.courses-sec{padding:clamp(48px,6vw,80px) var(--wrap);background:linear-gradient(180deg,#FFFFFF 0%,#F7F8FC 100%);border-top:1px solid #ECEFF5}
.showcase-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.showcase-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--card-border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-md);transition:transform .2s ease,box-shadow .2s ease}
.showcase-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.sc-img-wrap{aspect-ratio:16/9;background:#0F172A;overflow:hidden}
.sc-img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.showcase-card:hover .sc-img{transform:scale(1.03)}
.sc-body{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px}
.sc-tag{display:inline-flex;align-items:center;gap:6px;width:fit-content;font-size:12.5px;font-weight:700;letter-spacing:.3px;padding:5px 12px;border-radius:999px;background:var(--saffron-tint);color:var(--saffron-ink);margin-bottom:10px}
.sc-title{font-size:21px;font-weight:700;color:var(--navy);line-height:1.3;margin-bottom:8px}
.sc-desc{font-size:15px;color:var(--text-muted);line-height:1.7;margin-bottom:18px;flex:1}
.sc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;align-self:flex-start;min-height:48px;padding:12px 22px;border-radius:12px;background:linear-gradient(135deg,#D55200,#BF4500);color:#fff!important;font-weight:700;font-size:15px;text-decoration:none;box-shadow:0 8px 18px rgba(204,78,0,.24);transition:transform .18s ease}
.sc-btn:hover{transform:translateY(-2px)}
.sub-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin:48px 0 18px}
.sub-title{font-size:20px;font-weight:700;color:var(--navy)}
.courses-filter-bar{display:flex;flex-wrap:wrap;gap:8px}
.courses-filter-bar button{min-height:42px;padding:8px 18px;border:1.5px solid var(--card-border);background:#fff;border-radius:999px;font-size:14px;font-weight:600;color:#3F4A63;cursor:pointer;font-family:inherit;transition:all .18s ease}
.courses-filter-bar button:hover{border-color:var(--navy);color:var(--navy)}
.courses-filter-bar button.cf-active{background:var(--navy);border-color:var(--navy);color:#fff}
.courses-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.c-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--card-border);border-radius:16px;box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.c-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--saffron-line)}
.c-badge{position:absolute;top:14px;right:14px;padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:700;letter-spacing:.3px}
.c-badge-free{background:#DCFCE7;color:#14532D}
.c-card-head{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:18px 18px 8px}
.c-icon{width:42px;height:42px;border-radius:12px;background:var(--navy-tint);color:var(--navy);display:flex;align-items:center;justify-content:center;font-size:20px}
.c-title{font-family:'Hind',sans-serif;font-size:16px;font-weight:700;color:var(--navy);line-height:1.4}
.c-body{padding:0 18px}
.c-tags{display:flex;flex-wrap:wrap;gap:6px}
.c-tag{background:#F1F4F9;color:#4A5468;padding:2px 10px;border-radius:999px;font-size:12.5px;font-weight:600}
.c-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding:16px 18px 18px}
.c-price-wrap{display:flex;align-items:baseline;gap:8px}
.c-price{font-family:'Poppins','Hind',sans-serif;font-size:20px;font-weight:700;color:var(--navy)}
.c-price.price-free{color:#15803D}
.c-orig{font-size:13px;color:#6B7487;text-decoration:line-through}
.c-arrow{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:8px 14px;border-radius:10px;background:var(--saffron-tint);color:var(--saffron-ink)!important;font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap;transition:background .18s ease,color .18s ease}
.c-arrow:hover{background:var(--saffron-btn);color:#fff!important}
.courses-more{text-align:center;margin-top:26px}
.promo-pyq-card{display:flex;align-items:center;gap:20px;margin-top:40px;padding:24px 28px;border-radius:var(--radius);background:linear-gradient(135deg,#1B2A6B 0%,#2B3E8C 100%);color:#fff;box-shadow:var(--shadow-md)}
.pyq-ic{width:56px;height:56px;border-radius:16px;background:rgba(255,107,0,.18);border:1px solid rgba(255,154,82,.5);color:#FF9A52;display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0}
.pyq-content{flex:1;min-width:0}
.pyq-badge{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.4px;color:#FFC59A;margin-bottom:4px}
.pyq-title{font-size:clamp(19px,2.2vw,23px);font-weight:700;margin-bottom:4px}
.pyq-desc{font-size:14.5px;color:#D3DAEA;line-height:1.6}
.pyq-btn{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:12px 22px;border-radius:12px;background:#fff;color:var(--navy)!important;font-weight:700;font-size:15px;text-decoration:none;white-space:nowrap;flex-shrink:0;transition:transform .18s ease}
.pyq-btn:hover{transform:translateY(-2px)}
/* ---------- Premium store (markup generated by seo/build_store.py) ---------- */
.ps-sec{padding:clamp(48px,6vw,80px) var(--wrap);background:linear-gradient(180deg,#FFF6EE 0%,#FFFFFF 100%);border-top:1px solid #F5E4D6}
.ps-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.ps-card{min-width:0;display:flex;flex-direction:column;background:#fff;border:1px solid #F0E2D6;border-radius:var(--radius);padding:14px 14px 16px;text-decoration:none;color:inherit;box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.ps-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--saffron-line)}
.ps-cover{position:relative;display:flex;justify-content:center;align-items:center;height:190px;border-radius:12px;background:radial-gradient(180px 110px at 50% 100%,#FFE1C7,transparent 70%),linear-gradient(160deg,#EEF2FF,#FFF8F2);margin-bottom:12px}
.ps-cover img{height:86%;width:auto;max-width:90%;object-fit:contain;border-radius:3px 6px 6px 3px;box-shadow:8px 12px 20px rgba(27,42,107,.25)}
.ps-off{position:absolute;top:10px;right:10px;background:#0B7A4B;color:#fff;font-size:12px;font-weight:700;padding:3px 9px;border-radius:8px}
.ps-tag{align-self:flex-start;background:var(--saffron-tint);color:var(--saffron-ink);font-size:12px;font-weight:700;padding:2px 10px;border-radius:999px}
.ps-card strong{font-size:16px;line-height:1.4;color:var(--navy);margin:8px 0 3px;font-weight:700}
.ps-meta{font-size:13.5px;color:var(--text-muted)}
.ps-price{margin:8px 0 12px;font-size:14px;color:#6B7487}
.ps-price b{font-family:'Poppins',sans-serif;font-size:23px;color:var(--navy)}
.ps-price s{text-decoration-color:#C0262D}
.ps-go{margin-top:auto;display:flex;justify-content:center;align-items:center;min-height:46px;border-radius:12px;background:linear-gradient(135deg,#D55200,#BF4500);color:#fff;font-weight:700;font-size:14.5px}
.ps-more{text-align:center;margin-top:26px}
.ps-all{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:10px 24px;border-radius:14px;background:var(--navy);color:#fff;font-weight:700;font-size:15px;text-decoration:none;box-shadow:0 8px 20px rgba(27,42,107,.2);transition:transform .18s ease}
.ps-all:hover{transform:translateY(-2px)}
/* ---------- YouTube ---------- */
.yt-sec{padding:clamp(48px,6vw,80px) var(--wrap);background:#fff;border-top:1px solid #ECEFF5}
.yt-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.yt-card{background:#fff;border:1px solid var(--card-border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.yt-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.yt-card .yt-embed-wrap{position:relative;padding-top:56.25%;background:#0B132B;overflow:hidden}
.yt-card .yt-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.yt-card:hover .yt-thumb{transform:scale(1.04)}
.yt-play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;border:none;background:rgba(255,255,255,.95);color:#DC2626;font-size:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(0,0,0,.35);cursor:pointer;transition:transform .18s ease}
.yt-play-btn .ic{fill:currentColor;stroke:none;margin-left:3px}
.yt-card:hover .yt-play-btn{transform:translate(-50%,-50%) scale(1.08)}
.yt-badge{position:absolute;bottom:10px;right:10px;background:rgba(0,0,0,.78);color:#fff;font-size:12px;font-weight:700;padding:3px 8px;border-radius:6px}
.yt-card .yt-info{padding:16px 18px 18px}
.yt-card .yt-title{font-weight:700;font-size:15.5px;line-height:1.5;color:var(--navy);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:6px}
.yt-card .yt-meta{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-muted);font-weight:600}
.yt-more-wrap{text-align:center;margin-top:30px}
.yt-more-btn{display:inline-flex;align-items:center;gap:9px;min-height:50px;padding:12px 26px;border-radius:14px;background:var(--navy);color:#fff!important;font-weight:700;font-size:15px;text-decoration:none;box-shadow:0 8px 20px rgba(27,42,107,.2);transition:transform .18s ease}
.yt-more-btn .ic:first-child{color:#FF8A8A}
.yt-more-btn:hover{transform:translateY(-2px)}
/* ---------- FAQ + CTA ---------- */
.faq-sec{padding:clamp(48px,6vw,80px) var(--wrap);background:var(--bg-page);border-top:1px solid #ECEFF5}
.faq-wrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:start}
.sec-eyebrow-left,.sec-title-left,.sec-sub-left{text-align:left;margin-left:0}
.faq-accordion{display:flex;flex-direction:column;gap:12px}
.faq-item{background:#fff;border:1px solid var(--card-border);border-radius:14px;box-shadow:var(--shadow-sm);overflow:hidden;transition:border-color .18s ease}
.faq-item[open]{border-color:var(--saffron-line)}
.faq-q{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:56px;padding:14px 18px;font-size:16px;font-weight:700;color:var(--navy);cursor:pointer;list-style:none}
.faq-q::-webkit-details-marker{display:none}
.faq-icon{width:30px;height:30px;border-radius:50%;background:var(--navy-tint);color:var(--navy);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .2s ease}
.faq-item[open] .faq-icon{transform:rotate(180deg);background:var(--saffron-tint);color:var(--saffron-ink)}
.faq-a{padding:0 18px 18px;color:var(--text-muted);font-size:15px;line-height:1.8}
.faq-a a{color:var(--saffron-ink);font-weight:700}
.cta{position:sticky;top:96px;background:linear-gradient(150deg,#1B2A6B 0%,#24357F 60%,#2B3E8C 100%);color:#fff;border-radius:22px;padding:32px 28px;box-shadow:var(--shadow-lg);overflow:hidden}
.cta::after{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(255,107,0,.35),transparent 70%)}
.cta-ic{position:relative;width:52px;height:52px;border-radius:14px;background:rgba(255,107,0,.2);color:#FF9A52;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:16px}
.cta h2{position:relative;font-size:clamp(22px,2.4vw,27px);font-weight:700;line-height:1.35;margin-bottom:10px;color:#fff}
.cta h2 span{color:#FFB27A}
.cta p{position:relative;color:#D3DAEA;font-size:15px;line-height:1.7;margin-bottom:22px}
.cta-btns{position:relative;display:flex;flex-direction:column;gap:10px}
.cta-btns a{width:100%}
.cta .btn-light{border-color:transparent}
/* ---------- Footer ---------- */
.footer-logo{font-family:'Poppins',sans-serif;font-size:24px;font-weight:800;color:#fff;margin-bottom:4px}
.footer-logo span{color:var(--saffron)}
.footer-sub{font-size:14px;color:#A9B3C7;margin-bottom:14px}
.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 8px;margin:16px 0}
.footer-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px}
.footer-contact{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;margin-top:6px;font-size:14px;color:#C2CAD9}
.footer-contact span{display:inline-flex;align-items:center;gap:7px}
.footer-contact .ic{color:#FF9A52}
.footer-copy{margin-top:12px;font-size:13px;color:#8E99B0}
.footer-legal{margin-top:6px;font-size:13px;color:#8E99B0;line-height:2.2}
.footer-legal a{color:#C2CAD9;margin:0 4px}
/* ---------- Mobile sticky dock (homepage only) ---------- */
.m-dock{display:none}
@media(max-width:760px){
  .m-dock{position:fixed;left:0;right:0;bottom:0;z-index:9997;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:1px solid #E6EAF3;box-shadow:0 -6px 20px rgba(27,42,107,.10);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
  .m-dock a{display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;border-radius:12px;font-size:14px;font-weight:700;text-decoration:none}
  .m-dock .ic{font-size:18px}
  .md-tg{background:#E7F4FB;color:#075985}
  .md-wa{background:#E3F7EA;color:#166534}
  .md-app{background:linear-gradient(135deg,#D55200,#BF4500);color:#fff}
  body.home-v2{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  body.home-v2 .wa-float,body.home-v2 .app-float{display:none!important}
  body.home-v2 #nied-back-to-top{bottom:84px!important}
  .showcase-grid{grid-template-columns:1fr;gap:16px}
  .sc-body{padding:18px}
  .sc-title{font-size:19px}
  .sc-btn{align-self:stretch}
  .sub-head{margin-top:36px;flex-direction:column;align-items:flex-start}
  .courses-filter-bar{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;width:calc(100% + 32px);margin:0 -16px;padding:2px 16px}
  .courses-filter-bar::-webkit-scrollbar{display:none}
  .courses-filter-bar button{flex:0 0 auto}
  .courses-card-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;margin:0 -16px;padding:4px 16px 10px;scrollbar-width:none}
  .courses-card-grid::-webkit-scrollbar{display:none}
  .courses-card-grid>*{scroll-snap-align:start}
  .promo-pyq-card{flex-direction:column;align-items:flex-start;padding:22px 20px}
  .pyq-btn{align-self:stretch;justify-content:center}
  .ps-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .ps-card{padding:10px 10px 12px}
  .ps-cover{height:150px}
  .ps-card strong{font-size:14.5px}
  .ps-meta{font-size:12.5px}
  .ps-price b{font-size:20px}
  .ps-go{font-size:13.5px;min-height:44px}
  .yt-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:84%;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;margin:0 -16px;padding:4px 16px 10px;scrollbar-width:none}
  .yt-grid::-webkit-scrollbar{display:none}
  .yt-card{scroll-snap-align:start}
  .faq-wrap{grid-template-columns:1fr}
  .cta{position:relative;top:auto;padding:28px 22px}
  .faq-q{font-size:15.5px;padding:14px 16px}
  .faq-a{padding:0 16px 16px}
}
@media(min-width:761px) and (max-width:1020px){.courses-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ps-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.yt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.faq-wrap{grid-template-columns:1fr}.cta{position:relative;top:auto}}
@media(prefers-reduced-motion:reduce){.ps-card,.c-card,.yt-card,.showcase-card{transition:none}}