
/* MAITRI Web RC8_5 — Responsive + Escala Multidispositivo
   Baseline: RC8_4. Capa de override; no altera lógica de experiencia. */
:root{
  --rc85-content-xl:1520px;
  --rc85-content-desktop:1400px;
  --rc85-gutter-xl:48px;
  --rc85-gutter-desktop:36px;
  --rc85-gutter-tablet:24px;
  --rc85-gutter-mobile:16px;
  --rc85-touch:44px;
}
html{overflow-x:hidden}
body{overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
img,svg,video,canvas{max-width:100%}
button,a,input,select,textarea{touch-action:manipulation}

/* ---------- shared institutional canvas ---------- */
.page-home,
.page-implementation,
.page-explore,
.page-about,
.page-contact,
.page-en,
.page-values,
.page-sound,
.page-media,
.page-games,
.page-create,
.page-practice,
.page-breathe,
.page-legal{font-size:18px}

.page-home .wrap,
.page-implementation .wrap,
.page-explore .wrap,
.page-about .wrap,
.page-en .wrap,
.page-values .wrap,
.page-sound .wrap,
.page-media .wrap{
  width:min(var(--rc85-content-xl),calc(100% - 96px));
  margin-inline:auto;
}
.page-contact .container{width:min(1400px,calc(100% - 96px));margin-inline:auto}
.page-legal .wrap{width:min(920px,calc(100% - 48px));margin-inline:auto}

/* Section rhythm */
.page-home .section,
.page-implementation .section,
.page-explore .section,
.page-en .section,
.page-values .section,
.page-media .media-section,
.page-sound .sound-section{padding-block:clamp(60px,5vw,92px)}
.page-contact .section{padding-block:clamp(58px,4.6vw,84px)}

/* Shared legibility */
.page-home p,
.page-implementation p,
.page-explore p,
.page-en p,
.page-values p,
.page-media p,
.page-sound p,
.page-contact p,
.page-about p{line-height:1.65}
.page-home .section-head p,
.page-implementation .head p,
.page-explore .section-head p,
.page-en .head p{font-size:18px}

/* ---------- HOME ---------- */
.page-home .site-header{min-height:86px;height:auto}
.page-home .header-inner{min-height:86px}
.page-home .brand img{width:clamp(178px,11vw,190px)}
.page-home .desktop-nav{font-size:14px;gap:clamp(16px,1.35vw,26px)}
.page-home .desktop-nav .nav-cta{min-height:44px;display:inline-flex;align-items:center;padding:11px 19px}
.page-home .lang-switch{min-width:44px;height:44px;font-size:12px}
.page-home .menu-btn{min-width:44px;min-height:44px}

.page-home .hero-grid{
  min-height:clamp(590px,73svh,760px);
  grid-template-columns:minmax(0,1.08fr) minmax(480px,.92fr);
  gap:clamp(64px,6vw,112px)
}
.page-home .hero h1{font-size:clamp(66px,5.15vw,90px);max-width:820px}
.page-home .hero .lead{font-size:clamp(19px,1.25vw,21px);max-width:780px;line-height:1.62}
.page-home .hero-actions a,.page-home .button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;font-size:15px;padding-inline:23px}
.page-home .promise-card{max-width:580px;padding:32px}
.page-home .promise-card h2{font-size:clamp(34px,2.5vw,44px)}
.page-home .promise-card p{font-size:16.5px}
.page-home .promise-card .promise-item{min-height:68px;padding:15px 16px}
.page-home .promise-card .promise-item strong{font-size:17px}
.page-home .promise-card .promise-item span{font-size:13.5px}

.page-home .section-head{max-width:980px;margin-bottom:38px}
.page-home .section-head h2{font-size:clamp(46px,4vw,64px)}
.page-home .what-grid{gap:clamp(48px,5vw,76px)}
.page-home .what-copy h2{font-size:clamp(46px,4vw,64px)}
.page-home .what-copy p{font-size:18px}
.page-home .checklist li{font-size:16.5px;line-height:1.48;padding-block:11px}
.page-home .is-card{padding:30px}
.page-home .is-card h3{font-size:30px}
.page-home .pillar{padding:30px;min-height:240px}
.page-home .pillar h3{font-size:28px}
.page-home .pillar p{font-size:16.5px}
.page-home .pillar .num{width:46px;height:46px;font-size:13px}
.page-home .step{padding:26px;min-height:250px}
.page-home .step h3{font-size:23px}
.page-home .step p{font-size:16px}
.page-home .receive{padding:27px;min-height:210px}
.page-home .receive h3{font-size:25px}
.page-home .receive p{font-size:16px}
.page-home .ctx-copy p{font-size:17.5px}
.page-home .ctxcard{padding:25px}
.page-home .ctxcard h3{font-size:27px}
.page-home .ctxcard p{font-size:15.5px}

.page-home .stages{gap:16px}
.page-home .stage img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.page-home .stage div{padding:16px 15px 18px}
.page-home .stage strong{font-size:15.5px;line-height:1.25}
.page-home .stage span{font-size:13.5px}

.page-home .portal-grid{gap:18px}
.page-home .portal{padding:29px;min-height:225px}
.page-home .portal h3{font-size:30px}
.page-home .portal p{font-size:16px}
.page-home .portal span{font-size:14px}
.page-home .trust-card{padding:28px;min-height:205px}
.page-home .trust-card h3{font-size:25px}
.page-home .trust-card p{font-size:16px}
.page-home .closing{padding-block:clamp(76px,6vw,104px)}
.page-home .closing h2{font-size:clamp(48px,4vw,64px)}
.page-home .closing p{font-size:18px}

/* ---------- IMPLEMENTATION ---------- */
.page-implementation .site-header{min-height:86px;height:auto}
.page-implementation .header-inner{min-height:86px}
.page-implementation .brand img{width:182px}
.page-implementation .desktop-nav{font-size:14px}
.page-implementation .nav-cta,.page-implementation .lang-switch{min-height:44px}
.page-implementation .hero{padding-block:clamp(72px,6vw,104px)}
.page-implementation .hero-grid{gap:clamp(54px,5.6vw,88px)}
.page-implementation .hero h1{font-size:clamp(60px,5vw,82px)}
.page-implementation .hero p{font-size:19px;line-height:1.65}
.page-implementation .hero-card{padding:34px}
.page-implementation .hero-card h2{font-size:36px}
.page-implementation .hero-card p,.page-implementation .hero-card li{font-size:16px;line-height:1.6}
.page-implementation .head{max-width:980px}
.page-implementation .head h2{font-size:clamp(44px,4vw,60px)}
.page-implementation .steps{gap:16px}
.page-implementation .step{padding:27px;min-height:250px}
.page-implementation .step p{font-size:16px}
.page-implementation .receive-grid{gap:18px}
.page-implementation .receive p{font-size:16px}

/* ---------- EXPLORE HUB ---------- */
.page-explore .site-header{min-height:86px;height:auto}
.page-explore .header-inner{min-height:86px}
.page-explore .brand img{width:182px}
.page-explore .desktop-nav{font-size:14px}
.page-explore .hero{padding-block:clamp(76px,6vw,104px)}
.page-explore .hero h1{font-size:clamp(60px,5vw,84px)}
.page-explore .hero p{font-size:19px}
.page-explore .safety{font-size:15.5px;line-height:1.6}
.page-explore .portal{padding:28px;min-height:220px}
.page-explore .portal h2,.page-explore .portal h3{font-size:29px}
.page-explore .portal p{font-size:16px}
.page-explore .btn{min-height:46px}

/* ---------- EN HOME ---------- */
.page-en .header{min-height:86px;height:auto}
.page-en .header-in{min-height:86px}
.page-en .brand img{width:182px}
.page-en .nav{font-size:14px;gap:20px}
.page-en .hero{min-height:clamp(590px,72svh,740px)}
.page-en .hero-grid{gap:clamp(54px,5vw,84px)}
.page-en .hero h1{font-size:clamp(64px,5vw,86px)}
.page-en .hero p{font-size:19px}
.page-en .section h2{font-size:clamp(44px,4vw,60px)}
.page-en .card{padding:28px;min-height:205px}
.page-en .card h3{font-size:28px}
.page-en .card p{font-size:16px}

/* ---------- VALUES ---------- */
.page-values .site-header{min-height:86px;height:auto}
.page-values .header-inner{min-height:86px}
.page-values .brand img{width:182px}
.page-values .desktop-nav{font-size:14px}
.page-values .hero{padding-block:clamp(76px,6vw,104px)}
.page-values .hero h1{font-size:clamp(56px,5vw,80px)}
.page-values .hero p{font-size:18px}
.page-values .intro{max-width:980px}
.page-values .intro h2{font-size:clamp(42px,4vw,58px)}
.page-values .intro p{font-size:17px}
.page-values .scenario-card{padding:30px}
.page-values .scenario-card h3{font-size:28px}
.page-values .scenario-card p{font-size:16px}
.page-values button,.page-values .btn{min-height:44px}

/* ---------- SOUND / MEDIA ---------- */
.page-sound .site-header,.page-media .site-header{min-height:86px;height:auto}
.page-sound .header-inner,.page-media .header-inner{min-height:86px}
.page-sound .brand img,.page-media .brand img{width:182px}
.page-sound .desktop-nav,.page-media .desktop-nav{font-size:14px}
.page-sound .hero,.page-media .hero{padding-block:clamp(76px,6vw,104px)}
.page-sound .hero h1,.page-media .hero h1{font-size:clamp(56px,5vw,80px)}
.page-sound .hero p,.page-media .hero p{font-size:18px}
.page-sound .sound-card,.page-media .media-card{padding:28px}
.page-sound .sound-card p,.page-media .media-card p{font-size:16px}
.page-media .filter{min-height:44px;padding-inline:16px}

/* ---------- GAMES / CREATE ---------- */
.page-games,
.page-create{font-size:17px}
.page-games .wrap,.page-create .wrap{width:min(1280px,calc(100% - 72px));margin-inline:auto}
.page-games header,.page-create header{min-height:84px;height:auto}
.page-games .brand img,.page-create .brand img{width:172px}
.page-games .back,.page-create .back{font-size:15px;min-height:44px;display:inline-flex;align-items:center}
.page-games .hero,.page-create .hero{padding-block:clamp(70px,5vw,92px)}
.page-games .hero h1,.page-create .hero h1{font-size:clamp(54px,5vw,78px)}
.page-games .hero p,.page-create .hero p{font-size:18px}
.page-games .section,.page-create .section{padding-block:clamp(58px,4.5vw,80px)}
.page-games .card,.page-create .card{padding:25px}
.page-games .card p,.page-create .card p{font-size:16px}
.page-games .btn,.page-create .btn{min-height:44px}
.page-games .arrow-pad button{min-width:52px;min-height:48px}

/* ---------- PRACTICE / BREATHE LIST + PLAYER ---------- */
.page-practice,.page-breathe{font-size:17px}
.page-practice .wrap,.page-breathe .wrap{width:min(1240px,calc(100% - 64px));margin-inline:auto}
.page-practice header,.page-breathe header{min-height:84px;height:auto}
.page-practice .brand img,.page-breathe .brand img{width:172px}
.page-practice .back,.page-breathe .back{font-size:15px;min-height:44px;display:inline-flex;align-items:center}
.page-practice .hero,.page-breathe .hero{padding-block:clamp(68px,5vw,90px)}
.page-practice .hero h1,.page-breathe .hero h1{font-size:clamp(52px,4.8vw,74px)}
.page-practice .hero p,.page-breathe .hero p{font-size:18px;line-height:1.65}
.page-practice .notice,.page-breathe .notice{font-size:15px;line-height:1.6}
.page-practice .section,.page-breathe .section{padding-block:clamp(58px,4.5vw,78px)}
.page-practice .intro h2,.page-breathe .intro h2{font-size:42px}
.page-practice .intro p,.page-breathe .intro p{font-size:17px}
.page-practice .card,.page-breathe .card{padding:28px;min-height:340px}
.page-practice .card h3,.page-breathe .card h3{font-size:27px}
.page-practice .card p,.page-breathe .card p{font-size:16px}
.page-practice .card small,.page-breathe .card small{font-size:12.5px}
.page-practice .btn,.page-breathe .btn{min-height:44px}

/* Overlay/player owned by shared AUREN CSS. Only improve responsive geometry. */
.page-practice .auren-shell,.page-breathe .auren-shell,
.page-practice .experience-shell,.page-breathe .experience-shell,
.page-practice .player-shell,.page-breathe .player-shell{max-width:860px;width:min(860px,calc(100% - 32px))}

/* ---------- CONTACT ---------- */
.page-contact{font-size:18px}
.page-contact header{min-height:86px;height:auto}
.page-contact .nav-wrap{min-height:86px}
.page-contact .desktop-nav a{font-size:13.5px}
.page-contact .hero{padding-block:clamp(70px,5vw,94px)}
.page-contact .hero-grid{gap:clamp(44px,4vw,64px)}
.page-contact h1{font-size:clamp(56px,4.8vw,76px)}
.page-contact .hero p{font-size:18px;line-height:1.6}
.page-contact .channels{gap:18px}
.page-contact .channel{padding:28px;min-height:280px}
.page-contact .channel h3{font-size:27px}
.page-contact .channel p{font-size:16px}
.page-contact .form-grid{gap:32px}
.page-contact .form-intro{padding:32px}
.page-contact .form-intro p,.page-contact .form-intro li{font-size:16px}
.page-contact label{font-size:14px}
.page-contact input,.page-contact select,.page-contact textarea{font-size:16px;min-height:48px}
.page-contact button,.page-contact .btn{min-height:46px}

/* ---------- ABOUT ---------- */
.page-about{font-size:18px}
.page-about .shell{max-width:none}
.page-about header{min-height:84px}
.page-about .desktop-nav{font-size:14px}
.page-about .hero{padding:clamp(58px,4.5vw,82px) max(24px,calc((100vw - 1400px)/2))}
.page-about h1{font-size:clamp(54px,5vw,76px)}
.page-about h2{font-size:clamp(38px,3.4vw,52px)}
.page-about h3{font-size:24px}
.page-about .hero p,.page-about p{font-size:16.5px;line-height:1.65}
.page-about .section{padding:clamp(52px,4vw,76px) max(24px,calc((100vw - 1400px)/2)) 0}
.page-about .card{padding:26px}

/* ---------- LEGAL ---------- */
.page-legal{font-size:18px;line-height:1.72}
.page-legal .head img{width:168px}
.page-legal .head>a:last-child{font-size:14px}
.page-legal .hero{padding-block:68px}
.page-legal .hero h1{font-size:clamp(46px,4.5vw,58px)}
.page-legal .hero p{font-size:18px}
.page-legal .content{padding-block:64px}
.page-legal .content h2{font-size:31px;line-height:1.2;margin-top:42px}
.page-legal .content p,.page-legal .content li{font-size:17px;line-height:1.72}

/* ---------- desktop 1200–1599 ---------- */
@media (max-width:1599px){
  .page-home .wrap,.page-implementation .wrap,.page-explore .wrap,.page-about .wrap,.page-en .wrap,.page-values .wrap,.page-sound .wrap,.page-media .wrap{width:min(var(--rc85-content-desktop),calc(100% - 72px))}
  .page-contact .container{width:min(1360px,calc(100% - 72px))}
  .page-home .stages{grid-template-columns:repeat(4,minmax(0,1fr))}
  .page-home .hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr);gap:clamp(48px,4.2vw,74px)}
}

/* ---------- compact desktop / landscape tablet ---------- */
@media (max-width:1199px){
  .page-home,.page-implementation,.page-explore,.page-about,.page-contact,.page-en,.page-values,.page-sound,.page-media{font-size:17px}
  .page-home .wrap,.page-implementation .wrap,.page-explore .wrap,.page-about .wrap,.page-en .wrap,.page-values .wrap,.page-sound .wrap,.page-media .wrap{width:calc(100% - 48px)}
  .page-contact .container{width:calc(100% - 48px)}
  .page-home .hero-grid,.page-implementation .hero-grid,.page-en .hero-grid{grid-template-columns:minmax(0,1fr) minmax(360px,.8fr);gap:42px}
  .page-home .pillar-grid,.page-home .trust-grid,.page-en .grid4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-home .steps,.page-implementation .steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .page-home .steps:before,.page-implementation .steps:before{display:none}
  .page-home .receive-grid,.page-implementation .receive-grid,.page-home .portal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-home .ctx-grid{gap:40px}
  .page-sound .sound-grid,.page-media .media-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-values .scenario-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-contact .channels{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-games .wrap,.page-create .wrap,.page-practice .wrap,.page-breathe .wrap{width:calc(100% - 48px)}
}

/* ---------- tablet portrait ---------- */
@media (max-width:1023px){
  .page-home .desktop-nav,.page-implementation .desktop-nav,.page-explore .desktop-nav,.page-values .desktop-nav,.page-sound .desktop-nav,.page-media .desktop-nav{display:none!important}
  .page-home .menu-btn,.page-implementation .menu-btn,.page-explore .menu-btn,.page-values .menu-btn,.page-sound .menu-btn,.page-media .menu-btn{display:inline-flex!important;align-items:center;justify-content:center}
  .page-home .desktop-nav+.lang-switch,.page-implementation .desktop-nav+.lang-switch,.page-explore .desktop-nav+.lang-switch,.page-values .desktop-nav+.lang-switch,.page-sound .desktop-nav+.lang-switch,.page-media .desktop-nav+.lang-switch{display:none!important}
  .page-home .hero-grid,.page-implementation .hero-grid,.page-en .hero-grid,.page-home .what-grid,.page-home .ctx-grid,.page-contact .hero-grid,.page-contact .form-grid{grid-template-columns:1fr!important}
  .page-home .hero-grid,.page-implementation .hero-grid,.page-en .hero-grid{min-height:auto}
  .page-home .promise-card,.page-implementation .hero-card{max-width:760px}
  .page-home .steps,.page-implementation .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-home .stages{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-contact .form-intro{position:static}
  .page-contact .desktop-nav{display:none}
  .page-contact .hamb{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
  .page-about .desktop-nav{display:none!important}
}

/* ---------- mobile ---------- */
@media (max-width:767px){
  .page-home,.page-implementation,.page-explore,.page-about,.page-contact,.page-en,.page-values,.page-sound,.page-media,.page-games,.page-create,.page-practice,.page-breathe,.page-legal{font-size:16.5px}
  .page-home .wrap,.page-implementation .wrap,.page-explore .wrap,.page-about .wrap,.page-en .wrap,.page-values .wrap,.page-sound .wrap,.page-media .wrap{width:calc(100% - 32px)}
  .page-contact .container{width:calc(100% - 32px)}
  .page-legal .wrap{width:calc(100% - 32px)}
  .page-games .wrap,.page-create .wrap,.page-practice .wrap,.page-breathe .wrap{width:calc(100% - 32px)}

  .page-home .site-header,.page-implementation .site-header,.page-explore .site-header,.page-values .site-header,.page-sound .site-header,.page-media .site-header{min-height:74px}
  .page-home .header-inner,.page-implementation .header-inner,.page-explore .header-inner,.page-values .header-inner,.page-sound .header-inner,.page-media .header-inner{min-height:74px}
  .page-home .brand img,.page-implementation .brand img,.page-explore .brand img,.page-values .brand img,.page-sound .brand img,.page-media .brand img{width:148px}

  .page-home .section,.page-implementation .section,.page-explore .section,.page-en .section,.page-values .section,.page-media .media-section,.page-sound .sound-section,.page-contact .section{padding-block:52px}

  .page-home .hero,.page-implementation .hero,.page-explore .hero,.page-en .hero,.page-values .hero,.page-sound .hero,.page-media .hero{padding-block:54px}
  .page-home .hero h1,.page-implementation .hero h1,.page-explore .hero h1,.page-en .hero h1,.page-values .hero h1,.page-sound .hero h1,.page-media .hero h1{font-size:clamp(42px,11vw,50px);line-height:1}
  .page-home .hero .lead,.page-home .hero p,.page-implementation .hero p,.page-explore .hero p,.page-en .hero p,.page-values .hero p,.page-sound .hero p,.page-media .hero p{font-size:17px}
  .page-home .section-head h2,.page-implementation .head h2,.page-home .what-copy h2,.page-en .section h2{font-size:clamp(36px,9vw,44px)}
  .page-home .section-head p,.page-implementation .head p,.page-explore .section-head p,.page-en .head p{font-size:16.5px}

  .page-home .pillar-mini,.page-home .is-grid,.page-home .pillar-grid,.page-home .steps,.page-home .receive-grid,.page-home .ctxcards,.page-home .portal-grid,.page-home .trust-grid,
  .page-implementation .steps,.page-implementation .receive-grid,.page-en .grid4,.page-values .scenario-grid,.page-sound .sound-grid,.page-media .media-grid,.page-contact .channels,.page-contact .form-grid,
  .page-games .grid,.page-create .grid,.page-practice .cards,.page-breathe .cards{grid-template-columns:1fr!important}

  .page-home .receive:nth-child(1),.page-home .portal.values,.page-home .ctxcard.primary{grid-column:auto!important}
  .page-home .stage img{aspect-ratio:4/3;height:auto}
  .page-home .hero-actions,.page-en .buttons{gap:10px}
  .page-home .hero-actions a,.page-en .buttons a{min-height:46px}
  .page-home .promise-card,.page-implementation .hero-card{padding:24px;border-radius:22px}
  .page-home .pillar,.page-home .step,.page-home .receive,.page-home .portal,.page-home .trust-card,.page-home .is-card{min-height:auto;padding:24px}

  .page-contact h1{font-size:clamp(42px,11vw,50px)}
  .page-contact .channel{min-height:auto;padding:24px}
  .page-contact input,.page-contact select,.page-contact textarea{font-size:16px}

  .page-about .hero,.page-about .section{padding-left:16px;padding-right:16px}
  .page-about h1{font-size:clamp(42px,11vw,50px)}
  .page-about h2{font-size:36px}

  .page-games .hero,.page-create .hero,.page-practice .hero,.page-breathe .hero{padding-block:54px}
  .page-games .hero h1,.page-create .hero h1,.page-practice .hero h1,.page-breathe .hero h1{font-size:clamp(40px,10vw,48px)}
  .page-practice .intro h2,.page-breathe .intro h2{font-size:36px}
  .page-games .card,.page-create .card,.page-practice .card,.page-breathe .card{min-height:auto;padding:24px}

  .page-legal .hero{padding-block:52px}
  .page-legal .hero h1{font-size:clamp(40px,10vw,48px)}
  .page-legal .content{padding-block:50px}
  .page-legal .content h2{font-size:28px}
  .page-legal .content p,.page-legal .content li{font-size:16.5px}
  .page-legal .head img{width:148px}
}

@media (max-width:479px){
  .page-home .stages{grid-template-columns:1fr}
  .page-home .hero-actions,.page-en .buttons{display:grid;grid-template-columns:1fr}
  .page-home .hero-actions a,.page-en .buttons a{width:100%}
  .page-contact .channels{grid-template-columns:1fr}
  .page-home .promise-card{padding:21px}
}

/* ---------- touch + reflow ---------- */
@media (pointer:coarse){
  a.button,.btn,button,.menu-btn,.hamb,.lang-switch,.back{min-height:var(--rc85-touch)}
}
@media (max-width:360px){
  .page-home .wrap,.page-implementation .wrap,.page-explore .wrap,.page-about .wrap,.page-en .wrap,.page-values .wrap,.page-sound .wrap,.page-media .wrap,.page-contact .container,.page-legal .wrap,.page-games .wrap,.page-create .wrap,.page-practice .wrap,.page-breathe .wrap{width:calc(100% - 24px)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* RC8_5 detail pass: games, mandalas, values */
.page-games .game-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.page-games .game-card{padding:25px;min-height:270px}
.page-games .game-card h3{font-size:26px}
.page-games .game-card p{font-size:16px;line-height:1.6}
.page-games .game-card small{font-size:12px}
.page-games .filter-chip,.page-games .surprise-btn,.page-games .all-btn{min-height:44px;font-size:14px}
.page-games .filter-status{font-size:14px}
.page-games .modal-card{font-size:16px}
.page-games .modal-card h2{font-size:38px}

.page-create .mandala-layout{grid-template-columns:340px minmax(0,1fr);gap:26px}
.page-create .mcard{padding:15px;grid-template-columns:40px 1fr;gap:4px 10px;min-height:58px}
.page-create .mcard span{width:40px;height:40px;font-size:12px}
.page-create .mcard strong{font-size:15px}
.page-create .mcard small{font-size:13px}
.page-create .studio{padding:24px}
.page-create .studio h2{font-size:31px}
.page-create .swatch{width:40px;height:40px}
.page-create .canvas{min-height:520px}

.page-values .scenario .body{padding:28px}
.page-values .scenario .body p{font-size:16px;line-height:1.62}
.page-values .choice{min-height:48px;padding:14px 16px;font-size:16px;line-height:1.4}
.page-values .outcome{font-size:15px;line-height:1.6}
.page-values .reflection,.page-values .transfer{font-size:15.5px;line-height:1.62}

@media (max-width:1199px){
  .page-games .game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-create .mandala-layout{grid-template-columns:300px minmax(0,1fr)}
}
@media (max-width:1023px){
  .page-create .mandala-layout{grid-template-columns:1fr}
  .page-create .catalog{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;overflow:visible}
  .page-create .studio{position:static}
}
@media (max-width:767px){
  .page-games .game-grid,.page-create .catalog{grid-template-columns:1fr}
  .page-games .game-card{min-height:auto;padding:23px}
  .page-games .modal-card{padding:20px;border-radius:20px}
  .page-games .modal-card h2{font-size:32px}
  .page-create .mcard{min-height:62px}
  .page-create .swatch{width:44px;height:44px}
  .page-create .canvas{min-height:390px}
  .page-values .scenario .body{padding:22px}
}
