/*
 * about-oa-tablet-desktop.css — About page: tablet band matches portfolio “scaled desktop”
 * (see portfolio-case-scale.css + portfolio-sulo-tina.html). Load AFTER about-style.css.
 *
 * Viewport 740–1199px: content inside .oa-scale-canvas uses zoom; viewport-based “tablet”
 * rules in about-style.css must not flatten/redesign that content — we reset to desktop
 * base values with body.page-about .oa-scale-canvas …
 *
 * Band aligns with portfolio-case-scale (740px+); also covers 768 / 820 / 1024.
 */

@media (min-width: 1200px) {
    body.page-about .oa-scale-root {
        --oa-design-w: 100vw;
    }

    body.page-about .oa-scale-canvas > section {
        max-width: none !important;
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        box-sizing: border-box;
    }

    /* Keep Option 3 (Start story) centered like the original layout */
    body.page-about .oa-scale-canvas > section.start-story-section {
        max-width: 1180px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100% !important;
    }

    body.page-about .instagram-section,
    body.page-about .footer-bottom {
        padding-inline: 0;
    }

    html[lang="ru"] body.page-about .oa-scale-canvas .consultation-planning-section,
    html[data-ru-static="1"] body.page-about .oa-scale-canvas .consultation-planning-section {
        background: linear-gradient(to bottom, #FFFFFF 0%, #FFFFFF 10%, #F8F3ED 10%, #F8F3ED 100%) !important;
    }

    html[lang="en"] body.page-about .oa-scale-canvas .consultation-planning-section,
    html[data-en-static="1"] body.page-about .oa-scale-canvas .consultation-planning-section {
        background: linear-gradient(to bottom, #FFFFFF 0%, #FFFFFF 13%, #F8F3ED 13%, #F8F3ED 100%) !important;
    }

    body.page-about .oa-scale-canvas .book-main-section .book-content {
        padding-top: 0 !important;
        margin-top: 0 !important;
        transform: translateY(-25px) !important;
    }
}

@media (min-width: 740px) and (max-width: 1199.98px) {
    /* --- Signature (undo 781–1200 “alternate tablet”) --- */
    body.page-about .oa-scale-canvas .signature-space-section {
        padding: 60px 40px 100px 40px !important;
    }

    body.page-about .oa-scale-canvas .signature-space-title {
        font-family: 'Cormorant', serif !important;
        font-weight: 300 !important;
        font-style: normal !important;
        font-size: 48px !important;
        line-height: 1.1 !important;
        letter-spacing: 0.02em !important;
        max-width: 1022px !important;
    }

    body.page-about .oa-scale-canvas .signature-space-gallery {
        gap: 6px !important;
    }

    body.page-about .oa-scale-canvas .signature-space-image-center,
    body.page-about .oa-scale-canvas .signature-space-image-center img {
        width: 470px !important;
        height: 400px !important;
    }

    body.page-about .oa-scale-canvas .signature-space-btn {
        padding: 32px 50px !important;
    }

    /* --- Cooperation timeline: desktop vars (undo 601–1200 + 781–1200 + 900px padding) --- */
    body.page-about .oa-scale-canvas .cooperation-stages-section {
        padding: 45px 40px 0px 40px !important;
    }

    body.page-about .oa-scale-canvas .cooperation-stages-list {
        --coop-node-w: 112px;
        --timeline-circle: 72px;
        --timeline-r: 36px;
        --timeline-start-offset: -2px;
        --stage-1-node-mt: 0px;
        --stage-2-node-mt: -30px;
        --stage-3-node-mt: -50px;
        --stage-4-node-mt: -30px;
        --stage-1-body-mt: 0px;
        --stage-2-body-mt: -30px;
        --stage-3-body-mt: -50px;
        --stage-4-body-mt: -30px;
        column-gap: 24px !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    body.page-about .oa-scale-canvas .cooperation-stages-content {
        gap: 0 !important;
        align-items: center !important;
    }

    body.page-about .oa-scale-canvas .cooperation-stages-title {
        font-family: 'Cormorant', serif !important;
        font-weight: 300 !important;
        font-size: 30px !important;
        line-height: 1.2 !important;
        letter-spacing: 0.04em !important;
        margin: 0 0 80px 0 !important;
    }

    body.page-about .oa-scale-canvas .cooperation-stage-body {
        max-width: min(300px, 100%) !important;
    }

    body.page-about .oa-scale-canvas .cooperation-stage-item {
        max-width: none !important;
    }

    /* --- Gallery: undo 781–1200 0.8 scale --- */
    body.page-about .oa-scale-canvas .gallery-container {
        gap: 40px !important;
    }

    body.page-about .oa-scale-canvas .gallery-item-1 .gallery-image,
    body.page-about .oa-scale-canvas .gallery-item-1 .gallery-video,
    body.page-about .oa-scale-canvas .gallery-item-2 .gallery-image,
    body.page-about .oa-scale-canvas .gallery-item-4 .gallery-image,
    body.page-about .oa-scale-canvas .gallery-item-4 .gallery-video {
        width: 362px !important;
        height: 492px !important;
    }

    body.page-about .oa-scale-canvas .gallery-item-3 .gallery-image {
        width: 312px !important;
        height: 424px !important;
    }

    /* --- Video about: undo 3020 + 781–1000 column / full-bleed --- */
    body.page-about .oa-scale-canvas .video-about-section {
        padding: 120px 40px !important;
    }

    body.page-about .oa-scale-canvas .video-about-container {
        max-width: 1180px !important;
        margin: 0 auto !important;
        display: flex !important;
        flex-direction: row !important;
        gap: 80px !important;
        align-items: flex-start !important;
        left: 40px !important;
        position: relative !important;
        padding: 0 !important;
    }

    body.page-about .oa-scale-canvas .video-about-video-wrapper {
        flex: 0 0 50% !important;
        width: auto !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.page-about .oa-scale-canvas .video-about-image {
        width: 462px !important;
        height: 610px !important;
        max-width: 462px !important;
        aspect-ratio: auto !important;
        margin-top: -100px !important;
        margin-bottom: 0 !important;
        object-fit: cover !important;
        position: relative !important;
    }

    body.page-about .oa-scale-canvas .video-play-icon {
        left: auto !important;
        position: relative !important;
    }

    body.page-about .oa-scale-canvas .video-about-content {
        flex: 0 0 50% !important;
        max-width: 488px !important;
        right: 100px !important;
        margin-top: 0 !important;
        align-items: flex-start !important;
        text-align: left !important;
    }

    body.page-about .oa-scale-canvas .video-about-title {
        font-size: 38px !important;
        font-weight: 300 !important;
        text-align: center !important;
        max-width: 488px !important;
        margin-top: 0 !important;
        left: auto !important;
    }

    body.page-about .oa-scale-canvas .video-about-btn {
        align-self: center !important;
        width: auto !important;
        max-width: none !important;
        left: 0 !important;
        padding: 18px 32px !important;
        line-height: 100% !important;
    }

    /* --- Start story: undo 601–780, 781–1000, 3020 --- */
    body.page-about .oa-scale-canvas .start-story-section {
        /* Match desktop optical balance: +60px to the left gutter (no transform) */
        padding: 0px 40px 0px 100px !important;
        max-width: 1180px !important;
        width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        background-color: #F8F3ED !important;
        overflow: hidden !important;
        right: auto !important;
        left: auto !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    body.page-about .oa-scale-canvas .start-story-content {
        flex-direction: row !important;
        align-items: stretch !important;
        overflow: visible !important;
    }

    body.page-about .oa-scale-canvas .start-story-text-block {
        background-color: #fff !important;
        padding: clamp(48px, 20vw, 130px) clamp(24px, 5vw, 60px) !important;
        flex: 1 1 50% !important;
        min-width: 0 !important;
        width: auto !important;
        max-width: min(550px, 52%) !important;
        order: 1 !important;
    }

    body.page-about .oa-scale-canvas .start-story-text-block::before {
        right: -50% !important;
        width: 50% !important;
    }

    body.page-about .oa-scale-canvas .start-story-image {
        flex: 1 1 0% !important;
        min-width: 0 !important;
        max-width: 50% !important;
        width: auto !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        order: 2 !important;
        overflow: hidden !important;
        display: flex !important;
        align-items: center !important;
    }

    body.page-about .oa-scale-canvas .start-story-image img {
        width: 100% !important;
        max-width: min(462px, 100%) !important;
        min-width: 0 !important;
        height: auto !important;
        aspect-ratio: 462 / 610 !important;
        right: 0 !important;
        left: auto !important;
        margin: 0 !important;
        position: relative !important;
        object-fit: cover !important;
        flex-shrink: 1 !important;
    }

    body.page-about .oa-scale-canvas .start-story-title {
        font-size: 38px !important;
        font-weight: 300 !important;
        letter-spacing: 0.04em !important;
        text-align: center !important;
    }

    /* --- Consultation planning: undo 601–780 + 781–1000 + 3020 --- */
    html[lang="uk"] body.page-about .oa-scale-canvas .consultation-planning-section,
    html[lang="ua"] body.page-about .oa-scale-canvas .consultation-planning-section {
        background: linear-gradient(to bottom, #FFFFFF 0%, #FFFFFF 17%, #F8F3ED 17%, #F8F3ED 100%) !important;
        padding: 0px 80px 0px 150px !important;
    }

    html[lang="ru"] body.page-about .oa-scale-canvas .consultation-planning-section,
    html[data-ru-static="1"] body.page-about .oa-scale-canvas .consultation-planning-section {
        background: linear-gradient(to bottom, #FFFFFF 0%, #FFFFFF 10%, #F8F3ED 10%, #F8F3ED 100%) !important;
        padding: 0px 80px 0px 150px !important;
    }

    html[lang="en"] body.page-about .oa-scale-canvas .consultation-planning-section,
    html[data-en-static="1"] body.page-about .oa-scale-canvas .consultation-planning-section {
        background: linear-gradient(to bottom, #FFFFFF 0%, #FFFFFF 13%, #F8F3ED 13%, #F8F3ED 100%) !important;
        padding: 0px 80px 0px 150px !important;
    }

    body.page-about .oa-scale-canvas .consultation-planning-container {
        flex-direction: row !important;
        gap: 80px !important;
        align-items: stretch !important;
        right: 0 !important;
        position: relative !important;
        max-width: 1180px !important;
    }

    body.page-about .oa-scale-canvas .consultation-planning-main-image {
        left: 20px !important;
        margin-top: -15px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.page-about .oa-scale-canvas .consultation-planning-content {
        flex: 0 0 50% !important;
        max-width: 450px !important;
    }

    /* --- Wedding work columns: undo 781–1000 single-column / hide column --- */
    body.page-about .oa-scale-canvas .wedding-work-columns {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0px !important;
        margin-top: 30px !important;
        max-width: 850px !important;
        width: 100% !important;
        flex-direction: unset !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column {
        width: auto !important;
        max-width: none !important;
        align-items: stretch !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column:first-child,
    body.page-about .oa-scale-canvas .wedding-work-column:last-child {
        order: unset !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column:last-child .wedding-work-column-image-wrapper {
        display: flex !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column-image-wrapper {
        width: 375px !important;
        max-width: 375px !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column-image {
        width: 375px !important;
        max-width: 375px !important;
        height: auto !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column-image-left {
        height: 389px !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column-image-right {
        height: 504px !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column-video {
        width: 375px !important;
        max-width: 375px !important;
        aspect-ratio: auto !important;
        height: auto !important;
        object-fit: cover !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column-video-left {
        height: 389px !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column-title {
        font-size: 28px !important;
        font-weight: 300 !important;
        text-align: left !important;
    }

    body.page-about .oa-scale-canvas .wedding-work-column-text {
        margin: 0 auto !important;
    }

    /* --- Yulia about: undo 3020 + 601–780 yulia container tweak --- */
    body.page-about .oa-scale-canvas .yulia-about-section {
        padding: 100px 40px 84px 40px !important;
    }

    body.page-about .oa-scale-canvas .yulia-about-container {
        max-width: 1166px !important;
        padding: 0 100px 60px 100px !important;
        padding-top: 250px !important;
        gap: 50px !important;
    }

    body.page-about .oa-scale-canvas .yulia-about-image-wrapper {
        width: 462px !important;
        height: 626px !important;
        margin-top: -250px !important;
        max-width: none !important;
        aspect-ratio: auto !important;
    }

    body.page-about .oa-scale-canvas .yulia-about-slide {
        width: 462px !important;
        height: 626px !important;
    }

    body.page-about .oa-scale-canvas .yulia-about-content {
        gap: 35px !important;
    }

    body.page-about .oa-scale-canvas .yulia-about-text-columns {
        gap: 56px !important;
    }

    body.page-about .oa-scale-canvas .yulia-about-title {
        font-family: 'Cormorant', serif !important;
        font-weight: 300 !important;
        font-size: 48px !important;
        line-height: 110% !important;
        letter-spacing: 0.02em !important;
        margin-top: -125px !important;
    }

    /* --- Book (main): undo 601–780 + 781–1000 --- */
    body.page-about .oa-scale-canvas .book-main-section.book-section {
        padding: 10px 40px 40px 40px !important;
        max-width: 1400px !important;
        width: 100% !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
        display: block !important;
    }

    html[lang="uk"] body.page-about .oa-scale-canvas .book-main-section.book-section,
    html[lang="ua"] body.page-about .oa-scale-canvas .book-main-section.book-section,
    html[lang="en"] body.page-about .oa-scale-canvas .book-main-section.book-section,
    html[lang="ru"] body.page-about .oa-scale-canvas .book-main-section.book-section,
    html[data-en-static="1"] body.page-about .oa-scale-canvas .book-main-section.book-section,
    html[data-ru-static="1"] body.page-about .oa-scale-canvas .book-main-section.book-section {
        padding-bottom: 60px !important;
    }

    html[lang="uk"] body.page-about .oa-scale-canvas .book-main-section.book-section,
    html[lang="ua"] body.page-about .oa-scale-canvas .book-main-section.book-section,
    html[lang="en"] body.page-about .oa-scale-canvas .book-main-section.book-section,
    html[data-en-static="1"] body.page-about .oa-scale-canvas .book-main-section.book-section,
    html[lang="ru"] body.page-about .oa-scale-canvas .book-main-section.book-section,
    html[data-ru-static="1"] body.page-about .oa-scale-canvas .book-main-section.book-section {
        padding-bottom: 20px !important;
    }

    body.page-about .oa-scale-canvas .book-main-section .book-container {
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        gap: 60px !important;
        max-width: 1200px !important;
        margin: 0 auto 0 auto !important;
        width: 100% !important;
    }

    body.page-about .oa-scale-canvas .book-main-section .book-images {
        flex: 0 0 50% !important;
        width: 50% !important;
        height: 700px !important;
        max-width: none !important;
        min-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        display: block !important;
        position: relative !important;
        overflow: visible !important;
        left: 100px !important;
        margin-top: 0 !important;
    }

    body.page-about .oa-scale-canvas .book-main-section .book-image.book-image-single {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 461px !important;
        height: 630px !important;
        min-width: 461px !important;
        max-width: 461px !important;
        transform: none !important;
        margin: 0 !important;
        z-index: 1 !important;
    }

    body.page-about .oa-scale-canvas .book-main-section .book-image-single img {
        width: auto !important;
        max-width: 461px !important;
        height: auto !important;
        max-height: 630px !important;
        min-width: 0 !important;
        min-height: 0 !important;
        object-fit: contain !important;
        object-position: center bottom !important;
        margin: 0 !important;
        right: auto !important;
        transform: none !important;
    }

    body.page-about .oa-scale-canvas .book-main-section .book-content {
        flex: 0 0 50% !important;
        width: 50% !important;
        max-width: 500px !important;
        padding-top: 0 !important;
        margin-top: 0 !important;
        margin-left: auto !important;
        margin-right: auto !important;
        right: 50px !important;
        position: relative !important;
        transform: translateY(-25px) !important;
    }

    body.page-about .oa-scale-canvas .book-main-section .book-title {
        font-size: 36px !important;
        line-height: 1.3 !important;
    }

    body.page-about .oa-scale-canvas .book-main-section .book-btn {
        width: auto !important;
        padding: 32px 50px !important;
        margin-top: 20px !important;
    }

    /* --- Personalized services: undo 3020 block --- */
    body.page-about .oa-scale-canvas .personalized-services-section {
        padding: 94px 40px 64px 40px !important;
    }

    body.page-about .oa-scale-canvas .personalized-services-content {
        gap: 50px !important;
    }

    body.page-about .oa-scale-canvas .personalized-services-title {
        font-size: 48px !important;
        font-weight: 300 !important;
    }

    body.page-about .oa-scale-canvas .personalized-services-description {
        font-size: 20px !important;
        margin-top: -38px !important;
    }

    body.page-about .oa-scale-canvas .personalized-services-grid {
        gap: 0px !important;
    }

    body.page-about .oa-scale-canvas .wedding-gallery-strip-section {
        padding: 40px 40px 120px 40px !important;
    }

    /* --- Book section (3020): non–book-main book block if present --- */
    body.page-about .oa-scale-canvas .book-section:not(.book-main-section) {
        padding: 100px 40px !important;
    }

    body.page-about .oa-scale-canvas .book-container {
        flex-direction: row !important;
        gap: 60px !important;
        max-width: 1200px !important;
    }

    body.page-about .oa-scale-canvas .book-images {
        flex: 0 0 50% !important;
        width: 50% !important;
        height: 700px !important;
        max-width: none !important;
        padding: 0 !important;
    }

    body.page-about .oa-scale-canvas .book-section:not(.book-main-section) .book-content {
        flex: 0 0 50% !important;
        width: 50% !important;
        max-width: 500px !important;
        margin-top: 0 !important;
        right: 50px !important;
    }

    body.page-about .oa-scale-canvas .book-image-top-left {
        left: 0 !important;
        width: 461px !important;
        height: 630px !important;
    }

    body.page-about .oa-scale-canvas .book-image-top-left img {
        width: 461px !important;
        height: 630px !important;
    }

    body.page-about .oa-scale-canvas .book-image-bottom-right {
        top: 420px !important;
        left: 281.76px !important;
        width: 319px !important;
        height: 314px !important;
    }

    body.page-about .oa-scale-canvas .book-image-bottom-right img {
        width: 319px !important;
        height: 314px !important;
    }

    body.page-about .oa-scale-canvas .book-title {
        font-size: 36px !important;
    }

    body.page-about .oa-scale-canvas .book-intro,
    body.page-about .oa-scale-canvas .book-description {
        font-size: 18px !important;
        max-width: 450px !important;
    }

    /* --- Consultation video + text titles (4096) --- */
    body.page-about .oa-scale-canvas .consultation-text-title {
        font-weight: 300 !important;
        margin-top: 0 !important;
    }

    body.page-about .oa-scale-canvas .consultation-text-description {
        font-family: 'Cormorant', serif !important;
        font-weight: 400 !important;
        font-size: 24px !important;
        line-height: 1.2 !important;
        letter-spacing: 0 !important;
        text-align: center !important;
        text-transform: none !important;
        max-width: 784px !important;
    }
}

/* Book main: lift only the text block — UA / EN / RU, desktop + scaled tablet */
@media (min-width: 740px) {
    body.page-about .oa-scale-canvas .book-main-section .book-content {
        padding-top: 0 !important;
        margin-top: 0 !important;
        transform: translateY(-25px) !important;
    }

    html[lang="uk"] body.page-about .oa-scale-canvas .book-main-section .book-content,
    html[lang="ua"] body.page-about .oa-scale-canvas .book-main-section .book-content,
    html[lang="en"] body.page-about .oa-scale-canvas .book-main-section .book-content,
    html[data-en-static="1"] body.page-about .oa-scale-canvas .book-main-section .book-content,
    html[lang="ru"] body.page-about .oa-scale-canvas .book-main-section .book-content,
    html[data-ru-static="1"] body.page-about .oa-scale-canvas .book-main-section .book-content {
        transform: translateY(-35px) !important;
    }
}