/* ============================================================
   Gothaodien — Brand identity layer (BRAND-EXTRACT.txt)
   Colors + typography tokens only. Layout unchanged.
   ============================================================ */

:root {
	--gtd-brand-bg:      #FDF4F2;
	--gtd-brand-primary: #FBE9ED;
	--gtd-brand-neutral: #E5FCF2;
	--gtd-brand-accent:  #8F2C42;

	/* Opacity tints — brand guidelines */
	--gtd-brand-neutral-80: color-mix(in srgb, #E5FCF2 80%, #ffffff);
	--gtd-brand-neutral-60: color-mix(in srgb, #E5FCF2 60%, #ffffff);
	--gtd-brand-neutral-40: color-mix(in srgb, #E5FCF2 40%, #ffffff);
	--gtd-brand-bg-80:      color-mix(in srgb, #FDF4F2 80%, #ffffff);
	--gtd-brand-bg-60:      color-mix(in srgb, #FDF4F2 60%, #ffffff);
	--gtd-brand-bg-40:      color-mix(in srgb, #FDF4F2 40%, #ffffff);
	--gtd-brand-accent-80:  color-mix(in srgb, #8F2C42 80%, #ffffff);
	--gtd-brand-accent-40:  color-mix(in srgb, #8F2C42 40%, #ffffff);

	--gtd-primary:       var(--gtd-brand-accent);
	--gtd-primary-dk:    color-mix(in srgb, var(--gtd-brand-accent) 88%, #000000);
	--gtd-primary-lt:    var(--gtd-brand-primary);
	--gtd-primary-mid:   color-mix(in srgb, var(--gtd-brand-primary) 70%, #ffffff);
	--gtd-rose:          color-mix(in srgb, var(--gtd-brand-accent) 40%, #ffffff);
	--gtd-accent:        var(--gtd-brand-neutral);
	--gtd-accent-soft:   var(--gtd-brand-neutral-60);

	--gtd-cream:         var(--gtd-brand-bg);
	--gtd-sand:          var(--gtd-brand-primary);
	--gtd-border:        color-mix(in srgb, var(--gtd-brand-accent) 18%, transparent);
	--gtd-border-mid:    color-mix(in srgb, var(--gtd-brand-accent) 28%, transparent);

	--gtd-grad-primary:  var(--gtd-brand-accent);
	--gtd-topbar-bg:     var(--gtd-brand-accent);

	--gtd-font-head:     'Cormorant Garamond', 'Playfair Display', Georgia, serif;
	--gtd-font-body:     'DM Sans', system-ui, sans-serif;
	--gtd-font-accent:   'Josefin Sans', 'DM Sans', sans-serif;
}

body {
	background-color: var(--gtd-brand-bg);
	font-family: var(--gtd-font-body);
	letter-spacing: 0.016em;
}

/* Headings — Principal font (The Seasons → Cormorant Garamond) */
h1, h2, h3, h4,
.section-head__title,
.hero-slide__title,
.site-logo__name,
.site-footer__logo span:last-child {
	font-family: var(--gtd-font-head);
}

.site-logo__name,
.site-footer__logo span:last-child {
	color: var(--gtd-brand-accent);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-weight: 600;
}

.site-logo__sub {
	font-family: var(--gtd-font-accent);
	font-size: 10px;
	font-weight: 300;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

/* Labels & buttons — accent font */
.section-label,
.gtd-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .single_add_to_cart_button {
	font-family: var(--gtd-font-accent);
}

.gtd-btn--primary,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .single_add_to_cart_button {
	background: var(--gtd-brand-accent);
	background-image: none;
}

.gtd-btn--primary:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
	background: var(--gtd-primary-dk);
	background-image: none;
}

.section-label {
	color: var(--gtd-muted);
	letter-spacing: 0.2em;
	font-weight: 300;
}

/* Mint neutral (#E5FCF2) — subtle accents */
.category-nav {
	background: var(--gtd-white);
	border-bottom: 1px solid var(--gtd-border);
}

.category-nav__link:hover,
.category-nav__link:focus-visible {
	background: var(--gtd-brand-neutral-40);
}

.section-why-us {
	background: var(--gtd-brand-neutral-40);
}

.section-blog {
	background: linear-gradient(180deg, var(--gtd-brand-neutral-60) 0%, var(--gtd-brand-bg-80) 100%);
	padding-block: clamp(48px, 6vw, 72px);
	margin-top: 0;
}

.section-new-arrivals {
	background: var(--gtd-brand-neutral-40);
}

.contact-info__card {
	background: var(--gtd-white);
	border-color: color-mix(in srgb, var(--gtd-brand-neutral) 50%, var(--gtd-border));
}

.post-card__badge {
	background: var(--gtd-brand-neutral-80);
	color: var(--gtd-brand-accent);
}

.post-card__placeholder {
	background: var(--gtd-brand-neutral-40);
}

.why-us-card {
	background: color-mix(in srgb, var(--gtd-white) 72%, var(--gtd-brand-neutral-40));
	border-color: color-mix(in srgb, var(--gtd-brand-neutral) 35%, var(--gtd-border));
}

.entry-content blockquote {
	background: var(--gtd-brand-neutral-40);
	border-left-color: var(--gtd-brand-accent);
}

.gtd-page-loader {
	background: linear-gradient(135deg, var(--gtd-brand-bg) 0%, var(--gtd-brand-neutral-60) 55%, var(--gtd-brand-bg-80) 100%);
}

.gtd-page-loader__logo {
	display: block;
	width: 80px;
	height: 80px;
	object-fit: contain;
	animation: gtd-loader-pulse 1.2s ease-in-out infinite;
	filter: drop-shadow(0 10px 24px color-mix(in srgb, var(--gtd-brand-accent) 22%, transparent));
}

.gtd-logo-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--gtd-logo-size, 64px);
	height: var(--gtd-logo-size, 64px);
	flex-shrink: 0;
}

.gtd-logo-mark img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.site-logo .gtd-logo-mark {
	--gtd-logo-size: 72px;
}

@media (max-width: 767px) {
	.site-logo .gtd-logo-mark {
		--gtd-logo-size: 58px;
	}
}

/* About page — brand color scheme */
.about-hero {
	background: linear-gradient(135deg, var(--gtd-brand-bg) 0%, var(--gtd-brand-primary) 50%, var(--gtd-brand-neutral-60) 100%);
	color: var(--gtd-brand-accent);
}

.about-hero .section-label--light {
	color: color-mix(in srgb, var(--gtd-brand-accent) 70%, var(--gtd-white));
	opacity: 1;
	letter-spacing: 0.2em;
	font-weight: 500;
}

.about-hero__title {
	color: var(--gtd-brand-accent);
}

.about-hero__text {
	color: color-mix(in srgb, var(--gtd-brand-accent) 80%, var(--gtd-text));
	opacity: 1;
}

.about-hero__blob {
	background-image:
		linear-gradient(
			135deg,
			color-mix(in srgb, var(--gtd-brand-accent) 22%, transparent) 0%,
			color-mix(in srgb, var(--gtd-brand-primary) 18%, transparent) 100%
		),
		url('../images/vietnam-flag.svg');
	background-size: cover, cover;
	background-position: center, center;
	background-repeat: no-repeat;
	box-shadow:
		0 24px 48px color-mix(in srgb, var(--gtd-brand-accent) 16%, transparent),
		inset 0 0 0 1px color-mix(in srgb, var(--gtd-brand-accent) 12%, transparent);
}

.about-stats,
.about-values {
	background: var(--gtd-white);
}

.about-story,
.about-location {
	background: var(--gtd-brand-neutral-40);
}

/* Homepage journal — title directly under thumbnail */
.section-blog .post-card.gtd-reveal {
	opacity: 1;
	transform: none;
}

.section-blog .post-card--home {
	display: flex;
	flex-direction: column;
}

.section-blog .post-card__title--under-media {
	order: 2;
	margin: 0;
	padding: 14px 16px 0;
	font-size: 18px;
	line-height: 1.35;
	display: block;
	overflow: visible;
	-webkit-line-clamp: unset;
}

.section-blog .post-card--home .post-card__body {
	order: 3;
	padding-top: 10px;
}

.section-blog .post-card__title--under-media a {
	color: var(--gtd-brand-accent);
	font-weight: 700;
	text-decoration: none;
}

.section-blog .post-card__title--under-media a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.site-footer__logo {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

/* Thumbnail pastel overlay toggle (Customizer) */
.gtd-thumbnails-natural .product-card__media::after,
.gtd-thumbnails-natural .category-card__media::after,
.gtd-thumbnails-natural .post-card__media::after,
.gtd-thumbnails-natural .hero-slide__media::after {
	display: none;
}

.gtd-thumbnails-natural .product-card__image,
.gtd-thumbnails-natural .post-card__image,
.gtd-thumbnails-natural .category-card__media img,
.gtd-thumbnails-natural .hero-slide__media img {
	filter: none;
}

/* About story — photo blocks */
.about-story__img-block--1 {
	background-image: url('../images/about/about-story-1.jpg');
	background-size: cover;
	background-position: center;
	box-shadow: var(--gtd-shadow);
}

.about-story__img-block--2 {
	background-image:
		linear-gradient(color-mix(in srgb, var(--gtd-brand-accent) 42%, transparent), color-mix(in srgb, var(--gtd-brand-accent) 42%, transparent)),
		url('../images/about/about-story-2.jpg');
	background-size: cover;
	background-position: center;
}

.about-story__img-block--2::after {
	content: '"Made in Vietnam\AWorth the Journey"';
	color: var(--gtd-white);
	text-shadow: 0 2px 12px color-mix(in srgb, var(--gtd-brand-accent) 55%, transparent);
}
