:root{
    --green:#0b8f68;
    --green-dark:#075b47;
    --mint:#6ee7b7;
    --lime:#b8f36b;
    --cyan:#58d8d0;
    --cream:#f5f8f2;
    --ink:#0f2e28;
    --muted:#61756f;
    --line:#dce9e2;
    --white:#fff;
    --shadow:0 24px 70px rgba(16,89,66,.13)
}
 *{
    box-sizing:border-box
}
html{
    scroll-behavior:smooth;
    scroll-padding-top:96px
}
body{
    margin:0;
    font-family:Inter,Segoe UI,Arial,sans-serif;
    color:var(--ink);
    background:#fff;
    line-height:1.55;
    overflow-x:hidden
}
body.menu-open{
    overflow:hidden
}
a{
    color:inherit
}
button,input{
    font:inherit
}
.shell{
    width:min(1240px,calc(100% - 40px));
    margin:auto
}
.responsible-bar{
    background:#073b30;
    color:#fff;
    font-size:11px
}
.responsible-inner{
    min-height:36px;
    display:flex;
    justify-content:space-between;
    align-items:center
}
.responsible-inner b{
    display:inline-grid;
    place-items:center;
    width:27px;
    height:27px;
    border-radius:50%;
    background:var(--lime);
    color:#14382d;
    margin-right:8px
}
.site-header{
    position:sticky;
    top:0;
    z-index:50;
    background:rgba(255,255,255,.88);
    backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(11,143,104,.12)
}
.nav{
    min-height:84px;
    display:flex;
    align-items:center;
    gap:28px
}
.brand{
    display:flex;
    align-items:center;
    gap:12px;
    text-decoration:none;
    margin-right:auto
}
.brand-mark{
    position:relative;
    width:48px;
    height:48px;
    border-radius:17px;
    background:linear-gradient(145deg,var(--green),var(--cyan));
    box-shadow:0 10px 26px rgba(11,143,104,.28)
}
.brand-mark i{
    position:absolute;
    width:12px;
    height:12px;
    border-radius:50%;
    background:#fff
}
.brand-mark i:nth-child(1){
    left:10px;
    top:12px
}
.brand-mark i:nth-child(2){
    right:10px;
    top:18px
}
.brand-mark i:nth-child(3){
    left:18px;
    bottom:9px
}
.brand strong{
    display:block;
    font-size:21px
}
.brand small{
    display:block;
    font-size:10px;
    color:var(--muted)
}
.main-menu{
    display:flex;
    gap:25px
}
.main-menu a{
    text-decoration:none;
    font-size:12px;
    font-weight:850
}
.main-menu a:hover{
    color:var(--green)
}
.nav-button{
    padding:12px 17px;
    border-radius:999px;
    background:var(--green);
    color:#fff;
    text-decoration:none;
    font-size:11px;
    font-weight:900
}
.menu-toggle{
    display:none;
    border:1px solid var(--line);
    background:#fff;
    border-radius:10px;
    padding:9px 12px
}
.hero{
    position:relative;
    overflow:hidden;
    padding:86px 0 76px;
    background:linear-gradient(135deg,#f6fff9,#e8fbf2 55%,#e9fbfa)
}
.hero-grid{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:70px;
    align-items:center
}
.hero-copy{
    position:relative;
    z-index:2
}
.pill,.eyebrow{
    display:inline-flex;
    padding:8px 12px;
    border-radius:999px;
    background:#dff7ec;
    color:var(--green-dark);
    font-size:10px;
    font-weight:950;
    letter-spacing:.1em
}
.eyebrow.light{
    background:rgba(255,255,255,.13);
    border:1px solid rgba(255,255,255,.2);
    color:#fff
}
.hero h1,.section h2,.newsletter h2{
    font-size:clamp(44px,6vw,78px);
    line-height:.96;
    letter-spacing:-.055em;
    margin:18px 0
}
.hero p{
    font-size:18px;
    color:var(--muted);
    max-width:610px
}
.hero-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:28px
}
.button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:14px;
    padding:14px 19px;
    text-decoration:none;
    font-weight:900;
    cursor:pointer
}
.button.primary{
    background:linear-gradient(135deg,var(--green),#17aa7d);
    color:#fff;
    box-shadow:0 15px 35px rgba(11,143,104,.24)
}
.button.secondary{
    background:#fff;
    color:var(--ink);
    border:1px solid var(--line)
}
.button.white{
    background:#fff;
    color:var(--green-dark)
}
.hero-points{
    display:flex;
    gap:18px;
    flex-wrap:wrap;
    margin-top:27px;
    color:#42645a;
    font-size:12px;
    font-weight:800
}
.hero-visual{
    position:relative;
    min-height:570px;
    display:grid;
    place-items:center
}
.image-placeholder{
    display:grid;
    place-items:center;
    align-content:center;
    text-align:center;
    border:2px dashed rgba(11,143,104,.35);
    background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(219,247,234,.72));
    color:var(--green-dark);
    overflow:hidden
}
.image-placeholder strong,.image-placeholder span,.image-placeholder small{
    display:block
}
.image-placeholder strong{
    font-size:14px;
    margin-top:10px
}
.image-placeholder span{
    font-size:12px;
    margin-top:4px
}
.image-placeholder small{
    font-size:10px;
    color:var(--muted);
    margin-top:5px
}
.placeholder-icon{
    width:78px;
    height:78px;
    border-radius:28px;
    display:grid;
    place-items:center;
    background:linear-gradient(145deg,var(--green),var(--cyan));
    color:#fff;
    font-size:30px;
    font-weight:950;
    box-shadow:0 18px 38px rgba(11,143,104,.25)
}
.hero-image{
     width:100%;
     max-width:760px;
     height:auto;
     display:block;
     object-fit:contain;
     border-radius:0;
     box-shadow:none;
     animation:float 5s ease-in-out infinite;
     user-select:none;
     pointer-events:none;
}
.floating-chip{
    position:absolute;
    padding:11px 14px;
    border-radius:16px;
    background:#fff;
    box-shadow:0 18px 45px rgba(9,78,58,.16);
    animation:float 4s ease-in-out infinite
}
.floating-chip b,.floating-chip span{
    display:block
}
.floating-chip b{
    font-size:18px;
    color:var(--green)
}
.floating-chip span{
    font-size:9px;
    color:var(--muted)
}
.chip-one{
    left:0;
    top:15%
}
.chip-two{
    right:0;
    top:30%;
    animation-delay:.7s
}
.chip-three{
    left:8%;
    bottom:10%;
    animation-delay:1.2s
}
.chip-four{
    right:8%;
    bottom:16%;
    animation-delay:1.7s
}
.hero-blob{
    position:absolute;
    border-radius:50%;
    filter:blur(70px);
    opacity:.35
}
.blob-a{
    width:360px;
    height:360px;
    background:var(--mint);
    left:-130px;
    top:-100px
}
.blob-b{
    width:380px;
    height:380px;
    background:var(--cyan);
    right:-150px;
    bottom:-130px
}
@keyframes float{
    50%{
        transform:translateY(-12px)
    }
}
.ticker{
    overflow:hidden;
    background:var(--green-dark);
    color:#fff;
    padding:16px 0
}
.ticker-track{
    display:flex;
    align-items:center;
    gap:25px;
    width:max-content;
    animation:ticker 23s linear infinite;
    font-size:12px;
    font-weight:900;
    letter-spacing:.13em
}
.ticker-track i{
    color:var(--lime)
}
@keyframes ticker{
    to{
        transform:translateX(-50%)
    }
}
.numbers-section{
    padding:34px 0;
    background:#fff
}
.number-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px
}
.number-card{
    padding:24px;
    border-radius:22px;
    background:linear-gradient(145deg,#f7fff9,#eefaf4);
    border:1px solid var(--line)
}
.number-card strong{
    display:block;
    font-size:37px;
    color:var(--green)
}
.number-card span{
    font-size:11px;
    color:var(--muted)
}
.section{
    padding:100px 0
}
.section-heading{
    max-width:780px;
    margin-bottom:42px
}
.section-heading h2{
    font-size:clamp(38px,5vw,68px)
}
.section-heading p{
    font-size:16px;
    color:var(--muted)
}
.split-heading{
    max-width:none;
    display:grid;
    grid-template-columns:1fr minmax(320px,510px);
    gap:50px;
    align-items:end
}
.compare-section{
    background:var(--cream)
}
.provider-showcase{
    display:grid;
    grid-template-columns:.92fr 1.08fr;
    gap:20px
}
.provider-feature{
    position:relative;
    display:grid;
    grid-template-columns:110px 1fr 150px;
    gap:22px;
    align-items:center;
    padding:30px;
    border-radius:30px;
    background:linear-gradient(145deg,#0a7658,#0f9f75);
    color:#fff;
    box-shadow:var(--shadow);
    overflow:hidden
}
.provider-feature:after{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    border-radius:50%;
    right:-120px;
    top:-110px;
    background:radial-gradient(circle,rgba(184,243,107,.35),transparent 70%)
}
.provider-logo-placeholder{
    width:96px;
    height:96px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:transparent;
    padding:0;
    border-radius:0;
    box-shadow:none;
}

.provider-logo-placeholder img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
}
.provider-label{
    font-size:9px;
    letter-spacing:.1em;
    font-weight:950;
    color:#c8ffd9
}
.provider-feature h3{
    font-size:38px;
    margin:8px 0
}
.provider-feature p{
    color:#d9f8e8
}
.provider-tags{
    display:flex;
    gap:7px;
    flex-wrap:wrap
}
.provider-tags span{
    padding:7px 9px;
    border-radius:999px;
    background:rgba(255,255,255,.12);
    font-size:9px
}
.provider-feature a{
    display:inline-block;
    margin-top:18px;
    color:#fff;
    font-size:11px;
    font-weight:900
}
.radial-score{
    --score:90;
    position:relative;
    width:140px;
    height:140px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:conic-gradient(var(--lime) calc(var(--score)*1%),rgba(255,255,255,.16) 0)
}
.radial-score:before{
    content:"";
    position:absolute;
    width:105px;
    height:105px;
    border-radius:50%;
    background:#0d835f
}
.radial-score span{
    position:relative;
    text-align:center
}
.radial-score b,.radial-score small{
    display:block
}
.radial-score b{
    font-size:37px
}
.radial-score small{
    font-size:9px
}
.provider-stack{
    display:grid;
    gap:13px
}
.provider-line{
    display:grid;
    grid-template-columns:48px 1fr 110px 110px;
    gap:16px;
    align-items:center;
    padding:19px;
    border-radius:21px;
    background:#fff;
    border:1px solid var(--line);
    transition:.3s
}
.provider-line:hover{
    transform:translateX(8px);
    box-shadow:0 18px 48px rgba(14,94,69,.12)
}
.provider-number{
    width:42px;
    height:42px;
    border-radius:14px;
    display:grid;
    place-items:center;
    background:#e0f7eb;
    color:var(--green);
    font-weight:950
}
.provider-line h3{
    margin:0;
    font-size:20px
}
.provider-line p{
    margin:3px 0 0;
    font-size:11px;
    color:var(--muted)
}
.mini-score b{
    display:block;
    color:var(--green);
    font-size:24px
}
.mini-score i{
    display:block;
    height:8px;
    border-radius:99px;
    background:#e8f1ed;
    overflow:hidden
}
.mini-score i span{
    display:block;
    width:0;
    height:100%;
    background:linear-gradient(90deg,var(--green),var(--lime));
    border-radius:inherit
}
.visible .mini-score i span{
    animation:grow 1.2s forwards;
    width:var(--width)
}
@keyframes grow{
    from{
        width:0
    }
}
.provider-line button{
    border:1px solid #bcdccd;
    background:#fff;
    color:var(--green-dark);
    border-radius:10px;
    padding:10px;
    font-weight:900;
    cursor:pointer
}
.insight-section{
    background:#fff
}
.dashboard-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px
}
.chart-card{
    padding:28px;
    border-radius:27px;
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 18px 50px rgba(14,94,69,.08)
}
.card-title{
    display:flex;
    gap:12px;
    align-items:center
}
.card-title>span{
    width:38px;
    height:38px;
    border-radius:13px;
    display:grid;
    place-items:center;
    background:#e3f8ed;
    color:var(--green);
    font-weight:950
}
.card-title h3{
    font-size:19px
}
.donut-card{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:30px
}
.donut-card .card-title{
    grid-column:1/-1
}
.donut-chart{
    position:relative;
    width:220px;
    height:220px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:conic-gradient(var(--green) 0 38%,var(--cyan) 38% 69%,var(--lime) 69% 88%,#c9ded6 88%)
}
.donut-chart:before{
    content:"";
    position:absolute;
    width:135px;
    height:135px;
    border-radius:50%;
    background:#fff
}
.donut-center{
    position:relative;
    text-align:center
}
.donut-center b,.donut-center span{
    display:block
}
.donut-center b{
    font-size:36px;
    color:var(--green)
}
.donut-center span{
    font-size:10px;
    color:var(--muted)
}
.chart-legend{
    list-style:none;
    padding:0;
    margin:0;
    display:grid;
    align-content:center;
    gap:13px
}
.chart-legend li{
    display:grid;
    grid-template-columns:12px 1fr auto;
    gap:9px;
    font-size:12px
}
.chart-legend i{
    width:10px;
    height:10px;
    border-radius:50%
}
.l1{
    background:var(--green)
}
.l2{
    background:var(--cyan)
}
.l3{
    background:var(--lime)
}
.l4{
    background:#c9ded6
}
.horizontal-bars{
    display:grid;
    gap:19px;
    margin-top:25px
}
.horizontal-bars label{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    font-size:12px
}
.horizontal-bars label i{
    grid-column:1/-1;
    height:12px;
    border-radius:99px;
    background:#edf3f0;
    overflow:hidden
}
.horizontal-bars em{
    display:block;
    width:0;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--green),var(--cyan))
}
.visible .horizontal-bars em{
    animation:grow 1.3s forwards;
    width:var(--value)
}
.activity-chart{
    height:225px;
    display:flex;
    align-items:end;
    gap:13px;
    padding-top:25px
}
.activity-chart span{
    height:var(--h);
    flex:1;
    border-radius:12px 12px 4px 4px;
    background:linear-gradient(180deg,var(--cyan),var(--green));
    position:relative;
    transform-origin:bottom;
    animation:barRise 1.2s ease
}
.activity-chart b{
    position:absolute;
    bottom:-24px;
    left:50%;
    transform:translateX(-50%);
    font-size:9px;
    color:var(--muted)
}
@keyframes barRise{
    from{
        transform:scaleY(0)
    }
}
.chart-note{
    font-size:11px;
    color:var(--muted);
    margin-top:35px
}
.multi-ring{
    display:flex;
    justify-content:center;
    gap:18px;
    align-items:center;
    min-height:250px
}
.ring{
    position:relative;
    border-radius:50%;
    display:grid;
    place-items:center
}
.ring:before{
    content:"";
    position:absolute;
    border-radius:50%;
    background:#fff
}
.ring span{
    position:relative;
    text-align:center
}
.ring b,.ring small{
    display:block
}
.ring-one{
    width:165px;
    height:165px;
    background:conic-gradient(var(--green) 68%,#edf2ef 0)
}
.ring-one:before{
    width:120px;
    height:120px
}
.ring-two{
    width:125px;
    height:125px;
    background:conic-gradient(var(--cyan) 24%,#edf2ef 0)
}
.ring-two:before{
    width:90px;
    height:90px
}
.ring-three{
    width:95px;
    height:95px;
    background:conic-gradient(var(--lime) 8%,#edf2ef 0)
}
.ring-three:before{
    width:69px;
    height:69px
}
.ring b{
    font-size:23px;
    color:var(--green)
}
.ring small{
    font-size:9px;
    color:var(--muted)
}
.image-story{
    background:var(--cream)
}
.story-row{
    display:grid;
    grid-template-columns:.92fr 1.08fr;
    gap:60px;
    align-items:center
}
.story-image{
     display:flex;
     align-items:center;
     justify-content:center;
     height:650px;
     overflow:hidden;
     border-radius:34px;
}
 .story-image-img{
     width:100%;
     height:100%;
     object-fit:contain;
     display:block;
     user-select:none;
     pointer-events:none;
     animation:float 6s ease-in-out infinite;
}
.story-content>p{
    color:var(--muted);
    font-size:17px
}
.game-type-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin:28px 0
}
.game-type{
    display:flex;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid var(--line);
    border-radius:17px;
    background:#fff;
    text-align:left;
    cursor:pointer;
    transition:.25s
}
.game-type:hover,.game-type.active{
    background:linear-gradient(145deg,#e5faef,#d7f7ea);
    border-color:#90d7b8;
    transform:translateY(-3px)
}
.game-type b{
    width:42px;
    height:42px;
    border-radius:14px;
    display:grid;
    place-items:center;
    background:var(--green);
    color:#fff
}
.game-type span{
    font-size:12px;
    font-weight:850
}
.game-explainer{
    padding:24px;
    border-radius:22px;
    background:#fff;
    border:1px solid var(--line)
}
.game-explainer>span{
    font-size:9px;
    font-weight:950;
    color:var(--green)
}
.game-explainer h3{
    font-size:27px;
    margin:8px 0
}
.game-explainer p{
    color:var(--muted)
}
.editorial-section{
    background:linear-gradient(145deg,#075b47,#0b8f68);
    color:#fff
}
.editorial-grid{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:65px;
    align-items:center
}
.editorial-copy>p{
    font-size:17px;
    color:#d6f5e8
}
.editorial-points{
    display:grid;
    gap:12px;
    margin:28px 0
}
.editorial-points article{
    display:grid;
    grid-template-columns:52px 1fr;
    gap:15px;
    padding:16px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:17px;
    background:rgba(255,255,255,.08)
}
.editorial-points article>span{
    font-size:25px;
    color:var(--lime);
    font-weight:950
}
.editorial-points h3{
    margin:0 0 3px
}
.editorial-points p{
    margin:0;
    font-size:12px;
    color:#d4eee4
}
.editorial-actions{
    display:flex;
    gap:18px;
    align-items:center;
    flex-wrap:wrap
}
.text-link{
    color:#fff;
    font-weight:900;
    font-size:12px
}
.editorial-image{
    display:flex;
    align-items:center;
    justify-content:center;
    height:670px;
    overflow:hidden;
    border-radius:34px;
}

.editorial-image-img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
    animation:float 6s ease-in-out infinite;
    user-select:none;
    pointer-events:none;
}
.testimonials-section{
    background:#fff
}
.testimonial-slider{
    position:relative;
    min-height:320px
}
.testimonial{
    display:none;
    padding:42px;
    border-radius:30px;
    background:linear-gradient(145deg,#f4fff8,#e9faf2);
    border:1px solid var(--line)
}
.testimonial.active{
    display:block;
    animation:fadeSlide .5s ease
}
@keyframes fadeSlide{
    from{
        opacity:0;
        transform:translateY(15px)
    }
}
.quote-mark{
    font-size:70px;
    line-height:.7;
    color:var(--green)
}
.testimonial>p{
    font-size:clamp(23px,3vw,38px);
    line-height:1.2;
    max-width:900px
}
.testimonial>div:last-child{
    display:grid;
    grid-template-columns:48px 1fr;
    align-items:center
}
.avatar{
    grid-row:1/3;
    width:42px;
    height:42px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:var(--green);
    color:#fff;
    font-weight:950
}
.testimonial b,.testimonial small{
    display:block
}
.testimonial small{
    font-size:10px;
    color:var(--muted)
}
.slider-controls{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:16px;
    margin-top:20px
}
.slider-controls>button{
    width:42px;
    height:42px;
    border-radius:50%;
    border:1px solid var(--line);
    background:#fff;
    cursor:pointer
}
.slider-dots{
    display:flex;
    gap:7px
}
.slider-dots button{
    width:9px;
    height:9px;
    border:0;
    border-radius:99px;
    background:#cdded6;
    cursor:pointer
}
.slider-dots button.active{
    width:25px;
    background:var(--green)
}
.faq-section{
    background:var(--cream)
}
.faq-grid{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:65px
}
.faq-intro{
    position:sticky;
    top:120px;
    align-self:start
}
.faq-list details{
    padding:20px 0;
    border-bottom:1px solid #cfe1d8
}
.faq-list summary{
    font-size:18px;
    font-weight:900;
    cursor:pointer
}
.faq-list p{
    color:var(--muted)
}
.newsletter-section{
    padding:55px 0;
    background:#fff
}
.newsletter{
    padding:38px;
    border-radius:30px;
    background:linear-gradient(135deg,var(--green-dark),var(--green));
    color:#fff;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:40px;
    align-items:center
}
.newsletter h2{
    font-size:clamp(32px,4vw,52px)
}
.newsletter form{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px
}
.newsletter input{
    border:0;
    border-radius:13px;
    padding:15px
}
.newsletter button{
    border:0;
    border-radius:13px;
    background:var(--lime);
    color:#16362c;
    font-weight:950;
    padding:0 22px
}
.newsletter #form-message{
    grid-column:1/-1;
    font-size:11px;
    margin:0
}
.footer{
    background:#062f27;
    color:#cde3db;
    padding:48px 0 20px
}
.footer-grid{
    display:grid;
    grid-template-columns:1.4fr .7fr .7fr .8fr;
    gap:35px
}
.footer .brand strong{
    color:#fff
}
.footer .brand small{
    color:#a9cac0
}
.footer p,.footer a{
    font-size:11px
}
.footer a{
    display:block;
    text-decoration:none;
    margin:7px 0
}
.footer h3{
    color:#fff;
    font-size:12px
}
.footer-badge{
    display:flex;
    gap:13px;
    align-items:center;
    padding:17px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:17px
}
.footer-badge strong{
    font-size:32px;
    color:#fff
}
.footer-badge span{
    font-size:10px
}
.footer-bottom{
    margin-top:25px;
    padding-top:15px;
    border-top:1px solid rgba(255,255,255,.12);
    font-size:9px
}
.age-gate{
    position:fixed;
    inset:0;
    z-index:100;
    background:rgba(4,42,33,.9);
    display:grid;
    place-items:center;
    padding:20px
}
.age-gate.hidden{
    display:none
}
.age-card{
    width:min(470px,100%);
    padding:36px;
    border-radius:28px;
    background:#fff;
    text-align:center;
    box-shadow:0 30px 90px rgba(0,0,0,.28)
}
.age-ball{
    width:78px;
    height:78px;
    margin:auto;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:linear-gradient(145deg,var(--green),var(--cyan));
    color:#fff;
    font-size:23px;
    font-weight:950
}
.mini-label{
    display:block;
    margin-top:18px;
    font-size:9px;
    letter-spacing:.12em;
    color:var(--green);
    font-weight:950
}
.age-card h2{
    font-size:32px
}
.age-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:11px;
    margin-top:22px
}
.age-actions button,.age-actions a{
    border:0;
    border-radius:12px;
    padding:13px;
    text-decoration:none;
    font-weight:900
}
.age-actions button{
    background:var(--green);
    color:#fff
}
.age-actions a{
    background:#e8f0ec
}
.reveal{
    opacity:0;
    transform:translateY(24px);
    transition:.75s
}
.reveal.visible{
    opacity:1;
    transform:none
}
dialog{
    width:min(560px,calc(100% - 30px));
    border:0;
    border-radius:26px;
    padding:34px;
    box-shadow:0 30px 100px rgba(4,42,33,.35)
}
dialog::backdrop{
    background:rgba(4,42,33,.72);
    backdrop-filter:blur(7px)
}
.dialog-close{
    position:absolute;
    right:15px;
    top:10px;
    border:0;
    background:transparent;
    font-size:28px;
    cursor:pointer
}
.dialog-action{
    margin-top:12px
}
 @media(max-width:1000px){
    .main-menu{
        display:none
    }
    .menu-toggle{
        display:block
    }
    .nav-button{
        display:none
    }
    .main-menu.open{
        display:flex;
        position:fixed;
        top:120px;
        left:0;
        right:0;
        flex-direction:column;
        padding:22px;
        background:#fff;
        border-bottom:1px solid var(--line)
    }
    .hero-grid,.provider-showcase,.story-row,.editorial-grid,.faq-grid,.newsletter{
        grid-template-columns:1fr
    }
    .hero-visual{
        order:-1;
        min-height:470px
    }
    .provider-feature{
        grid-template-columns:90px 1fr 130px
    }
    .dashboard-grid{
        grid-template-columns:1fr
    }
    .split-heading{
        grid-template-columns:1fr
    }
    .footer-grid{
        grid-template-columns:1fr 1fr
    }
}
 @media(max-width:680px){
    .shell{
        width:min(100% - 22px,1240px)
    }
    .responsible-inner span:last-child{
        display:none
    }
    .hero{
        padding-top:45px
    }
    .hero h1,.section h2{
        font-size:43px
    }
    .hero-image{
        width:88%
    }
    .floating-chip{
        display:none
    }
    .number-grid{
        grid-template-columns:1fr 1fr
    }
    .section{
        padding:72px 0
    }
    .provider-feature{
        grid-template-columns:1fr;
        text-align:center
    }
    .provider-logo-placeholder,.radial-score{
        margin:auto
    }
    .provider-line{
        grid-template-columns:45px 1fr
    }
    .provider-line .mini-score,.provider-line button{
        grid-column:2
    }
    .donut-card{
        grid-template-columns:1fr
    }
    .donut-card .card-title{
        grid-column:auto
    }
    .donut-chart{
        margin:auto
    }
    .multi-ring{
        flex-wrap:wrap
    }
    .story-image,.editorial-image{
        height:450px
    }
    .story-image-img{
        width:100%;
        height:100%;
        object-fit:contain
    }
    .game-type-grid{
        grid-template-columns:1fr
    }
    .newsletter form{
        grid-template-columns:1fr
    }
    .newsletter button{
        padding:14px
    }
    .footer-grid{
        grid-template-columns:1fr
    }
    .age-actions{
        grid-template-columns:1fr
    }
}
 @media(prefers-reduced-motion:reduce){
    html{
        scroll-behavior:auto
    }
    .reveal{
        opacity:1;
        transform:none;
        transition:none
    }
    .hero-image,.floating-chip,.ticker-track{
        animation:none
    }
}