.language-switch{display:flex;align-items:center;gap:4px;margin-inline-start:auto;padding:3px;border:1px solid var(--border,#3D3568);border-radius:30px;background:#080D22ee;flex-shrink:0;z-index:2}
.language-switch a{color:var(--text-muted,#C6C5D9);font:600 12px/1.2 Manrope,system-ui,sans-serif;text-decoration:none;border-radius:20px;padding:9px 7px;min-width:32px;text-align:center}
.language-switch a[aria-current="page"]{background:var(--pink,#E82BCB);color:#080D22}
.language-switch a:hover,.language-switch a:focus-visible{outline:2px solid var(--pink-bright,#FF56E7);outline-offset:2px;color:#fff}
.language-switch a[aria-current="page"]:hover,.language-switch a[aria-current="page"]:focus-visible{color:#080D22}
html[lang="ka"] body{font-family:'Noto Sans Georgian',Manrope,sans-serif}
html[lang="ka"] .language-switch a{font-family:'Noto Sans Georgian',Manrope,sans-serif}
.cms-language-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0;padding:8px 0}
.cms-language-tabs a{padding:8px 12px;border:1px solid var(--border,#3D3568);border-radius:20px;text-decoration:none}
.cms-language-tabs a[aria-current="page"]{background:var(--pink,#E82BCB);color:#080D22}
.cms-language-tabs a:focus-visible{outline:2px solid #fff;outline-offset:3px}

/* Collection description is intentionally a single line at every viewport width. */
.site-mode .collection-heading>p{white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis;min-width:0}

/* Owner-approved generated Hero benefit artwork, served same-origin under the strict CSP. */
.site-mode .hero-principles>span{position:relative}
.site-mode .hero-principles>span>svg{display:none}
.site-mode .hero-principles>span::before{content:"";width:52px;height:52px;flex:0 0 52px;background-position:center;background-repeat:no-repeat;background-size:contain}
.site-mode .hero-principles>span:nth-child(1)::before{background-image:url('/media/benefit-elastic.webp')}
.site-mode .hero-principles>span:nth-child(2)::before{background-image:url('/media/benefit-design.webp')}
.site-mode .hero-principles>span:nth-child(3)::before{background-image:url('/media/benefit-movement.webp')}
.site-mode .hero-principles>span::after{display:none!important}

/* Brand and locale chooser share the same row; secondary navigation may wrap. */
@media(max-width:1100px){
 .site-mode .top{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand locale" "nav action";height:auto;min-height:0;align-items:center;column-gap:12px;row-gap:9px;padding-block:10px}
 .site-mode .top>.logo{grid-area:brand;justify-self:start}
 .site-mode .top>.desktop-nav{grid-area:nav;justify-self:start}
 .site-mode .top>.header-action{grid-area:action;justify-self:end}
 .site-mode .top>.language-switch{grid-area:locale;justify-self:end;margin:0;max-width:100%}
}
@media(max-width:900px){
 .site-mode .top{grid-template-areas:"brand locale" "nav nav"}
 .site-mode .top>.desktop-nav{justify-self:center}
}
/* On phones the four languages sit immediately LEFT of the icon-only menu. */
@media(max-width:620px){
 .site-mode .top{grid-template-columns:minmax(0,1fr) auto 44px;grid-template-areas:"brand locale menu";padding:7px 12px;column-gap:5px;row-gap:0;min-height:67px}
 .site-mode .top>.logo{min-width:0;max-width:100%;justify-self:start}
 .site-mode .mobile-menu{grid-area:menu;justify-self:end;margin:0}
 .site-mode .mobile-menu summary{min-width:44px;width:44px;min-height:44px;height:44px;justify-content:center;gap:0}
 .site-mode .mobile-menu summary>span:first-child{display:none}
 .site-mode .mobile-menu .menu-lines{font-size:26px;line-height:1}
 .site-mode .top>.language-switch{padding:2px;gap:2px;justify-self:end;margin:0}
 .site-mode .language-switch a{min-width:27px;padding:10px 4px;font-size:11px;line-height:20px}
}
/* A 320px viewport still fits the brand, four choices, and a 44px burger on ONE row. */
@media(max-width:400px){
 .site-mode .top{grid-template-columns:minmax(0,1fr) auto 44px;grid-template-areas:"brand locale menu";column-gap:4px}
 .site-mode .top>.logo{min-width:0;width:min(36vw,136px);max-width:100%}
 .site-mode .top>.logo>span{font-size:clamp(23px,7vw,27px);letter-spacing:.12em}
 .site-mode .top>.logo>small{font-size:clamp(5px,1.5vw,6px);letter-spacing:.03em}
 .site-mode .language-switch a{min-width:25px;padding:10px 2px;font-size:10px}
 .site-mode .top>.language-switch{gap:1px;padding:2px}
}

/* Mobile editorial layout: no fixed 850px hero or absolute image/text overlap. */
@media(max-width:767px){
 .site-mode .hero{display:flex;flex-direction:column;height:auto;min-height:0;padding:clamp(24px,5vw,36px) 0 23px;overflow:hidden}
 .site-mode .hero-copy{position:relative;inset:auto;top:auto;left:auto;right:auto;width:min(100%,550px);max-width:100%;margin:0 auto;padding:0 18px;flex:none}
 .site-mode .hero h1{font-size:clamp(74px,16vw,106px);line-height:.85;max-width:100%}
 .site-mode .hero-line{font-size:clamp(28px,6.8vw,39px);line-height:.98;max-width:100%;margin:9px 0 10px;white-space:pre-line;overflow-wrap:break-word}
 .site-mode .hero-description{font-size:clamp(13px,2.1vw,15px);max-width:100%;margin:10px 0 15px}
 .site-mode .hero .neon-btn{min-width:0;max-width:100%;min-height:44px;white-space:normal;text-align:center}
 .site-mode .hero-photo-wrap{position:relative;inset:auto;top:auto;right:auto;bottom:auto;width:min(73vw,315px);height:auto;aspect-ratio:760/1030;min-height:0;margin:14px auto 0;flex:none;border:0;border-radius:0;overflow:visible;background:transparent;box-shadow:none;filter:drop-shadow(0 8px 21px #ea33d344)}
 .site-mode .hero-photo{height:100%;width:100%;object-fit:contain;object-position:center;-webkit-mask-image:none;mask-image:none}
 .site-mode .hero-photo-glimmer{display:none}
 .site-mode .hero-principles{position:relative;inset:auto;top:auto;left:auto;width:calc(100% - 28px);max-width:550px;margin:15px auto 0;padding:11px 8px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;flex:none;background:#090b2cd4;border:1px solid #9741a479;border-radius:8px}
 .site-mode .hero-principles span{min-width:0;overflow-wrap:anywhere;font-size:clamp(9px,1.8vw,11px);line-height:1.4;letter-spacing:.025em}
 .site-mode .hero-principles span+span{padding-left:7px}
 .site-mode .hero-script,.site-mode .hero-side,.site-mode .hero-ornament{display:none}
 .site-mode .collection-heading h2{max-width:100%;width:100%;font-size:clamp(31px,6.6vw,43px);overflow-wrap:anywhere;white-space:normal}
 .site-mode .collection-heading p{white-space:normal;overflow-wrap:anywhere;max-width:calc(100% - 54px)}
 .site-mode .collection-tag{white-space:normal;overflow-wrap:anywhere}
 .site-mode .model-caption h3{overflow-wrap:anywhere}
 .site-mode .final-banner{height:auto;min-height:300px;padding:33px 0}
 .site-mode .final-copy{position:relative;inset:auto;top:auto;left:auto;right:auto;transform:none;width:100%;max-width:100%;padding:17px 19px}
 .site-mode .final-copy h2{overflow-wrap:anywhere;max-width:100%;font-size:clamp(32px,6.2vw,42px)}
 .site-mode .final-copy .neon-btn{max-width:100%;white-space:normal;text-align:center}
 /* Layout-only wrapper: mobile flex order puts the genuine garment before the benefits. */
 .site-mode .hero-copy{display:contents}
 .site-mode .hero-copy>:not(.hero-principles){position:relative;z-index:3;margin-left:auto;margin-right:auto;width:calc(100% - 36px);max-width:514px}
 .site-mode .hero-copy>.neon-btn{width:max-content;max-width:calc(100% - 36px);align-self:flex-start;margin-left:max(18px,calc((100% - 514px)/2));margin-right:0}
 .site-mode .hero-photo-wrap{order:1}
 .site-mode .hero-principles{order:2}
}
@media(max-width:620px){
 .site-mode .hero h1{font-size:clamp(73px,18vw,104px)}
 .site-mode .hero-line{font-size:clamp(27px,7vw,38px)}
 .site-mode .model-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .site-mode .model-card{min-width:0}
 .site-mode .model-caption{padding-inline:9px}
 .site-mode .features{grid-template-columns:repeat(2,minmax(0,1fr));min-width:0}
 .site-mode .feature{min-width:0;gap:7px;padding:10px 8px}
 .site-mode .feature span{overflow-wrap:anywhere}
 .site-mode .footer{min-width:0}
 .site-mode .footer-nav{min-width:0}
 .site-mode .footer-nav a{white-space:normal}
}
@media(max-width:365px){
 .site-mode .hero h1{font-size:73px}
 .site-mode .hero-copy>:not(.hero-principles){width:calc(100% - 28px)}
 .site-mode .hero-copy>.neon-btn{max-width:calc(100% - 28px);margin-left:14px}
 .site-mode .hero-line{font-size:27px}
 .site-mode .hero-photo-wrap{width:min(75vw,270px)}
 .site-mode .hero-principles{width:calc(100% - 20px);padding-inline:5px;gap:5px}
 .site-mode .hero-principles span{font-size:9px}
 .site-mode .collection-heading h2{font-size:30px}
 .site-mode .model-caption{padding-inline:7px}
}
/* The approved hero keeps its handwritten accent visible on desktop, including CMS preview width. */
@media(min-width:768px) and (max-width:1450px){.site-mode .hero-script{display:block}}
@media(min-width:1451px){.site-mode .hero-script{display:block}}