/* ═══════════════════════════════════════════════
   StatesCanvas — main stylesheet
   Colors come from CSS variables printed by the
   theme options panel (see inc/helpers.php).
   ═══════════════════════════════════════════════ */

:root {
	--sc-primary: #12afa0;
	--sc-primary-dark: #0d9084;
	--sc-primary-light: #2fd0c0;
	--sc-deep: #3f4344;
	--sc-deep-2: #2c2f30;
	--sc-ink: #34383a;
	--sc-body: #5c6163;
	--sc-muted: #8b9092;
	--sc-line: #e4e6e7;
	--sc-soft: #f4f6f6;
	--sc-radius: 8px;
	--sc-wrap: 1240px;
	--sc-font: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--sc-display: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
	/* Button text sits on the deeper teal, so white keeps it readable */
	--sc-on-primary: #ffffff;
}

* { box-sizing: border-box; }
html { overflow-x: hidden; scroll-behavior: smooth; }

body {
	margin: 0;
	font-family: var(--sc-font);
	font-size: 16px;
	line-height: 1.65;
	color: var(--sc-body);
	background: #fff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	letter-spacing: -0.005em;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--sc-primary-dark); text-decoration: none; transition: all .22s ease; }
a:hover { color: var(--sc-deep); }
h1, h2, h3, h4 {
	font-family: var(--sc-display); margin: 0; line-height: 1.18;
	font-weight: 700; color: var(--sc-ink); letter-spacing: -0.02em;
}
p { margin: 0 0 1em; }
button, input, textarea, select { font-family: var(--sc-font); }
button { transition: all .22s ease; }

.sc-wrap { max-width: var(--sc-wrap); margin: 0 auto; padding: 0 24px; }
.sc-wrap--narrow { max-width: 840px; }
.sc-section { padding: clamp(52px, 6vw, 90px) 0; }
.sc-section--soft { background: var(--sc-soft); }
.sc-section--deep { background: linear-gradient(160deg, var(--sc-deep) 0%, var(--sc-deep-2) 100%); }
.sc-center { text-align: center; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); }

/* ── Headings ── */
.sc-h2 { font-weight: 700; font-size: clamp(26px, 3vw, 40px); color: var(--sc-ink); }
.sc-h2--light { color: #fff; }
.sc-sub { color: var(--sc-body); font-size: 16px; margin: 14px 0 0; }
.sc-bar { width: 56px; height: 3px; background: var(--sc-primary); margin: 18px auto 0; border-radius: 2px; }

/* ═══════════════ BUTTONS ═══════════════ */
.sc-btn {
	display: inline-flex; align-items: center; justify-content: center;
	font-family: var(--sc-display); font-weight: 600; font-size: 14.5px;
	letter-spacing: 0; text-transform: none;
	padding: 14px 28px; border-radius: var(--sc-radius); border: 1.5px solid transparent;
	cursor: pointer; text-align: center; line-height: 1.25;
}
.sc-btn--primary {
	background: var(--sc-primary-dark); color: var(--sc-on-primary);

}
.sc-btn--primary:hover {
	background: var(--sc-deep); color: var(--sc-on-primary);
	transform: translateY(-2px);
}
.sc-btn--outline { background: #fff; border-color: #d3d7d8; color: var(--sc-deep); }
.sc-btn--outline:hover { background: var(--sc-deep); border-color: var(--sc-deep); color: #fff; }
.sc-btn--dark { background: transparent; border-color: var(--sc-primary); color: var(--sc-primary); }
.sc-btn--dark:hover { background: var(--sc-primary); color: var(--sc-on-primary); transform: translateY(-2px); }
.sc-btn--ghost { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.5); color: #fff; backdrop-filter: blur(6px); }
.sc-btn--ghost:hover { background: rgba(255,255,255,.24); border-color: #fff; color: #fff; transform: translateY(-2px); }
.sc-btn--lg { font-size: 15.5px; padding: 16px 34px; }
.sc-btns { display: flex; gap: 12px; flex-wrap: wrap; }

/* ═══════════════ ANIMATION ═══════════════ */
@keyframes sc-fade { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.sc-ent { opacity: 0; animation: sc-fade .85s cubic-bezier(.2,.7,.3,1) forwards; }

/* Scroll reveal — driven by IntersectionObserver so it works in every browser.
   The hidden state only applies once JS has confirmed it is running, so the
   content is never stuck invisible if scripts fail to load. */
.sc-rv { opacity: 1; }
html.sc-js body.sc-anim .sc-rv {
	opacity: 0; transform: translateY(30px);
	transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1);
	will-change: opacity, transform;
}
html.sc-js body.sc-anim .sc-rv.is-visible { opacity: 1; transform: none; }

html.sc-js body.sc-anim .sc-bar { width: 0; transition: width .7s ease .15s; }
html.sc-js body.sc-anim .sc-bar.is-visible { width: 56px; }

.sc-lift { transition: transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease, border-color .35s ease; }
body.sc-anim .sc-lift:hover { transform: translateY(-7px); }

.sc-zoom img { transition: transform 1s cubic-bezier(.2,.6,.2,1); }
body.sc-anim .sc-zoom:hover img { transform: scale(1.055); }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
	.sc-ent, .sc-rv { opacity: 1 !important; transform: none !important; }
}

/* ═══════════════ PROMO BAR ═══════════════ */
.sc-promo {
	position: relative; background: linear-gradient(90deg, var(--sc-deep), var(--sc-primary-dark));
	color: #fff; font-size: 14px;
}
.sc-promo[hidden] { display: none; }
.sc-promo__in {
	display: flex; align-items: center; justify-content: center; gap: 14px;
	flex-wrap: wrap; padding: 11px 44px; text-align: center;
}
.sc-promo__text { font-weight: 600; }
.sc-promo__code {
	background: rgba(255,255,255,.16); border: 1px dashed rgba(255,255,255,.5);
	padding: 3px 12px; border-radius: 40px; font-size: 13px; white-space: nowrap;
}
.sc-promo__timer {
	font-family: var(--sc-display); font-weight: 700; font-size: 13.5px;
	background: rgba(0,0,0,.22); padding: 4px 12px; border-radius: 40px; white-space: nowrap;
}
.sc-promo__btn {
	background: #fff; color: var(--sc-deep); font-family: var(--sc-display); font-weight: 600;
	font-size: 13.5px; padding: 8px 18px; border-radius: 40px; white-space: nowrap;
}
.sc-promo__btn:hover { background: var(--sc-primary-light); color: var(--sc-deep); }
.sc-promo__close {
	position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
	background: none; border: none; color: rgba(255,255,255,.75); font-size: 16px; cursor: pointer;
	line-height: 1; padding: 6px 8px; border-radius: 4px;
}
.sc-promo__close:hover { background: rgba(255,255,255,.15); color: #fff; }
@media (max-width: 720px) {
	.sc-promo__in { gap: 8px; padding: 10px 36px; font-size: 13px; }
	.sc-promo__btn { padding: 7px 14px; font-size: 12.5px; }
}

/* ═══════════════ TRUST BAR ═══════════════ */
.sc-trustbar { background: var(--sc-deep); padding: clamp(26px, 3vw, 40px) 0; }
.sc-trustbar__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 22px; }
.sc-trustbar__item { text-align: center; }
.sc-trustbar__big {
	color: var(--sc-primary); font-family: var(--sc-display); font-weight: 700;
	font-size: clamp(26px, 3.2vw, 40px); line-height: 1.1;
}
.sc-trustbar__small { color: #c9cdce; font-size: 13.5px; margin-top: 7px; line-height: 1.45; }

/* ═══════════════ BADGES ═══════════════ */
.sc-badges__title {
	text-align: center; color: var(--sc-muted); font-size: 13px; font-weight: 600;
	letter-spacing: .08em; text-transform: uppercase; margin: 0 0 26px;
}
.sc-badges__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
.sc-badge {
	display: flex; align-items: center; gap: 12px; background: #fff;
	border: 1px solid var(--sc-line); border-radius: calc(var(--sc-radius) + 2px);
	padding: 14px 20px; min-width: 190px; color: inherit; transition: all .25s ease;
}
a.sc-badge:hover { border-color: var(--sc-primary); transform: translateY(-3px); }
.sc-badge__logo { max-height: 34px; width: auto; }
.sc-badge__meta { display: flex; flex-direction: column; line-height: 1.3; }
.sc-badge__rating { font-family: var(--sc-display); font-weight: 700; font-size: 16px; color: var(--sc-ink); }
.sc-badge__stars { color: var(--sc-primary); font-size: 12px; letter-spacing: 1px; }
.sc-badge__name { color: var(--sc-muted); font-size: 12.5px; }

/* ═══════════════ OFFER BAND ═══════════════ */
.sc-offer__box {
	background: linear-gradient(140deg, var(--sc-deep), var(--sc-deep-2));
	border-radius: calc(var(--sc-radius) + 8px); padding: clamp(28px, 4vw, 52px);
	overflow: hidden; position: relative;
}
.sc-offer__box--split { display: grid; grid-template-columns: 1fr; gap: 32px; align-items: center; }
@media (min-width: 900px) { .sc-offer__box--split { grid-template-columns: 1.25fr 1fr; gap: 44px; } }
.sc-offer__eyebrow {
	display: inline-block; background: var(--sc-primary); color: #fff; font-family: var(--sc-display);
	font-weight: 600; font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
	padding: 6px 13px; border-radius: 40px; margin-bottom: 16px;
}
.sc-offer__title { color: #fff; font-size: clamp(25px, 3.2vw, 40px); margin-bottom: 12px; }
.sc-offer__text { color: #b9bdbe; font-size: 16px; line-height: 1.6; margin: 0 0 24px; }
.sc-offer__fine { color: #7fa9a2; font-size: 12.5px; margin: 16px 0 0; }
.sc-offer__media { border-radius: calc(var(--sc-radius) + 4px); overflow: hidden; aspect-ratio: 4/3; }
.sc-offer__media img { width: 100%; height: 100%; object-fit: cover; }

/* ═══════════════ FINANCING ═══════════════ */
.sc-eyebrow {
	display: inline-block; color: var(--sc-primary-dark); font-family: var(--sc-display);
	font-weight: 600; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 10px;
}
.sc-finance__card {
	background: linear-gradient(140deg, var(--sc-deep), var(--sc-deep-2)); color: #fff;
	border-radius: calc(var(--sc-radius) + 4px); padding: clamp(28px, 3.5vw, 44px); text-align: center;

}
.sc-finance__big {
	font-family: var(--sc-display); font-weight: 700; color: var(--sc-primary);
	font-size: clamp(38px, 5vw, 62px); line-height: 1;
}
.sc-finance__sub { color: #b9bdbe; font-size: 14.5px; margin-top: 10px; }

/* ═══════════════ FABRIC SWATCHES ═══════════════ */
.sc-swatches {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
	gap: 20px; margin-top: 44px;
}
.sc-swatch { text-align: center; }
.sc-swatch__chip {
	display: block; width: 100%; aspect-ratio: 1/1; border-radius: calc(var(--sc-radius) + 2px);
	border: 1px solid rgba(0,0,0,.08);
	transition: transform .3s ease;
}
.sc-swatch__chip--img { background-size: cover; background-position: center; }
.sc-swatch:hover .sc-swatch__chip { transform: translateY(-4px) scale(1.03); }
.sc-swatch__name {
	display: block; font-family: var(--sc-display); font-weight: 600;
	font-size: 14.5px; color: var(--sc-ink); margin-top: 12px;
}
.sc-swatch__code { display: block; color: var(--sc-muted); font-size: 12px; }
.sc-quote--swatch { margin-top: 0; background: #fff; }

/* ═══════════════ LIGHTBOX ═══════════════ */
.sc-lb {
	position: fixed; inset: 0; z-index: 1200;
	background: rgba(2,22,20,.92); backdrop-filter: blur(3px);
	display: flex; align-items: center; justify-content: center; gap: 10px;
	padding: clamp(16px, 4vw, 48px);
	opacity: 0; visibility: hidden; transition: opacity .28s ease;
}
.sc-lb.is-open { opacity: 1; visibility: visible; }

.sc-lb__figure {
	margin: 0; max-width: min(1100px, 92vw); max-height: 88vh;
	display: flex; flex-direction: column; align-items: center; gap: 14px;
}
.sc-lb__img {
	max-width: 100%; max-height: 78vh; width: auto; height: auto;
	border-radius: calc(var(--sc-radius) + 2px); display: block;
	transition: opacity .2s ease;
}
.sc-lb__img.is-loading { opacity: .35; }
.sc-lb__caption { color: #cfe4e0; font-size: 14px; text-align: center; }

.sc-lb__close {
	position: absolute; top: clamp(12px, 2.5vw, 26px); right: clamp(12px, 2.5vw, 26px);
	width: 42px; height: 42px; border-radius: 50%;
	background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22);
	color: #fff; font-size: 19px; cursor: pointer; line-height: 1;
	display: flex; align-items: center; justify-content: center; transition: all .2s ease;
}
.sc-lb__close:hover { background: var(--sc-primary); border-color: var(--sc-primary); }

.sc-lb__nav {
	flex: none; width: 48px; height: 48px; border-radius: 50%;
	background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22);
	color: #fff; font-size: 26px; cursor: pointer; line-height: 1;
	display: flex; align-items: center; justify-content: center; transition: all .2s ease;
}
.sc-lb__nav:hover { background: var(--sc-primary); border-color: var(--sc-primary); }
.sc-lb__nav[hidden] { display: none; }

/* Gallery tiles are buttons now — strip the browser's button chrome */
.sc-gallery button.sc-media {
	padding: 0; border: none; background: none; cursor: zoom-in;
	display: block; width: 100%; font: inherit; color: inherit;
}
.sc-gallery button.sc-media:focus-visible { outline: 2px solid var(--sc-primary); outline-offset: 3px; }

@media (max-width: 700px) {
	.sc-lb { gap: 4px; padding: 12px; }
	.sc-lb__nav { width: 38px; height: 38px; font-size: 21px; }
	.sc-lb__img { max-height: 70vh; }
}

/* ═══════════════ CART DRAWER ═══════════════ */
.sc-cartoverlay {
	position: fixed; inset: 0; background: rgba(2,22,20,.55); z-index: 1000;
	opacity: 0; transition: opacity .3s ease; backdrop-filter: blur(2px);
}
.sc-cartoverlay.is-open { opacity: 1; }
.sc-cartoverlay[hidden] { display: none; }

.sc-cartdrawer {
	position: fixed; top: 0; right: 0; bottom: 0; z-index: 1001;
	width: min(92vw, 410px); background: #fff;
	display: flex; flex-direction: column;
	transform: translateX(100%); transition: transform .34s cubic-bezier(.3,.8,.3,1);
	visibility: hidden;
}
.sc-cartdrawer.is-open { transform: translateX(0); visibility: visible; }

.sc-cartdrawer__head {
	display: flex; align-items: center; justify-content: space-between;
	padding: 20px 22px; background: var(--sc-deep); flex: none;
}
.sc-cartdrawer__title { color: #fff; font-size: 18px; margin: 0; }
.sc-cartdrawer__close {
	background: none; border: none; color: #fff; font-size: 20px; cursor: pointer;
	line-height: 1; padding: 6px 8px; border-radius: 4px;
}
.sc-cartdrawer__close:hover { background: rgba(255,255,255,.15); color: var(--sc-primary); }

.sc-cartdrawer__body { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 0; }

/* Woo's mini-cart markup, restyled */
.sc-cartdrawer ul.cart_list { list-style: none; margin: 0; padding: 8px 22px; }
.sc-cartdrawer ul.cart_list li {
	position: relative; display: flex; gap: 12px; align-items: flex-start;
	padding: 18px 26px 18px 0; border-bottom: 1px solid var(--sc-line);
}
.sc-cartdrawer ul.cart_list li img {
	order: -1; width: 64px; height: 64px; object-fit: cover;
	border-radius: 6px; flex: none; margin: 0; float: none;
}
.sc-cartdrawer ul.cart_list li a {
	display: block; font-family: var(--sc-display); font-weight: 600; font-size: 14.5px;
	color: var(--sc-ink); text-decoration: none; padding: 0; line-height: 1.3;
}
.sc-cartdrawer ul.cart_list li a:hover { color: var(--sc-primary-dark); }
.sc-cartdrawer ul.cart_list li .quantity {
	display: block; color: var(--sc-muted); font-size: 13px; margin-top: 4px;
}
.sc-cartdrawer ul.cart_list li .quantity .amount { color: var(--sc-ink); font-weight: 600; }
.sc-cartdrawer ul.cart_list li a.remove {
	position: absolute; top: 16px; right: 0; width: 22px; height: 22px;
	font-size: 17px; line-height: 20px; color: var(--sc-muted) !important;
}
.sc-cartdrawer ul.cart_list li a.remove:hover { background: #c0392b; color: #fff !important; }
.sc-cartdrawer ul.cart_list li dl.variation { margin: 4px 0 0; font-size: 12.5px; color: var(--sc-muted); }
.sc-cartdrawer ul.cart_list li dl.variation dt,
.sc-cartdrawer ul.cart_list li dl.variation dd { display: inline; margin: 0; }

.sc-cartdrawer .woocommerce-mini-cart__total {
	display: flex; align-items: baseline; justify-content: space-between;
	margin: 0; padding: 18px 22px; border-top: 1px solid var(--sc-line); background: var(--sc-soft);
}
.sc-cartdrawer .woocommerce-mini-cart__total strong { font-weight: 500; color: var(--sc-body); font-size: 14.5px; }
.sc-cartdrawer .woocommerce-mini-cart__total .amount {
	font-family: var(--sc-display); font-weight: 700; font-size: 21px; color: var(--sc-ink);
}
.sc-cartdrawer .woocommerce-mini-cart__buttons {
	display: flex; flex-direction: column; gap: 10px; margin: 0;
	padding: 16px 22px 22px; background: var(--sc-soft);
}
.sc-cartdrawer .woocommerce-mini-cart__buttons a { width: 100%; text-align: center; margin: 0; }
.sc-cartdrawer .woocommerce-mini-cart__buttons a:not(.checkout) {
	background: #fff; border: 1.5px solid #d3d7d8; color: var(--sc-deep);
}
.sc-cartdrawer .woocommerce-mini-cart__buttons a:not(.checkout):hover { background: var(--sc-deep); color: #fff; }
.sc-cartdrawer .woocommerce-mini-cart__empty-message {
	padding: 60px 24px; text-align: center; color: var(--sc-muted); font-size: 15px; margin: 0;
}

/* ═══════════════ SEARCH ═══════════════ */
.sc-searchtoggle {
	background: none; border: none; color: var(--sc-deep); cursor: pointer;
	display: inline-flex; align-items: center; padding: 4px; border-radius: 4px;
}
.sc-searchtoggle:hover { color: var(--sc-primary-dark); }
.sc-searchbar { background: var(--sc-soft); border-bottom: 1px solid var(--sc-line); padding: 16px 0; }
.sc-searchbar[hidden] { display: none; }
.sc-search { display: flex; gap: 8px; max-width: 620px; margin: 0 auto; }
.sc-search__input {
	flex: 1; min-width: 0; padding: 13px 16px; border: 1px solid #d3d7d8;
	border-radius: var(--sc-radius); font-size: 15px; color: var(--sc-ink); background: #fff;
}
.sc-search__input:focus { outline: none; border-color: var(--sc-primary); box-shadow: 0 0 0 3px rgba(18,175,160,.15); }
.sc-search__btn {
	background: var(--sc-primary-dark); color: #fff; border: none; border-radius: var(--sc-radius);
	padding: 0 20px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
.sc-search__btn:hover { background: var(--sc-deep); }
.sc-mmenu__search { padding: 18px 22px 6px; }
.sc-mmenu__search .sc-search__input { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.25); color: #fff; }
.sc-mmenu__search .sc-search__input::placeholder { color: rgba(255,255,255,.55); }

/* ═══════════════ VIDEOS ═══════════════ */
.sc-video { background: #fff; border: 1px solid var(--sc-line); border-radius: calc(var(--sc-radius) + 2px); overflow: hidden; display: flex; flex-direction: column; }
.sc-video__frame { position: relative; aspect-ratio: 16/9; background: var(--sc-deep-2); cursor: pointer; overflow: hidden; }
.sc-video__thumb { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1s cubic-bezier(.2,.6,.2,1); }
.sc-video__thumb--blank { background: linear-gradient(140deg, var(--sc-deep), var(--sc-primary-dark)); }
.sc-video__frame:hover .sc-video__thumb { transform: scale(1.05); }
.sc-video__play {
	position: absolute; inset: 0; margin: auto; width: 64px; height: 64px; border-radius: 50%;
	background: rgba(7,61,56,.85); color: #fff; border: none; cursor: pointer;
	display: flex; align-items: center; justify-content: center; transition: all .25s ease;
}
.sc-video__frame:hover .sc-video__play { background: var(--sc-primary); transform: scale(1.08); }
.sc-video__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sc-video__meta { padding: 20px 22px 24px; }
.sc-video__title { font-size: 18px; margin-bottom: 6px; }
.sc-video__text { color: var(--sc-body); font-size: 14px; line-height: 1.6; margin: 0; }

/* ═══════════════ DOWNLOADS ═══════════════ */
.sc-downloads { display: flex; flex-direction: column; gap: 12px; margin-top: 40px; }
.sc-download {
	display: flex; align-items: center; gap: 16px; padding: 18px 22px;
	background: var(--sc-soft); border: 1px solid var(--sc-line);
	border-radius: calc(var(--sc-radius) + 2px); color: inherit; transition: all .25s ease;
}
.sc-download:hover { border-color: var(--sc-primary); transform: translateX(4px); color: inherit; }
.sc-download__icon {
	flex: none; width: 44px; height: 44px; border-radius: 50%;
	background: var(--sc-primary-dark); color: #fff; display: flex; align-items: center; justify-content: center;
}
.sc-download__meta { display: flex; flex-direction: column; }
.sc-download__title { font-family: var(--sc-display); font-weight: 600; font-size: 16px; color: var(--sc-ink); }
.sc-download__text { color: var(--sc-muted); font-size: 13.5px; }

/* ═══════════════ SERVICE AREA ═══════════════ */
.sc-towns { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 9px; }
.sc-towns li {
	background: var(--sc-soft); border: 1px solid var(--sc-line); border-radius: 40px;
	padding: 8px 15px; font-size: 13.5px; color: #4a4f51; font-weight: 500;
}
.sc-towns__note { color: var(--sc-muted); font-size: 14px; margin-top: 18px; }
.sc-towns__note a { color: var(--sc-primary-dark); font-weight: 600; }

/* ═══════════════ APPLICATION PAGE HERO ═══════════════ */
.sc-apphero { position: relative; background: linear-gradient(160deg, var(--sc-deep), var(--sc-deep-2)); padding: clamp(44px, 6vw, 84px) 0; overflow: hidden; }
.sc-apphero--photo { min-height: clamp(380px, 48vh, 520px); display: flex; align-items: center; }
.sc-apphero__bg { position: absolute; inset: 0; }
.sc-apphero__bg img { width: 100%; height: 100%; object-fit: cover; }
.sc-apphero__scrim { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(2,22,20,.86) 0%, rgba(2,22,20,.6) 50%, rgba(2,22,20,.25) 100%); }
.sc-apphero__in { position: relative; }
.sc-apphero .sc-banner__text { max-width: 620px; }

/* ═══════════════ HEADER ═══════════════ */
.sc-header { width: 100%; background: #fff; }
body.sc-sticky-header .sc-header { position: sticky; top: 0; z-index: 900; box-shadow: 0 6px 22px rgba(4,28,25,.12); }
.admin-bar.sc-sticky-header .sc-header { top: 32px; }
@media (max-width: 782px) { .admin-bar.sc-sticky-header .sc-header { top: 46px; } }

.sc-topbar { border-bottom: 1px solid var(--sc-line); }
.sc-topbar__in { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 10px 0; }
.sc-topbar__note { display: flex; align-items: center; gap: 9px; color: #384f4a; font-size: 12.5px; font-weight: 600; }
.sc-topbar__star { width: 22px; height: 22px; border-radius: 50%; background: var(--sc-deep); display: inline-flex; align-items: center; justify-content: center; color: var(--sc-primary); font-size: 11px; }
.sc-topbar__right { display: flex; align-items: center; gap: 18px; font-size: 12.5px; font-weight: 600; color: #384f4a; }
.sc-topbar__right a { color: #384f4a; }
.sc-topbar__site { color: var(--sc-muted); }
.sc-topbar__phone { font-family: var(--sc-display); font-weight: 600; color: var(--sc-deep); font-size: 15px; }

.sc-brand { display: flex; align-items: center; gap: 13px; }
.sc-brand__text { display: flex; flex-direction: column; line-height: 1; }
.sc-brand__name { font-family: var(--sc-display); font-weight: 600; font-size: 27px; color: #58595b; }
.sc-brand__tag { font-family: var(--sc-display); font-weight: 700; font-size: 10px; letter-spacing: .26em; color: #2aa89b; margin-top: 5px; }
.sc-brand__img { max-height: 64px; width: auto; }

.sc-cart { position: relative; display: inline-flex; align-items: center; color: var(--sc-deep); }
.sc-cart__count {
	position: absolute; top: -7px; right: -9px; background: var(--sc-primary); color: var(--sc-ink);
	font-family: var(--sc-display); font-weight: 600; font-size: 10.5px; min-width: 17px; height: 17px;
	padding: 0 4px; border-radius: 9px; display: flex; align-items: center; justify-content: center;
}
.sc-cart__count.is-empty { display: none; }

.sc-nav { background: var(--sc-deep); }
.sc-nav__in { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.sc-nav__menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.sc-nav__menu a {
	display: block; color: #fff; font-family: var(--sc-display); font-weight: 500; font-size: 14.5px;
	letter-spacing: .01em; padding: 17px 15px;
}
.sc-nav__menu a:hover, .sc-nav__menu .current-menu-item > a { color: var(--sc-primary); }
.sc-nav__btns { display: flex; align-items: center; gap: 10px; padding: 8px 0; }
.sc-nav__btns .sc-btn { font-size: 13px; padding: 10px 18px; white-space: nowrap; }

/* Mobile header */
.sc-mhead { display: none; background: var(--sc-deep); align-items: center; justify-content: space-between; padding: 12px 18px; }
.sc-mhead__toggle { background: none; border: none; color: #fff; font-size: 26px; line-height: 1; cursor: pointer; width: 40px; text-align: left; }
.sc-mhead .sc-brand__name { font-size: 19px; color: #fff; }
.sc-mhead .sc-cart { color: #fff; }
/* Slide-in side drawer */
.sc-drawer__overlay {
	position: fixed; inset: 0; background: rgba(2,22,20,.55); z-index: 1000;
	opacity: 0; transition: opacity .3s ease; backdrop-filter: blur(2px);
}
.sc-drawer__overlay.is-open { opacity: 1; }
.sc-drawer__overlay[hidden] { display: none; }

.sc-mmenu {
	position: fixed; top: 0; left: 0; bottom: 0; z-index: 1001;
	width: min(84vw, 330px); background: var(--sc-deep-2);
	display: flex; flex-direction: column;
	transform: translateX(-100%); transition: transform .34s cubic-bezier(.3,.8,.3,1);
	box-shadow: 12px 0 40px rgba(0,0,0,.3); visibility: hidden;
}
.sc-mmenu.is-open { transform: translateX(0); visibility: visible; }

.sc-mmenu__top {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 16px 20px; border-bottom: 1px solid rgba(255,255,255,.12); flex: none;
}
.sc-mmenu__close {
	background: none; border: none; color: #fff; font-size: 22px; line-height: 1;
	cursor: pointer; padding: 4px 6px; border-radius: 4px;
}
.sc-mmenu__close:hover { background: rgba(255,255,255,.12); color: var(--sc-primary); }

.sc-mmenu__scroll { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: 24px; }
.sc-mmenu ul { list-style: none; margin: 0; padding: 0; }
.sc-mmenu ul a {
	display: block; color: #fff; font-family: var(--sc-display); font-weight: 700; font-size: 15px;
	letter-spacing: .03em; text-transform: uppercase; padding: 16px 22px;
	border-bottom: 1px solid rgba(255,255,255,.09);
}
.sc-mmenu ul a:hover, .sc-mmenu ul .current-menu-item > a { background: rgba(255,255,255,.07); color: var(--sc-primary); }
.sc-mmenu__btns { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 12px; }
.sc-mmenu__phone {
	display: flex; align-items: center; gap: 8px; padding: 10px 22px 4px;
	color: var(--sc-primary); font-family: var(--sc-display); font-weight: 600; font-size: 16px;
}
.sc-mmenu__addr { color: #a2a7a9; font-size: 12.5px; line-height: 1.6; padding: 0 22px; margin: 8px 0 0; }

body.sc-drawer-open { overflow: hidden; }

@media (max-width: 900px) {
	.sc-header__desktop { display: none; }
	.sc-mhead { display: flex; }
}

/* ═══════════════ HERO ═══════════════ */
.sc-hero { position: relative; display: flex; align-items: center; background: var(--sc-deep-2); overflow: hidden; }
.sc-hero--short  { min-height: clamp(360px, 46vh, 480px); }
.sc-hero--medium { min-height: clamp(460px, 60vh, 620px); }
.sc-hero--tall   { min-height: clamp(580px, 74vh, 780px); }
.sc-hero--full   { min-height: 100vh; }

.sc-hero__bg { position: absolute; inset: 0; }
.sc-hero__slide { position: absolute; inset: 0; }
.sc-hero__slide img { width: 100%; height: 100%; object-fit: cover; }
.sc-hero__bg--multi .sc-hero__slide {
	opacity: 0; animation: sc-slide 18s linear infinite; will-change: opacity, transform;
}
@keyframes sc-slide {
	0% { opacity: 0; transform: scale(1.07); }
	4% { opacity: 1; }
	33.3% { opacity: 1; transform: scale(1.005); }
	39% { opacity: 0; transform: scale(1); }
	100% { opacity: 0; }
}
.sc-hero__scrim { position: absolute; inset: 0; pointer-events: none; }
.sc-hero__fade { position: absolute; left: 0; right: 0; bottom: 0; height: 120px; pointer-events: none;
	background: linear-gradient(180deg, rgba(2,22,20,0), rgba(2,22,20,.55)); }

.sc-hero__in { position: relative; width: 100%; padding-top: 56px; padding-bottom: 56px; }
.sc-hero__copy { max-width: 640px; }
.sc-hero__badge {
	display: inline-block; background: var(--sc-primary); color: var(--sc-ink);
	font-family: var(--sc-display); font-weight: 600; font-size: 12px; letter-spacing: .09em;
	text-transform: uppercase; padding: 7px 14px; border-radius: 3px; margin-bottom: 20px;

}
.sc-hero__title {
	color: #fff; font-weight: 700; font-size: clamp(36px, 5vw, 64px); line-height: 1.02;
	letter-spacing: -.01em; text-shadow: 0 3px 18px rgba(0,0,0,.35);
}
.sc-hero__text {
	color: #eceeee; font-size: clamp(15px, 1.5vw, 18.5px); line-height: 1.6;
	margin: 20px 0 30px; max-width: 470px; text-shadow: 0 1px 10px rgba(0,0,0,.3);
}
.sc-hero__dots { position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%); display: flex; gap: 10px; pointer-events: none; }
.sc-hero__dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.45); animation: sc-dot 18s linear infinite; }
@keyframes sc-dot { 0%, 33.3% { background: var(--sc-primary); } 33.4%, 100% { background: rgba(255,255,255,.45); } }

/* ═══════════════ PAGE BANNER ═══════════════ */
.sc-banner { background: linear-gradient(160deg, var(--sc-deep), var(--sc-deep-2)); padding: clamp(36px, 5vw, 60px) 0; }
.sc-banner__crumb { color: #b6babb; font-size: 12.5px; font-weight: 600; letter-spacing: .04em; margin-bottom: 12px; }
.sc-banner__crumb a { color: #b6babb; }
.sc-banner__title { color: #fff; font-weight: 700; font-size: clamp(30px, 4vw, 48px); }
.sc-banner__text { color: #c9cdce; font-size: 16px; max-width: 640px; margin: 14px 0 0; line-height: 1.5; }

/* ═══════════════ GRIDS & CARDS ═══════════════ */
.sc-grid { display: grid; gap: 26px; margin-top: 48px; }
.sc-grid--3 { grid-template-columns: repeat(auto-fit, minmax(288px, 1fr)); }
.sc-grid--auto { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.sc-grid--2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 48px; }

.sc-media { position: relative; border-radius: var(--sc-radius); overflow: hidden; }
.sc-media--43 { aspect-ratio: 4/3; }
.sc-media--11 { aspect-ratio: 1/1; }
.sc-media--169 { aspect-ratio: 16/10; }
.sc-media--45 { aspect-ratio: 4/5; }
.sc-media img { width: 100%; height: 100%; object-fit: cover; }
.sc-media--shadow { box-shadow: none; }

/* Category cards */
.sc-cat { display: flex; flex-direction: column; }
.sc-cat__title { text-align: center; color: var(--sc-primary-dark); font-weight: 600; font-size: 24px; margin-top: 22px; }
.sc-cat__text { text-align: center; color: var(--sc-body); font-size: 14.5px; line-height: 1.5; margin: 8px 0 18px; }
.sc-cat .sc-btn { align-self: center; }

/* Product / generic card */
.sc-card {
	background: #fff; border: 1px solid var(--sc-line); border-radius: calc(var(--sc-radius) + 2px);
	overflow: hidden; display: flex; flex-direction: column; list-style: none; color: inherit;
}
.sc-card__media { position: relative; aspect-ratio: 4/3; overflow: hidden; }
.sc-card__media img { width: 100%; height: 100%; object-fit: cover; }
.sc-card__badge {
	position: absolute; top: 14px; left: 14px; background: var(--sc-primary); color: var(--sc-ink);
	font-family: var(--sc-display); font-weight: 600; font-size: 11px; letter-spacing: .05em;
	text-transform: uppercase; padding: 6px 11px; border-radius: 3px;
}
.sc-card > a:not(.sc-btn) { display: block; color: inherit; }
.woocommerce ul.products li.product .sc-card__tag,
.sc-card__tag { color: var(--sc-primary-dark); font-family: var(--sc-display); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; display: block; padding: 20px 22px 0; }
.woocommerce ul.products li.product .sc-card__title,
.sc-card__title { color: var(--sc-ink); font-weight: 600; font-size: 19.5px; margin: 6px 0 10px; padding: 0 22px; }
.sc-card__price { display: flex; align-items: baseline; gap: 8px; padding: 0 22px; margin-top: auto; }
.sc-card__from { color: var(--sc-muted); font-size: 13px; font-weight: 600; }
.sc-card__amount { color: var(--sc-ink); font-family: var(--sc-display); font-weight: 700; font-size: 22px; }
.sc-card__amount .amount { color: var(--sc-ink); }
.sc-card__amount del { color: var(--sc-muted); font-size: 15px; font-weight: 600; }
.sc-card__note { color: var(--sc-muted); font-size: 12.5px; padding: 4px 22px 0; display: block; }
.sc-card__actions { display: flex; gap: 10px; padding: 16px 22px 22px; align-items: stretch; }
/* flex-basis 0 + min-width 0 keeps both halves identical — without min-width the
   longer label's intrinsic size wins and the pair ends up lopsided. Woo's own
   .button padding is overridden here so the two match exactly. */
.sc-card__actions .sc-btn,
.woocommerce .sc-card__actions a.button {
	flex: 1 1 0; min-width: 0; width: auto;
	display: inline-flex; align-items: center; justify-content: center;
	font-size: 13px; padding: 12px 8px; line-height: 1.3;
}
/* Woo strips the border off its buttons — put a transparent one back so the
   filled half matches the outlined half's height exactly. Scoped to Woo's
   button so the outline variant keeps its own visible border. */
.woocommerce .sc-card__actions a.button { border: 1.5px solid transparent; }

/* ═══════════════ REPAIRS ═══════════════ */
.sc-repairs__badge {
	display: inline-block; background: var(--sc-primary); color: var(--sc-ink); font-family: var(--sc-display);
	font-weight: 600; font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
	padding: 7px 13px; border-radius: 3px; margin-bottom: 18px;
}
.sc-repairs__text { color: #b9bdbe; font-size: 15.5px; line-height: 1.65; margin: 16px 0 24px; }
.sc-ticks { display: flex; flex-direction: column; gap: 15px; list-style: none; margin: 0; padding: 0; }
.sc-ticks li { display: flex; align-items: flex-start; gap: 13px; color: #f1f3f3; font-size: 15.5px; font-weight: 600; line-height: 1.5; }
.sc-ticks--dark li { color: #4a4f51; }
.sc-ticks__mark {
	flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--sc-primary); color: var(--sc-ink);
	font-weight: 600; font-size: 14px; display: inline-flex; align-items: center; justify-content: center;
}
.sc-ba { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.sc-ba__item { position: relative; border-radius: calc(var(--sc-radius) + 2px); overflow: hidden; }
.sc-ba__item--after { transform: translateY(22px); }
.sc-ba__label {
	position: absolute; top: 14px; left: 14px; font-family: var(--sc-display); font-weight: 600; font-size: 11px;
	letter-spacing: .05em; text-transform: uppercase; padding: 6px 11px; border-radius: 3px; pointer-events: none;
}
.sc-ba__label--before { background: var(--sc-ink); color: #fff; }
.sc-ba__label--after { background: var(--sc-primary); color: var(--sc-ink); }

/* ═══════════════ ADVANTAGE ═══════════════ */
.sc-adv__text { color: var(--sc-body); font-size: 15.5px; line-height: 1.65; margin: 16px 0 22px; }
.sc-arrows { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.sc-arrows li { display: flex; align-items: flex-start; gap: 12px; color: #4a4f51; font-size: 15px; font-weight: 600; line-height: 1.45; }
.sc-arrows__mark { flex: none; color: var(--sc-primary); font-size: 19px; line-height: 1.3; font-weight: 600; }

/* ═══════════════ STEPS ═══════════════ */
.sc-step {
	background: #fff; border-radius: calc(var(--sc-radius) + 2px); padding: 34px 28px; text-align: center;
	border-top: 4px solid var(--sc-primary); border: 1px solid var(--sc-line); border-top: 4px solid var(--sc-primary);
}
.sc-step__n {
	width: 56px; height: 56px; border-radius: 50%; background: var(--sc-deep); color: var(--sc-primary);
	font-family: var(--sc-display); font-weight: 700; font-size: 23px; display: flex; align-items: center;
	justify-content: center; margin: 0 auto 18px;
}
.sc-step__title { color: var(--sc-ink); font-weight: 600; font-size: 19.5px; margin-bottom: 8px; }
.sc-step__text { color: var(--sc-body); font-size: 14px; line-height: 1.6; margin: 0; }

/* ═══════════════ REVIEWS ═══════════════ */
.sc-review {
	background: linear-gradient(160deg, var(--sc-deep), var(--sc-deep-2)); border-radius: calc(var(--sc-radius) + 2px);
	padding: 36px 32px; display: flex; flex-direction: column; min-height: 240px;
}
.sc-review__mark { font-family: var(--sc-display); font-weight: 700; font-size: 52px; line-height: .6; color: var(--sc-primary); }
.sc-review__quote { color: #f1f3f3; font-size: 15px; line-height: 1.65; margin: 18px 0 auto; }
.sc-review__stars { color: var(--sc-primary); font-size: 17px; letter-spacing: 3px; margin-top: 20px; }
.sc-review__name { color: #fff; font-weight: 700; font-size: 14px; margin-top: 10px; }
.sc-review__loc { color: #a9aeb0; font-size: 12.5px; }
.sc-revnav { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 34px; }
.sc-revnav__btn {
	width: 40px; height: 40px; border-radius: 50%; border: 1.5px solid #b5cac4; background: #fff;
	color: var(--sc-deep); font-size: 17px; cursor: pointer;
}
.sc-revnav__btn:hover { background: var(--sc-deep); color: #fff; border-color: var(--sc-deep); }
.sc-revnav__dots { display: flex; gap: 9px; }
.sc-revnav__dot { width: 11px; height: 11px; border-radius: 50%; background: #c0d5cf; cursor: pointer; border: none; padding: 0; transition: background .2s; }
.sc-revnav__dot.is-active { background: var(--sc-primary); }

/* ═══════════════ GALLERY ═══════════════ */
.sc-gallery { display: grid; gap: 16px; margin-top: 44px; }
.sc-gallery--3 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.sc-gallery--4 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.sc-gallery--5 { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }

/* ═══════════════ FAQ ═══════════════ */
.sc-faq { display: flex; flex-direction: column; gap: 12px; margin-top: 44px; }
.sc-faq__item { background: var(--sc-soft); border-radius: var(--sc-radius); border: 1px solid var(--sc-line); overflow: hidden; }
.sc-faq__q {
	width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding: 19px 24px; cursor: pointer; background: none; border: none; text-align: left;
	font-family: var(--sc-display); font-weight: 700; font-size: 16.5px; color: var(--sc-ink);
}
.sc-faq__sign { flex: none; color: var(--sc-primary); font-size: 22px; font-weight: 700; line-height: 1; }
.sc-faq__a { padding: 0 24px 22px; color: var(--sc-body); font-size: 14.5px; line-height: 1.65; display: none; }
.sc-faq__item.is-open .sc-faq__a { display: block; }

/* ═══════════════ CTA BAND ═══════════════ */
.sc-cta { text-align: center; }
.sc-cta__title { color: #fff; font-weight: 600; font-size: clamp(23px, 2.8vw, 34px); }
.sc-cta__text { color: #b9bdbe; font-size: 15px; margin: 14px 0 26px; }
.sc-cta__form { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; max-width: 520px; margin: 0 auto; }
.sc-cta__form input[type="email"] { flex: 1; min-width: 220px; padding: 15px 18px; border: none; border-radius: 5px; font-size: 15px; color: var(--sc-ink); }
.sc-cta__note { color: #a2a7a9; font-size: 14px; margin: 20px 0 0; }
.sc-cta__note a { color: var(--sc-primary); font-weight: 700; }

/* ═══════════════ FORMS ═══════════════ */
.sc-form { min-width: 0; }
.sc-form__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; margin-bottom: 14px; }
.sc-form input[type="text"], .sc-form input[type="email"], .sc-form input[type="tel"],
.sc-form textarea, .sc-form select {
	width: 100%; padding: 13px 15px; border: 1px solid #d3d7d8; border-radius: 6px; font-size: 14px;
	color: var(--sc-ink); background: #fff;
}
.sc-form textarea { resize: vertical; }
.sc-form input:focus, .sc-form textarea:focus, .sc-form select:focus {
	outline: none; border-color: var(--sc-primary); box-shadow: 0 0 0 3px rgba(18,175,160,.15);
}

/* ═══════════════ CONTACT ═══════════════ */
.sc-info { background: var(--sc-soft); border-radius: calc(var(--sc-radius) + 2px); padding: 28px 26px; }
.sc-info__label { font-family: var(--sc-display); font-weight: 700; font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--sc-muted); margin-bottom: 3px; }
.sc-info__value { color: #4a4f51; font-size: 15px; font-weight: 600; line-height: 1.5; }
.sc-info__phone { font-family: var(--sc-display); font-weight: 600; font-size: 19px; color: var(--sc-deep); }
.sc-info__block + .sc-info__block { margin-top: 16px; }
.sc-repairbox { background: linear-gradient(160deg, var(--sc-deep), var(--sc-deep-2)); border-radius: calc(var(--sc-radius) + 2px); padding: 26px; margin-top: 20px; }
.sc-repairbox h3 { color: #fff; font-weight: 600; font-size: 18px; margin-bottom: 6px; }
.sc-repairbox p { color: #b9bdbe; font-size: 13px; margin: 0 0 14px; }
.sc-map { position: relative; aspect-ratio: 16/9; border-radius: calc(var(--sc-radius) + 2px); overflow: hidden; margin-top: 20px; border: 1px solid var(--sc-line); }
.sc-map iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ═══════════════ WOOCOMMERCE ═══════════════ */
/* auto-fill, not auto-fit: auto-fit collapses the unused tracks, so a row with
   only two related products would stretch them to full width. */
.woocommerce ul.products {
	display: grid; gap: 26px; margin: 0; padding: 0;
	grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
}
.woocommerce ul.products.columns-2 { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
.woocommerce ul.products.columns-4 { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }

/* Related / upsells sit in a full-width band under the product */
.woocommerce div.product .related > h2,
.woocommerce div.product .upsells > h2 {
	font-family: var(--sc-display); font-weight: 700; font-size: clamp(22px, 2.4vw, 28px); margin: 0 0 26px;
}
.woocommerce div.product .related, .woocommerce div.product .upsells { margin-top: clamp(40px, 5vw, 64px); }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none; }
.woocommerce ul.products li.product { width: auto !important; margin: 0 !important; float: none !important; padding: 0; }
.woocommerce ul.products li.product a img { margin: 0; }
.woocommerce .woocommerce-result-count, .woocommerce .woocommerce-ordering { margin-bottom: 24px; }
.woocommerce .woocommerce-ordering select { padding: 10px 14px; border: 1px solid #d3d7d8; border-radius: 6px; }

.sc-shop-main { padding: clamp(32px, 4vw, 56px) 0 clamp(56px, 7vw, 90px); }
.sc-filters { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-bottom: 40px; }
.sc-filters__btn {
	font-family: var(--sc-display); font-weight: 500; font-size: 14px; letter-spacing: 0;
	padding: 11px 22px; border-radius: 40px; cursor: pointer;
	border: 1.5px solid #d3d7d8; background: #fff; color: #384f4a; transition: all .15s;
}
.sc-filters__btn:hover { border-color: var(--sc-deep); }
.sc-filters__btn.is-active { border-color: var(--sc-deep); background: var(--sc-deep); color: #fff; }

/* Buttons inside Woo */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce a.button.alt, .woocommerce button.button.alt {
	background: var(--sc-primary-dark); color: var(--sc-on-primary); font-family: var(--sc-display); font-weight: 600;
	font-size: 14.5px; letter-spacing: 0; text-transform: none; border-radius: var(--sc-radius); padding: 14px 26px;
	border: none; transition: all .22s ease;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce #respond input#submit:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover {
	background: var(--sc-deep); color: var(--sc-on-primary);
}
.woocommerce .sc-btn--outline { background: #fff; color: var(--sc-deep); }
.woocommerce .sc-btn--outline:hover { background: var(--sc-deep); color: #fff; }

/* Single product — one column on phones, image left / summary right on desktop.
   Explicit columns rather than auto-fit: auto-fit fits a third track on wide
   screens and leaves an empty gap beside the summary. */
.woocommerce div.product { display: grid; grid-template-columns: 1fr; gap: 36px; align-items: start; }
@media (min-width: 981px) {
	.woocommerce div.product { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 48px; }
}
.woocommerce div.product > .woocommerce-product-gallery,
.woocommerce div.product > .summary { float: none !important; width: auto !important; margin: 0 !important; }
.woocommerce div.product > .woocommerce-tabs,
.woocommerce div.product > .related,
.woocommerce div.product > .upsells,
.woocommerce div.product > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
/* Gallery: one large image, thumbnails underneath that swap it in place */
.sc-pgallery { width: 100%; }
.sc-pgallery__main {
	position: relative; aspect-ratio: 4/3; overflow: hidden;
	border: 1px solid var(--sc-line); border-radius: calc(var(--sc-radius) + 2px);
}
.sc-pgallery__main img {
	width: 100%; height: 100%; object-fit: cover; display: block;
	transition: opacity .16s ease;
}
.sc-pgallery__main img.is-swapping { opacity: 0; }
.sc-pgallery__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 12px; }
.sc-pgallery__thumb {
	position: relative; padding: 0; cursor: pointer; overflow: hidden;
	aspect-ratio: 1/1; background: none;
	border: 1px solid var(--sc-line); border-radius: var(--sc-radius);
	transition: border-color .22s ease;
}
.sc-pgallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sc-pgallery__thumb:hover { border-color: var(--sc-primary); }
.sc-pgallery__thumb.is-active { border-color: var(--sc-primary); border-width: 2px; }
.sc-pgallery__thumb:focus-visible { outline: 2px solid var(--sc-primary); outline-offset: 2px; }
@media (max-width: 520px) { .sc-pgallery__thumbs { grid-template-columns: repeat(3, 1fr); } }
.woocommerce div.product .product_title { font-weight: 700; font-size: clamp(26px, 3vw, 38px); line-height: 1.08; }
.woocommerce div.product p.price, .woocommerce div.product span.price {
	color: var(--sc-ink); font-family: var(--sc-display); font-weight: 700; font-size: 34px;
}
.woocommerce div.product p.price del { color: var(--sc-muted); font-size: 22px; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { border-bottom-color: var(--sc-primary); }
.woocommerce span.onsale { background: var(--sc-primary); color: var(--sc-ink); font-family: var(--sc-display); font-weight: 600; }
.woocommerce .quantity .qty { padding: 12px 8px; border: 1.5px solid #d3d7d8; border-radius: 6px; }

.sc-trust { list-style: none; margin: 22px 0 0; padding: 20px 0 0; border-top: 1px solid #e9efed; display: flex; flex-direction: column; gap: 10px; }
.sc-trust li { display: flex; align-items: center; gap: 10px; color: #4a4f51; font-size: 14px; font-weight: 600; }
.sc-trust__tick { color: var(--sc-primary); font-weight: 600; }
.sc-trust__note { color: var(--sc-muted); font-size: 13px; margin-top: 14px; }

.woocommerce-message, .woocommerce-info, .woocommerce-error {
	border-top-color: var(--sc-primary); background: var(--sc-soft); border-radius: var(--sc-radius);
	font-size: 15px; color: var(--sc-ink);
}
.woocommerce-message::before, .woocommerce-info::before { color: var(--sc-primary); }

/* ═══════════════ CART & CHECKOUT ═══════════════ */
.sc-shop-main .woocommerce { max-width: 100%; }

/* Tables (cart, order review, totals) */
.woocommerce table.shop_table {
	border: 1px solid var(--sc-line); border-radius: calc(var(--sc-radius) + 2px);
	border-collapse: separate; border-spacing: 0; overflow: hidden; margin-bottom: 28px;
}
.woocommerce table.shop_table th {
	font-family: var(--sc-display); font-weight: 600; font-size: 13px; letter-spacing: .04em;
	text-transform: uppercase; color: var(--sc-muted); background: var(--sc-soft);
	padding: 16px 18px; border: none;
}
.woocommerce table.shop_table td {
	padding: 18px; border-top: 1px solid var(--sc-line); vertical-align: middle; color: var(--sc-body);
}
.woocommerce table.shop_table tbody tr:first-child td { border-top: none; }
/* Woo underlines links inside its tables — the design does not */
.woocommerce table.shop_table a,
.woocommerce table.shop_table a:hover,
.woocommerce-checkout #order_review a,
.woocommerce .cart_totals a { text-decoration: none; }
.woocommerce table.shop_table .product-name a { color: var(--sc-ink); font-weight: 600; }
.woocommerce table.shop_table .product-name a:hover { color: var(--sc-primary-dark); }
.woocommerce table.shop_table img { width: 72px; border-radius: 6px; }
.woocommerce table.shop_table .amount { color: var(--sc-ink); font-weight: 600; }
.woocommerce a.remove {
	color: var(--sc-muted) !important; font-weight: 400; line-height: 1.4;
	width: 26px; height: 26px; font-size: 20px;
}
.woocommerce a.remove:hover { background: #c0392b; color: #fff !important; }

/* Coupon + update row */
.woocommerce .cart .actions { padding: 18px !important; }
.woocommerce .cart .actions .coupon { display: flex; gap: 10px; flex-wrap: wrap; }
.woocommerce .cart .actions .coupon input[type="text"] {
	padding: 13px 15px; border: 1px solid #d3d7d8; border-radius: var(--sc-radius);
	font-size: 14px; min-width: 200px; width: auto !important;
}
.woocommerce .cart .actions .button[name="update_cart"] { background: var(--sc-soft); color: var(--sc-ink); }
.woocommerce .cart .actions .button[name="update_cart"]:hover { background: var(--sc-line); color: var(--sc-ink); }

/* Cart totals card */
.woocommerce .cart-collaterals { width: 100%; }
.woocommerce .cart-collaterals .cart_totals { width: 100%; float: none; }
.woocommerce .cart_totals h2 {
	font-size: 20px; margin-bottom: 16px; font-family: var(--sc-display); font-weight: 700;
}
.woocommerce .cart_totals table.shop_table { background: var(--sc-soft); }
.woocommerce .cart_totals table.shop_table th { background: transparent; text-transform: none; font-size: 14.5px; color: var(--sc-body); }
.woocommerce .cart_totals .order-total .amount { font-family: var(--sc-display); font-size: 22px; color: var(--sc-ink); }
.woocommerce .wc-proceed-to-checkout { padding: 0; }
.woocommerce .wc-proceed-to-checkout a.checkout-button { display: block; text-align: center; font-size: 15.5px; padding: 16px 24px; }

/* Cart page layout: items left, totals right */
@media (min-width: 981px) {
	.woocommerce-cart .woocommerce {
		display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(300px, 1fr);
		gap: 40px; align-items: start;
	}
	.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
	.woocommerce-cart .woocommerce-cart-form { grid-column: 1; margin: 0; }
	.woocommerce-cart .cart-collaterals { grid-column: 2; margin: 0; }
	.woocommerce-cart .cross-sells { grid-column: 1 / -1; }
}

/* Checkout */
.woocommerce-checkout h3 {
	font-family: var(--sc-display); font-weight: 700; font-size: 20px;
	margin: 0 0 18px; padding-bottom: 14px; border-bottom: 2px solid var(--sc-line);
}
.woocommerce form .form-row { padding: 0; margin: 0 0 16px; }
.woocommerce form .form-row label { font-weight: 600; font-size: 13.5px; color: var(--sc-ink); margin-bottom: 6px; display: block; }
.woocommerce form .form-row .required { color: #c0392b; text-decoration: none; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection--single {
	width: 100%; padding: 13px 15px; border: 1px solid #d3d7d8; border-radius: var(--sc-radius);
	font-size: 14.5px; color: var(--sc-ink); background: #fff; height: auto; line-height: 1.5;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	outline: none; border-color: var(--sc-primary); box-shadow: 0 0 0 3px rgba(18,175,160,.15);
}
.woocommerce .select2-container .select2-selection--single .select2-selection__rendered { line-height: 1.5; padding: 0; }
.woocommerce .select2-container .select2-selection--single .select2-selection__arrow { top: 12px; right: 10px; }
.woocommerce form.checkout_coupon,
.woocommerce form.login, .woocommerce form.register {
	border: 1px solid var(--sc-line); border-radius: calc(var(--sc-radius) + 2px); padding: 24px; background: var(--sc-soft);
}
#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
	background: var(--sc-soft); border-radius: calc(var(--sc-radius) + 2px);
}
.woocommerce-checkout #payment div.payment_box { background: #fff; border: 1px solid var(--sc-line); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: #fff; }
.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--sc-line); }
.woocommerce-checkout #payment #place_order { width: 100%; font-size: 15.5px; padding: 16px 24px; }

@media (min-width: 981px) {
	.woocommerce-checkout form.checkout {
		display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr);
		gap: 0 40px; align-items: start;
	}
	.woocommerce-checkout form.checkout #customer_details { grid-column: 1; grid-row: 1 / span 2; }
	.woocommerce-checkout form.checkout h3#order_review_heading { grid-column: 2; grid-row: 1; margin-top: 0; }
	.woocommerce-checkout form.checkout #order_review { grid-column: 2; grid-row: 2; }
	.woocommerce-checkout #customer_details .col-1,
	.woocommerce-checkout #customer_details .col-2 { float: none; width: 100%; }
}

/* My Account */
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li {
	border-bottom: 1px solid var(--sc-line);
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block; padding: 13px 16px; color: var(--sc-body); font-weight: 500; font-size: 14.5px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	background: var(--sc-soft); color: var(--sc-deep); font-weight: 600;
}
@media (min-width: 981px) {
	.woocommerce-account .woocommerce-MyAccount-navigation { width: 24%; }
	.woocommerce-account .woocommerce-MyAccount-content { width: 72%; }
}
.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register {
	border: 1px solid var(--sc-line); border-radius: calc(var(--sc-radius) + 2px);
	padding: clamp(22px, 3vw, 32px); background: var(--sc-soft);
}

/* Order tracking form */
.woocommerce form.track_order {
	border: 1px solid var(--sc-line); border-radius: calc(var(--sc-radius) + 2px);
	padding: clamp(22px, 3vw, 32px); background: var(--sc-soft); max-width: 620px;
}
.woocommerce form.track_order .form-row-first,
.woocommerce form.track_order .form-row-last { width: 100%; float: none; }

/* Empty cart state */
.woocommerce .cart-empty { font-size: 18px; color: var(--sc-ink); }
.woocommerce .return-to-shop { margin-bottom: 40px; }
.woocommerce .cross-sells h2 { font-family: var(--sc-display); font-weight: 700; font-size: 24px; margin: 40px 0 24px; }

/* ═══════════════ QUOTE REQUEST FORM ═══════════════ */
.sc-quote {
	background: var(--sc-soft); border: 1px solid var(--sc-line);
	border-radius: calc(var(--sc-radius) + 4px); padding: clamp(22px, 3vw, 32px);
	margin: 28px 0 0; scroll-margin-top: 140px;
	border-top: 3px solid var(--sc-primary);
}
.sc-quote__title { font-size: clamp(19px, 2.1vw, 24px); margin-bottom: 8px; }
.sc-quote__intro { color: var(--sc-body); font-size: 14.5px; line-height: 1.6; margin: 0 0 20px; max-width: 620px; }
.sc-quote__for {
	display: inline-block; background: #fff; border: 1px solid var(--sc-line);
	border-radius: 40px; padding: 8px 16px; font-size: 13.5px; color: var(--sc-body); margin: 0 0 18px;
}
.sc-quote__for strong { color: var(--sc-ink); }
.sc-quote__done {
	background: #e8f3ea; border-left: 4px solid #16a34a; color: #166534;
	padding: 14px 18px; border-radius: var(--sc-radius); margin-bottom: 20px; font-size: 15px; font-weight: 500;
}
.sc-quote__note { color: var(--sc-muted); font-size: 13.5px; margin: 14px 0 0; }
.sc-quote .sc-form__row { margin-bottom: 14px; }
.sc-quote input, .sc-quote textarea { background: #fff; }
.sc-quote .sc-btn { width: 100%; }

/* Inside the product summary the column is narrow — keep every field full width */
.woocommerce div.product .summary .sc-quote .sc-form__row { grid-template-columns: 1fr; }

/* Roomy enough on wide screens to pair the short fields up again */
@media (min-width: 1200px) {
	.woocommerce div.product .summary .sc-quote .sc-form__row {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Standalone use (shortcode on a normal page) can be roomier */
.sc-page .sc-quote, .sc-section .sc-quote { padding: clamp(24px, 3vw, 40px); }
.sc-page .sc-quote .sc-btn, .sc-section .sc-quote .sc-btn { width: auto; }

/* ═══════════════ FOOTER ═══════════════ */
.sc-footer { background: var(--sc-deep-2); padding: clamp(44px, 5vw, 68px) 0 0; }
.sc-footer__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 36px; padding-bottom: 40px; }
.sc-footer__about { color: #a2a7a9; font-size: 13px; line-height: 1.6; margin: 16px 0 14px; }
.sc-footer__phone { color: #fff; font-family: var(--sc-display); font-weight: 600; font-size: 16px; }
.sc-footer__site { color: #a2a7a9; font-size: 13px; margin: 8px 0 0; }
.sc-footer .sc-brand__name { color: #fff; font-size: 21px; }
.sc-footer__h4 { color: var(--sc-primary); font-family: var(--sc-display); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 16px; }
.sc-footer__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.sc-footer__links a { color: #d0d4d5; font-size: 13.5px; }
.sc-footer__links a:hover { color: var(--sc-primary); }
.sc-social { display: flex; gap: 12px; margin-top: 16px; }
.sc-social a {
	width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.08); color: #fff;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid rgba(255,255,255,.12);
}
.sc-social a:hover { background: var(--sc-primary); border-color: var(--sc-primary); color: #fff; transform: translateY(-2px); }
.sc-social svg { display: block; }
.sc-footer__bottom { border-top: 1px solid rgba(255,255,255,.1); padding: 20px 0 26px; }
.sc-footer__bottom-in { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.sc-footer__copy { color: #8b9092; font-size: 12px; max-width: 100%; }
.sc-footer__legal { display: flex; gap: 20px; flex-wrap: wrap; justify-content: center; }
.sc-footer__legal a { color: #8b9092; font-size: 12px; }

/* Footer on phones — centered, extra columns hidden by option */
@media (max-width: 720px) {
	.sc-footer--center .sc-footer__grid { grid-template-columns: 1fr !important; text-align: center; justify-items: center; }
	.sc-footer--center .sc-social,
	.sc-footer--center .sc-footer__bottom-in { justify-content: center; }
	.sc-footer--center .sc-footer__links { align-items: center; }
	.sc-footer--center .sc-footer__bottom-in { flex-direction: column; text-align: center; }
	.sc-footer__col--hide-mobile { display: none; }
}

/* ═══════════════ RESPONSIVE ═══════════════ */
@media (max-width: 900px) {
	.sc-ba { gap: 12px; }
	.sc-ba__item--after { transform: none; }
}
/* Shop toolbar stacks instead of squeezing on narrow screens */
@media (max-width: 720px) {
	.woocommerce .woocommerce-result-count,
	.woocommerce .woocommerce-ordering {
		float: none; width: 100%; margin: 0 0 14px; text-align: left;
	}
	.woocommerce .woocommerce-ordering select { width: 100%; }
	.sc-filters { gap: 8px; margin-bottom: 30px; }
	.sc-filters__btn { font-size: 13px; padding: 10px 16px; }
}

@media (max-width: 600px) {
	.sc-btns { width: 100%; }
	.sc-btns .sc-btn { flex: 1 1 100%; max-width: 100%; }
	.sc-hero__copy, .sc-hero__text { max-width: 100%; }
	.sc-card__actions { flex-direction: column; }
	.sc-hero__dots { bottom: 16px; }
}

/* ═══════════════ 404 / misc pages ═══════════════ */
.sc-page { padding: clamp(44px, 6vw, 84px) 0; }
.sc-page__content { color: var(--sc-body); font-size: 16px; line-height: 1.75; }
.sc-page__content h2, .sc-page__content h3 { color: var(--sc-ink); margin: 1.4em 0 .5em; }
.sc-page__content a { color: var(--sc-primary-dark); text-decoration: underline; }

/* Failed submission notice — same shape as the success one, different colour */
.sc-quote__done--error { background: #fdecea; border-left-color: #c0392b; color: #8a2118; }