/*
Theme Name: GEKUMI Shop Child
Description: Shared server-rendered reptile supplies presentation for WoodMart.
Version: 0.1.2
Template: woodmart
Text Domain: gekumi-shop-child
Domain Path: /languages
Requires PHP: 8.1
License: GPL-2.0-or-later
*/

:root {
	--gks-background: hsl(0 0% 5%);
	--gks-foreground: hsl(120 5% 93%);
	--gks-card: hsl(0 0% 8%);
	--gks-muted: hsl(0 0% 12%);
	--gks-border: hsl(0 0% 20%);
	--gks-subtle: hsl(0 0% 68%);
	--gks-primary: hsl(105 85% 42%);
	--gks-primary-foreground: hsl(0 0% 4%);
	--gks-radius: .75rem;
	--gks-width: 80rem;
	--gks-body-font: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
	--gks-heading-font: "Playfair Display", Georgia, serif;
	--gks-display-font: "Bebas Neue", Impact, sans-serif;
}

/* The parent owns global layout, navigation and native commerce components. */
.gks-home { background: var(--gks-background); color: var(--gks-foreground); font-family: var(--gks-body-font); line-height: 1.65; }
.gks-home, .gks-home *, .gks-home *::before, .gks-home *::after { box-sizing: border-box; }
.gks-home h1, .gks-home h2, .gks-home h3 { color: var(--gks-foreground); line-height: 1.2; overflow-wrap: anywhere; }
.gks-home h2 { font-family: var(--gks-heading-font); font-size: clamp(1.75rem, 3.5vw, 2.5rem); }
.gks-home a { color: var(--gks-primary); text-underline-offset: .22em; }
.gks-home a:hover { color: var(--gks-foreground); }
.gks-home :is(a, button, input, select, textarea, summary):focus-visible, .gks-language-list a:focus-visible { outline: 3px solid var(--gks-primary); outline-offset: 4px; }
.gks-home img { max-width: 100%; height: auto; }
.gks-home .button { display: inline-flex; align-items: center; justify-content: center; min-height: 2.75rem; border: 1px solid transparent; border-radius: var(--gks-radius); padding: .65rem 1.15rem; background: var(--gks-primary); color: var(--gks-primary-foreground); font-weight: 650; text-decoration: none; }
.gks-home .button:hover { background: var(--gks-foreground); color: var(--gks-primary-foreground); }
.gks-home .button.disabled { cursor: not-allowed; opacity: .65; }
.gks-home .gks-shell { width: min(100% - 3rem, var(--gks-width)); margin-inline: auto; }
.gks-home .gks-unavailable { padding-block: clamp(2rem, 6vw, 5rem); }
.gks-home .gks-eyebrow { color: var(--gks-primary); font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.gks-home .gks-note { color: var(--gks-subtle); }
.gks-language-list { display: flex; align-items: center; flex-wrap: wrap; gap: .25rem 1rem; margin: 0; padding: 0; list-style: none; }
.gks-language-list a { display: inline-flex; align-items: center; min-height: 2.75rem; font-size: .9rem; }
.gks-language-list a[aria-current] { color: var(--gks-primary); text-decoration-thickness: 2px; }
.gks-home .gks-hero { position: relative; isolation: isolate; display: grid; align-items: center; min-height: min(42rem, 80svh); padding-block: clamp(4rem, 12vw, 8rem); overflow: clip; background: radial-gradient(ellipse at 80% 60%, hsl(105 85% 42% / .1), transparent 55%), var(--gks-background); }
.gks-home .gks-hero-image { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.gks-home .gks-hero-has-image::after { position: absolute; inset: 0; z-index: -1; content: ""; background: linear-gradient(90deg, hsl(0 0% 5% / .96), hsl(0 0% 5% / .6)), linear-gradient(0deg, var(--gks-background), transparent 50%); }
.gks-home .gks-hero-copy { max-width: 44rem; }
.gks-home .gks-hero h1 { margin-block: .5rem 1.25rem; font-family: var(--gks-display-font); font-size: clamp(2.75rem, 7vw, 6rem); font-weight: 400; letter-spacing: .02em; }
.gks-home .gks-hero-summary { max-width: 36rem; font-size: 1.1rem; }
.gks-home .gks-actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1.75rem; }
.gks-home .gks-actions .button { min-height: 3.5rem; padding-inline: 1.75rem; }
.gks-home .gks-section { padding-block: clamp(3rem, 6vw, 5rem); border-top: 1px solid var(--gks-border); }
.gks-home .gks-section:nth-of-type(even) { background: var(--gks-card); }
.gks-home .gks-section-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: 1.75rem; }
.gks-home .gks-section-header h2 { margin: 0; }
.gks-home .gks-category-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.gks-home .gks-category-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--gks-border); border-radius: 1rem; background: var(--gks-muted); color: var(--gks-foreground); text-decoration: none; }
.gks-home .gks-category-card img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.gks-home .gks-category-card span { padding: 1rem; overflow-wrap: anywhere; }
.gks-home .gks-category-card:hover { border-color: var(--gks-primary); color: var(--gks-primary); }
.gks-home .gks-editorial-content { max-width: 65rem; overflow-wrap: anywhere; }
.gks-home .gks-editorial-content > :last-child { margin-bottom: 0; }
.gks-home .gks-trade-panel { padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid var(--gks-border); border-radius: 1.5rem; background: linear-gradient(135deg, hsl(105 85% 42% / .09), transparent); }
@media (min-width: 48rem) { .gks-home .gks-category-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .gks-home .gks-shell { width: min(100% - 4rem, var(--gks-width)); } .gks-home .gks-category-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: no-preference) { .gks-home a, .gks-home .button, .gks-home .gks-category-card { transition: color .18s ease, background-color .18s ease, border-color .18s ease; } }
@media (forced-colors: active) { .gks-home .gks-category-card, .gks-home .gks-trade-panel { border-color: CanvasText; } }