/** Shopify CDN: Minification failed

Line 9:15 Expected identifier but found whitespace
Line 10:2 Unexpected "0"

**/

 
  --lsf-shadow:
  0 15px 45px rgba(0,0,0,.08);
 
  --lsf-transition:.35s ease;
 
}
 
*,
*::before,
*::after{
 
margin:0;
padding:0;
box-sizing:border-box;
 
}
 
html{
 
scroll-behavior:smooth;
 
}
 
body{
 
overflow-x:hidden;
 
}
 
img{
 
display:block;
max-width:100%;
 
}
 
button{
 
border:none;
outline:none;
cursor:pointer;
background:none;
font-family:inherit;
 
}
 
input{
 
outline:none;
font-family:inherit;
 
}
 
.luxury-size-finder{
 
width:100%;
padding:24px 16px;
background:var(--lsf-bg);
 
}
 
.lsf-wrapper{
 
max-width:460px;
margin:auto;
 
}
 
.lsf-pages{
 
position:relative;
 
}
 
.lsf-screen{
 
display:none;
animation:fadeUp .45s ease;
 
}
 
.lsf-screen.active{
 
display:block;
 
}
 
.lsf-card{
 
background:#fffdf5;
 
border-radius:28px;
 
box-shadow:var(--lsf-shadow);
 
padding:22px;
 
overflow:hidden;
 
position:relative;
 
}
 
@keyframes fadeUp{
 
0%{
 
opacity:0;
 
transform:translateY(30px);
 
}
 
100%{
 
opacity:1;
 
transform:translateY(0);
 
}
 
}
 
/*==========================
HEADER
==========================*/
 
.lsf-header{
 
display:flex;
 
align-items:center;
 
justify-content:space-between;
 
margin-bottom:10px;
 
}
 
.lsf-header span{
 
font-size:14px;
 
color:#666;
 
font-weight:600;
 
}
 
.back-step{
 
width:42px;
 
height:42px;
 
border-radius:50%;
 
background:#f5f5f5;
 
font-size:20px;
 
transition:.3s;
 
}
 
.back-step:hover{
 
background:#ececec;
 
}
 
/*==========================
BUTTON
==========================*/
 
.lsf-btn{
 
width:100%;
 
height:56px;
 
margin-top:24px;
 
border-radius:16px;
 
background:
#e6b916ff
;
 
color:#111;
 
font-size:16px;
 
font-weight:700;
 
transition:var(--lsf-transition);
 
box-shadow:
0 10px 30px rgba(212,175,55,.30);
 
}
 
.lsf-btn:hover{
 
transform:translateY(-2px);
 
box-shadow:
0 18px 40px rgba(212,175,55,.35);
 
}
 
.lsf-btn:active{
 
transform:scale(.98);
 
}
 
/*==========================
TEXT
==========================*/
 
.lsf-card h2{
 
font-size:32px;
 
line-height:1.2;
 
font-weight:800;
 
color:#111;
 
margin-bottom:12px;
 
}
 
.lsf-card h3{
 
font-size:28px;
 
line-height:1.2;
 
font-weight:700;
 
margin-bottom:12px;
 
color:#111;
 
}
 
.lsf-card p{
 
font-size:15px;
 
line-height:1.6;
 
color:#666;
 
}
 
.lsf-sub{
 
margin-bottom:18px;
 
}
 
/*==========================
LOGO
==========================*/
 
.lsf-logo{
 
display:flex;
 
justify-content:center;
 
margin-bottom:24px;
 
}
 
.lsf-logo img{
 
height:52px;
 
width:auto;
 
}
 
/*==========================
WELCOME IMAGE
==========================*/
 
.lsf-welcome-image{
 
margin:30px auto;
 
border-radius:24px;
 
overflow:hidden;
 
}
 
.lsf-welcome-image img{
 
width:100%;
 
display:block;
 
object-fit:cover;
 
}
 
/*==========================
BENEFITS
==========================*/
 
.lsf-benefits{
 
display:grid;
 
gap:14px;
 
margin-top:24px;
 
}
 
.lsf-benefits div{
 
display:flex;
 
align-items:center;
 
gap:12px;
 
padding:14px 16px;
 
background:#fafafa;
 
border-radius:16px;
 
border:1px solid var(--lsf-border);
 
font-size:15px;
 
font-weight:600;
 
transition:.3s;
 
}
 
.lsf-benefits div:hover{
 
transform:translateY(-2px);
 
box-shadow:
0 10px 25px rgba(0,0,0,.05);
 
}
 
 
/*==================================================
TOP PROGRESS BAR
PART 1A-2
==================================================*/
 
.lsf-progress{
 
position:relative;
 
display:flex;
 
justify-content:space-between;
 
align-items:flex-start;
 
margin-bottom:15px;
 
padding:0 4px;
 
}
 
.lsf-progress-line{
 
position:absolute;
 
top:18px;
 
left:10%;
 
width:80%;
 
height:4px;
 
background:#e5e5e5;
 
border-radius:20px;
 
z-index:0;
 
overflow:hidden;
 
}
 
.lsf-progress-line::after{
 
content:"";
 
position:absolute;
 
left:0;
 
top:0;
 
height:100%;
 
width:0;
 
background:linear-gradient(
90deg,
var(--lsf-primary),
#f6dc82
);
 
transition:.45s ease;
 
border-radius:20px;
 
}
 
/* Progress Width */
 
.lsf-progress.step-1 .lsf-progress-line::after{
 
width:0%;
 
}
 
.lsf-progress.step-2 .lsf-progress-line::after{
 
width:25%;
 
}
 
.lsf-progress.step-3 .lsf-progress-line::after{
 
width:50%;
 
}
 
.lsf-progress.step-4 .lsf-progress-line::after{
 
width:75%;
 
}
 
.lsf-progress.step-5 .lsf-progress-line::after{
 
width:100%;
 
}
 
/*========================*/
 
.lsf-step{
 
position:relative;
 
z-index:2;
 
display:flex;
 
flex-direction:column;
 
align-items:center;
 
width:62px;
 
}
 
.lsf-step span{
 
width:38px;
 
height:38px;
 
border-radius:50%;
 
background:#ffffff;
 
border:2px solid #dddddd;
 
display:flex;
 
align-items:center;
 
justify-content:center;
 
font-size:15px;
 
font-weight:700;
 
color:#999;
 
transition:.35s;
 
}
 
.lsf-step p{
 
margin-top:8px;
 
font-size:11px;
 
line-height:1.3;
 
font-weight:600;
 
text-align:center;
 
color:#999;
 
}
 
/*==========================
ACTIVE STEP
==========================*/
 
.lsf-step.active span{
    background:#e9d520ff !important;
    border:2px solid #e9d520ff !important;
    color:#fff !important;
}
 
.lsf-step.active p{
 
color:#111;
 
}
 
/*==========================
COMPLETED STEP
==========================*/
 
.lsf-step.completed span{
 
background:#111;
 
border-color:#111;
 
color:#fff;
 
}
 
.lsf-step.completed span::before{
 
content:"✓";
 
font-size:16px;
 
}
 
.lsf-step.completed p{
 
color:#111;
 
font-weight:700;
 
}
 
/* Hide number when complete */
 
.lsf-step.completed span{
 
font-size:0;
 
}
 
/*==========================
HOVER
==========================*/
 
.lsf-step:hover span{
 
transform:translateY(-2px);
 
}
 
/*==========================
MOBILE
==========================*/
 
@media(max-width:480px){
 
.lsf-progress{
 
margin-bottom:28px;
 
}
 
.lsf-step{
 
width:58px;
 
}
 
.lsf-step span{
 
width:34px;
 
height:34px;
 
font-size:13px;
 
}
 
.lsf-step p{
 
font-size:10px;
 
}
 
.lsf-progress-line{
 
top:16px;
 
}
 
}
 
/*==========================
TABLET
==========================*/
 
@media(min-width:768px){
 
.lsf-wrapper{
 
max-width:700px;
 
}
 
.lsf-progress{
 
padding:0 30px;
 
}
 
.lsf-step{
 
width:90px;
 
}
 
.lsf-step p{
 
font-size:13px;
 
}
 
}
 
/*==================================================
WELCOME SCREEN
PART 1B-1
==================================================*/
.welcome-card{
 
position:relative;
 
min-height:420px;
 
background-size:cover;
 
background-position:center;
 
background-repeat:no-repeat;
 
display:flex;
 
flex-direction:column;
 
justify-content:flex-end;
 
padding:32px;
 
overflow:hidden;
 
}
 
.welcome-card::before{
 
content:"";
 
position:absolute;
 
inset:0;
 
background:linear-gradient(
90deg,
rgba(0,0,0,.75) 0%,
rgba(0,0,0,.45) 45%,
rgba(0,0,0,.15) 100%
);
 
z-index:1;
 
}
 
.welcome-card>*{
 
position:relative;
 
z-index:2;
 
}
 
.welcome-card h2{
 
margin-top:10px;
 
margin-bottom:18px;
 
font-size:54px;
 
font-weight:800;
 
line-height:1.05;
 
color:#fff;
 
max-width:420px;
 
}
 
.welcome-card p{
 
max-width:360px;
 
margin:0;
 
color:rgba(255,255,255,.92);
 
font-size:18px;
 
line-height:1.7;
 
}
.welcome-card h2,
.welcome-card h3,
.welcome-card p{
 
color:#fff;
 
}
 
.lsf-benefits div{
 
background:rgba(255,255,255,.12);
 
backdrop-filter:blur(12px);
 
border:1px solid rgba(255,255,255,.18);
 
color:#fff;
 
}
/*=========================
WELCOME IMAGE
=========================*/
 
.lsf-welcome-image{
 
margin-top:28px;
 
margin-bottom:30px;
 
border-radius:28px;
 
overflow:hidden;
 
background:#f6f6f6;
 
}
 
.lsf-welcome-image img{
 
width:100%;
 
display:block;
 
transition:.45s;
 
}
 
.lsf-welcome-image:hover img{
 
transform:scale(1.04);
 
}
 
/*=========================
PRODUCT GRID
=========================*/
 
.lsf-product-grid{
 
display:grid;
 
grid-template-columns:repeat(2,1fr);
 
gap:16px;
 
margin-top:24px;
 
}
 
.lsf-product{
 
background:#fff;
 
border:2px solid #ececec;
 
border-radius:20px;
 
padding:18px 14px;
 
cursor:pointer;
 
transition:.35s;
 
display:flex;
 
flex-direction:column;
 
align-items:center;
 
justify-content:center;
 
min-height:165px;
 
}
 
.lsf-product img{
 
width:74px;
 
height:74px;
 
object-fit:contain;
 
margin-bottom:14px;
 
transition:.35s;
 
}
 
.lsf-product span{
 
font-size:15px;
 
font-weight:700;
 
color:#111;
 
text-align:center;
 
}
 
.lsf-product:hover{
 
transform:translateY(-4px);
 
box-shadow:
 
0 18px 35px rgba(0,0,0,.08);
 
border-color:var(--lsf-primary);
 
}
 
.lsf-product:hover img{
 
transform:scale(1.08);
 
}
 
.lsf-product.active{
 
background:#fffdf5;
 
border-color:var(--lsf-primary);
 
box-shadow:
 
0 14px 35px rgba(212,175,55,.22);
 
}
 
.lsf-product.active img{
 
transform:scale(1.06);
 
}
 
/*=========================
FORM FIELD
=========================*/
 
.lsf-field{
 
margin-top:22px;
 
}
 
.lsf-field label{
 
display:block;
 
margin-bottom:10px;
 
font-size:15px;
 
font-weight:700;
 
color:#111;
 
}
 
.lsf-field input{
 
width:100%;
 
height:56px;
 
border:2px solid #e8e8e8;
 
border-radius:16px;
 
padding:0 18px;
 
font-size:16px;
 
background:#fff;
 
transition:.3s;
 
}
 
.lsf-field input:focus{
 
border-color:var(--lsf-primary);
 
box-shadow:
 
0 0 0 4px rgba(212,175,55,.12);
 
}
 
/*=========================
AGE BUTTONS
=========================*/
 
.lsf-age{
 
display:flex;
 
gap:12px;
 
margin-top:8px;
 
flex-wrap:wrap;
 
}
 
.lsf-age button{
 
flex:1;
 
min-width:90px;
 
height:50px;
 
border-radius:14px;
 
background:#fff;
 
border:2px solid #ececec;
 
font-size:14px;
 
font-weight:700;
 
transition:.3s;
 
}
 
.lsf-age button:hover{
 
border-color:var(--lsf-primary);
 
}
 
.lsf-age button.active{
 
background:var(--lsf-primary);
 
color:#fff;
 
border-color:var(--lsf-primary);
 
}
 
/*=========================
INPUT PLACEHOLDER
=========================*/
 
.lsf-field input::placeholder{
 
color:#b1b1b1;
 
}
 
/*==================================================
MEASUREMENTS + LOADING
PART 1B-2
==================================================*/
 
.lsf-measurements{
 
display:flex;
 
flex-direction:column;
 
gap:24px;
 
margin-top:24px;
 
}
 
.lsf-measure-card{
 
background:#fff;
 
border:2px solid #ececec;
 
border-radius:24px;
 
padding:20px;
 
transition:.35s;
 
}
 
.lsf-measure-card:hover{
 
border-color:var(--lsf-primary);
 
box-shadow:
0 15px 35px rgba(0,0,0,.06);
 
}
 
.lsf-measure-image{
 
width:100%;
 
height:180px;
 
border-radius:18px;
 
overflow:hidden;
 
background:#fafafa;
 
margin-bottom:18px;
 
display:flex;
 
align-items:center;
 
justify-content:center;
 
}
 
.lsf-measure-image img{
 
width:100%;
 
height:100%;
 
object-fit:contain;
 
transition:.4s;
 
}
 
.lsf-measure-card:hover img{
 
transform:scale(1.04);
 
}
 
.lsf-measure-card label{
 
display:block;
 
font-size:15px;
 
font-weight:700;
 
margin-bottom:10px;
 
color:#111;
 
}
 
.lsf-measure-card input{
 
width:100%;
 
height:58px;
 
padding:0 18px;
 
border-radius:16px;
 
border:2px solid #e6e6e6;
 
font-size:17px;
 
font-weight:600;
 
transition:.3s;
 
background:#fff;
 
}
 
.lsf-measure-card input:focus{
 
border-color:var(--lsf-primary);
 
box-shadow:
0 0 0 4px rgba(212,175,55,.12);
 
}
 
/*=============================
FIND BY MEASUREMENT / FIND BY WEIGHT
SECTION SPLIT
=============================*/
 
.lsf-section-heading{
 
margin-top:22px;
 
margin-bottom:4px;
 
text-align:center;
 
}
 
.lsf-section-heading:first-of-type{
 
margin-top:18px;
 
}
 
.lsf-section-heading h4{
 
font-size:15px;
 
font-weight:800;
 
color:#111;
 
margin-bottom:6px;
 
}
 
.lsf-section-sub{
 
font-size:13px;
 
color:#777;
 
line-height:1.5;
 
max-width:340px;
 
margin:0 auto;
 
}
 
.lsf-or-divider{
 
display:flex;
 
align-items:center;
 
gap:14px;
 
margin:28px 0 8px;
 
}
 
.lsf-or-divider::before,
.lsf-or-divider::after{
 
content:"";
 
flex:1;
 
height:1px;
 
background:#e5e5e5;
 
}
 
.lsf-or-divider span{
 
font-size:12px;
 
font-weight:800;
 
letter-spacing:.5px;
 
color:var(--lsf-primary-dark);
 
background:#fff8df;
 
padding:6px 16px;
 
border-radius:999px;
 
border:1px solid rgba(212,175,55,.25);
 
}
 
.lsf-weight-section{
 
max-width:100%;
 
}
 
.lsf-weight-section .lsf-measure-card{
 
max-width:340px;
 
margin:0 auto;
 
}
 

/*==========================
MODE SELECTOR
==========================*/

.lsf-mode-selector{

display:grid;

grid-template-columns:1fr 1fr;

gap:10px;

margin:15px 0;

}

.lsf-mode-card{

position:relative;

background:#fff;

border:1.5px solid #ece6d8;

border-radius:22px;

 padding: 8px 4px;

text-align:center;

transition:.35s;

cursor:pointer;

min-height:180px;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

}

.lsf-mode-card:hover{

transform:translateY(-4px);

box-shadow:0 15px 35px rgba(0,0,0,.08);

}

.lsf-mode-icon{

width:90px;

height:90px;

border-radius:16px;

background:#fff8e5;

display:flex;

align-items:center;

justify-content:center;

font-size:26px;


color:#d4af37;

}
.lsf-mode-icon img,
.lsf-mode-icon svg{
    display:block;
    margin-bottom:-50px;
}
.lsf-mode-card h5{

font-size:18px;

font-weight:700;

margin-bottom:0px;

color:#111;

}

.lsf-mode-card p{

font-size:15px;
 margin-bottom:-12px;
color:#777;

}

.lsf-check{

position:absolute;

top:12px;

right:12px;

width:24px;

height:24px;

border-radius:50%;

background:#d4af37;

color:#fff;

font-size:13px;

display:none;

align-items:center;

justify-content:center;

}

.lsf-mode-card.active{

border:2px solid #d4af37;

background:#fffdf7;

box-shadow:0 12px 30px rgba(212,175,55,.18);

}

.lsf-mode-card.active .lsf-check{

display:flex;

}




/*=============================
LOADING SCREEN
=============================*/
 
.lsf-loading{
 
padding:80px 30px;
 
text-align:center;
 
background:#fff;
 
border-radius:28px;
 
box-shadow:var(--lsf-shadow);
 
}
 
.lsf-spinner{
 
width:80px;
 
height:80px;
 
margin:0 auto 28px;
 
border-radius:50%;
 
border:7px solid #efefefff;
 
border-top-color:var(--lsf-primary);
 
animation:lsfSpin 1s linear infinite;
 
}
 
@keyframes lsfSpin{
 
100%{
 
transform:rotate(360deg);
 
}
 
}
 
.lsf-loading h3{
 
font-size:28px;
 
font-weight:800;
 
margin-bottom:14px;
 
color:#111;
 
}
 
.lsf-loading p{
 
font-size:15px;
 
color:#666;
 
line-height:1.6;
 
}
 
.lsf-loading::after{
 
content:"";
 
display:block;
 
width:100%;
 
height:8px;
 
margin-top:34px;
 
background:#efefef;
 
border-radius:50px;
 
overflow:hidden;
 
position:relative;
 
}
 
.lsf-loading::before{
 
content:"";
 
position:absolute;
 
left:-40%;
 
bottom:30px;
 
width:40%;
 
height:8px;
 
background:linear-gradient(
90deg,
var(--lsf-primary),
#ffe287
);
 
border-radius:50px;
 
animation:loadingBar 2s infinite;
 
}
 
@keyframes loadingBar{
 
0%{
 
left:-40%;
 
}
 
100%{
 
left:100%;
 
}
 
}
 
/*=============================
MOBILE
=============================*/
 
@media(max-width:480px){
 
.lsf-measure-image{
 
height:160px;
 
}
 
.lsf-loading{
 
padding:60px 22px;
 
}
 
.lsf-spinner{
 
width:68px;
 
height:68px;
 
}
 
}
 
/*==================================================
RESULT SCREEN
PART 2A
==================================================*/
 
.result-card{
 
text-align:center;
 
padding:32px 24px 28px;
 
}
 
.lsf-result-badge{
 
display:inline-flex;
 
align-items:center;
 
justify-content:center;
 
padding:10px 18px;
 
border-radius:999px;
 
background:linear-gradient(90deg,#d4af37,#f6dc82);
 
color:#111;
 
font-size:14px;
 
font-weight:700;
 
margin-bottom:22px;
 
box-shadow:0 10px 24px rgba(212,175,55,.25);
 
}
 
.result-card h2{
 
font-size:32px;
 
font-weight:800;
 
margin-bottom:26px;
 
color:#111;
 
}
 
.lsf-size-result{
 
width:170px;
 
height:170px;
 
margin:0 auto 28px;
 
border-radius:50%;
 
background:linear-gradient(135deg,#111,#2b2b2b);
 
display:flex;
 
align-items:center;
 
justify-content:center;
 
position:relative;
 
}
 
.lsf-size-result::before{
 
content:"";
 
position:absolute;
 
inset:8px;
 
border:3px solid rgba(212,175,55,.35);
 
border-radius:50%;
 
}
 
#recommended-size{
 
font-size:72px;
 
font-weight:900;
 
color:#fff;
 
letter-spacing:2px;
 
}
 
.lsf-result-table{
 
margin-top:18px;
 
display:flex;
 
flex-direction:column;
 
gap:14px;
 
}
 
.lsf-result-table>div{
 
display:flex;
 
justify-content:space-between;
 
align-items:center;
 
padding:16px 18px;
 
background:#fafafa;
 
border:1px solid #ececec;
 
border-radius:16px;
 
}
 
.lsf-result-table label{
 
font-size:15px;
 
font-weight:600;
 
color:#555;
 
}
 
.lsf-result-table strong{
 
font-size:18px;
 
font-weight:800;
 
color:#111;
 
}
 
.lsf-view-details{
 
width:100%;
 
height:54px;
 
margin-top:22px;
 
border-radius:16px;
 
border:2px solid var(--lsf-primary);
 
background:#e9d520ff ;
 
color:#111;
 
font-size:16px;
 
font-weight:700;
 
transition:.3s;
 
}
 
.lsf-view-details:hover{
 
background:#fff8df;
 
}
 
.add-size-product{
 
margin-top:16px;
 
}
 
.restart-finder{
 
margin-top:14px;
 
background:#111;
 
color:#fff;
 
box-shadow:none;
 
}
 
.restart-finder:hover{
 
background:#222;
 
transform:translateY(-2px);
 
}
 
@media(max-width:480px){
 
.lsf-size-result{
 
width:145px;
 
height:145px;
 
}
 
#recommended-size{
 
font-size:58px;
 
}
 
.result-card h2{
 
font-size:28px;
 
}
 
}
 
 
/*==================================================
DRAWER + RESPONSIVE
PART 2B
==================================================*/
 
.lsf-drawer{
 
position:fixed;
 
left:0;
 
right:0;
 
bottom:0;
 
width:100%;
 
height:100%;
 
z-index:9999;
 
display:none;
 
}
 
.lsf-drawer.active{
 
display:block;
 
}
 
.lsf-drawer-overlay{
 
position:absolute;
 
inset:0;
 
background:rgba(0,0,0,.45);
 
backdrop-filter:blur(4px);
 
animation:fadeOverlay .3s ease;
 
}
 
@keyframes fadeOverlay{
 
from{
 
opacity:0;
 
}
 
to{
 
opacity:1;
 
}
 
}
 
.lsf-drawer-content{
 
position:absolute;
 
left:0;
 
right:0;
 
bottom:0;
 
background:#fff;
 
border-radius:30px 30px 0 0;
 
padding:26px;
 
max-height:80vh;
 
overflow:auto;
 
animation:drawerUp .35s ease;
 
}
 
@keyframes drawerUp{
 
from{
 
transform:translateY(100%);
 
}
 
to{
 
transform:translateY(0);
 
}
 
}
 
.drawer-header{
 
display:flex;
 
justify-content:space-between;
 
align-items:center;
 
margin-bottom:22px;
 
}
 
.drawer-header h3{
 
font-size:24px;
 
font-weight:800;
 
color:#111;
 
}
 
.drawer-close{
 
width:42px;
 
height:42px;
 
border-radius:50%;
 
background:#f5f5f5;
 
font-size:20px;
 
transition:.3s;
 
}
 
.drawer-close:hover{
 
background:#ececec;
 
}
 
.drawer-body{
 
display:flex;
 
flex-direction:column;
 
gap:16px;
 
}
 
.drawer-row{
 
display:flex;
 
justify-content:space-between;
 
align-items:center;
 
padding:16px 18px;
 
background:#fafafa;
 
border-radius:16px;
 
border:1px solid #ececec;
 
}
 
.drawer-row span{
 
font-size:15px;
 
font-weight:600;
 
color:#666;
 
}
 
.drawer-row strong{
 
font-size:18px;
 
font-weight:800;
 
color:#111;
 
}
 
.drawer-body hr{
 
border:none;
 
height:1px;
 
background:#ececec;
 
margin:8px 0;
 
}
 
.drawer-body p{
 
font-size:15px;
 
line-height:1.7;
 
color:#555;
 
}
 
.drawer-body strong{
 
color:#111;
 
}
 
@media(min-width:768px){
 
.lsf-wrapper{
 
max-width:760px;
 
}
 
.lsf-card{
 
padding:34px;
 
}
 
.lsf-product-grid{
 
grid-template-columns:repeat(3,1fr);
 
}
 
.lsf-measurements{
 
display:grid;
 
/* auto-fit taaki 2, 3 ya 4 measurement cards (neck/chest/length/weight)
   sabhi products ke liye neatly wrap ho jayein */
grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
 
gap:20px;
 
}
 
.lsf-measure-image{
 
height:170px;
 
}
 
.lsf-progress{
 
max-width:700px;
 
margin:0 auto 40px;
 
}
 
}
 
@media(min-width:1200px){
 
.lsf-wrapper{
 
max-width:900px;
 
}
 
.result-card{
 
max-width:700px;
 
margin:auto;
 
}
 
.lsf-drawer-content{
 
max-width:650px;
 
left:50%;
 
transform:translateX(-50%);
 
border-radius:30px;
 
bottom:25px;
 
}
 
}
 
/* Hide Number Arrows */
 
input[type="number"]::-webkit-outer-spin-button,
 
input[type="number"]::-webkit-inner-spin-button{
 
-webkit-appearance:none;
 
margin:0;
 
}
 
input[type="number"]{
 
appearance:textfield;
 
-moz-appearance:textfield;
 
}
 
/* Utility */
 
.hidden{
 
display:none !important;
 
}
 
.fade{
 
animation:fadeUp .4s ease;
 
}
 
 
 
.lsf-btn:disabled{
  opacity:.5;
  cursor:not-allowed;
  pointer-events:none;
}
 
 
 
#fit-status{
 
  color:#000000;
  font-size:16px;
  font-weight:600;
  margin-top:10px;
  text-align:center;
}