:root {
--orange: #ff4700;
--orange2: #ff6a00;
--black: #080808;
--char: #111;
--panel: #171717;
--text: #f7f7f7;
--muted: #a9a9a9;
--line: #2a2a2a;
--white: #fff;
--radius: 22px;
--shadow: 0 24px 60px rgba(0, 0, 0, 0.25);
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "Manrope", sans-serif;
}
html {
scroll-behavior: smooth;
}
body {
margin: 0;
font-family: "Poppins", sans-serif;
}
a {
color: inherit;
text-decoration: none;
}
button,
input,
select,
textarea {
font: inherit;
}
.container {
max-width: 1520px;
width: 100%;
margin: 0 auto;
padding:0px 15px;
}
.top-strip {
background: var(--orange);
font-size: 12px;
font-weight: 700;
color: #080808;
}
.top-strip-inner {
display: flex;
justify-content: space-between;
gap: 20px;
padding: 8px 0;
}

.nav-wrap {
min-height: 82px;
display: flex;
align-items: center;
gap: 30px;
}
.brand-logo {
display: flex;
align-items: center;
gap: 10px;
min-width: max-content;
}
.brand-logo .wheel-mark {
display: grid;
place-items: center;
width: 42px;
height: 42px;
border: 6px solid var(--orange);
border-radius: 50%;
font-size: 11px;
box-shadow: inset 0 0 0 3px #222;
}

.brand-logo b {
font-family: "Barlow Condensed";
font-size: 24px;
letter-spacing: 1px;
}
.brand-logo small {
display: block;
letter-spacing: 5px;
color: #bbb;
font-size: 8px;
}
.main-nav {
display: flex;
gap: 26px;
margin-left: auto;
}

.header-actions {
display: flex;
align-items: center;
gap: 14px;
font-size: 13px;
}
.header-actions form {
display: inline;
}
.link-btn {
background: none;
border: 0;
color: #ddd;
cursor: pointer;
}
.cart-pill {
padding: 10px 14px;
border: 1px solid #333;
border-radius: 999px;
}
.cart-pill span {
background: var(--orange);
color: #111;
border-radius: 50%;
padding: 2px 7px;
margin-left: 5px;
}
.mobile-toggle {
display: none;
background: none;
color: #fff;
border: 0;
font-size: 24px;
}
.hero {
position: relative;
min-height: 720px;
display: flex;
align-items: center;
overflow: hidden;
background: radial-gradient(
circle at 75% 50%,
rgba(255, 75, 11, 0.2),
transparent 33%
),
linear-gradient(135deg, #050505 0, #0e0e0e 55%, #050505 100%);
}
.hero:after {
content: "";
position: absolute;
right: -100px;
bottom: -180px;
width: 520px;
height: 520px;
border: 110px solid rgba(255, 75, 11, 0.05);
border-radius: 50%;
}
.hero-lines {
position: absolute;
inset: 0;
background-image: linear-gradient(
rgba(255, 255, 255, 0.025) 1px,
transparent 1px
),
linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px);
background-size: 48px 48px;
mask-image: linear-gradient(to right, #000, transparent);
}
.hero-grid {
position: relative;
z-index: 2;
display: grid;
grid-template-columns: 1.05fr 0.95fr;
align-items: center;
gap: 60px;
}
.eyebrow {
display: inline-block;
margin-bottom: 8px;
font-weight: 600;
font-size: 12px;
line-height: 18px;
letter-spacing: 2px;
}

.btn {
display: inline-flex;
align-items: center;
justify-content: center;
border: 0;
border-radius: 12px;
padding: 15px 22px;
font-weight: 800;
cursor: pointer;
transition: 0.25s;
}
.btn-primary {
    background: #FF4700;
    color: #ffffff;
    border-radius: 4px;
}
.btn-primary:hover {
transform: translateY(-2px);
box-shadow: 0 16px 34px rgba(255, 75, 11, 0.33);
}
.btn-outline {
border: 1px solid #3a3a3a;
color: #fff;
background: #111;
}
.btn-dark {
background: #080808;
color: #fff;
}
.full {
width: 100%;
}
.trust-row {
display: flex;
gap: 22px;
color: #aaa;
font-size: 12px;
}
.hero-wheel-wrap {
position: relative;
min-height: 500px;
display: grid;
place-items: center;
}
.utility-items span {
display: flex;
align-items: center;
}
.hero-wheel {
width: 380px;
height: 380px;
border-radius: 50%;
background: repeating-radial-gradient(
circle,
#171717 0 34%,
#2a2a2a 35% 38%,
#111 39% 53%,
#242424 54% 58%,
#070707 59% 100%
);
border: 28px solid #111;
box-shadow: 0 50px 80px rgba(0, 0, 0, 0.65), inset 0 0 0 8px #2b2b2b;
animation: floatWheel 5s ease-in-out infinite;
}
.hero-wheel:before {
content: "";
position: absolute;
}
.hero-wheel .rim {
width: 170px;
height: 170px;
border-radius: 50%;
background: radial-gradient(
circle,
#050505 0 13%,
#bbb 14% 18%,
#333 19% 25%,
#d8d8d8 26% 30%,
#313131 31% 46%,
#ddd 47% 50%,
#111 51% 100%
);
display: grid;
place-items: center;
color: var(--orange);
font-size: 54px;
margin: 77px auto;
}
.speed-ring {
position: absolute;
width: 440px;
height: 440px;
border-radius: 50%;
border: 1px dashed rgba(255, 75, 11, 0.45);
animation: spin 18s linear infinite;
}
.floating-chip {
position: absolute;
background: #161616;
border: 1px solid #292929;
border-radius: 999px;
padding: 9px 14px;
font-size: 11px;
font-weight: 800;
letter-spacing: 1px;
box-shadow: var(--shadow);
}
.chip-a {
top: 24%;
right: 2%;
}
.chip-b {
bottom: 18%;
left: 5%;
}
.finder-section {
position: relative;
z-index: 5;
margin-top: -68px;
}
.finder-card {
background: #121212;
border: 1px solid #282828;
border-radius: 24px;
padding: 18px;
box-shadow: 0 30px 70px rgba(0, 0, 0, 0.5);
}
.finder-tabs {
display: flex;
gap: 8px;
margin-bottom: 15px;
}
.finder-tabs button {
border: 0;
background: #1e1e1e;
color: #aaa;
border-radius: 10px;
padding: 10px 16px;
font-weight: 700;
cursor: pointer;
}
.finder-tabs button.active {
background: var(--orange);
color: #111;
}
.finder-form {
display: grid;
grid-template-columns: repeat(3, 1fr) auto;
gap: 12px;
}
.finder-form label,
.auth-card label {
display: block;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 800;
color: #989898;
margin-bottom: 7px;
}
.finder-form select,
.filters input,
.filters select,
.auth-card input,
.fields input,
.fields select,
.fields textarea,
.stack-form input,
.stack-form select,
.stack-form textarea {
width: 100%;
background: #0b0b0b;
color: #fff;
border: 1px solid #2e2e2e;
border-radius: 11px;
padding: 13px;
outline: 0;
}
.finder-form select:focus,
.filters input:focus,
.auth-card input:focus {
border-color: var(--orange);
}
.hidden {
display: none !important;
}

.section-dark {
background: #0d0d0d;
}
.section-heading {
display: flex;
justify-content: space-between;
align-items: end;
gap: 25px;
margin-bottom: 48px;
}
.section-heading h2,
.cta-card h2,
.description-card h2 {
font-size: 32px;
line-height: 40px;
letter-spacing: 0%;
text-transform: uppercase;
font-weight: bold;
}
.heading-span {
color: #ff4700;
}
.category-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 32px;
}

.category-card:hover {
transform: translateY(-7px);
border-color: #444;
}

.category-card span {
font-size: 11px;
font-weight: 800;
color: #777;
}

.card1,
.card2,
.card3,
.card4 {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.card1 {
background-image: url("/images/home/card1.png");
}

.card2 {
background-image: url("/images/home/card2.png");
}

.card3 {
background-image: url("/images/home/card3.png");
}

.card4 {
background-image: url("/images/home/card4.png");
}
.card4 .accent {
color: #ffffff;
}
.category-card.card4.accent h3 {
color: #ffff;
}
.product-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 18px;
}

.product-card:hover {
transform: translateY(-6px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
}
.product-image {
display: block;
height: 250px;
background: radial-gradient(circle, #272727, #0c0c0c 70%);
position: relative;
overflow: hidden;
}
.product-image img {
width: 100%;
height: 100%;
object-fit: contain;
padding: 20px;
transition: 0.35s;
}
.product-card:hover .product-image img {
transform: scale(1.05);
}
section#catalogAjaxRoot .product-body {
    display: flex;
    flex-direction: column;
}

section#catalogAjaxRoot .product-card {
    height: 100%;
    display: flex;
    flex-direction: column;
}

section#catalogAjaxRoot .product-image {
    flex-shrink: 0;
}

section#catalogAjaxRoot .product-body {
    flex: 1;
    display: flex;
    flex-direction: column;
}

section#catalogAjaxRoot .card-cart-actions {
    margin-top: auto;
}


section#catalogAjaxRoot .card-cart-form {
    margin-top: auto;
    padding-top: 14px;
}



.tire-placeholder {
width: 180px;
height: 180px;
border: 26px solid #1b1b1b;
border-radius: 50%;
margin: 34px auto;
box-shadow: inset 0 0 0 8px #383838, 0 18px 30px rgba(0, 0, 0, 0.5);
display: grid;
place-items: center;
}
.tire-placeholder div {
width: 70px;
height: 70px;
border-radius: 50%;
background: #c7c7c7;
color: #111;
display: grid;
place-items: center;
font-size: 32px;
}

.product-meta {
display: flex;
justify-content: space-between;
gap: 10px;
font-size: 10px;
color: #aaa;
text-transform: uppercase;
letter-spacing: 0.8px;
}

.spec-chips {
display: flex;
gap: 6px;
flex-wrap: wrap;
}
.spec-chips span {
    min-width: 29px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 7px;
    border: 1px solid #171a2633;
    border-radius: 4px;
    color: #171A26B2;
    font-weight: 400;
    font-size: 10px;
    line-height: 100%;
    letter-spacing: 0%;
}
.price-row {
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 32px;
}

.price-row del {
display: block;
color: #777;
font-size: 18px;
}


.brands-band p {
font-size: 10px;
letter-spacing: 2px;
color: #666;
}
.brands-row {
display: flex;
gap: 35px;
flex-wrap: wrap;
color: #888;
font-weight: 900;
font-size: 15px;
}
.cta-section {
padding: 80px 0px;
}
.cta-card {
border-radius: 20px;
padding: 100px 80px;
background-image: url("/images/home/CTA-backs.png");
background-repeat: no-repeat;
background-position: center;
background-size: cover;
    min-height: 365px;
	    display: flex;
    flex-direction: column;
    justify-content: center;
}
.cta-top {
display: flex;
justify-content: space-between;
flex-direction: row;
align-items: center;
}
.cta-features {
display: flex;
gap: 60px;
align-items: center;
flex-direction: row;
margin: 30px 0px 48px 0px;
}
form.newsletter-form {
display: flex;
gap: 20px;
align-items: center;
}
.cta-feature {
display: flex;
gap: 12px;
align-items: center;
}
.cta-top h2 {
    font-weight: 500;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #ffffff;
}
.cta-card p {
max-width: 650px;
font-family: Poppins;
font-weight: 400;
font-size: 18px;
line-height: 20px;
letter-spacing: 0%;
color: #ffffff;
margin-top: 12px;
}
.cta-card .eyebrow {
color: #ffffff;
font-weight: 600;
font-size: 20px;
line-height: 18px;
letter-spacing: 2px;
padding-bottom: 14px;
}
.newsletter-title {
display: flex;
flex-direction: column;
font-family: Manrope;
font-weight: 500;
font-size: 34px;
line-height: 38px;
letter-spacing: 0%;
vertical-align: middle;
text-transform: uppercase;
color: #ffffff;
padding-left: 14px;
border-left: 4px solid #ff4700;
}
.cta-newsletter {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 30px;
}
form.newsletter-form input[type="email"] {
backdrop-filter: blur(10px);
background: #ffffff1a;
padding: 17px;
border: 1px solid #ffffff1f;
border-radius: 8px;
max-height: 60px;
min-width: 500px;
color:#ffff;
}
form.newsletter-form button {
background: #ff4700;
border-radius: 8px;
font-weight: 400;
font-size: 18px;
line-height: 26px;
letter-spacing: 0%;
text-transform: capitalize;
border: none;
padding: 17px 40px;
color: #ffffff;
}
.cta-newsletter .newsletter-p {
font-weight: 400;
font-size: 12px;
line-height: 14px;
letter-spacing: 0%;
vertical-align: middle;
text-transform: uppercase;
color: #ffffff;
display: flex;
align-items: center;
gap: 4px;
margin-top: 4px;
}
.feature-icon-content {
font-weight: 500;
font-size: 16px;
line-height: 20px;
letter-spacing: 0%;
vertical-align: middle;
color: #ffffff;
}

.cta-phone {
display: flex;
background: #ffffff59;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 10px;
border-radius: 60px;
gap: 10px;
}
span.phone-icon {
padding: 10px 12px;
border: 1px solid #ff4700;
border-radius: 50%;
height: 42px;
width: 42px;
display: flex;
justify-content: center;
align-items: end;
}
.expert-help {
display: flex;
flex-direction: column;
gap: 0;
color: #fff;
}

.feature-icon {
border: 1px solid #ff4700;
height: 46px;
width: 46px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 100px;
}
.footer-grid {
display: grid;
grid-template-columns: 1.3fr repeat(3, 1fr);
gap: 20px;
padding-bottom: 73px !important;
}
@media(max-width:1400px){
section.product-page	.product-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
}
@media(max-width:821px){
section.product-page	.product-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}
}
.footer-bottom span {
font-weight: 400;
font-size: 12px;
line-height: 14px;
letter-spacing: 0%;
color: #ffffffcc;
}

.footer-bottom .site-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.empty-state {
grid-column: 1/-1;
padding: 60px;
border: 1px dashed #333;
border-radius: 18px;
text-align: center;
}
.product-page {
padding: 45px 0 90px;
}
.product-detail {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 55px;
}
.detail-image {
min-height: 520px;
background: radial-gradient(circle, #262626, #0d0d0d 70%);
border: 1px solid #282828;
border-radius: 24px;
display: grid;
place-items: center;
}
.detail-image img {
max-width: 85%;
max-height: 470px;
object-fit: contain;
}
.giant-tire {
width: 340px;
height: 340px;
border: 48px solid #171717;
border-radius: 50%;
display: grid;
place-items: center;
box-shadow: inset 0 0 0 14px #333;
}
.giant-tire div {
width: 120px;
height: 120px;
border-radius: 50%;
background: #d4d4d4;
color: #222;
display: grid;
place-items: center;
font-size: 50px;
}
.product-info {
padding-top: 30px;
}

.sku {
color: #777;
font-size: 12px;
}
.big-price {
font-size: 34px;
font-weight: 900;
margin: 18px 0;
}
.big-price del {
font-size: 16px;
color: #777;
margin-right: 10px;
}
.spec-table {
display: grid;
grid-template-columns: 1fr 1fr;
border: 1px solid #282828;
border-radius: 14px;
overflow: hidden;
margin: 25px 0;
}
.spec-table div {
padding: 12px 14px;
border-bottom: 1px solid #242424;
display: flex;
justify-content: space-between;
font-size: 12px;
}
.spec-table span {
color: #888;
}
.availability {
margin: 15px 0;
color: #a7d8b4;
font-size: 13px;
}
.dot {
display: inline-block;
width: 8px;
height: 8px;
background: #69cb86;
border-radius: 50%;
margin-right: 8px;
}
.buy-form {
display: flex;
gap: 10px;
}
.buy-form input {
width: 80px;
background: #111;
color: #fff;
border: 1px solid #333;
border-radius: 10px;
padding: 10px;
text-align: center;
}
.service-points {
display: flex;
gap: 15px;
flex-wrap: wrap;
margin-top: 18px;
color: #888;
font-size: 11px;
}
.description-card {
background: #111;
border: 1px solid #252525;
border-radius: 20px;
padding: 28px;
margin: 50px 0;
}
.cart-layout {
display: grid;
grid-template-columns: 1fr 340px;
gap: 28px;
}
.cart-item {
display: grid;
grid-template-columns: 80px 1fr auto auto;
gap: 16px;
align-items: center;
padding: 16px;
border-bottom: 1px solid #252525;
}
.cart-thumb {
width: 70px;
height: 70px;
border-radius: 50%;
border: 12px solid #222;
display: grid;
place-items: center;
}
.danger-link {
border: 0;
background: none;
color: #ff7650;
cursor: pointer;
}
.order-box {
background: #111;
border: 1px solid #252525;
border-radius: 18px;
padding: 22px;
height: max-content;
}
.order-box > div {
display: flex;
justify-content: space-between;
margin: 14px 0;
color: #aaa;
}
.order-total {
font-size: 20px !important;
color: #fff !important;
}

.error-box {
background: #3b1717;
border: 1px solid #6b2a2a;
color: #ffaaaa;
padding: 11px;
border-radius: 9px;
}
.toast {
position: fixed;
right: 18px;
top: 105px;
z-index: 100;
background: #171717;
border: 1px solid #333;
border-left: 4px solid var(--orange);
padding: 13px 18px;
border-radius: 10px;
box-shadow: var(--shadow);
}
.reveal {
opacity: 0;
transform: translateY(18px);
transition: 0.7s ease;
}
.reveal.in {
opacity: 1;
transform: none;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
@keyframes floatWheel {
0%,
100% {
transform: translateY(0) rotate(-2deg);
}
50% {
transform: translateY(-16px) rotate(2deg);
}
}
@media (max-width:767px) {
.main-nav {
display: none;
position: absolute;
top: 82px;
left: 0;
right: 0;
background: #0b0b0b;
padding: 20px;
flex-direction: column;
border-bottom: 1px solid #222;
}

.main-nav.open {
display: flex;
}
.mobile-toggle {
display: block;
margin-left: auto;
}
.header-actions {
display: none;
}
.hero-grid {
grid-template-columns: 1fr;
}
.cta-card {
    min-height: 185px;
}
.hero {
padding: 90px 0 130px;
}
.hero-wheel-wrap {
min-height: 390px;
}
.hero-wheel {
width: 300px;
height: 300px;
}
.hero-wheel .rim {
margin: 57px auto;
}
.speed-ring {
width: 350px;
height: 350px;
}
.finder-form {
grid-template-columns: 1fr 1fr;
}
.category-grid,
.product-grid {
grid-template-columns: repeat(2, 1fr);
}
.catalog-layout {
grid-template-columns: 1fr;
}
.filters {
display: none;
position: static;
max-height: none;
}
.filters.open {
display: block;
}

.catalog-main .product-grid {
grid-template-columns: repeat(2, 1fr);
}
.product-detail,
.cart-layout {
grid-template-columns: 1fr;
}
.footer-grid {
grid-template-columns: 1fr 1fr;
}
}
@media (max-width: 767px) {
.top-strip-inner {
display: block;
text-align: center;
}
.top-strip-inner span {
display: block;
}
.footer-bottom .site-container {
    flex-direction: column;
	    gap: 18px;
}
.nav-wrap {
min-height: 70px;
}
.mobile-toggle {
margin-left: auto;
}
.hero {
min-height: auto;
padding-top: 75px;
}
.hero-grid {
gap: 20px;
}
.hero h1 {
font-size: 54px;
}
.hero p {
font-size: 15px;
}
.hero-wheel-wrap {
min-height: 300px;
}
.hero-wheel {
width: 220px;
height: 220px;
border-width: 20px;
}
.hero-wheel .rim {
width: 100px;
height: 100px;
margin: 40px auto;
}
.speed-ring {
width: 260px;
height: 260px;
}
.floating-chip {
display: none;
}
.finder-section {
margin-top: -40px;
}
.finder-form {
grid-template-columns: 1fr;
}
.category-grid,
.product-grid,
.catalog-main .product-grid {
grid-template-columns: 1fr !important;
}
.testimonial-cuxx-user strong {
    font-size: 18px !important;
}
.testimonial-cuxx-user {
    margin-top: 18px !important; 
}
.testimonial-cuxx-text {
    font-size: 16px !important;
}
.section , .testimonial-cuxx-section{
padding: 40px 0 !important;
}
.section-heading h2 {
font-size: 24px;
        line-height: 28px;
}
.eyebrow {
        margin-bottom: 8px;
        font-weight: 600;
        font-size: 12px;
        line-height: 100%;
}

.cta-card {
padding: 28px;
display: block;
}
.cta-card .btn {
margin-top: 20px;
}
.footer-grid {
grid-template-columns: 1fr;
}
.footer-bottom {
display: block;
}
.catalog-toolbar {
align-items: start;
gap: 12px;
}

.detail-image {
min-height: auto;
}
.giant-tire {
width: 240px;
height: 240px;
border-width: 34px;
}
.spec-table {
grid-template-columns: 1fr;
}
.cart-item {
grid-template-columns: 60px 1fr;
}
.cart-item strong,
.cart-item form {
grid-column: 2;
}
.trust-row {
flex-direction: column;
gap: 5px;
}
}
@media(max-width:992px){
	    .footer-grid {
        grid-template-columns: 1fr !Important;
		gap:35px !Important;
    }

}
/* ==========================================================
   LA CEIBA V2
   BRIGHT RETAIL / BLACK + ORANGE
   Add this at the VERY BOTTOM of store.css
========================================================== */



/* MUCH WIDER DESKTOP SITE */

/* ==========================================================
   TOP ORANGE STRIP
========================================================== */

.top-strip {
background: linear-gradient(90deg, #ff4b0b, #ff6a00);

color: #090909;
}

.top-strip-inner {
min-height: 38px;
align-items: center;
}

/* ==========================================================
   MAIN HEADER
========================================================== */

.nav-wrap {
min-height: 94px;
gap: 28px;
}

/* temporary existing logo styling */

.brand-logo {
color: #111111;
}

.brand-logo .wheel-mark {
border-color: var(--orange);
color: #111111;

box-shadow: inset 0 0 0 3px #eeeeee;
}

.brand-logo b {
color: #111111;
}

.brand-logo small {
color: #777777;
}

/* navigation */

.main-nav {
gap: 27px;
}

/* header account / cart */

.header-actions {
color: #272b3d;
}

.link-btn {
color: #272b3d;
}

.cart-pill {
border-color: #d7dae0;
background: #ffffff;
}

.cart-pill span {
background: var(--orange);
color: #ffffff;
}

/* ==========================================================
   HERO
   ONLY HERO STAYS DARK
========================================================== */

.hero {
min-height: 570px;

background: radial-gradient(
circle at 78% 45%,
rgba(255, 75, 11, 0.28),
transparent 31%
),
linear-gradient(115deg, #070707 0%, #111111 55%, #321207 100%);
}

.hero-grid {
gap: 85px;

padding-top: 55px;
padding-bottom: 100px;
}

.hero h1 {
color: #ffffff;
}

.hero p {
color: #d2d2d2;
}
.eyebrow {
color: #ff4700;
}

.promo-inner span {
display: flex;
align-items: center;
}
/* make hero wheel larger */

.hero-wheel-wrap {
min-height: 450px;
}

.hero-wheel {
width: 400px;
height: 400px;
}

/* buttons */

.btn {
border-radius: 6px;
}

.btn-primary {
background: linear-gradient(135deg, var(--orange), var(--orange2));

color: #ffffff;
}

.btn-outline {
background: #ffffff;
color: #171717;

border-color: #ffffff;
}

/* trust text */

.trust-row {
color: #c4c4c4;
}

/* ==========================================================
   FINDER
========================================================== */

.finder-section {
margin-top: -62px;
}

.finder-card {
background: #ffffff;

border: 1px solid var(--light-line);

border-radius: 8px;

box-shadow: 0 18px 45px rgba(31, 38, 65, 0.14);

padding: 22px;
}

.finder-tabs {
margin-bottom: 20px;
}

.finder-tabs button {
background: #f0f1f4;
color: #454958;

border-radius: 5px;

padding: 12px 20px;
}

.finder-tabs button.active {
background: var(--orange);
color: #ffffff;
}

/* fields */

.finder-form label {
color: #777c88;
}

.finder-form select {
background: #ffffff;
color: #4a4f5d;

border: 1px solid #d4d7dd;

border-radius: 5px;

min-height: 50px;
}

.finder-form select:focus {
border-color: var(--orange);
}

/* ==========================================================
   GENERAL SECTIONS
========================================================== */

.section {
padding: 80px 0;
}

.section-dark {
background: #ffffff;
}

.section-heading h2 {
color: #171a26;
}

.section-heading a {
color: var(--orange);
font-weight: 500;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
}

/* ==========================================================
   CATEGORY CARDS
========================================================== */

.category-card {
min-height: 320px;
border-radius: 8px;
box-shadow: 0px 0px 12px 0px #0000001f;
padding: 18px 20px;
}

.category-card:hover {
transform: translateY(-6px);
border-color: rgba(255, 75, 11, 0.45);
box-shadow: 0 18px 40px rgba(31, 38, 65, 0.13);
}
.category-card span {
-webkit-text-stroke: 1px #ff4700;
font-family: "Manrope", sans-serif;
font-weight: 800;
font-size: 30px;
color: transparent;
line-height: 100%;
}

.category-card h3 {
color: #171a26;
font-weight: 700;
font-size: 34px;
line-height: 30px;
letter-spacing: 0%;
text-transform: uppercase;
margin-top: 17px;
}

.category-card p {
color: #171a2699;
font-weight: 400;
font-size: 14px;
line-height: 18px;
letter-spacing: 0%;
margin-top: 11px;
}

.category-card.accent p {
color: #ffffff;
max-width: 151px;
}

/* ==========================================================
   PRODUCTS
========================================================== */

.product-grid {
gap: 22px;
}

.product-card {
    background: #ffffff;
    border: 1px solid #171A261F;
    border-radius: 8px;
    box-shadow: 0px 0px 12px 0px #0000001F;
	overflow: hidden;
}
.product-image {
    max-height: 300px;
    background: #ffffff;
    border-bottom: 1px solid #171A261F;
}
.product-meta span {
    font-weight: 400;
    font-size: 12px;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    text-transform: uppercase;
    color: #171A26B2;
}
.stock.ok {
color: #6ED092;
}
.stock.out {
color: #6ED092;
}
/* placeholder */

.tire-placeholder {
border-color: #242424;

box-shadow: inset 0 0 0 8px #4b4b4b, 0 18px 30px rgba(0, 0, 0, 0.13);
}

/* sale */

.sale-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    min-height: 27px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 9px;
    border-radius: 5px;
    background: #ff4f0f;
    color: #ffffff;
    font-size: 10px;
    font-weight: 600;
}

/* product content */

.product-body {
padding: 20px;
}

.product-body h3 {
    color: #FF4700;
    font-family: Manrope;
    font-weight: 700;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
    margin: 10px 0px 14px 0px;
}

.price-row strong {
    color: #171a26;
    font-family: Manrope;
    font-weight: 700;
    font-size: 22px;
    line-height: 100%;
    letter-spacing: 0%;
}
.price-row del {
color: #969aa4;
}

.mini-cart {
    width: 100%;
    padding: 12px 20px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    background: #ff4700;
    color: #ffffff;
    text-decoration: none;
    transition: background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
    font-family: Poppins;
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
	    border: none;
}
.filter-options span {
    color: #171A26;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0%;
    vertical-align: middle;
}
/* ==========================================================
   BRANDS BAND
========================================================== */

.brands-band p {
color: #858995;
}

.brands-row {
color: #33384b;
}

/* ==========================================================
   FOOTER
========================================================== */

.footer {
background: #080808;
color: #ffffff;
background-image: url(/images/home/Footer.png);
background-repeat: no-repeat;
background-position: top;
background-size: cover;
padding-top: 80px;
}

.footer h4 {
color: #ff4700;
font-weight: 700;
font-size: 22px;
line-height: 100%;
letter-spacing: 1px;
text-transform: uppercase;
margin-bottom: 20px;
}
.footer p {
display: block;
color: #ffffffcc;
font-weight: 400;
font-size: 14px;
line-height: 100%;
letter-spacing: 0%;
margin: 20px 0px;
}
.footer a {
font-weight: 400;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
color: #ffffff;
display: flex;
flex-direction: column;
padding-bottom: 12px;
}
.footer-brand a {
    padding: 0px;
}
.footer a:hover {
color: var(--orange);
}

.footer-bottom {
border-top: 1px solid #ffffff33;
display: flex;
justify-content: space-between;
padding: 23px 0px;
}
.footer-address p {
color: #ffffff;
font-weight: 400;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
margin: 0px;
}
.footer-icons {
    display: flex;
    align-items: center;
    gap: 8px;
}
@media(max-width:767px){
	.footer h4 {
    font-size: 18px;
}
.footer a {
    font-size: 16px;
    margin-top: 6px;
}
.footer-address p {
    font-size: 16px;
}
.footer-grid {
    padding-bottom: 40px;
}	
.cta-card {
    padding: 36px 20px !Important;
}
}
/* ==========================================================
   SHOP PAGE
========================================================== */

.page-hero {
    padding: 80px 0px;
    background-image: url(/images/Shop-hero.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    display: flex;
    align-items: center;
    min-height: 426px;
    height: 100%;
}
.page-hero h1 {
    max-width: 606px;
    margin: 0;
    color: #ffffff;
    font-weight: 700;
    font-size: 58px;
    line-height: 60px;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.page-hero p {
    margin: 30px 0 0;
    color: #d2d2d2;
    font-weight: 400;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0%;
	    max-width: 606px;
    width: 100%;
}
.container.catalog-layout {
    display: grid;
    grid-template-columns: minmax(0, 350px) minmax(0, 1fr);
    gap: 30px;
}
.catalog-section {
padding: 80px 0px;
}

/* sidebar */

.filters {
    background: #ffffff;
    border: 1px solid #171A261F;
    border-radius: 7px;
    box-shadow: 0 8px 25px rgba(31, 38, 65, 0.07);
align-self: start;
overflow: auto;
}
.filter-title h3 {
    color: #171A26;
    font-family: Poppins;
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
}
.filter-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #171A261F;
}
form#filterForm > div, form#filterForm > details {
    padding: 20px;
	position:relative;
}


.search-box input {
border-radius: 10px 0 0 10px;
}
.search-box button {
    border: 0;
    background: var(--orange);
    width: 44px;
    border-radius: 0 5px 5px 0;
    position: absolute;
    right: 20px;
    height: 100%;
    max-height: 53px;
}
.filter-group {
    border-top: 1px solid #171A261F;
}
.filter-group summary {
    cursor: pointer;
    font-weight: 500;
    font-size: 16px;
    line-height: 21px;
    letter-spacing: 0%;
}
.filter-options {
max-height: 180px;
overflow: auto;
margin-top: 10px;
}
.filter-options label,
.stock-only {
display: flex;
gap: 8px;
align-items: center;
font-size: 12px;
color: #aaa;
margin: 9px 0;
}
.filter-options input,
.stock-only input {
width: auto;
}
.price-filter {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 8px;
margin-top: 10px;
}
.filter-mobile-btn {
display: none;
}
.catalog-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
    color: #171A26;
    font-size: 14px;
}

.catalog-main .product-grid {
grid-template-columns: repeat(3, 1fr);
}
.pagination {
margin-top: 30px;
}
.pagination nav {
display: flex;
justify-content: center;
}
.pagination svg {
width: 16px;
}
/* Main filter scrollbar */
.filters::-webkit-scrollbar,
.filter-options::-webkit-scrollbar {
    width: 6px;
}

.filters::-webkit-scrollbar-track,
.filter-options::-webkit-scrollbar-track {
    background: #171A261F;
    border-radius: 8px;
}

.filters::-webkit-scrollbar-thumb,
.filter-options::-webkit-scrollbar-thumb {
    background: #FF4700;
    border-radius: 8px;
}

/* Firefox */
.filters,
.filter-options {
    scrollbar-width: thin;
    scrollbar-color: #FF4700 #171A261F;
}

.filter-options label,
.stock-only {
color: #171A26;
}

/* filter inputs */

.filters input,
.filters select {
background: #ffffff;
color: #444957;

border: 1px solid #d5d8de;

border-radius: 5px;
}

/* catalog toolbar */
.catalog-toolbar select {
    color: #171A26;
    border: 1px solid #171A261F;
    padding: 8px 12px;
    font-weight: 400;
    font-size: 12px;
    line-height: 14px;
    letter-spacing: 0%;
    text-transform: capitalize;
}
/* empty */
img[src*="search-bar.png"] {
    filter: brightness(0) invert(1);
}
.empty-state {
background: #ffffff;
color: #777c88;

border-color: #cfd3db;
}
@media(max-width:1200px){
.catalog-main .product-grid {
    grid-template-columns: repeat(2, 1fr);
}		
}
@media(max-width:992px){
		.catalog-main .product-grid {
    grid-template-columns: repeat(1, 1fr);
}
}
@media(max-width:767px){
	.container.catalog-layout {
    grid-template-columns: 1fr;
}
.catalog-section{
	PADDING-BOTTOM:40px;
}
.page-hero h1 {
    max-width: 380px;
    font-size: 32px;
    line-height: 32px;
}
.page-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1;
	        max-height: 426px;
}
.page-hero > * {
    position: relative;
    z-index: 2;
}
.page-hero {
    background-position: right;
}
.page-hero p {
    max-width: 360px;
    margin-top: 12px;
    font-size: 16px;
    line-height: 18px;
}	
.filter-mobile-btn {
    display: block;
	margin-bottom: 40px;
	        display: flex;
        justify-content: center;
        align-items: center;
        gap: 6px;
		        background: var(--orange);
				color: #ffffff;
				        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        letter-spacing: 0%;
        text-transform: lowercase;
		        border: none;
        padding: 8px 20px;
        border-radius: 8px;
}
.catalog-toolbar {
    margin-bottom: 12px;
}
}
@media(max-width:520px){
.page-hero p {
    max-width: 360px;
}	
#productVariantSelect,
#productVariantSelect option {
    font-size: 8px !important;
}
}
/* ==========================================================
   PRODUCT DETAIL PAGE
========================================================== */

.product-page {
background: #ffffff;

color: var(--dark-text);
}

.breadcrumbs {
    color: #FF4700;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
	    margin-bottom: 12px;
}

.detail-image {
background: #f7f7f8;

border: 1px solid #e0e3e8;

border-radius: 8px;
}

.product-info {
color: var(--dark-text);
}

.product-info h1 {
    color: #171A26;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    font-weight: 700;
}
.product-info .eyebrow {
    display: inline-block;
    margin-bottom: 8px;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 2px;
}
.product-info .sku {
color: #8b909b;
font-weight: 400;
    font-size: 12px;
    line-height: 18px;
	    margin-top: 30px;
}

.product-info .big-price {
    color: #FF4700;
    font-family: Manrope;
    font-weight: 800;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
	    margin: 14px 0px 24px 0px;
}
.product-info p {
    color: #171A26B2;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
}
.product-option-picker label {
    display: block;
    margin-bottom: 8px;
    color: #171A26;
    font-size: 16px;
    font-weight: 500;
}
.product-option-picker {
    margin: 20px 0;
    padding: 16px;
    border: 1px solid #f7f7f7;
    border-radius: 14px;
    background: #f9f9f9;
}
section.product-page .spec-table {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: 1px solid #171A261F;
    border-radius: 7px;
    overflow: hidden;
    margin: 24px 0 18px 0px;
}
section.product-page  .spec-table > div:nth-child(odd) {
    border-right: 1px solid #171A261F;
}
.spec-table div:last-child {
    border-bottom: none;
}
.spec-table div {
border-color: #171A261F;
}
.product-page .availability {
    color: #A7D8B4;
    font-weight: 400;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
	margin-bottom: 40px;
	    display: flex;
    align-items: center;
}
section.product-page .spec-table span {
    color: #858A96;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0%;
}
section.product-page .spec-table b {
    color: #171A26;
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0%;
}
.product-page .buy-form input {
    background: #ffffff;
    color: #171A26;
    border: 1px solid #171A261F;
    font-weight: 400;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.product-page .btn-primary {
    background: #FF4700;
    color: #ffffff;
    padding: 14px 22px;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
}
.product-page .service-points {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-top: 18px;
    color: #171A26B2;
    font-size: 12px;
}
/* product description */

.description-card {
    background: #f9f9f9;
    border: 1px solid #171A261F;
    border-radius: 8px;
}
.description-card.product-tab-panel h2 {
    color: #FF4700;
    font-family: Manrope;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}
.description-card.product-tab-panel p {
    color: #202438;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    margin-top: 12px;
}
section.product-page-products {
    background: #FFEDE5;
    padding: 80px 0px;
}

@media(max-width:992px){
	.product-info h1 {
    font-weight: 700;
    font-size: 20px;
    line-height: 100%;
}
.product-info .sku {
    margin-top: 12px;
}
.product-info .big-price {
    font-size: 42px;
	    margin: 14px 0px 20px 0px;
}	
.product-info p {
    font-size: 14px;
    line-height: 20px;
}
.description-card.product-tab-panel h2 {
    font-size: 24px;
}
.product-detail {
    grid-template-columns: 1fr;
    gap: 14px;
}
.product-info {
    padding-top: 0;
}
.breadcrumbs {
    font-size: 12px;
}
.product-gallery-zoom {
    right: 0px;
    background: transparent;
}
}
@media(max-width:767px){
	section.product-page .spec-table {
    grid-template-columns: 1fr;
}
.product-tab-nav button {
    font-size: 16px !Important;
    padding: 10px 0px !Important;
    min-width: auto !Important;
}
.product-tab-nav {
    justify-content: space-between;
}
section.product-page  .spec-table > div:nth-child(odd) {
    border-right: none;
}
.product-info .big-price {
    font-size: 28px;
	line-height: 100%;
}
.big-price del {
    margin-right: 0px;
}
.product-tab-panel {
    padding: 20px;
}
.description-card.product-tab-panel h2 {
    font-size: 16px;
}
.description-card.product-tab-panel p {
    font-size: 14px;
    line-height: 18px;
    margin-top: 8px;
}
.product-page .availability {
    margin-bottom: 18px;
}
}
@media(max-width:440px){
	.product-page .btn-primary {
    display: block;
    width: 100%;
}
	
}
/* ==========================================================
   CART PAGE
========================================================== */

.cart-layout {
color: var(--dark-text);
}

.cart-item {
background: #ffffff;

border-color: #e2e4e8;
}

.order-box {
background: #ffffff;

color: var(--dark-text);

border: 1px solid #dfe2e8;

border-radius: 7px;

box-shadow: 0 8px 25px rgba(31, 38, 65, 0.07);
}

.order-box > div {
color: #666b77;
}

.order-total {
color: #202438 !important;
}

/* ==========================================================
   LOGIN / REGISTER
========================================================== */


/* ==========================================================
   TOAST
========================================================== */

.toast {
background: #ffffff;

color: var(--dark-text);

border: 1px solid #dedfe3;

border-left: 4px solid var(--orange);
}

/* ==========================================================
   RESPONSIVE
========================================================== */


@media (max-width: 1000px) {
.main-nav {
background: #ffffff;

border-bottom: 1px solid #e0e2e5;
}

.mobile-toggle {
color: #111111;
}

.hero {
min-height: auto;

padding: 70px 0 120px;
}

.hero-wheel-wrap {
min-height: 370px;
}

.finder-form {
grid-template-columns: 1fr 1fr;
}

.catalog-layout {
grid-template-columns: 1fr;
}
}

@media (max-width: 767px) {
.brands-title , .lc-category-section-head h2 , .lc-category-section-head h2 {
font-size: 24px !important;
        line-height: 28px  !important;
		margin: 0 0 12px  !important;
}
.category-card h3 {
    font-size: 24px;
    line-height: 28px;
	    margin-top: 12px;

}
a.category-card.card4.accent p {
    max-width: none;
}
.nav-wrap {
min-height: 72px;
}

.hero {
padding: 55px 0 100px;
}

.hero h1 {
font-size: 54px;
}

.hero-wheel-wrap {
min-height: 270px;
}

.hero-wheel {
width: 220px;
height: 220px;
}

.finder-card {
padding: 15px;
}

.finder-form {
grid-template-columns: 1fr;
}

.category-grid,
.product-grid,
.catalog-main .product-grid {
grid-template-columns: 1fr;
}


.cta-card {
padding: 28px;
}

.footer-grid {
grid-template-columns: 1fr;
}

.product-detail,
.cart-layout {
grid-template-columns: 1fr;
}
}

/* ==========================================================
   LA CEIBA V3 — CSS FOR NEW HEADER + NEW HOME BLADE
   IMPORTANT: keep this block at the VERY END of store.css
========================================================== */

/* ---------- shared wide container ---------- */
.site-container {
max-width: 1520px;
width: 100%;
margin: 0 auto;
padding:0px 15px;
}

/* ---------- orange promo bar ---------- */
.promo-bar {
width: 100%;
background: linear-gradient(90deg, #ff4700, #ff6a00);
color: #090909;
z-index: 102;
}

.promo-inner {
min-height: 38px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
font-weight: 500;
font-size: 12px;
line-height: 18px;
letter-spacing: 0%;
color: #ffffff;
padding: 10px 15px;
}

/* ---------- dark information strip ---------- */
.utility-bar {
width: 100%;
background: #171a26;
color: #fff;
position: relative;
z-index: 101;
}

.utility-inner {
min-height: 38px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
padding:0px 15px;
}

.utility-items {
display: flex;
align-items: center;
gap: 30px;
font-weight: 400;
font-size: 10px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
color: #ffffff;
}

.utility-account {
display: flex;
align-items: center;
gap: 6px;
white-space: nowrap;
font-weight: 400;
font-size: 10px;
line-height: 100%;
letter-spacing: 0%;
}

.utility-account a {
color: #ff4700;
font-weight: 600;
}

/* ---------- new white header ---------- */
.site-header {
position: sticky;
top: 0;
z-index: 100;
width: 100%;
background: #ffffff;
border-bottom: 1px solid #e2e5eb;
box-shadow: 0 5px 18px rgba(24, 29, 48, 0.07);
backdrop-filter: none;
    padding: 0px 15px;
}

.main-header {
min-height: 94px;
display: flex;
align-items: center;
gap: 40px;
}

/* REAL LOGO: this prevents the original large image taking the whole screen */
.header-logo {
display: flex;
align-items: center;
overflow: hidden;
}

.header-logo img {
    /* display: block; */
    /* width: 100%; */
    /* height: 100%; */
    /* max-width: 190px; */
    max-height: 76px;
    object-fit: contain;
}

/* new menu */
.main-header .main-nav {
display: flex;
align-items: center;
gap: 24px;
margin-left: 0;
flex-shrink: 0;
}

.main-header .main-nav a {
color: #252a3b;
white-space: nowrap;
font-weight: 600;
font-size: 14px;
line-height: 100%;
letter-spacing: 0%;
}


/* header search */
.header-search {
flex: 1 1 380px;
min-width: 220px;
max-width: 520px;
margin-left: auto;
position: relative;
}

.header-search input {
display: block;
width: 100%;
height: 48px;
border: 1px solid #0000001f;
border-radius: 8px;
background: #fff;
outline: 0;
padding: 14px 14px 14px 44px;
font-weight: 400;
font-size: 14px;
line-height: 16px;
}

.header-search input:focus {
border-color: #ff4b0b;
box-shadow: 0 0 0 3px rgba(255, 75, 11, 0.1);
}

.header-search button {
position: absolute;
top: 14px;
left: 14px;
width: 20px;
height: 20px;
border: 0;
border-radius: 4px;
background: transparent;
cursor: pointer;
}

/* account / cart */
.main-header .header-actions {
display: flex;
align-items: center;
gap: 20px;
color: #24293b;
flex-shrink: 0;
}

.account-link,
.header-cart {
display: inline-flex;
align-items: center;
color: #24293b;
font-weight: 600;
font-size: 12px;
line-height: 18px;
letter-spacing: 0%;
gap: 4px;
}
a.header-cart {
gap: 6px;
}
.header-cart img {
width: 20px;
height: 20px;
object-fit: contain;
}
.header-cart strong {
display: grid;
place-items: center;
min-width: 24px;
height: 24px;
padding: 0 6px;
border-radius: 50%;
background: #ff4700;
color: #fff;
font-weight: 900;
font-size: 10px;
line-height: 15px;
letter-spacing: 0%;
text-align: center;
}

.logout-link {
border: 0;
background: transparent;
color: #686d7a;
cursor: pointer;
font-size: 12px;
}

.mobile-toggle {
display: none;
}

/* ==========================================================
   NEW HOME HERO
========================================================== */
.lc-hero {
position: relative;
width: 100%;
min-height: 520px;
display: flex;
align-items: center;
overflow: hidden;
background: radial-gradient(
circle at 76% 45%,
rgba(255, 75, 11, 0.28),
transparent 31%
),
linear-gradient(112deg, #070707 0%, #111 56%, #351307 100%);
color: #fff;
}

.lc-hero::after {
content: "";
position: absolute;
right: -190px;
bottom: -360px;
width: 620px;
height: 620px;
border: 100px solid rgba(255, 75, 11, 0.06);
border-radius: 50%;
pointer-events: none;
}

.lc-hero-inner {
position: relative;
z-index: 2;
display: grid;
grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
align-items: center;
gap: 70px;
padding-top: 60px;
padding-bottom: 95px;
}

.lc-kicker {
display: inline-block;
margin-bottom: 12px;
color: #ff5a17;
font-size: 12px;
font-weight: 900;
letter-spacing: 2px;
}

.lc-hero-copy h1 {
margin: 0;
max-width: 750px;
color: #fff;
font-family: "Barlow Condensed", Inter, Arial, sans-serif;
font-size: clamp(58px, 6vw, 96px);
line-height: 0.92;
text-transform: uppercase;
}

.lc-hero-copy h1 span {
display: block;
color: #ff4b0b;
}

.lc-hero-copy p {
max-width: 640px;
margin: 22px 0 0;
color: #d2d2d2;
font-size: 17px;
line-height: 1.7;
}

.lc-hero-actions {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 28px;
}

.lc-btn {
min-height: 50px;
padding: 0 24px;
border-radius: 5px;
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: 900;
transition: 0.25s ease;
}

.lc-btn:hover {
transform: translateY(-2px);
}

.lc-btn-orange {
background: linear-gradient(135deg, #ff4b0b, #ff6a00);
color: #fff;
}

.lc-btn-white {
background: #fff;
color: #171717;
}

.lc-btn-black {
background: #090909;
color: #fff;
}

/* HERO LOGO: this is the other rule that stops the giant full-page logo */
.lc-hero-logo {
width: 100%;
max-width: 560px;
justify-self: end;
display: flex;
align-items: center;
justify-content: center;
}

.lc-hero-logo img {
display: block;
width: 100%;
height: auto;
max-width: 560px;
max-height: 390px;
object-fit: contain;
filter: drop-shadow(0 28px 32px rgba(0, 0, 0, 0.42));
}

/* ==========================================================
   NEW FINDER
========================================================== */
.vehicle-finder-wrap {
position: relative;
z-index: 10;
margin-top: -56px;
}

.finder-new-tabs {
display: flex;
align-items: stretch;
overflow-x: auto;
border-bottom: 1px solid #dde1e7;
}

.finder-new-tabs button,
.finder-new-tabs a {
min-width: 175px;
min-height: 52px;
padding: 0 22px;
display: inline-flex;
align-items: center;
justify-content: center;
border: 0;
border-right: 1px solid #dde1e7;
background: #f3f4f7;
color: #2a2f40;
font-weight: 800;
cursor: pointer;
white-space: nowrap;
}

.finder-new-tabs button.active {
background: #ff4b0b;
color: #fff;
}

.finder-new-form {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr)) 160px;
gap: 18px;
padding: 28px;
}

.finder-new-form label {
display: block;
margin-bottom: 7px;
color: #767b88;
font-size: 10px;
font-weight: 900;
letter-spacing: 0.8px;
text-transform: uppercase;
}

.finder-new-form select {
width: 100%;
height: 52px;
padding: 0 14px;
border: 1px solid #d5d9e1;
border-radius: 5px;
background: #fff;
color: #4b5060;
outline: 0;
}

.finder-new-form select:focus {
border-color: #ff4b0b;
}

.finder-go {
align-self: end;
height: 52px;
padding: 0 20px;
border: 0;
border-radius: 5px;
background: linear-gradient(135deg, #ff4b0b, #ff6a00);
color: #fff;
font-weight: 900;
cursor: pointer;
}

/* ==========================================================
   NEW HOME SECTIONS
========================================================== */
.lc-section {
padding: 84px 0;
}

.lc-products-section {
background: #fff;
}

.lc-section-title {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 24px;
margin-bottom: 32px;
}

.lc-section-title span {
color: #ff4b0b;
font-size: 10px;
font-weight: 900;
letter-spacing: 2px;
}

.lc-section-title h2 {
margin: 5px 0 0;
color: #202438;
font-family: "Barlow Condensed", Inter, Arial, sans-serif;
font-size: 48px;
line-height: 1;
text-transform: uppercase;
}

.lc-section-title > a {
color: #ff4b0b;
font-weight: 800;
}

.lc-category-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 20px;
}

.lc-category {
min-height: 270px;
padding: 28px;
background: #fff;
color: #252a3c;
border: 1px solid #e0e3e9;
border-radius: 8px;
box-shadow: 0 8px 26px rgba(31, 38, 65, 0.06);
transition: 0.25s ease;
}

.lc-category:hover {
transform: translateY(-6px);
border-color: rgba(255, 75, 11, 0.45);
box-shadow: 0 18px 40px rgba(31, 38, 65, 0.12);
}

.category-icon {
width: 62px;
height: 62px;
margin-bottom: 34px;
display: grid;
place-items: center;
border-radius: 50%;
background: #111;
color: #ff4b0b;
font-size: 27px;
}

.lc-category h3 {
margin: 0;
color: inherit;
font-family: "Barlow Condensed", Inter, Arial, sans-serif;
font-size: 33px;
text-transform: uppercase;
}

.lc-category p {
min-height: 52px;
color: #737887;
font-size: 13px;
}

.lc-category > span {
color: #ff4b0b;
font-size: 12px;
font-weight: 900;
}

.category-orange {
background: linear-gradient(135deg, #ff4b0b, #ff6a00);
color: #fff;
border-color: transparent;
}

.category-orange p,
.category-orange > span {
color: #fff;
}

.category-orange .category-icon {
background: #fff;
color: #111;
}

/* ---------- brands ---------- */
.lc-brands {
padding: 38px 0;
background: #f2f4f8;
border-top: 1px solid #dde1e7;
border-bottom: 1px solid #dde1e7;
}

.lc-brands p {
margin: 0 0 20px;
text-align: center;
color: #858a96;
font-size: 10px;
letter-spacing: 2px;
}

.lc-brand-list {
display: flex;
justify-content: space-around;
align-items: center;
flex-wrap: wrap;
gap: 30px;
color: #303548;
font-weight: 900;
}

/* ---------- orange CTA ---------- */
.lc-bottom-cta {
padding: 78px 0;
background: #fff;
}

.lc-bottom-cta-inner {
padding: 42px 50px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 30px;
background: linear-gradient(120deg, #ff4b0b, #ff7428);
border-radius: 10px;
color: #fff;
box-shadow: 0 20px 45px rgba(255, 75, 11, 0.22);
}

.lc-bottom-cta h2 {
margin: 5px 0;
color: #fff;
font-family: "Barlow Condensed", Inter, Arial, sans-serif;
font-size: 46px;
text-transform: uppercase;
}

.lc-bottom-cta p {
margin: 7px 0 0;
max-width: 750px;
color: #fff;
}

/* ==========================================================
   NEW FOOTER CLASSES
========================================================== */
.tire-flordia {
margin-top: 30px;
}

.footer-logo {
display: inline-flex;
width: 220px;
max-width: 100%;
height: 125px;
align-items: center;
overflow: hidden;
margin-bottom: 16px;
}

.footer-logo img {
display: block;
width: 100%;
height: 100%;
max-width: 220px;
max-height: 125px;
object-fit: contain;
}

.footer-contact-highlight {
padding-left: 8px;
border-left: 2px solid #ff4700;
}

.footer-contact-highlight strong {
display: block;
color: #ffffff80;
font-weight: 600;
font-size: 12px;
line-height: 14px;
letter-spacing: 0%;
}

.footer-contact-highlight a {
color: #ff4700;
font-family: Manrope;
font-weight: 800;
font-size: 20px;
line-height: 100%;
letter-spacing: 0%;
margin: 14px 0px 0px 0px;
}

/* ==========================================================
   RESPONSIVE NEW HEADER / HOME
========================================================== */

@media (max-width: 1080px) {
.utility-items span:nth-child(2),
.utility-items span:nth-child(3) {
display: none;
}

.main-header {
min-height: 82px;
position: relative;
}

/*.header-logo img {
max-width: 155px;
max-height: 64px;
}*/

.mobile-toggle {
display: block;
order: 8;
margin-left: 0;
border: 0;
background: transparent;
color: #111;
font-size: 24px;
cursor: pointer;
}

.main-header .main-nav {
display: none;
position: absolute;
left: 0;
right: 0;
top: 100%;
z-index: 120;
padding: 20px;
flex-direction: column;
align-items: stretch;
background: #fff;
border-top: 1px solid #e4e6eb;
border-bottom: 1px solid #e4e6eb;
box-shadow: 0 16px 30px rgba(0, 0, 0, 0.1);
}

.main-header .main-nav.open {
display: flex;
}

.main-header .header-actions {
display: flex;
}

.lc-hero-inner {
grid-template-columns: 1fr 0.75fr;
gap: 30px;
}

.lc-hero-logo img {
max-height: 310px;
}

.finder-new-form {
grid-template-columns: 1fr 1fr;
}

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

@media (max-width: 767px) {

.promo-inner {
  justify-content: space-between;
text-align: center;
    font-size: 12px;
}

.promo-center,
.promo-inner > span:first-child {
display: none;
}

.utility-bar {
display: none;
}

.main-header {
    min-height: 72px;
    padding: 7px 0 10px;
    flex-wrap: wrap;
    gap: 10px;
    display: flex;
    flex-direction: row;
    justify-content: flex-end
}


.mobile-toggle {
margin-left: auto;
}

.account-link span,
.cart-text,
.logout-link {
display: none;
}

.header-search {
order: 20;
flex: 0 0 100%;
width: 100%;
max-width: none;
}

.lc-hero {
min-height: auto;
}

.lc-hero-inner {
grid-template-columns: 1fr;
padding-top: 55px;
padding-bottom: 95px;
}

.lc-hero-copy h1 {
font-size: 56px;
}

.lc-hero-logo {
display: none;
}

.vehicle-finder-wrap {
margin-top: -38px;
}
.mobile-toggle {
    margin-left: 0;
}
.finder-new-tabs button,
.finder-new-tabs a {
min-width: 150px;
}

.finder-new-form {
grid-template-columns: 1fr;
padding: 20px;
}

.lc-category-grid {
grid-template-columns: 1fr;
}

.lc-section-title {
align-items: flex-start;
flex-direction: column;
}

.lc-section-title h2 {
font-size: 39px;
}

.lc-bottom-cta-inner {
display: block;
padding: 30px;
}

.lc-bottom-cta-inner .lc-btn {
margin-top: 20px;
}

.footer-logo {
width: 190px;
height: 105px;
}
}

/* ==========================================================
   LA CEIBA CART - FINAL
========================================================== */

/* ==========================================================
   HERO
========================================================== */

.cart-page-hero {
    background-image: url("/images/home/Cart-background.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    display: flex;
    align-items: center;
    height: 100%;
    PADDING: 80PX 0PX;
}
.cart-breadcrumb {
display: flex;

align-items: center;

gap: 8px;

margin-bottom: 14px;

color: #9da2ab;

font-size: 12px;
}

.cart-breadcrumb a {
color: #d4d7dc;

text-decoration: none;
}

.cart-breadcrumb a:hover {
color: #ff6530;
}

.cart-hero-content {
display: flex;

align-items: center;

justify-content: space-between;

gap: 25px;
}



.cart-hero-content h1 {
    margin: 0;
    color: #ffffff;
    font-weight: 700;
    font-size: 80px;
    line-height: 84px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.cart-hero-content p {
    margin: 30px 0 0;
    color: #d2d2d2;
    font-weight: 400;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0%;
    max-width: 606px;
    width: 100%;
}
.cart-secure-note img {
    height: 100%;
    width: 100%;
    max-width: 38px;
    max-height: 38px;
}
.cart-helpss img {
    height: 100%;
    width: 100%;
    max-width: 50px;
    max-height: 50px;
}
.cart-help img {
    height: 100%;
    width: 100%;
    max-width: 34px;
    max-height: 34px;
}
.cart-helpl {
    display: flex;
    align-items: center;
    gap: 9px;
}
/* ==========================================================
   PAGE
========================================================== */

.cart-page-section {
padding:80PX 0PX;
}

/* ==========================================================
   MESSAGES
========================================================== */

.cart-message {
display: flex;

align-items: center;

gap: 10px;

margin-bottom: 18px;

padding: 12px 15px;

border-radius: 8px;

font-size: 12px;
}

.cart-message > span {
width: 23px;
height: 23px;

min-width: 23px;

display: grid;

place-items: center;

border-radius: 50%;

font-weight: 900;
}

.cart-message.success {
background: #edf9f2;

border: 1px solid #c8e8d4;

color: #24734a;
}

.cart-message.error {
background: #fff1f2;

border: 1px solid #efc9cd;

color: #b63843;
}

/* ==========================================================
   MAIN CART GRID
========================================================== */

.cart-page-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr)
minmax(531px, 390px);
    gap: 32px;
    align-items: start;
}

.cart-products-column {
min-width: 0;
}

/* ==========================================================
   CART HEADER
========================================================== */

.cart-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 40px;
}

.cart-panel-header h2 {
    margin: 0;
    color: #171A26;
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
}

.cart-panel-header p {
    margin: 8px 0 0;
    color: #171A26B2;
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
}
.continue-shopping-link {
    flex-shrink: 0;
    color: #171A26;
    text-decoration: none;
    font-weight: 400;
    font-size: 18px;
    line-height: 101%;
    letter-spacing: 0%;
    display: flex;
    align-items: center;
    gap: 4px;
}

.continue-shopping-link:hover {
color: #ff4b0b;
}

/* ==========================================================
   CART PRODUCT LIST
========================================================== */



.cart-product-card {
    display: grid;
    grid-template-columns: 130px
minmax(0, 1fr);
    gap: 14px;
    padding: 10px 20px 10px 10px;
    background: #ffffff;
    border: 2px solid #171A261F;
    border-radius: 12px;
}

.cart-product-card:hover {
border-color: #cfd4dc;

box-shadow: 0 8px 22px rgba(30, 38, 60, 0.06);
}

/* ==========================================================
   PRODUCT IMAGE
========================================================== */

.cart-product-image {
    width: 100%;
    height: 100%;
    max-width: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid #171A261F;
    border-radius: 6.19px;
}

.cart-product-image img {
width: 100%;
height: 100%;

display: block;

object-fit: contain;

padding: 5px;
}

.cart-no-image {
width: 100%;
height: 100%;

display: flex;

align-items: center;

justify-content: center;

padding: 8px;

color: #9ca2ad;

font-size: 9px;

font-weight: 700;

text-align: center;

text-transform: uppercase;
}

/* ==========================================================
   CART PRODUCT INFO
========================================================== */

.cart-product-info {
min-width: 0;
}

.cart-product-top {
display: flex;

align-items: flex-start;

justify-content: space-between;

gap: 18px;

padding-bottom: 14px;
}

.cart-product-top h3 {
    margin: 0;
    color: #171A26;
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0px;
    text-transform: uppercase;
}

.cart-product-sku {
    margin-top: 8px;
    color: #5D5F67;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0%;
}
.cart-product-sku span {
color: #626976;

font-weight: 700;
}

/* ITEM TOTAL */

.cart-line-total {
flex-shrink: 0;

text-align: right;
}

.cart-line-total span,
.cart-unit-price > span,
.cart-field-label {
display: block;

margin-bottom: 5px;

color: #969ca7;

font-size: 8px;

font-weight: 800;

letter-spacing: 0.5px;

text-transform: uppercase;
}

.cart-line-total strong {
color: #1d2430;

font-size: 16px;

font-weight: 900;
}

/* ==========================================================
   PRODUCT LOWER ROW
========================================================== */

.cart-product-bottom {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    justify-content: space-between;
}

.cart-unit-price strong {
    color: #FF4700;
    font-family: Manrope;
    font-weight: 700;
    font-size: 20px;
    line-height: 26px;
    letter-spacing: 0%;
}

/* ==========================================================
   QUANTITY
========================================================== */

.cart-quantity-section {
min-width: 0;
}

.cart-qty-form {
display: inline-flex;

align-items: center;

transition: opacity 0.18s ease;
}

.cart-qty-form.is-updating {
opacity: 0.55;

pointer-events: none;
}

.cart-qty-control {
    display: flex;
    align-items: stretch;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #FF4700;
    border-radius: 8px;
}

.qty-button {
    height: 100%;
    padding: 0;
    border: 0;
    color: #FF4700;
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    width: 24px;
    background: transparent;
}


.qty-button:disabled {
cursor: wait;
}

.cart-qty-control input {
    border: 0;
    outline: 0;
    background: #ffffff;
    color: #000000;
    text-align: center;
    font-size: 20px;
    font-weight: 500;
	    width: 40px;
}

.cart-qty-control input::-webkit-inner-spin-button,
.cart-qty-control input::-webkit-outer-spin-button {
margin: 0;

-webkit-appearance: none;
}

.cart-stock-text {
    display: block;
    margin-top: 6px;
    color: #6ED092;
    font-size: 12px;
    font-weight: 600;
}

/* ==========================================================
   REMOVE
========================================================== */

.cart-remove-section {
display: flex;

align-items: flex-end;

justify-content: flex-end;
}

.cart-remove-button {
    background: transparent;
    font-weight: 750;
    cursor: pointer;
    border: 1px solid #FF47001F;
    height: 40px;
    width: 40px;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cart-remove-button img {
    max-width: 15px;
    width: 100%;
}
button.cart-remove-button span {
    margin: 0px;
    padding: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cart-remove-button:hover {
text-decoration: underline;
}

/* ==========================================================
   ORDER SUMMARY
========================================================== */

.cart-summary {
position: sticky;

top: 95px;
}

.cart-summary-inner {
    position: relative;
    overflow: hidden;
    padding: 30px;
    background: #ffffff;
    border: 2px solid #171A261F;
    border-radius: 12px;
}

.cart-summary-heading {
margin-bottom: 23px;
}

.cart-summary-heading > span {
    display: block;
    color: #FF4700;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.cart-summary-heading h2 {
    margin: 0;
    color: #171A26;
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
}

/* ==========================================================
   SUMMARY PRODUCTS SCROLL AREA
========================================================== */

.cart-summary-products-wrap {
    position: relative;
    max-height: 330px;
    margin: 0 0 18px;
    overflow-y: auto;
    overflow-x: hidden;
    border-top: 2px solid #0000001F;
    border-bottom: 2px solid #0000001F;
    scrollbar-width: thin;
    scrollbar-color: #FF4700 transparent;
}

.cart-summary-products-wrap::-webkit-scrollbar {
width: 5px;
}

.cart-summary-products-wrap::-webkit-scrollbar-track {
background: transparent;
}

.cart-summary-products-wrap::-webkit-scrollbar-thumb {
background: #FF4700;
border-radius: 20px;
}

.cart-summary-products {
margin: 0;
border: 0;
}

/* ==========================================================
   SUMMARY PRODUCT
========================================================== */

.cart-summary-product {
    display: FLEX;
    align-items: center;
    gap: 10px;
    padding: 18px 0px;
}

.cart-summary-product:last-child {
border-bottom: 0;
}

/* SUMMARY IMAGE */

.cart-summary-thumb {
    max-width: 100px;
    height: 100%;
    width: 100%;
    max-height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 0.56px solid #171A261F;
    border-radius: 3.44px;
    background: #FFFFFF;
}

.cart-summary-thumb img {
width: 100%;
height: 100%;

display: block;

object-fit: contain;

padding: 3px;
}

.cart-summary-thumb-placeholder {
width: 100%;
height: 100%;

display: flex;

align-items: center;

justify-content: center;

padding: 4px;

color: #a0a6af;

font-size: 7px;

font-weight: 700;

text-align: center;

text-transform: uppercase;
}

/* DETAILS */

.cart-summary-product-main {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.cart-summary-product-name {
    overflow: hidden;
    color: #171A26;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-family: Manrope;
    font-weight: 700;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0px;
    text-transform: uppercase;
}

.cart-summary-product-sku {
    margin-top: 4px;
    color: #5D5F67;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0%;
}

/* QTY × PRICE */

.cart-summary-product-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    white-space: nowrap;
    color: #171A26;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}

/* SUMMARY ITEM TOTAL */
.cart-summary-product-flex {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
	    margin-top: 8px;
}
.cart-summary-product-price {
    align-self: center;
    color: #FF4700;
    text-align: right;
    white-space: nowrap;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

/* ==========================================================
   SUMMARY TOTAL ROWS
========================================================== */

.cart-summary-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
	    padding-bottom: 12px;
}
.cart-summary-row span {
    color: #171A26;
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.cart-summary-row strong {
    color: #171A26;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}
.cart-summary-row.muted {
    padding-bottom: 12px;
}
.cart-summary-divider {
    height: 2px;
    margin: 12px 0 15px;
    background: #0000001F;
}

/* ==========================================================
   ESTIMATED TOTAL
========================================================== */

.cart-summary-total {
display: flex;

align-items: flex-end;

justify-content: space-between;

gap: 15px;

margin-bottom: 24px;
}

.cart-summary-total > span {
    display: flex;
    flex-direction: column;
    color: #171A26;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.cart-summary-total small {
    display: none;
}

.cart-summary-total > strong {
    color: #FF4700;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

/* ==========================================================
   CHECKOUT BUTTON
========================================================== */

.cart-checkout-button {
    width: 100%;
    min-height: 44px;
    padding: 0 18px;
    display: flex;
    border-radius: 8px;
    align-items: center;
    justify-content: center;
    border: 0;
    background: #FF4700;
    color: #ffffff;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.cart-checkout-button:hover {
color: #ffffff;

transform: translateY(-1px);

box-shadow: 0 10px 24px rgba(255, 75, 11, 0.25);
}

.cart-checkout-button:disabled {
cursor: not-allowed;

opacity: 0.58;

transform: none;

box-shadow: none;
}

/* ==========================================================
   SECURITY NOTE
========================================================== */

.cart-secure-note {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 24px;
    border-radius: 7px;
}

.cart-secure-note > span {
color: #1d9758;

font-size: 14px;

font-weight: 900;
}

.cart-secure-note div {
display: flex;

flex-direction: column;
}

.cart-secure-note strong {
    color: #11CC00;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.cart-secure-note small {
    color: #171A2680;
    font-weight: 400;
    font-size: 12px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

/* ==========================================================
   HELP BOX
========================================================== */

.cart-help-box {
    margin-top: 30px;
    padding: 20px;
    background: #171A26;
    border-radius: 12px;
    backdrop-filter: blur(70px);
}
.cart-help-flex {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
}
.cart-help-box strong {
    display: block;
    color: #FFFFFFB2;
    font-weight: 500;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.cart-help-box span {
    display: block;
    color: #FFFFFF;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    text-transform: capitalize;
	display: flex;
    align-items: center;
}
.cart-helpssx span {
    margin-top: 8px;
}
.cart-help {
    backdrop-filter: blur(70px);
    background: #FFFFFF1A;
    padding: 8px;
    border-radius: 70px;
    gap: 6px;
    display: flex;
    align-items: center;
}
.cart-help-box a {
    display: inline-block;
    color: #FFFFFF;
    text-decoration: none;
    font-weight: 500;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    display: flex;
    gap: 8px;
    align-items: center;
}
.cart-product-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
/* ==========================================================
   SHIMMER
========================================================== */

.cart-summary-shimmer {
position: absolute;

inset: 0;

z-index: 50;

display: none;

padding: 23px;

background: rgba(255, 255, 255, 0.94);

backdrop-filter: blur(1px);
}

.cart-summary-inner.is-loading .cart-summary-shimmer {
display: block;
}

.summary-shimmer-product {
display: grid;

grid-template-columns:
58px
1fr
70px;

align-items: center;

gap: 12px;

padding: 13px 0;

border-bottom: 1px solid #edf0f3;
}

.summary-shimmer-image {
width: 58px;
height: 58px;

border-radius: 9px;

background: #edf0f3;
}

.summary-shimmer-info {
display: grid;

gap: 8px;
}

.summary-shimmer-line {
height: 10px;

border-radius: 5px;

background: #edf0f3;
}

.summary-shimmer-line.title {
width: 90%;
}

.summary-shimmer-line.short {
width: 58%;
}

.summary-shimmer-price {
width: 65px;
height: 11px;

border-radius: 5px;

background: #edf0f3;
}

.summary-shimmer-total {
width: 100%;

height: 11px;

margin-top: 18px;

border-radius: 5px;

background: #edf0f3;
}

.summary-shimmer-total.small {
width: 68%;
}

.summary-shimmer-image,
.summary-shimmer-line,
.summary-shimmer-price,
.summary-shimmer-total {
position: relative;

overflow: hidden;
}

.summary-shimmer-image::after,
.summary-shimmer-line::after,
.summary-shimmer-price::after,
.summary-shimmer-total::after {
content: "";

position: absolute;

top: 0;
bottom: 0;

left: -110%;

width: 100%;

background: linear-gradient(
90deg,
transparent,
rgba(255, 255, 255, 0.9),
transparent
);

animation: cartSummaryShimmer 0.95s infinite;
}

@keyframes cartSummaryShimmer {
100% {
left: 110%;
}
}

/* ==========================================================
   EMPTY CART
========================================================== */

.cart-empty-state {
    max-width: 570px;
    margin: 25px auto;
    padding: 55px 30px;
    background: #ffffff;
    border: 1px solid #171A261F;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 7px 25px rgba(30, 38, 60, 0.05);
}

.cart-empty-icon {
margin-bottom: 15px;

font-size: 38px;
}

.cart-empty-state h2 {
    margin: 0;
    color: #171A26;
    font-size: 24px;
}

.cart-empty-state p {
    margin: 8px 0 21px;
    color: #171A26;
    font-size: 16px;
    font-weight: 400;
}

.cart-empty-button {
    text-decoration: none;
    width: 100%;
    background: #FF4700;
    color: #FFFFFF;
    padding: 20px;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: background .2s ease;
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
    display: flex;
    justify-content: center;
}

/* ==========================================================
   RESPONSIVE - TABLET
========================================================== */



@media (max-width: 1024px) {
.cart-product-bottom {
grid-template-columns:
1fr
1.4fr;
}
.cart-page-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    align-items: start;
}
.cart-remove-section {
grid-column: 1 / -1;

justify-content: flex-start;
}
}

/* ==========================================================
   RESPONSIVE - STACK SUMMARY
========================================================== */

@media (max-width: 767px) {
.cart-hero-content h1 {
    font-size: 32px;
    line-height: 32px;
}
.cart-hero-content p {
    margin-top: 12px;
    font-size: 16px;
    line-height: 18px;
}
.cart-panel-header h2 {
    font-size: 20px;
}
.cart-panel-header p {
    font-size: 14px;
}
.continue-shopping-link {
    font-size: 14px;
}
.cart-product-top h3 {
    font-size: 18px;
}
.cart-unit-price strong {
    font-size: 20px;
}
.cart-qty-control input {
    max-width: 40px;
}

button.cart-remove-button img {
    width: 75%;
}
.cart-unit-price strong {
    font-size: 18px;
    line-height: 24px;
}
.cart-summary-heading h2 {
    font-size: 24px;
}
.cart-summary-heading {
    margin-bottom: 16px;
}
.cart-summary-product-meta {
    font-size: 16px;
}
.cart-summary-product-price {
    font-size: 18px;
}
.cart-help-box span {
    font-size: 16px;
}
.cart-summary-products-wrap {
    border-top: 1px solid #0000001F;
    border-bottom: 1px solid #0000001F;
}
a.continue-shopping-link img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    max-width: 20px;
    max-height: 11px;
}
.cart-page-section {
    padding: 40PX 0PX;
}
.cart-qty-control {
    height: 32px;
}
.cart-qty-control input {
    font-size: 16px;
}
}
@media(max-width:520px){	
	.cart-product-card {
    grid-template-columns: 1fr;
}
.cart-product-image {
    max-width: 100px;
}
.cart-product-card {
    grid-template-columns: 100px
minmax(0, 1fr);
PADDING:10px;
}
.cart-product-top h3 {
    font-size: 16px;
}
.cart-summary-inner {
    padding: 20px;
}
.cart-help-flex {
    flex-direction: column;
    gap: 8px;
}
.cart-help {
    max-width: 200px;
}
.cart-checkout-button {
    min-height: 40px;
}
}

/* ==========================================================


/* ==========================================================
   CART REMOVE CONFIRMATION MODAL
========================================================== */

body.cart-modal-open {
overflow: hidden;
}

.cart-remove-modal {
position: fixed;

inset: 0;

z-index: 99999;

display: flex;

align-items: center;

justify-content: center;

padding: 20px;

opacity: 0;

visibility: hidden;

pointer-events: none;

transition: opacity 0.2s ease, visibility 0.2s ease;
}

.cart-remove-modal.is-open {
opacity: 1;

visibility: visible;

pointer-events: auto;
}

.cart-remove-modal-overlay {
position: absolute;

inset: 0;

background: rgba(15, 18, 24, 0.62);

backdrop-filter: blur(3px);
}

.cart-remove-modal-dialog {
position: relative;

z-index: 2;

width: 100%;

max-width: 420px;

padding: 30px 28px 26px;

background: #ffffff;

border: 1px solid #e2e5e9;

border-radius: 14px;

text-align: center;

box-shadow: 0 25px 70px rgba(0, 0, 0, 0.22);

transform: translateY(12px) scale(0.98);

transition: transform 0.22s ease;
}

.cart-remove-modal.is-open .cart-remove-modal-dialog {
transform: translateY(0) scale(1);
}

.cart-remove-modal-close {
    position: absolute;
    top: 11px;
    right: 13px;
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 700px;
    background: #ff4700;
    color: #ffffff;
    font-size: 20px;
    cursor: pointer;
    transition: transform 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
}

.cart-remove-modal-close:hover {
    transform: rotate(90deg) scale(1.12);
    background: #e63f00;
    box-shadow: 0 5px 15px rgba(255, 71, 0, 0.3);
}


.cart-remove-modal-icon {
    width: 52px;
    height: 52px;
    margin: 0 auto 17px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #171A261A;
    color: #FF4700;
}

.cart-remove-modal-icon span {
font-size: 24px;

font-weight: 900;
}

.cart-remove-modal-dialog h3 {
    margin: 0;
    color: #171A26;
    font-size: 24px;
    font-weight: 700;
}

.cart-remove-modal-dialog p {
    margin: 10px auto 0;
    max-width: 330px;
    color: #171A26B2;
    font-size: 14px;
    line-height: 1.6;
}

.cart-remove-modal-dialog p strong {
    font-weight: 600;
    color: #171A26;
}

.cart-remove-modal-actions {
display: grid;

grid-template-columns: 1fr 1fr;

gap: 10px;

margin-top: 24px;
}

.cart-remove-modal-cancel, .cart-remove-modal-confirm {
    min-height: 43px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}
button.cart-remove-modal-cancel:hover {
    background: #FF4700;
    color: #fff;
}
.cart-remove-modal-cancel {
    border: 1px solid #171A261F;
    background: #ffffff;
    color: #171A26B2;
}

.cart-remove-modal-confirm {
    background: #FF4700;
    color: #ffffff;
    border: none;
}


.cart-remove-modal-confirm:disabled {
opacity: 0.65;

cursor: wait;

transform: none;
}

@media (max-width: 480px) {
.cart-remove-modal-dialog {
padding: 27px 20px 21px;
}

.cart-remove-modal-actions {
grid-template-columns: 1fr;
}
}



/* ==========================================================
   LA CEIBA CHECKOUT - FINAL
========================================================== */

/* ==========================================================
   HERO
========================================================== */

.checkout-hero {
    background-image: url("/images/home/Cart-background.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    display: flex;
    align-items: center;
    height: 100%;
    PADDING: 80PX 0PX;
}

.checkout-hero h1 {
    margin: 0;
    color: #ffffff;
    font-weight: 700;
    font-size: 80px;
    line-height: 84px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.checkout-hero p {
    margin: 30px 0 0;
    color: #d2d2d2;
    font-weight: 400;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0%;
    max-width: 606px;
    width: 100%;
}

/* ==========================================================
   PAGE
========================================================== */

.checkout-section {
    padding: 80px 0px;
    background: #ffffff;
}

.checkout-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr)
minmax(350px, 610px);
    gap: 25px;
    align-items: start;
}

.checkout-main {
min-width: 0;

display: grid;

gap: 16px;
}

/* ==========================================================
   LOGIN / GUEST
========================================================== */

.checkout-login-box {
display: grid;

grid-template-columns:
44px
minmax(0, 1fr)
auto;

align-items: center;

gap: 13px;

padding: 16px 18px;

background: #ffffff;

border: 1px solid #dfe3e8;

border-radius: 11px;

box-shadow: 0 4px 16px rgba(30, 38, 60, 0.035);
}

.checkout-login-icon {
width: 44px;
height: 44px;

display: grid;

place-items: center;

border-radius: 9px;

background: #f1f3f6;
}

.checkout-login-content strong {
    color: #171A26;
    font-size: 18px;
    font-weight: 500;
    line-height: 100%;
}
.checkout-login-content p {
    margin: 4px 0 0;
    color: #171A26B2;
    font-size: 14px;
    line-height: 100%;
    font-weight: 400;
}

.checkout-login-button {
    min-height: 38px;
    padding: 0 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ffb79b;
    border-radius: 7px;
    background: #fff6f2;
    color: #FF4700;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}

.checkout-login-button:hover {
background: #ff4b0b;

border-color: #ff4b0b;

color: #ffffff;
}

.checkout-guest-message {
grid-column: 1 / -1;

display: flex;

align-items: center;

gap: 9px;

padding-top: 12px;

border-top: 1px solid #edf0f3;
}

.checkout-guest-or {
color: #a2a7b0;

font-size: 7px;

font-weight: 900;
}

.checkout-guest-message > div {
display: flex;

flex-direction: column;
}

.checkout-guest-message strong {
color: #515965;

font-size: 9px;
}

.checkout-guest-message small {
margin-top: 2px;

color: #9298a2;

font-size: 8px;
}

/* ==========================================================
   SIGNED IN
========================================================== */

.checkout-customer-signedin {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px;
    border: 2px solid #0C94001F;
    border-radius: 12px;
    background: #f4faf6;
}

.checkout-customer-avatar {
    width: 60px;
    height: 60px;
    display: grid;
    place-items: center;
    border-radius: 4px;
    background: #0C94001A;
    color: #0C9400;
    font-size: 20px;
    font-weight: 600;
}

.checkout-customer-signedin > div:last-child {
display: flex;
flex-direction: column;
}

.checkout-customer-signedin strong {
    color: #0C9400;
    font-size: 18px;
    font-weight: 500;
    line-height: 100%;
}

.checkout-customer-signedin span {
    margin-top: 6px;
    color: #000000;
    font-size: 12px;
    font-weight: 500;
    line-height: 100%;
}

/* ==========================================================
   CHECKOUT CARD
========================================================== */

.checkout-card {
    padding: 20px;
    background: #ffffff;
    border: 2px solid #171A261F;
    border-radius: 12px;
    box-shadow: none;
    margin-bottom: 20px;
}

.checkout-card-heading {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 30px;
}

.checkout-step {
    width: 42px;
    height: 42px;
    min-width: 32px;
    display: grid;
    place-items: center;
    border-radius: 4px;
    background: #FF47001A;
    color: #FF4700;
    font-size: 20px;
    font-weight: 500;
}


.checkout-card-heading h2 {
    margin: 0;
    color: #171A26;
    font-size: 18px;
    font-weight: 500;
    line-height: 100%;
}

.checkout-card-heading p {
    margin: 6px 0 0;
    color: #171A26B2;
    font-size: 14px;
    line-height: 100%;
    font-weight: 400;
}

/* ==========================================================
   FIELDS
========================================================== */

.checkout-fields {
    display: grid;
    gap: 20px;
    margin-top: 20px;
}

.checkout-fields.two-columns {
grid-template-columns: repeat(2, minmax(0, 1fr));
}

.checkout-fields.three-columns {
    grid-template-columns: 1.2fr
0.8fr
0.8fr;
    margin-top: 20px;
}

.checkout-fields label {
    color: #171A26;
    font-size: 14px;
    font-weight: 400;
}

.checkout-fields label.wide {
grid-column: 1 / -1;
}

.checkout-fields input, .checkout-fields select, .checkout-fields textarea {
    width: 100%;
    margin-top: 6px;
    padding: 15px 20px;
    border: 1px solid #171A2633;
    border-radius: 8px;
    background: #ffffff;
    color: #171A26B2;
    outline: 0;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
}

.checkout-fields input, .checkout-fields select {
    min-height: 50px;
}

.checkout-fields textarea {
min-height: 95px;

resize: vertical;
}

.checkout-fields input:focus,
.checkout-fields select:focus,
.checkout-fields textarea:focus {
border-color: #ff9168;

box-shadow: 0 0 0 3px rgba(255, 75, 11, 0.065);
}

/* ==========================================================
   DELIVERY METHODS
========================================================== */

.checkout-delivery-list {
    display: grid;
    gap: 20px;
}

.checkout-delivery-row {
    position: relative;
    min-height: 73px;
    display: grid;
    grid-template-columns: 30px
38px
minmax(0, 1fr)
auto;
    align-items: center;
    gap: 20px;
    padding: 20px;
    border: 1px solid #171A261F;
    border-radius: 12px;
    background: #fafbfc;
    cursor: pointer;
    transition: background 0.18s ease, border-color 0.18s ease,
box-shadow 0.18s ease;
}

.checkout-delivery-row:hover {
background: #fffaf8;

border-color: #ffc0a8;
}

.checkout-delivery-row > input {
position: absolute;

opacity: 0;

pointer-events: none;
}

.checkout-delivery-radio {
    position: relative;
    width: 24px;
    height: 24px;
    border: 2px solid #171A261F;
    border-radius: 50%;
    background: #ffffff;
}

.checkout-delivery-row input:checked + .checkout-delivery-radio {
border-color: #ff4b0b;
}

.checkout-delivery-row input:checked + .checkout-delivery-radio::after {
    content: "";
    position: absolute;
    inset: 3px;
    border-radius: 50%;
    background: #FF4700;
}

.checkout-delivery-row:has(input:checked) {
    background: #FF47001A;
    border-color: #171A261F;
    box-shadow: none;
}

.checkout-delivery-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 4px;
    color: #ffffff;
    font-size: 20px;
    font-weight: 500;
}

.checkout-delivery-icon.pickup {
background: linear-gradient(135deg, #343d4c, #222936);
}

.checkout-delivery-icon.local_delivery {
background: linear-gradient(135deg, #ff6a2d, #ec4c0e);
}

.checkout-delivery-icon.shipping {
background: linear-gradient(135deg, #397bce, #265da4);
}

.checkout-delivery-info {
min-width: 0;

display: flex;

flex-direction: column;
}

.checkout-delivery-info strong {
    color: #171A26;
    font-size: 16px;
    font-weight: 500;
    line-height: 100%;
}

.checkout-delivery-info small {
    margin-top: 4px;
    color: #171A26B2;
    font-size: 12px;
    line-height: 100%;
    font-weight: 400;
}

.checkout-delivery-price {
    min-width: 60px;
    /* padding: 8px 28px; */
    border-radius: 4px;
    background: #171A261A;
    color: #000000B2;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    white-space: nowrap;
    line-height: 26px;
}

.checkout-delivery-row:has(input:checked) .checkout-delivery-price {
    background: #FF47001A;
    color: #FF4700;
}

/* PICKUP */

.checkout-pickup-info {
    display: grid;
    gap: 0;
    margin-top: 20px;
    padding: 20px;
    border: 1px solid #0A9D001F;
    border-radius: 12px;
    background: #0A9D001A;
}
.checkout-pickup-info strong {
    color: #0A9D00;
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
}
.checkout-pickup-info span {
    color: #171A26B2;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}
/* ==========================================================
   PAYMENT
========================================================== */

.checkout-payment-card {
padding: 22px;
}

.checkout-payment-heading {
align-items: center;

padding-bottom: 17px;

margin-bottom: 18px;

border-bottom: 1px solid #edf0f3;
}

.checkout-payment-secure-title {
margin-left: auto;

padding: 6px 9px;

border-radius: 6px;

background: #edf8f2;

color: #288055;

font-size: 7.5px;

font-weight: 850;
}

/* PAYMENT SELECTOR */

.checkout-payment-selector {
display: grid;

gap: 8px;

margin-bottom: 14px;
}

.checkout-payment-choice {
position: relative;

min-height: 68px;

display: grid;

grid-template-columns:
18px
42px
minmax(0, 1fr)
auto;

align-items: center;

gap: 12px;

padding: 12px 14px;

border: 1px solid #dfe3e8;

border-radius: 9px;

background: #fafbfc;

cursor: pointer;

transition: border-color 0.18s ease, background 0.18s ease,
box-shadow 0.18s ease;
}

.checkout-payment-choice:hover {
background: #fffaf8;

border-color: #ffc1aa;
}

.checkout-payment-choice > input {
position: absolute;

opacity: 0;

pointer-events: none;
}

.checkout-payment-choice-radio {
position: relative;

width: 17px;
height: 17px;

border: 2px solid #bdc5d0;

border-radius: 50%;

background: #ffffff;
}

.checkout-payment-choice input:checked + .checkout-payment-choice-radio {
border-color: #ff4b0b;
}

.checkout-payment-choice input:checked + .checkout-payment-choice-radio::after {
content: "";

position: absolute;

inset: 3px;

border-radius: 50%;

background: #ff4b0b;
}

.checkout-payment-choice:has(input:checked) {
background: linear-gradient(90deg, #fff6f1, #fffaf8);

border-color: #ff9f7c;

box-shadow: 0 0 0 2px rgba(255, 75, 11, 0.04);
}

.checkout-payment-choice-icon {
width: 42px;
height: 42px;

display: grid;

place-items: center;

border-radius: 8px;

color: #ffffff;

font-size: 9px;

font-weight: 900;
}

.checkout-payment-choice-icon.gateway-stripe {
background: linear-gradient(135deg, #6f68ff, #554ee8);
}

.checkout-payment-choice-icon.gateway-paypal {
background: linear-gradient(135deg, #1474c7, #075b9f);
}

.checkout-payment-choice-icon.gateway-cod {
background: linear-gradient(135deg, #ff702b, #ed4d0d);
}

.checkout-payment-choice-icon.gateway-pay_on_pickup {
background: linear-gradient(135deg, #444d5c, #29313f);
}

.checkout-payment-choice-text {
min-width: 0;

display: flex;

flex-direction: column;
}

.checkout-payment-choice-text strong {
color: #29303b;

font-size: 11px;

font-weight: 800;
}

.checkout-payment-choice-text small {
margin-top: 4px;

color: #858c98;

font-size: 8.5px;

line-height: 1.4;
}

.checkout-payment-choice-status {
padding: 5px 8px;

border-radius: 5px;

background: #eef1f4;

color: #848c98;

font-size: 7px;

font-weight: 900;

text-transform: uppercase;
}

.checkout-payment-choice:has(input:checked) .checkout-payment-choice-status {
background: #ff4b0b;

color: #ffffff;
}

/* ==========================================================
   PAYMENT GATEWAY PANEL
========================================================== */

.checkout-gateway-panel {
margin-top: 12px;

overflow: hidden;

border: 1px solid #dde2e8;

border-radius: 10px;

background: #ffffff;

box-shadow: 0 5px 18px rgba(30, 38, 60, 0.04);
}

.checkout-stripe-panel {
border-top: 3px solid #635bff;
}

.checkout-paypal-panel {
border-top: 3px solid #1474c7;
}

.checkout-gateway-top {
display: flex;

align-items: flex-start;

justify-content: space-between;

gap: 20px;

padding: 16px 18px;

border-bottom: 1px solid #edf0f3;

background: linear-gradient(180deg, #ffffff, #fbfcfd);
}

.checkout-gateway-title-row {
display: flex;

align-items: center;

gap: 9px;
}


.checkout-gateway-top p {
margin: 5px 0 0;

color: #878e99;

font-size: 8.5px;

line-height: 1.45;
}

.checkout-stripe-logo,
.checkout-paypal-logo {
width: 28px;
height: 28px;

display: grid;

place-items: center;

border-radius: 6px;

color: #ffffff;

font-size: 9px;

font-weight: 900;
}

.checkout-stripe-logo {
background: #635bff;
}

.checkout-paypal-logo {
background: #1474c7;
}

.checkout-gateway-secure-badge {
flex-shrink: 0;

padding: 5px 7px;

border-radius: 5px;

background: #eff1ff;

color: #5e57dd;

font-size: 7px;

font-weight: 900;
}

/* ==========================================================
   STRIPE ELEMENT
========================================================== */

.stripe-payment-shell {
position: relative;

max-width: 760px;

margin: 0 auto;

padding: 20px 20px 17px;
}

.stripe-payment-element {
width: 100%;
}

/* SHIMMER */

.stripe-element-loading {
display: grid;

gap: 11px;
}

.stripe-loading-heading,
.stripe-loading-input,
.stripe-loading-grid > div {
position: relative;

overflow: hidden;

border-radius: 7px;

background: #edf0f3;
}

.stripe-loading-heading {
width: 33%;

height: 13px;
}

.stripe-loading-input {
width: 100%;

height: 47px;
}

.stripe-loading-grid {
display: grid;

grid-template-columns:
1fr
1fr;

gap: 10px;
}

.stripe-loading-grid > div {
height: 47px;
}

.stripe-loading-heading::after,
.stripe-loading-input::after,
.stripe-loading-grid > div::after {
content: "";

position: absolute;

inset: 0;

transform: translateX(-100%);

background: linear-gradient(
90deg,
transparent,
rgba(255, 255, 255, 0.85),
transparent
);

animation: checkoutStripeShimmer 1s infinite;
}

@keyframes checkoutStripeShimmer {
100% {
transform: translateX(100%);
}
}

/* TRUST */

.checkout-payment-trust {
max-width: 760px;

display: flex;

align-items: center;

gap: 9px;

margin: 0 auto 18px;

padding: 10px 12px;

border-radius: 7px;

background: #f3f8f5;
}



.checkout-payment-trust > span {
display: flex;

flex-direction: column;
}




/* PAYPAL */

.paypal-payment-message {
margin: 18px;

padding: 13px 14px;

border-radius: 8px;

background: #f5f8fc;

border: 1px solid #dde7f2;
}

.paypal-payment-message strong {
display: block;

color: #315a7f;

font-size: 10px;
}

.paypal-payment-message span {
display: block;

margin-top: 4px;

color: #74869a;

font-size: 8px;

line-height: 1.45;
}

.paypal-buttons-container {
max-width: 620px;

margin: 0 auto;

padding: 0 18px 18px;
}

/* ERROR */

.checkout-gateway-error,
.checkout-no-payment,
.checkout-no-method {
padding: 13px 14px;

border: 1px solid #efcdd1;

border-radius: 8px;

background: #fff3f4;

color: #a64b54;

font-size: 9px;
}

.checkout-gateway-error strong,
.checkout-no-payment strong {
display: block;

color: #af3f4a;

font-size: 10px;
}

.checkout-gateway-error span,
.checkout-no-payment p {
display: block;

margin: 4px 0 0;

color: #97696e;

font-size: 8px;
}

/* ==========================================================
   ORDER SUMMARY
========================================================== */

.checkout-summary {
position: sticky;

top: 120px;
}

.checkout-summary-box {
    padding: 20px;
    background: #ffffff;
    border: 2px solid #171A261F;
    border-radius: 12px;
    box-shadow: none;
}

.checkout-summary-heading {
margin-bottom: 15px;
}

.checkout-summary-heading > span {
    display: block;
    color: #FF4700;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.checkout-summary-heading h2 {
    margin: 0;
    color: #171A26;
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
}
.checkout-summary-products {
    position: relative;
    max-height: 330px;
    margin: 0 0 18px;
    overflow-y: auto;
    overflow-x: hidden;
    border-top: 2px solid #0000001F;
    border-bottom: 2px solid #0000001F;
    scrollbar-width: thin;
    scrollbar-color: #FF4700 transparent;
}

.checkout-summary-product {
    display: FLEX;
    align-items: center;
    gap: 10px;
    padding: 18px 0px;
	position:relative;
}
/* div#checkoutOrderMessage display handled with [hidden] in store-new.css */
.checkout-summary-product:last-child {
border-bottom: 0;
}

.checkout-summary-thumb {
    max-width: 100px;
    height: 100%;
    width: 100%;
    max-height: 115px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 0.64px solid #171A261F;
    border-radius: 3.96px;
    background: #FFFFFF;
}

.checkout-summary-thumb img {
width: 100%;
height: 100%;
object-fit: contain;

}

.checkout-summary-thumb span {
color: #a0a6af;

font-size: 7px;

font-weight: 700;
}

.checkout-summary-product-info {
min-width: 0;
display: flex;
flex-direction: column;
width: 100%;
}

.checkout-summary-product-info strong {
    color: #171A26;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-family: Manrope;
    font-weight: 700;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0px;
    text-transform: uppercase;
}

.checkout-summary-product-info small {
    margin-top: 4px;
    color: #5D5F67;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0%;
}
.checkout-summary-product-info span {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    white-space: nowrap;
    color: #171A26;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}

.checkout-summary-product-price {
    align-self: center;
    color: #FF4700;
    text-align: right;
    white-space: nowrap;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}
.checkout-summary-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 12px;
}
.checkout-summary-row span {
    color: #171A26;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}
.checkout-summary-row strong {
    color: #171A26;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.checkout-summary-row > span:last-child {
    color: #171A26;
    text-align: right;
}
.checkout-summary-divider {
    height: 2px;
    margin: 12px 0 15px;
    background: #0000001F;
}

.checkout-summary-total {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 14px;
margin-bottom: 24px;
}

.checkout-summary-total > span {
    display: flex;
    flex-direction: column;
    color: #171A26;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.checkout-summary-total small {
    margin-top: 3px;
    color: #171A26B2;
    font-size: 14px;
    font-weight: 400;
}
.checkout-summary-total strong {
    color: #FF4700;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}
.checkout-payment-option:has(input:checked) {
    border-color: #171A261F;
    background: #FF47001A;
}

.checkout-payment-radio {
    appearance: none;
    -webkit-appearance: none;
    width: 24px;
    height: 24px;
    border: 2px solid #FF4700;
    border-radius: 50%;
    background: #fff;
    position: relative;
    margin: 0;
    cursor: pointer;
}
span.checkout-payment-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.checkout-payment-radio:checked::after {
    content: "";
    position: absolute;
    width: 14px;
    height: 14px;
    background: #FF4700;
    border-radius: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.checkout-payment-option {
    position: relative;
    min-height: 67px;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    align-items: center;
    gap: 20px;
    padding: 20px;
    border: 1px solid #dfe3e8;
    border-radius: 8px;
    background: #fafbfc;
    cursor: pointer;
    transition: 0.18s;
}
.checkout-payment-info strong {
    color: #171A26;
    font-size: 16px;
    line-height: 100%;
    font-weight: 500;
}
.checkout-payment-info small {
    color: #171A26B2;
    font-size: 12px;
    line-height: 100%;
}
.checkout-payment-type {
    padding: 6px 30px;
    border-radius: 5px;
    background: #FF47001A;
    color: #FF4700;
    font-size: 18px;
    font-weight: 500;
}
.checkout-payment-methods {
    display: grid;
    gap: 20px;
}
/* ==========================================================
   PLACE ORDER
========================================================== */
.checkout-place-order {
    width: 100%;
    min-height: 44px;
    padding: 0 18px;
    display: flex;
    border-radius: 8px;
    align-items: center;
    justify-content: center;
    border: 0;
    background: #FF4700;
    color: #ffffff;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.checkout-place-order:disabled {
opacity: 0.58;

cursor: not-allowed;
}

.checkout-development-note {
margin-top: 10px;

color: #9a9fa8;

font-size: 7.5px;

line-height: 1.45;

text-align: center;
}

.checkout-security {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin-top: 14px;
    padding: 20px;
    border-radius: 12px;
    background: #0A9D001A;
}

.checkout-security > span {
    color: #0C9400;
    font-weight: 900;
    font-size: 20px;
}

.checkout-security div {
display: flex;

flex-direction: column;
}

.checkout-security strong {
    color: #171A26;
    font-size: 18px;
    font-weight: 600;
}

.checkout-security small {
    margin-top: 2px;
    color: #171A26B2;
    font-size: 14px;
}

.checkout-back-cart {
    display: block;
    margin-top: 12px;
    color: #171A26B2;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
}
.checkout-back-cart:hover {
color: #ff4b0b;
}

/* ==========================================================
   TABLET
========================================================== */
@media(max-width:1200px){
	.checkout-layout {
    grid-template-columns: minmax(0, 1fr)
minmax(350px, 500px);
}
}
@media (max-width: 1050px) {
.checkout-layout {
    display: flex;
    flex-direction: column-reverse;
}
.checkout-summary {
    position: relative;
    top: 0px;
}
.checkout-main {
    width: 100%;
}
.checkout-summary {
    position: relative;
    top: 0px;
    width: 100%;
}
.checkout-place-order {
    max-width: 350px;
    margin: 0 auto;
    min-height: 46px;
}
.checkout-section {
    padding: 80px 0px 0px 0px;
}
.category-grid {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}
.cta-card .eyebrow {
    font-size: 12px;
    line-height: 14px;
    padding-bottom: 8px;
}
.cta-top h2 {
    font-size: 24px;
    line-height: 26px;
    margin-bottom: 8px;
}
.cta-top {
    flex-direction: Column;
    align-items: flex-start;
    gap: 16px;
}
.cta-card p {
    font-size: 16px;
    line-height: 18px;
}
.cta-phone {
    padding: 10px 16px;
}
span.expert-help small {
    font-size: 12px;
}
span.expert-help strong {
    font-size: 14px;
    font-weight: 500;
}
span.phone-icon {
    padding: 6px 10px;
    height: 34px;
    width: 34px;
}
.cta-features {
    gap: 15px;
    margin: 20px 0px 30px 0px;
}
.feature-icon-content {
    font-size: 12px;
    line-height: 16px;
}
.feature-icon {
    height: 30px;
    width: 30px;
    padding: 3px 4px;
}
.cta-feature {
    gap: 6px;
}
.cta-newsletter {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
}
.newsletter-title {
    font-size: 24px;
    line-height: 26px;
    padding-left: 6px;
}
form.newsletter-form input[type="email"] {
    border-radius: 4px;
    max-height: 40px;
    font-size: 14px;
	width: 100%;
	    color: #ffff;
}
form.newsletter-form button {
    border-radius: 4px;
    font-size: 14px;
    line-height: 22px;
    padding: 9px 10px;
}
form.newsletter-form {
    gap: 8px;
}
form.newsletter-form input[type="email"] {
    border-radius: 4px;
    max-height: 40px;
    font-size: 14px;
    min-width: auto;
	color:#ffff;
}
.cta-card {
    padding: 36px;
}
}

/* ==========================================================
   STACK
========================================================== */

@media (max-width: 767px) {
	.checkout-login-content strong {
    font-size: 16px;
}
.checkout-login-content p {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}
.checkout-layout {
grid-template-columns: 1fr;
}
.checkout-hero h1 {
    font-size: 32px;
    line-height: 32px;
}
.checkout-hero p {
    margin-top: 12px;
    font-size: 16px;
    line-height: 18px;
}
.checkout-summary-heading h2 {
    font-size: 24px;
}
.checkout-summary {
position: static;
}
.checkout-customer-signedin strong {
    font-size: 18px;
}
.checkout-customer-avatar {
    width: 52px;
    height: 52px;
}
.checkout-customer-signedin {
    gap: 10px;
    padding: 10px;
    border-radius: 8px;
}
.checkout-main {
    gap: 24px;
}
.checkout-card {
    padding: 10px;
    border-radius: 8px;
	margin-bottom: 24px;
}
.checkout-card-heading h2 {
    font-size: 16px;
}
.checkout-card-heading p {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}
.checkout-card-heading {
    gap: 10px;
    margin-bottom: 20px;
}
.checkout-fields label {
    font-size: 14px;
    font-weight: 400;
}
.checkout-fields input, .checkout-fields select {
    min-height: 42px;
}
.checkout-fields input, .checkout-fields select, .checkout-fields textarea {
    margin-top: 4px;
    padding: 12px 12px;
    border-radius: 4px;
    font-size: 12px;
    line-height: 18px;
}
.checkout-fields {
    gap: 14px;
}
.checkout-delivery-row {
    padding: 10px;
    border-radius: 4px;
	gap: 10px;
}
.checkout-delivery-radio {
    width: 18px;
    height: 18px;
}
.checkout-delivery-icon, .checkout-payment-choice-icon {
    width: 40px;
    height: 40px;
}
.checkout-delivery-info strong {
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
}
.checkout-delivery-info small {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}
.checkout-delivery-price {
    min-width: auto;
    padding: 2px 12px;
    border-radius: 2px;
    font-size: 12px;
    line-height: 16px;
}
.checkout-delivery-list {
    gap: 14px;
}
.checkout-pickup-info strong {
    font-size: 18px;
    line-height: 22px;
    margin-bottom: 6px;
}
.checkout-pickup-info span {
    font-size: 14px;
    line-height: 22px;
}
.checkout-pickup-info {
    border-radius: 8px;
}
.checkout-fields {
    gap: 10px;
}
.checkout-fields.three-columns {
    margin-top: 10px;
}
.checkout-fields {
    margin-top: 10px;
}
.checkout-payment-radio:checked::after {
    width: 12px;
    height: 12px;
}
.checkout-payment-radio {
    width: 20px;
    height: 20px;
}
.checkout-payment-option {;
    grid-template-columns: 20px minmax(0, 1fr) auto;
    gap: 10px;
    padding: 10px;
    border-radius: 4px;
}
.checkout-payment-info strong {
    font-size: 16px;
    line-height: 22px;
}
.checkout-payment-info small {
    margin-top: 4px;
    font-size: 12px;
    line-height: 16px;
}
span.checkout-payment-info {
    gap: 0;
}
span.checkout-payment-typestripe {
    font-size: 12px;
    line-height: 100%;
    color: #FF4700;
    padding: 5px 12px;
    background: #FF47001A;
    border-radius: 2px;
}
.checkout-payment-methods {
    gap: 14px;
}
.checkout-gateway-top {
    gap: 10px;
    padding: 10px !important;
}
.checkout-stripe-logo {
    flex-basis: 40px !important;
    width: 40px;
    height: 40px !important;
}
.p-PaymentMethodSelector {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px 0px;
}
button#klarna-tab {
    margin-left: 0;
}
.p-AdditionalPaymentMethods-menu {
    width: 100%;
}
.p-TabIcon {
    height: 18.75px;
    width: 27px;
}
span.p-TabLabel {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
}
.Label {
    color: #171A26;
    font-size: 14px;
    font-weight: 400;
}
.checkout-payment-trust > div {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
}
.checkout-payment-trust {
    gap: 10px;
	padding: 10px 19px 10px 12px;
	border-radius: 8px;	
}
.checkout-payment-trust strong {
    font-size: 16px;
}
.checkout-payment-trust small {
    font-size: 12px;
    line-height: 16px;
}
.checkout-summary-heading > span {
    font-size: 12px;
    line-height: 100%;
}
.checkout-summary-box {
    padding: 20px 10px;
    border-radius: 8px;
}
.checkout-summary-heading {
    margin-bottom: 20px;
}
.checkout-summary-product {
    padding: 14px 0px;
}
.checkout-summary-thumb {
    max-width: 80px;
    max-height: 80px;
}
.checkout-summary-product-info strong {
    font-size: 16px;
}
.checkout-summary-products {
    margin: 0 0 14px;
}
.checkout-summary-row span {
    font-size: 14px;
}
.checkout-summary-row strong {
    font-size: 14px;
}
.checkout-summary-row {
    padding-bottom: 14px;
}
.checkout-summary-divider {
    margin: 14px 0 20px;
}
.cart-secure-note img {
    max-width: 34px;
    max-height: 34px;
}
.checkout-section {
    padding: 72px 0px 0px 0px;
}
.checkout-summary-total {
    margin-bottom: 24px;
}
.cart-secure-note {
    margin-top: 24px;
}
.checkout-layout {
    flex-direction: column;
	gap: 0;
}
}

@media(max-width:520px ){
	.checkout-login-box {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    column-gap: 15px;
    row-gap: 20px;
}

.checkout-login-icon {
    grid-column: 1;
    grid-row: 1;
}

.checkout-login-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    max-width: 24px;
}

.checkout-login-content {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
}

.checkout-login-button {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    display: block;
}
	
}
/* ==========================================================
   HOME VEHICLE FINDER HERO
========================================================== */

.vehicle-hero {
position: relative;

overflow: visible;

min-height: 500px;

padding: 79px 0 0;

margin-bottom: 115px;

background-image: var(--vehicle-hero-image);

background-size: cover;

background-position: center center;

background-repeat: no-repeat;

/*
     * Important:
     * no animation delay when switching tabs.
     */

transition: none;
}

/* subtle overlay */

.vehicle-hero-overlay {
position: absolute;

inset: 0;

z-index: 1;

pointer-events: none;

background: radial-gradient(
circle at 75% 50%,
rgba(255, 79, 15, 0.08),
transparent 42%
);
}

/* ==========================================================
   PRELOAD IMAGES
========================================================== */

.vehicle-hero-preload {
position: absolute;

width: 1px;
height: 1px;

overflow: hidden;

opacity: 0;

pointer-events: none;
}

.vehicle-hero-preload img {
position: absolute;

width: 1px;
height: 1px;
}

/* ==========================================================
   HERO CONTENT
========================================================== */

.vehicle-hero-container {
position: relative;

z-index: 5;
}

.vehicle-hero-content {
position: relative;

width: 100%;
}

.vehicle-hero-eyebrow {
display: inline-block;
margin-bottom: 12px;
color: #ff4700;
text-transform: uppercase;
font-weight: 600;
font-size: 12px;
line-height: 18px;
letter-spacing: 2px;
}

.vehicle-hero-content > h1 {
    max-width: 760px;
    margin: 0;
    color: #ffffff;
    font-weight: 700;
    font-size: 58px;
    line-height: 60px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.vehicle-hero-content > p {
    margin: 30px 0 0;
    color: #d2d2d2;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: 0%;
}
/* ==========================================================
   VEHICLE FINDER
   HALF INSIDE HERO / HALF BELOW HERO
========================================================== */

.vehicle-finder {
width: 100%;
overflow: hidden;
border: 1px solid #1f26411f;
border-radius: 8px;
background: #ffffff;
transform: translateY(50%);
padding: 22px;
box-shadow: 0px 0px 12px 0px #1f26411f;
}

/* ==========================================================
   DESKTOP TABS
========================================================== */

.vehicle-finder-tabs {
display: flex;
align-items: stretch;
gap: 8px;
}

.vehicle-product-tab {
position: relative;
min-width: 110px;
padding: 12px 37px;
border-radius: 4px;
border: 0.96px solid #171a261f;
cursor: pointer;
transition: background 0.16s ease, color 0.16s ease;
font-weight: 500;
font-size: 15px;
line-height: 22px;
letter-spacing: 0%;
text-align: center;
background: none;
}

.vehicle-product-tab.active {
background: #ff4700;
color: #ffffff;
}

.vehicle-product-tab.active::before {
content: "";

position: absolute;

top: 0;
left: 0;
right: 0;

height: 4px;

background: #ff4f0f;
}

/* ==========================================================
   FINDER FORM
========================================================== */

.vehicle-finder-form {
display: grid;
grid-template-columns:
minmax(170px, 1fr)
minmax(170px, 1fr)
minmax(170px, 1fr)
155px;
gap: 14px;
align-items: end;
margin-top: 12px;
}

.vehicle-field {
min-width: 0;
}

.vehicle-field label {
display: block;
margin-bottom: 10px;
color: #171a26b2;
font-family: Manrope;
font-weight: 600;
font-size: 12px;
line-height: 100%;
letter-spacing: 0px;
text-transform: uppercase;
}

.vehicle-field select {
width: 100%;
height: 48px;
padding: 12px 42px 12px 16px;
border: 1px solid #171a261f;
border-radius: 4px;
outline: 0;
background: #ffffff;
color: #171a26b2;
transition: border-color 0.16s ease, box-shadow 0.16s ease;
font-weight: 400;
font-size: 15px;
line-height: 100%;
letter-spacing: 0%;
}

.vehicle-field select:focus {
border-color: #ff5b20;

box-shadow: 0 0 0 3px rgba(255, 79, 15, 0.09);
}

.vehicle-field select:disabled {
cursor: not-allowed;

color: #9fa5ae;

background: #f4f5f7;
}

/* ==========================================================
   MOBILE PRODUCT TYPE
========================================================== */

.vehicle-mobile-type {
display: none;
}

/* ==========================================================
   GO BUTTON
========================================================== */

.vehicle-go-button {
width: 100%;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
padding: 12px 43px;
border: 0;
border-radius: 4px;
background: #ff4700;
color: #ffffff;
cursor: pointer;
transition: transform 0.16s ease, box-shadow 0.16s ease;
font-weight: 500;
font-size: 15px;
line-height: 100%;
letter-spacing: 0%;
text-align: center;
}

.vehicle-go-button:hover {
transform: translateY(-1px);

box-shadow: 0 11px 24px rgba(255, 79, 15, 0.28);
}

.vehicle-go-button strong {
font-size: 16px;
}

/* ==========================================================
   FINDER TRUST ROW
========================================================== */
.vehicle-finder-note {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 6px;
color: #171a26b2;
font-size: 10px;
font-weight: 600;
margin-top: 16px;
}

.vehicle-finder-dot {
color: #c2c7ce;
}

/* ==========================================================
   TABLET
========================================================== */


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767px) {
/*
     * On mobile we keep the finder fully inside
     * the hero because it becomes much taller.
     */
.vehicle-finder-form {
    grid-template-columns: 1fr 1fr;
}
.vehicle-hero {
min-height: auto;

overflow: hidden;

padding: 34px 0 30px;

margin-bottom: 0;

background-position: center top;

background-image: linear-gradient(
180deg,
rgba(7, 9, 12, 0.7) 0%,
rgba(7, 9, 12, 0.55) 45%,
rgba(7, 9, 12, 0.42) 100%
),
var(--vehicle-hero-image);
}

.vehicle-hero-container {
padding-left: 16px;

padding-right: 16px;
}

.vehicle-hero-eyebrow {
        margin-bottom: 10px;
        font-size: 12px;
        line-height: 100%;
}

.vehicle-hero-content > h1 {
max-width: 380px;
        font-size: 32px;
        line-height: 32px;
}

.vehicle-hero-content > p {
        max-width: 360px;
        margin-top: 12px;
        font-size: 16px;
        line-height: 18px;
}

/*
     * Hide desktop tabs.
     */

.vehicle-finder-tabs {
display: none;
}

/*
     * Finder no longer floats on mobile.
     */

.vehicle-finder {
transform: none;

margin-top: 21px;

border-radius: 9px;

box-shadow: 0 17px 40px rgba(0, 0, 0, 0.25);
}

/*
     * Product Type becomes the 4th dropdown.
     */

.vehicle-mobile-type {
display: block;
}

.vehicle-field label {
display: none;
}

.vehicle-field select {
        padding: 6px 40px 6px 6px;
        border-radius: 2px;
        font-size: 12px;
		height: 35px;
}

.vehicle-go-button {
        height: 36px;
        height: 36px;
        border-radius: 1.62px;
        font-size: 12px;
}

/*
     * Hide trust row on mobile to keep
     * competitor-style compact layout.
     */

.vehicle-finder-note {
display: none;
}
}


/* ==========================================================
   LA CEIBA - REFERENCE STYLE HOME BANNER
   Prefix: lc-wh-banner-
========================================================== */

/* ==========================================================
   SECTION
========================================================== */

.lc-wh-banner-section {
width: 100%;

padding: 38px 0 48px;

background: #eef2fa;
}

/* ==========================================================
   INNER WRAPPER
========================================================== */

.lc-wh-banner-inner {
position: relative;

width: 100%;

max-width: 1408px;

margin-left: auto;
margin-right: auto;
}

/* ==========================================================
   SWIPER
========================================================== */

.lc-wh-banner-swiper {
width: 100%;

overflow: hidden;

margin: 0;

padding: 0;
}

.lc-wh-banner-swiper .swiper-wrapper {
margin: 0;

padding: 0;
}

.lc-wh-banner-swiper .swiper-slide {
width: 100%;

margin: 0;

padding: 0;
}

/* ==========================================================
   SLIDE
========================================================== */

.lc-wh-banner-slide {
position: relative;
}

.lc-wh-banner-link {
position: relative;

display: block;

width: 100%;

text-decoration: none;
}

.lc-wh-banner-link picture {
display: block;

width: 100%;
}

/* ==========================================================
   IMAGE
========================================================== */

.lc-wh-banner-image {
display: block;

width: 100%;

height: auto;

margin-left: auto;
margin-right: auto;

object-fit: cover;

user-select: none;

-webkit-user-drag: none;
}

/* ==========================================================
   PREV / NEXT BUTTON
========================================================== */

.lc-wh-banner-prev,
.lc-wh-banner-next {
position: absolute;

top: 50%;

z-index: 20;

width: 50px;
height: 50px;

padding: 0;

border: 0;

border-radius: 50%;

background: #ffffff;

cursor: pointer;

box-shadow: 0 3px 8px rgba(26, 34, 48, 0.22);

transform: translateY(-50%);

transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

/* LEFT */

.lc-wh-banner-prev {
left: -76px;
}

/* RIGHT */

.lc-wh-banner-next {
right: -76px;
}

/* ==========================================================
   ARROW ICONS
========================================================== */

.lc-wh-banner-prev::before,
.lc-wh-banner-next::before {
content: "";

position: absolute;

top: 50%;
left: 50%;

width: 10px;
height: 10px;

border-top: 2px solid #3d4552;
border-right: 2px solid #3d4552;
}

.lc-wh-banner-prev::before {
transform: translate(-35%, -50%) rotate(-135deg);
}

.lc-wh-banner-next::before {
transform: translate(-65%, -50%) rotate(45deg);
}

/* ==========================================================
   HOVER
========================================================== */

.lc-wh-banner-prev:hover,
.lc-wh-banner-next:hover {
background: #ffffff;

transform: translateY(-50%) scale(1.04);

box-shadow: 0 5px 13px rgba(26, 34, 48, 0.27);
}

/* ==========================================================
   TABLET
========================================================== */

/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767px) {
.lc-wh-banner-section {
padding: 24px 0 32px;
}

.lc-wh-banner-inner {
max-width: 414px;
}

.lc-wh-banner-prev,
.lc-wh-banner-next {
width: 42px;
height: 42px;
}

.lc-wh-banner-prev {
left: 10px;
}

.lc-wh-banner-next {
right: 10px;
}

.lc-wh-banner-prev::before,
.lc-wh-banner-next::before {
width: 9px;
height: 9px;
}
}

/* ==========================================================
   HOME - TOP SELLING PRODUCT SLIDERS
========================================================== */

.lc-selling-section {
position: relative;
overflow: hidden;
}

.lc-selling-section + .lc-selling-section {
padding-top: 80px;
}

/* ==========================================================
   SECTION HEADING
========================================================== */

.lc-selling-heading {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 20px;
margin-bottom: 48px;
}

.lc-selling-heading h2 {
margin-bottom: 0;
}
a.view-all-a {
display: flex;
align-items: center;
gap: 6px;
}
.lc-selling-view-all {
flex: 0 0 auto;

color: #ff4f0f;

font-size: 14px;
font-weight: 800;

text-decoration: none;

transition: color 0.18s ease, transform 0.18s ease;
}

.lc-selling-view-all:hover {
color: #d83c00;
transform: translateX(3px);
}

/* ==========================================================
   SLIDER WRAPPER
========================================================== */

.lc-selling-slider-wrap {
position: relative;
}

.lc-selling-slider {
width: 100%;
overflow: hidden;
}

.lc-selling-slider .swiper-wrapper {
align-items: stretch;
}

.lc-selling-slider .swiper-slide {
height: auto;
}
.swiper {
padding: 10px 0px !important;
}

/* ==========================================================
   PRODUCT CARD
========================================================== */

.lc-selling-card {
height: 100%;
display: flex;
flex-direction: column;
overflow: hidden;
border: 1px solid #171a261f;
border-radius: 8px;
background: #ffffff;
transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
box-shadow: 0px 0px 12px 0px #0000001f;
}

.lc-selling-card:hover {
transform: translateY(-3px);
border-color: #d4d9e0;
box-shadow: 0 12px 28px rgba(22, 31, 45, 0.1);
}

/* ==========================================================
   PRODUCT IMAGE
========================================================== */

.lc-selling-card-image {
position: relative;
height: 280px;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
border-bottom: 1px solid #171a261f;
background: #ffffff;
}

.lc-selling-card-image  img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
transition: transform 0.25s ease;
}

.lc-selling-card:hover .lc-selling-card-image  img {
transform: scale(1.025);
}

/* ==========================================================
   POPULAR BADGE
========================================================== */

.lc-selling-popular-badge {
position: absolute;

top: 12px;
left: 12px;

z-index: 3;

min-height: 27px;

display: inline-flex;
align-items: center;
justify-content: center;
gap: 5px;

padding: 0 9px;

border-radius: 5px;

background: #ff4f0f;

color: #ffffff;

font-size: 10px;
font-weight: 600;
}

.lc-selling-popular-badge > span {
font-size: 7px;
}

/* ==========================================================
   NO IMAGE
========================================================== */

.lc-selling-no-image {
display: flex;
flex-direction: column;

align-items: center;
justify-content: center;

gap: 7px;

color: #9da4ae;
}

.lc-selling-no-image > span {
width: 92px;
height: 92px;

display: flex;
align-items: center;
justify-content: center;

border-radius: 50%;

background: #f0f2f5;

color: #222a34;

font-size: 52px;
}

.lc-selling-no-image small {
font-size: 9px;
font-weight: 700;

text-transform: uppercase;
letter-spacing: 0.5px;
}

/* ==========================================================
   CARD CONTENT
========================================================== */

.lc-selling-card-content {
flex: 1;
display: flex;
flex-direction: column;
padding: 20px;
}

/* BRAND */

.lc-selling-brand {
color: #171a26b2;
font-weight: 400;
font-size: 10px;
line-height: 100%;
letter-spacing: 0px;
text-transform: uppercase;
margin-bottom: 10px;
}

/* PRODUCT NAME */

.lc-selling-name {
color: #ff4700;
font-weight: 700;
font-size: 16px;
line-height: 100%;
letter-spacing: 0%;
margin-bottom: 14px;
text-transform: capitalize;
}

/* ==========================================================
   PRODUCT SPECS
========================================================== */

.lc-selling-specs {
display: flex;
flex-wrap: wrap;
gap: 6px;
min-height: 24px;
margin-bottom: 14px;
}

.lc-selling-specs span {
min-width: 29px;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 5px 7px;
border: 1px solid #171a2633;
border-radius: 4px;
color: #171a26b2;
font-weight: 400;
font-size: 10px;
line-height: 100%;
letter-spacing: 0%;
}

/* ==========================================================
   PRICE
========================================================== */

.lc-selling-price {
display: flex;
align-items: baseline;
flex-wrap: wrap;
gap: 6px;
margin-top: auto;
margin-bottom: 20px;
}

.lc-selling-price strong {
color: #171a26;
font-family: Manrope;
font-weight: 700;
font-size: 22px;
line-height: 100%;
letter-spacing: 0%;
}

.lc-selling-price small {
color: #171a26b2;
font-weight: 400;
font-size: 12px;
line-height: 100%;
}
.lc-selling-old-price {
color: #9ba1a9;

font-size: 11px;

text-decoration: line-through;
}

/* ==========================================================
   VIEW DETAILS BUTTON
========================================================== */

.lc-selling-details-btn {
width: 100%;
padding: 12px 20px;
min-height: 44px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 4px;
background: #ff4700;
color: #ffffff;
text-decoration: none;
transition: background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
font-family: Poppins;
font-weight: 700;
font-size: 14px;
line-height: 100%;
letter-spacing: 0%;
text-transform: uppercase;
}

.lc-selling-details-btn:hover {
background: #df3f00;

color: #ffffff;

transform: translateY(-1px);

box-shadow: 0 6px 15px rgba(255, 79, 15, 0.2);
}

/* ==========================================================
   SLIDER ARROWS
========================================================== */

.lc-selling-arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 20;
width: 50px;
height: 50px;
border: none;
border-radius: 50%;
background: #ffffff;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.16);
transition: 0.3s ease;
}

.lc-selling-arrow:hover {
transform: translateY(-50%) scale(1.07);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.22);
}

/* LEFT */

.lc-wheel-selling-prev,
.lc-tire-selling-prev {
left: 0px;
}

/* RIGHT */

.lc-wheel-selling-next,
.lc-tire-selling-next {
right: 0px;
}

/* DISABLED ARROW */

.lc-selling-arrow.swiper-button-disabled {
opacity: 0.3;
cursor: default;
pointer-events: none;
}

/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 1100px) {
.lc-selling-card-image {
height: 225px;
}

.lc-wheel-selling-prev,
.lc-tire-selling-prev {
left: 5px;
}

.lc-wheel-selling-next,
.lc-tire-selling-next {
right: 5px;
}
}

/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767px) {


.lc-selling-heading h2 {
font-size: 24px;
        line-height: 28px;
}

.lc-selling-view-all {
margin-top: 7px;

font-size: 11px;
}

.lc-selling-card-image {
height: 210px;
}

.lc-selling-arrow {
width: 39px;
height: 39px;

font-size: 17px;
}

.lc-wheel-selling-prev,
.lc-tire-selling-prev {
left: 5px;
}

.lc-wheel-selling-next,
.lc-tire-selling-next {
right: 5px;
}
}

/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 480px) {
.lc-selling-heading {
gap: 10px;
}

.lc-selling-heading h2 {
font-size: 24px;
}

.lc-selling-card-image {
height: 220px;
}

.lc-selling-card-content {
padding: 14px;
}
}

/* =========================================================
   TOP WHEEL BRANDS
========================================================= */

.wheel-brands-section {
padding: 80px 0;
overflow: hidden;
}

/* Slider wrapper */

.wheel-brands-slider-wrapper {
position: relative;
}

/* Swiper */

.wheel-brands-swiper {
overflow: hidden;
}

/* Each card height */

.wheel-brands-swiper .swiper-slide {
height: 225px;
}

/* =========================================================
   BRAND CARD
========================================================= */

.wheel-brands-section .brand-card {
position: relative;
display: block;
width: 100%;
height: 100%;
background: #ffffff;
border-radius: 5px;
overflow: hidden;
text-decoration: none;
border: 1px solid #171a261f;
border-radius: 12px;
box-shadow: 0px 0px 12px 0px #0000001f;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.wheel-brands-section .brand-card:hover {
box-shadow: 0 10px 24px rgba(20, 35, 70, 0.14);
}

/* =========================================================
   LOGO
========================================================= */

.wheel-brands-section .brand-logo-wrap {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
padding: 30px;
}

.wheel-brands-section .brand-logo {
display: block;

width: auto;
height: auto;

max-width: 70%;
max-height: 120px;

object-fit: contain;

transition: transform 0.3s ease;
}

.wheel-brands-section .brand-card:hover .brand-logo {
transform: scale(1.05);
}

/* =========================================================
   BRAND NAME HOVER
========================================================= */
.brand-name {
position: absolute;
left: 0;
right: 0;
bottom: 0;
background: #171a26;
color: #ffffff;
text-align: center;
padding: 12px 10px;
transform: translateY(100%);
transition: transform 0.3s ease;
font-weight: 500;
font-size: 20px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
text-transform: uppercase;
}

.wheel-brands-section .brand-card:hover .brand-name {
transform: translateY(0);
}

/* =========================================================
   LEFT / RIGHT BUTTONS
========================================================= */

.wheel-brands-prev,
.wheel-brands-next {
position: absolute;

top: 50%;

transform: translateY(-50%);

z-index: 20;

width: 50px;
height: 50px;

border: none;

border-radius: 50%;

background: #ffffff;

color: #202a44;

font-size: 27px;

display: flex;
align-items: center;
justify-content: center;

cursor: pointer;

box-shadow: 0 4px 10px rgba(0, 0, 0, 0.16);

transition: 0.3s ease;
}

.wheel-brands-prev:hover,
.wheel-brands-next:hover {
transform: translateY(-50%) scale(1.07);

box-shadow: 0 6px 16px rgba(0, 0, 0, 0.22);
}

.wheel-brands-prev {
left: 0px;
}

.wheel-brands-next {
right: 0px;
}
.testimonial-cuxx-viewport {
        width: 90% !important;
        margin: 0 auto;
    }
.swiper{
    width: 89%;
}
/* =========================================================
   TABLET
========================================================= */

@media(max-width:1400px){
	.lc-wheel-selling-prev, .lc-tire-selling-prev , .wheel-brands-prev , .brands-button-prev  , .lc-category-prev , .testimonial-cuxx-prev  {
    left: 0px !important;
	       width: 34px !important;
        height: 34px !important;
}
.lc-wheel-selling-next, .lc-tire-selling-next, .wheel-brands-next , .lc-category-next , .brands-button-next , .testimonial-cuxx-next {
    right: 0px !important;
	       width: 34px !important;
        height: 34px !important;
}

}

	
/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {
.wheel-brands-section {
padding: 35px 0;
}
.cta-newsletter {
    gap: 15px;
}
.cta-newsletter .newsletter-p {
    margin-top: 8px;
}
.wheel-brands-swiper .swiper-slide {
height: 160px;
}

.wheel-brands-section .brand-logo-wrap {
padding: 20px;
}

.wheel-brands-section .brand-logo {
max-width: 80%;
max-height: 80px;
}

/* No hover on mobile, show name permanently */

.wheel-brands-section .brand-name {
transform: translateY(0);

font-size: 14px;

padding: 8px 5px;
}

.wheel-brands-prev,
.wheel-brands-next {
width: 40px;
height: 40px;

font-size: 22px;
}

.wheel-brands-prev {
left: -10px;
}

.wheel-brands-next {
right: -10px;
}
}
@media(max-width:520px){
	.lc-selling-heading  , .section-heading{
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}
	.promo-inner {
    font-size: 9px;
}
form.newsletter-form input[type="email"] {
    max-width: 200px;
}
.cta-card {
    padding: 36px 12px !Important;
}
}
@media(max-width:375px){
	.cta-features {
    gap: 6px !Important;
}
}
/* =========================================================
   BRANDS SECTION
========================================================= */

.brands-band {
background: #ffede5;
padding: 80px 0;
overflow: hidden;
}

.brands-title {
color: #171a26;
margin: 0 0 48px;
font-weight: 700;
font-size: 32px;
line-height: 40px;
letter-spacing: 0%;
vertical-align: middle;
text-transform: uppercase;
}

/* =========================================================
   SLIDER
========================================================= */

.brands-slider-wrapper {
position: relative;
}

.brands-swiper {
overflow: hidden;
}

/* =========================================================
   BRAND CARD
========================================================= */

.brands-swiper .swiper-slide {
height: 225px;
}

.brand-card {
position: relative;
display: block;
width: 100%;
height: 100%;
background: #fff;
overflow: hidden;
border: 1px solid #171a261f;
border-radius: 12px;
box-shadow: 0px 0px 12px 0px #0000001f;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.brand-logo-wrap {
width: 100%;
height: 100%;

display: flex;
align-items: center;
justify-content: center;
min-height: 180px;
padding: 30px;
}

.brand-logo {
display: block;

width: auto;
height: auto;

max-width: 70%;
max-height: 115px;

object-fit: contain;
}

.brand-card:hover {
transform: translateY(-2px);

box-shadow: 0 10px 24px rgba(20, 35, 70, 0.13);
}

/* =========================================================
   LOGO
========================================================= */

.brand-logo {
display: block;

width: auto;
height: auto;

max-width: 70%;
max-height: 115px;

object-fit: contain;

transition: transform 0.3s ease;
}

.brand-card:hover .brand-logo {
transform: scale(1.05);
}

/* =========================================================
   BRAND NAME HOVER
========================================================= */

.brand-card:hover .brand-name {
transform: translateY(0);
}

.brand-no-logo {
color: #202a44;
font-size: 20px;
font-weight: 700;
}

/* =========================================================
   ARROWS
========================================================= */

.brands-button-prev,
.brands-button-next {
position: absolute;

top: 50%;

transform: translateY(-50%);

z-index: 20;

width: 50px;
height: 50px;

border: 0;
border-radius: 50%;

background: #fff;

color: #202a44;

font-size: 27px;
line-height: 1;

display: flex;
justify-content: center;
align-items: center;

cursor: pointer;

box-shadow: 0 4px 10px rgba(0, 0, 0, 0.16);

transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.brands-button-prev:hover,
.brands-button-next:hover {
box-shadow: 0 6px 15px rgba(0, 0, 0, 0.22);
}

.brands-button-prev {
left: 0px;
}

.brands-button-next {
right: 0px;
}

/* =========================================================
   TABLET
========================================================= */


/* =========================================================
   MOBILE
========================================================= */

@media (max-width:767px) {
.brands-band {
padding: 35px 0;
}

.cta-section {
    padding: 40px 0px;
}
.brands-swiper .swiper-slide {
height: 160px;
}

.brand-logo-wrap {
padding: 20px;
}

.brand-logo {
max-width: 80%;
max-height: 80px;
}

.brand-name {
transform: translateY(0);

font-size: 14px;

padding: 8px 5px;
}

.brands-button-prev,
.brands-button-next {
width: 40px;
height: 40px;

font-size: 22px;
}
.cta-card .eyebrow {
    font-size: 12px;
    line-height: 14px;
    padding-bottom: 8px;
}
.cta-top h2 {
    font-size: 24px;
    line-height: 26px;
    margin-bottom: 8px;
	 max-width: 200px;
}
.cta-top {
    flex-direction: Column;
    align-items: flex-start;
    gap: 16px;
}
.cta-card p {
    font-size: 16px;
    line-height: 18px;
}
.cta-phone {
    padding: 10px 16px;
}
span.expert-help small {
    font-size: 12px;
}
span.expert-help strong {
    font-size: 14px;
    font-weight: 500;
}
span.phone-icon {
    padding: 6px 10px;
    height: 34px;
    width: 34px;
}
.cta-features {
    gap: 15px;
    margin: 20px 0px 30px 0px;
}
.feature-icon-content {
    font-size: 12px;
    line-height: 16px;
}
.feature-icon {
    height: 30px;
    width: 30px;
    padding: 3px 4px;
}
.cta-feature {
    gap: 6px;
}
.cta-newsletter {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
	        margin-top: 6px
}
.newsletter-title {
    font-size: 18px;
    line-height: 20px;
    padding-left: 6px;
}
form.newsletter-form input[type="email"] {
    border-radius: 4px;
    max-height: 40px;
    font-size: 14px;
	min-width: auto;
	width: fit-content;
}
form.newsletter-form button {
    border-radius: 4px;
    font-size: 14px;
    line-height: 22px;
    padding: 9px 10px;
}
form.newsletter-form {
    gap: 8px;
}
}

/* =========================================================

   DYNAMIC PRODUCT CATEGORY SECTIONS

========================================================= */

.lc-category-sections {
padding: 80px 0px;
overflow: hidden;
}

.lc-category-section:last-child {
padding-top: 80px;
}

/* =========================================================

   HEADING

========================================================= */

.lc-category-section-head {
margin-bottom: 24px;
}

.lc-category-section-head h2 {
color: #171a26;
margin: 0 0 48px;
font-weight: 700;
font-size: 32px;
line-height: 40px;
letter-spacing: 0%;
vertical-align: middle;
text-transform: uppercase;
}

/* =========================================================

   SLIDER WRAPPER

========================================================= */

.lc-category-slider-wrap {
position: relative;
}

.lc-category-swiper {
overflow: hidden;

padding: 3px 3px 10px;
}

.lc-category-swiper .swiper-wrapper {
align-items: stretch;
}

.lc-category-swiper .swiper-slide {
height: auto;

display: flex;
}

/* =========================================================

   CATEGORY CARD

========================================================= */

.lc-category-card {
position: relative;
display: block;
width: 100%;
height: 100%;
background: #ffffff;
border-radius: 5px;
overflow: hidden;
text-decoration: none;
border: 1px solid #171a261f;
border-radius: 12px;
box-shadow: 0px 0px 12px 0px #0000001f;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.lc-category-card:hover {
transform: translateY(-3px);
border-color: #d4d9e0;
box-shadow: 0 12px 28px rgba(22, 31, 45, 0.1);
}

/* =========================================================

   CATEGORY IMAGE

========================================================= */

.lc-category-card-image {
position: relative;

height: 235px;

display: flex;

align-items: center;

justify-content: center;

padding: 20px 24px 8px;

background: #ffffff;
}

.lc-category-card-image img {
display: block;

width: 100%;

height: 100%;

max-width: 285px;

object-fit: contain;

object-position: center;

transition: transform 0.25s ease;
}

.lc-category-card:hover .lc-category-card-image img {
transform: scale(1.025);
}

/* =========================================================

   NO IMAGE

========================================================= */

.lc-category-no-image {
width: 100%;

height: 100%;

display: flex;

align-items: center;

justify-content: center;

border-radius: 4px;

background: #f8fafc;

color: #94a3b8;

font-size: 13px;

font-weight: 600;
}

/* =========================================================

   CATEGORY TITLE

========================================================= */

.lc-category-card-title {
min-height: 61px;
display: flex;
align-items: center;
justify-content: center;
margin-top: auto;
padding: 14px 15px 18px;
color: #171a26;
font-size: 19px;
line-height: 1.25;
font-weight: 600;
text-align: center;
}

/* =========================================================

   LEFT / RIGHT ARROWS

========================================================= */

.lc-category-arrow {
position: absolute;

top: 50%;

z-index: 20;

width: 46px;

height: 46px;

display: flex;

align-items: center;

justify-content: center;

padding: 0;

border: 0;

border-radius: 50%;

background: #ffffff;

color: #263047;

font-size: 24px;

font-weight: 400;

line-height: 1;

cursor: pointer;

box-shadow: 0 3px 9px rgba(15, 23, 42, 0.18);

transform: translateY(-50%);

transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease,
box-shadow 0.2s ease;
}

/*

* WheelHero-style placement:

* arrows sit OUTSIDE the cards.

*/

.lc-category-prev {
left: 0px;
}

.lc-category-next {
right: 0px;
}

/* Swiper disabled state */

.lc-category-arrow.swiper-button-disabled {
opacity: 0.35;

cursor: default;

pointer-events: none;
}

.lc-category-arrow.swiper-button-lock {
display: none;
}

/* =========================================================

   LARGE DESKTOP

========================================================= */


/* =========================================================

   SMALLER DESKTOP / TABLET

========================================================= */


/* =========================================================

   TABLET

========================================================= */




/* =========================================
   CUSTOMER TESTIMONIALS
========================================= */
.testimonial-cuxx-section {
width: 100%;

padding: 80px 0px;

background: #ffffff;

box-sizing: border-box;
}

.testimonial-cuxx-container {
width: 100%;

max-width: 920px;

margin: 0 auto;
}

/* =========================================
  HEADING
========================================= */

.testimonial-cuxx-heading {
text-align: left;

margin-bottom: 34px;
}

.testimonial-cuxx-label {
display: block;
margin-bottom: 8px;
color: #ff4700;
text-transform: uppercase;
font-weight: 600;
font-size: 12px;
line-height: 18px;
letter-spacing: 2px;
}

.testimonial-cuxx-title {
margin: 0;
color: #171a26;
font-weight: 700;
font-size: 32px;
line-height: 100%;
letter-spacing: 0%;
text-transform: uppercase;
}

/* =========================================
  SLIDER
========================================= */

.testimonial-cuxx-slider {
position: relative;

width: 100%;
}

.testimonial-wraps {
display: flex;
justify-content: space-between;
align-items: center;
}

.testimonial-cuxx-viewport {
width: 100%;

overflow: hidden;
padding: 10px 0px;
}

.testimonial-cuxx-track {
display: flex;

gap: 22px;

transition: transform 0.55s ease;

will-change: transform;
}

/* =========================================
  CARD
========================================= */

.testimonial-cuxx-card {
flex: 0 0 calc((100% - 44px) / 3);
padding: 30px;
border: 1.22px solid #1e1b171f;
border-radius: 14px;
background: #ffffff;
box-sizing: border-box;
flex-shrink: 0;
}

/* =========================================
  STARS
========================================= */

.testimonial-cuxx-stars {
color: #ff4700;
font-size: 18px;
line-height: 1;
letter-spacing: 0;
margin-bottom: 26px;
}

/* =========================================
  REVIEW TEXT
========================================= */

.testimonial-cuxx-text {
margin: 0;
color: #1e1b17;
font-weight: 400;
font-size: 18px;
line-height: 24px;
letter-spacing: 0%;
vertical-align: middle;
}

/* =========================================
  CUSTOMER
========================================= */

.testimonial-cuxx-user {
display: flex;
align-items: center;
gap: 14px;
margin-top: 50px;
}

.testimonial-cuxx-user img {
width: 40px;

height: 40px;

border-radius: 50%;

object-fit: cover;

display: block;
}

.testimonial-cuxx-user strong {
color: #1e1b17;
font-family: Manrope;
font-weight: 700;
font-size: 24px;
line-height: 24px;
letter-spacing: 0%;
vertical-align: middle;
}

/* =========================================
  ARROWS
========================================= */

.testimonial-cuxx-arrow {
position: absolute;
top: 50%;
z-index: 20;
width: 46px;
height: 46px;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
border: 0;
border-radius: 50%;
background: #ffffff;
color: #263047;
font-size: 24px;
font-weight: 400;
line-height: 1;
cursor: pointer;
box-shadow: 0 3px 9px rgba(15, 23, 42, 0.18);
transform: translateY(-50%);
transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease,
box-shadow 0.2s ease;
}

.testimonial-cuxx-arrow:hover {
}

.testimonial-cuxx-prev {
left: 0px;
}

.testimonial-cuxx-next {
right: 0px;
}

/* =========================================
  BUTTON
========================================= */

.testimonial-cuxx-button-wrap {
display: flex;

justify-content: center;
}

.testimonial-cuxx-button {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 116px;
height: 45px;
padding: 16px 23px;
border: 1px solid #ff4700;
color: #ff4700;
background: #ffffff;
text-decoration: none;
font-size: 16px;
font-weight: 600;
transition: background 0.25s ease, color 0.25s ease;
border-radius: 4px;
line-height: 24px;
}

.testimonial-cuxx-button:hover {
background: #ff4b16;
color: #ffffff;
}

/* =========================================
  TABLET
========================================= */


/* =========================================
  MOBILE
========================================= */

@media (max-width: 600px) {


.testimonial-cuxx-heading {
margin-bottom: 28px;
}

.testimonial-cuxx-title {
font-size: 27px;
}

.testimonial-cuxx-card {
flex: 0 0 100%;

min-height: 205px;

padding: 20px;
}

.testimonial-cuxx-text {
max-width: 100%;
}

.testimonial-cuxx-prev {
left: -10px;
}

.testimonial-cuxx-next {
right: -10px;
}

.testimonial-cuxx-arrow {
width: 34px;

height: 34px;

font-size: 24px;
}
}



/* contact Page css */

.contact-section {
    padding: 80px 15px;
    background-image: url("/images/home/Contact_background.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.contact-container {
    max-width: 1520px;
    margin: 0 auto;
    align-items: start;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
	    padding: 0px 15px;
}

/* ---------- Left: info ---------- */
.contact-eyebrow {
    color: #FF4700;
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
    text-transform: uppercase;
    margin-bottom: 12px;
}
h2.contact-title {
    font-weight: 600;
    font-size: 60px;
    line-height: 60px;
    letter-spacing: 0%;
    vertical-align: middle;
    text-transform: capitalize;
    color: #ffffff;
    margin-bottom: 30px;
}
.contact-title-accent{color:#FF4700}
.contact-description {
    margin-bottom: 40px;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0%;
    text-transform: capitalize;
    color: #ffffff;
}

.contact-branch {
    margin-bottom: 30px;
}
.contact-branch-name {
    color: #FFFFFF;
    margin-bottom: 20px;
    font-family: Manrope;
    font-weight: 700;
    font-size: 22px;
    line-height: 100%;
    letter-spacing: 0px;
    text-transform: uppercase;
}
.contact-detail {
    margin-bottom: 20px;
	    display: flex;
    align-items: stretch;
    gap: 12px;
}
.contact-detail-img {
    display: flex;
    justify-content: center;
    align-items: center;
}
.contact-detail-label {
    display: flex;
    gap: 8px;
    color: #FFFFFF;
    font-weight: 400;
    font-size: 18px;
    line-height: 19px;
    letter-spacing: 0%;
    flex-direction: column;
}
.contact-detail-value {
    color: #FF4700;
    text-decoration: none;
    display: inline-block;
    font-family: Manrope;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}
.contact-detail-value:hover{text-decoration:underline}

.contact-cta {
    display: flex;
    background: #FF4700;
    color: #FFFFFF;
    text-decoration: none;
    padding: 17px 40px;
    border-radius: 12px;
    border: 0;
    cursor: pointer;
    transition: background .2s ease;
    justify-content: center;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

/* ---------- Right: form ---------- */
.contact-form-card {
    background: #FFFFFF;
    border: 2px solid #171A261F;
    border-radius: 30px;
    padding: 40px 30px;
}
.contact-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.contact-form-group {
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
}
.contact-form-label {
    color: #171A26;
    margin-bottom: 4px;
    font-weight: 400;
    font-size: 18px;
    line-height: 21px;
    letter-spacing: 0%;
}
.contact-form-label span{color:#FF4700}
.contact-form-input, .contact-form-textarea {
    width: 100%;
    font: inherit;
    color: #171A26;
    border: 1px solid #171A261F;
    border-radius: 8px;
    padding: 16px 20px;
    outline: none;
    transition: border-color .2s ease;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
}
.contact-form-textarea{min-height:120px;resize:vertical}

.contact-form-input::placeholder,
.contact-form-textarea::placeholder{color:rgba(23,26,38,.4)}

.contact-form-submit {
    width: 100%;
    background: #FF4700;
    color: #FFFFFF;
    padding: 20px;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: background .2s ease;
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}
.contact-form-submit:hover{background:#e63f00}

@media (max-width:992px){
  .contact-container{
	  grid-template-columns:1fr 1fr;
	  gap:40px
	  }
	  h2.contact-title br {
    display: none;
}
a.contact-cta {
    display: inline-block;
}
.contact-detail-label {
    margin-bottom: 4px;
}
h2.contact-title {
    max-width: 380px;
    font-size: 32px;
    line-height: 32px;
    margin-bottom: 16px;
}
p.contact-description {
    margin-top: 0;
    font-size: 16px;
    line-height: 18px;
}
  .contact-form-row{grid-template-columns:1fr;gap:0}
}
@media(max-width:767px){
	  .contact-container{
	  grid-template-columns:1fr;
	  }
	
}

/* contact Page css end here */
/* =========================================================
   PRODUCT DETAIL GALLERY
========================================================= */
 
.product-gallery-modern {
    min-width: 0;
}
 
/* =========================================================
   MAIN IMAGE STAGE
========================================================= */
 
.product-gallery-stage {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 7px;
    background: #fff;
}
 
.product-gallery-stage .product-main-swiper {
    width: 100%;
    height: 100%;
}
 
.product-gallery-stage .swiper-wrapper {
    height: 100%;
}
 
.product-gallery-stage .swiper-slide {
    width: 100% !Important;
    height: 100% ;
}
 
.product-gallery-modern .detail-image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 28px;
    background: #fff;
}
 
.product-gallery-modern .detail-image img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center;
}
 
 
/* =========================================================
   PREVIOUS / NEXT ARROWS
========================================================= */
 
.product-gallery-nav {
    position: absolute;
    z-index: 10;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 52px;
    padding: 0;
    border: 1px solid #d7dce3;
    border-radius: 5px;
    background: rgba(255, 255, 255, .96);
    color: #555f6d;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .10);
    cursor: pointer;
    transform: translateY(-50%);
    transition:
        background .18s ease,
        color .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}
 
.product-gallery-nav:hover {
    border-color: #FF4700;
    background: #FF4700;
    color: #fff;
    box-shadow: 0 5px 16px rgba(15, 23, 42, .16);
}
 
.product-gallery-prev {
    left: 10px;
}
 
.product-gallery-next {
    right: 10px;
}
 
.product-gallery-nav.swiper-button-disabled {
    opacity: .25;
    pointer-events: none;
}
 
 
/* =========================================================
   ZOOM BUTTON
========================================================= */
 
.product-gallery-zoom {
    position: absolute;
    z-index: 10;
    top: 12px;
    right: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .94);
    color: #667085;
    cursor: pointer;
    transition:
        background .18s ease,
        color .18s ease,
        transform .18s ease;
}
 
.product-zoom-button:hover {
    border-color: #FF4700;
    background: #FF4700;
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .18);
    transform: translateY(-1px);
}
 
 
/* =========================================================
   THUMBNAILS
========================================================= */
 
.product-gallery-thumbs {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    margin-top: 13px;
    padding: 1px 1px 4px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: thin;
}
 
.product-gallery-thumb {
    flex: 0 0 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    padding: 5px;
    border: 1px solid #d9dee7;
    border-radius: 5px;
    background: #fff;
    cursor: pointer;
    opacity: .78;
    transition:
        opacity .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease;
}
 
 
.product-gallery-thumb.is-active {
    opacity: 1;
    box-shadow:
        0 0 0 1px var(--store-orange, #ff5a1f);
}
 
.product-gallery-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}
 
 
/* =========================================================
   PRODUCT GALLERY RESPONSIVE
========================================================= */
 
@media (max-width: 768px) {
 
    .product-gallery-modern .detail-image {
        padding: 20px;
    }
 
    .product-gallery-nav {
        width: 36px;
        height: 46px;
    }
 
    .product-gallery-prev {
        left: 6px;
    }
 
    .product-gallery-next {
        right: 6px;
    }
 
    .product-gallery-thumb {
        flex-basis: 64px;
 
        width: 64px;
        height: 64px;
    }
 
}
 
 
@media (max-width: 480px) {
 
    .product-gallery-modern .detail-image {
        padding: 14px;
    }
 
    .product-gallery-nav {
        width: 32px;
        height: 42px;
    }
 
    .product-gallery-thumb {
        flex-basis: 58px;
        width: 58px;
        height: 58px;
    }
 
}
 
.product-tab-nav button.details.active {
    color: #FF4700;
}
 
/* =========================================================
   PRODUCT IMAGE ZOOM
   WHEELHERO-STYLE LIGHTBOX
========================================================= */
 
.product-zoom-trigger {
    position: relative;
    overflow: hidden;
}
 
.product-zoom-trigger>img {
    cursor: zoom-in;
}
 
 
/* =========================================================
   OPEN ZOOM BUTTON
========================================================= */
 
.product-zoom-button {
    position: absolute;
    right: 14px;
    bottom: 14px;
    z-index: 12;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid #d9dee7;
    border-radius: 8px;
    background: rgba(255, 255, 255, .96);
    color: #374151;
    font-size: 21px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    box-shadow:
        0 3px 12px rgba(15, 23, 42, .10);
    transition:
        background .18s ease,
        color .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease;
}
 

 
 
/* =========================================================
   MODAL
========================================================= */
 
.product-image-zoom-modal {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 26px;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition:
        opacity .22s ease,
        visibility .22s ease;
}
 
.product-image-zoom-modal.is-open {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}
 
 
/* =========================================================
   BACKDROP
========================================================= */
 
.product-image-zoom-backdrop {
    position: absolute;
    inset: 0;
    background:
        rgba(0, 0, 0, .68);
    backdrop-filter: blur(1px);
    -webkit-backdrop-filter: blur(1px);
}
 
 
/* =========================================================
   LIGHTBOX WINDOW
========================================================= */
 
.product-image-zoom-dialog {
    position: relative;
    z-index: 2;
    width: min(960px,
            calc(100vw - 70px));
    height: min(770px,
            calc(100vh - 55px));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 0;
    border-radius: 7px;
    background: #ffffff;
    box-shadow:
        0 26px 70px rgba(0, 0, 0, .30);
    transform: scale(.985);
    transition:
        transform .22s ease;
}
 
.product-image-zoom-modal.is-open .product-image-zoom-dialog {
    transform: scale(1);
}
 
 
/* =========================================================
   TOOLBAR
========================================================= */
 
.product-image-zoom-toolbar {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 20;
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: auto;
    padding: 0;
    border: 0;
    background: transparent;
}
 
 
/* =========================================================
   ZOOM CONTROLS
========================================================= */
 
.product-image-zoom-control {
    width: 36px;
    min-width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 7px;
    background: rgba(255, 255, 255, .94);
    color: #171A26;
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
    transition: background .18s ease,
        color .18s ease,
        border-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}
 
.product-image-zoom-control:hover {
    color: #FF4700;
}
 
 
/* =========================================================
   ZOOM PERCENTAGE
========================================================= */
 
.product-image-zoom-level {
    min-width: 48px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    border-radius: 7px;
    background: rgba(255, 255, 255, .94);
    color: #171A26;
    font-size: 11px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .06);
    font-weight: 500;
}
 
 
/* =========================================================
   RESET BUTTON
========================================================= */
 
.product-image-zoom-reset {
    width: auto;
    min-width: 54px;
    padding: 0 10px;
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .03em;
}
 
 
/* =========================================================
   CLOSE BUTTON
========================================================= */
 
.product-image-zoom-close {
    margin-left: 3px;
    width: 36px;
    min-width: 36px;
    height: 36px;
    border: 0;
    background:rgba(255, 255, 255, .96);
    color: #111827;
    font-size: 21px;
    font-weight: 400;
}
 
.product-image-zoom-close:hover {
    background: #FF4700;
    color: #ffffff;
}
 
 
/* =========================================================
   IMAGE VIEWING AREA
========================================================= */
 
.product-image-zoom-stage {
    position: relative;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding:38px 54px 74px;
    overflow: hidden;
    background: #ffffff;
    cursor: grab;
    user-select: none;
    touch-action: none;
}
 
.product-image-zoom-stage.is-dragging {
    cursor: grabbing;
}
 
 
/* =========================================================
   ZOOMED IMAGE
========================================================= */
 
.product-image-zoom-stage img {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center;
    transform-origin: center center;
    will-change: transform;
    pointer-events: none;
    transition:
        transform .16s ease;
}
 
.product-image-zoom-stage.is-dragging img {
    transition: none;
}
 
 
/* =========================================================
   OPTIONAL THUMBNAIL INSIDE MODAL
========================================================= */
 
.product-image-zoom-dialog .product-gallery-thumbs {
    position: absolute;
    left: 50%;
    bottom: 4px;
    z-index: 20;
    width: auto;
    max-width: calc(100% - 40px);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0;
    padding: 3px;
    overflow-x: auto;
    border-radius: 6px;
    background:
        rgba(255, 255, 255, .92);
    box-shadow:
        0 3px 14px rgba(15, 23, 42, .08);
    transform:
        translateX(-50%);
}
 
.product-image-zoom-dialog .product-gallery-thumb {
    flex: 0 0 70px;
    width: 70px;
    height: 70px;
    padding: 4px;
    border: 1px solid #d8dee8;
    border-radius: 5px;
    background: #ffffff;
    opacity: 1;
}
 
.product-image-zoom-dialog .product-gallery-thumb.is-active {
    border-color: #111827;
    box-shadow:
        0 0 0 1px #111827;
}
 
 
/* =========================================================
   LOCK PAGE SCROLL
========================================================= */
 
body.product-image-zoom-open {
    overflow: hidden;
}
 
 
/* =========================================================
   TABLET
========================================================= */
 
@media (max-width: 900px) {
 
    .product-image-zoom-modal {
        padding: 18px;
    }
 
    .product-image-zoom-dialog {
        width:
            calc(100vw - 36px);
        height:
            calc(100vh - 36px);
    }
 
    .product-image-zoom-stage {
        padding:
            38px 35px 70px;
    }
}
 
 
/* =========================================================
   MOBILE
========================================================= */
 
@media (max-width: 600px) {
 
    .product-image-zoom-modal {
        padding: 8px;
    }
 
    .product-image-zoom-dialog {
        width: 100%;
        height:
            calc(100vh - 16px);
        border-radius: 6px;
    }
 
    .product-image-zoom-toolbar {
        top: 8px;
        right: 8px;
        gap: 4px;
    }
 
    .product-image-zoom-control {
        width: 34px;
        min-width: 34px;
        height: 34px;
        font-size: 16px;
    }
 
    .product-image-zoom-level {
        min-width: 42px;
        height: 32px;
        padding: 0 5px;
        font-size: 10px;
    }
 
    .product-image-zoom-reset {
        display: none;
    }
 
    .product-image-zoom-stage {
        padding:
            42px 12px 65px;
    }
 
    .product-image-zoom-dialog .product-gallery-thumb {
        flex-basis: 54px;
        width: 54px;
        height: 54px;
    }
 
    .product-zoom-button {
        right: 10px;
        bottom: 10px;
        width: 36px;
        height: 36px;
        font-size: 18px;
    }
}


/* =========================================================
   CART SUCCESS TOAST
========================================================= */
 
.lc-cart-toast {
    position: fixed;
    top: 96px;
    right: 24px;
    z-index: 99999;
    width: 360px;
    max-width: calc(100vw - 32px);
    overflow: hidden;
    border: 1px solid #dedede;
    border-radius: 10px;
    background: #fff;
    color: #111;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, .18),
        0 3px 12px rgba(0, 0, 0, .08);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform:
        translateX(
            calc(100% + 50px)
        );
    transition:
        transform .42s cubic-bezier(.22, 1, .36, 1),
        opacity .28s ease,
        visibility .42s ease;
}
 
 
/* =========================================================
   SHOW
========================================================= */
 
.lc-cart-toast.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
}
 
/* =========================================================
   HIDE TO RIGHT
========================================================= */
 
.lc-cart-toast.is-hiding {
    opacity: 0;
    visibility: visible;
    pointer-events: none;
    transform:
        translateX(
            calc(100% + 50px)
        );
    transition:
        transform .34s cubic-bezier(.55, 0, 1, .45),
        opacity .26s ease;
}
 
 
/* =========================================================
   ORANGE ACCENT
========================================================= */
 
.lc-cart-toast-accent {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 5px;
    background:
        linear-gradient(
            180deg,
            #ff7a00 0%,
            #ff9d2e 100%
        );
}
 
 
/* =========================================================
   CLOSE BUTTON
========================================================= */
 
.lc-cart-toast-close {
    position: absolute;
    top: 11px;
    right: 11px;
    z-index: 4;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 7px;
    background: #f4f4f4;
    color: #777;
    cursor: pointer;
    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}
 
 
.lc-cart-toast-close:hover {
    background: #111;
    color: #fff;
    transform: rotate(5deg);
}
 
.lc-cart-toast-close svg {
    width: 17px;
    height: 17px;
}
 
 
/* =========================================================
   BODY
========================================================= */
 
.lc-cart-toast-body {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 20px 20px 12px 20px;
}
 
/* =========================================================
   SUCCESS ICON
========================================================= */
 
.lc-cart-toast-icon {
    position: relative;
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #111;
    color: #fff;
    box-shadow:
        0 0 0 5px rgba(255, 122, 0, .12);
    transform: scale(.65);
    opacity: 0;
}
 
.lc-cart-toast.is-visible
.lc-cart-toast-icon {
    animation:
        lcToastIconPop
        .48s
        .14s
        cubic-bezier(.34, 1.56, .64, 1)
        forwards;
}
 
.lc-cart-toast-icon::after {
    content: "";
    position: absolute;
    right: -3px;
    bottom: -2px;
    width: 16px;
    height: 16px;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #FF4700;
}
 
.lc-cart-toast-icon svg {
    width: 25px;
    height: 25px;
}
 
@keyframes lcToastIconPop {
    0% {
        opacity: 0;
        transform: scale(.5) rotate(-12deg);
    }
 
    70% {
        opacity: 1;
        transform: scale(1.08) rotate(2deg);
    }
 
    100% {
        opacity: 1;
        transform: scale(1) rotate(0);
    }
 
}
 
 
/* =========================================================
   TEXT
========================================================= */
 
.lc-cart-toast-content {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
 
 
.lc-cart-toast-label {
    display: inline-flex;
    margin-bottom: 3px;
    color: #FF4700;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}
 
.lc-cart-toast-content strong {
    margin: 0 0 4px;
    color: #171A26;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
}
 
 
.lc-cart-toast-content p {
    margin: 0;
    color: #171A26B2;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
}
 
 
/* =========================================================
   FOOTER
========================================================= */
 
.lc-cart-toast-footer {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 0px 20px 20px;
    margin: 0 auto;
    flex-direction: row;
    justify-content: center;
}
/* =========================================================
   VIEW CART
========================================================= */
 
.lc-cart-toast-cart-button {
    min-height: 38px;
    padding: 0 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1px solid #FF4700;
    border-radius: 6px;
    background: #FF4700;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: background .18s ease,
        border-color .18s ease,
        color .18s ease,
        transform .18s ease;
}
 

.lc-cart-toast-cart-button svg {
    width: 15px;
    height: 15px;
}
 
 
/* =========================================================
   CONTINUE SHOPPING
========================================================= */
 
.lc-cart-toast-continue {
    min-height: 38px;
    padding: 0 12px;
    border: 1px solid #171A261F;
    border-radius: 6px;
    background: #fff;
    color: #171A26B2;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color .18s ease,
        color .18s ease,
        background .18s ease;
}
 
 
.lc-cart-toast-continue:hover {
    border-color: #FF4700;
    background: #FF4700;
    color: #ffffff;
}
 
 
/* =========================================================
   BOTTOM PROGRESS BAR
========================================================= */
 
.lc-cart-toast-progress {
    position: absolute;
    left: 5px;
    right: 0;
    bottom: 0;
    height: 3px;
    overflow: hidden;
    background: #ececec;
}
 
 
.lc-cart-toast-progress span {
    display: block;
    width: 100%;
    height: 100%;
    background: #FF4700;
    transform-origin: left center;
    transform: scaleX(1);
}
 
.lc-cart-toast.is-visible
.lc-cart-toast-progress span {
    animation:
        lcToastProgress
        4.5s
        linear
        forwards;
}
 
 
@keyframes lcToastProgress {
 
    from {
        transform: scaleX(1);
    }
 
    to {
        transform: scaleX(0);
    }
 
}
 
 
/* =========================================================
   ERROR STATE
========================================================= */
 
.lc-cart-toast.is-error
.lc-cart-toast-accent,
.lc-cart-toast.is-error
.lc-cart-toast-progress span,
.lc-cart-toast.is-error
.lc-cart-toast-icon::after {
    background: #dc2626;
}
 
.lc-cart-toast.is-error
.lc-cart-toast-label {
    color: #dc2626;
}
 
/* =========================================================
   ADD TO CART LOADING BUTTON
========================================================= */
 
[data-product-add-button].is-adding {
    cursor: wait;
    opacity: .82;
    pointer-events: none;
}
 
 
[data-product-add-button].is-adding::before {
    content: "";
    width: 15px;
    height: 15px;
    display: inline-block;
    margin-right: 8px;
    vertical-align: -2px;
    border: 2px solid
        rgba(255, 255, 255, .45);
    border-top-color: #fff;
    border-radius: 50%;
    animation:
        lcCartButtonSpin
        .65s
        linear
        infinite;
}
 
 
@keyframes lcCartButtonSpin {
    to {
        transform:
        rotate(360deg);
    }
}
 
/* =========================================================
   MOBILE
========================================================= */
 
@media (max-width: 600px) {
    .lc-cart-toast {
        top: 78px;
        right: 12px;
        width:
            calc(100vw - 24px);
        max-width: none;
    }
 
    .lc-cart-toast-body {
        padding:
            18px
            45px
            15px
            19px;
    }
 
    .lc-cart-toast-footer {
        padding:
            0
            16px
            17px
            86px;
        flex-wrap: wrap;
    }
    .lc-cart-toast-icon {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
    }
}


.single-product-specs {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #e5e7eb;
}

.single-product-spec-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 4px 0;
    font-size: 12px;
    line-height: 1.4;
}

.single-product-spec-label {
    color: #6b7280;
    font-weight: 500;
}

.single-product-spec-value {
    color: #111827;
    font-weight: 700;
    text-align: right;
}


/*
|--------------------------------------------------------------------------
| CARD VARIANT
|--------------------------------------------------------------------------
*/

.card-cart-form {
    margin-top: 14px;
}

.card-variant-field {
    margin-bottom: 12px;
}

.card-variant-field label {
    display: block;
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 700;
}

.card-variant-select {
    width: 100%;
    min-height: 42px;
    padding: 8px 10px;

    border: 1px solid #d1d5db;
    border-radius: 6px;

    background: #fff;

    font-size: 13px;

    outline: none;
}
.card-variant-select option {
    font-size: 10px;
}
.card-variant-select:focus {
    border-color: #111827;
}


/*
|--------------------------------------------------------------------------
| CART ACTIONS
|--------------------------------------------------------------------------
*/

.card-cart-actions {
    display: flex;
    align-items: stretch;
    gap: 10px;
}


/*
|--------------------------------------------------------------------------
| QUANTITY
|--------------------------------------------------------------------------
*/

.card-qty-selector {
    display: flex;
    align-items: center;
    /* height: 42px; */
    border: 1px solid #d1d5db;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    padding: 0px 10px;
}

.card-qty-button {
    /* width: 34px; */
    /* min-width: 34px; */
    border: 0;
    background: #ffffff;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
}

.card-qty-button:hover:not(:disabled) {
    background: #e9e9e9;
}

.card-qty-button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.card-qty-selector input {
    width: 42px;

    border: 0;
    outline: none;

    text-align: center;

    font-size: 13px;
    font-weight: 700;

    appearance: textfield;
    -moz-appearance: textfield;
}

.card-qty-selector input::-webkit-inner-spin-button,
.card-qty-selector input::-webkit-outer-spin-button {
    margin: 0;
    -webkit-appearance: none;
}

.card-cart-actions .mini-cart {
    flex: 1;
    min-height: 42px;
}

.card-product-price {
    display: flex;
    align-items: center;
    gap: 8px;
}

.card-product-price del {
    opacity: .6;
}


@media (max-width: 480px) {

    .card-cart-actions {
        gap: 8px;
    }

    .card-qty-button {
        width: 32px;
        min-width: 32px;
    }

    .card-qty-selector input {
        width: 38px;
    }
}



.checkout-stripe-panel {
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #fff;
    border-top: 1px solid #e8edf3;
}

.checkout-stripe-panel .checkout-gateway-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 20px 22px;
    margin: 0;
    background: #fff;
    border-bottom: 1px solid #edf0f4;
}

.checkout-gateway-title-row {
    display: flex;
    align-items: center;
    gap: 11px;
}

.checkout-gateway-title-row strong {
    color: #171A26;
    font-weight: 500;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0%;
}

.checkout-gateway-top p {
    margin: 7px 0 0;
    color: #7b8495;
    font-size: 12px;
    line-height: 100%;
    font-weight: 400;
}

.checkout-stripe-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 9px;
    background: #635BFF;
    color: #fff;
    font-size: 24px;
    font-weight: 600;
}

.checkout-gateway-secure-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 6px 9px;
    border-radius: 7px;
    background: #f1f0ff;
    color: #635BFF;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .04em;
}

.stripe-payment-shell {
    position: relative;
    width: 100%;
    max-width: 920px;
    margin: 0 auto;
    padding: 26px 24px 22px;
    background: #fff;
}

.stripe-payment-element {
    width: 100%;
    min-width: 0;
}

.stripe-payment-element iframe,
.stripe-express-checkout-element iframe {
    width: 100% !important;
}

.stripe-express-wrap {
    width: 100%;
    margin: 0 0 22px;
}

.stripe-express-wrap[hidden] {
    display: none !important;
}

.stripe-express-heading {
    margin-bottom: 10px;
    color: #344054;
    font-size: 12px;
    font-weight: 700;
}

.stripe-express-checkout-element {
    width: 100%;
}

.stripe-express-divider {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 22px 0 0;
    color: #98a2b3;
    font-size: 9px;
    font-weight: 750;
    letter-spacing: .08em;
    white-space: nowrap;
}

.stripe-express-divider::before,
.stripe-express-divider::after {
    content: "";
    display: block;
    flex: 1;
    height: 1px;
    background: #e6eaf0;
}

.stripe-element-loading {
    display: grid;
    gap: 13px;
    width: 100%;
}

.stripe-loading-heading {
    width: 145px;
    height: 17px;
    border-radius: 6px;
    background: linear-gradient(
        90deg,
        #f1f3f6 25%,
        #e5e9ee 50%,
        #f1f3f6 75%
    );
    background-size: 200% 100%;
    animation: checkoutStripeLoading 1.2s linear infinite;
}

.stripe-loading-input {
    width: 100%;
    height: 52px;
    border-radius: 10px;
    background: linear-gradient(
        90deg,
        #f1f3f6 25%,
        #e5e9ee 50%,
        #f1f3f6 75%
    );
    background-size: 200% 100%;
    animation: checkoutStripeLoading 1.2s linear infinite;
}

.stripe-loading-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
}

.stripe-loading-grid > div {
    height: 52px;
    border-radius: 10px;
    background: linear-gradient(
        90deg,
        #f1f3f6 25%,
        #e5e9ee 50%,
        #f1f3f6 75%
    );
    background-size: 200% 100%;
    animation: checkoutStripeLoading 1.2s linear infinite;
}

@keyframes checkoutStripeLoading {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.checkout-payment-trust {
    display: flex;
    align-items: center;
    gap: 11px;
    width: calc(100% - 48px);
    max-width: 872px;
    margin: 0 auto 24px;
    padding: 13px 15px;
    border: 1px solid #e2f1e7;
    border-radius: 10px;
    background: #f5faf7;
}

.checkout-payment-trust > div {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #0C94001A;
    color: #0C9400;
    font-size: 19px;
    font-weight: 800;
}

.checkout-payment-trust span {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.checkout-payment-trust strong {
    color: #0C9400;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}

.checkout-payment-trust small {
    color: #171A26B2;
    font-weight: 400;
    font-size: 12px;
    line-height: 20px;
    letter-spacing: 0%;
}
.checkout-gateway-error {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 15px 17px;
    border: 1px solid #fecaca;
    border-radius: 10px;
    background: #fff7f7;
}

.checkout-gateway-error strong {
    color: #b42318;
    font-size: 13px;
}

.checkout-gateway-error span {
    color: #8f4d49;
    font-size: 12px;
    line-height: 1.5;
}

html.checkout-login-open,
body.checkout-login-open {
    overflow: hidden !important;
    overscroll-behavior: none;
}

.checkout-login-modal {
    position: fixed;
    inset: 0;
    z-index: 9999999;
    display: grid;
    place-items: center;
    width: 100%;
    height: 100dvh;
    padding: 20px;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    isolation: isolate;
    transition:
        opacity .22s ease,
        visibility .22s ease;
}

.checkout-login-modal.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.checkout-login-overlay {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    background: rgba(10, 18, 32, .64);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    overscroll-behavior: none;
    touch-action: none;
}

.checkout-login-dialog {
    position: relative;
    z-index: 1;
    width: min(100%, 460px);
    max-height: calc(100dvh - 40px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: 32px;
    border: 1px solid #e5e9ef;
    border-radius: 18px;
    background: #fff;
    box-shadow:
        0 28px 80px rgba(15, 23, 42, .28),
        0 4px 18px rgba(15, 23, 42, .10);
    opacity: 0;
    transform: translateY(14px) scale(.975);
    transition:
        opacity .22s ease,
        transform .22s ease;
}

.checkout-login-modal.is-open .checkout-login-dialog {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.checkout-login-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f2f4f7;
    color: #475467;
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}

.checkout-login-modal-close:hover {
    background: #e7eaee;
    color: #101828;
    transform: rotate(5deg);
}

.checkout-login-eyebrow {
    display: inline-block;
    margin: 0 45px 8px 0;
    color: #ff5a14;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
}

.checkout-login-dialog h2 {
    margin: 0 44px 8px 0;
    color: #101828;
    font-size: 27px;
    font-weight: 800;
    line-height: 1.2;
}

.checkout-login-dialog > p {
    margin: 0 0 22px;
    color: #667085;
    font-size: 13px;
    line-height: 1.55;
}

.checkout-login-error {
    margin: 0 0 16px;
    padding: 12px 14px;
    border: 1px solid #fecaca;
    border-radius: 9px;
    background: #fff5f5;
    color: #b42318;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
}

.checkout-login-error[hidden] {
    display: none !important;
}

.checkout-login-dialog form {
    display: grid;
    gap: 16px;
}

.checkout-login-dialog form > label:not(.checkout-login-remember) {
    display: grid;
    gap: 7px;
    margin: 0;
    color: #344054;
    font-size: 12px;
    font-weight: 700;
}

.checkout-login-dialog input[type="email"],
.checkout-login-dialog input[type="password"] {
    display: block;
    width: 100%;
    height: 49px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid #d6dce5;
    border-radius: 9px;
    outline: none;
    background: #fff;
    color: #101828;
    font-size: 14px;
    box-shadow: none;
    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.checkout-login-dialog input[type="email"]:focus,
.checkout-login-dialog input[type="password"]:focus {
    border-color: #ff5a14;
    box-shadow: 0 0 0 3px rgba(255, 90, 20, .10);
}

.checkout-login-remember {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 9px !important;
    width: fit-content;
    margin: 0;
    color: #667085;
    cursor: pointer;
}

.checkout-login-remember input {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    margin: 0;
    accent-color: #ff5a14;
}

.checkout-login-remember span {
    font-size: 12px;
    font-weight: 500;
}

.checkout-login-dialog [data-checkout-login-submit] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 49px;
    margin: 2px 0 0;
    padding: 12px 18px;
    border: 0;
    border-radius: 9px;
    background: #ff5a14;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
    transition:
        background .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.checkout-login-dialog
[data-checkout-login-submit]:hover:not(:disabled) {
    background: #e94c0b;
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(255, 90, 20, .20);
}

.checkout-login-dialog
[data-checkout-login-submit]:disabled {
    opacity: .65;
    cursor: wait;
    transform: none;
}

.checkout-login-register {
    margin-top: 21px;
    padding-top: 18px;
    border-top: 1px solid #eaecf0;
    text-align: center;
    color: #667085;
    font-size: 12px;
}

.checkout-login-register a {
    margin-left: 3px;
    color: #ff5a14;
    font-weight: 700;
    text-decoration: none;
}

.checkout-login-register a:hover {
    text-decoration: underline;
}

@media (max-width: 767px) {
    .checkout-stripe-panel .checkout-gateway-top {
        gap: 10px;
        padding: 16px;
    }

    .checkout-stripe-logo {
        flex-basis: 34px;
        width: 34px;
        height: 34px;
    }

    .checkout-gateway-title-row {
        gap: 9px;
    }

    .checkout-gateway-title-row strong {
        font-size: 18px;
    }

    .checkout-gateway-top p {
        font-size: 12px;
    }

    .checkout-gateway-secure-badge {
        padding: 5px 7px;
        font-size: 8px;
    }

    .stripe-payment-shell {
        padding: 10px;
    }

    .stripe-express-wrap {
        margin-bottom: 18px;
    }

    .stripe-express-divider {
        gap: 9px;
        margin-top: 18px;
        font-size: 8px;
    }

    .stripe-loading-grid {
        grid-template-columns: 1fr;
    }

    .checkout-payment-trust {
        width: calc(100% - 28px);
        margin: 0 14px 16px;
        padding: 12px;
        align-items: flex-start;
    }

    .checkout-login-modal {
        place-items: center;
        height: 100dvh;
        padding: 14px;
    }

    .checkout-login-dialog {
        width: 100%;
        max-width: 430px;
        max-height: calc(100dvh - 28px);
        padding: 27px 18px 22px;
        border-radius: 16px;
    }

    .checkout-login-modal-close {
        top: 12px;
        right: 12px;
        width: 35px;
        height: 35px;
        font-size: 23px;
    }

    .checkout-login-eyebrow {
        margin-right: 42px;
        font-size: 9px;
    }

    .checkout-login-dialog h2 {
        margin-right: 42px;
        font-size: 22px;
    }

    .checkout-login-dialog > p {
        margin-bottom: 19px;
        font-size: 12px;
    }

    .checkout-login-dialog input[type="email"],
    .checkout-login-dialog input[type="password"] {
        height: 48px;
        font-size: 16px;
    }

    .checkout-login-dialog
    [data-checkout-login-submit] {
        min-height: 48px;
    }
}

@media (max-width: 420px) {
    .checkout-login-modal {
        padding: 10px;
    }

    .checkout-login-dialog {
        max-height: calc(100dvh - 20px);
        padding: 25px 16px 20px;
        border-radius: 15px;
    }

    .checkout-login-dialog h2 {
        font-size: 21px;
    }

    .checkout-gateway-secure-badge {
        display: none;
    }

    .stripe-payment-shell {
        padding: 16px 10px;
    }

    .checkout-payment-trust {
        width: calc(100% - 20px);
        margin: 0 10px 14px;
    }
}

#stripePaymentEmpty[hidden],
.checkout-gateway-error[hidden] {
    display: none !important;
}

#stripePaymentEmpty:not([hidden]) {
    display: flex;
}



/* =========================================================
   ORDER CONFIRMATION / THANK YOU PAGE
========================================================= */

.order-confirmation-section {
    position: relative;
    padding: 100px 0px;
    background-image: url("/images/home/Thankyou-background.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.order-confirmation-section .container {
    width: 100%;
    margin: 0 auto;
    max-width: 1024px;
}


/* =========================================================
   MAIN BOX
========================================================= */

.order-confirmation-box {
    position: relative;
    margin: 0 auto;
    background: transparent;
}



/* =========================================================
   SUCCESS ICON
========================================================= */

.order-confirmation-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}


/* =========================================================
   HEADER
========================================================= */

.order-confirmation-eyebrow {
    display: block;
    margin-bottom: 10px;
    color: #ff5a14;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    text-align: center;
}

.order-confirmation-box > h1 {
    margin: 0;
    color: #FF4700;
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    text-transform: capitalize;
    margin-top: 30px;
}

.order-confirmation-box > p {
    margin: 12px auto 80px;
    color: #171A26B2;
    font-weight: 400;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
}


/* =========================================================
   ORDER NUMBER
========================================================= */

.order-confirmation-number {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 0 0 30px;
    padding: 28px 30px;
    background: #FF47000D;
    border: 2px solid #FF470080;
    border-radius: 20px;
    backdrop-filter: blur(20px);
}

.order-confirmation-number span {
    color: #171A26;
    font-weight: 400;
    font-size: 24px;
    line-height: 26px;
    letter-spacing: 0%;
}
.order-confirmation-number strong {
    color: #FF4700;
    font-weight: 600;
    font-size: 24px;
    line-height: 26px;
    letter-spacing: 0%;
}


/* =========================================================
   STATUS GRID
========================================================= */

.order-confirmation-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}
.order-confirmation-card {
    position: relative;
    padding: 23px 20px;
    border: 2px solid #171A2633;
    border-radius: 20px;
    transition: transform 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease;
    backdrop-filter: blur(20px);
}

.order-confirmation-card:hover {
    transform: translateY(-2px);
    border-color: #FF470080;
    box-shadow:
        0 8px 24px rgba(15, 23, 42, 0.06);
}

.order-confirmation-card span {
    display: block;
    margin-bottom: 4px;
    color: #171A26B2;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
}

.order-confirmation-card strong {
    display: block;
    color: #171A26;
    font-weight: 600;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0%;
    text-transform: capitalize;
}


/* =========================================================
   DETAILS SECTIONS
========================================================= */

.order-confirmation-details, .order-confirmation-address, .order-confirmation-contact, .order-confirmation-payment-note {
    margin-top: 30px;
    padding: 20px;
    border: 1px solid #171A261F;
    border-radius: 20px;
}

.order-confirmation-details h2, .order-confirmation-address h2, .order-confirmation-contact h2 {
    position: relative;
    margin: 0 0 20px;
    padding-bottom: 14px;
    color: #171A26;
    font-weight: 500;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
}

.order-confirmation-details h2::after, .order-confirmation-address h2::after, .order-confirmation-contact h2::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 42px;
    height: 4px;
    border-radius: 10px;
    background: #FF4700;
}

/* =========================================================
   PRODUCT ROW
========================================================= */
.order-confirmation-details .order-confirmation-product:last-child {
    border-bottom: none;
}
.order-confirmation-product {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    padding: 20px 0;
    border-bottom: 1px solid #171a261f;
}

.order-confirmation-product:first-of-type {
    padding-top: 0;
}


/* =========================================================
   TOTALS
========================================================= */

.order-confirmation-totals {
    margin-top: 30px;
    padding: 20px;
    border: 1px solid #171A261F;
    border-radius: 20px;
}

.order-confirmation-totals > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
	margin-bottom: 20px;
}

.order-confirmation-totals > div strong {
    color: #344054;
    font-weight: 700;
}

.order-confirmation-totals .order-confirmation-grand-total {
    border-top: 2px solid #171A261F;
    padding-top: 20px;
    margin-bottom: 0px;
}

.order-confirmation-totals .order-confirmation-grand-total span {
    color: #171A26;
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.order-confirmation-totals  .order-confirmation-grand-total strong {
    color: #FF4700;
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.order-confirmation-totals span {
    color: #171A26;
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
	
}
.order-confirmation-totals > div strong {
    color: #171A26;
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}

.order-confirmation-contact-details {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}
.order-confirmation-contact-details-icon {
    max-width: 48px;
    width: 100%;
}
.order-confirmation-contact-details-icon img {
    max-width: 100%;
    width: 100%;
}
.order-confirmation-contact-details-content h3 {
    color: #171A26;
    font-family: Poppins;
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
}
.order-confirmation-contact-details-content h4 {
    font-family: Poppins;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: lowercase;
    color: #000000B2;
    padding-top: 4px;
}
/* =========================================================
   ADDRESS / CUSTOMER
========================================================= */


.order-confirmation-address p,
.order-confirmation-contact p {
    margin: 0;
    color: #667085;
    font-size: 14px;
    line-height: 1.8;
}

.order-confirmation-address p strong,
.order-confirmation-contact p strong {
    color: #202631;
}


/* =========================================================
   PAYMENT NOTICE
========================================================= */


.order-confirmation-payment-note.cancelled {
    display: flex;
    flex-direction: row;
    gap: 20px;
    align-items: center;
}
.order-confirmation-payment-note strong {
    display: block;
    margin-bottom: 6px;
    color: #202631;
    font-size: 16px;
    font-weight: 800;
}

.order-confirmation-payment-note p {
    margin: 0;
    color: #667085;
    font-size: 14px;
    line-height: 1.6;
}

.order-confirmation-image img {
    height: 100%;
    width: 100%;
    max-width: 120px;
    object-fit: contain;
    border: 1.2px solid #171A261F;
    background: #FFFFFF;
    border-radius: 4px;
}
p.order-confirmation-product-detailss {
    color: #171A26;
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.order-confirmation-product-details .order-confirmation-product-detailss p {
    color: #000000B2;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    padding-top: 4px;
}
p.order-conf-total-price {
    color: #171A26;
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
}
/* =========================================================
   ACTION BUTTON
========================================================= */

.order-confirmation-actions {
    display: flex;
    justify-content: center;
    margin-top: 38px;
}

.order-conf-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60px;
    padding: 12px 30px;
    border: 0;
    border-radius: 60px;
    background: #FF4700;
    color: #ffffff;
    text-decoration: none;
    transition: transform 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease;
    cursor: pointer;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
    min-width: 289px;
}

.order-confirmation-actions .btn:hover {
    transform: translateY(-2px);
    background: #ed4e0c;
    box-shadow:
        0 14px 30px rgba(255, 90, 20, 0.28);
    color: #ffffff;
}
.order-confirmation-image {
    display: flex;
    gap: 30px;
}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 900px) {

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

}
@media (max-width: 767px) {
.order-confirmation-section {
  padding: 40px 0px;
}
.order-confirmation-box > h1 , .order-confirmation-box.is-cancelled h5 {
    font-size: 30px;
}
.cancelled-image img {
    max-width: 42px;
}
.order-confirmation-payment-note.cancelled p {
    font-size: 12px;
    line-height: 16px;
}
.order-confirmation-box > p {
    margin: 10px auto 40px;
    font-size: 12px;
}
.order-confirmation-number {
    align-items: flex-start;
    justify-content: flex-start;
    gap: 6px;
    margin: 0 0 24px;
    padding: 14px 20px;
    border-radius: 12px;
    flex-direction: column;
}
.order-confirmation-number span {
    font-size: 22px;
    line-height: 28px;
}
.order-confirmation-number strong {
    font-size: 22px;
    line-height: 28px;
}
.order-confirmation-card {
    padding: 10px 10px;
    border-radius: 12px;
}
.order-confirmation-card span {
    font-size: 14px;
}
.order-confirmation-card strong {
    font-size: 16px;
    line-height: 24px;
}
.order-confirmation-grid {
    gap: 16px;
    margin-bottom: 24px;
}
.order-confirmation-details, .order-confirmation-address, .order-confirmation-contact, .order-confirmation-payment-note {
    margin-top: 24px;
    padding: 10px;
    border-radius: 12px;
}
.order-confirmation-details h2, .order-confirmation-address h2, .order-confirmation-contact h2 {
    font-size: 16px;
	margin: 0 0 14px;
}
.order-confirmation-image img {
    height: 100%;
    width: 100%;
    max-width: 84px;
}
.order-confirmation-image {
    gap: 6px;
}
.order-confirmation-image p.order-confirmation-product-detailss {
    font-weight: 700;
    font-size: 16px;
	margin-bottom: 4px;
}
.order-confirmation-product {
    align-items: end;
	gap: 10px;
}
p.order-conf-total-price {
    font-size: 20px;
}
.order-confirmation-totals {
    margin-top: 24px;
    padding: 20px 10px;
}
.order-confirmation-totals span {
    font-size: 18px;
}
.order-confirmation-totals > div strong {
    font-weight: 500;
    font-size: 18px;
}
.order-confirmation-totals .order-confirmation-grand-total span {
    font-size: 22px;
}
.order-confirmation-totals  .order-confirmation-grand-total strong {
    font-size: 22px;
}
.order-confirmation-details h2, .order-confirmation-address h2, .order-confirmation-contact h2 {
    padding-bottom: 9px;
    font-weight: 500;
    font-size: 16px;
}
.order-confirmation-contact-details-icon {
    max-width: 88px;
    width: 100%;
    padding: 17px 20px;
    border-radius: 8px;
    border: 2px solid #FF47001F;
}
.order-confirmation-contact-details {
    gap: 20px;
}
.order-confirmation-contact-details-content h4 {
    font-size: 16px;
    line-height: 22px;
    padding-top: 6px;
}
.order-confirmation-contact {
    padding: 10px;
    border-radius: 12px;
}
.order-confirmation-actions {
    margin-top: 40px;
	gap: 24px;
}
.order-conf-btn {
    min-height: auto;
    padding: 18px 30px;
    font-size: 16px;
    line-height: 22px;
}
.order-cancel-button {
    min-height: auto;
    padding: 18px 30px;
    font-size: 16px;
    line-height: 22px; 
}
}
@media (max-width: 480px) {
.order-confirmation-product-details p {
    font-size: 12px;
}
}
/* =========================================================
   CONFIRMATION ALERTS
========================================================= */

.order-confirmation-alert {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 25px;
    padding: 16px 18px;
    border: 1px solid;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.6;
}

.order-confirmation-alert > span {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    font-size: 13px;
    font-weight: 800;
}

.order-confirmation-alert.success {
    color: #166534;
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.order-confirmation-alert.success > span {
    color: #ffffff;
    background: #16a34a;
}

.order-confirmation-alert.error {
    color: #991b1b;
    background: #fef2f2;
    border-color: #fecaca;
}

.order-confirmation-alert.error > span {
    color: #ffffff;
    background: #dc2626;
}


/* =========================================================
   ORDER ACTIONS
========================================================= */

.order-confirmation-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 38px;
}

.order-confirmation-actions form {
    margin: 0;
}

.order-cancel-button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60px;
    padding: 12px 30px;
    border: 1px solid #FF0004;
    border-radius: 60px;
    background: transparent;
    color: #FF0004;
    cursor: pointer;
    transition: background 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: capitalize;
    min-width: 289px;
}
.order-confirmation-details {
    max-height: 466px;
    height: 100%;
    overflow-y: auto;
overflow-x:hidden;
}

.order-confirmation-details::-webkit-scrollbar {
    width: 6px;
}

.order-confirmation-details::-webkit-scrollbar-track {
    background: #171A261F;
    border-radius: 8px;
}

.order-confirmation-details::-webkit-scrollbar-thumb {
    background: #FF4700;
    border-radius: 8px;
}
.order-cancel-button:hover {
    transform: translateY(-1px);
    color: #ffffff;
    background: #FF0004;
    border-color: #FF0004;
}

@media (max-width: 640px) {

    .order-confirmation-actions {
        flex-direction: column;
    }

    .order-confirmation-actions > a,
    .order-confirmation-actions form,
    .order-cancel-button {
        width: 100%;
    }

}

/* =========================================================
   CANCELLED ORDER
========================================================= */

.order-confirmation-box.is-cancelled::before {
    background: #dc2626;
}


.order-confirmation-box.is-cancelled
.order-confirmation-number {
    background: #FF00040D;
    border-color: #FF000480;
}
.order-confirmation-box.is-cancelled
.order-confirmation-number strong {
    color: #FF0004;
}

.order-confirmation-payment-note.cancelled {
    background: #FF00040D;
    backdrop-filter: blur(20px);
    border: 2px solid #FF000480;
}


.order-confirmation-payment-note.cancelled strong {
    color: #171A26;
    font-weight: 500;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
	    margin: 0px;
}

.order-confirmation-payment-note.cancelled p {
    color: #171A26B2;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
    margin-top: 4px;
}
/* =========================================================
   CUSTOMER ACCOUNT
========================================================= */

.customer-account-page {
    padding: 80px 0px;
    min-height: 70vh;
}

.customer-account-layout {
    display: grid;
    grid-template-columns: 350px minmax(0, 1fr);
    gap: 60px;
    align-items: start;
}

.customer-account-sidebar {
    position: sticky;
    top: 20px;
    overflow: hidden;
    border: 1px solid #e3e7ed;
    border-radius: 14px;
    background: #101827;
    box-shadow: 0 12px 35px rgba(15, 23, 42, .08);
	height:100%;
}

.customer-account-user {
    position: relative;
    padding: 40px;
    display: flex;
    align-items: center;
    gap: 14px;
    border-bottom: 1px solid #FFFFFF1F;
}

.customer-account-avatar {
    max-width: 60px;
    max-height: 60px;
	    width: 100%;
    height: 100%;
    flex: 0 0 60px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #FF4700;
}
.customer-account-avatar img {
    max-width: 60px;
    max-height: 60px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}
.customer-account-user > div:nth-child(2) {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.customer-account-user strong {
    color: #FFFFFF;
    font-weight: 500;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
}

.customer-account-user span {
    margin-top: 3px;
    color: #FFFFFFB2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
}

.customer-account-nav {
    padding: 40px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.customer-account-nav a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 60px;
    padding: 15px 30px;
    text-decoration: none;
    border-radius: 12px;
    transition: all 0.3s ease;
}

.customer-account-nav a:hover {
    background: rgba(255,255,255,.06);
    color: #fff;
}

.customer-account-nav a.active {
    background: #FF47000D;
    color: #FF4700;
}
.customer-account-nav a.active::before {
    content: "";
    position: absolute;
    left: -15px;
    top: 0;
    width: 4px;
    height: 60px;
    background: #ff4700;
    border-radius: 20px;
}
.customer-account-nav-icon {
    max-width: 24px;
    max-height: 24px;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
}	
nav.customer-account-nav span {
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #FFFFFF;
}
.customer-account-sidebar-bottom {
    padding: 40px;
    border-top: 1px solid #ffffff1f;
}

.customer-account-sidebar-bottom a,
.customer-account-sidebar-bottom button {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 60px;
    padding: 15px 30px;
    text-decoration: none;
    border-radius: 12px;
    transition: all 0.3s ease;
	    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #FFFFFF;
	    border: none;
    background: transparent !IMPORTANT;
}

.customer-account-sidebar-bottom a:hover,
.customer-account-sidebar-bottom button:hover {
    background: rgba(255,255,255,.06);
    color: #fff;
}
.customer-account-nav a.active .customer-account-nav-icon img {
    filter: invert(34%) sepia(98%) saturate(3557%) hue-rotate(359deg) brightness(101%) contrast(101%);
}
.customer-account-content {
    min-width: 0;
}

.customer-dashboard-heading {
    margin-bottom: 40px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}

.customer-dashboard-heading > div > span {
    color: #FF4700;
    font-family: Poppins;
    font-weight: 500;
    font-size: 12px;
    line-height: 100%;
    letter-spacing: 0%;
}

.customer-dashboard-heading h1 {
    margin: 8px 0 8px;
    color: #171A26;
    font-weight: 600;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
}

.customer-dashboard-heading p {
    margin: 0;
    color: #171A26B2;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
}
.customer-account-primary-button {
    padding: 10px 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 8px;
    background: #FF4700;
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    min-height: 43px;
}

.customer-dashboard-stats {
    margin-bottom: 40px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 13px;
}

.customer-dashboard-stat {
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 20px;
    border: 1px solid #171A261F;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0px 0px 12px 0px #0000001F;
}

.customer-dashboard-stat-icon {
    width: 70px;
    height: 70px;
    flex: 0 0 70px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #FF47001A;
}

.customer-dashboard-stat-icon.active {
    background: #0662F51A;
}
.customer-dashboard-stat-icon.completed {
    background: #00BF461A;
}

.customer-dashboard-stat-icon.paid {
    background: #6F30F41A;
}

.customer-dashboard-stat > div {
    display: flex;
    flex-direction: column;
}

.customer-dashboard-stat span {
    color: #171A26B2;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}

.customer-dashboard-stat strong {
    margin-top: 8px;
    color: #171A26;
    font-weight: 600;
    font-size: 30px;
    line-height: 100%;
    letter-spacing: 0%;
}

/*.customer-account-card {
    overflow: hidden;
    border: 1px solid #e3e7ed;
    border-radius: 12px;
    background: #fff;
}*/
.customer-orders-filter label {
    color: #171A26CC;
    font-family: Manrope;
    font-weight: 600;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0%;
}
.customer-account-card-heading {
    /* padding: 17px 19px; */
    display: flex;
    align-items: center;
    justify-content: space-between;
	    margin-bottom: 32px;
    gap: 15px;
    /* border-bottom: 1px solid #edf0f4; */
}

.customer-account-card-heading h2 {
    margin: 0;
    color: #171A26;
    font-weight: 600;
    font-size: 30px;
    line-height: 40px;
    letter-spacing: 0%;
}

.customer-account-card-heading p {
    margin: 4px 0 0;
    color: #171A26B2;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}

.customer-account-card-heading > a {
    color: #FF4700;
    text-decoration: none;
    font-family: Poppins;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}

.customer-orders-table {
    width: 100%;
    border-collapse: collapse;
}

.customer-orders-table th {
    padding: 11px 14px;
    background: #f8fafc;
    color: #171A26CC;
    font-family: Manrope;
    font-weight: 600;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0%;
    vertical-align: middle;
}

.customer-orders-table td {
    padding: 13px 14px;
    border-top: 1px solid #171A261F;
    font-family: Manrope;
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
	    color: #171A26B2;
}
strong.td-total-orders {
    padding: 13px 14px;
    font-family: Manrope;
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    color: #171A26;
}
.customer-order-number {
    color: #ff5a14;
}

.customer-order-status {
    align-items: center;
    font-family: Manrope;
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}

.customer-order-status.paid,
.customer-order-status.completed,
.customer-order-status.delivered,
.customer-order-status.picked_up {
    color:#00BF7F;
}

.customer-order-status.processing,
.customer-order-status.preparing,
.customer-order-status.ready_to_ship,
.customer-order-status.shipped,
.customer-order-status.in_transit,
.customer-order-status.out_for_delivery {
    color: #0662F5;
}

.customer-order-status.pending,
.customer-order-status.pending_payment,
.customer-order-status.unpaid,
.customer-order-status.unfulfilled,
.customer-order-status.ready_for_pickup {
    color: #E5C300;
}

.customer-order-status.cancelled,
.customer-order-status.failed,
.customer-order-status.delivery_failed {
    color: #FF0004;
}

.customer-order-status.refunded,
.customer-order-status.partially_refunded {
    color: #6F30F4;
}


.customer-order-status.pending_payment,
.customer-order-status.unpaid,
.customer-order-status.unfulfilled,
.customer-order-status.on_hold {
    color: #E5C300;
}


.customer-orders-mobile {
    display: none;
}

.customer-account-order-list {
    display: flex;
    flex-direction: column;
}

.customer-account-order-row {
    padding: 17px 19px;
    display: flex;
    align-items: center;
    justify-content: space-between;
	flex-wrap: wrap;
    gap: 20px;
    border-bottom: 1px solid #edf0f4;
}

.customer-account-order-row:last-child {
    border-bottom: 0;
}

.customer-account-order-main {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(120px, 1fr));
    gap: 20px;
}

.customer-account-order-main > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.customer-account-order-main span {
    color: #98a1af;
    font-size: 7px;
    font-weight: 700;
}

.customer-account-order-main strong {
    color: #1f2937;
    font-size: 10px;
}

.customer-account-order-statuses {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* =========================================================
   CUSTOMER ORDER SHIPMENT / TRACKING
========================================================= */

.customer-order-shipment-info {
    width: 100%;
    flex: 0 0 100%;

    margin-top: 2px;
    padding: 12px 14px;

    display: grid;
    grid-template-columns:
        repeat(3, minmax(120px, 1fr))
        auto;

    align-items: center;
    gap: 12px;

    border: 1px solid #e7ebf0;
    border-radius: 9px;

    background: #f8fafc;

    box-sizing: border-box;
}


.customer-order-shipment-info > div {
    min-width: 0;

    display: flex;
    flex-direction: column;
    gap: 3px;
}


.customer-order-shipment-info > div > span {
    color: #98a1af;

    font-size: 7px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: .03em;
}


.customer-order-shipment-info > div > strong {
    overflow: hidden;

    color: #253047;

    font-size: 9px;
    font-weight: 700;

    text-overflow: ellipsis;
    white-space: nowrap;
}


.customer-order-track-button {
    min-height: 34px;

    padding: 8px 13px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 7px;

    background: #ff5a14;

    color: #ffffff;

    font-size: 8px;
    font-weight: 700;

    text-decoration: none;

    white-space: nowrap;

    transition:
        background .18s ease,
        transform .18s ease;
}


.customer-order-track-button:hover {
    background: #e94b08;

    color: #ffffff;

    transform: translateY(-1px);
}


.customer-profile-grid {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 48px;
}

.customer-profile-form {
    padding: 18px;
}

.customer-profile-form label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    color: #171A26;
    font-weight: 400;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
}

.customer-profile-form input {
    width: 100%;
    min-height: 43px;
    padding: 9px 12px;
    border: 1px solid #171A2633;
    border-radius: 8px;
    background: #fff;
    color: #171A26;
    outline: 0;
    box-sizing: border-box;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
}

.customer-profile-form input:focus {
    border-color: #FF4700;
    box-shadow: 0 0 0 2px rgba(255,90,20,.08);
}

.customer-account-alert {
    margin-bottom: 15px;
    padding: 11px 13px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    font-size: 12px;
}

.customer-account-alert.success {
    border: 1px solid #bbf7d0;
    background: #f0fdf4;
    color: #15803d;
}

.customer-account-alert.error {
    border: 1px solid #fecaca;
    background: #fef2f2;
    color: #b91c1c;
}

.customer-account-empty {
    padding: 45px 20px;
    text-align: center;
}

.customer-account-empty > div {
    width: 47px;
    height: 47px;
    margin: 0 auto 12px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #f1f5f9;
    color: #64748b;
}

.customer-account-empty h3 {
    margin: 0;
    color: #172033;
    font-size: 14px;
}

.customer-account-empty p {
    margin: 5px 0 16px;
    color: #8a94a3;
    font-size: 9px;
}

.customer-account-mobile-bar,
.customer-account-close,
.customer-account-overlay {
    display: none;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1000px) {

    .customer-dashboard-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .customer-profile-grid {
        grid-template-columns: 1fr;
    }

}



/* =========================================================
   HEADER CUSTOMER ACCOUNT DROPDOWN
========================================================= */

.header-account-menu {
    position: relative;
    flex-shrink: 0;
}

.header-account-trigger {
    min-height: 46px;

    padding: 5px 8px;

    display: flex;
    align-items: center;
    gap: 8px;

    border: 0;
    border-radius: 8px;

    background: transparent;

    color: #24293b;

    font-family: inherit;

    cursor: pointer;

    transition:
        background .18s ease;
}

.header-account-trigger:hover,
.header-account-menu:focus-within
.header-account-trigger {
    background: #f6f7f9;
}

.header-account-trigger-icon {
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #f6f7f9;
    max-height: 32px;
    max-width: 32px;
}

.header-account-trigger-icon img {
    display: block;
    border-radius: 50%;
    object-fit: cover;
    position: relative;
    height: 100%;
    width: 100%;
}

.header-account-trigger-text {
    min-width: 0;

    display: flex;
    flex-direction: column;
    align-items: flex-start;

    line-height: 1.2;
}

.header-account-trigger-text small {
    color: #171A26B2;
    font-size: 10px;
    font-weight: 500;
}

.header-account-trigger-text strong {
    max-width: 115px;
    overflow: hidden;
    color: #171A26;
    font-size: 12px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.header-account-chevron {
    margin-left: 2px;
    color: #171A26;
    font-size: 18px;
    transition: transform .18s ease;
}


/* DROPDOWN */

.header-account-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 1000;
    width: 250px;
    padding: 20px;
    visibility: hidden;
    opacity: 0;
    border: 1px solid #171A261F;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 15px 45px
        rgba(15, 23, 42, .14);
    pointer-events: none;
    transition: opacity .16s ease,
        transform .16s ease,
        visibility .16s ease;
}


/*
 * Open on hover for desktop
 * and focus/click for keyboard + mobile.
 */

.header-account-menu:hover
.header-account-dropdown,
.header-account-menu:focus-within
.header-account-dropdown {
    visibility: visible;

    opacity: 1;

    transform:
        translateY(0);

    pointer-events: auto;
}

.header-account-menu:hover
.header-account-chevron,
.header-account-menu:focus-within
.header-account-chevron {
    transform: rotate(180deg);
}


/* CUSTOMER INFO */

.header-account-dropdown-user {
    display: flex;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid #171A261F;
    padding-bottom: 20px;
}
.header-account-dropdown-avatar {
    height: 40px;
    width: 40px;
    flex: 0 0 40px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #ff5a14;
    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
    object-fit: cover;
}
.header-account-dropdown-avatar img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    max-width: 40px;
    max-height: 40px;
    border-radius: 8px;
}
.header-account-dropdown-user > div:last-child {
    min-width: 0;

    display: flex;
    flex-direction: column;

    gap: 2px;
}

.header-account-dropdown-user strong {
    overflow: hidden;
    color: #171A26;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: Manrope;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    margin-bottom: 2px;
}

.header-account-dropdown-user span {
    overflow: hidden;
    color: #171A26B2;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: Manrope;
    font-weight: 400;
    font-size: 12px;
    line-height: 100%;
    letter-spacing: 0%;
}


/* LINKS */

.header-account-dropdown-link, .header-account-logout {
    width: 100%;
    padding-top: 20PX;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 0;
    background: transparent;
    color: #171A26CC;
    font-size: 16px;
    font-weight: 500;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transition: background .16s ease,
        color .16s ease;
}

.header-account-dropdown-link:hover {
    color: #FF4700;
}
.header-account-dropdown-link:hover .header-account-dropdown-link-icon img{
  filter: invert(34%) sepia(98%) saturate(3557%) hue-rotate(359deg) brightness(101%) contrast(101%);		
}

.header-account-dropdown-link-icon {
    width: 20PX;
    height: 20PX;
    flex: 0 0 20px;
    display: FLEX;
    align-items: center;
}

.header-account-dropdown-link:hover
.header-account-dropdown-link-icon {
    background: #fff0e9;

    color: #ff5a14;
}

.header-account-dropdown-divider {
    height: 1px;
    margin: 20px 0px 0px 0px;
    background: #171A261F;
}

.header-account-logout-form {
    display: block !important;

    width: 100%;
}
.header-account-logout {
    color: #FF4700;
}
.header-account-logout img {
    filter: invert(34%) sepia(98%) saturate(3557%) hue-rotate(359deg) brightness(101%) contrast(101%);
}


.header-account-logout
.header-account-dropdown-link-icon {
    background: #fff7ed;

    color: #dc2626;
}


/* =========================================================
   HEADER ACCOUNT RESPONSIVE
========================================================= */

@media (max-width: 1050px) {

    .header-account-trigger-text {
        display: none;
    }

    .header-account-chevron {
        display: none;
    }

    .header-account-trigger {
        padding: 4px;
    }

}


@media (max-width: 768px) {

    .header-account-dropdown {
        position: fixed;

        top: auto;
        right: 12px;
        left: 12px;

        width: auto;

        max-width: none;
    }
.customer-profile-form input {
    min-height: auto;
}
}

/* =========================================================
   CUSTOMER ACCOUNT / HEADER DROPDOWN
========================================================= */

.mobile-nav-head,
.mobile-account-navigation,
.mobile-nav-backdrop {
    display: none;
}

.header-account-menu {
    position: relative;
}

.header-account-dropdown {
    top: calc(100% + 4px);

    visibility: hidden;
    opacity: 0;

    pointer-events: none;

    transform: translateY(-5px);

    transition:
        opacity .16s ease,
        transform .16s ease,
        visibility .16s ease;
}

.header-account-dropdown::before {
    content: "";

    position: absolute;

    top: -8px;
    left: 0;
    right: 0;

    height: 8px;
}

.header-account-menu.is-open
.header-account-dropdown {
    visibility: visible !important;
    opacity: 1 !important;

    pointer-events: auto !important;

    transform: translateY(0) !important;
}

.header-account-menu.is-open
.header-account-chevron {
    transform: rotate(180deg);
}


/* =========================================================
   MOBILE / TABLET HEADER + OFF-CANVAS DRAWER
========================================================= */

@media (max-width: 1080px) {

    /*
     * Header stacking.
     * Drawer stays above backdrop.
     */
    .site-header {
        position: relative;
        z-index: 5100;
    }

    .main-header {
        position: relative;
    }


    /*
     * Logo
     */
    .header-logo {
        order: 1;

        margin-right: auto;
    }


    /*
     * Header actions
     */
    .header-actions {
        order: 2;

        margin-left: auto !important;

        display: flex !important;
        align-items: center;

        gap: 8px !important;
    }


    /*
     * Hide the separate customer account icon on mobile.
     * Account links are available inside the hamburger drawer.
     */
    .header-account-menu,
    .account-link {
        display: none !important;
    }


    /*
     * Cart
     */
    .header-cart {
        position: relative;

        width: 42px;
        min-width: 42px;
        height: 42px;

        padding: 0 !important;

        display: inline-flex !important;

        align-items: center;
        justify-content: center;

        border: 1px solid #e1e5eb;
        border-radius: 9px;

        background: #ffffff;
    }

    .header-cart img {
        width: 20px;
        height: 20px;
        object-fit: contain;
    }

    .header-cart .cart-text {
        display: none !important;
    }

    .header-cart strong {
        position: absolute;

        top: -6px;
        right: -5px;

        min-width: 19px;
        height: 19px;

        padding: 0 4px;

        display: grid;
        place-items: center;

        border: 2px solid #ffffff;
        border-radius: 999px;

        background: #ff510e;

        color: #ffffff;

        font-size: 8px;
        font-weight: 800;

        line-height: 1;
    }


    /*
     * Main hamburger
     */
.mobile-toggle, .customer-account-body
    .site-header
    .mobile-toggle {
    order: 3 !important;
    /* width: 42px; */
    /* height: 42px; */
    flex: 0 0 42px;
    margin: 0 !important;
    padding: 0;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    border: 0 !important;
    /* background: #111827 !important; */
    color: #000000;
    cursor: pointer;
}

.mobile-toggle span {
    width: 20px;
    height: 2px;
    display: block;
    border-radius: 999px;
    background: #171A26;
}


    /* =====================================================
       OFF-CANVAS DRAWER
    ====================================================== */

    .main-header .main-nav {
        position: fixed !important;

        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;

        z-index: 5200 !important;

        width: min(86vw, 340px);
        height: 100dvh;

        padding: 0 !important;

        display: flex !important;

        flex-direction: column !important;

        gap: 0 !important;

        overflow-x: hidden;
        overflow-y: auto;

        visibility: hidden;
        opacity: 0;

        transform: translateX(105%);

        pointer-events: none;

        border: 0 !important;

        background: #ffffff !important;

        box-shadow:
            -16px 0 45px
            rgba(15, 23, 42, .18);

        transition:
            transform .25s ease,
            opacity .2s ease,
            visibility .25s ease;

        overscroll-behavior: contain;

        -webkit-overflow-scrolling: touch;
    }

    .main-header .main-nav.open {
        visibility: visible !important;
        opacity: 1 !important;

        transform: translateX(0) !important;

        pointer-events: auto !important;

        overflow-y: auto !important;
    }


    /* =====================================================
       DRAWER HEADER
    ====================================================== */

.mobile-nav-head {
    min-height: 76px;
    padding: 15px 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    background: #ff4700;
}

    .mobile-nav-head > div {
        display: flex;

        flex-direction: column;

        gap: 2px;
    }

    .mobile-nav-head strong {
        color: #ffffff;

        font-size: 15px;
    }

.mobile-nav-head span {
    color: #ffffff;
    font-size: 11px;
}

    .mobile-nav-close {
        position: relative;

        z-index: 5;

        width: 36px;
        height: 36px;

        display: grid;
        place-items: center;

        border: 1px solid rgba(255, 255, 255, .12);
        border-radius: 8px;

        background: rgba(255, 255, 255, .07);

        color: #ffffff;

        font-family: inherit;

        font-size: 24px;

        line-height: 1;

        pointer-events: auto !important;

        cursor: pointer;
    }


    /* =====================================================
       STORE LINKS
    ====================================================== */

    .mobile-nav-store-links {
		display: flex;
		flex-direction: column;
		gap: 10px;
		padding: 40px 15px 20px 15px;
	}
	.main-header .main-nav a {
		font-family: Manrope;
		font-weight: 500;
		font-size: 20px;
		line-height: 100%;
		letter-spacing: 0%;
		text-align: center;
		text-transform: capitalize;
		color: #171A26;
		padding: 0px 0 12px 0;
	}
	

.mobile-nav-store-links > a {
    width: 100%;
    padding: 8px 0px;
    display: flex;
    align-items: center;
    gap: 11px;
    border-radius: 8px;
    text-decoration: none;
    box-sizing: border-box;
}

    .mobile-nav-link-icon {
        width: 29px;
        height: 29px;

        flex: 0 0 29px;

        display: grid;
        place-items: center;

        border-radius: 7px;

        background: #f2f4f7;

        color: #667085;

        font-size: 10px;
        font-weight: 800;
    }

    .mobile-nav-store-links > a:hover
    .mobile-nav-link-icon,
    .mobile-nav-store-links > a.active
    .mobile-nav-link-icon {
        background: #ffe9de;

        color: #ff510e;
    }


    /* =====================================================
       CUSTOMER AREA INSIDE DRAWER
    ====================================================== */
.mobile-account-navigation {
    margin: 0 20px;
    display: flex;
    border-top: 1px solid #171A261F;
    padding-top: 20px;
    flex-direction: column;
    gap: 10px;
}

    .mobile-account-navigation-head {
		margin-bottom: 20px;
		padding: 12px;
		display: flex;
		align-items: center;
		gap: 12px;
		border-radius: 12px;
		background: #171A26;
	}

    .mobile-account-navigation-avatar {
        width: 40px;
        height: 40px;
        flex: 0 0 40px;
        display: grid;
        place-items: center;
        border-radius: 8px;
        background: #ff510e;
        color: #ffffff;
       font-size: 14px;
        font-weight: 800;
    }
.mobile-account-navigation-avatar img {
    width: 100%;
    height: 100%;
    max-width: 40px;
    max-height: 40px;
    border-radius: 8px;
}
    .mobile-account-navigation-head
    > div:last-child {
        min-width: 0;

        display: flex;

        flex-direction: column;

        gap: 2px;
    }

    .mobile-account-navigation-head strong {
		overflow: hidden;
		color: #FFFFFF;
		font-size: 16px;
		font-weight: 500;
		line-height: 100%;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

    .mobile-account-navigation-head span {
		overflow: hidden;
		color: #FFFFFFB2;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-family: Manrope;
		font-weight: 400;
		font-size: 12px;
		line-height: 16px;
		letter-spacing: 0%;
		text-align: center;
		text-transform: lowercase;
	}
.mobile-nav-store-links .active span {
    color: #FF4700;
    filter: invert(4%) sepia(100%) saturate(3557%) hue-rotate(359deg) brightness(101%) contrast(101%);
}
.mobile-account-navigation-link {
    width: 100%;
    /* min-height: 45px; */
    padding: 8px 0px;
    display: flex;
    align-items: center;
    gap: 11px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #344054;
    font-family: inherit;
    font-size: 10px;
    font-weight: 650;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

    .mobile-account-navigation-link
    > span:first-child {
        width: 29px;
        height: 29px;

        flex: 0 0 29px;

        display: grid;
        place-items: center;

        border-radius: 7px;

      /*  background: #f2f4f7;*/

        color: #667085;

        font-size: 10px;
    }
.mobile-nav-store-links span {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .mobile-account-navigation-divider {
        height: 1px;

        margin: 7px 0;

        background: #edf0f4;
    }

    .mobile-account-navigation-logout-form {
        width: 100%;

        margin: 0;
    }

    .mobile-account-navigation-logout {
		color: #171A26;
		font-family: Poppins;
		font-weight: 500;
		font-size: 20px;
		line-height: 100%;
		letter-spacing: 0%;
		vertical-align: middle;
	}

.mobile-account-guest-title {
    /* padding: 5px 9px 9px; */
    color: #171A26B2;
    font-family: Manrope;
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0px;
    text-transform: uppercase;
    margin-bottom: 22px;
}


    /* =====================================================
       BACKDROP + PAGE SCROLL LOCK
    ====================================================== */

    .mobile-nav-backdrop {
        position: fixed;

        inset: 0;

        z-index: 5000 !important;

        display: block;

        visibility: hidden;
        opacity: 0;

        background: rgba(15, 23, 42, .62);

        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);

        pointer-events: none;

        transition:
            opacity .22s ease,
            visibility .22s ease;
    }

    .mobile-nav-backdrop.is-open {
        visibility: visible;
        opacity: 1;

        pointer-events: auto;
    }

    html.mobile-nav-open,
    body.mobile-nav-open {
        overflow: hidden !important;

        overscroll-behavior: none;
    }
}


/* =========================================================
   PHONE
========================================================= */

@media (max-width: 1024px) {
    .main-header {
        min-height: 70px !important;

        padding: 7px 0 !important;

        flex-wrap: wrap;

        gap: 7px !important;
    }


    /*
     * Normal storefront pages keep product search.
     */
    .header-search {
        order: 20;
        flex: 0 0 100%;
        width: 100%;
        max-width: none;
    }


    /*
     * Customer account pages don't need storefront search.
     */
    .customer-account-body
    .header-search {
        display: none !important;
    }


    /*
     * Desktop customer sidebar is hidden on phone.
     * Account navigation is available in the global drawer.
     */
    .customer-account-body
    .customer-account-sidebar {
        display: none !important;
    }

    .customer-account-body
    .customer-account-layout {
        display: block !important;
    }

    .customer-account-body
    .customer-account-content {
        width: 100%;

        min-width: 0;
    }

    .customer-account-body
    .customer-account-mobile-bar,
    .customer-account-body
    .customer-account-overlay {
        display: none !important;
    }

    .customer-account-body
    .site-header
    .mobile-toggle {
        display: flex !important;
    }
}


/* =========================================================
   DESKTOP HEADER / NAV RESTORE
   Keep this AFTER all mobile/customer menu CSS
========================================================= */

@media (min-width: 1081px) {

    /*
     * Restore original desktop main nav.
     */
    .main-header .main-nav {
        position: static !important;

        width: auto !important;
        height: auto !important;

        margin-left: 0 !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;

        gap: 0 !important;

        flex-shrink: 0;

        overflow: visible !important;

        visibility: visible !important;
        opacity: 1 !important;

        transform: none !important;

        pointer-events: auto !important;

        border: 0 !important;

        background: transparent !important;

        box-shadow: none !important;
    }


    /*
     * New wrapper used by mobile drawer.
     * On desktop it must behave like the old menu.
     */
    .main-header
    .main-nav
    .mobile-nav-store-links {
        display: flex !important;

        align-items: center;

        gap: 22px;

        margin: 0;
        padding: 0;
    }
	


    /*
     * Restore normal desktop links.
     */
    .main-header
    .main-nav
    .mobile-nav-store-links
    > a {
        width: auto !important;

        min-width: 0 !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        display: inline-flex !important;

        align-items: center;

        gap: 0 !important;

        border: 0 !important;
        border-radius: 0 !important;

        background: transparent !important;

        color: #252a3b !important;

        font-size: 13px !important;
        font-weight: 700 !important;

        line-height: normal;

        white-space: nowrap;

        text-decoration: none;
    }


    .main-header
    .main-nav
    .mobile-nav-store-links
    > a:hover,
    .main-header
    .main-nav
    .mobile-nav-store-links
    > a.active {
        background: transparent !important;

        color: #ff4b0b !important;
    }


    /*
     * T / W / B / home icons are mobile-only.
     */
    .main-header
    .main-nav
    .mobile-nav-link-icon {
        display: none !important;
    }


    /*
     * Mobile drawer-only elements.
     */
    .main-header
    .main-nav
    .mobile-nav-head,

    .main-header
    .main-nav
    .mobile-account-navigation {
        display: none !important;
    }


    /*
     * Hamburger is mobile-only.
     */
    .main-header
    .mobile-toggle {
        display: none !important;
    }


    /*
     * Never show mobile backdrop on desktop.
     */
    .mobile-nav-backdrop {
        display: none !important;
    }


    /*
     * Restore normal desktop header layout.
     */
    .main-header {
        min-height: 94px;

        display: flex;

        align-items: center;

        gap: 26px;
    }


    /*
     * Restore normal desktop logo dimensions.
     
    .header-logo {
        width: 190px !important;
        min-width: 190px !important;
        height: 76px !important;

        display: flex;

        align-items: center;

        overflow: hidden;
    }*/


  /*  .header-logo img {
        width: 100%;
        height: 100%;

        max-width: 190px !important;
        max-height: 76px !important;

        object-fit: contain;
    }*/


    /*
     * Keep search positioned correctly.
     */
    .header-search {
        flex: 1 1 380px;

        min-width: 220px;
        max-width: 520px;

        margin-left: auto;
    }


    /*
     * Desktop account/cart positioning.
     */
    .main-header
    .header-actions {
        display: flex !important;

        align-items: center;

        gap: 14px !important;

        margin-left: 0 !important;

        flex-shrink: 0;
    }
}


/* ============ CSS for login and Signup Page */

.form-Remember {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    margin-top: 12px;
}

.form-Remember label.check {
    margin: 0px;
}

.auth-sectionss{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:80px 15px;
  background-color:#fff;
  /*background-image:url('/images/home/Login-background.png');*/
  background-size:cover;
  background-position:center;
}
.auth-sectionss-signup{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:80px 15px;
  background-color:#fff;
  /*background-image:url('/images/home/SignUp-background.png');*/
  background-size:cover;
  background-position:center;
}
.auth-card {
    width: 100%;
    max-width: 1140px;
    background: #fff;
    /* border-radius: 50px; */
    overflow: hidden;
    /* padding: 10px; */
    /* border: 2px solid #171A261F; */
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.auth-card.reveal{
  animation:auth-reveal .5s ease both;
}
@keyframes auth-reveal{
  from{ opacity:0; transform:translateY(12px); }
  to{ opacity:1; transform:translateY(0); }
}

/* Left image panel */
.auth-media {
    position: relative;
    background-image: url('/images/login.png');
    background-size: cover;
    background-position: center;
   border-radius: 24px;
}
.auth-media-signup {
    position: relative;
    background-image: url('/images/registers.png');
    background-size: cover;
    background-position: center;
    border-radius: 24px;
}
.auth-tagline{
  position:absolute;
  left:28px;
  right:28px;
  bottom:24px;
  display:flex;
  align-items:center;
  gap:14px;
  color:#fff;
  font-size:15px;
  z-index:1;
}
.auth-dots{ display:flex; gap:6px; }
.auth-dots span{
  width:8px; height:8px; border-radius:50%;
  background:rgba(255,255,255,0.5);
  display:inline-block;
}
.auth-dots span.active{ background:#FF4700; }
.auth-line{ flex:1; height:1px; background:rgba(255,255,255,0.4); }

/* Right form panel */
.auth-form{
  flex:1;
  padding:0px 60px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  position:relative;
}

.auth-accent{
  position:absolute;
  top:0; right:0;
  width:120px; height:6px;
  background:#FF4700;
  border-bottom-left-radius:6px;
} 

section.auth-sectionss .eyebrow, section.auth-sectionss-signup .eyebrow {
    color: #FF4700;
    font-family: Manrope;
    font-weight: 700;
    font-size: 38px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.auth-form > p {
    color: #171A26B2;
    font-weight: 400;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    margin-bottom: 40px;
}

.error-box{
  background:#fdecea;
  border:1px solid #f5c2c0;
  color:#b3261e;
  padding:12px 18px;
  border-radius:14px;
  font-size:14px;
  margin-bottom:20px;
}

.auth-form form label {
    font-size: 18px;
    font-weight: 400;
    line-height: 100%;
    color: #171A26;
    margin-bottom: 30px;
}
.auth-form form label.check {
	    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    font-size: 16px;
}
.auth-form form label.check input{
  width:18px;
  height:18px;
  accent-color:#FF4700;
}

.auth-form form input[type="text"], .auth-form form input[type="email"], .auth-form form input[type="password"] {
    width: 100%;
    padding: 14px 20px;
    border: 1px solid #171A2633;
    border-radius: 24px;
    font-size: 14px;
    color: #171A26 !important;
    outline: none;
    background: #ffffff;
    transition: border-color .15s ease, box-shadow .15s ease;
	    margin-top: 8px;
}

.auth-form form input::placeholder{ color:#a8abb6; }

.auth-form form input:focus{
  border-color:#FF4700;
  box-shadow:0 0 0 3px rgba(255,71,0,0.12);
}
.btn.btn-primary {
    border: none;
    border-radius: 6px;
    background: #FF4700;
    color: #fff;
    font-weight: 600;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    padding: 16px;
    cursor: pointer;
    transition: filter .15s ease, transform .05s ease;
}
.btn.btn-primary:hover{ filter:brightness(1.06); }
.btn.btn-primary:active{ transform:translateY(1px); }
.btn.full{ width:100%; display:block; }

.auth-sectionss .auth-bottom, .auth-sectionss-signup .auth-bottom {
    margin-top: 24px;
    margin-bottom: 3px;
}
.auth-bottom a{
  color:#FF4700;
  text-decoration:none;
}
.auth-bottom a:hover{ text-decoration:underline; }
@media(max-width:1200px){
	.auth-form {
    padding: 56px 40px;
}
section.auth-sectionss .eyebrow, section.auth-sectionss-signup .eyebrow {
    font-size: 32px;
}
.auth-card {
    grid-template-columns: 1fr 1fr;
}
}
@media (max-width:767px){
	.auth-media {
    display: none;
}
section.auth-sectionss .eyebrow , .auth-sectionss-signup .eyebrow {
    font-size: 32px;
}
.auth-form > p {
    font-size: 16px;
	    margin-bottom: 32px;
}
  .auth-card{ 
  display: block;
  }
.auth-form {
    padding: 0px;
}
.auth-form form label {
    font-size: 16px;
    margin-bottom: 20px;
}
  .auth-card{ 
  display: block;
  }
  	.auth-media {
    display: none;
}
}


.estric {
    color: red !important;
}


/* order cancellation */

.order-confirmation-box.is-cancelled h5 {
    margin: 0;
    color: #FF0004;
    font-weight: 700;
    font-size: 50px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    text-transform: capitalize;
    margin-top: 30px;
}
@media(max-width:767px){
.order-confirmation-payment-note.cancelled strong {
    font-size: 18px;
    line-height: 26px;
}
.order-confirmation-payment-note.cancelled {
    gap: 12px;
}
 .order-confirmation-box.is-cancelled h5 {
    font-size: 30px;
}
}



/* Css for customer profile page (profile-blade.php )  */
    .customer-profile-grid {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }
 
    .customer-profile-card {
        width: 100%;
    }
 
    .customer-profile-main-card {
        border: 0;
        background: transparent;
        box-shadow: none;
    }
 
    .customer-profile-main-card .customer-account-card-heading {
        margin-bottom: 32px;
    }
 
    .customer-profile-personal-form {
        display: grid;
        grid-template-columns: 112px minmax(0, 1fr);
        gap: 24px;
        align-items: start;
    }
 
    .customer-profile-photo-area {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
    }
 
    .customer-profile-photo-button {
        position: relative;
        width: 112px;
        height: 112px;
        padding: 4px;
        overflow: visible;
        border: 4px solid #ff4b0b;
        border-radius: 50%;
        background: #fff;
        cursor: pointer;
    }
 
    .customer-profile-photo-button img,
    .customer-profile-photo-fallback {
        display: flex;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        border-radius: 50%;
        object-fit: cover;
    }
 
    .customer-profile-photo-fallback {
        background: #f3f4f6;
        color: #333;
        font-size: 36px;
        font-weight: 600;
    }
 
    .customer-profile-photo-camera {
        position: absolute;
        right: -5px;
        bottom: -3px;
        display: flex;
        width: 34px;
        height: 34px;
        align-items: center;
        justify-content: center;
        border: 3px solid #fff;
        border-radius: 50%;
        background: #ff4b0b;
        color: #fff;
    }
 
    .customer-profile-photo-camera svg {
        width: 17px;
        height: 17px;
    }
 
    .customer-profile-photo-input {
        display: none;
    }
 
.customer-profile-photo-remove {
    padding: 0;
    border: 0;
    background: transparent;
    color: #FF4700;
    cursor: pointer;
    font-size: 12px;
}
 
    .customer-profile-photo-remove[hidden] {
        display: none;
    }
 
    .customer-profile-fields {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px 20px;
        align-items: end;
    }
 
    .customer-profile-fields label,
    .customer-password-fields label {
        display: flex;
        flex-direction: column;
        gap: 7px;
    }
 
    .customer-profile-save-row {
        display: flex;
        align-items: end;
    }
 
    .customer-profile-save-row button {
        min-width: 110px;
    }
 
.customer-profile-password-card {
    padding: 30px;
    border: 2px solid #171A261F;
    border-radius: 20px;
    background: #fff;
}
 
    .customer-profile-password-card .customer-account-card-heading {
        margin-bottom: 16px;
    }
 
    .customer-password-fields {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
        align-items: end;
    }
 
    .customer-password-submit {
        display: flex;
        align-items: end;
    }
 
    .customer-password-submit button {
        width: 100%;
    }
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	/* =========================================================
   MOBILE CUSTOMER ACCOUNT
========================================================= */

@media (max-width: 768px) {
    .customer-account-page {
        padding: 40px 0px;
    }

    .customer-account-layout {
        display: block;
    }

    .customer-account-mobile-bar {
        margin-bottom: 16px;
        padding: 12px 14px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        border: 1px solid #e3e7ed;
        border-radius: 10px;
        background: #fff;
    }

    .customer-account-mobile-bar > div {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .customer-account-mobile-bar span {
        color: #8a94a3;
        font-size: 8px;
    }

    .customer-account-mobile-bar strong {
        color: #172033;
        font-size: 11px;
    }

    .customer-account-menu-button {
        width: 39px;
        height: 39px;
        padding: 9px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 4px;
        border: 0;
        border-radius: 8px;
        background: #101827;
    }

    .customer-account-menu-button span {
        width: 100%;
        height: 2px;
        border-radius: 2px;
        background: #fff;
    }

	.customer-account-sidebar {
		position: sticky;
		top: 20px;
		overflow: hidden;
		border-radius: 20px;
		background: #171A26;
		height: 100%;
	}

    .customer-account-sidebar.is-open {
        transform: translateX(0);
    }

    .customer-account-close {
        position: absolute;
        top: 14px;
        right: 12px;
        width: 30px;
        height: 30px;
        display: grid;
        place-items: center;
        border: 0;
        border-radius: 7px;
        background: rgba(255,255,255,.07);
        color: #fff;
        font-size: 18px;
    }

    .customer-account-overlay {
        position: fixed;
        inset: 0;
        z-index: 10001;
        display: block;
        visibility: hidden;
        opacity: 0;
        background: rgba(15,23,42,.58);
        transition: .25s ease;
    }

    .customer-account-overlay.is-open {
        visibility: visible;
        opacity: 1;
    }

    body.customer-account-menu-open {
        overflow: hidden;
    }

    .customer-dashboard-heading {
        align-items: flex-start;
        flex-direction: column;
		        margin-bottom: 24px;
    }

    .customer-dashboard-heading h1 {
       font-size: 24px;
        margin-top: 4px;
    }

.customer-dashboard-heading p {
    font-size: 12px;
    line-height: 16px;
}
    .customer-dashboard-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .customer-orders-table-wrap {
        display: none;
    }

    .customer-orders-mobile {
        display: block;
    }

    .customer-order-mobile-card {
        padding: 14px 0px;
        border-top: 1px solid #171A261F;
    }

    .customer-order-mobile-top {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
    }
.customer-account-card-heading h2 {
    font-size: 20px;
    line-height: 100%;
}
.customer-profile-form label {
    font-size: 16px;
}
.customer-profile-personal-form {
    grid-template-columns: 1fr;
}
.customer-profile-form {
    padding: 0;
}
.customer-profile-password-card {
    padding: 12px;
    border: 1px solid #171A261F;
    border-radius: 8px;
}
.customer-account-card-heading p {
    font-size: 12px;
    margin: 6px 0px 0px;
}
    .customer-order-mobile-top > div {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

.customer-order-mobile-top span:not(.customer-order-status) {
    color: #171A26CC;
    font-family: Manrope;
    font-weight: 600;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0%;
}
.customer-order-mobile-top strong {
    color: #FF4700;
    font-family: Manrope;
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}

    .customer-order-mobile-info {
        margin-top: 13px;
        display: grid;
        grid-template-columns: repeat(3, minmax(0,1fr));
        gap: 8px;
    }

.customer-order-mobile-info > div {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    border-radius: 4px;
    background: #f8fafc;
}
.customer-order-mobile-info span {
    color: #171A26CC;
    font-family: Manrope;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}
.customer-order-mobile-info strong {
    color: #171A26;
    font-family: Manrope;
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
}

    .customer-account-order-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .customer-account-order-main {
        width: 100%;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .customer-account-order-statuses {
        width: 100%;
    }
	
	
	.customer-order-shipment-info {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));

		gap: 9px;
	}


	.customer-order-track-button {
		width: 100%;

		grid-column: 1 / -1;

		box-sizing: border-box;
	}

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .customer-dashboard-stats {
        grid-template-columns: 1fr;
    }

    .customer-order-mobile-info,
    .customer-account-order-main {
        grid-template-columns: 1fr;
    }
	
	
	.customer-order-shipment-info {
		grid-template-columns: 1fr;
	}


	.customer-order-track-button {
		grid-column: auto;
	}
.customer-account-card-heading {
    flex-direction: column;
    align-items: flex-start;
}
.customer-password-fields {
    grid-template-columns: 1fr;
}
}



section.product-grids {
    background: #FFEDE5;
    padding: 80px 0px;
}
span.menu-span-img {
		display: none;
	}
.social-bar {
    display: flex;
    gap: 20px;
    margin-top: 30px;
    align-items: center;
}
.social-bar img {
    max-width: 28px;
    max-height: 28px;
    height: 100%;
    width: 100%;
}





@media(max-width:1080px){
	span.menu-span-img {
		display: flex;
	}
	#lc-product-finder.lcf-visible {
    display: none;
}
}



@media(max-width:768px){
.product-grids {
    padding: 40px 0px;
}
section.product-grids .section-heading {
    margin-bottom: 24px;
}
}





@media (max-width: 1080px) {
    .footer-accordion {
        border-bottom: 1px solid #333;
    }

    .footer-accordion:last-child {
        border-bottom: none;
    }

    .accordion-title {
        display: flex;
        justify-content: space-between;
        align-items: center;
        cursor: pointer;
        margin: 0;
        padding: 20px 0;
    }

    .accordion-icon {
        display: block;
        font-size: 22px;
    }

    .accordion-content {
        display: none;
        padding-bottom: 15px;
    }

    .footer-accordion.active .accordion-content {
        display: block;
    }

    /* + to − when open */
    .footer-accordion.active .accordion-icon {
        font-size: 0;
    }

    .footer-accordion.active .accordion-icon::after {
        content: "−";
        font-size: 22px;
    }

    .footer .footer-grid {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
		padding-bottom: 20px !important
    }

    .footer-brand {
        margin-bottom: 40px;
    }
	.footer h4 {
    margin-bottom: 0px;
}
}


/* Desktop */
@media (min-width: 1080px) {

    .accordion-icon {
        display: none;
    }

    .accordion-content {
        display: block;
    }
}


a.footer-icons {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-direction: row;
}























/* css for shiiping page */

:root {
  --lc-orange: #FF4700;
  --lc-orange-soft:#ffede5;
  --lc-dark: #171A26;
  --lc-grey: #5D5F67;
  --lc-text: #202438;
  --lc-line: #0000001F;
  --lc-line-dark: #171A261F;
  --lc-white: #ffffff;
  --lc-radius: 14px;
  --lc-shadow: 0 10px 30px rgba(23, 26, 38, 0.08);
}



.lc-container {
  width: 100%;
  max-width: 1520px;
  margin: 0 auto;
  padding: 0 20px;
}

.lc-pagehero {
    position: relative;
    overflow: hidden;
    color: #fff;
    padding: 80px 0px;
    background-image: url("/images/Shop-hero.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    display: flex;
    align-items: center;
    min-height: 426px;
    height: 100%;
}
main.lc-main ul li {
    list-style-type: none;
}
.lc-pagehero__inner { position: relative; z-index: 2; max-width: 760px; }
.lc-pagehero__eyebrow { font-family: 'Manrope', sans-serif; color: var(--lc-orange); font-size: 12px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.lc-pagehero__title { font-family: 'Manrope', sans-serif; font-size: 64px; font-weight: 800; line-height: 1.05; text-transform: uppercase; margin: 14px 0 18px; }
.lc-pagehero__title span { color: var(--lc-orange); }
.lc-pagehero__text { font-size: 17px; line-height: 1.7; color: #d2d2d2; max-width: 640px; }
 
/* ---------- Breadcrumb ---------- */
.lc-crumbs { padding: 26px 0 10px; }
.lc-crumbs__list { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font-size: 14px; color: var(--lc-orange); }
.lc-crumbs__list li + li::before { content: "›"; margin-right: 10px; color: var(--lc-grey); }
.lc-crumbs__list li:last-child { color: var(--lc-grey); }
 
/* ---------- Highlight strip ---------- */
.lc-highlights { margin-top: -60px; position: relative; z-index: 5; }
.lc-highlights__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.lc-highlight { background: #fff; border-radius: var(--lc-radius); padding: 26px 24px; box-shadow: var(--lc-shadow); border: 1px solid var(--lc-line-dark); border-bottom: 3px solid var(--lc-orange); transition: transform .25s, box-shadow .25s; }
.lc-highlight:hover { transform: translateY(-5px); box-shadow: 0 16px 36px rgba(23, 26, 38, .14); }
.lc-highlight__icon { width: 48px; height: 48px; border-radius: 12px; background: var(--lc-orange-soft); color: var(--lc-orange); display: grid; place-items: center; font-size: 22px; margin-bottom: 16px; }
.lc-highlight__value { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 22px; color: var(--lc-dark); }
.lc-highlight__label { font-size: 13px; color: var(--lc-grey); margin-top: 6px; line-height: 1.5; }
 
/* ---------- Section heads ---------- */
.lc-section { padding: 80px 0 0; }
.lc-sechead { margin-bottom: 36px; }
.lc-sechead__eyebrow {
    display: block;
    margin-bottom: 8px;
    color: #ff4700;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 2px;
}
.lc-sechead__title { font-family: 'Manrope', sans-serif; font-size: 34px; font-weight: 800; text-transform: uppercase; color: var(--lc-dark); margin: 8px 0 10px; }
.lc-sechead__title span { color: var(--lc-orange); }
.lc-sechead__desc { color: var(--lc-grey); font-size: 15px; line-height: 1.7; max-width: 620px; }
 
/* ---------- Method cards ---------- */
.lc-methods__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.lc-method { position: relative; background: #fff; border: 1px solid var(--lc-line); border-radius: var(--lc-radius); padding: 32px 28px; overflow: hidden; transition: all .25s; }
.lc-method:hover { border-color: var(--lc-orange); box-shadow: var(--lc-shadow); transform: translateY(-4px); }
.lc-method--featured { background: var(--lc-dark); color: #fff; border-color: var(--lc-dark); }
.lc-method--featured .lc-method__text, .lc-method--featured .lc-method__list li { color: rgba(255, 255, 255, .75); }
.lc-method--featured .lc-method__name { color: #fff; }
.lc-method__tag { position: absolute; top: 20px; right: 20px; background: var(--lc-orange); color: #fff; font-size: 11px; font-weight: 600; padding: 5px 12px; border-radius: 50px; }
.lc-method__num { font-family: 'Manrope', sans-serif; font-size: 44px; font-weight: 800; color: var(--lc-orange); opacity: .35; line-height: 1; }
.lc-method__name { font-family: 'Manrope', sans-serif; font-size: 22px; font-weight: 700; color: var(--lc-dark); margin: 14px 0 6px; }
.lc-method__price { font-family: 'Manrope', sans-serif; font-size: 30px; font-weight: 800; color: var(--lc-orange); margin-bottom: 14px; }
.lc-method__text { font-size: 14px; color: var(--lc-grey); line-height: 1.7; }
.lc-method__list { margin-top: 18px; display: grid; gap: 10px; }
.lc-method__list li { font-size: 13px; color: var(--lc-grey); padding-left: 24px; position: relative; }
.lc-method__list li::before { content: "✓"; position: absolute; left: 0; color: var(--lc-orange); font-weight: 700; }
 
/* ---------- Steps / timeline ---------- */
.lc-steps__track { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; position: relative; }
.lc-steps__track::before { content: ""; position: absolute; top: 30px; left: 8%; right: 8%; border-top: 2px dashed var(--lc-orange); opacity: .45; }
.lc-step { position: relative; text-align: center; padding: 0 12px; }
.lc-step__badge { width: 60px; height: 60px; margin: 0 auto 20px; border-radius: 50%; background: var(--lc-orange); color: #fff; font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 22px; display: grid; place-items: center; box-shadow: 0 0 0 8px var(--lc-orange-soft); position: relative; z-index: 2; }
.lc-step__title { font-family: 'Manrope', sans-serif; font-weight: 700; font-size: 18px; color: var(--lc-dark); margin-bottom: 8px; }
.lc-step__text { font-size: 14px; color: var(--lc-grey); line-height: 1.65; }
 
/* ---------- Policy layout ---------- */
.lc-policy { background: var(--lc-orange-soft); margin-top: 80px; padding: 80px 0; }
.lc-policy__layout { display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: start; }
.lc-sidenav { position: sticky; top: 100px; background: #fff; border-radius: var(--lc-radius); padding: 14px; border: 1px solid var(--lc-line-dark); }
.lc-sidenav__title { font-family: 'Manrope', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--lc-grey); padding: 10px 14px; }
.lc-sidenav__link { display: block; padding: 12px 14px; font-size: 14px; font-weight: 500; border-radius: 8px; color: var(--lc-text); transition: all .2s; }
.lc-sidenav__link:hover, .lc-sidenav__link.is-active { background: var(--lc-orange); color: #fff; }
.lc-sidenav__help { margin-top: 12px; background: var(--lc-dark); border-radius: 10px; padding: 18px; color: #fff; }
.lc-sidenav__help small { color: rgba(255, 255, 255, .7); font-size: 12px; }
.lc-sidenav__help strong { display: block; color: var(--lc-orange); font-family: 'Manrope', sans-serif; font-size: 18px; margin-top: 4px; }
 
.lc-policy__content { display: grid; gap: 24px; }
.lc-policy-card { background: #fff; border-radius: var(--lc-radius); padding: 34px 36px; border: 1px solid var(--lc-line-dark); scroll-margin-top: 110px; }
.lc-policy-card h2 { color: #FF4700; font-family: 'Manrope', sans-serif; font-weight: 600; font-size: 18px; line-height: 100%; letter-spacing: 0%; }
.lc-policy-card p { color: #202438; font-weight: 400; font-size: 16px; line-height: 100%; letter-spacing: 0%; margin-top: 12px; line-height: 1.6; }
.lc-policy-card ul { margin-top: 14px; display: grid; gap: 10px; }
.lc-policy-card ul li { position: relative; padding-left: 22px; font-size: 15px; color: #202438; line-height: 1.6; }
.lc-policy-card ul li::before { content: ""; position: absolute; left: 0; top: 9px; width: 8px; height: 8px; border-radius: 50%; background: var(--lc-orange); }
.lc-policy-card__note { margin-top: 18px; background: var(--lc-orange-soft); border-left: 4px solid var(--lc-orange); padding: 14px 18px; border-radius: 8px; font-size: 14px; color: var(--lc-text); line-height: 1.6; }
 
/* ---------- Table ---------- */
.lc-table-wrap { margin-top: 18px; overflow-x: auto; border: 1px solid var(--lc-line); border-radius: 10px; }
.lc-table { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 520px; }
.lc-table th { background: var(--lc-dark); color: #fff; text-align: left; padding: 14px 18px; font-family: 'Manrope', sans-serif; font-weight: 600; }
.lc-table td { padding: 14px 18px; border-top: 1px solid var(--lc-line); color: var(--lc-text); }
.lc-table tr:nth-child(even) td { background: #fafafa; }
.lc-table td strong { color: var(--lc-orange); }
 
/* ---------- Eligible / Not eligible ---------- */
.lc-eligible__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.lc-eligible { border-radius: var(--lc-radius); padding: 34px 32px; border: 1px solid var(--lc-line); background: #fff; }
.lc-eligible--yes { border-top: 5px solid #22a559; }
.lc-eligible--no { border-top: 5px solid var(--lc-orange); }
.lc-eligible__title { font-family: 'Manrope', sans-serif; font-weight: 700; font-size: 20px; color: var(--lc-dark); margin-bottom: 18px; }
.lc-eligible__list { display: grid; gap: 12px; }
.lc-eligible__list li { position: relative; padding-left: 30px; font-size: 14px; color: var(--lc-grey); line-height: 1.6; }
.lc-eligible--yes .lc-eligible__list li::before { content: "✓"; color: #22a559; }
.lc-eligible--no .lc-eligible__list li::before { content: "✕"; color: var(--lc-orange); }
.lc-eligible__list li::before { position: absolute; left: 0; font-weight: 800; }
 
/* ---------- FAQ ---------- */
.lc-faq__list { display: grid; gap: 14px;  }
.lc-faq__item { border: 1px solid var(--lc-line); border-radius: 12px; background: #fff; overflow: hidden; transition: border-color .2s; }
.lc-faq__item[open] { border-color: var(--lc-orange); box-shadow: var(--lc-shadow); }
.lc-faq__q { list-style: none; cursor: pointer; padding: 20px 24px; font-family: 'Manrope', sans-serif; font-weight: 700; font-size: 16px; color: var(--lc-dark); display: flex; justify-content: space-between; gap: 16px; align-items: center; }
.lc-faq__q::-webkit-details-marker { display: none; }
.lc-faq__q::after { content: "+"; width: 30px; height: 30px; flex: none; border-radius: 50%; background: var(--lc-orange-soft); color: var(--lc-orange); display: grid; place-items: center; font-size: 20px; transition: transform .25s; }
.lc-faq__item[open] .lc-faq__q::after { content: "−"; background: var(--lc-orange); color: #fff; }
.lc-faq__a { padding: 0 24px 22px; font-size: 14px; color: var(--lc-grey); line-height: 1.75; }
 
/* ---------- CTA ---------- */
.lc-cta { margin: 90px 0; }
.lc-cta__box { position: relative; overflow: hidden; border-radius: 20px; padding: 56px 60px; background: radial-gradient(500px 260px at 90% 50%, rgba(255, 71, 0, .5), transparent 70%), linear-gradient(120deg, #0e1018, var(--lc-dark)); color: #fff; display: flex; justify-content: space-between; align-items: center; gap: 30px; flex-wrap: wrap; }
.lc-cta__title { font-family: 'Manrope', sans-serif; font-size: 32px; font-weight: 800; text-transform: uppercase; }
.lc-cta__title span { color: var(--lc-orange); }
.lc-cta__text { margin-top: 10px; color: rgba(255, 255, 255, .75); font-size: 15px; max-width: 560px; line-height: 1.7; }
.lc-cta__actions { display: flex; gap: 14px; flex-wrap: wrap; position: relative; z-index: 2; }
.lc-btn { display: inline-flex; align-items: center; gap: 8px; padding: 15px 30px; border-radius: 8px; font-weight: 600; font-size: 14px; font-family: 'Poppins', sans-serif; border: 2px solid var(--lc-orange); transition: all .2s; cursor: pointer; }
.lc-btn--primary { background: var(--lc-orange); color: #fff !important; }
.lc-btn--primary:hover { background: #e03f00; border-color: #e03f00; }
.lc-btn--ghost { background: transparent; color: #fff !important; }
.lc-btn--ghost:hover { background: var(--lc-orange); }
 
/* ---------- Footer ---------- */
.lc-footer { background: linear-gradient(180deg, #11131c, #0b0c12); color: #fff; padding-top: 70px; }
.lc-footer__grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1.3fr; gap: 40px; padding-bottom: 50px; }
.lc-footer__logo { font-family: 'Manrope', sans-serif; font-style: italic; font-weight: 800; font-size: 22px; border: 2px solid var(--lc-grey); border-radius: 50px; display: inline-block; padding: 12px 26px; }
.lc-footer__about { margin-top: 16px; font-size: 14px; color: rgba(255, 255, 255, .75); line-height: 1.6; }
.lc-footer__phone { margin-top: 18px; border-left: 3px solid var(--lc-orange); padding-left: 14px; font-size: 13px; }
.lc-footer__phone strong { display: block; font-family: 'Manrope', sans-serif; font-size: 20px; color: var(--lc-orange); }
.lc-footer__title { font-family: 'Manrope', sans-serif; color: var(--lc-orange); font-size: 20px; font-weight: 600; text-transform: uppercase; margin-bottom: 20px; }
.lc-footer__links { display: grid; gap: 14px; }
.lc-footer__links a { color: #fff; font-size: 15px; transition: color .2s; }
.lc-footer__links a:hover { color: var(--lc-orange); }
.lc-footer__contact { display: grid; gap: 12px; font-size: 14px; margin-bottom: 26px; }
.lc-footer__contact li { color: rgba(255, 255, 255, .88); }
.lc-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .1); padding: 22px 0; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: 14px; }
 
/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1199px) {
  .lc-pagehero__title { font-size: 52px; }
  .lc-highlights__grid { grid-template-columns: repeat(2, 1fr); }
  .lc-policy__layout { grid-template-columns: 250px 1fr; gap: 24px; }
  .lc-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 991px) {
  .lc-header__actions { margin-left: auto; }
  .lc-methods__grid { grid-template-columns: 1fr; }
  .lc-steps__track { grid-template-columns: repeat(2, 1fr); row-gap: 40px; }
  .lc-steps__track::before { display: none; }
  .lc-policy__layout { grid-template-columns: 1fr; }
  .lc-sidenav { position: static; display: flex; flex-wrap: wrap; gap: 6px; }
  .lc-sidenav__title, .lc-sidenav__help { flex: 1 1 100%; }
  .lc-eligible__grid { grid-template-columns: 1fr; }
  .lc-cta__box { padding: 40px 30px; }
}
@media (max-width: 767px) {
  .lc-subbar__list li:nth-child(n+3) { display: none; }
  .lc-topbar__center { display: none; }
  .lc-pagehero { padding: 60px 0 90px; }
  .lc-pagehero__title { font-size: 36px; }
  .lc-pagehero__text { font-size: 14px; }
  .lc-highlights__grid { grid-template-columns: 1fr; }
  .lc-section { padding-top: 40px; }
  .lc-sechead__title { font-size: 24px; }
  .lc-steps__track { grid-template-columns: 1fr; }
  .lc-policy { padding: 40px 0; margin-top: 56px; }
  .lc-policy-card { padding: 24px 20px; }
  .lc-policy-card h2 { font-size: 16px; }
  .lc-policy-card p { font-size: 14px; line-height: 18px; margin-top: 8px; }
  .lc-policy-card ul li { font-size: 14px; }
  .lc-cta__title { font-size: 24px; }
  .lc-footer__grid { grid-template-columns: 1fr; }
  .lc-footer__bottom { flex-direction: column; }
  
  
  
    .lc-table-wrap {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin-top: 18px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        box-sizing: border-box;
    }

    .lc-table {
        width: 100%;
        min-width: 0;
        table-layout: fixed;
        border-collapse: collapse;
    }

    .lc-table th,
    .lc-table td {
        padding: 10px 8px;
        font-size: 12px;
        line-height: 1.5;
        overflow-wrap: anywhere;
        word-break: normal;
        white-space: normal;
        vertical-align: middle;
    }

    .lc-table th:nth-child(1),
    .lc-table td:nth-child(1) {
        width: 30%;
    }

    .lc-table th:nth-child(2),
    .lc-table td:nth-child(2) {
        width: 43%;
    }

    .lc-table th:nth-child(3),
    .lc-table td:nth-child(3) {
        width: 27%;
    }

    .lc-table td strong {
        font-size: 12px;
        white-space: pre-wrap;
    }
  .lc-sidenav__link{
	      border: 1px solid #171A261F;
	  
  }
  
  
}




#lc-product-finder .lcf-art img {
    width: 140% !important;
}