*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#171717;background:#fff}a{text-decoration:none;color:inherit}button{font:inherit;cursor:pointer}.brand-strip{height:40px;background:#090909;color:#fff;display:flex;align-items:center;justify-content:center;gap:18px;font-size:13px;letter-spacing:.05em}.brand-strip .brand-links{position:absolute;left:13%;display:flex;gap:32px;font-weight:700;letter-spacing:.22em}.brand-strip strong{letter-spacing:.25em}.brand-strip a{text-decoration:underline}.language-row{height:38px;display:flex;justify-content:flex-end;align-items:center;padding:0 12%;border-bottom:1px solid #eee}.language-row button{border:0;background:transparent;font-size:14px}.main-header{height:92px;display:grid;grid-template-columns:64px 1fr auto 1fr 130px;align-items:center;gap:20px;padding:0 12%;border-bottom:1px solid #e7e7e7;background:#fff;position:sticky;top:0;z-index:30}.search-btn,.header-icons button,.mobile-menu{border:0;background:transparent;font-size:24px}.nav-left,.nav-right{display:flex;gap:28px;align-items:center}.nav-left{justify-content:flex-end}.nav-right{justify-content:flex-start}.nav-left a,.nav-right a{font-size:15px;white-space:nowrap}.logo{text-align:center;line-height:1;min-width:210px}.logo span{font-size:34px;font-family:Georgia,serif;letter-spacing:.08em}.logo small{display:block;text-transform:uppercase;font-size:10px;letter-spacing:.28em;margin-top:6px}.header-icons{display:flex;gap:18px;justify-content:flex-end}.header-icons b{font-size:11px;background:#111;color:white;border-radius:50%;padding:2px 6px}.mobile-menu,.mobile-nav{display:none}.hero-slider{position:relative;min-height:650px;overflow:hidden;background:#f4f4f4}.hero-slide{display:none;min-height:650px;grid-template-columns:1fr 1fr;align-items:center}.hero-slide.active{display:grid}.custom-slide.active{grid-template-columns:1fr 1.1fr 1fr}.hero-content{padding-left:20%;max-width:760px;z-index:2}.hero-content h1{font-size:48px;letter-spacing:.12em;line-height:1.18;margin:20px 0;text-transform:uppercase}.hero-content p{font-size:22px;letter-spacing:.035em;line-height:1.45}.hero-content .script{font-family:Georgia,serif;font-size:36px;font-style:italic;letter-spacing:.12em}.black-btn,.white-btn{display:inline-flex;align-items:center;justify-content:center;min-height:58px;padding:0 60px;background:#000;color:#fff;border:0;margin-top:25px;font-weight:700;letter-spacing:.08em}.white-btn{background:#fff;color:#111}.black-btn.small{min-height:42px;padding:0 24px;font-size:12px}.full{width:100%}.hero-content.dark{background:#111;color:white;align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding-left:16%;padding-right:10%;max-width:none}.hero-content.dark h1{text-transform:none;font-size:54px;letter-spacing:.055em}.line{height:6px;background:white;width:100%;display:block;margin:10px 0 20px}.hero-content.centered{text-align:center;padding:0 40px;max-width:none}.offer-box{border:1px solid #8c8c8c;padding:24px;font-size:30px;font-weight:700;letter-spacing:.08em;background:rgba(255,255,255,.45)}.model-area{min-height:650px;background:#ddd;position:relative;overflow:hidden}.model-area img,.photo-block img{width:100%;height:100%;object-fit:cover;display:block}.deals-slide .model-area img{object-fit:cover}.custom-slide .model-area img{object-position:center}.slider-dots{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:12px}.slider-dots button{width:120px;height:8px;border:0;background:#ddd}.slider-dots button.active{background:#111}.quick-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#ddd}.quick-cats a{padding:28px 40px;background:white;border-bottom:1px solid #ddd}.quick-cats strong{display:block;font-size:22px;margin-bottom:8px}.quick-cats span{color:#666}.section{max-width:1240px;margin:auto;padding:78px 28px}.section-title{text-align:center;margin-bottom:36px}.section-title p{letter-spacing:.18em;font-weight:700;color:#777}.section-title h2{font-family:Georgia,serif;font-size:44px;font-weight:400;margin:0}.filters,.gallery-tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-bottom:30px}.filters button,.gallery-tabs button{border:1px solid #ccc;background:#fff;padding:11px 22px}.filters button.active,.gallery-tabs button.active{background:#111;color:#fff}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.product{border:1px solid #d8d8d8;background:#fff;overflow:hidden}.product-img{height:260px;background:#f2f2f2;position:relative}.product-img img{width:100%;height:100%;object-fit:cover;display:block;transition:.4s}.product:hover .product-img img{transform:scale(1.035)}.product-body{padding:20px}.tag{font-size:12px;letter-spacing:.15em;color:#777;text-transform:uppercase}.product h3{font-family:Georgia,serif;font-size:24px;font-weight:400;margin:12px 0}.product p{color:#666;line-height:1.5;min-height:68px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.actions button,.actions a{border:1px solid #111;background:#fff;padding:12px;text-align:center;font-weight:700;font-size:12px}.actions a{background:#111;color:white}.banner{max-width:1240px;margin:40px auto;padding:0 28px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}.two-col h2{font-family:Georgia,serif;font-size:46px;font-weight:400}.two-col p{letter-spacing:.15em;color:#777;font-weight:700}.photo-block{height:520px;background:#e6e6e6;position:relative;overflow:hidden}.pale{background:#f7f7f7;max-width:none}.media-grid{max-width:1240px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.media-card{background:white;border:1px solid #ddd;overflow:hidden}.media-card .thumb{height:280px;background:#eee}.media-card .thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.35s}.hair-grid .media-card .thumb{height:260px}.media-card:hover img{transform:scale(1.03)}.media-card h3{font-family:Georgia,serif;font-weight:400;font-size:20px;padding:16px 18px;margin:0}.product-media .thumb{height:300px;background:#111}.custom-section{padding:80px 28px;background:#e8edf0}.custom-card{max-width:900px;margin:auto;text-align:center;border:1px solid #bbb;padding:60px;background:rgba(255,255,255,.35)}.custom-card h2{font-family:Georgia,serif;font-size:46px;font-weight:400}.professional{text-align:center}.professional p{max-width:760px;margin:auto auto 20px;color:#666;line-height:1.6}.cart{position:fixed;right:0;top:0;width:min(420px,92vw);height:100vh;background:white;z-index:50;box-shadow:-20px 0 50px #0002;padding:24px;transform:translateX(105%);transition:.25s;overflow:auto}.cart.open{transform:translateX(0)}.cart-head{display:flex;justify-content:space-between}.cart-head button{font-size:30px;border:0;background:#eee;width:42px;height:42px}.cart-item{border-bottom:1px solid #ddd;padding:14px 0}.overlay{position:fixed;inset:0;background:#0007;z-index:40;display:none}.overlay.open{display:block}.footer{background:#111;color:white;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px;padding:60px 12%}.footer a,.footer p{display:block;color:#ccc;margin:8px 0}.footer .logo span{color:white}@media(max-width:1160px){.brand-strip .brand-links{display:none}.main-header{grid-template-columns:auto 1fr auto;gap:14px;padding:0 22px}.nav-left,.nav-right,.header-icons{display:none}.logo{min-width:unset}.mobile-menu{display:block}.mobile-nav.open{display:flex}.mobile-nav{position:sticky;top:92px;z-index:29;background:white;border-bottom:1px solid #ddd;flex-direction:column;padding:16px 24px;gap:14px}.hero-slide.active,.custom-slide.active{grid-template-columns:1fr}.hero-content,.hero-content.dark{padding:50px 28px}.hero-content.centered{padding:50px 28px}.model-area{min-height:420px}.hide-mobile{display:none}.product-grid,.quick-cats,.media-grid,.two-col{grid-template-columns:1fr 1fr}.footer{grid-template-columns:1fr 1fr}}@media(max-width:650px){.brand-strip{height:auto;padding:10px;flex-wrap:wrap}.language-row{padding:0 18px}.hero-slider,.hero-slide{min-height:auto}.hero-content h1{font-size:34px}.hero-content p{font-size:18px}.hero-content.dark h1{font-size:36px}.offer-box{font-size:22px}.quick-cats,.product-grid,.media-grid,.two-col,.footer{grid-template-columns:1fr}.section{padding:52px 18px}.black-btn,.white-btn{width:100%;padding:0 20px}.slider-dots button{width:70px}.custom-card{padding:38px 20px}.photo-block,.media-card .thumb,.hair-grid .media-card .thumb{height:360px}}
/* LHS ELEGANCE collection page */
.brand-strip a{color:#fff}.brand-strip .active-brand{border-bottom:1px solid #fff;padding-bottom:2px}.collection-page{background:#fff}.collection-hero-minimal{max-width:1180px;margin:0 auto;padding:54px 28px 22px;text-align:left}.collection-hero-minimal p{letter-spacing:.22em;font-size:12px;color:#777;margin:0 0 14px}.collection-hero-minimal h1{font-family:Georgia,serif;font-weight:400;font-size:42px;line-height:1.1;margin:0 0 14px}.collection-hero-minimal span{color:#777;font-size:13px}.collection-toolbar{max-width:1180px;margin:0 auto 18px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;color:#555;font-size:13px}.collection-toolbar label{display:flex;align-items:center;gap:10px}.collection-toolbar select{min-width:210px;border:1px solid #bbb;background:white;padding:9px 36px 9px 12px}.lhs-elegance-grid{max-width:1180px;margin:0 auto 90px;padding:0 28px;display:grid;grid-template-columns:repeat(4,1fr);column-gap:28px;row-gap:64px}.lhs-elegance-card{position:relative;text-align:center;min-height:360px}.lhs-elegance-img{height:270px;display:flex;align-items:center;justify-content:center;background:#fff;overflow:hidden}.lhs-elegance-img img{width:100%;height:100%;object-fit:contain;transition:.35s}.lhs-elegance-card:hover .lhs-elegance-img img{transform:scale(1.035)}.lhs-elegance-card h2{font-size:13px;font-family:Arial,Helvetica,sans-serif;font-weight:400;line-height:1.4;margin:16px 0 7px;color:#222}.lhs-elegance-card p{font-size:12px;margin:0;color:#222}.lhs-elegance-card strong{font-weight:700;color:#111}.old-price{text-decoration:line-through;color:#777;margin-right:5px}.sale-badge{position:absolute;top:0;right:0;background:#050505;color:white;font-size:10px;padding:4px 7px;z-index:2}.collection-header-main{box-shadow:0 1px 0 #eee}.collection-header-main .search-btn{font-size:22px;color:#555;text-align:left}
@media(max-width:1000px){.lhs-elegance-grid{grid-template-columns:repeat(3,1fr)}.collection-hero-minimal h1{font-size:34px}}@media(max-width:760px){.lhs-elegance-grid{grid-template-columns:repeat(2,1fr);gap:34px 16px}.lhs-elegance-img{height:220px}.collection-toolbar{align-items:flex-start;gap:14px;flex-direction:column}.collection-toolbar select{width:100%}}@media(max-width:430px){.lhs-elegance-grid{grid-template-columns:1fr}.lhs-elegance-img{height:300px}.collection-hero-minimal{padding-top:38px}.collection-hero-minimal h1{font-size:30px}}
.brand-strip .brand-links a{text-decoration:none;font-weight:700;letter-spacing:.22em}.brand-strip .brand-links a:hover{text-decoration:underline}.brand-strip>a{text-decoration:underline}
/* Phase 1: home hero slideshow uses model-only visuals */
.model-only-slide .model-area{background:#f2f0ec;}
.model-only-slide .model-area img{object-fit:cover;object-position:center top;}
.consultation-slide.active,.lifestyle-slide.active{display:grid;grid-template-columns:1fr 1fr;}
.consultation-slide .hero-content{background:#f7f4ef;align-self:stretch;display:flex;flex-direction:column;justify-content:center;}
.lifestyle-slide{background:#ffffff;}
.lifestyle-slide .hero-content{padding-left:12%;}
@media(max-width:1160px){.consultation-slide.active,.lifestyle-slide.active{grid-template-columns:1fr}.lifestyle-slide .hero-content{padding:50px 28px}}
/* Phase 1 header cleanup from review screenshot */
.brand-strip{height:36px;}
.brand-strip .brand-links{left:9%;}
.language-row{height:24px;padding:0 8%;border-bottom:1px solid #f2f2f2;}
.language-row button{font-size:13px;}
.main-header{height:78px;grid-template-columns:44px minmax(300px,1fr) auto minmax(260px,1fr) 42px;gap:16px;padding:0 8%;}
.nav-left,.nav-right{gap:24px;}
.nav-left a,.nav-right a{font-size:14px;}
.logo{min-width:190px;}
.logo span{font-size:31px;}
.logo small{font-size:9px;letter-spacing:.32em;}
.header-icons.clean-icons{gap:0;justify-content:center;}
.header-icons.clean-icons button{font-size:24px;line-height:1;}
@media(max-width:1160px){.main-header{height:78px;grid-template-columns:auto 1fr auto;padding:0 20px}.mobile-nav{top:78px}.brand-strip .brand-links{display:none}.header-icons.clean-icons{display:none}}
@media(max-width:650px){.brand-strip{height:auto}.language-row{padding:0 18px}}
/* Phase 1 extra: reference-style heritage banner below hero */
.heritage-section{
padding:72px 28px 80px;
background:#fff;
text-align:center;
}
.heritage-copy{
max-width:820px;
margin:0 auto 48px;
}
.heritage-copy h2{
margin:0 0 22px;
font-size:34px;
line-height:1.15;
font-weight:800;
letter-spacing:.01em;
}
.heritage-copy p{
margin:7px auto;
font-size:18px;
line-height:1.55;
color:#111;
}
.heritage-banner{
display:block;
max-width:1180px;
margin:0 auto;
border:0;
box-shadow:0 14px 34px rgba(0,0,0,.08);
overflow:hidden;
background:#f7f7f7;
}
.heritage-banner img{
width:100%;
display:block;
height:auto;
}
@media(max-width:760px){
.heritage-section{padding:48px 18px 56px}
.heritage-copy{margin-bottom:28px}
.heritage-copy h2{font-size:28px}
.heritage-copy p{font-size:16px}
}
/* Phase 2: two collection image cards under heritage banner */
.collection-showcase{
display:grid;
grid-template-columns:1fr 1fr;
gap:18px;
padding:0 24px 72px;
background:#fff;
}
.collection-tile{
position:relative;
min-height:350px;
overflow:hidden;
background:#ddd;
display:block;
}
.collection-tile img{
width:100%;
height:100%;
object-fit:cover;
display:block;
transition:transform .45s ease;
}
.collection-tile:hover img{
transform:scale(1.035);
}
.collection-tile::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(180deg,rgba(0,0,0,0) 42%,rgba(0,0,0,.48) 100%);
z-index:1;
}
.collection-women img{
object-position:center 16%;
}
.collection-men img{
object-position:center 12%;
}
.collection-overlay{
position:absolute;
left:34px;
bottom:34px;
z-index:2;
color:#fff;
text-align:left;
}
.collection-overlay h2{
margin:0 0 12px;
font-size:27px;
line-height:1;
font-weight:800;
letter-spacing:.03em;
}
.collection-overlay span{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:135px;
height:34px;
background:#fff;
color:#000;
font-size:11px;
font-weight:800;
letter-spacing:.22em;
}
@media(max-width:850px){
.collection-showcase{
grid-template-columns:1fr;
padding:0 16px 52px;
}
.collection-tile{
min-height:320px;
}
}
@media(max-width:520px){
.collection-tile{
min-height:280px;
}
.collection-overlay{
left:22px;
bottom:24px;
}
.collection-overlay h2{
font-size:22px;
}
}
/* Phase 3: blog-style three-card section */
.insights-preview{
padding: 6px 24px 58px;
background:#fff;
}
.insights-header{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:12px;
margin-bottom:34px;
text-align:center;
}
.insights-header h2{
margin:0;
font-size:28px;
font-weight:700;
letter-spacing:-0.02em;
}
.insights-viewall{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:92px;
height:26px;
padding:0 16px;
border:1px solid #d8d8d8;
background:#fff;
color:#666;
font-size:10px;
font-weight:700;
letter-spacing:.28em;
text-decoration:none;
}
.insights-grid{
max-width:1080px;
margin:0 auto;
display:grid;
grid-template-columns:repeat(3, 1fr);
gap:16px;
}
.insight-card{
text-align:center;
}
.insight-card a{
display:block;
overflow:hidden;
background:#f3f3f3;
}
.insight-card img{
width:100%;
aspect-ratio: 1 / 1;
object-fit:cover;
display:block;
transition:transform .45s ease;
}
.insight-card a:hover img{
transform:scale(1.03);
}
.insight-card h3{
margin:16px auto 0;
max-width:92%;
color:#222;
font-size:14px;
line-height:1.45;
font-weight:500;
}
@media (max-width: 960px){
.insights-grid{
grid-template-columns:1fr;
max-width:560px;
}
}
@media (max-width: 640px){
.insights-preview{
padding: 0 16px 46px;
}
.insights-header h2{
font-size:24px;
}
.insight-card h3{
font-size:13px;
}
}
/* Phase 5: refined contact and social icons */
.contact-strip-final{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:34px;
max-width:1140px;
margin:0 auto;
padding:90px 28px 78px;
text-align:center;
background:#fff;
}
.contact-strip-card{
color:#111;
padding:8px 12px;
}
.contact-icon{
width:72px;
height:72px;
display:flex;
align-items:center;
justify-content:center;
margin:0 auto 18px;
color:#111;
border-radius:24px;
background:linear-gradient(180deg,#ffffff 0%, #f5f1ea 100%);
border:1px solid #dfd7cb;
box-shadow:0 14px 32px rgba(0,0,0,.08);
transition:transform .25s ease, box-shadow .25s ease;
}
.contact-strip-card:hover .contact-icon{
transform:translateY(-4px);
box-shadow:0 18px 38px rgba(0,0,0,.12);
}
.contact-icon svg{ width:28px; height:28px; display:block; }
.contact-icon{ overflow:hidden; }
.contact-strip-card h2{
margin:0 0 12px;
font-size:21px;
font-weight:800;
}
.contact-strip-card p{
margin:7px auto;
max-width:300px;
font-size:13px;
line-height:1.55;
color:#222;
}
.contact-strip-card a{ color:#111; text-decoration:none; }
.contact-strip-card a:hover{ text-decoration:underline; }
.site-footer-final{
background:#fff;
color:#111;
border-top:1px solid #ddd;
padding:48px 12% 26px;
}
.footer-columns{
display:grid;
grid-template-columns:1fr 1fr 1fr 1.45fr;
gap:62px;
max-width:1120px;
margin:0 auto;
}
.footer-col h3{
margin:0 0 18px;
font-size:11px;
letter-spacing:.34em;
font-weight:800;
}
.footer-col a, .footer-col p{
display:block;
margin:0 0 10px;
color:#111;
font-size:12px;
line-height:1.45;
text-decoration:none;
}
.footer-col a:hover{ text-decoration:underline; }
.footer-contact p{ max-width:330px; }
.footer-logo-image{
display:block;
width:150px;
height:auto;
margin:0 0 18px;
}
.footer-socials{
max-width:1120px;
margin:58px auto 30px;
display:flex;
gap:14px;
align-items:center;
}
.social-icon{
width:46px;
height:46px;
border:1px solid #d8d0c3;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
color:#111;
text-decoration:none;
background:linear-gradient(180deg,#fff 0%, #f5f1ea 100%);
box-shadow:0 10px 24px rgba(0,0,0,.07);
transition:transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease, color .25s ease;
}
.social-icon svg{ width:19px; height:19px; display:block; }
.social-icon:hover{ transform:translateY(-4px) scale(1.03); box-shadow:0 16px 28px rgba(0,0,0,.14); color:#fff; }
.social-icon.instagram:hover{ background:#E1306C; border-color:#E1306C; }
.social-icon.facebook:hover{ background:#1877F2; border-color:#1877F2; }
.social-icon.youtube:hover{ background:#FF0000; border-color:#FF0000; }
.social-icon.tiktok:hover{ background:#111; border-color:#111; }
.social-icon.youtube svg{ width:21px; height:21px; }
.social-icon.facebook svg{ width:16px; height:16px; }
.footer-language{ text-align:center; font-size:12px; color:#444; margin:10px 0 54px; }
.footer-copy{ text-align:center; font-size:11px; color:#555; }
@media(max-width:900px){
.contact-strip-final{ grid-template-columns:1fr; padding:62px 22px 56px; gap:34px; }
.footer-columns{ grid-template-columns:1fr 1fr; gap:36px; }
}
@media(max-width:560px){
.site-footer-final{ padding:38px 22px 24px; }
.footer-columns{ grid-template-columns:1fr; }
.footer-socials{ flex-wrap:wrap; margin-top:38px; }
}
/* Hero slider height refinement */
.hero-slider{min-height:540px;}
.hero-slide{min-height:540px;}
.model-area{min-height:540px;}
.hero-content{padding-top:40px;padding-bottom:40px;}
@media(max-width:1160px){.model-area{min-height:420px;}.hero-slider,.hero-slide{min-height:420px;}}
@media(max-width:650px){.model-area{min-height:340px;}.hero-content{padding-top:32px;padding-bottom:32px;}}
/* Final override: extra-shorter hero slider without cropping model images */
.hero-slider{min-height:385px;}
.hero-slide{min-height:385px;}
.model-area{min-height:385px;display:flex;align-items:flex-end;justify-content:center;background:#f2f0ec;}
.model-only-slide .model-area img{object-fit:contain;object-position:center bottom;background:#f2f0ec;}
.hero-content{padding-top:20px;padding-bottom:20px;}
.hero-content h1{font-size:40px;}
.hero-content p{font-size:18px;}
.hero-content .script{font-size:30px;}
.hero-content.dark h1{font-size:42px;}
@media(max-width:1160px){
.hero-slider,.hero-slide,.model-area{min-height:345px;}
.hero-content,.hero-content.dark,.hero-content.centered{padding-top:22px;padding-bottom:22px;}
}
@media(max-width:650px){
.model-area{min-height:300px;}
.model-only-slide .model-area img{object-position:center top;}
.hero-content h1{font-size:30px;}
.hero-content p{font-size:17px;}
.hero-content .script{font-size:26px;}
.hero-content.dark h1{font-size:32px;}
}
/* Final slider version: full uncropped images scaled to fit inside slider */
.hero-slider{
height:420px;
min-height:420px;
max-height:420px;
overflow:hidden;
background:#f4f4f4;
}
.hero-slide{
height:420px;
min-height:420px;
max-height:420px;
grid-template-columns:1fr 1fr;
align-items:center;
}
.hero-slide.active{display:grid;}
.model-area{
height:420px;
min-height:420px;
max-height:420px;
overflow:hidden;
background:#f2f0ec;
display:flex;
align-items:center;
justify-content:center;
padding:0;
}
.hero-slider .model-area img{
width:100%;
height:100%;
object-fit:contain;
object-position:center center;
display:block;
background:#f2f0ec;
}
.hero-content{padding-top:24px;padding-bottom:24px;}
.hero-content h1{font-size:42px;line-height:1.12;margin:16px 0;}
.hero-content p{font-size:19px;line-height:1.45;}
.hero-content .script{font-size:32px;}
.hero-content.dark{padding-left:13%;padding-right:8%;}
.hero-content.dark h1{font-size:44px;}
.black-btn,.white-btn{min-height:52px;padding:0 46px;margin-top:20px;}
.offer-box{padding:20px;font-size:28px;}
.slider-dots{bottom:10px;}
.slider-dots button{height:7px;}
@media(max-width:1160px){
.hero-slider,.hero-slide,.model-area{height:385px;min-height:385px;max-height:385px;}
.hero-content,.hero-content.dark,.hero-content.centered{padding-top:18px;padding-bottom:18px;}
.hero-content h1{font-size:36px;}
.hero-content p{font-size:17px;}
.hero-content.dark h1{font-size:38px;}
.offer-box{font-size:24px;padding:16px;}
.black-btn,.white-btn{min-height:48px;padding:0 34px;}
}
@media(max-width:650px){
.hero-slider,.hero-slide{height:auto;min-height:auto;max-height:none;}
.model-area{height:330px;min-height:330px;max-height:none;}
.hero-content h1{font-size:30px;}
.hero-content p{font-size:17px;}
.hero-content .script{font-size:26px;}
.hero-content.dark h1{font-size:32px;}
}
/* Final fixed collection cards height: actual height, not min-height */
.collection-showcase{
padding-bottom:52px;
}
.collection-tile{
height:320px !important;
min-height:0 !important;
max-height:320px !important;
overflow:hidden !important;
}
.collection-tile img{
width:100% !important;
height:100% !important;
max-height:320px !important;
object-fit:cover !important;
display:block !important;
}
@media(max-width:850px){
.collection-tile{
height:300px !important;
min-height:0 !important;
max-height:300px !important;
}
.collection-tile img{
max-height:300px !important;
}
}
@media(max-width:520px){
.collection-tile{
height:260px !important;
min-height:0 !important;
max-height:260px !important;
}
.collection-tile img{
max-height:260px !important;
}
}
/* Final slider image swap: use new wide banner images while preserving existing copy and CTAs */
.hero-slider .model-area img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
display:block !important;
}
.shipping-slide .model-area img{object-position:right center !important;}
.deals-slide .model-area img{object-position:right center !important;}
.consultation-slide .model-area img{object-position:right center !important;}
.lifestyle-slide .model-area img{object-position:right center !important;}
/* Default consultation slide image swap + elegant text animation */
.consultation-slide .model-area img{
object-position:left center !important;
}
.hero-slide .hero-content > *{
opacity:0;
transform:translateY(18px);
}
.hero-slide.active .hero-content > *{
animation:heroTextReveal .8s ease forwards;
}
.hero-slide.active .hero-content > *:nth-child(1){animation-delay:.08s;}
.hero-slide.active .hero-content > *:nth-child(2){animation-delay:.18s;}
.hero-slide.active .hero-content > *:nth-child(3){animation-delay:.28s;}
.hero-slide.active .hero-content > *:nth-child(4){animation-delay:.38s;}
.hero-slide.active .hero-content > *:nth-child(5){animation-delay:.48s;}
.hero-slide.active .hero-content > *:nth-child(6){animation-delay:.58s;}
@keyframes heroTextReveal{
from{opacity:0;transform:translateY(18px);}
to{opacity:1;transform:translateY(0);}
}
.hero-slide.active .hero-content h1{
animation-duration:1s;
letter-spacing:.04em;
}
.hero-slide.active .hero-content .black-btn,
.hero-slide.active .hero-content .white-btn{
box-shadow:0 10px 24px rgba(0,0,0,.08);
}
/* Final consultation slide focus fix: keep old text/CTA, improve right image, prevent CTA clipping */
.hero-slider,
.hero-slide,
.model-area{
height:440px !important;
min-height:440px !important;
max-height:440px !important;
}
.consultation-slide .hero-content.centered{
padding:18px 40px !important;
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
overflow:hidden !important;
}
.consultation-slide .hero-content .script{
font-size:30px !important;
margin:0 0 12px !important;
}
.consultation-slide .hero-content h1{
font-size:36px !important;
line-height:1.1 !important;
margin:0 0 16px !important;
letter-spacing:.12em !important;
}
.consultation-slide .offer-box{
font-size:24px !important;
padding:16px 18px !important;
margin:0 0 14px !important;
}
.consultation-slide .hero-content p:not(.script){
font-size:17px !important;
line-height:1.4 !important;
margin:0 0 18px !important;
}
.consultation-slide .black-btn{
min-height:48px !important;
margin-top:0 !important;
padding:0 42px !important;
width:100% !important;
}
.consultation-slide .model-area{
background:#f4eee7 !important;
}
.consultation-slide .model-area img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:left center !important;
display:block !important;
}
@media(max-width:1160px){
.hero-slider,
.hero-slide,
.model-area{
height:400px !important;
min-height:400px !important;
max-height:400px !important;
}
.consultation-slide .hero-content h1{font-size:32px !important;}
.consultation-slide .offer-box{font-size:21px !important;}
}
@media(max-width:650px){
.hero-slider,
.hero-slide{
height:auto !important;
min-height:auto !important;
max-height:none !important;
}
.model-area{
height:320px !important;
min-height:320px !important;
max-height:none !important;
}
}
/* Flip consultation default slide: girl image on the left, old text/CTA on the right */
.consultation-slide .model-area{
order:1 !important;
}
.consultation-slide .hero-content.centered{
order:2 !important;
text-align:center !important;
}
.consultation-slide .model-area img{
object-position:left center !important;
}
/* Final update: collection cards use new LHS banners without cropping, while preserving existing text and CTA overlays */
.collection-showcase .collection-tile{
background:#efe4d8 !important;
}
.collection-showcase .collection-tile img{
object-fit:contain !important;
object-position:center center !important;
background:#efe4d8 !important;
}
.collection-showcase .collection-overlay{
z-index:2 !important;
}
/* July 1 polish: updated collection cards with supplied LHS images + smoother luxury motion */
.collection-showcase{
gap:22px !important;
padding:0 24px 64px !important;
align-items:stretch;
}
.collection-showcase .collection-tile{
aspect-ratio:20 / 7 !important;
height:auto !important;
max-height:none !important;
min-height:0 !important;
border-radius:2px;
overflow:hidden;
background:#efe7de !important;
box-shadow:0 16px 40px rgba(47,28,11,.08);
transition:transform .45s ease, box-shadow .45s ease;
isolation:isolate;
}
.collection-showcase .collection-tile::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(90deg,rgba(15,10,7,.18) 0%,rgba(15,10,7,.08) 24%,rgba(15,10,7,0) 54%);
z-index:1;
pointer-events:none;
}
.collection-showcase .collection-tile::after{
background:linear-gradient(180deg,rgba(0,0,0,0) 42%,rgba(0,0,0,.46) 100%) !important;
opacity:.98;
transition:opacity .35s ease;
}
.collection-showcase .collection-tile:hover{
transform:translateY(-5px);
box-shadow:0 24px 54px rgba(47,28,11,.14);
}
.collection-showcase .collection-tile img{
width:100% !important;
height:100% !important;
max-height:none !important;
object-fit:cover !important;
object-position:center center !important;
display:block !important;
transform:scale(1);
transition:transform .75s ease, filter .45s ease;
}
.collection-showcase .collection-tile:hover img{
transform:scale(1.022);
}
.collection-showcase .collection-overlay{
left:34px !important;
bottom:32px !important;
right:24px;
text-shadow:0 5px 14px rgba(0,0,0,.20);
}
.collection-showcase .collection-overlay h2,
.collection-showcase .collection-overlay span{
opacity:0;
animation:lhsCollectionReveal .85s ease forwards;
}
.collection-showcase .collection-overlay h2{
margin:0 0 14px !important;
font-size:27px !important;
line-height:1.02;
letter-spacing:.035em;
transform:translateY(14px);
}
.collection-showcase .collection-overlay span{
min-width:138px;
height:36px;
padding:0 18px;
border-radius:2px;
box-shadow:0 10px 24px rgba(0,0,0,.12);
transform:translateY(18px);
transition:transform .35s ease, box-shadow .35s ease, background .35s ease, color .35s ease;
}
.collection-showcase .collection-women .collection-overlay h2,
.collection-showcase .collection-men .collection-overlay h2{animation-delay:.06s;}
.collection-showcase .collection-women .collection-overlay span,
.collection-showcase .collection-men .collection-overlay span{animation-delay:.18s;}
.collection-showcase .collection-tile:hover .collection-overlay span{
transform:translateY(-1px);
box-shadow:0 14px 30px rgba(0,0,0,.18);
}
@keyframes lhsCollectionReveal{
from{opacity:0;transform:translateY(16px);}
to{opacity:1;transform:translateY(0);}
}
@media(max-width:850px){
.collection-showcase{
grid-template-columns:1fr !important;
gap:18px !important;
padding:0 16px 54px !important;
}
.collection-showcase .collection-overlay{
left:24px !important;
bottom:24px !important;
}
.collection-showcase .collection-overlay h2{
font-size:24px !important;
}
}
@media(max-width:520px){
.collection-showcase .collection-overlay h2{
font-size:21px !important;
}
.collection-showcase .collection-overlay span{
min-width:126px;
height:34px;
font-size:10px;
letter-spacing:.18em;
}
}
/* July 1: Men / Women dedicated subpages */
.main-header .active-link{
color:#b49057 !important;
font-weight:700;
}
.system-page{
background:#fff;
}
.system-hero{
position:relative;
max-width:1520px;
margin:0 auto;
height:420px;
overflow:hidden;
background:#efe7de;
}
.system-hero img{
width:100%;
height:100%;
object-fit:cover;
object-position:center center;
display:block;
filter:saturate(.98) contrast(.98);
transform:scale(1.01);
}
.system-hero::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(90deg,rgba(255,255,255,.75) 0%,rgba(255,255,255,.42) 34%,rgba(255,255,255,0) 70%);
pointer-events:none;
}
.system-hero-copy{
position:absolute;
left:7%;
top:50%;
transform:translateY(-50%);
max-width:420px;
z-index:2;
color:#1f1b18;
animation:systemHeroReveal .9s ease both;
}
.system-hero-copy p{
margin:0 0 12px;
font-size:12px;
letter-spacing:.28em;
color:#9d8152;
font-weight:700;
}
.system-hero-copy h1{
margin:0 0 16px;
font-family:Georgia,serif;
font-weight:400;
font-size:54px;
line-height:.98;
}
.system-hero-copy span{
color:#6d635c;
font-size:17px;
line-height:1.6;
}
@keyframes systemHeroReveal{
from{opacity:0;transform:translateY(calc(-50% + 18px));}
to{opacity:1;transform:translateY(-50%);}
}
.system-intro{
max-width:1180px;
margin:54px auto 30px;
padding:0 28px;
display:flex;
align-items:end;
justify-content:space-between;
gap:28px;
}
.system-intro .eyebrow{
margin:0 0 12px;
font-size:12px;
font-weight:700;
letter-spacing:.26em;
color:#b49057;
}
.system-intro h2{
margin:0;
max-width:680px;
font-family:Georgia,serif;
font-weight:400;
font-size:35px;
line-height:1.15;
}
.system-consult-btn,
.system-bottom-cta a{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:44px;
padding:0 26px;
background:#050505;
color:#fff;
text-decoration:none;
font-size:11px;
letter-spacing:.22em;
font-weight:800;
white-space:nowrap;
transition:transform .3s ease, box-shadow .3s ease;
}
.system-consult-btn:hover,
.system-bottom-cta a:hover{
transform:translateY(-2px);
box-shadow:0 14px 30px rgba(0,0,0,.18);
}
.systems-grid{
max-width:1180px;
margin:0 auto 70px;
padding:0 28px;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:42px 26px;
}
.system-card{
background:#fff;
animation:systemCardReveal .75s ease both;
}
.system-card:nth-child(2){animation-delay:.05s}
.system-card:nth-child(3){animation-delay:.1s}
.system-card:nth-child(4){animation-delay:.15s}
.system-card:nth-child(5){animation-delay:.2s}
.system-card:nth-child(6){animation-delay:.25s}
.system-card:nth-child(7){animation-delay:.3s}
.system-card:nth-child(8){animation-delay:.35s}
@keyframes systemCardReveal{
from{opacity:0;transform:translateY(18px);}
to{opacity:1;transform:translateY(0);}
}
.system-card a{
color:inherit;
text-decoration:none;
display:block;
}
.system-img{
height:300px;
background:#f6f2ed;
overflow:hidden;
}
.system-img img{
width:100%;
height:100%;
object-fit:cover;
display:block;
transition:transform .55s ease;
}
.lhs-products-three-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
.system-detail-link{
display:block;
color:inherit;
text-decoration:none;
}
.system-card[data-product-card-details] .system-card-inner{
cursor:pointer;
}
.system-detail-link:focus-visible,
.system-details-btn:focus-visible,
.lhs-product-detail-close:focus-visible{
outline:2px solid #b48745;
outline-offset:4px;
}
.system-details-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:32px;
margin:0 0 12px;
padding:0;
border:0;
background:transparent;
color:#a87532;
cursor:pointer;
font:700 10px/1 Arial,Helvetica,sans-serif;
letter-spacing:.15em;
}
.system-details-btn::after{
content:'→';
margin-left:8px;
font-size:14px;
}
.lhs-product-detail-modal{
width:min(760px,calc(100% - 32px));
max-width:760px;
padding:0;
border:0;
border-radius:24px;
background:#fbfaf8;
color:#1d1711;
box-shadow:0 28px 90px rgba(0,0,0,.32);
}
.lhs-product-detail-modal::backdrop{
background:rgba(16,12,8,.68);
backdrop-filter:blur(5px);
}
.lhs-product-detail-close{
position:absolute;
z-index:2;
top:14px;
right:14px;
width:38px;
height:38px;
border:1px solid rgba(29,23,17,.12);
border-radius:50%;
background:#fff;
color:#1d1711;
cursor:pointer;
font:300 28px/34px Arial,Helvetica,sans-serif;
}
.lhs-product-detail-layout{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
.lhs-product-detail-image{
min-height:360px;
background:#f4efe8;
}
.lhs-product-detail-image img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}
.lhs-product-detail-copy{
display:flex;
flex-direction:column;
justify-content:center;
padding:50px 42px;
}
.lhs-product-detail-copy .eyebrow{
margin:0 0 14px;
}
.lhs-product-detail-copy h2{
margin:0 0 18px;
font-family:Georgia,serif;
font-size:34px;
line-height:1.07;
font-weight:400;
}
.lhs-product-detail-copy > p{
margin:0;
color:#746b62;
font-size:15px;
line-height:1.65;
}
.lhs-product-detail-facts{
display:grid;
gap:15px;
margin:28px 0 0;
padding-top:22px;
border-top:1px solid rgba(29,23,17,.12);
}
.lhs-product-detail-facts div{
display:grid;
gap:5px;
}
.lhs-product-detail-facts dt{
color:#a87532;
font:700 10px/1.2 Arial,Helvetica,sans-serif;
letter-spacing:.14em;
text-transform:uppercase;
}
.lhs-product-detail-facts dd{
margin:0;
color:#554b42;
font-size:13px;
line-height:1.45;
}
@media(max-width:640px){
.lhs-product-detail-layout{grid-template-columns:1fr;}
.lhs-product-detail-image{min-height:260px;max-height:320px;}
.lhs-product-detail-copy{padding:30px 26px 34px;}
.lhs-product-detail-copy h2{font-size:29px;}
}
.system-card:hover .system-img img{
transform:scale(1.045);
}
.system-info{
text-align:center;
padding:17px 6px 0;
}
.system-info p{
margin:0 0 8px;
font-size:11px;
letter-spacing:.12em;
color:#8b7a68;
text-transform:uppercase;
}
.system-info h2{
margin:0 0 10px;
font-family:Arial,Helvetica,sans-serif;
font-size:15px;
line-height:1.35;
font-weight:500;
}
.system-info span{
font-size:10px;
letter-spacing:.22em;
font-weight:800;
color:#111;
border-bottom:1px solid #111;
padding-bottom:3px;
}
.system-bottom-cta{
max-width:1120px;
margin:0 auto 86px;
padding:46px 28px;
text-align:center;
background:#f4eee7;
}
.system-bottom-cta p{
margin:0 0 12px;
color:#9d8152;
font-size:12px;
letter-spacing:.22em;
font-weight:700;
text-transform:uppercase;
}
.system-bottom-cta h2{
max-width:660px;
margin:0 auto 24px;
font-family:Georgia,serif;
font-weight:400;
font-size:32px;
line-height:1.2;
}
@media(max-width:980px){
.system-hero{height:360px}
.system-hero-copy h1{font-size:42px}
.systems-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
.system-hero{height:330px}
.system-hero-copy{
left:28px;
right:28px;
max-width:none;
}
.system-hero-copy h1{font-size:36px}
.system-intro{
align-items:flex-start;
flex-direction:column;
margin-top:40px;
}
.system-intro h2{font-size:28px}
.systems-grid{grid-template-columns:repeat(2,1fr);gap:32px 16px}
.system-img{height:250px}
}
@media(max-width:470px){
.system-hero{height:300px}
.system-hero-copy h1{font-size:31px}
.systems-grid{grid-template-columns:1fr}
.system-img{height:320px}
.system-bottom-cta h2{font-size:25px}
}
/* July 1 update: product subpages display prices + add-to-cart style instead of booking consultation */
.system-price-note{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:6px;
min-width:250px;
padding:16px 18px;
background:#f6f0e8;
border:1px solid rgba(180,144,87,.24);
color:#1d1711;
}
.system-price-note strong{
font-family:Georgia,serif;
font-size:20px;
font-weight:400;
letter-spacing:.03em;
}
.system-price-note span{
color:#8b7a68;
font-size:12px;
line-height:1.45;
letter-spacing:.08em;
text-transform:uppercase;
}
.systems-grid{
gap:48px 30px !important;
}
.system-card{
border:1px solid rgba(30,20,10,.06);
box-shadow:0 14px 34px rgba(44,29,13,.045);
transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
padding-bottom:18px;
}
.system-card:hover{
transform:translateY(-5px);
box-shadow:0 22px 48px rgba(44,29,13,.10);
border-color:rgba(180,144,87,.22);
}
.system-card-inner{
display:block;
color:inherit;
}
.system-info{
padding:18px 14px 0 !important;
}
.system-info p{
min-height:32px;
margin-bottom:10px !important;
font-family:"Helvetica Neue",Arial,Helvetica,sans-serif;
font-size:10.5px !important;
letter-spacing:.14em !important;
line-height:1.35;
}
.system-info h2{
min-height:42px;
margin-bottom:8px !important;
font-family:"Helvetica Neue",Arial,Helvetica,sans-serif !important;
font-size:16px !important;
font-weight:500 !important;
letter-spacing:.01em;
color:#1c1713;
}
.system-price{
display:block;
margin:0 0 13px;
font-family:Georgia,serif;
font-size:19px;
font-weight:400;
letter-spacing:.03em;
color:#b49057;
}
.system-add-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:34px;
padding:0 19px;
border:1px solid #111;
background:#fff;
color:#111;
font-size:10px;
font-weight:800;
letter-spacing:.2em;
transition:background .3s ease, color .3s ease, transform .3s ease, box-shadow .3s ease;
}
.system-add-btn:hover{
background:#111;
color:#fff;
transform:translateY(-2px);
box-shadow:0 10px 24px rgba(0,0,0,.14);
}
.system-bottom-cta{
background:linear-gradient(135deg,#f6f0e8,#efe3d5) !important;
}
@media(max-width:760px){
.system-price-note{
width:100%;
}
.system-info h2{
min-height:auto;
}
}
/* July 1: NEWIMAGE-style hover mega header */
.language-row{
height:36px !important;
padding:0 13% !important;
justify-content:flex-end !important;
background:#fff !important;
border-bottom:1px solid #eee !important;
}
.language-row button{
letter-spacing:.04em;
}
.main-header.mega-header{
height:86px !important;
display:grid !important;
grid-template-columns:64px minmax(390px,1fr) auto minmax(360px,1fr) 116px !important;
align-items:center !important;
gap:22px !important;
padding:0 12.5% !important;
background:#fff !important;
border-bottom:1px solid rgba(0,0,0,.055) !important;
position:sticky !important;
top:0 !important;
z-index:1200 !important;
overflow:visible !important;
box-shadow:0 1px 0 rgba(0,0,0,.02);
}
.main-header.mega-header .search-btn{
font-size:27px !important;
line-height:1 !important;
color:#151515 !important;
}
.mega-nav{
display:flex !important;
align-items:center !important;
gap:30px !important;
}
.nav-left.mega-nav{justify-content:flex-end !important;}
.nav-right.mega-nav{justify-content:flex-start !important;}
.mega-trigger,
.nav-left .mega-trigger,
.nav-right .mega-trigger{
position:relative;
display:inline-flex;
align-items:center;
min-height:86px;
font-family:"Helvetica Neue",Arial,Helvetica,sans-serif;
font-size:15.5px !important;
font-weight:400;
letter-spacing:.025em;
white-space:nowrap;
color:#111;
}
.mega-trigger::after{
content:"";
position:absolute;
left:0;
right:0;
bottom:0;
height:2px;
background:#111;
transform:scaleX(0);
transform-origin:left center;
transition:transform .25s ease;
}
.mega-trigger:hover::after,
.mega-item:hover > .mega-trigger::after,
.mega-trigger.active-link::after,
.main-header .active-link::after{
transform:scaleX(1);
}
.main-header .active-link{
color:#000 !important;
font-weight:500 !important;
}
.logo{
min-width:228px !important;
text-align:center !important;
}
.logo span{
font-family:Georgia,serif !important;
font-size:34px !important;
letter-spacing:.09em !important;
color:#111;
}
.logo small{
font-size:10px !important;
letter-spacing:.3em !important;
margin-top:6px !important;
}
.mega-item{
position:relative;
display:inline-flex;
align-items:center;
}
.mega-item.mega-full{
position:static;
}
.mega-panel{
position:absolute;
top:100%;
left:0;
right:0;
z-index:1300;
background:#fff;
border-top:1px solid rgba(0,0,0,.045);
border-bottom:1px solid rgba(0,0,0,.06);
box-shadow:0 24px 38px rgba(0,0,0,.08);
opacity:0;
visibility:hidden;
pointer-events:none;
transform:translateY(10px);
transition:opacity .25s ease, transform .25s ease, visibility .25s ease;
}
.mega-item:hover > .mega-panel,
.mega-item:focus-within > .mega-panel{
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translateY(0);
}
.mega-panel-inner{
min-height:190px;
max-width:1180px;
margin:0 auto;
padding:42px 24px 46px;
display:grid;
gap:72px;
align-items:start;
}
.mega-panel-men{grid-template-columns:260px;justify-content:center;}
.mega-panel-women{grid-template-columns:220px 220px;justify-content:center;}
.mega-panel-accessories{grid-template-columns:220px 220px 220px;justify-content:center;}
.mega-panel-explore{grid-template-columns:260px 280px;justify-content:center;}
.mega-column h3{
margin:0 0 18px;
font-family:"Helvetica Neue",Arial,Helvetica,sans-serif;
font-size:12px;
font-weight:800;
letter-spacing:.36em;
color:#111;
}
.mega-column a,
.compact-panel a{
display:block;
width:max-content;
margin:0 0 14px;
font-size:15px;
line-height:1.2;
letter-spacing:.015em;
color:#272727;
transition:color .2s ease, transform .2s ease;
}
.mega-column a:hover,
.compact-panel a:hover{
color:#a9864a;
transform:translateX(3px);
}
.mega-heading-link{
margin-top:22px !important;
margin-bottom:0 !important;
}
.mega-heading-link a{
margin:0 !important;
font-size:12px !important;
letter-spacing:.36em !important;
font-weight:800 !important;
color:#111 !important;
}
.mega-heading-link a:hover{
color:#a9864a !important;
}
.mega-compact{
position:relative !important;
}
.compact-panel{
left:0;
right:auto;
width:278px;
min-height:0;
padding:20px 20px 8px;
border:1px solid rgba(0,0,0,.06);
box-shadow:0 18px 36px rgba(0,0,0,.10);
}
.compact-panel a{
width:auto;
margin:0 0 17px;
font-size:16px;
}
.header-icons.clean-icons{
gap:18px !important;
justify-content:flex-end !important;
}
.header-icons.clean-icons button{
font-size:22px !important;
color:#111;
width:28px;
height:28px;
line-height:1;
display:inline-flex;
align-items:center;
justify-content:center;
}
.bag-icon{
border:1px solid #111 !important;
border-radius:1px;
font-size:0 !important;
position:relative;
}
.bag-icon::before{
content:"";
position:absolute;
top:-6px;
width:11px;
height:7px;
border:1px solid #111;
border-bottom:0;
border-radius:7px 7px 0 0;
}
.account-icon{
font-size:20px !important;
}
@media(max-width:1180px){
.main-header.mega-header{
grid-template-columns:46px 1fr auto 1fr 92px !important;
padding:0 5% !important;
gap:16px !important;
}
.mega-nav{gap:18px !important;}
.mega-trigger{font-size:14px !important;}
}
@media(max-width:920px){
.main-header.mega-header{
grid-template-columns:46px 1fr 46px !important;
height:74px !important;
}
.main-header.mega-header .nav-left,
.main-header.mega-header .nav-right,
.main-header.mega-header .header-icons{
display:none !important;
}
.main-header.mega-header .logo{
min-width:0 !important;
}
.main-header.mega-header .mobile-menu{
display:block !important;
justify-self:end;
}
.mobile-nav.open{
display:flex !important;
position:sticky;
top:74px;
z-index:1190;
flex-direction:column;
background:#fff;
padding:18px 24px;
border-bottom:1px solid #eee;
box-shadow:0 18px 34px rgba(0,0,0,.08);
}
.mobile-nav.open a{
padding:11px 0;
border-bottom:1px solid #f2f2f2;
font-size:15px;
}
}
/* July 1: additional category/content pages */
.content-hero{
max-width:1180px;
margin:0 auto;
padding:72px 28px 36px;
text-align:center;
}
.content-hero p{
margin:0 0 14px;
font-size:12px;
letter-spacing:.32em;
color:#a9864a;
font-weight:800;
}
.content-hero h1{
margin:0 0 16px;
font-family:Georgia,serif;
font-size:52px;
line-height:1.05;
font-weight:400;
}
.content-hero span{
display:block;
max-width:670px;
margin:0 auto;
font-size:17px;
line-height:1.7;
color:#6f665e;
}
.content-grid{
max-width:1120px;
margin:0 auto 70px;
padding:0 28px;
display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px;
}
.content-card{
min-height:215px;
padding:30px 28px;
background:#fff;
border:1px solid rgba(30,20,10,.07);
box-shadow:0 16px 38px rgba(44,29,13,.055);
transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.content-card:hover{
transform:translateY(-5px);
box-shadow:0 24px 54px rgba(44,29,13,.105);
border-color:rgba(180,144,87,.25);
}
.content-card h2{
margin:0 0 14px;
font-family:Georgia,serif;
font-size:25px;
font-weight:400;
}
.content-card p{
margin:0 0 22px;
color:#6f665e;
line-height:1.65;
font-size:14px;
}
.content-card a{
display:inline-flex;
border-bottom:1px solid #111;
padding-bottom:5px;
font-size:11px;
font-weight:800;
letter-spacing:.22em;
}
@media(max-width:850px){
.content-grid{grid-template-columns:1fr;}
.content-hero h1{font-size:38px;}
}
.system-add-btn.is-added{
background:#111 !important;
color:#fff !important;
}
/* July 1: Service Partner mega menu and Iconic Hair Care partner pages */
.main-header.mega-header{
grid-template-columns:44px minmax(300px,.9fr) auto minmax(470px,1.35fr) 58px !important;
gap:14px !important;
padding-left:6% !important;
padding-right:6% !important;
}
.mega-nav{gap:20px !important;}
.mega-panel-service{grid-template-columns:300px 220px 220px;justify-content:center;align-items:start;}
.service-logo-column img{width:210px;max-width:100%;height:auto;margin:0 0 18px;display:block;}
.service-logo-column p{font-size:13px;line-height:1.6;color:#555;margin:0;letter-spacing:.02em;}
.service-partner-nav .mega-panel{min-height:230px;}
.partner-page{background:#fff;color:#151515;}
.partner-hero{max-width:1240px;margin:0 auto;padding:72px 28px 54px;text-align:center;border-bottom:1px solid #eee;}
.partner-brand-lockup{display:flex;align-items:center;justify-content:center;gap:28px;margin:0 auto 34px;flex-wrap:wrap;}
.lhs-mini-lockup{line-height:1;text-align:center;min-width:170px;}
.lhs-mini-lockup span{font-family:Georgia,serif;font-size:46px;letter-spacing:.08em;color:#4c3b2e;display:block;}
.lhs-mini-lockup small{font-size:10px;text-transform:uppercase;letter-spacing:.27em;color:#6f6259;display:block;margin-top:8px;}
.partner-x{font-family:Georgia,serif;font-size:26px;color:#ad9b8c;}
.partner-brand-lockup img{width:240px;max-width:80vw;height:auto;}
.partner-hero p,.partner-detail-block .eyebrow{font-size:12px;font-weight:800;letter-spacing:.32em;color:#9b8673;margin:0 0 16px;text-transform:uppercase;}
.partner-hero h1{font-family:Georgia,serif;font-size:48px;font-weight:400;line-height:1.1;margin:0 0 18px;color:#171717;}
.partner-hero span{display:block;max-width:780px;margin:0 auto;color:#626262;font-size:17px;line-height:1.7;}
.partner-hero-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:30px;}
.partner-hero-actions a,.partner-service-grid a,.partner-branch-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 24px;border:1px solid #111;font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;}
.partner-hero-actions a:first-child,.partner-branch-btn{background:#111;color:#fff;}
.partner-intro-grid,.partner-service-grid,.partner-branches,.partner-detail-block,.partner-branch-single{max-width:1160px;margin:0 auto;padding:54px 28px;}
.partner-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.partner-intro-grid article,.partner-service-grid article,.partner-branches article,.partner-detail-block,.partner-branch-single{border:1px solid #e2ddd8;background:#fff;box-shadow:0 18px 42px rgba(55,34,18,.05);}
.partner-intro-grid article{padding:34px;}
.partner-intro-grid h2,.partner-service-grid h3,.partner-branches h2,.partner-detail-block h2,.partner-branch-single h2{font-family:Georgia,serif;font-weight:400;color:#171717;}
.partner-intro-grid h2{font-size:31px;margin:0 0 12px;}
.partner-intro-grid p,.partner-service-grid p,.partner-branches p,.partner-detail-block li,.partner-branch-single p{font-size:15px;line-height:1.65;color:#5f5f5f;}
.partner-service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding-top:8px;}
.partner-service-grid article{padding:28px 24px;transition:transform .35s ease, box-shadow .35s ease;}
.partner-service-grid article:hover{transform:translateY(-5px);box-shadow:0 22px 48px rgba(55,34,18,.1);}
.partner-service-grid strong{display:block;color:#b59877;letter-spacing:.18em;font-size:11px;margin-bottom:16px;}
.partner-service-grid h3{font-size:24px;margin:0 0 12px;}
.partner-service-grid a{margin-top:12px;min-height:36px;padding:0 16px;font-size:10px;}
.partner-detail-block{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:start;padding:48px;}
.partner-detail-block h2{font-size:38px;margin:0;line-height:1.15;}
.partner-detail-block ul{margin:0;padding-left:20px;}
.partner-detail-block li{margin-bottom:12px;}
.partner-branches{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.partner-branches article{padding:34px;}
.partner-branches h2,.partner-branch-single h2{font-size:32px;margin:0 0 16px;}
.partner-branches a:not(.partner-branch-btn),.partner-branch-single a{font-weight:700;color:#111;border-bottom:1px solid #111;}
.partner-branch-btn{margin-top:14px;}
.partner-branch-single{display:grid;grid-template-columns:320px 1fr;gap:44px;align-items:center;padding:52px;}
.partner-branch-single img{max-width:280px;width:100%;height:auto;justify-self:center;}
.partner-bottom-cta{margin-top:20px;}
@media(max-width:1320px){
.main-header.mega-header{grid-template-columns:44px minmax(260px,.8fr) auto minmax(420px,1.2fr) 44px !important;padding-left:4% !important;padding-right:4% !important;}
.mega-nav{gap:15px !important;}
.mega-trigger{font-size:13px !important;}
}
@media(max-width:1160px){
.main-header.mega-header{grid-template-columns:auto 1fr auto !important;padding:0 20px !important;}
.partner-service-grid{grid-template-columns:repeat(2,1fr);}
.partner-intro-grid,.partner-branches,.partner-detail-block,.partner-branch-single{grid-template-columns:1fr;}
.partner-branch-single img{justify-self:start;}
}
@media(max-width:650px){
.partner-hero{padding:52px 18px 42px;}
.partner-hero h1{font-size:34px;}
.partner-brand-lockup{gap:16px;}
.lhs-mini-lockup span{font-size:38px;}
.partner-brand-lockup img{width:210px;}
.partner-service-grid{grid-template-columns:1fr;padding-left:18px;padding-right:18px;}
.partner-intro-grid,.partner-branches,.partner-detail-block,.partner-branch-single{padding:32px 18px;}
.partner-detail-block{padding:28px 20px;}
}
/* Product detail page: LUX-E Tape-In Extensions */
.product-detail-page{background:#fff;color:#111;}
.product-detail-wrap{max-width:1440px;margin:0 auto;padding:42px 50px 70px;display:grid;grid-template-columns:minmax(420px,640px) minmax(520px,1fr);gap:68px;align-items:start;}
.product-breadcrumb{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#8a7a6d;margin:0 0 14px;}
.product-breadcrumb a{color:#8a7a6d;}
.product-detail-info h1{font-family:Arial,Helvetica,sans-serif;font-size:34px;line-height:1.05;letter-spacing:.02em;margin:0 0 10px;font-weight:800;}
.product-code{font-size:14px;margin:0 0 30px;color:#111;}
.product-rule{height:1px;background:#e3ddd6;margin-bottom:28px;}
.choice-group{margin:0 0 30px;}
.choice-label{font-size:13px;letter-spacing:.55em;font-weight:700;margin:0 0 14px;color:#111;}
.choice-label span{letter-spacing:.08em;font-weight:400;color:#8a6b55;}
.color-swatches{display:flex;flex-wrap:wrap;gap:9px;align-items:center;}
.swatch{width:42px;height:42px;border:1px solid #ded6cc;border-radius:50%;background:var(--swatch);box-shadow:inset 0 0 0 4px #fff;transition:.2s ease;}
.swatch.active,.swatch:hover{border:2px solid #111;transform:translateY(-1px);}
.swatch-numbers{display:grid;grid-template-columns:repeat(12,42px);gap:9px;margin-top:10px;font-size:12px;color:#897a72;text-align:center;}
.length-buttons{display:flex;flex-wrap:wrap;gap:7px;}
.length-buttons button{min-width:116px;height:42px;border:1px solid #e0d8cf;background:#fff;font-size:16px;transition:.2s ease;}
.length-buttons button.active,.length-buttons button:hover{border:2px solid #111;}
.length-hints{display:flex;gap:86px;margin:10px 0 0 9px;font-size:11px;color:#8b7e77;}
.stock-row{display:flex;align-items:center;gap:12px;font-size:15px;margin:2px 0 26px;}
.stock-row span{width:9px;height:9px;border-radius:50%;background:#66d04e;box-shadow:0 0 0 6px #edf8e9;display:inline-block;}
.product-price-row{display:flex;align-items:flex-end;gap:14px;margin:0 0 16px;}
.product-price-row strong{font-size:26px;letter-spacing:.04em;}
.product-price-row small{font-size:12px;color:#8b7e77;padding-bottom:4px;}
.product-add-cart{width:260px;max-width:100%;margin:0 0 28px;background:#111;color:#fff;border-color:#111;}
.product-copy{font-size:16px;line-height:1.42;max-width:660px;}
.product-copy p{margin:0 0 24px;}
.shipping-box{border:1px solid #e2ddd6;margin-top:34px;max-width:654px;}
.shipping-box summary{height:50px;display:flex;align-items:center;justify-content:center;letter-spacing:.45em;font-size:12px;cursor:pointer;list-style:none;}
.shipping-box summary::-webkit-details-marker{display:none;}
.shipping-box p{padding:0 24px 20px;margin:0;color:#665d55;line-height:1.55;}
.product-detail-gallery{display:grid;grid-template-columns:1fr 78px;gap:16px;align-items:start;position:sticky;top:118px;}
.main-product-image{background:#f5f3f0;min-height:520px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.main-product-image img{width:100%;height:100%;min-height:520px;object-fit:cover;display:block;}
.detail-thumbs{display:flex;flex-direction:column;gap:18px;}
.detail-thumbs button{width:76px;height:76px;border:1px solid transparent;background:#f6f4f2;padding:0;overflow:hidden;transition:.2s ease;}
.detail-thumbs button.active,.detail-thumbs button:hover{border-color:#111;}
.detail-thumbs img{width:100%;height:100%;object-fit:cover;display:block;}
.product-specs{max-width:1160px;margin:0 auto;padding:58px 50px 36px;}
.product-specs h2,.you-may-like h2{font-size:24px;margin:0 0 34px;font-weight:800;}
.product-specs table{width:100%;border-collapse:collapse;font-size:13px;}
.product-specs th,.product-specs td{border-top:1px solid #dcd6ce;padding:13px 14px;text-align:left;font-weight:400;}
.product-specs th{width:160px;color:#62574e;}
.you-may-like{max-width:1160px;margin:0 auto;padding:14px 50px 78px;text-align:center;}
.recommend-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:54px;text-align:center;}
.recommend-card{position:relative;display:block;}
.recommend-card span{position:absolute;right:0;top:0;background:#111;color:#fff;font-size:10px;padding:5px 7px;z-index:2;}
.recommend-card img{width:100%;height:300px;object-fit:contain;background:#f6f5f3;display:block;}
.recommend-card p{font-size:13px;margin:12px 0 0;color:#222;}
@media(max-width:1080px){.product-detail-wrap{grid-template-columns:1fr;gap:32px;padding:32px 24px 54px}.product-detail-gallery{position:static;grid-template-columns:1fr}.detail-thumbs{flex-direction:row}.main-product-image,.main-product-image img{min-height:420px}.recommend-grid{grid-template-columns:repeat(2,1fr);gap:34px}.swatch-numbers{display:none}}
@media(max-width:560px){.product-detail-info h1{font-size:28px}.choice-label{letter-spacing:.35em}.length-buttons button{width:100%}.product-add-cart{width:100%}.product-specs,.you-may-like{padding-left:20px;padding-right:20px}.recommend-grid{grid-template-columns:1fr}.recommend-card img{height:260px}}
/* July 1 tape-in detail update: hair color preview switches from left swatches */
.texture-gallery{background:#f4f2ef !important;min-height:430px !important;}
.texture-gallery img{object-fit:cover !important;object-position:center center !important;min-height:430px !important;}
.product-detail-gallery{grid-template-columns:minmax(0,1fr) 86px !important;gap:14px !important;}
.detail-thumbs{gap:14px !important;}
.detail-thumbs button{width:76px !important;height:76px !important;background:#f6f4f2 !important;display:flex;align-items:center;justify-content:center;}
.detail-thumbs img{object-fit:cover !important;}
@media(max-width:1080px){
.product-detail-gallery{grid-template-columns:1fr !important;}
.detail-thumbs{flex-direction:row !important;flex-wrap:wrap;}
}
/* Keratin detail fix: default first image is LHS box; hair shades remain texture previews */
.product-detail-gallery .detail-thumbs button:first-child img{object-fit:contain !important;background:#111;}
/* Featured Deals page: product photos are cropped from supplied reference screenshots, no generated product images */
.featured-deals-page{background:#fff;color:#111;padding-bottom:90px;}
.featured-deals-hero{max-width:1280px;margin:0 auto;text-align:center;padding:52px 28px 30px;}
.featured-deals-hero h1{font-family:Arial,Helvetica,sans-serif;font-size:36px;line-height:1.1;margin:0 0 28px;font-weight:800;letter-spacing:.01em;}
.featured-deals-hero p{display:inline-block;background:#e6e6e6;margin:0;padding:8px 2px;font-size:21px;letter-spacing:.02em;}
.deals-toolbar{max-width:1280px;margin:0 auto 26px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:15px;}
.deals-toolbar select{width:280px;max-width:45vw;height:42px;border:1px solid #ddd;background:#fff;padding:0 12px;font-size:15px;}
.sr-only{position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);overflow:hidden;white-space:nowrap;}
.featured-deals-grid{max-width:1280px;margin:0 auto;padding:0 28px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:20px;row-gap:58px;}
.deal-card{text-align:center;min-width:0;}
.deal-card a{display:block;}
.deal-image-wrap{position:relative;background:#f6f6f6;aspect-ratio:305 / 408;overflow:hidden;margin-bottom:12px;}
.deal-image-wrap img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease;}
.deal-card:hover .deal-image-wrap img{transform:scale(1.025);}
.deal-sale{position:absolute;top:0;right:0;background:#111;color:#fff;font-size:11px;line-height:1;padding:7px 8px;z-index:2;}
.deal-card h2{font-size:15px;line-height:1.35;font-weight:400;margin:0 0 8px;color:#111;}
.deal-card p{font-size:12px;line-height:1.4;margin:0;color:#111;}
.deal-old{text-decoration:line-through;color:#222;margin-right:7px;}
.deal-current{color:#111;margin-right:7px;}
.deal-save{color:#d31111;}
@media(max-width:1000px){.featured-deals-grid{grid-template-columns:repeat(3,1fr)}.featured-deals-hero p{font-size:18px}.deals-toolbar select{max-width:55vw}}
@media(max-width:720px){.featured-deals-grid{grid-template-columns:repeat(2,1fr);gap:36px 14px;padding:0 16px}.deals-toolbar{padding:0 16px;flex-direction:column;align-items:flex-start}.deals-toolbar select{width:100%;max-width:100%}.featured-deals-hero{padding:38px 16px 26px}.featured-deals-hero h1{font-size:30px}.featured-deals-hero p{font-size:16px;line-height:1.45}}
@media(max-width:420px){.featured-deals-grid{grid-template-columns:1fr}.deal-image-wrap{max-width:310px;margin-left:auto;margin-right:auto}.deal-card h2{font-size:16px}}
/* Featured deal product detail pages */
.featured-detail-page .product-add-cart{width:100%;max-width:590px;clip-path:polygon(0 0,100% 0,96% 100%,0 100%);}
.featured-detail-page .product-price-row{align-items:center;flex-wrap:wrap;gap:10px 14px;margin-bottom:18px;}
.featured-detail-page .product-price-row .deal-old,.featured-detail-page .product-price-row .deal-current,.featured-detail-page .product-price-row .deal-save{font-size:18px;line-height:1.2;}
.featured-detail-page .product-price-row .deal-current{font-weight:700;}
.featured-detail-page .product-price-row small{display:block;flex-basis:100%;padding-bottom:0;margin-top:-2px;}
.featured-detail-page .note-banner{background:#bfd0df;color:#2b4051;padding:14px 16px;border-radius:4px;margin:0 0 22px;max-width:590px;box-shadow:0 3px 10px rgba(0,0,0,.08);font-size:15px;}
.featured-detail-page .main-product-image{background:#f6f6f6;}
.featured-detail-page .main-product-image img{object-fit:contain;padding:12px;}
.featured-detail-page .product-specs{padding-top:30px;}
/* July 1 Custom Order: Place an Order page */
.custom-order-page{background:#fff;color:#111;padding-bottom:90px;}
.order-hero{max-width:900px;margin:0 auto;text-align:center;padding:62px 24px 34px;}
.order-hero h1{font-size:34px;line-height:1.1;margin:0 0 24px;font-weight:800;}
.order-hero p{font-size:21px;line-height:1.35;margin:0 auto;max-width:760px;}
.order-intro-wrap{max-width:1080px;margin:24px auto 62px;padding:0 28px;display:grid;grid-template-columns:1fr 1.05fr;gap:82px;align-items:center;}
.order-download-card h2{font-size:19px;margin:0 0 8px;font-weight:800;}
.order-download-card a{display:block;text-decoration:underline;margin:12px 0 26px;font-size:15px;}
.order-download-card h3{font-size:18px;margin:30px 0 10px;font-weight:800;}
.order-download-card ul{padding-left:18px;margin:0;font-size:15px;line-height:1.45;max-width:460px;}
.order-visual-card{background:#f6f5f2;min-height:330px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.order-visual-card img{width:100%;height:100%;display:block;object-fit:cover;}
.order-form-section{max-width:720px;margin:0 auto 90px;padding:0 24px;}
.order-form-heading{text-align:center;margin-bottom:24px;}
.order-form-heading h2{font-size:22px;margin:0 0 6px;font-weight:800;}
.order-form-heading p{font-size:14px;margin:0;}
.custom-order-form{display:grid;gap:12px;}
.custom-order-form label span{display:block;font-size:14px;margin:0 0 7px;}
.custom-order-form input,.custom-order-form select,.custom-order-form textarea{width:100%;border:1px solid #d4d4d4;background:#fff;border-radius:6px;min-height:43px;padding:0 14px;font-size:14px;}
.custom-order-form textarea{padding-top:12px;resize:vertical;}
.custom-order-form fieldset{border:0;margin:0;padding:0 0 2px;display:flex;align-items:center;gap:70px;}
.custom-order-form fieldset legend{width:100%;font-size:14px;margin-bottom:10px;}
.custom-order-form fieldset label{display:flex;align-items:center;gap:8px;font-size:14px;}
.custom-order-form fieldset input{width:auto;min-height:auto;}
.file-drop{border:1px dashed #c9c9c9;border-radius:6px;min-height:88px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:12px;}
.file-drop input{display:none;}
.file-drop b{font-size:12px;background:#f0f0f0;border-radius:4px;padding:8px 10px;font-weight:400;}
.custom-order-form button{height:44px;background:#222;color:#fff;border:0;border-radius:6px;font-weight:700;}
.custom-order-form small{display:block;text-align:center;color:#777;font-size:12px;}
.order-help-section{max-width:1260px;margin:0 auto 90px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;gap:32px;}
.order-help-section h2{font-size:32px;margin:0 0 10px;font-weight:800;}
.order-help-section p{font-size:15px;margin:0;}
.order-guide-btn{background:#111;color:#fff;min-width:280px;height:44px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;letter-spacing:.22em;font-size:12px;clip-path:polygon(6% 0,100% 0,94% 100%,0 100%);}
.order-contact-options{max-width:1260px;margin:0 auto;padding:0 28px;display:grid;grid-template-columns:repeat(3,1fr);gap:60px;text-align:center;}
.order-contact-options span{display:block;font-size:46px;line-height:1;margin-bottom:18px;}
.order-contact-options strong{font-size:25px;}
@media(max-width:900px){.order-intro-wrap{grid-template-columns:1fr;gap:32px}.order-help-section{flex-direction:column;align-items:flex-start}.order-guide-btn{width:100%;max-width:360px}.order-contact-options{gap:28px}}
@media(max-width:620px){.order-hero h1{font-size:30px}.order-hero p{font-size:17px}.order-intro-wrap{padding:0 18px}.custom-order-form fieldset{gap:34px}.order-contact-options{grid-template-columns:1fr}.order-help-section{padding:0 18px}.order-guide-btn{max-width:100%}}
/* What is Custom Ordering page */
.custom-info-page{background:#fff;color:#111;padding-bottom:90px;}
.custom-info-page h1,.custom-info-page h2,.custom-info-page h3{font-family:Arial,Helvetica,sans-serif;color:#050505;letter-spacing:.005em;}
.custom-info-hero{max-width:1220px;margin:0 auto;padding:52px 28px 62px;display:grid;grid-template-columns:minmax(330px,1fr) minmax(440px,562px);gap:72px;align-items:center;}
.custom-info-copy h1{font-size:38px;line-height:.98;margin:0 0 16px;font-weight:800;}
.custom-info-copy p{font-size:16px;line-height:1.42;max-width:460px;margin:0 0 18px;}
.skew-btn{display:inline-flex;align-items:center;justify-content:center;background:#111;color:#fff;min-height:38px;padding:0 28px;font-size:13px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;clip-path:polygon(3% 0,100% 0,97% 100%,0% 100%);}
.custom-info-visual img{width:100%;height:562px;object-fit:cover;object-position:center top;display:block;background:#f2f2f2;}
.custom-training-row{max-width:1220px;margin:0 auto;padding:0 28px 56px;display:grid;grid-template-columns:562px minmax(330px,1fr);gap:92px;align-items:center;}
.custom-training-image img{width:100%;height:290px;object-fit:cover;display:block;background:#f1f1f1;}
.custom-training-copy h2{font-size:36px;line-height:1.05;margin:0 0 12px;font-weight:800;}
.custom-training-copy p{font-size:16px;line-height:1.45;max-width:470px;margin:0 0 16px;}
.custom-steps-section{max-width:1240px;margin:0 auto;text-align:center;padding:8px 28px 72px;}
.custom-steps-section>h2,.custom-options-section>h2,.custom-interest-section>h2{font-size:32px;line-height:1.1;margin:0 0 42px;font-weight:800;}
.custom-steps-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:28px 34px;align-items:start;}
.custom-steps-grid article:nth-child(1){grid-column:1 / span 3;}.custom-steps-grid article:nth-child(2){grid-column:4 / span 3;}.custom-steps-grid article:nth-child(3){grid-column:1 / span 2;}.custom-steps-grid article:nth-child(4){grid-column:3 / span 2;}.custom-steps-grid article:nth-child(5){grid-column:5 / span 2;}
.custom-step-icon{width:90px;height:90px;border-radius:50%;margin:0 auto 13px;background:#f0f0f2;display:flex;align-items:center;justify-content:center;font-size:40px;color:#3a3a3a;}
.custom-steps-grid h3{font-size:24px;line-height:1.1;margin:0 0 12px;font-weight:800;}
.custom-steps-grid p{font-size:15px;line-height:1.35;max-width:420px;margin:0 auto 12px;}
.custom-steps-grid a,.custom-options-grid a{display:inline-flex;align-items:center;justify-content:center;min-height:34px;border:1px solid #e4ded7;padding:0 24px;font-size:12px;font-weight:700;letter-spacing:.32em;color:#111;text-transform:uppercase;clip-path:polygon(3% 0,100% 0,97% 100%,0 100%);}
.custom-options-section{max-width:1240px;margin:0 auto;text-align:center;padding:30px 28px 74px;}
.custom-options-section>h2{margin-bottom:46px;}
.custom-options-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:84px;}
.custom-options-grid img{width:100%;height:344px;object-fit:cover;background:#f2f2f2;display:block;margin:0 0 14px;}
.custom-options-grid h3{font-size:24px;line-height:1.1;margin:0 0 12px;font-weight:800;}
.custom-options-grid p{font-size:15px;line-height:1.35;margin:0 auto 16px;max-width:380px;}
.custom-interest-section{max-width:640px;margin:0 auto;text-align:center;padding:4px 28px 70px;}
.custom-interest-section>h2{margin-bottom:10px;}.custom-interest-section>p{margin:0 0 50px;font-size:15px;}
.custom-interest-form{display:grid;gap:10px;text-align:left;}
.custom-interest-form input,.custom-interest-form select{width:100%;height:44px;border:1px solid #d9d4ce;border-radius:5px;background:#fff;padding:0 14px;font-size:14px;color:#111;box-sizing:border-box;}
.custom-phone-row{display:grid;grid-template-columns:96px 1fr;gap:8px;}
.custom-interest-form button{height:42px;border:0;border-radius:4px;background:#222;color:#fff;font-size:14px;font-weight:700;}
.custom-question-section{max-width:1240px;margin:0 auto;padding:28px 28px 0;}
.custom-question-head{display:grid;grid-template-columns:1fr auto;gap:44px;align-items:center;margin-bottom:118px;}
.custom-question-head h2{font-size:32px;line-height:1.1;margin:0 0 10px;font-weight:800;}.custom-question-head p{margin:0;font-size:15px;}
.custom-contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:80px;text-align:center;}
.custom-line-icon{font-size:48px;line-height:1;margin-bottom:16px;}
.custom-contact-grid h3{font-size:24px;margin:0 0 10px;font-weight:800;}.custom-contact-grid p{font-size:15px;line-height:1.42;margin:0 auto;max-width:360px;}
@media(max-width:980px){.custom-info-hero,.custom-training-row{grid-template-columns:1fr;gap:34px}.custom-info-visual img{height:420px}.custom-training-row{padding-bottom:46px}.custom-training-image img{height:260px}.custom-steps-grid{grid-template-columns:1fr 1fr}.custom-steps-grid article:nth-child(n){grid-column:auto}.custom-options-grid{grid-template-columns:1fr;gap:42px}.custom-options-grid img{height:360px}.custom-question-head{grid-template-columns:1fr;gap:18px;margin-bottom:60px}.custom-contact-grid{gap:34px}}
@media(max-width:620px){.custom-info-hero,.custom-training-row,.custom-steps-section,.custom-options-section,.custom-interest-section,.custom-question-section{padding-left:18px;padding-right:18px}.custom-info-copy h1{font-size:32px}.custom-training-copy h2,.custom-steps-section>h2,.custom-options-section>h2,.custom-interest-section>h2,.custom-question-head h2{font-size:28px}.custom-steps-grid,.custom-contact-grid{grid-template-columns:1fr}.custom-info-visual img,.custom-options-grid img{height:300px}.custom-phone-row{grid-template-columns:1fr}.skew-btn{width:100%;padding:0 18px;box-sizing:border-box}}
/* =========================================================
LHS Responsive Device Support Patch
Added for desktop / laptop / tablet / mobile compatibility
========================================================= */
/* Global safety */
*, *::before, *::after { box-sizing: border-box; }
html { max-width: 100%; overflow-x: hidden; }
body { max-width: 100%; overflow-x: hidden; }
img, video, svg { max-width: 100%; height: auto; }
table { max-width: 100%; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
/* Header / navigation responsive behavior */
@media (max-width: 1180px) {
.brand-strip,
.language-row {
display: none !important;
}
.main-header.mega-header {
height: 74px !important;
min-height: 74px !important;
padding: 0 18px !important;
display: grid !important;
grid-template-columns: 44px 1fr 44px !important;
align-items: center !important;
gap: 10px !important;
position: sticky !important;
top: 0 !important;
z-index: 9999 !important;
background: rgba(255,255,255,.96) !important;
backdrop-filter: blur(12px);
border-bottom: 1px solid #eee !important;
}
.main-header .logo {
grid-column: 2 !important;
justify-self: center !important;
position: static !important;
transform: none !important;
margin: 0 !important;
width: auto !important;
min-width: 0 !important;
}
.main-header .logo span {
font-size: 26px !important;
letter-spacing: .08em !important;
}
.main-header .logo small {
font-size: 8px !important;
letter-spacing: .28em !important;
}
.main-header .search-btn {
display: none !important;
}
.nav-left,
.nav-right,
.header-icons {
display: none !important;
}
.mobile-menu {
display: inline-flex !important;
grid-column: 3 !important;
justify-self: end !important;
align-items: center !important;
justify-content: center !important;
width: 42px !important;
height: 42px !important;
border: 0 !important;
background: transparent !important;
color: #111 !important;
font-size: 24px !important;
line-height: 1 !important;
cursor: pointer !important;
}
.mobile-nav {
position: fixed !important;
top: 74px !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
z-index: 9998 !important;
background: #fff !important;
overflow-y: auto !important;
padding: 22px 22px 46px !important;
display: none !important;
box-shadow: 0 22px 50px rgba(0,0,0,.12) !important;
}
.mobile-nav.open {
display: block !important;
}
.mobile-nav a {
display: block !important;
padding: 14px 4px !important;
border-bottom: 1px solid #eee !important;
color: #111 !important;
font-size: 16px !important;
text-decoration: none !important;
letter-spacing: .03em !important;
}
}
/* Tablet layout */
@media (min-width: 769px) and (max-width: 1180px) {
.hero,
.hero-slider,
.collection-section,
.system-section,
.partner-hero,
.service-partner-hero,
.product-detail-wrap,
.featured-deals-grid,
.content-grid,
.product-grid,
.cards-grid,
.service-grid,
.partner-grid {
max-width: 100% !important;
}
.product-detail-wrap {
grid-template-columns: 1fr !important;
padding: 34px 28px 56px !important;
gap: 30px !important;
}
.product-detail-gallery {
position: static !important;
grid-template-columns: 1fr !important;
}
.detail-thumbs {
flex-direction: row !important;
flex-wrap: wrap !important;
}
.featured-deals-grid,
.products-grid,
.collection-grid,
.system-grid,
.cards-grid,
.content-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 28px !important;
}
}
/* Phone layout */
@media (max-width: 768px) {
body {
font-size: 15px !important;
}
section,
.section,
.content-section,
.collection-section,
.system-section,
.featured-deals-page,
.product-detail-page {
max-width: 100% !important;
}
.container,
.page-container,
.content-wrap,
.content-grid,
.section-inner,
.home-section,
.system-wrap,
.partner-wrap,
.service-wrap,
.guide-shell,
.ring-shell {
width: min(100% - 28px, 100%) !important;
max-width: 100% !important;
margin-left: auto !important;
margin-right: auto !important;
}
h1 {
font-size: clamp(28px, 9vw, 42px) !important;
line-height: 1.08 !important;
}
h2 {
font-size: clamp(24px, 7vw, 34px) !important;
line-height: 1.12 !important;
}
p {
max-width: 100% !important;
}
/* Hero and slider */
.hero,
.hero-slider,
.main-hero,
.hero-stage,
.slider,
.slide {
min-height: auto !important;
height: auto !important;
}
.hero img,
.slide img,
.banner img,
.main-hero img {
width: 100% !important;
height: auto !important;
object-fit: cover !important;
}
/* Home cards / two-column banners */
.dual-cards,
.collection-cards,
.collection-grid,
.system-grid,
.products-grid,
.cards-grid,
.content-grid,
.service-grid,
.partner-grid,
.featured-deals-grid,
.recommend-grid {
grid-template-columns: 1fr !important;
gap: 24px !important;
}
.collection-card,
.system-card,
.product-card,
.content-card,
.deal-card,
.recommend-card {
width: 100% !important;
}
/* Product details */
.product-detail-wrap {
display: flex !important;
flex-direction: column !important;
padding: 28px 16px 44px !important;
gap: 26px !important;
}
.product-detail-info {
order: 1 !important;
}
.product-detail-gallery {
order: 2 !important;
position: static !important;
display: flex !important;
flex-direction: column !important;
gap: 12px !important;
width: 100% !important;
}
.main-product-image,
.main-product-image img,
.texture-gallery,
.texture-gallery img {
min-height: 280px !important;
max-height: none !important;
width: 100% !important;
}
.detail-thumbs {
display: flex !important;
flex-direction: row !important;
gap: 10px !important;
overflow-x: auto !important;
padding-bottom: 6px !important;
}
.detail-thumbs button {
flex: 0 0 68px !important;
width: 68px !important;
height: 68px !important;
}
.color-swatches {
gap: 8px !important;
}
.swatch {
width: 38px !important;
height: 38px !important;
}
.swatch-numbers {
display: none !important;
}
.length-buttons {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 10px !important;
}
.length-buttons button {
width: 100% !important;
min-width: 0 !important;
}
.length-hints {
display: none !important;
}
.product-add-cart,
.system-add-btn {
width: 100% !important;
max-width: 100% !important;
}
.product-specs,
.you-may-like {
padding-left: 16px !important;
padding-right: 16px !important;
}
.product-specs table,
.product-specs tbody,
.product-specs tr,
.product-specs th,
.product-specs td {
display: block !important;
width: 100% !important;
}
.product-specs th {
padding-bottom: 4px !important;
}
.product-specs td {
padding-top: 4px !important;
}
/* Featured deals */
.featured-deals-hero {
padding: 34px 16px 20px !important;
}
.featured-deals-hero p {
font-size: 15px !important;
line-height: 1.45 !important;
}
.deals-toolbar {
padding: 0 16px !important;
flex-direction: column !important;
align-items: stretch !important;
}
.deals-toolbar select {
width: 100% !important;
max-width: 100% !important;
}
.featured-deals-grid {
padding: 0 16px !important;
}
.deal-image-wrap {
aspect-ratio: 1 / 1.18 !important;
}
/* Custom order and guide pages */
.guide-links-grid,
.guide-order-card,
.custom-order-hero,
.custom-order-section,
.custom-order-grid,
.custom-page-grid,
.order-form-grid {
grid-template-columns: 1fr !important;
}
.guide-link-pill {
width: 100% !important;
min-width: 0 !important;
}
.guide-order-card {
padding: 28px 18px !important;
}
.guide-order-media img {
aspect-ratio: 16 / 10 !important;
}
input,
select,
textarea {
width: 100% !important;
max-width: 100% !important;
font-size: 16px !important;
}
/* Color ring screenshots */
.ring-shell {
width: 100% !important;
}
.ring-hero {
padding-left: 16px !important;
padding-right: 16px !important;
}
.ring-section h2 {
padding-left: 16px !important;
padding-right: 16px !important;
}
.raw-screenshot {
width: 100% !important;
height: auto !important;
display: block !important;
}
/* Footer */
.site-footer-final,
footer {
padding-left: 16px !important;
padding-right: 16px !important;
}
.footer-columns {
grid-template-columns: 1fr !important;
gap: 28px !important;
}
.footer-socials {
justify-content: center !important;
flex-wrap: wrap !important;
}
}
/* Very small phones */
@media (max-width: 420px) {
.main-header .logo span {
font-size: 22px !important;
}
.main-header .logo small {
font-size: 7px !important;
letter-spacing: .2em !important;
}
.product-detail-wrap {
padding-left: 12px !important;
padding-right: 12px !important;
}
.swatch {
width: 34px !important;
height: 34px !important;
}
.detail-thumbs button {
flex-basis: 60px !important;
width: 60px !important;
height: 60px !important;
}
.main-product-image,
.main-product-image img,
.texture-gallery,
.texture-gallery img {
min-height: 235px !important;
}
}
/* Pre-hosting readiness patch */
a, button { touch-action: manipulation; }
html { scroll-behavior: smooth; }
/* =========================================================
Header top strip spacing fix
Prevent brand links and free-shipping text from overlapping
========================================================= */
.brand-strip{
display:grid !important;
grid-template-columns:minmax(360px, 1.1fr) auto auto minmax(220px, .8fr) !important;
align-items:center !important;
gap:28px !important;
padding-left:72px !important;
padding-right:72px !important;
white-space:nowrap !important;
}
.brand-links{
display:flex !important;
align-items:center !important;
gap:42px !important;
min-width:0 !important;
}
.brand-strip strong{
justify-self:center !important;
margin:0 !important;
letter-spacing:.14em !important;
}
.brand-strip span{
justify-self:start !important;
margin:0 !important;
}
.brand-strip > a{
justify-self:end !important;
margin:0 !important;
}
@media (max-width: 1280px){
.brand-strip{
grid-template-columns:1fr auto auto !important;
gap:18px !important;
padding-left:36px !important;
padding-right:36px !important;
}
.brand-links{ gap:24px !important; }
.brand-strip > a{ display:none !important; }
}
@media (max-width: 1180px){
.brand-strip{ display:none !important; }
}
/* =========================================================
Explore mega menu cleanup
========================================================= */
.mega-panel-explore .mega-column a{
display:block;
margin:0 0 15px;
}
.mega-panel-explore .mega-heading-link{
margin:0 0 15px !important;
}
.mega-panel-explore .mega-heading-link a{
margin:0 !important;
}
/* Color card final cleanup: remove repeated slivers and reduce empty card height */
.color-card{
overflow:hidden;
min-height:auto !important;
}
.color-card img{
max-height:230px;
}
.men-card{
min-height:auto !important;
}
.women-card{
min-height:auto !important;
}
@media(max-width:700px){
.color-card img{max-height:200px;}
}
/* =========================================================
Mold Making Guide page
========================================================= */
.mold-guide-main{
background:#f7f5f2;
color:#111;
padding-bottom:86px;
}
.mold-shell{
width:min(980px, calc(100% - 36px));
margin:0 auto;
}
.mold-guide-hero{
padding:78px 0 48px;
text-align:center;
background:#fff;
border-bottom:1px solid rgba(0,0,0,.07);
}
.mold-kicker{
margin:0 0 16px;
font-size:.78rem;
font-weight:800;
text-transform:uppercase;
letter-spacing:.42em;
color:#7b6248;
}
.mold-guide-hero h1{
margin:0 0 28px;
font-size:clamp(2.25rem,4.8vw,4.1rem);
line-height:1.08;
letter-spacing:-.035em;
font-weight:800;
}
.mold-guide-hero p{
margin:0 auto 18px;
max-width:780px;
font-size:1.08rem;
line-height:1.75;
color:#332f2a;
}
.mold-content{
padding-top:56px;
}
.mold-section{
margin-bottom:56px;
}
.mold-section h2,
.mold-reminder h2{
margin:0 0 18px;
font-size:clamp(1.55rem,2.4vw,2.35rem);
line-height:1.15;
letter-spacing:-.02em;
font-weight:800;
}
.mold-section > p{
margin:0 0 30px;
max-width:820px;
font-size:1.02rem;
line-height:1.75;
color:#4f4942;
}
.mold-option-grid{
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
gap:22px;
}
.mold-option-grid.two-col{
grid-template-columns:repeat(2, minmax(0, 1fr));
}
.mold-option-card{
background:#fff;
border:1px solid #e6d8ca;
border-radius:24px;
padding:28px 26px;
box-shadow:0 18px 40px rgba(72,49,28,.055);
min-height:250px;
}
.mold-option-card.best{
border-color:#d8c2a8;
background:linear-gradient(180deg,#fffaf4 0%,#fff 100%);
}
.mold-badge{
display:inline-flex;
align-items:center;
justify-content:center;
margin-bottom:18px;
padding:7px 11px;
border-radius:999px;
background:#111;
color:#fff;
font-size:.68rem;
letter-spacing:.14em;
text-transform:uppercase;
font-weight:800;
}
.mold-badge.secondary{
background:#efe7dd;
color:#4b3420;
}
.mold-option-card h3{
margin:0 0 16px;
font-size:1rem;
letter-spacing:.34em;
text-transform:uppercase;
line-height:1.45;
font-weight:800;
}
.mold-option-card p{
margin:0;
color:#49433c;
line-height:1.75;
font-size:.98rem;
}
.mold-reminder{
display:grid;
grid-template-columns:1.1fr .9fr;
gap:34px;
align-items:center;
margin:60px 0 36px;
padding:34px;
border-radius:30px;
background:#111;
color:#fff;
}
.mold-reminder .mold-kicker{
color:#d9c5ad;
margin-bottom:12px;
}
.mold-reminder p{
margin:0;
color:rgba(255,255,255,.82);
line-height:1.75;
}
.mold-marker-list{
list-style:none;
margin:0;
padding:0;
display:grid;
grid-template-columns:1fr 1fr;
gap:12px;
}
.mold-marker-list li{
padding:15px 18px;
border-radius:16px;
background:rgba(255,255,255,.1);
border:1px solid rgba(255,255,255,.13);
font-weight:700;
letter-spacing:.08em;
}
.mold-actions{
display:flex;
gap:14px;
flex-wrap:wrap;
justify-content:center;
margin-top:36px;
}
.mold-button{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:190px;
padding:14px 24px;
border-radius:999px;
font-weight:800;
text-decoration:none;
letter-spacing:.02em;
}
.mold-button.dark{
background:#111;
color:#fff;
border:1px solid #111;
}
.mold-button.light{
background:#fff;
color:#111;
border:1px solid #d9cfc5;
}
@media(max-width:900px){
.mold-option-grid,
.mold-option-grid.two-col{
grid-template-columns:1fr;
}
.mold-option-card{
min-height:auto;
}
.mold-reminder{
grid-template-columns:1fr;
}
}
@media(max-width:600px){
.mold-guide-hero{
padding:52px 0 34px;
}
.mold-content{
padding-top:36px;
}
.mold-option-card,
.mold-reminder{
border-radius:22px;
padding:24px 20px;
}
.mold-marker-list{
grid-template-columns:1fr;
}
.mold-button{
width:100%;
}
}
/* Remove old black Open Reference block from density guide page */
.guide-detail-note,
.density-reference,
.open-reference,
.reference-cta{
display:none !important;
}
/* =========================================================
Hero slider professional typewriter text animation
========================================================= */
.consultation-slide .typewriter-hero-copy,
.lifestyle-slide .typewriter-hero-copy{
overflow: visible;
}
.consultation-slide .typewriter-script,
.lifestyle-slide .typewriter-script{
opacity: 0;
transform: translateY(8px);
animation: consultationScriptIn .65s ease .15s forwards;
}
.consultation-slide .typewriter-title,
.lifestyle-slide .typewriter-title{
display: inline-block;
margin-left: auto;
margin-right: auto;
max-width: 100%;
}
.consultation-slide .typewriter-title span,
.lifestyle-slide .typewriter-title span{
display: inline-block;
max-width: 100%;
width: 0;
overflow: hidden;
white-space: nowrap;
vertical-align: bottom;
border-right: 2px solid currentColor;
}
.consultation-slide .typewriter-title span{
animation:
consultationType 2.55s steps(22, end) .55s forwards,
consultationCaret .75s step-end .55s 5;
}
.lifestyle-slide .typewriter-title span{
animation:
lifestyleType 2.4s steps(19, end) .55s forwards,
consultationCaret .75s step-end .55s 5;
}
.consultation-slide .typewriter-offer,
.lifestyle-slide .typewriter-body,
.lifestyle-slide .typewriter-cta{
opacity: 0;
transform: translateY(12px);
}
.consultation-slide .typewriter-offer{
animation: consultationOfferIn .7s ease 3.15s forwards;
}
.lifestyle-slide .typewriter-body{
animation: consultationOfferIn .7s ease 3s forwards;
}
.lifestyle-slide .typewriter-cta{
animation: consultationOfferIn .7s ease 3.35s forwards;
}
.consultation-slide.restart-typewriter .typewriter-script,
.consultation-slide.restart-typewriter .typewriter-title span,
.consultation-slide.restart-typewriter .typewriter-offer,
.lifestyle-slide.restart-typewriter .typewriter-script,
.lifestyle-slide.restart-typewriter .typewriter-title span,
.lifestyle-slide.restart-typewriter .typewriter-body,
.lifestyle-slide.restart-typewriter .typewriter-cta{
animation: none !important;
}
@keyframes consultationScriptIn{
to{opacity:1;transform:translateY(0);}
}
@keyframes consultationType{
from{width:0;}
to{width:22ch;}
}
@keyframes lifestyleType{
from{width:0;}
to{width:19ch;}
}
@keyframes consultationCaret{
0%,100%{border-color:transparent;}
50%{border-color:currentColor;}
}
@keyframes consultationOfferIn{
to{opacity:1;transform:translateY(0);}
}
@media(max-width:700px){
.consultation-slide .typewriter-title span,
.lifestyle-slide .typewriter-title span{
white-space: normal;
width:auto;
border-right:0;
opacity:0;
animation: consultationMobileTitleIn .85s ease .45s forwards;
}
@keyframes consultationMobileTitleIn{
to{opacity:1;}
}
.consultation-slide .typewriter-offer{
animation-delay:1.35s;
}
.lifestyle-slide .typewriter-body{
animation-delay:1.15s;
}
.lifestyle-slide .typewriter-cta{
animation-delay:1.45s;
}
}
/* =========================================================
Typewriter full-sentence fix
JS types the text so the phrase never gets cut by width/ch limits
========================================================= */
.typewriter-slide .typewriter-title span{
width:auto !important;
max-width:none !important;
overflow:visible !important;
white-space:nowrap !important;
animation:none !important;
border-right:2px solid transparent;
}
.typewriter-slide .typewriter-title span.is-typewriting{
border-right-color:currentColor;
animation:consultationCaret .75s step-end infinite !important;
}
.typewriter-slide .typewriter-title span.typewriter-done{
border-right-color:transparent;
}
@media(max-width:700px){
.typewriter-slide .typewriter-title span{
white-space:normal !important;
opacity:1 !important;
}
}
/* =========================================================
Typewriter applied to all homepage slider text slides
========================================================= */
.typewriter-slide .typewriter-hero-copy{
overflow: visible;
}
.typewriter-slide .typewriter-script,
.typewriter-slide .typewriter-body,
.typewriter-slide .typewriter-cta,
.typewriter-slide .typewriter-line,
.typewriter-slide .typewriter-offer{
opacity:0;
transform:translateY(10px);
}
.typewriter-slide.active .typewriter-script{
animation: typewriterFadeUp .65s ease .12s forwards;
}
.typewriter-slide.active .typewriter-line{
animation: typewriterFadeUp .65s ease 2.9s forwards;
}
.typewriter-slide.active .typewriter-body{
animation: typewriterFadeUp .65s ease 3.1s forwards;
}
.typewriter-slide.active .typewriter-cta,
.typewriter-slide.active .typewriter-offer{
animation: typewriterFadeUp .65s ease 3.45s forwards;
}
.typewriter-slide.restart-typewriter .typewriter-script,
.typewriter-slide.restart-typewriter .typewriter-body,
.typewriter-slide.restart-typewriter .typewriter-cta,
.typewriter-slide.restart-typewriter .typewriter-line,
.typewriter-slide.restart-typewriter .typewriter-offer{
animation:none !important;
opacity:0 !important;
transform:translateY(10px) !important;
}
@keyframes typewriterFadeUp{
to{opacity:1;transform:translateY(0);}
}
@media(max-width:700px){
.typewriter-slide.active .typewriter-body{
animation-delay:1.25s;
}
.typewriter-slide.active .typewriter-cta,
.typewriter-slide.active .typewriter-offer{
animation-delay:1.55s;
}
.typewriter-slide.active .typewriter-line{
animation-delay:1.15s;
}
}
/* =========================================================
Final header cleanup: top strip spacing + clean account/cart icons
========================================================= */
.brand-strip{
display:grid !important;
grid-template-columns:minmax(520px, 1.25fr) auto auto minmax(260px, .9fr) !important;
align-items:center !important;
column-gap:40px !important;
min-height:38px !important;
padding:0 78px !important;
white-space:nowrap !important;
overflow:hidden !important;
}
.brand-strip .brand-links{
display:flex !important;
align-items:center !important;
gap:48px !important;
min-width:0 !important;
overflow:hidden !important;
}
.brand-strip .brand-links a{
flex:0 0 auto !important;
letter-spacing:.22em !important;
}
.brand-strip strong{
justify-self:end !important;
margin:0 !important;
letter-spacing:.16em !important;
}
.brand-strip span{
justify-self:start !important;
margin:0 !important;
}
.brand-strip > a:not(.brand-links a){
justify-self:end !important;
margin:0 !important;
}
.clean-icons{
display:flex !important;
align-items:center !important;
justify-content:flex-end !important;
gap:22px !important;
}
.header-icon-link{
width:28px !important;
height:28px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
color:#111 !important;
text-decoration:none !important;
border:0 !important;
background:transparent !important;
padding:0 !important;
}
.header-icon-link svg{
width:24px !important;
height:24px !important;
display:block !important;
fill:none !important;
stroke:currentColor !important;
stroke-width:1.55 !important;
stroke-linecap:round !important;
stroke-linejoin:round !important;
}
.header-icon-link:hover{
opacity:.68 !important;
}
@media(max-width:1440px){
.brand-strip{
grid-template-columns:minmax(430px, 1fr) auto auto minmax(230px, .7fr) !important;
column-gap:28px !important;
padding-left:48px !important;
padding-right:48px !important;
}
.brand-strip .brand-links{
gap:32px !important;
}
.brand-strip .brand-links a{
letter-spacing:.18em !important;
}
}
@media(max-width:1180px){
.brand-strip{
display:none !important;
}
.clean-icons{
display:none !important;
}
}
/* =========================================================
Stronger premium header effects + site opening animation
========================================================= */
/* Opening screen */
.site-opening-loader{
position:fixed;
inset:0;
z-index:999999;
background:#f5f2ed;
display:grid;
place-items:center;
pointer-events:none;
opacity:1;
visibility:visible;
transition:opacity .75s ease, visibility .75s ease;
}
.site-opening-loader.is-hidden{
opacity:0;
visibility:hidden;
}
.opening-mark{
display:flex;
flex-direction:column;
align-items:center;
gap:8px;
transform:translateY(12px);
opacity:0;
animation:openingMarkIn .8s cubic-bezier(.2,.8,.2,1) forwards;
}
.opening-logo{
font-family:Georgia, 'Times New Roman', serif;
font-size:clamp(42px,5vw,76px);
letter-spacing:.15em;
color:#111;
line-height:.9;
}
.opening-subtitle{
font-size:11px;
letter-spacing:.48em;
text-transform:uppercase;
color:#111;
opacity:.82;
}
.opening-line{
width:0;
height:2px;
background:#111;
margin-top:12px;
animation:openingLineGrow .9s cubic-bezier(.2,.8,.2,1) .25s forwards;
}
@keyframes openingMarkIn{
to{opacity:1;transform:translateY(0);}
}
@keyframes openingLineGrow{
to{width:160px;}
}
/* Header entrance */
.brand-strip,
.main-header{
animation:headerDropReveal .85s cubic-bezier(.2,.8,.2,1) both;
}
.main-header{
animation-delay:.22s;
}
@keyframes headerDropReveal{
from{
opacity:0;
transform:translateY(-18px);
filter:blur(5px);
}
to{
opacity:1;
transform:translateY(0);
filter:blur(0);
}
}
/* Strong nav text animation */
.main-header .mega-trigger,
.main-header .single-link,
.main-header .logo,
.brand-strip a,
.brand-strip strong,
.brand-strip span{
animation:navTextReveal .75s cubic-bezier(.2,.8,.2,1) both;
}
.main-header .nav-left .mega-item:nth-child(1) .mega-trigger{animation-delay:.38s;}
.main-header .nav-left .mega-item:nth-child(2) .mega-trigger{animation-delay:.44s;}
.main-header .nav-left .mega-item:nth-child(3) .mega-trigger{animation-delay:.50s;}
.main-header .nav-left .mega-item:nth-child(4) .mega-trigger{animation-delay:.56s;}
.main-header .logo{animation-delay:.62s;}
.main-header .nav-right .mega-item:nth-child(1) .mega-trigger{animation-delay:.68s;}
.main-header .nav-right .single-link:nth-child(2){animation-delay:.74s;}
.main-header .nav-right .mega-item:nth-child(3) .mega-trigger{animation-delay:.80s;}
.main-header .nav-right .single-link:nth-child(4){animation-delay:.86s;}
@keyframes navTextReveal{
from{
opacity:0;
transform:translateY(-8px);
letter-spacing:.02em;
}
to{
opacity:1;
transform:translateY(0);
}
}
/* Stronger hover underline + lift */
.main-header .mega-trigger,
.main-header .single-link,
.brand-strip a{
position:relative !important;
transition:color .25s ease, opacity .25s ease, transform .25s ease, letter-spacing .25s ease !important;
}
.main-header .mega-trigger::after,
.main-header .single-link::after,
.brand-strip a::after{
content:"" !important;
position:absolute !important;
left:50% !important;
bottom:-11px !important;
width:0 !important;
height:2px !important;
background:#111 !important;
transform:translateX(-50%) !important;
transition:width .34s cubic-bezier(.2,.8,.2,1), opacity .25s ease !important;
opacity:0 !important;
}
.main-header .mega-trigger:hover,
.main-header .single-link:hover,
.brand-strip a:hover{
transform:translateY(-2px) !important;
letter-spacing:.055em !important;
opacity:.78 !important;
}
.main-header .mega-trigger:hover::after,
.main-header .single-link:hover::after,
.brand-strip a:hover::after,
.mega-item:hover > .mega-trigger::after,
.mega-trigger.active-link::after{
width:100% !important;
opacity:1 !important;
}
/* Logo effect */
.main-header .logo{
transition:transform .32s cubic-bezier(.2,.8,.2,1), opacity .25s ease, filter .25s ease !important;
}
.main-header .logo:hover{
transform:translateY(-2px) scale(1.035) !important;
opacity:.9 !important;
filter:drop-shadow(0 8px 14px rgba(0,0,0,.10)) !important;
}
/* Keep cart, but make account/cart icons elegant */
.clean-icons{
display:flex !important;
align-items:center !important;
justify-content:flex-end !important;
gap:20px !important;
}
.header-icon-link{
width:30px !important;
height:30px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
color:#111 !important;
text-decoration:none !important;
border:0 !important;
background:transparent !important;
padding:0 !important;
transition:transform .25s ease, opacity .25s ease !important;
}
.header-icon-link svg{
width:23px !important;
height:23px !important;
display:block !important;
fill:none !important;
stroke:currentColor !important;
stroke-width:1.6 !important;
stroke-linecap:round !important;
stroke-linejoin:round !important;
}
.header-icon-link:hover{
transform:translateY(-2px) scale(1.08) !important;
opacity:.72 !important;
}
/* Page content reveal when site opens */
body:not(.opening-done) main{
opacity:0;
}
body.opening-done main{
animation:pageContentReveal .85s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes pageContentReveal{
from{
opacity:0;
transform:translateY(18px);
}
to{
opacity:1;
transform:translateY(0);
}
}
@media(max-width:1180px){
.brand-strip{
display:none !important;
}
.clean-icons{
display:none !important;
}
.site-opening-loader{
display:none;
}
body:not(.opening-done) main{
opacity:1;
}
.main-header .mega-trigger:hover,
.main-header .single-link:hover,
.brand-strip a:hover{
transform:none !important;
letter-spacing:inherit !important;
}
.main-header .mega-trigger::after,
.main-header .single-link::after,
.brand-strip a::after{
display:none !important;
}
}
/* =========================================================
Premium Header + Opening Animation V2
More cinematic opening and stronger luxury nav interactions
========================================================= */
/* Cinematic opening overlay */
.site-opening-loader{
background:
radial-gradient(circle at 50% 42%, rgba(255,255,255,.95) 0%, rgba(245,241,235,.94) 42%, rgba(224,214,201,.92) 100%) !important;
overflow:hidden !important;
}
.site-opening-loader::before,
.site-opening-loader::after{
content:"" !important;
position:absolute !important;
top:0 !important;
bottom:0 !important;
width:50.2% !important;
background:#111 !important;
z-index:1 !important;
transform:scaleX(1) !important;
animation:openingCurtainV2 1.1s cubic-bezier(.76,0,.24,1) .62s forwards !important;
}
.site-opening-loader::before{
left:0 !important;
transform-origin:left center !important;
}
.site-opening-loader::after{
right:0 !important;
transform-origin:right center !important;
}
.opening-mark{
position:relative !important;
z-index:2 !important;
color:#fff !important;
mix-blend-mode:difference !important;
animation:openingMarkV2 .7s cubic-bezier(.2,.8,.2,1) .06s both, openingMarkExitV2 .55s ease 1.25s forwards !important;
}
.opening-logo{
letter-spacing:.22em !important;
text-shadow:0 20px 45px rgba(0,0,0,.22) !important;
}
.opening-subtitle{
letter-spacing:.58em !important;
}
.opening-line{
background:currentColor !important;
height:1px !important;
animation:openingLineV2 .78s cubic-bezier(.2,.8,.2,1) .2s forwards !important;
}
@keyframes openingCurtainV2{
to{transform:scaleX(0);}
}
@keyframes openingMarkV2{
from{opacity:0;transform:translateY(18px) scale(.96);filter:blur(8px);}
to{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}
}
@keyframes openingMarkExitV2{
to{opacity:0;transform:translateY(-10px) scale(.985);filter:blur(4px);}
}
@keyframes openingLineV2{
from{width:0;opacity:0;}
to{width:190px;opacity:1;}
}
/* Header becomes more glassy and premium */
.main-header{
position:sticky !important;
top:0 !important;
z-index:9990 !important;
background:rgba(255,255,255,.92) !important;
backdrop-filter:blur(18px) saturate(1.12) !important;
-webkit-backdrop-filter:blur(18px) saturate(1.12) !important;
box-shadow:0 1px 0 rgba(0,0,0,.055), 0 18px 38px rgba(0,0,0,.035) !important;
}
.main-header::after{
content:"" !important;
position:absolute !important;
left:50% !important;
bottom:0 !important;
height:1px !important;
width:0 !important;
background:linear-gradient(90deg, transparent, rgba(17,17,17,.55), transparent) !important;
transform:translateX(-50%) !important;
animation:headerHairlineV2 1.15s cubic-bezier(.2,.8,.2,1) .7s forwards !important;
}
@keyframes headerHairlineV2{
to{width:100%;}
}
/* Nav text: stronger but still luxury */
.main-header .mega-trigger,
.main-header .single-link{
font-weight:500 !important;
letter-spacing:.015em !important;
text-shadow:0 0 0 transparent !important;
}
.main-header .mega-trigger::before,
.main-header .single-link::before{
content:"" !important;
position:absolute !important;
left:-8px !important;
right:-8px !important;
top:50% !important;
height:28px !important;
border-radius:999px !important;
background:rgba(17,17,17,.045) !important;
transform:translateY(-50%) scaleX(.72) !important;
opacity:0 !important;
transition:opacity .28s ease, transform .34s cubic-bezier(.2,.8,.2,1) !important;
z-index:-1 !important;
}
.main-header .mega-trigger:hover::before,
.main-header .single-link:hover::before{
opacity:1 !important;
transform:translateY(-50%) scaleX(1) !important;
}
.main-header .mega-trigger::after,
.main-header .single-link::after{
height:2px !important;
bottom:-14px !important;
background:linear-gradient(90deg, transparent, #111, transparent) !important;
}
.main-header .mega-trigger:hover,
.main-header .single-link:hover{
transform:translateY(-3px) !important;
letter-spacing:.065em !important;
opacity:.9 !important;
}
/* Logo: elegant pulse when page opens + refined hover */
.main-header .logo span,
.main-header .logo small{
display:block !important;
}
.main-header .logo{
animation:logoEntranceV2 .95s cubic-bezier(.2,.8,.2,1) .55s both !important;
}
@keyframes logoEntranceV2{
from{opacity:0;transform:translateY(-12px) scale(.92);filter:blur(7px);}
to{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}
}
.main-header .logo:hover span{
letter-spacing:.14em !important;
transition:letter-spacing .35s ease !important;
}
.main-header .logo:hover small{
letter-spacing:.42em !important;
transition:letter-spacing .35s ease !important;
}
/* Account/cart icons: premium hover and opening reveal */
.header-icon-link{
opacity:0;
animation:iconPopInV2 .55s cubic-bezier(.2,.8,.2,1) .95s forwards !important;
}
.header-icon-link:nth-child(2){
animation-delay:1.02s !important;
}
.header-icon-link::before{
content:"" !important;
position:absolute !important;
width:34px !important;
height:34px !important;
border-radius:999px !important;
background:rgba(17,17,17,.06) !important;
transform:scale(.45) !important;
opacity:0 !important;
transition:opacity .28s ease, transform .28s ease !important;
}
.header-icon-link:hover::before{
opacity:1 !important;
transform:scale(1) !important;
}
.header-icon-link svg{
position:relative !important;
z-index:1 !important;
}
@keyframes iconPopInV2{
from{opacity:0;transform:translateY(-8px) scale(.85);}
to{opacity:1;transform:translateY(0) scale(1);}
}
/* Page open: hero/content rises after header */
body.opening-done main{
animation:premiumPageRevealV2 .95s cubic-bezier(.2,.8,.2,1) both !important;
}
@keyframes premiumPageRevealV2{
from{opacity:0;transform:translateY(22px);filter:blur(5px);}
to{opacity:1;transform:translateY(0);filter:blur(0);}
}
/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce){
.site-opening-loader{display:none !important;}
.main-header,
.main-header *,
body.opening-done main{
animation:none !important;
transition:none !important;
filter:none !important;
transform:none !important;
}
body:not(.opening-done) main{opacity:1 !important;}
}
/* Mobile keeps it smooth, not heavy */
@media(max-width:1180px){
.main-header{
backdrop-filter:blur(12px) !important;
-webkit-backdrop-filter:blur(12px) !important;
}
.site-opening-loader{
display:none !important;
}
}
/* =========================================================
Brand-writing loading animation
Keeps the loading screen, but writes the brand letter by letter
========================================================= */
.brand-writing-loader{
background:
radial-gradient(circle at 50% 45%, rgba(255,255,255,.98) 0%, rgba(245,241,235,.96) 45%, rgba(224,214,201,.94) 100%) !important;
}
.brand-writing-loader::before,
.brand-writing-loader::after{
animation-delay:1.45s !important;
}
.brand-writing-mark{
mix-blend-mode:normal !important;
color:#111 !important;
animation:brandWritingMarkHold .25s ease both, openingMarkExitV2 .55s ease 2.18s forwards !important;
}
.brand-writing-logo{
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:.18em !important;
min-height:1em !important;
letter-spacing:0 !important;
color:#111 !important;
}
.brand-writing-logo span{
display:inline-block !important;
opacity:0 !important;
transform:translateY(16px) rotateX(45deg) scale(.86) !important;
filter:blur(5px) !important;
animation:brandLetterWrite .48s cubic-bezier(.2,.8,.2,1) calc(.18s + (var(--i) * .18s)) forwards !important;
}
.brand-writing-subtitle{
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:.18em !important;
letter-spacing:0 !important;
min-height:1.4em !important;
margin-top:6px !important;
color:#111 !important;
opacity:1 !important;
}
.brand-writing-subtitle span:not(.space){
display:inline-block !important;
opacity:0 !important;
transform:translateY(8px) !important;
filter:blur(3px) !important;
animation:brandSubtitleWrite .28s ease calc(.86s + (var(--i) * .045s)) forwards !important;
}
.brand-writing-subtitle .space{
display:inline-block !important;
width:1.2em !important;
}
.brand-writing-line{
background:#111 !important;
width:0 !important;
animation:brandLineWrite .7s cubic-bezier(.2,.8,.2,1) 1.75s forwards !important;
}
@keyframes brandWritingMarkHold{
from{opacity:1;transform:translateY(0);}
to{opacity:1;transform:translateY(0);}
}
@keyframes brandLetterWrite{
to{
opacity:1;
transform:translateY(0) rotateX(0) scale(1);
filter:blur(0);
}
}
@keyframes brandSubtitleWrite{
to{
opacity:1;
transform:translateY(0);
filter:blur(0);
}
}
@keyframes brandLineWrite{
to{width:210px;opacity:1;}
}
/* Slightly longer opening timing so the writing can breathe */
.site-opening-loader.is-hidden{
transition:opacity .8s ease, visibility .8s ease !important;
}
/* =========================================================
Loader white fix + nav links slide from left on opening
========================================================= */
/* Remove the black curtain effect completely */
.site-opening-loader,
.brand-writing-loader{
background:#f5f2ed !important;
background-image:
radial-gradient(circle at 50% 42%, rgba(255,255,255,.98) 0%, rgba(245,242,237,.96) 52%, rgba(234,226,216,.95) 100%) !important;
}
.site-opening-loader::before,
.site-opening-loader::after,
.brand-writing-loader::before,
.brand-writing-loader::after{
display:none !important;
content:none !important;
}
.brand-writing-mark{
color:#111 !important;
mix-blend-mode:normal !important;
animation:brandWritingMarkHold .25s ease both, openingMarkExitWhite .45s ease 1.75s forwards !important;
}
.opening-logo,
.opening-subtitle,
.brand-writing-logo,
.brand-writing-subtitle{
color:#111 !important;
text-shadow:none !important;
}
@keyframes openingMarkExitWhite{
to{
opacity:0;
transform:translateY(-8px) scale(.985);
filter:blur(3px);
}
}
/* Header itself appears cleanly */
.brand-strip,
.main-header{
animation:none !important;
}
/* Hide header nav items until opening is done */
body:not(.opening-done) .main-header .mega-trigger,
body:not(.opening-done) .main-header .single-link,
body:not(.opening-done) .main-header .logo,
body:not(.opening-done) .header-icon-link{
opacity:0 !important;
}
/* Nav links come from left and settle into position */
body.opening-done .main-header .mega-trigger,
body.opening-done .main-header .single-link{
opacity:0;
transform:translateX(-120px);
animation:navSlideFromLeftSettle .72s cubic-bezier(.18,.85,.25,1) forwards !important;
}
body.opening-done .main-header .nav-left .mega-item:nth-child(1) .mega-trigger{animation-delay:.10s !important;}
body.opening-done .main-header .nav-left .mega-item:nth-child(2) .mega-trigger{animation-delay:.17s !important;}
body.opening-done .main-header .nav-left .mega-item:nth-child(3) .mega-trigger{animation-delay:.24s !important;}
body.opening-done .main-header .nav-left .mega-item:nth-child(4) .mega-trigger{animation-delay:.31s !important;}
body.opening-done .main-header .nav-right .mega-item:nth-child(1) .mega-trigger{animation-delay:.52s !important;}
body.opening-done .main-header .nav-right .single-link:nth-child(2){animation-delay:.59s !important;}
body.opening-done .main-header .nav-right .mega-item:nth-child(3) .mega-trigger{animation-delay:.66s !important;}
body.opening-done .main-header .nav-right .single-link:nth-child(4){animation-delay:.73s !important;}
/* Logo settles after the left group starts */
body.opening-done .main-header .logo{
opacity:0;
transform:translateY(-14px) scale(.96);
animation:logoSettleCenter .72s cubic-bezier(.18,.85,.25,1) .38s forwards !important;
}
/* Icons settle from right lightly */
body.opening-done .header-icon-link{
opacity:0;
transform:translateX(38px);
animation:iconsSettleRight .58s cubic-bezier(.18,.85,.25,1) .82s forwards !important;
}
body.opening-done .header-icon-link:nth-child(2){
animation-delay:.90s !important;
}
@keyframes navSlideFromLeftSettle{
0%{
opacity:0;
transform:translateX(-120px);
filter:blur(5px);
}
72%{
opacity:1;
transform:translateX(5px);
filter:blur(0);
}
100%{
opacity:1;
transform:translateX(0);
filter:blur(0);
}
}
@keyframes logoSettleCenter{
0%{
opacity:0;
transform:translateY(-14px) scale(.96);
filter:blur(5px);
}
100%{
opacity:1;
transform:translateY(0) scale(1);
filter:blur(0);
}
}
@keyframes iconsSettleRight{
0%{
opacity:0;
transform:translateX(38px);
filter:blur(4px);
}
100%{
opacity:1;
transform:translateX(0);
filter:blur(0);
}
}
/* Keep hover effects after animation */
body.opening-done .main-header .mega-trigger:hover,
body.opening-done .main-header .single-link:hover{
transform:translateY(-3px) !important;
}
/* Faster, cleaner loading finish */
.site-opening-loader.is-hidden{
opacity:0 !important;
visibility:hidden !important;
transition:opacity .55s ease, visibility .55s ease !important;
}
@media(max-width:1180px){
body:not(.opening-done) .main-header .logo,
body:not(.opening-done) .mobile-menu{
opacity:1 !important;
}
body.opening-done .main-header .mega-trigger,
body.opening-done .main-header .single-link,
body.opening-done .main-header .logo,
body.opening-done .header-icon-link{
animation:none !important;
opacity:1 !important;
transform:none !important;
filter:none !important;
}
}
/* =========================================================
Visible loader + slower header entrance
Fixes blank loading screen and makes logo drop slower
========================================================= */
/* Loading should never look like an empty blank page */
.site-opening-loader,
.brand-writing-loader{
background:
radial-gradient(circle at 50% 42%, #ffffff 0%, #f6f1ea 46%, #e7ded3 100%) !important;
display:grid !important;
place-items:center !important;
}
.brand-writing-mark{
opacity:1 !important;
visibility:visible !important;
color:#111 !important;
mix-blend-mode:normal !important;
transform:none !important;
filter:none !important;
animation:loaderMarkExitVisible .55s ease 2.25s forwards !important;
}
.brand-writing-logo{
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:.2em !important;
min-height:1em !important;
font-family:Georgia, 'Times New Roman', serif !important;
font-size:clamp(52px, 6vw, 88px) !important;
line-height:.9 !important;
color:#111 !important;
}
.brand-writing-logo span{
opacity:.18 !important;
transform:translateY(18px) scale(.92) !important;
filter:blur(4px) !important;
animation:brandLetterVisibleWrite .62s cubic-bezier(.18,.85,.25,1) calc(.08s + (var(--i) * .22s)) forwards !important;
}
.brand-writing-subtitle{
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:.15em !important;
min-height:1.4em !important;
margin-top:10px !important;
color:#111 !important;
opacity:1 !important;
font-size:11px !important;
text-transform:uppercase !important;
}
.brand-writing-subtitle span:not(.space){
opacity:.12 !important;
transform:translateY(8px) !important;
filter:blur(3px) !important;
animation:brandSubtitleVisibleWrite .32s ease calc(.82s + (var(--i) * .055s)) forwards !important;
}
.brand-writing-subtitle .space{
display:inline-block !important;
width:1.15em !important;
}
.brand-writing-line{
display:block !important;
height:1px !important;
background:#111 !important;
width:0 !important;
margin-top:16px !important;
opacity:1 !important;
animation:brandLineVisibleWrite .75s cubic-bezier(.18,.85,.25,1) 1.85s forwards !important;
}
.site-opening-loader::before,
.site-opening-loader::after,
.brand-writing-loader::before,
.brand-writing-loader::after{
display:none !important;
}
@keyframes brandLetterVisibleWrite{
0%{opacity:.18;transform:translateY(18px) scale(.92);filter:blur(4px);}
100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}
}
@keyframes brandSubtitleVisibleWrite{
0%{opacity:.12;transform:translateY(8px);filter:blur(3px);}
100%{opacity:.86;transform:translateY(0);filter:blur(0);}
}
@keyframes brandLineVisibleWrite{
0%{width:0;opacity:0;}
100%{width:220px;opacity:1;}
}
@keyframes loaderMarkExitVisible{
to{opacity:0;transform:translateY(-10px) scale(.985);filter:blur(3px);}
}
/* Slower nav entrance from the left */
body.opening-done .main-header .mega-trigger,
body.opening-done .main-header .single-link{
opacity:0;
transform:translateX(-155px);
animation:navSlideFromLeftSlower 1.15s cubic-bezier(.16,.9,.2,1) forwards !important;
}
body.opening-done .main-header .nav-left .mega-item:nth-child(1) .mega-trigger{animation-delay:.18s !important;}
body.opening-done .main-header .nav-left .mega-item:nth-child(2) .mega-trigger{animation-delay:.30s !important;}
body.opening-done .main-header .nav-left .mega-item:nth-child(3) .mega-trigger{animation-delay:.42s !important;}
body.opening-done .main-header .nav-left .mega-item:nth-child(4) .mega-trigger{animation-delay:.54s !important;}
body.opening-done .main-header .nav-right .mega-item:nth-child(1) .mega-trigger{animation-delay:.88s !important;}
body.opening-done .main-header .nav-right .single-link:nth-child(2){animation-delay:1.00s !important;}
body.opening-done .main-header .nav-right .mega-item:nth-child(3) .mega-trigger{animation-delay:1.12s !important;}
body.opening-done .main-header .nav-right .single-link:nth-child(4){animation-delay:1.24s !important;}
@keyframes navSlideFromLeftSlower{
0%{
opacity:0;
transform:translateX(-155px);
filter:blur(7px);
}
68%{
opacity:1;
transform:translateX(8px);
filter:blur(0);
}
100%{
opacity:1;
transform:translateX(0);
filter:blur(0);
}
}
/* Logo comes from top to bottom slower */
body.opening-done .main-header .logo{
opacity:0;
transform:translateY(-70px) scale(.94);
animation:logoDropSlow 1.35s cubic-bezier(.16,.9,.2,1) .58s forwards !important;
}
@keyframes logoDropSlow{
0%{
opacity:0;
transform:translateY(-70px) scale(.94);
filter:blur(8px);
}
72%{
opacity:1;
transform:translateY(6px) scale(1.01);
filter:blur(0);
}
100%{
opacity:1;
transform:translateY(0) scale(1);
filter:blur(0);
}
}
/* Icons remain slower and elegant */
body.opening-done .header-icon-link{
opacity:0;
transform:translateX(56px);
animation:iconsSettleRightSlow .85s cubic-bezier(.16,.9,.2,1) 1.35s forwards !important;
}
body.opening-done .header-icon-link:nth-child(2){
animation-delay:1.48s !important;
}
@keyframes iconsSettleRightSlow{
0%{opacity:0;transform:translateX(56px);filter:blur(5px);}
100%{opacity:1;transform:translateX(0);filter:blur(0);}
}
/* Keep hover behavior after the intro */
body.opening-done .main-header .mega-trigger:hover,
body.opening-done .main-header .single-link:hover{
transform:translateY(-3px) !important;
}
/* =========================================================
REAL visible typing loader fix
No blur, no hidden static logo: actual letters appear one by one
========================================================= */
.site-opening-loader.real-typing-loader{
position:fixed !important;
inset:0 !important;
z-index:999999 !important;
display:grid !important;
place-items:center !important;
background:#f6f1ea !important;
background-image:radial-gradient(circle at 50% 42%, #ffffff 0%, #f6f1ea 55%, #e8ded3 100%) !important;
opacity:1 !important;
visibility:visible !important;
pointer-events:none !important;
transition:opacity .55s ease, visibility .55s ease !important;
}
.site-opening-loader.real-typing-loader::before,
.site-opening-loader.real-typing-loader::after{
display:none !important;
content:none !important;
}
.site-opening-loader.real-typing-loader.is-hidden{
opacity:0 !important;
visibility:hidden !important;
}
.real-loader-inner{
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
min-height:180px !important;
color:#111 !important;
opacity:1 !important;
transform:none !important;
filter:none !important;
animation:none !important;
}
.real-loader-brand{
min-height:82px !important;
font-family:Georgia, "Times New Roman", serif !important;
font-size:clamp(58px, 7vw, 104px) !important;
line-height:1 !important;
letter-spacing:.22em !important;
color:#111 !important;
opacity:1 !important;
transform:none !important;
filter:none !important;
text-align:center !important;
white-space:nowrap !important;
}
.real-loader-subtitle{
min-height:18px !important;
margin-top:8px !important;
font-size:12px !important;
line-height:1 !important;
letter-spacing:.44em !important;
text-transform:uppercase !important;
color:#111 !important;
opacity:.78 !important;
transform:none !important;
filter:none !important;
text-align:center !important;
white-space:nowrap !important;
}
.real-loader-brand::after,
.real-loader-subtitle::after{
content:"" !important;
display:inline-block !important;
width:1px !important;
height:.86em !important;
margin-left:.10em !important;
background:currentColor !important;
vertical-align:-.05em !important;
animation:realLoaderCaret .68s step-end infinite !important;
}
.real-loader-subtitle.is-done::after,
.real-loader-brand.is-done::after{
opacity:0 !important;
}
.real-loader-line{
width:0 !important;
height:1px !important;
background:#111 !important;
margin-top:22px !important;
opacity:0 !important;
transition:width .65s cubic-bezier(.18,.85,.25,1), opacity .35s ease !important;
}
.real-loader-line.is-active{
width:230px !important;
opacity:1 !important;
}
@keyframes realLoaderCaret{
0%,100%{opacity:0;}
50%{opacity:1;}
}
/* Disable old opening blur on previous loader classes */
.opening-mark,
.brand-writing-mark,
.brand-writing-logo,
.brand-writing-subtitle,
.opening-logo,
.opening-subtitle{
filter:none !important;
}
/* Header starts after loader: slower and clear */
body:not(.opening-done) .main-header .mega-trigger,
body:not(.opening-done) .main-header .single-link,
body:not(.opening-done) .main-header .logo,
body:not(.opening-done) .header-icon-link{
opacity:0 !important;
}
body.opening-done .main-header .mega-trigger,
body.opening-done .main-header .single-link{
opacity:0;
transform:translateX(-150px);
animation:realNavLeftSettle 1.18s cubic-bezier(.16,.9,.2,1) forwards !important;
}
body.opening-done .main-header .nav-left .mega-item:nth-child(1) .mega-trigger{animation-delay:.15s !important;}
body.opening-done .main-header .nav-left .mega-item:nth-child(2) .mega-trigger{animation-delay:.28s !important;}
body.opening-done .main-header .nav-left .mega-item:nth-child(3) .mega-trigger{animation-delay:.41s !important;}
body.opening-done .main-header .nav-left .mega-item:nth-child(4) .mega-trigger{animation-delay:.54s !important;}
body.opening-done .main-header .nav-right .mega-item:nth-child(1) .mega-trigger{animation-delay:.88s !important;}
body.opening-done .main-header .nav-right .single-link:nth-child(2){animation-delay:1.01s !important;}
body.opening-done .main-header .nav-right .mega-item:nth-child(3) .mega-trigger{animation-delay:1.14s !important;}
body.opening-done .main-header .nav-right .single-link:nth-child(4){animation-delay:1.27s !important;}
body.opening-done .main-header .logo{
opacity:0;
transform:translateY(-78px) scale(.94);
animation:realLogoDrop 1.38s cubic-bezier(.16,.9,.2,1) .58s forwards !important;
}
body.opening-done .header-icon-link{
opacity:0;
transform:translateX(54px);
animation:realIconsRightSettle .86s cubic-bezier(.16,.9,.2,1) 1.35s forwards !important;
}
body.opening-done .header-icon-link:nth-child(2){
animation-delay:1.48s !important;
}
@keyframes realNavLeftSettle{
0%{opacity:0;transform:translateX(-150px);filter:blur(7px);}
70%{opacity:1;transform:translateX(8px);filter:blur(0);}
100%{opacity:1;transform:translateX(0);filter:blur(0);}
}
@keyframes realLogoDrop{
0%{opacity:0;transform:translateY(-78px) scale(.94);filter:blur(8px);}
72%{opacity:1;transform:translateY(6px) scale(1.01);filter:blur(0);}
100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}
}
@keyframes realIconsRightSettle{
0%{opacity:0;transform:translateX(54px);filter:blur(5px);}
100%{opacity:1;transform:translateX(0);filter:blur(0);}
}
@media(max-width:1180px){
.site-opening-loader.real-typing-loader{
display:none !important;
}
body:not(.opening-done) .main-header .logo,
body:not(.opening-done) .mobile-menu{
opacity:1 !important;
}
}
/* =========================================================
System pages hero full-width fix
Removes boxed white side gaps on Men/Women/product category pages
========================================================= */
.system-page main{
overflow:hidden;
}
.system-hero{
width:100vw !important;
max-width:none !important;
margin-left:50% !important;
transform:translateX(-50%) !important;
height:450px !important;
border-radius:0 !important;
}
.system-hero img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:center center !important;
transform:scale(1.005) !important;
}
.system-hero-copy{
left:max(7vw, 120px) !important;
}
@media(max-width:900px){
.system-hero{
height:390px !important;
}
.system-hero-copy{
left:24px !important;
max-width:350px !important;
}
.system-hero-copy h1{
font-size:42px !important;
}
}
@media(max-width:560px){
.system-hero{
height:350px !important;
}
.system-hero-copy h1{
font-size:34px !important;
}
.system-hero-copy span{
font-size:14px !important;
}
}
/* Men/Women hero text readability improvement over branded image */
.system-hero::after{
background:linear-gradient(90deg,
rgba(247,244,239,.96) 0%,
rgba(247,244,239,.92) 24%,
rgba(247,244,239,.72) 42%,
rgba(247,244,239,.30) 62%,
rgba(247,244,239,0) 82%) !important;
}
.system-hero-copy{
max-width:370px !important;
}
.system-hero-copy h1,
.system-hero-copy span,
.system-hero-copy p{
position:relative;
z-index:2;
}
/* Sticky global header on all pages + floating scroll state */
:root{
--brand-strip-height:40px;
--language-row-height:38px;
--main-header-height:78px;
--site-header-total:156px;
}
.brand-strip,
.language-row,
.main-header{
position:sticky !important;
transition:background .35s ease, box-shadow .35s ease, height .35s ease, transform .35s ease, border-color .35s ease, backdrop-filter .35s ease;
}
.brand-strip{
top:0 !important;
z-index:90 !important;
}
.language-row{
top:var(--brand-strip-height) !important;
z-index:89 !important;
background:rgba(255,255,255,.96) !important;
backdrop-filter:saturate(140%) blur(8px);
}
.main-header{
top:calc(var(--brand-strip-height) + var(--language-row-height)) !important;
z-index:88 !important;
background:rgba(255,255,255,.96) !important;
backdrop-filter:saturate(145%) blur(10px);
}
.mobile-nav{
top:var(--site-header-total) !important;
z-index:87 !important;
}
body.header-scrolled .language-row,
body.header-scrolled .main-header{
box-shadow:0 10px 28px rgba(17,17,17,.08);
}
body.header-scrolled .main-header{
height:72px !important;
border-bottom-color:rgba(0,0,0,.06) !important;
}
body.header-scrolled .main-header .logo{
transform:translateY(1px) scale(.965);
}
body.header-scrolled .main-header .mega-trigger,
body.header-scrolled .main-header .single-link,
body.header-scrolled .main-header .header-icon-link,
body.header-scrolled .main-header .search-btn{
transform:translateY(-1px);
}
body.header-scrolled .main-header::after{
opacity:1;
}
@media (max-width:1160px){
.brand-strip .brand-links{display:none !important;}
.main-header{
top:calc(var(--brand-strip-height) + var(--language-row-height)) !important;
}
}
@media (max-width:650px){
.brand-strip{position:relative !important; top:auto !important;}
.language-row{top:0 !important;}
.main-header{top:var(--language-row-height) !important;}
.mobile-nav{top:calc(var(--language-row-height) + var(--main-header-height)) !important;}
}
/* =========================================================
Fixed header final behavior: shrink + hide on scroll down + show on scroll up
========================================================= */
:root{
--brand-strip-height:40px;
--language-row-height:38px;
--main-header-height:92px;
--site-header-total:170px;
--header-shift:0px;
}
/* Add safe space so fixed header does not cover page content */
body{
padding-top:var(--site-header-total) !important;
}
/* Header rows are truly fixed now, not only sticky */
.brand-strip,
.language-row,
.main-header{
position:fixed !important;
left:0 !important;
right:0 !important;
width:100% !important;
transform:translateY(var(--header-shift)) !important;
transition:
transform .48s cubic-bezier(.2,.8,.2,1),
height .34s ease,
background .34s ease,
box-shadow .34s ease,
opacity .28s ease !important;
will-change:transform !important;
}
.brand-strip{
top:0 !important;
z-index:10030 !important;
}
.language-row{
top:var(--brand-strip-height) !important;
z-index:10020 !important;
background:rgba(255,255,255,.96) !important;
backdrop-filter:blur(12px) saturate(145%) !important;
-webkit-backdrop-filter:blur(12px) saturate(145%) !important;
}
.main-header{
top:calc(var(--brand-strip-height) + var(--language-row-height)) !important;
z-index:10010 !important;
background:rgba(255,255,255,.97) !important;
backdrop-filter:blur(16px) saturate(150%) !important;
-webkit-backdrop-filter:blur(16px) saturate(150%) !important;
}
/* When not at the top, make it floating and smaller */
body.header-scrolled .main-header{
height:68px !important;
box-shadow:0 12px 34px rgba(0,0,0,.10) !important;
border-bottom-color:rgba(0,0,0,.06) !important;
}
body.header-scrolled .language-row{
height:28px !important;
box-shadow:0 4px 16px rgba(0,0,0,.04) !important;
}
body.header-scrolled .brand-strip{
height:34px !important;
}
body.header-scrolled .main-header .logo span{
font-size:29px !important;
}
body.header-scrolled .main-header .logo small{
font-size:9px !important;
margin-top:4px !important;
}
body.header-scrolled .main-header .mega-trigger,
body.header-scrolled .main-header .single-link{
font-size:14px !important;
}
/* Hide header upward while scrolling down */
body.header-hidden{
--header-shift:calc(-1 * var(--site-header-total));
}
/* Show again when scrolling upward */
body.header-visible{
--header-shift:0px;
}
/* Menu panels must stay under the fixed header */
.mega-panel{
z-index:10000 !important;
}
/* Mobile: keep header fixed but do not overcomplicate animation */
@media(max-width:1160px){
body{
padding-top:calc(var(--language-row-height) + var(--main-header-height)) !important;
}
.brand-strip{
display:none !important;
}
.language-row{
top:0 !important;
}
.main-header{
top:var(--language-row-height) !important;
}
.mobile-nav{
position:fixed !important;
top:calc(var(--language-row-height) + var(--main-header-height)) !important;
left:0 !important;
right:0 !important;
z-index:10000 !important;
}
body.header-hidden{
--header-shift:calc(-1 * (var(--language-row-height) + var(--main-header-height)));
}
}
@media(max-width:650px){
body{
padding-top:calc(var(--language-row-height) + var(--main-header-height)) !important;
}
.language-row{
position:fixed !important;
top:0 !important;
}
.main-header{
position:fixed !important;
top:var(--language-row-height) !important;
}
}
/* =========================================================
Clean final floating header
Fixes huge blank space: only the main nav floats; top strip/language stay normal.
========================================================= */
/* Cancel previous fixed-header spacing */
body{
padding-top:0 !important;
}
/* Top black strip + language row should not float; they stay in normal page flow */
.brand-strip,
.language-row{
position:relative !important;
top:auto !important;
left:auto !important;
right:auto !important;
width:100% !important;
transform:none !important;
z-index:20 !important;
opacity:1 !important;
}
/* Main nav is the only floating/sticky header */
.main-header{
position:sticky !important;
top:0 !important;
left:auto !important;
right:auto !important;
width:100% !important;
z-index:10000 !important;
height:78px !important;
background:rgba(255,255,255,.97) !important;
backdrop-filter:blur(14px) saturate(145%) !important;
-webkit-backdrop-filter:blur(14px) saturate(145%) !important;
box-shadow:0 1px 0 rgba(0,0,0,.06) !important;
transform:translateY(0) !important;
transition:
transform .42s cubic-bezier(.2,.8,.2,1),
height .34s ease,
box-shadow .34s ease,
background .34s ease !important;
will-change:transform !important;
}
/* Floating compact state */
body.header-scrolled .main-header{
height:66px !important;
box-shadow:0 14px 36px rgba(0,0,0,.10) !important;
background:rgba(255,255,255,.94) !important;
}
body.header-scrolled .main-header .logo span{
font-size:28px !important;
}
body.header-scrolled .main-header .logo small{
font-size:8.5px !important;
margin-top:4px !important;
}
body.header-scrolled .main-header .mega-trigger,
body.header-scrolled .main-header .single-link{
font-size:14px !important;
}
/* Hide only main header when scrolling down; show when scrolling up */
body.header-hidden .main-header{
transform:translateY(-115%) !important;
}
body.header-visible .main-header,
body:not(.header-hidden) .main-header{
transform:translateY(0) !important;
}
/* Do not hide top strips anymore */
body.header-hidden .brand-strip,
body.header-hidden .language-row,
body.header-visible .brand-strip,
body.header-visible .language-row{
transform:none !important;
}
/* Dropdown stays attached under the main header */
.mega-panel{
z-index:9999 !important;
}
/* Mobile behavior */
@media(max-width:1160px){
.brand-strip{
display:none !important;
}
.language-row{
position:relative !important;
top:auto !important;
}
.main-header{
position:sticky !important;
top:0 !important;
height:78px !important;
}
.mobile-nav{
position:sticky !important;
top:78px !important;
z-index:9999 !important;
}
body.header-scrolled .main-header{
height:70px !important;
}
}
@media(max-width:650px){
.main-header{
height:72px !important;
}
body.header-scrolled .main-header{
height:66px !important;
}
}
/* =========================================================
FINAL header: no footer overlay, hide on down / show on up
========================================================= */
/* Reset bad fixed spacing from previous tests */
body{
padding-top:0 !important;
}
/* Top strip and language row stay normal; not floating */
.brand-strip,
.language-row{
position:relative !important;
top:auto !important;
left:auto !important;
right:auto !important;
width:100% !important;
transform:none !important;
opacity:1 !important;
}
/* Main header only is sticky/floating */
.main-header{
position:sticky !important;
top:0 !important;
z-index:10000 !important;
width:100% !important;
height:78px !important;
background:rgba(255,255,255,.97) !important;
backdrop-filter:blur(14px) saturate(145%) !important;
-webkit-backdrop-filter:blur(14px) saturate(145%) !important;
box-shadow:0 1px 0 rgba(0,0,0,.06) !important;
transform:translate3d(0,0,0) !important;
transition:
transform .42s cubic-bezier(.2,.8,.2,1),
height .32s ease,
box-shadow .32s ease,
background .32s ease !important;
will-change:transform !important;
}
/* Compact while page is scrolled */
body.header-scrolled .main-header{
height:66px !important;
background:rgba(255,255,255,.94) !important;
box-shadow:0 14px 36px rgba(0,0,0,.10) !important;
}
body.header-scrolled .main-header .logo span{
font-size:28px !important;
}
body.header-scrolled .main-header .logo small{
font-size:8.5px !important;
margin-top:4px !important;
}
body.header-scrolled .main-header .mega-trigger,
body.header-scrolled .main-header .single-link{
font-size:14px !important;
}
/* Hide on scroll down */
body.header-hidden .main-header{
transform:translate3d(0,-120%,0) !important;
pointer-events:none !important;
}
/* Show on scroll up */
body.header-visible .main-header,
body:not(.header-hidden) .main-header{
transform:translate3d(0,0,0) !important;
pointer-events:auto !important;
}
/* Keep black strip/language visible only where they naturally are */
body.header-hidden .brand-strip,
body.header-hidden .language-row,
body.header-visible .brand-strip,
body.header-visible .language-row{
transform:none !important;
}
/* Mobile */
@media(max-width:1160px){
.brand-strip{
display:none !important;
}
.language-row{
position:relative !important;
}
.main-header{
position:sticky !important;
top:0 !important;
height:76px !important;
}
body.header-scrolled .main-header{
height:68px !important;
}
.mobile-nav{
position:sticky !important;
top:68px !important;
z-index:9999 !important;
}
}
/* =========================================================
FINAL override: keep main header always visible and floating
========================================================= */
body.header-hidden .main-header,
body.header-visible .main-header,
body:not(.header-hidden) .main-header{
transform:translate3d(0,0,0) !important;
pointer-events:auto !important;
}
.main-header{
position:sticky !important;
top:0 !important;
z-index:10000 !important;
}
/* Never slide main header away */
body.header-hidden .main-header{
transform:translate3d(0,0,0) !important;
}
/* Keep only the main header floating; footer remains normal */
.brand-strip,
.language-row{
position:relative !important;
top:auto !important;
transform:none !important;
}
@media (max-width:1160px){
.main-header{
position:sticky !important;
top:0 !important;
}
}
/* =========================================================
FINAL HEADER LOCK (requested behavior)
1) always visible
2) slightly smaller on scroll
3) never hides
========================================================= */
:root{
--brand-strip-height:40px;
--language-row-height:36px;
--main-header-height:84px;
--site-header-total:160px;
}
html{
scroll-padding-top:var(--site-header-total) !important;
}
body{
padding-top:var(--site-header-total) !important;
}
.brand-strip,
.language-row,
.main-header{
position:fixed !important;
left:0 !important;
right:0 !important;
width:100% !important;
transform:none !important;
transition:
height .28s ease,
box-shadow .28s ease,
background .28s ease,
backdrop-filter .28s ease,
border-color .28s ease,
padding .28s ease !important;
}
.brand-strip{
top:0 !important;
z-index:10030 !important;
height:var(--brand-strip-height) !important;
}
.language-row{
top:var(--brand-strip-height) !important;
z-index:10020 !important;
height:var(--language-row-height) !important;
background:rgba(255,255,255,.96) !important;
backdrop-filter:blur(10px) saturate(140%) !important;
-webkit-backdrop-filter:blur(10px) saturate(140%) !important;
}
.main-header{
top:calc(var(--brand-strip-height) + var(--language-row-height)) !important;
z-index:10010 !important;
height:var(--main-header-height) !important;
background:rgba(255,255,255,.97) !important;
backdrop-filter:blur(14px) saturate(145%) !important;
-webkit-backdrop-filter:blur(14px) saturate(145%) !important;
box-shadow:none !important;
border-bottom:1px solid rgba(0,0,0,.07) !important;
}
/* floating look only after scrolling, while staying visible */
body.header-scrolled .brand-strip{
height:36px !important;
}
body.header-scrolled .language-row{
height:30px !important;
box-shadow:0 2px 10px rgba(0,0,0,.03) !important;
}
body.header-scrolled .main-header{
height:72px !important;
box-shadow:0 14px 34px rgba(0,0,0,.09) !important;
background:rgba(255,255,255,.92) !important;
backdrop-filter:blur(16px) saturate(150%) !important;
-webkit-backdrop-filter:blur(16px) saturate(150%) !important;
}
body.header-scrolled .main-header .logo span{
font-size:31px !important;
}
body.header-scrolled .main-header .logo small{
font-size:9px !important;
margin-top:4px !important;
}
body.header-scrolled .main-header .nav-left a,
body.header-scrolled .main-header .nav-right a,
body.header-scrolled .main-header .mega-trigger,
body.header-scrolled .main-header .single-link,
body.header-scrolled .main-header .header-icon-link,
body.header-scrolled .main-header .search-btn{
transform:none !important;
}
/* never hide the header */
body.header-hidden .brand-strip,
body.header-hidden .language-row,
body.header-hidden .main-header,
body.header-visible .brand-strip,
body.header-visible .language-row,
body.header-visible .main-header{
transform:none !important;
opacity:1 !important;
}
/* keep mobile behavior clean */
@media (max-width:1160px){
:root{
--site-header-total:124px;
--main-header-height:72px;
--language-row-height:34px;
}
body{
padding-top:var(--site-header-total) !important;
}
.mobile-nav{
position:fixed !important;
top:var(--site-header-total) !important;
left:0;
right:0;
z-index:10005 !important;
max-height:calc(100vh - var(--site-header-total));
overflow:auto;
}
}
@media (max-width:650px){
:root{
--brand-strip-height:40px;
--language-row-height:34px;
--main-header-height:68px;
--site-header-total:142px;
}
.main-header{
padding-left:18px !important;
padding-right:18px !important;
}
.main-header .logo span{
font-size:28px !important;
}
.main-header .logo small{
font-size:8px !important;
letter-spacing:.24em !important;
}
body.header-scrolled .main-header{
height:64px !important;
}
}
/* =========================================================
LHS COMPACT HEADER FIX — July 2
Removes the extra white spacer and makes the header slimmer.
========================================================= */
:root{
--brand-strip-height:32px;
--language-row-height:28px;
--main-header-height:64px;
--site-header-total:124px;
}
html{
scroll-padding-top:var(--main-header-height) !important;
}
body{
padding-top:0 !important;
}
.brand-strip,
.language-row{
position:relative !important;
top:auto !important;
left:auto !important;
right:auto !important;
width:100% !important;
transform:none !important;
opacity:1 !important;
}
.brand-strip{
height:var(--brand-strip-height) !important;
min-height:var(--brand-strip-height) !important;
padding:0 64px !important;
font-size:12px !important;
line-height:1 !important;
column-gap:28px !important;
}
.brand-strip .brand-links{
gap:30px !important;
}
.brand-strip .brand-links a,
.brand-strip strong,
.brand-strip span,
.brand-strip > a{
line-height:1 !important;
}
.language-row{
height:var(--language-row-height) !important;
min-height:var(--language-row-height) !important;
padding:0 12% !important;
border-bottom:1px solid #eee !important;
background:#fff !important;
backdrop-filter:none !important;
-webkit-backdrop-filter:none !important;
}
.language-row button{
font-size:13px !important;
line-height:1 !important;
}
.main-header,
.main-header.mega-header{
position:sticky !important;
top:0 !important;
z-index:10000 !important;
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
padding-top:0 !important;
padding-bottom:0 !important;
background:rgba(255,255,255,.98) !important;
backdrop-filter:blur(10px) saturate(130%) !important;
-webkit-backdrop-filter:blur(10px) saturate(130%) !important;
box-shadow:0 1px 0 rgba(0,0,0,.06) !important;
transform:translate3d(0,0,0) !important;
}
.main-header.mega-header{
grid-template-columns:48px minmax(360px,1fr) auto minmax(360px,1fr) 88px !important;
gap:18px !important;
}
.main-header .mega-trigger,
.main-header .single-link,
.mega-trigger,
.nav-left .mega-trigger,
.nav-right .mega-trigger{
min-height:var(--main-header-height) !important;
height:var(--main-header-height) !important;
font-size:14.5px !important;
display:inline-flex !important;
align-items:center !important;
}
.main-header .logo,
.logo{
min-width:188px !important;
}
.main-header .logo span,
.logo span{
font-size:30px !important;
letter-spacing:.08em !important;
}
.main-header .logo small,
.logo small{
font-size:8.5px !important;
letter-spacing:.26em !important;
margin-top:4px !important;
}
.main-header .search-btn,
.main-header.mega-header .search-btn{
font-size:22px !important;
}
.header-icons.clean-icons,
.clean-icons{
gap:16px !important;
}
.header-icon-link{
width:23px !important;
height:23px !important;
}
.header-icon-link svg{
width:21px !important;
height:21px !important;
}
body.header-scrolled .brand-strip,
body.header-scrolled .language-row{
height:inherit !important;
min-height:inherit !important;
box-shadow:none !important;
}
body.header-scrolled .main-header,
body.header-scrolled .main-header.mega-header{
height:58px !important;
min-height:58px !important;
box-shadow:0 12px 28px rgba(0,0,0,.08) !important;
}
body.header-scrolled .main-header .mega-trigger,
body.header-scrolled .main-header .single-link{
min-height:58px !important;
height:58px !important;
font-size:14px !important;
}
body.header-scrolled .main-header .logo span{
font-size:27px !important;
}
body.header-scrolled .main-header .logo small{
font-size:8px !important;
margin-top:3px !important;
}
body.header-hidden .main-header,
body.header-visible .main-header,
body:not(.header-hidden) .main-header{
transform:translate3d(0,0,0) !important;
opacity:1 !important;
pointer-events:auto !important;
}
@media(max-width:1440px){
.brand-strip{
padding-left:38px !important;
padding-right:38px !important;
column-gap:22px !important;
}
.brand-strip .brand-links{gap:24px !important;}
.main-header.mega-header{
grid-template-columns:44px minmax(300px,1fr) auto minmax(340px,1fr) 74px !important;
padding-left:5% !important;
padding-right:5% !important;
gap:16px !important;
}
.mega-nav{gap:22px !important;}
}
@media(max-width:1160px){
:root{
--language-row-height:28px;
--main-header-height:62px;
--site-header-total:90px;
}
body{
padding-top:0 !important;
}
.brand-strip{
display:none !important;
}
.language-row{
position:relative !important;
top:auto !important;
height:var(--language-row-height) !important;
min-height:var(--language-row-height) !important;
padding:0 18px !important;
}
.main-header,
.main-header.mega-header{
position:sticky !important;
top:0 !important;
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
grid-template-columns:40px 1fr 40px !important;
padding-left:18px !important;
padding-right:18px !important;
}
.main-header .logo span{font-size:25px !important;}
.main-header .logo small{font-size:7.5px !important;margin-top:3px !important;}
.mobile-nav{
position:sticky !important;
top:var(--main-header-height) !important;
z-index:9999 !important;
}
body.header-scrolled .main-header,
body.header-scrolled .main-header.mega-header{
height:58px !important;
min-height:58px !important;
}
}
@media(max-width:650px){
:root{
--language-row-height:26px;
--main-header-height:58px;
--site-header-total:84px;
}
.main-header,
.main-header.mega-header{
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
padding-left:14px !important;
padding-right:14px !important;
}
.main-header .logo span{font-size:23px !important;}
.main-header .logo small{font-size:7px !important;letter-spacing:.22em !important;}
body.header-scrolled .main-header,
body.header-scrolled .main-header.mega-header{
height:54px !important;
min-height:54px !important;
}
}
/* Compact header scroll correction */
body.header-scrolled .brand-strip{
height:var(--brand-strip-height) !important;
min-height:var(--brand-strip-height) !important;
}
body.header-scrolled .language-row{
height:var(--language-row-height) !important;
min-height:var(--language-row-height) !important;
}
@media(max-width:1160px){
body.header-scrolled .brand-strip{display:none !important;}
}
/* =========================================================
LHS COMPACT HEADER FIXED LOCK — July 2
Keeps the compact header fixed and fully visible during scroll.
========================================================= */
:root{
--brand-strip-height:32px;
--language-row-height:28px;
--main-header-height:64px;
--site-header-total:124px;
--header-shift:0px;
}
html{
scroll-padding-top:var(--site-header-total) !important;
}
body{
padding-top:var(--site-header-total) !important;
}
.brand-strip,
.language-row,
.main-header,
.main-header.mega-header{
position:fixed !important;
left:0 !important;
right:0 !important;
width:100% !important;
transform:none !important;
opacity:1 !important;
pointer-events:auto !important;
will-change:auto !important;
}
.brand-strip{
top:0 !important;
z-index:10030 !important;
height:var(--brand-strip-height) !important;
min-height:var(--brand-strip-height) !important;
}
.language-row{
top:var(--brand-strip-height) !important;
z-index:10020 !important;
height:var(--language-row-height) !important;
min-height:var(--language-row-height) !important;
background:#fff !important;
}
.main-header,
.main-header.mega-header{
top:calc(var(--brand-strip-height) + var(--language-row-height)) !important;
z-index:10010 !important;
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
background:rgba(255,255,255,.98) !important;
box-shadow:0 1px 0 rgba(0,0,0,.06) !important;
}
.main-header .mega-trigger,
.main-header .single-link,
.mega-trigger,
.nav-left .mega-trigger,
.nav-right .mega-trigger{
min-height:var(--main-header-height) !important;
height:var(--main-header-height) !important;
}
body.header-scrolled .brand-strip,
body.header-scrolled .language-row,
body.header-scrolled .main-header,
body.header-scrolled .main-header.mega-header,
body.header-hidden .brand-strip,
body.header-hidden .language-row,
body.header-hidden .main-header,
body.header-visible .brand-strip,
body.header-visible .language-row,
body.header-visible .main-header{
transform:none !important;
opacity:1 !important;
pointer-events:auto !important;
}
body.header-scrolled .brand-strip{
height:var(--brand-strip-height) !important;
min-height:var(--brand-strip-height) !important;
}
body.header-scrolled .language-row{
height:var(--language-row-height) !important;
min-height:var(--language-row-height) !important;
}
body.header-scrolled .main-header,
body.header-scrolled .main-header.mega-header{
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
box-shadow:0 10px 24px rgba(0,0,0,.08) !important;
}
@media(max-width:1160px){
:root{
--brand-strip-height:0px;
--language-row-height:28px;
--main-header-height:62px;
--site-header-total:90px;
}
body{
padding-top:var(--site-header-total) !important;
}
.brand-strip{
display:none !important;
}
.language-row{
position:fixed !important;
top:0 !important;
height:var(--language-row-height) !important;
min-height:var(--language-row-height) !important;
}
.main-header,
.main-header.mega-header{
position:fixed !important;
top:var(--language-row-height) !important;
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
}
.main-header .mega-trigger,
.main-header .single-link,
.mega-trigger,
.nav-left .mega-trigger,
.nav-right .mega-trigger{
min-height:var(--main-header-height) !important;
height:var(--main-header-height) !important;
}
.mobile-nav{
position:fixed !important;
top:var(--site-header-total) !important;
left:0 !important;
right:0 !important;
z-index:10005 !important;
max-height:calc(100vh - var(--site-header-total)) !important;
overflow:auto !important;
}
body.header-scrolled .main-header,
body.header-scrolled .main-header.mega-header{
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
}
}
@media(max-width:650px){
:root{
--brand-strip-height:0px;
--language-row-height:26px;
--main-header-height:58px;
--site-header-total:84px;
}
.main-header,
.main-header.mega-header{
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
}
body.header-scrolled .main-header,
body.header-scrolled .main-header.mega-header{
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
}
}
/* =========================================================
LHS GLOBAL FOOTER + MOBILE LOADER FIX — July 2
- Contact/footer block is now shared across all pages.
- Mobile loading screen remains visible instead of being hidden.
========================================================= */
@media (max-width:1180px) and (prefers-reduced-motion: no-preference){
.site-opening-loader.real-typing-loader,
body .site-opening-loader.real-typing-loader{
display:grid !important;
place-items:center !important;
opacity:1 !important;
visibility:visible !important;
}
.site-opening-loader.real-typing-loader.is-hidden,
body .site-opening-loader.real-typing-loader.is-hidden{
opacity:0 !important;
visibility:hidden !important;
pointer-events:none !important;
}
body:not(.opening-done) .main-header .logo,
body:not(.opening-done) .mobile-menu{
opacity:0 !important;
}
body.opening-done .main-header .logo,
body.opening-done .mobile-menu{
opacity:1 !important;
}
.real-loader-brand{
font-size:clamp(42px, 16vw, 78px) !important;
}
.real-loader-subtitle{
max-width:88vw !important;
font-size:10px !important;
letter-spacing:.32em !important;
white-space:normal !important;
}
.real-loader-line.is-active{
width:min(230px, 70vw) !important;
}
}
/* Keep the global footer balanced when placed after every page type */
.contact-strip-final,
.site-footer-final{
width:100% !important;
}
@media(max-width:650px){
.contact-strip-final{
padding-top:54px !important;
padding-bottom:50px !important;
}
.contact-strip-card p{
max-width:320px !important;
}
.site-footer-final{
padding-left:22px !important;
padding-right:22px !important;
}
}
/* =========================================================
LHS UX POLISH PACK — July 2
Practical premium upgrades: working search, quick contact,
stronger mobile menu, image loading polish, and safe focus states.
========================================================= */
:root{
--lhs-ink:#111;
--lhs-muted:#666;
--lhs-soft:#f7f4ef;
--lhs-border:#ded6ca;
--lhs-shadow:0 18px 45px rgba(0,0,0,.14);
}
body{
-webkit-font-smoothing:antialiased;
text-rendering:optimizeLegibility;
}
a:focus-visible,
button:focus-visible,
input:focus-visible{
outline:2px solid #111 !important;
outline-offset:4px !important;
}
img{
max-width:100%;
}
img[data-lhs-lazy]{
opacity:0;
transition:opacity .45s ease;
}
img[data-lhs-lazy].lhs-img-ready{
opacity:1;
}
.main-header,
.main-header.mega-header{
backdrop-filter:saturate(130%) blur(8px);
}
body.header-scrolled .main-header,
body.header-scrolled .main-header.mega-header{
border-bottom-color:rgba(0,0,0,.08) !important;
}
.mega-trigger,
.single-link,
.nav-left a,
.nav-right a{
position:relative;
}
.nav-left .mega-trigger::after,
.nav-right .mega-trigger::after,
.nav-right .single-link::after{
content:"";
position:absolute;
left:0;
right:0;
bottom:15px;
height:1px;
background:#111;
transform:scaleX(0);
transform-origin:center;
transition:transform .22s ease;
}
.nav-left .mega-trigger:hover::after,
.nav-right .mega-trigger:hover::after,
.nav-right .single-link:hover::after{
transform:scaleX(1);
}
.product,
.media-card,
.collection-tile,
.lhs-elegance-card,
.insight-card a{
transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.product:hover,
.media-card:hover,
.lhs-elegance-card:hover{
transform:translateY(-3px);
box-shadow:0 18px 40px rgba(0,0,0,.09);
border-color:#cfc6b7;
}
.black-btn,
.white-btn,
.actions a,
.actions button,
.insights-viewall{
transition:transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.black-btn:hover,
.actions a:hover,
.actions button:hover{
transform:translateY(-2px);
box-shadow:0 14px 30px rgba(0,0,0,.14);
}
.white-btn:hover,
.insights-viewall:hover{
transform:translateY(-2px);
box-shadow:0 12px 26px rgba(0,0,0,.10);
}
body.menu-open{
overflow:hidden;
}
body.menu-open::before{
content:"";
position:fixed;
left:0;
right:0;
top:var(--site-header-total, 92px);
bottom:0;
z-index:10000;
background:rgba(0,0,0,.28);
backdrop-filter:blur(2px);
}
.mobile-menu{
width:42px;
height:42px;
border-radius:999px !important;
display:none;
align-items:center;
justify-content:center;
}
.mobile-menu[aria-expanded="true"]{
background:#111 !important;
color:#fff !important;
}
.mobile-nav{
box-shadow:0 18px 40px rgba(0,0,0,.12);
}
.mobile-nav a{
display:flex;
align-items:center;
justify-content:space-between;
min-height:44px;
padding:0 4px;
border-bottom:1px solid #eee;
font-size:14px;
}
.mobile-nav a::after{
content:"›";
color:#999;
font-size:18px;
}
.lhs-quick-actions{
position:fixed;
right:22px;
bottom:22px;
z-index:9995;
display:flex;
flex-direction:column;
align-items:flex-end;
gap:10px;
font-family:Arial,Helvetica,sans-serif;
}
.lhs-quick-panel{
width:min(310px, calc(100vw - 32px));
display:none;
padding:12px;
border:1px solid var(--lhs-border);
border-radius:22px;
background:rgba(255,255,255,.96);
box-shadow:var(--lhs-shadow);
backdrop-filter:blur(12px);
}
.lhs-quick-actions.is-open .lhs-quick-panel{
display:grid;
gap:8px;
}
.lhs-quick-panel a{
display:flex;
align-items:center;
justify-content:space-between;
min-height:46px;
padding:0 14px;
border:1px solid #e5ded4;
border-radius:14px;
background:#fff;
color:#111;
font-size:13px;
font-weight:700;
text-decoration:none;
}
.lhs-quick-panel a span{
color:#777;
font-size:11px;
font-weight:500;
}
.lhs-quick-panel a:hover{
border-color:#111;
}
.lhs-quick-toggle{
min-width:176px;
height:52px;
border:0;
border-radius:999px;
background:#111;
color:#fff;
box-shadow:0 16px 34px rgba(0,0,0,.22);
font-size:13px;
font-weight:800;
letter-spacing:.08em;
}
.lhs-quick-toggle:hover{
transform:translateY(-2px);
}
.lhs-back-to-top{
position:fixed;
right:22px;
bottom:88px;
z-index:9994;
width:44px;
height:44px;
border:1px solid var(--lhs-border);
border-radius:50%;
background:#fff;
color:#111;
box-shadow:0 12px 28px rgba(0,0,0,.12);
opacity:0;
visibility:hidden;
transform:translateY(10px);
transition:opacity .25s ease, visibility .25s ease, transform .25s ease;
}
.lhs-back-to-top.is-visible{
opacity:1;
visibility:visible;
transform:translateY(0);
}
.lhs-search-modal{
position:fixed;
inset:0;
z-index:20000;
display:none;
padding:calc(var(--site-header-total, 124px) + 26px) 22px 26px;
background:rgba(255,255,255,.92);
backdrop-filter:blur(14px);
}
.lhs-search-modal.is-open{
display:block;
}
.lhs-search-box{
max-width:760px;
margin:0 auto;
padding:22px;
border:1px solid var(--lhs-border);
border-radius:28px;
background:#fff;
box-shadow:var(--lhs-shadow);
}
.lhs-search-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin-bottom:14px;
}
.lhs-search-head strong{
font-size:13px;
letter-spacing:.25em;
}
.lhs-search-close{
width:38px;
height:38px;
border:1px solid #ddd;
border-radius:50%;
background:#fff;
font-size:22px;
}
.lhs-search-input{
width:100%;
height:54px;
border:1px solid #cfc7bc;
border-radius:16px;
padding:0 16px;
font-size:16px;
}
.lhs-search-results{
display:grid;
gap:8px;
margin-top:14px;
max-height:min(440px, 48vh);
overflow:auto;
}
.lhs-search-results a{
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
min-height:48px;
padding:0 14px;
border:1px solid #eee;
border-radius:14px;
background:#fafafa;
color:#111;
text-decoration:none;
font-size:13px;
font-weight:700;
}
.lhs-search-results a small{
color:#777;
font-size:11px;
font-weight:500;
}
.lhs-search-empty{
padding:16px;
color:#777;
font-size:13px;
text-align:center;
}
.contact-strip-final{
border-top:1px solid #eee;
}
.site-footer-final{
padding-bottom:calc(26px + env(safe-area-inset-bottom));
}
@media(max-width:1160px){
.mobile-menu{
display:flex;
}
.mobile-nav.open{
border-radius:0 0 22px 22px;
}
.nav-left .mega-trigger::after,
.nav-right .mega-trigger::after,
.nav-right .single-link::after{
display:none;
}
}
@media(max-width:760px){
.product-grid,
.lhs-elegance-grid,
.media-grid{
gap:16px !important;
}
.product-body{
padding:16px !important;
}
.product p{
min-height:auto !important;
}
.lhs-quick-actions{
left:14px;
right:14px;
bottom:calc(14px + env(safe-area-inset-bottom));
align-items:stretch;
}
.lhs-quick-toggle{
width:100%;
min-width:0;
}
.lhs-quick-panel{
width:100%;
}
.lhs-back-to-top{
right:18px;
bottom:calc(82px + env(safe-area-inset-bottom));
}
.lhs-search-modal{
padding:calc(var(--site-header-total, 84px) + 16px) 14px 18px;
}
.lhs-search-box{
padding:16px;
border-radius:22px;
}
.lhs-search-head strong{
letter-spacing:.18em;
}
}
@media(max-width:650px){
.hero-content.centered,
.hero-content,
.hero-content.dark{
text-align:center;
}
.collection-showcase,
.insights-preview{
padding-left:14px !important;
padding-right:14px !important;
}
.contact-icon{
width:64px;
height:64px;
border-radius:20px;
}
.footer-socials{
justify-content:center;
}
}
body.search-open{
overflow:hidden;
}
/* =========================================================
LHS MOBILE HEADER DESKTOP SPIRIT — July 2
Brings the desktop header feeling to mobile: black strip,
centered logo, search/account/cart icons, fixed layout,
and the same premium opening entrance.
========================================================= */
@media(max-width:1160px){
:root{
--brand-strip-height:28px;
--language-row-height:24px;
--main-header-height:62px;
--site-header-total:114px;
}
html{scroll-padding-top:var(--site-header-total) !important;}
body{padding-top:var(--site-header-total) !important;}
.brand-strip{
display:flex !important;
position:fixed !important;
top:0 !important;
left:0 !important;
right:0 !important;
width:100% !important;
height:var(--brand-strip-height) !important;
min-height:var(--brand-strip-height) !important;
padding:0 12px !important;
background:#090909 !important;
color:#fff !important;
z-index:10030 !important;
justify-content:center !important;
align-items:center !important;
gap:10px !important;
font-size:10px !important;
letter-spacing:.08em !important;
overflow:hidden !important;
white-space:nowrap !important;
}
.brand-strip .brand-links{display:none !important;}
.brand-strip strong{font-size:10px !important;letter-spacing:.18em !important;}
.brand-strip span{font-size:10px !important;opacity:.78 !important;}
.brand-strip > a{font-size:10px !important;color:#fff !important;text-decoration:underline !important;opacity:.95 !important;}
.language-row{
display:flex !important;
position:fixed !important;
top:var(--brand-strip-height) !important;
left:0 !important;
right:0 !important;
width:100% !important;
height:var(--language-row-height) !important;
min-height:var(--language-row-height) !important;
z-index:10020 !important;
padding:0 14px !important;
justify-content:flex-end !important;
align-items:center !important;
background:rgba(255,255,255,.97) !important;
border-bottom:1px solid rgba(0,0,0,.06) !important;
}
.language-row button{font-size:11px !important;line-height:1 !important;}
.main-header,
.main-header.mega-header{
display:grid !important;
position:fixed !important;
top:calc(var(--brand-strip-height) + var(--language-row-height)) !important;
left:0 !important;
right:0 !important;
width:100% !important;
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
grid-template-columns:40px minmax(116px,1fr) 36px 66px !important;
gap:8px !important;
padding:0 14px !important;
align-items:center !important;
z-index:10010 !important;
background:rgba(255,255,255,.965) !important;
backdrop-filter:blur(14px) saturate(145%) !important;
-webkit-backdrop-filter:blur(14px) saturate(145%) !important;
box-shadow:0 8px 22px rgba(0,0,0,.075) !important;
border-bottom:1px solid rgba(0,0,0,.065) !important;
}
.nav-left,
.nav-right,
.mega-nav{display:none !important;}
.mobile-menu{
display:inline-flex !important;
grid-column:1 !important;
grid-row:1 !important;
width:38px !important;
height:38px !important;
align-items:center !important;
justify-content:center !important;
padding:0 !important;
border:0 !important;
background:transparent !important;
color:#111 !important;
font-size:25px !important;
line-height:1 !important;
}
.main-header .logo,
.main-header.mega-header .logo,
.logo{
grid-column:2 !important;
grid-row:1 !important;
justify-self:center !important;
min-width:116px !important;
width:auto !important;
text-align:center !important;
line-height:1 !important;
}
.main-header .logo span,
.logo span{font-size:25px !important;letter-spacing:.08em !important;}
.main-header .logo small,
.logo small{font-size:7px !important;letter-spacing:.21em !important;margin-top:3px !important;}
.main-header .search-btn,
.main-header.mega-header .search-btn{
display:inline-flex !important;
grid-column:3 !important;
grid-row:1 !important;
width:34px !important;
height:34px !important;
align-items:center !important;
justify-content:center !important;
justify-self:end !important;
border:0 !important;
background:transparent !important;
color:#111 !important;
font-size:22px !important;
line-height:1 !important;
padding:0 !important;
}
.header-icons.clean-icons,
.clean-icons{
display:flex !important;
grid-column:4 !important;
grid-row:1 !important;
justify-self:end !important;
align-items:center !important;
justify-content:flex-end !important;
gap:9px !important;
min-width:0 !important;
}
.header-icon-link{
display:inline-flex !important;
width:27px !important;
height:27px !important;
opacity:1 !important;
}
.header-icon-link svg{width:21px !important;height:21px !important;}
.mobile-nav{
display:flex !important;
position:fixed !important;
top:var(--site-header-total) !important;
left:0 !important;
right:0 !important;
z-index:10005 !important;
flex-direction:column !important;
gap:0 !important;
max-height:calc(100vh - var(--site-header-total)) !important;
overflow:auto !important;
padding:12px 18px 18px !important;
background:rgba(255,255,255,.985) !important;
backdrop-filter:blur(16px) saturate(145%) !important;
-webkit-backdrop-filter:blur(16px) saturate(145%) !important;
border-bottom:1px solid rgba(0,0,0,.08) !important;
box-shadow:0 18px 40px rgba(0,0,0,.11) !important;
opacity:0 !important;
visibility:hidden !important;
pointer-events:none !important;
transform:translateY(-14px) scale(.985) !important;
transition:opacity .28s ease, visibility .28s ease, transform .34s cubic-bezier(.18,.85,.25,1) !important;
}
.mobile-nav.open{
opacity:1 !important;
visibility:visible !important;
pointer-events:auto !important;
transform:translateY(0) scale(1) !important;
}
.mobile-nav a{
display:flex !important;
align-items:center !important;
min-height:42px !important;
border-bottom:1px solid #eee !important;
font-size:13px !important;
letter-spacing:.04em !important;
color:#111 !important;
}
.mobile-nav.open a{
opacity:0;
transform:translateX(-20px);
animation:mobileMenuItemIn .42s cubic-bezier(.18,.85,.25,1) forwards;
}
.mobile-nav.open a:nth-child(1){animation-delay:.03s;}
.mobile-nav.open a:nth-child(2){animation-delay:.05s;}
.mobile-nav.open a:nth-child(3){animation-delay:.07s;}
.mobile-nav.open a:nth-child(4){animation-delay:.09s;}
.mobile-nav.open a:nth-child(5){animation-delay:.11s;}
.mobile-nav.open a:nth-child(6){animation-delay:.13s;}
.mobile-nav.open a:nth-child(7){animation-delay:.15s;}
.mobile-nav.open a:nth-child(8){animation-delay:.17s;}
.mobile-nav.open a:nth-child(9){animation-delay:.19s;}
.mobile-nav.open a:nth-child(n+10){animation-delay:.21s;}
@keyframes mobileMenuItemIn{
to{opacity:1;transform:translateX(0);}
}
body:not(.opening-done) .brand-strip strong,
body:not(.opening-done) .brand-strip span,
body:not(.opening-done) .brand-strip > a,
body:not(.opening-done) .language-row button,
body:not(.opening-done) .mobile-menu,
body:not(.opening-done) .main-header .logo,
body:not(.opening-done) .main-header .search-btn,
body:not(.opening-done) .header-icon-link{
opacity:0 !important;
}
body.opening-done .brand-strip strong,
body.opening-done .brand-strip span,
body.opening-done .brand-strip > a{
animation:mobileStripIn .55s cubic-bezier(.18,.85,.25,1) forwards !important;
}
body.opening-done .language-row button{
animation:mobileFadeDown .52s cubic-bezier(.18,.85,.25,1) .08s forwards !important;
}
body.opening-done .mobile-menu{
opacity:0;
transform:translateX(-32px);
animation:mobileLeftIconIn .72s cubic-bezier(.16,.9,.2,1) .18s forwards !important;
}
body.opening-done .main-header .logo{
opacity:0;
transform:translateY(-52px) scale(.94);
animation:mobileLogoDropLuxury .9s cubic-bezier(.16,.9,.2,1) .26s forwards !important;
}
body.opening-done .main-header .search-btn{
opacity:0;
transform:translateX(34px);
animation:mobileRightIconIn .72s cubic-bezier(.16,.9,.2,1) .50s forwards !important;
}
body.opening-done .header-icon-link{
opacity:0;
transform:translateX(34px);
animation:mobileRightIconIn .72s cubic-bezier(.16,.9,.2,1) .58s forwards !important;
}
body.opening-done .header-icon-link:nth-child(2){animation-delay:.66s !important;}
@keyframes mobileStripIn{
from{opacity:0;transform:translateY(-8px);filter:blur(3px);}
to{opacity:1;transform:translateY(0);filter:blur(0);}
}
@keyframes mobileFadeDown{
from{opacity:0;transform:translateY(-8px);}
to{opacity:1;transform:translateY(0);}
}
@keyframes mobileLeftIconIn{
0%{opacity:0;transform:translateX(-32px);filter:blur(4px);}
100%{opacity:1;transform:translateX(0);filter:blur(0);}
}
@keyframes mobileRightIconIn{
0%{opacity:0;transform:translateX(34px);filter:blur(4px);}
100%{opacity:1;transform:translateX(0);filter:blur(0);}
}
@keyframes mobileLogoDropLuxury{
0%{opacity:0;transform:translateY(-52px) scale(.94);filter:blur(6px);}
72%{opacity:1;transform:translateY(4px) scale(1.01);filter:blur(0);}
100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}
}
}
@media(max-width:650px){
:root{
--brand-strip-height:27px;
--language-row-height:23px;
--main-header-height:60px;
--site-header-total:110px;
}
.brand-strip{gap:7px !important;font-size:9px !important;}
.brand-strip strong{font-size:9px !important;}
.brand-strip span{display:none !important;}
.brand-strip > a{font-size:9px !important;}
.main-header,
.main-header.mega-header{
grid-template-columns:38px minmax(104px,1fr) 34px 60px !important;
gap:6px !important;
padding-left:12px !important;
padding-right:12px !important;
}
.mobile-menu{width:36px !important;height:36px !important;font-size:24px !important;}
.main-header .search-btn{width:32px !important;height:32px !important;font-size:21px !important;}
.header-icons.clean-icons,.clean-icons{gap:7px !important;}
.header-icon-link{width:25px !important;height:25px !important;}
.header-icon-link svg{width:20px !important;height:20px !important;}
.main-header .logo span,.logo span{font-size:23px !important;}
.main-header .logo small,.logo small{font-size:6.5px !important;letter-spacing:.19em !important;}
}
/* =========================================================
LHS MOBILE HEADER FINAL POLISH — July 2
Based on live phone preview: cleaner desktop-spirit header,
tighter top rows, black language text, safer quick contact.
========================================================= */
@media(max-width:1160px){
:root{
--brand-strip-height:26px;
--language-row-height:22px;
--main-header-height:58px;
--site-header-total:106px;
}
html{scroll-padding-top:var(--site-header-total) !important;}
body{padding-top:var(--site-header-total) !important;}
.brand-strip{
height:var(--brand-strip-height) !important;
min-height:var(--brand-strip-height) !important;
padding:0 10px !important;
gap:0 !important;
}
.brand-strip strong{
font-size:10px !important;
letter-spacing:.22em !important;
}
.brand-strip span,
.brand-strip > a{
display:none !important;
}
.language-row{
height:var(--language-row-height) !important;
min-height:var(--language-row-height) !important;
padding:0 14px !important;
}
.language-row button{
color:#111 !important;
font-size:11px !important;
font-weight:400 !important;
letter-spacing:.01em !important;
-webkit-appearance:none !important;
appearance:none !important;
}
.main-header,
.main-header.mega-header{
height:var(--main-header-height) !important;
min-height:var(--main-header-height) !important;
grid-template-columns:42px 1fr 42px !important;
gap:8px !important;
padding:0 18px !important;
}
.mobile-menu{
grid-column:1 !important;
width:38px !important;
height:38px !important;
justify-self:start !important;
}
.main-header .logo,
.main-header.mega-header .logo,
.logo{
grid-column:2 !important;
justify-self:center !important;
min-width:132px !important;
}
.main-header .logo span,
.logo span{
font-size:25px !important;
letter-spacing:.09em !important;
}
.main-header .logo small,
.logo small{
font-size:6.8px !important;
letter-spacing:.22em !important;
margin-top:3px !important;
}
.main-header .search-btn,
.main-header.mega-header .search-btn{
grid-column:3 !important;
width:38px !important;
height:38px !important;
justify-self:end !important;
font-size:22px !important;
}
/* On phone, keep the luxury header clean: menu + logo + search only. */
.header-icons.clean-icons,
.clean-icons{
display:none !important;
}
.mobile-nav{
top:var(--site-header-total) !important;
max-height:calc(100vh - var(--site-header-total)) !important;
}
body.menu-open::before{
top:var(--site-header-total) !important;
}
}
@media(max-width:650px){
:root{
--brand-strip-height:26px;
--language-row-height:22px;
--main-header-height:58px;
--site-header-total:106px;
}
.main-header,
.main-header.mega-header{
grid-template-columns:42px 1fr 42px !important;
padding-left:16px !important;
padding-right:16px !important;
}
.main-header .logo span,
.logo span{font-size:25px !important;}
.main-header .logo small,
.logo small{font-size:6.8px !important;letter-spacing:.22em !important;}
}
@media(max-width:760px){
.lhs-quick-actions{
left:50% !important;
right:auto !important;
bottom:calc(16px + env(safe-area-inset-bottom)) !important;
width:min(318px, calc(100vw - 48px)) !important;
transform:translateX(-50%) !important;
align-items:stretch !important;
}
.lhs-quick-toggle{
width:100% !important;
height:48px !important;
min-height:48px !important;
border-radius:999px !important;
font-size:12px !important;
letter-spacing:.12em !important;
box-shadow:0 12px 26px rgba(0,0,0,.20) !important;
}
.lhs-quick-panel{
width:100% !important;
border-radius:18px !important;
}
.lhs-back-to-top{
bottom:calc(76px + env(safe-area-inset-bottom)) !important;
}
}
/* =========================================================
LHS FIX — Desktop hero title full visibility
Fixes clipped "Elegant volume, refined coverage" text
========================================================= */
/* Target the Women Systems hero slide only, so other slides keep their current look. */
.deals-slide .typewriter-title{
display: block !important;
width: 100% !important;
max-width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
.deals-slide .typewriter-title span{
display: block !important;
width: auto !important;
max-width: 100% !important;
overflow: visible !important;
white-space: normal !important;
line-height: 1.12 !important;
word-break: normal !important;
overflow-wrap: normal !important;
}
.deals-slide .hero-content.dark{
overflow: visible !important;
}
.deals-slide .hero-content.dark h1{
max-width: 100% !important;
font-size: clamp(40px, 2.85vw, 54px) !important;
line-height: 1.12 !important;
letter-spacing: .045em !important;
}
/* Keep the white underline and CTA aligned nicely after allowing the title to wrap. */
.deals-slide .typewriter-line{
margin-top: 14px !important;
}
/* Medium desktop / laptop screens */
@media (max-width: 1380px){
.deals-slide .hero-content.dark{
padding-left: 12% !important;
padding-right: 7% !important;
}
.deals-slide .hero-content.dark h1{
font-size: 42px !important;
letter-spacing: .035em !important;
}
}
/* Smaller laptop screens */
@media (max-width: 1180px){
.deals-slide .hero-content.dark h1{
font-size: 36px !important;
}
}
/* Mobile already stacks the hero; keep it readable and centered. */
@media (max-width: 700px){
.deals-slide .hero-content.dark h1{
font-size: 32px !important;
text-align: center !important;
}
}
/* Owner review cleanup: service-oriented top strip + pricing disclaimer */
.brand-strip .brand-links a{
text-transform:uppercase;
}
@media(max-width:650px){
}
/* =========================================================
Top strip slider + language inside header
========================================================= */
.language-row{
display:none !important;
}
.brand-strip.brand-strip-slider{
height:36px !important;
padding:0 !important;
overflow:hidden !important;
justify-content:flex-start !important;
gap:0 !important;
position:relative;
background:#080808;
border-bottom:1px solid rgba(255,255,255,.08);
}
.brand-strip-slider .brand-marquee{
width:100%;
overflow:hidden;
white-space:nowrap;
}
.brand-strip-slider .brand-track{
display:inline-flex;
align-items:center;
gap:52px;
min-width:max-content;
height:36px;
padding-left:24px;
animation: lhsBrandMarquee 34s linear infinite;
will-change:transform;
}
.brand-strip-slider:hover .brand-track{
animation-play-state:paused;
}
.brand-strip-slider a,
.brand-strip-slider span{
color:#fff;
font-size:13px;
font-weight:800;
letter-spacing:.28em;
text-transform:uppercase;
text-decoration:none;
opacity:.96;
line-height:36px;
}
.brand-strip-slider span{
font-weight:700;
letter-spacing:.18em;
opacity:.82;
}
@keyframes lhsBrandMarquee{
from{ transform:translateX(0); }
to{ transform:translateX(-50%); }
}
.header-language{
display:inline-flex;
align-items:center;
justify-content:center;
gap:4px;
border:1px solid #e4e4e4;
border-radius:999px;
padding:4px;
background:#fff;
white-space:nowrap;
}
.header-language button{
border:0;
background:transparent;
color:#111;
height:28px;
min-width:34px;
border-radius:999px;
font-size:11px;
font-weight:800;
letter-spacing:.08em;
cursor:pointer;
}
.header-language button.active,
.header-language button:hover{
background:#111;
color:#fff;
}
@media(min-width:1161px){
.main-header{
grid-template-columns:64px 1fr auto 1fr auto 130px !important;
}
}
@media(max-width:1160px){
.main-header{
grid-template-columns:auto 1fr auto auto !important;
}
.header-language{
justify-self:end;
padding:3px;
}
.header-language button{
height:25px;
min-width:29px;
font-size:10px;
}
.brand-strip-slider .brand-track{
gap:38px;
animation-duration:28s;
}
.brand-strip-slider a,
.brand-strip-slider span{
font-size:11px;
letter-spacing:.22em;
}
}
@media(max-width:650px){
.brand-strip.brand-strip-slider{
height:32px !important;
}
.brand-strip-slider .brand-track{
height:32px;
gap:34px;
padding-left:18px;
animation-duration:24s;
}
.brand-strip-slider a,
.brand-strip-slider span{
font-size:10px;
line-height:32px;
letter-spacing:.2em;
}
.main-header{
height:78px !important;
padding-left:16px !important;
padding-right:16px !important;
gap:12px !important;
}
.header-language{
position:absolute;
right:14px;
bottom:6px;
z-index:2;
transform:scale(.9);
transform-origin:right bottom;
}
.main-header .search-btn{
margin-right:66px;
}
}
@media(prefers-reduced-motion: reduce){
.brand-strip-slider .brand-track{
animation:none;
}
}
/* =========================================================
Final top strip: true one-line slider + language dropdown
========================================================= */
.language-row,
.header-language{
display:none !important;
}
.brand-strip.brand-strip-slider{
display:none !important;
}
.brand-strip.brand-strip-real-slider{
height:38px !important;
padding:0 !important;
overflow:hidden !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
background:#080808;
color:#fff;
border-bottom:1px solid rgba(255,255,255,.08);
}
.lhs-top-slider{
position:relative;
width:100%;
height:38px;
overflow:hidden;
}
.lhs-top-slider span{
position:absolute;
inset:0;
display:flex;
align-items:center;
justify-content:center;
color:#fff;
font-size:13px;
font-weight:900;
letter-spacing:.34em;
text-transform:uppercase;
white-space:nowrap;
opacity:0;
transform:translateY(100%);
animation: lhsTopPhraseSlider 18s ease-in-out infinite;
}
.lhs-top-slider span:nth-child(1){ animation-delay:0s; }
.lhs-top-slider span:nth-child(2){ animation-delay:3s; }
.lhs-top-slider span:nth-child(3){ animation-delay:6s; }
.lhs-top-slider span:nth-child(4){ animation-delay:9s; }
.lhs-top-slider span:nth-child(5){ animation-delay:12s; }
.lhs-top-slider span:nth-child(6){ animation-delay:15s; }
@keyframes lhsTopPhraseSlider{
0%{ opacity:0; transform:translateY(100%); }
5%{ opacity:1; transform:translateY(0); }
14%{ opacity:1; transform:translateY(0); }
19%{ opacity:0; transform:translateY(-100%); }
100%{ opacity:0; transform:translateY(-100%); }
}
.header-language-field{
display:flex;
align-items:center;
justify-content:center;
white-space:nowrap;
}
.header-language-select{
appearance:auto;
-webkit-appearance:menulist;
height:34px;
min-width:118px;
border:1px solid #d8d8d8;
border-radius:999px;
background:#fff;
color:#111;
padding:0 12px;
font-size:12px;
font-weight:800;
letter-spacing:.04em;
outline:none;
cursor:pointer;
}
.header-language-select:hover,
.header-language-select:focus{
border-color:#111;
}
@media(min-width:1161px){
.main-header{
grid-template-columns:64px 1fr auto 1fr auto 130px !important;
}
}
@media(max-width:1160px){
.main-header{
grid-template-columns:auto 1fr auto auto !important;
}
.header-language-select{
height:30px;
min-width:96px;
font-size:11px;
padding:0 8px;
}
}
@media(max-width:650px){
.brand-strip.brand-strip-real-slider,
.lhs-top-slider{
height:34px !important;
}
.lhs-top-slider span{
font-size:11px;
letter-spacing:.22em;
}
.main-header{
height:78px !important;
padding-left:16px !important;
padding-right:16px !important;
gap:12px !important;
}
.header-language-field{
position:absolute;
right:12px;
bottom:6px;
z-index:3;
}
.header-language-select{
height:27px;
min-width:86px;
font-size:10px;
padding:0 6px;
}
.main-header .search-btn{
margin-right:72px;
}
}
@media(prefers-reduced-motion: reduce){
.lhs-top-slider span{
animation:none;
opacity:1;
transform:none;
}
.lhs-top-slider span:not(:first-child){
display:none;
}
}
/* =========================================================
Emergency fix: real top slider text centered, no old span conflicts
========================================================= */
.language-row,
.header-language,
.brand-strip-slider,
.brand-strip-real-slider,
.brand-marquee,
.brand-track,
.lhs-top-slider{
display:none !important;
}
.brand-strip.lhs-top-strip-slider{
height:38px !important;
min-height:38px !important;
padding:0 !important;
overflow:hidden !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
background:#080808 !important;
color:#fff !important;
border-bottom:1px solid rgba(255,255,255,.08) !important;
text-align:center !important;
}
.lhs-top-slider-text{
width:100%;
height:38px;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:#fff;
font-size:13px;
font-weight:900;
letter-spacing:.34em;
text-transform:uppercase;
white-space:nowrap;
line-height:38px;
transform:translateY(0);
opacity:1;
}
.lhs-top-slider-text.is-changing{
animation:lhsSingleTopTextIn .55s cubic-bezier(.18,.85,.25,1) both;
}
@keyframes lhsSingleTopTextIn{
from{opacity:0;transform:translateY(11px);filter:blur(3px);}
to{opacity:1;transform:translateY(0);filter:blur(0);}
}
.header-language-field{
display:flex !important;
align-items:center;
justify-content:center;
white-space:nowrap;
}
.header-language-select{
appearance:auto;
-webkit-appearance:menulist;
height:34px;
min-width:118px;
border:1px solid #d8d8d8;
border-radius:999px;
background:#fff;
color:#111;
padding:0 12px;
font-size:12px;
font-weight:800;
letter-spacing:.04em;
outline:none;
cursor:pointer;
}
.header-language-select:hover,
.header-language-select:focus{
border-color:#111;
}
@media(min-width:1161px){
.main-header{
grid-template-columns:64px 1fr auto 1fr auto 130px !important;
}
}
@media(max-width:1160px){
.main-header{
grid-template-columns:auto 1fr auto auto !important;
}
.header-language-select{
height:30px;
min-width:96px;
font-size:11px;
padding:0 8px;
}
}
@media(max-width:650px){
.brand-strip.lhs-top-strip-slider,
.lhs-top-slider-text{
height:34px !important;
min-height:34px !important;
line-height:34px !important;
}
.lhs-top-slider-text{
font-size:11px;
letter-spacing:.22em;
padding:0 12px;
}
.main-header{
height:78px !important;
padding-left:16px !important;
padding-right:16px !important;
gap:12px !important;
}
.header-language-field{
position:absolute;
right:12px;
bottom:6px;
z-index:3;
}
.header-language-select{
height:27px;
min-width:86px;
font-size:10px;
padding:0 6px;
}
.main-header .search-btn{
margin-right:72px;
}
}
@media(prefers-reduced-motion: reduce){
.lhs-top-slider-text.is-changing{
animation:none;
}
}
/* =========================================================
Final split top bar:
Left = fixed clickable LHS collections
Right = luxury message slider
========================================================= */
.language-row,
.header-language,
.brand-strip-slider,
.brand-strip-real-slider,
.brand-marquee,
.brand-track,
.lhs-top-slider,
.lhs-top-strip-slider,
.lhs-top-slider-text{
display:none !important;
}
.brand-strip.lhs-top-strip-split{
height:40px !important;
min-height:40px !important;
padding:0 12% !important;
overflow:hidden !important;
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
gap:34px !important;
background:#080808 !important;
color:#fff !important;
border-bottom:1px solid rgba(255,255,255,.08) !important;
}
.lhs-top-left-links{
display:flex;
align-items:center;
gap:42px;
min-width:max-content;
}
.lhs-top-left-links a{
color:#fff !important;
font-size:13px;
font-weight:900;
letter-spacing:.32em;
text-transform:uppercase;
text-decoration:none !important;
white-space:nowrap;
opacity:.96;
transition:opacity .2s ease, transform .2s ease;
}
.lhs-top-left-links a:hover{
opacity:.7;
transform:translateY(-1px);
}
.lhs-top-right-slider{
position:relative;
flex:1;
min-width:260px;
height:40px;
overflow:hidden;
display:flex;
align-items:center;
justify-content:flex-end;
text-align:right;
}
.lhs-top-right-slider span{
display:inline-flex;
align-items:center;
justify-content:flex-end;
height:40px;
color:#fff;
font-size:13px;
font-weight:800;
letter-spacing:.22em;
text-transform:uppercase;
white-space:nowrap;
opacity:.88;
}
.lhs-top-right-slider span.is-changing{
animation:lhsRightSliderIn .58s cubic-bezier(.18,.85,.25,1) both;
}
@keyframes lhsRightSliderIn{
from{opacity:0;transform:translateY(12px);filter:blur(3px);}
to{opacity:.88;transform:translateY(0);filter:blur(0);}
}
.header-language-field{
display:flex !important;
align-items:center;
justify-content:center;
white-space:nowrap;
}
.header-language-select{
appearance:auto;
-webkit-appearance:menulist;
height:34px;
min-width:118px;
border:1px solid #d8d8d8;
border-radius:999px;
background:#fff;
color:#111;
padding:0 12px;
font-size:12px;
font-weight:800;
letter-spacing:.04em;
outline:none;
cursor:pointer;
}
.header-language-select:hover,
.header-language-select:focus{
border-color:#111;
}
@media(min-width:1161px){
.main-header{
grid-template-columns:64px 1fr auto 1fr auto 130px !important;
}
}
@media(max-width:1160px){
.brand-strip.lhs-top-strip-split{
padding:0 22px !important;
gap:22px !important;
}
.lhs-top-left-links{
gap:24px;
}
.lhs-top-left-links a{
font-size:11px;
letter-spacing:.22em;
}
.lhs-top-right-slider span{
font-size:11px;
letter-spacing:.16em;
}
.main-header{
grid-template-columns:auto 1fr auto auto !important;
}
.header-language-select{
height:30px;
min-width:96px;
font-size:11px;
padding:0 8px;
}
}
@media(max-width:650px){
.brand-strip.lhs-top-strip-split{
height:60px !important;
min-height:60px !important;
padding:7px 14px !important;
flex-direction:column;
justify-content:center !important;
gap:5px !important;
}
.lhs-top-left-links{
width:100%;
justify-content:center;
gap:13px;
}
.lhs-top-left-links a{
font-size:9px;
letter-spacing:.12em;
}
.lhs-top-right-slider{
width:100%;
min-width:0;
height:20px;
justify-content:center;
text-align:center;
}
.lhs-top-right-slider span{
height:20px;
justify-content:center;
font-size:9px;
letter-spacing:.16em;
}
.main-header{
height:78px !important;
padding-left:16px !important;
padding-right:16px !important;
gap:12px !important;
}
.header-language-field{
position:absolute;
right:12px;
bottom:6px;
z-index:3;
}
.header-language-select{
height:27px;
min-width:86px;
font-size:10px;
padding:0 6px;
}
.main-header .search-btn{
margin-right:72px;
}
}
@media(prefers-reduced-motion: reduce){
.lhs-top-right-slider span.is-changing{
animation:none;
}
}
/* =========================================================
FINAL FIX: visible split black topbar
Left links stay clickable; right message rotates.
========================================================= */
.brand-strip.lhs-top-strip-slider,
.brand-strip.lhs-top-strip-split,
.brand-strip.brand-strip-real-slider,
.brand-strip.brand-strip-slider,
.lhs-top-slider,
.lhs-top-slider-text,
.lhs-top-left-links,
.lhs-top-right-slider{
display:none !important;
}
.brand-strip.lhs-fixed-topbar{
height:40px !important;
min-height:40px !important;
width:100% !important;
padding:0 12% !important;
margin:0 !important;
overflow:hidden !important;
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
gap:34px !important;
background:#080808 !important;
color:#ffffff !important;
border-bottom:1px solid rgba(255,255,255,.08) !important;
position:relative !important;
z-index:60 !important;
}
.lhs-fixed-collections{
display:flex !important;
align-items:center !important;
justify-content:flex-start !important;
gap:42px !important;
min-width:max-content !important;
height:40px !important;
visibility:visible !important;
opacity:1 !important;
}
.lhs-fixed-collections a{
display:inline-flex !important;
align-items:center !important;
color:#ffffff !important;
font-size:13px !important;
font-weight:900 !important;
letter-spacing:.32em !important;
text-transform:uppercase !important;
text-decoration:none !important;
white-space:nowrap !important;
line-height:40px !important;
opacity:1 !important;
visibility:visible !important;
transform:none !important;
transition:opacity .2s ease, transform .2s ease !important;
}
.lhs-fixed-collections a:hover{
opacity:.72 !important;
transform:translateY(-1px) !important;
}
.lhs-luxury-message{
display:flex !important;
align-items:center !important;
justify-content:flex-end !important;
flex:1 1 auto !important;
min-width:260px !important;
height:40px !important;
overflow:hidden !important;
text-align:right !important;
visibility:visible !important;
opacity:1 !important;
}
.lhs-luxury-message-text{
display:inline-flex !important;
align-items:center !important;
justify-content:flex-end !important;
color:#ffffff !important;
font-size:13px !important;
font-weight:800 !important;
letter-spacing:.22em !important;
text-transform:uppercase !important;
white-space:nowrap !important;
line-height:40px !important;
opacity:.9 !important;
visibility:visible !important;
}
.lhs-luxury-message-text.is-changing{
animation:lhsFinalMessageIn .58s cubic-bezier(.18,.85,.25,1) both !important;
}
@keyframes lhsFinalMessageIn{
from{opacity:0;transform:translateY(12px);filter:blur(3px);}
to{opacity:.9;transform:translateY(0);filter:blur(0);}
}
@media(max-width:1160px){
.brand-strip.lhs-fixed-topbar{
padding:0 22px !important;
gap:22px !important;
}
.lhs-fixed-collections{
gap:24px !important;
}
.lhs-fixed-collections a{
font-size:11px !important;
letter-spacing:.22em !important;
}
.lhs-luxury-message-text{
font-size:11px !important;
letter-spacing:.16em !important;
}
}
@media(max-width:650px){
.brand-strip.lhs-fixed-topbar{
height:60px !important;
min-height:60px !important;
padding:7px 14px !important;
flex-direction:column !important;
justify-content:center !important;
gap:5px !important;
}
.lhs-fixed-collections{
width:100% !important;
height:22px !important;
justify-content:center !important;
gap:13px !important;
}
.lhs-fixed-collections a{
font-size:9px !important;
letter-spacing:.12em !important;
line-height:22px !important;
}
.lhs-luxury-message{
width:100% !important;
min-width:0 !important;
height:20px !important;
justify-content:center !important;
text-align:center !important;
}
.lhs-luxury-message-text{
height:20px !important;
justify-content:center !important;
font-size:9px !important;
letter-spacing:.16em !important;
line-height:20px !important;
}
}
@media(prefers-reduced-motion: reduce){
.lhs-luxury-message-text.is-changing{
animation:none !important;
}
}
/* =========================================================
FINAL POSITION FIX:
Black topbar stays ABOVE the white header, never below it.
========================================================= */
:root{
--lhs-topbar-h:40px;
--lhs-header-h:92px;
}
.brand-strip.lhs-fixed-topbar{
position:fixed !important;
top:0 !important;
left:0 !important;
right:0 !important;
z-index:1200 !important;
height:var(--lhs-topbar-h) !important;
min-height:var(--lhs-topbar-h) !important;
}
.main-header{
position:fixed !important;
top:var(--lhs-topbar-h) !important;
left:0 !important;
right:0 !important;
z-index:1190 !important;
}
body{
padding-top:calc(var(--lhs-topbar-h) + var(--lhs-header-h)) !important;
}
/* Stop old fixed-header spacing rules from pushing the hero too far */
.hero-slider,
.page-hero,
.collection-hero,
.product-detail,
.section:first-of-type{
scroll-margin-top:calc(var(--lhs-topbar-h) + var(--lhs-header-h) + 14px);
}
@media(max-width:1160px){
:root{
--lhs-topbar-h:40px;
--lhs-header-h:78px;
}
.mobile-nav{
position:fixed !important;
top:calc(var(--lhs-topbar-h) + var(--lhs-header-h)) !important;
left:0 !important;
right:0 !important;
z-index:1180 !important;
}
}
@media(max-width:650px){
:root{
--lhs-topbar-h:60px;
--lhs-header-h:78px;
}
body{
padding-top:calc(var(--lhs-topbar-h) + var(--lhs-header-h)) !important;
}
}
/* =========================================================
Refined topbar:
Softer left collection links + right message slides from right to left
========================================================= */
.brand-strip.lhs-fixed-topbar{
height:38px !important;
min-height:38px !important;
padding:0 11.5% !important;
gap:28px !important;
}
.lhs-fixed-collections{
gap:34px !important;
height:38px !important;
}
.lhs-fixed-collections a{
font-size:11px !important;
font-weight:750 !important;
letter-spacing:.24em !important;
line-height:38px !important;
opacity:.82 !important;
}
.lhs-fixed-collections a:hover{
opacity:1 !important;
transform:translateY(-1px) !important;
}
.lhs-luxury-message{
height:38px !important;
justify-content:flex-end !important;
}
.lhs-luxury-message-text{
height:38px !important;
line-height:38px !important;
font-size:12px !important;
font-weight:850 !important;
letter-spacing:.24em !important;
opacity:.94 !important;
}
.lhs-luxury-message-text.is-changing{
animation:lhsSlideRightToLeft .72s cubic-bezier(.18,.86,.25,1) both !important;
}
@keyframes lhsSlideRightToLeft{
0%{
opacity:0;
transform:translateX(78px);
filter:blur(3px);
}
100%{
opacity:.94;
transform:translateX(0);
filter:blur(0);
}
}
@media(max-width:1160px){
.brand-strip.lhs-fixed-topbar{
padding:0 22px !important;
gap:18px !important;
}
.lhs-fixed-collections{
gap:20px !important;
}
.lhs-fixed-collections a{
font-size:10px !important;
letter-spacing:.18em !important;
}
.lhs-luxury-message-text{
font-size:10px !important;
letter-spacing:.14em !important;
}
}
@media(max-width:650px){
.brand-strip.lhs-fixed-topbar{
height:58px !important;
min-height:58px !important;
padding:7px 12px !important;
gap:4px !important;
}
.lhs-fixed-collections{
gap:11px !important;
height:22px !important;
}
.lhs-fixed-collections a{
font-size:8.5px !important;
letter-spacing:.09em !important;
line-height:22px !important;
}
.lhs-luxury-message{
height:20px !important;
}
.lhs-luxury-message-text{
height:20px !important;
line-height:20px !important;
font-size:8.5px !important;
letter-spacing:.12em !important;
}
:root{
--lhs-topbar-h:58px;
}
}
/* Cleaner Explore dropdown + lighter top nav */
.lhs-clean-explore-panel{
grid-template-columns:minmax(240px,320px) !important;
justify-content:center !important;
max-width:520px !important;
margin:0 auto !important;
}
.lhs-clean-explore-panel .mega-column{
min-width:0 !important;
}
.lhs-clean-explore-panel .mega-column h3{
margin-bottom:16px !important;
}
.lhs-clean-explore-panel .mega-column a{
margin-bottom:12px !important;
}
/* =========================================================
LHS logo refresh + inline typewriter subtitle
========================================================= */
.lhs-logo-brand{
display:flex !important;
flex-direction:column;
align-items:center;
justify-content:center;
gap:4px;
min-width:250px;
line-height:1;
}
.lhs-logo-brand .lhs-logo-main{
font-family:Georgia,serif;
font-size:50px;
letter-spacing:.08em;
font-weight:700;
color:#111;
line-height:.92;
}
.lhs-logo-brand .lhs-logo-subtitle{
display:block;
text-transform:uppercase;
font-size:11px;
letter-spacing:.36em;
color:#111;
white-space:nowrap;
min-height:14px;
}
.lhs-footer-brand,
.lhs-page-brand{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:6px;
text-align:center;
}
.lhs-footer-brand{
margin-bottom:18px;
}
.lhs-footer-brand-main,
.lhs-page-brand-main{
font-family:Georgia,serif;
font-size:78px;
line-height:.84;
letter-spacing:.1em;
color:#111;
}
.lhs-footer-brand-subtitle,
.lhs-page-brand-subtitle{
text-transform:uppercase;
letter-spacing:.42em;
font-size:15px;
color:#111;
white-space:nowrap;
min-height:18px;
}
.footer .lhs-footer-brand-main{
color:#fff;
}
.footer .lhs-footer-brand-subtitle{
color:#fff;
}
.system-hero-copy .lhs-page-brand,
.detail-copy .lhs-page-brand,
.hero-copy .lhs-page-brand{
align-items:flex-start;
text-align:left;
margin-bottom:16px;
}
.system-hero-copy .lhs-page-brand-main,
.detail-copy .lhs-page-brand-main,
.hero-copy .lhs-page-brand-main{
font-size:56px;
line-height:.86;
}
.system-hero-copy .lhs-page-brand-subtitle,
.detail-copy .lhs-page-brand-subtitle,
.hero-copy .lhs-page-brand-subtitle{
font-size:12px;
letter-spacing:.34em;
min-height:16px;
}
.lhs-home-brand-section{
padding-top:54px;
padding-bottom:18px;
}
.lhs-home-brand-section .lhs-page-brand-main{
font-size:96px;
}
.lhs-home-brand-section .lhs-page-brand-subtitle{
font-size:16px;
letter-spacing:.48em;
min-height:22px;
}
.lhs-typewriter{
display:inline-block;
overflow:hidden;
}
.lhs-typewriter.is-typing{
border-right:2px solid currentColor;
animation:lhsTypeCaret .75s step-end infinite;
padding-right:3px;
}
.lhs-typewriter.typewriter-done{
border-right-color:transparent;
}
@keyframes lhsTypeCaret{
0%,100%{ border-color:transparent; }
50%{ border-color:currentColor; }
}
@media(max-width:1160px){
.lhs-logo-brand{
min-width:210px;
}
.lhs-logo-brand .lhs-logo-main{
font-size:42px;
}
.lhs-logo-brand .lhs-logo-subtitle{
font-size:10px;
letter-spacing:.28em;
}
.lhs-footer-brand-main,
.lhs-page-brand-main{
font-size:64px;
}
.lhs-footer-brand-subtitle,
.lhs-page-brand-subtitle{
font-size:13px;
letter-spacing:.32em;
}
}
@media(max-width:650px){
.lhs-logo-brand{
min-width:150px;
gap:2px;
}
.lhs-logo-brand .lhs-logo-main{
font-size:32px;
letter-spacing:.06em;
}
.lhs-logo-brand .lhs-logo-subtitle{
font-size:8px;
letter-spacing:.2em;
min-height:10px;
}
.lhs-home-brand-section{
padding-top:36px;
padding-bottom:8px;
}
.lhs-home-brand-section .lhs-page-brand-main{
font-size:68px;
}
.lhs-home-brand-section .lhs-page-brand-subtitle{
font-size:10px;
letter-spacing:.26em;
min-height:14px;
}
.system-hero-copy .lhs-page-brand-main,
.detail-copy .lhs-page-brand-main,
.hero-copy .lhs-page-brand-main{
font-size:42px;
}
.system-hero-copy .lhs-page-brand-subtitle,
.detail-copy .lhs-page-brand-subtitle,
.hero-copy .lhs-page-brand-subtitle{
font-size:9px;
letter-spacing:.22em;
min-height:12px;
}
.lhs-footer-brand-main{
font-size:52px;
}
.lhs-footer-brand-subtitle{
font-size:10px;
letter-spacing:.22em;
min-height:12px;
}
}
/* =========================================================
REAL uploaded LHS logo + typewriter subtitle
This replaces the plain text LHS logo visually.
========================================================= */
.logo.lhs-real-logo-brand{
min-width:250px !important;
height:86px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
line-height:1 !important;
text-align:center !important;
}
.lhs-real-logo-frame{
position:relative;
display:block;
width:190px;
height:82px;
overflow:hidden;
background:#fff;
}
.lhs-real-logo-frame img{
display:block;
width:100%;
height:100%;
object-fit:contain;
object-position:center;
}
.lhs-real-logo-mask{
position:absolute;
left:5%;
right:5%;
top:44%;
height:18%;
background:#fff;
z-index:2;
pointer-events:none;
}
.lhs-real-logo-title{
position:absolute;
left:50%;
top:52%;
transform:translate(-50%, -50%);
z-index:3;
color:#111;
font-family:Arial, Helvetica, sans-serif;
font-size:9px;
line-height:1;
font-weight:500;
letter-spacing:.36em;
text-transform:uppercase;
white-space:nowrap;
min-height:11px;
}
.lhs-real-logo-title.is-typing{
border-right:1.5px solid currentColor;
padding-right:3px;
animation:lhsLogoCaret .75s step-end infinite;
}
@keyframes lhsLogoCaret{
0%,100%{border-color:transparent;}
50%{border-color:currentColor;}
}
/* Bigger logo versions used in footer and page title areas */
.lhs-real-footer-logo,
.lhs-real-page-logo,
.lhs-home-real-logo-section{
display:flex;
align-items:center;
justify-content:center;
text-align:center;
}
.lhs-real-footer-logo{
margin-bottom:18px;
justify-content:flex-start;
}
.lhs-real-footer-logo .lhs-real-logo-frame{
width:220px;
height:100px;
}
.lhs-real-footer-logo .lhs-real-logo-title{
font-size:10px;
letter-spacing:.38em;
}
.lhs-real-page-logo{
margin-bottom:18px;
justify-content:flex-start;
}
.lhs-real-page-logo .lhs-real-logo-frame{
width:240px;
height:108px;
}
.lhs-real-page-logo .lhs-real-logo-title{
font-size:11px;
letter-spacing:.4em;
}
.lhs-home-real-logo-section{
padding-top:52px;
padding-bottom:10px;
}
.lhs-home-real-logo-section .lhs-real-logo-frame{
width:300px;
height:135px;
}
.lhs-home-real-logo-section .lhs-real-logo-title{
font-size:13px;
letter-spacing:.42em;
}
/* Keep page-hero logo aligned with copy */
.system-hero-copy .lhs-real-page-logo,
.detail-copy .lhs-real-page-logo,
.hero-copy .lhs-real-page-logo{
justify-content:flex-start;
}
.footer .lhs-real-logo-frame,
.site-footer-final .lhs-real-logo-frame{
background:#fff;
}
@media(max-width:1160px){
.logo.lhs-real-logo-brand{
min-width:205px !important;
height:78px !important;
}
.lhs-real-logo-frame{
width:165px;
height:72px;
}
.lhs-real-logo-title{
font-size:8px;
letter-spacing:.28em;
}
.lhs-real-page-logo .lhs-real-logo-frame{
width:205px;
height:92px;
}
.lhs-home-real-logo-section .lhs-real-logo-frame{
width:250px;
height:112px;
}
}
@media(max-width:650px){
.logo.lhs-real-logo-brand{
min-width:145px !important;
height:64px !important;
}
.lhs-real-logo-frame{
width:126px;
height:58px;
}
.lhs-real-logo-title{
font-size:6px;
letter-spacing:.2em;
top:52%;
}
.lhs-real-footer-logo .lhs-real-logo-frame,
.lhs-real-page-logo .lhs-real-logo-frame{
width:170px;
height:76px;
}
.lhs-real-footer-logo .lhs-real-logo-title,
.lhs-real-page-logo .lhs-real-logo-title{
font-size:7px;
letter-spacing:.24em;
}
.lhs-home-real-logo-section{
padding-top:34px;
}
.lhs-home-real-logo-section .lhs-real-logo-frame{
width:210px;
height:94px;
}
.lhs-home-real-logo-section .lhs-real-logo-title{
font-size:8px;
letter-spacing:.27em;
}
}
/* =========================================================
FINAL LOGO SIZE FIX:
Prevent uploaded logo/typewriter from exploding inside header.
========================================================= */
.logo.lhs-real-logo-brand{
height:78px !important;
min-width:185px !important;
max-width:210px !important;
overflow:hidden !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
padding:0 !important;
}
.logo.lhs-real-logo-brand .lhs-real-logo-frame{
width:138px !important;
height:64px !important;
max-width:138px !important;
max-height:64px !important;
display:block !important;
position:relative !important;
overflow:hidden !important;
background:#fff !important;
line-height:1 !important;
font-size:0 !important;
}
.logo.lhs-real-logo-brand .lhs-real-logo-frame img{
display:block !important;
width:100% !important;
height:100% !important;
object-fit:contain !important;
object-position:center !important;
}
.logo.lhs-real-logo-brand .lhs-real-logo-mask{
position:absolute !important;
left:5% !important;
right:5% !important;
top:43% !important;
height:19% !important;
background:#fff !important;
z-index:2 !important;
pointer-events:none !important;
}
/* Very important: override the old `.logo span` rule */
.logo.lhs-real-logo-brand .lhs-real-logo-title{
position:absolute !important;
left:50% !important;
top:52% !important;
transform:translate(-50%, -50%) !important;
z-index:3 !important;
display:inline-block !important;
color:#111 !important;
font-family:Arial, Helvetica, sans-serif !important;
font-size:6.7px !important;
line-height:1 !important;
font-weight:500 !important;
letter-spacing:.24em !important;
text-transform:uppercase !important;
white-space:nowrap !important;
min-height:8px !important;
width:auto !important;
max-width:none !important;
}
.logo.lhs-real-logo-brand .lhs-real-logo-title.is-typing{
border-right:1px solid currentColor !important;
padding-right:2px !important;
}
@media(max-width:1160px){
.logo.lhs-real-logo-brand{
height:70px !important;
min-width:165px !important;
max-width:175px !important;
}
.logo.lhs-real-logo-brand .lhs-real-logo-frame{
width:122px !important;
height:57px !important;
max-width:122px !important;
max-height:57px !important;
}
.logo.lhs-real-logo-brand .lhs-real-logo-title{
font-size:5.9px !important;
letter-spacing:.2em !important;
}
}
@media(max-width:650px){
.logo.lhs-real-logo-brand{
height:60px !important;
min-width:132px !important;
max-width:138px !important;
}
.logo.lhs-real-logo-brand .lhs-real-logo-frame{
width:102px !important;
height:48px !important;
max-width:102px !important;
max-height:48px !important;
}
.logo.lhs-real-logo-brand .lhs-real-logo-title{
font-size:4.8px !important;
letter-spacing:.16em !important;
min-height:6px !important;
}
}
/* =========================================================
CLEAN HEADER LOGO — same LHS spirit, no oversized image in header
========================================================= */
.logo.lhs-clean-type-logo{
min-width:210px !important;
max-width:230px !important;
height:78px !important;
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
gap:5px !important;
overflow:hidden !important;
text-align:center !important;
line-height:1 !important;
padding:0 !important;
}
.logo.lhs-clean-type-logo .lhs-clean-logo-main{
display:block !important;
font-family:Georgia, 'Times New Roman', serif !important;
font-size:43px !important;
font-weight:700 !important;
letter-spacing:.085em !important;
line-height:.9 !important;
color:#111 !important;
text-transform:uppercase !important;
transform:scaleX(1.04) !important;
}
.logo.lhs-clean-type-logo .lhs-clean-logo-subtitle{
display:inline-block !important;
font-family:Arial, Helvetica, sans-serif !important;
font-size:9px !important;
font-weight:500 !important;
letter-spacing:.36em !important;
line-height:1 !important;
min-height:11px !important;
color:#111 !important;
text-transform:uppercase !important;
white-space:nowrap !important;
max-width:none !important;
width:auto !important;
overflow:visible !important;
}
.logo.lhs-clean-type-logo .lhs-clean-logo-subtitle.is-typing{
border-right:1.5px solid currentColor !important;
padding-right:3px !important;
animation:lhsLogoCaret .75s step-end infinite !important;
}
/* Keep language dropdown inside the header, not floating over the hero */
.main-header .header-language-field{
position:static !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
z-index:auto !important;
transform:none !important;
}
.main-header .header-language-select{
height:32px !important;
min-width:112px !important;
border:1px solid #d9d9d9 !important;
border-radius:999px !important;
background:#fff !important;
color:#111 !important;
padding:0 10px !important;
font-size:12px !important;
font-weight:700 !important;
}
@media(min-width:1161px){
.main-header{
grid-template-columns:64px 1fr auto 1fr auto 130px !important;
}
}
@media(max-width:1160px){
.logo.lhs-clean-type-logo{
min-width:170px !important;
max-width:180px !important;
height:70px !important;
}
.logo.lhs-clean-type-logo .lhs-clean-logo-main{
font-size:36px !important;
}
.logo.lhs-clean-type-logo .lhs-clean-logo-subtitle{
font-size:8px !important;
letter-spacing:.27em !important;
}
.main-header .header-language-field{
position:static !important;
}
.main-header .header-language-select{
height:29px !important;
min-width:94px !important;
font-size:11px !important;
}
}
@media(max-width:650px){
.logo.lhs-clean-type-logo{
min-width:132px !important;
max-width:140px !important;
height:60px !important;
gap:3px !important;
}
.logo.lhs-clean-type-logo .lhs-clean-logo-main{
font-size:31px !important;
letter-spacing:.065em !important;
}
.logo.lhs-clean-type-logo .lhs-clean-logo-subtitle{
font-size:6.5px !important;
letter-spacing:.18em !important;
min-height:8px !important;
}
.main-header .header-language-field{
position:absolute !important;
right:12px !important;
bottom:6px !important;
z-index:3 !important;
}
.main-header .header-language-select{
height:27px !important;
min-width:86px !important;
font-size:10px !important;
padding:0 6px !important;
}
}
/* =========================================================
Hero title fix after logo revert:
Keep typewriter only for the LHS logo subtitle.
Hero slider titles must show full text immediately.
========================================================= */
.hero-slider .typewriter-title span,
.hero-slide .typewriter-title span{
display:inline-block !important;
width:auto !important;
max-width:100% !important;
overflow:visible !important;
white-space:normal !important;
border-right:0 !important;
animation:none !important;
opacity:1 !important;
}
.hero-slider .typewriter-title span.is-typewriting,
.hero-slide .typewriter-title span.is-typewriting,
.hero-slider .typewriter-title span.typewriter-done,
.hero-slide .typewriter-title span.typewriter-done{
border-right:0 !important;
animation:none !important;
}
.hero-slider .typewriter-body,
.hero-slider .typewriter-cta,
.hero-slider .typewriter-offer{
opacity:1;
}
/* =========================================================
Restore hero title typewriter safely
========================================================= */
.hero-slider .typewriter-title span,
.hero-slide .typewriter-title span{
display:inline-block !important;
width:auto !important;
max-width:100% !important;
overflow:hidden !important;
white-space:nowrap !important;
vertical-align:bottom !important;
border-right:0 !important;
opacity:1 !important;
}
.hero-slider .typewriter-title span.is-typewriting,
.hero-slide .typewriter-title span.is-typewriting{
border-right:3px solid currentColor !important;
animation:lhsHeroCaret .75s step-end infinite !important;
}
.hero-slider .typewriter-title span.typewriter-done,
.hero-slide .typewriter-title span.typewriter-done{
border-right:0 !important;
animation:none !important;
}
@keyframes lhsHeroCaret{
0%,100%{ border-color:transparent; }
50%{ border-color:currentColor; }
}
/* =========================================================
Hero title visibility fix:
Keep typewriter effect, but ensure long titles fully appear.
========================================================= */
.hero-slider .typewriter-title,
.hero-slide .typewriter-title{
max-width:100% !important;
width:100% !important;
line-height:1.06 !important;
}
.hero-slider .typewriter-title span,
.hero-slide .typewriter-title span{
display:inline !important;
width:auto !important;
max-width:100% !important;
overflow:visible !important;
white-space:normal !important;
word-break:normal !important;
overflow-wrap:anywhere !important;
vertical-align:bottom !important;
border-right:0 !important;
opacity:1 !important;
}
.hero-slider .typewriter-title span.is-typewriting,
.hero-slide .typewriter-title span.is-typewriting{
border-right:3px solid currentColor !important;
animation:lhsHeroCaret .75s step-end infinite !important;
}
.hero-slider .typewriter-title span.typewriter-done,
.hero-slide .typewriter-title span.typewriter-done{
border-right:0 !important;
animation:none !important;
}
/* Slightly calmer title size so the long lines fit better */
.hero-slider .typewriter-title{
font-size:clamp(46px, 4.2vw, 62px) !important;
}
@media(max-width:1160px){
.hero-slider .typewriter-title{
font-size:clamp(38px, 4.8vw, 54px) !important;
}
}
@media(max-width:650px){
.hero-slider .typewriter-title{
font-size:clamp(26px, 8vw, 40px) !important;
line-height:1.08 !important;
}
}
/* =========================================================
Slider pacing + CTA position fix
Typewriter is readable again and buttons stay aligned.
========================================================= */
.hero-slider .hero-content,
.hero-slide .hero-content{
overflow:visible !important;
}
.hero-slider .typewriter-title,
.hero-slide .typewriter-title{
max-width:100% !important;
width:100% !important;
line-height:1.04 !important;
margin-top:14px !important;
margin-bottom:18px !important;
}
.hero-slider .typewriter-title span,
.hero-slide .typewriter-title span{
display:inline !important;
overflow:visible !important;
white-space:normal !important;
overflow-wrap:normal !important;
word-break:normal !important;
hyphens:none !important;
}
.hero-slider .typewriter-body,
.hero-slide .typewriter-body{
margin-top:0 !important;
margin-bottom:18px !important;
line-height:1.35 !important;
}
.hero-slider .typewriter-cta,
.hero-slide .typewriter-cta,
.hero-slider .black-btn,
.hero-slider .white-btn{
margin-top:8px !important;
min-height:52px !important;
white-space:nowrap !important;
align-self:flex-start !important;
}
/* Keep long Women title elegant without pushing the CTA too far down */
.deals-slide .typewriter-title{
font-size:clamp(40px, 3.6vw, 54px) !important;
line-height:1.06 !important;
}
/* Keep product/lifestyle slide button from dropping */
.lifestyle-slide .hero-content{
justify-content:center !important;
}
@media(max-width:1160px){
.hero-slider .typewriter-title,
.hero-slide .typewriter-title{
font-size:clamp(34px, 4.2vw, 48px) !important;
margin-bottom:14px !important;
}
.hero-slider .typewriter-body,
.hero-slide .typewriter-body{
margin-bottom:14px !important;
}
.hero-slider .typewriter-cta,
.hero-slide .typewriter-cta,
.hero-slider .black-btn,
.hero-slider .white-btn{
min-height:48px !important;
margin-top:6px !important;
}
}
@media(max-width:650px){
.hero-slider .typewriter-title,
.hero-slide .typewriter-title{
font-size:clamp(26px, 7vw, 36px) !important;
line-height:1.08 !important;
margin-top:10px !important;
margin-bottom:12px !important;
}
.hero-slider .typewriter-body,
.hero-slide .typewriter-body{
margin-bottom:12px !important;
}
.hero-slider .typewriter-cta,
.hero-slide .typewriter-cta,
.hero-slider .black-btn,
.hero-slider .white-btn{
width:auto !important;
min-width:220px !important;
max-width:100% !important;
min-height:46px !important;
margin-top:4px !important;
}
}
/* =========================================================
Smaller centered header logo:
subtitle sits inside the middle of the big LHS letters
========================================================= */
.logo.lhs-center-logo{
position:relative !important;
min-width:185px !important;
max-width:195px !important;
height:72px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
overflow:hidden !important;
text-align:center !important;
line-height:1 !important;
padding:0 !important;
}
.logo.lhs-center-logo .lhs-center-logo-main{
display:block !important;
position:relative !important;
font-family:Georgia, "Times New Roman", serif !important;
font-size:54px !important;
font-weight:700 !important;
letter-spacing:.10em !important;
line-height:.82 !important;
color:#111 !important;
text-transform:uppercase !important;
transform:scaleX(1.03) !important;
}
.logo.lhs-center-logo .lhs-center-logo-subtitle{
position:absolute !important;
left:50% !important;
top:54% !important;
transform:translate(-50%, -50%) !important;
z-index:2 !important;
display:inline-block !important;
background:#f5f5f5 !important;
color:#111 !important;
padding:0 5px !important;
font-family:Arial, Helvetica, sans-serif !important;
font-size:7.2px !important;
font-weight:500 !important;
letter-spacing:.30em !important;
line-height:1 !important;
min-height:9px !important;
text-transform:uppercase !important;
white-space:nowrap !important;
width:auto !important;
max-width:none !important;
overflow:visible !important;
}
.logo.lhs-center-logo .lhs-center-logo-subtitle.is-typing{
border-right:1.5px solid currentColor !important;
padding-right:7px !important;
animation:lhsLogoCaret .75s step-end infinite !important;
}
@media(min-width:1161px){
.main-header{
grid-template-columns:64px 1fr auto 1fr auto 130px !important;
}
}
@media(max-width:1160px){
.logo.lhs-center-logo{
min-width:168px !important;
max-width:176px !important;
height:66px !important;
}
.logo.lhs-center-logo .lhs-center-logo-main{
font-size:48px !important;
letter-spacing:.085em !important;
}
.logo.lhs-center-logo .lhs-center-logo-subtitle{
font-size:6.5px !important;
letter-spacing:.24em !important;
min-height:8px !important;
padding:0 4px !important;
}
}
@media(max-width:650px){
.logo.lhs-center-logo{
min-width:132px !important;
max-width:138px !important;
height:58px !important;
}
.logo.lhs-center-logo .lhs-center-logo-main{
font-size:40px !important;
letter-spacing:.07em !important;
}
.logo.lhs-center-logo .lhs-center-logo-subtitle{
font-size:5.1px !important;
letter-spacing:.14em !important;
min-height:7px !important;
padding:0 2px !important;
}
}
/* =========================================================
Header logo as clean image — no typing effect
Based on the uploaded LHS logo style
========================================================= */
.logo.lhs-header-image-logo{
display:flex !important;
align-items:center !important;
justify-content:center !important;
min-width:165px !important;
max-width:180px !important;
height:72px !important;
padding:0 !important;
overflow:hidden !important;
text-align:center !important;
}
.logo.lhs-header-image-logo img{
display:block !important;
width:128px !important;
max-width:100% !important;
height:auto !important;
object-fit:contain !important;
object-position:center !important;
}
@media(min-width:1161px){
.main-header{
grid-template-columns:64px 1fr auto 1fr auto 130px !important;
}
}
@media(max-width:1160px){
.logo.lhs-header-image-logo{
min-width:150px !important;
max-width:160px !important;
height:66px !important;
}
.logo.lhs-header-image-logo img{
width:114px !important;
}
}
@media(max-width:650px){
.logo.lhs-header-image-logo{
min-width:118px !important;
max-width:126px !important;
height:58px !important;
}
.logo.lhs-header-image-logo img{
width:94px !important;
}
}
/* =========================================================
Header logo balanced size
Keeps uploaded logo image, no typing effect
========================================================= */
.logo.lhs-header-image-logo{
min-width:185px !important;
max-width:200px !important;
height:78px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
overflow:hidden !important;
}
.logo.lhs-header-image-logo img{
width:148px !important;
max-width:148px !important;
height:auto !important;
display:block !important;
object-fit:contain !important;
object-position:center !important;
}
@media(max-width:1160px){
.logo.lhs-header-image-logo{
min-width:160px !important;
max-width:170px !important;
height:68px !important;
}
.logo.lhs-header-image-logo img{
width:126px !important;
max-width:126px !important;
}
}
@media(max-width:650px){
.logo.lhs-header-image-logo{
min-width:124px !important;
max-width:132px !important;
height:58px !important;
}
.logo.lhs-header-image-logo img{
width:98px !important;
max-width:98px !important;
}
}
/* =========================================================
FINAL HEADER LOGO FIT FIX
Keep uploaded logo image, but prevent it from dropping below header.
========================================================= */
.logo.lhs-header-image-logo{
min-width:150px !important;
max-width:160px !important;
height:70px !important;
max-height:70px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
overflow:hidden !important;
padding:0 !important;
line-height:0 !important;
}
.logo.lhs-header-image-logo img{
width:116px !important;
max-width:116px !important;
max-height:58px !important;
height:auto !important;
display:block !important;
object-fit:contain !important;
object-position:center center !important;
transform:translateY(-1px) !important;
}
@media(max-width:1160px){
.logo.lhs-header-image-logo{
min-width:132px !important;
max-width:142px !important;
height:62px !important;
max-height:62px !important;
}
.logo.lhs-header-image-logo img{
width:100px !important;
max-width:100px !important;
max-height:50px !important;
}
}
@media(max-width:650px){
.logo.lhs-header-image-logo{
min-width:108px !important;
max-width:116px !important;
height:54px !important;
max-height:54px !important;
}
.logo.lhs-header-image-logo img{
width:84px !important;
max-width:84px !important;
max-height:42px !important;
}
}
/* =========================================================
Crisp center text inside the uploaded header logo
Keep image style, but replace blurry middle text with sharp overlay text
========================================================= */
.logo.lhs-header-logo-crisp{
min-width:150px !important;
max-width:160px !important;
height:70px !important;
max-height:70px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
overflow:hidden !important;
padding:0 !important;
line-height:0 !important;
}
.logo.lhs-header-logo-crisp .lhs-header-logo-frame{
position:relative !important;
display:block !important;
width:116px !important;
max-width:116px !important;
height:58px !important;
max-height:58px !important;
overflow:hidden !important;
background:#fff !important;
}
.logo.lhs-header-logo-crisp .lhs-header-logo-frame img{
display:block !important;
width:100% !important;
max-width:100% !important;
height:100% !important;
max-height:100% !important;
object-fit:contain !important;
object-position:center center !important;
}
.logo.lhs-header-logo-crisp .lhs-header-logo-mask{
position:absolute !important;
left:6% !important;
right:6% !important;
top:43.5% !important;
height:14.5% !important;
background:#f6f6f6 !important;
z-index:2 !important;
pointer-events:none !important;
}
.logo.lhs-header-logo-crisp .lhs-header-logo-text{
position:absolute !important;
left:50% !important;
top:50.5% !important;
transform:translate(-50%, -50%) !important;
z-index:3 !important;
display:block !important;
width:auto !important;
max-width:none !important;
white-space:nowrap !important;
color:#111 !important;
font-family:Arial, Helvetica, sans-serif !important;
font-size:6.4px !important;
font-weight:500 !important;
letter-spacing:.28em !important;
line-height:1 !important;
text-transform:uppercase !important;
-webkit-font-smoothing:antialiased !important;
text-rendering:geometricPrecision !important;
}
@media(max-width:1160px){
.logo.lhs-header-logo-crisp{
min-width:132px !important;
max-width:142px !important;
height:62px !important;
max-height:62px !important;
}
.logo.lhs-header-logo-crisp .lhs-header-logo-frame{
width:100px !important;
max-width:100px !important;
height:50px !important;
max-height:50px !important;
}
.logo.lhs-header-logo-crisp .lhs-header-logo-text{
font-size:5.6px !important;
letter-spacing:.24em !important;
}
}
@media(max-width:650px){
.logo.lhs-header-logo-crisp{
min-width:108px !important;
max-width:116px !important;
height:54px !important;
max-height:54px !important;
}
.logo.lhs-header-logo-crisp .lhs-header-logo-frame{
width:84px !important;
max-width:84px !important;
height:42px !important;
max-height:42px !important;
}
.logo.lhs-header-logo-crisp .lhs-header-logo-mask{
left:7% !important;
right:7% !important;
top:43% !important;
height:15% !important;
}
.logo.lhs-header-logo-crisp .lhs-header-logo-text{
font-size:4.8px !important;
letter-spacing:.16em !important;
}
}
/* =========================================================
Uploaded logo in header — plain image, sized to fit cleanly
========================================================= */
.logo.lhs-header-logo-plain{
display:flex !important;
align-items:center !important;
justify-content:center !important;
min-width:146px !important;
max-width:152px !important;
height:64px !important;
max-height:64px !important;
padding:0 !important;
overflow:hidden !important;
line-height:0 !important;
}
.logo.lhs-header-logo-plain img{
display:block !important;
width:108px !important;
max-width:108px !important;
max-height:54px !important;
height:auto !important;
object-fit:contain !important;
object-position:center center !important;
transform:translateY(-1px) !important;
}
@media(min-width:1161px){
.main-header{
grid-template-columns:64px 1fr auto 1fr auto 130px !important;
}
}
@media(max-width:1160px){
.logo.lhs-header-logo-plain{
min-width:132px !important;
max-width:138px !important;
height:58px !important;
max-height:58px !important;
}
.logo.lhs-header-logo-plain img{
width:96px !important;
max-width:96px !important;
max-height:48px !important;
}
}
@media(max-width:650px){
.logo.lhs-header-logo-plain{
min-width:108px !important;
max-width:112px !important;
height:50px !important;
max-height:50px !important;
}
.logo.lhs-header-logo-plain img{
width:78px !important;
max-width:78px !important;
max-height:39px !important;
}
}
/* =========================================================
LHS hair-care products menu/pages
========================================================= */
.lhs-products-mega{
grid-template-columns:repeat(3, minmax(210px, 1fr)) !important;
}
.lhs-care-note{
margin-top:14px;
max-width:640px;
color:#666;
line-height:1.55;
font-size:14px;
}
@media(max-width:1160px){
.lhs-products-mega{
grid-template-columns:1fr 1fr !important;
}
}
@media(max-width:650px){
.lhs-products-mega{
grid-template-columns:1fr !important;
}
}
/* Product display pages */
.lhs-products-mega{
grid-template-columns:repeat(3, minmax(210px, 1fr)) !important;
}
.lhs-care-note{
margin-top:14px;
max-width:660px;
color:#666;
line-height:1.55;
font-size:14px;
}
@media(max-width:1160px){
.lhs-products-mega{ grid-template-columns:1fr 1fr !important; }
}
@media(max-width:650px){
.lhs-products-mega{ grid-template-columns:1fr !important; }
}
/* Uploaded real product images */
.lhs-care-note{
margin-top:14px;
max-width:700px;
color:#666;
line-height:1.55;
font-size:14px;
}
/* Aluxia/LHS Elegance cleaned page */
.lhs-care-note{
margin-top:14px;
max-width:700px;
color:#666;
line-height:1.55;
font-size:14px;
}
/* Expanded Men hair system types menu */
.lhs-men-mega,
.mega-panel-men.lhs-men-mega{
grid-template-columns:repeat(4, minmax(185px, 1fr)) !important;
gap:48px !important;
max-width:1180px;
}
@media(max-width:1160px){
.lhs-men-mega,
.mega-panel-men.lhs-men-mega{
grid-template-columns:repeat(2, minmax(220px, 1fr)) !important;
}
}
@media(max-width:650px){
.lhs-men-mega,
.mega-panel-men.lhs-men-mega{
grid-template-columns:1fr !important;
}
}
/* Activated Help / Professional Access pages */
.lhs-info-grid{
grid-template-columns:repeat(3, minmax(230px, 1fr));
}
@media(max-width:980px){
.lhs-info-grid{
grid-template-columns:repeat(2, minmax(220px, 1fr));
}
}
@media(max-width:640px){
.lhs-info-grid{
grid-template-columns:1fr;
}
}
/* Expanded Women hair replacement system types menu */
.lhs-women-mega,
.mega-panel-women.lhs-women-mega{
grid-template-columns:repeat(4, minmax(185px, 1fr)) !important;
gap:48px !important;
max-width:1180px;
}
@media(max-width:1160px){
.lhs-women-mega,
.mega-panel-women.lhs-women-mega{
grid-template-columns:repeat(2, minmax(220px, 1fr)) !important;
}
}
@media(max-width:650px){
.lhs-women-mega,
.mega-panel-women.lhs-women-mega{
grid-template-columns:1fr !important;
}
}
/* Filtered luxury Men/Women mega menus */
.lhs-men-mega-filtered,
.lhs-women-mega-filtered{
grid-template-columns:repeat(2, minmax(230px, 1fr)) !important;
gap:86px !important;
max-width:720px !important;
justify-content:center !important;
}
@media(max-width:820px){
.lhs-men-mega-filtered,
.lhs-women-mega-filtered{
grid-template-columns:1fr !important;
max-width:360px !important;
gap:34px !important;
}
}
/* =========================================================
LHS named page transition loader
========================================================= */
.lhs-page-transition-loader{
position:fixed;
inset:0;
z-index:999998;
display:grid;
place-items:center;
background:#f5f2ed;
color:#111;
opacity:0;
visibility:hidden;
pointer-events:none;
transition:opacity .32s ease, visibility .32s ease;
}
.lhs-page-transition-loader.is-active{
opacity:1;
visibility:visible;
pointer-events:auto;
}
.lhs-page-transition-inner{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:12px;
text-align:center;
transform:translateY(12px);
opacity:0;
transition:opacity .38s ease, transform .38s cubic-bezier(.2,.8,.2,1);
}
.lhs-page-transition-loader.is-active .lhs-page-transition-inner{
opacity:1;
transform:translateY(0);
}
.lhs-page-transition-brand{
font-family:Georgia, 'Times New Roman', serif;
font-size:clamp(38px,5vw,72px);
line-height:.9;
letter-spacing:.16em;
color:#111;
}
.lhs-page-transition-kicker{
margin-top:2px;
font-size:10px;
font-weight:700;
letter-spacing:.46em;
text-transform:uppercase;
color:#7e6a4b;
}
.lhs-page-transition-title{
margin-top:5px;
min-height:1.2em;
font-size:clamp(18px,2.7vw,34px);
line-height:1.1;
font-weight:500;
letter-spacing:.18em;
text-transform:uppercase;
color:#111;
}
.lhs-page-transition-line{
width:0;
height:2px;
margin-top:12px;
background:#111;
opacity:.9;
transition:width .7s cubic-bezier(.2,.8,.2,1);
}
.lhs-page-transition-loader.is-active .lhs-page-transition-line{
width:min(220px,46vw);
}
.lhs-page-transition-loader.is-leaving .lhs-page-transition-title::after{
content:"";
display:inline-block;
width:1px;
height:.9em;
margin-left:7px;
background:#111;
vertical-align:-.08em;
animation:lhsPageCursorBlink .8s steps(1,end) infinite;
}
@keyframes lhsPageCursorBlink{
0%,49%{opacity:1;}
50%,100%{opacity:0;}
}
@media(max-width:640px){
.lhs-page-transition-kicker{
letter-spacing:.32em;
}
.lhs-page-transition-title{
max-width:86vw;
letter-spacing:.12em;
font-size:21px;
}
}
/* =========================================================
LHS deep cleanup polish
========================================================= */
.main-header,
.brand-strip,
.site-footer-final,
.contact-strip-final .contact-strip-card,
.system-card,
.content-card{
-webkit-font-smoothing:antialiased;
text-rendering:geometricPrecision;
}
.mega-panel-inner{
border-top:1px solid rgba(17,17,17,.06);
}
.mega-column a,
.mobile-nav a,
.footer-col a{
text-decoration:none;
}
.system-card,
.content-card,
.contact-strip-card{
transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s ease, border-color .28s ease;
}
.system-card:hover,
.content-card:hover,
.contact-strip-card:hover{
transform:translateY(-3px);
box-shadow:0 18px 42px rgba(17,17,17,.08);
}
.system-info h2,
.content-card h2{
letter-spacing:.01em;
}
.system-price-note span,
.lhs-care-note{
color:rgba(17,17,17,.68);
}
.footer-col h3{
margin-bottom:16px;
}
.footer-col a{
margin-bottom:10px;
}
.footer-copy{
letter-spacing:.14em;
text-transform:uppercase;
}
/* Homepage slider image links */
.hero-image-link{
display:block;
width:100%;
height:100%;
color:inherit;
text-decoration:none;
cursor:pointer;
overflow:hidden;
}
.hero-image-link img{
display:block;
width:100%;
height:100%;
object-fit:cover;
transition:transform .85s cubic-bezier(.2,.8,.2,1), filter .85s ease;
}
.hero-image-link:hover img{
transform:scale(1.025);
filter:contrast(1.03) saturate(1.02);
}
.hero-soft-cta{
margin-top:18px;
}
@media(max-width:760px){
.hero-soft-cta{
margin-top:14px;
}
}
/* Active homepage journal cards */
.lhs-active-insights{
padding-top:24px;
padding-bottom:76px;
background:linear-gradient(180deg,#fff 0%,#faf8f4 100%);
}
.insights-kicker{
margin:0 0 -2px;
font-size:10px;
font-weight:800;
letter-spacing:.42em;
text-transform:uppercase;
color:#9b8055;
}
.lhs-viewall-active{
gap:10px;
height:32px;
min-width:118px;
border-color:rgba(17,17,17,.18);
color:#111;
background:rgba(255,255,255,.78);
box-shadow:0 10px 28px rgba(17,17,17,.05);
transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease;
}
.lhs-viewall-active:hover{
transform:translateY(-2px);
border-color:rgba(17,17,17,.42);
background:#111;
color:#fff;
box-shadow:0 16px 38px rgba(17,17,17,.13);
}
.lhs-active-insight{
position:relative;
text-align:left;
overflow:hidden;
border:1px solid rgba(17,17,17,.08);
background:#fff;
box-shadow:0 16px 40px rgba(17,17,17,.055);
transition:transform .38s cubic-bezier(.2,.8,.2,1), box-shadow .38s ease, border-color .38s ease;
}
.lhs-active-insight:hover{
transform:translateY(-8px);
border-color:rgba(155,128,85,.36);
box-shadow:0 26px 64px rgba(17,17,17,.13);
}
.lhs-active-insight .insight-link{
display:block;
height:100%;
color:inherit;
text-decoration:none;
background:#fff;
}
.lhs-active-insight .insight-media{
position:relative;
display:block;
overflow:hidden;
background:#f3f0ea;
}
.lhs-active-insight .insight-media::after{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(180deg,rgba(0,0,0,0) 46%,rgba(0,0,0,.42) 100%),
linear-gradient(110deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.22) 44%,rgba(255,255,255,0) 58%);
transform:translateX(-115%);
transition:transform .85s cubic-bezier(.2,.8,.2,1);
pointer-events:none;
}
.lhs-active-insight:hover .insight-media::after{
transform:translateX(115%);
}
.lhs-active-insight img{
width:100%;
aspect-ratio:1/1;
object-fit:cover;
display:block;
transition:transform .9s cubic-bezier(.2,.8,.2,1), filter .9s ease;
}
.lhs-active-insight:hover img{
transform:scale(1.065);
filter:contrast(1.05) saturate(1.04);
}
.insight-glow{
position:absolute;
inset:auto 18px 18px 18px;
height:1px;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent);
opacity:.7;
transform:scaleX(.36);
transition:transform .55s ease, opacity .55s ease;
}
.lhs-active-insight:hover .insight-glow{
transform:scaleX(1);
opacity:1;
}
.insight-tag{
position:absolute;
left:18px;
bottom:18px;
z-index:2;
padding:8px 11px;
font-size:9px;
font-weight:800;
letter-spacing:.26em;
text-transform:uppercase;
color:#111;
background:rgba(255,255,255,.78);
border:1px solid rgba(255,255,255,.72);
backdrop-filter:blur(10px);
}
.insight-copy{
display:block;
padding:20px 20px 22px;
}
.lhs-active-insight h3{
margin:0;
max-width:100%;
color:#151515;
font-size:15px;
line-height:1.48;
font-weight:600;
letter-spacing:.005em;
}
.insight-cta{
display:inline-flex;
align-items:center;
gap:8px;
margin-top:16px;
font-size:10px;
font-weight:800;
letter-spacing:.28em;
text-transform:uppercase;
color:#9b8055;
transition:gap .25s ease, color .25s ease;
}
.lhs-active-insight:hover .insight-cta{
gap:13px;
color:#111;
}
@media(max-width:960px){
.lhs-active-insight{
text-align:left;
}
}
/* Restored footer social media icons */
.footer-socials{
display:flex;
align-items:center;
justify-content:center;
gap:14px;
margin:28px auto 18px;
}
.footer-socials .social-icon{
width:42px;
height:42px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:50%;
color:#111;
background:#fff;
border:1px solid rgba(17,17,17,.14);
box-shadow:0 10px 26px rgba(17,17,17,.06);
transition:transform .25s ease, color .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.footer-socials .social-icon svg{
width:18px;
height:18px;
display:block;
flex:0 0 auto;
fill:currentColor;
overflow:visible;
}
.footer-socials .social-icon:hover{
transform:translateY(-3px);
color:#fff;
background:#111;
border-color:#111;
box-shadow:0 16px 34px rgba(17,17,17,.16);
}
/* Active premium solutions homepage banner */
.lhs-premium-solutions-banner{
position:relative;
display:block;
max-width:1178px;
margin:34px auto 0;
overflow:hidden;
background:#f6f3ed;
border:1px solid rgba(17,17,17,.08);
box-shadow:0 22px 58px rgba(17,17,17,.08);
text-decoration:none;
transform:translateZ(0);
transition:transform .42s cubic-bezier(.2,.8,.2,1), box-shadow .42s ease, border-color .42s ease, filter .42s ease;
}
.lhs-premium-solutions-banner:hover{
transform:translateY(-6px);
border-color:rgba(155,128,85,.34);
box-shadow:0 34px 82px rgba(17,17,17,.15);
filter:contrast(1.015);
}
.premium-banner-media{
position:relative;
display:block;
width:100%;
overflow:hidden;
}
.premium-banner-media img{
display:block;
width:100%;
height:auto;
transition:transform .95s cubic-bezier(.2,.8,.2,1), filter .95s ease;
}
.lhs-premium-solutions-banner:hover .premium-banner-media img{
transform:scale(1.025);
filter:saturate(1.025) contrast(1.035);
}
.premium-banner-media::before{
content:"";
position:absolute;
inset:18px;
z-index:1;
border:1px solid rgba(255,255,255,.42);
pointer-events:none;
opacity:.72;
transition:inset .42s ease, opacity .42s ease;
}
.lhs-premium-solutions-banner:hover .premium-banner-media::before{
inset:14px;
opacity:1;
}
.premium-banner-shine{
position:absolute;
inset:-30% -18%;
z-index:2;
pointer-events:none;
background:linear-gradient(105deg, transparent 36%, rgba(255,255,255,.38) 48%, rgba(255,255,255,.16) 54%, transparent 66%);
transform:translateX(-78%) skewX(-8deg);
opacity:0;
transition:transform 1.05s cubic-bezier(.2,.8,.2,1), opacity .35s ease;
}
.lhs-premium-solutions-banner:hover .premium-banner-shine{
transform:translateX(78%) skewX(-8deg);
opacity:1;
}
@media(max-width:760px){
.lhs-premium-solutions-banner{
margin-top:20px;
border-radius:0;
}
.premium-banner-media::before{
inset:10px;
}
}
/* Premium banner double-arrow fix */
.lhs-premium-solutions-banner .premium-banner-media{
cursor:pointer;
}
/* EN / AR language layer */
.header-language-select option[value="fr"]{
display:none;
}
html[dir="rtl"] body{
direction:rtl;
font-family:Tahoma, Arial, sans-serif;
}
html[dir="rtl"] .brand-strip,
html[dir="rtl"] .main-header,
html[dir="rtl"] .footer-socials,
html[dir="rtl"] .slider-dots,
html[dir="rtl"] .hero-slider{
direction:ltr;
}
html[dir="rtl"] .mega-panel,
html[dir="rtl"] .mega-column,
html[dir="rtl"] .mobile-nav,
html[dir="rtl"] .footer-col,
html[dir="rtl"] .footer-contact,
html[dir="rtl"] .system-hero-copy,
html[dir="rtl"] .system-intro,
html[dir="rtl"] .system-info,
html[dir="rtl"] .content-hero,
html[dir="rtl"] .content-card,
html[dir="rtl"] .insight-copy,
html[dir="rtl"] .contact-strip-card,
html[dir="rtl"] .cart,
html[dir="rtl"] .system-bottom-cta{
direction:rtl;
text-align:right;
}
html[dir="rtl"] .hero-content{
direction:rtl;
text-align:right;
}
html[dir="rtl"] .hero-content.centered,
html[dir="rtl"] .insights-header,
html[dir="rtl"] .contact-strip-card,
html[dir="rtl"] .system-bottom-cta,
html[dir="rtl"] .footer-copy,
html[dir="rtl"] .footer-language{
text-align:center;
}
html[dir="rtl"] .insight-cta,
html[dir="rtl"] .lhs-viewall-active,
html[dir="rtl"] .black-btn,
html[dir="rtl"] .white-btn,
html[dir="rtl"] .system-add-btn{
letter-spacing:.08em;
}
html[dir="rtl"] .insight-cta span,
html[dir="rtl"] .lhs-viewall-active span{
display:inline-block;
transform:scaleX(-1);
}
html[dir="rtl"] .mobile-nav a,
html[dir="rtl"] .mega-column a,
html[dir="rtl"] .footer-col a{
letter-spacing:.02em;
}
html[dir="rtl"] .header-language-select{
direction:rtl;
}
/* MEN simplified four-category menu */
.lhs-men-mega-simple{
max-width:390px;
grid-template-columns:1fr;
}
.lhs-men-mega-simple .mega-column a{
white-space:nowrap;
}
/* WOMEN simplified four-category menu */
.lhs-women-mega-simple{
max-width:430px;
grid-template-columns:1fr;
}
.lhs-women-mega-simple .mega-column a{
white-space:nowrap;
}
/* Men subcategory cards */
.lhs-subcategory-grid{
align-items:stretch;
}
.lhs-subcategory-card .system-card-inner{
height:100%;
}
.lhs-subcategory-card .system-img{
position:relative;
}
.lhs-card-badge{
position:absolute;
left:14px;
top:14px;
z-index:2;
padding:7px 10px;
font-size:9px;
font-weight:800;
letter-spacing:.22em;
color:#111;
background:rgba(255,255,255,.78);
border:1px solid rgba(255,255,255,.72);
backdrop-filter:blur(10px);
}
.lhs-subcategory-desc{
display:block;
min-height:46px;
margin:8px 0 12px;
color:rgba(17,17,17,.68);
font-size:13px;
line-height:1.45;
}
html[dir="rtl"] .lhs-card-badge{
left:auto;
right:14px;
}
/* LHS detail pages and clickable lace cards */
.lhs-card-link-wrap{display:block;color:inherit;text-decoration:none}
.lhs-card-title-link{color:inherit;text-decoration:none}
.lhs-card-title-link:hover,.lhs-card-link-wrap:hover + .system-info h2 a{text-decoration:none}
.lhs-card-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
.lhs-view-details,.lhs-outline-btn{
display:inline-flex;align-items:center;justify-content:center;
min-height:44px;padding:0 18px;border:1px solid rgba(17,17,17,.18);
background:#fff;color:#111;text-decoration:none;font-size:12px;font-weight:700;
letter-spacing:.16em;transition:.25s ease;
}
.lhs-view-details:hover,.lhs-outline-btn:hover{background:#111;color:#fff}
.lhs-detail-hero{
display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:start;
}
.lhs-detail-gallery{display:flex;flex-direction:column;gap:16px}
.lhs-detail-main-image{
border:1px solid rgba(17,17,17,.08);background:#faf9f7;padding:18px;min-height:420px;
display:flex;align-items:center;justify-content:center;
}
.lhs-detail-main-image img{max-width:100%;max-height:420px;object-fit:contain}
.lhs-detail-thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.lhs-detail-thumbs img{
width:100%;height:120px;object-fit:cover;border:1px solid rgba(17,17,17,.08);background:#faf9f7;padding:8px;
}
.lhs-detail-price-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:18px 0 16px}
.lhs-detail-back{color:#111;text-decoration:none;font-size:13px;letter-spacing:.08em}
.lhs-detail-back:hover{text-decoration:underline}
.lhs-detail-specs{
display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:18px 0 22px;
}
.lhs-detail-specs div{
border:1px solid rgba(17,17,17,.08);padding:16px;background:#fff;
}
.lhs-detail-specs strong{display:block;margin-bottom:6px;font-size:12px;letter-spacing:.14em}
.lhs-detail-specs span{display:block;color:rgba(17,17,17,.74);line-height:1.5}
.lhs-detail-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.lhs-features-grid{
display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;
width:min(1320px, calc(100% - 80px));margin:0 auto 72px;
}
.lhs-feature-card{
border:1px solid rgba(17,17,17,.08);background:#fff;padding:24px;
}
.lhs-feature-card h3{margin:0 0 12px;font-size:18px}
.lhs-feature-card p{margin:0;color:rgba(17,17,17,.74);line-height:1.7}
.lhs-related-links{
width:min(1320px, calc(100% - 80px));margin:0 auto 80px;padding:34px;
border:1px solid rgba(17,17,17,.08);background:#faf9f7;
display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap;
}
.lhs-related-actions{display:flex;gap:12px;flex-wrap:wrap}
@media (max-width: 980px){
.lhs-detail-hero{grid-template-columns:1fr;gap:28px}
.lhs-detail-specs{grid-template-columns:1fr}
.lhs-features-grid{grid-template-columns:1fr 1fr;width:min(1320px, calc(100% - 32px))}
.lhs-related-links{width:min(1320px, calc(100% - 32px))}
}
@media (max-width: 640px){
.lhs-card-actions{flex-direction:column;align-items:stretch}
.lhs-view-details,.lhs-outline-btn{width:100%}
.lhs-detail-main-image{min-height:280px}
.lhs-detail-thumbs{grid-template-columns:repeat(3,1fr)}
.lhs-detail-thumbs img{height:86px}
.lhs-features-grid{grid-template-columns:1fr}
}
/* Hair image integration cleanup */
.lhs-subcategory-card .system-img img{
width:100%;
height:100%;
object-fit:cover;
background:#f7f5f0;
}
.lhs-detail-main-image img{
width:100%;
object-fit:contain;
}
.lhs-detail-thumbs img{
object-fit:cover;
}
.lhs-card-actions .system-add-btn{
margin-top:0;
}
@media(max-width:640px){
.lhs-subcategory-desc{
min-height:auto;
}
}
/* Static non-clickable Men header options */
.nav-static-option{
display:block;
color:inherit;
cursor:default;
user-select:none;
}
.mega-column .nav-static-option{
padding:7px 0;
font-size:13px;
letter-spacing:.06em;
opacity:.86;
}
.mega-column .nav-static-option:hover{
opacity:1;
}
.mobile-nav .nav-static-option{
padding:13px 22px;
border-bottom:1px solid rgba(17,17,17,.08);
font-size:14px;
letter-spacing:.04em;
opacity:.86;
}
html[dir="rtl"] .mobile-nav .nav-static-option,
html[dir="rtl"] .mega-column .nav-static-option{
text-align:right;
}
/* =========================================================
Lace Hair Systems — live premium hero
========================================================= */
.lace-live-page .main-header{
margin-bottom:0 !important;
}
.lhs-lace-page{
margin:0;
padding:0;
}
.lhs-lace-live-hero{
position:relative;
width:100%;
aspect-ratio:2048 / 694;
min-height:470px;
max-height:650px;
overflow:hidden;
background:#b68d66;
isolation:isolate;
}
.lhs-lace-live-bg{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
object-position:center center;
display:block;
z-index:-3;
transform:scale(1.015);
animation:lhsLaceHeroImageIn 1.8s cubic-bezier(.2,.8,.2,1) both,
lhsLaceHeroFloat 15s ease-in-out 1.8s infinite alternate;
}
.lhs-lace-live-shade{
position:absolute;
inset:0;
z-index:-2;
background:
linear-gradient(90deg,
rgba(35,20,11,.18) 0%,
rgba(35,20,11,.08) 34%,
rgba(35,20,11,0) 58%,
rgba(8,6,4,.10) 100%);
pointer-events:none;
}
.lhs-lace-live-content{
position:absolute;
left:clamp(42px,5.25vw,108px);
top:50%;
width:min(590px,42vw);
transform:translateY(-49%);
color:#1f130d;
z-index:3;
}
.lhs-lace-live-eyebrow{
margin:0 0 24px;
font-size:clamp(13px,1.05vw,20px);
font-weight:600;
letter-spacing:.42em;
line-height:1.25;
opacity:0;
transform:translateY(14px);
animation:lhsLaceFadeUp .75s ease .2s forwards;
}
.lhs-lace-live-eyebrow::after{
content:"";
display:block;
width:62px;
height:1px;
margin-top:19px;
background:linear-gradient(90deg,#c58a34,rgba(197,138,52,.08));
transform:scaleX(0);
transform-origin:left;
animation:lhsLaceLineIn .85s ease .75s forwards;
}
.lhs-lace-live-title{
margin:0;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(48px,4.25vw,86px);
font-weight:400;
line-height:1.08;
letter-spacing:-.04em;
color:#24140e;
}
.lhs-lace-live-title span{
display:block;
opacity:0;
transform:translateY(26px);
clip-path:inset(0 100% 0 0);
}
.lhs-lace-live-title span:first-child{
animation:lhsLaceTitleIn 1s cubic-bezier(.22,.9,.25,1) .65s forwards;
}
.lhs-lace-live-title span:last-child{
animation:lhsLaceTitleIn 1.05s cubic-bezier(.22,.9,.25,1) .92s forwards;
}
.lhs-lace-live-body{
margin:30px 0 0;
font-size:clamp(16px,1.22vw,23px);
line-height:1.45;
letter-spacing:.01em;
color:#2f2119;
opacity:0;
transform:translateY(18px);
animation:lhsLaceFadeUp .8s ease 1.45s forwards;
}
.lhs-lace-live-cta{
display:inline-flex;
align-items:center;
justify-content:center;
gap:18px;
min-height:58px;
margin-top:34px;
padding:0 27px;
border:1px solid rgba(202,151,60,.55);
background:#080706;
color:#d7a44d;
font-size:12px;
font-weight:700;
letter-spacing:.13em;
text-decoration:none;
box-shadow:0 14px 34px rgba(12,8,4,.16);
opacity:0;
transform:translateY(18px);
animation:lhsLaceFadeUp .8s ease 1.78s forwards;
transition:transform .3s ease,background .3s ease,color .3s ease,box-shadow .3s ease;
}
.lhs-lace-live-cta b{
font-size:25px;
line-height:1;
font-weight:400;
transform:translateX(0);
transition:transform .3s ease;
}
.lhs-lace-live-cta:hover{
transform:translateY(-3px);
background:#15100b;
color:#efbd64;
box-shadow:0 19px 38px rgba(12,8,4,.23);
}
.lhs-lace-live-cta:hover b{
transform:translateX(5px);
}
.lhs-lace-scroll-cue{
position:absolute;
left:50%;
bottom:15px;
width:1px;
height:34px;
background:rgba(255,255,255,.22);
overflow:hidden;
z-index:4;
}
.lhs-lace-scroll-cue span{
display:block;
width:100%;
height:45%;
background:rgba(255,255,255,.78);
animation:lhsLaceScroll 1.8s ease-in-out infinite;
}
@keyframes lhsLaceHeroImageIn{
from{opacity:0;transform:scale(1.055);}
to{opacity:1;transform:scale(1.015);}
}
@keyframes lhsLaceHeroFloat{
from{transform:scale(1.015) translate3d(0,0,0);}
to{transform:scale(1.035) translate3d(-.25%,0,0);}
}
@keyframes lhsLaceFadeUp{
to{opacity:1;transform:translateY(0);}
}
@keyframes lhsLaceLineIn{
to{transform:scaleX(1);}
}
@keyframes lhsLaceTitleIn{
to{
opacity:1;
transform:translateY(0);
clip-path:inset(0 0 0 0);
}
}
@keyframes lhsLaceScroll{
0%{transform:translateY(-110%);}
50%,100%{transform:translateY(240%);}
}
@media(max-width:980px){
.lhs-lace-live-hero{
aspect-ratio:auto;
min-height:620px;
max-height:none;
}
.lhs-lace-live-bg{
object-position:58% center;
}
.lhs-lace-live-shade{
background:linear-gradient(90deg,
rgba(205,166,125,.94) 0%,
rgba(205,166,125,.83) 44%,
rgba(205,166,125,.16) 78%,
rgba(10,8,5,.08) 100%);
}
.lhs-lace-live-content{
left:32px;
width:min(560px,64vw);
}
}
@media(max-width:640px){
.lhs-lace-live-hero{
min-height:640px;
}
.lhs-lace-live-bg{
object-position:64% center;
}
.lhs-lace-live-shade{
background:
linear-gradient(180deg,
rgba(205,166,125,.22) 0%,
rgba(205,166,125,.64) 34%,
rgba(205,166,125,.96) 100%),
linear-gradient(90deg,rgba(205,166,125,.72),rgba(205,166,125,.10));
}
.lhs-lace-live-content{
left:24px;
right:24px;
top:auto;
bottom:58px;
width:auto;
transform:none;
}
.lhs-lace-live-eyebrow{
margin-bottom:17px;
font-size:12px;
letter-spacing:.30em;
}
.lhs-lace-live-eyebrow::after{
margin-top:13px;
}
.lhs-lace-live-title{
font-size:clamp(42px,12vw,62px);
line-height:1.02;
}
.lhs-lace-live-body{
margin-top:20px;
font-size:16px;
}
.lhs-lace-live-cta{
width:100%;
margin-top:25px;
padding:0 18px;
}
.lhs-lace-scroll-cue{
display:none;
}
}
@media(prefers-reduced-motion:reduce){
.lhs-lace-live-bg,
.lhs-lace-live-eyebrow,
.lhs-lace-live-eyebrow::after,
.lhs-lace-live-title span,
.lhs-lace-live-body,
.lhs-lace-live-cta,
.lhs-lace-scroll-cue span{
animation:none !important;
opacity:1 !important;
transform:none !important;
clip-path:none !important;
}
}
/* =========================================================
Lace Hair Systems — text-only LHS options
Images will be added in a later pass.
========================================================= */
.lhs-lace-options-section{
width:min(1380px,calc(100% - 72px));
margin:0 auto;
padding:88px 0 110px;
}
.lhs-lace-options-intro{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(300px,520px);
gap:48px;
align-items:end;
padding-bottom:34px;
}
.lhs-lace-options-intro .eyebrow{
margin:0 0 14px;
color:#9d6a2f;
font-size:12px;
font-weight:700;
letter-spacing:.25em;
}
.lhs-lace-options-intro h2{
margin:0;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(38px,4vw,64px);
font-weight:400;
line-height:1.05;
letter-spacing:-.025em;
}
.lhs-lace-options-intro > p{
margin:0;
color:rgba(17,17,17,.66);
font-size:16px;
line-height:1.75;
}
.lhs-lace-options-toolbar{
display:flex;
justify-content:space-between;
gap:20px;
padding:18px 0;
border-top:1px solid rgba(17,17,17,.10);
border-bottom:1px solid rgba(17,17,17,.10);
color:rgba(17,17,17,.55);
font-size:11px;
font-weight:700;
letter-spacing:.18em;
}
.lhs-lace-options-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:20px;
padding-top:30px;
}
.lhs-lace-option-card{
min-height:390px;
display:flex;
flex-direction:column;
border:1px solid rgba(17,17,17,.09);
background:#fff;
overflow:hidden;
transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;
}
.lhs-lace-option-card:hover{
transform:translateY(-7px);
border-color:rgba(157,106,47,.32);
box-shadow:0 22px 44px rgba(32,20,10,.10);
}
.lhs-lace-option-visual{
position:relative;
min-height:210px;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
background:
radial-gradient(circle at 72% 24%,rgba(207,164,100,.22),transparent 34%),
linear-gradient(135deg,#f1e8dc 0%,#d8bea0 52%,#b98c62 100%);
}
.lhs-lace-option-visual::before{
content:"";
position:absolute;
inset:18px;
border:1px solid rgba(255,255,255,.55);
}
.lhs-lace-option-mark{
color:#2f1e13;
font-family:Georgia,"Times New Roman",serif;
font-size:54px;
letter-spacing:.13em;
text-shadow:0 1px 0 rgba(255,255,255,.40);
}
.lhs-lace-option-copy{
display:flex;
flex:1;
flex-direction:column;
padding:24px 24px 27px;
}
.lhs-lace-option-copy p{
margin:0 0 12px;
color:#9d6a2f;
font-size:10px;
font-weight:700;
letter-spacing:.18em;
}
.lhs-lace-option-copy h2{
margin:0;
font-family:Georgia,"Times New Roman",serif;
font-size:24px;
font-weight:400;
line-height:1.18;
}
.lhs-lace-option-copy span{
display:block;
margin-top:16px;
color:rgba(17,17,17,.64);
font-size:14px;
line-height:1.65;
}
@media(max-width:1100px){
.lhs-lace-options-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}
@media(max-width:760px){
.lhs-lace-options-section{
width:min(100% - 30px,1380px);
padding:60px 0 78px;
}
.lhs-lace-options-intro{
grid-template-columns:1fr;
gap:20px;
}
.lhs-lace-options-toolbar{
align-items:flex-start;
flex-direction:column;
}
.lhs-lace-options-grid{
grid-template-columns:1fr;
}
.lhs-lace-option-card{
min-height:auto;
}
.lhs-lace-option-visual{
min-height:190px;
}
}
/* Lace product preview images */
.lhs-lace-option-image{
background:#d8bea0;
}
.lhs-lace-option-image::before{
display:none;
}
.lhs-lace-option-image img{
width:100%;
height:100%;
min-height:210px;
display:block;
object-fit:cover;
object-position:center;
transition:transform .55s cubic-bezier(.2,.7,.2,1);
}
.lhs-lace-option-card:hover .lhs-lace-option-image img{
transform:scale(1.035);
}
.lhs-lace-option-image
@media(max-width:760px){
.lhs-lace-option-image img{
min-height:190px;
}
}
/* =========================================================
Active Lace collection cards
========================================================= */
.lhs-lace-option-card-linked{
position:relative;
}
.lhs-lace-option-card-link{
display:flex;
flex:1;
flex-direction:column;
min-height:100%;
color:inherit;
text-decoration:none;
}
.lhs-lace-option-card-link .lhs-lace-option-copy{
flex:1;
}
.lhs-lace-card-view{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin:0 24px 24px;
padding-top:17px;
border-top:1px solid rgba(17,17,17,.09);
color:#9d6a2f;
font-size:11px;
font-weight:700;
letter-spacing:.16em;
}
.lhs-lace-card-view b{
font-size:22px;
line-height:1;
transition:transform .25s ease;
}
.lhs-lace-option-card-linked:hover .lhs-lace-card-view b{
transform:translateX(5px);
}
/* =========================================================
LHS Lace product detail pages — images added later
========================================================= */
.lhs-product-detail-page{
background:#fff;
}
.lhs-product-detail-shell{
width:min(1380px,calc(100% - 72px));
margin:0 auto;
padding:72px 0 96px;
display:grid;
grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);
gap:70px;
align-items:start;
}
.lhs-product-gallery{
position:sticky;
top:128px;
}
.lhs-product-main-placeholder{
aspect-ratio:1 / 1;
min-height:540px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
gap:11px;
border:1px solid rgba(17,17,17,.09);
background:
radial-gradient(circle at 70% 22%,rgba(210,168,103,.25),transparent 35%),
linear-gradient(135deg,#f4ece2,#d6b28b 58%,#b88758);
color:#2d1c12;
overflow:hidden;
}
.lhs-product-main-placeholder span{
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(64px,8vw,126px);
letter-spacing:.12em;
}
.lhs-product-main-placeholder strong{
font-size:13px;
letter-spacing:.25em;
}
.lhs-product-main-placeholder small{
color:rgba(45,28,18,.58);
font-size:11px;
letter-spacing:.22em;
}
.lhs-product-thumb-placeholders{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:12px;
margin-top:14px;
}
.lhs-product-thumb-placeholders button{
aspect-ratio:1;
border:1px solid rgba(17,17,17,.10);
background:#f7f3ee;
color:rgba(17,17,17,.45);
font-family:Georgia,"Times New Roman",serif;
font-size:18px;
}
.lhs-product-detail-info{
padding-top:10px;
}
.lhs-product-breadcrumb{
display:inline-block;
margin-bottom:22px;
color:#9d6a2f;
font-size:11px;
font-weight:700;
letter-spacing:.18em;
}
.lhs-product-detail-info h1{
margin:0;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(42px,4.3vw,70px);
font-weight:400;
line-height:1.04;
letter-spacing:-.035em;
}
.lhs-product-summary{
margin:24px 0 0;
max-width:720px;
color:rgba(17,17,17,.66);
font-size:17px;
line-height:1.75;
}
.lhs-product-price-row{
display:flex;
align-items:center;
gap:18px;
flex-wrap:wrap;
margin:34px 0 26px;
padding:24px 28px;
border:1px solid rgba(17,17,17,.08);
border-radius:28px;
background:linear-gradient(135deg,#fffdf9 0%,#f8f2e8 55%,#fbfaf7 100%);
box-shadow:0 18px 40px rgba(28,20,12,.06);
}
.lhs-product-price-row strong{
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(32px,2.7vw,46px);
font-weight:400;
letter-spacing:-.03em;
color:#181512;
}
.lhs-product-price-row span{
color:rgba(17,17,17,.58);
font-size:14px;
line-height:1.65;
}
.lhs-product-spec-summary{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:14px;
margin-bottom:34px;
}
.lhs-product-spec-summary div{
padding:22px 20px;
border:1px solid rgba(17,17,17,.08);
border-radius:24px;
background:linear-gradient(180deg,#fffdfa 0%,#f8f3ea 100%);
box-shadow:0 14px 30px rgba(29,21,13,.05);
}
.lhs-product-spec-summary span{
display:block;
margin-bottom:10px;
color:#a8742f;
font-size:11px;
font-weight:700;
letter-spacing:.18em;
text-transform:uppercase;
}
.lhs-product-spec-summary strong{
display:block;
font-size:15px;
line-height:1.55;
color:#1d1916;
}
.lhs-product-options{
display:flex;
flex-direction:column;
gap:18px;
}
.lhs-product-options fieldset{
margin:0;
padding:24px 24px 22px;
border:1px solid rgba(17,17,17,.08);
border-radius:28px;
background:linear-gradient(180deg,#fffefd 0%,#faf7f1 100%);
box-shadow:0 16px 36px rgba(29,21,13,.05);
}
.lhs-product-options legend{
margin-bottom:16px;
padding:0;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(18px,1.8vw,22px);
font-weight:700;
letter-spacing:-.01em;
color:#171411;
}
.lhs-product-select-wrap select{
width:100%;
min-height:64px;
padding:0 16px;
border:1px solid rgba(17,17,17,.20);
border-radius:20px;
background:#fff;
color:#171717;
font:inherit;
}
.lhs-product-radio-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px;
}
.lhs-density-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.lhs-product-radio-grid label{
display:flex;
align-items:flex-start;
gap:12px;
min-height:64px;
padding:16px 18px;
border:1px solid rgba(17,17,17,.10);
border-radius:20px;
background:#fff;
color:rgba(17,17,17,.80);
font-size:15px;
line-height:1.45;
cursor:pointer;
transition:border-color .22s ease, box-shadow .22s ease, transform .22s ease, background .22s ease, color .22s ease;
}
.lhs-product-radio-grid label:hover,
.lhs-product-radio-grid label:has(input:focus-visible){
transform:translateY(-2px);
border-color:rgba(168,116,47,.42);
box-shadow:0 12px 24px rgba(46,34,20,.08);
}
.lhs-product-radio-grid label:has(input:checked){
border-color:#a8742f;
background:linear-gradient(180deg,#fffaf1 0%,#f8efe0 100%);
box-shadow:0 0 0 2px rgba(168,116,47,.12),0 12px 24px rgba(46,34,20,.08);
color:#17120f;
}
.lhs-product-radio-grid input{
margin-top:2px;
flex:0 0 auto;
width:20px;
height:20px;
accent-color:#a8742f;
}
.lhs-product-quantity-row{
padding:24px 24px 22px;
border:1px solid rgba(17,17,17,.08);
border-radius:28px;
background:linear-gradient(180deg,#fffefd 0%,#faf7f1 100%);
box-shadow:0 16px 36px rgba(29,21,13,.05);
}
.lhs-product-quantity-row label{
display:flex;
flex-direction:column;
gap:14px;
width:170px;
}
.lhs-product-quantity-row span{
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(18px,1.8vw,22px);
font-weight:700;
color:#171411;
}
.lhs-product-quantity-row input{
width:100%;
height:64px;
padding:0 18px;
border:1px solid rgba(17,17,17,.16);
border-radius:18px;
background:#fff;
font-size:30px;
font-weight:500;
color:#171411;
box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
}
.lhs-product-add-btn,
.system-add-btn.lhs-product-add-btn{
width:100%;
min-height:74px;
margin-top:2px;
padding:18px 28px;
border:1px solid rgba(17,17,17,.92);
border-radius:28px;
background:linear-gradient(135deg,#fbf7f0 0%,#f2e6d4 45%,#ead8bf 100%);
color:#17120f;
font-size:14px;
font-weight:800;
letter-spacing:.28em;
box-shadow:0 20px 34px rgba(38,26,11,.12), inset 0 1px 0 rgba(255,255,255,.7);
transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
}
.lhs-product-add-btn:hover,
.system-add-btn.lhs-product-add-btn:hover{
background:linear-gradient(135deg,#1f1a16 0%,#111 100%);
color:#f4e2bf;
border-color:#111;
transform:translateY(-3px);
box-shadow:0 24px 40px rgba(17,17,17,.20);
}
.lhs-product-add-btn:focus-visible,
.system-add-btn.lhs-product-add-btn:focus-visible{
outline:2px solid rgba(168,116,47,.45);
outline-offset:4px;
}
.lhs-product-add-btn:active,
.system-add-btn.lhs-product-add-btn:active{
transform:translateY(-1px);
}
.lhs-product-detail-bottom{
width:min(1380px,calc(100% - 72px));
margin:0 auto 90px;
padding:34px;
border:1px solid rgba(17,17,17,.09);
background:#faf8f4;
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
}
.lhs-product-detail-bottom .eyebrow{
margin:0 0 10px;
color:#9d6a2f;
font-size:10px;
font-weight:700;
letter-spacing:.2em;
}
.lhs-product-detail-bottom h2{
margin:0;
max-width:760px;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(28px,3vw,44px);
font-weight:400;
line-height:1.15;
}
.lhs-product-detail-bottom > a{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:50px;
padding:0 24px;
border:1px solid #111;
font-size:11px;
font-weight:700;
letter-spacing:.15em;
}
@media(max-width:1050px){
.lhs-product-detail-shell{
grid-template-columns:1fr;
}
.lhs-product-gallery{
position:relative;
top:auto;
}
}
@media(max-width:760px){
.lhs-product-detail-shell,
.lhs-product-detail-bottom{
width:min(100% - 30px,1380px);
}
.lhs-product-detail-shell{
padding:42px 0 68px;
gap:38px;
}
.lhs-product-main-placeholder{
min-height:340px;
}
.lhs-product-price-row,
.lhs-product-spec-summary div,
.lhs-product-options fieldset,
.lhs-product-quantity-row{
border-radius:22px;
}
.lhs-product-spec-summary{
grid-template-columns:1fr;
}
.lhs-product-options fieldset,
.lhs-product-quantity-row{
padding:20px 18px 18px;
}
.lhs-product-radio-grid,
.lhs-density-grid{
grid-template-columns:1fr 1fr;
}
.lhs-product-radio-grid label{
min-height:58px;
padding:14px 14px;
font-size:14px;
}
.lhs-product-quantity-row label{
width:150px;
}
.lhs-product-quantity-row input,
.lhs-product-add-btn,
.system-add-btn.lhs-product-add-btn{
min-height:58px;
}
.lhs-product-quantity-row input{
height:58px;
font-size:24px;
}
.lhs-product-add-btn,
.system-add-btn.lhs-product-add-btn{
border-radius:22px;
padding:16px 22px;
letter-spacing:.22em;
}
.lhs-product-detail-bottom{
align-items:flex-start;
flex-direction:column;
padding:24px;
}
.lhs-product-detail-bottom > a{
width:100%;
}
}
/* LHS Full French Lace live gallery */
.lhs-product-main-image-live{
aspect-ratio:1 / 1;
min-height:540px;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
border:1px solid rgba(17,17,17,.09);
background:#f8f4ee;
}
.lhs-product-main-image-live img{
width:100%;
height:100%;
object-fit:contain;
display:block;
opacity:1;
transform:scale(1);
transition:opacity .22s ease,transform .35s ease;
}
.lhs-product-main-image-live img.is-changing{
opacity:.35;
transform:scale(.985);
}
.lhs-product-thumbs-live{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:12px;
margin-top:14px;
}
.lhs-product-thumb{
aspect-ratio:1;
padding:0;
overflow:hidden;
border:1px solid rgba(17,17,17,.10);
background:#f7f3ee;
opacity:.72;
transition:opacity .25s ease,border-color .25s ease,transform .25s ease;
}
.lhs-product-thumb:hover,
.lhs-product-thumb.is-active{
opacity:1;
border-color:#9d6a2f;
transform:translateY(-2px);
}
.lhs-product-thumb img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}
@media(max-width:760px){
.lhs-product-main-image-live{
min-height:340px;
}
.lhs-product-thumbs-live{
grid-template-columns:repeat(3,minmax(0,1fr));
}
}
/* =========================================================
Global storefront shopping bag
========================================================= */
body.lhs-cart-open{
overflow:hidden;
}
.lhs-floating-cart{
position:fixed;
right:24px;
bottom:92px;
width:60px;
height:60px;
display:flex;
align-items:center;
justify-content:center;
border:1px solid rgba(203,153,72,.48);
border-radius:50%;
background:#0b0a09;
color:#d9a852;
box-shadow:0 16px 38px rgba(0,0,0,.23);
z-index:1505;
transition:transform .25s ease,box-shadow .25s ease;
}
.lhs-floating-cart:hover{
transform:translateY(-3px);
box-shadow:0 20px 42px rgba(0,0,0,.29);
}
.lhs-floating-cart svg{
width:27px;
height:27px;
fill:none;
stroke:currentColor;
stroke-width:1.55;
}
.lhs-floating-cart-count{
position:absolute;
top:-4px;
right:-3px;
min-width:23px;
height:23px;
padding:0 6px;
display:flex;
align-items:center;
justify-content:center;
border:2px solid #fff;
border-radius:999px;
background:#c58b33;
color:#fff;
font-size:11px;
font-weight:800;
}
.lhs-floating-cart-count.is-empty{
background:#777;
}
.lhs-store-cart-overlay{
position:fixed;
inset:0;
background:rgba(8,7,6,.44);
opacity:0;
visibility:hidden;
z-index:1700;
transition:opacity .3s ease,visibility .3s ease;
}
.lhs-store-cart-overlay.is-open{
opacity:1;
visibility:visible;
}
.lhs-store-cart-drawer{
position:fixed;
top:0;
right:0;
width:min(510px,100vw);
height:100dvh;
display:flex;
flex-direction:column;
background:#fff;
transform:translateX(105%);
z-index:1710;
box-shadow:-22px 0 54px rgba(0,0,0,.18);
transition:transform .38s cubic-bezier(.2,.8,.2,1);
}
.lhs-store-cart-drawer.is-open{
transform:translateX(0);
}
.lhs-store-cart-head{
min-height:108px;
padding:25px 28px;
display:flex;
align-items:center;
justify-content:space-between;
border-bottom:1px solid rgba(17,17,17,.09);
}
.lhs-store-cart-head p{
margin:0 0 5px;
color:#9d6a2f;
font-size:10px;
font-weight:800;
letter-spacing:.20em;
}
.lhs-store-cart-head h2{
margin:0;
font-family:Georgia,"Times New Roman",serif;
font-size:31px;
font-weight:400;
}
.lhs-store-cart-head button{
width:42px;
height:42px;
border:1px solid rgba(17,17,17,.12);
background:#fff;
font-size:27px;
line-height:1;
}
.lhs-store-cart-items{
flex:1;
overflow:auto;
padding:10px 26px 24px;
}
.lhs-store-cart-empty{
min-height:310px;
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
gap:16px;
color:rgba(17,17,17,.55);
text-align:center;
}
.lhs-store-cart-empty-logo{
display:block;
width:min(215px,68%);
height:auto;
object-fit:contain;
filter:drop-shadow(0 9px 18px rgba(179,124,50,.10));
}
.lhs-store-cart-placeholder-logo{
width:78% !important;
height:78% !important;
object-fit:contain !important;
padding:8px;
}
.lhs-store-cart-item{
display:grid;
grid-template-columns:105px 1fr;
gap:16px;
padding:18px 0;
border-bottom:1px solid rgba(17,17,17,.09);
}
.lhs-store-cart-item-image{
width:105px;
height:105px;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
background:#f5efe7;
}
.lhs-store-cart-item-image img{
width:100%;
height:100%;
object-fit:cover;
}
.lhs-store-cart-item-image span{
color:#9d6a2f;
font-family:Georgia,"Times New Roman",serif;
font-size:31px;
}
.lhs-store-cart-item-copy h3{
margin:0 0 7px;
font-family:Georgia,"Times New Roman",serif;
font-size:18px;
font-weight:400;
line-height:1.24;
}
.lhs-store-cart-item-copy p{
margin:0 0 9px;
color:rgba(17,17,17,.55);
font-size:11px;
line-height:1.55;
}
.lhs-store-cart-item-copy > strong{
color:#9d6a2f;
font-size:14px;
}
.lhs-store-cart-item-controls{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
margin-top:13px;
}
.lhs-store-cart-item-controls > div{
display:flex;
align-items:center;
border:1px solid rgba(17,17,17,.13);
}
.lhs-store-cart-item-controls > div button,
.lhs-store-cart-item-controls > div span{
width:32px;
height:32px;
display:flex;
align-items:center;
justify-content:center;
border:0;
background:#fff;
}
.lhs-store-cart-remove{
border:0;
background:transparent;
color:#777;
font-size:11px;
text-decoration:underline;
}
.lhs-store-cart-summary{
padding:22px 28px calc(24px + env(safe-area-inset-bottom));
border-top:1px solid rgba(17,17,17,.09);
background:#fbfaf8;
}
.lhs-store-cart-summary-row{
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
margin-bottom:16px;
}
.lhs-store-cart-summary-row span{
font-size:13px;
font-weight:700;
}
.lhs-store-cart-summary-row strong{
font-family:Georgia,"Times New Roman",serif;
font-size:19px;
font-weight:400;
text-align:right;
}
.lhs-store-cart-payment-panel{
position:relative;
overflow:hidden;
margin-top:4px;
padding:20px 20px 16px;
border:1px solid rgba(17,17,17,.08);
border-radius:26px;
background:linear-gradient(180deg,#fffdfa 0%,#f7f1e8 100%);
box-shadow:0 18px 34px rgba(22,16,11,.06);
color:#17120f;
}
.lhs-store-cart-payment-panel::before{
content:"";
position:absolute;
inset:auto -34px -82px auto;
width:180px;
height:180px;
border-radius:50%;
background:radial-gradient(circle,rgba(210,173,114,.12) 0%,rgba(210,173,114,0) 72%);
pointer-events:none;
}
.lhs-store-cart-payment-panel-head{
position:relative;
z-index:1;
display:block;
margin-bottom:16px;
}
.lhs-store-cart-payment-panel-head > div{
display:flex;
flex-direction:column;
gap:7px;
}
.lhs-store-cart-payment-panel-head span{
color:#b48545;
font-size:10px;
font-weight:800;
letter-spacing:.24em;
}
.lhs-store-cart-payment-panel-head strong{
max-width:none;
color:#17120f;
font-family:Georgia,"Times New Roman",serif;
font-size:18px;
font-weight:400;
line-height:1.18;
}
.lhs-store-cart-payment-panel-head small{
display:block;
margin-top:8px;
color:rgba(17,17,17,.56);
font-size:10px;
line-height:1.5;
text-align:left;
}
.lhs-store-cart-payment-grid{
position:relative;
z-index:1;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:10px;
}
.lhs-store-cart-payment-card{
min-width:0;
min-height:92px;
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center;
gap:10px;
padding:14px 15px 13px;
border:1px solid rgba(17,17,17,.10);
border-radius:21px;
text-decoration:none !important;
transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease,color .22s ease;
}
.lhs-store-cart-payment-card span{
color:#b48545;
font-size:9px;
font-weight:800;
letter-spacing:.22em;
}
.lhs-store-cart-payment-card strong{
display:flex;
align-items:center;
min-height:34px;
font-size:14px;
font-weight:800;
letter-spacing:.08em;
line-height:1.1;
}
.lhs-store-cart-payment-card-checkout{
grid-column:1 / -1;
min-height:78px;
display:grid;
grid-template-columns:auto 1fr;
align-items:center;
column-gap:18px;
background:linear-gradient(135deg,#171310 0%,#2b221b 100%);
color:#f4e2bf;
border-color:rgba(26,20,15,.92);
box-shadow:0 12px 22px rgba(19,14,10,.14);
}
.lhs-store-cart-payment-card-checkout span{
color:#d7b77b;
}
.lhs-store-cart-payment-card-tabby,
.lhs-store-cart-payment-card-tamara{
background:linear-gradient(180deg,#ffffff 0%,#fbf7f0 100%);
color:#17120f;
border-color:rgba(17,17,17,.10);
box-shadow:0 8px 18px rgba(24,18,14,.04);
}
.lhs-store-cart-payment-card:hover,
.lhs-store-cart-payment-card:focus-visible{
transform:translateY(-3px);
border-color:rgba(180,133,69,.50);
box-shadow:0 16px 28px rgba(24,18,14,.10);
outline:none;
}
.lhs-store-cart-payment-card-tabby:hover,
.lhs-store-cart-payment-card-tamara:hover,
.lhs-store-cart-payment-card-tabby:focus-visible,
.lhs-store-cart-payment-card-tamara:focus-visible{
background:linear-gradient(180deg,#ffffff 0%,#f8f1e6 100%);
}
.lhs-store-cart-payment-brand{
display:inline-flex;
align-items:center;
line-height:1;
}
.lhs-store-cart-payment-logo{
display:block;
width:auto;
max-width:100%;
}
.lhs-store-cart-payment-logo-tabby{height:34px;}
.lhs-store-cart-payment-logo-tamara{height:27px;}
.lhs-store-cart-payment-panel > p{
position:relative;
z-index:1;
margin:13px 0 0;
color:rgba(17,17,17,.52);
font-size:9px;
line-height:1.55;
}
.lhs-store-cart-continue,
.lhs-store-cart-support{
width:100%;
min-height:52px;
display:flex;
align-items:center;
justify-content:center;
font-size:11px;
font-weight:800;
letter-spacing:.16em;
}
.lhs-store-cart-continue{
margin-top:12px;
border:1px solid #111;
background:#fff;
color:#111;
}
.lhs-store-cart-support{
min-height:40px;
margin-top:7px;
color:#777;
}
.lhs-support-strip .contact-strip-card h2{
text-transform:none;
}
@media(max-width:760px){
.lhs-floating-cart{
right:16px;
bottom:82px;
width:54px;
height:54px;
}
.lhs-store-cart-drawer{
width:100vw;
}
.lhs-store-cart-head{
min-height:90px;
padding:20px;
}
.lhs-store-cart-items{
padding-left:18px;
padding-right:18px;
}
.lhs-store-cart-summary{
padding-left:20px;
padding-right:20px;
}
.lhs-store-cart-payment-panel{
padding:18px 16px 15px;
border-radius:23px;
}
.lhs-store-cart-payment-panel-head{
margin-bottom:14px;
}
.lhs-store-cart-payment-panel-head strong{
font-size:18px;
}
.lhs-store-cart-payment-panel-head small{
margin-top:6px;
font-size:9px;
}
.lhs-store-cart-payment-grid{
gap:9px;
}
.lhs-store-cart-payment-card{
min-height:86px;
padding:13px 13px 12px;
border-radius:18px;
}
.lhs-store-cart-payment-card-checkout{
min-height:72px;
column-gap:14px;
}
.lhs-store-cart-payment-logo-tabby{height:27px;}
.lhs-store-cart-payment-logo-tamara{height:22px;}
}
/* =========================================================
Storefront UI cleanup — prevent floating controls overlap
========================================================= */
/* Keep the three floating controls in one clean vertical stack. */
.lhs-quick-actions{
right:24px !important;
bottom:24px !important;
z-index:1504 !important;
}
.lhs-floating-cart{
right:24px !important;
bottom:104px !important;
z-index:1505 !important;
}
.lhs-back-to-top{
right:31px !important;
bottom:178px !important;
z-index:1503 !important;
}
/* Hide page-level floating controls while the cart drawer is open. */
body.lhs-cart-open .lhs-quick-actions,
body.lhs-cart-open .lhs-floating-cart,
body.lhs-cart-open .lhs-back-to-top{
opacity:0 !important;
visibility:hidden !important;
pointer-events:none !important;
}
/* Drawer header must remain fully visible and never clip the title. */
.lhs-store-cart-head{
flex:0 0 auto !important;
min-height:112px !important;
padding:
max(24px, env(safe-area-inset-top))
28px
22px !important;
overflow:visible !important;
background:#fff;
}
.lhs-store-cart-head > div{
min-width:0;
padding-top:2px;
}
.lhs-store-cart-head p{
line-height:1.2 !important;
}
.lhs-store-cart-head h2{
line-height:1.08 !important;
white-space:normal;
}
.lhs-store-cart-head button{
flex:0 0 auto;
}
/* Avoid the cart footer colliding with browser or device safe areas. */
.lhs-store-cart-summary{
flex:0 0 auto;
padding-bottom:max(24px, env(safe-area-inset-bottom)) !important;
}
/* Cleaner customer-support section for storefront use. */
.lhs-support-strip{
position:relative;
align-items:stretch !important;
gap:28px !important;
padding:82px 40px 74px !important;
background:linear-gradient(180deg,#fcfbf8 0%,#f6f1e8 52%,#f1ebe2 100%);
}
.lhs-support-strip::before{
content:"";
position:absolute;
inset:0;
background:
radial-gradient(circle at 10% 18%, rgba(210,173,114,.10) 0%, rgba(210,173,114,0) 24%),
radial-gradient(circle at 88% 74%, rgba(210,173,114,.10) 0%, rgba(210,173,114,0) 22%);
pointer-events:none;
}
.lhs-support-strip .contact-strip-card{
position:relative;
overflow:hidden;
isolation:isolate;
min-height:344px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:flex-start;
padding:38px 32px 30px;
border:1px solid rgba(26,20,14,.08);
border-radius:34px;
background:linear-gradient(180deg,rgba(255,253,249,.96) 0%,rgba(248,243,235,.98) 100%);
box-shadow:0 20px 48px rgba(27,20,13,.08);
text-align:center;
transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.lhs-support-strip .contact-strip-card::before{
content:"";
position:absolute;
inset:0 0 auto;
height:4px;
background:linear-gradient(90deg,#ddc28d 0%,#a8742f 52%,#ddc28d 100%);
opacity:.78;
}
.lhs-support-strip .contact-strip-card::after{
content:"";
position:absolute;
inset:auto -36px -60px auto;
width:170px;
height:170px;
border-radius:50%;
background:radial-gradient(circle, rgba(210,173,114,.18) 0%, rgba(210,173,114,0) 72%);
pointer-events:none;
z-index:-1;
}
.lhs-support-strip .contact-strip-card:hover{
transform:translateY(-8px);
border-color:rgba(168,116,47,.20);
box-shadow:0 28px 56px rgba(25,18,11,.13);
}
.lhs-support-strip .contact-icon{
position:relative;
overflow:hidden;
display:flex;
align-items:center;
justify-content:center;
width:108px;
height:108px;
margin:0 0 18px;
border:1px solid rgba(210,173,114,.18);
border-radius:30px;
background:
radial-gradient(circle at 50% 36%, rgba(245,222,184,.14) 0%, rgba(245,222,184,0) 34%),
linear-gradient(160deg,#1b1511 0%,#241b16 48%,#171210 100%);
box-shadow:0 18px 34px rgba(20,14,10,.16), inset 0 1px 0 rgba(255,246,229,.08);
color:#efd5a2;
transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.lhs-support-strip .contact-icon::before{
content:"";
position:absolute;
inset:14px;
border-radius:24px;
border:1px solid rgba(240,215,174,.08);
background:radial-gradient(circle at 50% 25%, rgba(255,248,232,.06) 0%, rgba(255,248,232,0) 56%);
}
.lhs-support-strip .contact-icon::after{
content:"";
position:absolute;
left:18px;
right:18px;
top:16px;
height:1px;
background:linear-gradient(90deg, rgba(255,238,207,0) 0%, rgba(255,238,207,.28) 50%, rgba(255,238,207,0) 100%);
}
.lhs-support-strip .contact-icon svg{
position:relative;
z-index:1;
width:34px;
height:34px;
fill:none;
stroke:currentColor;
stroke-width:1.8;
}
.lhs-support-strip .contact-strip-card:hover .contact-icon{
transform:translateY(-3px) scale(1.02);
border-color:rgba(210,173,114,.28);
box-shadow:0 22px 40px rgba(20,14,10,.20), inset 0 1px 0 rgba(255,246,229,.10);
}
.lhs-support-strip .lhs-support-kicker{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:30px;
padding:0 14px;
margin:0 0 14px;
border:1px solid rgba(168,116,47,.16);
border-radius:999px;
background:rgba(255,251,244,.92);
color:#a8742f;
font-size:11px;
font-weight:800;
letter-spacing:.22em;
text-transform:uppercase;
}
.lhs-support-strip .contact-strip-card h2{
margin:0 0 14px;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(28px,2.1vw,38px);
font-weight:400;
line-height:1.1;
letter-spacing:-.03em;
color:#17120f;
}
.lhs-support-strip .contact-strip-card p{
max-width:390px;
margin:0;
color:rgba(17,17,17,.74);
font-size:17px;
line-height:1.78;
}
.lhs-support-strip .contact-strip-card p:last-child{
margin-top:auto;
padding-top:24px;
}
.lhs-support-strip .contact-strip-card p:last-child a{
display:inline-flex;
align-items:center;
justify-content:center;
gap:10px;
min-height:56px;
padding:0 24px;
border:1px solid rgba(168,116,47,.26);
border-radius:999px;
background:linear-gradient(135deg,#171411 0%,#2a211b 100%);
color:#f0d7ae !important;
font-size:14px;
font-weight:800;
letter-spacing:.16em;
text-transform:uppercase;
text-decoration:none !important;
box-shadow:0 16px 32px rgba(20,15,10,.14);
transition:transform .24s ease, box-shadow .24s ease, background .24s ease, border-color .24s ease;
}
.lhs-support-strip .contact-strip-card p:last-child a::after{
content:"→";
font-size:14px;
line-height:1;
transform:translateX(0);
transition:transform .24s ease;
}
.lhs-support-strip .contact-strip-card p:last-child a:hover{
transform:translateY(-2px);
border-color:rgba(210,173,114,.44);
box-shadow:0 20px 38px rgba(20,15,10,.18);
background:linear-gradient(135deg,#1d1712 0%,#111 100%);
}
.lhs-support-strip .contact-strip-card p:last-child a:hover::after{
transform:translateX(2px);
}
.lhs-support-strip .lhs-support-card-email p:last-child a{
text-transform:none;
letter-spacing:.02em;
font-size:15px;
}
.lhs-support-strip .lhs-support-card-email p:last-child a::after{
content:"↗";
}
@media(max-width:760px){
.lhs-support-strip{
padding:58px 20px 54px !important;
gap:18px !important;
}
.lhs-support-strip .contact-strip-card{
min-height:auto;
padding:30px 22px 24px;
border-radius:26px;
}
.lhs-support-strip .contact-icon{
width:92px;
height:92px;
margin-bottom:16px;
border-radius:26px;
}
.lhs-support-strip .contact-icon::before{
inset:12px;
border-radius:20px;
}
.lhs-support-strip .contact-icon::after{
left:14px;
right:14px;
top:14px;
}
.lhs-support-strip .lhs-support-kicker{
font-size:10px;
letter-spacing:.18em;
padding:0 12px;
margin-bottom:12px;
}
.lhs-support-strip .contact-strip-card h2{
font-size:30px;
}
.lhs-support-strip .contact-strip-card p{
font-size:16px;
line-height:1.7;
}
.lhs-support-strip .contact-strip-card p:last-child{
margin-top:18px;
padding-top:18px;
}
.lhs-support-strip .contact-strip-card p:last-child a{
min-height:52px;
width:100%;
padding:0 18px;
letter-spacing:.12em;
}
.lhs-quick-actions{
right:16px !important;
bottom:18px !important;
}
.lhs-floating-cart{
right:16px !important;
bottom:91px !important;
}
.lhs-back-to-top{
right:22px !important;
bottom:157px !important;
}
.lhs-store-cart-head{
min-height:94px !important;
padding:
max(18px, env(safe-area-inset-top))
20px
18px !important;
}
.lhs-store-cart-head h2{
font-size:27px !important;
}
}
/* =========================================================
Product image hover zoom
========================================================= */
.lhs-product-main-image-live.lhs-product-zoom-enabled{
position:relative;
cursor:zoom-in;
}
.lhs-product-main-image-live.lhs-product-zoom-enabled::after{
content:"HOVER TO ZOOM";
position:absolute;
right:16px;
bottom:16px;
z-index:3;
padding:8px 11px;
border:1px solid rgba(255,255,255,.58);
background:rgba(12,10,8,.68);
color:#fff;
font-size:9px;
font-weight:800;
letter-spacing:.16em;
backdrop-filter:blur(8px);
opacity:.82;
pointer-events:none;
transition:opacity .25s ease;
}
.lhs-product-main-image-live.lhs-product-zoom-enabled:hover::after{
opacity:0;
}
.lhs-product-main-image-live.lhs-product-zoom-enabled img{
will-change:transform;
transition:transform .22s ease,opacity .22s ease;
}
.lhs-product-main-image-live.lhs-product-zoom-enabled.is-zooming img{
transform:scale(2.25);
}
@media(hover:none), (pointer:coarse){
.lhs-product-main-image-live.lhs-product-zoom-enabled::after{
display:none;
}
.lhs-product-main-image-live.lhs-product-zoom-enabled.is-zooming img{
transform:none;
}
}
html[dir="rtl"] .lhs-product-main-image-live.lhs-product-zoom-enabled::after{
right:auto;
left:16px;
}
/* =========================================================
Shopping bag must always appear above the complete header
========================================================= */
#lhsStoreCart{
position:relative;
z-index:2147483000;
}
.lhs-store-cart-overlay{
position:fixed !important;
inset:0 !important;
z-index:2147483001 !important;
}
.lhs-store-cart-drawer{
position:fixed !important;
top:0 !important;
right:0 !important;
bottom:0 !important;
height:100dvh !important;
z-index:2147483002 !important;
isolation:isolate;
}
.lhs-store-cart-head{
position:relative;
z-index:2;
background:#fff;
}
/* Prevent sticky headers and menus from covering the open drawer. */
body.lhs-cart-open .main-header,
body.lhs-cart-open .mega-header,
body.lhs-cart-open .topbar,
body.lhs-cart-open .announcement-bar,
body.lhs-cart-open .mobile-nav{
z-index:1 !important;
}
/* Keep all drawer controls inside its own top layer. */
.lhs-store-cart-drawer *{
box-sizing:border-box;
}
/* LHS custom hair color dropdown */
.lhs-product-select-wrap{position:relative;display:block;}
.lhs-product-select-wrap select{width:100%;}
.lhs-color-select-native{position:absolute!important;opacity:0!important;pointer-events:none!important;inset:0!important;width:100%!important;height:100%!important;}
.lhs-color-dropdown{position:relative;width:100%;}
.lhs-color-dropdown-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 18px;border:1px solid rgba(29,29,27,.14);border-radius:22px;background:linear-gradient(180deg,#fffdfb 0%,#fff 100%);color:#1d1d1b;cursor:pointer;box-shadow:0 14px 30px rgba(0,0,0,.06);transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;}
.lhs-color-dropdown-btn:hover,.lhs-color-dropdown.is-open .lhs-color-dropdown-btn{border-color:#b4904d;box-shadow:0 16px 34px rgba(180,144,77,.18);transform:translateY(-1px);}
.lhs-color-dropdown-btn:focus-visible{outline:2px solid #b4904d;outline-offset:3px;}
.lhs-color-dropdown-selected{display:flex;align-items:center;gap:14px;min-width:0;}
.lhs-color-dropdown-thumb{width:58px;height:58px;border-radius:16px;object-fit:cover;flex:0 0 58px;background:#f3f3f0;border:1px solid rgba(29,29,27,.08);box-shadow:0 8px 18px rgba(0,0,0,.06);}
.lhs-color-dropdown-labels{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0;}
.lhs-color-dropdown-kicker{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8c857a;}
.lhs-color-dropdown-value{font-size:15px;font-weight:600;color:#1d1d1b;line-height:1.2;}
.lhs-color-dropdown-caret{flex:0 0 auto;color:#8c857a;font-size:18px;line-height:1;transition:transform .2s ease;}
.lhs-color-dropdown.is-open .lhs-color-dropdown-caret{transform:rotate(180deg);}
.lhs-color-dropdown-menu{position:absolute;top:calc(100% + 10px);left:0;right:0;z-index:30;background:#fffdf9;border:1px solid rgba(29,29,27,.10);border-radius:24px;box-shadow:0 22px 42px rgba(0,0,0,.14);padding:10px;display:none;max-height:420px;overflow:auto;}
.lhs-color-dropdown.is-open .lhs-color-dropdown-menu{display:block;}
.lhs-color-option{width:100%;display:flex;align-items:center;gap:14px;padding:12px;border:none;background:transparent;border-radius:18px;cursor:pointer;text-align:left;transition:background .2s ease, transform .2s ease, box-shadow .2s ease;}
.lhs-color-option:hover,.lhs-color-option:focus-visible{background:#f8f4ed;box-shadow:0 10px 20px rgba(55,39,21,.06);outline:none;}
.lhs-color-option.is-active{background:#f5efe4;}
.lhs-color-option .lhs-color-dropdown-thumb{width:48px;height:48px;flex-basis:48px;}
.lhs-color-option-meta{display:flex;flex-direction:column;gap:2px;min-width:0;}
.lhs-color-option-title{font-size:15px;font-weight:600;color:#1d1d1b;line-height:1.2;}
.lhs-color-option-subtitle{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#9b9489;}
@media (max-width:640px){
.lhs-color-dropdown-btn{padding:11px 14px;border-radius:16px;}
.lhs-color-dropdown-thumb{width:50px;height:50px;flex-basis:50px;}
.lhs-color-option .lhs-color-dropdown-thumb{width:42px;height:42px;flex-basis:42px;}
}
/* =========================================================
Hair color thumbnails + live main-image preview
========================================================= */
.lhs-color-preview-section{
margin-top:20px;
padding-top:18px;
border-top:1px solid rgba(29,29,27,.10);
}
.lhs-color-preview-heading{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin-bottom:12px;
}
.lhs-color-preview-title{
font-size:11px;
font-weight:800;
letter-spacing:.18em;
color:#2a241f;
}
.lhs-color-preview-selected{
font-size:12px;
color:#8b7a68;
}
.lhs-color-preview-grid{
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
gap:10px;
}
.lhs-color-preview-card{
appearance:none;
display:flex;
flex-direction:column;
align-items:center;
gap:8px;
width:100%;
padding:9px 9px 11px;
border:1px solid rgba(29,29,27,.10);
border-radius:16px;
background:linear-gradient(180deg,#fffdfa 0%,#fff 100%);
cursor:pointer;
transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.lhs-color-preview-card:hover,
.lhs-color-preview-card:focus-visible{
transform:translateY(-2px);
border-color:#b58a47;
box-shadow:0 10px 24px rgba(54,39,22,.12);
outline:none;
}
.lhs-color-preview-card.is-active{
border-color:#a8742f;
background:#fbf6ee;
box-shadow:0 0 0 2px rgba(181,138,71,.16),0 10px 25px rgba(54,39,22,.10);
}
.lhs-color-preview-image-wrap{
position:relative;
display:block;
width:100%;
aspect-ratio:1/1;
overflow:hidden;
border-radius:10px;
background:#f5f3ef;
}
.lhs-color-preview-image-wrap img{
width:100%;
height:100%;
display:block;
object-fit:cover;
}
.lhs-color-preview-code{
font-size:12px;
font-weight:700;
line-height:1;
color:#231f1b;
}
@media(max-width:900px){
.lhs-color-preview-grid{grid-template-columns:repeat(5,minmax(68px,1fr));overflow-x:auto;padding-bottom:5px;}
.lhs-color-preview-card{min-width:78px;}
}
@media(max-width:560px){
.lhs-color-preview-heading{align-items:flex-start;flex-direction:column;gap:5px;}
.lhs-color-preview-grid{grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;}
.lhs-color-preview-card{min-width:0;}
}
/* LHS header: MEN is a menu trigger only, not a page link. */
.mega-item.menu-open > .mega-panel{
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translateY(0);
}
.mega-item.menu-open > .mega-trigger::after{
transform:scaleX(1);
}
/* =========================================================
LHS fixed product price + checkout
========================================================= */
.lhs-lace-card-price{
display:block;
margin-top:16px;
font-family:Georgia,"Times New Roman",serif;
font-size:24px;
font-weight:400;
letter-spacing:-.02em;
color:#a8742f;
}
.lhs-checkout-body{
background:#f6f2eb;
}
.lhs-checkout-page{
padding:clamp(72px,8vw,120px) 0 110px;
background:
radial-gradient(circle at 12% 12%,rgba(194,159,103,.12),transparent 34%),
linear-gradient(180deg,#fbfaf7 0%,#f3ede4 100%);
}
.lhs-checkout-hero{
width:min(1320px,calc(100% - 72px));
margin:0 auto 46px;
text-align:center;
}
.lhs-checkout-hero .eyebrow{
margin:0 0 12px;
color:#a8742f;
font-size:11px;
font-weight:800;
letter-spacing:.24em;
}
.lhs-checkout-hero h1{
margin:0;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(48px,6vw,84px);
font-weight:400;
letter-spacing:-.045em;
color:#16120f;
}
.lhs-checkout-hero > p:not(.eyebrow){
max-width:690px;
margin:20px auto 0;
color:rgba(23,18,15,.62);
font-size:16px;
line-height:1.7;
}
.lhs-checkout-steps{
display:flex;
align-items:center;
justify-content:center;
gap:12px;
flex-wrap:wrap;
margin-top:30px;
}
.lhs-checkout-steps span{
display:inline-flex;
align-items:center;
gap:9px;
min-height:42px;
padding:0 16px;
border:1px solid rgba(23,18,15,.10);
border-radius:999px;
background:rgba(255,255,255,.62);
color:rgba(23,18,15,.58);
font-size:11px;
font-weight:700;
letter-spacing:.09em;
text-transform:uppercase;
}
.lhs-checkout-steps b{
display:grid;
place-items:center;
width:23px;
height:23px;
border-radius:50%;
background:#ece4d7;
color:#5d4931;
font-size:10px;
}
.lhs-checkout-steps .is-active{
border-color:rgba(168,116,47,.46);
background:#fff8ed;
color:#241b13;
box-shadow:0 10px 24px rgba(78,54,27,.08);
}
.lhs-checkout-steps .is-active b{
background:#a8742f;
color:#fff;
}
.lhs-checkout-shell{
width:min(1320px,calc(100% - 72px));
margin:0 auto;
display:grid;
grid-template-columns:minmax(0,1.25fr) minmax(360px,.75fr);
gap:26px;
align-items:start;
}
.lhs-checkout-form{
display:flex;
flex-direction:column;
gap:20px;
}
.lhs-checkout-panel,
.lhs-checkout-notes{
border:1px solid rgba(28,22,17,.08);
border-radius:30px;
background:rgba(255,255,255,.90);
box-shadow:0 22px 48px rgba(49,34,18,.07);
}
.lhs-checkout-panel{
padding:28px;
}
.lhs-checkout-panel-heading{
display:flex;
align-items:flex-start;
gap:16px;
margin-bottom:24px;
}
.lhs-checkout-panel-heading > span{
display:grid;
place-items:center;
width:44px;
height:44px;
flex:0 0 44px;
border-radius:14px;
background:linear-gradient(145deg,#231c16,#0f0d0b);
color:#e7c895;
font-size:12px;
font-weight:800;
letter-spacing:.08em;
}
.lhs-checkout-panel-heading h2{
margin:0;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(24px,2.4vw,34px);
font-weight:400;
color:#18130f;
}
.lhs-checkout-panel-heading p{
margin:7px 0 0;
color:rgba(24,19,15,.56);
font-size:13px;
line-height:1.55;
}
.lhs-checkout-fields{
display:grid;
gap:16px;
}
.lhs-checkout-fields-two{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.lhs-checkout-field-wide{
grid-column:1 / -1;
}
.lhs-checkout-fields label,
.lhs-checkout-notes{
display:flex;
flex-direction:column;
gap:9px;
}
.lhs-checkout-fields label > span,
.lhs-checkout-notes > span{
color:#2c241d;
font-size:11px;
font-weight:800;
letter-spacing:.12em;
text-transform:uppercase;
}
.lhs-checkout-fields input,
.lhs-checkout-fields select,
.lhs-checkout-notes textarea{
width:100%;
border:1px solid rgba(24,19,15,.13);
border-radius:18px;
background:#fffdf9;
color:#191511;
font:inherit;
transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.lhs-checkout-fields input,
.lhs-checkout-fields select{
min-height:58px;
padding:0 17px;
}
.lhs-checkout-notes{
padding:24px 28px;
}
.lhs-checkout-notes textarea{
min-height:120px;
padding:16px 17px;
resize:vertical;
}
.lhs-checkout-fields input:focus,
.lhs-checkout-fields select:focus,
.lhs-checkout-notes textarea:focus{
outline:none;
border-color:#a8742f;
background:#fff;
box-shadow:0 0 0 3px rgba(168,116,47,.12);
}
.lhs-payment-options{
display:grid;
gap:13px;
}
.lhs-payment-option{
position:relative;
display:grid;
grid-template-columns:auto 1fr auto;
align-items:center;
gap:14px;
min-height:86px;
padding:16px 18px;
border:1px solid rgba(24,19,15,.11);
border-radius:22px;
background:#fffdf9;
cursor:pointer;
transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease;
}
.lhs-payment-option:hover{
transform:translateY(-2px);
border-color:rgba(168,116,47,.40);
box-shadow:0 12px 26px rgba(55,39,22,.08);
}
.lhs-payment-option.is-selected,
.lhs-payment-option:has(input:checked){
border-color:#a8742f;
background:linear-gradient(180deg,#fffaf1 0%,#f8efe0 100%);
box-shadow:0 0 0 2px rgba(168,116,47,.11),0 14px 28px rgba(55,39,22,.08);
}
.lhs-payment-option input{
position:absolute;
opacity:0;
pointer-events:none;
}
.lhs-payment-option-mark{
display:grid;
place-items:center;
width:22px;
height:22px;
border:1.5px solid rgba(24,19,15,.34);
border-radius:50%;
background:#fff;
}
.lhs-payment-option.is-selected .lhs-payment-option-mark,
.lhs-payment-option:has(input:checked) .lhs-payment-option-mark{
border:6px solid #a8742f;
}
.lhs-payment-option-copy{
display:flex;
flex-direction:column;
gap:5px;
}
.lhs-payment-option-copy strong{
color:#17120f;
font-size:16px;
}
.lhs-payment-option-copy small{
color:rgba(23,18,15,.58);
font-size:12px;
line-height:1.5;
}
.lhs-payment-badge{
min-width:76px;
padding:9px 10px;
border:1px solid rgba(24,19,15,.12);
border-radius:999px;
background:#fff;
color:#5e4930;
text-align:center;
font-size:9px;
letter-spacing:.14em;
}
.lhs-checkout-payment-note{
display:flex;
align-items:flex-start;
gap:12px;
margin-top:17px;
padding:14px 16px;
border-radius:18px;
background:#f1ebe2;
color:#5b4937;
}
.lhs-checkout-payment-note > span{
display:grid;
place-items:center;
width:22px;
height:22px;
flex:0 0 22px;
border-radius:50%;
background:#a8742f;
color:#fff;
font-family:Georgia,serif;
font-weight:700;
}
.lhs-checkout-payment-note p{
margin:0;
font-size:12px;
line-height:1.6;
}
.lhs-checkout-actions{
display:grid;
grid-template-columns:1fr auto;
gap:12px;
align-items:center;
}
.lhs-checkout-actions button{
min-height:70px;
padding:0 28px;
border:1px solid #111;
border-radius:24px;
background:linear-gradient(135deg,#201a15,#0d0c0a);
color:#efd4a7;
font-size:12px;
font-weight:800;
letter-spacing:.20em;
cursor:pointer;
box-shadow:0 20px 36px rgba(16,13,10,.18);
transition:transform .24s ease,box-shadow .24s ease,background .24s ease;
}
.lhs-checkout-actions button:hover:not(:disabled){
transform:translateY(-3px);
background:linear-gradient(135deg,#2e241b,#111);
box-shadow:0 24px 42px rgba(16,13,10,.23);
}
.lhs-checkout-actions button:disabled{
opacity:.45;
cursor:not-allowed;
}
.lhs-checkout-actions a{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:70px;
padding:0 22px;
border:1px solid rgba(24,19,15,.16);
border-radius:24px;
background:#fff;
color:#241c15;
font-size:11px;
font-weight:800;
letter-spacing:.12em;
}
.lhs-checkout-message{
display:none;
padding:17px 18px;
border-radius:18px;
font-size:13px;
line-height:1.55;
}
.lhs-checkout-message.is-success,
.lhs-checkout-message.is-error{
display:flex;
flex-direction:column;
gap:4px;
}
.lhs-checkout-message.is-success{
border:1px solid rgba(73,115,67,.24);
background:#eef5ec;
color:#355332;
}
.lhs-checkout-message.is-error{
border:1px solid rgba(151,65,51,.22);
background:#f9eeeb;
color:#7b352c;
}
.lhs-checkout-summary{
position:sticky;
top:160px;
overflow:hidden;
border:1px solid rgba(24,19,15,.09);
border-radius:32px;
background:#fff;
box-shadow:0 28px 54px rgba(49,34,18,.10);
}
.lhs-checkout-summary-head{
padding:28px 28px 22px;
border-bottom:1px solid rgba(24,19,15,.08);
background:linear-gradient(135deg,#201a15 0%,#0e0c0a 100%);
}
.lhs-checkout-summary-head p{
margin:0 0 7px;
color:#caa56b;
font-size:10px;
font-weight:800;
letter-spacing:.20em;
}
.lhs-checkout-summary-head h2{
margin:0;
color:#fff9ef;
font-family:Georgia,"Times New Roman",serif;
font-size:32px;
font-weight:400;
}
.lhs-checkout-items{
max-height:500px;
overflow:auto;
padding:8px 24px;
}
.lhs-checkout-item{
display:grid;
grid-template-columns:78px minmax(0,1fr) auto;
gap:14px;
align-items:center;
padding:18px 0;
border-bottom:1px solid rgba(24,19,15,.08);
}
.lhs-checkout-item:last-child{
border-bottom:0;
}
.lhs-checkout-item-image{
position:relative;
width:78px;
height:78px;
overflow:visible;
border:1px solid rgba(24,19,15,.08);
border-radius:19px;
background:#f5f0e8;
}
.lhs-checkout-item-image img{
width:100%;
height:100%;
object-fit:cover;
border-radius:18px;
}
.lhs-checkout-item-image > span{
display:grid;
place-items:center;
width:100%;
height:100%;
font-family:Georgia,serif;
}
.lhs-checkout-item-image b{
position:absolute;
top:-8px;
right:-8px;
display:grid;
place-items:center;
width:25px;
height:25px;
border-radius:50%;
background:#a8742f;
color:#fff;
font-size:10px;
}
.lhs-checkout-item-copy h3{
margin:0;
color:#17120f;
font-size:14px;
line-height:1.35;
}
.lhs-checkout-item-copy p{
margin:6px 0 0;
color:rgba(23,18,15,.54);
font-size:10px;
line-height:1.45;
}
.lhs-checkout-item-copy small{
display:block;
margin-top:7px;
color:#8c6737;
font-size:10px;
font-weight:700;
}
.lhs-checkout-item > strong{
color:#201810;
font-family:Georgia,"Times New Roman",serif;
font-size:15px;
font-weight:400;
white-space:nowrap;
}
.lhs-checkout-item-remove{
appearance:none;
display:inline-flex;
align-items:center;
gap:6px;
margin-top:10px;
padding:0;
border:0;
background:transparent;
color:rgba(23,18,15,.52);
font-size:10px;
font-weight:700;
letter-spacing:.10em;
text-transform:uppercase;
cursor:pointer;
transition:color .2s ease,transform .2s ease;
}
.lhs-checkout-item-remove span{
display:grid;
place-items:center;
width:17px;
height:17px;
border:1px solid rgba(23,18,15,.18);
border-radius:50%;
font-size:13px;
line-height:1;
}
.lhs-checkout-item-remove:hover,
.lhs-checkout-item-remove:focus-visible{
color:#9a542f;
transform:translateX(2px);
outline:none;
}
.lhs-checkout-item{
transition:opacity .16s ease,transform .16s ease;
}
.lhs-checkout-item.is-removing{
opacity:0;
transform:translateX(10px);
}
html[dir="rtl"] .lhs-checkout-item-remove:hover,
html[dir="rtl"] .lhs-checkout-item-remove:focus-visible{
transform:translateX(-2px);
}
html[dir="rtl"] .lhs-checkout-item.is-removing{
transform:translateX(-10px);
}
.lhs-checkout-totals{
padding:22px 28px;
border-top:1px solid rgba(24,19,15,.08);
background:#fcfaf6;
}
.lhs-checkout-totals > div{
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
padding:8px 0;
color:rgba(23,18,15,.66);
font-size:13px;
}
.lhs-checkout-totals strong{
color:#1e1711;
}
.lhs-checkout-totals .lhs-checkout-total{
margin-top:9px;
padding-top:18px;
border-top:1px solid rgba(24,19,15,.10);
color:#17120f;
font-size:17px;
font-weight:800;
}
.lhs-checkout-total strong{
font-family:Georgia,"Times New Roman",serif;
font-size:27px;
font-weight:400;
color:#a8742f;
}
.lhs-checkout-secure-note{
display:flex;
align-items:center;
gap:13px;
padding:18px 28px 24px;
background:#fcfaf6;
}
.lhs-checkout-secure-note span{
display:grid;
place-items:center;
width:46px;
height:46px;
flex:0 0 46px;
border-radius:15px;
background:#191511;
color:#d7b77d;
font-family:Georgia,serif;
font-size:13px;
}
.lhs-checkout-secure-note p{
margin:0;
color:rgba(23,18,15,.56);
font-size:11px;
line-height:1.55;
}
.lhs-checkout-empty{
padding:42px 10px;
text-align:center;
}
.lhs-checkout-empty > span{
display:grid;
place-items:center;
width:62px;
height:62px;
margin:0 auto 18px;
border-radius:20px;
background:#171310;
color:#d4b174;
font-family:Georgia,serif;
}
.lhs-checkout-empty h3{
margin:0 0 18px;
font-family:Georgia,"Times New Roman",serif;
font-size:24px;
font-weight:400;
}
.lhs-checkout-empty a{
display:inline-flex;
min-height:44px;
align-items:center;
justify-content:center;
padding:0 18px;
border:1px solid #171310;
border-radius:15px;
font-size:10px;
font-weight:800;
letter-spacing:.14em;
}
html[dir="rtl"] .lhs-checkout-panel-heading,
html[dir="rtl"] .lhs-checkout-payment-note,
html[dir="rtl"] .lhs-checkout-secure-note{
text-align:right;
}
html[dir="rtl"] .lhs-checkout-item-image b{
right:auto;
left:-8px;
}
@media(max-width:1050px){
.lhs-checkout-shell{
grid-template-columns:1fr;
}
.lhs-checkout-summary{
position:relative;
top:auto;
order:-1;
}
}
@media(max-width:720px){
.lhs-checkout-page{
padding:54px 0 76px;
}
.lhs-checkout-hero,
.lhs-checkout-shell{
width:min(100% - 28px,1320px);
}
.lhs-checkout-hero{
margin-bottom:30px;
}
.lhs-checkout-steps{
display:grid;
grid-template-columns:1fr;
}
.lhs-checkout-steps span{
justify-content:flex-start;
}
.lhs-checkout-panel{
padding:22px 18px;
border-radius:24px;
}
.lhs-checkout-fields-two{
grid-template-columns:1fr;
}
.lhs-checkout-field-wide{
grid-column:auto;
}
.lhs-payment-option{
grid-template-columns:auto 1fr;
}
.lhs-payment-badge{
grid-column:2;
justify-self:start;
}
.lhs-checkout-actions{
grid-template-columns:1fr;
}
.lhs-checkout-actions button,
.lhs-checkout-actions a{
min-height:62px;
border-radius:20px;
}
.lhs-checkout-summary{
border-radius:25px;
}
.lhs-checkout-item{
grid-template-columns:70px minmax(0,1fr);
}
.lhs-checkout-item-image{
width:70px;
height:70px;
}
.lhs-checkout-item > strong{
grid-column:2;
}
}
/* =========================================================
LHS premium payment options — Checkout / Tabby / Tamara
========================================================= */
.lhs-lace-card-price{
display:block;
margin-top:16px;
font-family:Georgia,"Times New Roman",serif;
font-size:22px;
font-weight:400;
letter-spacing:.01em;
color:#a8742f;
}
.lhs-product-payment-options{
position:relative;
overflow:hidden;
margin-top:4px;
padding:28px 28px 24px;
border:1px solid rgba(210,173,114,.18);
border-radius:32px;
background:linear-gradient(145deg,#16120f 0%,#211a15 45%,#0f0c0a 100%);
box-shadow:0 24px 48px rgba(18,13,9,.20);
color:#fff;
}
.lhs-product-payment-options::before{
content:"";
position:absolute;
inset:auto auto -110px -70px;
width:240px;
height:240px;
border-radius:50%;
background:radial-gradient(circle,rgba(210,173,114,.11) 0%,rgba(210,173,114,0) 72%);
pointer-events:none;
}
.lhs-product-payment-heading{
position:relative;
z-index:1;
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:20px;
margin-bottom:20px;
}
.lhs-product-payment-heading > div{
display:flex;
flex-direction:column;
gap:8px;
}
.lhs-product-payment-heading span{
color:#d2ad72;
font-size:10px;
font-weight:800;
letter-spacing:.24em;
}
.lhs-product-payment-heading strong{
font-family:Georgia,"Times New Roman",serif;
font-size:22px;
font-weight:400;
line-height:1.24;
max-width:260px;
}
.lhs-product-payment-heading small{
align-self:center;
color:rgba(227,212,188,.82);
font-size:11px;
line-height:1.6;
}
.lhs-product-payment-grid{
position:relative;
z-index:1;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px;
}
.lhs-direct-pay-btn{
min-width:0;
min-height:118px;
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center;
gap:12px;
padding:18px 18px 16px;
border:1px solid rgba(210,173,114,.18);
border-radius:24px;
cursor:pointer;
text-align:left;
transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease,color .22s ease;
}
.lhs-direct-pay-btn span{
color:#d2ad72;
font-size:9px;
font-weight:800;
letter-spacing:.22em;
opacity:1;
}
.lhs-direct-pay-btn strong{
font-size:14px;
font-weight:800;
letter-spacing:.08em;
line-height:1.1;
display:flex;
align-items:center;
min-height:40px;
}
.lhs-direct-pay-checkout{
background:linear-gradient(135deg,#f4e5c9 0%,#e1bd82 100%);
color:#17120f;
border-color:rgba(245,226,188,.78);
box-shadow:0 14px 28px rgba(0,0,0,.14);
}
.lhs-direct-pay-tabby,
.lhs-direct-pay-tamara{
background:linear-gradient(145deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,.03) 100%);
color:#f6f0e7;
border-color:rgba(210,173,114,.22);
box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.lhs-direct-pay-tabby strong,
.lhs-direct-pay-tamara strong{
font-family:Arial,Helvetica,sans-serif;
font-size:25px;
font-weight:800;
letter-spacing:-.06em;
text-transform:lowercase;
}
.lhs-direct-pay-btn:hover,
.lhs-direct-pay-btn:focus-visible{
transform:translateY(-3px);
border-color:rgba(226,190,129,.78);
box-shadow:0 18px 34px rgba(0,0,0,.24);
outline:none;
}
.lhs-direct-pay-tabby:hover,
.lhs-direct-pay-tamara:hover,
.lhs-direct-pay-tabby:focus-visible,
.lhs-direct-pay-tamara:focus-visible{
background:linear-gradient(145deg,rgba(255,255,255,.08) 0%,rgba(255,255,255,.04) 100%);
}
.lhs-brand-wordmark{
display:inline-flex;
align-items:center;
line-height:1;
}
.lhs-pay-logo,
.lhs-payment-logo,
.lhs-store-cart-payment-logo{
display:block;
width:auto;
max-width:100%;
object-fit:contain;
filter:none;
}
.lhs-pay-logo-tabby{height:42px;}
.lhs-pay-logo-tamara{height:33px;}
.lhs-payment-option-copy-brand{
gap:8px;
}
.lhs-payment-brand-title{
display:inline-flex;
align-items:center;
min-height:28px;
}
.lhs-payment-logo-tabby{height:28px;}
.lhs-payment-logo-tamara{height:23px;}
.lhs-payment-badge-muted{
min-width:88px;
color:#6e563a;
font-weight:700;
}
.lhs-store-cart-payment-brand{
padding:6px 10px !important;
}
.lhs-store-cart-payment-logo-tabby{height:18px;}
.lhs-store-cart-payment-logo-tamara{height:15px;}
@media (max-width:640px){
.lhs-product-payment-options{
padding:22px 18px 18px;
border-radius:26px;
}
.lhs-product-payment-heading{
gap:14px;
}
.lhs-product-payment-heading strong{
max-width:none;
}
.lhs-product-payment-grid{
gap:12px;
}
.lhs-direct-pay-btn{
min-height:106px;
padding:16px;
border-radius:20px;
}
.lhs-pay-logo-tabby{height:34px;}
.lhs-pay-logo-tamara{height:27px;}
.lhs-payment-logo-tabby{height:24px;}
.lhs-payment-logo-tamara{height:20px;}
}
.lhs-product-payment-options > p{
position:relative;
z-index:1;
margin:16px 0 0;
color:rgba(227,212,188,.56);
font-size:10px;
line-height:1.6;
}
/* =========================================================
Header shopping-bag count — synchronized with floating cart
========================================================= */
.cart-icon.lhs-header-cart-link{
position:relative !important;
overflow:visible !important;
isolation:isolate;
}
.lhs-header-cart-count{
position:absolute;
top:-9px;
right:-10px;
z-index:6;
display:flex;
align-items:center;
justify-content:center;
min-width:19px;
height:19px;
padding:0 5px;
border:2px solid #fff;
border-radius:999px;
background:linear-gradient(135deg,#c9964b 0%,#a66d25 100%);
box-shadow:0 5px 12px rgba(84,52,17,.28);
color:#fff;
font-family:Arial,Helvetica,sans-serif;
font-size:10px;
font-weight:800;
line-height:1;
letter-spacing:0;
opacity:1;
transform:scale(1);
transform-origin:center;
transition:opacity .2s ease,transform .2s ease;
pointer-events:none;
}
.lhs-header-cart-count.is-empty{
opacity:0;
transform:scale(.55);
}
.lhs-header-cart-count.is-updated,
.lhs-floating-cart-count.is-updated{
animation:lhsCartCountPulse .46s cubic-bezier(.2,.8,.2,1);
}
@keyframes lhsCartCountPulse{
0%{transform:scale(.72);}
48%{transform:scale(1.28);}
100%{transform:scale(1);}
}
@media(max-width:1160px){
.lhs-header-cart-count{
top:-8px;
right:-9px;
min-width:18px;
height:18px;
padding:0 4px;
font-size:9px;
}
}
/* =========================================================
Homepage hero slider — increased visual height
========================================================= */
.hero-slider,
.hero-slide,
.model-area{
height:560px !important;
min-height:560px !important;
max-height:560px !important;
}
@media(max-width:1160px){
.hero-slider,
.hero-slide,
.model-area{
height:500px !important;
min-height:500px !important;
max-height:500px !important;
}
}
@media(max-width:650px){
.hero-slider,
.hero-slide{
height:auto !important;
min-height:auto !important;
max-height:none !important;
}
.model-area{
height:380px !important;
min-height:380px !important;
max-height:380px !important;
}
}
/* =========================================================
How-to Guides page — full premium layout restoration
========================================================= */
body.content-subpage .guide-page-main{
overflow:hidden;
background:
radial-gradient(circle at 8% 8%, rgba(210,173,114,.10) 0%, rgba(210,173,114,0) 26%),
linear-gradient(180deg,#fbfaf7 0%,#f5f0e8 100%);
color:#17120f;
}
.guide-shell{
width:min(1180px,calc(100% - 56px));
margin:0 auto;
}
.guide-hero{
position:relative;
padding:96px 0 76px;
border-bottom:1px solid rgba(23,18,15,.08);
background:
radial-gradient(circle at 84% 16%, rgba(210,173,114,.14) 0%, rgba(210,173,114,0) 28%),
linear-gradient(145deg,#17130f 0%,#272019 55%,#14110e 100%);
color:#fff;
}
.guide-hero::before{
content:"LHS GUIDES";
position:absolute;
top:28px;
left:50%;
transform:translateX(-50%);
color:#d2ad72;
font-size:11px;
font-weight:800;
letter-spacing:.28em;
}
.guide-hero .guide-shell{
position:relative;
z-index:1;
text-align:center;
}
.guide-hero h1{
max-width:760px;
margin:0 auto 18px;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(46px,6vw,82px);
font-weight:400;
line-height:1.02;
letter-spacing:-.045em;
}
.guide-hero > .guide-shell > p{
max-width:780px;
margin:0 auto;
color:rgba(255,255,255,.72);
font-size:18px;
line-height:1.78;
}
.guide-hero h2{
margin:52px 0 22px;
color:#d2ad72;
font-size:11px;
font-weight:800;
letter-spacing:.24em;
text-transform:uppercase;
}
.guide-links-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
max-width:920px;
margin:0 auto;
}
.guide-link-stack{
display:grid;
gap:16px;
}
.guide-link-pill{
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
min-height:70px;
padding:0 24px;
border:1px solid rgba(255,255,255,.14);
border-radius:20px;
background:rgba(255,255,255,.055);
color:#fff;
font-size:14px;
font-weight:700;
letter-spacing:.02em;
text-decoration:none;
backdrop-filter:blur(8px);
transition:transform .24s ease,border-color .24s ease,background .24s ease,box-shadow .24s ease;
}
.guide-link-pill::after{
content:"→";
color:#d2ad72;
font-size:18px;
transition:transform .24s ease;
}
.guide-link-pill:hover{
transform:translateY(-3px);
border-color:rgba(210,173,114,.54);
background:rgba(255,255,255,.095);
box-shadow:0 18px 30px rgba(0,0,0,.18);
}
.guide-link-pill:hover::after{
transform:translateX(3px);
}
.guide-faq-sections{
padding:78px 0 88px;
}
.guide-faq-group{
display:grid;
grid-template-columns:minmax(230px,.34fr) minmax(0,1fr);
gap:42px;
padding:34px 0;
border-top:1px solid rgba(23,18,15,.10);
}
.guide-faq-group:first-child{
border-top:0;
padding-top:0;
}
.guide-faq-group > h2{
position:sticky;
top:148px;
align-self:start;
margin:5px 0 0;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(28px,3vw,42px);
font-weight:400;
line-height:1.13;
letter-spacing:-.03em;
color:#17120f;
}
.guide-faq-list{
display:grid;
gap:13px;
}
.guide-faq-item{
overflow:hidden;
border:1px solid rgba(23,18,15,.09);
border-radius:22px;
background:linear-gradient(180deg,#fffefa 0%,#faf6ef 100%);
box-shadow:0 12px 28px rgba(25,18,11,.05);
transition:border-color .24s ease,box-shadow .24s ease,transform .24s ease;
}
.guide-faq-item:hover{
transform:translateY(-2px);
border-color:rgba(168,116,47,.23);
box-shadow:0 18px 34px rgba(25,18,11,.08);
}
.guide-faq-item.open{
border-color:rgba(168,116,47,.30);
box-shadow:0 18px 38px rgba(25,18,11,.09);
}
.guide-faq-question{
appearance:none;
width:100%;
display:grid;
grid-template-columns:34px 1fr;
align-items:center;
gap:16px;
min-height:76px;
padding:18px 22px;
border:0;
background:transparent;
color:#17120f;
font:inherit;
font-size:17px;
font-weight:700;
line-height:1.45;
text-align:left;
cursor:pointer;
}
.guide-faq-question:focus-visible{
outline:2px solid rgba(168,116,47,.55);
outline-offset:-4px;
}
.guide-faq-icon{
position:relative;
width:34px;
height:34px;
border:1px solid rgba(168,116,47,.24);
border-radius:50%;
background:#fffaf1;
}
.guide-faq-icon::before,
.guide-faq-icon::after{
content:"";
position:absolute;
top:50%;
left:50%;
width:12px;
height:1.5px;
background:#a8742f;
transform:translate(-50%,-50%);
transition:transform .22s ease,opacity .22s ease;
}
.guide-faq-icon::after{
transform:translate(-50%,-50%) rotate(90deg);
}
.guide-faq-item.open .guide-faq-icon::after{
opacity:0;
transform:translate(-50%,-50%) rotate(0deg);
}
.guide-faq-answer{
max-height:0;
overflow:hidden;
opacity:0;
transition:max-height .36s ease,opacity .28s ease,padding .28s ease;
}
.guide-faq-answer p{
margin:0;
padding:0 22px 0 72px;
color:rgba(23,18,15,.66);
font-size:16px;
line-height:1.78;
}
.guide-faq-item.open .guide-faq-answer{
max-height:360px;
opacity:1;
padding-bottom:23px;
}
.guide-order-cta{
padding:0 0 94px;
}
.guide-order-card{
display:grid;
grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
overflow:hidden;
min-height:470px;
border:1px solid rgba(23,18,15,.10);
border-radius:34px;
background:linear-gradient(145deg,#17130f 0%,#241c16 100%);
box-shadow:0 30px 64px rgba(24,17,11,.16);
}
.guide-order-copy{
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center;
padding:58px 58px 54px;
color:#fff;
}
.guide-order-copy::before{
content:"CUSTOM ORDER";
margin-bottom:18px;
color:#d2ad72;
font-size:11px;
font-weight:800;
letter-spacing:.24em;
}
.guide-order-copy h2{
max-width:520px;
margin:0 0 18px;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(38px,4.4vw,62px);
font-weight:400;
line-height:1.04;
letter-spacing:-.04em;
}
.guide-order-copy p{
max-width:560px;
margin:0;
color:rgba(255,255,255,.68);
font-size:17px;
line-height:1.75;
}
.guide-order-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:56px;
margin-top:20px;
padding:0 26px;
border:1px solid rgba(210,173,114,.44);
border-radius:999px;
background:linear-gradient(135deg,#f2dfbd 0%,#d7b275 100%);
color:#17120f;
font-size:13px;
font-weight:800;
letter-spacing:.16em;
text-transform:uppercase;
text-decoration:none;
transition:transform .24s ease,box-shadow .24s ease,background .24s ease;
}
.guide-order-btn:hover{
transform:translateY(-3px);
box-shadow:0 18px 34px rgba(0,0,0,.22);
background:linear-gradient(135deg,#f6e9d0 0%,#e0bd82 100%);
}
.guide-order-media{
min-height:470px;
background:#d8c3a5;
}
.guide-order-media img{
width:100%;
height:100%;
display:block;
object-fit:cover;
}
html[dir="rtl"] .guide-faq-question{
text-align:right;
}
html[dir="rtl"] .guide-link-pill::after{
content:"←";
}
@media(max-width:900px){
.guide-faq-group{
grid-template-columns:1fr;
gap:20px;
}
.guide-faq-group > h2{
position:static;
margin-top:0;
}
.guide-order-card{
grid-template-columns:1fr;
}
.guide-order-media{
min-height:390px;
}
}
@media(max-width:640px){
.guide-shell{
width:min(100% - 30px,1180px);
}
.guide-hero{
padding:78px 0 54px;
}
.guide-hero::before{
top:22px;
}
.guide-hero h1{
font-size:46px;
}
.guide-hero > .guide-shell > p{
font-size:16px;
}
.guide-hero h2{
margin-top:38px;
}
.guide-links-grid{
grid-template-columns:1fr;
gap:12px;
}
.guide-link-stack{
gap:12px;
}
.guide-link-pill{
min-height:62px;
padding:0 18px;
border-radius:17px;
font-size:13px;
}
.guide-faq-sections{
padding:52px 0 64px;
}
.guide-faq-group{
padding:28px 0;
}
.guide-faq-group > h2{
font-size:31px;
}
.guide-faq-item{
border-radius:18px;
}
.guide-faq-question{
grid-template-columns:30px 1fr;
gap:12px;
min-height:70px;
padding:16px;
font-size:15px;
}
.guide-faq-icon{
width:30px;
height:30px;
}
.guide-faq-answer p{
padding:0 16px 0 58px;
font-size:15px;
}
.guide-order-cta{
padding-bottom:66px;
}
.guide-order-card{
border-radius:26px;
}
.guide-order-copy{
padding:38px 24px 34px;
}
.guide-order-copy h2{
font-size:42px;
}
.guide-order-copy p{
font-size:16px;
}
.guide-order-media{
min-height:310px;
}
}
/* =========================================================
Hair Density & Material Guide — premium table layout
========================================================= */
body.content-subpage .density-page-main{
overflow:hidden;
background:linear-gradient(180deg,#fbfaf7 0%,#f4efe7 100%);
}
.density-shell{
width:min(1180px,calc(100% - 72px));
margin:0 auto;
}
.density-hero{
position:relative;
overflow:hidden;
padding:100px 0 78px;
border-bottom:1px solid rgba(210,173,114,.16);
background:
radial-gradient(circle at 15% 22%,rgba(210,173,114,.16) 0%,rgba(210,173,114,0) 28%),
linear-gradient(145deg,#16120f 0%,#241c16 54%,#100d0b 100%);
color:#fff;
}
.density-hero::before{
content:"";
position:absolute;
right:-120px;
bottom:-160px;
width:420px;
height:420px;
border-radius:50%;
background:radial-gradient(circle,rgba(210,173,114,.16) 0%,rgba(210,173,114,0) 70%);
pointer-events:none;
}
.density-kicker{
margin:0 0 18px !important;
color:#d2ad72 !important;
font-size:11px !important;
font-weight:800 !important;
letter-spacing:.26em !important;
text-transform:uppercase;
}
.density-hero h1{
max-width:820px;
margin:0 0 22px;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(48px,6.4vw,84px);
font-weight:400;
line-height:.98;
letter-spacing:-.045em;
}
.density-hero .density-shell > p:not(.density-kicker){
max-width:790px;
margin:0;
color:rgba(255,255,255,.68);
font-size:18px;
line-height:1.8;
}
.density-actions{
display:flex;
flex-wrap:wrap;
gap:12px;
margin-top:32px;
}
.density-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:56px;
padding:0 24px;
border-radius:999px;
font-size:12px;
font-weight:800;
letter-spacing:.16em;
text-transform:uppercase;
text-decoration:none;
transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease,background .24s ease,color .24s ease;
}
.density-btn:hover{
transform:translateY(-3px);
}
.density-btn-dark{
border:1px solid rgba(210,173,114,.44);
background:linear-gradient(135deg,#f2dfbd 0%,#d7b275 100%);
color:#17120f;
box-shadow:0 16px 32px rgba(0,0,0,.18);
}
.density-btn-light{
border:1px solid rgba(255,255,255,.20);
background:rgba(255,255,255,.05);
color:#fff;
}
.density-btn-light:hover{
border-color:rgba(210,173,114,.48);
background:rgba(255,255,255,.09);
}
.density-content{
display:grid;
gap:28px;
padding:70px 0 92px;
}
.density-section{
position:relative;
overflow:hidden;
padding:34px 34px 30px;
border:1px solid rgba(23,18,15,.09);
border-radius:32px;
background:linear-gradient(180deg,#fffdfa 0%,#f8f3eb 100%);
box-shadow:0 22px 50px rgba(25,18,11,.07);
}
.density-section::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:4px;
background:linear-gradient(90deg,#e0c797 0%,#a8742f 48%,#e0c797 100%);
opacity:.75;
}
.density-section h2{
margin:0 0 14px;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(32px,3.2vw,48px);
font-weight:400;
line-height:1.08;
letter-spacing:-.035em;
color:#17120f;
}
.density-section > p{
max-width:930px;
margin:0 0 26px;
color:rgba(23,18,15,.68);
font-size:16px;
line-height:1.8;
}
.density-notes{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px;
margin:0 0 24px;
}
.density-note{
display:flex;
flex-direction:column;
gap:8px;
min-height:138px;
padding:20px;
border:1px solid rgba(168,116,47,.14);
border-radius:22px;
background:rgba(255,255,255,.72);
color:rgba(23,18,15,.70);
font-size:14px;
line-height:1.65;
}
.density-note strong{
display:inline-flex;
align-items:center;
justify-content:center;
width:48px;
height:34px;
border-radius:999px;
background:#17120f;
color:#f0d7ae;
font-size:13px;
letter-spacing:.08em;
}
.density-table-wrap{
overflow:auto;
border:1px solid rgba(23,18,15,.10);
border-radius:24px;
background:#fff;
box-shadow:0 14px 30px rgba(25,18,11,.05);
-webkit-overflow-scrolling:touch;
}
.density-table{
width:100%;
min-width:900px;
border-collapse:separate;
border-spacing:0;
color:#231d18;
font-size:14px;
}
.density-table th,
.density-table td{
padding:17px 16px;
border-right:1px solid rgba(23,18,15,.08);
border-bottom:1px solid rgba(23,18,15,.08);
text-align:left;
vertical-align:middle;
white-space:normal;
line-height:1.5;
}
.density-table th:last-child,
.density-table td:last-child{
border-right:0;
}
.density-table tbody tr:last-child td{
border-bottom:0;
}
.density-table thead th{
position:sticky;
top:0;
z-index:2;
background:linear-gradient(180deg,#211a15 0%,#15110e 100%);
color:#f0d7ae;
font-size:11px;
font-weight:800;
letter-spacing:.08em;
text-transform:uppercase;
}
.density-table th:first-child,
.density-table td:first-child{
position:sticky;
left:0;
z-index:1;
min-width:124px;
font-weight:800;
}
.density-table thead th:first-child{
z-index:3;
}
.density-table tbody td:first-child{
background:#fbf6ee;
color:#a8742f;
}
.density-table tbody tr:nth-child(even) td:not(:first-child){
background:#fcfaf6;
}
.density-table tbody tr:hover td:not(:first-child){
background:#f8f0e4;
}
.density-warning,
.density-reference{
border-radius:28px;
padding:28px 30px;
}
.density-warning{
border:1px solid rgba(168,116,47,.24);
background:linear-gradient(135deg,#f3dfbb 0%,#e4c183 100%);
color:#211910;
font-size:16px;
line-height:1.75;
box-shadow:0 18px 36px rgba(116,77,29,.10);
}
.density-warning strong{
display:block;
margin-bottom:6px;
font-family:Georgia,"Times New Roman",serif;
font-size:24px;
font-weight:400;
}
.density-reference{
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
border:1px solid rgba(23,18,15,.10);
background:linear-gradient(145deg,#17130f 0%,#251d17 100%);
color:#fff;
box-shadow:0 24px 48px rgba(24,17,11,.15);
}
.density-reference p{
max-width:760px;
margin:0;
color:rgba(255,255,255,.66);
font-size:16px;
line-height:1.7;
}
.density-reference a{
flex:0 0 auto;
display:inline-flex;
align-items:center;
justify-content:center;
min-height:52px;
padding:0 22px;
border:1px solid rgba(210,173,114,.42);
border-radius:999px;
background:rgba(255,255,255,.05);
color:#f0d7ae;
font-size:12px;
font-weight:800;
letter-spacing:.14em;
text-transform:uppercase;
text-decoration:none;
transition:transform .22s ease,background .22s ease,border-color .22s ease;
}
.density-reference a:hover{
transform:translateY(-2px);
border-color:#d2ad72;
background:rgba(255,255,255,.09);
}
html[dir="rtl"] .density-table th,
html[dir="rtl"] .density-table td{
text-align:right;
}
html[dir="rtl"] .density-table th:first-child,
html[dir="rtl"] .density-table td:first-child{
left:auto;
right:0;
}
@media(max-width:900px){
.density-shell{
width:min(100% - 40px,1180px);
}
.density-notes{
grid-template-columns:1fr;
}
.density-note{
min-height:auto;
}
.density-reference{
align-items:flex-start;
flex-direction:column;
}
}
@media(max-width:640px){
.density-shell{
width:min(100% - 28px,1180px);
}
.density-hero{
padding:76px 0 56px;
}
.density-hero h1{
font-size:46px;
}
.density-hero .density-shell > p:not(.density-kicker){
font-size:16px;
}
.density-actions{
flex-direction:column;
}
.density-btn{
width:100%;
min-height:54px;
padding:0 18px;
}
.density-content{
gap:20px;
padding:52px 0 66px;
}
.density-section{
padding:28px 18px 22px;
border-radius:24px;
}
.density-section h2{
font-size:34px;
}
.density-section > p{
font-size:15px;
}
.density-table-wrap{
border-radius:18px;
}
.density-table{
min-width:820px;
font-size:13px;
}
.density-table th,
.density-table td{
padding:14px 12px;
}
.density-warning,
.density-reference{
padding:24px 20px;
border-radius:22px;
}
.density-reference a{
width:100%;
}
}
/* =========================================================
Color Ring Guide — premium grid presentation
========================================================= */
.ring-page-main{
overflow:hidden;
background:#f7f3ec;
color:#171411;
}
.ring-shell{
width:min(1380px,calc(100% - 72px));
margin:0 auto;
}
.ring-hero{
position:relative;
overflow:hidden;
padding:96px 0 82px;
background:
radial-gradient(circle at 14% 12%,rgba(210,173,114,.16) 0%,rgba(210,173,114,0) 30%),
linear-gradient(145deg,#17130f 0%,#272019 52%,#120f0c 100%);
color:#fff;
text-align:center;
}
.ring-hero::before{
content:"";
position:absolute;
inset:auto -90px -160px auto;
width:420px;
height:420px;
border-radius:50%;
background:radial-gradient(circle,rgba(210,173,114,.17) 0%,rgba(210,173,114,0) 70%);
pointer-events:none;
}
.ring-hero .ring-shell{
position:relative;
z-index:1;
display:flex;
flex-direction:column;
align-items:center;
}
.ring-kicker,
.ring-section-kicker{
display:block;
color:#d8b87f;
font-size:11px;
font-weight:800;
letter-spacing:.24em;
text-transform:uppercase;
}
.ring-hero h1{
margin:16px 0 20px;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(56px,7vw,108px);
font-weight:400;
line-height:.96;
letter-spacing:-.045em;
}
.ring-hero p{
max-width:760px;
margin:0;
color:rgba(255,255,255,.72);
font-size:18px;
line-height:1.78;
}
.ring-jump-nav{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:12px;
margin-top:34px;
}
.ring-jump-nav a{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:54px;
padding:0 22px;
border:1px solid rgba(216,184,127,.34);
border-radius:999px;
background:rgba(255,255,255,.055);
color:#f1dfbd;
font-size:12px;
font-weight:800;
letter-spacing:.13em;
text-transform:uppercase;
text-decoration:none;
backdrop-filter:blur(8px);
transition:transform .22s ease,background .22s ease,border-color .22s ease,color .22s ease;
}
.ring-jump-nav a:hover,
.ring-jump-nav a:focus-visible{
transform:translateY(-2px);
border-color:#d8b87f;
background:#d8b87f;
color:#17120f;
outline:none;
}
.ring-section{
padding:86px 0 94px;
border-bottom:1px solid rgba(17,17,17,.08);
background:linear-gradient(180deg,#fbf9f4 0%,#f4eee4 100%);
}
.ring-section:nth-of-type(3){
background:linear-gradient(180deg,#f1ebe2 0%,#faf8f3 100%);
}
.ring-section-heading{
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:24px;
padding-bottom:22px;
border-bottom:1px solid rgba(17,17,17,.10);
}
.ring-section-heading h2{
margin:10px 0 0;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(38px,4.5vw,72px);
font-weight:400;
line-height:1;
letter-spacing:-.035em;
}
.ring-section-heading > strong{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:42px;
padding:0 16px;
border:1px solid rgba(168,116,47,.20);
border-radius:999px;
background:#fffaf2;
color:#9d6a2f;
font-size:12px;
font-weight:800;
letter-spacing:.12em;
text-transform:uppercase;
white-space:nowrap;
}
.ring-section-intro{
max-width:720px;
margin:24px 0 36px;
color:rgba(17,17,17,.66);
font-size:17px;
line-height:1.72;
}
.color-card-grid{
display:grid;
grid-template-columns:repeat(6,minmax(0,1fr));
gap:18px;
}
.color-card{
position:relative;
overflow:hidden;
display:flex;
align-items:center;
justify-content:center;
margin:0;
min-height:0 !important;
aspect-ratio:1/1.02;
padding:14px;
border:1px solid rgba(17,17,17,.08);
border-radius:24px;
background:linear-gradient(180deg,#fff 0%,#faf6ef 100%);
box-shadow:0 12px 28px rgba(27,20,13,.06);
transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
.color-card::after{
content:"";
position:absolute;
inset:auto -34px -50px auto;
width:112px;
height:112px;
border-radius:50%;
background:radial-gradient(circle,rgba(210,173,114,.15) 0%,rgba(210,173,114,0) 72%);
pointer-events:none;
}
.color-card:hover{
transform:translateY(-6px);
border-color:rgba(168,116,47,.26);
box-shadow:0 22px 38px rgba(27,20,13,.11);
}
.color-card img{
display:block;
width:100%;
height:100%;
max-height:none !important;
object-fit:contain;
filter:none;
transition:transform .28s ease;
}
.color-card:hover img{
transform:scale(1.035);
}
.men-card,
.women-card{
min-height:0 !important;
}
@media(max-width:1180px){
.color-card-grid{grid-template-columns:repeat(5,minmax(0,1fr));}
}
@media(max-width:920px){
.ring-shell{width:min(100% - 40px,920px);}
.ring-hero{padding:80px 0 68px;}
.ring-section{padding:70px 0 76px;}
.color-card-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;}
}
@media(max-width:680px){
.ring-shell{width:calc(100% - 30px);}
.ring-hero{padding:66px 0 56px;}
.ring-hero h1{font-size:54px;}
.ring-hero p{font-size:16px;}
.ring-jump-nav{flex-direction:column;width:100%;}
.ring-jump-nav a{width:100%;}
.ring-section{padding:58px 0 64px;}
.ring-section-heading{align-items:flex-start;flex-direction:column;gap:16px;}
.ring-section-heading h2{font-size:42px;}
.ring-section-intro{font-size:16px;margin:20px 0 28px;}
.color-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.color-card{padding:10px;border-radius:19px;}
}
/* Cart drawer payment panel — keep the same premium look as product payment block */
.lhs-store-cart-payment-card .lhs-store-cart-payment-brand{
padding:0 !important;
}
.lhs-store-cart-payment-card .lhs-store-cart-payment-logo-tabby{height:30px;}
.lhs-store-cart-payment-card .lhs-store-cart-payment-logo-tamara{height:24px;}
@media (max-width:640px){
.lhs-store-cart-payment-card .lhs-store-cart-payment-logo-tabby{height:27px;}
.lhs-store-cart-payment-card .lhs-store-cart-payment-logo-tamara{height:22px;}
}
/* Poly Skin collection hero — final 8:3 banner */
.lhs-poly-live-hero{
position:relative;
width:100%;
height:500px;
min-height:500px;
max-height:500px;
aspect-ratio:auto;
overflow:hidden;
padding:0;
background:#f4eadf;
isolation:isolate;
}
.lhs-poly-live-final-image{
position:absolute;
inset:0;
z-index:-3;
width:100%;
height:100%;
display:block;
object-fit:contain;
object-position:right center;
opacity:0;
transform:translateY(6px);
animation:lhsPolyFinalImageIn 1.2s cubic-bezier(.22,.9,.25,1) .12s forwards;
}
.lhs-poly-live-overlay{
position:absolute;
inset:0;
z-index:-2;
background:linear-gradient(90deg,
rgba(244,234,223,.96) 0%,
rgba(244,234,223,.82) 24%,
rgba(244,234,223,.30) 44%,
rgba(244,234,223,0) 64%);
pointer-events:none;
}
.lhs-poly-live-content{
position:absolute;
left:clamp(34px,5vw,96px);
top:50%;
width:min(560px,40vw);
transform:translateY(-50%);
color:#24150e;
z-index:3;
}
.lhs-poly-live-title{
max-width:520px;
font-size:clamp(46px,4vw,78px);
line-height:1.02;
}
.lhs-poly-live-body{
max-width:470px;
margin-top:24px;
font-size:clamp(16px,1.12vw,21px);
line-height:1.5;
}
.lhs-poly-live-cta{
margin-top:28px;
}
@keyframes lhsPolyFinalImageIn{
from{opacity:0;transform:translateY(6px);}
to{opacity:1;transform:none;}
}
@media(max-width:1180px){
.lhs-poly-live-hero{
height:500px;
min-height:500px;
max-height:500px;
}
.lhs-poly-live-content{
left:38px;
width:min(500px,44vw);
}
.lhs-poly-live-title{
font-size:clamp(42px,4.6vw,64px);
}
}
@media(max-width:900px){
.lhs-poly-live-hero{
height:auto;
min-height:0;
max-height:none;
display:flex;
flex-direction:column;
background:#f4eadf;
}
.lhs-poly-live-final-image{
position:relative;
inset:auto;
order:1;
z-index:0;
width:100%;
height:auto;
aspect-ratio:8 / 3;
object-fit:contain;
object-position:right center;
}
.lhs-poly-live-overlay{
display:none;
}
.lhs-poly-live-content{
position:relative;
order:2;
left:auto;
top:auto;
width:auto;
transform:none;
padding:34px 28px 42px;
}
.lhs-poly-live-title{
max-width:none;
font-size:clamp(42px,7vw,58px);
}
.lhs-poly-live-body{
max-width:620px;
}
.lhs-poly-live-hero .lhs-lace-scroll-cue{
display:none;
}
}
@media(max-width:640px){
.lhs-poly-live-content{
padding:28px 22px 36px;
}
.lhs-poly-live-title{
font-size:clamp(36px,11vw,48px);
}
.lhs-poly-live-body{
margin-top:20px;
font-size:16px;
}
.lhs-poly-live-cta{
width:100%;
min-height:56px;
padding:0 18px;
}
}
/* Three-product Poly Skin collection — one ordered row on wide screens */
.lhs-poly-three-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
.lhs-poly-three-grid .lhs-lace-option-card{
min-height:390px;
}
.lhs-poly-three-grid .lhs-lace-option-visual{
min-height:210px;
aspect-ratio:auto;
}
.lhs-poly-three-grid .lhs-lace-option-image img{
width:100%;
height:100%;
min-height:210px;
object-fit:cover;
object-position:center;
}
@media(max-width:1100px){
.lhs-poly-three-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}
@media(max-width:760px){
.lhs-poly-three-grid{
grid-template-columns:1fr;
}
.lhs-poly-three-grid .lhs-lace-option-visual,
.lhs-poly-three-grid .lhs-lace-option-image img{
min-height:190px;
}
}
/* =========================================================
Compact product purchase column — shared across all product pages
========================================================= */
.lhs-product-detail-body .lhs-product-detail-info{
padding-top:4px;
}
.lhs-product-detail-body .lhs-product-breadcrumb{
margin-bottom:14px;
}
.lhs-product-detail-body .lhs-product-detail-info h1{
font-size:clamp(40px,4vw,64px);
line-height:1;
}
.lhs-product-detail-body .lhs-product-summary{
margin-top:16px;
line-height:1.58;
}
.lhs-product-detail-body .lhs-product-price-row{
margin:24px 0 18px;
padding:18px 22px;
border-radius:22px;
}
.lhs-product-detail-body .lhs-product-price-row strong{
font-size:clamp(30px,2.4vw,41px);
}
.lhs-product-detail-body .lhs-product-price-row span{
line-height:1.45;
}
.lhs-product-detail-body .lhs-product-spec-summary{
gap:10px;
margin-bottom:22px;
}
.lhs-product-detail-body .lhs-product-spec-summary div{
padding:16px 15px;
border-radius:19px;
}
.lhs-product-detail-body .lhs-product-spec-summary span{
margin-bottom:7px;
font-size:10px;
}
.lhs-product-detail-body .lhs-product-spec-summary strong{
font-size:14px;
line-height:1.4;
}
.lhs-product-detail-body .lhs-product-options{
gap:12px;
}
.lhs-product-detail-body .lhs-product-options fieldset{
padding:18px 18px 16px;
border-radius:22px;
}
.lhs-product-detail-body .lhs-product-options legend{
margin-bottom:10px;
font-size:clamp(18px,1.55vw,21px);
}
.lhs-product-detail-body .lhs-color-dropdown-btn{
min-height:56px;
padding:9px 14px;
border-radius:17px;
}
.lhs-product-detail-body .lhs-color-dropdown-thumb{
width:48px;
height:48px;
flex-basis:48px;
border-radius:13px;
}
.lhs-product-detail-body .lhs-color-preview-section{
margin-top:14px;
padding-top:13px;
}
.lhs-product-detail-body .lhs-color-preview-grid{
gap:8px;
}
.lhs-product-detail-body .lhs-color-preview-card{
gap:6px;
padding:7px 7px 9px;
border-radius:13px;
}
.lhs-product-detail-body .lhs-product-radio-grid{
gap:10px;
}
.lhs-product-detail-body .lhs-product-radio-grid label{
min-height:54px;
padding:12px 14px;
gap:10px;
border-radius:16px;
font-size:14px;
line-height:1.35;
}
.lhs-product-detail-body .lhs-product-radio-grid input{
width:18px;
height:18px;
}
.lhs-product-detail-body .lhs-product-quantity-row{
padding:15px 18px;
border-radius:22px;
}
.lhs-product-detail-body .lhs-product-quantity-row label{
width:100%;
flex-direction:row;
align-items:center;
justify-content:space-between;
gap:18px;
}
.lhs-product-detail-body .lhs-product-quantity-row input{
width:112px;
height:52px;
padding:0 15px;
border-radius:15px;
font-size:24px;
}
.lhs-product-detail-body .lhs-product-add-btn,
.lhs-product-detail-body .system-add-btn.lhs-product-add-btn{
min-height:62px;
padding:14px 24px;
border-radius:22px;
}
.lhs-product-detail-body .lhs-product-payment-options{
padding:21px 22px 18px;
border-radius:26px;
}
.lhs-product-detail-body .lhs-product-payment-heading{
margin-bottom:14px;
}
.lhs-product-detail-body .lhs-product-payment-heading > div{
gap:5px;
}
.lhs-product-detail-body .lhs-product-payment-heading strong{
font-size:20px;
line-height:1.16;
}
.lhs-product-detail-body .lhs-product-payment-grid{
gap:10px;
}
.lhs-product-detail-body .lhs-direct-pay-btn{
min-height:94px;
gap:8px;
padding:14px;
border-radius:19px;
}
.lhs-product-detail-body .lhs-direct-pay-btn strong{
min-height:32px;
}
.lhs-product-detail-body .lhs-pay-logo-tabby{height:34px;}
.lhs-product-detail-body .lhs-pay-logo-tamara{height:27px;}
.lhs-product-detail-body .lhs-product-payment-options > p{
margin-top:11px;
line-height:1.45;
}
@media(max-width:760px){
.lhs-product-detail-body .lhs-product-detail-shell{
padding-top:32px;
padding-bottom:52px;
gap:28px;
}
.lhs-product-detail-body .lhs-product-breadcrumb{
margin-bottom:11px;
}
.lhs-product-detail-body .lhs-product-detail-info h1{
font-size:clamp(38px,10vw,54px);
}
.lhs-product-detail-body .lhs-product-summary{
margin-top:13px;
font-size:15px;
line-height:1.52;
}
.lhs-product-detail-body .lhs-product-price-row{
margin:19px 0 14px;
padding:15px 17px;
gap:10px;
}
.lhs-product-detail-body .lhs-product-price-row strong{
font-size:33px;
}
.lhs-product-detail-body .lhs-product-price-row span{
font-size:12px;
}
.lhs-product-detail-body .lhs-product-spec-summary{
grid-template-columns:repeat(3,minmax(0,1fr));
gap:8px;
margin-bottom:16px;
}
.lhs-product-detail-body .lhs-product-spec-summary div{
padding:13px 11px;
border-radius:17px;
}
.lhs-product-detail-body .lhs-product-spec-summary span{
font-size:8px;
letter-spacing:.13em;
}
.lhs-product-detail-body .lhs-product-spec-summary strong{
font-size:12px;
line-height:1.32;
}
.lhs-product-detail-body .lhs-product-options fieldset{
padding:15px 14px 14px;
border-radius:19px;
}
.lhs-product-detail-body .lhs-product-radio-grid label{
min-height:50px;
padding:10px 11px;
font-size:13px;
border-radius:14px;
}
.lhs-product-detail-body .lhs-product-quantity-row{
padding:13px 15px;
border-radius:19px;
}
.lhs-product-detail-body .lhs-product-quantity-row input{
width:96px;
height:48px;
font-size:22px;
}
.lhs-product-detail-body .lhs-product-add-btn,
.lhs-product-detail-body .system-add-btn.lhs-product-add-btn{
min-height:56px;
padding:13px 20px;
border-radius:19px;
}
.lhs-product-detail-body .lhs-product-payment-options{
padding:18px 15px 15px;
border-radius:22px;
}
.lhs-product-detail-body .lhs-product-payment-heading{
margin-bottom:12px;
}
.lhs-product-detail-body .lhs-product-payment-heading strong{
font-size:18px;
}
.lhs-product-detail-body .lhs-product-payment-heading small{
font-size:9px;
}
.lhs-product-detail-body .lhs-product-payment-grid{
gap:8px;
}
.lhs-product-detail-body .lhs-direct-pay-btn{
min-height:82px;
padding:11px;
border-radius:16px;
}
.lhs-product-detail-body .lhs-direct-pay-btn span{
font-size:8px;
letter-spacing:.15em;
}
.lhs-product-detail-body .lhs-direct-pay-btn strong{
min-height:26px;
font-size:12px;
}
.lhs-product-detail-body .lhs-pay-logo-tabby{height:29px;}
.lhs-product-detail-body .lhs-pay-logo-tamara{height:23px;}
}
@media(max-width:520px){
.lhs-product-detail-body .lhs-product-spec-summary{
grid-template-columns:1fr;
}
.lhs-product-detail-body .lhs-product-payment-grid{
grid-template-columns:1fr;
}
.lhs-product-detail-body .lhs-direct-pay-btn{
min-height:68px;
}
}
/* Shopping bag refinement — empty state and clearer payment options */
.lhs-store-cart-drawer.is-empty-cart .lhs-store-cart-items{
display:flex;
align-items:center;
justify-content:center;
padding-top:24px;
padding-bottom:24px;
}
.lhs-store-cart-drawer.is-empty-cart .lhs-store-cart-empty{
min-height:0;
width:100%;
}
.lhs-store-cart-drawer.is-empty-cart .lhs-store-cart-summary-row,
.lhs-store-cart-drawer.is-empty-cart .lhs-store-cart-payment-panel,
.lhs-store-cart-drawer.is-empty-cart .lhs-store-cart-support{
display:none;
}
.lhs-store-cart-drawer.is-empty-cart .lhs-store-cart-summary{
padding-top:16px;
}
.lhs-store-cart-drawer.is-empty-cart .lhs-store-cart-continue{
margin-top:0;
}
.lhs-store-cart-payment-card span{
font-size:10px;
}
.lhs-store-cart-payment-logo-tabby{height:38px;}
.lhs-store-cart-payment-logo-tamara{height:30px;}
@media(max-width:760px){
.lhs-store-cart-payment-card span{
font-size:9.5px;
}
.lhs-store-cart-payment-logo-tabby{height:31px;}
.lhs-store-cart-payment-logo-tamara{height:25px;}
}
@media(max-width:520px){
.lhs-store-cart-empty-logo{
width:min(190px,72%);
}
}
/* Product decision card */
.lhs-why-choose-system{
margin:18px 0 20px;
padding:20px 22px;
border:1px solid rgba(168,116,47,.16);
border-radius:22px;
background:linear-gradient(135deg,#fffdf8 0%,#f6efe5 100%);
box-shadow:0 12px 26px rgba(27,19,12,.05);
}
.lhs-why-choose-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px;}
.lhs-why-choose-heading span{color:#a8742f;font-size:9px;font-weight:800;letter-spacing:.20em;}
.lhs-why-choose-heading strong{max-width:250px;font-family:Georgia,"Times New Roman",serif;font-size:17px;font-weight:400;line-height:1.25;text-align:right;}
.lhs-why-choose-system ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px;margin:0;padding:0;list-style:none;}
.lhs-why-choose-system li{position:relative;padding-left:16px;color:rgba(17,17,17,.67);font-size:13px;line-height:1.5;}
.lhs-why-choose-system li::before{content:"";position:absolute;left:0;top:.58em;width:6px;height:6px;border-radius:50%;background:#b48545;}
@media(max-width:640px){.lhs-why-choose-heading{display:block}.lhs-why-choose-heading strong{display:block;max-width:none;margin-top:8px;text-align:left}.lhs-why-choose-system ul{grid-template-columns:1fr}}
/* Women header: static coming-soon label; submenu links removed from header only */
.main-header .women-coming-soon-trigger{
flex-direction:column !important;
justify-content:center !important;
gap:4px !important;
line-height:1 !important;
padding-top:3px !important;
}
.main-header .women-coming-soon-trigger .lhs-women-label{
display:block;
line-height:1;
}
.main-header .women-coming-soon-trigger .lhs-women-coming-soon-note{
display:block;
color:#b98745;
font-size:7px;
font-weight:800;
letter-spacing:.18em;
line-height:1;
white-space:nowrap;
}
.mobile-nav .mobile-women-coming-soon-link{
align-items:center;
}
.mobile-nav .mobile-women-label-stack{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:3px;
line-height:1;
}
.mobile-nav .mobile-women-label-stack small{
color:#b98745;
font-size:8px;
font-weight:800;
letter-spacing:.18em;
line-height:1;
white-space:nowrap;
}
html[dir="rtl"] .mobile-nav .mobile-women-label-stack{
align-items:flex-end;
}
/* =========================================================
LHS SIGNATURE PRODUCT EXPERIENCE — MEN'S COLLECTION
========================================================= */
.lhs-signature-experience-page {
background: #f5f5f3;
}
.lhs-signature-hero {
position: relative;
min-height: clamp(660px, 88vh, 900px);
overflow: hidden;
background: #ece8e1;
color: #fff;
}
.lhs-signature-hero-media,
.lhs-signature-hero-overlay {
position: absolute;
inset: 0;
}
.lhs-signature-hero-media img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: 50% 68%;
transform: scale(1.01);
}
.lhs-signature-hero-overlay {
background:
linear-gradient(90deg, rgba(8,8,8,.82) 0%, rgba(8,8,8,.54) 34%, rgba(8,8,8,.10) 70%, rgba(8,8,8,0) 100%),
linear-gradient(0deg, rgba(8,8,8,.14), rgba(8,8,8,0) 34%);
}
.lhs-signature-hero-content {
position: relative;
z-index: 2;
display: flex;
flex-direction: column;
justify-content: center;
min-height: inherit;
width: min(700px, calc(100% - 48px));
margin-left: clamp(24px, 8vw, 150px);
padding: 145px 0 88px;
}
.lhs-signature-eyebrow,
.lhs-signature-statement-copy > span,
.lhs-signature-bridge > p {
margin: 0 0 22px;
font-size: 13px;
font-weight: 750;
letter-spacing: .21em;
line-height: 1.4;
text-transform: uppercase;
}
.lhs-signature-hero-content h1 {
margin: 0;
max-width: 780px;
font-size: clamp(52px, 6.2vw, 94px);
font-weight: 500;
line-height: .99;
letter-spacing: -.052em;
}
.lhs-signature-hero-content > p:not(.lhs-signature-eyebrow) {
max-width: 590px;
margin: 30px 0 0;
font-size: clamp(18px, 1.55vw, 22px);
line-height: 1.62;
color: rgba(255,255,255,.9);
}
.lhs-signature-primary-cta {
align-self: flex-start;
margin-top: 38px;
padding: 16px 27px;
border: 1px solid rgba(255,255,255,.25);
border-radius: 999px;
background: #fff;
color: #111;
font-size: 15px;
font-weight: 750;
line-height: 1;
text-decoration: none;
box-shadow: 0 12px 34px rgba(0,0,0,.14);
transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
}
.lhs-signature-primary-cta::after {
content: " ↓";
}
.lhs-signature-primary-cta:hover,
.lhs-signature-primary-cta:focus-visible {
transform: translateY(-2px);
background: #efe5d4;
box-shadow: 0 16px 40px rgba(0,0,0,.2);
}
.lhs-signature-statement {
display: grid;
grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
min-height: 720px;
}
.lhs-signature-statement-copy {
display: flex;
flex-direction: column;
justify-content: center;
padding: clamp(68px, 8vw, 132px);
}
.lhs-signature-statement-copy h2,
.lhs-signature-detail-intro h2,
.lhs-signature-bridge h2 {
margin: 0;
font-size: clamp(48px, 5.7vw, 86px);
font-weight: 500;
line-height: 1.02;
letter-spacing: -.048em;
}
.lhs-signature-statement-copy p {
max-width: 570px;
margin: 28px 0 0;
font-size: clamp(18px, 1.5vw, 21px);
line-height: 1.68;
opacity: .82;
}
.lhs-signature-statement-copy .lhs-signature-shade-note {
margin-top: 18px;
padding-top: 18px;
border-top: 1px solid currentColor;
max-width: 470px;
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
opacity: .62;
}
.lhs-signature-statement-media {
min-height: 590px;
overflow: hidden;
}
.lhs-signature-statement-media img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .8s ease;
}
.lhs-signature-statement:hover .lhs-signature-statement-media img {
transform: scale(1.022);
}
.lhs-signature-statement-light {
background: #f0eee9;
color: #171717;
}
.lhs-signature-statement-dark {
background: #101010;
color: #fff;
}
.lhs-signature-reverse .lhs-signature-statement-copy { order: 2; }
.lhs-signature-reverse .lhs-signature-statement-media { order: 1; }
.lhs-signature-detail {
padding: clamp(80px, 8vw, 124px) clamp(24px, 5.5vw, 96px);
background: #fff;
color: #171717;
}
.lhs-signature-detail-intro {
max-width: 920px;
margin-bottom: clamp(44px, 5vw, 70px);
}
.lhs-signature-detail-layout {
display: grid;
grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
gap: clamp(42px, 5.5vw, 82px);
align-items: center;
}
.lhs-signature-detail-visual {
position: relative;
min-height: 640px;
overflow: hidden;
border-radius: 28px;
background: #eeeae2;
}
.lhs-signature-detail-visual > img {
width: 100%;
height: 100%;
min-height: 640px;
object-fit: cover;
}
.lhs-signature-hotspot {
position: absolute;
display: flex;
align-items: center;
gap: 12px;
}
.lhs-signature-hotspot > span {
display: grid;
place-items: center;
width: 38px;
height: 38px;
flex: 0 0 38px;
border: 1px solid rgba(255,255,255,.82);
border-radius: 50%;
background: rgba(12,12,12,.76);
color: #fff;
font-size: 12px;
backdrop-filter: blur(8px);
}
.lhs-signature-hotspot p {
margin: 0;
max-width: 230px;
padding: 11px 14px;
border-radius: 12px;
background: rgba(255,255,255,.91);
color: #181818;
font-size: 13px;
line-height: 1.48;
box-shadow: 0 12px 35px rgba(0,0,0,.12);
backdrop-filter: blur(8px);
}
.lhs-signature-hotspot strong { display: block; margin-bottom: 2px; }
.lhs-hotspot-one { top: 17%; left: 7%; }
.lhs-hotspot-two { top: 46%; right: 7%; }
.lhs-hotspot-three { bottom: 11%; left: 12%; }
.lhs-signature-feature-list {
border-top: 1px solid #d9d7d1;
}
.lhs-signature-feature-list article {
display: grid;
grid-template-columns: 48px 1fr;
gap: 20px;
padding: 25px 0;
border-bottom: 1px solid #d9d7d1;
}
.lhs-signature-feature-list article > span {
padding-top: 4px;
color: #a68a58;
font-size: 13px;
font-weight: 750;
letter-spacing: .12em;
}
.lhs-signature-feature-list h3 {
margin: 0 0 9px;
font-size: clamp(25px, 2vw, 33px);
font-weight: 500;
line-height: 1.12;
letter-spacing: -.03em;
}
.lhs-signature-feature-list p {
margin: 0;
color: #66645f;
font-size: 17px;
line-height: 1.62;
}
.lhs-signature-bridge {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 475px;
padding: 80px 24px;
text-align: center;
background: #e9e5dd;
color: #151515;
}
.lhs-signature-bridge h2 { max-width: 900px; }
.lhs-signature-bridge a {
display: inline-flex;
align-items: center;
gap: 10px;
margin-top: 34px;
padding: 15px 24px;
border: 1px solid #151515;
border-radius: 999px;
background: #151515;
color: #fff;
font-size: 16px;
font-weight: 750;
line-height: 1;
text-decoration: none;
transition: transform .25s ease, background .25s ease, color .25s ease;
}
.lhs-signature-bridge a::after {
content: "↓";
font-size: 17px;
line-height: 1;
}
.lhs-signature-bridge a:hover,
.lhs-signature-bridge a:focus-visible {
transform: translateY(-2px);
background: #fff;
color: #151515;
}
.lhs-signature-experience-page #productPurchase {
scroll-margin-top: 130px;
padding-top: clamp(78px, 8vw, 124px);
}
@media (max-width: 1100px) and (min-width: 901px) {
.lhs-signature-detail-layout {
grid-template-columns: minmax(0, 1fr) minmax(330px, .86fr);
gap: 48px;
}
.lhs-signature-detail-visual,
.lhs-signature-detail-visual > img { min-height: 580px; }
.lhs-signature-feature-list article { padding: 22px 0; }
}
@media (max-width: 900px) {
.lhs-signature-hero { min-height: 720px; }
.lhs-signature-hero-media img {
object-position: 62% center;
transform: scale(1.005);
}
.lhs-signature-hero-overlay {
background: linear-gradient(0deg, rgba(8,8,8,.86) 0%, rgba(8,8,8,.38) 58%, rgba(8,8,8,.08) 100%);
}
.lhs-signature-hero-content {
justify-content: flex-end;
margin-left: 24px;
padding-bottom: 68px;
}
.lhs-signature-statement {
grid-template-columns: 1fr;
min-height: 0;
}
.lhs-signature-statement-copy,
.lhs-signature-reverse .lhs-signature-statement-copy {
order: 1;
padding: 68px 24px;
}
.lhs-signature-statement-media,
.lhs-signature-reverse .lhs-signature-statement-media {
order: 2;
min-height: 500px;
}
.lhs-signature-detail {
padding: 76px 24px 84px;
}
.lhs-signature-detail-layout {
grid-template-columns: 1fr;
gap: 52px;
}
.lhs-signature-detail-visual,
.lhs-signature-detail-visual > img { min-height: 570px; }
.lhs-signature-feature-list article { padding: 24px 0; }
}
@media (max-width: 560px) {
.lhs-signature-hero { min-height: 665px; }
.lhs-signature-hero-content {
width: calc(100% - 40px);
margin-left: 20px;
padding-bottom: 52px;
}
.lhs-signature-eyebrow,
.lhs-signature-statement-copy > span,
.lhs-signature-bridge > p {
margin-bottom: 17px;
font-size: 11px;
letter-spacing: .18em;
}
.lhs-signature-hero-content h1 {
font-size: clamp(43px, 13vw, 52px);
line-height: 1;
}
.lhs-signature-hero-content > p:not(.lhs-signature-eyebrow) {
margin-top: 22px;
font-size: 17px;
line-height: 1.58;
}
.lhs-signature-primary-cta {
margin-top: 28px;
padding: 15px 22px;
font-size: 14px;
}
.lhs-signature-statement-copy {
padding-top: 60px;
padding-bottom: 60px;
}
.lhs-signature-statement-copy h2,
.lhs-signature-detail-intro h2,
.lhs-signature-bridge h2 {
font-size: clamp(40px, 11vw, 48px);
line-height: 1.04;
}
.lhs-signature-statement-copy p {
margin-top: 22px;
font-size: 17px;
line-height: 1.62;
}
.lhs-signature-statement-copy .lhs-signature-shade-note {
margin-top: 16px;
padding-top: 16px;
font-size: 14px;
}
.lhs-signature-statement-media { min-height: 420px; }
.lhs-signature-detail {
padding: 64px 18px 72px;
}
.lhs-signature-detail-intro { margin-bottom: 38px; }
.lhs-signature-detail-layout { gap: 38px; }
.lhs-signature-detail-visual {
min-height: 500px;
border-radius: 22px;
}
.lhs-signature-detail-visual > img { min-height: 500px; }
.lhs-signature-hotspot > span {
width: 40px;
height: 40px;
flex-basis: 40px;
}
.lhs-signature-hotspot p { display: none; }
.lhs-hotspot-one { top: 15%; left: 8%; }
.lhs-hotspot-two { top: 48%; right: 8%; }
.lhs-hotspot-three { bottom: 10%; left: 11%; }
.lhs-signature-feature-list article {
grid-template-columns: 42px 1fr;
gap: 14px;
padding: 22px 0;
}
.lhs-signature-feature-list h3 { font-size: 25px; }
.lhs-signature-feature-list p {
font-size: 16px;
line-height: 1.58;
}
.lhs-signature-bridge {
min-height: 410px;
padding: 70px 20px;
}
.lhs-signature-bridge a {
margin-top: 28px;
padding: 15px 21px;
font-size: 15px;
}
}
@media (prefers-reduced-motion: reduce) {
.lhs-signature-statement-media img,
.lhs-signature-primary-cta,
.lhs-signature-bridge a {
transition: none;
}
}
/* Deep Arabic refinement for LHS Signature Experience */
html[dir="rtl"] .lhs-signature-hero-content,
html[dir="rtl"] .lhs-signature-statement-copy,
html[dir="rtl"] .lhs-signature-detail-intro,
html[dir="rtl"] .lhs-signature-feature-list,
html[dir="rtl"] .lhs-signature-hotspot p {
direction: rtl;
text-align: right;
}
html[dir="rtl"] .lhs-signature-eyebrow,
html[dir="rtl"] .lhs-signature-statement-copy > span,
html[dir="rtl"] .lhs-signature-bridge > p {
letter-spacing: .04em;
text-transform: none;
}
html[dir="rtl"] .lhs-signature-hero-content h1,
html[dir="rtl"] .lhs-signature-statement-copy h2,
html[dir="rtl"] .lhs-signature-detail-intro h2,
html[dir="rtl"] .lhs-signature-bridge h2,
html[dir="rtl"] .lhs-signature-feature-list h3 {
letter-spacing: 0;
line-height: 1.18;
}
html[dir="rtl"] .lhs-signature-hero-content > p:not(.lhs-signature-eyebrow),
html[dir="rtl"] .lhs-signature-statement-copy p,
html[dir="rtl"] .lhs-signature-feature-list p,
html[dir="rtl"] .lhs-signature-hotspot p {
line-height: 1.8;
}
html[dir="rtl"] .lhs-signature-primary-cta {
letter-spacing: 0;
}
html[dir="rtl"] .lhs-signature-bridge {
direction: rtl;
text-align: center;
}
html[dir="rtl"] .lhs-signature-bridge a {
direction: rtl;
letter-spacing: 0;
}
html[dir="rtl"] .lhs-signature-feature-list article {
direction: rtl;
grid-template-columns: 48px 1fr;
}
html[dir="rtl"] .lhs-signature-feature-list article > span {
letter-spacing: 0;
}
@media (max-width: 560px) {
html[dir="rtl"] .lhs-signature-hero-content h1 {
font-size: clamp(39px, 11.5vw, 49px);
}
html[dir="rtl"] .lhs-signature-statement-copy h2,
html[dir="rtl"] .lhs-signature-detail-intro h2,
html[dir="rtl"] .lhs-signature-bridge h2 {
font-size: clamp(36px, 10vw, 46px);
}
}
/* LHS product option cards — mobile overflow and wrapping fix */
.lhs-product-detail-body .lhs-product-radio-grid > label{
min-width:0;
width:100%;
max-width:100%;
overflow:hidden;
justify-content:flex-start;
align-items:center;
}
.lhs-product-detail-body .lhs-product-radio-grid .lhs-option-copy{
display:block;
flex:1 1 auto;
min-width:0;
max-width:100%;
white-space:normal;
overflow-wrap:anywhere;
word-break:normal;
text-align:start;
unicode-bidi:plaintext;
}
.lhs-product-detail-body .lhs-product-radio-grid input[type="radio"]{
flex:0 0 auto;
margin:0;
}
@media(max-width:760px){
.lhs-product-detail-body .lhs-product-radio-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
width:100%;
max-width:100%;
}
.lhs-product-detail-body .lhs-density-grid{
grid-template-columns:1fr;
}
.lhs-product-detail-body .lhs-product-radio-grid > label{
min-height:62px;
padding:12px 13px;
gap:10px;
font-size:13px;
line-height:1.35;
}
.lhs-product-detail-body .lhs-density-grid > label{
min-height:60px;
}
.lhs-product-detail-body .lhs-product-radio-grid input[type="radio"]{
width:20px;
height:20px;
}
}
@media(max-width:390px){
.lhs-product-detail-body .lhs-product-options fieldset{
padding-left:12px;
padding-right:12px;
}
.lhs-product-detail-body .lhs-product-radio-grid{
gap:9px;
}
.lhs-product-detail-body .lhs-product-radio-grid > label{
padding:11px 10px;
gap:8px;
font-size:12.5px;
}
}
/* LHS MOBILE PRODUCT OPTIONS — HARD FIX V2 */
.lhs-product-detail-body .lhs-product-radio-grid,
.lhs-product-detail-body .lhs-product-radio-grid *{
box-sizing:border-box;
}
.lhs-product-detail-body .lhs-product-radio-grid > label{
position:relative !important;
display:grid !important;
grid-template-columns:24px minmax(0,1fr) !important;
align-items:center !important;
justify-content:stretch !important;
justify-items:stretch !important;
column-gap:10px !important;
min-width:0 !important;
width:100% !important;
max-width:100% !important;
overflow:hidden !important;
text-align:left !important;
}
.lhs-product-detail-body .lhs-product-radio-grid > label > input[type="radio"]{
position:static !important;
inset:auto !important;
transform:none !important;
float:none !important;
display:block !important;
grid-column:1 !important;
grid-row:1 !important;
place-self:center !important;
width:20px !important;
height:20px !important;
margin:0 !important;
padding:0 !important;
flex:none !important;
}
.lhs-product-detail-body .lhs-product-radio-grid > label > .lhs-option-copy{
position:static !important;
inset:auto !important;
transform:none !important;
float:none !important;
display:block !important;
grid-column:2 !important;
grid-row:1 !important;
min-width:0 !important;
width:auto !important;
max-width:100% !important;
margin:0 !important;
padding:0 !important;
white-space:normal !important;
overflow:visible !important;
overflow-wrap:break-word !important;
word-break:normal !important;
text-overflow:clip !important;
line-height:1.35 !important;
text-align:left !important;
unicode-bidi:normal !important;
}
html[dir="rtl"] .lhs-product-detail-body .lhs-product-radio-grid > label{
grid-template-columns:minmax(0,1fr) 24px !important;
text-align:right !important;
}
html[dir="rtl"] .lhs-product-detail-body .lhs-product-radio-grid > label > input[type="radio"]{
grid-column:2 !important;
}
html[dir="rtl"] .lhs-product-detail-body .lhs-product-radio-grid > label > .lhs-option-copy{
grid-column:1 !important;
text-align:right !important;
}
@media(max-width:760px){
.lhs-product-detail-body .lhs-product-radio-grid{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:10px !important;
width:100% !important;
max-width:100% !important;
}
.lhs-product-detail-body .lhs-density-grid{
grid-template-columns:1fr !important;
}
.lhs-product-detail-body .lhs-product-radio-grid > label{
min-height:64px !important;
padding:13px 12px !important;
border-radius:16px !important;
font-size:14px !important;
line-height:1.35 !important;
}
.lhs-product-detail-body .lhs-density-grid > label{
min-height:60px !important;
}
}
@media(max-width:380px){
.lhs-product-detail-body .lhs-product-radio-grid{
gap:8px !important;
}
.lhs-product-detail-body .lhs-product-radio-grid > label{
grid-template-columns:21px minmax(0,1fr) !important;
column-gap:8px !important;
padding:12px 9px !important;
font-size:13px !important;
}
html[dir="rtl"] .lhs-product-detail-body .lhs-product-radio-grid > label{
grid-template-columns:minmax(0,1fr) 21px !important;
}
.lhs-product-detail-body .lhs-product-radio-grid > label > input[type="radio"]{
width:19px !important;
height:19px !important;
}
}
/* =========================================================
Mobile navigation clarity hard fix — 2026-07-13
Keep the opened menu crisp and above every page overlay.
========================================================= */
@media(max-width:1160px){
body.menu-open::before{
display:none !important;
content:none !important;
backdrop-filter:none !important;
-webkit-backdrop-filter:none !important;
}
.mobile-nav,
.mobile-nav.open{
z-index:2147482000 !important;
background:#fff !important;
backdrop-filter:none !important;
-webkit-backdrop-filter:none !important;
filter:none !important;
opacity:1;
isolation:isolate;
overscroll-behavior:contain;
-webkit-overflow-scrolling:touch;
}
.mobile-nav.open{
opacity:1 !important;
visibility:visible !important;
pointer-events:auto !important;
}
.mobile-nav.open a,
.mobile-nav.open .nav-static-option,
.mobile-nav.open .mobile-women-label-stack,
.mobile-nav.open .mobile-women-label-stack *{
filter:none !important;
text-shadow:none !important;
}
body.menu-open .lhs-floating-cart,
body.menu-open .lhs-quick-actions,
body.menu-open .lhs-back-to-top{
opacity:0 !important;
visibility:hidden !important;
pointer-events:none !important;
}
}
/* LHS SUPPORT BLOCK — LUXURY ICON REFINEMENT V2 */
.lhs-support-strip{
width:100%;
max-width:none !important;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:clamp(22px,2.4vw,38px) !important;
padding:clamp(74px,6.5vw,104px) clamp(28px,6vw,110px) clamp(70px,6vw,96px) !important;
border-top:1px solid rgba(168,116,47,.08);
background:
radial-gradient(circle at 14% 12%,rgba(218,183,126,.13),transparent 24%),
radial-gradient(circle at 88% 80%,rgba(218,183,126,.12),transparent 24%),
linear-gradient(180deg,#fffdfa 0%,#f8f3eb 58%,#f2ece2 100%) !important;
}
.lhs-support-strip::before{
background:
linear-gradient(115deg,rgba(255,255,255,.82),rgba(255,255,255,0) 34%),
radial-gradient(circle at 50% -12%,rgba(255,255,255,.9),rgba(255,255,255,0) 42%) !important;
}
.lhs-support-strip .contact-strip-card{
width:100%;
max-width:500px;
min-height:540px;
margin-inline:auto;
padding:42px 38px 34px;
border:1px solid rgba(112,76,36,.10);
border-radius:34px;
background:
linear-gradient(180deg,rgba(255,255,255,.92) 0%,rgba(255,252,246,.96) 32%,rgba(248,242,233,.98) 100%);
box-shadow:
0 24px 58px rgba(38,27,18,.09),
inset 0 1px 0 rgba(255,255,255,.95);
}
.lhs-support-strip .contact-strip-card::before{
height:3px;
left:28px;
right:28px;
border-radius:0 0 999px 999px;
background:linear-gradient(90deg,rgba(210,173,114,0),#d9b879 22%,#a8732e 50%,#d9b879 78%,rgba(210,173,114,0));
opacity:.9;
}
.lhs-support-strip .contact-strip-card::after{
width:220px;
height:220px;
right:-80px;
bottom:-95px;
background:radial-gradient(circle,rgba(222,188,131,.18),rgba(222,188,131,0) 68%);
}
.lhs-support-strip .contact-strip-card:hover{
transform:translateY(-7px);
border-color:rgba(168,116,47,.20);
box-shadow:
0 34px 72px rgba(38,27,18,.14),
inset 0 1px 0 rgba(255,255,255,.96);
}
.lhs-support-strip .contact-icon{
width:112px;
height:112px;
margin-bottom:22px;
border:1px solid rgba(235,207,158,.72);
border-radius:31px;
color:#f0d19a;
background:
radial-gradient(circle at 50% 22%,rgba(255,236,199,.16),transparent 34%),
linear-gradient(155deg,#211915 0%,#17120f 58%,#2a2019 100%);
box-shadow:
0 0 0 5px rgba(213,174,109,.12),
0 19px 38px rgba(25,17,12,.22),
inset 0 1px 0 rgba(255,244,221,.16),
inset 0 -1px 0 rgba(0,0,0,.22);
}
.lhs-support-strip .contact-icon::before{
inset:9px;
border-radius:24px;
border:1px solid rgba(244,220,178,.12);
background:
radial-gradient(circle at 50% 20%,rgba(255,248,232,.08),transparent 44%),
linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,0));
}
.lhs-support-strip .contact-icon::after{
left:20px;
right:20px;
top:13px;
height:1px;
background:linear-gradient(90deg,transparent,rgba(255,237,203,.48),transparent);
}
.lhs-support-strip .contact-icon svg{
width:52px;
height:52px;
stroke-width:2.6;
filter:drop-shadow(0 2px 5px rgba(0,0,0,.22));
}
.lhs-support-strip .contact-strip-card:hover .contact-icon{
transform:translateY(-4px) scale(1.025);
border-color:rgba(240,211,162,.88);
box-shadow:
0 0 0 6px rgba(213,174,109,.14),
0 24px 44px rgba(25,17,12,.26),
inset 0 1px 0 rgba(255,244,221,.18);
}
.lhs-support-strip .lhs-support-kicker{
min-height:36px;
padding:0 18px;
margin-bottom:18px;
border:1px solid rgba(168,116,47,.18);
background:linear-gradient(180deg,rgba(255,254,250,.96),rgba(250,245,236,.94));
box-shadow:0 8px 18px rgba(84,54,24,.035),inset 0 1px 0 rgba(255,255,255,.88);
color:#a8742f;
font-size:11px;
letter-spacing:.25em;
}
.lhs-support-strip .contact-strip-card h2{
margin-bottom:17px;
font-size:clamp(30px,2.3vw,40px);
line-height:1.08;
letter-spacing:-.035em;
}
.lhs-support-strip .contact-strip-card p:not(:last-child){
max-width:390px;
font-size:17px;
line-height:1.72;
color:rgba(28,24,21,.68);
}
.lhs-support-strip .contact-strip-card p:last-child{
width:100%;
padding-top:30px;
}
.lhs-support-strip .contact-strip-card p:last-child a{
width:100%;
min-height:60px;
padding:10px 24px;
border-color:rgba(225,190,132,.25);
background:
radial-gradient(circle at 30% 0%,rgba(255,231,191,.08),transparent 36%),
linear-gradient(135deg,#17120f 0%,#271e18 58%,#15110e 100%);
color:#f0d6a8 !important;
box-shadow:
0 16px 30px rgba(26,18,12,.16),
inset 0 1px 0 rgba(255,239,211,.08);
}
.lhs-support-strip .contact-strip-card p:last-child a:hover{
border-color:rgba(230,198,144,.44);
background:
radial-gradient(circle at 30% 0%,rgba(255,231,191,.12),transparent 40%),
linear-gradient(135deg,#211813 0%,#120f0d 100%);
}
html[dir="rtl"] .lhs-support-strip .contact-strip-card p:last-child a::after{
transform:scaleX(-1);
}
html[dir="rtl"] .lhs-support-strip .contact-strip-card p:last-child a:hover::after{
transform:scaleX(-1) translateX(2px);
}
@media(max-width:1100px){
.lhs-support-strip{
grid-template-columns:repeat(2,minmax(0,1fr));
padding-inline:clamp(24px,5vw,64px) !important;
}
.lhs-support-strip .contact-strip-card:last-child{
grid-column:1 / -1;
max-width:560px;
}
}
@media(max-width:760px){
.lhs-support-strip{
grid-template-columns:1fr;
gap:20px !important;
padding:56px 18px 52px !important;
}
.lhs-support-strip .contact-strip-card,
.lhs-support-strip .contact-strip-card:last-child{
grid-column:auto;
max-width:560px;
min-height:auto;
padding:32px 22px 24px;
border-radius:28px;
}
.lhs-support-strip .contact-icon{
width:96px;
height:96px;
border-radius:27px;
margin-bottom:18px;
}
.lhs-support-strip .contact-icon::before{
inset:8px;
border-radius:21px;
}
.lhs-support-strip .contact-icon svg{
width:44px;
height:44px;
}
.lhs-support-strip .lhs-support-kicker{
min-height:33px;
padding-inline:14px;
font-size:10px;
letter-spacing:.20em;
}
.lhs-support-strip .contact-strip-card h2{
font-size:31px;
}
.lhs-support-strip .contact-strip-card p:not(:last-child){
font-size:16px;
line-height:1.68;
}
.lhs-support-strip .contact-strip-card p:last-child{
padding-top:22px;
}
.lhs-support-strip .contact-strip-card p:last-child a{
min-height:56px;
padding-inline:16px;
font-size:13px;
}
}
@media(prefers-reduced-motion:reduce){
.lhs-support-strip .contact-strip-card,
.lhs-support-strip .contact-icon,
.lhs-support-strip .contact-strip-card p:last-child a,
.lhs-support-strip .contact-strip-card p:last-child a::after{
transition:none !important;
}
}
/* =========================================================
Homepage hero — four LHS campaign slides (July 14, 2026)
Full-width 1920 × 820 artwork with live copy and typing CTA.
========================================================= */
.lhs-home-hero{
position:relative !important;
width:100% !important;
height:clamp(520px,42.708vw,820px) !important;
min-height:520px !important;
max-height:820px !important;
overflow:hidden !important;
background:#eee1d0 !important;
isolation:isolate;
}
.lhs-home-hero .lhs-home-hero-slide{
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
min-height:0 !important;
max-height:none !important;
display:none !important;
overflow:hidden !important;
background:#eee1d0 !important;
}
.lhs-home-hero .lhs-home-hero-slide.active{
display:block !important;
animation:lhsHomeHeroFade .72s cubic-bezier(.2,.7,.2,1) both;
}
.lhs-home-hero .lhs-home-hero-slide::after{
content:"";
position:absolute;
inset:0;
z-index:1;
pointer-events:none;
}
.lhs-home-hero .lhs-home-hero-copy-left::after{
background:linear-gradient(90deg,rgba(247,239,228,.78) 0%,rgba(247,239,228,.42) 29%,rgba(247,239,228,0) 54%);
}
.lhs-home-hero .lhs-home-hero-copy-right::after{
background:linear-gradient(270deg,rgba(247,239,228,.80) 0%,rgba(247,239,228,.44) 29%,rgba(247,239,228,0) 54%);
}
.lhs-home-hero .model-area{
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
min-height:0 !important;
max-height:none !important;
display:block !important;
background:#eee1d0 !important;
overflow:hidden !important;
}
.lhs-home-hero .hero-image-link{
display:block !important;
width:100% !important;
height:100% !important;
}
.lhs-home-hero .model-area img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:center center !important;
background:#eee1d0 !important;
transform:scale(1.012);
animation:lhsHomeHeroImageIn 1.25s cubic-bezier(.2,.7,.2,1) both;
}
.lhs-home-hero .lhs-home-hero-copy{
position:absolute !important;
z-index:3 !important;
top:50% !important;
width:min(38vw,620px) !important;
max-width:620px !important;
padding:0 !important;
margin:0 !important;
transform:translateY(-50%) !important;
color:#17120f !important;
text-align:left !important;
background:transparent !important;
overflow:visible !important;
}
.lhs-home-hero .lhs-home-hero-copy-left .lhs-home-hero-copy{
left:clamp(44px,7vw,138px) !important;
right:auto !important;
}
.lhs-home-hero .lhs-home-hero-copy-right .lhs-home-hero-copy{
right:clamp(44px,7vw,138px) !important;
left:auto !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-script{
margin:0 0 15px !important;
color:#9a6b2b !important;
font-family:Arial,Helvetica,sans-serif !important;
font-size:13px !important;
font-style:normal !important;
font-weight:800 !important;
line-height:1.2 !important;
letter-spacing:.24em !important;
text-transform:uppercase !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-title{
width:100% !important;
margin:0 0 18px !important;
color:#17120f !important;
font-family:Arial,Helvetica,sans-serif !important;
font-size:clamp(42px,4vw,72px) !important;
font-weight:500 !important;
line-height:.99 !important;
letter-spacing:-.045em !important;
text-transform:none !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-title span{
display:inline !important;
white-space:normal !important;
overflow:visible !important;
overflow-wrap:normal !important;
word-break:normal !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-body{
max-width:540px !important;
margin:0 0 24px !important;
color:rgba(23,18,15,.75) !important;
font-size:clamp(15px,1.08vw,19px) !important;
line-height:1.55 !important;
letter-spacing:0 !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-cta{
min-width:220px !important;
min-height:54px !important;
width:auto !important;
margin:0 !important;
padding:0 30px !important;
border:1px solid rgba(25,18,13,.88) !important;
border-radius:999px !important;
background:linear-gradient(135deg,#17120f 0%,#2b2119 100%) !important;
color:#f2d7a8 !important;
box-shadow:0 16px 34px rgba(22,15,10,.14) !important;
font-size:12px !important;
font-weight:800 !important;
letter-spacing:.18em !important;
text-transform:uppercase !important;
transition:transform .28s ease,box-shadow .28s ease,background .28s ease !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-cta:hover{
transform:translateY(-3px) !important;
box-shadow:0 22px 42px rgba(22,15,10,.21) !important;
background:linear-gradient(135deg,#231a14 0%,#111 100%) !important;
}
.lhs-home-hero .slider-dots{
left:50% !important;
right:auto !important;
bottom:18px !important;
z-index:5 !important;
width:auto !important;
transform:translateX(-50%) !important;
gap:9px !important;
}
.lhs-home-hero .slider-dots button{
width:72px !important;
height:5px !important;
padding:0 !important;
border:0 !important;
border-radius:999px !important;
background:rgba(255,255,255,.62) !important;
box-shadow:0 1px 6px rgba(0,0,0,.08) !important;
transition:width .3s ease,background .3s ease !important;
}
.lhs-home-hero .slider-dots button.active{
width:108px !important;
background:#17120f !important;
}
@keyframes lhsHomeHeroFade{
from{opacity:.2;}
to{opacity:1;}
}
@keyframes lhsHomeHeroImageIn{
from{opacity:.65;transform:scale(1.045);}
to{opacity:1;transform:scale(1.012);}
}
@media(max-width:1160px){
.lhs-home-hero{
height:500px !important;
min-height:500px !important;
max-height:500px !important;
}
.lhs-home-hero .lhs-home-hero-copy{
width:min(43vw,520px) !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-title{
font-size:clamp(36px,4.3vw,54px) !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-body{
font-size:15px !important;
}
}
@media(max-width:700px){
.lhs-home-hero{
height:700px !important;
min-height:700px !important;
max-height:700px !important;
background:#f5eee5 !important;
}
.lhs-home-hero .lhs-home-hero-slide.active{
display:grid !important;
grid-template-columns:1fr !important;
grid-template-rows:380px 320px !important;
}
.lhs-home-hero .lhs-home-hero-slide::after{
display:none !important;
}
.lhs-home-hero .model-area{
position:relative !important;
inset:auto !important;
grid-row:1 !important;
width:100% !important;
height:380px !important;
min-height:380px !important;
max-height:380px !important;
}
.lhs-home-hero .model-area img{
object-fit:cover !important;
transform:none !important;
}
.lhs-home-hero .lhs-home-hero-combined .model-area img,
.lhs-home-hero .lhs-home-hero-men .model-area img,
.lhs-home-hero .lhs-home-hero-custom .model-area img{
object-position:right center !important;
}
.lhs-home-hero .lhs-home-hero-women .model-area img{
object-position:left center !important;
}
.lhs-home-hero .lhs-home-hero-copy{
position:relative !important;
inset:auto !important;
top:auto !important;
left:auto !important;
right:auto !important;
grid-row:2 !important;
width:100% !important;
max-width:none !important;
height:320px !important;
padding:28px 24px 52px !important;
transform:none !important;
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
align-items:flex-start !important;
background:linear-gradient(180deg,#faf6f0 0%,#f3eadf 100%) !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-script{
margin-bottom:10px !important;
font-size:10px !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-title{
margin-bottom:12px !important;
font-size:clamp(28px,8.3vw,40px) !important;
line-height:1.02 !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-body{
max-width:100% !important;
margin-bottom:16px !important;
font-size:14px !important;
line-height:1.45 !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-cta{
min-width:210px !important;
min-height:48px !important;
padding:0 22px !important;
font-size:10px !important;
}
.lhs-home-hero .slider-dots{
bottom:14px !important;
}
.lhs-home-hero .slider-dots button{
width:44px !important;
height:4px !important;
}
.lhs-home-hero .slider-dots button.active{
width:68px !important;
}
}
html[dir="rtl"] .lhs-home-hero .lhs-home-hero-copy{
direction:rtl !important;
text-align:right !important;
}
html[dir="rtl"] .lhs-home-hero .lhs-home-hero-copy .typewriter-cta{
align-self:flex-start !important;
letter-spacing:.08em !important;
}
@media(prefers-reduced-motion:reduce){
.lhs-home-hero .lhs-home-hero-slide.active,
.lhs-home-hero .model-area img,
.lhs-home-hero .hero-content > *{
animation:none !important;
}
}
/* July 14, 2026 — Home editorial confidence banner */
.lhs-editorial-banner{
position:relative;
display:block;
width:min(1180px,100%);
aspect-ratio:8 / 3;
margin:34px auto 0;
overflow:hidden;
isolation:isolate;
border:1px solid rgba(47,32,19,.08);
border-radius:30px;
background:#ead2b8;
box-shadow:0 24px 64px rgba(48,31,18,.12);
opacity:0;
transform:translateY(22px);
transition:opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1), box-shadow .45s ease;
}
.lhs-editorial-banner.is-visible{
opacity:1;
transform:translateY(0);
}
.lhs-editorial-banner:hover{
box-shadow:0 32px 82px rgba(48,31,18,.17);
}
.lhs-editorial-banner-media{
position:absolute;
inset:0;
z-index:0;
overflow:hidden;
}
.lhs-editorial-banner-media::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(90deg,rgba(237,214,190,.94) 0%,rgba(237,214,190,.79) 35%,rgba(237,214,190,.18) 57%,rgba(237,214,190,0) 73%);
pointer-events:none;
}
.lhs-editorial-banner-media img{
width:100%;
height:100%;
display:block;
object-fit:cover;
object-position:center;
transform:scale(1.002);
transition:transform 1.1s cubic-bezier(.2,.8,.2,1), filter 1.1s ease;
}
.lhs-editorial-banner:hover .lhs-editorial-banner-media img{
transform:scale(1.018);
filter:saturate(1.02) contrast(1.015);
}
.lhs-editorial-banner-copy{
position:absolute;
inset:0 auto 0 0;
z-index:2;
width:49%;
min-height:100%;
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center;
padding:44px 64px 50px;
text-align:left;
}
.lhs-editorial-eyebrow{
margin:0 0 14px;
color:#8f6228;
font-size:11px;
font-weight:800;
letter-spacing:.24em;
text-transform:uppercase;
opacity:0;
transform:translateY(12px);
transition:opacity .58s ease .1s, transform .58s ease .1s;
}
.lhs-editorial-title{
max-width:470px;
min-height:2.12em;
margin:0 0 16px;
color:#17120f;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(34px,2.75vw,49px);
font-weight:400;
line-height:1.06;
letter-spacing:-.035em;
}
.lhs-editorial-title span{
position:relative;
}
.lhs-editorial-title span.is-typewriting::after{
content:"";
display:inline-block;
width:1px;
height:.88em;
margin-inline-start:.1em;
vertical-align:-.07em;
background:currentColor;
animation:lhsEditorialCursor .82s steps(1,end) infinite;
}
@keyframes lhsEditorialCursor{
0%,48%{opacity:1}
49%,100%{opacity:0}
}
.lhs-editorial-description{
max-width:500px;
margin:0;
color:rgba(28,20,14,.72);
font-size:15.5px;
line-height:1.62;
opacity:0;
transform:translateY(14px);
transition:opacity .62s ease .34s, transform .62s ease .34s;
}
.lhs-editorial-cta{
display:inline-flex;
align-items:center;
justify-content:center;
gap:14px;
min-height:50px;
margin-top:20px;
padding:0 28px;
border:1px solid rgba(28,21,16,.9);
border-radius:999px;
background:#17130f;
color:#f4dfba !important;
font-size:12px;
font-weight:800;
letter-spacing:.17em;
text-transform:uppercase;
box-shadow:0 15px 30px rgba(25,17,11,.16);
opacity:0;
transform:translateY(14px);
transition:opacity .62s ease .5s, transform .28s ease, box-shadow .28s ease, background .28s ease;
}
.lhs-editorial-cta span{
font-size:17px;
line-height:1;
transition:transform .28s ease;
}
.lhs-editorial-cta:hover{
transform:translateY(-3px);
background:#0e0c0a;
box-shadow:0 21px 38px rgba(25,17,11,.23);
}
.lhs-editorial-cta:hover span{
transform:translateX(3px);
}
.lhs-editorial-banner.is-visible .lhs-editorial-eyebrow,
.lhs-editorial-banner.is-visible .lhs-editorial-description,
.lhs-editorial-banner.is-visible .lhs-editorial-cta{
opacity:1;
transform:translateY(0);
}
html[dir="rtl"] .lhs-editorial-banner-copy{
left:0;
right:auto;
direction:rtl;
text-align:right;
align-items:flex-end;
}
html[dir="rtl"] .lhs-editorial-eyebrow,
html[dir="rtl"] .lhs-editorial-description,
html[dir="rtl"] .lhs-editorial-title{
text-align:right;
}
html[dir="rtl"] .lhs-editorial-title{
max-width:430px;
font-family:Tahoma,Arial,sans-serif;
font-size:clamp(32px,2.45vw,43px);
font-weight:700;
line-height:1.28;
letter-spacing:-.018em;
}
html[dir="rtl"] .lhs-editorial-cta{
flex-direction:row-reverse;
letter-spacing:.04em;
}
html[dir="rtl"] .lhs-editorial-cta span{
transform:scaleX(-1);
}
html[dir="rtl"] .lhs-editorial-cta:hover span{
transform:scaleX(-1) translateX(3px);
}
@media(max-width:900px){
.lhs-editorial-banner{
aspect-ratio:auto;
border-radius:24px;
}
.lhs-editorial-banner-media{
position:relative;
height:350px;
}
.lhs-editorial-banner-media::after{
background:linear-gradient(180deg,rgba(237,214,190,0) 55%,rgba(237,214,190,.18) 100%);
}
.lhs-editorial-banner-media img{
object-position:72% center;
}
.lhs-editorial-banner-copy{
position:relative;
inset:auto;
width:100%;
min-height:auto;
padding:36px 42px 40px;
background:linear-gradient(180deg,#edd7bf 0%,#ead1b5 100%);
}
html[dir="rtl"] .lhs-editorial-banner-copy{
left:auto;
right:auto;
}
.lhs-editorial-title{
min-height:0;
font-size:clamp(34px,5.6vw,46px);
}
}
@media(max-width:600px){
.heritage-section{
padding-left:16px;
padding-right:16px;
}
.lhs-editorial-banner{
margin-top:24px;
border-radius:20px;
}
.lhs-editorial-banner-media{
height:275px;
}
.lhs-editorial-banner-media img{
object-position:74% center;
}
.lhs-editorial-banner-copy,
html[dir="rtl"] .lhs-editorial-banner-copy{
align-items:flex-start;
padding:32px 24px 34px;
text-align:left;
}
html[dir="rtl"] .lhs-editorial-banner-copy{
align-items:flex-end;
text-align:right;
}
.lhs-editorial-eyebrow{
margin-bottom:14px;
font-size:10px;
letter-spacing:.18em;
}
.lhs-editorial-title{
font-size:34px;
line-height:1.08;
margin-bottom:16px;
}
html[dir="rtl"] .lhs-editorial-title{
font-size:31px;
line-height:1.3;
}
.lhs-editorial-description{
font-size:15px;
line-height:1.68;
}
.lhs-editorial-cta{
width:100%;
min-height:52px;
margin-top:24px;
padding:0 20px;
}
}
@media(prefers-reduced-motion:reduce){
.lhs-editorial-banner,
.lhs-editorial-banner-media img,
.lhs-editorial-eyebrow,
.lhs-editorial-description,
.lhs-editorial-cta{
transition:none !important;
}
.lhs-editorial-title span.is-typewriting::after{
animation:none;
}
}
/* July 15, 2026: refined live-copy Men / Women editorial collection cards */
.lhs-premium-collections{
gap:24px !important;
padding:0 32px 76px !important;
background:#fff;
}
.lhs-premium-collections .collection-tile{
position:relative;
aspect-ratio:20 / 7 !important;
min-height:0 !important;
border:1px solid rgba(116,83,47,.10);
border-radius:24px;
background:#ead7c2 !important;
box-shadow:0 22px 54px rgba(46,30,17,.09);
isolation:isolate;
transition:transform .42s ease, box-shadow .42s ease, border-color .42s ease;
}
.lhs-premium-collections .collection-tile::before{
content:"";
position:absolute;
inset:0;
z-index:1;
background:linear-gradient(90deg,rgba(238,218,197,.98) 0%,rgba(238,218,197,.91) 29%,rgba(238,218,197,.52) 44%,rgba(238,218,197,0) 62%);
pointer-events:none;
}
.lhs-premium-collections .collection-tile::after{
content:"";
position:absolute;
inset:0;
z-index:1;
background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(45,26,13,.04)) !important;
opacity:1;
pointer-events:none;
}
.lhs-premium-collections .collection-tile:hover{
transform:translateY(-6px);
border-color:rgba(166,115,52,.20);
box-shadow:0 30px 66px rgba(46,30,17,.14);
}
.lhs-premium-collections .collection-tile img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:center center !important;
background:#ead7c2 !important;
transform:scale(1) !important;
filter:saturate(.96) contrast(1.01);
transition:transform .78s cubic-bezier(.2,.65,.25,1), filter .42s ease;
}
.lhs-premium-collections .collection-tile:hover img{
transform:scale(1.018) !important;
filter:saturate(1) contrast(1.015);
}
.lhs-premium-collections .collection-overlay{
position:absolute !important;
left:0 !important;
right:auto !important;
top:0 !important;
bottom:0 !important;
z-index:2 !important;
width:49%;
padding:clamp(26px,3vw,48px);
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center;
color:#17120f;
text-align:left;
text-shadow:none !important;
}
.lhs-premium-collections .collection-overlay > *{
opacity:1 !important;
animation:none !important;
transform:none !important;
}
.lhs-premium-collections .collection-kicker{
display:block !important;
min-width:0 !important;
height:auto !important;
padding:0 !important;
margin:0 0 12px;
border:0 !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
color:#9b6a2d !important;
font-size:10px !important;
font-weight:800;
line-height:1.2;
letter-spacing:.23em !important;
text-transform:uppercase;
}
.lhs-premium-collections .collection-overlay h2{
max-width:360px;
margin:0 0 22px !important;
color:#17120f;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(28px,2.25vw,42px) !important;
font-weight:400;
line-height:1.04 !important;
letter-spacing:-.04em !important;
}
.lhs-premium-collections .collection-cta{
display:inline-flex !important;
align-items:center;
justify-content:center;
gap:14px;
min-width:0 !important;
width:auto !important;
height:46px !important;
padding:0 22px !important;
border:1px solid rgba(23,18,15,.18) !important;
border-radius:999px !important;
background:#17120f !important;
color:#f5dfb7 !important;
box-shadow:0 12px 26px rgba(28,19,12,.14) !important;
font-size:11px !important;
font-weight:800;
line-height:1;
letter-spacing:.17em !important;
text-transform:uppercase;
transition:transform .28s ease, box-shadow .28s ease, background .28s ease;
}
.lhs-premium-collections .collection-cta-arrow{
display:inline-block !important;
min-width:auto !important;
width:auto !important;
height:auto !important;
padding:0 !important;
border:0 !important;
background:transparent !important;
box-shadow:none !important;
color:inherit !important;
font-size:15px !important;
letter-spacing:0 !important;
transition:transform .28s ease;
}
.lhs-premium-collections .collection-tile:hover .collection-cta{
transform:translateY(-2px) !important;
background:#0f0c0a !important;
box-shadow:0 17px 34px rgba(28,19,12,.20) !important;
}
.lhs-premium-collections .collection-tile:hover .collection-cta-arrow{
transform:translateX(3px) !important;
}
html[dir="rtl"] .lhs-premium-collections .collection-overlay{
left:0 !important;
right:auto !important;
align-items:flex-end;
text-align:right;
}
html[dir="rtl"] .lhs-premium-collections .collection-cta-arrow{
transform:rotate(180deg) !important;
}
html[dir="rtl"] .lhs-premium-collections .collection-tile:hover .collection-cta-arrow{
transform:rotate(180deg) translateX(3px) !important;
}
@media(max-width:980px){
.lhs-premium-collections{
gap:18px !important;
padding:0 20px 62px !important;
}
.lhs-premium-collections .collection-overlay{
width:52%;
padding:26px;
}
.lhs-premium-collections .collection-overlay h2{
max-width:280px;
font-size:clamp(25px,3.2vw,34px) !important;
margin-bottom:18px !important;
}
}
@media(max-width:760px){
.lhs-premium-collections{
grid-template-columns:1fr !important;
gap:20px !important;
padding:0 16px 52px !important;
}
.lhs-premium-collections .collection-tile{
aspect-ratio:auto !important;
display:flex;
flex-direction:column;
border-radius:22px;
}
.lhs-premium-collections .collection-tile::before,
.lhs-premium-collections .collection-tile::after{
display:none;
}
.lhs-premium-collections .collection-tile img{
height:auto !important;
aspect-ratio:16 / 9;
object-fit:cover !important;
object-position:72% center !important;
}
.lhs-premium-collections .collection-overlay,
html[dir="rtl"] .lhs-premium-collections .collection-overlay{
position:static !important;
width:100%;
padding:24px 22px 26px;
align-items:flex-start;
text-align:left;
background:linear-gradient(180deg,#f9f4ed 0%,#f3e8dc 100%);
}
html[dir="rtl"] .lhs-premium-collections .collection-overlay{
align-items:flex-end;
text-align:right;
}
.lhs-premium-collections .collection-overlay h2{
max-width:100%;
margin-bottom:18px !important;
font-size:30px !important;
}
}
@media(prefers-reduced-motion:reduce){
.lhs-premium-collections .collection-tile,
.lhs-premium-collections .collection-tile img,
.lhs-premium-collections .collection-cta,
.lhs-premium-collections .collection-cta-arrow{
transition:none !important;
}
}
/* July 15, 2026 — premium non-typing reveals + refreshed LHS standard block */
.heritage-section{
padding:70px 28px 82px !important;
background:
radial-gradient(circle at 12% 0%,rgba(203,153,91,.08),rgba(203,153,91,0) 28%),
linear-gradient(180deg,#fff 0%,#fbf8f3 62%,#f7f1e9 100%) !important;
}
.heritage-copy.heritage-standard{
max-width:1120px;
margin:0 auto 48px;
padding:0 22px;
text-align:center;
}
.heritage-standard-eyebrow{
display:inline-flex;
align-items:center;
justify-content:center;
margin:0 0 15px !important;
color:#9b6a2d !important;
font-size:10px !important;
font-weight:800;
line-height:1.2 !important;
letter-spacing:.28em;
text-transform:uppercase;
}
.heritage-standard h2{
max-width:780px;
margin:0 auto 18px !important;
color:#17120f;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(42px,4.2vw,64px) !important;
font-weight:400 !important;
line-height:1.02 !important;
letter-spacing:-.045em !important;
}
.heritage-standard-description{
max-width:790px;
margin:0 auto !important;
color:rgba(23,18,15,.70) !important;
font-size:17px !important;
line-height:1.72 !important;
}
.heritage-proof-grid{
max-width:900px;
margin:38px auto 0;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
border-top:1px solid rgba(123,84,42,.14);
border-bottom:1px solid rgba(123,84,42,.14);
}
.heritage-proof-item{
position:relative;
min-height:116px;
padding:25px 28px 23px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:7px;
}
.heritage-proof-item + .heritage-proof-item::before{
content:"";
position:absolute;
left:0;
top:24px;
bottom:24px;
width:1px;
background:rgba(123,84,42,.14);
}
.heritage-proof-value{
color:#17120f;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(27px,2.4vw,36px);
font-weight:400;
line-height:1;
letter-spacing:-.035em;
}
.heritage-proof-label{
color:#9b6a2d;
font-size:10px;
font-weight:800;
line-height:1.35;
letter-spacing:.17em;
text-transform:uppercase;
}
.heritage-standard.is-motion-ready .heritage-standard-eyebrow,
.heritage-standard.is-motion-ready h2,
.heritage-standard.is-motion-ready .heritage-standard-description,
.heritage-standard.is-motion-ready .heritage-proof-item{
opacity:0;
transform:translateY(22px);
filter:blur(8px);
}
.heritage-standard.is-motion-ready .heritage-standard-eyebrow,
.heritage-standard.is-motion-ready h2,
.heritage-standard.is-motion-ready .heritage-standard-description{
transition:opacity .76s cubic-bezier(.2,.7,.2,1),transform .76s cubic-bezier(.2,.7,.2,1),filter .76s ease;
}
.heritage-standard.is-motion-ready .heritage-proof-item{
transition:opacity .72s cubic-bezier(.2,.7,.2,1),transform .72s cubic-bezier(.2,.7,.2,1),filter .72s ease;
}
.heritage-standard.is-revealed .heritage-standard-eyebrow,
.heritage-standard.is-revealed h2,
.heritage-standard.is-revealed .heritage-standard-description,
.heritage-standard.is-revealed .heritage-proof-item{
opacity:1;
transform:translateY(0);
filter:blur(0);
}
.heritage-standard.is-revealed h2{transition-delay:.08s;}
.heritage-standard.is-revealed .heritage-standard-description{transition-delay:.17s;}
.heritage-standard.is-revealed .heritage-proof-item:nth-child(1){transition-delay:.25s;}
.heritage-standard.is-revealed .heritage-proof-item:nth-child(2){transition-delay:.34s;}
.heritage-standard.is-revealed .heritage-proof-item:nth-child(3){transition-delay:.43s;}
/* Staggered mask-like reveal for the two collection cards — no typewriter effect. */
.lhs-premium-collections .collection-tile.is-motion-ready .collection-overlay > *{
opacity:0 !important;
transform:translateY(22px) scale(.985) !important;
filter:blur(9px);
clip-path:inset(0 0 42% 0 round 2px);
transition:
opacity .72s cubic-bezier(.2,.7,.2,1),
transform .72s cubic-bezier(.2,.7,.2,1),
filter .72s ease,
clip-path .82s cubic-bezier(.2,.7,.2,1) !important;
}
.lhs-premium-collections .collection-tile.is-motion-ready img{
transform:scale(1.035) !important;
filter:saturate(.91) contrast(.985) blur(1px);
}
.lhs-premium-collections .collection-tile.is-content-revealed img{
transform:scale(1) !important;
filter:saturate(.96) contrast(1.01) blur(0);
}
.lhs-premium-collections .collection-tile.is-content-revealed .collection-overlay > *{
opacity:1 !important;
transform:translateY(0) scale(1) !important;
filter:blur(0);
clip-path:inset(0 0 0 0 round 2px);
}
.lhs-premium-collections .collection-tile.is-content-revealed .collection-kicker{transition-delay:.04s !important;}
.lhs-premium-collections .collection-tile.is-content-revealed .collection-overlay h2{transition-delay:.13s !important;}
.lhs-premium-collections .collection-tile.is-content-revealed .collection-cta{transition-delay:.25s !important;}
.lhs-premium-collections .collection-tile.is-content-revealed:hover img{
transform:scale(1.018) !important;
filter:saturate(1) contrast(1.015) blur(0);
}
html[dir="rtl"] .heritage-proof-label{
letter-spacing:.04em;
}
@media(max-width:760px){
.heritage-section{
padding:54px 16px 58px !important;
}
.heritage-copy.heritage-standard{
margin-bottom:34px;
padding:0 5px;
}
.heritage-standard h2{
font-size:40px !important;
line-height:1.05 !important;
}
.heritage-standard-description{
font-size:16px !important;
line-height:1.68 !important;
}
.heritage-proof-grid{
margin-top:30px;
grid-template-columns:1fr;
}
.heritage-proof-item{
min-height:94px;
padding:20px;
}
.heritage-proof-item + .heritage-proof-item::before{
left:18%;
right:18%;
top:0;
bottom:auto;
width:auto;
height:1px;
}
}
@media(prefers-reduced-motion:reduce){
.heritage-standard.is-motion-ready .heritage-standard-eyebrow,
.heritage-standard.is-motion-ready h2,
.heritage-standard.is-motion-ready .heritage-standard-description,
.heritage-standard.is-motion-ready .heritage-proof-item,
.lhs-premium-collections .collection-tile.is-motion-ready .collection-overlay > *,
.lhs-premium-collections .collection-tile.is-motion-ready img{
opacity:1 !important;
transform:none !important;
filter:none !important;
clip-path:none !important;
transition:none !important;
}
}
/* 2026-07-16: LHS Journal editorial three-card redesign */
.lhs-journal-editorial{
padding:84px 48px 96px;
background:linear-gradient(180deg,#fff 0%,#faf7f1 100%);
}
.lhs-journal-header{
max-width:1420px;
margin:0 auto 46px;
display:flex;
flex-direction:row;
align-items:flex-end;
justify-content:space-between;
gap:28px;
text-align:left;
}
.lhs-journal-heading-copy{
min-width:0;
}
.lhs-journal-header .insights-kicker{
margin:0 0 12px;
color:#a47d43;
font-size:12px;
letter-spacing:.36em;
}
.lhs-journal-header h2{
margin:0;
max-width:980px;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(42px,5.2vw,78px);
line-height:.98;
font-weight:400;
letter-spacing:-.045em;
color:#17130f;
}
.lhs-journal-viewall{
flex:0 0 auto;
min-width:154px;
height:54px;
padding:0 24px;
border:1px solid rgba(164,125,67,.62);
border-radius:8px;
background:rgba(255,255,255,.52);
color:#9a7137;
font-size:12px;
letter-spacing:.14em;
box-shadow:0 12px 30px rgba(45,31,18,.06);
backdrop-filter:blur(12px);
transition:transform .3s ease, background .3s ease, color .3s ease, box-shadow .3s ease;
}
.lhs-journal-viewall:hover{
transform:translateY(-3px);
background:#17120e;
color:#f3d59f;
box-shadow:0 18px 42px rgba(45,31,18,.18);
}
.lhs-journal-grid{
max-width:1420px;
margin:0 auto;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:30px;
}
.lhs-journal-card{
position:relative;
min-width:0;
opacity:0;
transform:translateY(34px);
filter:blur(7px);
transition:opacity .78s ease, transform .9s cubic-bezier(.2,.8,.2,1), filter .78s ease;
}
.lhs-journal-card.is-journal-visible{
opacity:1;
transform:translateY(0);
filter:blur(0);
}
.lhs-journal-card:nth-child(2){transition-delay:.12s}
.lhs-journal-card:nth-child(3){transition-delay:.24s}
.lhs-journal-link{
position:relative;
display:block;
min-height:650px;
overflow:hidden;
border:1px solid rgba(63,45,28,.10);
border-radius:22px;
background:#d6c3aa;
color:#fff;
text-decoration:none;
box-shadow:0 20px 58px rgba(43,31,20,.12);
isolation:isolate;
transition:transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s ease, border-color .5s ease;
}
.lhs-journal-link:hover{
transform:translateY(-10px);
border-color:rgba(174,130,65,.42);
box-shadow:0 34px 78px rgba(43,31,20,.22);
}
.lhs-journal-media,
.lhs-journal-media img,
.lhs-journal-scrim{
position:absolute;
inset:0;
display:block;
width:100%;
height:100%;
}
.lhs-journal-media img{
object-fit:cover;
transform:scale(1.015);
transition:transform 1.1s cubic-bezier(.2,.8,.2,1), filter 1.1s ease;
}
.lhs-journal-link:hover .lhs-journal-media img{
transform:scale(1.07);
filter:contrast(1.035) saturate(1.025);
}
.lhs-journal-scrim{
z-index:1;
background:
linear-gradient(180deg,rgba(18,13,10,0) 35%,rgba(18,13,10,.24) 56%,rgba(18,13,10,.86) 100%),
linear-gradient(105deg,rgba(255,244,222,.12) 0%,rgba(255,244,222,0) 44%);
}
.lhs-journal-scrim::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(115deg,transparent 0%,rgba(255,255,255,.16) 45%,transparent 61%);
transform:translateX(-130%);
transition:transform 1.05s cubic-bezier(.2,.8,.2,1);
}
.lhs-journal-link:hover .lhs-journal-scrim::after{
transform:translateX(130%);
}
.lhs-journal-copy{
position:absolute;
z-index:2;
left:34px;
right:34px;
bottom:32px;
display:flex;
flex-direction:column;
align-items:flex-start;
color:#fff;
text-shadow:0 2px 18px rgba(0,0,0,.22);
}
.lhs-journal-label,
.lhs-journal-copy h3,
.lhs-journal-description,
.lhs-journal-cta{
opacity:0;
transform:translateY(18px);
transition:opacity .62s ease, transform .72s cubic-bezier(.2,.8,.2,1);
}
.is-journal-visible .lhs-journal-label,
.is-journal-visible .lhs-journal-copy h3,
.is-journal-visible .lhs-journal-description,
.is-journal-visible .lhs-journal-cta{
opacity:1;
transform:translateY(0);
}
.is-journal-visible .lhs-journal-copy h3{transition-delay:.10s}
.is-journal-visible .lhs-journal-description{transition-delay:.18s}
.is-journal-visible .lhs-journal-cta{transition-delay:.27s}
.lhs-journal-label{
margin-bottom:8px;
color:#e6bc78;
font-size:11px;
font-weight:700;
letter-spacing:.21em;
text-transform:uppercase;
}
.lhs-journal-copy h3{
margin:0;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(31px,2.7vw,48px);
line-height:1.02;
font-weight:400;
letter-spacing:-.035em;
}
.lhs-journal-description{
max-width:360px;
margin-top:12px;
font-size:15px;
line-height:1.52;
color:rgba(255,255,255,.90);
}
.lhs-journal-cta{
display:inline-flex;
align-items:center;
justify-content:space-between;
gap:24px;
min-width:176px;
min-height:48px;
margin-top:24px;
padding:0 20px;
border:1px solid rgba(222,179,108,.82);
border-radius:7px;
color:#e9c27f;
background:rgba(20,15,11,.28);
backdrop-filter:blur(10px);
font-size:12px;
font-weight:700;
letter-spacing:.12em;
text-shadow:none;
transition:gap .28s ease, color .28s ease, background .28s ease, border-color .28s ease;
}
.lhs-journal-link:hover .lhs-journal-cta{
gap:32px;
color:#17120e;
background:#f0cf98;
border-color:#f0cf98;
}
html[dir="rtl"] .lhs-journal-header{
text-align:right;
}
html[dir="rtl"] .lhs-journal-copy{
align-items:flex-end;
text-align:right;
}
html[dir="rtl"] .lhs-journal-cta span,
html[dir="rtl"] .lhs-journal-viewall span{
display:inline-block;
transform:scaleX(-1);
}
@media(max-width:1080px){
.lhs-journal-editorial{padding:70px 28px 82px}
.lhs-journal-grid{gap:18px}
.lhs-journal-link{min-height:560px;border-radius:18px}
.lhs-journal-copy{left:24px;right:24px;bottom:24px}
.lhs-journal-description{font-size:13px}
.lhs-journal-cta{min-width:150px;min-height:44px;margin-top:18px}
}
@media(max-width:760px){
.lhs-journal-editorial{padding:58px 18px 68px}
.lhs-journal-header{
margin-bottom:30px;
align-items:flex-start;
flex-direction:column;
}
.lhs-journal-header h2{font-size:42px;line-height:1.02}
.lhs-journal-viewall{min-width:132px;height:48px}
.lhs-journal-grid{grid-template-columns:1fr;gap:20px}
.lhs-journal-link{min-height:560px}
.lhs-journal-copy h3{font-size:38px}
}
@media(max-width:480px){
.lhs-journal-editorial{padding-left:12px;padding-right:12px}
.lhs-journal-header h2{font-size:36px}
.lhs-journal-link{min-height:510px;border-radius:16px}
.lhs-journal-copy{left:22px;right:22px;bottom:22px}
.lhs-journal-copy h3{font-size:34px}
.lhs-journal-description{max-width:290px}
}
@media(prefers-reduced-motion:reduce){
.lhs-journal-card,
.lhs-journal-label,
.lhs-journal-copy h3,
.lhs-journal-description,
.lhs-journal-cta{
opacity:1!important;
transform:none!important;
filter:none!important;
transition:none!important;
}
.lhs-journal-media img{transition:none!important}
}
/* =========================================================
July 16, 2026 — Homepage hero mobile position hard-fix
Neutralize desktop left/right offsets on stacked mobile slides.
========================================================= */
@media(max-width:700px){
.lhs-home-hero .lhs-home-hero-copy-left .lhs-home-hero-copy,
.lhs-home-hero .lhs-home-hero-copy-right .lhs-home-hero-copy{
position:relative !important;
inset:auto !important;
top:auto !important;
left:0 !important;
right:0 !important;
bottom:auto !important;
width:100% !important;
max-width:100% !important;
min-width:0 !important;
height:350px !important;
margin:0 !important;
padding:26px 22px 54px !important;
transform:none !important;
box-sizing:border-box !important;
overflow:hidden !important;
}
.lhs-home-hero{
height:730px !important;
min-height:730px !important;
max-height:730px !important;
}
.lhs-home-hero .lhs-home-hero-slide.active{
grid-template-rows:380px 350px !important;
width:100% !important;
max-width:100% !important;
overflow:hidden !important;
}
.lhs-home-hero .lhs-home-hero-copy > *{
width:100% !important;
max-width:100% !important;
min-width:0 !important;
box-sizing:border-box !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-title,
.lhs-home-hero .lhs-home-hero-copy .typewriter-title span{
width:100% !important;
max-width:100% !important;
white-space:normal !important;
overflow-wrap:break-word !important;
word-break:normal !important;
hyphens:none !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-title{
font-size:clamp(27px,7.6vw,35px) !important;
line-height:1.04 !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-body{
width:100% !important;
max-width:100% !important;
white-space:normal !important;
overflow-wrap:anywhere !important;
font-size:13.5px !important;
line-height:1.46 !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-cta{
width:auto !important;
min-width:0 !important;
max-width:100% !important;
padding-inline:22px !important;
white-space:normal !important;
text-align:center !important;
line-height:1.25 !important;
}
html[dir="rtl"] .lhs-home-hero .lhs-home-hero-copy-left .lhs-home-hero-copy,
html[dir="rtl"] .lhs-home-hero .lhs-home-hero-copy-right .lhs-home-hero-copy{
left:0 !important;
right:0 !important;
}
}
@media(max-width:420px){
.lhs-home-hero{
height:710px !important;
min-height:710px !important;
max-height:710px !important;
}
.lhs-home-hero .lhs-home-hero-slide.active{
grid-template-rows:350px 360px !important;
}
.lhs-home-hero .model-area{
height:350px !important;
min-height:350px !important;
max-height:350px !important;
}
.lhs-home-hero .lhs-home-hero-copy-left .lhs-home-hero-copy,
.lhs-home-hero .lhs-home-hero-copy-right .lhs-home-hero-copy{
height:360px !important;
padding:24px 18px 52px !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-title{
font-size:clamp(26px,8vw,33px) !important;
}
.lhs-home-hero .lhs-home-hero-copy .typewriter-body{
font-size:13px !important;
}
}
/* =========================================================
July 16, 2026 — Cross-device CSS audit hardening layer
Static responsive review: viewport safety, iOS controls,
fixed-action stacking, dynamic viewport units, RTL wrapping.
========================================================= */
/* Prevent flex/grid children and rich media from forcing page overflow. */
html,
body{
width:100%;
max-width:100%;
}
@supports (overflow:clip){
html,
body{overflow-x:clip !important;}
}
main,
section,
article,
header,
footer,
nav,
div,
form,
fieldset,
.grid,
[class*="grid"],
[class*="wrap"],
[class*="inner"]{
min-inline-size:0;
}
img,
picture,
video,
canvas,
svg{
max-inline-size:100%;
}
input,
select,
textarea,
button{
max-inline-size:100%;
}
/* Dynamic viewport support for full-height overlays and drawers. */
.mobile-nav{
max-height:calc(100vh - var(--site-header-total, 118px));
max-height:calc(100dvh - var(--site-header-total, 118px));
}
.lhs-store-cart-drawer{
height:100vh !important;
height:100dvh !important;
max-height:100dvh !important;
}
/* Avoid sticky hover states and oversized motion on touch screens. */
@media(hover:none), (pointer:coarse){
.lhs-journal-link:hover,
.lhs-premium-collections .collection-tile:hover,
.product:hover,
.media-card:hover{
transform:none !important;
}
.lhs-journal-link:hover .lhs-journal-media img,
.lhs-premium-collections .collection-tile:hover img,
.product:hover img,
.media-card:hover img{
transform:none !important;
}
}
@media(max-width:760px){
/* iOS Safari: 16px prevents automatic form zoom. */
input,
select,
textarea{
font-size:16px !important;
}
/* Reliable wrapping for bilingual and long live-copy content. */
h1,
h2,
h3,
h4,
p,
a,
button,
label,
legend,
.typewriter-title,
.typewriter-body,
.collection-overlay,
.lhs-journal-copy,
.heritage-standard{
min-width:0 !important;
max-width:100%;
overflow-wrap:break-word;
word-break:normal;
}
/* Minimum practical touch target without stretching text buttons. */
button,
select,
input[type="button"],
input[type="submit"],
input[type="reset"],
.typewriter-cta,
.collection-cta,
.lhs-journal-cta{
min-height:44px;
}
/* Safe-area aware mobile menu. */
.mobile-nav{
max-height:calc(100dvh - var(--site-header-total, 118px)) !important;
padding-bottom:calc(24px + env(safe-area-inset-bottom, 0px)) !important;
overscroll-behavior:contain;
}
/* Stack all fixed utilities instead of letting them overlap. */
.lhs-quick-actions{
right:max(12px, env(safe-area-inset-right, 0px)) !important;
bottom:calc(12px + env(safe-area-inset-bottom, 0px)) !important;
}
.lhs-floating-cart{
right:max(12px, env(safe-area-inset-right, 0px)) !important;
bottom:calc(78px + env(safe-area-inset-bottom, 0px)) !important;
width:52px !important;
height:52px !important;
}
.lhs-floating-cart svg{
width:23px !important;
height:23px !important;
}
.lhs-floating-cart-count{
min-width:21px !important;
height:21px !important;
font-size:10px !important;
}
.lhs-back-to-top{
right:max(16px, env(safe-area-inset-right, 0px)) !important;
bottom:calc(142px + env(safe-area-inset-bottom, 0px)) !important;
width:42px !important;
height:42px !important;
}
.lhs-quick-panel{
max-height:min(360px, calc(100dvh - 120px));
overflow:auto;
overscroll-behavior:contain;
}
/* Drawer content remains reachable above the iPhone home indicator. */
.lhs-store-cart-body,
.lhs-store-cart-footer{
padding-bottom:calc(20px + env(safe-area-inset-bottom, 0px));
}
/* Keep the LHS Standard section readable on narrow phones. */
.heritage-copy.heritage-standard{
width:100%;
padding-inline:0 !important;
}
.heritage-standard h2{
max-width:18ch !important;
margin-inline:auto !important;
overflow-wrap:normal !important;
}
.heritage-standard-description{
max-width:38ch !important;
margin-inline:auto !important;
}
}
@media(max-width:420px){
.lhs-quick-toggle{
min-width:152px;
height:48px;
padding-inline:18px;
font-size:11px;
}
.heritage-standard h2{
font-size:clamp(34px,10.5vw,40px) !important;
line-height:1.03 !important;
}
.heritage-standard-description{
font-size:15px !important;
line-height:1.62 !important;
}
.lhs-journal-header h2{
font-size:clamp(32px,10vw,38px) !important;
}
.lhs-journal-copy h3{
font-size:clamp(30px,9vw,34px) !important;
}
}
/* One global accessibility fallback instead of relying only on section rules. */
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto !important;}
*,
*::before,
*::after{
animation-duration:.01ms !important;
animation-iteration-count:1 !important;
transition-duration:.01ms !important;
scroll-behavior:auto !important;
}
}
/* =========================================================
LHS support cards — compact, softer editorial refinement
July 16, 2026
========================================================= */
.lhs-support-strip{
gap:clamp(20px,2vw,30px) !important;
padding:clamp(52px,4.8vw,72px) clamp(24px,5.5vw,96px) clamp(50px,4.6vw,68px) !important;
background:
radial-gradient(circle at 13% 14%,rgba(218,183,126,.085),transparent 23%),
radial-gradient(circle at 88% 82%,rgba(218,183,126,.075),transparent 22%),
linear-gradient(180deg,#fffdfa 0%,#faf6ef 58%,#f5efe6 100%) !important;
}
.lhs-support-strip::before{
opacity:.7;
}
.lhs-support-strip .contact-strip-card{
min-height:468px !important;
max-width:480px;
padding:30px 30px 24px !important;
border-color:rgba(112,76,36,.075) !important;
border-radius:28px !important;
background:
linear-gradient(180deg,rgba(255,255,255,.94) 0%,rgba(255,253,249,.96) 44%,rgba(249,244,236,.97) 100%) !important;
box-shadow:
0 16px 42px rgba(38,27,18,.065),
inset 0 1px 0 rgba(255,255,255,.96) !important;
transition:transform .32s cubic-bezier(.2,.7,.2,1),box-shadow .32s ease,border-color .32s ease !important;
}
.lhs-support-strip .contact-strip-card::before{
left:30px !important;
right:30px !important;
height:2px !important;
opacity:.68 !important;
}
.lhs-support-strip .contact-strip-card::after{
width:170px !important;
height:170px !important;
right:-66px !important;
bottom:-82px !important;
opacity:.64;
}
.lhs-support-strip .contact-strip-card:hover{
transform:translateY(-4px) !important;
border-color:rgba(168,116,47,.14) !important;
box-shadow:
0 24px 52px rgba(38,27,18,.10),
inset 0 1px 0 rgba(255,255,255,.98) !important;
}
.lhs-support-strip .contact-icon{
width:86px !important;
height:86px !important;
margin-bottom:15px !important;
border-radius:24px !important;
border-color:rgba(235,207,158,.56) !important;
background:
radial-gradient(circle at 50% 22%,rgba(255,236,199,.11),transparent 34%),
linear-gradient(155deg,#201814 0%,#17120f 60%,#241b16 100%) !important;
box-shadow:
0 0 0 3px rgba(213,174,109,.075),
0 13px 28px rgba(25,17,12,.17),
inset 0 1px 0 rgba(255,244,221,.12) !important;
}
.lhs-support-strip .contact-icon::before{
inset:8px !important;
border-radius:18px !important;
opacity:.72;
}
.lhs-support-strip .contact-icon::after{
left:16px !important;
right:16px !important;
top:11px !important;
opacity:.7;
}
.lhs-support-strip .contact-icon svg{
width:40px !important;
height:40px !important;
stroke-width:2.35 !important;
filter:drop-shadow(0 2px 4px rgba(0,0,0,.18)) !important;
}
.lhs-support-strip .contact-strip-card:hover .contact-icon{
transform:translateY(-2px) scale(1.012) !important;
box-shadow:
0 0 0 4px rgba(213,174,109,.09),
0 17px 32px rgba(25,17,12,.20),
inset 0 1px 0 rgba(255,244,221,.14) !important;
}
.lhs-support-strip .lhs-support-kicker{
min-height:31px !important;
padding:0 14px !important;
margin-bottom:13px !important;
border-color:rgba(168,116,47,.13) !important;
background:rgba(255,253,248,.83) !important;
box-shadow:0 5px 14px rgba(84,54,24,.025),inset 0 1px 0 rgba(255,255,255,.92) !important;
font-size:10px !important;
letter-spacing:.20em !important;
}
.lhs-support-strip .contact-strip-card h2{
margin-bottom:12px !important;
font-size:clamp(28px,2vw,36px) !important;
line-height:1.08 !important;
letter-spacing:-.03em !important;
}
.lhs-support-strip .contact-strip-card p:not(:last-child){
max-width:360px !important;
font-size:16px !important;
line-height:1.58 !important;
color:rgba(28,24,21,.64) !important;
}
.lhs-support-strip .contact-strip-card p:last-child{
width:100%;
padding-top:22px !important;
}
.lhs-support-strip .contact-strip-card p:last-child a{
min-height:52px !important;
padding:8px 20px !important;
border-color:rgba(225,190,132,.20) !important;
background:linear-gradient(135deg,#191410 0%,#241c17 58%,#15110e 100%) !important;
box-shadow:
0 12px 24px rgba(26,18,12,.12),
inset 0 1px 0 rgba(255,239,211,.065) !important;
font-size:13px !important;
letter-spacing:.13em !important;
}
.lhs-support-strip .lhs-support-card-email p:last-child a{
font-size:14px !important;
letter-spacing:0 !important;
overflow-wrap:anywhere;
}
@media(max-width:1100px){
.lhs-support-strip .contact-strip-card{
min-height:450px !important;
max-width:540px;
}
}
@media(max-width:760px){
.lhs-support-strip{
gap:16px !important;
padding:42px 16px 40px !important;
}
.lhs-support-strip .contact-strip-card,
.lhs-support-strip .contact-strip-card:last-child{
min-height:auto !important;
padding:25px 20px 20px !important;
border-radius:24px !important;
}
.lhs-support-strip .contact-icon{
width:76px !important;
height:76px !important;
margin-bottom:13px !important;
border-radius:21px !important;
}
.lhs-support-strip .contact-icon::before{
inset:7px !important;
border-radius:16px !important;
}
.lhs-support-strip .contact-icon svg{
width:35px !important;
height:35px !important;
}
.lhs-support-strip .lhs-support-kicker{
min-height:29px !important;
margin-bottom:11px !important;
padding-inline:12px !important;
font-size:9px !important;
letter-spacing:.17em !important;
}
.lhs-support-strip .contact-strip-card h2{
margin-bottom:10px !important;
font-size:28px !important;
}
.lhs-support-strip .contact-strip-card p:not(:last-child){
max-width:330px !important;
font-size:15px !important;
line-height:1.55 !important;
}
.lhs-support-strip .contact-strip-card p:last-child{
margin-top:0 !important;
padding-top:18px !important;
}
.lhs-support-strip .contact-strip-card p:last-child a{
min-height:50px !important;
padding-inline:15px !important;
font-size:12px !important;
letter-spacing:.095em !important;
}
.lhs-support-strip .lhs-support-card-email p:last-child a{
font-size:13px !important;
}
}
@media(max-width:390px){
.lhs-support-strip{
padding-inline:12px !important;
}
.lhs-support-strip .contact-strip-card{
padding-inline:17px !important;
}
.lhs-support-strip .contact-strip-card h2{
font-size:26px !important;
}
}
/* 2026-07-18: Official System Finder homepage entry */
.lhs-home-finder-callout{
width:min(1420px,calc(100% - 96px));
margin:72px auto 10px;
padding:38px 42px;
display:flex;
align-items:center;
justify-content:space-between;
gap:40px;
border:1px solid rgba(178,133,67,.22);
border-radius:20px;
background:linear-gradient(105deg,#17120e 0%,#2e2117 56%,#4a3422 100%);
color:#fff;
box-shadow:0 22px 54px rgba(42,29,17,.14);
}
.lhs-home-finder-copy{max-width:900px;min-width:0}
.lhs-home-finder-copy p{margin:0 0 9px;color:#ddb36d;font-size:10px;font-weight:700;letter-spacing:.22em}
.lhs-home-finder-copy h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(30px,3.1vw,47px);line-height:1.04;font-weight:400;letter-spacing:-.035em}
.lhs-home-finder-copy span{display:block;max-width:760px;margin-top:12px;color:rgba(255,255,255,.72);font-size:15px;line-height:1.6}
.lhs-home-finder-callout>a{flex:0 0 auto;min-height:54px;padding:0 24px;display:inline-flex;align-items:center;justify-content:center;gap:22px;border:1px solid rgba(225,184,116,.74);border-radius:8px;color:#ebc98f;text-decoration:none;font-size:11px;font-weight:700;letter-spacing:.12em;transition:transform .3s ease,background .3s ease,color .3s ease}
.lhs-home-finder-callout>a:hover{transform:translateY(-3px);background:#e4bd7b;color:#17120e}
html[dir="rtl"] .lhs-home-finder-callout>a span{display:inline-block;transform:scaleX(-1)}
@media(max-width:800px){
.lhs-home-finder-callout{width:calc(100% - 36px);margin-top:46px;padding:30px 26px;align-items:flex-start;flex-direction:column;gap:24px}
.lhs-home-finder-callout>a{width:100%}
}
@media(max-width:480px){
.lhs-home-finder-callout{width:calc(100% - 24px);padding:26px 20px;border-radius:16px}
.lhs-home-finder-copy h2{font-size:32px}
}
/* =========================================================
2026-07-18 — LHS Knowledge Center + Base Family Guide
========================================================= */
.lhs-kc-main{background:#f7f4ee;color:#191612;overflow:hidden}
.lhs-kc-shell{width:min(1420px,calc(100% - 64px));margin-inline:auto}
.lhs-kc-hero{padding:92px 0 86px;background:radial-gradient(circle at 82% 35%,rgba(194,158,101,.19),transparent 29%),linear-gradient(145deg,#15110e,#2b2119 62%,#17120f);color:#fff}
.lhs-kc-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr);align-items:center;gap:72px}
.lhs-kc-eyebrow,.lhs-kc-section-head p,.lhs-kc-base-card>p,.lhs-kc-paths .lhs-kc-section-head p{margin:0 0 14px;color:#c69b5a;font-size:12px;font-weight:700;letter-spacing:.25em;text-transform:uppercase}
.lhs-kc-hero h1,.lhs-kc-compare-hero h1{margin:0;max-width:820px;font:400 clamp(50px,6.3vw,92px)/.96 Georgia,"Times New Roman",serif;letter-spacing:-.055em}
.lhs-kc-hero-copy>p:not(.lhs-kc-eyebrow),.lhs-kc-compare-hero .lhs-kc-shell>p:last-child{max-width:690px;margin:28px 0 0;color:rgba(255,255,255,.76);font-size:18px;line-height:1.75}
.lhs-kc-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.lhs-kc-primary,.lhs-kc-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border-radius:7px;font-size:12px;font-weight:700;letter-spacing:.13em;text-decoration:none;transition:.3s ease}
.lhs-kc-primary{background:#c99b57;color:#16110d;border:1px solid #c99b57}.lhs-kc-secondary{border:1px solid rgba(255,255,255,.28);color:#fff;background:rgba(255,255,255,.05)}
.lhs-kc-primary:hover,.lhs-kc-secondary:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(0,0,0,.22)}
.lhs-kc-hero-visual{position:relative;min-height:440px;isolation:isolate}
.lhs-kc-hero-visual::before{content:"";position:absolute;inset:9% 8%;border:1px solid rgba(221,188,132,.23);border-radius:50%;box-shadow:inset 0 0 80px rgba(214,174,111,.08)}
.lhs-kc-base-orbit{position:absolute;display:grid;place-items:center;width:210px;height:210px;border-radius:50%;background:rgba(255,255,255,.055);border:1px solid rgba(229,198,147,.3);backdrop-filter:blur(14px);box-shadow:0 28px 70px rgba(0,0,0,.23)}
.lhs-kc-base-orbit i{width:106px;height:106px;border-radius:50%;display:block}.lhs-kc-base-orbit b{font-size:11px;letter-spacing:.2em;color:#e7c58e}
.lhs-kc-orbit-lace{left:0;top:16px}.lhs-kc-orbit-skin{right:0;top:96px}.lhs-kc-orbit-mono{left:31%;bottom:0}
.lhs-kc-orbit-lace i,.lhs-kc-base-swatch.lace{background:repeating-linear-gradient(45deg,rgba(190,152,96,.45) 0 1px,transparent 1px 7px),repeating-linear-gradient(-45deg,rgba(190,152,96,.35) 0 1px,#e9dfce 1px 7px)}
.lhs-kc-orbit-skin i,.lhs-kc-base-swatch.skin{background:radial-gradient(circle at 35% 28%,#fff8ea,#d8bd99 55%,#b78d5f);box-shadow:inset 0 0 0 1px rgba(92,62,30,.15)}
.lhs-kc-orbit-mono i,.lhs-kc-base-swatch.mono{background:repeating-radial-gradient(circle at center,#d5c1a1 0 1px,#f2eadc 1px 5px)}
.lhs-kc-directory{padding:94px 0 104px}
.lhs-kc-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:38px}
.lhs-kc-section-head h2{margin:0;max-width:820px;font:400 clamp(38px,4vw,62px)/1 Georgia,"Times New Roman",serif;letter-spacing:-.04em}
.lhs-kc-section-head>span{max-width:360px;color:#6f665b;font-size:14px;line-height:1.55;text-align:right}
.lhs-kc-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.lhs-kc-guide-card{position:relative;min-height:360px;padding:30px;border:1px solid rgba(76,56,34,.12);border-radius:18px;background:rgba(255,255,255,.7);box-shadow:0 16px 44px rgba(53,39,24,.055);display:flex;flex-direction:column;transition:.35s ease}
.lhs-kc-guide-card:hover{transform:translateY(-7px);border-color:rgba(181,135,70,.45);box-shadow:0 26px 62px rgba(53,39,24,.12)}
.lhs-kc-guide-card>span{font:400 44px/1 Georgia,serif;color:rgba(173,128,65,.3)}
.lhs-kc-guide-card>p{margin:34px 0 10px;color:#aa7939;font-size:11px;font-weight:700;letter-spacing:.2em}
.lhs-kc-guide-card h3{margin:0;font:400 31px/1.05 Georgia,serif;letter-spacing:-.025em}
.lhs-kc-guide-card small{display:block;margin:15px 0 26px;color:#70675c;font-size:14px;line-height:1.6}
.lhs-kc-guide-card a,.lhs-kc-guide-card em{margin-top:auto;align-self:flex-start;color:#9a6b2d;font-size:11px;font-style:normal;font-weight:700;letter-spacing:.14em;text-decoration:none}
.lhs-kc-guide-card.lhs-kc-featured{background:linear-gradient(145deg,#1b1612,#30251c);color:#fff}.lhs-kc-featured small{color:rgba(255,255,255,.68)}.lhs-kc-featured a{color:#e8c58e}
.lhs-kc-guide-card.is-upcoming{opacity:.68}.lhs-kc-guide-card.is-upcoming:hover{transform:none;box-shadow:0 16px 44px rgba(53,39,24,.055)}
.lhs-kc-help-band{padding:64px 0;background:#1c1713;color:#fff}.lhs-kc-help-band .lhs-kc-shell{display:flex;align-items:center;justify-content:space-between;gap:30px}.lhs-kc-help-band p{margin:0 0 8px;color:#c99b57;font-size:11px;letter-spacing:.2em}.lhs-kc-help-band h2{margin:0;font:400 clamp(30px,3.2vw,48px)/1.05 Georgia,serif}.lhs-kc-help-band a{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 25px;border-radius:7px;background:#c99b57;color:#17120e;font-size:11px;font-weight:700;letter-spacing:.13em;text-decoration:none}
.lhs-kc-compare-hero{padding:72px 0 84px;background:linear-gradient(135deg,#17130f,#33271d);color:#fff}.lhs-kc-breadcrumb{display:flex;gap:9px;margin-bottom:48px;color:rgba(255,255,255,.55);font-size:12px}.lhs-kc-breadcrumb a{color:#dfbd85;text-decoration:none}.lhs-kc-compare-hero h1{max-width:1100px}.lhs-kc-base-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;padding:76px 0}
.lhs-kc-base-card{position:relative;padding:32px;border:1px solid rgba(74,53,31,.14);border-radius:20px;background:#fff;box-shadow:0 20px 55px rgba(45,33,20,.075);transition:.35s ease}.lhs-kc-base-card.is-recommended{transform:translateY(-8px);border-color:#bd8844;box-shadow:0 30px 75px rgba(84,58,27,.18)}
.lhs-kc-base-swatch{width:98px;height:98px;margin-bottom:28px;border-radius:50%;box-shadow:0 12px 28px rgba(53,38,21,.14)}
.lhs-kc-base-card h2{margin:0 0 22px;font:400 32px/1.08 Georgia,serif;letter-spacing:-.025em}.lhs-kc-base-card ul{margin:0 0 28px;padding-left:18px;color:#675f55;font-size:14px;line-height:1.75}.lhs-kc-base-card a{color:#996a2d;font-size:11px;font-weight:700;letter-spacing:.13em;text-decoration:none}
.lhs-kc-priority-section{padding:82px 0;background:#eee8de}.lhs-kc-priority-buttons{display:flex;flex-wrap:wrap;gap:10px}.lhs-kc-priority-buttons button{min-height:46px;padding:0 18px;border:1px solid rgba(94,69,39,.18);border-radius:999px;background:rgba(255,255,255,.65);color:#544a3f;font-size:11px;font-weight:700;letter-spacing:.1em;cursor:pointer}.lhs-kc-priority-buttons button.is-active{background:#1c1713;color:#ebc88e;border-color:#1c1713}.lhs-kc-priority-result{margin-top:24px;padding:28px 30px;border-left:3px solid #b98542;border-radius:0 14px 14px 0;background:#fff;box-shadow:0 16px 40px rgba(49,36,23,.07)}.lhs-kc-priority-result p{margin:0 0 6px;color:#a47031;font-size:11px;font-weight:700;letter-spacing:.15em}.lhs-kc-priority-result h3{margin:0 0 8px;font:400 31px/1.1 Georgia,serif}.lhs-kc-priority-result span{color:#655d54;line-height:1.65}.lhs-kc-priority-result a{display:inline-block;margin-top:16px;color:#966528;font-size:11px;font-weight:700;letter-spacing:.12em;text-decoration:none}
.lhs-kc-table-section{padding:90px 0}.lhs-kc-table-wrap{overflow:auto;border:1px solid rgba(75,53,31,.13);border-radius:18px;background:#fff;box-shadow:0 18px 55px rgba(46,34,22,.06)}.lhs-kc-table-wrap table{width:100%;min-width:850px;border-collapse:collapse}.lhs-kc-table-wrap th,.lhs-kc-table-wrap td{padding:20px 22px;border-bottom:1px solid rgba(75,53,31,.09);text-align:left;font-size:14px;line-height:1.45}.lhs-kc-table-wrap thead th{background:#1c1713;color:#e9c58b;font-size:11px;letter-spacing:.13em;text-transform:uppercase}.lhs-kc-table-wrap tbody th{width:23%;color:#2a241e}.lhs-kc-table-wrap tbody td{color:#625a50}.lhs-kc-table-note{margin:20px 0 0;padding:18px 20px;border-radius:12px;background:#eee7dc;color:#665d52;font-size:13px;line-height:1.65}
.lhs-kc-paths{padding:86px 0 104px;background:#fff}.lhs-kc-path-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.lhs-kc-path-grid a{padding:30px;border:1px solid rgba(76,55,33,.12);border-radius:17px;color:#1d1915;text-decoration:none;transition:.3s ease}.lhs-kc-path-grid a:hover{transform:translateY(-6px);border-color:#bc8845;box-shadow:0 22px 55px rgba(51,37,22,.1)}.lhs-kc-path-grid span{color:#b57e38;font:400 35px/1 Georgia,serif}.lhs-kc-path-grid h3{margin:24px 0 10px;font:400 29px/1.05 Georgia,serif}.lhs-kc-path-grid p{margin:0;color:#6a6258;font-size:14px;line-height:1.6}
.lhs-kc-context-callout{width:min(1420px,calc(100% - 64px));margin:70px auto;padding:36px 40px;border:1px solid rgba(76,55,33,.13);border-radius:18px;background:linear-gradient(135deg,#f6f1e9,#fff);display:flex;align-items:center;justify-content:space-between;gap:30px;box-shadow:0 18px 48px rgba(46,34,22,.06)}.lhs-kc-context-callout p{margin:0 0 9px;color:#a67333;font-size:11px;font-weight:700;letter-spacing:.17em}.lhs-kc-context-callout h2{margin:0;max-width:800px;font:400 clamp(25px,2.5vw,38px)/1.12 Georgia,serif}.lhs-kc-context-callout a{flex:0 0 auto;display:inline-flex;align-items:center;gap:20px;min-height:50px;padding:0 22px;border-radius:7px;background:#1c1713;color:#e7c58e;font-size:11px;font-weight:700;letter-spacing:.11em;text-decoration:none}
html[dir="rtl"] .lhs-kc-section-head>span{text-align:left}html[dir="rtl"] .lhs-kc-base-card ul{padding-left:0;padding-right:18px}html[dir="rtl"] .lhs-kc-priority-result{border-left:0;border-right:3px solid #b98542;border-radius:14px 0 0 14px}html[dir="rtl"] .lhs-kc-table-wrap th,html[dir="rtl"] .lhs-kc-table-wrap td{text-align:right}
@media(max-width:980px){.lhs-kc-shell{width:min(100% - 36px,1420px)}.lhs-kc-hero-grid{grid-template-columns:1fr;gap:35px}.lhs-kc-hero-visual{min-height:350px;max-width:620px;width:100%;margin:auto}.lhs-kc-base-orbit{width:180px;height:180px}.lhs-kc-guide-grid,.lhs-kc-base-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.lhs-kc-path-grid{grid-template-columns:1fr}.lhs-kc-context-callout{width:calc(100% - 36px)}}
@media(max-width:680px){.lhs-kc-shell{width:calc(100% - 24px)}.lhs-kc-hero{padding:60px 0}.lhs-kc-hero h1,.lhs-kc-compare-hero h1{font-size:44px}.lhs-kc-hero-visual{min-height:300px}.lhs-kc-base-orbit{width:145px;height:145px}.lhs-kc-base-orbit i{width:72px;height:72px}.lhs-kc-orbit-mono{left:26%}.lhs-kc-directory{padding:65px 0}.lhs-kc-section-head{align-items:flex-start;flex-direction:column}.lhs-kc-section-head>span{text-align:left}.lhs-kc-guide-grid,.lhs-kc-base-summary{grid-template-columns:1fr}.lhs-kc-guide-card{min-height:320px}.lhs-kc-help-band .lhs-kc-shell,.lhs-kc-context-callout{align-items:flex-start;flex-direction:column}.lhs-kc-context-callout{width:calc(100% - 24px);margin:48px auto;padding:26px}.lhs-kc-context-callout a{width:100%;justify-content:space-between}.lhs-kc-priority-section,.lhs-kc-table-section,.lhs-kc-paths{padding:62px 0}.lhs-kc-priority-buttons{display:grid;grid-template-columns:1fr}.lhs-kc-priority-buttons button{width:100%}.lhs-kc-base-summary{padding:54px 0}.lhs-kc-compare-hero{padding:55px 0 65px}}
.lhs-kc-product-guide-link{width:min(1180px,calc(100% - 48px));margin:58px auto;padding:25px 28px;border:1px solid rgba(78,57,34,.13);border-radius:15px;background:linear-gradient(135deg,#f5efe5,#fff);display:flex;align-items:center;justify-content:space-between;gap:26px;box-shadow:0 14px 38px rgba(44,32,20,.055)}
.lhs-kc-product-guide-link p{margin:0 0 7px;color:#a77333;font-size:10px;font-weight:700;letter-spacing:.16em}.lhs-kc-product-guide-link h2{margin:0;max-width:760px;font:400 clamp(21px,2vw,29px)/1.18 Georgia,serif}.lhs-kc-product-guide-link a{flex:0 0 auto;color:#8f6129;font-size:10px;font-weight:700;letter-spacing:.12em;text-decoration:none}
@media(max-width:680px){.lhs-kc-product-guide-link{width:calc(100% - 24px);margin:42px auto;padding:23px;align-items:flex-start;flex-direction:column}.lhs-kc-product-guide-link a{padding-top:4px}}
/* 2026-07-18: Hair Color & Gray Guide */
.lhs-hcg-main{background:#fbfaf7;color:#1c1712}
.lhs-hcg-hero{padding:92px 0 104px;background:radial-gradient(circle at 78% 30%,rgba(182,136,72,.16),transparent 29%),linear-gradient(135deg,#16110d 0%,#2a2119 58%,#473523 100%);color:#fff}
.lhs-hcg-hero h1{max-width:920px;margin:18px 0 22px;font:400 clamp(48px,6vw,84px)/.98 Georgia,serif;letter-spacing:-.045em}
.lhs-hcg-hero>div>p:last-of-type{max-width:780px;margin:0;color:rgba(255,255,255,.78);font-size:17px;line-height:1.72}
.lhs-hcg-hero .lhs-kc-breadcrumb a,.lhs-hcg-hero .lhs-kc-breadcrumb span{color:rgba(255,255,255,.68)}
.lhs-hcg-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.lhs-hcg-hero-actions a{min-height:52px;padding:0 22px;border:1px solid #d4a966;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:#d4a966;color:#1a130d;text-decoration:none;font-size:11px;font-weight:800;letter-spacing:.12em}
.lhs-hcg-hero-actions a.is-secondary{background:transparent;color:#f3d39e}
.lhs-hcg-principles{padding:84px 0}
.lhs-hcg-rule-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.lhs-hcg-rule-grid article{min-height:280px;padding:30px;border:1px solid rgba(77,55,34,.12);border-radius:18px;background:#fff;box-shadow:0 18px 50px rgba(55,39,24,.06)}
.lhs-hcg-rule-grid article>span{display:block;margin-bottom:58px;color:#b27a36;font-size:11px;font-weight:800;letter-spacing:.18em}
.lhs-hcg-rule-grid h3{margin:0 0 12px;font:400 29px/1.08 Georgia,serif}
.lhs-hcg-rule-grid p{margin:0;color:#70665b;line-height:1.72}
.lhs-hcg-planner{padding:86px 0;background:#efe8dd}
.lhs-hcg-planner-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:34px;align-items:stretch}
.lhs-hcg-swatch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.lhs-hcg-swatch-grid button{position:relative;overflow:hidden;min-height:190px;padding:0;border:1px solid rgba(63,45,28,.13);border-radius:15px;background:#fff;cursor:pointer;box-shadow:0 12px 32px rgba(50,35,21,.06);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.lhs-hcg-swatch-grid button:hover,.lhs-hcg-swatch-grid button.is-active{transform:translateY(-4px);border-color:#a97534;box-shadow:0 18px 42px rgba(50,35,21,.13)}
.lhs-hcg-swatch-grid img{width:100%;height:150px;display:block;object-fit:cover}
.lhs-hcg-swatch-grid span{display:block;padding:12px;color:#2b2118;font-weight:800;letter-spacing:.08em}
.lhs-hcg-swatch-grid button.is-active::after{content:'✓';position:absolute;top:10px;right:10px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#b57d37;color:#fff;font-size:13px}
html[dir="rtl"] .lhs-hcg-swatch-grid button.is-active::after{right:auto;left:10px}
.lhs-hcg-selected{overflow:hidden;border:1px solid rgba(66,46,28,.12);border-radius:20px;background:#17120e;color:#fff;box-shadow:0 24px 58px rgba(40,29,18,.18)}
.lhs-hcg-selected-image{height:310px;background:#34281d}
.lhs-hcg-selected-image img{width:100%;height:100%;object-fit:cover;transition:opacity .25s ease}
.lhs-hcg-selected-copy{padding:30px}
.lhs-hcg-selected-copy>p{margin:0 0 9px;color:#d5a45e;font-size:10px;font-weight:800;letter-spacing:.18em}
.lhs-hcg-selected-copy h3{margin:0;font:400 52px/1 Georgia,serif}
.lhs-hcg-selected-copy>strong{display:block;margin:9px 0 13px;font-size:18px}
.lhs-hcg-selected-copy>span{display:block;min-height:52px;color:rgba(255,255,255,.72);line-height:1.65}
.lhs-hcg-selected-copy dl{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0}
.lhs-hcg-selected-copy dl div{padding:14px;border:1px solid rgba(255,255,255,.12);border-radius:10px}
.lhs-hcg-selected-copy dt{margin-bottom:5px;color:#c89a57;font-size:9px;font-weight:800;letter-spacing:.14em}.lhs-hcg-selected-copy dd{margin:0}
.lhs-hcg-selected-copy a{min-height:48px;padding:0 18px;border:1px solid #d5a45e;border-radius:7px;display:inline-flex;align-items:center;color:#ecc989;text-decoration:none;font-size:10px;font-weight:800;letter-spacing:.12em}
.lhs-hcg-screen-note{margin:24px 0 0;padding:18px 20px;border-left:3px solid #a87535;background:rgba(255,255,255,.53);color:#675b50;line-height:1.65}
html[dir="rtl"] .lhs-hcg-screen-note{border-left:0;border-right:3px solid #a87535}
.lhs-hcg-gray-section{padding:88px 0}
.lhs-hcg-gray-layout{display:grid;grid-template-columns:240px 1fr;gap:28px}
.lhs-hcg-gray-buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;align-content:start}
.lhs-hcg-gray-buttons button{min-height:58px;border:1px solid rgba(67,48,29,.15);border-radius:10px;background:#fff;color:#2b2118;font-weight:800;cursor:pointer}
.lhs-hcg-gray-buttons button.is-active{border-color:#a87535;background:#1c1611;color:#e9c586}
.lhs-hcg-gray-result{min-height:250px;padding:30px;border-radius:18px;background:linear-gradient(135deg,#211914,#493726);color:#fff}
.lhs-hcg-gray-meter{height:20px;margin-bottom:26px;border-radius:999px;background:linear-gradient(90deg,#3b2b22 calc(100% - var(--gray-level)),#d4d0c8 0);overflow:hidden}.lhs-hcg-gray-meter span{display:block;width:100%;height:100%;background:repeating-linear-gradient(110deg,transparent 0 6px,rgba(255,255,255,.18) 7px 8px)}
.lhs-hcg-gray-result>p{margin:0 0 8px;color:#d8ab69;font-size:10px;font-weight:800;letter-spacing:.16em}.lhs-hcg-gray-result h3{margin:0 0 13px;font:400 35px/1.08 Georgia,serif}.lhs-hcg-gray-result>span{display:block;max-width:720px;color:rgba(255,255,255,.72);line-height:1.68}.lhs-hcg-gray-result a{display:inline-flex;margin-top:24px;color:#ecc989;text-decoration:none;font-size:10px;font-weight:800;letter-spacing:.12em}
.lhs-hcg-gray-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:28px}.lhs-hcg-gray-notes article{padding:24px;border:1px solid rgba(72,51,31,.12);border-radius:14px;background:#fff}.lhs-hcg-gray-notes h3{margin:0 0 9px;font:400 24px/1.1 Georgia,serif}.lhs-hcg-gray-notes p{margin:0;color:#74695e;line-height:1.65}
.lhs-hcg-photo-guide{padding:88px 0;background:#f0ebe3}.lhs-hcg-check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.lhs-hcg-check-grid div{padding:22px;border:1px solid rgba(66,47,29,.11);border-radius:13px;background:#fff;display:flex;gap:15px;align-items:flex-start}.lhs-hcg-check-grid span{flex:0 0 28px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#b27a36;color:#fff}.lhs-hcg-check-grid p{margin:2px 0 0;color:#655b51;line-height:1.65}
.lhs-hcg-next{padding-top:88px}
.lhs-hair-color-guide-inline{display:inline-flex;margin-top:12px;color:#95682f;font-size:10px;font-weight:800;letter-spacing:.09em;text-decoration:none}.lhs-hair-color-guide-inline:hover{text-decoration:underline}
@media(max-width:980px){.lhs-hcg-rule-grid,.lhs-hcg-gray-notes{grid-template-columns:1fr}.lhs-hcg-planner-grid{grid-template-columns:1fr}.lhs-hcg-selected{display:grid;grid-template-columns:minmax(240px,.8fr) 1fr}.lhs-hcg-selected-image{height:auto;min-height:360px}.lhs-hcg-gray-layout{grid-template-columns:1fr}.lhs-hcg-gray-buttons{grid-template-columns:repeat(6,1fr)}}
@media(max-width:680px){.lhs-hcg-hero{padding:58px 0 68px}.lhs-hcg-hero h1{font-size:43px}.lhs-hcg-hero-actions a{width:100%}.lhs-hcg-principles,.lhs-hcg-gray-section,.lhs-hcg-photo-guide{padding:62px 0}.lhs-hcg-rule-grid article{min-height:0}.lhs-hcg-rule-grid article>span{margin-bottom:34px}.lhs-hcg-swatch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lhs-hcg-swatch-grid button{min-height:170px}.lhs-hcg-swatch-grid img{height:132px}.lhs-hcg-selected{display:block}.lhs-hcg-selected-image{height:270px;min-height:0}.lhs-hcg-selected-copy{padding:24px}.lhs-hcg-selected-copy h3{font-size:44px}.lhs-hcg-gray-buttons{grid-template-columns:repeat(3,1fr)}.lhs-hcg-check-grid{grid-template-columns:1fr}}
@media(hover:none){.lhs-hcg-swatch-grid button:hover{transform:none}}
.lhs-hcg-legacy-callout{width:min(1180px,calc(100% - 48px));margin:54px auto 10px;padding:26px 28px;border:1px solid rgba(72,51,31,.13);border-radius:16px;background:linear-gradient(135deg,#f1e9dc,#fff);display:flex;align-items:center;justify-content:space-between;gap:28px}.lhs-hcg-legacy-callout span{color:#a87535;font-size:10px;font-weight:800;letter-spacing:.16em}.lhs-hcg-legacy-callout h2{margin:7px 0 5px;font:400 28px/1.1 Georgia,serif}.lhs-hcg-legacy-callout p{margin:0;color:#74695e}.lhs-hcg-legacy-callout a{flex:0 0 auto;color:#95672e;text-decoration:none;font-size:10px;font-weight:800;letter-spacing:.11em}@media(max-width:680px){.lhs-hcg-legacy-callout{width:calc(100% - 24px);padding:23px;align-items:flex-start;flex-direction:column}.lhs-hcg-legacy-callout a{padding-top:4px}}
/* =========================================================
2026-07-18 — Official LHS Hair Density Guide
========================================================= */
.lhs-hdg-main{background:#f7f3ed;color:#1d1814}
.lhs-hdg-hero{padding:108px 24px 92px;background:radial-gradient(circle at 82% 18%,rgba(190,151,94,.18),transparent 32%),linear-gradient(135deg,#17120f 0%,#2a211b 55%,#15110e 100%);color:#fff;overflow:hidden}
.lhs-hdg-hero .lhs-kc-breadcrumb a,.lhs-hdg-hero .lhs-kc-breadcrumb span{color:rgba(255,255,255,.72)}
.lhs-hdg-hero h1{max-width:920px;margin:18px 0 22px;font-family:Georgia,"Times New Roman",serif;font-size:clamp(46px,6.2vw,86px);line-height:.98;font-weight:400;letter-spacing:-.045em}
.lhs-hdg-hero>div>p:last-of-type{max-width:790px;color:rgba(255,255,255,.78);font-size:17px;line-height:1.75}
.lhs-hdg-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.lhs-hdg-hero-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 23px;border:1px solid #d4aa6b;border-radius:8px;background:#d4aa6b;color:#1c1713;font-size:11px;font-weight:800;letter-spacing:.12em;text-decoration:none}
.lhs-hdg-hero-actions a.is-secondary{background:transparent;color:#f3d8ac;border-color:rgba(243,216,172,.55)}
.lhs-hdg-principles,.lhs-hdg-comparison,.lhs-hdg-mistakes{padding-top:84px;padding-bottom:84px}
.lhs-hdg-rule-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.lhs-hdg-rule-grid article,.lhs-hdg-range-grid article,.lhs-hdg-base-grid article{padding:28px;border:1px solid rgba(52,39,28,.11);border-radius:18px;background:rgba(255,255,255,.74);box-shadow:0 18px 48px rgba(44,32,22,.06)}
.lhs-hdg-rule-grid article>span{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:#201914;color:#e4bb7a;font-weight:800;font-size:12px}
.lhs-hdg-rule-grid h3,.lhs-hdg-range-grid h3,.lhs-hdg-base-grid h3{margin:20px 0 10px;font-family:Georgia,"Times New Roman",serif;font-size:25px;font-weight:400;line-height:1.08}
.lhs-hdg-rule-grid p,.lhs-hdg-range-grid p,.lhs-hdg-base-grid p{margin:0;color:#74675c;line-height:1.7;font-size:14px}
.lhs-hdg-planner{padding:88px 24px;background:#efe6d9}
.lhs-hdg-planner-grid{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:26px;align-items:stretch}
.lhs-hdg-levels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.lhs-hdg-levels button{min-height:108px;padding:20px;border:1px solid rgba(54,41,29,.13);border-radius:14px;background:rgba(255,255,255,.72);color:#211a15;text-align:left;cursor:pointer;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease,background .25s ease}
.lhs-hdg-levels button strong{display:block;font-family:Georgia,"Times New Roman",serif;font-size:31px;font-weight:400}
.lhs-hdg-levels button span{display:block;margin-top:7px;color:#837365;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.lhs-hdg-levels button:hover,.lhs-hdg-levels button.is-active{transform:translateY(-3px);border-color:#b88848;background:#fff;box-shadow:0 16px 36px rgba(49,35,24,.12)}
.lhs-hdg-selected{display:grid;grid-template-columns:minmax(220px,.82fr) minmax(0,1.18fr);min-height:446px;overflow:hidden;border-radius:22px;background:#1a1512;color:#fff;box-shadow:0 28px 68px rgba(37,26,18,.22)}
.lhs-hdg-density-visual{position:relative;min-height:100%;overflow:hidden;background:radial-gradient(circle at 50% 70%,#cda47e 0%,#a87956 48%,#7a5038 100%)}
.lhs-hdg-scalp{position:absolute;inset:9% 9% 8%;border-radius:48% 48% 43% 43%;background:radial-gradient(circle at 50% 32%,#d7b191,#b87f59 55%,#87573d 100%);box-shadow:inset 0 0 50px rgba(72,38,22,.32)}
.lhs-hdg-scalp span{position:absolute;inset:10%;border-radius:inherit;opacity:.34;background-image:radial-gradient(circle,rgba(67,39,24,.55) 0 1px,transparent 1.3px);background-size:8px 8px}
.lhs-hdg-strands{position:absolute;inset:3% 5% 1%;border-radius:48% 48% 42% 42%;opacity:calc(.28 + var(--density-ratio)*.7);background:repeating-linear-gradient(84deg,transparent 0 6px,rgba(31,20,14,.94) 7px 9px,transparent 10px 14px),repeating-linear-gradient(96deg,transparent 0 9px,rgba(58,36,22,.82) 10px 12px,transparent 13px 17px);filter:drop-shadow(0 12px 9px rgba(25,13,8,.2));transform:scale(calc(.82 + var(--density-ratio)*.18));transform-origin:50% 82%;transition:opacity .45s ease,transform .45s ease}
.lhs-hdg-selected-copy{display:flex;flex-direction:column;justify-content:center;padding:42px}
.lhs-hdg-selected-copy>p{margin:0 0 10px;color:#d3a966;font-size:11px;font-weight:800;letter-spacing:.19em}
.lhs-hdg-selected-copy h3{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(31px,4vw,50px);font-weight:400;line-height:1}
.lhs-hdg-selected-copy>strong{margin-top:15px;color:#f2d39f;font-size:17px;font-weight:600}
.lhs-hdg-selected-copy>span{margin-top:12px;color:rgba(255,255,255,.72);font-size:14px;line-height:1.72}
.lhs-hdg-selected-copy dl{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:25px 0}
.lhs-hdg-selected-copy dl div{padding:13px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:rgba(255,255,255,.045)}
.lhs-hdg-selected-copy dt{color:#c69a5d;font-size:9px;font-weight:800;letter-spacing:.12em}
.lhs-hdg-selected-copy dd{margin:7px 0 0;color:#fff;font-size:13px}
.lhs-hdg-selected-copy>a{display:inline-flex;align-self:flex-start;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:7px;background:#d7ae6f;color:#1c1612;font-size:10px;font-weight:900;letter-spacing:.11em;text-decoration:none}
.lhs-hdg-scale-note{margin:22px 0 0;padding:16px 18px;border-left:3px solid #b88748;background:rgba(255,255,255,.53);color:#6f6155;font-size:13px;line-height:1.65}
.lhs-hdg-range-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.lhs-hdg-range-grid article>b{color:#a67539;font-family:Georgia,"Times New Roman",serif;font-size:28px;font-weight:400}
.lhs-hdg-range-grid article.is-featured{border-color:rgba(176,126,58,.44);background:#fff8ed;transform:translateY(-7px)}
.lhs-hdg-base-section{padding:86px 24px;background:#211a16;color:#fff}
.lhs-hdg-base-section .lhs-kc-section-head h2,.lhs-hdg-base-section .lhs-kc-section-head p{color:#fff}
.lhs-hdg-base-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.lhs-hdg-base-grid article{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.1);box-shadow:none}
.lhs-hdg-base-grid article>span{color:#d5aa68;font-size:11px;font-weight:900;letter-spacing:.16em}
.lhs-hdg-base-grid h3{color:#fff}
.lhs-hdg-base-grid p{color:rgba(255,255,255,.68)}
.lhs-hdg-base-grid a{display:inline-flex;margin-top:20px;color:#efc985;font-size:10px;font-weight:900;letter-spacing:.11em;text-decoration:none}
.lhs-hdg-mistake-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.lhs-hdg-mistake-grid article{display:grid;grid-template-columns:42px 1fr;gap:16px;align-items:start;padding:22px;border:1px solid rgba(58,43,29,.11);border-radius:14px;background:#fff}
.lhs-hdg-mistake-grid span{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:#2a211b;color:#e7be7c;font-size:20px}
.lhs-hdg-mistake-grid p{margin:0;color:#6e6257;line-height:1.7;font-size:14px}
.lhs-hair-density-guide-inline{display:inline-flex;margin-top:12px;color:#95682f;font-size:10px;font-weight:800;letter-spacing:.09em;text-decoration:none}.lhs-hair-density-guide-inline:hover{text-decoration:underline}
html[dir="rtl"] .lhs-hdg-levels button{text-align:right}
html[dir="rtl"] .lhs-hdg-scale-note{border-left:0;border-right:3px solid #b88748}
@media(max-width:980px){.lhs-hdg-rule-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lhs-hdg-planner-grid,.lhs-hdg-selected{grid-template-columns:1fr}.lhs-hdg-density-visual{min-height:340px}.lhs-hdg-base-grid{grid-template-columns:1fr}.lhs-hdg-range-grid{grid-template-columns:1fr}.lhs-hdg-range-grid article.is-featured{transform:none}}
@media(max-width:640px){.lhs-hdg-hero{padding:78px 18px 64px}.lhs-hdg-hero h1{font-size:43px}.lhs-hdg-principles,.lhs-hdg-comparison,.lhs-hdg-mistakes{padding-top:62px;padding-bottom:62px}.lhs-hdg-rule-grid,.lhs-hdg-levels,.lhs-hdg-mistake-grid{grid-template-columns:1fr}.lhs-hdg-planner,.lhs-hdg-base-section{padding-left:14px;padding-right:14px}.lhs-hdg-levels button{min-height:88px}.lhs-hdg-selected-copy{padding:28px 22px}.lhs-hdg-selected-copy dl{grid-template-columns:1fr}.lhs-hdg-density-visual{min-height:300px}.lhs-hdg-hero-actions a{width:100%}}
@media(prefers-reduced-motion:reduce){.lhs-hdg-levels button,.lhs-hdg-strands{transition:none!important}}
/* 2026-07-18 — Real density reference images replace generated strand graphic */
.lhs-hdg-density-visual{
position:relative;
display:flex;
align-items:center;
justify-content:center;
min-height:100%;
padding:34px;
overflow:hidden;
isolation:isolate;
background:
radial-gradient(circle at 48% 42%,rgba(255,255,255,.96) 0%,rgba(248,241,230,.91) 47%,rgba(209,174,122,.28) 76%,rgba(40,28,20,.18) 100%),
linear-gradient(145deg,#f8f2e8,#dcc5a4);
}
.lhs-hdg-density-visual::before{
content:"";
position:absolute;
inset:9%;
border-radius:50%;
background:radial-gradient(circle,rgba(221,181,116,.26),transparent 66%);
filter:blur(24px);
z-index:-1;
}
.lhs-hdg-density-image{
display:block;
width:min(100%,460px);
height:auto;
aspect-ratio:1;
border-radius:50%;
object-fit:cover;
object-position:center;
border:1px solid rgba(190,143,73,.62);
background:#f8f3ea;
box-shadow:0 24px 60px rgba(46,31,20,.22),0 0 0 8px rgba(255,255,255,.32);
opacity:1;
transform:scale(1);
transition:opacity .22s ease,transform .34s cubic-bezier(.2,.8,.2,1),filter .34s ease;
}
.lhs-hdg-density-visual.is-switching .lhs-hdg-density-image{
opacity:.16;
transform:scale(.975);
filter:blur(2px);
}
.lhs-hdg-density-image-ring{
pointer-events:none;
position:absolute;
width:min(calc(100% - 68px),460px);
aspect-ratio:1;
border-radius:50%;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
}
.lhs-hdg-scalp,.lhs-hdg-strands{display:none!important}
@media(max-width:980px){
.lhs-hdg-density-visual{min-height:390px;padding:30px}
.lhs-hdg-density-image{width:min(100%,410px)}
.lhs-hdg-density-image-ring{width:min(calc(100% - 60px),410px)}
}
@media(max-width:640px){
.lhs-hdg-density-visual{min-height:310px;padding:24px}
.lhs-hdg-density-image{width:min(100%,310px);box-shadow:0 18px 42px rgba(46,31,20,.2),0 0 0 6px rgba(255,255,255,.3)}
.lhs-hdg-density-image-ring{width:min(calc(100% - 48px),310px)}
}
@media(prefers-reduced-motion:reduce){
.lhs-hdg-density-image{transition:none!important}
}
/* =========================================================
2026-07-18 — Base Size & Mold Guide
========================================================= */
.lhs-bsm-main{background:#f7f1e8;color:#1b1511;overflow:hidden}
.lhs-bsm-hero{padding:84px 0 74px;background:radial-gradient(circle at 78% 24%,rgba(205,157,92,.22),transparent 28%),linear-gradient(135deg,#f8f2e9 0%,#eadac5 100%)}
.lhs-bsm-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:70px;align-items:center}
.lhs-bsm-hero h1,.lhs-bsm-section h2,.lhs-bsm-planner-section h2,.lhs-bsm-mold-section h2,.lhs-bsm-errors-section h2,.lhs-bsm-final-cta h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.045em;line-height:.98}
.lhs-bsm-hero h1{font-size:clamp(54px,6.5vw,94px);margin:16px 0 24px;max-width:850px}
.lhs-bsm-hero p:not(.lhs-kc-kicker){font-size:18px;line-height:1.75;color:#5f554c;max-width:760px}
.lhs-bsm-hero-actions,.lhs-bsm-final-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.lhs-bsm-button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border-radius:8px;text-decoration:none;font-size:11px;font-weight:800;letter-spacing:.14em;transition:transform .25s ease,box-shadow .25s ease,background .25s ease}
.lhs-bsm-button:hover{transform:translateY(-2px)}
.lhs-bsm-button-dark{background:#1b1511;color:#f3d297;box-shadow:0 16px 34px rgba(27,21,17,.16)}
.lhs-bsm-button-light{border:1px solid rgba(166,113,49,.35);background:rgba(255,255,255,.5);color:#8a5f2d}
.lhs-bsm-button-gold{background:#ddb36f;color:#1b1511;box-shadow:0 14px 30px rgba(128,82,30,.2)}
.lhs-bsm-hero-visual{position:relative;min-height:520px;display:grid;place-items:center}
.lhs-bsm-head-outline{position:relative;width:min(78%,410px);aspect-ratio:.78;border-radius:48% 48% 45% 45%/38% 38% 58% 58%;border:2px solid #b77d36;background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.68),rgba(255,255,255,.18) 62%,rgba(172,112,48,.08));box-shadow:0 36px 70px rgba(83,52,24,.18),inset 0 0 0 16px rgba(255,255,255,.36)}
.lhs-bsm-head-outline:before{content:"";position:absolute;inset:8%;border:1px dashed rgba(131,84,34,.5);border-radius:inherit}
.lhs-bsm-front-mark,.lhs-bsm-back-mark{position:absolute;left:50%;transform:translateX(-50%);display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#1b1511;color:#e5bd7c;font:700 11px/1 Arial;letter-spacing:.1em}
.lhs-bsm-front-mark{top:-19px}.lhs-bsm-back-mark{bottom:-19px}.lhs-bsm-center-line{position:absolute;top:7%;bottom:7%;left:50%;border-left:1px dashed #b77d36}.lhs-bsm-width-line{position:absolute;left:7%;right:7%;top:50%;border-top:1px dashed #b77d36}
.lhs-bsm-visual-label{position:absolute;font-size:10px;font-weight:800;letter-spacing:.18em;color:#9d6c31}.lhs-bsm-visual-length{right:3%;top:50%;transform:rotate(90deg)}.lhs-bsm-visual-width{bottom:4%;left:50%;transform:translateX(-50%)}
.lhs-bsm-section{padding:92px 0}
.lhs-bsm-section-heading{max-width:850px;margin-bottom:40px}.lhs-bsm-section-heading h2{font-size:clamp(42px,5vw,68px);margin:10px 0 18px}.lhs-bsm-section-heading>p:not(.lhs-kc-kicker){font-size:17px;line-height:1.7;color:#6a6057}.lhs-bsm-heading-compact{margin-bottom:26px}.lhs-bsm-heading-compact h2{font-size:clamp(36px,4vw,52px)}
.lhs-bsm-path-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.lhs-bsm-path-card{appearance:none;text-align:left;padding:32px;border:1px solid rgba(95,70,44,.14);border-radius:20px;background:rgba(255,255,255,.67);box-shadow:0 16px 38px rgba(62,42,24,.07);cursor:pointer;color:inherit;transition:.3s ease}
.lhs-bsm-path-card:hover,.lhs-bsm-path-card.is-active{transform:translateY(-5px);border-color:#c8924d;box-shadow:0 24px 48px rgba(62,42,24,.14)}
.lhs-bsm-path-card>span{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#1b1511;color:#e5bd7c;font-weight:800;font-size:12px;margin-bottom:26px}.lhs-bsm-path-card strong{display:block;font:400 clamp(25px,2.3vw,35px)/1.05 Georgia,serif;margin-bottom:14px}.lhs-bsm-path-card small{display:block;font-size:14px;line-height:1.65;color:#71675e}
.lhs-bsm-planner-section{padding:92px 0;background:#17120f;color:#fff}.lhs-bsm-heading-light h2{font-size:clamp(42px,5vw,68px);margin:10px 0 18px}.lhs-bsm-heading-light>p:not(.lhs-kc-kicker){color:#c7beb5;font-size:16px;line-height:1.7}.lhs-bsm-planner-grid{display:grid;grid-template-columns:minmax(250px,.72fr) minmax(360px,1.1fr) minmax(280px,.78fr);gap:26px;align-items:stretch}
.lhs-bsm-planner-controls,.lhs-bsm-planner-summary{padding:28px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:#221c18}.lhs-bsm-unit-toggle{display:inline-flex;padding:4px;border-radius:10px;background:#120e0c;margin-bottom:24px}.lhs-bsm-unit-toggle button{border:0;background:transparent;color:#a99f96;padding:9px 17px;border-radius:7px;font-weight:800;cursor:pointer}.lhs-bsm-unit-toggle button.is-active{background:#dcb16f;color:#17120f}.lhs-bsm-planner-controls label{position:relative;display:grid;grid-template-columns:1fr auto;gap:8px;margin-bottom:18px}.lhs-bsm-planner-controls label>span{grid-column:1/-1;font-size:11px;font-weight:800;letter-spacing:.12em;color:#dfb978}.lhs-bsm-planner-controls input,.lhs-bsm-planner-controls select{width:100%;min-height:50px;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:#181310;color:#fff;padding:0 15px;font-size:16px}.lhs-bsm-planner-controls label>small{align-self:center;color:#a99f96;font-size:12px}.lhs-bsm-input-note{font-size:12px;line-height:1.65;color:#a99f96;margin:8px 0 0}
.lhs-bsm-live-preview{border-radius:18px;background:radial-gradient(circle,#b88958 0%,#815535 62%,#5d3c29 100%);min-height:480px;padding:50px;display:grid;place-items:center;overflow:hidden}.lhs-bsm-preview-stage{position:relative;width:min(100%,430px);aspect-ratio:1;display:grid;place-items:center}.lhs-bsm-preview-shape{--bsm-h:100%;--bsm-w:80%;position:relative;width:var(--bsm-w);height:var(--bsm-h);max-height:92%;border:2px solid #f0c785;border-radius:49% 49% 44% 44%/40% 40% 60% 60%;background:radial-gradient(circle at 50% 45%,rgba(255,246,227,.42),rgba(26,19,15,.14) 64%);box-shadow:0 22px 45px rgba(24,14,8,.3),inset 0 0 0 12px rgba(255,255,255,.06);transition:width .35s ease,height .35s ease,border-radius .35s ease,clip-path .35s ease}.lhs-bsm-preview-shape[data-shape="front"]{border-radius:42% 42% 48% 48%/34% 34% 62% 62%}.lhs-bsm-preview-shape[data-shape="back"]{border-radius:52% 52% 40% 40%/50% 50% 48% 48%}.lhs-bsm-preview-shape[data-shape="custom"]{clip-path:polygon(15% 4%,83% 0,96% 24%,90% 71%,72% 98%,23% 92%,5% 61%,2% 25%);border-radius:24% 32% 28% 40%}.lhs-bsm-preview-front,.lhs-bsm-preview-back{position:absolute;left:50%;transform:translateX(-50%);font-size:9px;font-weight:900;letter-spacing:.18em;color:#f2cd91}.lhs-bsm-preview-front{top:8%}.lhs-bsm-preview-back{bottom:8%}.lhs-bsm-preview-axis-v{position:absolute;top:13%;bottom:13%;left:50%;border-left:1px dashed rgba(255,255,255,.55)}.lhs-bsm-preview-axis-h{position:absolute;left:13%;right:13%;top:50%;border-top:1px dashed rgba(255,255,255,.55)}.lhs-bsm-preview-length{position:absolute;right:-8px;top:12%;bottom:12%;border-right:1px solid #efd097}.lhs-bsm-preview-length:before,.lhs-bsm-preview-length:after{content:"";position:absolute;right:-4px;border-left:4px solid transparent;border-right:4px solid transparent}.lhs-bsm-preview-length:before{top:-1px;border-bottom:7px solid #efd097}.lhs-bsm-preview-length:after{bottom:-1px;border-top:7px solid #efd097}.lhs-bsm-preview-length span{position:absolute;top:50%;right:11px;transform:translateY(-50%) rotate(90deg);white-space:nowrap;color:#fff;font-size:12px;font-weight:800}.lhs-bsm-preview-width{position:absolute;left:12%;right:12%;bottom:-8px;border-bottom:1px solid #efd097}.lhs-bsm-preview-width:before,.lhs-bsm-preview-width:after{content:"";position:absolute;bottom:-4px;border-top:4px solid transparent;border-bottom:4px solid transparent}.lhs-bsm-preview-width:before{left:-1px;border-right:7px solid #efd097}.lhs-bsm-preview-width:after{right:-1px;border-left:7px solid #efd097}.lhs-bsm-preview-width span{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);white-space:nowrap;color:#fff;font-size:12px;font-weight:800}
.lhs-bsm-planner-summary>p:first-child{font-size:10px;font-weight:900;letter-spacing:.18em;color:#dcb16f}.lhs-bsm-planner-summary h3{font:400 34px/1.05 Georgia,serif;margin:17px 0 25px}.lhs-bsm-planner-summary dl{display:grid;gap:10px}.lhs-bsm-planner-summary dl>div{padding:13px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#1a1512}.lhs-bsm-planner-summary dt{font-size:9px;font-weight:800;letter-spacing:.13em;color:#dcb16f;text-transform:uppercase}.lhs-bsm-planner-summary dd{margin:6px 0 0;color:#fff;font-size:14px}.lhs-bsm-summary-copy{font-size:13px;line-height:1.65;color:#bbb1a9;margin:20px 0}.lhs-bsm-planner-summary .lhs-bsm-button{width:100%}
.lhs-bsm-step-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.lhs-bsm-step-grid article{padding:28px;border-top:2px solid #c58c45;background:rgba(255,255,255,.58)}.lhs-bsm-step-grid article>span{font-size:11px;font-weight:900;letter-spacing:.14em;color:#aa7131}.lhs-bsm-step-grid h3{font:400 28px/1.08 Georgia,serif;margin:22px 0 12px}.lhs-bsm-step-grid p{font-size:14px;line-height:1.65;color:#6d6259}
.lhs-bsm-mold-section{padding:96px 0;background:#ebe0d1}.lhs-bsm-mold-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(480px,1.2fr);gap:75px;align-items:start}.lhs-bsm-mold-copy{position:sticky;top:160px}.lhs-bsm-mold-copy h2{font-size:clamp(44px,5vw,70px);margin:12px 0 22px}.lhs-bsm-mold-copy>p:not(.lhs-kc-kicker){font-size:16px;line-height:1.75;color:#675b51}.lhs-bsm-safety{margin-top:30px;padding:22px;border-left:3px solid #b77d36;background:rgba(255,255,255,.55)}.lhs-bsm-safety strong,.lhs-bsm-safety span{display:block}.lhs-bsm-safety strong{font-size:12px;letter-spacing:.14em;text-transform:uppercase}.lhs-bsm-safety span{margin-top:10px;font-size:13px;line-height:1.65;color:#6b5d51}.lhs-bsm-mold-steps{list-style:none;padding:0;margin:0;display:grid;gap:14px}.lhs-bsm-mold-steps li{display:grid;grid-template-columns:58px 1fr;gap:20px;padding:24px;border-radius:16px;background:rgba(255,255,255,.7);box-shadow:0 13px 30px rgba(70,48,27,.06)}.lhs-bsm-mold-steps li>span{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:#1b1511;color:#e4bd7d;font-size:11px;font-weight:900}.lhs-bsm-mold-steps strong{font:400 25px/1.1 Georgia,serif}.lhs-bsm-mold-steps p{margin:8px 0 0;font-size:14px;line-height:1.65;color:#6b6057}
.lhs-bsm-two-column{display:grid;grid-template-columns:1fr 1fr;gap:70px}.lhs-bsm-checklist{list-style:none;padding:0;margin:0;display:grid;gap:10px}.lhs-bsm-checklist li{position:relative;padding:15px 18px 15px 48px;border:1px solid rgba(92,64,37,.12);border-radius:10px;background:rgba(255,255,255,.58);font-size:13px;font-weight:700}.lhs-bsm-checklist li:before{content:"✓";position:absolute;left:17px;top:50%;transform:translateY(-50%);color:#ad7432;font-weight:900}.lhs-bsm-photo-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}.lhs-bsm-photo-list li{display:grid;grid-template-columns:48px 1fr;gap:15px;padding:14px;border-bottom:1px solid rgba(92,64,37,.14)}.lhs-bsm-photo-list li>span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#ead7bb;color:#8f5c28;font-size:11px;font-weight:900}.lhs-bsm-photo-list strong,.lhs-bsm-photo-list small{display:block}.lhs-bsm-photo-list strong{font:400 22px/1.1 Georgia,serif}.lhs-bsm-photo-list small{margin-top:5px;color:#71665d;font-size:12px;line-height:1.5}
.lhs-bsm-errors-section{padding:96px 0;background:#17120f;color:#fff}.lhs-bsm-error-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.lhs-bsm-error-grid article{padding:25px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:#211b17}.lhs-bsm-error-grid strong{font:400 25px/1.08 Georgia,serif}.lhs-bsm-error-grid p{font-size:13px;line-height:1.65;color:#bdb3ab;margin:13px 0 0}.lhs-bsm-final-cta{padding:75px 0;background:linear-gradient(135deg,#ead8be,#f7f0e6)}.lhs-bsm-final-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:50px;align-items:center}.lhs-bsm-final-cta h2{font-size:clamp(42px,5vw,68px);margin:10px 0 18px}.lhs-bsm-final-cta p:not(.lhs-kc-kicker){font-size:15px;line-height:1.7;color:#665b52;max-width:760px}.lhs-bsm-final-actions{justify-content:flex-end;max-width:320px}.lhs-bsm-text-link{color:#795025;font-size:12px;font-weight:800;letter-spacing:.06em;text-decoration:none}
html[dir="rtl"] .lhs-bsm-path-card{text-align:right}html[dir="rtl"] .lhs-bsm-safety{border-left:0;border-right:3px solid #b77d36}html[dir="rtl"] .lhs-bsm-checklist li{padding:15px 48px 15px 18px}html[dir="rtl"] .lhs-bsm-checklist li:before{left:auto;right:17px}
.lhs-base-size-guide-inline{display:inline-flex;margin-top:12px;color:#96652d;font-size:12px;font-weight:750;text-decoration:none}.lhs-base-size-guide-inline:hover{text-decoration:underline}
.lhs-mold-official-callout{max-width:1180px;margin:34px auto 0;padding:20px 24px;border:1px solid rgba(178,123,57,.22);border-radius:12px;background:#fffaf2;display:flex;gap:18px;align-items:center;justify-content:space-between}.lhs-mold-official-callout p{margin:0;color:#65594e;font-size:14px}.lhs-mold-official-callout a{flex:0 0 auto;color:#17120f;font-size:11px;font-weight:850;letter-spacing:.1em;text-decoration:none}
@media(max-width:1100px){.lhs-bsm-hero-grid{grid-template-columns:1fr .72fr;gap:35px}.lhs-bsm-planner-grid{grid-template-columns:1fr 1.25fr}.lhs-bsm-planner-summary{grid-column:1/-1}.lhs-bsm-step-grid,.lhs-bsm-error-grid{grid-template-columns:repeat(2,1fr)}.lhs-bsm-mold-grid{grid-template-columns:1fr;gap:42px}.lhs-bsm-mold-copy{position:static}.lhs-bsm-final-inner{grid-template-columns:1fr}.lhs-bsm-final-actions{justify-content:flex-start}}
@media(max-width:760px){.lhs-bsm-hero{padding:58px 0}.lhs-bsm-hero-grid{grid-template-columns:1fr;gap:36px}.lhs-bsm-hero h1{font-size:48px}.lhs-bsm-hero-visual{min-height:370px}.lhs-bsm-head-outline{width:68%;max-width:280px}.lhs-bsm-section,.lhs-bsm-planner-section,.lhs-bsm-mold-section,.lhs-bsm-errors-section{padding:68px 0}.lhs-bsm-path-grid,.lhs-bsm-planner-grid,.lhs-bsm-step-grid,.lhs-bsm-two-column,.lhs-bsm-error-grid{grid-template-columns:1fr}.lhs-bsm-path-card{padding:24px}.lhs-bsm-live-preview{min-height:390px;padding:38px 30px}.lhs-bsm-mold-steps li{grid-template-columns:48px 1fr;padding:20px 17px;gap:14px}.lhs-bsm-mold-steps li>span{width:44px;height:44px}.lhs-bsm-final-actions{max-width:none}.lhs-mold-official-callout{margin-inline:16px;align-items:flex-start;flex-direction:column}.lhs-bsm-visual-length{right:0}}
@media(max-width:430px){.lhs-bsm-hero h1{font-size:41px}.lhs-bsm-section-heading h2,.lhs-bsm-heading-light h2,.lhs-bsm-mold-copy h2,.lhs-bsm-final-cta h2{font-size:38px}.lhs-bsm-button{width:100%}.lhs-bsm-hero-actions{display:grid}.lhs-bsm-live-preview{min-height:330px;padding:28px 22px}.lhs-bsm-planner-controls,.lhs-bsm-planner-summary{padding:22px 18px}.lhs-bsm-preview-width{left:7%;right:7%}}
/* =========================================================
2026-07-18 — LHS Hairline Design Guide
========================================================= */
.lhs-hlg-main{background:#f6efe5;color:#19130f}
.lhs-hlg-hero{padding:52px 28px 86px;background:radial-gradient(circle at 80% 12%,rgba(209,166,101,.18),transparent 35%),linear-gradient(180deg,#fffdfa 0%,#f3e7d7 100%);border-bottom:1px solid rgba(151,105,54,.16)}
.lhs-hlg-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:70px;align-items:center}
.lhs-hlg-hero h1{max-width:850px;margin:14px 0 22px;font:400 clamp(52px,6vw,92px)/.94 Georgia,"Times New Roman",serif;letter-spacing:-.055em}
.lhs-hlg-hero p:not(.lhs-kc-kicker){max-width:760px;font-size:18px;line-height:1.72;color:#665c54}
.lhs-hlg-hero-actions,.lhs-hlg-reference-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.lhs-hlg-button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border:1px solid rgba(110,75,42,.25);border-radius:9px;text-decoration:none;font-size:12px;font-weight:800;letter-spacing:.12em;transition:transform .25s ease,background .25s ease,color .25s ease}
.lhs-hlg-button:hover{transform:translateY(-2px)}
.lhs-hlg-button-dark{background:#1b140f;color:#f0cf95;border-color:#1b140f}.lhs-hlg-button-light{background:rgba(255,255,255,.7);color:#7d572d}.lhs-hlg-button-gold{background:#ddb36f;color:#21170f;border-color:#ddb36f}
.lhs-hlg-hero-visual{min-height:480px;display:grid;place-items:center;border-radius:36px;background:linear-gradient(145deg,#c9946f,#8d5e42);box-shadow:0 30px 80px rgba(73,43,23,.2);overflow:hidden}
.lhs-hlg-hero-visual svg{width:min(92%,470px);height:auto}.lhs-hlg-head{fill:url(#hlgHeroSkin);stroke:rgba(83,47,29,.35);stroke-width:2}.lhs-hlg-face{fill:url(#hlgSkin);stroke:rgba(83,47,29,.35);stroke-width:2}.lhs-hlg-line,.lhs-hlg-active-line{fill:none;stroke:#e7bd78;stroke-width:6;stroke-linecap:round;filter:drop-shadow(0 3px 7px rgba(24,12,6,.35))}.lhs-hlg-center-guide{fill:none;stroke:rgba(255,255,255,.38);stroke-width:2;stroke-dasharray:7 8}.lhs-hlg-hero-visual circle,.lhs-hlg-preview circle{fill:#edc77f;stroke:#1e130c;stroke-width:2}
.lhs-hlg-section{padding:86px 28px}.lhs-hlg-section-heading{max-width:940px;margin-bottom:38px}.lhs-hlg-section-heading h2{margin:10px 0 16px;font:400 clamp(38px,4.2vw,66px)/1 Georgia,"Times New Roman",serif;letter-spacing:-.04em}.lhs-hlg-section-heading>p:not(.lhs-kc-kicker){font-size:17px;line-height:1.7;color:#6d6259}
.lhs-hlg-principles,.lhs-hlg-checklist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.lhs-hlg-principles article,.lhs-hlg-checklist article{padding:30px;border:1px solid rgba(123,86,51,.16);border-radius:20px;background:rgba(255,255,255,.72);box-shadow:0 16px 42px rgba(71,45,25,.07)}.lhs-hlg-principles span,.lhs-hlg-checklist span{display:block;margin-bottom:22px;color:#b07c3d;font-size:12px;letter-spacing:.2em}.lhs-hlg-principles strong{font:400 28px/1.1 Georgia,"Times New Roman",serif}.lhs-hlg-principles p,.lhs-hlg-checklist p{margin:14px 0 0;color:#6e635b;line-height:1.65}
.lhs-hlg-planner{padding:88px 28px;background:#17120f;color:#fff}.lhs-hlg-heading-light h2{color:#fff}.lhs-hlg-heading-light>p:not(.lhs-kc-kicker){color:rgba(255,255,255,.7)}
.lhs-hlg-planner-grid{display:grid;grid-template-columns:minmax(230px,.58fr) minmax(360px,.92fr) minmax(360px,1fr);border:1px solid rgba(224,184,120,.23);border-radius:26px;overflow:hidden;background:#211a16;box-shadow:0 30px 90px rgba(0,0,0,.26)}
.lhs-hlg-option-list{display:grid;align-content:stretch;background:#f6efe5;padding:16px;gap:10px}.lhs-hlg-option-list button{width:100%;min-height:102px;padding:18px 20px;border:1px solid rgba(120,82,47,.16);border-radius:14px;background:rgba(255,255,255,.74);color:#1b1511;text-align:left;cursor:pointer;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}.lhs-hlg-option-list button:hover{transform:translateX(3px)}.lhs-hlg-option-list button.is-active{border-color:#c38d48;box-shadow:0 10px 25px rgba(113,72,33,.12);background:#fff}.lhs-hlg-option-list span{display:inline-block;margin-right:12px;color:#b07939;font-size:11px;letter-spacing:.16em}.lhs-hlg-option-list strong{display:block;margin-top:8px;font:400 23px/1 Georgia,"Times New Roman",serif}.lhs-hlg-option-list small{display:block;margin-top:8px;color:#76695f;line-height:1.4}
.lhs-hlg-preview{position:relative;display:grid;place-items:center;min-height:650px;padding:22px;background:radial-gradient(circle at 50% 42%,#c68b64,#865338);transition:opacity .22s ease}.lhs-hlg-preview.is-switching{opacity:.76}.lhs-hlg-preview svg{width:min(100%,520px);height:auto}.lhs-hlg-face{fill:url(#hlgSkin)}.lhs-hlg-active-line{transition:d .4s ease}.lhs-hlg-preview text{fill:rgba(255,255,255,.75);font-size:13px;letter-spacing:.18em}.lhs-hlg-preview-note{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 30px);padding:8px 13px;border-radius:999px;background:rgba(20,13,9,.55);color:rgba(255,255,255,.78);font-size:11px;letter-spacing:.08em;text-align:center;backdrop-filter:blur(8px)}
.lhs-hlg-result{display:flex;flex-direction:column;justify-content:center;padding:42px;background:#17120f}.lhs-hlg-result>p{margin:0 0 16px;color:#d5a85f;font-size:11px;font-weight:800;letter-spacing:.2em}.lhs-hlg-result h3{margin:0;font:400 clamp(40px,4vw,62px)/.98 Georgia,"Times New Roman",serif;letter-spacing:-.04em}.lhs-hlg-result>strong{margin-top:20px;color:#ebc781;font-size:18px}.lhs-hlg-result>span{margin-top:14px;color:rgba(255,255,255,.72);line-height:1.72}.lhs-hlg-result dl{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:28px 0}.lhs-hlg-result dl div{padding:16px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(255,255,255,.04)}.lhs-hlg-result dt{color:#d8aa62;font-size:10px;font-weight:800;letter-spacing:.14em}.lhs-hlg-result dd{margin:8px 0 0;color:#fff;line-height:1.4}.lhs-hlg-caution{display:flex;flex-direction:column;gap:8px;margin-bottom:22px;padding:16px;border-left:3px solid #d6aa66;background:rgba(255,255,255,.045)}.lhs-hlg-caution b{color:#e4bd7c;font-size:10px;letter-spacing:.15em}.lhs-hlg-caution span{color:rgba(255,255,255,.68);font-size:13px;line-height:1.55}.lhs-hlg-result .lhs-hlg-button{align-self:flex-start}
.lhs-hlg-checklist article h3{margin:0;font:400 29px/1.08 Georgia,"Times New Roman",serif}.lhs-hlg-mistakes{padding:86px 28px;background:#201813;color:#fff}.lhs-hlg-mistake-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.lhs-hlg-mistake-grid article{padding:25px;border:1px solid rgba(255,255,255,.12);border-radius:17px;background:rgba(255,255,255,.04)}.lhs-hlg-mistake-grid strong{font:400 25px/1.05 Georgia,"Times New Roman",serif;color:#ebc681}.lhs-hlg-mistake-grid p{color:rgba(255,255,255,.67);line-height:1.62}
.lhs-hairline-guide-inline{display:inline-flex;margin:9px 0 3px;color:#9a6a31;font-size:12px;font-weight:700;letter-spacing:.035em;text-decoration:none}.lhs-hairline-guide-inline:hover{text-decoration:underline}
html[dir="rtl"] .lhs-hlg-option-list button{text-align:right}html[dir="rtl"] .lhs-hlg-option-list span{margin-right:0;margin-left:12px}html[dir="rtl"] .lhs-hlg-caution{border-left:0;border-right:3px solid #d6aa66}
@media(max-width:1120px){.lhs-hlg-hero-grid{grid-template-columns:1fr .8fr;gap:36px}.lhs-hlg-planner-grid{grid-template-columns:260px 1fr}.lhs-hlg-result{grid-column:1/-1}.lhs-hlg-result dl{max-width:760px}.lhs-hlg-mistake-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.lhs-hlg-hero{padding:34px 18px 58px}.lhs-hlg-hero-grid{grid-template-columns:1fr}.lhs-hlg-hero h1{font-size:48px}.lhs-hlg-hero-visual{min-height:370px;border-radius:24px}.lhs-hlg-section,.lhs-hlg-planner,.lhs-hlg-mistakes{padding:62px 18px}.lhs-hlg-principles,.lhs-hlg-checklist,.lhs-hlg-mistake-grid{grid-template-columns:1fr}.lhs-hlg-planner-grid{grid-template-columns:1fr;border-radius:20px}.lhs-hlg-option-list{grid-template-columns:1fr 1fr}.lhs-hlg-option-list button{min-height:112px}.lhs-hlg-preview{min-height:500px}.lhs-hlg-result{padding:30px 22px}.lhs-hlg-result dl{grid-template-columns:1fr}.lhs-hlg-result .lhs-hlg-button{width:100%}.lhs-hlg-button{width:100%}.lhs-hlg-hero-actions,.lhs-hlg-reference-actions{flex-direction:column}}
@media(max-width:480px){.lhs-hlg-option-list{grid-template-columns:1fr}.lhs-hlg-preview{min-height:430px}.lhs-hlg-preview-note{font-size:9px}.lhs-hlg-section-heading h2{font-size:38px}}
@media(prefers-reduced-motion:reduce){.lhs-hlg-preview,.lhs-hlg-option-list button,.lhs-hlg-button{transition:none!important}}
/* =========================================================
LHS KNOWLEDGE CENTER — MAINTENANCE SCHEDULE GUIDE
========================================================= */
.lhs-msg-main{background:#f7f1e8;color:#19130f}
.lhs-msg-hero{padding:52px 28px 88px;background:radial-gradient(circle at 84% 16%,rgba(208,163,97,.2),transparent 35%),linear-gradient(180deg,#fffefa 0%,#f0e3d2 100%);border-bottom:1px solid rgba(144,98,48,.16)}
.lhs-msg-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(370px,.92fr);gap:68px;align-items:center}
.lhs-msg-hero h1{max-width:850px;margin:14px 0 22px;font:400 clamp(52px,6vw,92px)/.94 Georgia,"Times New Roman",serif;letter-spacing:-.055em}
.lhs-msg-hero p:not(.lhs-kc-kicker){max-width:760px;font-size:18px;line-height:1.72;color:#665c54}
.lhs-msg-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.lhs-msg-button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border:1px solid rgba(110,75,42,.25);border-radius:9px;text-decoration:none;font-size:12px;font-weight:800;letter-spacing:.11em;transition:transform .25s ease,background .25s ease,color .25s ease}.lhs-msg-button:hover{transform:translateY(-2px)}
.lhs-msg-button-dark{background:#1b140f;color:#f0cf95;border-color:#1b140f}.lhs-msg-button-light{background:rgba(255,255,255,.74);color:#7d572d}.lhs-msg-button-gold{background:#ddb36f;color:#21170f;border-color:#ddb36f}
.lhs-msg-hero-visual{min-height:500px;display:grid;place-items:center;border-radius:36px;background:linear-gradient(145deg,#2b211a,#120f0c);box-shadow:0 30px 80px rgba(73,43,23,.22);overflow:hidden}
.lhs-msg-orbit{position:relative;width:min(82%,410px);aspect-ratio:1;border:1px solid rgba(223,183,115,.38);border-radius:50%;box-shadow:inset 0 0 0 42px rgba(255,255,255,.018),0 0 0 28px rgba(220,178,106,.045)}
.lhs-msg-orbit:before,.lhs-msg-orbit:after{content:"";position:absolute;inset:17%;border:1px dashed rgba(226,188,126,.25);border-radius:50%}.lhs-msg-orbit:after{inset:34%;border-style:solid;background:radial-gradient(circle,#433224,#211914);box-shadow:0 20px 50px rgba(0,0,0,.35)}
.lhs-msg-orbit-center{position:absolute;inset:37%;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.lhs-msg-orbit-center b{font:400 42px/1 Georgia,serif;color:#e3ba78}.lhs-msg-orbit-center small{margin-top:8px;color:rgba(255,255,255,.62);font-size:9px;letter-spacing:.2em}
.lhs-msg-node{position:absolute;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;width:86px;height:86px;border-radius:50%;background:#f4e7d5;color:#211711;box-shadow:0 14px 30px rgba(0,0,0,.28);font-style:normal}.lhs-msg-node strong{font:400 22px/1 Georgia,serif;color:#9a6a31}.lhs-msg-node small{margin-top:7px;font-size:8px;letter-spacing:.15em}.lhs-msg-node-daily{top:-16px;left:50%;transform:translateX(-50%)}.lhs-msg-node-wash{right:-16px;top:50%;transform:translateY(-50%)}.lhs-msg-node-review{bottom:-16px;left:50%;transform:translateX(-50%)}.lhs-msg-node-service{left:-16px;top:50%;transform:translateY(-50%)}
.lhs-msg-section{padding:88px 28px}.lhs-msg-section-heading{max-width:970px;margin-bottom:40px}.lhs-msg-section-heading h2{margin:10px 0 16px;font:400 clamp(38px,4.2vw,66px)/1 Georgia,"Times New Roman",serif;letter-spacing:-.04em}.lhs-msg-section-heading>p:not(.lhs-kc-kicker){font-size:17px;line-height:1.72;color:#6d6259}
.lhs-msg-principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.lhs-msg-principles article{padding:31px;border:1px solid rgba(123,86,51,.16);border-radius:20px;background:rgba(255,255,255,.76);box-shadow:0 16px 42px rgba(71,45,25,.07)}.lhs-msg-principles span{display:block;margin-bottom:22px;color:#b07c3d;font-size:12px;letter-spacing:.2em}.lhs-msg-principles strong{font:400 28px/1.1 Georgia,"Times New Roman",serif}.lhs-msg-principles p{margin:14px 0 0;color:#6e635b;line-height:1.65}
.lhs-msg-builder{padding:90px 28px;background:#17120f;color:#fff}.lhs-msg-heading-light h2{color:#fff}.lhs-msg-heading-light>p:not(.lhs-kc-kicker){color:rgba(255,255,255,.7)}
.lhs-msg-mode-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-width:850px;margin:0 0 22px;border:1px solid rgba(224,184,120,.24);border-radius:16px;overflow:hidden}.lhs-msg-mode-switch button{padding:18px 22px;border:0;background:#221a15;color:#fff;text-align:left;cursor:pointer}.lhs-msg-mode-switch button+button{border-left:1px solid rgba(224,184,120,.22)}.lhs-msg-mode-switch button.is-active{background:#e0b66f;color:#21160e}.lhs-msg-mode-switch strong{display:block;font:400 22px/1.1 Georgia,serif}.lhs-msg-mode-switch small{display:block;margin-top:8px;color:inherit;opacity:.68;line-height:1.4}
.lhs-msg-builder-grid{display:grid;grid-template-columns:minmax(220px,.58fr) minmax(420px,1.05fr) minmax(350px,.9fr);border:1px solid rgba(224,184,120,.23);border-radius:26px;overflow:hidden;background:#211a16;box-shadow:0 30px 90px rgba(0,0,0,.26)}
.lhs-msg-base-list{display:grid;align-content:stretch;background:#f6efe5;padding:16px;gap:10px}.lhs-msg-base-list button{width:100%;min-height:116px;padding:18px 20px;border:1px solid rgba(120,82,47,.16);border-radius:14px;background:rgba(255,255,255,.74);color:#1b1511;text-align:left;cursor:pointer;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}.lhs-msg-base-list button:hover{transform:translateX(3px)}.lhs-msg-base-list button.is-active{border-color:#c38d48;box-shadow:0 10px 25px rgba(113,72,33,.12);background:#fff}.lhs-msg-base-list span{display:inline-block;margin-right:12px;color:#b07939;font-size:11px;letter-spacing:.16em}.lhs-msg-base-list strong{display:block;margin-top:8px;font:400 23px/1 Georgia,"Times New Roman",serif}.lhs-msg-base-list small{display:block;margin-top:8px;color:#76695f;line-height:1.4}
.lhs-msg-timeline{display:grid;align-content:center;gap:0;padding:32px 28px;background:linear-gradient(180deg,#2c211a,#1f1814)}.lhs-msg-timeline article{position:relative;display:grid;grid-template-columns:48px 1fr;gap:18px;padding:20px 0}.lhs-msg-timeline article:not(:last-child):after{content:"";position:absolute;left:23px;top:66px;bottom:-7px;width:1px;background:rgba(221,179,107,.32)}.lhs-msg-timeline article>span{position:relative;z-index:1;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#e0b66f;color:#24170f;font-size:11px;font-weight:900}.lhs-msg-timeline small{color:#d8aa62;font-size:9px;font-weight:800;letter-spacing:.16em}.lhs-msg-timeline h3{margin:7px 0 7px;font:400 23px/1.08 Georgia,serif;color:#fff}.lhs-msg-timeline p{margin:0;color:rgba(255,255,255,.66);font-size:13px;line-height:1.55}
.lhs-msg-result{display:flex;flex-direction:column;justify-content:center;padding:38px;background:#f6efe5;color:#211711}.lhs-msg-result>p{margin:0 0 16px;color:#a16d31;font-size:10px;font-weight:800;letter-spacing:.2em}.lhs-msg-result h3{margin:0;font:400 clamp(38px,3.4vw,55px)/.98 Georgia,"Times New Roman",serif;letter-spacing:-.04em}.lhs-msg-result>strong{margin-top:20px;color:#8d5d29;font-size:18px}.lhs-msg-result>span{margin-top:14px;color:#675d55;line-height:1.68}.lhs-msg-result dl{display:grid;grid-template-columns:1fr;gap:10px;margin:26px 0}.lhs-msg-result dl div{padding:15px;border:1px solid rgba(117,78,42,.16);border-radius:12px;background:rgba(255,255,255,.72)}.lhs-msg-result dt{color:#a56f31;font-size:9px;font-weight:800;letter-spacing:.14em}.lhs-msg-result dd{margin:7px 0 0;color:#211711;line-height:1.42}.lhs-msg-alert{display:flex;flex-direction:column;gap:8px;margin-bottom:22px;padding:16px;border-left:3px solid #bd833e;background:rgba(123,81,36,.08)}.lhs-msg-alert b{color:#956027;font-size:10px;letter-spacing:.15em}.lhs-msg-alert span{color:#62574f;font-size:13px;line-height:1.55}.lhs-msg-result .lhs-msg-button{align-self:flex-start}
.lhs-msg-wash-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.lhs-msg-wash-steps li{padding:28px;border:1px solid rgba(123,86,51,.16);border-radius:18px;background:#fff}.lhs-msg-wash-steps li>span{display:grid;place-items:center;width:50px;height:50px;margin-bottom:24px;border-radius:14px;background:#211711;color:#e3ba78;font-size:11px;font-weight:900}.lhs-msg-wash-steps strong{font:400 26px/1.08 Georgia,serif}.lhs-msg-wash-steps p{margin:13px 0 0;color:#6d6259;font-size:14px;line-height:1.65}
.lhs-msg-warning-section{padding:88px 28px;background:#201813;color:#fff}.lhs-msg-warning-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.lhs-msg-warning-grid article{padding:26px;border:1px solid rgba(255,255,255,.12);border-radius:17px;background:rgba(255,255,255,.04)}.lhs-msg-warning-grid strong{font:400 25px/1.05 Georgia,serif;color:#ebc681}.lhs-msg-warning-grid p{color:rgba(255,255,255,.67);line-height:1.62}
.lhs-msg-products{padding:88px 28px}.lhs-msg-product-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.lhs-msg-product-grid a{display:flex;min-height:210px;flex-direction:column;padding:24px;border:1px solid rgba(123,86,51,.16);border-radius:18px;background:rgba(255,255,255,.78);color:#211711;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}.lhs-msg-product-grid a:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(72,46,25,.1)}.lhs-msg-product-grid span{color:#ae7838;font-size:11px;letter-spacing:.16em}.lhs-msg-product-grid strong{margin-top:auto;font:400 25px/1.05 Georgia,serif}.lhs-msg-product-grid small{margin-top:12px;color:#73675e;line-height:1.45}
.lhs-msg-final-cta{padding:78px 28px;background:linear-gradient(135deg,#ead8be,#f7f0e6)}.lhs-msg-final-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:50px;align-items:center}.lhs-msg-final-cta h2{font-size:clamp(42px,5vw,68px);margin:10px 0 18px}.lhs-msg-final-cta p:not(.lhs-kc-kicker){font-size:15px;line-height:1.7;color:#665b52;max-width:760px}.lhs-msg-final-actions{justify-content:flex-end;max-width:320px}.lhs-msg-text-link{color:#795025;font-size:12px;font-weight:800;letter-spacing:.06em;text-decoration:none}
.lhs-maintenance-guide-inline,.lhs-maintenance-guide-banner{display:block;margin-top:10px;color:#8a5b27;font-size:12px;font-weight:800;line-height:1.5;text-decoration:none}.lhs-maintenance-guide-inline:hover,.lhs-maintenance-guide-banner:hover{text-decoration:underline}
html[dir="rtl"] .lhs-msg-base-list button,html[dir="rtl"] .lhs-msg-mode-switch button{text-align:right}html[dir="rtl"] .lhs-msg-base-list span{margin-right:0;margin-left:12px}html[dir="rtl"] .lhs-msg-alert{border-left:0;border-right:3px solid #bd833e}html[dir="rtl"] .lhs-msg-mode-switch button+button{border-left:0;border-right:1px solid rgba(224,184,120,.22)}html[dir="rtl"] .lhs-msg-timeline article:not(:last-child):after{left:auto;right:23px}
@media(max-width:1180px){.lhs-msg-hero-grid{grid-template-columns:1fr .82fr;gap:38px}.lhs-msg-builder-grid{grid-template-columns:250px 1fr}.lhs-msg-result{grid-column:1/-1}.lhs-msg-product-grid{grid-template-columns:repeat(3,1fr)}.lhs-msg-wash-steps,.lhs-msg-warning-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.lhs-msg-hero{padding:34px 18px 58px}.lhs-msg-hero-grid{grid-template-columns:1fr}.lhs-msg-hero h1{font-size:48px}.lhs-msg-hero-visual{min-height:390px;border-radius:24px}.lhs-msg-section,.lhs-msg-builder,.lhs-msg-warning-section,.lhs-msg-products,.lhs-msg-final-cta{padding:62px 18px}.lhs-msg-principles,.lhs-msg-wash-steps,.lhs-msg-warning-grid,.lhs-msg-product-grid{grid-template-columns:1fr}.lhs-msg-mode-switch{grid-template-columns:1fr}.lhs-msg-mode-switch button+button{border-left:0;border-top:1px solid rgba(224,184,120,.22)}html[dir="rtl"] .lhs-msg-mode-switch button+button{border-right:0;border-top:1px solid rgba(224,184,120,.22)}.lhs-msg-builder-grid{grid-template-columns:1fr;border-radius:20px}.lhs-msg-base-list{grid-template-columns:1fr 1fr}.lhs-msg-base-list button{min-height:112px}.lhs-msg-result{padding:30px 22px}.lhs-msg-result .lhs-msg-button,.lhs-msg-button{width:100%}.lhs-msg-actions{flex-direction:column}.lhs-msg-final-inner{grid-template-columns:1fr}.lhs-msg-final-actions{justify-content:flex-start;max-width:none}.lhs-msg-product-grid a{min-height:150px}}
@media(max-width:480px){.lhs-msg-base-list{grid-template-columns:1fr}.lhs-msg-orbit{width:74%}.lhs-msg-node{width:70px;height:70px}.lhs-msg-section-heading h2{font-size:38px}.lhs-msg-timeline{padding:25px 20px}.lhs-msg-timeline article{grid-template-columns:43px 1fr;gap:14px}.lhs-msg-timeline article>span{width:42px;height:42px}.lhs-msg-timeline article:not(:last-child):after{left:20px}.lhs-msg-product-grid a{min-height:135px}}
@media(prefers-reduced-motion:reduce){.lhs-msg-button,.lhs-msg-base-list button,.lhs-msg-product-grid a{transition:none!important}}
/* ============================================================
LHS Adhesive & Removal Guide — 2026-07-18
============================================================ */
.lhs-adhesive-removal-guide-page{background:#f5f1eb;color:#211711}.lhs-arg-main{overflow:hidden}.lhs-arg-main .lhs-kc-shell{width:min(1220px,calc(100% - 56px));margin-inline:auto}.lhs-arg-hero{padding:48px 28px 86px;background:radial-gradient(circle at 78% 35%,rgba(215,177,116,.22),transparent 26%),linear-gradient(135deg,#f5efe6 0%,#ebe0d2 52%,#d7c0a3 100%)}.lhs-arg-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,.82fr);gap:70px;align-items:center;min-height:600px}.lhs-arg-hero h1,.lhs-arg-final-cta h2{margin:14px 0 22px;font:400 clamp(54px,6vw,86px)/.94 Georgia,"Times New Roman",serif;letter-spacing:-.055em}.lhs-arg-hero p:not(.lhs-kc-kicker){max-width:700px;color:#665b52;font-size:17px;line-height:1.72}.lhs-arg-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.lhs-arg-button{display:inline-flex;min-height:51px;align-items:center;justify-content:center;padding:13px 23px;border:1px solid #231914;border-radius:999px;font-size:11px;font-weight:900;letter-spacing:.09em;text-decoration:none;transition:transform .2s ease,background .2s ease,color .2s ease}.lhs-arg-button:hover{transform:translateY(-2px)}.lhs-arg-button-dark{background:#211711;color:#fff}.lhs-arg-button-light{background:rgba(255,255,255,.45);color:#211711}.lhs-arg-hero-visual{position:relative;min-height:465px;display:grid;place-items:center;perspective:1000px}.lhs-arg-layer{position:absolute;width:min(82%,420px);height:118px;border-radius:50%;display:flex;align-items:center;justify-content:center;gap:16px;border:1px solid rgba(84,52,28,.18);box-shadow:0 24px 55px rgba(67,42,24,.14);font-family:Georgia,serif;letter-spacing:.08em}.lhs-arg-layer span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;font:800 10px/1 Arial,sans-serif}.lhs-arg-layer b{font-size:18px}.lhs-arg-layer-system{top:82px;background:rgba(255,255,255,.88);transform:rotateX(62deg);color:#2d2018}.lhs-arg-layer-system span{background:#2d2018;color:#e7c486}.lhs-arg-layer-bond{top:176px;background:linear-gradient(90deg,#c18b48,#e4bd7c);transform:rotateX(62deg);color:#2a1b12}.lhs-arg-layer-bond span{background:#2a1b12;color:#e9c989}.lhs-arg-layer-scalp{top:270px;background:linear-gradient(90deg,#d8b49a,#e8cbb6);transform:rotateX(62deg);color:#442d24}.lhs-arg-layer-scalp span{background:#442d24;color:#f5ded0}.lhs-arg-release-path{position:absolute;right:9%;top:120px;width:80px;height:220px;border-right:2px dashed rgba(124,78,37,.5);border-bottom:2px dashed rgba(124,78,37,.5);border-radius:0 0 50px 0}.lhs-arg-release-path:after{content:"";position:absolute;right:-7px;bottom:-2px;border:6px solid transparent;border-left-color:#8a5b2e}.lhs-arg-hero-visual>small{position:absolute;bottom:20px;color:#8a6039;font-size:10px;font-weight:900;letter-spacing:.22em}.lhs-arg-section{padding:88px 28px}.lhs-arg-section-heading{max-width:970px;margin-bottom:40px}.lhs-arg-section-heading h2{margin:10px 0 16px;font:400 clamp(38px,4.2vw,66px)/1 Georgia,"Times New Roman",serif;letter-spacing:-.04em}.lhs-arg-section-heading>p:not(.lhs-kc-kicker){color:#6d6259;font-size:17px;line-height:1.72}.lhs-arg-principles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.lhs-arg-principles article{padding:29px;border:1px solid rgba(123,86,51,.16);border-radius:19px;background:rgba(255,255,255,.76);box-shadow:0 16px 42px rgba(71,45,25,.06)}.lhs-arg-principles span{display:block;margin-bottom:22px;color:#b07c3d;font-size:11px;letter-spacing:.2em}.lhs-arg-principles strong{font:400 25px/1.08 Georgia,"Times New Roman",serif}.lhs-arg-principles p{margin:14px 0 0;color:#6e635b;font-size:14px;line-height:1.65}.lhs-arg-planner{padding:92px 28px;background:#17120f;color:#fff}.lhs-arg-heading-light h2{color:#fff}.lhs-arg-heading-light>p:not(.lhs-kc-kicker){color:rgba(255,255,255,.7)}.lhs-arg-mode-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px;margin:0 0 22px;border:1px solid rgba(224,184,120,.24);border-radius:16px;overflow:hidden}.lhs-arg-mode-switch button{padding:18px 22px;border:0;background:#221a15;color:#fff;text-align:left;cursor:pointer}.lhs-arg-mode-switch button+button{border-left:1px solid rgba(224,184,120,.22)}.lhs-arg-mode-switch button.is-active{background:#e0b66f;color:#21160e}.lhs-arg-mode-switch strong{display:block;font:400 22px/1.1 Georgia,serif}.lhs-arg-mode-switch small{display:block;margin-top:8px;color:inherit;opacity:.7;line-height:1.4}.lhs-arg-planner-grid{display:grid;grid-template-columns:minmax(220px,.56fr) minmax(430px,1.03fr) minmax(350px,.86fr);border:1px solid rgba(224,184,120,.23);border-radius:26px;overflow:hidden;background:#211a16;box-shadow:0 30px 90px rgba(0,0,0,.26)}.lhs-arg-base-list{display:grid;align-content:stretch;background:#f6efe5;padding:16px;gap:10px}.lhs-arg-base-list button{width:100%;min-height:116px;padding:18px 20px;border:1px solid rgba(120,82,47,.16);border-radius:14px;background:rgba(255,255,255,.74);color:#1b1511;text-align:left;cursor:pointer;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}.lhs-arg-base-list button:hover{transform:translateX(3px)}.lhs-arg-base-list button.is-active{border-color:#c38d48;box-shadow:0 10px 25px rgba(113,72,33,.12);background:#fff}.lhs-arg-base-list span{display:inline-block;margin-right:12px;color:#b07939;font-size:11px;letter-spacing:.16em}.lhs-arg-base-list strong{display:block;margin-top:8px;font:400 23px/1 Georgia,"Times New Roman",serif}.lhs-arg-base-list small{display:block;margin-top:8px;color:#76695f;line-height:1.4}.lhs-arg-flow{display:grid;align-content:center;padding:30px 28px;background:linear-gradient(180deg,#2c211a,#1f1814)}.lhs-arg-flow article{position:relative;display:grid;grid-template-columns:48px 1fr;gap:18px;padding:18px 0}.lhs-arg-flow article:not(:last-child):after{content:"";position:absolute;left:23px;top:64px;bottom:-5px;width:1px;background:rgba(221,179,107,.32)}.lhs-arg-flow article>span{position:relative;z-index:1;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#e0b66f;color:#24170f;font-size:11px;font-weight:900}.lhs-arg-flow small{color:#d8aa62;font-size:9px;font-weight:800;letter-spacing:.16em}.lhs-arg-flow h3{margin:7px 0;font:400 23px/1.08 Georgia,serif;color:#fff}.lhs-arg-flow p{margin:0;color:rgba(255,255,255,.66);font-size:13px;line-height:1.55}.lhs-arg-result{display:flex;flex-direction:column;justify-content:center;padding:36px;background:#f6efe5;color:#211711}.lhs-arg-result>p{margin:0 0 16px;color:#a16d31;font-size:10px;font-weight:800;letter-spacing:.2em}.lhs-arg-result h3{margin:0;font:400 clamp(35px,3.2vw,52px)/.98 Georgia,"Times New Roman",serif;letter-spacing:-.04em}.lhs-arg-result>strong{margin-top:18px;color:#8d5d29;font-size:18px}.lhs-arg-result>span{margin-top:13px;color:#675d55;line-height:1.65}.lhs-arg-result dl{display:grid;gap:9px;margin:23px 0}.lhs-arg-result dl div{padding:14px;border:1px solid rgba(117,78,42,.16);border-radius:12px;background:rgba(255,255,255,.72)}.lhs-arg-result dt{color:#a56f31;font-size:9px;font-weight:800;letter-spacing:.14em}.lhs-arg-result dd{margin:7px 0 0;color:#211711;font-size:13px;line-height:1.45}.lhs-arg-alert{display:flex;flex-direction:column;gap:7px;margin-bottom:19px;padding:15px;border-left:3px solid #bd833e;background:rgba(123,81,36,.08)}.lhs-arg-alert b{color:#956027;font-size:10px;letter-spacing:.15em}.lhs-arg-alert span{color:#62574f;font-size:13px;line-height:1.55}.lhs-arg-result-actions{display:flex;flex-direction:column;align-items:flex-start;gap:13px}.lhs-arg-text-link{color:#795025;font-size:12px;font-weight:800;letter-spacing:.05em;text-decoration:none}.lhs-arg-format-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.lhs-arg-format-grid article{display:flex;flex-direction:column;padding:38px;border:1px solid rgba(123,86,51,.16);border-radius:22px;background:#fff}.lhs-arg-format-grid article>span{color:#ae7838;font-size:11px;font-weight:800;letter-spacing:.18em}.lhs-arg-format-grid h3{margin:18px 0 13px;font:400 34px/1.02 Georgia,serif}.lhs-arg-format-grid p,.lhs-arg-format-grid li{color:#6d6259;line-height:1.65}.lhs-arg-format-grid ul{padding-left:20px;margin:20px 0 28px}.lhs-arg-format-grid a{margin-top:auto;color:#7f5428;font-size:11px;font-weight:900;letter-spacing:.1em;text-decoration:none}.lhs-arg-release-section{padding:90px 28px;background:#201813;color:#fff}.lhs-arg-release-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.lhs-arg-release-steps li{padding:25px;border:1px solid rgba(255,255,255,.12);border-radius:17px;background:rgba(255,255,255,.04)}.lhs-arg-release-steps li>span{display:grid;place-items:center;width:48px;height:48px;margin-bottom:22px;border-radius:14px;background:#e0b66f;color:#22150e;font-size:11px;font-weight:900}.lhs-arg-release-steps strong{font:400 24px/1.06 Georgia,serif;color:#fff}.lhs-arg-release-steps p{color:rgba(255,255,255,.67);font-size:13px;line-height:1.62}.lhs-arg-safety-section{padding:88px 28px}.lhs-arg-safety-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.lhs-arg-safety-grid article{padding:27px;border:1px solid rgba(123,86,51,.16);border-radius:17px;background:rgba(255,255,255,.8)}.lhs-arg-safety-grid strong{font:400 25px/1.05 Georgia,serif;color:#8a5d2d}.lhs-arg-safety-grid p{color:#6c6158;line-height:1.62}.lhs-arg-products{padding:88px 28px;background:#ebe2d7}.lhs-arg-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.lhs-arg-product-grid a{display:flex;min-height:185px;flex-direction:column;padding:25px;border:1px solid rgba(123,86,51,.16);border-radius:18px;background:rgba(255,255,255,.8);color:#211711;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}.lhs-arg-product-grid a:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(72,46,25,.1)}.lhs-arg-product-grid span{color:#ae7838;font-size:11px;letter-spacing:.16em}.lhs-arg-product-grid strong{margin-top:auto;font:400 26px/1.05 Georgia,serif}.lhs-arg-product-grid small{margin-top:12px;color:#73675e;line-height:1.45}.lhs-arg-final-cta{padding:78px 28px;background:linear-gradient(135deg,#ead8be,#f7f0e6)}.lhs-arg-final-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:50px;align-items:center}.lhs-arg-final-cta h2{font-size:clamp(42px,5vw,68px);margin:10px 0 18px}.lhs-arg-final-cta p:not(.lhs-kc-kicker){font-size:15px;line-height:1.7;color:#665b52;max-width:760px}.lhs-arg-final-actions{justify-content:flex-end;max-width:340px}.lhs-adhesive-guide-inline,.lhs-adhesive-guide-banner{display:block;margin-top:10px;color:#8a5b27;font-size:12px;font-weight:800;line-height:1.5;text-decoration:none}.lhs-adhesive-guide-inline:hover,.lhs-adhesive-guide-banner:hover{text-decoration:underline}html[dir="rtl"] .lhs-arg-base-list button,html[dir="rtl"] .lhs-arg-mode-switch button{text-align:right}html[dir="rtl"] .lhs-arg-base-list span{margin-right:0;margin-left:12px}html[dir="rtl"] .lhs-arg-alert{border-left:0;border-right:3px solid #bd833e}html[dir="rtl"] .lhs-arg-mode-switch button+button{border-left:0;border-right:1px solid rgba(224,184,120,.22)}html[dir="rtl"] .lhs-arg-flow article:not(:last-child):after{left:auto;right:23px}html[dir="rtl"] .lhs-arg-format-grid ul{padding-left:0;padding-right:20px}
@media(max-width:1180px){.lhs-arg-hero-grid{grid-template-columns:1fr .82fr;gap:38px}.lhs-arg-planner-grid{grid-template-columns:250px 1fr}.lhs-arg-result{grid-column:1/-1}.lhs-arg-principles,.lhs-arg-safety-grid{grid-template-columns:repeat(2,1fr)}.lhs-arg-release-steps{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.lhs-arg-main .lhs-kc-shell{width:min(100% - 36px,1220px)}.lhs-arg-hero{padding:34px 18px 58px}.lhs-arg-hero-grid{grid-template-columns:1fr;min-height:0}.lhs-arg-hero h1{font-size:48px}.lhs-arg-hero-visual{min-height:390px}.lhs-arg-section,.lhs-arg-planner,.lhs-arg-release-section,.lhs-arg-safety-section,.lhs-arg-products,.lhs-arg-final-cta{padding:62px 18px}.lhs-arg-principles,.lhs-arg-format-grid,.lhs-arg-safety-grid,.lhs-arg-product-grid,.lhs-arg-release-steps{grid-template-columns:1fr}.lhs-arg-mode-switch{grid-template-columns:1fr}.lhs-arg-mode-switch button+button{border-left:0;border-top:1px solid rgba(224,184,120,.22)}html[dir="rtl"] .lhs-arg-mode-switch button+button{border-right:0;border-top:1px solid rgba(224,184,120,.22)}.lhs-arg-planner-grid{grid-template-columns:1fr;border-radius:20px}.lhs-arg-base-list{grid-template-columns:1fr 1fr}.lhs-arg-base-list button{min-height:112px}.lhs-arg-result{padding:30px 22px}.lhs-arg-result .lhs-arg-button,.lhs-arg-button{width:100%}.lhs-arg-actions{flex-direction:column}.lhs-arg-final-inner{grid-template-columns:1fr}.lhs-arg-final-actions{justify-content:flex-start;max-width:none}.lhs-arg-product-grid a{min-height:145px}.lhs-arg-release-steps li{min-height:0}}
@media(max-width:480px){.lhs-arg-base-list{grid-template-columns:1fr}.lhs-arg-layer{width:92%;height:104px}.lhs-arg-layer-system{top:78px}.lhs-arg-layer-bond{top:162px}.lhs-arg-layer-scalp{top:246px}.lhs-arg-release-path{right:0}.lhs-arg-section-heading h2{font-size:38px}.lhs-arg-flow{padding:25px 20px}.lhs-arg-flow article{grid-template-columns:43px 1fr;gap:14px}.lhs-arg-flow article>span{width:42px;height:42px}.lhs-arg-flow article:not(:last-child):after{left:20px}.lhs-arg-format-grid article{padding:28px}}
@media(prefers-reduced-motion:reduce){.lhs-arg-button,.lhs-arg-base-list button,.lhs-arg-product-grid a{transition:none!important}}
/* LHS First 48 Hours Guide — 2026-07-18 */
.lhs-f48-main{overflow:hidden;background:#f8f5f0;color:#211711}.lhs-f48-main .lhs-kc-shell{width:min(100% - 56px,1220px);margin-inline:auto}.lhs-f48-hero{position:relative;padding:42px 28px 86px;background:radial-gradient(circle at 82% 27%,rgba(222,183,118,.25),transparent 28%),linear-gradient(135deg,#f7f0e6 0%,#efe2d1 55%,#e5d0b2 100%)}.lhs-f48-hero:after{content:"";position:absolute;inset:auto 0 0;height:1px;background:rgba(83,54,31,.15)}.lhs-f48-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,.75fr);align-items:center;gap:70px;min-height:570px}.lhs-f48-hero h1,.lhs-f48-heading h2,.lhs-f48-sleep-section h2,.lhs-f48-final-cta h2{font:400 clamp(50px,6.2vw,88px)/.92 Georgia,"Times New Roman",serif;letter-spacing:-.055em}.lhs-f48-hero h1{margin:16px 0 25px;max-width:700px}.lhs-f48-hero-copy>p:not(.lhs-kc-kicker){max-width:700px;color:#655a51;font-size:16px;line-height:1.75}.lhs-f48-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:30px}.lhs-f48-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:1px solid #271c15;border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.12em;text-decoration:none;transition:transform .22s ease,box-shadow .22s ease}.lhs-f48-button:hover{transform:translateY(-2px)}.lhs-f48-button-dark{background:#241a14;color:#fff}.lhs-f48-button-light{background:rgba(255,255,255,.55);color:#241a14}.lhs-f48-button-gold{border-color:#d8ad65;background:#d8ad65;color:#23170f}.lhs-f48-text-link,.lhs-first48-text-link{color:#795025;font-size:12px;font-weight:800;letter-spacing:.04em;text-decoration:none}.lhs-f48-clock{position:relative;min-height:480px;display:grid;place-items:center}.lhs-f48-clock:before{content:"";position:absolute;width:410px;height:410px;border-radius:50%;background:rgba(255,255,255,.3);box-shadow:0 30px 80px rgba(91,54,25,.14),inset 0 0 0 1px rgba(255,255,255,.58)}.lhs-f48-clock-ring{position:absolute;border-radius:50%;border:1px solid rgba(102,67,35,.24)}.lhs-f48-ring-outer{width:350px;height:350px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,rgba(255,255,255,.74),rgba(255,255,255,.18));box-shadow:inset 0 0 0 16px rgba(255,255,255,.16)}.lhs-f48-ring-outer:before{content:"";position:absolute;inset:17px;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(112,72,35,.36) 0 1deg,transparent 1deg 15deg);mask:radial-gradient(circle,transparent 64%,#000 65% 68%,transparent 69%)}.lhs-f48-ring-outer span{font:400 90px/.8 Georgia,serif;color:#342218}.lhs-f48-ring-outer small{margin-top:15px;color:#9b6b35;font-size:10px;font-weight:900;letter-spacing:.34em}.lhs-f48-ring-middle{width:270px;height:270px}.lhs-f48-ring-inner{width:150px;height:150px;background:rgba(235,213,181,.44)}.lhs-f48-clock-hand{position:absolute;z-index:3;left:50%;bottom:50%;width:3px;border-radius:3px;background:#2a1d15;transform-origin:bottom center}.lhs-f48-hour-hand{height:82px;transform:translateX(-50%) rotate(38deg)}.lhs-f48-minute-hand{height:124px;width:2px;background:#ae7435;transform:translateX(-50%) rotate(152deg)}.lhs-f48-clock-center{position:absolute;z-index:4;width:16px;height:16px;border-radius:50%;background:#2a1d15;box-shadow:0 0 0 7px rgba(218,172,96,.5)}.lhs-f48-clock em{position:absolute;bottom:22px;color:#7b593c;font-style:normal;font-size:9px;font-weight:900;letter-spacing:.24em}.lhs-f48-principles,.lhs-f48-section,.lhs-f48-warning-section{padding:92px 0}.lhs-f48-heading{max-width:900px;margin-bottom:42px}.lhs-f48-heading h2{margin:12px 0 18px;font-size:clamp(42px,5vw,70px)}.lhs-f48-heading>p:not(.lhs-kc-kicker){color:#6a5f56;line-height:1.7}.lhs-f48-principle-grid,.lhs-f48-warning-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.lhs-f48-principle-grid article,.lhs-f48-warning-grid article{padding:27px;border:1px solid rgba(117,78,42,.16);border-radius:18px;background:rgba(255,255,255,.78)}.lhs-f48-principle-grid span{display:grid;place-items:center;width:45px;height:45px;margin-bottom:24px;border-radius:14px;background:#ead7ba;color:#7e5429;font-size:11px;font-weight:900}.lhs-f48-principle-grid strong,.lhs-f48-warning-grid strong{display:block;font:400 25px/1.06 Georgia,serif;color:#8b5d2d}.lhs-f48-principle-grid p,.lhs-f48-warning-grid p{color:#6a6058;font-size:13px;line-height:1.65}.lhs-f48-planner{padding:92px 28px;background:#211914;color:#fff}.lhs-f48-heading-light h2{color:#fff}.lhs-f48-heading-light>p:not(.lhs-kc-kicker){color:rgba(255,255,255,.67)}.lhs-f48-mode-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid rgba(229,191,128,.24);border-radius:18px 18px 0 0;overflow:hidden}.lhs-f48-mode-switch button{min-height:100px;padding:22px 27px;border:0;background:#2d231d;color:#fff;text-align:left;cursor:pointer}.lhs-f48-mode-switch button+button{border-left:1px solid rgba(229,191,128,.2)}.lhs-f48-mode-switch button.is-active{background:#d9b270;color:#221710}.lhs-f48-mode-switch strong,.lhs-f48-mode-switch small{display:block}.lhs-f48-mode-switch strong{font:400 24px/1.05 Georgia,serif}.lhs-f48-mode-switch small{margin-top:8px;opacity:.7;line-height:1.4}.lhs-f48-planner-grid{display:grid;grid-template-columns:250px minmax(250px,.72fr) minmax(390px,1.18fr);border:1px solid rgba(229,191,128,.24);border-top:0;border-radius:0 0 22px 22px;overflow:hidden;background:#f8f4ed;color:#221710}.lhs-f48-base-list{display:grid;align-content:start;padding:18px;background:#eee4d7}.lhs-f48-base-list button{min-height:113px;padding:18px;border:1px solid transparent;border-radius:14px;background:transparent;text-align:left;cursor:pointer;transition:transform .2s ease,background .2s ease,border-color .2s ease}.lhs-f48-base-list button:hover{transform:translateX(3px)}.lhs-f48-base-list button.is-active{border-color:#bc8747;background:#fff;box-shadow:0 10px 24px rgba(83,54,31,.1)}.lhs-f48-base-list span{color:#a97034;font-size:10px;font-weight:900;letter-spacing:.14em}.lhs-f48-base-list strong,.lhs-f48-base-list small{display:block}.lhs-f48-base-list strong{margin-top:8px;font:400 22px/1 Georgia,serif}.lhs-f48-base-list small{margin-top:8px;color:#75695f}.lhs-f48-phase-tabs{display:grid;align-content:center;padding:27px;background:linear-gradient(180deg,#30251e,#201914)}.lhs-f48-phase-tabs button{position:relative;display:grid;grid-template-columns:70px 1fr;align-items:center;min-height:86px;padding:14px 16px;border:0;border-radius:14px;background:transparent;color:#fff;text-align:left;cursor:pointer}.lhs-f48-phase-tabs button:not(:last-child):after{content:"";position:absolute;left:49px;top:70px;bottom:-17px;width:1px;background:rgba(221,179,107,.28)}.lhs-f48-phase-tabs button.is-active{background:rgba(221,179,107,.14)}.lhs-f48-phase-tabs span{position:relative;z-index:1;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#d9b270;color:#23170f;font-size:10px;font-weight:900}.lhs-f48-phase-tabs strong{font:400 23px/1 Georgia,serif}.lhs-f48-result{display:flex;flex-direction:column;justify-content:center;padding:38px;background:#f7efe4}.lhs-f48-result>p:first-child{margin:0 0 15px;color:#a46c2e;font-size:10px;font-weight:900;letter-spacing:.16em}.lhs-f48-result h3{margin:0;font:400 clamp(36px,4vw,56px)/.95 Georgia,serif;letter-spacing:-.04em}.lhs-f48-result>strong{margin-top:19px;color:#8f5e2b;font-size:18px}.lhs-f48-result>p:not(:first-child){color:#675c54;line-height:1.66}.lhs-f48-result dl{display:grid;gap:9px;margin:20px 0}.lhs-f48-result dl div{padding:14px;border:1px solid rgba(117,78,42,.15);border-radius:12px;background:rgba(255,255,255,.72)}.lhs-f48-result dt{color:#a56f31;font-size:9px;font-weight:900;letter-spacing:.14em}.lhs-f48-result dd{margin:6px 0 0;color:#2a201a;font-size:13px;line-height:1.5}.lhs-f48-alert{display:flex;flex-direction:column;gap:7px;margin-bottom:20px;padding:15px;border-left:3px solid #bd833e;background:rgba(123,81,36,.08)}.lhs-f48-alert b{color:#956027;font-size:9px;letter-spacing:.12em}.lhs-f48-alert span{color:#62574f;font-size:13px;line-height:1.5}.lhs-f48-common-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.lhs-f48-common-grid article{position:relative;min-height:245px;padding:34px;border:1px solid rgba(117,78,42,.16);border-radius:20px;background:#fff}.lhs-f48-common-grid article>span{color:#a96f31;font-size:10px;font-weight:900;letter-spacing:.18em}.lhs-f48-common-grid h3{margin:28px 0 13px;font:400 34px/1 Georgia,serif}.lhs-f48-common-grid p{color:#695e56;line-height:1.68}.lhs-f48-sleep-section{padding:94px 28px;background:#201813;color:#fff}.lhs-f48-sleep-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:start}.lhs-f48-sleep-section h2{margin:14px 0 22px;font-size:clamp(44px,5vw,70px)}.lhs-f48-sleep-section>div>div>p:not(.lhs-kc-kicker){color:rgba(255,255,255,.65);line-height:1.7}.lhs-f48-sleep-section ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}.lhs-f48-sleep-section li{display:grid;grid-template-columns:50px 1fr;gap:18px;padding:22px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.04)}.lhs-f48-sleep-section li>span{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#d9b270;color:#23170f;font-size:10px;font-weight:900}.lhs-f48-sleep-section strong{font:400 24px/1 Georgia,serif}.lhs-f48-sleep-section li p{margin:9px 0 0;color:rgba(255,255,255,.65);font-size:13px;line-height:1.58}.lhs-f48-warning-section{background:#f8f5f0}.lhs-f48-next-section{padding:92px 28px;background:#e9dfd2}.lhs-f48-next-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.lhs-f48-next-grid a{display:flex;min-height:180px;flex-direction:column;padding:25px;border:1px solid rgba(117,78,42,.16);border-radius:18px;background:rgba(255,255,255,.72);color:#211711;text-decoration:none;transition:transform .23s ease,box-shadow .23s ease}.lhs-f48-next-grid a:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(76,48,26,.1)}.lhs-f48-next-grid span{color:#a96f31;font-size:10px;font-weight:900;letter-spacing:.16em}.lhs-f48-next-grid strong{margin-top:auto;font:400 25px/1.05 Georgia,serif}.lhs-f48-next-grid small{margin-top:11px;color:#6e635b;line-height:1.45}.lhs-f48-final-cta{padding:80px 28px;background:linear-gradient(135deg,#ead7b9,#f6eee3)}.lhs-f48-final-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:55px;align-items:center}.lhs-f48-final-cta h2{margin:10px 0 18px;font-size:clamp(44px,5vw,70px)}.lhs-f48-final-cta p:not(.lhs-kc-kicker){max-width:760px;color:#665b52;line-height:1.7}.lhs-f48-final-actions{flex-direction:column;align-items:flex-start;max-width:330px}.lhs-first48-guide-inline{display:block;margin-top:10px;color:#8a5b27;font-size:12px;font-weight:800;line-height:1.5;text-decoration:none}.lhs-first48-guide-inline:hover,.lhs-first48-text-link:hover,.lhs-f48-text-link:hover{text-decoration:underline}.lhs-first48-context-banner{display:flex;justify-content:space-between;align-items:center;gap:28px;margin:36px auto;padding:25px 30px;width:min(100% - 48px,1180px);border:1px solid rgba(117,78,42,.18);border-radius:18px;background:linear-gradient(135deg,#f5eadb,#ead6b8);color:#241a14}.lhs-first48-context-banner div{display:grid;gap:5px}.lhs-first48-context-banner span{color:#a46e30;font-size:9px;font-weight:900;letter-spacing:.18em}.lhs-first48-context-banner strong{font:400 28px/1 Georgia,serif}.lhs-first48-context-banner small{color:#6e6258}.lhs-first48-context-banner a{color:#6f4924;font-size:10px;font-weight:900;letter-spacing:.1em;text-decoration:none;white-space:nowrap}html[dir="rtl"] .lhs-f48-mode-switch button,html[dir="rtl"] .lhs-f48-base-list button,html[dir="rtl"] .lhs-f48-phase-tabs button{text-align:right}html[dir="rtl"] .lhs-f48-mode-switch button+button{border-left:0;border-right:1px solid rgba(229,191,128,.2)}html[dir="rtl"] .lhs-f48-alert{border-left:0;border-right:3px solid #bd833e}html[dir="rtl"] .lhs-f48-phase-tabs button:not(:last-child):after{left:auto;right:49px}
@media(max-width:1120px){.lhs-f48-hero-grid{grid-template-columns:1fr .72fr;gap:35px}.lhs-f48-planner-grid{grid-template-columns:220px 1fr}.lhs-f48-result{grid-column:1/-1}.lhs-f48-principle-grid,.lhs-f48-warning-grid,.lhs-f48-next-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.lhs-f48-main .lhs-kc-shell{width:min(100% - 36px,1220px)}.lhs-f48-hero{padding:34px 18px 58px}.lhs-f48-hero-grid{grid-template-columns:1fr;min-height:0}.lhs-f48-hero h1{font-size:54px}.lhs-f48-clock{min-height:390px}.lhs-f48-clock:before{width:340px;height:340px}.lhs-f48-ring-outer{width:290px;height:290px}.lhs-f48-ring-middle{width:225px;height:225px}.lhs-f48-ring-inner{width:125px;height:125px}.lhs-f48-principles,.lhs-f48-section,.lhs-f48-warning-section,.lhs-f48-planner,.lhs-f48-sleep-section,.lhs-f48-next-section,.lhs-f48-final-cta{padding:64px 18px}.lhs-f48-principle-grid,.lhs-f48-warning-grid,.lhs-f48-common-grid,.lhs-f48-next-grid{grid-template-columns:1fr}.lhs-f48-mode-switch{grid-template-columns:1fr}.lhs-f48-mode-switch button+button{border-left:0;border-top:1px solid rgba(229,191,128,.2)}html[dir="rtl"] .lhs-f48-mode-switch button+button{border-right:0;border-top:1px solid rgba(229,191,128,.2)}.lhs-f48-planner-grid{grid-template-columns:1fr}.lhs-f48-base-list{grid-template-columns:1fr 1fr}.lhs-f48-phase-tabs{grid-template-columns:1fr 1fr;gap:8px}.lhs-f48-phase-tabs button{grid-template-columns:52px 1fr;min-height:80px;padding:10px}.lhs-f48-phase-tabs button:not(:last-child):after{display:none}.lhs-f48-phase-tabs span{width:45px;height:45px}.lhs-f48-result{padding:30px 22px}.lhs-f48-sleep-grid{grid-template-columns:1fr;gap:35px}.lhs-f48-final-inner{grid-template-columns:1fr}.lhs-f48-final-actions{max-width:none}.lhs-first48-context-banner{align-items:flex-start;flex-direction:column}.lhs-f48-actions{flex-direction:column;align-items:stretch}.lhs-f48-button{width:100%}}
@media(max-width:480px){.lhs-f48-base-list,.lhs-f48-phase-tabs{grid-template-columns:1fr}.lhs-f48-clock{transform:scale(.88);margin-inline:-25px}.lhs-f48-heading h2{font-size:39px}.lhs-f48-result h3{font-size:40px}.lhs-f48-common-grid article{padding:27px}.lhs-f48-sleep-section li{grid-template-columns:43px 1fr;gap:13px;padding:18px}}
@media(prefers-reduced-motion:reduce){.lhs-f48-button,.lhs-f48-base-list button,.lhs-f48-next-grid a{transition:none!important}.lhs-f48-clock-hand{display:none}}
/* =========================================================
FINAL WEBSITE AUDIT - route consolidation and mobile hardening
July 18, 2026
========================================================= */
html{overflow-x:hidden;}
@supports (overflow:clip){html{overflow-x:clip;}}
body,main{min-width:0;max-width:100%;}
.brand-strip,.main-header,.mobile-nav,main,footer{max-width:100%;}
.lhs-kc-table-wrap,.guide-table-wrap,.comparison-table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.lhs-kc-table-wrap table,.guide-table-wrap table,.comparison-table-wrap table{max-width:none;}
@media(max-width:760px){
.brand-strip{overflow:hidden;}
.main-header,.main-header.mega-header{width:100%;max-width:100%;}
.logo,.logo img,.lhs-header-image-logo,.lhs-header-image-logo img{max-width:100%;}
.system-bottom-cta,.partner-bottom-cta{overflow:hidden;}
.lhs-adhesive-guide-banner,
.lhs-maintenance-guide-banner,
.lhs-first48-guide-inline,
.lhs-first48-context-banner a{
width:100%;
max-width:100%;
white-space:normal!important;
overflow-wrap:anywhere;
}
.lhs-first48-context-banner{width:calc(100% - 36px);padding:22px;}
.lhs-support-strip .contact-strip-card>*{min-width:0;max-width:100%;}
.lhs-support-strip .contact-strip-card a,
.lhs-support-strip .contact-strip-card p{overflow-wrap:anywhere;}
.custom-question-head,.lhs-checkout-actions{min-width:0;}
}
@media(max-width:480px){
.actions,.lhs-checkout-actions{grid-template-columns:1fr!important;}
.custom-question-head{grid-template-columns:1fr!important;gap:10px;}
.lhs-payment-option{grid-template-columns:auto minmax(0,1fr)!important;}
.lhs-payment-option>*:last-child{grid-column:1/-1;}
.lhs-f48-clock{margin-inline:0!important;transform:scale(.82)!important;}
.lhs-arg-layer{width:calc(100% - 28px);}
.order-guide-btn{min-width:0;width:100%;}
}
/* =========================================================
VISUAL EFFECTS RESTORATION + FAIL-SAFE VISIBILITY
July 18, 2026
Restores the intended live-copy motion after the final audit
without undoing the mobile overflow and route fixes.
========================================================= */
.lhs-home-hero .lhs-home-hero-copy,
.lhs-home-hero .typewriter-title,
.lhs-home-hero .typewriter-title span{
visibility:visible !important;
}
/* Never leave live slider copy permanently hidden if a browser delays JS. */
.lhs-home-hero .hero-slide.active .typewriter-script{
animation:lhsEffectsCopyIn .55s cubic-bezier(.22,.72,.22,1) .08s both !important;
}
.lhs-home-hero .hero-slide.active .typewriter-body{
animation:lhsEffectsCopyIn .65s cubic-bezier(.22,.72,.22,1) .72s both !important;
}
.lhs-home-hero .hero-slide.active .typewriter-cta{
animation:lhsEffectsCopyIn .65s cubic-bezier(.22,.72,.22,1) .94s both !important;
}
.lhs-home-hero .hero-slide.active .typewriter-title{
animation:lhsEffectsTitleIn .48s cubic-bezier(.22,.72,.22,1) .18s both !important;
}
.lhs-home-hero .hero-slide.active .model-area img{
animation:lhsHomeHeroImageIn 1.25s cubic-bezier(.2,.7,.2,1) both !important;
}
@keyframes lhsEffectsCopyIn{
from{opacity:0;transform:translateY(13px);}
to{opacity:1;transform:translateY(0);}
}
@keyframes lhsEffectsTitleIn{
from{opacity:0;transform:translateY(9px);}
to{opacity:1;transform:translateY(0);}
}
/* Re-enable refined hover motion without producing horizontal overflow. */
@media (hover:hover) and (pointer:fine){
.collection-tile,
.insight-card,
.contact-strip-card,
.lhs-journal-card,
.system-card,
.product-card{
transition:transform .34s cubic-bezier(.22,.72,.22,1), box-shadow .34s ease, border-color .34s ease !important;
}
.collection-tile:hover,
.insight-card:hover,
.contact-strip-card:hover,
.lhs-journal-card:hover,
.system-card:hover,
.product-card:hover{
transform:translateY(-5px);
}
}
/* Accessibility fallback: reduced motion means visible static content, not missing content. */
@media (prefers-reduced-motion:reduce){
.lhs-home-hero .hero-slide.active .typewriter-script,
.lhs-home-hero .hero-slide.active .typewriter-title,
.lhs-home-hero .hero-slide.active .typewriter-body,
.lhs-home-hero .hero-slide.active .typewriter-cta,
.lhs-home-hero .hero-slide.active .model-area img{
animation:none !important;
opacity:1 !important;
transform:none !important;
}
.lhs-home-hero .typewriter-title span{
border-right:0 !important;
}
}
/* =========================================================
COLLECTION CTA REVEAL STABILITY FIX
July 18, 2026
Prevents the Men collection CTA from appearing vertically
cropped while preserving the staggered luxury reveal.
========================================================= */
.lhs-premium-collections .collection-tile.is-motion-ready .collection-cta{
clip-path:none !important;
min-height:46px !important;
height:46px !important;
overflow:visible !important;
opacity:0 !important;
transform:translateY(14px) scale(.985) !important;
filter:blur(4px) !important;
}
.lhs-premium-collections .collection-tile.is-content-revealed .collection-cta{
clip-path:none !important;
min-height:46px !important;
height:46px !important;
overflow:visible !important;
opacity:1 !important;
transform:translateY(0) scale(1) !important;
filter:blur(0) !important;
}
.lhs-premium-collections .collection-cta,
.lhs-premium-collections .collection-cta-arrow{
flex-shrink:0;
}
@media(max-width:760px){
.lhs-premium-collections .collection-cta,
.lhs-premium-collections .collection-tile.is-motion-ready .collection-cta,
.lhs-premium-collections .collection-tile.is-content-revealed .collection-cta{
min-height:44px !important;
height:44px !important;
}
}
/* Home collection cards: keep the editorial copy and CTA fully visible at medium desktop widths. */
@media(min-width:761px) and (max-width:1920px){
.lhs-premium-collections .collection-tile{
aspect-ratio:auto !important;
min-height:clamp(260px,24vw,320px) !important;
}
.lhs-premium-collections .collection-overlay{
padding-block:clamp(24px,2.5vw,40px);
}
}
@media(min-width:761px) and (max-width:1200px){
.lhs-premium-collections .collection-overlay{
width:56%;
padding-inline:clamp(22px,2.5vw,30px);
}
.lhs-premium-collections .collection-kicker{
margin-bottom:10px;
}
.lhs-premium-collections .collection-overlay h2{
max-width:320px;
margin-bottom:24px !important;
font-size:clamp(25px,2.8vw,32px) !important;
line-height:1.08 !important;
letter-spacing:-.035em !important;
text-wrap:balance;
}
}
/* =========================================================
Shopping bag checkout simplification — July 19, 2026
One primary checkout action; payment choices stay in checkout.html.
========================================================= */
.lhs-store-cart-checkout{
width:100%;
min-height:58px;
display:flex;
align-items:center;
justify-content:center;
margin-top:14px;
padding:15px 22px;
border:1px solid #1a1511;
border-radius:999px;
background:linear-gradient(135deg,#171310 0%,#2b221b 100%);
box-shadow:0 14px 28px rgba(19,14,10,.16);
color:#f4e2bf !important;
font-size:11px;
font-weight:800;
letter-spacing:.17em;
text-align:center;
text-decoration:none !important;
transition:transform .22s ease,box-shadow .22s ease,background .22s ease;
}
.lhs-store-cart-checkout::after{
content:"→";
margin-inline-start:14px;
font-size:17px;
font-weight:400;
line-height:1;
transition:transform .22s ease;
}
html[dir="rtl"] .lhs-store-cart-checkout::after{
content:"←";
}
.lhs-store-cart-checkout:hover,
.lhs-store-cart-checkout:focus-visible{
transform:translateY(-2px);
box-shadow:0 18px 32px rgba(19,14,10,.22);
outline:none;
}
.lhs-store-cart-checkout:hover::after,
.lhs-store-cart-checkout:focus-visible::after{
transform:translateX(3px);
}
html[dir="rtl"] .lhs-store-cart-checkout:hover::after,
html[dir="rtl"] .lhs-store-cart-checkout:focus-visible::after{
transform:translateX(-3px);
}
.lhs-store-cart-checkout-note{
position:relative;
margin:11px 5px 0;
padding-inline-start:17px;
color:rgba(17,17,17,.58);
font-size:10px;
line-height:1.55;
text-align:start;
}
.lhs-store-cart-checkout-note::before{
content:"";
position:absolute;
inset-inline-start:1px;
top:.58em;
width:6px;
height:6px;
border-radius:50%;
background:#b48545;
box-shadow:0 0 0 4px rgba(180,133,69,.10);
}
.lhs-store-cart-continue{
margin-top:14px;
border-radius:999px;
}
.lhs-store-cart-drawer.is-empty-cart .lhs-store-cart-checkout,
.lhs-store-cart-drawer.is-empty-cart .lhs-store-cart-checkout-note,
.lhs-store-cart-drawer.is-empty-cart .lhs-store-cart-support{
display:none !important;
}
@media(max-width:760px){
.lhs-store-cart-checkout{
min-height:56px;
padding:14px 18px;
font-size:10.5px;
letter-spacing:.14em;
}
.lhs-store-cart-checkout-note{
margin-top:10px;
font-size:9.5px;
}
}