/* homeschool.css — /homeschool/ landing page (For Homeschoolers) */

:root {
    --chip-school-bg: #dbeafe; --chip-school-fg: #1d4ed8;
    --chip-chore-bg: #fef3c7;  --chip-chore-fg: #b45309;
    --chip-activity-bg: #d1fae5; --chip-activity-fg: #047857;
}

.hs .topnav { padding-top: 28px; }

/* ---- section header (self-contained) ---- */
.hs .sec-h { text-align: center; margin-bottom: 40px; }
.hs .eyebrow { font-size: 12px; font-weight: 700; color: var(--pax-primary); text-transform: uppercase; letter-spacing: .1em; }
.hs .sec-h h2 { font-family: var(--font-display); font-size: clamp(30px, 4.5vw, 44px); font-weight: 800; letter-spacing: -0.02em; margin: 8px 0 10px; line-height: 1.12; color: #1b2a3a; }
.hs .sec-h p { font-size: 17px; color: var(--fg2); max-width: 620px; margin: 0 auto; line-height: 1.55; }

/* ---- chip pill (standalone) ---- */
.hs .chip { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 8px; }

/* ---- feature cards ---- */
.hs .feat-card { background: #fff; border: 1px solid #eef2f7; border-radius: 20px; padding: 28px; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.hs .feat-ic { width: 56px; height: 56px; border-radius: 14px; background: var(--ic-bg, #dce8f2); color: var(--ic-fg, var(--pax-primary)); display: inline-flex; align-items: center; justify-content: center; font-size: 26px; margin-bottom: 16px; }
.hs .feat-card h3 { font-family: var(--font-display); margin: 0 0 6px; font-size: 18px; font-weight: 800; letter-spacing: -0.005em; color: #1b2a3a; line-height: 1.3; }
.hs .feat-card p { margin: 0; font-size: 14px; line-height: 1.55; color: #64748b; }
.hs .feat-card p em { font-style: italic; color: #334155; }

/* ---- tablet mock (self-contained; mirrors home.css) ---- */
.hs .tablet { background:#1e293b; padding:14px; border-radius:28px; box-shadow:0 30px 60px rgba(15,23,42,.25), 0 1px 0 #475569 inset; width:560px; flex-shrink:0; max-width:100%; }
.hs .tablet-screen { width:100%; aspect-ratio:4/3; border-radius:16px; overflow:hidden; background:linear-gradient(135deg,#667eea 0%,#764ba2 50%,#f093fb 100%); padding:14px; display:flex; flex-direction:column; gap:10px; }
.hs .tablet-nav { background:rgba(255,255,255,.95); border-radius:14px; padding:6px 10px; display:flex; align-items:center; gap:6px; }
.hs .tablet-nav .dot { width:26px; height:26px; border-radius:50%; background:#f1f5f9; flex-shrink:0; }
.hs .tablet-kids { display:flex; gap:4px; flex:1; justify-content:center; }
.hs .tablet-kid { width:26px; height:26px; border-radius:50%; color:#fff; font-weight:700; font-size:10px; display:flex; align-items:center; justify-content:center; }
.hs .tablet-kid.active { box-shadow:0 0 0 2px #fff, 0 0 0 3px var(--pax-primary); }
.hs .tablet-greet { background:#fff; border-radius:14px; padding:12px 14px; display:flex; align-items:center; gap:10px; }
.hs .tablet-greet h3 { margin:0; font-size:15px; font-weight:800; letter-spacing:-0.01em; }
.hs .tablet-greet .sub { font-size:10px; color:var(--fg2); margin-top:2px; }
.hs .tablet-ring { width:42px; height:42px; border-radius:50%; flex-shrink:0; position:relative; display:flex; align-items:center; justify-content:center; }
.hs .tablet-ring::after { content:""; position:absolute; inset:4px; background:#fff; border-radius:50%; }
.hs .tablet-ring span { position:relative; font-size:10px; font-weight:800; color:var(--fg1); }
.hs .tablet-task { background:#fff; border-radius:10px; padding:8px 10px; display:flex; align-items:center; gap:8px; border-left:3px solid var(--tc,#095FA1); }
.hs .tablet-task.done { opacity:.5; }
.hs .tablet-task .cb { width:22px; height:22px; border-radius:50%; border:2px solid #cbd5e1; flex-shrink:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:11px; }
.hs .tablet-task.done .cb { background:var(--success); border-color:var(--success); }
.hs .tablet-task .t { flex:1; font-size:10px; font-weight:600; color:var(--fg1); line-height:1.3; }
.hs .tablet-task.done .t { text-decoration:line-through; color:var(--fg2); }
.hs .tablet-task .chip { font-size:8px; padding:2px 5px; border-radius:4px; font-weight:700; }

/* ---- responsive grids ---- */
.hs-hero { display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
.hs-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.hs-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.hs-about { display:grid; grid-template-columns:1.25fr .75fr; gap:56px; align-items:start; }
.hs-day-row { display:grid; grid-template-columns:110px 1fr; gap:28px; align-items:start; }

@media (max-width: 960px) {
    .hs-hero, .hs-grid-2, .hs-grid-3, .hs-about { grid-template-columns:1fr; }
    .hs-hero { gap:36px; }
    .hs-about { gap:32px; }
    .hs-faq-wide { grid-column: auto !important; }
}
@media (max-width: 560px) {
    .hs-day-row { grid-template-columns:66px 1fr; gap:16px; }
    .hs .cta-doodle { display:none; }
}