/* Five layout ranges. Desktop proportions are based on the approved 1920px view.
   Widths below 360 inherit the smallest layout for safe overflow handling. */
html,body{max-width:100%;overflow-x:clip}button,a,input{touch-action:manipulation}.hero-cta,.primary,.secondary,.close{min-height:44px}.result-slider,.look-preview{touch-action:pan-y}.result-range,.comparison-range{touch-action:none}
@media(min-width:1200px){.hero-header{left:8vw;right:8vw}.hero-copy{left:8vw;top:22%;width:65vw}.hero h1{font-size:4.15vw;line-height:1.04}.hero-subtitle{font-size:1.1vw;margin:1.25vw 0 1.46vw}.hero-cta{font-size:max(13px,.834vw);padding:.94vw 1.36vw}.wordmark{font-size:clamp(23px,1.51vw,29px)}.choice-grid{gap:1.04vw}h2{font-size:clamp(30px,2.19vw,42px)}}
@media(min-width:960px) and (max-width:1199px){.quiz-panel{clip-path:none!important}.quiz-content{opacity:1!important;visibility:visible!important}.hero{height:100svh;min-height:720px}.hero-header{left:5vw;right:5vw}.hero-copy{left:5vw;top:22%;width:65vw}.hero h1{font-size:4.4vw;line-height:1.08}.hero-subtitle{font-size:17px;max-width:440px}.phone-visual{width:62vw;right:-13vw;top:2vh}.scroll-cue{left:5vw;bottom:32px}.hero-bottom-note{right:5vw;bottom:30px}.quiz-panel{border-radius:24px 24px 0 0}.quiz-content{height:auto;min-height:100svh}.choice-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}#quiz-scroll{overflow:visible;flex:none;padding:8px 5vw 28px}.modal-header{padding:0 5vw}.modal-footer{position:sticky;bottom:0;z-index:5;padding-bottom:max(14px,env(safe-area-inset-bottom));margin-top:auto}.result-layout{gap:30px}.result-slider{height:430px}.estimate-panel h3{font-size:32px}.hero h1 span{white-space:normal}}
@media(min-width:640px) and (max-width:959px){.quiz-panel{clip-path:none!important}.quiz-content{opacity:1!important;visibility:visible!important}.hero{height:100svh;min-height:860px}.hero-header{left:5vw;right:5vw;top:22px}.hero-copy{left:5vw;top:17%;width:90vw;z-index:1}.hero h1{font-size:6.1vw;line-height:1.06}.hero h1 span{white-space:normal}.hero-subtitle{font-size:17px;max-width:460px;margin:22px 0}.hero-cta{padding:16px 23px;font-size:15px}.phone-visual{width:78vw;top:32%;right:-16vw}.scroll-cue{left:5vw;bottom:30px}.hero-bottom-note{right:5vw;bottom:28px;font-size:8px}.quiz-panel{border-radius:24px 24px 0 0}.quiz-content{height:auto;min-height:100svh}.modal-header{padding:0 5vw;height:72px;min-height:72px}.modal-header>.eyebrow{display:none}#quiz-scroll{overflow:visible;flex:none;padding:8px 5vw 28px}.choice-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}h2{font-size:34px}.modal-footer{position:sticky;bottom:0;z-index:5;padding:14px 5vw max(14px,env(safe-area-inset-bottom));margin-top:auto;flex-wrap:wrap}.modal-footer span{flex:1;text-align:center;font-size:11px}.result-layout{grid-template-columns:1fr;max-width:680px;gap:32px}.result-slider{height:auto;aspect-ratio:4/3;min-height:0}.estimate-panel h3{font-size:36px}.estimate-panel{padding-bottom:12px}.page-footer{gap:22px;flex-wrap:wrap}.page-footer p{display:none}.info-dialog{width:calc(100% - 48px);padding:36px}.info-dialog h2{font-size:36px}}
@media(min-width:480px) and (max-width:639px){.quiz-panel{clip-path:none!important}.quiz-content{opacity:1!important;visibility:visible!important}.hero{height:auto;min-height:100svh;padding-top:108px}.hero-header{left:24px;right:24px;top:20px}.hero-copy{position:relative;left:auto;top:auto;transform:none;width:auto;margin:0 24px;z-index:1}.hero h1{font-size:42px;line-height:1.06}.hero h1 span{white-space:normal}.hero-subtitle{font-size:16px;margin:20px 0 24px;max-width:450px}.hero-subtitle br{display:none}.hero-cta{font-size:15px;padding:16px 22px}.phone-visual{position:relative;width:145vw;right:auto;top:auto;margin:-35px 0 -28vw -22.5vw}.hero-bottom-note{right:24px;bottom:30px;font-size:8px}.scroll-cue{left:24px;bottom:30px}.hero-lines{height:100%;object-fit:cover}.quiz-panel{border-radius:24px 24px 0 0}.quiz-content{height:auto;min-height:100svh}.modal-header{height:68px;min-height:68px;padding:0 24px}.modal-header>.eyebrow{display:none}#quiz-scroll{overflow:visible;flex:none;padding:8px 24px 24px}.choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}h2{font-size:32px}.help{font-size:14px}.modal-footer{position:sticky;bottom:0;z-index:5;margin-top:auto;padding:12px 24px max(12px,env(safe-area-inset-bottom));gap:10px;flex-wrap:wrap}.modal-footer span{order:-1;width:100%;font-size:11px;text-align:center}.modal-footer button{flex:1;padding:12px 14px;font-size:14px}.result-layout{grid-template-columns:1fr;gap:28px}.result-slider{height:auto;min-height:0;aspect-ratio:1}.estimate-panel h3{font-size:32px}.messenger-options{gap:8px}.messenger-options span{gap:7px;padding:12px 6px}.page-footer{padding:28px 24px;gap:20px;flex-wrap:wrap}.page-footer p{display:none}.info-dialog{width:calc(100% - 32px);padding:30px 24px;max-height:90svh}.info-dialog h2{font-size:32px}.generation-card{max-width:calc(100vw - 32px)}}
@media(max-width:479px){.quiz-panel{clip-path:none!important}.quiz-content{opacity:1!important;visibility:visible!important}.hero{height:auto;min-height:100svh;padding-top:98px}.hero-header{left:20px;right:20px;top:18px}.wordmark{font-size:25px}.hero-copy{position:relative;left:auto;top:auto;transform:none;width:auto;margin:0 20px;z-index:1}.hero h1{font-size:clamp(30px,8.5vw,40px);line-height:1.08;letter-spacing:-.035em}.hero h1 span{white-space:normal}.hero-subtitle{font-size:15px;line-height:1.4;margin:18px 0 22px;max-width:400px}.hero-subtitle br{display:none}.hero-cta{padding:15px 20px;font-size:14px;gap:24px}.phone-visual{position:relative;width:170vw;right:auto;top:auto;margin:-26px 0 -34vw -35vw}.phone-screen .preview-label{font-size:7px}.phone-screen .preview-caption{font-size:10px}.phone-time{font-size:10px}.phone-screen .preview-play{width:27px;height:27px}.hero-bottom-note{right:20px;bottom:26px;font-size:7px;letter-spacing:1px}.scroll-cue{left:20px;bottom:26px;width:38px;height:38px}.hero-lines{height:100%;object-fit:cover}.quiz-panel{border-radius:22px 22px 0 0}.quiz-content{height:auto;min-height:100svh}.modal-header{height:66px;min-height:66px;padding:0 20px}.modal-header>.eyebrow{display:none}.quiz-wordmark{font-size:23px}#quiz-scroll{overflow:visible;flex:none;padding:6px 20px 24px}.progress{margin-bottom:18px}.step-label{font-size:9px}h2{font-size:29px;line-height:1.12;letter-spacing:-.7px}.help{font-size:13px;line-height:1.5;margin-bottom:20px}.choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.photo-choice{border-radius:10px}.photo-choice strong{font-size:11px;padding:0 10px;line-height:1.35}.photo-choice small{font-size:10px;padding:0 10px}.keep-cut-card .keep-cut-text{font-size:21px;padding:12px}.modal-footer{position:sticky;bottom:0;z-index:5;margin-top:auto;padding:10px 20px max(10px,env(safe-area-inset-bottom));gap:8px;flex-wrap:wrap}.modal-footer span{order:-1;width:100%;font-size:10px;line-height:1.4;text-align:center}.modal-footer button{flex:1;padding:12px 10px;font-size:13px;white-space:normal}.result-layout{grid-template-columns:1fr;gap:26px}.result-slider{height:auto;min-height:0;aspect-ratio:1}.result-badge{font-size:11px;top:12px}.result-note{font-size:11px}.estimate-panel h3{font-size:29px}.estimate-subtitle{font-size:14px}.estimate-panel .eyebrow{font-size:8px;line-height:1.5}.messenger-options{gap:6px}.messenger-options span{gap:5px;padding:12px 5px;font-size:12px}.messenger-icon{width:18px;height:18px}#lead #lead-phone{font-size:16px}#lead .lead-consent{font-size:11px}#lead-submit{font-size:14px;line-height:1.4}.upload{padding:18px;font-size:15px}input[type=file]{font-size:12px}.check{font-size:12px;line-height:1.5}.check input{flex:none;width:16px;height:16px}.summary{line-height:1.5;font-size:13px}.page-footer{padding:26px 20px;gap:20px;flex-wrap:wrap;font-size:11px}.page-footer p{display:none}.info-dialog{width:calc(100% - 28px);padding:30px 22px;max-height:90svh}.info-dialog h2{font-size:30px}.about-steps li{font-size:15px;line-height:1.5;gap:14px}.info-dialog .primary{width:100%;font-size:14px}.generation-card{max-width:calc(100vw - 32px)}.generation-card h3{font-size:30px}}

#quiz-title:focus{outline:none}
