.home-hero { position:relative; overflow:hidden; padding:48px 0 30px; background:radial-gradient(ellipse at 85% 30%,#164b784a,transparent 50%),radial-gradient(ellipse at 0% 100%,#bc0ea514,transparent 45%),#010314; }
.home-hero__grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:48px; align-items:center; }
.home-hero__content { position:relative; z-index:2; padding:12px 0 24px; }
.home-eyebrow { display:flex; align-items:center; gap:9px; color:#b6cadf; font-size:.75rem; font-weight:650; letter-spacing:.07em; text-transform:uppercase; }
.home-eyebrow i { width:7px; height:7px; background:#67c1af; border-radius:50%; box-shadow:0 0 14px #67c1af80; }
.home-hero h1 { margin:22px 0 18px; font-size:clamp(3.3rem,5.6vw,5.3rem); line-height:1.05; letter-spacing:-.055em; font-weight:850; }
.home-hero h1 > span { color:#75c7ff; }
.home-sinhala { margin:0 0 16px; color:#e5bf68; font-family:"Nirmala UI","Iskoola Pota",sans-serif; font-size:clamp(1.1rem,1.7vw,1.4rem); line-height:1.8; font-weight:700; }
.home-intro { max-width:490px; margin:0 0 30px; color:#aebbd0; font-size:1rem; line-height:1.75; }
.home-actions { display:grid; gap:14px; max-width:575px; padding-right:28px; }
.home-action { position:relative; display:grid; gap:7px; min-height:125px; padding:21px 110px 21px 23px; border:1px solid #456c91; border-radius:16px; color:#eef4f6; background:#0c1933; transition:transform .2s,border-color .2s,box-shadow .2s; }
.home-action--course { background:linear-gradient(110deg,#3aadfb,#75c7ff); color:#010314; border-color:#75c7ff; box-shadow:0 8px 38px #3aadfb22; }
.home-action__hint { font-size:.62rem; font-weight:800; letter-spacing:.1em; }
.home-action strong { font-size:1.05rem; line-height:1.4; }
.home-action strong > span { display:inline-block; margin-left:4px; }
.home-action__detail { font-size:.74rem; opacity:.85; }
.home-action__robot { pointer-events:none; position:absolute; right:-29px; bottom:-5px; width:120px; height:148px; object-fit:contain; object-position:bottom; filter:drop-shadow(0 10px 14px #0005); transition:transform .25s; }
.home-action__robot--first { transform:rotate(-8deg); }
.home-action__robot--second { width:108px; height:137px; right:-19px; transform:rotate(8deg); }
.home-action:hover { transform:translateY(-3px); border-color:#b9e2ff; box-shadow:0 10px 38px #3aadfb30; }
.home-action:hover .home-action__robot--first { transform:rotate(-12deg) translateY(-5px); }
.home-action:hover .home-action__robot--second { transform:rotate(3deg) translateY(-5px); }
.home-reassurance { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:20px; font-size:.7rem; color:#aebbd0; }
.home-instructor { position:relative; isolation:isolate; align-self:stretch; min-height:640px; display:flex; align-items:flex-end; }
.home-instructor__halo { position:absolute; z-index:-1; width:420px; height:420px; max-width:100%; border:1px solid #3aadfb40; border-radius:50%; top:115px; right:-5px; background:radial-gradient(circle,#105fa638,transparent 70%); box-shadow:0 0 0 35px #3aadfb05,0 0 0 70px #3aadfb03; }
.home-instructor__portrait { width:100%; height:600px; object-fit:contain; object-position:center bottom; mask-image:linear-gradient(#000 85%,transparent 100%); }
.home-instructor__note { position:absolute; top:24px; right:0; font-size:.85rem; line-height:1.6; color:#b6cadf; text-align:right; border-right:2px solid #e5bf68; padding-right:15px; }
.home-instructor__caption { position:absolute; left:4px; right:0; bottom:34px; padding:22px 24px; border:1px solid #54759670; border-radius:16px; background:linear-gradient(125deg,#101c43f0,#040f2ee8); backdrop-filter:blur(16px); box-shadow:0 16px 45px #0005; }
.home-instructor__caption > span { display:block; color:#75c7ff; font-size:.62rem; font-weight:800; letter-spacing:.15em; margin-bottom:8px; }
.home-instructor__caption h2 { font-size:1.65rem; line-height:1.15; letter-spacing:-.025em; margin:0 0 14px; }
.home-instructor__caption a { display:inline-flex; align-items:center; gap:9px; font-size:.76rem; color:#bdcede; min-height:32px; }
.home-instructor__caption a:hover { color:#75c7ff; }
.home-instructor__caption b { background:#3aadfb; color:#010314; padding:1px 5px; border-radius:3px; font-size:.8rem; }
.home-instructor__signature { position:absolute; bottom:8px; right:8px; color:#7e95b1; font-size:.6rem; letter-spacing:.17em; text-transform:uppercase; }
.home-progress { border-top:1px solid #2c416670; border-bottom:1px solid #2c416670; background:#071028; padding:24px 0; }
.home-progress__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; }
.home-progress__grid > div { display:flex; align-items:center; gap:17px; }
.home-progress__grid > div > span { font-size:1.8rem; font-weight:300; color:#75c7ff; }
.home-progress p { display:grid; gap:4px; margin:0; }
.home-progress strong { font-size:.9rem; }
.home-progress small { font-size:.73rem; color:#aebbd0; }
.home-next { padding:64px 0; }
.home-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:28px; }
.home-section-heading h2 { font-size:clamp(1.8rem,3vw,2.5rem); letter-spacing:-.035em; margin:9px 0 0; }
.home-section-heading > p { color:#aebbd0; font-size:.85rem; }
.home-next .journey-card { padding:26px; background:linear-gradient(135deg,#101c4370,#040f2e); border-color:#2c4166; gap:14px; }
.home-next .journey-card:hover { background:#101c43; border-color:#75c7ff; }
.home-next .journey-card h3 { font-size:1.25rem; letter-spacing:-.02em; }
.home-next .journey-card p { font-size:.86rem; line-height:1.7; }
.home-next .journey-card small { font-size:.7rem; color:#aebbd0; }
.home-card-icon { color:#75c7ff; font-size:.65rem; letter-spacing:.1em; font-weight:800; }
.home-final { padding:40px 0; background:linear-gradient(110deg,#0e306280,#27174280); border-top:1px solid #2c4166; }
.home-final > div { display:flex; justify-content:space-between; align-items:center; gap:24px; }
.home-final h2 { font-size:clamp(1.6rem,3vw,2.4rem); letter-spacing:-.03em; line-height:1.25; margin:12px 0 0; }
.home-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:1000px) { .home-hero__grid { gap:25px; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); } .home-instructor { min-height:620px; } .home-instructor__portrait { height:530px; } .home-action { padding-right:82px; } .home-action__robot { width:100px; height:135px; } }
@media (max-width:760px) { .home-hero { padding-top:28px; } .home-hero__grid { grid-template-columns:1fr; gap:12px; } .home-hero h1 { font-size:clamp(3.2rem,10vw,4.6rem); } .home-hero h1 span br { display:none; } .home-intro { max-width:550px; } .home-actions { max-width:none; } .home-instructor { min-height:450px; max-width:450px; width:100%; justify-self:center; } .home-instructor__portrait { height:450px; } .home-instructor__halo { top:30px; height:340px; width:340px; right:20px; } .home-instructor__note { top:10px; right:0; font-size:.7rem; } .home-instructor__caption { bottom:25px; left:10px; right:10px; } .home-progress__grid { grid-template-columns:1fr; gap:20px; } .home-section-heading { align-items:flex-start; flex-direction:column; gap:8px; } .home-next { padding:40px 0; } .home-final > div { flex-direction:column; align-items:flex-start; } }
@media (max-width:400px) { .home-action { padding:17px 65px 17px 16px; } .home-action strong { font-size:.9rem; } .home-action__detail { font-size:.67rem; } .home-action__robot { width:90px; height:125px; right:-26px; } .home-eyebrow { font-size:.62rem; letter-spacing:.04em; } .home-sinhala { font-size:1rem; } }
@media (prefers-reduced-motion:reduce) { .home-action,.home-action__robot { transition:none; } .home-action:hover,.home-action:hover .home-action__robot { transform:none; } }