/* EsigaraHane Phase 20 - customer experience */

:root{
    --esh-orange:#F4772E;
    --esh-orange-dark:#DF6220;
    --esh-orange-soft:#FFF3EA;
    --esh-ink:#252A2F;
    --esh-muted:#737B83;
    --esh-line:#E7EAED;
}

/* service bar */
.phase20-servicebar{
    background:#fff;
    border-bottom:1px solid #eceff1;
}

.phase20-servicebar-inner{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:0!important;
}

.phase20-servicebar-item{
    min-height:34px;
    display:flex!important;
    align-items:center;
    justify-content:center;
    gap:6px;
    padding:0 10px;
    border-right:1px solid #edf0f2;
    color:#687078!important;
    text-decoration:none;
    font-size:9px!important;
    font-weight:750;
}

.phase20-servicebar-item:last-child{
    border-right:0;
}

.phase20-servicebar-item i{
    width:16px;
    height:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--esh-orange);
}

.phase20-servicebar-item svg{
    width:16px;
    height:16px;
    fill:currentColor;
}

a.phase20-servicebar-item:hover{
    color:var(--esh-orange-dark)!important;
    background:#fffaf7;
}

/* home services */
.phase20-home-service-grid{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px!important;
}

.phase20-home-service{
    min-height:88px;
    display:grid;
    grid-template-columns:42px minmax(0,1fr) auto;
    gap:11px;
    align-items:center;
    padding:14px;
    border:1px solid #e7eaed;
    border-radius:14px;
    background:#fff;
    color:inherit;
    text-decoration:none;
    box-shadow:0 8px 28px rgba(32,36,40,.035);
}

.phase20-home-service:hover{
    border-color:#f5c5a7;
    box-shadow:0 13px 34px rgba(32,36,40,.06);
}

.esh-service-icon{
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    background:var(--esh-orange-soft);
    color:var(--esh-orange);
}

.esh-service-icon svg{
    width:22px;
    height:22px;
    fill:currentColor;
}

.phase20-home-service>span strong,
.phase20-home-service>span small{
    display:block;
}

.phase20-home-service>span strong{
    color:#30363c;
    font-size:11px;
}

.phase20-home-service>span small{
    margin-top:3px;
    color:#858c94;
    font-size:8px;
    line-height:1.45;
}

.phase20-home-service>b{
    color:var(--esh-orange);
    font-size:17px;
}

/* product smart badges */
.esh-smart-badges{
    position:absolute;
    z-index:3;
    top:10px;
    left:10px;
    display:flex;
    flex-wrap:wrap;
    gap:5px;
    max-width:calc(100% - 20px);
}

.product-detail-badges{
    position:static;
    margin-bottom:9px;
}

.esh-smart-badge{
    display:inline-flex;
    align-items:center;
    min-height:24px;
    padding:0 8px;
    border-radius:999px;
    font-size:8px;
    font-weight:900;
    letter-spacing:.01em;
    box-shadow:0 4px 12px rgba(30,34,38,.08);
}

.esh-smart-badge.sold-out{background:#292e33;color:#fff}
.esh-smart-badge.low-stock{background:#fff0e5;color:#b64c0c}
.esh-smart-badge.discount{background:#F4772E;color:#fff}
.esh-smart-badge.restocked{background:#eaf8ef;color:#138147}
.esh-smart-badge.best-seller{background:#fff6d8;color:#795f00}
.esh-smart-badge.new{background:#eaf2ff;color:#2865a6}
.esh-smart-badge.featured{background:#f1edff;color:#6549a8}

.phase20-product-card .product-image{
    position:relative;
}

.phase20-card-rating{
    display:flex;
    align-items:center;
    gap:4px;
    width:max-content;
    margin:6px 0 4px;
    color:#717980;
    text-decoration:none;
    font-size:9px;
}

.phase20-card-rating>span{
    color:#f4b400;
    font-size:14px;
}

.phase20-card-rating strong{
    color:#4f575f;
}

.phase20-card-rating small{
    color:#92989f;
}

.phase20-card-price-row{
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    gap:7px;
}

.phase20-card-price-row del{
    color:#9ca2a8;
    font-size:9px;
}

.phase20-stock-alert-card-button{
    background:#fff!important;
    border:1px solid var(--esh-orange)!important;
    color:var(--esh-orange-dark)!important;
}

/* stock alert panel */
.phase20-stock-alert-panel{
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    gap:13px;
    margin-top:17px;
    padding:16px;
    border:1px solid #ffd8bd;
    border-radius:14px;
    background:#fff8f3;
}

.phase20-stock-alert-icon{
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:13px;
    background:#fff;
    color:var(--esh-orange);
    box-shadow:0 7px 20px rgba(244,119,46,.10);
}

.phase20-stock-alert-icon svg{
    width:25px;
    height:25px;
    fill:currentColor;
}

.phase20-stock-alert-panel>div:last-child>span{
    display:block;
    color:var(--esh-orange-dark);
    font-size:8px;
    font-weight:900;
    letter-spacing:.12em;
}

.phase20-stock-alert-panel h2{
    margin:4px 0 4px;
    color:#30363c;
    font-size:16px;
}

.phase20-stock-alert-panel p{
    margin:0;
    color:#737b83;
    font-size:9px;
    line-height:1.55;
}

.phase20-stock-alert-form{
    display:grid;
    grid-template-columns:1fr 1.2fr auto;
    gap:7px;
    margin-top:12px;
}

.phase20-stock-alert-form input,
.phase20-stock-alert-account{
    min-height:40px;
    border:1px solid #e1e5e8;
    border-radius:9px;
    background:#fff;
    padding:0 10px;
    font-size:9px;
}

.phase20-stock-alert-account{
    grid-column:1 / span 2;
    display:flex;
    align-items:center;
    gap:5px;
}

.phase20-stock-alert-form button{
    min-height:40px;
    border:0;
    border-radius:9px;
    background:var(--esh-orange);
    color:#fff;
    padding:0 13px;
    cursor:pointer;
    font-size:9px;
    font-weight:850;
}

.phase20-stock-alert-panel small{
    display:block;
    margin-top:7px;
    color:#9a7b68;
    font-size:7px;
    line-height:1.5;
}

/* age gate */
.esh-age-gate-body{
    margin:0;
    min-height:100vh;
    background:
        radial-gradient(circle at 15% 10%,rgba(244,119,46,.16),transparent 30%),
        linear-gradient(145deg,#f6f7f8,#fff);
    color:#272c31;
    font-family:Arial,Helvetica,sans-serif;
}

.esh-age-gate-shell{
    min-height:100vh;
    display:grid;
    place-items:center;
    padding:24px;
}

.esh-age-gate-card{
    width:min(100%,520px);
    padding:34px;
    border:1px solid #e7eaed;
    border-radius:24px;
    background:#fff;
    box-shadow:0 30px 90px rgba(30,34,38,.13);
    text-align:center;
}

.esh-age-logo{
    display:flex;
    justify-content:center;
    margin-bottom:16px;
}

.esh-age-logo img,
.esh-age-static-logo{
    max-width:245px;
    max-height:130px;
    object-fit:contain;
}

.esh-age-number{
    width:64px;
    height:64px;
    display:grid;
    place-items:center;
    margin:0 auto 14px;
    border-radius:50%;
    background:var(--esh-orange);
    color:#fff;
    font-size:20px;
    font-weight:900;
}

.esh-age-gate-card h1{
    margin:0;
    font-size:26px;
    letter-spacing:-.04em;
}

.esh-age-message{
    margin:11px auto 18px;
    max-width:430px;
    color:#6f777f;
    font-size:12px;
    line-height:1.7;
}

.esh-age-confirm{
    display:flex;
    gap:9px;
    align-items:flex-start;
    padding:12px;
    border:1px solid #e4e7ea;
    border-radius:11px;
    background:#fafbfc;
    text-align:left;
    color:#525a62;
    font-size:10px;
    line-height:1.45;
}

.esh-age-confirm input{
    margin-top:2px;
    accent-color:var(--esh-orange);
}

.esh-age-enter{
    width:100%;
    min-height:46px;
    margin-top:11px;
    border:0;
    border-radius:11px;
    background:var(--esh-orange);
    color:#fff;
    cursor:pointer;
    font-weight:900;
}

.esh-age-enter:hover{
    background:var(--esh-orange-dark);
}

.esh-age-leave{
    display:inline-block;
    margin-top:12px;
    color:#7b838b;
    font-size:9px;
}

.esh-age-gate-card>small{
    display:block;
    margin-top:17px;
    color:#989ea5;
    font-size:8px;
    line-height:1.6;
}

/* tracking */
.phase20-tracking-page{
    padding:48px 0 70px;
    background:#f7f8f9;
}

.phase20-page-heading{
    max-width:760px;
    margin:0 auto 20px;
    text-align:center;
}

.phase20-page-heading>span{
    color:var(--esh-orange);
    font-size:9px;
    font-weight:900;
    letter-spacing:.14em;
}

.phase20-page-heading h1{
    margin:7px 0 8px;
    color:#252a2f;
    font-size:34px;
    letter-spacing:-.045em;
}

.phase20-page-heading p{
    margin:0;
    color:#727a82;
    font-size:11px;
    line-height:1.65;
}

.phase20-tracking-form{
    max-width:760px;
    display:grid;
    grid-template-columns:1fr 1fr auto;
    gap:8px;
    margin:0 auto;
    padding:16px;
    border:1px solid #e6e9ec;
    border-radius:15px;
    background:#fff;
    box-shadow:0 12px 35px rgba(31,36,40,.05);
}

.phase20-tracking-form label{
    display:flex;
    flex-direction:column;
    gap:5px;
    color:#5d656d;
    font-size:8px;
    font-weight:800;
}

.phase20-tracking-form input{
    min-height:42px;
    border:1px solid #dfe3e6;
    border-radius:9px;
    padding:0 10px;
}

.phase20-orange-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    border:0;
    border-radius:9px;
    background:var(--esh-orange);
    color:#fff!important;
    padding:0 15px;
    text-decoration:none;
    cursor:pointer;
    font-size:9px;
    font-weight:900;
}

.phase20-tracking-form .phase20-orange-button{
    align-self:end;
}

.phase20-tracking-error{
    max-width:760px;
    margin:10px auto 0;
    padding:10px 12px;
    border-radius:9px;
    background:#fff0f0;
    color:#a92820;
    font-size:9px;
}

.phase20-tracking-result{
    max-width:1120px;
    margin:24px auto 0;
}

.phase20-tracking-summary{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.phase20-tracking-summary>div{
    padding:14px;
    border:1px solid #e4e8eb;
    border-radius:12px;
    background:#fff;
}

.phase20-tracking-summary span,
.phase20-tracking-summary strong{
    display:block;
}

.phase20-tracking-summary span{
    color:#90979e;
    font-size:8px;
}

.phase20-tracking-summary strong{
    margin-top:4px;
    color:#30363c;
    font-size:11px;
}

.phase20-order-progress{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    margin-top:12px;
    padding:16px;
    border:1px solid #e4e8eb;
    border-radius:14px;
    background:#fff;
}

.phase20-order-progress>div{
    position:relative;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    color:#a0a6ad;
    font-size:8px;
    font-weight:800;
}

.phase20-order-progress>div:not(:last-child)::after{
    content:"";
    position:absolute;
    top:14px;
    left:58%;
    width:84%;
    height:2px;
    background:#e6e9ec;
}

.phase20-order-progress i{
    position:relative;
    z-index:2;
    width:29px;
    height:29px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#edf0f2;
    font-style:normal;
}

.phase20-order-progress>div.active{
    color:#3f474e;
}

.phase20-order-progress>div.active i{
    background:var(--esh-orange);
    color:#fff;
}

.phase20-order-progress>div.active:not(:last-child)::after{
    background:#ffd6bb;
}

.phase20-order-cancelled{
    margin-top:12px;
    padding:15px;
    border-radius:11px;
    background:#fff0f0;
    color:#ad2c24;
    font-size:10px;
    font-weight:850;
}

.phase20-shipping-card{
    display:grid;
    grid-template-columns:1fr 1fr auto;
    gap:12px;
    align-items:center;
    margin-top:12px;
    padding:16px;
    border:1px solid #ffd8bd;
    border-radius:14px;
    background:#fff8f3;
}

.phase20-shipping-card span,
.phase20-shipping-card strong{
    display:block;
}

.phase20-shipping-card span{
    color:#9a6c50;
    font-size:8px;
}

.phase20-shipping-card strong{
    margin-top:4px;
    color:#593723;
    font-size:11px;
}

.phase20-shipping-actions{
    display:flex;
    gap:6px;
}

.phase20-shipping-actions button,
.phase20-shipping-actions a{
    min-height:34px;
    display:inline-flex;
    align-items:center;
    border:1px solid #f3b78f;
    border-radius:8px;
    background:#fff;
    color:#a44710;
    padding:0 9px;
    text-decoration:none;
    cursor:pointer;
    font-size:8px;
    font-weight:850;
}

.phase20-tracking-columns{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:12px;
}

.phase20-tracking-columns>div{
    padding:18px;
    border:1px solid #e4e8eb;
    border-radius:14px;
    background:#fff;
}

.phase20-tracking-columns h2{
    margin:0 0 13px;
    font-size:15px;
}

.phase20-public-timeline article{
    display:grid;
    grid-template-columns:18px minmax(0,1fr);
    gap:9px;
    padding-bottom:14px;
}

.phase20-public-timeline article>i{
    width:11px;
    height:11px;
    margin-top:3px;
    border:3px solid #ffe4d2;
    border-radius:50%;
    background:var(--esh-orange);
}

.phase20-public-timeline strong,
.phase20-public-timeline p,
.phase20-public-timeline time{
    display:block;
}

.phase20-public-timeline strong{font-size:9px}
.phase20-public-timeline p{margin:3px 0;color:#747c84;font-size:8px}
.phase20-public-timeline time{margin-top:3px;color:#a0a6ad;font-size:7px}

.phase20-tracking-items{
    display:flex;
    flex-direction:column;
}

.phase20-tracking-items article{
    display:grid;
    grid-template-columns:48px minmax(0,1fr) auto;
    gap:9px;
    align-items:center;
    padding:9px 0;
    border-bottom:1px solid #edf0f2;
}

.phase20-tracking-items img{
    width:48px;
    height:48px;
    border:1px solid #e8ebee;
    border-radius:9px;
    object-fit:cover;
}

.phase20-tracking-items strong,
.phase20-tracking-items span,
.phase20-tracking-items small{
    display:block;
}

.phase20-tracking-items strong{font-size:9px}
.phase20-tracking-items span,.phase20-tracking-items small{margin-top:2px;color:#8a9198;font-size:7px}
.phase20-tracking-items b{font-size:9px}

/* simple result */
.phase20-simple-result{
    max-width:620px;
    margin:50px auto;
    padding:32px;
    border:1px solid #e5e8eb;
    border-radius:18px;
    background:#fff;
    text-align:center;
}

.phase20-simple-result>span{
    width:52px;
    height:52px;
    display:grid;
    place-items:center;
    margin:0 auto 10px;
    border-radius:50%;
    background:#eaf8ef;
    color:#178447;
    font-size:22px;
}

.phase20-simple-result h1{margin:0;font-size:25px}
.phase20-simple-result p{color:#737b83;font-size:10px;line-height:1.6}

/* blog */
.phase20-blog-hero{
    padding:55px 0;
    background:
        radial-gradient(circle at 80% 20%,rgba(244,119,46,.17),transparent 32%),
        linear-gradient(135deg,#24292e,#343a40);
    color:#fff;
}

.phase20-blog-hero .container{
    max-width:1050px;
}

.phase20-blog-hero>div>span{
    color:#ffb382;
    font-size:9px;
    font-weight:900;
    letter-spacing:.15em;
}

.phase20-blog-hero h1{
    max-width:780px;
    margin:9px 0 10px;
    font-size:38px;
    line-height:1.14;
    letter-spacing:-.045em;
}

.phase20-blog-hero p{
    max-width:720px;
    margin:0;
    color:#c7cbd0;
    font-size:11px;
    line-height:1.7;
}

.phase20-blog-hero form{
    max-width:620px;
    display:grid;
    grid-template-columns:1fr auto;
    gap:7px;
    margin-top:20px;
}

.phase20-blog-hero input{
    min-height:43px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:9px;
    background:rgba(255,255,255,.09);
    color:#fff;
    padding:0 12px;
}

.phase20-blog-hero button{
    border:0;
    border-radius:9px;
    background:var(--esh-orange);
    color:#fff;
    padding:0 18px;
    font-weight:900;
}

.phase20-blog-categories{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-bottom:20px;
}

.phase20-blog-categories a{
    min-height:31px;
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:0 10px;
    border:1px solid #e1e5e8;
    border-radius:999px;
    background:#fff;
    color:#687078;
    text-decoration:none;
    font-size:8px;
    font-weight:800;
}

.phase20-blog-categories a.active,
.phase20-blog-categories a:hover{
    border-color:#f2b388;
    background:#fff6ef;
    color:#b54b0e;
}

.phase20-blog-categories small{
    min-width:18px;
    height:18px;
    display:grid;
    place-items:center;
    border-radius:999px;
    background:#f1f3f5;
    font-size:7px;
}

.phase20-featured-post{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    min-height:330px;
    overflow:hidden;
    margin-bottom:25px;
    border:1px solid #e5e8eb;
    border-radius:19px;
    background:#fff;
}

.phase20-featured-post>div:first-child{
    min-height:320px;
    background:#f3f4f5;
}

.phase20-featured-post img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.phase20-featured-post>div:last-child{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:32px;
}

.phase20-featured-post span{
    color:var(--esh-orange);
    font-size:8px;
    font-weight:900;
    letter-spacing:.13em;
}

.phase20-featured-post h2{
    margin:8px 0;
    font-size:27px;
    line-height:1.2;
    letter-spacing:-.04em;
}

.phase20-featured-post p{
    color:#747c84;
    font-size:10px;
    line-height:1.65;
}

.phase20-featured-post a{
    margin-top:10px;
    color:var(--esh-orange-dark);
    text-decoration:none;
    font-size:9px;
    font-weight:900;
}

.phase20-blog-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
}

.phase20-blog-card{
    overflow:hidden;
    border:1px solid #e5e8eb;
    border-radius:15px;
    background:#fff;
    box-shadow:0 8px 25px rgba(31,36,40,.035);
}

.phase20-blog-card-image{
    display:block;
    aspect-ratio:16/9;
    overflow:hidden;
    background:#f2f4f5;
}

.phase20-blog-card-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .2s ease;
}

.phase20-blog-card:hover img{
    transform:scale(1.02);
}

.phase20-blog-placeholder{
    width:100%;
    height:100%;
    display:grid;
    place-items:center;
    color:#a0a6ad;
    font-size:10px;
}

.phase20-blog-card-body{
    padding:15px;
}

.phase20-blog-meta{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    color:#9aa0a6;
    font-size:7px;
}

.phase20-blog-meta span:first-child{
    color:var(--esh-orange-dark);
    font-weight:850;
}

.phase20-blog-card h2{
    margin:8px 0 6px;
    font-size:15px;
    line-height:1.35;
}

.phase20-blog-card h2 a{
    color:#2f353a;
    text-decoration:none;
}

.phase20-blog-card p{
    margin:0;
    color:#777f87;
    font-size:9px;
    line-height:1.6;
}

.phase20-blog-card-footer{
    display:flex;
    justify-content:space-between;
    gap:10px;
    margin-top:13px;
    padding-top:10px;
    border-top:1px solid #edf0f2;
}

.phase20-blog-card-footer time{
    color:#a0a6ad;
    font-size:7px;
}

.phase20-blog-card-footer a{
    color:var(--esh-orange-dark);
    text-decoration:none;
    font-size:8px;
    font-weight:850;
}

.phase20-blog-empty{
    grid-column:1/-1;
    padding:30px;
    border:1px dashed #d9dde1;
    border-radius:13px;
    color:#8b9299;
    text-align:center;
    font-size:9px;
}

.phase20-blog-category-head{
    padding:34px 0;
    background:#f7f8f9;
    border-bottom:1px solid #e8ebee;
}

.phase20-blog-category-head nav,
.phase20-post-breadcrumb{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    color:#9aa0a6;
    font-size:8px;
}

.phase20-blog-category-head nav a,
.phase20-post-breadcrumb a{
    color:#737b83;
    text-decoration:none;
}

.phase20-blog-category-head h1{
    margin:8px 0 5px;
    font-size:31px;
}

.phase20-blog-category-head p{
    max-width:720px;
    margin:0;
    color:#737b83;
    font-size:10px;
    line-height:1.65;
}

.phase20-blog-post{
    padding:34px 0 70px;
}

.phase20-blog-post-shell{
    max-width:1120px;
}

.phase20-blog-post header{
    max-width:860px;
    margin:26px auto 20px;
    text-align:center;
}

.phase20-post-category{
    display:inline-flex;
    min-height:26px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    background:var(--esh-orange-soft);
    color:var(--esh-orange-dark);
    font-size:8px;
    font-weight:850;
}

.phase20-blog-post header h1{
    margin:12px 0 9px;
    font-size:40px;
    line-height:1.14;
    letter-spacing:-.05em;
}

.phase20-blog-post header>p{
    max-width:760px;
    margin:0 auto;
    color:#707880;
    font-size:11px;
    line-height:1.7;
}

.phase20-post-meta{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;
    margin-top:14px;
    color:#959ca3;
    font-size:8px;
}

.phase20-post-cover{
    width:100%;
    max-height:570px;
    object-fit:cover;
    border-radius:18px;
    background:#f2f3f5;
}

.phase20-post-content{
    max-width:780px;
    margin:34px auto 0;
    color:#3e454b;
    font-size:13px;
    line-height:1.85;
}

.phase20-post-content h2{
    margin:34px 0 10px;
    color:#252a2f;
    font-size:25px;
    line-height:1.25;
}

.phase20-post-content h3{
    margin:26px 0 8px;
    color:#2f353a;
    font-size:19px;
}

.phase20-post-content p{
    margin:0 0 16px;
}

.phase20-post-content ul,
.phase20-post-content ol{
    padding-left:22px;
}

.phase20-post-content blockquote{
    margin:24px 0;
    padding:15px 17px;
    border-left:4px solid var(--esh-orange);
    border-radius:0 10px 10px 0;
    background:#fff7f1;
    color:#655449;
}

.phase20-post-content a{
    color:var(--esh-orange-dark);
}

.phase20-related-products,
.phase20-related-posts{
    margin-top:48px;
}

.phase20-related-posts>h2{
    margin-bottom:15px;
}

/* responsive */
@media(max-width:1000px){
    .phase20-home-service-grid,
    .phase20-servicebar-inner{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }

    .phase20-blog-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .phase20-tracking-summary{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:820px){
    .phase20-servicebar{
        display:none;
    }

    .phase20-featured-post{
        grid-template-columns:1fr;
    }

    .phase20-featured-post>div:first-child{
        min-height:auto;
        aspect-ratio:16/9;
    }

    .phase20-tracking-form,
    .phase20-shipping-card,
    .phase20-tracking-columns{
        grid-template-columns:1fr;
    }

    .phase20-shipping-actions{
        flex-wrap:wrap;
    }
}

@media(max-width:640px){
    .phase20-home-service-grid,
    .phase20-blog-grid,
    .phase20-tracking-summary{
        grid-template-columns:1fr!important;
    }

    .phase20-home-service{
        min-height:76px;
    }

    .phase20-stock-alert-form{
        grid-template-columns:1fr;
    }

    .phase20-stock-alert-account{
        grid-column:auto;
    }

    .phase20-page-heading h1,
    .phase20-blog-hero h1{
        font-size:29px;
    }

    .phase20-order-progress{
        grid-template-columns:1fr;
        gap:9px;
    }

    .phase20-order-progress>div{
        flex-direction:row;
        justify-content:flex-start;
    }

    .phase20-order-progress>div::after{
        display:none;
    }

    .phase20-blog-post header h1{
        font-size:31px;
    }

    .esh-age-gate-card{
        padding:24px 18px;
    }
}

/* PREMIUM-PRODUCT-CARD-V3 */

.esh-premium-product-card{
    position:relative;
    display:flex;
    flex-direction:column;
    height:100%;
    min-width:0;
    overflow:hidden;
    background:#fff;
    border:1px solid #e9edf1;
    border-radius:16px;
    box-shadow:0 5px 18px rgba(25,40,60,.055);
    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}

.esh-premium-product-card:hover{
    transform:translateY(-3px);
    border-color:#dde3e8;
    box-shadow:0 12px 28px rgba(25,40,60,.11);
}

.esh-premium-product-media{
    position:relative;
    width:100%;
    height:310px;
    overflow:hidden;
    background:#fff;
}

.esh-premium-product-image{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    padding:18px;
    text-decoration:none;
}

.esh-premium-product-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
    transition:transform .32s ease;
}

.esh-premium-product-card:hover .esh-premium-product-image img{
    transform:scale(1.055);
}

.esh-product-no-image{
    color:#9aa2aa;
    font-size:13px;
}

.esh-premium-card-badges{
    position:absolute;
    top:12px;
    left:12px;
    z-index:5;
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    max-width:calc(100% - 65px);
}

.esh-premium-card-badges .esh-smart-badge{
    font-size:11px;
    font-weight:800;
    line-height:1;
    border-radius:8px;
    padding:7px 9px;
    box-shadow:0 2px 5px rgba(0,0,0,.06);
}

.esh-product-quick-view{
    position:absolute;
    top:12px;
    right:12px;
    z-index:5;
    width:38px;
    height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(35,39,43,.92);
    color:#fff;
    text-decoration:none;
    opacity:0;
    transform:translateY(-4px);
    transition:opacity .2s ease,transform .2s ease,background .2s ease;
}

.esh-product-quick-view svg{
    width:19px;
    height:19px;
    fill:currentColor;
}

.esh-premium-product-card:hover .esh-product-quick-view{
    opacity:1;
    transform:translateY(0);
}

.esh-product-quick-view:hover{
    background:#F4772E;
}

.esh-premium-product-info{
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    padding:15px 16px 16px;
    border-top:1px solid #f1f2f3;
}

.esh-premium-rating{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:20px;
    margin-bottom:7px;
    text-decoration:none;
    color:#9ba2a8;
}

.esh-rating-stars{
    display:flex;
    gap:1px;
    line-height:1;
}

.esh-rating-stars span{
    font-size:15px;
    color:#d9dee2;
}

.esh-rating-stars span.filled{
    color:#f5ad16;
}

.esh-premium-rating small{
    font-size:11px;
    color:#929aa2;
}

.esh-premium-product-title{
    width:100%;
    margin:0;
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:17px;
    line-height:1.4;
    font-weight:700;
}

.esh-premium-product-title a{
    color:#303842;
    text-decoration:none;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.esh-premium-product-title a:hover{
    color:#F4772E;
}

.esh-premium-variation-count{
    margin-top:5px;
    color:#8d959d;
    font-size:11px;
}

.esh-premium-price-row{
    min-height:46px;
    margin-top:auto;
    padding-top:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
}

.esh-premium-price{
    color:#F4772E;
    font-size:21px;
    line-height:1.2;
    font-weight:800;
}

.esh-premium-old-price{
    color:#90969c;
    font-size:14px;
    font-weight:500;
}

.esh-premium-product-action{
    width:100%;
    margin-top:auto;
}

.esh-card-cart-form{
    width:100%;
    margin:0;
}

.esh-card-cart-button{
    appearance:none;
    border:0;
    width:100%;
    min-height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:12px 14px;
    background:#303336;
    color:#fff;
    font-family:inherit;
    font-size:14px;
    line-height:1;
    letter-spacing:.035em;
    font-weight:800;
    text-decoration:none;
    cursor:pointer;
    transition:background .2s ease;
}

button.esh-card-cart-button{
    border-radius:0;
}

.esh-card-cart-button svg{
    width:19px;
    height:19px;
    fill:currentColor;
    flex:0 0 auto;
}

.esh-card-cart-button:hover{
    background:#F4772E;
    color:#fff;
}

.esh-card-stock-button{
    background:#677078;
}

@media (max-width:1024px){

    .esh-premium-product-media{
        height:275px;
    }

    .esh-premium-product-title{
        font-size:16px;
    }

    .esh-premium-price{
        font-size:19px;
    }

    .esh-product-quick-view{
        opacity:1;
        transform:none;
    }
}

@media (max-width:640px){

    .esh-premium-product-card{
        border-radius:12px;
    }

    .esh-premium-product-media{
        height:210px;
    }

    .esh-premium-product-image{
        padding:10px;
    }

    .esh-premium-card-badges{
        top:7px;
        left:7px;
        gap:4px;
    }

    .esh-premium-card-badges .esh-smart-badge{
        padding:5px 6px;
        font-size:9px;
    }

    .esh-product-quick-view{
        width:32px;
        height:32px;
        top:7px;
        right:7px;
    }

    .esh-product-quick-view svg{
        width:16px;
        height:16px;
    }

    .esh-premium-product-info{
        padding:11px 9px 12px;
    }

    .esh-premium-rating{
        margin-bottom:5px;
    }

    .esh-rating-stars span{
        font-size:12px;
    }

    .esh-premium-rating small{
        display:none;
    }

    .esh-premium-product-title{
        min-height:42px;
        font-size:14px;
        line-height:1.45;
    }

    .esh-premium-price-row{
        min-height:40px;
        padding-top:7px;
        gap:5px;
    }

    .esh-premium-price{
        font-size:16px;
    }

    .esh-premium-old-price{
        font-size:11px;
    }

    .esh-card-cart-button{
        min-height:45px;
        padding:10px 6px;
        font-size:11px;
        letter-spacing:0;
    }

    .esh-card-cart-button svg{
        width:16px;
        height:16px;
    }
}

/* MANUAL-BADGE-OPPORTUNITY */
.esh-smart-badge.opportunity{
    background:#7b4bc4;
    color:#fff;
}