/*
Theme Name:   Texas Wood Goods
Theme URI:    https://texaswoodgoods.com/
Description:  Child theme of Kadence for Texas Wood Goods. Switching it on keeps the site looking exactly the same — it carries over Kadence's header, footer, logo, menus and Customizer settings — and gives site changes a safe place to live, so Kadence updates never overwrite them.
Author:       bandflyer
Template:     kadence
Version:      2.2.0
Requires at least: 6.3
Requires PHP: 7.4
License:      GNU General Public License v2 or later
Text Domain:  texas-wood-goods
*/

/* Fonts for home page 4a (must stay above every rule) */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400&family=Jost:wght@200;300;400;500&family=IBM+Plex+Mono:wght@400&display=swap');

/* ==========================================================================
   Brand values
   Available to every page as CSS variables. They don't change anything on
   their own — use them in rules below, e.g. color: var(--twg-dark);
   ========================================================================== */
:root {
	--twg-dark: #1e1c18;
	--twg-charcoal: #2c2820;
	--twg-brown: #3d3830;
	--twg-warm-gray: #5a5248;
	--twg-muted: #8a7d6d;
	--twg-tan: #a09080;
	--twg-light-tan: #c4b8a8;
	--twg-cream: #e8e2da;
	--twg-off-white: #f5f3f0;
	--twg-white: #faf9f7;
}

/* ==========================================================================
   Mobile
   ========================================================================== */

/* Checkout: the "create an account" note is 11px in Kadence — too small to
   read on a phone. */
.woocommerce-checkout .create-account small,
.woocommerce-cart .checkout .create-account small {
	font-size: 12px;
}

/* ==========================================================================
   Site changes
   Add new rules below this line, with a short comment saying what each is for.
   ========================================================================== */

/* ==========================================================================
   Phones (up to 767px wide)
   From the live phone scan on 29 Sep 2026. Each rule notes what it fixes.
   ========================================================================== */
@media (max-width: 767px) {

	/* --- Whole site --------------------------------------------------- */

	/* Breadcrumb links (Home / Shop / …) were 16px tall — hard to hit. */
	.kadence-breadcrumb-container a {
		display: inline-block;
		padding: 12px 2px;
		margin: -12px 0;
	}

	/* Social icons were 36px. */
	.wp-block-social-links .wp-block-social-link-anchor {
		min-width: 44px;
		min-height: 44px;
		justify-content: center;
		align-items: center;
	}

	/* --- Homepage ----------------------------------------------------- */

	/* "On the bench / The Board Collection": the text ran right up against
	   the left edge of the screen. */
	.kb-row-layout-id1440_5c7b75-13 > .kt-row-column-wrap {
		padding-left: 16px;
		padding-right: 16px;
	}

	/* Product cards (homepage blocks): prices were 11px and "Add to cart"
	   10px — too small to read or tap. */
	.wc-block-grid__product .wc-block-grid__product-price,
	.wc-block-grid__product .wc-block-grid__product-price .amount {
		font-size: 15px;
	}
	.wc-block-grid .wc-block-grid__product .wp-block-button__link,
	.wc-block-grid .wc-block-grid__product .add_to_cart_button {
		font-size: 14px !important;
		min-height: 44px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	/* --- Shop and product pages ------------------------------------- */

	/* "Add to cart" buttons were 29px tall; product-name links 22px. */
	.woocommerce ul.products li.product .button,
	.woocommerce ul.products li.product .added_to_cart,
	.product-action-wrap .button,
	.product-action-wrap .added_to_cart {
		min-height: 44px !important;
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
	}
	.woocommerce ul.products li.product .woocommerce-loop-product__title a {
		display: inline-block;
		padding: 10px 0;
		margin: -10px 0;
	}

	/* Sort menu was 15px (iPhones zoom in on anything under 16px) and 30px tall. */
	.woocommerce-ordering select {
		font-size: 16px;
		min-height: 44px;
	}

	/* Quantity box and gallery zoom button were under 44px. */
	.woocommerce div.product form.cart .quantity .qty,
	.woocommerce div.product form.cart .quantity button {
		min-height: 44px;
		font-size: 16px;
	}
	.woocommerce div.product .woocommerce-product-gallery__trigger {
		width: 44px !important;
		height: 44px !important;
	}

	/* "Category:" line was 11.9px. */
	.woocommerce div.product .product_meta,
	.woocommerce div.product .product_meta > span,
	.woocommerce div.product .product_meta a {
		font-size: 14px !important;
	}
	.woocommerce div.product .product_meta a {
		display: inline-block;
		padding: 12px 0;
		margin: -12px 0;
	}

	/* Description / Reviews tabs were 40px tall. */
	.woocommerce div.product .woocommerce-tabs ul.tabs li a {
		min-height: 44px;
		display: flex;
		align-items: center;
	}

	/* My account: "Lost your password?" link was 19px tall. */
	.woocommerce form .password-input .show-password-input {
		min-width: 44px;
	}
	.woocommerce-LostPassword a {
		display: inline-block;
		padding: 12px 0;
		margin: -12px 0;
	}

	/* --- Cutting Board Designer -------------------------------------- */

	/* The title in the builder's top bar only had room for "Bu…" (and
	   vanished completely on smaller phones). The bar below already says
	   what to do, so hide it on phones and give the buttons the room. */
	.cbd-build-header > h2 {
		display: none;
	}
	.cbd-build-header {
		gap: 8px;
	}
	/* (The builder's own stylesheet uses !important here, so these must too.) */
	.cbd-build-header .cbd-build-header-actions .cbd-header-btn {
		font-size: 12px !important;
		min-height: 44px;
	}
	.cbd-build-close {
		min-width: 44px;
		justify-content: center;
	}

	/* The 3D preview was drawn 400px wide inside a narrower box, so its right
	   side was cut off and the board sat off-center. */
	#cbd-build-canvas-stage canvas {
		width: 100% !important;
		height: auto !important;
	}

	/* Zoom buttons were 74×54 each and covered a third of the preview. */
	.cbd-canvas-zoom-controls {
		gap: 6px;
	}
	.cbd-canvas-zoom-button {
		width: 44px;
		height: 44px;
		padding: 0;
		font-size: 20px;
	}

	/* The "Drag strips to reorder" and "Tap any strip…" hints ran off the
	   right edge of the screen. */
	#cbd-hint-drag-tooltip {
		max-width: calc(100% - 16px);
		white-space: normal;
		font-size: 12px;
	}
	#cbd-canvas-hint {
		left: 0 !important;
		right: 0 !important;
		width: auto !important;
		white-space: normal;
		font-size: 12px;
	}

	/* Text under 12px: strip tray, size chips and older builder labels. */
	.cbd-tray-title,
	#cbd-tray-meta,
	.cbd-size-chip span,
	.cbd-hover-preview-difficulty,
	.cbd-preview-help,
	.cbd-view-button,
	.cbd-palette-total-label,
	.cbd-palette-strip .cbd-hint-drag-badge,
	.cbd-header-btn--cancel,
	.cbd-build-palette-hint,
	.cbd-palette-strip-info strong {
		font-size: 12px;
	}

	/* Strip editing: wood swatches were 30px, move/remove buttons 28px. */
	#cbd-build-screen .cbd-tray-wood-opt,
	#cbd-build-screen .cbd-tray-btn {
		width: 40px !important;
		height: 40px !important;
	}

	/* Thickness menu (14px) and order notes (14.4px) made iPhones zoom in. */
	#cbd-build-thickness,
	#cbd-build-screen .cbd-control-group select,
	.cbd-control-group input,
	.cbd-control-group select,
	.cbd-form-group input,
	.cbd-form-group select,
	.cbd-form-group textarea,
	.cbd-account-field input,
	#cbd-order-notes {
		font-size: 16px !important;
	}
	#cbd-build-thickness {
		min-height: 44px;
	}

	/* Juice groove / rounded corners: make the whole line 44px tall to tap. */
	.cbd-feature-toggle {
		width: 20px;
		height: 20px;
	}
	label:has(> .cbd-feature-toggle) {
		min-height: 44px;
		align-items: center;
	}

	/* --- Frame Designer ---------------------------------------------- */

	/* Wall color dots (22px), mat color swatches (34px) and the mat on/off
	   switch (24px): keep the look, enlarge the area that responds to a tap. */
	.fd-app .fd-wall,
	.fd-app .fd-swatch,
	.fd-app .fd-toggle {
		position: relative;
	}
	.fd-app .fd-wall::after,
	.fd-app .fd-swatch::after,
	.fd-app .fd-toggle::after {
		content: "";
		position: absolute;
	}
	.fd-app .fd-wall::after {
		inset: -11px -3px;
	}
	.fd-app .fd-swatch::after {
		inset: -4px;
	}
	.fd-app .fd-toggle::after {
		inset: -10px -4px;
	}

	/* Text links ("Use a sample", "Change photo", "Set each side") were
	   about 20px tall. */
	.fd-app .fd-link {
		display: inline-block;
		padding: 12px 0 !important;
		margin: -12px 0 !important;
	}

	/* Flat/3D switch, Dimensions, size chips and the − / + buttons were
	   32–36px; bring them to 40px (they sit in tight rows). */
	.fd-app .fd-seg-btn,
	.fd-app .fd-chip,
	.fd-app .fd-step-btn {
		min-height: 40px;
	}
	.fd-app .fd-step-btn {
		min-width: 40px;
	}

	/* On shorter phones the pinned preview took half the screen while
	   choosing options; keep it to about a third. */
	@media (max-height: 800px) {
		.fd-app .fd-canvas-wrap {
			height: 30vh;
			min-height: 200px;
		}
	}
}



/* ==========================================================================
   Home page 4a — layout (from Claude Design export twg-home.css)
   ========================================================================== */

/* =========================================================
   TEXAS WOOD GOODS — home page 4a
   Paste into Appearance → Customize → Additional CSS
   (or Kadence → Custom CSS). Pairs with the block markup in
   kadence-blocks-home-4a.txt — every rule is keyed to a
   twg-* Advanced class set on a block.
   ========================================================= */

.twg-page { --ink:#1A1512; --bone:#F7F4EE; --sand:#EFEAE0; --line:#DFD8CB;
  --mid:#6B6459; --body:#4A443C; --brass:#A8811A; --gold:#C9A227; --walnut:#2E241D; }

/* ---------- type + resets inside the page ---------- */
.twg-page,
.twg-page p,
.twg-page .wp-block-heading { text-wrap:pretty; }
.twg-page .wp-block-heading { font-family:'Cormorant Garamond',Georgia,serif; font-weight:300;
  line-height:1.06; color:var(--ink); margin:0; }
.twg-page p { font-family:Jost,sans-serif; font-weight:300; color:var(--body); margin:0; }
.twg-page .wp-block-buttons { gap:16px; }
.twg-page .wp-block-columns { margin-bottom:0; }

/* eyebrow / small caps label */
.twg-eyebrow { font-family:Jost,sans-serif; font-size:11px !important; font-weight:400;
  letter-spacing:.3em; text-transform:uppercase; color:#8A8073 !important; }
.twg-eyebrow--gold { color:var(--gold) !important; font-weight:500; letter-spacing:.36em; }

/* buttons */
.twg-page .wp-block-button__link { font-family:Jost,sans-serif; font-size:12px; font-weight:400;
  letter-spacing:.24em; text-transform:uppercase; padding:18px 32px; border-radius:0; }
.twg-btn-dark .wp-block-button__link { background:var(--ink); color:var(--bone); }
.twg-btn-light .wp-block-button__link { background:#FBF8F1; color:var(--ink); }
.twg-btn-gold .wp-block-button__link { background:var(--gold); color:var(--walnut); }
.twg-btn-outline .wp-block-button__link { background:transparent; color:var(--ink);
  border:1px solid rgba(26,21,18,.4); padding:17px 31px; }
.twg-page .wp-block-button__link:hover { opacity:.85; }
/* underlined text link */
.twg-textlink a { font-family:Jost,sans-serif; font-size:12px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--ink); text-decoration:none;
  border-bottom:1px solid rgba(26,21,18,.35); padding-bottom:6px; }
.twg-textlink--onphoto a { color:#FBF8F1; border-color:rgba(251,248,241,.5); }
.twg-textlink--brass a { color:var(--brass); font-size:11px; letter-spacing:.26em;
  border-color:rgba(168,129,26,.5); }

/* ---------- 1. HERO (core Cover, table photo) ---------- */
.twg-hero { min-height:min(86vh,760px) !important; }
.twg-hero .wp-block-cover__inner-container { width:100%; max-width:1320px; margin:0 auto;
  padding:0 56px 12px; }
.twg-hero .wp-block-cover__image-background { object-position:center 34%; }
/* stronger, directional scrim than Cover's flat dim */
.twg-hero > .wp-block-cover__background { background:
  linear-gradient(96deg,rgba(16,11,8,.66) 0%,rgba(16,11,8,.14) 52%,rgba(16,11,8,0) 72%),
  linear-gradient(180deg,rgba(16,11,8,.60) 0%,rgba(16,11,8,.16) 34%,rgba(16,11,8,.34) 62%,rgba(16,11,8,.86) 100%) !important;
  opacity:1 !important; }
.twg-hero h1 { font-size:clamp(40px,5.6vw,82px) !important; line-height:1.0;
  letter-spacing:-.015em; color:#FBF8F1 !important; max-width:880px; text-wrap:balance; }
.twg-hero p { font-size:17px; line-height:1.7; color:#EFE7D8 !important; max-width:480px; }
.twg-hero .twg-eyebrow { color:#E3C168 !important; }
.twg-hero-stack { display:flex; flex-direction:column; gap:24px; align-items:flex-start; }
.twg-hero-cta { display:flex; flex-wrap:wrap; align-items:center; gap:28px; margin-top:10px; }
/* photo caption chip */
.twg-photo-tag { position:absolute; right:26px; top:120px; font-family:Jost,sans-serif;
  font-size:10px !important; font-weight:500; letter-spacing:.24em; text-transform:uppercase;
  color:var(--ink) !important; background:rgba(251,248,241,.92); padding:9px 13px; margin:0; }

/* ---------- section shells ---------- */
.twg-section { padding:104px 0 110px; }
.twg-section > .wp-block-group__inner-container,
.twg-section .twg-inner { max-width:1320px; margin:0 auto; padding:0 56px; }
.twg-bg-sand { background:var(--sand); }
.twg-bg-bone { background:var(--bone); }
.twg-bg-walnut { background:var(--walnut); }

/* ---------- 2. BOARD COLLECTION ---------- */
.twg-collection-head { display:flex; align-items:flex-end; justify-content:space-between;
  gap:32px; flex-wrap:wrap; }
.twg-collection-head .wp-block-heading { font-size:clamp(34px,4vw,52px) !important; margin-top:14px; }
.twg-collection-note { font-size:15px !important; line-height:1.75; color:var(--mid) !important;
  max-width:520px; margin:14px 0 42px !important; }
/* 4-up product grid from two core Columns rows */
.twg-grid { gap:20px !important; margin-bottom:26px !important; }
.twg-grid .wp-block-column { display:flex; flex-direction:column; gap:16px; }
.twg-card-img img { width:100%; aspect-ratio:4/3; object-fit:cover; background:#E4DCCD;
  transition:transform .6s ease; }
.twg-card-img { overflow:hidden; margin:0 !important; }
.twg-grid .wp-block-column:hover .twg-card-img img { transform:scale(1.03); }
.twg-card-name { font-family:'Cormorant Garamond',serif !important; font-size:24px !important;
  font-weight:400; line-height:1.15; color:var(--ink) !important; margin:0 !important; }
.twg-card-spec { font-size:13px !important; letter-spacing:.06em; color:var(--mid) !important;
  margin-top:6px !important; }
.twg-card-price { font-family:Jost,sans-serif; font-size:14px !important; font-weight:400;
  letter-spacing:.12em; color:var(--ink) !important; margin-top:8px !important; }

/* ---------- 3. MACRO EDGE-DETAIL BAND (core Cover) ---------- */
.twg-band { min-height:min(70vh,560px) !important; align-items:flex-end; }
.twg-band .wp-block-cover__image-background { object-position:center 28%; }
.twg-band > .wp-block-cover__background { background:linear-gradient(180deg,
  rgba(247,244,238,0) 0%,rgba(247,244,238,.06) 30%,rgba(247,244,238,.86) 50%,rgba(247,244,238,.97) 100%) !important;
  opacity:1 !important; }
.twg-band .wp-block-cover__inner-container { max-width:940px; margin:0 auto;
  padding:0 24px 70px; text-align:center; }
.twg-band .twg-eyebrow { color:var(--ink) !important; font-weight:500; letter-spacing:.34em; }
.twg-band .wp-block-heading { font-size:clamp(26px,3.4vw,44px) !important; line-height:1.24;
  margin-top:22px; }

/* ---------- 4. CUTTING BOARD DESIGNER ---------- */
.twg-designer .wp-block-heading { color:#FBF9F4 !important; font-size:clamp(32px,3.8vw,50px) !important;
  line-height:1.1; }
.twg-designer p { color:#C6BCAC !important; font-size:16px !important; line-height:1.75; max-width:400px; }
.twg-designer-copy { display:flex; flex-direction:column; align-items:flex-start; gap:22px; }
/* preset tiles: 6 groups in a 3-up grid */
.twg-presets { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.twg-presets .wp-block-column { flex-basis:auto !important; }
.twg-preset { background:#3A2E25; padding:16px; display:flex; flex-direction:column; gap:12px;
  transition:background .2s; }
.twg-preset:hover { background:#463830; }
.twg-preset-name { font-family:Jost,sans-serif; font-size:10px !important; letter-spacing:.18em;
  text-transform:uppercase; color:#B0A695 !important; margin:0 !important; }
.twg-swatch { height:58px; }
.twg-page .wp-block-spacer.twg-swatch { height:58px !important; margin:0; }
.twg-preset-new { border:1px dashed #6B5F52; }
.twg-preset-new .twg-swatch { background:repeating-linear-gradient(45deg,#2E241D 0 8px,#352A21 8px 16px);
  display:flex; align-items:center; justify-content:center; }
.twg-preset-new .twg-swatch::after { content:"+"; color:var(--gold); font-family:Jost,sans-serif;
  font-size:22px; font-weight:300; }
.twg-preset-new .twg-preset-name { color:var(--gold) !important; }
/* your real designer presets */
.twg-sw-river    { background:linear-gradient(90deg,#E8D4A8 0 29%,#4A3123 29% 64%,#E8D4A8 64% 100%); }
.twg-sw-cherrymaple { background:repeating-linear-gradient(90deg,#9E4634 0 16px,#E8D4A8 16px 30px); }
.twg-sw-triple   { background:linear-gradient(90deg,#4A3123 0 33%,#E8D4A8 33% 67%,#9E4634 67% 100%); }
.twg-sw-exotic   { background:linear-gradient(90deg,#E8D4A8 0 8%,#6B3FA0 8% 22%,#3E2A20 22% 26%,#6B3FA0 26% 40%,#E8D4A8 40% 48%,#6B3FA0 48% 62%,#3E2A20 62% 66%,#6B3FA0 66% 80%,#E8D4A8 80% 100%); }
.twg-sw-diamond  { background:linear-gradient(90deg,#3E2A20 0 14%,#E8D4A8 14% 22%,#9E4634 22% 38%,#3E2A20 38% 50%,#9E4634 50% 66%,#E8D4A8 66% 74%,#3E2A20 74% 100%); }

/* ---------- 5. WOOD LIBRARY ---------- */
.twg-wood-grid { gap:80px !important; }
.twg-wood-intro { display:flex; flex-direction:column; gap:18px; }
.twg-wood-intro .twg-eyebrow { border-top:1px solid var(--line); padding-top:18px; }
.twg-wood-intro p { font-size:15px !important; line-height:1.7; color:var(--mid) !important; }
.twg-species { gap:20px !important; }
.twg-species .wp-block-column { display:flex; flex-direction:column; gap:12px; }
.twg-species-crop { margin:0 !important; height:150px; overflow:hidden; background:#E4DCCD; }
.twg-species-crop img { width:100%; height:150px; object-fit:cover; transform:scale(2.4);
  transform-origin:45% 44%; }
.twg-species-name { font-family:'Cormorant Garamond',serif !important; font-size:22px !important;
  font-weight:400; color:var(--ink) !important; margin:0 !important; }
.twg-species p { font-size:13px !important; line-height:1.6; color:var(--mid) !important; }

/* ---------- 6. TABLES ---------- */
.twg-tables-grid { gap:72px !important; align-items:center; }
.twg-tables-img { margin:0 !important; }
.twg-tables-img img { width:100%; height:380px; object-fit:cover; object-position:center 60%;
  background:#E4DCCD; }
.twg-tables-copy { display:flex; flex-direction:column; align-items:flex-start; gap:20px; }
.twg-tables-copy .wp-block-heading { font-size:clamp(32px,3.6vw,46px) !important; line-height:1.08; }
.twg-tables-copy p { font-size:16px !important; line-height:1.75; max-width:400px; }

/* ---------- 7. CLOSING ---------- */
.twg-close { text-align:center; }
.twg-close .wp-block-heading { font-size:clamp(34px,4vw,52px) !important; line-height:1.12;
  max-width:700px; margin:0 auto !important; }
.twg-close p { font-size:16px !important; line-height:1.75; max-width:460px; margin:24px auto 0 !important; }
.twg-close .wp-block-buttons { justify-content:center; margin-top:32px; }

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .twg-section { padding:80px 0 84px; }
  .twg-section > .wp-block-group__inner-container,
  .twg-section .twg-inner { padding:0 32px; }
  .twg-hero .wp-block-cover__inner-container { padding:0 32px 12px; }
  .twg-photo-tag { display:none; }
  .twg-wood-grid { gap:36px !important; }
  .twg-tables-grid { gap:40px !important; }
}
@media (max-width:767px){
  .twg-section { padding:64px 0 68px; }
  .twg-section > .wp-block-group__inner-container,
  .twg-section .twg-inner { padding:0 22px; }
  .twg-hero { min-height:620px !important; }
  .twg-hero .wp-block-cover__inner-container { padding:0 22px 8px; }
  .twg-grid { gap:22px !important; }
  .twg-presets { grid-template-columns:1fr 1fr; }
  .twg-band { min-height:420px !important; }
  .twg-tables-img img { height:260px; }
}


/* ==========================================================================
   Home page 4a — type scale (from twg-type-scale.css)
   ========================================================================== */

/* =========================================================
   TEXAS WOOD GOODS — 4a TYPE SCALE
   Fonts + every font-size in the design, one rule per element.
   Drop into Kadence → Custom CSS (works alongside twg-home.css).
   ========================================================= */

400&family=Jost:wght@200;300;400;500&family=IBM+Plex+Mono:wght@400&display=swap');

/* ---------- display / headings — Cormorant Garamond 300 ---------- */

/* hero h1 — 82px */
.twg-hero h1 {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 300;
  font-size: clamp(40px, 5.6vw, 82px);
  line-height: 1.0;
  letter-spacing: -0.015em;
}

/* section headings: "The board collection", "Buy one, or have one made." — 52px */
.twg-collection-head .wp-block-heading,
.twg-close .wp-block-heading {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 300;
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1.12;
}

/* designer heading — 50px */
.twg-designer .wp-block-heading {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 300;
  font-size: clamp(32px, 3.8vw, 50px);
  line-height: 1.1;
}

/* tables heading — 46px */
.twg-tables-copy .wp-block-heading {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 300;
  font-size: clamp(32px, 3.6vw, 46px);
  line-height: 1.08;
}

/* detail-band statement — 44px */
.twg-band .wp-block-heading {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 300;
  font-size: clamp(26px, 3.4vw, 44px);
  line-height: 1.24;
}

/* product card names — 24px */
.twg-card-name {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.15;
}

/* wood-species names — 22px */
.twg-species-name {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.2;
}

/* ---------- body / UI — Jost ---------- */

/* hero paragraph — 17px */
.twg-hero p:not(.twg-eyebrow):not(.twg-photo-tag):not(.twg-textlink) {
  font-family: Jost, sans-serif;
  font-weight: 300;
  font-size: 17px;
  line-height: 1.7;
}

/* standard body copy: tables, closing — 16px */
.twg-tables-copy p:not(.twg-eyebrow):not(.twg-textlink),
.twg-close p,
.twg-designer p:not(.twg-eyebrow):not(.twg-preset-name) {
  font-family: Jost, sans-serif;
  font-weight: 300;
  font-size: 16px;
  line-height: 1.75;
}

/* secondary copy: collection note, wood-library intro — 15px */
.twg-collection-note,
.twg-wood-intro p:not(.twg-eyebrow) {
  font-family: Jost, sans-serif;
  font-weight: 300;
  font-size: 15px;
  line-height: 1.75;
}

/* card price — 14px */
.twg-card-price {
  font-family: Jost, sans-serif;
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 0.12em;
}

/* card spec line + species description — 13px */
.twg-card-spec,
.twg-species p:not(.twg-species-name) {
  font-family: Jost, sans-serif;
  font-weight: 300;
  font-size: 13px;
  line-height: 1.6;
  letter-spacing: 0.06em;
}

/* buttons + underlined text links — 12px */
.twg-page .wp-block-button__link,
.twg-textlink a {
  font-family: Jost, sans-serif;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}

/* eyebrows / small caps labels — 11px */
.twg-eyebrow {
  font-family: Jost, sans-serif;
  font-weight: 400;
  font-size: 11px;
  letter-spacing: 0.30em;
  text-transform: uppercase;
}
.twg-eyebrow--gold {           /* hero + designer variant */
  font-weight: 500;
  letter-spacing: 0.36em;
}
.twg-band .twg-eyebrow {
  font-weight: 500;
  letter-spacing: 0.34em;
}
.twg-textlink--brass a {       /* "Shop all boards" */
  font-size: 11px;
  letter-spacing: 0.26em;
}

/* photo caption chip + preset tile names — 10px */
.twg-photo-tag,
.twg-preset-name {
  font-family: Jost, sans-serif;
  font-weight: 500;
  font-size: 10px;
  text-transform: uppercase;
}
.twg-photo-tag  { letter-spacing: 0.24em; }
.twg-preset-name { letter-spacing: 0.18em; }

/* ---------- mono — IBM Plex Mono ---------- */

/* header wordmark — 12px */
.twg-wordmark {
  font-family: 'IBM Plex Mono', monospace;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

/* Home 4a — fixes for this site's Kadence setup
   (groups render an extra .wp-block-group__inner-container,
   and the theme capitalizes headings). */
.twg-page .wp-block-heading { text-transform: none; }
.twg-page.wp-block-group,
.twg-page > .wp-block-group__inner-container { margin: 0; padding: 0; max-width: none; }
.twg-presets.wp-block-group { display: block !important; }
.twg-presets > .wp-block-group__inner-container {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
@media (max-width: 767px) {
  .twg-presets > .wp-block-group__inner-container { grid-template-columns: 1fr 1fr; }
}

/* sections butt up against each other — no theme block gap */
.twg-page > .wp-block-group__inner-container > * { margin-top: 0 !important; margin-bottom: 0 !important; }
/* photo caption sits bottom-right of the hero, clear of the headline */
.twg-hero .twg-photo-tag { top: auto; bottom: 14px; right: 56px; }
/* preset names are links to the designer but read as labels */
.twg-preset-name a { color: inherit; text-decoration: none; }
