/* Shared responsive sizing; horizontal scrolling stays inside data tables. */
img,video{max-width:100%}
main,.admin-main,.dashboard-content,.panel,.row>[class*="col-"],.website-tracking-heading>div,.nex-footer-grid>*{min-width:0}
.display-title,.section-title,.landing-demo-body h3,.demo-rich-content,.contact-section a,.nex-footer a{overflow-wrap:anywhere}
.section-title{font-size:clamp(1.65rem,3.4vw,3rem)}
.demo-rich-content img{height:auto}.demo-rich-content{overflow-wrap:anywhere}.demo-rich-content table{display:block;max-width:100%;overflow-x:auto}
.demo-credential-list,.demo-credential-list>div{min-width:0}
.table-responsive{max-width:100%;overscroll-behavior-x:contain}
.admin-main .table{min-width:580px}
body.admin-body .sidebar-menu.open .sidebar-submenu{max-height:650px}
@media(max-width:1199.98px){
    body[data-page="home"] .site-header{min-height:78px;background:rgba(5,8,6,.96)!important;border-bottom:1px solid #b9ccb51f;backdrop-filter:blur(16px)}
    .site-header .navbar{min-height:66px}
    body[data-page="home"] .navbar-toggler{display:grid;place-items:center;width:44px;height:44px;padding:0!important;border:1px solid #b9ccb533!important;border-radius:12px;background:#121913!important;color:#dce5da!important}
    body[data-page="home"] .offcanvas{width:min(86vw,340px);max-width:100%;background:#080d09!important;color:#dce5da}
    body[data-page="home"] .offcanvas .nav-link{padding:12px 13px!important;color:#bac4b9!important;border-radius:10px}
    body[data-page="home"] .offcanvas .nav-link:hover{background:#151c16;color:#f0f3ee!important}
    .offcanvas-header{border-bottom:1px solid #b9ccb51a}
}
@media(max-width:991.98px){
    .hero.home-hero-studio>.container>.row{row-gap:45px}
    .hero.home-hero-studio .hero-copy{max-width:100%}
    .website-features .website-features-label{flex-shrink:1;max-width:100%;white-space:normal}
    .landing-demo-heading,.gallery-head{flex-wrap:wrap;gap:20px}
    .admin-header>*,.header-left,.header-actions{min-width:0}
    .admin-header h1{overflow-wrap:anywhere}
}
@media(max-width:767.98px){
    .section{padding-block:56px}
    .hero.home-hero-studio .display-title{font-size:clamp(2rem,6.8vw,3.3rem)}
    .page-hero .display-title{font-size:clamp(2rem,7.5vw,3rem)!important}
    .consult .section-title{font-size:clamp(1.7rem,6.5vw,2.4rem)!important}
    .demo-credentials{padding:22px;gap:22px}
    .demo-detail-action{display:flex;flex-wrap:wrap;gap:10px}
    .admin-footer{flex-wrap:wrap;gap:12px}
}
@media(max-width:575.98px){
    body{background-attachment:scroll!important}
    .container{padding-inline:20px}
    .hero.home-hero-studio .hero-copy{padding-inline:12px}
    .hero.home-hero-studio .hero-actions .btn{width:auto;min-width:0;flex:1 1 140px;margin-bottom:0;padding:13px 14px;font-size:.84rem}
    .hero.home-hero-studio .trust-list{flex-wrap:wrap;gap:10px 14px;line-height:1.7}
    .hero.home-hero-studio .studio-showcase{width:100%;max-width:100%;padding-inline:20px}
    .home-hero-studio .studio-caption{flex-wrap:wrap;row-gap:7px;font-size:.48rem}
    .home-hero-studio .studio-note{max-width:100%;margin-left:0;gap:8px;padding:11px}
    .home-hero-studio .studio-note>i{margin-left:auto}
    .home-hero-studio .studio-note strong{font-size:.7rem}
    .home-hero-studio .studio-project-link{justify-content:center;gap:10px;text-align:center}
    .gallery-tabs{display:flex;flex-wrap:wrap;gap:8px;max-width:100%}
    .gallery-tab{padding:10px 13px;font-size:.8rem}
    .website-features .website-tracking-panel{padding:22px 16px}
    .website-tracking-panel .website-tracking-list li{padding:15px 12px;gap:10px}
    .tracking-copy strong{font-size:.78rem}
    .landing-price-option{flex-wrap:wrap;gap:9px 14px}
    .landing-price-option .price{margin-left:auto;white-space:nowrap}
    .demo-pagination{flex-wrap:wrap}
    .consult{padding:26px 20px;border-radius:20px}
    .form-control,.form-select{font-size:16px!important;max-width:100%}
    .btn{min-height:44px}
    .demo-detail-hero .container{padding-inline:20px}
    .demo-credential-list>div{grid-template-columns:minmax(0,1fr) 38px}
    .nex-footer-cta,.nex-footer-grid{min-width:0}
    .admin-sidebar{width:min(280px,88vw)}
    .admin-header h1{max-width:48vw;font-size:15px}
    .admin-main .panel-heading{flex-wrap:wrap;gap:12px}
    .admin-main .welcome-strip>.btn{width:100%}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.auth-shell{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr)}
.auth-content,.auth-card,.auth-card .form-group,.auth-card .input-wrap{min-width:0;max-width:100%}
.auth-card .password-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1199.98px) and (min-width:992px){.auth-card .password-grid{grid-template-columns:minmax(0,1fr);gap:0}.auth-content{padding-inline:4vw}}
@media(max-width:991.98px){.auth-shell{grid-template-columns:minmax(0,1fr)}}
@media(max-width:575.98px){.container>.row{--bs-gutter-x:1.5rem}.auth-card .password-grid{grid-template-columns:minmax(0,1fr);gap:0}.input-wrap input{font-size:16px}.input-wrap button{min-width:38px;min-height:44px}}

/* Use the standard mask composition in Firefox and other modern engines. */
@supports (mask-composite:exclude){
    .website-feature-card::before,.website-tracking-list li::before,.why-buy-card::before{
        mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);
        mask-origin:content-box,border-box;
        mask-clip:content-box,border-box;
        mask-composite:exclude;
    }
}
/* Keep content readable when an engine cannot cut out the animated border. */
@supports not ((mask-composite:exclude) or (-webkit-mask-composite:xor)){
    .website-feature-card::before,.website-tracking-list li::before,.why-buy-card::before{display:none}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
    body[data-page="home"] .site-header,body[data-page="home"] .site-header.scrolled{background:#080d09!important}
    body[data-page="home"] .landing-hero-copy,body[data-page="home"] .ecommerce-hero-bg .landing-hero-copy{background:#101811!important}
    .seo-save-bar{background:#0c120d}
}
/* Give native controls a consistent readable surface in dark Firefox forms. */
body[data-page="home"] select,.seo-form select{color-scheme:dark}
body[data-page="home"] select option,.seo-form select option{background:#111a13;color:#e4ebe2}
button:focus-visible,a:focus-visible{outline:2px solid #bed8a7;outline-offset:4px}