/* v23 Mobile-only refinements. The confirmed desktop design and its main CSS remain unchanged. */
@media (max-width:680px){
  /* Rhythm, widths and overflow */
  .container{width:calc(100% - 32px)}
  .section{padding:54px 0}
  .section-header{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:8px;margin-bottom:20px}
  .section-header .section-note,.section-header .note-target,.section-header .note-target-experience{
    position:static;top:auto;left:auto;right:auto;transform:none;
    max-width:100%;width:100%;margin:0;text-align:left;
  }
  .section-header .section-note .copy-row{display:inline;white-space:normal;line-height:1.8}
  .section-header .section-note .copy-row + .copy-row::before{content:' ';white-space:pre}
  .section-title{font-size:clamp(1.55rem,6.7vw,1.96rem);line-height:1.27;letter-spacing:-.035em}
  .eyebrow{margin-bottom:9px;font-size:.74rem}
  .heading-line{max-width:100%}
  .intro-grid,.reason-grid,.split-feature,.contact-grid{gap:16px}
  .intro-panel,.callout,.contact-box,.faq-box{padding:23px 20px}
  .intro-copy{font-size:.94rem}
  .chips{gap:7px;margin-top:14px}
  .chip{padding:7px 10px;font-size:.8rem}

  /* Header + hero: keep the playful image but avoid wasting an entire screen */
  .site-logo{width:124px}
  .header-inner{padding:6px 0}
  .menu-toggle{width:43px;height:43px}
  .site-nav{inset:65px 12px auto}
  .hero{padding:24px 0 30px}
  .hero-grid{gap:24px}
  .hero-kicker{font-size:.67rem;letter-spacing:.04em;padding:8px 11px}
  .hero-title{font-size:clamp(1.92rem,8.2vw,2.24rem);margin:16px 0 16px;line-height:1.2}
  .hero-description{font-size:.93rem;line-height:1.78;margin-bottom:21px}
  .hero-description .copy-line{line-height:1.82}
  .hero-actions{gap:9px;margin-bottom:13px}
  .hero-actions .button{padding:10px 13px;font-size:.78rem}
  .mini-proof{gap:7px}
  .mini-proof span{font-size:.75rem;padding:7px 10px}
  .hero-visual,.fun-stage{min-height:478px}
  .fun-stage{border-radius:29px}
  .fun-stage::before{top:28px;height:8px}
  .entry-sign{top:43%;width:77%;padding:23px 10px 16px;border-radius:25px}
  .sign-title{font-size:clamp(1.24rem,5.5vw,1.57rem)}
  .sign-copy{font-size:.78rem;line-height:1.65}
  .sign-overline{font-size:.62rem;letter-spacing:.13em}
  .sign-divider{margin:9px auto 9px}
  .service-pills{gap:4px}
  .service-pills span{font-size:.62rem;padding:5px 7px}
  .ticket{font-size:.67rem;padding:7px 9px}
  .ticket.one{left:4%;top:23%}
  .ticket.two{right:4%;top:17%}
  .ticket.three{right:5%;bottom:110px}
  .attraction-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;left:10px;right:10px;bottom:12px}
  .attraction-card{border-radius:13px;padding:9px 3px}
  .attraction-card strong{font-size:.59rem;letter-spacing:0}
  .attraction-card span{font-size:.74rem}
  .arc-line{bottom:67px;height:62px;opacity:.25}
  .fun-stage .s1{width:82px;height:82px}
  .fun-stage .s4{width:100px;height:100px}
  .fun-stage .s6{width:82px;height:82px;border-width:12px}
  .fun-stage .s7{width:35px;height:35px}

  /* Intro and offerings */
  .intro-grid{gap:12px}
  .metric{grid-template-columns:54px minmax(0,1fr);gap:12px;padding:14px 17px;border-radius:18px}
  .metric strong{font-size:1.1rem}
  .metric-line{font-size:.83rem;white-space:normal;line-height:1.62}
  .metrics{gap:8px}
  .card-grid,.experience-grid,.info-grid,.stagger-grid{gap:12px}
  .card{padding:22px;border-radius:23px}
  .card h3{font-size:1.17rem;margin-bottom:8px}
  .card p{font-size:.9rem;line-height:1.8}
  .card-kicker{margin-bottom:7px}
  .icon-badge{width:56px;height:56px;margin-bottom:12px}
  .icon-badge svg{width:30px;height:30px}
  .exp-card{padding:21px;border-radius:22px}
  .exp-sign{width:46px;height:46px;margin-bottom:12px}
  .exp-card p{margin-bottom:0}

  /* Homepage animated playground + three-point approach */
  .playground{min-height:312px;border-radius:24px}
  .playground .card-center{width:82%;padding:19px 16px;border-radius:19px}
  .playground .card-center h3{font-size:1.09rem}
  .playground .card-center p{font-size:.85rem;line-height:1.75}
  .playground .a{width:85px;height:85px}
  .playground .b{width:100px;height:100px}
  .playground .c{border-left-width:48px;border-right-width:48px;border-bottom-width:81px}
  .playground .d{width:90px;height:90px;border-width:12px}
  .playground .e{width:28px;height:28px}
  .playground .f{width:53px;height:53px}
  .playground .g{border-left-width:24px;border-right-width:24px;border-bottom-width:44px}
  .list{gap:9px}
  .list-item{padding:15px;gap:11px;border-radius:17px}
  .list-item .badge{width:36px;height:36px;border-radius:11px}
  .list-item strong{font-size:.99rem}
  .list-item span{font-size:.85rem;line-height:1.66}

  /* Banner: sensible reading sequence and accent shapes */
  .banner-playful{padding:24px 20px 23px;border-radius:26px;gap:13px}
  .banner-playful .banner-copy-shift{margin:0;max-width:none}
  .banner-playful .section-title{font-size:1.7rem}
  .banner-playful p{font-size:.87rem;line-height:1.7}
  .banner-playful .button{align-self:flex-start;padding:10px 16px;font-size:.8rem}
  .banner-deco{opacity:.35}
  .cta{padding:35px 0 52px}
  .cta-playful{padding:33px 22px 30px;min-height:0;border-radius:27px;row-gap:14px}
  .cta-playful .eyebrow,.cta-playful h2,.cta-playful p{justify-self:start;text-align:left;max-width:none}
  .cta-playful h2{font-size:clamp(1.8rem,7vw,2.22rem);margin:0;line-height:1.23}
  .cta-playful p{margin:0;font-size:.88rem;line-height:1.85}
  .cta-playful .button{margin:4px 0 0;justify-self:start;align-self:start;font-size:.86rem;padding:12px 17px}
  .cta-deco{opacity:.55}

  /* Service hero and production list */
  .page-hero{padding:35px 0 16px}
  .page-hero .page-wrap{gap:24px}
  .page-hero h1{font-size:clamp(1.85rem,7vw,2.15rem);line-height:1.24}
  .page-hero p{font-size:.93rem;line-height:1.8}
  .services-hero .service-feature{transform:none!important;grid-template-columns:54px minmax(0,1fr);gap:12px;padding:14px 15px;border-radius:20px}
  .service-feature .icon-badge{width:49px;height:49px;margin:0}
  .service-feature .icon-badge svg{width:28px;height:28px}
  .service-feature h3{font-size:1rem}
  .service-feature p{font-size:.83rem;line-height:1.6}
  .services-showcase{gap:9px}
  .services-hero + .section,.about-hero + .section,.partners-hero + .section,.contact-hero + .section{padding-top:44px}
  .reason-grid .callout-services-tall{min-height:0;height:auto;padding:20px 18px 22px;align-self:stretch}
  .reason-grid .callout-services-tall .offer-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .reason-grid .callout-services-tall .offer-list > span{font-size:.75rem;padding:9px 8px;line-height:1.5}
  .reason-grid .callout-services-tall .emphasis{font-size:1.03rem;line-height:1.55}
  .reason-grid .callout-services-tall .callout-deco{display:none}

  /* About / Partner sections */
  .hero-side-stack{gap:10px}
  .about-hero .hero-side-stack .mini-panel{padding:18px 18px 19px}
  .about-hero .quote-box{width:86%;padding:18px 16px}
  .about-hero .quote-box h3{font-size:1.12rem}
  .about-hero .quote-box .about-quote-lines{font-size:.82rem;line-height:1.8}
  .split-visual{min-height:274px;border-radius:22px}
  .split-visual .blob.a{width:112px;height:112px}
  .split-visual .blob.b{width:76px;height:76px}
  .split-visual .blob.c{border-left-width:48px;border-right-width:48px;border-bottom-width:84px}
  .split-visual .blob.d{width:58px;height:58px;border-width:11px}
  .split-feature .intro-panel{padding:23px 20px}
  .split-feature .intro-panel .section-title{font-size:clamp(1.55rem,6.65vw,1.9rem)}
  .split-feature.about-tight-feature .callout-unified,
  .split-feature.partners-tight-feature .callout-unified{padding:18px 17px;border-radius:22px}
  .split-feature .callout-unified .offer-list{gap:7px}
  .split-feature .callout-unified .offer-list > span{font-size:.82rem;padding:9px 11px}
  .about-profile-section .info-card{padding:16px 20px;border-radius:22px}
  .about-profile-section .info-card .icon-badge{width:45px;height:45px;margin-bottom:8px}
  .about-profile-section .info-card h3{font-size:1.02rem;margin:0 0 5px}
  .about-profile-section .info-card p{font-size:.89rem}
  .hero-card-rail{gap:9px}
  .rail-card{padding:14px 16px;border-radius:19px}
  .rail-card strong{font-size:.88rem;margin-bottom:4px}
  .rail-card span{font-size:.83rem;line-height:1.65}
  .stagger-grid .card{padding:20px}

  /* Contact hero: icon and explanation form compact, readable rows */
  .contact-hero .contact-shifted{margin:0;width:100%;gap:10px}
  .contact-hero .contact-shifted .mini-panel{
    width:100%;max-width:none;min-height:0;display:grid;
    grid-template-columns:46px minmax(0,1fr);
    grid-template-areas:'icon heading' 'icon body';column-gap:12px;row-gap:1px;
    align-items:start;padding:17px 16px;border-radius:20px;
  }
  .contact-hero .contact-shifted .mini-panel .icon-badge{grid-area:icon;width:44px;height:44px;margin:1px 0 0;align-self:center}
  .contact-hero .contact-shifted .mini-panel .icon-badge svg{width:26px;height:26px}
  .contact-hero .contact-shifted .mini-panel strong{grid-area:heading;justify-self:start;margin:0 0 4px;font-size:.78rem;padding:5px 10px}
  .contact-hero .contact-shifted .mini-panel p{grid-area:body;min-width:0;margin:0;font-size:.82rem;line-height:1.65}
  .contact-box,.faq-box{padding:22px 18px;border-radius:23px}
  .contact-box .section-title,.faq-box .section-title{font-size:1.55rem!important}
  .mail-box{display:grid;gap:11px;justify-items:start;padding:15px}
  .mail-box code{font-size:.9rem;max-width:100%;overflow-wrap:anywhere}
  .mail-box .button{padding:10px 14px;font-size:.8rem}
  .note-list{gap:7px;margin-top:11px}
  .note-item{padding:11px 12px;font-size:.83rem;border-radius:13px}

  /* Footer: three distinct groups but shorter scroll */
  .footer{padding:19px 0 36px}
  .footer-grid{gap:10px}
  .footer-card{padding:19px 20px;border-radius:19px}
  .footer-card h3,.footer-card h4{margin:0 0 9px}
  .footer-links{gap:7px}
  .footer-card:nth-child(2) .footer-links{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}
  .footer-small{margin-top:12px}
  .footer-copy{font-size:.86rem}
}
@media(max-width:360px){
  .container{width:calc(100% - 28px)}
  .hero-title{font-size:1.87rem}
  .hero-actions .button{font-size:.74rem;padding:10px 11px}
  .metric-line{font-size:.76rem}
  .attraction-card strong{font-size:.54rem}
  .page-hero h1{font-size:1.83rem}
  .about-hero .quote-box .about-quote-lines{font-size:.75rem}
  .contact-hero .contact-shifted .mini-panel{grid-template-columns:38px minmax(0,1fr);column-gap:9px}
  .contact-hero .contact-shifted .mini-panel .icon-badge{width:37px;height:37px}
  .contact-hero .contact-shifted .mini-panel p{font-size:.76rem}
}
@media(prefers-reduced-motion:reduce){
  .hero-visual *, .service-copy-deco *, .page-shapes *, .banner-deco *, .cta-deco *, .playground *, .icon-badge{animation:none!important}
}

/* v23 final readability pass: long names should never split in the middle. */
@media(max-width:680px){
  .reason-grid .callout-services-tall .offer-list{grid-template-columns:minmax(0,1fr);gap:7px}
  .reason-grid .callout-services-tall .offer-list > span{font-size:.81rem;padding:8px 11px;word-break:keep-all;overflow-wrap:normal}
}