:root {
  --orange: #f15a00;
  --orange-2: #ff7a18;
  --orange-deep: #d94700;
  --orange-soft: #ffe2ca;
  --ink: #151515;
  --paper: #f7f1e8;
  --white: #fff;
  --muted: #68625c;
  --line: #ddd4ca;
  --green: #16a957;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}
a { color: inherit; }

.nav {
  max-width: 1160px;
  margin: auto;
  padding: 12px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.brand {
  font-size: clamp(27px, 3.4vw, 38px);
  font-weight: 950;
  text-decoration: none;
  letter-spacing: -.045em;
}
.nav-wa {
  padding: 10px 14px;
  border-radius: 999px;
  background: var(--ink);
  color: #fff;
  text-decoration: none;
  font-size: 13px;
  font-weight: 850;
}
.nav-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}
.nav-home {
  padding: 9px 13px;
  border: 2px solid var(--ink);
  border-radius: 999px;
  color: var(--ink);
  text-decoration: none;
  font-size: 13px;
  font-weight: 850;
}

.catalog-page {
  min-height: 100vh;
  background: linear-gradient(155deg, var(--orange-deep) 0%, var(--orange) 38%, var(--orange-2) 100%);
}
.catalog-header {
  background: linear-gradient(130deg, var(--orange), var(--orange-2));
}
.catalog-page .catalog-header {
  border-bottom: 1px solid rgba(74, 24, 0, .22);
  background: transparent;
}
.catalog-copy {
  max-width: 1160px;
  margin: auto;
  padding: 2px 22px 24px;
}
.eyebrow {
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.catalog-copy h1 {
  margin: 0;
  font-size: clamp(32px, 5vw, 52px);
  line-height: .98;
  letter-spacing: -.055em;
}
.catalog-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  max-width: 1000px;
  margin-top: 15px;
}
.catalog-intro p {
  margin: 0;
  padding: 15px 17px;
  border: 1px solid rgba(74, 24, 0, .24);
  border-radius: 14px;
  background: rgba(255, 255, 255, .17);
  font-size: clamp(16px, 2vw, 19px);
  font-weight: 760;
  line-height: 1.4;
}
.catalog-main {
  max-width: 1160px;
  margin: auto;
  padding: 28px 22px 58px;
}

.product-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.product-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--orange-soft);
  box-shadow: 0 16px 42px rgba(70, 22, 0, .18);
}
.card-image {
  position: relative;
  display: block;
  height: 410px;
  padding: 14px;
  background: var(--orange);
}
.card-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.card-body { padding: 20px; }
.card-body > span {
  color: #9e3500;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.card-body h2 {
  margin: 7px 0 15px;
  font-size: 27px;
  letter-spacing: -.04em;
}
.card-price {
  margin: 0 0 18px;
  font-size: 31px;
  font-weight: 950;
  letter-spacing: -.04em;
}
.card-price small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0;
  text-transform: uppercase;
}
.card-link {
  display: block;
  padding: 13px;
  border-radius: 11px;
  background: var(--ink);
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-weight: 900;
}

.contact-section {
  margin-top: 34px;
  padding-top: 30px;
  border-top: 1px solid rgba(74, 24, 0, .28);
}
.contact-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}
.contact-heading h2 {
  margin: 0;
  font-size: clamp(28px, 4vw, 42px);
  letter-spacing: -.045em;
}
.contact-heading p {
  max-width: 430px;
  margin: 0;
  color: #3e1a09;
  font-weight: 700;
  line-height: 1.45;
}
.contact-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.contact-card {
  padding: 20px;
  border-radius: 17px;
  background: var(--ink);
  color: #fff;
}
.contact-card h3 {
  margin: 0 0 8px;
  font-size: 20px;
}
.contact-card p {
  min-height: 44px;
  margin: 0 0 16px;
  color: #d6d6d6;
  line-height: 1.4;
}
.contact-card a {
  display: block;
  padding: 12px;
  border-radius: 10px;
  background: var(--green);
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-weight: 900;
}

footer {
  padding: 20px 22px 45px;
  text-align: center;
  color: var(--muted);
  font-size: 12px;
}
.catalog-page footer {
  color: #3e1a09;
  font-weight: 700;
}

.product-nav {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
.product-page {
  min-height: 100vh;
  background: linear-gradient(150deg, var(--orange-deep) 0%, var(--orange) 42%, var(--orange-2) 100%);
}
.product-page .product-nav {
  border-bottom-color: rgba(74, 24, 0, .24);
  background: transparent;
}
.product-wrap {
  max-width: 1160px;
  margin: auto;
  padding: 30px 22px 70px;
}
.product-layout {
  display: grid;
  grid-template-columns: minmax(310px, .85fr) minmax(380px, 1.15fr);
  gap: 38px;
  align-items: start;
}
.gallery {
  position: sticky;
  top: 18px;
}
.photo-stage {
  position: relative;
  min-height: 610px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 20px;
  background: var(--orange);
}
.photo-stage .main-photo {
  width: auto;
  height: 96%;
  max-height: 610px;
  border-radius: 0;
  object-fit: contain;
  background: transparent;
}
.same-price-note {
  margin: 12px 0 0;
  color: #c94700;
  font-weight: 850;
  text-align: center;
}
.color-picker {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 14px;
}
.color-dot {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  border: 2px solid rgba(74,24,0,.25);
  border-radius: 999px;
  background: #fff8f1;
  color: #3e1a09;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
}
.color-dot.color-only {
  width: 42px;
  height: 42px;
  justify-content: center;
  padding: 0;
}
.color-dot.is-active { border-color: #d72b2b; box-shadow: 0 0 0 2px rgba(215,43,43,.15); }
.color-dot span { width: 18px; height: 18px; border: 1px solid #8a6049; border-radius: 50%; }
.dot-white { background: #fff; }
.dot-silver { background: linear-gradient(135deg,#f2f2f2,#8e9397); }
.dot-black { background: #151515; }
.main-photo {
  display: block;
  width: 100%;
  max-height: 660px;
  object-fit: contain;
  border-radius: 20px;
  background: var(--orange);
}
.product-info { padding-top: 18px; }
.product-info .eyebrow { color: var(--orange); }
.product-page .product-info .eyebrow { color: #572000; }
.product-info h1 {
  margin: 0 0 8px;
  font-size: clamp(42px, 6vw, 68px);
  line-height: .95;
  letter-spacing: -.055em;
}
.lead {
  max-width: 580px;
  margin: 0 0 22px;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.5;
}
.product-page .lead {
  color: #3e1a09;
  font-weight: 700;
}
.calculator {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--white);
}
.product-page .calculator {
  border-color: rgba(74, 24, 0, .32);
  background: var(--orange-soft);
  box-shadow: 0 18px 46px rgba(70, 22, 0, .18);
}
.calculator h2 {
  margin: 0 0 8px;
  font-size: 24px;
  letter-spacing: -.03em;
}
.compare-help {
  margin: 0 0 17px;
  color: #572000;
  font-size: 14px;
  line-height: 1.45;
}
.fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.field label {
  display: block;
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 850;
}
.field select {
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid #aaa29a;
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}
.product-page .field select {
  border-color: #c66a35;
  background: #fff8f1;
}
.field-wide { grid-column: 1 / -1; }
.result {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 22px 0;
}
.result span {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.product-page .result span { color: #6b3314; }
.result strong {
  display: block;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1;
  letter-spacing: -.045em;
}
.channel {
  margin: 0 0 15px;
  padding: 11px 12px;
  border-radius: 10px;
  background: #fff0e5;
  color: #6b3314;
  font-size: 13px;
  line-height: 1.4;
}
.product-page .channel {
  background: #ffc99f;
  color: #552000;
}
.fineprint {
  margin: 11px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.product-page .fineprint { color: #6b3314; }
.product-contact-section { margin-top: 20px; }
.details {
  margin-top: 18px;
  border-top: 1px solid var(--line);
}
.details details {
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}
.details summary {
  cursor: pointer;
  font-weight: 900;
}
.details p {
  margin: 10px 0 0;
  color: var(--muted);
  line-height: 1.5;
}
.stock-note {
  margin: 0 0 18px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #fff0e5;
  color: #572000;
  font-weight: 800;
  line-height: 1.45;
}
.basic-definition {
  margin-top: 14px;
  padding: 14px;
  border-left: 5px solid #d72b2b;
  border-radius: 10px;
  background: #fff8f1;
  color: #572000;
  font-size: 14px;
  line-height: 1.5;
}
.spec-list {
  margin: 10px 0 0;
  padding-left: 20px;
  color: #3e1a09;
  line-height: 1.65;
}

@media (max-width: 900px) {
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .product-layout { grid-template-columns: 1fr; }
  .gallery { position: static; }
  .photo-stage { min-height: 520px; }
  .main-photo { max-height: 610px; }
  .contact-grid { grid-template-columns: 1fr; }
  .contact-card p { min-height: 0; }
  .contact-heading { display: block; }
  .contact-heading p { margin-top: 8px; }
}

@media (max-width: 620px) {
  .catalog-intro { grid-template-columns: 1fr; gap: 10px; }
  .nav { align-items: flex-start; gap: 10px; }
  .nav-actions { flex-direction: column; align-items: stretch; }
  .nav-home, .nav-wa { text-align: center; }
  .product-grid { grid-template-columns: 1fr; }
  .card-image { height: 440px; }
  .catalog-main,
  .product-wrap {
    padding-left: 15px;
    padding-right: 15px;
  }
  .fields,
  .result { grid-template-columns: 1fr; }
  .product-info { padding-top: 0; }
  .main-photo { max-height: 560px; }
  .photo-stage { min-height: 440px; }
  .color-picker { flex-wrap: wrap; }
  .nav {
    padding-left: 15px;
    padding-right: 15px;
  }
}

/* Identidad unificada con la página principal de Doctor Calefón */
:root {
  --orange: #d96f43;
  --orange-2: #e79a72;
  --orange-deep: #b94d38;
  --orange-soft: #fde5dd;
  --ink: #48413f;
  --paper: #80638f;
  --surface-rose: #f4ddd5;
  --surface-field: #f9eae4;
  --page-light: #fff7fc;
  --availability-magenta: #943b78;
  --muted: #665652;
  --line: #e4cbc3;
}

.catalog-page,
.product-page {
  background: var(--paper);
}

.catalog-header,
.catalog-page .catalog-header,
.product-nav,
.product-page .product-nav {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid rgba(255, 143, 132, .34);
  background:
    radial-gradient(ellipse at 82% 130%, rgba(235, 105, 66, .30) 0 12%, transparent 36%),
    radial-gradient(ellipse at 66% 145%, rgba(235, 92, 156, .17) 0 10%, transparent 30%),
    #48413f;
  color: #fff8f5;
}

.catalog-header .brand,
.product-nav .brand {
  color: #ff786f;
  font-family: Georgia, "Times New Roman", serif;
  letter-spacing: .025em;
}

.catalog-header .nav-home,
.product-nav .nav-home {
  border-color: #e879bd;
  color: #f4b5dc;
}

.catalog-header .nav-wa,
.product-nav .nav-wa {
  background: #d96f43;
  color: #fff;
}

.catalog-copy h1 { color: #ff8a80; }
.catalog-intro p {
  border-color: rgba(255, 181, 220, .28);
  background: rgba(255, 255, 255, .08);
  color: #fff8f5;
}

.product-card {
  border-color: #e5c7c1;
  background: var(--surface-rose);
  box-shadow: 0 16px 38px rgba(83, 55, 50, .14);
}
.card-image,
.photo-stage {
  background: #ed6508 url("./doctor-calefon-textura.png") center / cover no-repeat;
}
.main-photo { background: transparent; }
.card-body > span,
.product-info .eyebrow,
.product-page .product-info .eyebrow { color: var(--availability-magenta); }

.availability-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 10px;
  color: var(--availability-magenta);
  font-size: .875rem;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.availability-row > span { min-width: 0; }
.availability-row > span:last-child { text-align: right; }

.card-link { background: #48413f; }
.card-link:hover { background: #615755; }

.product-page .product-info { padding:24px; border-radius:20px; background:var(--surface-rose); color:var(--ink); }
.product-info h1 { color: #48413f; }
.product-page .lead { color: #665652; }
.stock-note {
  border: 1px solid #efbfd7;
  background: #fde6f1;
  color: #683c53;
}
.product-page .calculator {
  border-color: #e5c4bb;
  background: var(--surface-rose);
  box-shadow: 0 18px 42px rgba(83, 55, 50, .13);
}
.product-page .field select { border-color: #d9987d; background: var(--surface-field); }
.product-page .channel { background: #f8d9e8; color: #683c53; }
.basic-definition { border-left-color: #d96f43; background: var(--surface-field); }
.color-dot { border-color: #c9aaa1; background: var(--surface-rose); }
.color-dot.is-active { border-color: var(--availability-magenta); box-shadow: 0 0 0 3px rgba(212,85,164,.15); }
.contact-section { border-top-color: #dcbeb5; }
.details p,
.spec-list,
.product-page .fineprint { color: #665652; }
.contact-card { background: #48413f; }
.contact-heading, .contact-heading p, .catalog-page footer, .product-page .gallery > .same-price-note, .product-page .gallery > .fineprint { color:var(--page-light); }

.technical-guide-link {
  display: block;
  margin-bottom: 14px;
  padding: 15px 18px;
  border-radius: 12px;
  background: #48413f;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-weight: 900;
}
.technical-guide-link:hover { background: #615755; }

.technical-page { background:var(--paper); color:var(--page-light); }
.technical-hero {
  padding: 48px 22px;
  background:
    radial-gradient(ellipse at 85% 130%, rgba(229,100,72,.30), transparent 38%),
    radial-gradient(ellipse at 66% 150%, rgba(232,121,189,.16), transparent 34%),
    #48413f;
  color: #fff;
}
.technical-hero > div,
.technical-main { max-width: 1060px; margin: auto; }
.technical-hero .eyebrow { color: #f4b5dc; }
.technical-hero h1 { margin: 0; max-width: 800px; color: #ff8a80; font-size: clamp(38px,6vw,66px); line-height: .98; letter-spacing: -.05em; }
.technical-hero p { max-width: 760px; margin: 16px 0 0; font-size: 18px; line-height: 1.55; }
.technical-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.technical-actions a { padding: 12px 16px; border-radius: 10px; background: #d96f43; color: #fff; text-decoration: none; font-weight: 850; }
.technical-actions a:last-child { background: #f8d9e8; color: #683c53; }
.technical-main { padding: 30px 22px 70px; }
.technical-alert { padding: 17px; border-left: 5px solid #d96f43; border-radius: 12px; background: var(--surface-rose); color:var(--ink); font-weight: 750; line-height: 1.55; }
.technical-section { margin-top: 24px; padding: 24px; border: 1px solid #e4cbc3; border-radius: 18px; background: var(--surface-rose); color:var(--ink); }
.technical-section h2 { margin: 0 0 15px; font-size: clamp(25px,3vw,34px); letter-spacing: -.035em; }
.technical-section h3 { margin: 22px 0 8px; color: #b94d38; }
.technical-section p,
.technical-section li { line-height: 1.6; }
.technical-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.technical-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.technical-fact { padding: 14px; border-radius: 12px; background: #fde6f1; }
.technical-fact small { display: block; margin-bottom: 4px; color: #795267; font-weight: 750; }
.technical-fact strong { font-size: 18px; }
.technical-table { width: 100%; border-collapse: collapse; }
.technical-table th,
.technical-table td { padding: 11px 9px; border-bottom: 1px solid #ead7d1; text-align: left; vertical-align: top; }
.technical-table th { color: #9f3d31; }
.vent-diagram { padding: 18px; border-radius: 14px; background: #f6e2da; }
.vent-diagram strong { display: block; margin-bottom: 14px; }
.diagram-line { display: grid; grid-template-columns: 92px 54px 1fr 82px; align-items: center; gap: 7px; min-height: 84px; }
.diagram-heater { display: grid; place-items: center; height: 82px; border-radius: 12px; background: #fff; color: #d96f43; font-size: 12px; font-weight: 900; text-align: center; }
.diagram-elbow { font-size: 42px; color: #b94d38; text-align: center; }
.diagram-pipe { height: 13px; border-radius: 99px; background: linear-gradient(#969696,#e6e6e6,#868686); }
.diagram-outside { padding: 10px; border-left: 4px solid #48413f; font-size: 12px; font-weight: 850; }
.diagram-vertical { display: flex; min-height: 190px; flex-direction: column; align-items: center; justify-content: flex-end; gap: 7px; }
.diagram-vertical .vertical-terminal { border-left: 0; border-bottom: 4px solid #48413f; text-align: center; }
.diagram-vertical .vertical-pipe { width: 13px; height: 62px; border-radius: 99px; background: linear-gradient(90deg,#969696,#e6e6e6,#868686); }
.diagram-vertical .diagram-heater { width: 92px; box-sizing: border-box; }
.equivalent-box { margin-top: 14px; padding: 16px; border-radius: 12px; background: #48413f; color: #fff; }
.equivalent-box code { color: #ffb18d; font-size: 16px; }
.manual-warning { padding: 15px; border: 1px solid #e8b860; border-radius: 12px; background: #fff4d6; color: #5e4718; }
.error-code { font-weight: 900; color: #b94d38; }
@media (max-width: 720px) {
  .technical-grid,
  .technical-facts { grid-template-columns: 1fr; }
  .technical-section { padding: 18px; }
  .technical-table { font-size: 14px; }
  .diagram-line { grid-template-columns: 74px 42px 1fr 64px; }
}

/* Keep Rinnai lettering anchored to the photo in the catalog and detail page.
   Logo: 25–29%; controls: 69–87%; lower casing: 88–93%. */
.rinnai-card-image { --rinnai-height:382px; display:grid; place-items:center; }
.rinnai-photo-stage { --rinnai-height:610px; min-height:0; padding:16px; }
.rinnai-art { position:relative; width:min(100%,calc(var(--rinnai-height) * 432 / 656)); aspect-ratio:432 / 656; container-type:inline-size; }
.rinnai-card-image .rinnai-art > img, .rinnai-photo-stage .rinnai-art > img { display:block; width:100%; height:100%; max-width:none; max-height:none; margin:0; object-fit:contain; border:0; border-radius:0; background:transparent; }
.rinnai-art > span { position:absolute; left:5%; width:90%; color:#c94700; font-weight:900; line-height:1.2; text-align:center; }
/* Keep the three labels clear of the real logo and control panel in every color. */
.rinnai-art .rinnai-gas { top:43.25%; transform:translateY(-50%); font-size:4.8cqw; line-height:1.25; }
.rinnai-art .rinnai-code { top:35%; font-size:4.8cqw; line-height:1.25; white-space:nowrap; }
.rinnai-art .rinnai-brand { top:49.5%; transform:translateY(-50%); left:10%; width:80%; font-size:6.6cqw; line-height:1.2; letter-spacing:.045em; white-space:nowrap; }
.rinnai-dark > span { color:#ffab57; text-shadow:0 1px 2px #000; }
@media(max-width:900px) { .rinnai-photo-stage { --rinnai-height:520px; } }
@media(max-width:620px) { .rinnai-card-image { --rinnai-height:412px; } .rinnai-photo-stage { --rinnai-height:440px; } }

/* Rheem liquidation: sober olive family accent. */
.rheem-card { border-color:#829266; }
.rheem-card h2, .rheem-product h1 { color:#526238; }

.color-dot { text-decoration:none; min-height:44px; }
.color-dot:focus-visible { outline:3px solid #537e9e; outline-offset:3px; }
.catalog-colors { justify-content:flex-start; flex-wrap:wrap; }
.card-body .color-availability { font-size:14px; line-height:1.5; color:#66544d; }

.rio-photo-stage, .rio-card-image { overflow:hidden; display:grid; place-items:center; }
.rio-photo-stage { height:610px; min-height:0; padding:20px; --product-photo-height:570px; }
@media(max-width:900px) { .rio-photo-stage { height:520px; --product-photo-height:480px; } }
@media(max-width:620px) { .rio-photo-stage { height:440px; padding:16px; --product-photo-height:408px; } }

/* One continuous backdrop behind each product; photos carry no painted frame. */
.card-image, .photo-stage { isolation:isolate; }
.card-image > img, .product-cutout-stage .main-photo { filter:drop-shadow(0 8px 7px #19151255); }
.product-cutout-stage { height:610px; min-height:0; padding:20px; }
.product-cutout-stage .main-photo { width:100%; height:100%; max-height:100%; max-width:100%; border:0; border-radius:0; background:transparent; }
@media(max-width:900px) { .product-cutout-stage { height:520px; } }
@media(max-width:620px) { .product-cutout-stage { height:440px; padding:16px; } }

.card-image { --product-photo-height:382px; }
.card-image:has(.product-cutout) { display:grid; place-items:center; }
.product-cutout-stage { --product-photo-height:570px; }

.product-cutout { display:block; position:relative; width:min(100%,calc(var(--product-photo-height) * 941 / 1672)); aspect-ratio:941 / 1672; filter:drop-shadow(0 8px 7px #19151255); }
.product-cutout > img { display:block; width:100%; height:auto; max-width:none; max-height:none; margin:0; border:0; border-radius:0; object-fit:fill; aspect-ratio:941 / 1672; clip-path:var(--product-photo-clip); background:transparent; filter:none; }

@media(max-width:900px) { .product-cutout-stage { --product-photo-height:480px; } }
@media(max-width:620px) { .card-image { --product-photo-height:412px; } .product-cutout-stage { --product-photo-height:408px; } }


/* Original 1024px retailer photo. CSS frames each actual product without resampling the file. */
.rio-product-photo { display:block; position:relative; overflow:hidden; width:min(100%,calc(var(--product-photo-height) * 384 / 716)); aspect-ratio:384 / 716; border-radius:2px; box-shadow:0 8px 14px #19151244; }
.rio-product-photo > img { position:absolute; display:block; width:266.666667%; height:143.016760%; max-width:none; max-height:none; left:-140.364583%; top:-22.067039%; margin:0; padding:0; border:0; border-radius:0; object-fit:fill; transform:none; background:transparent; filter:none; transition:none; }
.rio-product-photo > img[src$="#negro"] { left:-29.687500%; }
.rio-product-photo:has(> img[src$="#negro"]) { clip-path:inset(0 .5% 0 0 round 2px); }

.rio-photo-stage .rio-product-photo > .main-photo { width:266.666667%; height:143.016760%; max-height:none; max-width:none; object-fit:fill; transform:none; }

/* Installation is offered by enquiry until each job is quoted. */
.product-page[data-service="basic"] [data-financing-field],
.product-page[data-service="basic"] #payment-method-field,
.product-page[data-service="basic"] .calculator .compare-help,
.product-page[data-service="basic"] .calculator .fineprint,
.product-page[data-service="basic"] .calculator .basic-definition,
.product-page[data-service="basic"] .result > div + div { display:none; }
.product-page[data-service="basic"] .result { grid-template-columns:1fr; }