/* Keep the illustration in its own space so text never crosses the bears. */
.hero{min-height:0;background:radial-gradient(ellipse at 0 0,#efced44d,transparent 55%),radial-gradient(ellipse at 100% 0,#c8dce94d,transparent 55%),var(--cream)}
.hero-copy{padding:85px 24px 30px;background:none;max-width:780px;margin:auto}
.hero::after{content:"";display:block;width:100%;aspect-ratio:1.6;background:none center bottom / 100% auto no-repeat;mask-image:linear-gradient(to bottom,transparent,#000 18%);pointer-events:none}
.parents{font-size:clamp(25px,4vw,34px);font-weight:600;line-height:1.35;color:#42382f;text-wrap:balance}
.hero-note{font-size:14px;color:#51473e;margin-top:14px}
.primary,.outline,.scroll,.text-button,header>a:last-child{min-height:48px;border-radius:14px;font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600;letter-spacing:.3px;line-height:1.4;text-decoration:none;transition:transform .18s,box-shadow .18s,background .18s;cursor:pointer}
.primary,.scroll{display:inline-flex;align-items:center;justify-content:center;padding:16px 25px;color:#fff;background:linear-gradient(135deg,#597d8f,#426173);border:1px solid #385669;box-shadow:0 5px 0 #314d5e,0 10px 20px #42617325;text-shadow:0 1px 1px #263f4c33}
.primary:hover,.scroll:hover{background:linear-gradient(135deg,#4d7082,#38586b);transform:translateY(-2px);box-shadow:0 7px 0 #314d5e,0 13px 24px #42617330}
.primary:active,.scroll:active{transform:translateY(4px);box-shadow:0 1px 0 #314d5e}
.outline,.text-button{background:linear-gradient(#fffdfa,#f0e4d3);border:1.5px solid #ad9170;color:#54412f;box-shadow:0 4px 0 #c8b498,0 7px 15px #80664c15;padding:14px 23px;display:inline-flex;align-items:center;justify-content:center}
.outline:hover,.text-button:hover{background:#f2e4cf;transform:translateY(-2px);box-shadow:0 6px 0 #c8b498,0 10px 18px #80664c20}
.outline:active,.text-button:active{transform:translateY(3px);box-shadow:0 1px 0 #c8b498}
.scroll{margin:28px auto 8px;font-size:12px;letter-spacing:.5px}
header>a:last-child{display:inline-flex;align-items:center;background:#f0e4d4;border:1px solid #c4ad8c;box-shadow:0 3px 0 #d0b99a;padding:10px 15px;min-height:42px;font-size:11px}
.team{border:1.5px solid #9db8c7;background:linear-gradient(160deg,#fffefa,#e1edf3);box-shadow:0 5px 0 #a3bcc9,0 9px 17px #527a9015;position:relative}
.team.girl{border-color:#d3a5b1;background:linear-gradient(160deg,#fffefa,#f5e0e6);box-shadow:0 5px 0 #d3a5b1,0 9px 17px #af6d7b15}
.team::after{content:'Elegir equipo ○';display:block;margin:17px auto 0;width:fit-content;padding:7px 13px;border-radius:30px;background:#fffdf9;border:1px solid #b5c9d3;color:#3d5f72;font:600 11px/1.4 'DM Sans',sans-serif}
.team.girl::after{border-color:#d8b1bd;color:#8f4d60}
.team[aria-pressed=true]{border:2px solid #426173;background:#dceaf1;box-shadow:0 2px 0 #6e91a3;transform:translateY(3px)}
.team.girl[aria-pressed=true]{border-color:#99586b;background:#f2dce3;box-shadow:0 2px 0 #c48e9e}
.team[aria-pressed=true]::after{content:'Equipo elegido ✓';background:#426173;border-color:#426173;color:white}
.team.girl[aria-pressed=true]::after{background:#99586b;border-color:#99586b}
.answer{border:1.5px solid #b7c9d2;box-shadow:0 5px 0 #bbccd4,0 8px 14px #527a9012;background:linear-gradient(150deg,#fffdf9,#e9f0f3);padding-bottom:42px}
.answer.no{background:linear-gradient(150deg,#fffdf9,#f4e5e8);border-color:#d8b3bd;box-shadow:0 5px 0 #dbc0c8}
.answer.maybe{background:linear-gradient(150deg,#fffdf9,#eee3d3);border-color:#cbb89e;box-shadow:0 5px 0 #d1bfa6}
.answer:after{content:'';position:absolute;bottom:12px;left:calc(50% - 10px);height:20px;width:20px;border:1.5px solid #98816a;border-radius:50%;background:#fffdf8}
.answer:has(input:checked){border:2px solid #426173;box-shadow:0 2px 0 #8fadb9;transform:translateY(3px)}
.answer.no:has(input:checked){border-color:#99586b;box-shadow:0 2px 0 #c48e9e}
.answer:has(input:checked):after{background:#426173;border-color:#426173}
.answer.no:has(input:checked):after{background:#99586b;border-color:#99586b}
.answer.maybe:has(input:checked):after{background:#7c654e;border-color:#7c654e}
.answer-check{z-index:1;bottom:12px;left:calc(50% - 7px);width:14px;line-height:20px;color:white;font-weight:600}
.answer small{color:#66594e;font-size:10px}.answer strong{min-height:48px}
footer .text-button{margin:25px auto 5px}
@media(max-width:480px){.hero-copy{padding:72px 20px 20px}.hero h1{font-size:clamp(35px,10.8vw,48px)}.hero .intro{font-size:27px}.hero::after{aspect-ratio:1.35;background-size:110% auto}.hero .parents{font-size:27px}.scroll{font-size:11px;padding:15px 19px}.answer strong{font-size:21px}.answer small{font-size:9px}header{gap:9px}header>a:last-child{padding:9px 11px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.primary,.outline,.scroll,.text-button,header>a:last-child{transition:none}}