/* ==========================================================================
   GOSHOPCARA — LIGHT THEME OVERRIDE
   White canvas, Burgundy #7A1025 as the single identity colour.
   Loaded last so it wins over burgundy.css / burgundy-components.css.

   Visual ratio kept from the brief, inverted for a light surface:
   ~60% white/neutral, ~25% Burgundy, ~10% ink, <5% gold.
   ========================================================================== */

:root {
	/* Burgundy ramp is unchanged — it is the brand. */
	--burgundy-950: #32050F;
	--burgundy-900: #4A0716;
	--burgundy-800: #651020;
	--burgundy-700: #7A1025;
	--burgundy-600: #9E2940;
	--burgundy-300: #C46A78;

	--gold: #B08D42;

	/* Surfaces flip to white. */
	--bg: #FFFFFF;
	--surface: #FAF8F8;
	--surface-2: #F3EEEF;

	/* Ink on white needs to be dark, not light. */
	--text: #17090D;
	--muted: #6B5A5E;

	--border: rgba(23, 9, 13, .12);
	--border-strong: rgba(23, 9, 13, .22);

	--accent: var(--burgundy-700);
	--accent-hover: var(--burgundy-600);
	--accent-soft: var(--burgundy-600);
	--brand: var(--burgundy-700);
	--primary: var(--burgundy-700);
	--ink: var(--text);
	--paper: var(--bg);
}

/* Labels and small accents need the darker burgundy to stay legible on white:
   --burgundy-300 is a tint meant for dark backgrounds and fails contrast here. */
.gsc-label,
.gsc-float__label,
.gsc-art__cat,
.gsc-card__price ins {
	color: var(--burgundy-700);
}

.gsc-body {
	background: var(--bg);
	color: var(--text);
}

/* --------------------------------------------------------------------------
   Announcement + header
   -------------------------------------------------------------------------- */

.gsc-ann {
	background: var(--burgundy-700);
	border-bottom: 0;
}

.gsc-marquee__item { color: rgba(255, 255, 255, .86); }
.gsc-marquee__item b { color: #fff; }

/* Transparent only where a hero sits behind it. Everywhere else the page
   starts at the top of the viewport, so content scrolled straight through a
   see-through header. */
.gsc-hd {
	background: var(--bg);
	border-bottom-color: var(--border);
}

body.home .gsc-hd,
body.front-page .gsc-hd {
	background: transparent;
	border-bottom-color: transparent;
}

.gsc-hd.is-stuck,
body.home .gsc-hd.is-stuck {
	background: rgba(255, 255, 255, .9);
	backdrop-filter: blur(18px) saturate(140%);
	-webkit-backdrop-filter: blur(18px) saturate(140%);
	border-bottom-color: var(--burgundy-700);
}

.gsc-hd__in { color: var(--text); }
.gsc-logo { color: var(--text); }
.gsc-icon { color: var(--text); }
.gsc-icon:hover { background: rgba(122, 16, 37, .08); color: var(--burgundy-700); }
.gsc-nav a:hover,
.gsc-nav .current-menu-item > a { color: var(--burgundy-700); }

/* Mobile menu stays burgundy — it is a full-bleed brand surface. */
.gsc-mob { background: var(--burgundy-900); }
.gsc-mob .gsc-logo,
.gsc-mob .gsc-icon { color: #fff; }
.gsc-mob__list a { color: #fff; border-bottom-color: rgba(255, 255, 255, .16); }

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.gsc-hero { background: var(--bg); }

.gsc-hero__bg {
	background:
		radial-gradient(58% 54% at 74% 44%, rgba(122, 16, 37, .10), transparent 70%),
		radial-gradient(46% 46% at 12% 82%, rgba(122, 16, 37, .06), transparent 72%);
}

.gsc-hero__title em { color: var(--burgundy-700); }

.gsc-hero__watch img {
	filter: drop-shadow(0 26px 46px rgba(23, 9, 13, .18));
}

.gsc-float {
	background: rgba(255, 255, 255, .86);
	border-color: var(--border-strong);
	box-shadow: 0 18px 46px rgba(23, 9, 13, .12);
}

.gsc-scroll { color: var(--muted); }
.gsc-scroll__line { background: linear-gradient(to bottom, var(--burgundy-700), transparent); }
.gsc-scroll__dot { background: var(--burgundy-700); }

/* --------------------------------------------------------------------------
   Clock — dial becomes light
   -------------------------------------------------------------------------- */

.gsc-clock {
	background:
		radial-gradient(circle at 34% 28%, rgba(23, 9, 13, .035), transparent 58%),
		#fff;
	border-color: var(--border-strong);
	box-shadow: inset 0 1px 10px rgba(23, 9, 13, .06), 0 14px 34px rgba(23, 9, 13, .10);
}

.gsc-clock__tick::before { background: rgba(23, 9, 13, .28); }
.gsc-clock__tick--h::before { background: var(--burgundy-700); }
.gsc-clock__hand--h,
.gsc-clock__hand--m { background: var(--text); }
.gsc-clock__hand--s { background: var(--burgundy-700); }
.gsc-clock__pin { background: var(--burgundy-700); box-shadow: 0 0 0 2px #fff; }

.gsc-timesec { background: var(--surface); }

/* --------------------------------------------------------------------------
   Cards
   -------------------------------------------------------------------------- */

.gsc-card {
	background: #fff;
	border-color: var(--border);
}

.gsc-card:hover {
	border-color: var(--burgundy-700);
	box-shadow: 0 16px 38px rgba(122, 16, 37, .13);
}

.gsc-card__media { background: #fff; }

.gsc-card__wish {
	background: rgba(255, 255, 255, .84);
	border-color: var(--border);
	color: var(--text);
}

.gsc-card__wish:hover { color: var(--burgundy-700); }
.gsc-card__price del { color: var(--muted); }

/* --------------------------------------------------------------------------
   Matrix
   -------------------------------------------------------------------------- */

.gsc-matrix { background: none; }

.gsc-matrix__cell {
	background: var(--surface);
	border-color: var(--border);
}
/* The watch is the subject of the tile, so it stays fully visible rather than
   being ghosted into the background. */
.gsc-matrix__img { opacity: 1; }

/* Flat wash confined to the lower half, so the burgundy sits behind the text
   and leaves the product above it untouched. */
.gsc-matrix__cell::before {
	background: linear-gradient(to top, var(--burgundy-800) 0%, var(--burgundy-800) 38%, rgba(101, 16, 32, 0) 82%);
}

/* On hover the lower band floods burgundy, so its text inverts to stay legible. */
.gsc-matrix__cell:hover .gsc-matrix__name { color: #fff; }
.gsc-matrix__cell:hover .gsc-matrix__count { color: rgba(255, 255, 255, .84); }
.gsc-matrix__cell:hover .gsc-matrix__img { opacity: 1; }

/* --------------------------------------------------------------------------
   Feature / statement / newsletter stay burgundy: they are the brand blocks
   that carry the colour quota on an otherwise white page.
   -------------------------------------------------------------------------- */

/* The panel moved onto the inner grid when the block became a rounded card,
   so the light theme repaints that element, not the outer section. */
.gsc-feature { background: none; }

.gsc-feature .gsc-feature__grid {
	background:
		radial-gradient(68% 88% at 78% 40%, rgba(158, 41, 64, .30), transparent 70%),
		var(--burgundy-900);
	box-shadow: 0 22px 54px rgba(74, 7, 22, .18);
}

.gsc-feature__body .gsc-label { color: var(--burgundy-300); }
.gsc-feature__title,
.gsc-feature__title a,
.gsc-feature__price { color: #fff; }
.gsc-feature__body .gsc-lede { color: rgba(255, 255, 255, .76); }
.gsc-feature__media img { filter: drop-shadow(0 28px 54px rgba(0, 0, 0, .44)); }

.gsc-feature .gsc-btn--primary {
	background: #fff;
	color: var(--burgundy-900);
	border-color: #fff;
}

.gsc-feature .gsc-btn--primary:hover {
	background: var(--burgundy-950);
	color: #fff;
	border-color: var(--burgundy-950);
}

.gsc-feature .gsc-btn--secondary {
	color: #fff;
	border-color: rgba(255, 255, 255, .42);
}

.gsc-feature .gsc-btn--secondary:hover {
	background: #fff;
	color: var(--burgundy-900);
	border-color: #fff;
}

.gsc-statement { background: none; }
.gsc-statement__in {
	background: var(--burgundy-700);
	box-shadow: 0 22px 54px rgba(122, 16, 37, .18);
}

.gsc-news { background: none; border-top: 0; }
.gsc-news__in {
	background: var(--burgundy-900);
	box-shadow: 0 22px 54px rgba(74, 7, 22, .18);
}
.gsc-news__in .gsc-label { color: var(--burgundy-300); }
.gsc-news__in .gsc-h2 { color: #fff; }
.gsc-news__in .gsc-lede { color: rgba(255, 255, 255, .78); }

.gsc-news__form input[type="email"] {
	background: rgba(255, 255, 255, .10);
	border-color: rgba(255, 255, 255, .28);
	color: #fff;
}

.gsc-news__form input[type="email"]::placeholder { color: rgba(255, 255, 255, .55); }

.gsc-news__form input[type="email"]:focus {
	border-color: #fff;
	background: rgba(255, 255, 255, .16);
}

.gsc-news .gsc-btn--primary {
	background: #fff;
	color: var(--burgundy-900);
	border-color: #fff;
}

.gsc-news .gsc-btn--primary:hover {
	background: var(--burgundy-950);
	color: #fff;
	border-color: var(--burgundy-950);
}

/* --------------------------------------------------------------------------
   Journal / quote / footer
   -------------------------------------------------------------------------- */

.gsc-art__media { background: var(--surface-2); }
.gsc-art__media::after { background: linear-gradient(to top, rgba(74, 7, 22, .58), transparent 58%); }

.gsc-quote__mark { color: var(--burgundy-700); }
.gsc-stars { color: var(--gold); }

.gsc-ft {
	background: var(--surface);
	border-top-color: var(--border);
}

.gsc-ft__list a:hover,
.gsc-ft__addr a:hover,
.gsc-ft__legal a:hover { color: var(--burgundy-700); }

/* --------------------------------------------------------------------------
   Utility surfaces
   -------------------------------------------------------------------------- */

.gsc-search { background: rgba(255, 255, 255, .97); }
.gsc-search__form input { color: var(--text); }
.gsc-search__form input::placeholder { color: rgba(107, 90, 94, .5); }

.gsc-toast {
	background: #fff;
	border-color: var(--burgundy-700);
	color: var(--text);
	box-shadow: 0 18px 44px rgba(23, 9, 13, .16);
}

.gsc-toast svg { stroke: var(--burgundy-700); }

.gsc-loader { background: var(--bg); }
.gsc-loader__logo { color: var(--text); }
.gsc-loader__fill { background: var(--burgundy-700); }

.gsc-rail__track { scrollbar-color: var(--burgundy-700) var(--border); }
.gsc-rail__btn { border-color: var(--border-strong); color: var(--text); }
.gsc-rail__btn:hover:not(:disabled) { background: var(--burgundy-700); border-color: var(--burgundy-700); color: #fff; }

.gsc-empty { border-color: var(--border-strong); }

.gsc-cursor { mix-blend-mode: normal; background: var(--burgundy-700); }
.gsc-cursor.is-lg { background: rgba(122, 16, 37, .10); border-color: var(--burgundy-700); }
.gsc-cursor__txt { color: var(--burgundy-700); }

.gsc-body :focus-visible { outline-color: var(--burgundy-700); }
.gsc-skip { background: var(--burgundy-700); }

/* --------------------------------------------------------------------------
   WooCommerce surfaces — shop, product, cart, checkout, account.
   The inherited stylesheet squares these off; round them to match the new
   card system so the storefront and the home page look like one site.
   -------------------------------------------------------------------------- */

.woocommerce ul.products li.product,
.woocommerce div.product div.images img,
.woocommerce div.product .woocommerce-tabs,
.woocommerce-cart .cart-collaterals .cart_totals,
.woocommerce-checkout #order_review,
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
	border-radius: var(--r-md);
}

.woocommerce div.product div.images .flex-control-thumbs li img,
.woocommerce ul.products li.product img {
	border-radius: var(--r-inner);
}

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .button,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container--default .select2-selection--single {
	border-radius: var(--r-md);
}

.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale {
	border-radius: var(--r-sm);
}

/* Burgundy for the buttons WooCommerce paints in its own palette. */
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	background: var(--burgundy-700);
	color: #fff;
}

.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
	background: var(--burgundy-600);
	color: #fff;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	border-color: var(--burgundy-700);
	outline: none;
}

.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info {
	border-top-color: var(--burgundy-700);
}