.circuit-catalog-model-slide{position:relative}
.circ-carousel-with-model .circ-carousel-dots{bottom:7px;gap:4px;padding:3px;background:#fffdf8e8;border:1px solid #d9d3c7;border-radius:20px;z-index:5}
.circ-carousel-with-model .circ-carousel-dot{width:auto;height:30px;min-width:38px;padding:0 9px;border-radius:16px;background:transparent;color:#365c49;font:600 11px/1 'DM Sans',sans-serif;transform:none}
.circ-carousel-with-model .circ-carousel-dot.active{background:#4e7464;color:#fff;transform:none}
.circ-carousel-with-model .circ-carousel-dot::after{content:none;display:none}
.circ-carousel-with-model .circ-carousel-arrow{z-index:5}
.circ-carousel-with-model .circuit-model-hint{top:9px;font-size:10px}
.circ-carousel-with-model .circuit-model-controls{right:7px;bottom:50px;gap:4px}
.circ-carousel-with-model .circuit-model-controls button{min-width:34px;width:34px;height:34px;font-size:19px}
.circ-carousel-with-model .circuit-model-status{font-size:12px;padding:30px}
.circ-carousel-with-model .circuit-model-status[hidden],.circuit-catalog-launch[hidden]{display:none}
.circuit-catalog-launch{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;min-height:44px;white-space:nowrap;border:1px solid #b6c4b9;border-radius:24px;background:#fffdf8;color:#365c49;padding:10px 18px;font:600 13px/1.4 'DM Sans',sans-serif;cursor:pointer}
.circ-carousel-with-model .circuit-model-stage[data-state=error] .circuit-catalog-launch{top:65%}
.circ-carousel-with-model button:focus-visible{outline:3px solid #a95334;outline-offset:2px}
@media(max-width:600px){.circ-carousel-with-model .circ-carousel-dot{height:36px;min-width:42px}.circ-carousel-with-model .circuit-model-controls{bottom:55px}.circ-carousel-with-model .circuit-model-controls button{min-width:38px;height:38px}}

/* Front view exported from the actual 2 K SKP, on the catalog beige background. */
.circ-card[data-search-title="Circuito 2 K"] .circ-img img{padding:0;max-height:none;width:100%;height:auto;object-fit:contain}
.circ-card[data-search-title="Circuito 2 K"] .circ-carousel{aspect-ratio:1;scroll-margin-top:100px}
.circ-card[data-search-title="Circuito 2 K"] .circ-carousel-track,.circ-card[data-search-title="Circuito 2 K"] .circ-carousel-slide,.circ-card[data-search-title="Circuito 2 K"] .circuit-model-stage{height:100%}
#producto-circuito-3-hierro{scroll-margin-top:110px}
#circuitsPanel #producto-circuito-3-hierro .circ-img{aspect-ratio:1;height:auto}

/* Circuito 5: keep the complete structure clear of the floating controls. */
.circ-card[data-search-title="Circuito 5"] .circuit-model-controls{top:7px;bottom:auto}
.circ-card[data-search-title="Circuito 5"] .circuit-model-hint{left:10px;right:auto;top:17px}
#circuitsPanel .circ-card:has(.circ-carousel-dot:nth-child(5)) .circ-cart-fab{bottom:62px}
#circuitsPanel .circ-card:has(.circ-carousel-dot:nth-child(5)) .circuit-model-controls{top:10px;bottom:auto}
#circuitsPanel .circ-card:has(.circ-carousel-dot:nth-child(5)) .circuit-model-hint{left:12px;right:auto;top:22px;max-width:calc(100% - 130px);text-align:left}
.circ-carousel-with-model:has(.circ-carousel-dot:nth-child(5)) .circ-carousel-dots{max-width:calc(100% - 14px);gap:1px}
.circ-carousel-with-model:has(.circ-carousel-dot:nth-child(5)) .circ-carousel-dot{min-width:36px;padding-inline:7px}
#producto-circuito-5-hierro{scroll-margin-top:110px}

/* Four dimensioned views: keep every label visible and navigation below them. */
#circuitsPanel .circ-card:has(.circ-carousel-dot:nth-child(6)) .circ-img{aspect-ratio:auto;height:auto}
.circ-carousel-with-model:has(.circ-carousel-dot:nth-child(6)){height:auto;display:flex;flex-direction:column}
.circ-carousel-with-model:has(.circ-carousel-dot:nth-child(6)) .circ-carousel-track{height:auto;aspect-ratio:1}
.circ-carousel-with-model:has(.circ-carousel-dot:nth-child(6)) .circ-carousel-dots{position:static;transform:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-self:center;width:calc(100% - 12px);max-width:360px;margin:6px auto;flex:0 0 auto}
.circ-carousel-with-model:has(.circ-carousel-dot:nth-child(6)) .circ-carousel-dot{height:38px}
#circuitsPanel .circ-card:has(.circ-carousel-dot:nth-child(6)) .circ-cart-fab{top:10px;bottom:auto}
#circuitsPanel .circ-card:has(.circ-carousel-dot:nth-child(6)):has(.circ-carousel:not([data-index="0"])) .circ-cart-fab{display:none}