:root{--ink:#17213d;--blue:#2857d6;--sky:#6dd5f5;--cream:#fff9ef;--coral:#ff775f;--mint:#71d9bd}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif}main{min-height:100vh;overflow:hidden}header{height:76px;display:flex;align-items:center;gap:12px;padding:0 clamp(22px,5vw,72px);border-bottom:1px solid #ded8cc;letter-spacing:.16em}.brand-dot{width:18px;height:18px;border-radius:50%;background:var(--coral);box-shadow:8px -5px 0 var(--sky)}.grownup{margin-left:auto;border:1px solid #c9c3b8;background:transparent;border-radius:99px;padding:10px 16px;color:var(--ink);cursor:pointer}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:460px;padding:50px clamp(24px,7vw,110px);background:radial-gradient(circle at 78% 45%,#daf6ff 0 19%,transparent 43%),linear-gradient(125deg,#fff9ef 0 57%,#d5f4ff 57%)}.copy{align-self:center}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.2em;color:var(--blue)}h1{font-size:clamp(52px,7vw,96px);line-height:.9;margin:16px 0 24px;letter-spacing:-.065em}h1 span{color:var(--blue)}.message{max-width:480px;font-size:20px;line-height:1.5}.robot-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.antenna{width:6px;height:46px;background:var(--ink);position:relative}.antenna i{position:absolute;width:20px;height:20px;left:-7px;top:-9px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 8px #ff775f26}.robot{width:230px;height:238px;background:#f8fbff;border:5px solid var(--ink);border-radius:62px 62px 42px 42px;box-shadow:16px 18px 0 #2857d626;position:relative}.face{margin:34px auto 0;width:174px;height:102px;border-radius:34px;background:var(--ink);display:flex;align-items:center;justify-content:center;gap:50px;position:relative}.eye{width:24px;height:31px;border-radius:50%;background:var(--sky);box-shadow:0 0 15px var(--sky)}.mouth{position:absolute;bottom:15px;width:32px;height:7px;border-radius:0 0 20px 20px;background:var(--coral)}.chest{width:62px;height:62px;border-radius:20px;background:var(--blue);color:white;font-weight:900;font-size:30px;display:grid;place-items:center;margin:18px auto}.talk{margin-top:30px;border:0;border-radius:99px;background:var(--coral);color:#28120d;font-size:18px;font-weight:800;padding:16px 25px;box-shadow:0 6px 0 #d94f3c;cursor:pointer}.talk:active{transform:translateY(4px);box-shadow:0 2px 0 #d94f3c}.talk span{color:white;margin-right:8px}.robot.listening .eye{animation:blink .7s infinite alternate}.robot.speaking .mouth{animation:talk .28s infinite alternate}.adventures{padding:50px clamp(24px,7vw,110px) 38px}.adventures>div:first-child{display:flex;align-items:end;justify-content:space-between}.adventures h2{font-size:36px;margin:7px 0 25px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.cards button{text-align:left;min-height:180px;border:1px solid #d8d2c7;border-radius:22px;background:#fff;padding:22px;color:var(--ink);cursor:pointer;transition:.2s}.cards button:hover{transform:translateY(-5px);box-shadow:0 12px 24px #17213d18;border-color:var(--blue)}.cards span{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#e4f6fb;color:var(--blue);font-weight:900}.cards strong{display:block;font-size:22px;margin:22px 0 7px}.cards small{font-size:14px;color:#62687a}.parent-note{text-align:center;color:#74716b;font-size:13px;margin:0 0 28px}dialog{max-width:480px;border:0;border-radius:24px;padding:36px;box-shadow:0 30px 90px #17213d55}dialog::backdrop{background:#17213daa}.close{float:right;border:0;background:transparent;font-size:28px;cursor:pointer}@keyframes talk{to{height:18px;width:26px;border-radius:50%}}@keyframes blink{to{transform:scaleY(.35)}}@media(max-width:800px){.hero{grid-template-columns:1fr;text-align:center;padding-top:38px;background:radial-gradient(circle at 50% 72%,#d5f4ff 0 25%,transparent 48%)}.copy{display:flex;flex-direction:column;align-items:center}h1{font-size:58px}.robot-wrap{margin-top:28px}.robot{width:190px;height:200px}.face{width:145px;height:85px;margin-top:26px}.chest{width:52px;height:52px;margin-top:12px}.cards{grid-template-columns:1fr 1fr}.cards button{min-height:150px}.adventures>div:first-child{display:block}}@media(max-width:480px){header{height:64px}.hero{padding:30px 20px}.cards{grid-template-columns:1fr}.adventures{padding:40px 20px}.cards button{min-height:125px}.cards strong{margin-top:14px}}
