/* ==========================================================================
   OPENWOOD — "Showroom" design skin
   Larger buttons and type, softer surfaces, calmer layout.

   ⚠️ Every rule is scoped under body.ow-skin-showroom and this file is only
   enqueued while the skin is active (inc/design-skin.php). With the skin set
   back to Classic nothing here loads, so the original design is untouched.
   ========================================================================== */

body.ow-skin-showroom {
  --sr-bg: #f5f5f7;
  --sr-line: #d2d2d7;
  --sr-muted: #6e6e73;
  --sr-text-2: #424245;
  --sr-wood: #8a5a35;
  --sr-r-xl: 32px;
  --sr-r-lg: 28px;
  --sr-r-md: 20px;
  --sr-btn-h: 54px;
  --sr-btn-h-lg: 62px;
  font-size: 17px;
}

/* ---------- buttons: bigger everywhere ---------- */
body.ow-skin-showroom .btn {
  min-height: var(--sr-btn-h);
  padding: 0 30px;
  font-size: 16.5px;
  font-weight: 700;
  border-width: 2px;
  transition: transform 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}
body.ow-skin-showroom .btn:hover { transform: scale(1.015); }
body.ow-skin-showroom .btn--lg { min-height: var(--sr-btn-h-lg); padding: 0 38px; font-size: 18px; }
body.ow-skin-showroom .btn--paper { border-color: var(--ink); }
body.ow-skin-showroom .btn svg,
body.ow-skin-showroom .btn i[data-lucide] { width: 19px; height: 19px; }

/* ---------- form fields: comfortable on a phone ---------- */
body.ow-skin-showroom .form-row .input-text,
body.ow-skin-showroom .form-row select,
body.ow-skin-showroom .woocommerce-form-login .input-text,
body.ow-skin-showroom .ow-auth input[type="email"],
body.ow-skin-showroom .ow-auth input[type="text"],
body.ow-skin-showroom .ow-auth input[type="password"],
body.ow-skin-showroom .ow-auth input[type="tel"] {
  min-height: 54px;
  font-size: 16.5px;
  border-radius: 16px;
}
body.ow-skin-showroom .form-row textarea.input-text { min-height: 110px; }
body.ow-skin-showroom .form-row label { font-size: 15px; font-weight: 600; }

/* ---------- top bar + header ---------- */
body.ow-skin-showroom .topbar { font-size: 14px; }
body.ow-skin-showroom .header__inner { height: 84px; gap: 32px; }
body.ow-skin-showroom .nav { gap: 8px; }
body.ow-skin-showroom .nav a { font-size: 16.5px; padding: 12px 20px; color: var(--ink); }
body.ow-skin-showroom .nav a svg,
body.ow-skin-showroom .nav a i[data-lucide] { width: 19px; height: 19px; }
body.ow-skin-showroom .header__actions { gap: 8px; }
body.ow-skin-showroom .header__actions > * + *::before { display: none; }
body.ow-skin-showroom .header__actions .icon-btn {
  width: 50px; height: 50px; border-radius: 999px; background: var(--sr-bg);
}
body.ow-skin-showroom .header__actions .icon-btn:hover { background: var(--sr-line); }
body.ow-skin-showroom .header__actions .icon-btn svg,
body.ow-skin-showroom .header__actions .icon-btn i[data-lucide] { width: 21px; height: 21px; }
body.ow-skin-showroom .header__actions .icon-btn .dot { top: -2px; right: -2px; min-width: 20px; height: 20px; font-size: 11px; }

/* ==========================================================================
   HOMEPAGE
   ========================================================================== */

/* Hero: centred headline on a soft grey stage, photo below, the two featured
   products as large tiles underneath. Same markup as Classic. */
body.ow-skin-showroom .hero { padding: 0 0 clamp(28px, 4vw, 56px); background: var(--sr-bg); }
body.ow-skin-showroom .hero__grid { grid-template-columns: 1fr; gap: clamp(16px, 2vw, 28px); padding-top: clamp(40px, 6vw, 88px); }
body.ow-skin-showroom .hero__main {
  min-height: 0; background: transparent; color: var(--ink);
  border-radius: 0; overflow: visible; justify-content: flex-start;
}
body.ow-skin-showroom .hero__main img {
  position: static; order: 2; width: 100%; height: clamp(260px, 40vw, 620px);
  margin-top: clamp(28px, 4vw, 52px); object-fit: cover; opacity: 1;
  border-radius: var(--sr-r-xl);
}
body.ow-skin-showroom .hero__content {
  order: 1; padding: 0; background: none; text-align: center;
  display: flex; flex-direction: column; align-items: center;
}
body.ow-skin-showroom .hero__kicker {
  background: transparent; border: 0; padding: 0; margin-bottom: 14px;
  color: var(--sr-wood); font-size: clamp(16px, 1.4vw, 20px); font-weight: 700;
}
body.ow-skin-showroom .hero__content h1 {
  color: var(--ink); max-width: 18ch; margin-inline: auto;
  font-size: clamp(40px, 6.2vw, 84px); line-height: 1.02; letter-spacing: -0.035em; font-weight: 800;
}
body.ow-skin-showroom .hero__content p {
  color: var(--sr-text-2); max-width: 40ch; margin: 18px auto 0;
  font-size: clamp(18px, 1.8vw, 25px); line-height: 1.4; font-weight: 500;
}
body.ow-skin-showroom .hero__cta { justify-content: center; gap: 14px; margin-top: clamp(24px, 3vw, 36px); }
body.ow-skin-showroom .hero__cta .btn { min-height: 62px; padding: 0 40px; font-size: 18px; }
body.ow-skin-showroom .hero__cta .btn--paper { background: var(--ink); color: var(--btn-text, #fff); border-color: var(--ink); }
body.ow-skin-showroom .hero__cta .btn--paper:hover { background: var(--ink-soft); }
/* The Classic markup hard-codes white text on this button for the dark hero. */
body.ow-skin-showroom .hero__cta .btn--ghost { color: var(--ink) !important; border-color: var(--ink); background: transparent; }

body.ow-skin-showroom .hero__side { grid-template-rows: none; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 2vw, 28px); }
body.ow-skin-showroom .hero__card { min-height: clamp(220px, 30vw, 480px); border-radius: var(--sr-r-xl); background: #e8e8ed; }
body.ow-skin-showroom .hero__card-label {
  margin: clamp(14px, 2vw, 28px); padding: 14px 22px; font-size: clamp(15px, 1.3vw, 19px);
  background: #fff; flex-wrap: wrap;
}
body.ow-skin-showroom .hero__card-label small { font-size: 0.92em; color: var(--sr-muted); }

/* Section headings: big and confident. */
body.ow-skin-showroom .section { padding: clamp(44px, 6vw, 80px) 0; }
body.ow-skin-showroom .section--paper { background: var(--sr-bg); }
body.ow-skin-showroom .section__head { margin-bottom: clamp(22px, 3vw, 36px); }
body.ow-skin-showroom .section__head h2 { font-size: clamp(30px, 4vw, 52px); letter-spacing: -0.03em; line-height: 1.05; }
body.ow-skin-showroom .section__head p { font-size: clamp(16px, 1.4vw, 20px); color: var(--sr-muted); margin-top: 8px; }
body.ow-skin-showroom .section__head .btn { min-height: 52px; padding: 0 26px; font-size: 16px; }

/* Categories: large image cards (Classic shows small chips). */
body.ow-skin-showroom .cats { padding: clamp(28px, 4vw, 56px) 0 8px; }
@media (min-width: 1025px) {
  body.ow-skin-showroom .cats__rail { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
}
body.ow-skin-showroom .cats:not(.cats--cards) .cat-chip,
body.ow-skin-showroom .cats--cards .cat-chip {
  flex-direction: column; align-items: stretch; gap: 0; padding: 0;
  /* background-COLOR only: the phone card rail paints its photo with
     background-image, which the shorthand would wipe out. */
  border: 0; border-radius: var(--sr-r-lg); background-color: var(--sr-bg); overflow: hidden;
}
body.ow-skin-showroom .cat-chip img {
  width: 100%; height: auto; aspect-ratio: 1 / 1; border-radius: 0; transition: transform 0.4s ease;
}
body.ow-skin-showroom .cat-chip:hover img { transform: scale(1.04); }
body.ow-skin-showroom .cat-chip > span { padding: 18px 20px 20px; line-height: 1.3; }
body.ow-skin-showroom .cat-chip__name { font-size: clamp(16px, 1.4vw, 20px); }
body.ow-skin-showroom .cat-chip__count { font-size: 15px; color: var(--sr-muted); }
@media (max-width: 1024px) {
  body.ow-skin-showroom .cats:not(.cats--cards) .cat-chip { min-width: 170px; width: 170px; }
}
/* Keep the existing photo-card rail on phones when that setting is on. */
@media (max-width: 767px) {
  body.ow-skin-showroom .cats--cards .cat-chip {
    flex-direction: row; align-items: flex-end; border-radius: var(--sr-r-md); width: 168px; height: 112px;
  }
  body.ow-skin-showroom .cats--cards .cat-chip > span { padding: 12px 14px; }
  /* Light text on the photo scrim — the grey used on the light cards is unreadable here. */
  body.ow-skin-showroom .cats--cards .cat-chip__count { color: rgba(255, 255, 255, 0.88); }
}

/* Product cards: soft grey tiles with a full-width button. */
body.ow-skin-showroom .grid { gap: clamp(12px, 1.6vw, 24px); }
body.ow-skin-showroom .pcard { border: 0; border-radius: var(--sr-r-lg); background: var(--sr-bg); }
body.ow-skin-showroom .pcard:hover { box-shadow: none; }
body.ow-skin-showroom .pcard__media { background: #e8e8ed; }
body.ow-skin-showroom .pcard__body { padding: 20px 22px 12px; gap: 8px; }
body.ow-skin-showroom .pcard__cat { font-size: 12.5px; color: var(--sr-muted); }
body.ow-skin-showroom .pcard__name { font-size: clamp(16px, 1.3vw, 20px); line-height: 1.25; }
body.ow-skin-showroom .pcard__price { font-size: 18px; }
body.ow-skin-showroom .pcard__price .amount,
body.ow-skin-showroom .pcard__price ins,
body.ow-skin-showroom .pcard__price b { font-size: 18px; }
body.ow-skin-showroom .pcard__price del,
body.ow-skin-showroom .pcard__price del .amount,
body.ow-skin-showroom .pcard__price s { font-size: 14px; font-weight: 500; color: var(--sr-muted); }
/* Body grows so every card's button lines up along the row. */
body.ow-skin-showroom .pcard__body-link { flex: 1 1 auto; display: flex; flex-direction: column; }
body.ow-skin-showroom .pcard__dot { width: 18px; height: 18px; }
body.ow-skin-showroom .pcard__cta {
  display: flex; align-items: center; justify-content: center;
  margin: 4px 22px 22px; min-height: 52px; padding: 0 20px;
  border-radius: 999px; background: var(--ink); color: var(--btn-text, #fff);
  font-family: var(--font-head); font-weight: 700; font-size: 16px; text-align: center;
  transition: transform 0.15s ease, background-color 0.15s ease;
}
body.ow-skin-showroom .pcard__cta:hover { background: var(--ink-soft); transform: scale(1.015); }
@media (max-width: 1024px) {
  body.ow-skin-showroom .pcard { border-radius: var(--sr-r-md); }
  body.ow-skin-showroom .pcard__body { padding: 14px 14px 8px; }
  body.ow-skin-showroom .pcard__price,
  body.ow-skin-showroom .pcard__price .amount,
  body.ow-skin-showroom .pcard__price ins { font-size: 16px; }
  body.ow-skin-showroom .pcard__price del,
  body.ow-skin-showroom .pcard__price del .amount { font-size: 13px; }
  body.ow-skin-showroom .pcard__cta { margin: 4px 12px 14px; min-height: 46px; font-size: 14.5px; padding: 0 12px; }
}

/* Four products per row on desktop everywhere (homepage + shop/category
   grids). Classic goes to five columns above 1500px. */
@media (min-width: 1025px) {
  body.ow-skin-showroom .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Site-wide "Trending now" shelf above the footer: a centred full-width row of
   four cards (it was a left-aligned 210px rail) with the showroom heading. */
body.ow-skin-showroom .ow-trend:not(.ow-trend--drawer) .ow-trend__head { margin-bottom: clamp(22px, 3vw, 36px); display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; }
body.ow-skin-showroom .ow-trend:not(.ow-trend--drawer) .ow-trend__title {
  display: block; /* not flex: the ::after full stop must sit right after the text */
  font-size: clamp(30px, 4vw, 52px); letter-spacing: -0.03em; line-height: 1.05; font-weight: 800;
}
body.ow-skin-showroom .ow-trend:not(.ow-trend--drawer) .ow-trend__title svg { display: none; }
body.ow-skin-showroom .ow-trend:not(.ow-trend--drawer) .ow-trend__sub { margin: 0; font-size: clamp(18px, 2vw, 30px); font-weight: 700; letter-spacing: -0.02em; color: var(--sr-muted); }
@media (min-width: 641px) {
  /* !important: the base theme sets `.ow-trend__grid { display: flex !important;
     grid-template-columns: none !important }`
     for its horizontal rail, which no specificity can beat otherwise. */
  body.ow-skin-showroom .ow-trend:not(.ow-trend--drawer) .ow-trend__grid {
    display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: clamp(12px, 1.6vw, 24px);
    overflow: visible; padding: 0;
  }
  body.ow-skin-showroom .ow-trend:not(.ow-trend--drawer) .ow-trend__grid > .pcard { width: auto; flex: none; }
}
@media (min-width: 641px) and (max-width: 1024px) {
  body.ow-skin-showroom .ow-trend:not(.ow-trend--drawer) .ow-trend__grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* The cart drawer's "trending" slider uses the same card as a compact row —
   keep its original look (the whole row is the link there). One class more
   specific than the card rules above, so it wins at every breakpoint. */
body.ow-skin-showroom .ow-trend--drawer .pcard__cta { display: none; }
body.ow-skin-showroom .ow-trend--drawer .pcard__body-link { display: block; }
body.ow-skin-showroom .ow-trend--drawer .pcard { border: var(--bw) solid var(--line); border-radius: var(--r-md); background: var(--paper); }
body.ow-skin-showroom .ow-trend--drawer .pcard__media { background: var(--gray-100); }
body.ow-skin-showroom .ow-trend--drawer .pcard__body { padding: 0 42px 0 0; gap: 3px; }
body.ow-skin-showroom .ow-trend--drawer .pcard__name { font-size: 13.5px; }
body.ow-skin-showroom .ow-trend--drawer .pcard__price,
body.ow-skin-showroom .ow-trend--drawer .pcard__price .amount,
body.ow-skin-showroom .ow-trend--drawer .pcard__price ins { font-size: 14px; }

/* Feature banner. */
/* Feature banner ("Built-In Desk Lite"): a soft grey panel, copy on the left,
   the photo filling the right half edge to edge. Same markup as Classic. */
body.ow-skin-showroom .section--paper:has(.ow-showcase) { background: transparent; }
body.ow-skin-showroom .ow-showcase {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch;
  border-radius: var(--sr-r-xl); background: var(--sr-bg); color: var(--ink);
}
body.ow-skin-showroom .ow-showcase::before { display: none; }
body.ow-skin-showroom .ow-showcase__copy { padding: clamp(36px, 5vw, 80px); justify-content: center; }
body.ow-skin-showroom .ow-showcase__badge {
  border: 0; padding: 0; margin-bottom: 14px; color: var(--sr-wood);
  font-size: clamp(15px, 1.3vw, 19px); font-weight: 700; letter-spacing: 0; text-transform: none;
}
body.ow-skin-showroom .ow-showcase__title { color: var(--ink); font-size: clamp(34px, 4.6vw, 64px); letter-spacing: -0.035em; line-height: 1.02; margin-bottom: 18px; }
body.ow-skin-showroom .ow-showcase__text { color: var(--sr-text-2); font-size: clamp(17px, 1.5vw, 21px); line-height: 1.5; margin-bottom: 30px; max-width: 36ch; }
body.ow-skin-showroom .ow-showcase__specs {
  gap: 12px; max-width: 520px; margin-bottom: 34px; background: transparent; border: 0; border-radius: 0; overflow: visible;
}
body.ow-skin-showroom .ow-showcase__spec { background: #fff; border-radius: var(--sr-r-md); padding: 18px 18px 16px; gap: 4px; }
body.ow-skin-showroom .ow-showcase__spec b { color: var(--ink); font-size: clamp(16px, 1.3vw, 19px); }
body.ow-skin-showroom .ow-showcase__spec span { color: var(--sr-muted); font-size: 14px; }
body.ow-skin-showroom .ow-showcase__cta.btn {
  min-height: 62px; padding: 0 38px; font-size: 18px;
  background: var(--ink); color: var(--btn-text, #fff); box-shadow: none;
}
body.ow-skin-showroom .ow-showcase__cta.btn:hover { background: var(--ink-soft); transform: scale(1.015); }
/* The photo is absolutely positioned so the COPY sets the panel height —
   in flow, a portrait image stretched the whole banner to ~1300px. */
body.ow-skin-showroom .ow-showcase { min-height: clamp(460px, 40vw, 600px); }
body.ow-skin-showroom .ow-showcase__media { padding: 0; display: block; position: relative; }
body.ow-skin-showroom .ow-showcase__tile {
  position: absolute; inset: 0; max-width: none; padding: 0; transform: none; box-shadow: none;
  border-radius: 0; background: transparent;
}
body.ow-skin-showroom .ow-showcase__tile img {
  width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; border-radius: 0;
}
body.ow-skin-showroom .ow-showcase__chip {
  bottom: 24px; left: 24px; transform: none; padding: 12px 18px; font-size: 15px;
  background: #fff; color: var(--ink); box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.35);
}
@media (max-width: 767px) {
  body.ow-skin-showroom .ow-showcase { grid-template-columns: 1fr; }
  body.ow-skin-showroom .ow-showcase { min-height: 0; }
  body.ow-skin-showroom .ow-showcase__media { order: -1; padding: 0; height: 300px; }
  body.ow-skin-showroom .ow-showcase__copy { padding: 28px 22px 32px; }
  body.ow-skin-showroom .ow-showcase__specs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  body.ow-skin-showroom .ow-showcase__spec { padding: 14px 12px; }
  body.ow-skin-showroom .ow-showcase__spec b { font-size: 15px; }
  body.ow-skin-showroom .ow-showcase__spec span { font-size: 12.5px; }
  body.ow-skin-showroom .ow-showcase__cta.btn { width: 100%; }
  body.ow-skin-showroom .ow-showcase__chip { left: 16px; bottom: 16px; font-size: 14px; }
}

/* Trust strip → "Why Openwood" cards. */
body.ow-skin-showroom .trust { gap: clamp(12px, 1.6vw, 20px); }
body.ow-skin-showroom .trust__item {
  flex-direction: column; align-items: flex-start; gap: 16px;
  border: 0; border-radius: var(--sr-r-lg); background: var(--sr-bg); padding: clamp(22px, 2.4vw, 36px);
}
body.ow-skin-showroom .trust__icon { width: 56px; height: 56px; border-radius: 16px; background: #fff; }
body.ow-skin-showroom .trust__icon svg,
body.ow-skin-showroom .trust__icon i { width: 26px; height: 26px; }
body.ow-skin-showroom .trust__item b { font-size: clamp(17px, 1.5vw, 22px); margin-bottom: 6px; color: var(--ink); }
body.ow-skin-showroom .trust__item span span { font-size: 16px; line-height: 1.5; color: var(--sr-text-2); }

/* ==========================================================================
   PRODUCT PAGE
   ========================================================================== */
body.ow-skin-showroom .pdp { gap: clamp(28px, 3.5vw, 64px); }
body.ow-skin-showroom .gallery__main { border-radius: var(--sr-r-xl); background: var(--sr-bg); }
body.ow-skin-showroom .gallery__thumbs { gap: 12px; }
body.ow-skin-showroom .gallery__thumbs button { width: 88px; height: 88px; border-radius: 18px; }

body.ow-skin-showroom .buy__title { font-size: clamp(32px, 3.4vw, 50px); letter-spacing: -0.035em; line-height: 1.05; }
body.ow-skin-showroom .buy__rating .buy__rating-num { font-size: 17px; }
body.ow-skin-showroom .buy__rating .buy__rating-count { font-size: 16px; }
body.ow-skin-showroom .buy__pricepill { padding: 10px 18px; margin: 16px 0 6px; font-size: 17px; background: var(--sr-bg); }
body.ow-skin-showroom .buy__pricepill-amount .woocommerce-Price-amount,
body.ow-skin-showroom .buy__pricepill-amount .amount { font-size: 22px; }
body.ow-skin-showroom .buy__pricepill-save { font-size: 13px; padding: 4px 11px; }
body.ow-skin-showroom .buy__pricepill-amount del,
body.ow-skin-showroom .buy__pricepill-amount del .amount { font-size: 15px; }
body.ow-skin-showroom .ow-paybenefit { font-size: 15.5px; }

/* Options: open groups on the page instead of one boxed card, big tap targets. */
body.ow-skin-showroom .ow-options { border: 0; box-shadow: none; background: transparent; border-radius: 0; gap: 8px; margin: 28px 0; overflow: visible; }
body.ow-skin-showroom .ow-group { padding: 0 0 26px; border-bottom: 0; }
body.ow-skin-showroom .ow-group__head { margin-bottom: 16px; flex-wrap: wrap; row-gap: 4px; }
body.ow-skin-showroom .ow-group__head h3 { flex: 0 0 auto; }
body.ow-skin-showroom .ow-group__head h3 { font-size: clamp(18px, 1.6vw, 22px); }
body.ow-skin-showroom .ow-group__num { width: 32px; height: 32px; font-size: 15px; }
body.ow-skin-showroom .ow-group__hint { font-size: 14.5px; }
body.ow-skin-showroom .ow-choices { gap: 12px; }
body.ow-skin-showroom .ow-choices--buttons { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
body.ow-skin-showroom .ow-choice {
  min-height: 76px; padding: 14px 16px; justify-content: center;
  border: 2px solid var(--sr-line); border-radius: var(--sr-r-md); background: #fff;
}
body.ow-skin-showroom .ow-choice:hover { border-color: var(--sr-muted); }
body.ow-skin-showroom .ow-choice.is-active { border-color: var(--ink); box-shadow: 0 0 0 2px var(--ink); }
body.ow-skin-showroom .ow-choice__label { font-size: 17px; font-weight: 700; }
body.ow-skin-showroom .ow-choice__sub { font-size: 14px; color: var(--sr-muted); }
body.ow-skin-showroom .ow-choice__price { font-size: 15.5px; }
/* Colour choices as equal full-width rows, so the column reads as one list. */
body.ow-skin-showroom .ow-choices--swatch { flex-direction: column; }
body.ow-skin-showroom .ow-choices--swatch .ow-choice { text-align: left; width: 100%; min-height: 68px; padding: 12px 20px 12px 12px; border-radius: var(--sr-r-md); gap: 12px; justify-content: flex-start; }
body.ow-skin-showroom .ow-choices--swatch .ow-choice__label { font-size: 16px; }
body.ow-skin-showroom .ow-choice__swatch { width: 42px; height: 42px; }
body.ow-skin-showroom .ow-choice.is-oos { background: var(--sr-bg); box-shadow: none; }
body.ow-skin-showroom .ow-nudge { font-size: 15px; border-radius: 16px; padding: 14px 16px; }

/* Buy panel: same dark card, larger and rounder, with big buttons. */
body.ow-skin-showroom .ow-buybar { border-radius: var(--sr-r-lg) var(--sr-r-lg) 0 0; }
body.ow-skin-showroom .ow-buybar__summary { padding: 18px 24px; font-size: 15px; }
body.ow-skin-showroom .ow-buybar__name { font-size: 16.5px; }
body.ow-skin-showroom .ow-buybar__optlist li { font-size: 14.5px; }
body.ow-skin-showroom .ow-buybar__total { padding: 20px 24px; font-size: 17px; }
/* nowrap: the currency and amount must stay on one line (on phones "Rs"
   was breaking onto its own line above the number). */
body.ow-skin-showroom .ow-buybar__total > b { font-size: 28px; white-space: nowrap; }
body.ow-skin-showroom .ow-buybar__save { font-size: 13px; padding: 3px 11px; }
body.ow-skin-showroom .buy__ctas { padding: 22px; gap: 12px; border-radius: var(--sr-r-lg); }
body.ow-skin-showroom .ow-buybar + .buy__ctas { padding: 0 22px 22px; border-radius: 0 0 var(--sr-r-lg) var(--sr-r-lg); }
body.ow-skin-showroom .buy__ctas .btn { min-height: 64px; font-size: 18.5px; }
/* Buy Now sits on the dark panel: light outline + white text. The site-wide
   showroom rule gives outline buttons an ink border, invisible on this panel. */
body.ow-skin-showroom .buy__ctas .btn--paper { background: transparent; color: #fff; border-color: rgba(255, 255, 255, 0.55); }
body.ow-skin-showroom .buy__ctas .btn--paper:hover { border-color: #fff; background: rgba(255, 255, 255, 0.08); }
body.ow-skin-showroom .ow-qty-stepper button { width: 44px; height: 44px; }
body.ow-skin-showroom .ow-qty-stepper button svg,
body.ow-skin-showroom .ow-qty-stepper button i { width: 15px; height: 15px; }
body.ow-skin-showroom .ow-qty-stepper output { font-size: 17px; min-width: 22px; }

body.ow-skin-showroom .ow-delivery-estimate { font-size: 15.5px; }
body.ow-skin-showroom .perks { gap: 12px; }
body.ow-skin-showroom .perk { border: 0; border-radius: var(--sr-r-md); background: var(--sr-bg); padding: 18px 14px; font-size: 14.5px; color: var(--sr-text-2); }
body.ow-skin-showroom .perk svg,
body.ow-skin-showroom .perk i { width: 24px; height: 24px; margin-bottom: 8px; }
body.ow-skin-showroom .acc { border-radius: var(--sr-r-md); }
body.ow-skin-showroom .acc summary { padding: 22px 24px; font-size: 18px; }
body.ow-skin-showroom .acc summary::after { font-size: 26px; }
body.ow-skin-showroom .acc__body { padding: 18px 24px 24px; font-size: 16px; }
body.ow-skin-showroom .ow-guide-btn { min-height: 50px; font-size: 15.5px; }

/* Mobile sticky buy bar. */
body.ow-skin-showroom .stickybar { border-radius: 26px 26px 0 0; }
body.ow-skin-showroom .stickybar .btn { min-height: 54px; padding: 0 24px; font-size: 16.5px; }
body.ow-skin-showroom .stickybar b { font-size: 18px; }

/* ==========================================================================
   CART, CHECKOUT, ACCOUNT
   ========================================================================== */
body.ow-skin-showroom #place_order,
body.ow-skin-showroom .checkout-stickybar__btn { min-height: 64px; font-size: 19px; }
body.ow-skin-showroom .cart-page .btn--lg { min-height: 64px; }
body.ow-skin-showroom ul.wc_payment_methods li { font-size: 16.5px; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
body.ow-skin-showroom .footer a { font-size: 16px; padding: 7px 0; }
body.ow-skin-showroom .footer h4 { font-size: 16px; }
body.ow-skin-showroom .footer__brand p { font-size: 16px; }

/* ==========================================================================
   PHONES
   ========================================================================== */
@media (max-width: 640px) {
  body.ow-skin-showroom { font-size: 16px; }
  body.ow-skin-showroom .header__inner { height: 68px; }
  body.ow-skin-showroom .header__actions .icon-btn { width: 44px; height: 44px; }
  body.ow-skin-showroom .hero__grid { padding-top: 36px; }
  body.ow-skin-showroom .hero__cta { width: 100%; flex-direction: column; }
  body.ow-skin-showroom .hero__cta .btn { width: 100%; flex: none; min-height: 58px; font-size: 17px; }
  body.ow-skin-showroom .hero__side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* Phones: the tiles are too narrow for a name + price pill over the photo
     (it covered most of the image), so the label moves BELOW the photo. */
  body.ow-skin-showroom .hero__card {
    min-height: 0; flex-direction: column; align-items: stretch;
    border-radius: var(--sr-r-md); background: #fff; overflow: hidden;
  }
  body.ow-skin-showroom .hero__card img { position: static; width: 100%; height: auto; aspect-ratio: 1 / 1; }
  body.ow-skin-showroom .hero__card-label {
    margin: 0; padding: 12px 14px 14px; border-radius: 0; background: #fff;
    flex-direction: column; align-items: flex-start; gap: 4px;
    font-size: 15px; line-height: 1.3;
  }
  body.ow-skin-showroom .hero__card-label small { font-size: 14px; font-weight: 600; color: var(--sr-text-2); }
  body.ow-skin-showroom .trust { grid-template-columns: 1fr 1fr; }
  body.ow-skin-showroom .trust__item { padding: 18px; gap: 12px; }
  body.ow-skin-showroom .trust__item span span { font-size: 14.5px; }
  body.ow-skin-showroom .ow-choices--buttons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.ow-skin-showroom .ow-choice { min-height: 68px; }
  body.ow-skin-showroom .buy__ctas .btn { min-height: 58px; font-size: 17px; }
  body.ow-skin-showroom .ow-buybar__total { padding: 18px 20px; gap: 12px; }
  body.ow-skin-showroom .ow-buybar__total > b { font-size: 23px; }
  body.ow-skin-showroom .ow-buybar__save { font-size: 12px; }
  body.ow-skin-showroom .ow-buybar + .buy__ctas { padding-top: 16px; }
}

/* ==========================================================================
   HOMEPAGE — Showroom-only sections (markup in front-page.php, $ow_showroom)
   ========================================================================== */

/* Section heading: "Title. Grey subtitle." with a text link on the right. */
body.ow-skin-showroom .sr-head { align-items: flex-end; flex-direction: row; flex-wrap: wrap; gap: 12px 24px; }
body.ow-skin-showroom .sr-head h2 { flex: 1 1 520px; max-width: 30ch; }
body.ow-skin-showroom .sr-head__sub { color: var(--sr-muted); }
body.ow-skin-showroom .sr-more {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px;
  font-family: var(--font-head); font-weight: 700; font-size: clamp(16px, 1.4vw, 19px); color: var(--ink);
}
body.ow-skin-showroom .sr-more:hover { text-decoration: underline; text-underline-offset: 5px; }
body.ow-skin-showroom .sr-more span { font-size: 1.3em; line-height: 1; }
body.ow-skin-showroom .cats .sr-head { margin-bottom: clamp(18px, 2.4vw, 32px); }

/* Hero product tiles. */
body.ow-skin-showroom .hero__side { grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr)); }
body.ow-skin-showroom .sr-tile {
  --sr-tile-pad: clamp(20px, 3vw, 36px);
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: clamp(36px, 4.5vw, 64px) var(--sr-tile-pad) 0;
  border-radius: var(--sr-r-xl); background: #fff; color: var(--ink); overflow: hidden;
}
body.ow-skin-showroom .sr-tile--dark { background: var(--ink); color: #f5f5f7; }
body.ow-skin-showroom .sr-tile__title { font-size: clamp(30px, 3.6vw, 48px); line-height: 1.05; letter-spacing: -0.03em; font-weight: 800; margin: 0; }
body.ow-skin-showroom .sr-tile__title a { color: inherit; }
body.ow-skin-showroom .sr-tile__tag { margin: 12px 0 0; font-size: clamp(17px, 1.6vw, 22px); font-weight: 500; color: var(--sr-text-2); }
body.ow-skin-showroom .sr-tile--dark .sr-tile__tag { color: #d2d2d7; }
body.ow-skin-showroom .sr-tile__price { margin: 10px 0 0; font-family: var(--font-head); font-size: clamp(17px, 1.5vw, 20px); font-weight: 700; }
body.ow-skin-showroom .sr-tile__price del { font-weight: 500; color: var(--sr-muted); margin-right: 6px; }
body.ow-skin-showroom .sr-tile--dark .sr-tile__price del { color: #a1a1a6; }
body.ow-skin-showroom .sr-tile__price ins { text-decoration: none; }
body.ow-skin-showroom .sr-tile__ctas { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 26px; }
body.ow-skin-showroom .sr-tile__ctas .btn { min-height: 58px; padding: 0 32px; font-size: 17px; }
body.ow-skin-showroom .sr-tile__buy { background: var(--ink); color: var(--btn-text, #fff); border-color: var(--ink); }
body.ow-skin-showroom .sr-tile__more { background: transparent; color: var(--ink); border-color: var(--ink); }
body.ow-skin-showroom .sr-tile--dark .sr-tile__buy { background: #f5f5f7; color: var(--ink); border-color: #f5f5f7; }
body.ow-skin-showroom .sr-tile--dark .sr-tile__more { color: #f5f5f7; border-color: #f5f5f7; }
/* Photo runs edge to edge across the bottom of the tile, as in the demo. */
body.ow-skin-showroom .sr-tile__media {
  display: block; overflow: hidden; margin-top: clamp(26px, 3vw, 40px);
  width: calc(100% + 2 * var(--sr-tile-pad)); margin-inline: calc(-1 * var(--sr-tile-pad));
}
body.ow-skin-showroom .sr-tile__media img {
  width: 100%; height: clamp(260px, 30vw, 440px); object-fit: cover; display: block;
  transition: transform 0.4s ease;
}
body.ow-skin-showroom .sr-tile:hover .sr-tile__media img { transform: scale(1.02); }

/* Why Openwood. */
body.ow-skin-showroom .sr-why__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: clamp(12px, 1.6vw, 20px); }
body.ow-skin-showroom .sr-why__card {
  display: flex; flex-direction: column; gap: 14px;
  padding: clamp(26px, 2.6vw, 38px) clamp(22px, 2.4vw, 32px);
  border-radius: var(--sr-r-lg); background: var(--sr-bg);
}
body.ow-skin-showroom .sr-why__icon { color: var(--ink); line-height: 0; }
body.ow-skin-showroom .sr-why__icon svg,
body.ow-skin-showroom .sr-why__icon i { width: 40px; height: 40px; stroke-width: 1.7; }
body.ow-skin-showroom .sr-why__card h3 { margin: 0; font-size: clamp(19px, 1.7vw, 24px); font-weight: 700; }
body.ow-skin-showroom .sr-why__card p { margin: 0; font-size: clamp(16px, 1.3vw, 18px); line-height: 1.5; color: var(--sr-text-2); }

/* WhatsApp help band. */
body.ow-skin-showroom .sr-wa { padding-top: 0; }
body.ow-skin-showroom .sr-wa__band {
  border-radius: var(--sr-r-xl); background: var(--ink); color: #f5f5f7; text-align: center;
  padding: clamp(48px, 6vw, 80px) clamp(22px, 4vw, 48px);
}
body.ow-skin-showroom .sr-wa__band h2 { margin: 0; color: #f5f5f7; font-size: clamp(30px, 4vw, 52px); font-weight: 800; letter-spacing: -0.03em; line-height: 1.05; }
body.ow-skin-showroom .sr-wa__band p { margin: 16px auto 0; max-width: 40ch; font-size: clamp(17px, 1.7vw, 22px); line-height: 1.45; color: #d2d2d7; }
body.ow-skin-showroom .sr-wa__btn {
  margin-top: 32px; min-height: 62px; padding: 0 38px; gap: 12px; font-size: 18px;
  background: #f5f5f7; color: var(--ink); border-color: #f5f5f7;
}
body.ow-skin-showroom .sr-wa__btn svg { width: 22px; height: 22px; }

@media (max-width: 640px) {
  body.ow-skin-showroom .sr-head h2 { flex-basis: 100%; }
  body.ow-skin-showroom .sr-tile__ctas { width: 100%; }
  body.ow-skin-showroom .sr-tile__ctas .btn { flex: 1 1 0; padding: 0 16px; min-height: 54px; font-size: 16px; }
  body.ow-skin-showroom .sr-tile__media img { height: 240px; }
  body.ow-skin-showroom .sr-why__grid { grid-template-columns: 1fr 1fr; }
  body.ow-skin-showroom .sr-why__card { padding: 20px 16px; gap: 10px; }
  body.ow-skin-showroom .sr-why__icon svg,
  body.ow-skin-showroom .sr-why__icon i { width: 32px; height: 32px; }
  body.ow-skin-showroom .sr-wa__btn { width: 100%; }
}

/* ==========================================================================
   OPTION POPUPS — checkout quick view, add-on quick view, order-bump tray,
   and every other .modal (sign-in, added-to-cart, guides)
   ========================================================================== */
body.ow-skin-showroom .modal__box { border-radius: var(--sr-r-xl); padding: clamp(24px, 3vw, 40px); }
body.ow-skin-showroom .modal__close { width: 44px; height: 44px; top: 18px; right: 18px; border: 0; background: var(--sr-bg); }
body.ow-skin-showroom .modal__close:hover { background: var(--sr-line); }
body.ow-skin-showroom .modal__close svg,
body.ow-skin-showroom .modal__close i { width: 19px; height: 19px; }

body.ow-skin-showroom .ow-qv { gap: clamp(18px, 2.4vw, 32px); }
body.ow-skin-showroom .ow-qv__media img { border-radius: 24px; background: var(--sr-bg); }
body.ow-skin-showroom .ow-qv__eyebrow { font-size: 13px; color: var(--sr-wood); }
body.ow-skin-showroom .ow-qv__title { font-size: clamp(24px, 2.4vw, 32px); font-weight: 800; letter-spacing: -0.025em; margin: 8px 48px 8px 0; line-height: 1.1; }
body.ow-skin-showroom .ow-qv__price { font-family: var(--font-head); font-size: 20px; font-weight: 700; margin-bottom: 14px; }
body.ow-skin-showroom .ow-qv__price ins { text-decoration: none; }
body.ow-skin-showroom .ow-qv__desc { font-size: 15.5px; color: var(--sr-text-2); }
body.ow-skin-showroom .ow-qv__group-label { font-size: 16px; margin-bottom: 10px; }
body.ow-skin-showroom .ow-qv__choices { gap: 10px; }
body.ow-skin-showroom .ow-qv__choice { min-height: 50px; padding: 8px 18px; font-size: 15.5px; font-weight: 600; border: 2px solid var(--sr-line); }
body.ow-skin-showroom .ow-qv__choice.is-active { border-color: var(--ink); }
body.ow-skin-showroom .ow-qv__swatch { width: 24px; height: 24px; }
body.ow-skin-showroom .ow-qv__qtylabel { font-size: 16px; }
body.ow-skin-showroom .ow-qv__qty { padding: 4px; border: 2px solid var(--sr-line); }
body.ow-skin-showroom .ow-qv__qty button { width: 44px; height: 44px; }
body.ow-skin-showroom .ow-qv__qty output { font-size: 17px; min-width: 34px; }
body.ow-skin-showroom .ow-qv__foot { gap: 12px; margin-top: 22px; flex-wrap: wrap; }
body.ow-skin-showroom .ow-qv__add {
  min-height: 60px; border-radius: 999px; font-family: var(--font-head); font-size: 17.5px; font-weight: 700;
  background: var(--ink); color: var(--btn-text, #fff);
}
body.ow-skin-showroom .ow-qv__remove {
  min-height: 60px; padding: 0 26px; border-radius: 999px; border: 2px solid var(--ink);
  font-family: var(--font-head); font-size: 16.5px; font-weight: 700; color: var(--ink);
  display: inline-flex; align-items: center; justify-content: center;
}
/* Options inside a popup or the order-bump tray: same big pickers as the
   product page, with a slightly tighter rhythm for the smaller box. */
body.ow-skin-showroom .ow-cqv__form .ow-options,
body.ow-skin-showroom .order-bump__tray .ow-options { margin: 8px 0 12px; }
body.ow-skin-showroom .ow-cqv .ow-group,
body.ow-skin-showroom .order-bump__tray .ow-group { padding-bottom: 18px; }
body.ow-skin-showroom .ow-cqv .ow-buybar,
body.ow-skin-showroom .order-bump__tray .ow-buybar { border-radius: var(--sr-r-md); }
body.ow-skin-showroom .order-bump__tray { padding: 18px; border-radius: var(--sr-r-md); border: 2px solid var(--sr-line); }
@media (max-width: 640px) {
  body.ow-skin-showroom .modal { padding: 12px; }
  body.ow-skin-showroom .modal__box { border-radius: 26px; padding: 22px 18px; }
  body.ow-skin-showroom .ow-qv__media { max-width: 100%; }
  body.ow-skin-showroom .ow-qv__add,
  body.ow-skin-showroom .ow-qv__remove { flex: 1 1 100%; }
}
