*{box-sizing:border-box;}
body{margin:0;}
/* Accessibility: screen-reader-only text, visible keyboard focus, skip link */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #FF4C29 !important;outline-offset:2px;}
.skip-link{position:absolute;left:12px;top:-60px;background:#003BFF;color:#fff;font-weight:700;font-size:14px;padding:12px 20px;border-radius:8px;z-index:2000;transition:top .2s ease;}
.skip-link:focus{top:12px;}
/* Prevent long words (Finnish compounds) from breaking layout */
h1,h2,h3,h4,h5,h6,p,li,summary{overflow-wrap:break-word;word-break:break-word;hyphens:auto;}
[data-hero-grid]>*,[data-about-grid]>*,[data-themes-grid]>*,[data-theme-card],[data-game-block]>*,[data-form-grid]>*,[data-fgrid]>*,[data-footer-grid]>*,.content-block>*,.testimonial-grid>*,.steps-grid>*{min-width:0;}
[data-theme-cap]{min-width:0;}
a{color:#003BFF;text-decoration:none;}
a:hover{color:#FF4C29;}
@keyframes ri-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes ri-floatA{0%,100%{transform:translateY(0)}50%{transform:translateY(-24px)}}
@keyframes ri-floatB{0%,100%{transform:translateY(0)}50%{transform:translateY(24px)}}
@keyframes ri-floatC{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes ri-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
@keyframes ri-rise{from{opacity:0;transform:translateY(46px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:no-preference){
  [data-reveal]{animation:ri-rise linear both;animation-timeline:view();animation-range:entry 4% cover 26%;}
}
[data-theme-card]:hover [data-theme-img]{transform:scale(1.05);}
#yhteystiedot input::placeholder,#yhteystiedot textarea::placeholder{color:rgba(255,255,255,0.8);opacity:1;}
[data-sub]:hover [data-sub-btn]{background:#e63e1d;}
/* Mobile nav (hamburger + drawer) */
.mobile-menu-btn{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;flex:0 0 auto;background:none;border:none;cursor:pointer;padding:0;}
.mobile-menu-btn span{display:block;width:24px;height:2px;background:#1A1A1A;border-radius:2px;transition:transform .2s ease,opacity .2s ease;}
.mobile-menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.mobile-menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0;}
.mobile-menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mobile-menu{display:none;flex-direction:column;max-width:1240px;margin:0 auto;padding:4px 28px 20px;}
.mobile-menu.is-open{display:flex;}
.mobile-menu a{color:#1A1A1A;font-weight:600;font-size:16px;padding:14px 0;border-bottom:1px solid rgba(0,0,0,.08);}
.mobile-menu a:last-child{border-bottom:none;}

@media (max-width:900px){
  [data-hero-grid]{grid-template-columns:1fr!important;gap:8px!important;}
  [data-hero-collage]{height:400px!important;margin-top:24px;}
  [data-about-grid]{grid-template-columns:1fr!important;}
  [data-about-img]{transform:none!important;margin-top:24px;}
  [data-themes-grid]{grid-template-columns:1fr!important;grid-auto-rows:300px!important;}
  [data-theme-card]{grid-column:auto!important;grid-row:auto!important;}
  [data-game-block]{grid-template-columns:1fr!important;}
  [data-game-img]{order:-1;}
  [data-form-grid]{grid-template-columns:1fr!important;}
  [data-fgrid]{grid-template-columns:1fr!important;}
  [data-footer-grid]{grid-template-columns:1fr!important;}
  [data-nav]{display:none!important;}
  [data-header-actions]{display:none!important;}
  .mobile-menu-btn{display:flex;}
  .steps-grid{grid-template-columns:repeat(2,1fr)!important;}
}

@media (max-width:560px){
  [data-hero-collage]{height:320px!important;}
  .page-hero{padding:40px 20px 16px!important;}
  .page-section{padding:28px 20px 50px!important;}
  .legal-page{padding:50px 20px 70px!important;}
  .content-block{padding:26px!important;}
  .testimonial-card{padding:24px!important;}
  .steps-grid{grid-template-columns:1fr!important;}
  .site-modal-box{padding:30px!important;}
}

/* Shared static pages (legal/policy pages) */
.legal-page{max-width:860px;margin:0 auto;padding:70px 28px 100px;}
.legal-page h1{font-family:'Montserrat',sans-serif;font-weight:900;text-transform:uppercase;font-size:clamp(34px,5vw,58px);line-height:1.02;letter-spacing:-.02em;margin:0 0 40px;color:#1A1A1A;}
.legal-page h2{font-family:'Montserrat',sans-serif;font-weight:800;font-size:clamp(20px,2.4vw,26px);letter-spacing:-.01em;margin:44px 0 14px;color:#FF4C29;}
.legal-page h2:first-of-type{margin-top:0;}
.legal-page p{font-size:16px;line-height:1.75;color:#333;margin:0 0 16px;}
.legal-page ul{margin:0 0 16px;padding-left:22px;}
.legal-page li{font-size:16px;line-height:1.75;color:#333;margin:0 0 8px;}
.legal-page strong{color:#1A1A1A;}
.legal-page .updated{font-size:14px;color:#777;margin:-24px 0 40px;}

/* Shared confirmation modal (static pages) */
.site-modal-overlay{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;padding:24px;}
.site-modal-overlay.is-open{display:flex;}
.site-modal-box{background:#F7F5F0;border-radius:24px;padding:44px;max-width:440px;width:100%;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.35);}
.site-modal-title{font-family:'Montserrat',sans-serif;font-weight:900;font-size:28px;color:#FF4C29;margin-bottom:14px;}
.site-modal-text{margin:0 0 26px;font-size:16px;color:#333;line-height:1.6;}
.site-modal-close{background:#003BFF;color:#fff;border:none;cursor:pointer;font-family:'Montserrat',sans-serif;font-weight:800;text-transform:uppercase;font-size:15px;letter-spacing:.04em;padding:14px 32px;border-radius:999px;}
.site-checkbox{accent-color:#FF4C29;width:18px;height:18px;flex:0 0 auto;}

/* Shared inner content pages (Meistä / Teemat / Pelit / UKK / Yhteystiedot) */
.page-hero{max-width:1240px;margin:0 auto;padding:56px 28px 20px;}
.page-hero h1{font-family:'Montserrat',sans-serif;font-weight:900;text-transform:uppercase;font-size:clamp(40px,6vw,84px);line-height:.95;letter-spacing:-.02em;margin:0 0 18px;}
.page-hero p{font-size:18px;line-height:1.7;max-width:720px;color:#333;margin:0;}
.page-section{max-width:1240px;margin:0 auto;padding:40px 28px 70px;}
.page-section h2{font-family:'Montserrat',sans-serif;font-weight:900;text-transform:uppercase;font-size:clamp(28px,3.6vw,42px);letter-spacing:-.02em;margin:0 0 24px;}
.content-block{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;background:#fff;border-radius:24px;padding:38px;margin-bottom:26px;}
.content-block img{width:100%;max-width:560px;aspect-ratio:4/3;object-fit:cover;border-radius:24px;}
.content-block h3{font-family:'Montserrat',sans-serif;font-weight:900;text-transform:uppercase;font-size:30px;margin:0 0 14px;}
.content-block p{font-size:16px;line-height:1.75;margin:0 0 12px;color:#333;}
@media (max-width:900px){
  .content-block{grid-template-columns:1fr!important;}
}
.faq-item{border-bottom:4px solid #003BFF;padding:22px 0;}
.faq-item summary{cursor:pointer;list-style:none;font-family:'Montserrat',sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(18px,2.2vw,26px);line-height:1.2;color:#1A1A1A;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:'+';font-family:'Montserrat',sans-serif;font-weight:400;font-size:32px;color:#003BFF;flex:0 0 auto;}
.faq-item[open] summary::after{content:'\2212';}
.faq-item p{font-size:16px;line-height:1.7;margin:14px 0 0;color:#333;max-width:820px;}
.testimonial-card{background:#fff;border-radius:24px;padding:32px;border:2px solid #FF4C29;}
.testimonial-card p{font-size:16px;line-height:1.7;color:#333;margin:0 0 14px;}
.testimonial-card .author{font-family:'Montserrat',sans-serif;font-weight:800;font-size:14px;color:#003BFF;}
.testimonial-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
@media (max-width:900px){
  .testimonial-grid{grid-template-columns:1fr!important;}
}
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}