/* SpectraVision — correctifs responsive globaux 2026 */
html,
body{
    max-width:100%;
    overflow-x:clip;
}
body{min-width:320px}
main,
section,
article,
header,
footer,
nav,
div,
form,
fieldset{min-width:0}
img,
video,
canvas,
svg,
iframe{
    max-width:100%;
}
video,
iframe{display:block}
:where(.svh,.sv-creations-page,.svai-page,.svcfg,.svtv,.sva,.svshop,.sv-contact,.svdq,.sv-client-login)
:where(h1,h2,h3,p,a,button,label,span,strong){
    overflow-wrap:anywhere;
}
:where(.svai-page,.svcfg,.svtv,.sva,.svshop,.sv-contact,.svdq)
:where(input:not([type="radio"]):not([type="checkbox"]),select,textarea){
    box-sizing:border-box;
    max-width:100%;
}
/* Corrige les champs invisibles qui élargissaient la page. */
.svtv-choice input[type="radio"],
.svtv-universe input[type="radio"],
.sva-triggers input[type="radio"]{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    min-width:1px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    white-space:nowrap!important;
}
.svtv,
.sva,
.svshop,
.svcfg,
.svai-page,
.sv-creations-page,
.sv-contact,
.svdq{
    overflow-x:clip;
}
.sv-navbar-inner{
    width:100%;
}
.sv-mobile-menu{
    box-sizing:border-box;
}
.sv-mobile-menu a,
.sv-menu-button,
button,
input[type="submit"],
input[type="button"]{
    touch-action:manipulation;
}
@media(max-width:1200px){
    .sv-navbar-inner{
        height:58px!important;
        padding:0 18px;
        gap:14px!important;
    }
    .sv-navbar .sv-brand{
        flex:0 1 auto;
        max-width:calc(100% - 60px);
        overflow:visible;
    }
    .sv-navbar .sv-brand-logo{
        display:block!important;
        width:170px!important;
        height:50px!important;
        max-width:170px!important;
        max-height:50px!important;
        object-fit:contain!important;
        object-position:left center!important;
        transform:none!important;
    }
    .sv-navbar .sv-menu-button{
        display:flex!important;
        flex:0 0 44px;
        width:44px;
        height:44px;
        padding:9px;
        align-items:center;
        justify-content:center;
        flex-direction:column;
        border-radius:10px;
    }
    .sv-menu-button span{
        width:22px;
        margin:3px 0;
        transition:transform .2s ease,opacity .2s ease;
    }
    .sv-menu-button[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
    .sv-menu-button[aria-expanded="true"] span:nth-child(2){opacity:0}
    .sv-menu-button[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
    .sv-navbar .sv-mobile-menu{
        position:absolute;
        top:100%;
        left:0;
        right:0;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
        max-height:calc(100dvh - 58px);
        padding:14px 18px 20px;
        overflow-y:auto;
        overscroll-behavior:contain;
        background:rgba(3,5,9,.99);
        border-top:1px solid rgba(214,172,83,.25);
        box-shadow:0 20px 45px rgba(0,0,0,.45);
    }
    .sv-navbar .sv-mobile-menu.is-open{display:grid!important}
    .sv-mobile-menu a{
        display:flex;
        min-height:48px;
        padding:12px 14px;
        align-items:center;
        border:1px solid rgba(255,255,255,.07);
        border-radius:9px;
        background:rgba(255,255,255,.025);
        color:#f5f1e9;
        font-size:15px;
        font-weight:700;
    }
    .sv-mobile-menu a:last-child{
        border-color:#d7a94b;
        background:linear-gradient(130deg,#f3d480,#bd8e33);
        color:#080808;
    }
    body.sv-menu-open{overflow:hidden}
}

@media(max-width:1100px){
    .svcfg-packages,
    .svcfg-themes,
    .svcfg-options,
    .svshop-grid,
    .sv-gallery-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .svai-feature-grid,
    .sva-tech-strip,
    .svshop-trust-grid,
    .svtv-benefits-grid,
    .svtv-world-grid,
    .svtv-steps,
    .sv-footer-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .sv-featured-project,
    .svai-hero-grid,
    .sva-hero-v2,
    .svshop-hero-v2 .svshop-hero-grid,
    .svtv-showcase-grid{
        grid-template-columns:1fr!important;
    }
    .svai-hero-grid,
    .sva-hero-v2{
        padding-top:72px!important;
    }
    .svtv-showcase-copy{padding-top:72px!important}
}

@media(max-width:768px){
    :where(.svai-page,.svcfg,.svtv,.sva,.svshop,.sv-contact,.svdq)
    :where(input:not([type="radio"]):not([type="checkbox"]),select,textarea){
        min-height:46px;
        font-size:16px;
    }
    :where(.svai-page,.svcfg,.svtv,.sva,.svshop,.sv-contact,.svdq)
    :where(button,.sv-btn,.svh-btn,.svtv-btn,.sva-btn,.svshop-add,.svdq-primary,.svdq-secondary){
        min-height:44px;
    }
    .svh.sv-night .svh-hero{
        min-height:590px!important;
    }
    .svh.sv-night .svh-hero-inner{
        padding:82px 0 44px!important;
    }
    .sv-creations{
        padding-top:88px!important;
    }
    .sv-creations-header h1{
        font-size:clamp(38px,10vw,52px)!important;
    }
    .sv-featured-media{
        height:auto!important;
        min-height:240px!important;
        aspect-ratio:16/10;
    }
    .sv-featured-content{padding:24px!important}
    .svai-hero-v3,
    .sva-hero-v2,
    .svshop-hero-v2,
    .svtv-showcase{
        min-height:auto!important;
    }
    .svai-mapping-stage,
    .sva-hero-machine,
    .svtv-showcase-art{
        min-height:0!important;
        height:380px!important;
    }
    .svcfg{
        padding:92px 0 125px!important;
    }
    .svcfg-heading{
        margin-bottom:42px;
    }
    .svcfg-section{
        margin-bottom:58px!important;
    }
    .svcfg-event-card,
    .svcfg-package,
    .svcfg-extra-links article{
        padding:20px;
    }
    .svcfg-summary{
        left:12px;
        right:12px;
        bottom:8px;
        width:auto;
        max-height:45dvh;
        padding:12px;
        overflow-y:auto;
        transform:none;
        border-radius:16px;
    }
    .svcfg-preview{
        padding:12px!important;
    }
    .svcfg-preview-box{
        margin:54px auto 20px;
        border-radius:18px;
    }
    .svcfg-preview-box img,
    .svcfg-preview-box video{
        min-height:220px!important;
        max-height:55dvh!important;
    }
    .svcfg-preview-content{padding:22px}
    .svtv-cinema{margin-top:42px}
    .svtv-frame{
        width:min(390px,88%)!important;
    }
    .svtv-btn-purple{
        min-width:0!important;
        max-width:100%;
    }
    .sva-glow{max-width:100vw}
    .sva-machine-halo{max-width:90vw;max-height:90vw}
    .svshop-hero-card{
        height:350px!important;
    }
    .svshop-cart{
        padding:20px;
        border-radius:20px;
    }
    .svshop-add-row,
    .svshop-cart-line-actions,
    .svshop-cart-actions,
    .svh-actions,
    .svai-hero-actions,
    .sva-actions,
    .svshop-hero-actions{
        flex-wrap:wrap;
    }
    .svdq{
        padding:82px 14px 55px!important;
    }
    .svdq-card{
        padding:22px 16px;
        border-radius:20px;
    }
    .svdq-progress-head{
        gap:10px;
        flex-wrap:wrap;
    }
    .sv-contact-form,
    .sv-map-form,
    .sva-form,
    .svtv-form{
        max-width:100%;
    }
    table{
        max-width:100%;
    }
    .sv-client-login{
        width:100%;
        padding-left:14px!important;
        padding-right:14px!important;
    }
}

@media(max-width:620px){
    .sv-navbar-inner{
        height:56px!important;
        padding:0 12px;
    }
    .sv-navbar .sv-brand-logo{
        width:158px!important;
        height:48px!important;
        max-width:158px!important;
        max-height:48px!important;
    }
    .sv-navbar .sv-mobile-menu{
        grid-template-columns:1fr;
        max-height:calc(100dvh - 56px);
        padding:10px 12px 16px;
    }
    .sv-mobile-menu a{
        min-height:46px;
        padding:10px 13px;
    }
    .svcfg-packages,
    .svcfg-themes,
    .svcfg-options,
    .svcfg-event-types,
    .svcfg-extra-links,
    .svshop-grid,
    .sv-gallery-grid,
    .svai-feature-grid,
    .sva-tech-strip,
    .svshop-trust-grid,
    .svtv-benefits-grid,
    .svtv-world-grid,
    .svtv-steps,
    .sv-footer-grid{
        grid-template-columns:1fr!important;
    }
    .svh.sv-night .svh-services{
        grid-template-columns:1fr!important;
    }
    .svh.sv-night .svh-services p{min-height:0!important}
    .svh.sv-night .svh-gallery{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .svh.sv-night .svh-gallery a{
        height:160px!important;
    }
    .svh.sv-night h1{
        font-size:clamp(35px,11.5vw,46px)!important;
    }
    .svh.sv-night .svh-heading h2,
    .svgr-head h2{
        font-size:clamp(29px,9vw,38px)!important;
    }
    .svgr-actions{grid-template-columns:1fr}
    .svcfg-heading h1,
    .svai-hero-content h1,
    .sva-hero-copy h1,
    .svshop-hero-copy h1,
    .svtv-showcase-copy h1,
    .sv-contact-hero h1,
    .svdq-hero h1{
        font-size:clamp(38px,12vw,50px)!important;
    }
    .svcfg-section-title{
        gap:12px;
    }
    .svcfg-section-title>span{
        width:44px;
        height:44px;
        flex:0 0 44px;
    }
    .svcfg-summary-actions{
        display:grid!important;
        grid-template-columns:1fr 1fr;
    }
    .svcfg-summary-actions button{
        width:100%;
        padding:10px 12px;
    }
    .svai-mapping-stage,
    .sva-hero-machine,
    .svtv-showcase-art{
        height:330px!important;
    }
    .svtv-frame{
        width:92%!important;
        height:320px!important;
    }
    .svtv-world-grid a{height:160px!important}
    .svtv-cinema,
    .svtv-request,
    .sv-tv-request,
    .sv-tv-function,
    .sv-tv-control{
        padding:18px!important;
        border-radius:20px!important;
    }
    .svshop-product-body{padding:18px}
    .svshop-add-row{
        gap:8px;
    }
    .svshop-qty button{
        min-width:42px;
        min-height:44px;
    }
    .svshop-cart-line-actions{
        width:100%;
    }
    .svshop-cart-line-actions button{
        min-height:42px;
    }
    .svdq-navigation{
        align-items:stretch;
    }
    .svdq-navigation :where(button,a){
        width:100%;
    }
    .sv-contact-grid,
    .sv-contact-form-grid,
    .svdq-grid,
    .svdq-projects,
    .svdq-final-grid,
    .sv-map-form-grid,
    .sva-form-grid,
    .svtv-form-grid,
    .sv-tv-form-grid{
        grid-template-columns:1fr!important;
    }
    .sv-contact,
    .svdq,
    .svai-page,
    .sva,
    .svtv,
    .svshop{
        --mobile-edge:12px;
    }
}

@media(max-width:430px){
    .svh-shell,
    .svshop-container,
    .svcfg-container,
    .svai-container,
    .sva-container,
    .svtv-container,
    .sv-contact-container,
    .sv-tv-wrap{
        width:calc(100% - 24px)!important;
    }
    .sv-navbar .sv-brand-logo{
        width:150px!important;
        max-width:150px!important;
    }
    .sv-menu-button{
        flex-basis:42px!important;
        width:42px!important;
        height:42px!important;
    }
    .svh.sv-night .svh-gallery{
        gap:8px!important;
    }
    .svh.sv-night .svh-gallery a{
        height:145px!important;
    }
    .svh-trust b{font-size:23px}
    .svgr-card{padding:20px;min-height:0}
    .svgr-card footer{align-items:flex-start;flex-direction:column}
    .sv-featured-media{min-height:205px!important}
    .sv-gallery-media{height:210px!important}
    .svcfg-package img,
    .svcfg-theme img{
        height:190px;
    }
    .svcfg-option-top{
        align-items:flex-start;
    }
    .svcfg-option img{
        width:72px;
        height:72px;
        flex-basis:72px;
    }
    .svcfg-summary-info b{font-size:22px}
    .svai-building{
        height:285px!important;
    }
    .sva-hero-machine img{max-width:100%!important}
    .svshop-hero-card{height:320px!important}
    .svshop-orbit{
        width:280px!important;
        height:280px!important;
    }
    .svshop-cart-title{
        align-items:flex-start;
        flex-direction:column;
    }
    .svshop-add-row{
        align-items:stretch;
        flex-direction:column;
    }
    .svshop-qty{
        justify-content:space-between;
    }
    .svshop-qty-input{flex:1}
    .svshop-add{width:100%;min-height:46px}
    .svdq-progress-wrap{padding:16px}
    .svdq-project-inner{padding:18px;min-height:112px}
    .svdq-upload{padding:22px 14px}
    .sv-footer-bottom div{gap:12px!important}
}

@media(max-width:360px){
    .sv-navbar .sv-brand-logo{
        width:142px!important;
        max-width:142px!important;
    }
    .svh.sv-night .svh-gallery{
        grid-template-columns:1fr!important;
    }
    .svh.sv-night .svh-gallery a{
        height:190px!important;
    }
    .svcfg-summary-actions{
        grid-template-columns:1fr;
    }
    .svtv-hero-trust{
        align-items:flex-start;
        flex-direction:column;
    }
}

/* 2026-09-17 — header mobile compact et réellement responsive */
@media (max-width:1200px){
  .sv-navbar{width:100%;}
  .sv-navbar-inner{max-width:none!important;justify-content:space-between!important;}
  .sv-navbar .sv-brand{min-width:0!important;width:auto!important;margin:0!important;}
  .sv-navbar .sv-brand-logo{object-position:left center!important;}
  .sv-navbar .sv-menu-button{margin-left:auto!important;}
}
@media (max-width:620px){
  .sv-navbar-inner{height:64px!important;padding:0 14px!important;}
  .sv-navbar .sv-brand{max-width:calc(100% - 58px)!important;}
  .sv-navbar .sv-brand-logo{width:128px!important;height:54px!important;max-width:128px!important;max-height:54px!important;}
  .sv-navbar .sv-menu-button{flex:0 0 44px!important;width:44px!important;height:44px!important;}
  .sv-navbar .sv-mobile-menu{max-height:calc(100dvh - 64px)!important;}
}
@media (max-width:430px){
  .sv-navbar-inner{height:62px!important;padding:0 12px!important;}
  .sv-navbar .sv-brand-logo{width:120px!important;height:52px!important;max-width:120px!important;max-height:52px!important;}
  .sv-navbar .sv-mobile-menu{max-height:calc(100dvh - 62px)!important;}
  .sv-section,.sv-final-content{padding-left:12px!important;padding-right:12px!important;}
}

/* 2026-09-17 — Mapping : hero mobile compact */
@media (max-width:620px){
  .svai-hero-v3{min-height:auto!important;}
  .svai-hero-v3 .svai-hero-grid{min-height:auto!important;padding-top:86px!important;padding-bottom:34px!important;gap:20px!important;}
  .svai-hero-v3 .svai-hero-content{padding:0!important;}
  .svai-hero-v3 .svai-badge{display:inline-flex!important;width:auto!important;max-width:100%!important;padding:10px 14px!important;font-size:11px!important;line-height:1.25!important;letter-spacing:.12em!important;}
  .svai-hero-v3 .svai-hero-content h1{margin:18px 0 14px!important;font-size:clamp(42px,13vw,54px)!important;line-height:.94!important;}
  .svai-hero-v3 .svai-lead{margin:0!important;font-size:16px!important;line-height:1.5!important;}
  .svai-hero-v3 .svai-hero-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin-top:22px!important;}
  .svai-hero-v3 .svai-main-button,.svai-hero-v3 .svai-secondary-button{width:100%!important;min-height:50px!important;padding:12px 16px!important;justify-content:center!important;text-align:center!important;font-size:15px!important;border-radius:14px!important;}
  .svai-hero-v3 .svai-chips{display:none!important;}
  .svai-hero-v3 .svai-mapping-stage{height:250px!important;margin-top:2px!important;}
  .svai-hero-v3 .svai-building{width:100%!important;height:230px!important;}
}
@media (max-width:390px){
  .svai-hero-v3 .svai-hero-grid{padding-top:80px!important;}
  .svai-hero-v3 .svai-hero-content h1{font-size:40px!important;}
  .svai-hero-v3 .svai-mapping-stage{height:220px!important;}
  .svai-hero-v3 .svai-building{height:205px!important;}
}
