/*
Theme Name: La Sacca
Theme URI: https://www.lasaccatorino.it
Author: Paolo Bortolotti
Description: Tema WooCommerce su misura per La Sacca Torino, bottega di pelletteria, borse e accessori dal 1981.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lasacca
Tags: e-commerce, custom-menu, featured-images, translation-ready, accessibility-ready
WC requires at least: 8.0
WC tested up to: 10.9
*/

/* ---------- Font ---------- */

@font-face {
  font-family: "Instrument Sans";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("assets/fonts/instrument-sans-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Instrument Sans";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("assets/fonts/instrument-sans-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Instrument Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/instrument-serif-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Instrument Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/instrument-serif-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  --ink: oklch(24% 0.02 55);
  --ink-soft: oklch(43% 0.025 55);
  --paper: oklch(97% 0.014 82);
  --paper-deep: oklch(92.5% 0.026 82);
  --blue: oklch(55% 0.105 250);
  --blue-deep: oklch(34% 0.075 250);
  --clay: oklch(64% 0.105 42);
  --line: oklch(84% 0.024 78);
  --focus: oklch(58% 0.16 250);
  --danger: oklch(52% 0.17 27);
  --success: oklch(58% 0.13 152);
  /* Serif solo per i titoli; --font-ui per bottoni, nav ed etichette, dove un serif
     in maiuscoletto spaziato risulterebbe illeggibile. */
  --font-display: "Instrument Serif", Georgia, "Times New Roman", serif;
  --font-body: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-ui: var(--font-body);
  --shadow-soft: 0 18px 50px oklch(22% 0.018 62 / 0.12);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --max: 1320px;
  --gutter: clamp(1rem, 4vw, 4rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--font-body);
  font-size: .95rem;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }

.sr-only,
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: fixed;
  z-index: 200;
  left: 1rem;
  top: 1rem;
  padding: .75rem 1rem;
  background: var(--ink);
  color: var(--paper);
  transform: translateY(-180%);
  transition: transform .25s var(--ease-out);
}
.skip-link:focus { transform: translateY(0); }

/* ---------- Header ---------- */

.site-header {
  position: relative;
  z-index: 50;
  background: color-mix(in oklch, var(--paper) 94%, transparent);
}
.utility-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 31px;
  padding: .25rem var(--gutter);
  color: var(--paper);
  background: var(--blue-deep);
  font-size: .72rem;
  letter-spacing: .045em;
}
.utility-bar p { margin: 0; }
.utility-bar a { text-decoration: underline; text-underline-offset: 3px; }
.nav-shell {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: 86px;
  padding: 0 var(--gutter);
  border-bottom: 1px solid var(--line);
}
.brand { width: clamp(150px, 16vw, 226px); }
.brand img { width: 100%; height: auto; }
.brand .brand-text {
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: -.04em;
}
.desktop-nav { display: flex; align-items: center; gap: clamp(1.25rem, 3vw, 3.25rem); }
.desktop-nav ul { display: contents; margin: 0; padding: 0; list-style: none; }
.desktop-nav a {
  position: relative;
  display: block;
  padding: 1.75rem 0;
  font-family: var(--font-ui);
  font-size: .79rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.desktop-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 1.35rem;
  width: 100%;
  height: 1px;
  background: var(--blue);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .35s var(--ease-out);
}
.desktop-nav a:hover::after,
.desktop-nav .current-menu-item > a::after,
.desktop-nav .current_page_item > a::after,
.desktop-nav .current-menu-ancestor > a::after,
.desktop-nav a.is-current::after { transform: scaleX(1); transform-origin: left; }
.header-actions { justify-self: end; display: flex; align-items: center; gap: .45rem; }
.icon-button, .cart-button, .menu-button {
  display: grid;
  place-items: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.icon-button svg, .cart-button svg { width: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.cart-button { grid-template-columns: auto auto; gap: .2rem; }
.cart-button span { font-size: .72rem; font-weight: 700; }
/* align-content, non align-items: place-items centra la linea dentro la sua riga, ma le
   righe auto restano stirate sui 44px di min-height, allontanando le linee. Ridurre il
   gap peggiora, perché lascia più spazio residuo da distribuire alle righe. */
.menu-button { display: none; gap: 4px; align-content: center; }
.menu-button > span:not(.sr-only) { display: block; width: 22px; height: 1.5px; background: currentColor; transition: transform .3s var(--ease-out); }
.mobile-nav { padding: 1rem 1.25rem 2rem; border-bottom: 1px solid var(--line); }
.mobile-nav ul { margin: 0; padding: 0; list-style: none; }
.mobile-nav a { display: block; padding: 1rem 0; border-bottom: 1px solid var(--line); font-family: var(--font-display); font-size: 1.5rem; font-weight: 400; }

/* ---------- Tipografia ---------- */

.eyebrow {
  margin: 0 0 1rem;
  color: var(--blue);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
h1, h2, h3 { margin-top: 0; font-family: var(--font-display); font-weight: 400; line-height: 1.06; letter-spacing: -.015em; }
h1 { font-size: clamp(2.2rem, 3.8vw, 4.1rem); }
h2 { font-size: clamp(2.3rem, 4.2vw, 3.7rem); }
h3 { font-size: 1.18rem; }

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

.hero {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  align-items: end;
  min-height: min(760px, calc(100vh - 117px));
  overflow: hidden;
  isolation: isolate;
  background: var(--blue-deep);
}
.hero-media {
  position: absolute;
  z-index: -2;
  inset: 0;
  background-image: var(--hero-image);
  background-position: var(--hero-position, center);
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 1;
  transform: scale(1);
  transition: opacity .65s var(--ease-out), transform 1.1s var(--ease-out);
}
.hero-media.is-loading { opacity: 0; transform: scale(1.012); }
.hero-media.is-ready { opacity: 1; transform: scale(1); }
.hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, oklch(17% .025 250 / .78) 0%, oklch(17% .025 250 / .48) 36%, oklch(17% .025 250 / .08) 72%, transparent 100%),
    linear-gradient(0deg, oklch(17% .025 250 / .38) 0%, transparent 48%);
}
.hero-content {
  position: relative;
  z-index: 2;
  width: min(600px, calc(100% - 3rem));
  margin: clamp(3rem, 6vw, 5.5rem);
  padding: 0;
  color: var(--paper);
  text-shadow: 0 2px 24px oklch(12% .02 250 / .28);
}
.hero-content .eyebrow {
  display: flex;
  align-items: center;
  gap: .8rem;
  margin-bottom: 1.15rem;
  color: oklch(93% .012 82);
  text-shadow: 0 1px 12px oklch(12% .02 250 / .5);
}
.hero-content .eyebrow::before {
  content: "";
  width: 2.4rem;
  height: 1px;
  flex: 0 0 auto;
  background: var(--clay);
}
.hero-content h1 {
  max-width: 11ch;
  margin-bottom: 1rem;
  font-size: clamp(2.35rem, 4.1vw, 3.35rem);
  line-height: .98;
  text-wrap: balance;
}
.hero-copy { max-width: 33rem; margin: 0 0 1.8rem; color: oklch(94% .01 82); font-size: clamp(.95rem, 1.2vw, 1.05rem); }
.hero-actions { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
.hero .button-primary {
  color: var(--blue-deep);
  background: var(--paper);
  box-shadow: 0 10px 32px oklch(12% .02 250 / .2);
}
.hero .button-primary:hover { color: var(--paper); background: var(--clay); }
.hero-note {
  position: absolute;
  z-index: 3;
  left: var(--gutter);
  bottom: clamp(1rem, 3vw, 2.5rem);
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  padding: 1rem 1.25rem;
  color: var(--paper);
  background: var(--blue-deep);
  box-shadow: var(--shadow-soft);
}
.hero-note span { color: var(--clay); font-size: .7rem; font-weight: 700; }
.hero-note p { margin: 0; font-size: .75rem; line-height: 1.55; }

/* ---------- Bottoni ---------- */

.button {
  display: inline-flex;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  padding: .85rem 1.45rem;
  border: 1px solid transparent;
  /* Dichiarato esplicitamente: senza, su <button> vince il grigio "buttonface" dello
     user agent e i bottoni generati da WooCommerce restano di sistema. */
  background: transparent;
  color: inherit;
  font-family: var(--font-ui);
  font-size: .77rem;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform .3s var(--ease-out), background-color .3s var(--ease-out), color .3s var(--ease-out), border-color .3s var(--ease-out);
}
.button:hover { transform: translateY(-2px); }
.button:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.button-primary { color: var(--paper); background: var(--blue-deep); }
.button-primary:hover { background: var(--blue); }
.button-outline { border-color: var(--ink); background: transparent; }
.button-outline:hover { color: var(--paper); background: var(--ink); }
.text-link { display: inline-flex; align-items: center; gap: .6rem; padding: .35rem 0; border-bottom: 1px solid currentColor; font-size: .85rem; font-weight: 700; }

/* ---------- Sezioni ---------- */

.category-strip {
  display: flex;
  justify-content: center;
  gap: clamp(1.2rem, 4vw, 4.5rem);
  padding: 1.1rem var(--gutter);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  overflow-x: auto;
  scrollbar-width: none;
}
.category-strip a { flex: 0 0 auto; font-family: var(--font-ui); font-size: .73rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.section-shell { max-width: var(--max); margin: 0 auto; padding: clamp(2rem, 4vw, 2rem) var(--gutter); }
.section-heading { display: grid; grid-template-columns: 1.4fr .6fr; gap: 3rem; align-items: end; margin-bottom: clamp(3rem, 6vw, 5.5rem); }
.section-heading h2 { margin-bottom: 0; }
.section-heading > p { max-width: 34rem; margin: 0 0 .4rem; color: var(--ink-soft); }
.section-heading.compact { grid-template-columns: 1fr auto; }
.section-cta { margin-top: 4rem; text-align: center; }

/* ---------- Griglia prodotti ---------- */

.product-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(1rem, 2.2vw, 2rem); align-items: start; margin: 0; padding: 0; list-style: none; }
.product-card { grid-column: span 3; }
.product-card-featured { grid-column: span 6; grid-row: span 2; }
.product-image { position: relative; display: block; overflow: hidden; background: var(--paper-deep); aspect-ratio: 4 / 5; }
.product-card-featured .product-image { aspect-ratio: 1 / 1.04; }
.product-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease-out); }
.product-image:hover img { transform: scale(1.035); }
.product-badge { position: absolute; top: 1rem; left: 1rem; padding: .38rem .7rem; color: var(--paper); background: var(--clay); font-size: .66rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.product-badge-out { background: var(--ink); }
.product-meta { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; padding: 1.1rem .1rem 0; }
.product-meta h3 { margin: 0; font-size: clamp(1rem, 1.5vw, 1.25rem); line-height: 1.2; letter-spacing: -.025em; }
.product-category { margin: 0 0 .28rem; color: var(--ink-soft); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.product-options { margin: .45rem 0 0; color: var(--ink-soft); font-size: .76rem; line-height: 1.45; }
.product-options span { margin-right: .35rem; font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.product-options em { font-style: normal; opacity: .75; }
.price { flex: 0 0 auto; margin: 0; font-weight: 700; }
.price del { margin-right: .35rem; color: var(--ink-soft); font-weight: 400; }
.price ins { text-decoration: none; }

/* ---------- Craft story ---------- */

.craft-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, .75fr) minmax(170px, .25fr); background: var(--paper-deep); }
.story-image { position: relative; min-height: 720px; }
.story-image img { width: 100%; height: 100%; object-fit: cover; }
.story-image > p { position: absolute; bottom: 0; left: 0; margin: 0; padding: .8rem 1rem; color: var(--paper); background: var(--blue-deep); font-size: .73rem; }
.story-copy { align-self: center; padding: clamp(3rem, 7vw, 7rem); }
.story-copy h2 { font-size: clamp(2.3rem, 3.4vw, 4.1rem); }
.story-copy .lead { color: var(--ink); font-size: 1.08rem; }
.story-copy > p:not(.eyebrow) { max-width: 42rem; color: var(--ink-soft); }
.story-values { display: flex; flex-direction: column; justify-content: space-around; padding: 2rem 1.5rem; border-left: 1px solid var(--line); }
.story-values div { padding: 2rem 0; writing-mode: vertical-rl; transform: rotate(180deg); }
.story-values span { color: var(--ink-soft); font-size: .67rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.story-values strong { margin-top: .75rem; font-family: var(--font-display); font-size: 1.3rem; font-weight: 400; }
.service-band { display: grid; grid-template-columns: repeat(3, 1fr); max-width: var(--max); margin: 0 auto; padding: clamp(4rem, 7vw, 6.5rem) var(--gutter); }
.service-band > div { position: relative; padding: 1rem clamp(1rem, 4vw, 3.25rem); border-right: 1px solid var(--line); }
.service-band > div:last-child { border-right: 0; }
.service-band span { color: var(--clay); font-size: .66rem; font-weight: 750; }
.service-band h3 { margin: 1.5rem 0 .45rem; font-size: 1.4rem; }
.service-band p { margin: 0; color: var(--ink-soft); }

/* ---------- Footer ---------- */

.site-footer { color: var(--paper); background: var(--ink); }
.footer-main { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 3rem; max-width: var(--max); margin: 0 auto; padding: clamp(4rem, 7vw, 6rem) var(--gutter); }
.brand-footer { display: block; max-width: 210px; filter: brightness(0) invert(1); opacity: .9; }
.footer-main p { max-width: 28rem; color: color-mix(in oklch, var(--paper) 72%, transparent); }
.footer-main a:not(.brand) { text-decoration: underline; text-underline-offset: 4px; }
.footer-main ul { margin: 0; padding: 0; list-style: none; }
.footer-label { margin-top: 0; color: var(--clay) !important; font-size: .7rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }

/* Profili social: pastiglie con la sola icona, il nome resta per chi legge con la voce.
   Il selettore ripete .footer-main perché lì ogni link è sottolineato. */
.footer-social { display: flex; flex-wrap: wrap; gap: .5rem; margin: .35rem 0 0; padding: 0; list-style: none; }
.footer-main .footer-social a {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid color-mix(in oklch, var(--paper) 28%, transparent);
  border-radius: 50%;
  text-decoration: none;
  transition: color .3s var(--ease-out), background-color .3s var(--ease-out), border-color .3s var(--ease-out);
}
.footer-main .footer-social a:hover { color: var(--ink); background: var(--paper); border-color: var(--paper); }
/* Facebook e TikTok sono glifi pieni, Instagram è disegnato a tratto. */
.footer-social svg { width: 19px; height: 19px; fill: currentColor; stroke: none; }
.footer-social .is-instagram svg { fill: none; stroke: currentColor; stroke-width: 1.6; }
.footer-bottom { display: flex; justify-content: space-between; gap: 2rem; padding: 1.1rem var(--gutter); border-top: 1px solid color-mix(in oklch, var(--paper) 16%, transparent); font-size: .68rem; }
.footer-bottom p { margin: 0; }
.footer-bottom ul { display: flex; gap: 1.5rem; margin: 0; padding: 0; list-style: none; }
.footer-bottom a { text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Dialog ricerca ---------- */

.search-dialog { width: min(760px, calc(100% - 2rem)); padding: clamp(2rem, 6vw, 5rem); border: 0; color: var(--ink); background: var(--paper); box-shadow: var(--shadow-soft); }
.search-dialog::backdrop { background: oklch(18% 0.02 60 / .8); }
.search-dialog h2 { margin-bottom: 2rem; font-size: clamp(2rem, 4vw, 3.4rem); }
.dialog-close { position: absolute; right: 1rem; top: .5rem; min-width: 44px; min-height: 44px; border: 0; background: transparent; font-size: 2rem; cursor: pointer; }
.search-form { display: flex; gap: .75rem; }
.search-form input { width: 100%; min-height: 50px; padding: 0 1rem; border: 1px solid var(--ink); color: var(--ink); background: transparent; }

/* ---------- Pagina prodotto ---------- */

/* Scoped a <main>: su <body> bloccherebbe lo scroll dell'intera pagina.
   overflow-x:clip contiene il trasbordo orizzontale dello zoom senza creare un
   contenitore di scroll, che romperebbe position:sticky su .product-info. */
main.product-page { overflow-x: clip; }
.breadcrumbs { display: flex; gap: .55rem; flex-wrap: wrap; max-width: var(--max); margin: 0 auto; padding: 1.25rem var(--gutter); color: var(--ink-soft); font-size: .74rem; }
.breadcrumbs a { text-decoration: underline; text-underline-offset: 3px; }
.product-detail { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.product-gallery { padding: clamp(1rem, 3vw, 3.5rem) var(--gutter); background: var(--paper-deep); }
.product-main-image { position: relative; max-height: 790px; overflow: hidden; background: color-mix(in oklch, var(--paper) 75%, var(--paper-deep)); cursor: zoom-in; }
.product-main-image img { width: 100%; height: min(72vw, 730px); object-fit: contain; transform-origin: center; transition: transform .55s var(--ease-out); }
.product-main-image.is-zoomed img { transform: scale(1.55); }
.gallery-tools { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-top: 1rem; color: var(--ink-soft); font-size: .73rem; }
.gallery-tools p { margin: 0; }
.zoom-button { border: 0; border-bottom: 1px solid currentColor; padding: .25rem 0; background: transparent; cursor: pointer; }
.gallery-thumbs { display: flex; gap: .6rem; flex-wrap: wrap; padding-top: 1rem; }
.gallery-thumbs button { width: 72px; height: 90px; padding: 0; border: 1px solid var(--line); background: var(--paper); cursor: pointer; }
.gallery-thumbs button[aria-current="true"] { border-color: var(--ink); }
.gallery-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.product-info { align-self: start; position: sticky; top: 0; padding: clamp(3rem, 7vw, 7.5rem) clamp(2rem, 7vw, 7rem); }
.product-info h1 { max-width: 18ch; margin-bottom: 1.5rem; font-size: clamp(2rem, 3vw, 3.1rem); }
.price-row { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--line); }
.price-row p { margin: 0; }
.price-row .stock { color: var(--blue); font-size: .75rem; font-weight: 700; text-transform: uppercase; }
.price-row .stock.out-of-stock { color: var(--danger); }
/* Il prezzo della scheda porta lo stesso trattamento dei prezzi di riga — sans in
   grassetto — così in tutto il sito il prezzo si scrive in un modo solo e il serif resta
   ai titoli. Nella stessa dichiarazione c'è il prezzo che WooCommerce scrive quando si
   sceglie una variante: è lo stesso prezzo in due momenti e non deve poter divergere.
   Il selettore è legato a .price-row perché "product-price" è anche il nome che
   WooCommerce dà alla colonna del prezzo unitario nel carrello. */
.price-row .product-price,
.woocommerce-variation-price .price { font-family: var(--font-body); font-size: .95rem; font-weight: 700; }
.price-row .product-price del,
.woocommerce-variation-price .price del { margin-right: .5rem; color: var(--ink-soft); font-size: .95rem; font-weight: 400; }
.price-row .product-price ins,
.woocommerce-variation-price .price ins { text-decoration: none; }
.product-intro { max-width: 58ch; margin: 1.7rem 0 2rem; color: var(--ink-soft); font-size: .98rem; }
.purchase-panel { padding: 1.5rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.size-picker { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: .75rem; margin: 0 0 1.4rem; padding: 0; border: 0; }
.size-picker legend { float: left; margin-right: 1.25rem; font-size: .75rem; font-weight: 750; text-transform: uppercase; }
.size-picker label { position: relative; }
.size-picker input { position: absolute; opacity: 0; }
.size-picker label span { display: grid; place-items: center; min-width: 44px; height: 44px; padding: 0 .5rem; border: 1px solid var(--line); cursor: pointer; }
.size-picker input:checked + span { color: var(--paper); background: var(--ink); border-color: var(--ink); }
.size-picker input:disabled + span { opacity: .35; cursor: not-allowed; text-decoration: line-through; }
.size-picker input:focus-visible + span { outline: 3px solid var(--focus); outline-offset: 3px; }
.size-picker p { justify-self: end; margin: 0; color: var(--ink-soft); font-size: .72rem; }
.purchase-row { display: grid; grid-template-columns: auto 1fr; gap: .75rem; }
.quantity { display: grid; grid-template-columns: repeat(3, 44px); min-height: 52px; border: 1px solid var(--line); }
.quantity button { border: 0; background: transparent; cursor: pointer; }
.quantity input,
.quantity output { display: grid; place-items: center; width: 100%; height: 100%; border: 0; background: transparent; text-align: center; font-weight: 700; -moz-appearance: textfield; }
.quantity input::-webkit-outer-spin-button,
.quantity input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.add-cart { width: 100%; }
.product-assurances { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin: 1.5rem 0; padding: 0; list-style: none; color: var(--ink-soft); font-size: .7rem; }
.product-assurances span { color: var(--blue); font-weight: 750; }
.product-accordions details { border-top: 1px solid var(--line); }
.product-accordions details:last-child { border-bottom: 1px solid var(--line); }
.product-accordions summary { position: relative; padding: 1.15rem 2rem 1.15rem 0; font-family: var(--font-ui); font-size: .9rem; font-weight: 700; cursor: pointer; list-style: none; }
.product-accordions summary::-webkit-details-marker { display: none; }
.product-accordions summary::after { content: "+"; position: absolute; right: .2rem; font-size: 1.2rem; font-weight: 400; }
.product-accordions details[open] summary::after { content: "\2212"; }
.product-accordions details > div { padding: 0 0 1.4rem; color: var(--ink-soft); font-size: .85rem; }
.product-accordions dl { display: grid; grid-template-columns: 1fr 1.5fr; gap: .45rem 1rem; margin: 0; }
.product-accordions dt { font-weight: 700; color: var(--ink); }
.product-accordions dd { margin: 0; }
.material-story { display: grid; grid-template-columns: .45fr .9fr 1fr; gap: clamp(1.5rem, 5vw, 5rem); align-items: start; max-width: var(--max); margin: 0 auto; padding: clamp(5rem, 10vw, 10rem) var(--gutter); }
.material-story h2 { margin: 0; font-size: clamp(2.3rem, 3.6vw, 3.3rem); }
.material-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; color: var(--ink-soft); }
.material-columns p { margin-top: 0; }

/* Elenchi sulla scheda prodotto: qui sono specifiche, non un discorso. Righe divise da un
   filo, come la tabella dei dettagli che sta subito sopra, e nessun punto elenco: in una
   colonna stretta il rientro del pallino ruba larghezza a voci che vanno già a capo. */
.material-columns :is(ul, ol),
.product-accordions details > div :is(ul, ol) {
  margin: .4rem 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line);
}
.material-columns :is(ul, ol) > li,
.product-accordions details > div :is(ul, ol) > li {
  padding: .5rem 0;
  border-bottom: 1px solid var(--line);
}
/* La descrizione è impaginata su due colonne strette: una voce di elenco è una frase
   lunga, in 200px andrebbe a capo quattro volte. Gli elenchi prendono tutta la riga. */
.material-columns > :is(ul, ol) { grid-column: 1 / -1; }
.material-columns ol,
.product-accordions details > div ol { counter-reset: lasacca-spec; }
.material-columns ol > li::before,
.product-accordions details > div ol > li::before {
  counter-increment: lasacca-spec;
  content: counter(lasacca-spec, decimal-leading-zero);
  margin-right: .6rem;
  color: var(--clay);
  font-family: var(--font-ui);
  font-size: .72em;
  font-weight: 750;
}
.related { border-top: 1px solid var(--line); }
.product-grid-related .product-card { grid-column: span 4; }
.toast { position: fixed; z-index: 120; right: 1.25rem; bottom: 1.25rem; padding: 1rem 1.25rem; color: var(--paper); background: var(--blue-deep); box-shadow: var(--shadow-soft); }

/* ---------- Pagina bottega ---------- */

main.atelier-page { overflow-x: clip; }
.atelier-hero {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(520px, 1.08fr);
  min-height: min(760px, calc(100vh - 117px));
  background: var(--paper-deep);
}
.atelier-hero-image {
  min-height: 660px;
  background-image: linear-gradient(0deg, oklch(18% .02 55 / .08), transparent 55%), var(--atelier-hero-image);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.atelier-hero-copy { align-self: center; padding: clamp(3rem, 7vw, 7rem); }
.atelier-hero-copy h1 { max-width: 12ch; margin-bottom: 1.6rem; }
.atelier-lead { max-width: 56ch; margin: 0 0 2rem; color: var(--ink-soft); font-size: 1.08rem; }
.atelier-hero-actions { display: flex; align-items: center; gap: 1.4rem; flex-wrap: wrap; }
.atelier-facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin: clamp(3rem, 6vw, 5rem) 0 0;
  padding-top: 1.25rem;
  border-top: 1px solid var(--line);
}
.atelier-facts div { min-width: 0; }
.atelier-facts dt { color: var(--ink-soft); font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.atelier-facts dd { margin: .35rem 0 0; font-family: var(--font-display); font-size: 1.1rem; font-weight: 400; }

.atelier-intro { padding-top: clamp(5rem, 10vw, 10rem); padding-bottom: clamp(5rem, 10vw, 10rem); }
.atelier-intro-grid { display: grid; grid-template-columns: 1.05fr .75fr; gap: clamp(3rem, 10vw, 9rem); align-items: start; }
.atelier-intro-grid h2 { max-width: 13ch; margin: 0; }
.atelier-intro-grid > div { max-width: 62ch; color: var(--ink-soft); }
.atelier-intro-grid > div p:first-child { margin-top: .3rem; color: var(--ink); font-size: 1.08rem; }

.atelier-timeline {
  display: grid;
  grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr);
  gap: clamp(3rem, 8vw, 8rem);
  padding: clamp(5rem, 9vw, 9rem) var(--gutter);
  color: var(--paper);
  background: var(--blue-deep);
}
.atelier-timeline-heading { align-self: start; position: sticky; top: 2rem; }
.atelier-timeline-heading .eyebrow { color: var(--clay); }
.atelier-timeline-heading h2 { margin: 0; font-size: clamp(2.4rem, 3.5vw, 4rem); }
.timeline-list { margin: 0; padding: 0; list-style: none; }
.timeline-list li {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 2rem;
  padding: 2rem 0 2.5rem;
  border-top: 1px solid color-mix(in oklch, var(--paper) 20%, transparent);
}
.timeline-list li:last-child { border-bottom: 1px solid color-mix(in oklch, var(--paper) 20%, transparent); }
.timeline-list > li > span { color: var(--clay); font-family: var(--font-ui); font-size: .82rem; font-weight: 750; letter-spacing: .1em; }
.timeline-list h3 { margin: 0 0 .7rem; color: var(--paper); font-size: 1.45rem; letter-spacing: -.025em; }
.timeline-list p { max-width: 54ch; margin: 0; color: color-mix(in oklch, var(--paper) 72%, transparent); }

.atelier-history { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(420px, .9fr); background: var(--paper-deep); }
.atelier-history-image { min-height: 700px; }
.atelier-history-image img { width: 100%; height: 100%; object-fit: cover; }
.atelier-history-copy { align-self: center; padding: clamp(3rem, 7vw, 7rem); }
.atelier-history-copy h2 { max-width: 12ch; font-size: clamp(2.4rem, 3.4vw, 4rem); }
.atelier-history-copy p { max-width: 58ch; color: var(--ink-soft); }
.atelier-history-copy .lead { color: var(--ink); font-size: 1.08rem; }

.atelier-offer {
  display: grid;
  grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr);
  gap: clamp(3rem, 8vw, 8rem);
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(5rem, 10vw, 10rem) var(--gutter);
}
.atelier-offer-heading h2 { max-width: 9ch; font-size: clamp(2.4rem, 3.5vw, 4rem); }
.atelier-offer-heading > p:last-child { max-width: 34ch; color: var(--ink-soft); }
.offer-list > div {
  display: grid;
  grid-template-columns: 46px minmax(180px, .7fr) minmax(220px, 1fr);
  gap: 1.5rem;
  align-items: start;
  padding: 1.7rem 0;
  border-top: 1px solid var(--line);
}
.offer-list > div:last-child { border-bottom: 1px solid var(--line); }
.offer-list span { color: var(--clay); font-size: .66rem; font-weight: 750; }
.offer-list h3 { margin: 0; line-height: 1.25; }
.offer-list p { margin: 0; color: var(--ink-soft); }

.atelier-trust { display: grid; grid-template-columns: .85fr .75fr .55fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; border-top: 1px solid var(--line); }
.atelier-trust h2 { max-width: 11ch; font-size: clamp(2.4rem, 3.5vw, 4rem); }
.atelier-trust-copy { color: var(--ink-soft); }
.atelier-trust-copy p:first-child { margin-top: .2rem; color: var(--ink); }
.atelier-promise { padding: 1.5rem; color: var(--paper); background: var(--blue-deep); }
.atelier-promise span { display: block; margin-bottom: 2.5rem; color: var(--clay); font-size: .66rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.atelier-promise strong { font-family: var(--font-display); font-size: 1.5rem; font-weight: 400; line-height: 1.25; }

.atelier-visit {
  display: grid;
  grid-template-columns: 1fr .65fr .65fr;
  gap: clamp(2rem, 7vw, 7rem);
  align-items: end;
  padding: clamp(4rem, 8vw, 8rem) var(--gutter);
  background: var(--paper-deep);
}
.atelier-visit h2 { max-width: 10ch; margin-bottom: 0; font-size: clamp(2.4rem, 3.5vw, 4rem); }
.atelier-visit address { font-style: normal; }
.atelier-visit address p { margin-top: 0; font-family: var(--font-display); font-size: 1.3rem; font-weight: 400; }
.atelier-visit address a { display: block; text-decoration: underline; text-underline-offset: 4px; }
.atelier-visit-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; }

/* ---------- Contenuto editoriale ---------- */

.page-hero { max-width: var(--max); margin: 0 auto; padding: clamp(1rem, 3vw, 1rem) var(--gutter) 0; }
.page-hero h1 { max-width: 18ch; }

/* Le descrizioni di categoria sono testi SEO da duemila caratteri: tre righe e il resto
   dietro un accordion, altrimenti la griglia parte sotto la piega. */
.term-description { max-width: 78ch; margin-top: 1rem; color: var(--ink-soft); }
.term-description p { margin: 0 0 .8rem; }
.term-description p:last-child { margin-bottom: 0; }
.term-description.is-clamped .term-description__text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
}
.term-description__toggle {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin-top: .7rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}
/* display esplicito batte quello dello user agent: senza questa riga [hidden] non nasconde. */
.term-description__toggle[hidden] { display: none; }
.term-description__toggle::after { content: "+"; font-size: 1.15rem; line-height: 1; }
.term-description__toggle[aria-expanded="true"]::after { content: "\2212"; }
.entry-content { max-width: 68ch; margin: 0 auto; padding: clamp(2.5rem, 5vw, 2rem) var(--gutter) clamp(5rem, 9vw, 9rem); }
.entry-content > * + * { margin-top: 1.25rem; }
.entry-content h2 { margin-top: 3rem; font-size: clamp(1.7rem, 2.6vw, 2.3rem); }
.entry-content h3 { margin-top: 2.25rem; font-size: 1.25rem; }
/* .text-link ha già il proprio bordo inferiore: sottolinearlo aggiungerebbe un secondo
   tratto. Esclusi qui, non nei singoli blocchi, perché questa regola li batte tutti per
   specificità (0,2,1). */
.entry-content a:not(.button):not(.text-link) { text-decoration: underline; text-underline-offset: 3px; }
/* Elenchi di pagina: sono testo che si legge, quindi il segno sta fuori dalla colonna e
   il blocco resta allineato ai paragrafi sopra e sotto. La regola prende gli elenchi
   scritti nell'editor, non quelli dei componenti del tema, che hanno una classe propria e
   un layout proprio (orari, social, timeline). */
.entry-content :is(ul, ol):not([class]),
.entry-content :is(ul, ol).wp-block-list {
  margin: 1.25rem 0;
  padding-left: 0;
  list-style: none;
}
.entry-content :is(ul, ol):not([class]) > li,
.entry-content :is(ul, ol).wp-block-list > li {
  position: relative;
  padding-left: 1.6rem;
}
.entry-content li + li { margin-top: .45rem; }
/* Voci scritte come paragrafi: senza questo il segno resta in alto e il testo scende. */
.entry-content li > p:first-child { margin-top: 0; }
.entry-content li > p:last-child { margin-bottom: 0; }
.entry-content ul:not([class]) > li::before,
.entry-content ul.wp-block-list > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .72em;
  width: 9px;
  height: 1px;
  background: var(--clay);
}
/* Secondo livello: cerchio vuoto, la gerarchia si vede senza aggiungere un colore. */
.entry-content ul:not([class]) ul > li::before {
  top: .58em;
  width: 5px;
  height: 5px;
  border: 1px solid var(--clay);
  border-radius: 50%;
  background: transparent;
}
/* Numerati con lo zero davanti, come l'elenco numerato dei blocchi. */
.entry-content ol:not([class]),
.entry-content ol.wp-block-list { counter-reset: lasacca-ol; }
.entry-content ol:not([class]) > li,
.entry-content ol.wp-block-list > li { padding-left: 2.2rem; }
.entry-content ol:not([class]) > li::before,
.entry-content ol.wp-block-list > li::before {
  counter-increment: lasacca-ol;
  content: counter(lasacca-ol, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: .12em;
  color: var(--clay);
  font-family: var(--font-ui);
  font-size: .74rem;
  font-weight: 750;
  letter-spacing: .06em;
}
.entry-content blockquote { margin: 2rem 0; padding-left: 1.5rem; border-left: 2px solid var(--clay); color: var(--ink-soft); font-size: 1.08rem; }
.entry-content table { width: 100%; border-collapse: collapse; }
.entry-content th, .entry-content td { padding: .7rem; border-bottom: 1px solid var(--line); text-align: left; }
.entry-content figure { margin: 2rem 0; }
.entry-content figcaption { margin-top: .5rem; color: var(--ink-soft); font-size: .78rem; }
.alignwide { width: min(var(--max), 100%); margin-left: auto; margin-right: auto; }
.alignfull { width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); max-width: none; }
.aligncenter { margin-left: auto; margin-right: auto; }

.post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: clamp(2rem, 4vw, 3rem); }
.post-card-image { display: block; overflow: hidden; aspect-ratio: 4 / 3; background: var(--paper-deep); }
.post-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease-out); }
.post-card-image:hover img { transform: scale(1.035); }
.post-card h2 { margin: 1rem 0 .5rem; font-size: 1.35rem; }
.post-card time { color: var(--ink-soft); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.post-card p { margin: .6rem 0 0; color: var(--ink-soft); font-size: .88rem; }

.pagination { display: flex; justify-content: center; gap: .5rem; flex-wrap: wrap; margin-top: clamp(3rem, 6vw, 5rem); }
.pagination .page-numbers {
  display: grid;
  place-items: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0 .5rem;
  border: 1px solid var(--line);
  font-family: var(--font-ui);
  font-size: .8rem;
  font-weight: 700;
}
.pagination .page-numbers.current,
.pagination a.page-numbers:hover { color: var(--paper); background: var(--ink); border-color: var(--ink); }

.error-404 { display: grid; place-items: center; min-height: 60vh; padding: clamp(4rem, 8vw, 8rem) var(--gutter); text-align: center; }
.error-404 h1 { font-size: clamp(3rem, 10vw, 7rem); }
.error-404 p { max-width: 44ch; margin: 0 auto 2rem; color: var(--ink-soft); }

/* ---------- Responsive ---------- */

@media (max-width: 1000px) {
  .desktop-nav { display: none; }
  .menu-button { display: grid; }
  .nav-shell { grid-template-columns: 1fr auto; min-height: 76px; }
  .hero { min-height: min(720px, calc(100vh - 107px)); }
  .hero-content { margin: clamp(1rem, 4vw, 2.5rem); }
  .product-card { grid-column: span 6; }
  .product-card-featured { grid-column: span 12; }
  .craft-story { grid-template-columns: 1fr 1fr; }
  .story-values { grid-column: 1 / -1; flex-direction: row; border-left: 0; border-top: 1px solid var(--line); }
  .story-values div { writing-mode: initial; transform: none; }
  .product-detail { grid-template-columns: 1fr; }
  .product-info { position: static; }
  .material-story { grid-template-columns: 1fr 1.5fr; }
  .material-columns { grid-column: 2; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .atelier-hero { grid-template-columns: 1fr; }
  .atelier-hero-image { min-height: 60vh; }
  .atelier-hero-copy { padding: 4rem clamp(1.25rem, 7vw, 5rem); }
  .atelier-timeline, .atelier-offer { grid-template-columns: 1fr; }
  .atelier-timeline-heading { position: static; }
  .atelier-history { grid-template-columns: 1fr; }
  .atelier-history-image { min-height: 60vh; }
  .atelier-trust { grid-template-columns: 1fr 1fr; }
  .atelier-promise { grid-column: 1 / -1; }
  .atelier-visit { grid-template-columns: 1fr 1fr; }
  .atelier-visit-actions { grid-column: 1 / -1; flex-direction: row; align-items: center; }
}

@media (max-width: 680px) {
  .utility-bar a { display: none; }
  .nav-shell { min-height: 68px; }
  .brand { width: 142px; }
  .hero { min-height: min(690px, calc(100svh - 99px)); }
  .hero::after {
    background:
      linear-gradient(0deg, oklch(17% .025 250 / .82) 0%, oklch(17% .025 250 / .42) 48%, transparent 82%),
      linear-gradient(90deg, oklch(17% .025 250 / .18), transparent 75%);
  }
  .hero-content { width: auto; margin: 0; padding: 2.5rem 1.25rem 2.75rem; }
  .hero-content h1 { font-size: clamp(2rem, 8vw, 2.3rem); }
  .hero-note { display: none; }
  .category-strip { justify-content: flex-start; }
  .section-heading, .section-heading.compact { grid-template-columns: 1fr; gap: 1.25rem; }
  .section-heading.compact > a { justify-self: start; }
  .product-grid { gap: 2.5rem .75rem; }
  .product-card, .product-grid-related .product-card { grid-column: span 6; }
  .product-card-featured { grid-column: span 12; }
  .product-meta { display: block; }
  .product-meta .price { margin-top: .4rem; }
  .craft-story { grid-template-columns: 1fr; }
  .story-image { min-height: 72vh; }
  .story-copy { padding: 3.5rem 1.25rem; }
  .story-values { overflow-x: auto; justify-content: flex-start; gap: 3rem; padding: 1.25rem; }
  .story-values div { min-width: 115px; padding: .75rem 0; }
  .story-values strong { display: block; }
  .service-band { grid-template-columns: 1fr; }
  .service-band > div { padding: 2rem 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .service-band > div:last-child { border-bottom: 0; }
  .footer-main { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom { display: block; }
  .footer-bottom ul { margin-top: .75rem; }
  .search-form { display: block; }
  .search-form input { margin-bottom: .75rem; }
  .search-form .button { width: 100%; }

  .breadcrumbs { white-space: nowrap; overflow-x: auto; flex-wrap: nowrap; }
  .product-gallery { padding: .75rem; }
  .product-main-image img { height: 118vw; }
  .gallery-tools p { display: none; }
  .gallery-tools { justify-content: flex-end; }
  .product-info { padding: 3.5rem 1.1rem; }
  .product-info h1 { font-size: clamp(2rem, 8.5vw, 2.45rem); }
  .product-assurances { grid-template-columns: 1fr; }
  .size-picker { grid-template-columns: auto auto; }
  .size-picker p { grid-column: 1 / -1; justify-self: start; }
  .purchase-row { grid-template-columns: 1fr; }
  .quantity { grid-template-columns: repeat(3, 1fr); }
  .material-story { grid-template-columns: 1fr; }
  .material-columns { grid-column: 1; grid-template-columns: 1fr; gap: .5rem; }
  .atelier-hero-image { min-height: 56vh; background-position: 45% center; }
  .atelier-hero-copy { padding: 3rem 1.1rem; }
  .atelier-hero-copy h1 { font-size: clamp(2rem, 8.5vw, 2.45rem); }
  .atelier-lead { font-size: .98rem; }
  .atelier-facts { grid-template-columns: 1fr 1fr; }
  .atelier-facts div:last-child { grid-column: 1 / -1; }
  .atelier-intro-grid { grid-template-columns: 1fr; gap: 2rem; }
  .atelier-timeline { padding: 4rem 1.1rem; }
  .timeline-list li { grid-template-columns: 62px 1fr; gap: 1rem; }
  .atelier-history-image { min-height: 62vh; }
  .atelier-history-copy { padding: 3.5rem 1.1rem; }
  .atelier-offer { padding: 4.5rem 1.1rem; }
  .offer-list > div { grid-template-columns: 36px 1fr; gap: .8rem 1rem; }
  .offer-list p { grid-column: 2; }
  .atelier-trust { grid-template-columns: 1fr; padding: 4.5rem 1.1rem; }
  .atelier-promise { grid-column: auto; }
  .atelier-visit { grid-template-columns: 1fr; padding: 4rem 1.1rem; }
  .atelier-visit-actions { grid-column: auto; flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
