

/* Mobile uses one canvas, a consistent section rhythm and native button shapes. */
@media(max-width:1023px){
  body,main>.mobile-only,.faq-section{background:#fffefb}
  .mobile-container,.faq-container{width:calc(100% - 40px);max-width:620px}
  .mobile-header{padding:20px;background:#151411}
  .mobile-header>a{width:154px;max-width:calc(100% - 70px)}
  #mobile-nav{padding:24px 20px}
  .mobile-hero{padding:32px 0 24px;background:#151411 url('assets/mobile-dark-texture.webp?v=3') center top/auto 100% no-repeat}
  .mobile-hero h1{font-size:clamp(36px,8.8vw,58px);line-height:1.08;margin-bottom:24px}
  .hero-eyebrow{margin-bottom:12px;font-size:14px}
  .hero-location{font-size:clamp(11px,3vw,14px);margin-bottom:21px}
  .mobile-hero-copy{padding:22px 0;margin-bottom:24px;line-height:1.7}
  .hero-tagline{font-size:18px;line-height:1.45;margin-top:18px}
  .mobile-hero-art{width:calc(100% + 40px);margin:24px -20px 0;aspect-ratio:820/869;position:relative;overflow:hidden}
  .mobile-hero-art img{width:100%;height:100%;object-fit:contain;mask-image:linear-gradient(#000 90%,transparent);-webkit-mask-image:linear-gradient(#000 90%,transparent)}
  .mobile-stats{margin-top:-24px;padding:14px;border-radius:14px;border-color:#b8964a80;background:#080806}
  .mobile-stats>div,.mobile-stats>a{position:relative;padding:16px 14px;gap:14px;border-radius:10px;min-height:92px;margin-bottom:12px}
  .mobile-stats strong{font-size:clamp(44px,11vw,60px)}
  .mobile-stats p{font-size:14px;line-height:1.5}
  .mobile-stats .stars{letter-spacing:1px;white-space:nowrap}
  .mobile-section{padding-block:56px 0}
  #metodo-mobile{background:#fffefb;box-shadow:none;clip-path:none}
  .mobile-section h2,.mobile-about h2{font-size:clamp(34px,7vw,48px);line-height:1.1;letter-spacing:-.55px;margin-bottom:22px;overflow-wrap:normal}
  .mobile-section .eyebrow,.mobile-about .eyebrow{margin-bottom:22px;max-width:100%}
  .mobile-section>p,.mobile-section .mobile-container>p,.mobile-about p{font-weight:300;line-height:1.75;margin-bottom:24px}
  .mobile-method-video{margin:28px auto;border-radius:24px;max-width:440px}
  .mobile-method-video video{width:100%;height:auto;aspect-ratio:9/16;object-fit:cover}
  .mobile-method-grid{margin:28px 0;gap:14px}
  .native-step{min-width:0;flex:1 1 calc(50% - 7px);padding:23px 20px 23px 52px;border-radius:8px}
  .native-step>span{left:15px;top:25px}
  .native-step h3{font-size:27px;line-height:1.15}
  .native-step p{font-size:16px;line-height:1.65}
  .mobile-results{margin:28px 0;gap:24px}
  .mobile-result{max-width:400px;border-radius:22px}
  .mobile-result .testimonial-video{border-radius:18px;object-fit:cover}
  .mobile-about{margin-top:56px;padding:56px 0;background:#151411 url('assets/mobile-dark-texture.webp?v=3') center top/cover no-repeat}
  .mobile-about .mobile-about-art{width:100%;margin:28px 0 0;border-radius:18px;border:1px solid #b8964a33;overflow:hidden}
  .mobile-credentials{margin:28px 0;padding:28px 22px}
  .mobile-credentials>div{gap:16px}
  .mobile-credentials p{font-size:21px;line-height:1.4}
  .mobile-reviews{margin:0;padding:6px 20px 28px;scroll-padding-left:20px;gap:18px}
  .native-review{width:min(340px,calc(100vw - 40px));padding:24px}
  .mobile-detail-results{margin:0 0 28px;gap:24px}
  .mobile-jarinu{padding:56px 0;background:#fffefb}
  .mobile-jarinu-art{width:100%;margin:0}
  .mobile-jarinu-notes{display:grid;gap:16px;margin:24px 0}
  .mobile-jarinu-notes p{border:1px solid #ddd5c5;border-radius:10px;padding:20px;font:500 23px/1.3 'Cormorant Garamond',Georgia,serif;text-transform:uppercase}
  .mobile-jarinu-notes em{color:#b8964a;font-style:normal}
  .native-jarinu-panel{margin-top:0;padding:30px 20px 24px;background:#191815 url('assets/jarinu-panel.webp') center/cover no-repeat;border:1px solid #b8964a55;border-radius:16px}
  .native-jarinu-panel h2{font-size:32px;line-height:1.15;margin-bottom:24px}
  .native-jarinu-panel>p{margin:20px 0 0;line-height:1.4}

  .faq-section{padding:0 0 56px}
  .faq-section h2{font-size:37px;line-height:1.08;margin-bottom:32px}
  .faq-question{font-size:19px;line-height:1.5;gap:16px}
  .faq-item{padding:22px 0}
  .faq-answer p{line-height:1.75;font-size:16px}
  .mobile-footer{padding:40px 0 28px}
  .mobile-footer-head{align-items:flex-start;flex-wrap:wrap;gap:18px}
  .mobile-footer-head p{font-size:23px;line-height:1.3;margin:0}
  .agency-credit{display:block;text-align:center;border-top:1px solid #b8964a33;padding-top:22px;font-size:14px;line-height:1.6}
  .button.native-gold{min-height:60px;padding:16px;gap:12px;border-radius:10px;font-size:14px;line-height:1.45;letter-spacing:.7px;text-align:center;color:#fff;isolation:isolate;overflow:hidden;box-shadow:inset 0 1px 0 #ffe6a477;transform-origin:center}
  .button.native-gold .button-label{flex:1;min-width:0;text-wrap:balance}
  .button.native-gold .cursor-mark{width:24px;height:24px;display:block;flex:none}
  .button.native-gold .cursor-mark img{width:100%;height:100%;object-fit:contain}




  @media(max-width:599px){.native-step{flex-basis:100%}}
  @media(max-width:359px){.button.native-gold{font-size:13px;letter-spacing:.5px;padding:15px 13px}.native-jarinu-panel{padding-inline:16px}.mobile-stats strong{font-size:43px}.mobile-stats p{font-size:13px}.mobile-section h2,.mobile-about h2{font-size:32px}}
}

@media(max-width:1023px) {
  .mobile-hero-art { container-type: inline-size; }

  .mobile-hero-art .hero-badge {
    left: 32.56%;
    top: 81.47%;
    width: 33.3%;
    height: 9.9%;
    font-size: clamp(9px, 2.9cqw, 19px);
  }

  .button.native-gold.header-capsule {
    min-height: 54px;
    padding: 0;
  }

  .button.native-gold.header-capsule > img {
    height: 52px;
  }
}
