/*
Theme Name: Little Wonders
Theme URI: https://galileoandfriends.com
Author: Galileo & Friends
Author URI: https://galileoandfriends.com
Description: Galileo & Friends — quiet-luxury unisex atelier storefront. Built for WooCommerce.
Version: 4.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: little-wonders
Tags: e-commerce, woocommerce, atelier, minimal, editorial
*/

/* ========================================================================
   RESET + TOKENS
   ======================================================================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --canvas: #F6F4F0;
    --paper: #ECE8E0;
    --paper-2: #E2DCD0;
    --ink: #111111;
    --ink-2: #2B2B2B;
    --ink-3: #6B6B66;
    --ink-4: #A8A49C;
    --hairline: rgba(17,17,17,0.12);
    --hairline-strong: rgba(17,17,17,0.28);
    --accent: oklch(0.72 0.10 75);
    --accent-ink: oklch(0.42 0.08 75);
    --footer-bg: #161614;
    --footer-heading: #f0ece3;
    --footer-body: #c9c4b9;
    --footer-muted: #8c8880;

    --serif: "Cormorant Garamond", "EB Garamond", Georgia, serif;
    --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

    --wrap: 1440px;
    --wrap-narrow: 1200px;
    --pad-x: 48px;
    --header-h: 96px;

    --ease: cubic-bezier(.2,.8,.2,1);
    --dur: 220ms;
}

html { -webkit-text-size-adjust: 100%; }
body {
    font-family: var(--sans);
    background: var(--canvas);
    color: var(--ink);
    font-size: 14px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; padding: 0; }
input, select, textarea { font-family: inherit; }
svg { display: inline-block; }
hr { border: 0; border-top: 1px solid var(--hairline); margin: 0; }

/* ========================================================================
   TYPOGRAPHY
   ======================================================================== */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--serif);
    font-weight: 400;
    letter-spacing: -0.01em;
    color: var(--ink);
    line-height: 1.1;
    text-wrap: pretty;
}
h1 { font-size: clamp(2.6rem, 6.5vw, 5.25rem); line-height: 0.95; }
h2 { font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.02; }
h3 { font-size: clamp(1.4rem, 2.4vw, 2rem); }
h4 { font-size: clamp(1.15rem, 1.6vw, 1.4rem); line-height: 1.2; }

p { color: var(--ink-2); line-height: 1.75; }
strong { color: var(--ink); font-weight: 500; }
em { font-style: italic; }

.mono { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; }
.eyebrow { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-3); display: inline-block; }
.serif { font-family: var(--serif); }
.italic { font-style: italic; }

.wrap, .container { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--pad-x); }
.wrap-narrow { max-width: var(--wrap-narrow); margin: 0 auto; padding: 0 var(--pad-x); }
.hairline { border: 0; border-top: 1px solid var(--hairline); margin: 0; }
.spacer-xs { height: 8px; } .spacer-sm { height: 16px; } .spacer { height: 32px; } .spacer-lg { height: 64px; } .spacer-xl { height: 120px; }
.row { display: flex; gap: 18px; align-items: center; }
.col { display: flex; flex-direction: column; gap: 12px; }
.fade-in { animation: gfFadeIn 320ms ease both; }
@keyframes gfFadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
[data-animate], [data-stagger] { opacity: 1; }

/* ========================================================================
   BUTTONS + LINKS
   ======================================================================== */
.btn, .btn-primary, .btn-secondary,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce .wc-proceed-to-checkout .checkout-button,
.woocommerce #payment #place_order,
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce #respond input#submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 28px;
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    border: 1px solid var(--ink);
    background: var(--ink);
    color: var(--canvas);
    border-radius: 0 !important;
    transition: background 160ms ease, color 160ms ease, opacity 160ms;
    cursor: pointer;
    text-align: center;
    line-height: 1;
    font-weight: 400;
    text-decoration: none;
    box-shadow: none !important;
}
.btn:hover, .btn-primary:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce .wc-proceed-to-checkout .checkout-button:hover,
.woocommerce #payment #place_order:hover,
.woocommerce div.product form.cart .single_add_to_cart_button:hover,
.woocommerce #respond input#submit:hover {
    background: transparent;
    color: var(--ink);
    transform: none;
}
.btn.ghost, .btn-secondary,
.woocommerce a.button.ghost {
    background: transparent;
    color: var(--ink);
}
.btn.ghost:hover, .btn-secondary:hover { background: var(--ink); color: var(--canvas); }
.btn.small, .btn-sm { padding: 10px 18px; font-size: 9.5px; }
.btn.lg, .btn-lg { padding: 20px 36px; }
.btn.block { display: flex; width: 100%; }
.btn:disabled { opacity: 0.4; cursor: not-allowed; }

.link-u {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--ink);
    padding-bottom: 2px;
    transition: opacity 160ms;
    cursor: pointer;
    color: var(--ink);
    text-decoration: none;
}
.link-u:hover { opacity: 0.6; }

/* ========================================================================
   FORM FIELDS
   ======================================================================== */
.field,
input[type="text"], input[type="email"], input[type="tel"],
input[type="password"], input[type="search"], input[type="number"],
input[type="url"], select, textarea {
    display: block;
    width: 100%;
    padding: 14px 16px;
    background: transparent;
    border: 1px solid var(--hairline-strong);
    border-radius: 0;
    font-family: var(--sans);
    font-size: 13px;
    color: var(--ink);
    outline: none;
    transition: border 160ms;
    line-height: 1.4;
    -webkit-appearance: none;
    appearance: none;
}
.field:focus,
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus,
input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus,
input[type="url"]:focus, select:focus, textarea:focus {
    border-color: var(--ink);
    box-shadow: none;
}
.field-label {
    display: block;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 8px;
}
select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 20 20' fill='none' stroke='%23111' stroke-width='1.25'%3E%3Cpath d='m5 7 5 5 5-5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 40px;
    cursor: pointer;
}
textarea { min-height: 120px; resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--ink-4); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--ink); width: 15px; height: 15px; margin-right: 8px; -webkit-appearance: auto; appearance: auto; }

/* ========================================================================
   PLACEHOLDERS (product imagery stand-ins)
   ======================================================================== */
.ph {
    position: relative;
    background: var(--paper);
    overflow: hidden;
    background-image: repeating-linear-gradient(35deg, rgba(17,17,17,0.035) 0 1px, transparent 1px 9px);
}
.ph::after {
    content: attr(data-label);
    position: absolute;
    left: 12px; bottom: 10px;
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(17,17,17,0.5);
}
.ph.dark { background-color: #1a1a18; background-image: repeating-linear-gradient(35deg, rgba(246,244,240,0.05) 0 1px, transparent 1px 9px); }
.ph.dark::after { color: rgba(246,244,240,0.55); }
.ph.warm { background-color: #d6c9b8; }
.ph.rose { background-color: #e4cfc2; }
.ph.olive { background-color: #8a8770; }
.ph.olive::after { color: rgba(255,255,255,0.6); }
.ph.sage { background-color: #b4b5a3; }
.ph.sand { background-color: #cfc2a8; }
.ph.ink { background-color: #2b2b2b; }
.ph.ink::after { color: rgba(246,244,240,0.55); }
.ph.terra { background-color: #c49173; }
.ph.bone { background-color: #ded4c3; }
.ph.navy { background-color: #2a3342; }
.ph.navy::after { color: rgba(246,244,240,0.55); }

/* ========================================================================
   HEADER
   ======================================================================== */
.hd {
    position: sticky; top: 0; z-index: 40;
    background: var(--canvas);
    border-bottom: 1px solid var(--hairline);
}
.announce {
    background: var(--ink); color: var(--canvas);
    text-align: center;
    padding: 8px 16px;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    line-height: 1.4;
}
.hd-inner {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: 22px var(--pad-x);
    gap: 24px;
    max-width: var(--wrap);
    margin: 0 auto;
}
.hd-nav { display: flex; gap: 34px; align-items: center; }
.hd-nav a, .hd-nav .menu-item > a {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink);
    padding: 6px 0;
    border-bottom: 1px solid transparent;
    transition: border 140ms;
    cursor: pointer;
    display: inline-block;
    text-decoration: none;
}
.hd-nav a:hover, .hd-nav a.active,
.hd-nav .menu-item.current-menu-item > a,
.hd-nav .menu-item.current-page-ancestor > a {
    border-color: var(--ink);
}
.hd-logo {
    font-family: var(--serif);
    font-size: 34px;
    letter-spacing: 0.02em;
    font-style: italic;
    cursor: pointer;
    text-align: center;
    line-height: 1;
    white-space: nowrap;
    color: var(--ink);
    text-decoration: none;
    display: inline-block;
}
.hd-logo sup {
    font-size: 10px;
    font-family: var(--mono);
    font-style: normal;
    letter-spacing: 0.2em;
    vertical-align: super;
    margin-left: 6px;
    color: var(--ink-3);
    top: -0.7em;
    position: relative;
}
.hd-tools {
    display: flex;
    gap: 22px;
    justify-content: flex-end;
    align-items: center;
}
.hd-tool {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    color: var(--ink);
    transition: color 160ms;
    position: relative;
    background: transparent;
    border: none;
    padding: 0;
    text-decoration: none;
}
.hd-tool .mono { color: var(--ink-3); transition: color 160ms; }
.hd-tool:hover .mono { color: var(--ink); }
.hd-tool svg { flex-shrink: 0; }
.hd-cart-count, .cart-count {
    background: var(--ink);
    color: var(--canvas);
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: 0.05em;
    min-width: 18px;
    height: 18px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
    margin-left: 4px;
    line-height: 1;
    position: static;
    top: auto;
    right: auto;
}

/* Mobile menu toggle */
.menu-toggle {
    display: none;
    width: 36px;
    height: 36px;
    position: relative;
    cursor: pointer;
    background: transparent;
    border: none;
    padding: 0;
}
.menu-toggle span {
    display: block;
    width: 20px;
    height: 1px;
    background: var(--ink);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    transition: all 180ms ease;
}
.menu-toggle span:nth-child(1) { top: 12px; }
.menu-toggle span:nth-child(2) { top: 18px; }
.menu-toggle span:nth-child(3) { top: 24px; }
.menu-toggle.active span:nth-child(1) { top: 18px; transform: translateX(-50%) rotate(45deg); }
.menu-toggle.active span:nth-child(2) { opacity: 0; }
.menu-toggle.active span:nth-child(3) { top: 18px; transform: translateX(-50%) rotate(-45deg); }

/* ========================================================================
   FOOTER
   ======================================================================== */
.ft {
    background: var(--footer-bg);
    color: var(--footer-body);
    padding: 80px var(--pad-x) 32px;
    margin-top: 120px;
}
.ft-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.2fr;
    gap: 60px;
    max-width: var(--wrap);
    margin: 0 auto;
}
.ft h4 {
    color: var(--footer-heading);
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    margin-bottom: 22px;
    font-weight: 400;
    line-height: 1.4;
}
.ft-brand {
    font-family: var(--serif);
    font-style: italic;
    font-size: 42px;
    color: var(--footer-heading);
    margin-bottom: 18px;
    line-height: 1;
    display: inline-block;
}
.ft a {
    color: var(--footer-body);
    display: block;
    padding: 6px 0;
    font-size: 13px;
    transition: color 160ms;
    cursor: pointer;
    text-decoration: none;
}
.ft a:hover { color: var(--footer-heading); }
.ft p {
    color: var(--footer-body);
    max-width: 320px;
    line-height: 1.7;
    font-size: 13px;
    margin-bottom: 12px;
}
.ft-address {
    font-size: 12px;
    color: var(--footer-muted);
    line-height: 1.7;
    margin-top: 8px;
}
.ft-gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 4px;
}
.ft-gallery .ph { aspect-ratio: 1; }
.ft-socials { display: flex; gap: 14px; color: var(--footer-body); margin-top: 20px; }
.ft-socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--footer-body);
    padding: 0;
    width: auto;
    height: auto;
    background: transparent;
}
.ft-socials a:hover { color: var(--footer-heading); background: transparent; }
.ft-socials svg { width: 16px; height: 16px; fill: currentColor; }
.ft-base {
    max-width: var(--wrap);
    margin: 60px auto 0;
    padding-top: 28px;
    border-top: 1px solid rgba(255,255,255,0.08);
    display: flex;
    justify-content: space-between;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--footer-muted);
    gap: 24px;
    flex-wrap: wrap;
}

/* ========================================================================
   HOMEPAGE
   ======================================================================== */
.page { min-height: 60vh; }

.hero {
    position: relative;
    background: var(--paper);
}
.hero-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr 1.1fr;
    min-height: 640px;
}
.hero .ph { height: 100%; width: 100%; }
.hero-copy {
    padding: 100px 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: var(--paper);
}
.hero-copy h1 {
    font-size: clamp(3rem, 6.5vw, 96px);
    line-height: 0.92;
    font-style: italic;
    margin: 0;
    color: var(--ink);
}
.hero-copy p {
    color: var(--ink-3);
    max-width: 320px;
    margin: 24px auto 36px;
    font-size: 14px;
    line-height: 1.7;
}
.chevron-dots {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-top: 48px;
}
.chevron-dots span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--ink-4);
    cursor: pointer;
    display: inline-block;
    transition: background 160ms;
}
.chevron-dots span.on { background: var(--ink); }

.home-section { padding: 100px var(--pad-x); max-width: var(--wrap); margin: 0 auto; }
.home-section-narrow { padding: 60px var(--pad-x); }
.section-center { text-align: center; }
.section-center p { color: var(--ink-3); max-width: 480px; margin: 18px auto 0; }

.cat-tiles { max-width: var(--wrap); margin: 0 auto; padding: 100px var(--pad-x) 60px; }
.cat-tiles-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.cat-tile { text-align: center; cursor: pointer; display: block; text-decoration: none; color: var(--ink); }
.cat-tile .ph, .cat-tile .cat-img { aspect-ratio: 1; width: 100%; object-fit: cover; }
.cat-tile h4 {
    font-family: var(--serif);
    font-style: italic;
    font-size: 26px;
    margin-top: 20px;
    color: var(--ink);
    font-weight: 400;
}
.cat-tile .mono { color: var(--ink-3); margin-top: 8px; display: block; text-transform: uppercase; }

.landed { max-width: var(--wrap); margin: 0 auto; padding: 60px var(--pad-x); }
.landed-header { text-align: center; margin-bottom: 56px; }
.landed-header h2 { font-style: italic; margin-top: 12px; }
.landed-header p { color: var(--ink-3); max-width: 480px; margin: 18px auto 0; }
.landed-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.landed-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; row-gap: 56px; }
.landed-cta { text-align: center; margin-top: 56px; }

.quote-band { background: var(--paper); margin: 80px 0; padding: 100px var(--pad-x); }
.quote-band-inner {
    max-width: var(--wrap-narrow);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.4fr 1fr;
    gap: 60px;
    align-items: center;
}
.quote-band-inner .ph { aspect-ratio: 3/4; }
.quote-band blockquote {
    font-family: var(--serif);
    font-style: italic;
    font-size: clamp(1.8rem, 3.5vw, 52px);
    line-height: 1.08;
    color: var(--ink);
    letter-spacing: -0.01em;
    text-align: center;
    text-wrap: pretty;
    margin: 0;
    border: none;
    padding: 0;
}
.quote-band-attr {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    text-align: center;
    margin-top: 32px;
    display: block;
}

.two-up { max-width: var(--wrap); margin: 0 auto; padding: 20px var(--pad-x) 100px; }
.two-up-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.two-up-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: var(--paper);
    min-height: 340px;
}
.two-up-card .ph { height: 100%; }
.two-up-copy {
    padding: 48px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.two-up-num {
    font-family: var(--serif);
    font-size: 64px;
    font-style: italic;
    margin-top: 16px;
    line-height: 1;
    color: var(--ink);
}
.two-up-title {
    margin-top: 18px;
    font-size: 28px;
    font-style: italic;
    font-family: var(--serif);
    color: var(--ink);
    font-weight: 400;
}
.two-up-desc { color: var(--ink-3); margin-top: 12px; font-size: 14px; }

.marquee {
    overflow: hidden;
    white-space: nowrap;
    border-top: 1px solid var(--hairline);
    border-bottom: 1px solid var(--hairline);
    padding: 18px 0;
}
.marquee-track { display: inline-flex; gap: 60px; animation: gfScroll 40s linear infinite; }
.marquee-item {
    font-family: var(--serif);
    font-style: italic;
    font-size: clamp(1.4rem, 2.6vw, 38px);
    color: var(--ink-2);
    display: inline-block;
}
.marquee-item .sep { color: var(--accent-ink); margin: 0 18px; }
@keyframes gfScroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.services { max-width: var(--wrap); margin: 0 auto; padding: 100px var(--pad-x); }
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 80px; text-align: center; }
.service-icon-wrap { display: flex; justify-content: center; margin-bottom: 20px; color: var(--ink); }
.service-title { font-style: italic; font-size: 22px; font-family: var(--serif); color: var(--ink); font-weight: 400; }
.service-desc { color: var(--ink-3); margin-top: 12px; max-width: 260px; margin-left: auto; margin-right: auto; font-size: 14px; }

.newsletter-band {
    background: var(--ink);
    color: var(--canvas);
    padding: 100px var(--pad-x);
    text-align: center;
}
.newsletter-band .eyebrow { color: rgba(246,244,240,0.6); }
.newsletter-band h2 { font-style: italic; color: var(--canvas); margin-top: 16px; }
.newsletter-form {
    display: flex;
    max-width: 520px;
    margin: 40px auto 0;
    gap: 0;
    background: transparent;
    border: none;
    padding: 0;
    border-radius: 0;
}
.newsletter-form input[type="email"] {
    flex: 1;
    padding: 14px 16px;
    background: transparent;
    color: var(--canvas);
    border: 1px solid rgba(246,244,240,0.3);
    border-right: none;
    font-size: 13px;
    border-radius: 0;
}
.newsletter-form input[type="email"]::placeholder { color: rgba(246,244,240,0.4); }
.newsletter-form input[type="email"]:focus { border-color: var(--canvas); }
.newsletter-form button {
    padding: 14px 32px;
    background: var(--canvas);
    color: var(--ink);
    border: 1px solid var(--canvas);
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    cursor: pointer;
    border-radius: 0;
    transition: opacity 160ms;
}
.newsletter-form button:hover { opacity: 0.85; background: var(--canvas); color: var(--ink); }

/* ========================================================================
   PRODUCT CARD
   ======================================================================== */
.pcard, .lw-card {
    position: relative;
    cursor: pointer;
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: visible;
    display: flex;
    flex-direction: column;
    box-shadow: none;
    transition: none;
}
.pcard:hover, .lw-card:hover { transform: none; box-shadow: none; }
.lw-card__link { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.pcard-img, .lw-card__figure {
    aspect-ratio: 3/4;
    position: relative;
    background: var(--paper);
    overflow: hidden;
    margin: 0;
    display: block;
}
/* Product-card body link (title + price row) — inherit color, no underline */
.lw-card__body-link,
.lw-card__image-link {
    text-decoration: none !important;
    color: inherit !important;
    display: block !important;
}
.lw-card__image-link {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    z-index: 1;
}

/* Force every descendant (img / picture / anchor wrapper) to fill the 3/4
 * frame with cover — handles cases where the image lands inside <a><picture><img>
 * or where srcset delivers an image narrower than the frame. */
.pcard-img, .lw-card__figure,
li.product .woocommerce-LoopProduct-link,
.wc-block-grid__product-image,
.wp-block-woocommerce-product-image {
    aspect-ratio: 3/4 !important;
    position: relative !important;
    overflow: hidden !important;
    display: block !important;
    background: var(--paper) !important;
}
/* Only stretch the image + its wrapping anchor / picture to fill the frame.
 * Do NOT touch badges, wishlist button, or quickview overlay — those keep
 * their own dimensions and z-index. */
.lw-card__image-link,
.pcard-img > picture,
.lw-card__figure > picture,
.pcard-img > img,
.lw-card__figure > img,
.lw-card__image-link > img,
.lw-card__image-link > picture,
.lw-card__image-link > picture > img,
.lw-card__img,
li.product .woocommerce-LoopProduct-link,
li.product .woocommerce-LoopProduct-link img,
.wc-block-grid__product-image img,
.wp-block-woocommerce-product-image img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
    display: block !important;
    max-width: 100% !important;
    max-height: 100% !important;
    aspect-ratio: auto !important;
    transition: transform 320ms;
    border-radius: 0 !important;
}
/* Hover-swap alt image still needs to be positioned normally */
.pcard-img .alt { z-index: 2; }
.pcard-img .alt {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 320ms;
}
.pcard:hover .pcard-img .alt { opacity: 1; }
.lw-card:hover .lw-card__img { transform: scale(1.04); }
.lw-card__placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: var(--ink-4); background: var(--paper); }

.pcard .pill, .lw-card__badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: var(--ink);
    color: var(--canvas);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    z-index: 2;
    line-height: 1;
    text-align: center;
    padding: 4px;
    left: auto;
    box-shadow: none;
}
.pcard .pill.accent, .lw-card__badge--new { background: var(--accent); color: var(--ink); }
.lw-card__badge--out { background: var(--ink-3); }
.lw-card__badge--sale { background: var(--ink); color: var(--canvas); }

.pcard .wish, .lw-card__wish {
    position: absolute;
    top: 12px;
    left: 12px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(246,244,240,0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 180ms;
    z-index: 3;
    color: var(--ink);
    border: none;
    cursor: pointer;
}
.pcard:hover .wish, .lw-card:hover .lw-card__wish { opacity: 1; }
.pcard .wish.on, .lw-card__wish.on { opacity: 1; color: var(--accent-ink); }

.pcard .quickview, .lw-card__quickview, .lw-card__foot {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(246,244,240,0.94);
    padding: 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 220ms ease, transform 220ms ease;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 2;
}
.pcard:hover .quickview, .lw-card:hover .lw-card__quickview, .lw-card:hover .lw-card__foot {
    opacity: 1;
    transform: translateY(0);
}
.pcard .quickview button, .lw-card__quickview button, .lw-card__quickview a,
.lw-card__atc, .lw-card__foot .lw-card__atc {
    font-family: var(--mono);
    font-size: 9.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ink) !important;
    padding: 0;
    background: transparent !important;
    border: none !important;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    box-shadow: none !important;
    font-weight: 400;
    width: auto;
    justify-content: flex-start;
    border-radius: 0 !important;
}
.pcard .quickview button:hover, .lw-card__quickview button:hover, .lw-card__quickview a:hover,
.lw-card__atc:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
    background: transparent !important;
    color: var(--ink) !important;
}

.pcard-body, .lw-card__body {
    padding-top: 18px;
    text-align: center;
    display: block;
    flex: none;
}
.pcard-title, .lw-card__name, .lw-card .woocommerce-loop-product__title {
    font-family: var(--serif);
    font-size: 19px;
    letter-spacing: 0.02em;
    color: var(--ink) !important;
    font-weight: 400;
    line-height: 1.3;
    margin: 0;
    padding: 0;
    display: block;
    text-transform: none;
    -webkit-line-clamp: unset;
    overflow: visible;
}
.pcard-price, .lw-card__price, .lw-card .price {
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.14em;
    color: var(--ink-3) !important;
    margin-top: 6px;
    text-transform: none;
    display: block;
    font-weight: 400;
}
.pcard-price s, .lw-card__price s, .lw-card .price del {
    color: var(--ink-4) !important;
    margin-right: 8px;
    text-decoration: line-through;
    font-weight: 400;
    font-size: inherit;
}
.lw-card .price ins { text-decoration: none; color: var(--ink) !important; font-weight: 400; }
.lw-card__cat {
    display: none;
}

/* ========================================================================
   WOOCOMMERCE — SHOP ARCHIVE (PLP)
   ======================================================================== */
.shop-breadcrumb-bar {
    border-bottom: 1px solid var(--hairline);
    padding: 28px var(--pad-x);
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: var(--wrap);
    margin: 0 auto;
}
.shop-breadcrumb-bar .mono { color: var(--ink-3); }
.crumbs {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}
.crumbs a { cursor: pointer; color: var(--ink-3); text-decoration: none; }
.crumbs a:hover { color: var(--ink); }
.crumbs .sep { color: var(--ink-4); }

.shop-header {
    text-align: center;
    padding: 56px var(--pad-x) 20px;
    max-width: var(--wrap);
    margin: 0 auto;
}
.shop-header h1 { font-size: clamp(2.6rem, 5vw, 72px); font-style: italic; }
.shop-header p { color: var(--ink-3); max-width: 520px; margin: 20px auto 0; }

.shop-body {
    max-width: var(--wrap);
    margin: 0 auto;
    padding: 40px var(--pad-x) 80px;
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 56px;
    align-items: start;
    background: transparent;
    min-height: 0;
    position: static;
}
.filters { width: 100%; }
.filter-section { padding: 24px 0; border-bottom: 1px solid var(--hairline); }
.filter-section:first-child { padding-top: 0; }
.filter-section h5 {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin: 0 0 16px;
    font-weight: 400;
    color: var(--ink);
}
.filter-list { display: flex; flex-direction: column; gap: 10px; }
.filter-list label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12.5px;
    cursor: pointer;
    color: var(--ink-2);
}
.filter-list label span:last-child { color: var(--ink-4); font-family: var(--mono); font-size: 10px; }
.filter-list a { color: var(--ink-3); display: flex; justify-content: space-between; width: 100%; padding: 4px 0; text-decoration: none; }
.filter-list a:hover, .filter-list a.active { color: var(--ink); }
.filter-list a .count { font-family: var(--mono); font-size: 10px; color: var(--ink-4); }
.filter-section input[type="range"] { width: 100%; accent-color: var(--ink); }

.shop-main { min-width: 0; }
.shop-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
    gap: 16px;
    flex-wrap: wrap;
    padding: 0;
    border: none;
    background: transparent;
}
.shop-toolbar .mono, .shop-toolbar .woocommerce-result-count {
    color: var(--ink-3);
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin: 0;
    padding: 0;
}
.shop-toolbar .woocommerce-ordering { margin: 0; padding: 0; }
.shop-toolbar select {
    background-color: transparent;
    border: 1px solid var(--hairline-strong);
    padding: 10px 40px 10px 14px;
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ink);
    border-radius: 0;
    cursor: pointer;
    width: auto;
    min-width: 180px;
    box-shadow: none;
}
.shop-toolbar .row { gap: 12px; }

.lw-product-grid,
.woocommerce ul.products,
.woocommerce-page ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 32px !important;
    row-gap: 56px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}
.woocommerce ul.products li.product,
.lw-product-grid > li {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: block;
    animation: gfFadeIn 320ms ease both;
}
.woocommerce ul.products li.product::before, .woocommerce ul.products li.product::after { display: none; }

/* Pagination */
.pager, .woocommerce nav.woocommerce-pagination ul {
    display: flex !important;
    justify-content: center;
    gap: 8px;
    align-items: center;
    margin: 60px auto 0 !important;
    padding: 0 !important;
    border: none !important;
    list-style: none;
    flex-direction: row;
}
.pager button, .pager a,
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--mono);
    font-size: 11px;
    border: 1px solid transparent !important;
    color: var(--ink) !important;
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0;
    line-height: 1;
    margin: 0 !important;
    text-decoration: none;
    box-shadow: none !important;
    transform: none !important;
}
.pager button.on, .pager a.on,
.woocommerce nav.woocommerce-pagination ul li span.current {
    border-color: var(--ink) !important;
}
.pager button:hover:not(.on),
.woocommerce nav.woocommerce-pagination ul li a:hover {
    background: var(--paper) !important;
    color: var(--ink) !important;
    border-color: transparent !important;
}
.woocommerce nav.woocommerce-pagination ul li { border: none !important; float: none !important; }

.shop-empty { padding: 80px 0; text-align: center; color: var(--ink-3); background: transparent; }
.shop-empty h3, .shop-empty h2 { font-style: italic; font-family: var(--serif); font-weight: 400; color: var(--ink); }
.shop-empty__visual, .shop-hero__shapes, .shop-hero__wave, .shop-body__dots,
.shop-body__blobs, .shop-cats, .shop-subcats, .shop-toolbar__views,
.hero-image-wrap, .hero-float-product, .announcement-bar,
.trust-ticker, .hero-cloud, .wave-bottom, .wave-top,
.section-tag { display: none !important; }

/* ========================================================================
   WOOCOMMERCE — SINGLE PRODUCT (PDP)
   ======================================================================== */
.single-product-wrap { padding-bottom: 60px; }
.single-product-wrap .container { padding: 0; max-width: none; }
.single-product-wrap .page-content { padding: 0; }

.woocommerce div.product {
    display: grid !important;
    grid-template-columns: 110px 1fr 1fr !important;
    gap: 40px !important;
    align-items: start;
    max-width: var(--wrap);
    margin: 0 auto;
    padding: 40px var(--pad-x);
    background: transparent;
    position: relative;
}
/* ─────────────────────────────────────────────────────────────────────
   PDP GALLERY — Editorial vertical stack (Prada / The Row / Toteme pattern)
   Each image renders as its own full-frame 3:4 shot, stacked vertically in
   the main column with subtle spacing. The info panel on the right stays
   sticky so the customer can add to bag at any scroll position. No JS
   dependency; if flexslider ever initialises it takes over automatically.
   ───────────────────────────────────────────────────────────────────── */
.woocommerce div.product .woocommerce-product-gallery,
.woocommerce div.product div.images {
    grid-column: 2;
    width: 100% !important;
    float: none !important;
    background: transparent !important;
    border-radius: 0 !important;
    margin: 0 !important;
    position: relative !important;
    display: block !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
}

/* Hide the WC default zoom trigger — it renders as a bare unicode glyph
 * when JS doesn't run. Cursor-based zoom-in affordance replaces it. */
.woocommerce-product-gallery__trigger,
.woocommerce div.product .woocommerce-product-gallery__trigger,
a.woocommerce-product-gallery__trigger,
.woocommerce-product-gallery--with-images .woocommerce-product-gallery__trigger {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    position: absolute !important;
    left: -9999px !important;
    width: 0 !important;
    height: 0 !important;
    pointer-events: none !important;
}

/* Hide WooCommerce flexslider's DEFAULT thumbnail nav — we render our own
 * primary+thumbnails layout inside .woocommerce-product-gallery__wrapper.
 * The default .flex-control-thumbs stacks all thumbs at full width, giving
 * a 3000+px vertical column of duplicates. */
.woocommerce div.product .flex-control-nav,
.woocommerce div.product .flex-control-thumbs,
.woocommerce-product-gallery .flex-control-nav,
.woocommerce-product-gallery .flex-control-thumbs,
.woocommerce-product-gallery--with-images .flex-control-thumbs {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* GALLERY WRAPPER — primary image + horizontal thumbnail strip below.
 * First child = large primary (spans full width, 3:4).
 * Rest = 120×160 (3:4) thumbnails auto-flowing horizontally in one row.
 * main.js promotes a clicked thumbnail to primary by DOM reordering. */
.woocommerce-product-gallery__wrapper,
div.product div.images .woocommerce-product-gallery__wrapper {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, 120px) !important;
    grid-auto-rows: min-content !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    overflow: visible !important;
    aspect-ratio: auto !important;
    max-height: none !important;
    justify-content: start;
    align-items: start;
    padding-top: 12px !important;
}

/* PRIMARY (first image) — full width, 3:4 */
.woocommerce-product-gallery .woocommerce-product-gallery__image:first-child,
div.product div.images .woocommerce-product-gallery__image:first-child {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    aspect-ratio: 3/4 !important;
    max-height: none !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    background: var(--paper) !important;
    position: relative !important;
    overflow: hidden !important;
    display: block !important;
    animation: gfFadeIn 320ms ease both;
}

/* THUMBS (2nd image onward) — 120×160 (3:4) tiles in a horizontal row below */
.woocommerce-product-gallery .woocommerce-product-gallery__image:not(:first-child),
div.product div.images .woocommerce-product-gallery__image:not(:first-child) {
    aspect-ratio: 3/4 !important;
    width: 120px !important;
    max-width: 120px !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--paper) !important;
    position: relative !important;
    overflow: hidden !important;
    display: block !important;
    border: 1px solid var(--hairline);
    transition: border-color 160ms ease, transform 200ms ease, opacity 160ms ease;
    cursor: pointer;
    opacity: 1;
    animation: gfFadeIn 320ms ease both;
}
.woocommerce-product-gallery .woocommerce-product-gallery__image:not(:first-child):hover,
div.product div.images .woocommerce-product-gallery__image:not(:first-child):hover {
    border-color: var(--ink);
    transform: translateY(-2px);
    box-shadow: 0 2px 8px rgba(17,17,17,0.08);
}
.woocommerce-product-gallery__image:nth-child(2) { animation-delay: 60ms; }
.woocommerce-product-gallery__image:nth-child(3) { animation-delay: 90ms; }
.woocommerce-product-gallery__image:nth-child(4) { animation-delay: 120ms; }

/* Colour label overlay on each thumbnail (populated by main.js from the
 * product's variations data). Renders as a tiny mono label bottom-left. */
.lw-thumb-colour {
    position: absolute;
    left: 4px;
    bottom: 4px;
    z-index: 3;
    font-family: var(--mono);
    font-size: 8px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--canvas);
    background: rgba(17,17,17,0.75);
    padding: 2px 5px;
    line-height: 1.2;
    pointer-events: none;
    white-space: nowrap;
    max-width: calc(100% - 8px);
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Hide the colour label on the PRIMARY (it's shown as a real select already) */
.woocommerce-product-gallery__image:first-child .lw-thumb-colour {
    display: none;
}

.woocommerce-product-gallery .woocommerce-product-gallery__image > a,
div.product div.images .woocommerce-product-gallery__image > a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    position: absolute !important;
    inset: 0 !important;
}
.woocommerce-product-gallery .woocommerce-product-gallery__image:first-child > a {
    cursor: zoom-in;  /* primary: browser native zoom on click */
}
.woocommerce-product-gallery .woocommerce-product-gallery__image img,
div.product div.images .woocommerce-product-gallery__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
    display: block !important;
    background: var(--paper);
    aspect-ratio: auto !important;
    max-height: none !important;
    transition: transform 620ms cubic-bezier(.2,.8,.2,1);
}
.woocommerce-product-gallery__image:first-child:hover img {
    transform: scale(1.02);
}

/* flexslider wraps the gallery in .flex-viewport with an inline `height: NNNpx`
 * matching the primary image. That clips off our thumbnail row below. Force
 * height:auto + overflow:visible so the whole grid (primary + thumbnails)
 * is visible. */
.woocommerce div.product .woocommerce-product-gallery .flex-viewport,
.woocommerce-product-gallery .flex-viewport,
.flex-viewport {
    aspect-ratio: auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    background: transparent !important;
}
/* .flex-control-thumbs kept hidden; we use our own thumb grid inside the
 * wrapper. See the earlier hide rule that targets .flex-control-nav /
 * .flex-control-thumbs. */
/* Info panel sits in normal flow (no sticky) — prevents overlap with the
 * DESCRIPTION / ADDITIONAL INFO / REVIEWS tabs section below. The sticky
 * add-to-bag bar at the bottom of viewport (main.js) handles always-visible
 * add-to-cart affordance instead. */
.woocommerce div.product div.summary,
.woocommerce div.product .summary,
.woocommerce div.product .entry-summary {
    position: static !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
    align-self: start !important;
}
/* PDP main gallery image: force the WRAPPER to hold a 3/4 frame, then any
 * descendant image fills it edge-to-edge with cover. Fixes cases where the
 * source image is short/wide and would otherwise leave paper gaps. */
.woocommerce div.product .woocommerce-product-gallery__image,
.woocommerce div.product div.images .woocommerce-product-gallery__image,
.woocommerce div.product div.images figure,
.woocommerce div.product div.images > a,
.wc-block-components-product-image,
.wp-block-woocommerce-product-image-gallery,
.wc-block-product-image {
    aspect-ratio: 3/4 !important;
    width: 100% !important;
    overflow: hidden !important;
    background: var(--paper) !important;
    display: block !important;
    position: relative !important;
    border-radius: 0 !important;
}
.woocommerce div.product .woocommerce-product-gallery img,
.woocommerce div.product div.images img,
.woocommerce div.product div.images .woocommerce-product-gallery__image img,
.woocommerce div.product div.images picture,
.woocommerce div.product div.images picture img,
.wc-block-components-product-image img,
.wp-block-woocommerce-product-image-gallery img,
.wc-block-product-image img {
    border-radius: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
    background: var(--paper) !important;
    display: block !important;
    max-width: 100% !important;
    aspect-ratio: auto !important;   /* let the wrapper hold the ratio */
}
.woocommerce div.product div.summary,
.woocommerce div.product .summary {
    grid-column: 3;
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding-left: 16px;
}
/* Old flex-control-thumbs vertical column styles deleted — we hide the
 * whole .flex-control-thumbs above and render our own thumb grid inside
 * .woocommerce-product-gallery__wrapper. */

.woocommerce div.product .product_title,
.woocommerce div.product .summary h1.product_title {
    font-family: var(--serif);
    font-weight: 400;
    font-size: clamp(1.8rem, 3.5vw, 46px);
    line-height: 1.1;
    margin: 0 0 14px;
    color: var(--ink);
    letter-spacing: -0.01em;
}
.woocommerce div.product .summary::before {
    content: "SS26 · Atelier";
    display: block;
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 16px;
}
.woocommerce div.product p.price,
.woocommerce div.product .summary .price,
.woocommerce div.product span.price {
    font-family: var(--mono);
    font-size: 14px;
    letter-spacing: 0.1em;
    color: var(--ink);
    margin: 0 0 24px;
    padding: 0;
    text-transform: none;
    font-weight: 400;
}
.woocommerce div.product p.price del { color: var(--ink-4); margin-right: 10px; text-decoration: line-through; font-weight: 400; }
.woocommerce div.product p.price ins { text-decoration: none; color: var(--ink); font-weight: 400; }

.woocommerce div.product .woocommerce-product-details__short-description {
    color: var(--ink-2);
    font-size: 14px;
    line-height: 1.75;
    margin: 24px 0;
}

.woocommerce div.product form.cart {
    margin: 32px 0 24px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.woocommerce div.product form.cart .variations {
    width: 100% !important;
    margin: 0 !important;
}
.woocommerce div.product form.cart .variations tr,
.woocommerce div.product form.cart .variations tbody,
.woocommerce div.product form.cart .variations thead { display: block; }
.woocommerce div.product form.cart .variations td,
.woocommerce div.product form.cart .variations th {
    padding: 6px 0 !important;
    border: none !important;
    background: transparent !important;
    display: block;
    width: 100%;
}
.woocommerce div.product form.cart .variations label {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 8px;
    display: block;
    font-weight: 400;
}
.woocommerce div.product form.cart .variations select {
    width: 100%;
    padding: 12px 40px 12px 14px;
    background-color: transparent;
    border: 1px solid var(--hairline-strong);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.14em;
    color: var(--ink);
    border-radius: 0;
    text-transform: uppercase;
    cursor: pointer;
}
.woocommerce div.product form.cart .reset_variations {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--ink-3);
    display: inline-block;
    margin-top: 8px;
    border-bottom: 1px solid var(--hairline);
    padding-bottom: 2px;
}

.woocommerce div.product form.cart .quantity {
    display: inline-flex;
    align-items: stretch;
    border: 1px solid var(--hairline-strong);
    margin-right: 12px;
}
.woocommerce div.product form.cart .qty {
    width: 60px !important;
    height: 44px !important;
    border: none !important;
    border-radius: 0 !important;
    text-align: center;
    background: transparent !important;
    font-family: var(--mono) !important;
    font-size: 12px !important;
    color: var(--ink) !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.woocommerce div.product form.cart .single_add_to_cart_button {
    padding: 18px 32px;
    min-height: 56px;
    flex: 1;
    display: inline-flex;
}

.pdp-perks {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    font-size: 12px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid var(--hairline);
}
.pdp-perk {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--ink-3);
    font-family: var(--sans);
    font-size: 12px;
    text-transform: none;
    letter-spacing: 0;
}

.woocommerce div.product .product_meta {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--ink-3);
    border-top: 1px solid var(--hairline);
    padding-top: 24px;
    margin-top: 32px;
    line-height: 2;
}
.woocommerce div.product .product_meta > span { display: block; }
.woocommerce div.product .product_meta a { color: var(--ink-3); text-decoration: none; }
.woocommerce div.product .product_meta a:hover { color: var(--ink); }

/* PDP tabs */
.woocommerce div.product .woocommerce-tabs {
    grid-column: 1 / -1 !important;
    max-width: var(--wrap-narrow);
    margin: 80px auto 0 !important;
    padding: 0 var(--pad-x);
    width: 100%;
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
    display: flex;
    gap: 36px;
    border-bottom: 1px solid var(--hairline) !important;
    margin: 0 0 32px !important;
    padding: 0 !important;
    list-style: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-block;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    padding: 14px 0 !important;
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3) !important;
    border-bottom: 1px solid transparent;
    margin-bottom: -1px;
    display: inline-block;
    background: transparent !important;
    text-shadow: none !important;
    font-weight: 400 !important;
    text-decoration: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--ink) !important;
    border-color: var(--ink);
}
.woocommerce div.product .woocommerce-tabs .panel {
    padding: 32px 0 0 !important;
    color: var(--ink-2);
    background: transparent;
    margin: 0;
    line-height: 1.8;
}
.woocommerce div.product .woocommerce-tabs .panel h2 { display: none; }
.woocommerce div.product .woocommerce-tabs .panel p { line-height: 1.8; margin-bottom: 16px; }
.woocommerce-Reviews .commentlist { padding: 0; margin: 0; list-style: none; }
.woocommerce-Reviews #comments h2 { font-family: var(--serif); font-style: italic; font-weight: 400; display: block; }

/* Related products */
.woocommerce .related.products,
.woocommerce .upsells.products {
    grid-column: 1 / -1 !important;
    max-width: var(--wrap);
    margin: 40px auto 120px !important;
    padding: 0 var(--pad-x) !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    width: 100%;
    box-sizing: border-box;
}
.woocommerce .related.products > h2,
.woocommerce .upsells.products > h2 {
    font-family: var(--serif);
    font-style: italic;
    font-size: clamp(1.4rem, 2.6vw, 2rem);
    color: var(--ink);
    text-align: left;
    margin: 0 0 32px !important;
    font-weight: 400;
    letter-spacing: -0.01em;
}
.woocommerce .related.products ul.products,
.woocommerce .upsells.products ul.products {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 32px !important;
}

/* ========================================================================
   WOOCOMMERCE — CART
   ======================================================================== */
.woocommerce-cart .page-hero,
.woocommerce-cart .shop-hero { display: none; }

.woocommerce-cart .woocommerce {
    max-width: var(--wrap);
    margin: 0 auto;
    padding: 60px var(--pad-x) 120px;
}
.woocommerce-cart .woocommerce h1,
.cart-heading {
    font-size: clamp(3rem, 6vw, 84px);
    font-style: italic;
    font-family: var(--serif);
    color: var(--ink);
    margin-bottom: 10px;
    font-weight: 400;
}
.cart-meta {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 40px;
}

.woocommerce table.shop_table {
    border: none;
    border-radius: 0;
    background: transparent;
    margin: 0;
}
.woocommerce-cart table.cart {
    border-collapse: collapse;
    width: 100%;
}
.woocommerce-cart table.cart thead th {
    background: transparent !important;
    padding: 16px 8px !important;
    border-bottom: 1px solid var(--ink) !important;
    border-top: none !important;
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    font-weight: 400;
    text-align: left;
}
.woocommerce-cart table.cart td {
    padding: 24px 8px !important;
    border-top: 1px solid var(--hairline) !important;
    background: transparent !important;
    vertical-align: middle;
    color: var(--ink);
    font-size: 14px;
}
.woocommerce-cart table.cart td.product-thumbnail img {
    width: 100px !important;
    height: 133px;
    object-fit: cover;
    border-radius: 0;
    background: var(--paper);
}
.woocommerce-cart table.cart td.product-name a {
    font-family: var(--serif);
    font-size: 20px;
    color: var(--ink);
    font-weight: 400;
    line-height: 1.3;
    text-decoration: none;
}
.woocommerce-cart table.cart td.product-price,
.woocommerce-cart table.cart td.product-subtotal {
    font-family: var(--mono);
    font-size: 12px;
    color: var(--ink);
}
.woocommerce-cart table.cart td.product-quantity .quantity {
    display: inline-flex;
    border: 1px solid var(--hairline-strong);
}
.woocommerce-cart table.cart td.product-quantity input.qty {
    width: 56px !important;
    height: 40px !important;
    border: none !important;
    text-align: center;
    background: transparent;
    font-family: var(--mono);
    color: var(--ink);
}
.woocommerce-cart table.cart td.product-remove a.remove {
    color: var(--ink-3) !important;
    background: transparent !important;
    font-size: 20px;
    font-weight: 400;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    text-decoration: none;
}
.woocommerce-cart table.cart td.product-remove a.remove:hover { color: var(--ink) !important; background: transparent !important; }

.woocommerce-cart .actions,
.woocommerce-cart table.cart td.actions {
    padding: 32px 0 0 !important;
    background: transparent !important;
    border-top: none !important;
}
.woocommerce-cart .actions .coupon {
    display: flex;
    gap: 12px;
    align-items: stretch;
    float: none !important;
    padding: 0 !important;
}
.woocommerce-cart .actions .coupon input#coupon_code {
    width: 300px !important;
    max-width: 100%;
    padding: 14px 16px;
    background: transparent;
    border: 1px solid var(--hairline-strong);
    font-family: var(--sans);
    font-size: 13px;
    border-radius: 0;
    margin: 0;
}
.woocommerce-cart .actions .coupon .button { padding: 14px 24px; }
.woocommerce-cart .actions > .button { float: right; }

.woocommerce-cart .cart-collaterals {
    width: 100% !important;
    padding-top: 60px;
    display: block;
}
.woocommerce-cart .cart_totals {
    background: var(--paper);
    padding: 32px;
    border: none;
    border-radius: 0;
    max-width: 480px;
    margin-left: auto;
    width: 100% !important;
    float: none !important;
}
.woocommerce-cart .cart_totals h2 {
    font-family: var(--serif);
    font-style: italic;
    font-size: 22px;
    margin-bottom: 20px;
    color: var(--ink);
    font-weight: 400;
}
.woocommerce-cart .cart_totals table { border-collapse: collapse; width: 100%; }
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
    padding: 12px 0 !important;
    border-bottom: 1px solid var(--hairline) !important;
    background: transparent !important;
    color: var(--ink-2);
    font-size: 14px;
    border-top: none !important;
    font-family: var(--sans);
}
.woocommerce-cart .cart_totals table th { font-weight: 400; color: var(--ink-3); text-align: left; }
.woocommerce-cart .cart_totals table td { font-family: var(--mono); font-size: 12px; text-align: right; color: var(--ink); }
.woocommerce-cart .cart_totals .order-total th, .woocommerce-cart .cart_totals .order-total td {
    font-family: var(--serif);
    font-style: italic;
    font-size: 22px;
    padding: 18px 0 !important;
    border-bottom: none !important;
    color: var(--ink);
    text-align: left;
    font-weight: 400;
}
.woocommerce-cart .cart_totals .order-total td { text-align: right; }
.woocommerce-cart .wc-proceed-to-checkout { padding: 20px 0 0; }
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
    width: 100% !important;
    padding: 20px 24px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    background: var(--ink) !important;
    color: var(--canvas) !important;
    border: 1px solid var(--ink) !important;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
    background: transparent !important;
    color: var(--ink) !important;
}

.woocommerce .cart-empty {
    text-align: center;
    padding: 80px 0;
    color: var(--ink-3);
    font-family: var(--sans);
    font-size: 15px;
    background: transparent;
    border: none;
}
.woocommerce .return-to-shop { text-align: center; margin-top: 32px; }

/* ========================================================================
   WOOCOMMERCE — CHECKOUT
   ======================================================================== */
.woocommerce-checkout .shop-hero, .woocommerce-checkout .page-hero { display: none; }
.woocommerce-checkout .woocommerce {
    max-width: var(--wrap);
    margin: 0 auto;
    padding: 60px var(--pad-x) 120px;
}
.woocommerce-checkout h1 {
    font-family: var(--serif);
    font-style: italic;
    font-size: clamp(2.2rem, 5vw, 60px);
    margin-bottom: 32px;
    color: var(--ink);
    font-weight: 400;
}
.woocommerce form.checkout {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 0;
    align-items: start;
}
.woocommerce form.checkout #customer_details { grid-column: 1; padding-right: 60px; }
.woocommerce form.checkout #order_review_heading,
.woocommerce form.checkout #order_review { grid-column: 2; }
.woocommerce form.checkout #order_review_heading {
    font-family: var(--serif);
    font-style: italic;
    font-size: 22px;
    margin: 0;
    color: var(--ink);
    background: var(--paper);
    padding: 32px 32px 12px;
    font-weight: 400;
    border-bottom: 1px solid var(--hairline);
}
.woocommerce form.checkout #order_review { background: var(--paper); padding: 20px 32px 32px; margin: 0; }
.woocommerce-checkout #customer_details h3 {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin: 24px 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--hairline);
    font-weight: 400;
}
.woocommerce-checkout #customer_details h3:first-of-type { margin-top: 0; }

.woocommerce form .form-row {
    padding: 6px 0 !important;
    margin: 0 0 12px !important;
    display: block;
}
.woocommerce form .form-row label {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 8px;
    display: block;
    font-weight: 400;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
    width: 100% !important;
    padding: 14px 16px !important;
    background: transparent !important;
    border: 1px solid var(--hairline-strong) !important;
    border-radius: 0 !important;
    font-family: var(--sans) !important;
    font-size: 13px !important;
    color: var(--ink) !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    height: auto !important;
    margin: 0 !important;
}
.woocommerce .select2-container--default .select2-selection--single {
    border: 1px solid var(--hairline-strong) !important;
    border-radius: 0 !important;
    background: transparent !important;
    height: 46px !important;
    box-shadow: none !important;
}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow { top: 50%; transform: translateY(-50%); right: 8px; height: auto; }
.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 1.4 !important; padding: 14px 40px 14px 16px !important; color: var(--ink) !important; font-family: var(--sans); font-size: 13px; }
.woocommerce .select2-dropdown { border-radius: 0; border-color: var(--hairline-strong); }
.woocommerce form .form-row .required { color: var(--ink); }

.woocommerce-checkout table.shop_table {
    background: transparent !important;
    border: none !important;
    margin: 0;
    width: 100%;
}
.woocommerce-checkout table.shop_table th, .woocommerce-checkout table.shop_table td {
    padding: 12px 0 !important;
    border-bottom: 1px solid var(--hairline) !important;
    background: transparent !important;
    color: var(--ink-2);
    font-size: 13px;
    font-family: var(--sans);
    text-align: left;
}
.woocommerce-checkout table.shop_table th { font-weight: 400; color: var(--ink-3); }
.woocommerce-checkout table.shop_table td { font-family: var(--mono); font-size: 12px; text-align: right; color: var(--ink); }
.woocommerce-checkout table.shop_table .order-total th,
.woocommerce-checkout table.shop_table .order-total td {
    font-family: var(--serif);
    font-style: italic;
    font-size: 22px;
    padding: 18px 0 !important;
    color: var(--ink);
    border-bottom: none !important;
    font-weight: 400;
}
.woocommerce-checkout table.shop_table .order-total td { text-align: right; }

.woocommerce #payment {
    background: transparent !important;
    padding: 20px 0 !important;
    border-radius: 0 !important;
}
.woocommerce #payment ul.payment_methods {
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    list-style: none;
    margin: 0 !important;
}
.woocommerce #payment ul.payment_methods li {
    padding: 12px 0;
    border-bottom: 1px solid var(--hairline);
    background: transparent !important;
    list-style: none;
}
.woocommerce #payment ul.payment_methods li:last-child { border-bottom: none; }
.woocommerce #payment ul.payment_methods li label {
    font-family: var(--serif);
    font-size: 16px;
    color: var(--ink);
    font-weight: 400;
    margin-left: 6px;
    letter-spacing: 0;
    text-transform: none;
    display: inline;
}
.woocommerce #payment .payment_box {
    background: var(--canvas) !important;
    border-radius: 0 !important;
    padding: 16px !important;
    margin: 8px 0 !important;
    color: var(--ink-3);
    font-size: 13px;
    line-height: 1.6;
}
.woocommerce #payment .payment_box::before { display: none !important; }
.woocommerce #payment #place_order {
    width: 100%;
    padding: 20px !important;
    margin-top: 12px;
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    float: none !important;
}

.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-error,
.woocommerce-message, .woocommerce-error, .woocommerce-info {
    background: var(--paper) !important;
    border: none !important;
    border-radius: 0 !important;
    border-top: 1px solid var(--ink) !important;
    color: var(--ink) !important;
    padding: 16px 20px !important;
    font-size: 13px;
    font-family: var(--sans);
    box-shadow: none !important;
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { color: var(--ink) !important; }
.woocommerce-error { border-top-color: var(--accent-ink) !important; }

/* ========================================================================
   WOOCOMMERCE — MY ACCOUNT
   ======================================================================== */
.woocommerce-account .shop-hero, .woocommerce-account .page-hero { display: none; }
.woocommerce-account .woocommerce {
    max-width: var(--wrap);
    margin: 0 auto;
    padding: 60px var(--pad-x) 120px;
}
.woocommerce-account .woocommerce > h1 {
    font-family: var(--serif);
    font-style: italic;
    font-size: clamp(2.5rem, 5vw, 72px);
    color: var(--ink);
    font-weight: 400;
    margin-bottom: 32px;
}
.woocommerce-account .woocommerce h2,
.woocommerce-account .woocommerce h3 {
    font-family: var(--serif);
    font-style: italic;
    color: var(--ink);
    font-weight: 400;
    margin-bottom: 20px;
}
.woocommerce-account .woocommerce-MyAccount-navigation {
    width: 220px !important;
    float: left !important;
    margin-right: 60px !important;
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation li {
    display: block;
    padding: 0;
    border-bottom: 1px solid var(--hairline);
    margin: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
    display: block;
    padding: 12px 0;
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    transition: color 160ms;
    border: none;
    background: transparent;
    text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
    color: var(--ink);
    background: transparent;
    border: none;
}
.woocommerce-account .woocommerce-MyAccount-content {
    width: calc(100% - 280px) !important;
    float: left !important;
    padding: 0 !important;
    display: block;
}
.woocommerce-account .woocommerce::after { content: ""; display: table; clear: both; }

.woocommerce-account form.login,
.woocommerce-account form.register,
.woocommerce-account form.woocommerce-ResetPassword {
    border: 1px solid var(--hairline) !important;
    border-radius: 0 !important;
    padding: 40px !important;
    max-width: 480px;
    margin: 0 auto !important;
    background: transparent !important;
    box-shadow: none;
}
.woocommerce-account form.login h2,
.woocommerce-account form.register h2 { margin-bottom: 24px; font-size: 22px; }
.woocommerce-account .u-columns > .col-1, .woocommerce-account .u-columns > .col-2 {
    width: 100% !important;
    max-width: 480px;
    margin: 0 auto 40px !important;
    float: none !important;
}

/* Address blocks */
.woocommerce-account .woocommerce-Addresses .woocommerce-Address {
    border: 1px solid var(--hairline);
    padding: 24px;
    background: transparent;
}
.woocommerce-account .woocommerce-Addresses .woocommerce-Address header.title h3 {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    font-weight: 400;
    font-style: normal;
}

/* Order table */
.woocommerce-account .woocommerce-MyAccount-content table.my_account_orders {
    border-collapse: collapse;
    width: 100%;
}
.woocommerce-account .woocommerce-MyAccount-content table.my_account_orders th,
.woocommerce-account .woocommerce-MyAccount-content table.my_account_orders td {
    padding: 20px 8px !important;
    border-bottom: 1px solid var(--hairline) !important;
    background: transparent !important;
    text-align: left;
    font-family: var(--sans);
    font-size: 14px;
}
.woocommerce-account .woocommerce-MyAccount-content table.my_account_orders th {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    font-weight: 400;
    border-bottom-color: var(--ink) !important;
}
.woocommerce-account .woocommerce-MyAccount-content table.my_account_orders .woocommerce-orders-table__cell-order-number a,
.woocommerce-account .woocommerce-MyAccount-content table.my_account_orders .woocommerce-orders-table__cell-order-actions .button {
    font-family: var(--serif);
    font-size: 16px;
    font-weight: 400;
    color: var(--ink);
    text-decoration: none;
}

/* ========================================================================
   MISC PAGE TEMPLATES
   ======================================================================== */
.page-hero {
    background: transparent;
    padding: 100px var(--pad-x) 60px;
    text-align: center;
}
.page-hero h1 { color: var(--ink); font-style: italic; margin: 0 auto; max-width: 900px; font-weight: 400; }
.page-hero p { color: var(--ink-3); max-width: 560px; margin: 20px auto 0; }
.page-hero .section-tag, .page-hero .eyebrow {
    display: inline-block !important;
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 20px;
    font-weight: 400;
    background: transparent;
}
.page-content { padding: 40px var(--pad-x) 80px; max-width: var(--wrap); margin: 0 auto; }
.page-content-narrow { max-width: 800px; margin: 0 auto; }
.entry-content h2 { margin: 2rem 0 1rem; font-style: italic; font-weight: 400; }
.entry-content h3 { margin: 1.5rem 0 0.75rem; font-weight: 400; }
.entry-content p { margin-bottom: 1.25rem; }
.entry-content ul, .entry-content ol { margin: 0 0 1.5rem 1.5rem; color: var(--ink-2); }
.entry-content ul { list-style: disc; }
.entry-content ol { list-style: decimal; }
.entry-content li { margin-bottom: 0.4rem; line-height: 1.7; }
.entry-content a { color: var(--ink); border-bottom: 1px solid var(--hairline-strong); transition: border-color 160ms; }
.entry-content a:hover { border-color: var(--ink); }
.entry-content blockquote {
    border-left: 1px solid var(--ink);
    padding: 1rem 1.5rem;
    margin: 1.5rem 0;
    font-family: var(--serif);
    font-style: italic;
    font-size: 22px;
    color: var(--ink);
    background: transparent;
    border-radius: 0;
}
.entry-content table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; }
.entry-content th, .entry-content td { padding: 0.75rem 1rem; border: 1px solid var(--hairline); text-align: left; }
.entry-content th { background: var(--paper); font-weight: 400; font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-3); }
.entry-content strong { color: var(--ink); }

/* About page */
.about-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
    max-width: var(--wrap-narrow);
    margin: 0 auto;
    padding: 40px var(--pad-x) 80px;
}
.about-split .ph, .about-split .about-hero-img {
    aspect-ratio: 3/4;
    width: 100%;
    border-radius: 0;
    box-shadow: none;
    object-fit: cover;
}
.about-text-block p { font-size: 16px; line-height: 1.8; color: var(--ink-2); }
.about-text-block p + p { margin-top: 16px; color: var(--ink-3); font-size: 15px; }

.about-stats { background: var(--paper); padding: 100px var(--pad-x); }
.about-stats-inner {
    max-width: var(--wrap-narrow);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    text-align: center;
}
.about-stat-number {
    font-family: var(--serif);
    font-style: italic;
    font-size: clamp(2.5rem, 5vw, 72px);
    line-height: 1;
    color: var(--ink);
}
.about-stat-label {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-top: 14px;
    display: block;
}

.about-team { max-width: var(--wrap-narrow); margin: 0 auto; padding: 100px var(--pad-x); }
.about-team h2 { font-style: italic; margin-bottom: 32px; font-weight: 400; }
.about-team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; margin-top: 32px; }
.about-team-member .ph, .about-team-member img { aspect-ratio: 1; object-fit: cover; width: 100%; }
.about-team-name {
    font-family: var(--serif);
    font-size: 22px;
    font-style: italic;
    margin-top: 20px;
    color: var(--ink);
    font-weight: 400;
}
.about-team-role {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-top: 4px;
    display: block;
}

/* Contact page */
.contact-wrap {
    max-width: var(--wrap-narrow);
    margin: 0 auto;
    padding: 40px var(--pad-x) 120px;
}
.contact-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.contact-info .eyebrow { display: block; margin-bottom: 12px; }
.contact-info p { line-height: 1.9; color: var(--ink-2); font-size: 14px; margin-bottom: 32px; }
.contact-info p:last-child { color: var(--ink-3); margin-bottom: 0; }
.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.contact-form > .form-row-full { grid-column: 1 / -1; }
.contact-form button[type="submit"] { grid-column: 1 / -1; justify-self: start; margin-top: 8px; }

/* Lookbook */
.lookbook-hero { padding: 80px var(--pad-x) 40px; text-align: center; }
.lookbook-hero h1 { font-size: clamp(3rem, 7vw, 96px); font-style: italic; margin: 0 auto; }
.lookbook-hero p { color: var(--ink-3); max-width: 520px; margin: 24px auto 0; }
.lookbook-grid {
    max-width: var(--wrap);
    margin: 0 auto;
    padding: 40px var(--pad-x) 40px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: minmax(380px, auto);
    gap: 16px;
}
.lookbook-tile { position: relative; }
.lookbook-tile .ph { width: 100%; height: 100%; min-height: 380px; }
.lookbook-tile-1 { grid-column: 1 / span 2; grid-row: 1 / span 2; }
.lookbook-tile-2 { grid-column: 3 / span 1; grid-row: 1; }
.lookbook-tile-3 { grid-column: 3 / span 1; grid-row: 2; }
.lookbook-tile-4 { grid-column: 1 / span 1; grid-row: 3; }
.lookbook-tile-5 { grid-column: 2 / span 2; grid-row: 3 / span 2; }
.lookbook-tile-6 { grid-column: 1 / span 1; grid-row: 4; }
.lookbook-tile-7 { grid-column: 1 / span 3; grid-row: 5; }
.lookbook-cta { text-align: center; padding: 40px var(--pad-x) 120px; }

/* 404 */
.error-404-section {
    max-width: var(--wrap-narrow);
    margin: 0 auto;
    padding: 120px var(--pad-x);
    text-align: center;
    background: transparent !important;
    min-height: auto;
    display: block;
}
.error-404-number {
    font-family: var(--serif);
    font-style: italic;
    font-size: clamp(6rem, 14vw, 200px);
    line-height: 1;
    color: var(--ink-4);
    margin-bottom: 20px;
    letter-spacing: -0.03em;
    font-weight: 400;
    background: transparent !important;
}
.error-404-content h1 { color: var(--ink); font-style: italic; margin-top: 20px; font-weight: 400; }
.error-404-content p { color: var(--ink-3); max-width: 440px; margin: 20px auto 0; }
.error-404-actions {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 40px;
}
.error-404-actions .btn-secondary { color: var(--ink); border-color: var(--ink); background: transparent; }
.error-404-actions .btn-secondary:hover { background: var(--ink); color: var(--canvas); }

/* ========================================================================
   MODALS + DRAWER + TOAST + STICKY ATC
   ======================================================================== */
.drawer-scrim {
    position: fixed;
    inset: 0;
    background: rgba(17,17,17,0.45);
    z-index: 60;
    opacity: 0;
    pointer-events: none;
    transition: opacity 220ms;
}
.drawer-scrim.on { opacity: 1; pointer-events: auto; }
.drawer {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    width: 460px;
    max-width: 100vw;
    background: var(--canvas);
    z-index: 70;
    transform: translateX(100%);
    transition: transform 300ms var(--ease);
    display: flex;
    flex-direction: column;
}
.drawer.on { transform: translateX(0); }
.drawer-hd {
    padding: 24px 28px;
    border-bottom: 1px solid var(--hairline);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.drawer-hd .drawer-title {
    font-family: var(--serif);
    font-style: italic;
    font-size: 22px;
    color: var(--ink);
    font-weight: 400;
}
.drawer-hd .drawer-count {
    color: var(--ink-3);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.2em;
    margin-left: 10px;
}
.drawer-close {
    color: var(--ink);
    padding: 8px;
    cursor: pointer;
    background: transparent;
    border: none;
}
.drawer-body { flex: 1; overflow-y: auto; padding: 8px 28px; }
.drawer-line {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 16px;
    padding: 18px 0;
    border-bottom: 1px solid var(--hairline);
}
.drawer-line .ph, .drawer-line img { aspect-ratio: 3/4; width: 90px; object-fit: cover; }
.drawer-line-body { display: flex; flex-direction: column; gap: 10px; }
.drawer-line-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.drawer-line-name { font-family: var(--serif); font-size: 17px; color: var(--ink); }
.drawer-line-meta { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); margin-top: 4px; }
.drawer-line-price { font-family: var(--mono); font-size: 12px; color: var(--ink); }
.drawer-line-bottom { display: flex; justify-content: space-between; align-items: center; }
.drawer-line-remove {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink-3);
    border-bottom: 1px solid var(--hairline-strong);
    padding-bottom: 2px;
    cursor: pointer;
    background: transparent;
    border-top: none;
    border-left: none;
    border-right: none;
}
.drawer-ft { padding: 24px 28px; border-top: 1px solid var(--hairline); background: var(--paper); }
.drawer-ft-row { display: flex; justify-content: space-between; margin-bottom: 8px; align-items: center; }
.drawer-ft-row .mono { color: var(--ink); }
.drawer-ft .caveat {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 20px;
}
.drawer-empty { padding: 60px 0; text-align: center; }
.drawer-empty .eyebrow { display: block; margin-bottom: 16px; }
.drawer-empty p { color: var(--ink-3); font-size: 13px; margin-bottom: 24px; }

.qty {
    display: inline-flex;
    border: 1px solid var(--hairline-strong);
    align-items: stretch;
}
.qty button {
    width: 40px;
    height: 44px;
    font-family: var(--mono);
    font-size: 14px;
    color: var(--ink);
    background: transparent;
    border: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 140ms;
}
.qty button:hover { background: var(--ink); color: var(--canvas); }
.qty input {
    width: 48px;
    height: 44px;
    text-align: center;
    border: none !important;
    background: transparent !important;
    font-family: var(--mono);
    font-size: 12px;
    padding: 0 !important;
    outline: none;
    color: var(--ink);
}

/* Modal */
.modal-scrim {
    position: fixed;
    inset: 0;
    background: rgba(17,17,17,0.55);
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 220ms;
    padding: 40px;
}
.modal-scrim.on { opacity: 1; pointer-events: auto; }
.modal {
    background: var(--canvas);
    max-width: 1040px;
    width: 100%;
    max-height: 86vh;
    overflow: hidden;
    position: relative;
    transform: translateY(20px);
    transition: transform 280ms var(--ease);
    display: flex;
}
.modal-scrim.on .modal { transform: translateY(0); }
.modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--canvas);
    border: 1px solid var(--hairline);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    cursor: pointer;
    color: var(--ink);
    padding: 0;
}
.modal-close:hover { background: var(--ink); color: var(--canvas); }

/* Search overlay */
.search-overlay {
    position: fixed;
    inset: 0;
    background: rgba(17,17,17,0.55);
    z-index: 85;
    opacity: 0;
    pointer-events: none;
    transition: opacity 220ms;
    overflow-y: auto;
}
.search-overlay.on { opacity: 1; pointer-events: auto; }
.search-panel {
    background: var(--canvas);
    max-height: 80vh;
    overflow-y: auto;
    position: relative;
    transform: translateY(-10px);
    transition: transform 260ms var(--ease);
    min-height: 320px;
}
.search-overlay.on .search-panel { transform: translateY(0); }
.search-input-wrap {
    padding: 36px 48px;
    border-bottom: 1px solid var(--hairline);
    display: flex;
    align-items: center;
    gap: 18px;
}
.search-input-wrap input {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-family: var(--serif);
    font-style: italic;
    font-size: 28px;
    color: var(--ink);
    padding: 0;
}
.search-input-wrap input::placeholder { color: var(--ink-4); font-style: italic; }
.search-input-wrap .close-btn {
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ink);
    border-bottom: 1px solid var(--ink);
    padding-bottom: 2px;
    cursor: pointer;
    background: transparent;
    border-top: none;
    border-left: none;
    border-right: none;
}
.search-content { padding: 28px 48px; }
.search-suggestions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.search-results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 16px; }
.search-result-item { cursor: pointer; text-decoration: none; color: var(--ink); display: block; }
.search-result-item img { width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--paper); }
.search-result-item .name { margin-top: 10px; font-family: var(--serif); font-size: 16px; }
.search-result-item .price { font-family: var(--mono); font-size: 11px; color: var(--ink-3); margin-top: 4px; }
.search-empty { color: var(--ink-3); font-size: 14px; }

/* Size chips */
.size-chip {
    min-width: 48px;
    height: 44px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--hairline-strong);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ink);
    background: transparent;
    cursor: pointer;
    transition: all 140ms;
    border-radius: 0;
}
.size-chip:hover { border-color: var(--ink); }
.size-chip.on { background: var(--ink); color: var(--canvas); border-color: var(--ink); }
.size-chip.out { color: var(--ink-4); border-color: var(--hairline); cursor: not-allowed; text-decoration: line-through; }

/* Sticky ATC bar (PDP) */
.atc-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 50;
    background: var(--canvas);
    border-top: 1px solid var(--hairline);
    padding: 14px var(--pad-x);
    display: flex;
    align-items: center;
    gap: 24px;
    transform: translateY(100%);
    transition: transform 280ms var(--ease);
}
.atc-bar.on { transform: translateY(0); }
.atc-bar .ph, .atc-bar img { width: 48px; aspect-ratio: 3/4; object-fit: cover; }
.atc-bar-info { flex: 1; min-width: 0; }
.atc-bar-name { font-family: var(--serif); font-size: 18px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.atc-bar-meta { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); margin-top: 4px; }

/* Toast */
.toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: var(--ink);
    color: var(--canvas);
    padding: 14px 24px;
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    opacity: 0;
    transition: all 220ms;
    z-index: 95;
    pointer-events: none;
    white-space: nowrap;
}
.toast.on { opacity: 1; transform: translateX(-50%) translateY(0); }

/* Star rating (WooCommerce) */
.stars { display: inline-flex; gap: 2px; color: var(--ink); font-family: inherit; height: 12px; line-height: 1; }
.stars .off { color: var(--ink-4); }
.woocommerce .star-rating {
    font-family: star !important;
    color: var(--ink) !important;
    font-size: 12px !important;
    overflow: hidden;
    position: relative;
    width: 5.4em;
    letter-spacing: 2px;
}
.woocommerce .star-rating::before { color: var(--ink-4); }
.woocommerce .star-rating span::before { color: var(--ink); }
.woocommerce p.stars a::before, .woocommerce p.stars a { color: var(--ink); }

/* Scrollbars */
.drawer-body::-webkit-scrollbar { width: 4px; }
.drawer-body::-webkit-scrollbar-thumb { background: var(--hairline-strong); }

/* ========================================================================
   RESPONSIVE
   ======================================================================== */
@media (max-width: 1200px) {
    :root { --pad-x: 32px; }
    .hd-nav { gap: 22px; }
    .hd-tool .mono { display: none; }
    .woocommerce div.product { grid-template-columns: 110px 1fr !important; }
    .woocommerce div.product div.summary,
    .woocommerce div.product .summary { grid-column: 1 / -1 !important; padding-left: 0; margin-top: 24px !important; }
    .woocommerce form.checkout { grid-template-columns: 1fr; gap: 32px; }
    .woocommerce form.checkout #customer_details { padding-right: 0; }
    .woocommerce form.checkout #order_review_heading,
    .woocommerce form.checkout #order_review { grid-column: 1; }
}

@media (max-width: 992px) {
    .shop-body { grid-template-columns: 1fr; gap: 32px; }
    .filters { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; }
    .filter-section { padding: 16px 0; }
    .about-split, .contact-layout, .quote-band-inner { grid-template-columns: 1fr; gap: 40px; }
    .quote-band-inner .ph { max-height: 320px; }
    .two-up-grid { grid-template-columns: 1fr; }
    .two-up-card { grid-template-columns: 1fr; }
    .hero-grid { grid-template-columns: 1fr; min-height: auto; }
    .hero-grid .ph { min-height: 320px; }
    .hero-copy { padding: 60px 32px; }
    .lw-product-grid, .woocommerce ul.products, .woocommerce-page ul.products,
    .landed-grid-4, .landed-grid-3,
    .woocommerce .related.products ul.products,
    .woocommerce .upsells.products ul.products { grid-template-columns: repeat(2, 1fr) !important; }
    .cat-tiles-grid { grid-template-columns: repeat(3, 1fr); gap: 24px; }
    .services-grid { grid-template-columns: 1fr; gap: 48px; }
    .about-stats-inner, .about-team-grid { grid-template-columns: repeat(2, 1fr); }
    .ft-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
    .ft { padding: 60px 32px 32px; }
    .newsletter-band, .home-section, .cat-tiles, .landed, .services, .two-up, .about-stats, .about-team { padding: 60px 32px; }
    .quote-band { padding: 60px 32px; margin: 40px 0; }
    .lookbook-tile { grid-column: auto !important; grid-row: auto !important; }
    .lookbook-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 300px; }
    .woocommerce-account .woocommerce-MyAccount-navigation { width: 100% !important; float: none !important; margin: 0 0 32px !important; }
    .woocommerce-account .woocommerce-MyAccount-content { width: 100% !important; float: none !important; }
}

@media (max-width: 768px) {
    :root { --pad-x: 20px; }
    body { font-size: 14px; }
    .hd-inner { grid-template-columns: 1fr auto 1fr; padding: 14px var(--pad-x); }
    .hd-nav { display: none; }
    .menu-toggle { display: block; }
    .hd-nav.mobile-open {
        display: flex;
        position: fixed;
        top: 60px;
        left: 0;
        right: 0;
        background: var(--canvas);
        flex-direction: column;
        gap: 0;
        padding: 24px var(--pad-x);
        border-bottom: 1px solid var(--hairline);
        z-index: 39;
    }
    .hd-nav.mobile-open a { padding: 14px 0; border-bottom: 1px solid var(--hairline); text-align: left; }
    .hd-nav.mobile-open a:last-child { border-bottom: none; }
    .hd-logo { font-size: 26px; }
    .hd-logo sup { font-size: 8px; }
    .hd-tools { gap: 14px; }
    .hd-tool svg { width: 18px; height: 18px; }
    .announce { font-size: 8px; letter-spacing: 0.2em; padding: 6px 8px; }
    .woocommerce-cart .woocommerce h1, .cart-heading { font-size: 42px; }
    .woocommerce-cart table.cart thead { display: none; }
    .woocommerce-cart table.cart tr { display: block; padding: 20px 0; border-bottom: 1px solid var(--hairline); }
    .woocommerce-cart table.cart td { display: block; border: none !important; padding: 6px 0 !important; text-align: left; }
    .woocommerce-cart table.cart td.product-thumbnail { display: inline-block; vertical-align: top; width: 100px; margin-right: 16px; }
    .woocommerce-cart table.cart td.product-name { display: inline-block; width: calc(100% - 120px); vertical-align: top; }
    .lw-product-grid, .woocommerce ul.products, .woocommerce-page ul.products,
    .landed-grid-4, .landed-grid-3 { grid-template-columns: repeat(2, 1fr) !important; gap: 20px !important; row-gap: 40px !important; }
    .cat-tiles-grid { grid-template-columns: 1fr; }
    .contact-form, .about-stats-inner, .about-team-grid { grid-template-columns: 1fr; }
    .ft-grid { grid-template-columns: 1fr; gap: 32px; }
    .ft-base { flex-direction: column; gap: 12px; text-align: center; }
    .lookbook-grid { grid-template-columns: 1fr; grid-auto-rows: 280px; }
    .modal { flex-direction: column; max-height: 92vh; overflow-y: auto; }
    .drawer { width: 100vw; }
    .atc-bar { padding: 12px 16px; gap: 12px; }
    .atc-bar-info .atc-bar-name { font-size: 14px; }
    .search-input-wrap { padding: 24px 20px; }
    .search-input-wrap input { font-size: 20px; }
    .search-content { padding: 20px; }
    .search-results-grid { grid-template-columns: repeat(2, 1fr); }
    .newsletter-form { flex-direction: column; }
    .newsletter-form input[type="email"] { border-right: 1px solid rgba(246,244,240,0.3); border-bottom: none; }
    .woocommerce-cart .cart_totals { max-width: 100%; }
    .woocommerce div.product { grid-template-columns: 1fr !important; padding: 24px var(--pad-x); }
    .woocommerce div.product .woocommerce-product-gallery { grid-column: 1 !important; }
    .woocommerce div.product .summary { grid-column: 1 !important; padding-left: 0; }
}

@media (max-width: 480px) {
    .hd-inner { padding: 12px 16px; grid-template-columns: auto 1fr auto; }
    .hd-tool { padding: 4px; }
    .lw-product-grid, .woocommerce ul.products, .woocommerce-page ul.products,
    .landed-grid-4, .landed-grid-3,
    .woocommerce .related.products ul.products,
    .woocommerce .upsells.products ul.products { grid-template-columns: 1fr !important; }
    .hero-copy h1 { font-size: 48px; }
    .woocommerce-cart .woocommerce h1, .cart-heading { font-size: 36px; }
    .about-stats-inner { grid-template-columns: 1fr; }
    .search-results-grid { grid-template-columns: 1fr; }
}

@media print {
    .hd, .ft, .atc-bar, .drawer, .drawer-scrim, .modal-scrim, .toast, .search-overlay { display: none !important; }
}

/* ========================================================================
   WOOCOMMERCE BLOCKS — SINGLE PRODUCT PAGE (block-based PDP)
   Force the same 2-col G&F layout that the classic template gets.
   ======================================================================== */
.wp-block-woocommerce-single-product,
.wp-block-woocommerce-product-details,
.wc-block-single-product,
.wp-block-columns.is-layout-flex:has(.wp-block-woocommerce-product-image-gallery) {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 60px !important;
    align-items: start !important;
    max-width: var(--wrap) !important;
    margin: 0 auto !important;
    padding: 40px var(--pad-x) !important;
    width: 100% !important;
}
.wp-block-woocommerce-single-product > .wp-block-column:first-child,
.wp-block-woocommerce-product-image-gallery,
.wp-block-woocommerce-product-image {
    grid-column: 1 !important;
}
.wp-block-woocommerce-single-product > .wp-block-column:last-child,
.wp-block-woocommerce-product-title,
.wp-block-woocommerce-product-price,
.wp-block-woocommerce-product-rating,
.wp-block-woocommerce-product-summary,
.wp-block-woocommerce-product-meta,
.wp-block-woocommerce-add-to-cart-form,
.wp-block-woocommerce-product-details {
    grid-column: 2 !important;
}
/* PDP image wrapper: constrain to 3/4 */
.wp-block-woocommerce-product-image-gallery,
.wp-block-woocommerce-product-image,
.wc-block-components-product-image {
    aspect-ratio: 3/4 !important;
    width: 100% !important;
    max-width: none !important;
    overflow: hidden !important;
    background: var(--paper) !important;
    position: relative !important;
    border-radius: 0 !important;
    margin: 0 !important;
}
.wp-block-woocommerce-product-image-gallery img,
.wp-block-woocommerce-product-image img,
.wc-block-components-product-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
    border-radius: 0 !important;
    display: block !important;
    aspect-ratio: auto !important;
}
/* PDP title, price, description in the block layout */
.wp-block-woocommerce-product-title,
.wp-block-post-title {
    font-family: var(--serif) !important;
    font-weight: 400 !important;
    font-size: clamp(1.8rem, 3.5vw, 46px) !important;
    line-height: 1.1 !important;
    color: var(--ink) !important;
    letter-spacing: -0.01em !important;
    margin: 0 0 14px !important;
    font-style: normal !important;
}
.wp-block-woocommerce-product-price,
.wp-block-woocommerce-product-price .wc-block-components-product-price {
    font-family: var(--mono) !important;
    font-size: 14px !important;
    letter-spacing: 0.1em !important;
    color: var(--ink) !important;
    margin: 0 0 24px !important;
    padding: 0 !important;
    text-transform: none !important;
    font-weight: 400 !important;
}
.wp-block-woocommerce-product-summary,
.wp-block-woocommerce-product-summary p {
    color: var(--ink-2) !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
}
.wp-block-woocommerce-related-products {
    grid-column: 1 / -1 !important;
    max-width: var(--wrap) !important;
    margin: 40px auto 120px !important;
    padding: 0 var(--pad-x) !important;
    background: transparent !important;
}
@media (max-width: 992px) {
    .wp-block-woocommerce-single-product,
    .wp-block-woocommerce-product-details,
    .wc-block-single-product {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }
    .wp-block-woocommerce-single-product > .wp-block-column:first-child,
    .wp-block-woocommerce-product-image-gallery,
    .wp-block-woocommerce-product-image,
    .wp-block-woocommerce-single-product > .wp-block-column:last-child,
    .wp-block-woocommerce-product-title,
    .wp-block-woocommerce-product-price,
    .wp-block-woocommerce-product-summary,
    .wp-block-woocommerce-add-to-cart-form {
        grid-column: 1 !important;
    }
}

/* ========================================================================
   WOOCOMMERCE BLOCKS (cart + checkout use Gutenberg blocks, not the classic
   templates). Override the .wc-block-* class tree to match G&F.
   ======================================================================== */

/* On any Woo page rendered through page.php, strip the narrow wrapper so the
 * checkout/cart/account blocks get the full site width. */
.woocommerce-checkout .page-content,
.woocommerce-cart .page-content,
.woocommerce-account .page-content,
.woocommerce-checkout .page-content-narrow,
.woocommerce-cart .page-content-narrow,
.woocommerce-account .page-content-narrow,
.woocommerce-checkout .entry-content,
.woocommerce-cart .entry-content,
.woocommerce-account .entry-content {
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.woocommerce-checkout .page-hero,
.woocommerce-cart .page-hero,
.woocommerce-account .page-hero { display: none !important; }

/* Wrap + main grid */
.wp-block-woocommerce-checkout,
.wp-block-woocommerce-cart,
.wc-block-checkout,
.wc-block-cart {
    max-width: var(--wrap) !important;
    margin: 0 auto !important;
    padding: 60px var(--pad-x) 120px !important;
    background: transparent !important;
    font-family: var(--sans);
    color: var(--ink);
    width: 100% !important;
}
/* WC Blocks wraps the real 2-column layout inside .wc-block-components-sidebar-layout.
 * Grid the layout wrapper, not the outer block. */
.wc-block-components-sidebar-layout {
    display: grid !important;
    grid-template-columns: 1.3fr 1fr !important;
    gap: 60px !important;
    align-items: start !important;
    max-width: 100% !important;
    width: 100% !important;
    float: none !important;
}
.wc-block-checkout__main,
.wc-block-cart__main,
.wp-block-woocommerce-checkout-fields-block,
.wp-block-woocommerce-cart-items-block,
.wc-block-components-main {
    grid-column: 1 !important;
    min-width: 0 !important;
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
}
.wc-block-checkout__sidebar,
.wc-block-cart__sidebar,
.wp-block-woocommerce-checkout-totals-block,
.wp-block-woocommerce-cart-totals-block {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    max-width: none !important;
    position: relative !important;
    top: 0 !important;
}
.wc-block-components-main { background: transparent !important; }

/* Force the sidebar visible on desktop and hide the nested mobile summary
 * accordion that WC Blocks stuffs into the main column. */
@media (min-width: 993px) {
    .wc-block-checkout__sidebar,
    .wc-block-cart__sidebar,
    .wp-block-woocommerce-checkout-totals-block,
    .wp-block-woocommerce-cart-totals-block {
        display: block !important;
    }
    /* Hide any order-summary block nested inside the main fields column
     * (WC Blocks stuffs a mobile accordion + a nested actions summary here). */
    .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-order-summary-block,
    .wc-block-checkout__main .wp-block-woocommerce-checkout-order-summary-block {
        display: none !important;
    }
}

@media (max-width: 992px) {
    .wc-block-components-sidebar-layout {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }
    .wc-block-checkout__main,
    .wc-block-cart__main,
    .wp-block-woocommerce-checkout-fields-block,
    .wp-block-woocommerce-cart-items-block,
    .wc-block-checkout__sidebar,
    .wc-block-cart__sidebar,
    .wp-block-woocommerce-checkout-totals-block,
    .wp-block-woocommerce-cart-totals-block {
        grid-column: 1 !important;
        grid-row: auto !important;
    }
}

/* Section headings ("Contact information", "Billing address", "Payment options", "Order summary") */
.wc-block-components-title,
.wc-block-components-checkout-step__title,
.wc-block-components-checkout-order-summary__title,
h2.wc-block-components-title,
.wc-block-checkout h2,
.wc-block-cart h2 {
    font-family: var(--serif) !important;
    font-style: italic !important;
    font-weight: 400 !important;
    color: var(--ink) !important;
    letter-spacing: -0.01em !important;
    font-size: clamp(1.4rem, 2.2vw, 1.6rem) !important;
    line-height: 1.2 !important;
    margin-bottom: 16px !important;
}
.wc-block-components-checkout-step__heading { border-bottom: 1px solid var(--hairline); padding-bottom: 8px; margin-bottom: 20px; }

/* Text inputs, textareas, selects */
.wc-block-components-text-input, .wc-block-components-textarea, .wc-block-components-select {
    background: transparent !important;
}
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-textarea textarea,
.wc-block-components-country-input select,
.wc-block-components-state-input select,
.wc-block-components-address-form select,
.wc-block-components-form-token-field__suggestions-list + input,
.wc-block-components-form input,
.wc-block-components-form select,
.wc-block-components-form textarea {
    border: 1px solid var(--hairline-strong) !important;
    border-radius: 0 !important;
    background: transparent !important;
    font-family: var(--sans) !important;
    font-size: 13px !important;
    color: var(--ink) !important;
    padding: 20px 16px 8px !important;    /* room for floating label */
    line-height: 1.4 !important;
    box-shadow: none !important;
    height: auto !important;
    min-height: 52px !important;
}
.wc-block-components-text-input input:focus,
.wc-block-components-textarea textarea:focus,
.wc-block-components-country-input select:focus,
.wc-block-components-state-input select:focus,
.wc-block-components-form input:focus,
.wc-block-components-form select:focus {
    border-color: var(--ink) !important;
    box-shadow: none !important;
    outline: none !important;
}
/* Floating labels — style them mono-uppercase like the rest of G&F */
.wc-block-components-text-input label,
.wc-block-components-textarea label,
.wc-block-components-select label,
.wc-block-components-country-input label,
.wc-block-components-state-input label {
    font-family: var(--sans) !important;
    color: var(--ink-3) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    left: 16px !important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-textarea.is-active label,
.wc-block-components-select.is-active label,
.wc-block-components-country-input.is-active label,
.wc-block-components-state-input.is-active label {
    font-family: var(--mono) !important;
    font-size: 9px !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    color: var(--ink-3) !important;
    transform: translateY(-14px) scale(1) !important;
}

/* Sidebar / order summary card — quiet luxury paper background */
.wc-block-checkout__sidebar,
.wc-block-cart__sidebar {
    background: var(--paper) !important;
    padding: 32px !important;
    border-radius: 0 !important;
    border: none !important;
}
.wc-block-components-sidebar,
.wc-block-cart__totals-title,
.wc-block-components-order-summary,
.wc-block-components-panel,
.wc-block-components-totals-wrapper {
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.wc-block-components-totals-item {
    padding: 12px 0 !important;
    border-bottom: 1px solid var(--hairline) !important;
}
.wc-block-components-totals-item__label { color: var(--ink-3) !important; font-family: var(--sans); font-size: 13px; }
.wc-block-components-totals-item__value { color: var(--ink) !important; font-family: var(--mono); font-size: 12px; }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    font-family: var(--serif) !important;
    font-style: italic !important;
    font-size: 22px !important;
    color: var(--ink) !important;
    font-weight: 400 !important;
}

/* Panel toggles (coupons, add note, add apartment) */
.wc-block-components-panel__button {
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    color: var(--ink) !important;
    border-radius: 0 !important;
    background: transparent !important;
}
.wc-block-components-address-form__address_2-toggle {
    font-family: var(--mono) !important;
    font-size: 10px !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase !important;
    color: var(--ink-3) !important;
}
.wc-block-components-address-form__address_2-toggle:hover { color: var(--ink) !important; }

/* Notice banners (payment error, info) */
.wc-block-components-notice-banner {
    background: var(--paper) !important;
    border: none !important;
    border-top: 1px solid var(--ink) !important;
    border-radius: 0 !important;
    color: var(--ink) !important;
    box-shadow: none !important;
    padding: 16px 20px !important;
    font-family: var(--sans);
    font-size: 13px;
}
.wc-block-components-notice-banner.is-error { border-top-color: var(--accent-ink) !important; }
.wc-block-components-notice-banner__content { color: var(--ink) !important; font-size: 13px; }
.wc-block-components-notice-banner > svg { color: var(--ink) !important; }

/* Buttons — Place Order, Continue, Update Cart, Add to Cart in blocks */
.wc-block-components-button,
.wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-proceed-to-checkout-block .wc-block-cart__submit-container .wc-block-components-button,
.wc-block-cart__submit-button,
button.wc-block-components-button {
    background: var(--ink) !important;
    color: var(--canvas) !important;
    border: 1px solid var(--ink) !important;
    border-radius: 0 !important;
    padding: 18px 28px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    font-weight: 400 !important;
    box-shadow: none !important;
    min-height: 56px !important;
    line-height: 1 !important;
    text-decoration: none !important;
}
.wc-block-components-button:hover,
.wc-block-components-checkout-place-order-button:hover,
.wc-block-cart__submit-button:hover {
    background: transparent !important;
    color: var(--ink) !important;
}
/* "Return to cart" is a ghost link, keep it looking like a text link */
.wc-block-components-checkout-return-to-cart-button {
    background: transparent !important;
    color: var(--ink-3) !important;
    border: none !important;
    padding: 12px 0 !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    min-height: auto !important;
    text-decoration: none !important;
}
.wc-block-components-checkout-return-to-cart-button:hover {
    background: transparent !important;
    color: var(--ink) !important;
}

/* Checkboxes (create account, add note) — accent-color already sets fill */
.wc-block-components-checkbox__input {
    accent-color: var(--ink) !important;
    border-radius: 0 !important;
    width: 16px !important;
    height: 16px !important;
    margin-right: 10px !important;
}
.wc-block-components-checkbox__mark { display: none !important; }
.wc-block-components-checkbox__label {
    font-family: var(--sans) !important;
    font-size: 13px !important;
    color: var(--ink-2) !important;
}

/* Order summary items (thumbs + names in sidebar) */
.wc-block-components-order-summary-item {
    padding: 14px 0 !important;
    border-bottom: 1px solid var(--hairline);
}
.wc-block-components-order-summary-item__image {
    width: 64px !important;
    height: 85px !important;
    background: var(--canvas);
    border-radius: 0 !important;
    overflow: hidden;
}
.wc-block-components-order-summary-item__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 0 !important;
}
.wc-block-components-order-summary-item__description {
    font-family: var(--serif) !important;
    font-size: 15px !important;
    color: var(--ink) !important;
    line-height: 1.3;
}
.wc-block-components-order-summary-item__quantity,
.wc-block-components-order-summary-item__total-price,
.wc-block-components-order-summary-item__individual-price {
    font-family: var(--mono) !important;
    font-size: 11px !important;
    letter-spacing: 0.1em !important;
    color: var(--ink-3) !important;
}

/* Terms text */
.wc-block-checkout__terms { font-size: 12px; color: var(--ink-3); }
.wc-block-checkout__terms a { color: var(--ink); border-bottom: 1px solid var(--hairline-strong); }

/* CART blocks specifics */
.wc-block-cart-item__image img {
    border-radius: 0 !important;
    background: var(--paper);
}
.wc-block-cart-item__product-name {
    font-family: var(--serif) !important;
    font-size: 18px !important;
    color: var(--ink) !important;
    font-weight: 400 !important;
    text-decoration: none !important;
}
.wc-block-cart-item__wrap {
    padding: 24px 0 !important;
    border-bottom: 1px solid var(--hairline) !important;
}
.wc-block-cart-items__header {
    border-bottom: 1px solid var(--ink) !important;
    padding: 12px 0 !important;
}
.wc-block-cart-items__header-heading {
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    color: var(--ink-3) !important;
    font-weight: 400 !important;
    background: transparent !important;
}
.wc-block-components-quantity-selector {
    border: 1px solid var(--hairline-strong) !important;
    border-radius: 0 !important;
    background: transparent !important;
}
.wc-block-components-quantity-selector input {
    font-family: var(--mono) !important;
    color: var(--ink) !important;
    background: transparent !important;
    border: none !important;
}
.wc-block-components-quantity-selector button {
    font-family: var(--mono) !important;
    color: var(--ink) !important;
    background: transparent !important;
    border: none !important;
}
.wc-block-components-quantity-selector button:hover { background: var(--ink) !important; color: var(--canvas) !important; }
.wc-block-cart-item__remove-link {
    font-family: var(--mono) !important;
    font-size: 10px !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    color: var(--ink-3) !important;
    border-bottom: 1px solid var(--hairline-strong) !important;
    padding-bottom: 2px !important;
    text-decoration: none !important;
}
.wc-block-cart-item__remove-link:hover { color: var(--ink) !important; }

/* Cart empty */
.wc-block-cart__empty-cart__title {
    font-family: var(--serif) !important;
    font-style: italic !important;
    font-weight: 400 !important;
}

/* Chevron on native <select> — make it bolder so it's visible on contact page etc. */
select.field, .field select, select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 20 20' fill='none' stroke='%23111111' stroke-width='1.5'%3E%3Cpath d='m5 7 5 5 5-5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 14px 14px;
    padding-right: 40px !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}
