.sobmedida-page {
    background: linear-gradient(180deg, #fff, #faf7f4);
}

.sobmedida-topo {
    max-width: 980px;
    margin: 0 auto;
    text-align: center;
}

.sobmedida-title {
    font-size: clamp(2.2rem, 5vw, 4.2rem);
    font-weight: 900;
    color: #2d211b;
    line-height: 1;
}

.sobmedida-subtitle {
    max-width: 760px;
    margin: 12px auto 0;
    color: #6b5f58;
    font-size: 1.08rem;
    line-height: 1.7;
}

.sobmedida-page .cortina-pre-modelo-zoom-trigger::after {
    opacity: 1 !important;
    transform: translateY(0) !important;
}


.sobmedida-preview-card {
    height: 100%;
    padding: 24px;
    border-radius: 30px;
    background: #faf7f4;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: 0 20px 55px rgba(45, 33, 27, .08);
}

.sobmedida-preview-zoom-btn {
    width: 100%;
    border: 0;
    background: #fff;
    border-radius: 28px;
    padding: 18px;
    position: relative;
    overflow: hidden;
}

.sobmedida-preview-img {
    width: 100%;
    height: min(72vh, 760px);
    max-height: 760px;
    object-fit: contain;
    border-radius: 24px;
    background: #fff;
}

.sobmedida-form-card {
    position: sticky;
    top: 24px;
    padding: 24px;
    border-radius: 28px;
    background: #fff;
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: 0 20px 55px rgba(45, 33, 27, .08);
}

.sobmedida-actions {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

    .sobmedida-actions .btn {
        min-height: 48px;
        border-radius: 14px;
    }

/* Carrossel nativo da página Sobmedida */
.sobmedida-page .cortina-pre-modelos-carousel {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding: 4px 2px 22px;
}

    .sobmedida-page .cortina-pre-modelos-carousel .swiper-wrapper {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 22px;
        overflow-x: auto;
        scroll-behavior: smooth;
        scrollbar-width: none;
        transform: none !important;
    }

        .sobmedida-page .cortina-pre-modelos-carousel .swiper-wrapper::-webkit-scrollbar {
            display: none;
        }

    .sobmedida-page .cortina-pre-modelos-carousel .swiper-slide {
        flex: 0 0 260px !important;
        width: 260px !important;
        max-width: 260px !important;
        height: auto !important;
    }

.sobmedida-page .cortina-pre-modelo-card {
    width: 100%;
    height: 340px;
    max-height: 340px;
    overflow: hidden;
}

.sobmedida-page .cortina-pre-modelo-img-wrap {
    height: 210px;
}

.sobmedida-page .cortina-pre-modelo-card .card-body {
    padding-top: 12px !important;
    padding-bottom: 0 !important;
}

.sobmedida-page .cortina-pre-modelo-card .text-muted {
    line-height: 1.25;
}

.sobmedida-page .cortina-pre-modelo-card .card-title {
    line-height: 1.2;
    margin-bottom: 0;
}

.cortina-pre-modelo-zoom-trigger {
    cursor: zoom-in;
    position: relative;
}

    .cortina-pre-modelo-zoom-trigger::after {
        content: "🔍";
        position: absolute;
        right: 10px;
        bottom: 10px;
        width: 34px;
        height: 34px;
        border-radius: 999px;
        background: rgba(255,255,255,.92);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: .95rem;
        box-shadow: 0 8px 20px rgba(0,0,0,.14);
        opacity: 0;
        transform: translateY(4px);
        transition: opacity .18s ease, transform .18s ease;
    }

    .cortina-pre-modelo-zoom-trigger:hover::after {
        opacity: 1;
        transform: translateY(0);
    }

.sobmedida-topo-acoes {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 100px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}

@media (max-width: 576px) {
    .sobmedida-topo-acoes {
        gap: 14px;
        margin-bottom: 14px;
    }
}

@media (max-width: 420px) {
    .sobmedida-page .cortina-pre-modelos-carousel .swiper-slide {
        flex: 0 0 calc(100vw - 48px) !important;
        width: calc(100vw - 48px) !important;
        max-width: 330px !important;
    }
}

@media (max-width: 768px) {

    .cortina-pre-modelo-zoom-trigger::after {
        opacity: 1;
        width: 32px;
        height: 32px;
        right: 8px;
        bottom: 8px;
    }
    .sobmedida-page {
        padding-top: 22px !important;
    }

    .sobmedida-preview-card,
    .sobmedida-form-card {
        padding: 16px;
        border-radius: 22px;
    }

    .sobmedida-preview-zoom-btn {
        padding: 10px;
        border-radius: 20px;
    }

    .sobmedida-preview-img {
        height: 62vh;
        max-height: 560px;
        min-height: 360px;
        border-radius: 18px;
    }

    .sobmedida-actions {
        flex-direction: column;
    }

        .sobmedida-actions .btn {
            width: 100%;
        }

    .sobmedida-page .cortina-pre-modelos-carousel {
        overflow: visible;
    }

        .sobmedida-page .cortina-pre-modelos-carousel .swiper-wrapper {
            gap: 18px;
        }

        .sobmedida-page .cortina-pre-modelos-carousel .swiper-slide {
            flex: 0 0 285px !important;
            width: 285px !important;
            max-width: 285px !important;
        }

}

@media (max-width: 991px) {
    .sobmedida-form-card {
        position: static;
    }

    .sobmedida-preview-img {
        height: min(68vh, 620px);
        max-height: 620px;
    }
}

@media (max-width: 767.98px) {
    .sobmedida-page .cortina-pre-total {
        display: grid !important;
        grid-template-columns: 1fr auto !important;
        align-items: center !important;
        column-gap: 12px !important;
        row-gap: 4px !important;
        padding: 18px 20px !important;
        border-radius: 20px !important;
    }

    .sobmedida-page .cortina-pre-total span {
        font-size: .95rem !important;
        line-height: 1.35 !important;
    }

    .sobmedida-page .cortina-pre-total strong {
        font-size: 1.42rem !important;
        line-height: 1.15 !important;
        white-space: nowrap !important;
        text-align: right !important;
    }

    .sobmedida-page .cortina-pre-modelos-carousel {
        overflow: hidden !important;
        padding-bottom: 12px !important;
    }

        .sobmedida-page .cortina-pre-modelos-carousel .swiper-wrapper {
            gap: 14px !important;
            align-items: flex-start !important;
        }

        .sobmedida-page .cortina-pre-modelos-carousel .swiper-slide {
            flex: 0 0 285px !important;
            width: 285px !important;
            max-width: 285px !important;
            height: auto !important;
        }

    .sobmedida-page .cortina-pre-modelo-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 12px 12px 8px !important;
        margin-bottom: 0 !important;
    }

    .sobmedida-page .cortina-pre-modelo-img-wrap {
        height: 210px !important;
    }

    .sobmedida-page .cortina-pre-modelo-card .card-body {
        padding-top: 9px !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }

    .sobmedida-page .cortina-pre-modelo-card .text-muted {
        margin-bottom: 1px !important;
        line-height: 1.15 !important;
    }

    .sobmedida-page .cortina-pre-modelo-card .card-title {
        margin-bottom: 0 !important;
        line-height: 1.12 !important;
    }
}

@media (max-width: 420px) {
    .sobmedida-page .cortina-pre-modelos-carousel .swiper-slide {
        flex: 0 0 280px !important;
        width: 280px !important;
        max-width: 280px !important;
    }

    .sobmedida-page .cortina-pre-modelo-img-wrap {
        height: 200px !important;
    }
}

/* =========================================================
   SOBMEDIDA - Remove Pare/Play e destaca avançar/voltar
   ========================================================= */

.sobmedida-page #btnPausePreviewCortinaPre,
.sobmedida-page #btnPauseZoomCortinaPre {
    display: none !important;
}

/* Botões azuis de navegação das imagens */
.sobmedida-page #btnPrevPreviewCortinaPre,
.sobmedida-page #btnNextPreviewCortinaPre,
.sobmedida-page #btnPrevZoomCortinaPre,
.sobmedida-page #btnNextZoomCortinaPre {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #1f5fae, #2f7de1) !important;
    color: #fff !important;
    font-size: 1.8rem !important;
    font-weight: 900 !important;
    box-shadow: 0 12px 28px rgba(31, 95, 174, .28) !important;
}

/* Área dos controles */
.sobmedida-page .cortina-pre-preview-controls,
.sobmedida-page .cortina-pre-zoom-controls {
    position: relative;
    gap: 14px !important;
    margin-top: 14px !important;
    padding-bottom: 34px !important;
}

    /* Aviso apontando para o próximo */
    .sobmedida-page .cortina-pre-preview-controls::after,
    .sobmedida-page .cortina-pre-zoom-controls::after {
        content: "Veja o próximo  ➜";
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
        color: #1f5fae;
        font-size: .92rem;
        font-weight: 900;
        line-height: 1;
        white-space: nowrap;
        letter-spacing: .02em;
    }

.cortina-pre-zoom-controls #btnPrevZoomCortinaPre,
.cortina-pre-zoom-controls #btnNextZoomCortinaPre {
    border: 2px solid rgba(255, 255, 255, .95) !important;
    box-shadow: 0 0 0 4px rgba(47, 125, 225, .18), 0 0 22px rgba(47, 125, 225, .62), 0 12px 28px rgba(31, 95, 174, .32) !important;
}

/* =========================================================
   SOBMEDIDA - Botões + e - no zoom da imagem
   ========================================================= */

.cortina-pre-zoom-main {
    position: relative;
    overflow: hidden;
    cursor: grab;
}

    .cortina-pre-zoom-main.is-dragging {
        cursor: grabbing;
    }

.sobmedida-zoom-extra-controls {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 20;
    display: inline-flex;
    flex-direction: column;
    gap: 8px;
}

    .sobmedida-zoom-extra-controls button {
        width: 42px;
        height: 42px;
        border-radius: 999px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 2px solid rgba(255, 255, 255, .95) !important;
        background: rgba(255, 255, 255, .96);
        color: #174ea6;
        font-size: 1.35rem;
        font-weight: 900;
        line-height: 1;
        cursor: pointer;
        box-shadow: 0 0 0 4px rgba(47, 125, 225, .18), 0 0 22px rgba(47, 125, 225, .62), 0 12px 28px rgba(31, 95, 174, .32) !important;
        transition: transform .16s ease, background .16s ease, color .16s ease;
    }

        .sobmedida-zoom-extra-controls button:hover {
            transform: translateY(-1px) scale(1.04);
            background: #2f7de1;
            color: #fff;
        }

.cortina-pre-zoom-img {
    transform-origin: center center;
    user-select: none;
    -webkit-user-drag: none;
    will-change: transform;
}

/* Mobile */
@media (max-width: 767.98px) {
    .sobmedida-zoom-extra-controls {
        top: 10px;
        right: 10px;
        flex-direction: row;
        gap: 7px;
    }

    .sobmedida-zoom-extra-controls button {
        width: 38px;
        height: 38px;
        font-size: 1.15rem;
    }

    .sobmedida-page #btnPrevPreviewCortinaPre,
    .sobmedida-page #btnNextPreviewCortinaPre,
    .sobmedida-page #btnPrevZoomCortinaPre,
    .sobmedida-page #btnNextZoomCortinaPre {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        font-size: 1.65rem !important;
    }

    .sobmedida-page .cortina-pre-preview-controls,
    .sobmedida-page .cortina-pre-zoom-controls {
        gap: 12px !important;
        margin-top: 12px !important;
        padding-bottom: 32px !important;
    }

        .sobmedida-page .cortina-pre-preview-controls::after,
        .sobmedida-page .cortina-pre-zoom-controls::after {
            font-size: .86rem;
        }
}

/* =========================================================
   SOBMEDIDA - Destaque para zoom e botões de navegação
   ========================================================= */

/* Texto "Clique para ampliar" com borda brilhante */
.sobmedida-page .cortina-pre-zoom-hint {
    position: absolute;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    z-index: 5;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .94);
    border: 2px solid #2f7de1;
    color: #174ea6;
    font-size: .92rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 0 0 4px rgba(47, 125, 225, .12), 0 0 18px rgba(47, 125, 225, .55), 0 12px 28px rgba(31, 95, 174, .20);
    animation: sobmedidaZoomPulse 1.8s ease-in-out infinite;
}

/* Lupa fixa sobre a imagem principal */
.sobmedida-page .sobmedida-preview-zoom-btn::after {
    content: "🔍";
    position: absolute;
    right: 24px;
    bottom: 24px;
    z-index: 6;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .95);
    border: 2px solid #2f7de1;
    font-size: 1.15rem;
    box-shadow: 0 0 0 4px rgba(47, 125, 225, .13), 0 0 18px rgba(47, 125, 225, .48), 0 12px 26px rgba(0, 0, 0, .18);
    pointer-events: none;
}

/* Borda brilhante nos botões de avançar/voltar */
.sobmedida-page #btnPrevPreviewCortinaPre,
.sobmedida-page #btnNextPreviewCortinaPre,
.sobmedida-page #btnPrevZoomCortinaPre,
.sobmedida-page #btnNextZoomCortinaPre {
    border: 2px solid rgba(255, 255, 255, .95) !important;
    box-shadow: 0 0 0 4px rgba(47, 125, 225, .18), 0 0 22px rgba(47, 125, 225, .62), 0 12px 28px rgba(31, 95, 174, .32) !important;
    animation: sobmedidaBtnPulse 1.7s ease-in-out infinite;
}

/* Animações suaves */
@keyframes sobmedidaZoomPulse {
    0%, 100% {
        box-shadow: 0 0 0 4px rgba(47, 125, 225, .12), 0 0 18px rgba(47, 125, 225, .55), 0 12px 28px rgba(31, 95, 174, .20);
    }

    50% {
        box-shadow: 0 0 0 7px rgba(47, 125, 225, .20), 0 0 28px rgba(47, 125, 225, .80), 0 14px 32px rgba(31, 95, 174, .28);
    }
}

@keyframes sobmedidaBtnPulse {
    0%, 100% {
        transform: translateY(0);
        filter: brightness(1);
    }

    50% {
        transform: translateY(-1px);
        filter: brightness(1.08);
    }
}

/* Ajuste mobile */
@media (max-width: 767.98px) {
    .sobmedida-page .cortina-pre-zoom-hint {
        bottom: 20px;
        padding: 8px 13px;
        font-size: .78rem;
    }

    .sobmedida-page .sobmedida-preview-zoom-btn::after {
        right: 16px;
        top: 20px;
        width: 38px;
        height: 38px;
        font-size: 1rem;
    }
}

/* =========================================================
   SOBMEDIDA WIZARD - NOVO LAYOUT
   Paleta marrom claro, branco e amarelo sutil
========================================================= */

.sobmedida-wizard-page {
    padding: 28px 0 46px !important;
    background: radial-gradient(circle at 10% 0%, rgba(255,255,255,.96), transparent 32%), linear-gradient(135deg, #fbf7f2 0%, #f3e9de 52%, #ead9c8 100%);
}

.sobmedida-container {
    max-width: 1560px;
}

.sobmedida-mobile-header {
    display: none;
}

.sobmedida-wizard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(390px, .88fr);
    gap: 26px;
    align-items: start;
}

.sobmedida-preview-card-new,
.sobmedida-form-card-new {
    border-radius: 34px;
    background: rgba(255,253,249,.90);
    border: 1px solid rgba(111,79,53,.12);
    box-shadow: 0 24px 70px rgba(68,49,37,.13);
    backdrop-filter: blur(10px);
}

.sobmedida-preview-card-new {
    padding: 22px;
}

.sobmedida-preview-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.sobmedida-back-btn {
    min-height: 40px;
    padding: 0 16px;
    border-radius: 999px;
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(111,79,53,.12);
    color: #6f4f35 !important;
    text-decoration: none;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .sobmedida-back-btn:hover {
        background: #fff3df;
        color: #6f4f35 !important;
        text-decoration: none;
    }

.sobmedida-model-badge {
    padding: 8px 15px;
    border-radius: 999px;
    background: #efe3d6;
    color: #76543b;
    font-size: .78rem;
    font-weight: 950;
}

.sobmedida-preview-zoom-btn {
    background: #fffaf4 !important;
    border: 1px solid rgba(111,79,53,.10) !important;
}

.sobmedida-preview-img {
    height: min(64vh, 640px) !important;
    object-fit: cover !important;
    border-radius: 24px !important;
}

.sobmedida-preview-info {
    margin-top: 18px;
}

    .sobmedida-preview-info h1 {
        margin: 0 0 8px;
        color: #2d2520;
        font-size: clamp(2rem, 4vw, 4rem);
        line-height: .96;
        font-weight: 950;
        letter-spacing: -.05em;
    }

    .sobmedida-preview-info p {
        max-width: 780px;
        margin: 0 0 14px;
        color: #5d5149;
        font-size: 1rem;
        line-height: 1.45;
    }

.sobmedida-price-card {
    width: fit-content;
    background: rgba(255,255,255,.92) !important;
}

.sobmedida-modelos-rapidos {
    margin-top: 18px;
}

    .sobmedida-modelos-rapidos > span {
        display: block;
        margin-bottom: 10px;
        color: #2d2520;
        font-weight: 950;
    }

.sobmedida-modelos-rapidos-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.sobmedida-modelo-chip {
    padding: 8px;
    border-radius: 16px;
    border: 1px solid rgba(111,79,53,.14);
    background: rgba(255,255,255,.82);
    color: #2d2520;
    cursor: pointer;
    text-align: center;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

    .sobmedida-modelo-chip:hover,
    .sobmedida-modelo-chip.is-active {
        transform: translateY(-2px);
        border-color: rgba(155,118,86,.72);
        box-shadow: 0 12px 26px rgba(68,49,37,.13);
    }

    .sobmedida-modelo-chip img {
        width: 100%;
        height: 76px;
        object-fit: cover;
        border-radius: 12px;
        margin-bottom: 6px;
    }

    .sobmedida-modelo-chip small {
        display: -webkit-box;
        color: #4a3b31;
        font-size: .72rem;
        line-height: 1.15;
        font-weight: 850;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

/* Formulário / abas */
.sobmedida-form-card-new {
    position: sticky;
    top: 18px;
    padding: 20px;
}

.sobmedida-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 8px;
    border-radius: 20px;
    background: #f6eee6;
    border: 1px solid rgba(111,79,53,.08);
    margin-bottom: 18px;
}

.sobmedida-step {
    min-height: 46px;
    border: 0;
    border-radius: 15px;
    background: transparent;
    color: #7a6a61;
    font-size: .82rem;
    font-weight: 950;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}

    .sobmedida-step span {
        width: 24px;
        height: 24px;
        border-radius: 999px;
        background: #e6d7c8;
        color: #76543b;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: .72rem;
    }

    .sobmedida-step.is-active {
        background: #fff;
        color: #2d2520;
        box-shadow: 0 10px 24px rgba(68,49,37,.08);
    }

        .sobmedida-step.is-active span {
            background: linear-gradient(135deg, #b18b67, #8a6648);
            color: #fff;
        }

.sobmedida-tab {
    display: none;
}

    .sobmedida-tab.is-active {
        display: block;
    }

.sobmedida-tab-head h2 {
    margin: 0 0 6px;
    color: #2d2520;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.9rem, 3vw, 3rem);
    line-height: .98;
    font-weight: 500;
    letter-spacing: -.045em;
}

.sobmedida-tab-head p {
    margin: 0 0 16px;
    color: #5d5149;
    font-size: .96rem;
    line-height: 1.42;
}

.sobmedida-medida-visual {
    position: relative;
    margin-bottom: 16px;
    border-radius: 22px;
    overflow: hidden;
    background: #eee4da;
    border: 1px solid rgba(111,79,53,.10);
}

    .sobmedida-medida-visual img {
        width: 100%;
        height: 220px;
        object-fit: cover;
        display: block;
    }

    .sobmedida-medida-visual button {
        position: absolute;
        left: 14px;
        bottom: 14px;
        min-height: 38px;
        padding: 0 14px;
        border: 0;
        border-radius: 999px;
        background: rgba(255,255,255,.92);
        color: #6f4f35;
        font-weight: 950;
        box-shadow: 0 10px 24px rgba(68,49,37,.12);
    }

.sobmedida-medidas-grid {
    display: grid;
    gap: 14px;
}

.sobmedida-medida-box {
    padding: 16px;
    border-radius: 20px;
    background: rgba(255,255,255,.84);
    border: 1px solid rgba(111,79,53,.12);
}

    .sobmedida-medida-box label {
        display: block;
        color: #4a3b31;
        font-size: .84rem;
        font-weight: 950;
        margin-bottom: 7px;
    }

.sobmedida-input-medida {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 10px;
}

    .sobmedida-input-medida input {
        width: 100%;
        min-height: 54px;
        border: 0;
        outline: 0;
        background: transparent;
        color: #2d2520;
        font-size: 2rem;
        font-weight: 950;
    }

    .sobmedida-input-medida span {
        color: #6f4f35;
        font-weight: 900;
    }

.sobmedida-medida-box small {
    display: block;
    color: #8a7667;
    font-size: .78rem;
}

.sobmedida-info-card {
    margin-top: 16px;
    padding: 14px;
    border-radius: 18px;
    background: rgba(255, 244, 224, .86);
    border: 1px solid rgba(177,139,103,.20);
}

    .sobmedida-info-card strong {
        display: block;
        color: #4a3527;
        margin-bottom: 4px;
    }

    .sobmedida-info-card p {
        margin: 0;
        color: #6f4f35;
        font-size: .88rem;
        line-height: 1.4;
    }

.sobmedida-next-btn,
.sobmedida-btn-cart,
.sobmedida-btn-add {
    width: 100%;
    min-height: 54px;
    margin-top: 16px;
    border: 0;
    border-radius: 17px;
    font-weight: 950;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.sobmedida-next-btn,
.sobmedida-btn-cart {
    background: linear-gradient(135deg, #b18b67, #8a6648);
    color: #fff;
    box-shadow: 0 14px 30px rgba(90,62,38,.20);
}

.sobmedida-btn-add {
    background: #ffe1a2;
    color: #3f2a1e;
}

.sobmedida-cor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.sobmedida-cor-card,
.sobmedida-abertura-card {
    display: block;
    cursor: pointer;
}

    .sobmedida-cor-card input,
    .sobmedida-abertura-card input {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

.sobmedida-cor-visual,
.sobmedida-abertura-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    min-height: 118px;
    padding: 14px;
    border-radius: 20px;
    background: rgba(255,255,255,.84);
    border: 1px solid rgba(111,79,53,.12);
    text-align: center;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.sobmedida-cor-card input:checked + .sobmedida-cor-visual,
.sobmedida-abertura-card input:checked + .sobmedida-abertura-content {
    border-color: rgba(155,118,86,.72);
    background: #fff8ec;
    box-shadow: 0 12px 28px rgba(68,49,37,.12);
}

.sobmedida-cor-visual img,
.sobmedida-cor-visual .color-dot {
    width: 54px;
    height: 54px;
    border-radius: 999px;
    object-fit: cover;
    border: 1px solid rgba(111,79,53,.16);
}

.sobmedida-cor-card strong {
    display: block;
    margin-top: 7px;
    color: #2d2520;
    font-size: .86rem;
    font-weight: 900;
    text-align: center;
}

.sobmedida-abertura-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.sobmedida-abertura-content {
    min-height: 230px;
    justify-content: flex-start;
}

    .sobmedida-abertura-content img {
        width: 100%;
        height: 132px;
        object-fit: contain;
        border-radius: 14px;
        background: #f7efe7;
    }

    .sobmedida-abertura-content strong {
        color: #2d2520;
        font-size: .95rem;
        font-weight: 950;
    }

    .sobmedida-abertura-content small {
        color: #6f6258;
        font-size: .78rem;
        line-height: 1.28;
    }

/* =========================================================
   MOBILE - visual inspirado nos anexos
========================================================= */

@media (max-width: 991.98px) {
    .sobmedida-wizard-grid {
        grid-template-columns: 1fr;
    }

    .sobmedida-form-card-new {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .sobmedida-wizard-page {
        padding: 10px 0 28px !important;
    }

    .sobmedida-container {
        --bs-gutter-x: .9rem;
    }

    .sobmedida-mobile-header {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 10px;
        align-items: center;
        margin-bottom: 12px;
        padding: 8px 2px;
    }

        .sobmedida-mobile-header div {
            min-width: 0;
        }

        .sobmedida-mobile-header span {
            display: block;
            color: #8a7667;
            font-size: .72rem;
            line-height: 1.1;
        }

        .sobmedida-mobile-header strong {
            display: block;
            color: #2d2520;
            font-family: Georgia, "Times New Roman", serif;
            font-size: 1.25rem;
            line-height: 1.05;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

    .sobmedida-back-desktop {
        display: none;
    }

    .sobmedida-wizard-grid {
        gap: 14px;
    }

    .sobmedida-preview-card-new {
        padding: 10px;
        border-radius: 26px;
    }

    .sobmedida-preview-top {
        display: none;
    }

    .sobmedida-preview-zoom-btn {
        padding: 0 !important;
        border-radius: 22px !important;
    }

    .sobmedida-preview-img {
        height: 315px !important;
        min-height: 0 !important;
        max-height: none !important;
        border-radius: 22px !important;
    }

    .sobmedida-preview-info {
        padding: 12px 4px 2px;
        margin-top: 0;
    }

        .sobmedida-preview-info h1 {
            font-size: 1.7rem;
            line-height: 1.02;
        }

        .sobmedida-preview-info p {
            font-size: .86rem;
            line-height: 1.35;
        }

    .sobmedida-price-card {
        width: 100%;
        margin-top: 10px;
    }

    .sobmedida-modelos-rapidos-grid {
        display: flex;
        overflow-x: auto;
        gap: 9px;
        padding-bottom: 4px;
        scrollbar-width: none;
    }

        .sobmedida-modelos-rapidos-grid::-webkit-scrollbar {
            display: none;
        }

    .sobmedida-modelo-chip {
        flex: 0 0 105px;
        padding: 7px;
        border-radius: 14px;
    }

        .sobmedida-modelo-chip img {
            height: 58px;
            border-radius: 10px;
        }

        .sobmedida-modelo-chip small {
            font-size: .64rem;
        }

    .sobmedida-form-card-new {
        padding: 12px;
        border-radius: 26px;
    }

    .sobmedida-steps {
        position: sticky;
        top: 0;
        z-index: 10;
        grid-template-columns: repeat(3, 1fr);
        gap: 5px;
        padding: 6px;
        border-radius: 18px;
        margin-bottom: 14px;
    }

    .sobmedida-step {
        min-height: 40px;
        font-size: .7rem;
        gap: 4px;
    }

        .sobmedida-step span {
            width: 21px;
            height: 21px;
            font-size: .65rem;
        }

    .sobmedida-tab-head h2 {
        font-size: 1.9rem;
    }

    .sobmedida-tab-head p {
        font-size: .88rem;
        line-height: 1.35;
        margin-bottom: 12px;
    }

    .sobmedida-medida-visual img {
        height: 178px;
    }

    .sobmedida-medida-box {
        padding: 13px;
        border-radius: 17px;
    }

    .sobmedida-input-medida input {
        min-height: 46px;
        font-size: 1.65rem;
    }

    .sobmedida-cor-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
    }

    .sobmedida-cor-visual {
        min-height: 104px;
        border-radius: 17px;
        padding: 12px;
    }

    .sobmedida-abertura-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .sobmedida-abertura-content {
        min-height: 0;
        display: grid;
        grid-template-columns: 112px 1fr;
        text-align: left;
        align-items: center;
        column-gap: 12px;
    }

        .sobmedida-abertura-content img {
            grid-row: 1 / span 2;
            height: 112px;
        }

    .sobmedida-actions-final {
        position: sticky;
        bottom: 10px;
        z-index: 12;
        padding-top: 8px;
        background: linear-gradient(to top, rgba(255,253,249,.98) 80%, rgba(255,253,249,0));
    }
}

@media (max-width: 390px) {
    .sobmedida-preview-img {
        height: 280px !important;
    }

    .sobmedida-preview-info h1 {
        font-size: 1.48rem;
    }

    .sobmedida-step {
        font-size: .66rem;
    }
}

.sobmedida-cor-card {
    position: relative;
}

.sobmedida-cor-visual {
    position: relative;
    min-height: 190px !important;
    padding: 0 !important;
    overflow: hidden;
    border-radius: 22px !important;
    background: #f5ede5 !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
}

    .sobmedida-cor-visual .sobmedida-cor-img,
    .sobmedida-cor-visual img {
        width: 100% !important;
        height: 100% !important;
        min-height: 190px !important;
        border-radius: 0 !important;
        object-fit: cover !important;
        border: 0 !important;
        display: block;
        transition: transform .22s ease, filter .22s ease;
    }

.sobmedida-cor-overlay {
    position: absolute;
    left: 12px;
    bottom: 12px;
    z-index: 2;
    padding: 7px 13px;
    border-radius: 999px;
    background: rgba(255,255,255,.92);
    color: #6f4f35;
    font-size: .78rem;
    font-weight: 950;
    box-shadow: 0 10px 22px rgba(68,49,37,.14);
}

.sobmedida-cor-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(47,37,30,.20), rgba(255,255,255,0) 52%);
    pointer-events: none;
}

.sobmedida-cor-card:hover .sobmedida-cor-img {
    transform: scale(1.035);
}

.sobmedida-cor-card input:checked + .sobmedida-cor-visual {
    border-color: rgba(155,118,86,.88) !important;
    box-shadow: 0 0 0 4px rgba(255,225,162,.38), 0 16px 32px rgba(68,49,37,.16) !important;
}

    .sobmedida-cor-card input:checked + .sobmedida-cor-visual::before {
        content: "✓";
        position: absolute;
        right: 12px;
        top: 12px;
        z-index: 3;
        width: 34px;
        height: 34px;
        border-radius: 999px;
        background: linear-gradient(135deg, #b18b67, #8a6648);
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: 950;
        box-shadow: 0 10px 22px rgba(68,49,37,.20);
    }

.sobmedida-cor-card strong {
    margin-top: 9px !important;
    font-size: .95rem !important;
}

/* Validação visual */
.sobmedida-erro-campo .sobmedida-input-medida,
.sobmedida-erro-campo .sobmedida-cor-visual,
.sobmedida-erro-campo .sobmedida-abertura-content {
    border-color: rgba(185, 28, 28, .75) !important;
    box-shadow: 0 0 0 4px rgba(239, 68, 68, .13), 0 0 20px rgba(239, 68, 68, .22) !important;
    animation: sobmedidaErroPulse .9s ease-in-out infinite;
}

.sobmedida-step.sobmedida-step-erro {
    color: #991b1b !important;
    background: #fff1f1 !important;
}

    .sobmedida-step.sobmedida-step-erro span {
        background: #ef4444 !important;
        color: #fff !important;
    }

.sobmedida-aviso-validacao {
    position: fixed;
    left: 50%;
    bottom: 22px;
    z-index: 99999;
    width: min(calc(100% - 28px), 520px);
    transform: translate(-50%, 18px);
    padding: 14px 18px;
    border-radius: 18px;
    background: rgba(127, 29, 29, .96);
    color: #fff;
    font-weight: 850;
    font-size: .92rem;
    line-height: 1.35;
    text-align: center;
    box-shadow: 0 18px 42px rgba(127, 29, 29, .28);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .22s ease, visibility .22s ease, transform .22s ease;
}

    .sobmedida-aviso-validacao.is-visible {
        opacity: 1;
        visibility: visible;
        transform: translate(-50%, 0);
    }

@keyframes sobmedidaErroPulse {
    0%, 100% {
        box-shadow: 0 0 0 4px rgba(239, 68, 68, .13), 0 0 20px rgba(239, 68, 68, .20);
    }

    50% {
        box-shadow: 0 0 0 6px rgba(239, 68, 68, .20), 0 0 28px rgba(239, 68, 68, .32);
    }
}

/* Desktop: imagem da cor maior e elegante */
@media (min-width: 992px) {
    .sobmedida-cor-visual {
        min-height: 210px !important;
    }

        .sobmedida-cor-visual .sobmedida-cor-img,
        .sobmedida-cor-visual img {
            min-height: 210px !important;
        }
}

/* Mobile */
@media (max-width: 767.98px) {
    .sobmedida-cor-grid {
        grid-template-columns: 1fr !important;
        gap: 13px !important;
    }

    .sobmedida-cor-visual {
        min-height: 170px !important;
        border-radius: 19px !important;
    }

        .sobmedida-cor-visual .sobmedida-cor-img,
        .sobmedida-cor-visual img {
            min-height: 170px !important;
        }

    .sobmedida-cor-overlay {
        left: 10px;
        bottom: 10px;
        padding: 6px 11px;
        font-size: .72rem;
    }

    .sobmedida-cor-card strong {
        text-align: left !important;
        padding-left: 3px;
    }

    .sobmedida-aviso-validacao {
        bottom: 16px;
        border-radius: 16px;
        font-size: .86rem;
    }
}

.sobmedida-cor-visual {
    min-height: 145px !important;
    height: 145px !important;
    border-radius: 18px !important;
}

    .sobmedida-cor-visual .sobmedida-cor-img,
    .sobmedida-cor-visual img {
        min-height: 145px !important;
        height: 145px !important;
        object-fit: cover !important;
    }

/* Desktop um pouco maior, mas ainda menor que antes */
@media (min-width: 992px) {
    .sobmedida-cor-visual {
        min-height: 155px !important;
        height: 155px !important;
    }

        .sobmedida-cor-visual .sobmedida-cor-img,
        .sobmedida-cor-visual img {
            min-height: 155px !important;
            height: 155px !important;
        }
}

/* Mobile: compacto e bonito */
@media (max-width: 767.98px) {
    .sobmedida-cor-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .sobmedida-cor-visual {
        min-height: 118px !important;
        height: 118px !important;
        border-radius: 16px !important;
    }

        .sobmedida-cor-visual .sobmedida-cor-img,
        .sobmedida-cor-visual img {
            min-height: 118px !important;
            height: 118px !important;
        }

    .sobmedida-cor-overlay {
        left: 8px !important;
        bottom: 8px !important;
        padding: 5px 9px !important;
        font-size: .66rem !important;
    }

    .sobmedida-cor-card strong {
        font-size: .82rem !important;
        text-align: center !important;
        padding-left: 0 !important;
    }
}

/* Borda amarela no selecionado - cores */
.sobmedida-cor-card input:checked + .sobmedida-cor-visual {
    border: 2px solid #ffc43f !important;
    background: #fff8ec !important;
    box-shadow: 0 0 0 4px rgba(255, 196, 63, .22), 0 14px 30px rgba(68, 49, 37, .14) !important;
}

    /* Check amarelo/marrom no selecionado - cores */
    .sobmedida-cor-card input:checked + .sobmedida-cor-visual::before {
        content: "✓";
        position: absolute;
        right: 10px;
        top: 10px;
        z-index: 4;
        width: 30px;
        height: 30px;
        border-radius: 999px;
        background: #ffc43f !important;
        color: #4a3527 !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: 950;
        box-shadow: 0 8px 18px rgba(68, 49, 37, .18);
    }

/* Borda amarela no selecionado - abertura */
.sobmedida-abertura-card input:checked + .sobmedida-abertura-content {
    border: 2px solid #ffc43f !important;
    background: #fff8ec !important;
    box-shadow: 0 0 0 4px rgba(255, 196, 63, .22), 0 14px 30px rgba(68, 49, 37, .14) !important;
    position: relative;
}

    /* Check no selecionado - abertura */
    .sobmedida-abertura-card input:checked + .sobmedida-abertura-content::before {
        content: "✓";
        position: absolute;
        right: 10px;
        top: 10px;
        z-index: 4;
        width: 30px;
        height: 30px;
        border-radius: 999px;
        background: #ffc43f;
        color: #4a3527;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: 950;
        box-shadow: 0 8px 18px rgba(68, 49, 37, .18);
    }

/* Erro vermelho continua acima do amarelo quando faltar seleção */
.sobmedida-erro-campo .sobmedida-cor-visual,
.sobmedida-erro-campo .sobmedida-abertura-content,
.sobmedida-erro-campo .sobmedida-input-medida {
    border: 2px solid rgba(185, 28, 28, .82) !important;
    box-shadow: 0 0 0 4px rgba(239, 68, 68, .16), 0 0 22px rgba(239, 68, 68, .28) !important;
    animation: sobmedidaErroPulse .9s ease-in-out infinite;
}

/* Dá borda real ao box da medida para o erro aparecer melhor */
.sobmedida-input-medida {
    border: 1px solid rgba(111, 79, 53, .12);
    border-radius: 14px;
    padding: 0 12px;
    background: rgba(255,255,255,.68);
}

/* Imagem de medidas clicável */
.sobmedida-medida-visual {
    cursor: zoom-in;
}

    .sobmedida-medida-visual::after {
        content: "🔍";
        position: absolute;
        right: 14px;
        bottom: 14px;
        z-index: 3;
        width: 38px;
        height: 38px;
        border-radius: 999px;
        background: rgba(255,255,255,.94);
        color: #6f4f35;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1rem;
        box-shadow: 0 10px 24px rgba(68,49,37,.16);
        pointer-events: none;
    }

    .sobmedida-medida-visual:hover img {
        transform: scale(1.025);
    }

    .sobmedida-medida-visual img {
        transition: transform .22s ease;
    }

/* =========================================================
   ZOOM DA IMAGEM "COMO MEDIR"
========================================================= */

.medir-cortina-zoom-box {
    width: min(1100px, calc(100vw - 28px));
    max-height: 92vh;
    display: grid;
    gap: 12px;
}

.medir-cortina-zoom-stage {
    position: relative;
    width: 100%;
    height: min(78vh, 760px);
    overflow: hidden;
    border-radius: 24px;
    background: #fffaf4;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: grab;
    box-shadow: 0 24px 70px rgba(0,0,0,.28);
}

    .medir-cortina-zoom-stage.is-dragging {
        cursor: grabbing;
    }

    .medir-cortina-zoom-stage .medir-cortina-zoom-img {
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        object-fit: contain;
        transform-origin: center center;
        user-select: none;
        -webkit-user-drag: none;
        will-change: transform;
        transition: transform .08s linear;
    }

.medir-cortina-zoom-controls {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 20;
    display: inline-flex;
    flex-direction: column;
    gap: 8px;
}

    .medir-cortina-zoom-controls button {
        width: 42px;
        height: 42px;
        border-radius: 999px;
        border: 2px solid rgba(255,255,255,.95);
        background: rgba(255,255,255,.96);
        color: #6f4f35;
        font-size: 1.35rem;
        font-weight: 950;
        line-height: 1;
        cursor: pointer;
        box-shadow: 0 0 0 4px rgba(255, 196, 63, .18), 0 12px 28px rgba(68,49,37,.24);
        transition: transform .16s ease, background .16s ease;
    }

        .medir-cortina-zoom-controls button:hover {
            transform: translateY(-1px) scale(1.04);
            background: #ffe1a2;
        }

.medir-cortina-zoom-info {
    padding: 12px 16px;
    border-radius: 18px;
    background: rgba(255,253,249,.94);
    color: #6f4f35;
    text-align: center;
    box-shadow: 0 14px 34px rgba(0,0,0,.14);
}

    .medir-cortina-zoom-info strong {
        display: block;
        color: #2d2520;
        font-weight: 950;
        margin-bottom: 3px;
    }

    .medir-cortina-zoom-info span {
        display: block;
        font-size: .86rem;
        line-height: 1.3;
    }

/* Mobile */
@media (max-width: 767.98px) {
    .medir-cortina-zoom-box {
        width: calc(100vw - 18px);
        max-height: 90vh;
    }

    .medir-cortina-zoom-stage {
        height: 72vh;
        border-radius: 20px;
    }

    .medir-cortina-zoom-controls {
        top: 10px;
        right: 10px;
        flex-direction: row;
        gap: 7px;
    }

        .medir-cortina-zoom-controls button {
            width: 38px;
            height: 38px;
            font-size: 1.12rem;
        }

    .medir-cortina-zoom-info {
        font-size: .82rem;
        padding: 10px 12px;
    }
}

/* =========================================================
   SOBMEDIDA - FORMULÁRIO SEM ABAS
   Medidas, cor e abertura em sequência
========================================================= */

.sobmedida-form-stack {
    display: grid;
    gap: 18px;
}

.sobmedida-config-section {
    padding: 16px;
    border-radius: 24px;
    background: rgba(255,255,255,.66);
    border: 1px solid rgba(111,79,53,.10);
    box-shadow: 0 12px 28px rgba(68,49,37,.06);
}

.sobmedida-config-head {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 10px;
    align-items: start;
    margin-bottom: 14px;
}

    .sobmedida-config-head > span {
        width: 34px;
        height: 34px;
        border-radius: 999px;
        background: linear-gradient(135deg, #b18b67, #8a6648);
        color: #fff;
        font-size: .82rem;
        font-weight: 950;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .sobmedida-config-head h2 {
        margin: 0 0 4px;
        color: #2d2520;
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(1.55rem, 2.4vw, 2.35rem);
        line-height: 1;
        font-weight: 500;
        letter-spacing: -.04em;
    }

    .sobmedida-config-head p {
        margin: 0;
        color: #5d5149;
        font-size: .88rem;
        line-height: 1.35;
    }

        .sobmedida-config-head p strong {
            color: #4a3527;
        }

/* Medidas lado a lado */
.sobmedida-medidas-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Texto explicativo menor */
.sobmedida-info-card {
    margin-top: 12px !important;
    padding: 12px 13px !important;
    border-radius: 16px !important;
}

    .sobmedida-info-card strong {
        font-size: .88rem;
    }

    .sobmedida-info-card p {
        font-size: .82rem !important;
        line-height: 1.35 !important;
    }

/* Remove qualquer aparência antiga de abas, caso reste alguma classe no CSS */
.sobmedida-steps,
.sobmedida-step,
.sobmedida-next-btn {
    display: none !important;
}

/* Garante que se alguma section ainda tiver classe antiga, ela não esconda */
.sobmedida-tab {
    display: block !important;
}

/* Form maior no desktop, imagem acompanha melhor */
@media (min-width: 992px) {
    .sobmedida-wizard-grid {
        grid-template-columns: minmax(0, 1.08fr) minmax(430px, .92fr) !important;
        align-items: stretch !important;
    }

    .sobmedida-preview-card-new {
        position: sticky;
        top: 18px;
        min-height: calc(100vh - 42px);
        display: flex;
        flex-direction: column;
    }

    .sobmedida-preview-zoom-btn {
        flex: 1 1 auto;
    }

    .sobmedida-preview-img {
        height: min(76vh, 760px) !important;
    }

    .sobmedida-form-card-new {
        position: static !important;
    }
}

/* Botões finais continuam no fim */
.sobmedida-actions-final {
    margin-top: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

    .sobmedida-actions-final .btn {
        margin-top: 0 !important;
    }

/* Mobile: sequência confortável */
@media (max-width: 767.98px) {
    .sobmedida-form-stack {
        gap: 14px;
    }

    .sobmedida-config-section {
        padding: 13px;
        border-radius: 21px;
    }

    .sobmedida-config-head {
        grid-template-columns: 30px 1fr;
        gap: 9px;
        margin-bottom: 12px;
    }

        .sobmedida-config-head > span {
            width: 30px;
            height: 30px;
            font-size: .76rem;
        }

        .sobmedida-config-head h2 {
            font-size: 1.55rem;
        }

        .sobmedida-config-head p {
            font-size: .82rem;
            line-height: 1.32;
        }

    .sobmedida-medidas-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 9px !important;
    }

    .sobmedida-medida-box {
        padding: 11px !important;
    }

    .sobmedida-input-medida {
        padding: 0 8px !important;
    }

        .sobmedida-input-medida input {
            font-size: 1.3rem !important;
            min-height: 42px !important;
        }

    .sobmedida-medida-box small {
        font-size: .68rem;
        line-height: 1.2;
    }

    .sobmedida-medida-visual img {
        height: 145px !important;
    }

    .sobmedida-actions-final {
        grid-template-columns: 1fr;
        position: sticky;
        bottom: 10px;
        z-index: 12;
        padding-top: 8px;
        background: linear-gradient(to top, rgba(255,253,249,.98) 78%, rgba(255,253,249,0));
    }
}

/* Mobile bem pequeno: evita aperto nas medidas */
@media (max-width: 380px) {
    .sobmedida-medidas-grid {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   SOBMEDIDA - INFO CARD RECOLHÍVEL
========================================================= */

.sobmedida-info-toggle {
    padding: 0 !important;
    overflow: hidden;
}

    .sobmedida-info-toggle summary {
        min-height: 42px;
        padding: 11px 13px;
        cursor: pointer;
        list-style: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

        .sobmedida-info-toggle summary::-webkit-details-marker {
            display: none;
        }

        .sobmedida-info-toggle summary strong {
            margin: 0 !important;
            color: #4a3527;
            font-size: .88rem;
            font-weight: 950;
        }

        .sobmedida-info-toggle summary span {
            width: 24px;
            height: 24px;
            border-radius: 999px;
            background: rgba(255,255,255,.82);
            color: #6f4f35;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: .95rem;
            font-weight: 950;
            line-height: 1;
            transition: transform .18s ease;
        }

    .sobmedida-info-toggle[open] summary span {
        transform: rotate(180deg);
    }

    .sobmedida-info-toggle p {
        padding: 0 13px 12px;
        margin: 0 !important;
        color: #6f4f35;
        font-size: .82rem !important;
        line-height: 1.35 !important;
    }

/* Mobile: ocupa menos altura */
@media (max-width: 767.98px) {
    .sobmedida-info-toggle summary {
        min-height: 38px;
        padding: 9px 11px;
    }

        .sobmedida-info-toggle summary strong {
            font-size: .82rem;
        }

        .sobmedida-info-toggle summary span {
            width: 22px;
            height: 22px;
            font-size: .86rem;
        }

    .sobmedida-info-toggle p {
        padding: 0 11px 10px;
        font-size: .78rem !important;
    }
}

/* =========================================================
   SOBMEDIDA - DESKTOP: FUNDO OPACO NA IMAGEM PRINCIPAL
========================================================= */

@media (min-width: 992px) {
    .sobmedida-preview-zoom-btn {
        position: relative !important;
        min-height: 720px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background-image: var(--sobmedida-preview-bg) !important;
        background-size: cover !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
    }

        .sobmedida-preview-zoom-btn::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 0;
            background: rgba(255, 250, 244, .72);
            backdrop-filter: blur(10px);
            pointer-events: none;
        }

    .sobmedida-preview-img {
        position: relative !important;
        z-index: 1 !important;
        width: 94% !important;
        max-width: 94% !important;
        height: min(82vh, 760px) !important;
        min-height: 690px !important;
        object-fit: cover !important;
        object-position: center !important;
        background: transparent !important;
        box-shadow: 0 18px 46px rgba(68,49,37,.12);
    }

    .sobmedida-page .cortina-pre-zoom-hint,
    .sobmedida-page .sobmedida-preview-zoom-btn::after {
        z-index: 3 !important;
    }
}

/* =========================================================
   SOBMEDIDA - AJUSTE MOBILE GERAL
   Título completo, imagem maior e fundo ocupando tudo
========================================================= */

@media (max-width: 767.98px) {
    html,
    body {
        min-height: 100%;
        background: linear-gradient(135deg, #fbf7f2 0%, #f3e9de 52%, #ead9c8 100%) !important;
    }

    .sobmedida-page,
    .sobmedida-wizard-page {
        min-height: 100dvh !important;
        background: radial-gradient(circle at 10% 0%, rgba(255,255,255,.96), transparent 32%), linear-gradient(135deg, #fbf7f2 0%, #f3e9de 52%, #ead9c8 100%) !important;
    }

    .sobmedida-container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /* Header mobile: deixa o nome quebrar linha e aparecer inteiro */
    .sobmedida-mobile-header {
        grid-template-columns: auto minmax(0, 1fr) !important;
        align-items: flex-start !important;
        gap: 9px !important;
        margin-bottom: 10px !important;
    }

        .sobmedida-mobile-header strong {
            white-space: normal !important;
            overflow: visible !important;
            text-overflow: unset !important;
            display: block !important;
            max-width: 100% !important;
            font-size: clamp(1.12rem, 5.4vw, 1.45rem) !important;
            line-height: 1.06 !important;
        }

        .sobmedida-mobile-header span {
            font-size: .7rem !important;
            margin-bottom: 2px !important;
        }

    .sobmedida-back-btn {
        min-height: 36px !important;
        padding: 0 12px !important;
        font-size: .82rem !important;
        white-space: nowrap !important;
    }

    /* Card principal ocupa melhor a largura do celular */
    .sobmedida-preview-card-new {
        width: 100% !important;
        padding: 9px !important;
        border-radius: 24px !important;
    }

    .sobmedida-preview-zoom-btn {
        width: 100% !important;
        min-height: min(72vh, 560px) !important;
        padding: 0 !important;
        border-radius: 21px !important;
        display: flex !important;
        align-items: stretch !important;
        justify-content: center !important;
        background: #fffaf4 !important;
    }

    .sobmedida-preview-img {
        width: 100% !important;
        height: auto !important;
        min-height: min(62vh, 470px) !important;
        max-height: none !important;
        object-fit: cover !important;
        object-position: center !important;
        border-radius: 21px !important;
        display: block !important;
    }

    /* Evita o título grande de baixo cortar/estourar */
    .sobmedida-preview-info {
        width: 100% !important;
        padding: 12px 3px 2px !important;
    }

        .sobmedida-preview-info h1 {
            width: 100% !important;
            max-width: 100% !important;
            overflow-wrap: anywhere !important;
            word-break: normal !important;
            hyphens: auto !important;
            font-size: clamp(1.55rem, 8.2vw, 2.25rem) !important;
            line-height: 1.02 !important;
            letter-spacing: -.04em !important;
            margin-bottom: 8px !important;
        }

        .sobmedida-preview-info p {
            font-size: .84rem !important;
            line-height: 1.32 !important;
        }

    .sobmedida-price-card {
        width: 100% !important;
    }

    /* Cards de modelos: ficam dentro da tela, sem estourar */
    .sobmedida-modelos-rapidos {
        width: 100% !important;
        overflow: hidden !important;
    }

    .sobmedida-modelos-rapidos-grid {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        overflow: visible !important;
        padding-bottom: 0 !important;
    }

    .sobmedida-modelo-chip {
        width: 100% !important;
        min-width: 0 !important;
        flex: initial !important;
        padding: 6px !important;
    }

        .sobmedida-modelo-chip img {
            height: clamp(54px, 16vw, 72px) !important;
        }

        .sobmedida-modelo-chip small {
            font-size: clamp(.58rem, 2.7vw, .68rem) !important;
            line-height: 1.12 !important;
        }

    /* Formulário: nunca ultrapassa a tela */
    .sobmedida-form-card-new,
    .sobmedida-config-section {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .sobmedida-config-head {
        grid-template-columns: 28px minmax(0, 1fr) !important;
    }

        .sobmedida-config-head h2 {
            font-size: clamp(1.35rem, 6.8vw, 1.75rem) !important;
        }

        .sobmedida-config-head p {
            font-size: clamp(.76rem, 3.3vw, .84rem) !important;
        }

    /* Campos de medida cabem em 360px */
    .sobmedida-medidas-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .sobmedida-medida-box {
        min-width: 0 !important;
        padding: 10px !important;
    }

    .sobmedida-input-medida {
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 5px !important;
        padding: 0 7px !important;
    }

        .sobmedida-input-medida input {
            min-width: 0 !important;
            font-size: clamp(1.08rem, 6vw, 1.42rem) !important;
        }

        .sobmedida-input-medida span {
            font-size: .75rem !important;
        }

    /* Cores: ficam dentro da largura da tela */
    .sobmedida-cor-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 9px !important;
    }

    .sobmedida-cor-card {
        min-width: 0 !important;
    }

    .sobmedida-cor-visual {
        height: clamp(102px, 31vw, 128px) !important;
        min-height: clamp(102px, 31vw, 128px) !important;
        border-radius: 15px !important;
    }

        .sobmedida-cor-visual .sobmedida-cor-img,
        .sobmedida-cor-visual img {
            height: clamp(102px, 31vw, 128px) !important;
            min-height: clamp(102px, 31vw, 128px) !important;
        }

    .sobmedida-cor-card strong {
        font-size: clamp(.74rem, 3.1vw, .84rem) !important;
        line-height: 1.15 !important;
    }

    /* Abertura ajustada ao mobile */
    .sobmedida-abertura-grid {
        grid-template-columns: 1fr !important;
    }

    .sobmedida-abertura-content {
        grid-template-columns: minmax(88px, 108px) minmax(0, 1fr) !important;
        column-gap: 10px !important;
        padding: 11px !important;
    }

        .sobmedida-abertura-content img {
            width: 100% !important;
            height: clamp(88px, 28vw, 112px) !important;
        }

        .sobmedida-abertura-content strong {
            font-size: .9rem !important;
            line-height: 1.18 !important;
        }

        .sobmedida-abertura-content small {
            font-size: .74rem !important;
            line-height: 1.22 !important;
        }
}

/* Celulares bem estreitos: mantém tudo respirando sem cortar */
@media (max-width: 370px) {
    .sobmedida-container {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .sobmedida-preview-zoom-btn {
        min-height: 520px !important;
    }

    .sobmedida-preview-img {
        min-height: 435px !important;
    }

    .sobmedida-medidas-grid {
        grid-template-columns: 1fr !important;
    }

    .sobmedida-cor-overlay {
        font-size: .6rem !important;
        padding: 4px 8px !important;
    }
}

/* Botão único Como medir */
.sobmedida-medida-botao-wrap {
    display: flex;
    justify-content: center;
    margin: 8px 0 14px;
}

.sobmedida-medida-botao {
    min-height: 40px;
    padding: 0 18px;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.94);
    color: #6f4f35;
    font-weight: 950;
    box-shadow: 0 10px 24px rgba(68,49,37,.12);
    cursor: pointer;
}

    .sobmedida-medida-botao:hover {
        background: #fff3df;
    }

/* Garante que o visual antigo da imagem não interfira */
.sobmedida-medida-botao-wrap + .sobmedida-medidas-grid {
    margin-top: 0;
}

/* =========================================================
   SOBMEDIDA - IMAGENS EXTRAS COMPLETAS
   modelocores.png, medircortina.png e error.png
========================================================= */

.sobmedida-page .sobmedida-preview-img.cortina-pre-img-completa {
    object-fit: contain !important;
    object-position: center center !important;
    background: #fffaf4 !important;
}

/* Desktop: mantém o card grande, mas sem cortar essas imagens */
@media (min-width: 992px) {
    .sobmedida-page .sobmedida-preview-zoom-btn.cortina-pre-preview-completa {
        align-items: center !important;
        justify-content: center !important;
        background-size: contain !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
    }

    .sobmedida-page .sobmedida-preview-img.cortina-pre-img-completa {
        width: 94% !important;
        max-width: 94% !important;
        height: min(82vh, 760px) !important;
        min-height: 0 !important;
        object-fit: contain !important;
        box-shadow: none !important;
    }
}

/* Mobile: mostra a imagem inteira sem precisar abrir o zoom */
@media (max-width: 767.98px) {
    .sobmedida-page .sobmedida-preview-zoom-btn.cortina-pre-preview-completa {
        min-height: auto !important;
        align-items: center !important;
        justify-content: center !important;
        background: #fffaf4 !important;
    }

    .sobmedida-page .sobmedida-preview-img.cortina-pre-img-completa {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: min(72vh, 560px) !important;
        object-fit: contain !important;
        object-position: center center !important;
    }
}

/* Zoom principal: essas imagens também ficam completas */
.cortina-pre-zoom-main.cortina-pre-zoom-completa {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #fffaf4 !important;
}

.cortina-pre-zoom-img.cortina-pre-img-completa {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
}

/* Card/carrossel: somente essas imagens quadradas ficam completas */
.cortina-pre-modelo-img-wrap.is-img-completa {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #fffaf4 !important;
}

    .cortina-pre-modelo-img-wrap.is-img-completa .cortina-pre-modelo-img {
        width: 100% !important;
        height: auto !important;
        max-height: 100% !important;
        object-fit: contain !important;
        object-position: center center !important;
    }

/* Setas somente do modal "Como medir" */
.medir-cortina-img-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 14px;
}

    .medir-cortina-img-controls button {
        width: 48px;
        height: 48px;
        border: 2px solid rgba(255,255,255,.95);
        border-radius: 999px;
        background: #2f80ed;
        color: #fff;
        font-size: 2rem;
        font-weight: 950;
        line-height: 1;
        cursor: pointer;
        box-shadow: 0 10px 26px rgba(47,128,237,.28);
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

        .medir-cortina-img-controls button:hover {
            transform: translateY(-1px) scale(1.04);
        }

@media (max-width: 767.98px) {
    .medir-cortina-img-controls button {
        width: 44px;
        height: 44px;
        font-size: 1.8rem;
    }
}

.sobmedida-valor-calculado-card {
    margin-top: 6px;
    padding: 16px 14px;
    border-radius: 18px;
    background: #fffafa;
    border: 1px solid rgba(210, 55, 55, .55);
    box-shadow: 0 10px 24px rgba(0,0,0,.06), 0 0 0 rgba(210, 55, 55, 0);
    text-align: center;
    animation: pulse-borda-valor-cortina 1.45s ease-in-out infinite;
}

    .sobmedida-valor-calculado-card.is-hidden {
        display: none !important;
    }

@keyframes pulse-borda-valor-cortina {
    0%, 100% {
        border-color: rgba(210, 55, 55, .45);
        box-shadow: 0 10px 24px rgba(0,0,0,.06), 0 0 0 0 rgba(210, 55, 55, .14);
    }

    50% {
        border-color: rgba(255, 110, 110, .9);
        box-shadow: 0 10px 24px rgba(0,0,0,.06), 0 0 0 4px rgba(255, 110, 110, .13);
    }
}

.sobmedida-valor-calculado-card span {
    display: block;
    margin-bottom: 4px;
    color: #3a2d24;
    font-size: .88rem;
    font-weight: 900;
}

.sobmedida-valor-calculado-card strong {
    display: block;
    color: #1b0202;
    font-size: clamp(1.65rem, 7vw, 2.15rem);
    line-height: 1.05;
    font-weight: 950;
}

/* Texto "A tecidos a partir de..." com menos destaque */
.sobmedida-page .cortina-pre-total:not(.sobmedida-valor-calculado-card) {
    padding: 7px 10px !important;
    min-height: 58px !important;
    gap: 6px !important;
}

    .sobmedida-page .cortina-pre-total:not(.sobmedida-valor-calculado-card) span {
        font-size: .48rem !important;
        line-height: 1.05 !important;
        font-weight: 500 !important;
        opacity: .68 !important;
        max-width: 92px !important;
    }

    .sobmedida-page .cortina-pre-total:not(.sobmedida-valor-calculado-card) strong {
        font-size: .88rem !important;
        line-height: 1.05 !important;
        font-weight: 850 !important;
        white-space: nowrap !important;
    }

@media (max-width: 767.98px) {
    .sobmedida-page .cortina-pre-total:not(.sobmedida-valor-calculado-card) {
        padding: 7px 10px !important;
        min-height: 56px !important;
        border-radius: 16px !important;
    }

        .sobmedida-page .cortina-pre-total:not(.sobmedida-valor-calculado-card) span {
            font-size: .50rem !important;
            line-height: 1.08 !important;
            max-width: 86px !important;
        }

        .sobmedida-page .cortina-pre-total:not(.sobmedida-valor-calculado-card) strong {
            font-size: .82rem !important;
            line-height: 1.05 !important;
        }
}

@media (min-width: 768px) {
    .sobmedida-valor-calculado-card {
        width: fit-content;
        min-width: 260px;
        margin-left: auto;
        margin-right: auto;
        padding: 18px 22px;
    }

        .sobmedida-valor-calculado-card strong {
            font-size: 2rem;
        }

    .sobmedida-page .cortina-pre-total:not(.sobmedida-valor-calculado-card) {
        width: fit-content;
        min-width: 250px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Mobile: imagens extras completas sem encolher o card/botões */
@media (max-width: 767.98px) {
    .sobmedida-page .sobmedida-preview-zoom-btn.cortina-pre-preview-completa {
        height: min(72vh, 560px) !important;
        min-height: min(72vh, 560px) !important;
        max-height: min(72vh, 560px) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: #fffaf4 !important;
        overflow: hidden !important;
    }

    .sobmedida-page .sobmedida-preview-img.cortina-pre-img-completa {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: 100% !important;
        object-fit: contain !important;
        object-position: center center !important;
        background: #fffaf4 !important;
    }
}

/* Celulares bem estreitos: mantém a mesma lógica, só um pouco menor */
@media (max-width: 370px) {
    .sobmedida-page .sobmedida-preview-zoom-btn.cortina-pre-preview-completa {
        height: 520px !important;
        min-height: 520px !important;
        max-height: 520px !important;
    }
}