/* ============================================================
   Havana Event Rentals — Design System
   Brand tokens verified from /brand source files.
   Multi-tenant: theme values are also injected from data.js
   (window.TENANT.theme) onto :root, so a new tenant only
   swaps the config — no CSS edits required.
   ============================================================ */

:root{
  --olive:#444434; --olive-deep:#33331f; --sand:#DAC3A8; --sand-soft:#e7d8c2;
  --terracotta:#C16D45; --terracotta-deep:#a85a36; --terracotta-deeper:#8f4c2e; --sea-blue:#7E8F9B;
  /* --terracotta-deep is the WCAG-AA-safe terracotta (5.0:1 on white, 4.7:1 on cream)
     used for white-on-terracotta buttons and terracotta text on light backgrounds.
     The bright --terracotta swatch is reserved for decorative fills/strokes (no text). */
  --cream:#FAF7F4; --gold:#8C7850; --brown-deep:#3C3214; --ink:#2E2E22;
  --line:#e3d9c6; --shadow:0 14px 40px rgba(60,50,20,.12);
  --shadow-sm:0 6px 18px rgba(60,50,20,.10);
  --font-head:"Cinzel", Georgia, serif;
  --font-body:"Montserrat", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --font-script:"La Tua Script","Sacramento", cursive;
  --radius:14px; --radius-sm:10px; --maxw:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:var(--font-body); color:var(--ink);
  background:var(--cream); line-height:1.6; -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button{font-family:inherit; cursor:pointer}
h1,h2,h3,h4{font-family:var(--font-head); color:var(--olive); font-weight:600; line-height:1.18; margin:0 0 .5em}
h1{font-size:clamp(2rem,6vw,3.6rem); letter-spacing:.02em}
h2{font-size:clamp(1.5rem,4vw,2.4rem); letter-spacing:.03em}
h3{font-size:1.2rem; letter-spacing:.04em}
p{margin:0 0 1rem}
.script{font-family:var(--font-script); color:var(--gold); font-weight:400}
.eyebrow{font-family:var(--font-body); text-transform:uppercase; letter-spacing:.35em;
  font-size:.72rem; color:var(--gold); font-weight:600; margin-bottom:.6rem}
.container{max-width:var(--maxw); margin:0 auto; padding:0 22px}
.section{padding:72px 0}
.section.tight{padding:48px 0}
.center{text-align:center}
.muted{color:#6f6a5b}
.bg-sand{background:var(--sand-soft)}
.bg-olive{background:var(--olive); color:#f3efe6}
.bg-olive h1,.bg-olive h2,.bg-olive h3{color:#fff}

/* buttons */
.btn{display:inline-flex; align-items:center; gap:.5rem; border:none; border-radius:999px;
  padding:.85rem 1.6rem; font-weight:600; font-size:.92rem; letter-spacing:.02em;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--terracotta-deep); color:#fff; box-shadow:var(--shadow-sm)}
.btn-primary:hover{background:var(--terracotta-deeper)}
.btn-olive{background:var(--olive); color:#fff}
.btn-olive:hover{background:var(--olive-deep)}
.btn-ghost{background:transparent; color:var(--olive); border:1.5px solid var(--olive)}
.btn-ghost:hover{background:var(--olive); color:#fff}
.btn-light{background:#fff; color:var(--olive)}
.btn-block{width:100%; justify-content:center}
.btn-sm{padding:.55rem 1rem; font-size:.82rem}
.btn[disabled]{opacity:.5; cursor:not-allowed; transform:none}

/* accessibility: visible keyboard focus (does not affect mouse users) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,[tabindex]:focus-visible,.chip:focus-visible,.radio-card:focus-visible{
  outline:3px solid var(--terracotta-deep); outline-offset:2px; border-radius:6px}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{
  outline-offset:0; border-color:var(--terracotta-deep)}
/* on the dark availability bar / olive sections, use a light focus ring for contrast */
.avail-bar a:focus-visible,.avail-bar button:focus-visible,.avail-bar input:focus-visible,
.avail-bar select:focus-visible,.bg-olive a:focus-visible,.bg-olive button:focus-visible,
.site-footer a:focus-visible,.modal-head button:focus-visible{
  outline:3px solid #f0d9b8; outline-offset:2px}

/* header */
.site-header{position:sticky; top:0; z-index:60; background:rgba(250,247,244,.92);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
.nav{display:flex; align-items:center; justify-content:space-between; height:74px}
.brand{display:flex; align-items:center; gap:.7rem}
.brand .mark{width:42px; height:42px; border-radius:50%; border:1.5px solid var(--gold);
  display:grid; place-items:center; color:var(--gold); background:#fff}
.brand-name{font-family:var(--font-head); font-size:1.25rem; letter-spacing:.18em; color:var(--olive); line-height:1}
.brand-sub{font-size:.6rem; letter-spacing:.4em; text-transform:uppercase; color:var(--gold)}
.nav-links{display:flex; align-items:center; gap:1.6rem; list-style:none; margin:0; padding:0}
.nav-links a{font-size:.86rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink); font-weight:500}
.nav-links a:hover,.nav-links a.active{color:var(--terracotta-deep)}
.nav-actions{display:flex; align-items:center; gap:.8rem}
.cart-btn{position:relative; background:var(--olive); color:#fff; border-radius:999px;
  padding:.6rem 1.05rem; font-weight:600; font-size:.85rem; display:inline-flex; gap:.45rem; align-items:center}
.cart-count{background:var(--terracotta-deep); color:#fff; border-radius:999px; font-size:.7rem;
  min-width:20px; height:20px; display:grid; place-items:center; padding:0 5px}
.menu-toggle{display:none; background:none; border:none; color:var(--olive)}

/* hero */
.hero{position:relative; min-height:88vh; display:flex; align-items:center; color:#fff;
  background:linear-gradient(180deg, rgba(40,40,30,.30), rgba(40,40,30,.55)), var(--hero-grad);
  text-align:center}
.hero .container{padding-top:60px; padding-bottom:60px}
.hero h1{color:#fff; text-shadow:0 2px 18px rgba(0,0,0,.25)}
.hero .lead{font-size:clamp(1rem,2.2vw,1.25rem); max-width:620px; margin:1rem auto 1.8rem; color:#f4efe6}
.hero-cta{display:flex; gap:.9rem; justify-content:center; flex-wrap:wrap}
.hero .script{font-size:clamp(1.8rem,5vw,2.8rem); display:block; margin-bottom:.2rem; color:#f0d9b8}

/* grids & cards */
.grid{display:grid; gap:24px}
.cols-3{grid-template-columns:repeat(3,1fr)}
.cols-4{grid-template-columns:repeat(4,1fr)}
.cols-2{grid-template-columns:repeat(2,1fr)}
.card{background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .18s ease, box-shadow .18s ease;
  display:flex; flex-direction:column}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow)}
.card .thumb{aspect-ratio:4/3; position:relative; display:block; background:var(--sand-soft); overflow:hidden}
.card .thumb img{width:100%; height:100%; object-fit:cover; display:block}
.card .body{padding:16px 16px 18px; display:flex; flex-direction:column; gap:.35rem; flex:1}
.card .body h3{margin:0; font-size:1.02rem}
.card .desc{font-size:.84rem; color:#6f6a5b; flex:1}
.card .row{display:flex; align-items:center; justify-content:space-between; margin-top:.5rem}
.price{font-weight:700; color:var(--terracotta-deep); font-size:1.02rem}
.price small{font-weight:500; color:#8a8676; font-size:.72rem}
.badge{font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; font-weight:700;
  padding:.2rem .5rem; border-radius:999px; background:var(--sand-soft); color:var(--olive)}
.badge.premium{background:var(--gold); color:#fff}

/* collection tiles */
.tile{position:relative; border-radius:var(--radius); overflow:hidden; min-height:230px;
  display:flex; align-items:flex-end; color:#fff; box-shadow:var(--shadow-sm)}
.tile .veil{position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0),rgba(40,40,30,.62))}
.tile .label{position:relative; padding:18px 20px}
.tile h3{color:#fff; margin:0; font-size:1.2rem}
.tile .count{font-size:.78rem; color:#eadfce}
.tile:hover{transform:translateY(-4px)}

/* category filter */
.filters{display:flex; gap:.6rem; flex-wrap:wrap; justify-content:center; margin-bottom:28px}
.chip{border:1.5px solid var(--line); background:#fff; color:var(--olive); border-radius:999px;
  padding:.5rem 1.1rem; font-size:.84rem; font-weight:600; letter-spacing:.02em}
.chip.active{background:var(--olive); color:#fff; border-color:var(--olive)}
.toolbar{display:flex; gap:14px; align-items:center; justify-content:center; flex-wrap:wrap; margin-bottom:18px}
.date-field{display:flex; align-items:center; gap:.5rem; background:#fff; border:1px solid var(--line);
  border-radius:999px; padding:.45rem .9rem; font-size:.85rem}
.date-field input{border:none; font-family:inherit; font-size:.85rem; color:var(--ink); background:transparent}

/* qty stepper */
.qty{display:inline-flex; align-items:center; border:1px solid var(--line); border-radius:999px; overflow:hidden}
.qty button{width:32px; height:32px; border:none; background:#fff; color:var(--olive); font-size:1.1rem; line-height:1}
.qty button:hover{background:var(--sand-soft)}
.qty span{min-width:30px; text-align:center; font-weight:600; font-size:.9rem}

/* steps (how it works) */
.steps{counter-reset:step}
.step{display:flex; gap:18px; align-items:flex-start; padding:18px 0; border-bottom:1px dashed var(--line)}
.step:last-child{border-bottom:none}
.step .num{counter-increment:step; flex:0 0 auto; width:46px; height:46px; border-radius:50%;
  background:var(--olive); color:#fff; font-family:var(--font-head); display:grid; place-items:center; font-size:1.2rem}
.step .num::before{content:counter(step)}

/* cart drawer */
.overlay{position:fixed; inset:0; background:rgba(40,40,30,.45); opacity:0; visibility:hidden;
  transition:.25s; z-index:90}
.overlay.open{opacity:1; visibility:visible}
.drawer{position:fixed; top:0; right:0; height:100%; width:min(420px,92vw); background:var(--cream);
  z-index:100; transform:translateX(100%); transition:transform .28s ease; display:flex; flex-direction:column;
  box-shadow:-20px 0 60px rgba(0,0,0,.18)}
.drawer.open{transform:translateX(0)}
.drawer header{padding:20px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center}
.drawer header h3{margin:0}
.drawer .items{flex:1; overflow:auto; padding:14px 20px}
.drawer .foot{padding:18px 20px; border-top:1px solid var(--line); background:#fff}
.line-item{display:flex; gap:12px; padding:12px 0; border-bottom:1px solid var(--line)}
.line-item .li-thumb{width:62px; height:54px; border-radius:8px; flex:0 0 auto}
.line-item .li-main{flex:1}
.line-item .li-name{font-weight:600; font-size:.9rem}
.line-item .li-meta{font-size:.78rem; color:#7a7565}
.icon-btn{background:none; border:none; color:#a59c87; font-size:.95rem}
.icon-btn:hover{color:var(--terracotta-deep)}
.summary-row{display:flex; justify-content:space-between; font-size:.9rem; margin:.25rem 0}
.summary-row.total{font-weight:700; font-size:1.05rem; color:var(--olive); margin-top:.5rem}
.empty{ text-align:center; color:#8a8676; padding:40px 10px}

/* modal (booking flow) */
.modal{position:fixed; inset:0; z-index:110; display:none; align-items:flex-start; justify-content:center;
  padding:30px 16px; overflow:auto; background:rgba(40,40,30,.5)}
.modal.open{display:flex}
.modal-card{background:var(--cream); border-radius:var(--radius); width:min(640px,100%); box-shadow:var(--shadow);
  overflow:hidden; margin:auto}
.modal-head{background:var(--olive); color:#fff; padding:18px 22px; display:flex; justify-content:space-between; align-items:center}
.modal-head h3{color:#fff; margin:0}
.modal-body{padding:22px}
.progress{display:flex; gap:6px; padding:0 22px; margin-top:16px}
.progress .seg{flex:1; height:5px; border-radius:3px; background:#d8cdbb}
.progress .seg.done{background:var(--terracotta)}
.field{margin-bottom:14px}
.field label{display:block; font-size:.78rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
  color:var(--olive); margin-bottom:.35rem}
.field input,.field select,.field textarea{width:100%; padding:.7rem .85rem; border:1px solid var(--line);
  border-radius:var(--radius-sm); font-family:inherit; font-size:.92rem; background:#fff; color:var(--ink)}
.field textarea{min-height:80px; resize:vertical}
.field .hint{font-size:.74rem; color:#8a8676; margin-top:.3rem}
.two{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.radio-cards{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.radio-card{border:1.5px solid var(--line); border-radius:var(--radius-sm); padding:14px; background:#fff; cursor:pointer}
.radio-card.sel{border-color:var(--terracotta); box-shadow:0 0 0 3px rgba(193,109,69,.15)}
.radio-card strong{display:block; color:var(--olive)}
.radio-card span{font-size:.78rem; color:#7a7565}
.check{display:flex; gap:.6rem; align-items:flex-start; font-size:.86rem; margin-bottom:.7rem}
.check input{margin-top:.25rem}
.review-box{background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); padding:16px; margin-bottom:14px}
.review-box h4{font-family:var(--font-body); text-transform:uppercase; letter-spacing:.1em; font-size:.72rem;
  color:var(--gold); margin:0 0 .5rem}
.modal-foot{display:flex; justify-content:space-between; gap:12px; margin-top:8px}
.notice{background:var(--sand-soft); border-left:3px solid var(--gold); padding:12px 14px; border-radius:8px;
  font-size:.82rem; color:#5f5947; margin-bottom:14px}
.confirm-icon{width:74px; height:74px; border-radius:50%; background:var(--olive); color:#fff;
  display:grid; place-items:center; margin:6px auto 16px; font-size:2rem}

/* footer */
.site-footer{background:var(--olive); color:#e7e2d6; padding:54px 0 26px; margin-top:40px}
.site-footer h4{color:#fff; font-family:var(--font-body); text-transform:uppercase; letter-spacing:.14em; font-size:.78rem; margin-bottom:1rem}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:34px}
.site-footer a{color:#cfc8b8; font-size:.88rem; line-height:2}
.site-footer a:hover{color:#fff}
.footer-brand .brand-name{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15); margin-top:34px; padding-top:18px;
  font-size:.76rem; color:#b3ab98; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px}

/* misc */
.split{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center}
.media{aspect-ratio:4/3; border-radius:var(--radius); box-shadow:var(--shadow-sm)}
.list-check{list-style:none; padding:0; margin:0}
.list-check li{padding:.4rem 0 .4rem 1.6rem; position:relative}
.list-check li::before{content:"✦"; position:absolute; left:0; color:var(--terracotta-deep)}
.pill-note{display:inline-block; background:var(--sand-soft); color:var(--olive); border-radius:999px;
  padding:.3rem .9rem; font-size:.76rem; font-weight:600; letter-spacing:.04em}
.toast{position:fixed; bottom:22px; left:50%; transform:translateX(-50%) translateY(120%);
  background:var(--olive); color:#fff; padding:.8rem 1.3rem; border-radius:999px; font-size:.86rem;
  box-shadow:var(--shadow); transition:transform .3s ease; z-index:130}
.toast.show{transform:translateX(-50%) translateY(0)}

/* hero brand name */
.hero-brand{font-family:var(--font-head); letter-spacing:.45em; text-transform:uppercase;
  font-size:clamp(.85rem,2.5vw,1.2rem); color:#f0d9b8; margin:0 0 .5rem; font-weight:600;
  text-shadow:0 2px 14px rgba(0,0,0,.25)}

/* availability banner (shown on every page, sticky under the header) */
.avail-bar{position:sticky; top:74px; z-index:55; background:var(--olive); color:#f3efe6;
  border-bottom:1px solid rgba(255,255,255,.12)}
.avail-inner{display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:11px 22px}
.avail-bar .lbl{font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:#e7dcc4; font-weight:700}
.avail-bar input,.avail-bar select{border:1px solid rgba(255,255,255,.28); background:rgba(255,255,255,.10);
  color:#fff; border-radius:999px; padding:.42rem .8rem; font-family:inherit; font-size:.84rem}
.avail-bar input::-webkit-calendar-picker-indicator{filter:invert(1) opacity(.7)}
.avail-bar select option{color:#2e2e22}
.avail-bar .ab-btn{background:var(--terracotta-deep); color:#fff; border:none; border-radius:999px;
  padding:.46rem 1.1rem; font-weight:600; font-size:.84rem; cursor:pointer}
.avail-bar .ab-btn:hover{background:var(--terracotta-deeper)}
.avail-bar .ab-status{font-size:.82rem; color:#f0d9b8; margin-left:auto}
.card .avail{font-size:.76rem; font-weight:700; margin-top:.15rem}
.avail.ok{color:#2f6b46} .avail.low{color:var(--terracotta-deep)} .avail.none{color:#8a3319}
.card.is-unavailable{opacity:.62}

/* nav collapses to a menu on tablet + phone (prevents overflow ~640-860px) */
@media (max-width:860px){
  .nav-links{position:fixed; inset:74px 0 auto 0; background:var(--cream); flex-direction:column;
    gap:0; border-bottom:1px solid var(--line); padding:10px 22px; display:none; box-shadow:var(--shadow-sm)}
  .nav-links.open{display:flex}
  .nav-links li{width:100%; border-bottom:1px solid var(--line)}
  .nav-links a{display:block; padding:14px 0}
  .menu-toggle{display:block}
}

/* responsive */
@media (max-width:900px){
  .cols-4{grid-template-columns:repeat(2,1fr)}
  .cols-3{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr}
}
@media (max-width:640px){
  .nav-links{position:fixed; inset:74px 0 auto 0; background:var(--cream); flex-direction:column;
    gap:0; border-bottom:1px solid var(--line); padding:10px 22px; display:none}
  .nav-links.open{display:flex}
  .nav-links li{width:100%; border-bottom:1px solid var(--line)}
  .nav-links a{display:block; padding:14px 0}
  .menu-toggle{display:block}
  .cols-4,.cols-3,.cols-2,.two,.radio-cards,.footer-grid{grid-template-columns:1fr}
  .section{padding:52px 0}
  .hero{min-height:80vh}
}

/* ============================ PRODUCT DETAIL ============================ */
.crumb{font-size:.82rem; color:#7a7565; margin:0 0 18px; letter-spacing:.02em}
.crumb a{color:var(--terracotta-deep); font-weight:600}
.crumb a:hover{text-decoration:underline}
.pd{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start}
.pd h1{font-size:clamp(1.6rem,4vw,2.4rem); margin:.4rem 0}
.pd .specs{width:100%; border-collapse:collapse; margin:18px 0; font-size:.88rem}
.pd .specs th{text-align:left; color:var(--olive); font-family:var(--font-body); font-weight:600;
  width:38%; padding:.55rem 0; border-bottom:1px solid var(--line); vertical-align:top}
.pd .specs td{padding:.55rem 0; border-bottom:1px solid var(--line); color:#5f5947}
.qtyrow{display:flex; align-items:center; gap:12px; margin:18px 0 10px; flex-wrap:wrap}

/* product image gallery */
.pd-gallery{display:flex; flex-direction:column; gap:12px}
.pd-gallery .media{aspect-ratio:4/3; background:var(--sand-soft); overflow:hidden; padding:0}
.pd-gallery .media img{width:100%; height:100%; object-fit:cover}
.gal-main{display:block; width:100%; height:100%; padding:0; border:none; background:none; cursor:zoom-in}
.gal-main img{width:100%; height:100%; object-fit:cover}
.gal-thumbs{display:flex; gap:10px; flex-wrap:wrap}
.gal-thumb{width:72px; height:60px; border-radius:8px; overflow:hidden; padding:0; border:2px solid transparent;
  background:var(--sand-soft); cursor:pointer}
.gal-thumb img{width:100%; height:100%; object-fit:cover}
.gal-thumb.active{border-color:var(--terracotta-deep)}

/* lightbox */
.lightbox{position:fixed; inset:0; z-index:200; background:rgba(30,28,20,.92);
  display:flex; align-items:center; justify-content:center; padding:40px}
.lightbox .lb-img{max-width:92vw; max-height:86vh; width:auto; height:auto; border-radius:8px;
  box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lightbox .lb-close{position:absolute; top:18px; right:22px; background:rgba(255,255,255,.14);
  color:#fff; border:none; width:44px; height:44px; border-radius:50%; font-size:1.3rem}
.lightbox .lb-close:hover{background:rgba(255,255,255,.28)}
.lightbox .lb-nav{position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.14);
  color:#fff; border:none; width:52px; height:52px; border-radius:50%; font-size:2rem; line-height:1}
.lightbox .lb-nav:hover{background:rgba(255,255,255,.28)}
.lightbox .lb-prev{left:18px} .lightbox .lb-next{right:18px}
.lightbox .lb-count{position:absolute; bottom:20px; left:50%; transform:translateX(-50%);
  color:#f0d9b8; font-size:.85rem; letter-spacing:.1em}

/* ============================ HOMEPAGE GALLERY + TESTIMONIALS ============================ */
.gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.gal-tile{margin:0; aspect-ratio:4/3; border-radius:var(--radius); overflow:hidden; position:relative;
  background:linear-gradient(135deg,var(--olive),var(--sand)); box-shadow:var(--shadow-sm)}
.gal-tile[data-cat="canopies"]{background:linear-gradient(135deg,var(--sea-blue),var(--sand))}
.gal-tile[data-cat="tents"]{background:linear-gradient(135deg,var(--terracotta),var(--sand))}
.gal-tile[data-cat="heaters"]{background:linear-gradient(135deg,var(--gold),var(--olive))}
.gal-tile::after{content:"Photo coming soon"; position:absolute; inset:0; display:grid; place-items:center;
  color:rgba(255,255,255,.9); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600}
.placeholder-tag{display:inline-block; background:var(--sand-soft); color:var(--gold); border-radius:999px;
  padding:.2rem .7rem; font-size:.7rem; font-weight:700; letter-spacing:.06em; margin-top:.3rem}
.testimonials .tcard{background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:24px; box-shadow:var(--shadow-sm); margin:0; display:flex; flex-direction:column; gap:14px}
.tcard p{font-size:.95rem; color:#4a4636; font-style:italic; margin:0; line-height:1.6}
.tcard cite{font-style:normal; font-size:.82rem; color:var(--gold); font-weight:600; letter-spacing:.04em}

@media (max-width:760px){ .pd{grid-template-columns:1fr; gap:24px} }
@media (max-width:640px){ .gallery-grid{grid-template-columns:1fr 1fr; gap:12px} }

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