@import url("revista.css");

:root { --family-purple:#685d7c; --family-lilac:#e8e2ee; --family-rose:#f5ddd6; }
.family-hero { display:grid; gap:70px; grid-template-columns:1.04fr .96fr; margin:auto; max-width:1160px; min-height:555px; padding:68px 28px 78px; }
.feature,.topics { padding-bottom:76px; padding-top:76px; }
.family-copy { align-self:center; max-width:590px; }.family-copy h1 { font-size:clamp(46px,5vw,70px); }.family-copy h1 em { color:var(--family-purple); font-style:italic; }.family-copy > p:not(.eyebrow) { color:var(--ink-soft); font-size:20px; line-height:1.62; margin:28px 0 25px; max-width:515px; }.family-copy .status-note span { color:var(--family-purple); }
.family-art { align-self:center; background:#e5e6d8; border-radius:180px 180px 24px 24px; min-height:410px; overflow:hidden; position:relative; }.art-circle { background:#d5c2dd; border-radius:50%; height:167px; position:absolute; right:15%; top:36px; width:167px; }.art-arch { border:36px solid #9fc3ba; border-bottom:0; border-radius:160px 160px 0 0; bottom:0; height:245px; left:18%; position:absolute; width:230px; }.art-plant { bottom:21px; height:156px; left:42px; position:absolute; width:95px; }.art-plant::after { background:#5e8d79; bottom:0; content:""; height:103px; left:45px; position:absolute; width:4px; }.art-plant i { background:#7eac94; border-radius:100% 0 100% 0; display:block; height:65px; position:absolute; width:28px; }.art-plant i:nth-child(1) { left:18px; top:30px; transform:rotate(-43deg); }.art-plant i:nth-child(2) { left:50px; top:12px; transform:rotate(24deg); }.art-plant i:nth-child(3) { left:55px; top:77px; transform:rotate(52deg) scale(.72); }.notebook { background:#fffaf1; bottom:46px; box-shadow:0 15px 22px rgba(36,61,67,.16); left:calc(50% - 90px); min-height:232px; padding:28px 25px; position:absolute; transform:rotate(-5deg); width:187px; }.notebook p { font-family:"Lora",Georgia,serif; font-size:24px; line-height:1.06; margin:0 0 29px; }.notebook strong { color:var(--family-purple); font-style:italic; }.notebook > span { background:#d6e4df; display:block; height:6px; margin:11px 0; width:88px; }.notebook > span:nth-last-child(1) { width:55px; }.chat-card { background:#fffdf8; border-radius:13px; box-shadow:0 5px 12px rgba(36,61,67,.1); color:#4c6568; font-size:13px; font-weight:700; padding:10px 13px; position:absolute; }.chat-one { right:25px; top:58px; transform:rotate(4deg); }.chat-two { bottom:55px; right:17px; transform:rotate(-3deg); }.art-label { background:#f7e5dc; border-radius:999px; bottom:26px; color:#70524d; font-size:12px; font-weight:700; left:22px; padding:8px 12px; position:absolute; }
.feature-illustration { background:#ddd6e5; }.question-bubble { background:#fffdf8; border-radius:16px 16px 3px 16px; color:#4d5e65; font-size:15px; font-weight:600; left:11%; padding:15px 17px; position:absolute; top:23%; transform:rotate(-3deg); width:210px; }.heart-note { background:#cde4dc; border-radius:12px; bottom:20%; color:#365e59; font-size:14px; font-weight:700; max-width:197px; padding:13px 15px; position:absolute; right:10%; transform:rotate(4deg); }.reading-tag { background:#fff9ee; border-radius:99px; color:#64797b; font-size:13px; font-weight:600; padding:7px 11px; }
.guide { display:grid; gap:68px; grid-template-columns:1.2fr .8fr; margin:auto; max-width:1030px; padding:7px 28px 84px; }.guide-copy { color:#425c62; font-size:18px; line-height:1.72; }.guide-copy h2 { color:var(--ink); font-size:clamp(31px,3.4vw,45px); line-height:1.28; }.guide-copy > p { margin:23px 0; }.guide-copy ol { border-left:2px solid #c8b5d2; list-style:none; margin:0; padding:2px 0 2px 25px; }.guide-copy li { margin:14px 0; padding-left:2px; }.guide-copy li strong { color:var(--ink); }.guide-aside { align-self:start; display:grid; gap:16px; padding-top:12px; }.phrase-card,.note-card { border-radius:17px; padding:25px; }.phrase-card { background:#d8e7ad; color:#41635b; }.phrase-card span { display:block; font-family:"Lora",Georgia,serif; font-size:39px; height:28px; line-height:1; }.phrase-card p { font-family:"Lora",Georgia,serif; font-size:23px; line-height:1.32; margin:13px 0 0; }.note-card { background:var(--family-rose); color:#654b47; }.note-card h3 { font-size:22px; line-height:1.3; margin:0 0 7px; }.note-card p { font-size:16px; line-height:1.58; margin:0; }
.news-context { background:#f2eee7; display:grid; gap:78px; grid-template-columns:.8fr 1.2fr; margin:auto; max-width:1104px; padding:76px 66px; }.news-copy h2 { font-size:clamp(34px,3.6vw,46px); }.news-copy > p:last-child { color:var(--ink-soft); font-size:17px; line-height:1.62; margin:21px 0 0; }.news-items { border-bottom:1px solid var(--line); }.news-items article { border-top:1px solid var(--line); padding:20px 0 22px; }.news-items .content-label { margin-bottom:8px; }.news-items h3 { font-size:23px; line-height:1.3; }.news-items p:not(.content-label) { color:#587075; font-size:16px; line-height:1.58; margin:8px 0 13px; }.news-items a { border-bottom:1px solid currentColor; color:#4e7072; font-size:14px; font-weight:700; padding-bottom:2px; }
.entertainment { margin:auto; max-width:1104px; padding:78px 28px 82px; }.entertainment-heading { display:grid; gap:40px; grid-template-columns:1fr .77fr; margin-bottom:37px; }.entertainment-heading h2 { font-size:clamp(34px,3.6vw,47px); grid-column:1; line-height:1.24; }.entertainment-heading > p:last-child { align-self:end; color:var(--ink-soft); font-size:17px; grid-column:2; grid-row:1 / span 2; line-height:1.62; margin:0; }.entertainment-heading .eyebrow { grid-column:1; margin-bottom:-21px; }.activity-grid { display:grid; gap:16px; grid-template-columns:repeat(4,1fr); }.activity-card { border-radius:17px; min-height:296px; padding:25px; }.activity-card.music { background:#f5ddd6; }.activity-card.game { background:#e4e0ed; }.activity-card.screen { background:#cce1e2; }.activity-card.explore { background:#e4ebc7; }.activity-icon { align-items:center; background:rgba(255,255,255,.62); border-radius:50%; display:flex; font-size:18px; height:40px; justify-content:center; width:40px; }.activity-card h3 { font-size:22px; line-height:1.28; margin:27px 0 9px; }.activity-card p { color:#536a70; font-size:15px; line-height:1.56; margin:0 0 14px; }.activity-card small { border-top:1px solid rgba(36,61,67,.12); color:#60777a; display:block; font-size:13px; line-height:1.45; padding-top:13px; }.entertainment-note { align-items:baseline; border-top:1px solid var(--line); display:flex; gap:20px; margin-top:26px; padding-top:20px; }.entertainment-note b { color:var(--family-purple); font-family:"Lora",Georgia,serif; font-size:20px; font-weight:500; white-space:nowrap; }.entertainment-note p { color:#587075; font-size:16px; line-height:1.58; margin:0; max-width:640px; }
.protection-detail { display:grid; gap:68px; grid-template-columns:.82fr 1.18fr; margin:auto; max-width:1030px; padding:0 28px 84px; }.detail-heading h2 { font-size:clamp(31px,3.4vw,45px); line-height:1.28; }.detail-copy { color:#425c62; font-size:18px; line-height:1.72; }.detail-copy > p { margin:0 0 22px; }.detail-checklist { background:#e5ebc5; border-radius:17px; color:#405e58; margin:29px 0 19px; padding:26px 28px; }.detail-checklist h3 { color:var(--ink); font-size:23px; line-height:1.3; }.detail-checklist ul { margin:13px 0 0; padding-left:20px; }.detail-checklist li { margin:7px 0; }.detail-copy .source-note { color:#63777a; font-size:13px; line-height:1.55; }.source-note a { border-bottom:1px solid currentColor; }
.protection { display:grid; gap:70px; grid-template-columns:.78fr 1.22fr; margin:auto; max-width:1104px; padding:82px 28px; }.protection-heading h2 { font-size:clamp(35px,3.7vw,50px); }.protection-heading > p:last-child { color:var(--ink-soft); font-size:17px; line-height:1.62; margin:21px 0 0; }.risk-list { border-bottom:1px solid var(--line); }.risk-list article { align-items:flex-start; border-top:1px solid var(--line); display:flex; gap:22px; padding:21px 0; }.risk-list b { color:var(--family-purple); font-family:"Lora",Georgia,serif; font-size:18px; font-weight:500; }.risk-list h3 { font-size:21px; line-height:1.32; }.risk-list p { color:#587075; font-size:16px; line-height:1.55; margin:5px 0 0; }.reading-paths { padding-bottom:82px; padding-top:82px; }
@media (max-width:850px) { .family-hero { gap:43px; grid-template-columns:1fr; min-height:0; }.family-art { min-height:375px; max-width:520px; }.guide,.protection,.news-context,.protection-detail,.entertainment-heading { gap:42px; grid-template-columns:1fr; }.guide-aside { grid-template-columns:1fr 1fr; }.protection { padding-bottom:72px; padding-top:72px; }.news-context { padding:70px 46px; }.entertainment-heading > p:last-child { grid-column:1; grid-row:auto; }.entertainment-heading .eyebrow { margin-bottom:-20px; }.activity-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px) { .family-hero { padding:52px 20px 62px; }.feature,.topics { padding-bottom:65px; padding-top:65px; }.family-copy > p:not(.eyebrow) { font-size:19px; }.family-art { min-height:335px; }.notebook { bottom:42px; left:calc(50% - 78px); min-height:208px; transform:rotate(-5deg) scale(.9); }.chat-one { right:14px; top:48px; }.chat-two { right:10px; }.guide,.protection,.protection-detail,.entertainment { padding-left:20px; padding-right:20px; }.guide { padding-bottom:65px; padding-top:0; }.guide-copy,.detail-copy { font-size:17px; line-height:1.68; }.guide-aside { grid-template-columns:1fr; }.protection { padding-bottom:65px; padding-top:65px; }.protection-detail { padding-bottom:65px; }.news-context { display:block; padding:62px 20px; }.news-items { margin-top:32px; }.entertainment { padding-bottom:65px; padding-top:65px; }.entertainment-heading { display:block; margin-bottom:28px; }.entertainment-heading .eyebrow { margin-bottom:16px; }.entertainment-heading > p:last-child { margin-top:17px; }.activity-grid { grid-template-columns:1fr; }.activity-card { min-height:auto; }.entertainment-note { align-items:flex-start; flex-direction:column; gap:6px; margin-top:20px; }.risk-list h3 { font-size:20px; }.detail-checklist { padding:23px 22px; }.reading-paths { padding-bottom:65px; padding-top:65px; } }