/* v4.69 — responsividade e movimento progressivo. */
html{
  overflow-x:clip;
  scroll-padding-top:84px;
  -webkit-text-size-adjust:100%;
}
body{overflow-x:clip}
img,video,canvas,svg{max-width:100%}
audio{max-width:100%}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
:where(a,button,input,select,textarea,summary):focus-visible{
  outline:3px solid rgba(255,178,94,.62);
  outline-offset:3px;
}
.gsap-ready .wizard-step{animation:none}

@media(max-width:820px){
  :root{--mobile-gutter:max(16px,env(safe-area-inset-left))}
  .site-header{
    width:100%;
    min-height:64px;
    height:auto;
    padding:8px max(14px,env(safe-area-inset-right)) 8px max(14px,env(safe-area-inset-left));
    gap:12px;
  }
  .site-header .brand{min-width:0}
  .site-header .brand>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .site-header .header-nav{min-width:0;margin-left:auto;gap:8px}
  .site-header .header-cta{min-height:42px;display:inline-flex;align-items:center;justify-content:center;text-align:center;line-height:1.15}
  .section{padding-left:max(17px,env(safe-area-inset-left));padding-right:max(17px,env(safe-area-inset-right))}
  .legal{padding:42px max(18px,env(safe-area-inset-right)) calc(72px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}
  .legal h1{font-size:clamp(40px,12vw,54px);line-height:1.02;overflow-wrap:anywhere}
  .section-heading{display:grid;gap:14px;margin-bottom:30px}
  .section-heading h2,.final-cta h2{font-size:clamp(38px,10.5vw,54px);line-height:.98;text-wrap:balance}
  .landing-v426 .hero{
    width:100%;
    padding-left:max(16px,env(safe-area-inset-left));
    padding-right:max(16px,env(safe-area-inset-right));
  }
  .landing-v426 .hero-copy,.landing-v426 .hero-emotion-visual,.landing-v426 .hero>.creator{min-width:0}
  .landing-v426 .hero h1{font-size:clamp(43px,12vw,64px);line-height:.94;text-wrap:balance}
  .landing-v426 .hero-lead{max-width:38rem}
  .hero-story-signals{width:100%}
  .hero-story-signals span{min-width:0}
  .hero-demo-player .mini-player-copy{min-width:0}
  .hero-demo-player .mini-player-copy strong,.hero-demo-player .mini-player-copy span{overflow-wrap:anywhere}
  .landing-v426 .hero>.creator{border-radius:25px}
  .creator:before{border-radius:20px}
  .wizard-form{min-height:0}
  .wizard-step,.flow-panel,.post-preview-offer,.preview-buy-card,.pix-box{min-width:0}
  .field-grid.two,.field-grid.three{grid-template-columns:1fr}
  .field input,.field select,.field textarea{font-size:16px}
  .primary-btn,.secondary-btn,.text-back,.payment-result-tabs button{min-height:46px}
  .primary-btn{line-height:1.25;gap:12px}
  .primary-btn span{min-width:0;overflow-wrap:anywhere}
  .checkout-trust-line{grid-template-columns:1fr}
  .secure-payment-brands{gap:7px}
  .secure-payment-brands small{line-height:1.45}
  .payment-result-tabs{width:100%;overflow:hidden}
  .payment-result-tabs button{min-width:0;padding-inline:7px}
  .checkout-price-breakdown>span,.checkout-price-breakdown>strong{align-items:flex-start}
  .qr-wrap{width:min(190px,100%);height:auto;aspect-ratio:1}
  .qr-wrap img{width:min(176px,92%);height:auto}
  .tracking-page{
    min-height:100dvh;
    padding:20px max(14px,env(safe-area-inset-right)) calc(28px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));
  }
  .tracking-card{padding:clamp(20px,5vw,28px);border-radius:22px}
  .tracking-card h1{font-size:clamp(38px,11vw,48px);overflow-wrap:anywhere}
  .member-main{
    width:min(100% - 28px,900px);
    padding:34px 0 calc(72px + env(safe-area-inset-bottom));
  }
  .member-card,.member-song-card,.revision-card,.member-tribute-card{padding:clamp(19px,5vw,25px);border-radius:21px}
  .member-card{margin:20px auto}
  .member-card h1,.member-top h1{font-size:clamp(40px,11vw,50px);overflow-wrap:anywhere}
  .member-top{align-items:flex-start;flex-direction:column}
  .member-top #memberLogout{min-width:96px}
  .member-song-head{align-items:flex-start}
  .member-song-head .cover{flex:0 0 62px;width:62px;height:62px}
  .member-song-head h2{font-size:clamp(29px,8vw,36px);overflow-wrap:anywhere}
  .member-live-preview,.gift-card-preview-panel,.member-video-box{min-width:0}
  .member-photo-gallery figure{min-width:0}
  .tribute-shell{min-height:100dvh;padding-bottom:env(safe-area-inset-bottom)}
  .tribute-body{min-width:0}
  .tribute-actions button,.tribute-actions a,.public-gift-preview button{min-height:46px}
  .tribute-card footer{gap:12px;flex-wrap:wrap}
  .mobile-floating-cta{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:calc(10px + env(safe-area-inset-bottom))}
  .landing-v426 footer{padding-bottom:calc(88px + env(safe-area-inset-bottom))}
}

@media(max-width:480px){
  .sale-ribbon{min-height:38px;padding:7px 10px;line-height:1.25;text-align:center}
  .sale-ribbon span{display:none}
  .sale-ribbon strong{font-size:9px}
  .landing-header .brand>span:last-child{max-width:132px}
  .landing-header .header-cta{max-width:145px;padding:8px 10px;font-size:10px}
  .landing-v426 .hero{padding-top:20px;row-gap:24px}
  .landing-v426 .hero h1{font-size:clamp(39px,12vw,48px);margin:17px 0 18px}
  .landing-v426 .hero-lead{font-size:15px;line-height:1.55}
  .landing-v426 .pill{max-width:100%;line-height:1.35;white-space:normal}
  .hero-story-signals span{grid-template-columns:1fr;gap:1px}
  .hero-emotion-visual picture{border-radius:22px}
  .hero-demo-player{left:9px;right:9px;bottom:47px;grid-template-columns:auto minmax(0,1fr);gap:10px;padding:10px}
  .hero-demo-player .wave{display:none}
  .hero-demo-player .play-orb{width:44px;height:44px}
  .hero-emotion-visual figcaption{padding-inline:6px}
  .landing-v426 .hero>.creator{padding:23px 13px}
  .landing-v426 .hero>.creator:after{left:13px}
  .creator-head{display:grid;grid-template-columns:1fr auto;gap:12px}
  .creator-price{align-self:start}
  .stepper{gap:5px}
  .step{display:grid;place-items:center;align-content:start;gap:4px;padding-inline:2px;text-align:center;font-size:9px;line-height:1.2}
  .step b{width:25px;height:25px}
  .wizard-progress>div:first-child{align-items:flex-start}
  .wizard-card-grid{gap:8px}
  .wizard-choice-rich,.wizard-mood-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wizard-choice-rich label span{min-height:88px}
  .wizard-story-examples{display:grid}
  .wizard-story-examples button{min-height:42px;border-radius:12px;text-align:left}
  .post-preview-offer,.preview-buy-card{padding:15px;border-radius:17px}
  .addon-choice{padding:13px;gap:10px}
  .checkout-trust-line span{border-radius:12px;line-height:1.4}
  .priority-offer{grid-template-columns:auto minmax(0,1fr);padding:13px}
  .priority-offer>strong{grid-column:2}
  .payment-result-tabs{font-size:12px}
  .payment-result-tabs button{padding:8px 5px}
  .pix-box{padding:14px 12px}
  .secure-payment-brands b{font-size:10px}
  .countdown-card{grid-template-columns:minmax(0,1fr) auto}
  .countdown-card strong{min-width:0}
  .tracking-shell{gap:16px}
  .tracking-card{padding:20px 16px}
  .tracking-card h1{font-size:39px}
  .member-main{width:min(100% - 20px,900px);padding-top:24px}
  .member-card,.member-song-card,.revision-card,.member-tribute-card{padding:18px 14px}
  .member-song-head{gap:11px}
  .member-song-head .cover{flex-basis:54px;width:54px;height:54px}
  .member-guide{padding:14px}
  .member-live-photo{height:190px}
  .gift-card-preview-panel{padding:15px}
  .tribute-visual{height:min(62dvh,520px);min-height:360px}
  .tribute-heading{left:18px;right:18px;bottom:20px}
  .tribute-heading h1{font-size:clamp(38px,12vw,48px);overflow-wrap:anywhere}
  .tribute-heading p{font-size:14px;line-height:1.45}
  .tribute-body{padding:22px 16px}
  .tribute-body h2{font-size:32px;overflow-wrap:anywhere}
}

@media(max-width:360px){
  .landing-header .brand>span:last-child{max-width:106px}
  .landing-header .header-cta{max-width:126px;font-size:9px}
  .landing-v426 .hero h1{font-size:37px}
  .wizard-choice-rich label span{min-height:82px;font-size:12px}
  .payment-result-tabs{grid-template-columns:1fr}
  .payment-result-tabs button+button{border-top:1px solid rgba(0,0,0,.08)}
}

@media(max-width:900px) and (orientation:landscape) and (max-height:520px){
  .landing-v426 .hero{padding-top:18px}
  .hero-emotion-visual{max-width:480px}
  .tribute-visual{height:82dvh;min-height:320px}
}

@media(pointer:coarse){
  button,.primary-btn,.secondary-btn,.header-cta,.text-back,summary{min-height:44px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}
