/* Newfoundland flipbook section correction.
   This stylesheet intentionally overrides css/idylease-newfoundland-page.css
   for the intro section only, so the page follows the standard Idylease
   subpage structure: supporting image / 1903 divider / wider narrative. */

/* Standard subpage vertical rhythm under the subhero. */
.idy-newfoundland-intro-section {
    padding: 80px 0 70px;
}

/* Kill older card/panel/grid behavior from the Newfoundland page stylesheet. */
.idy-newfoundland-intro-section .idy-newfoundland-intro,
.idy-newfoundland-intro-section .idy-newfoundland-intro--split {
    display: grid !important;
    grid-template-columns: minmax(240px, .30fr) auto minmax(0, .70fr) !important;
    column-gap: clamp(34px, 4.6vw, 66px) !important;
    align-items: center !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Left image column. */
.idy-newfoundland-intro__media {
    min-width: 0;
    width: 100%;
}

.idy-newfoundland-intro__media,
.idy-newfoundland-intro__image {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.idy-newfoundland-intro__image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* Center 1903 divider matching other subpages. */
.idy-newfoundland-intro__divider {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    align-self: stretch;
    min-height: 100%;
}

.idy-newfoundland-intro__divider span {
    display: block;
    width: 1px;
    min-height: 190px;
    flex: 1 1 auto;
    background: linear-gradient(to bottom, rgba(170,132,83,0), rgba(170,132,83,.62), rgba(170,132,83,0));
}

.idy-newfoundland-intro__divider em {
    display: block;
    margin: 20px 0;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-family: "Barlow Condensed", sans-serif;
    font-style: normal;
    font-size: 12px;
    letter-spacing: .46em;
    text-transform: uppercase;
    color: rgba(170,132,83,.94);
}

/* Right narrative column — no card, no colored block. */
.idy-newfoundland-intro-section .idy-newfoundland-intro__copy {
    min-width: 0;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.idy-newfoundland-intro-section .idy-newfoundland-intro__copy::before,
.idy-newfoundland-intro-section .idy-newfoundland-intro__copy::after {
    content: none !important;
    display: none !important;
}

.idy-newfoundland-intro-section .idy-newfoundland-intro__copy h2 {
    margin-top: 0;
}

/* Flipbook stays aligned to the same container edges. */
.idy-newfoundland-book-section .container {
    max-width: 1170px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

.idy-newfoundland-book-frame {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    border: 1px solid #444;
    background: transparent;
    box-shadow: none;
}

.idy-newfoundland-book-frame #fb5-ajax {
    width: 100%;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

/* Existing three-image popup row under the flipbook. */
.idy-newfoundland-popup-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 34px 0 0;
    width: 100%;
}

.idy-newfoundland-popup-tile {
    position: relative;
    display: block;
    overflow: hidden;
    background: #15110e;
    aspect-ratio: 4 / 3;
    color: #fff;
    text-decoration: none;
}

.idy-newfoundland-popup-tile figure {
    position: absolute;
    inset: 0;
    margin: 0;
}

.idy-newfoundland-popup-tile img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.idy-newfoundland-popup-tile::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 42%, rgba(0,0,0,.44) 100%);
    z-index: 1;
    pointer-events: none;
}

.idy-newfoundland-popup-tile span {
    position: absolute;
    right: 14px;
    bottom: 14px;
    z-index: 3;
    width: 32px;
    height: 32px;
    border: 1px solid rgba(255,255,255,.78);
    border-radius: 50%;
    background: rgba(0,0,0,.38);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

/* Modal styles for the image row. */
.idy-newfoundland-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 32px;
    background: rgba(0,0,0,.88);
}

.idy-newfoundland-modal.is-open {
    display: flex;
}

.idy-newfoundland-modal__inner {
    width: min(1120px, 92vw);
    max-height: 88vh;
    background: #050505;
    box-shadow: 0 24px 80px rgba(0,0,0,.55);
}

.idy-newfoundland-modal figure {
    margin: 0;
    background: #050505;
}

.idy-newfoundland-modal img {
    display: block;
    width: 100%;
    max-height: 78vh;
    object-fit: contain;
    background: #050505;
}

.idy-newfoundland-modal figcaption {
    padding: 16px 20px 18px;
    background: #111;
    color: #d8d0c3;
}

.idy-newfoundland-modal figcaption strong {
    display: block;
    margin-bottom: 5px;
    color: #fff;
    font-family: "Barlow Condensed", sans-serif;
    font-size: 18px;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-weight: 400;
}

.idy-newfoundland-modal figcaption span {
    display: block;
    font-size: 14px;
    line-height: 1.55;
}

.idy-newfoundland-modal__close {
    position: fixed;
    right: 26px;
    top: 20px;
    z-index: 100000;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.92);
    color: #111;
    font-size: 34px;
    line-height: 38px;
    cursor: pointer;
}

body.idy-newfoundland-modal-open {
    overflow: hidden;
}

@media screen and (max-width: 991px) {
    .idy-newfoundland-intro-section {
        padding: 66px 0 58px;
    }

    .idy-newfoundland-intro-section .idy-newfoundland-intro,
    .idy-newfoundland-intro-section .idy-newfoundland-intro--split {
        grid-template-columns: 1fr !important;
        row-gap: 30px;
    }

    .idy-newfoundland-intro__divider {
        display: none !important;
    }

    .idy-newfoundland-popup-row {
        grid-template-columns: 1fr;
    }

    .idy-newfoundland-book-section .container {
        padding-left: 22px;
        padding-right: 22px;
    }
}

@media screen and (max-width: 575px) {
    .idy-newfoundland-intro-section {
        padding: 54px 0 48px;
    }

    .idy-newfoundland-book-section .container {
        padding-left: 18px;
        padding-right: 18px;
    }
}


/* Page-only caption support for the flipbook intro image. */
.idy-newfoundland-intro__caption {
    margin-top: 12px;
    font-size: 13px;
    line-height: 1.55;
    color: rgba(72, 62, 50, .82);
    font-style: italic;
}

/* Use the existing Idylease font stack inside flipbook chrome; preserve Font Awesome icons. */
body.idy-newfoundland-flipbook-body #fb5-ajax,
body.idy-newfoundland-flipbook-body #fb5-button-back,
body.idy-newfoundland-flipbook-body #fb5-page-number,
body.idy-newfoundland-flipbook-body #fb5-page-number-two,
body.idy-newfoundland-flipbook-body #fb5-label-page-number {
    font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
}

body.idy-newfoundland-flipbook-body #fb5-ajax .fa,
body.idy-newfoundland-flipbook-body #fb5-ajax [class^="fa-"],
body.idy-newfoundland-flipbook-body #fb5-ajax [class*=" fa-"] {
    font-family: FontAwesome !important;
}

/* Newfoundland flipbook page-only reveal motion.
   This restores movement on this page without changing shared subpage JS/CSS.
   Subhero content settles downward; intro columns move toward the center;
   flipbook/body rows and footer rise into place. */
body.idy-newfoundland-flipbook-body html.js,
html.js body.idy-newfoundland-flipbook-body {
    overflow-x: hidden;
}

html.js body.idy-newfoundland-flipbook-body .idy-subhero__image,
html.js body.idy-newfoundland-flipbook-body .idy-subhero__overlay {
    opacity: 0;
    transition: opacity 1s ease;
    will-change: opacity;
}

html.js body.idy-newfoundland-flipbook-body .idy-subhero__content {
    opacity: 0;
    transform: translate3d(0, -24px, 0);
    transition: opacity .9s ease, transform .9s ease;
    will-change: opacity, transform;
}

html.js body.idy-newfoundland-flipbook-body .idy-subhero__image.rz-visible,
html.js body.idy-newfoundland-flipbook-body .idy-subhero__overlay.rz-visible,
html.js body.idy-newfoundland-flipbook-body .idy-subhero__content.rz-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__media,
html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__copy,
html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-book-frame,
html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-popup-row,
html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__copy,
html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__actions,
html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__bottom {
    opacity: 0;
    transition: opacity .88s ease, transform .88s ease;
    will-change: opacity, transform;
}

/* Left column moves right toward the 1903 divider. */
html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__media {
    transform: translate3d(-28px, 0, 0);
}

/* Right narrative column moves left toward the 1903 divider. */
html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__copy {
    transform: translate3d(28px, 0, 0);
}

/* Flipbook and image row rise into place. */
html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-book-frame,
html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-popup-row,
html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__copy,
html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__actions,
html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__bottom {
    transform: translate3d(0, 28px, 0);
}

html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__media.rz-visible,
html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__copy.rz-visible,
html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-book-frame.rz-visible,
html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-popup-row.rz-visible,
html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__copy.rz-visible,
html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__actions.rz-visible,
html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__bottom.rz-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

@media screen and (max-width: 991px) {
    html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__media,
    html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__copy {
        transform: translate3d(0, 24px, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    html.js body.idy-newfoundland-flipbook-body .idy-subhero__image,
    html.js body.idy-newfoundland-flipbook-body .idy-subhero__overlay,
    html.js body.idy-newfoundland-flipbook-body .idy-subhero__content,
    html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__media,
    html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__copy,
    html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-book-frame,
    html.js body.idy-newfoundland-flipbook-body .idy-newfoundland-popup-row,
    html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__copy,
    html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__actions,
    html.js body.idy-newfoundland-flipbook-body .idy-visit-footer__bottom {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* =========================================================
   NEWFOUNDLAND FLIPBOOK PAGE — TABLET PORTRAIT ARCHIVE ROW
   Three Crayon archive images remain horizontal only at
   portrait-tablet widths. Desktop, landscape tablet, and
   mobile portrait retain their existing layouts.
   ========================================================= */
@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    body.idy-newfoundland-flipbook-body .idy-newfoundland-popup-row {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        grid-auto-flow: column !important;
        gap: 12px !important;
        align-items: stretch !important;
        width: 100% !important;
    }

    body.idy-newfoundland-flipbook-body .idy-newfoundland-popup-tile {
        width: 100% !important;
        min-width: 0 !important;
        aspect-ratio: 4 / 5 !important;
    }

    body.idy-newfoundland-flipbook-body .idy-newfoundland-popup-tile figure {
        width: 100% !important;
        height: 100% !important;
    }
}

/* Newfoundland flipbook footer buttons — tablet portrait and landscape. */
@media screen and (min-width: 768px) and (max-width: 1199px) {
    body.idy-newfoundland-flipbook-body .idy-visit-footer__actions {
        padding-top: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 42px !important;
        justify-content: flex-start !important;
        gap: 18px !important;
    }
}

/* =========================================================
   NEWFOUNDLAND INTRO COMPANION — PORTRAIT TABLET ONLY
   The opening-page graphic is not part of the original desktop
   or mobile composition. It appears only beside the Crayon
   camera portrait at portrait-tablet widths.
   ========================================================= */
body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__image--tablet-companion {
    display: none !important;
}

@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__media {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 24px !important;
        align-items: start !important;
        width: 100% !important;
        max-width: 720px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__image,
    body.idy-newfoundland-flipbook-body .idy-newfoundland-intro__image--tablet-companion {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
    }
}
