/*
 * IRETURA NEW LOOK
 * Homepage design system
 */

body.page-template-page-iretura-new-look {
    background: #f4f1ed;
}

.page-template-page-iretura-new-look #main {
    padding-top: 0;
    padding-bottom: 0;
}

.inl-site {
    --inl-bg: #f4f1ed;
    --inl-paper: #faf8f5;
    --inl-ink: #111111;
    --inl-muted: #6f6a66;
    --inl-line: rgba(17, 17, 17, .14);
    --inl-purple: #5b2b82;
    --inl-dark: #111111;
    --inl-max: 1380px;

    background: var(--inl-bg);
    color: var(--inl-ink);
    overflow: hidden;
}

.inl-site *,
.inl-site *::before,
.inl-site *::after {
    box-sizing: border-box;
}

.inl-container {
    width: min(calc(100% - 80px), var(--inl-max));
    margin-inline: auto;
}

.inl-kicker,
.inl-eyebrow {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .16em;
    font-size: 12px;
    font-weight: 700;
}


/* HERO */

.inl-hero {
    position: relative;
    min-height: 88vh;
    min-height: 760px;
    display: flex;
    align-items: flex-end;
    background: #121212;
    color: #fff;
    isolation: isolate;
}

.inl-hero-media,
.inl-hero-overlay {
    position: absolute;
    inset: 0;
}

.inl-hero-media {
    z-index: -3;
}

.inl-hero-placeholder {
    width: 100%;
    height: 100%;
    background:
        radial-gradient(circle at 75% 30%, rgba(91,43,130,.55), transparent 34%),
        linear-gradient(125deg, #242126 0%, #121212 48%, #21172a 100%);
}

.inl-hero-overlay {
    z-index: -2;
    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.78) 0%,
            rgba(0,0,0,.48) 50%,
            rgba(0,0,0,.20) 100%
        ),
        linear-gradient(
            0deg,
            rgba(0,0,0,.55) 0%,
            transparent 55%
        );
}

.inl-hero-inner {
    padding-top: 190px;
    padding-bottom: 110px;
}

.inl-eyebrow {
    margin-bottom: 30px;
    color: rgba(255,255,255,.72);
}

.inl-eyebrow span {
    color: #b68ad4;
    margin-inline: 8px;
}

.inl-hero h1 {
    max-width: 1050px;
    margin: 0;
    color: #fff;
    font-size: clamp(58px, 7.1vw, 112px);
    line-height: .92;
    letter-spacing: -.055em;
    font-weight: 400;
}

.inl-hero h1 strong {
    display: block;
    color: #fff;
    font-weight: 700;
}

.inl-hero-copy {
    max-width: 670px;
    margin: 38px 0 0;
    color: rgba(255,255,255,.75);
    font-size: 19px;
    line-height: 1.65;
}

.inl-actions {
    display: flex;
    align-items: center;
    gap: 38px;
    margin-top: 42px;
}

.inl-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    min-height: 58px;
    padding: 0 28px;
    border-radius: 0;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: .09em;
    font-size: 12px;
    font-weight: 700;
    transition: transform .25s ease, background .25s ease;
}

.inl-btn:hover {
    transform: translateY(-2px);
    text-decoration: none;
}

.inl-btn-primary {
    background: var(--inl-purple);
    color: #fff;
}

.inl-btn-primary:hover {
    background: #6e3699;
    color: #fff;
}

.inl-text-link,
.inl-arrow-link {
    color: inherit;
    text-decoration: none;
    font-weight: 600;
}

.inl-text-link:hover,
.inl-arrow-link:hover {
    color: inherit;
    text-decoration: none;
}

.inl-text-link span,
.inl-arrow-link span {
    margin-left: 10px;
}

.inl-scroll-cue {
    position: absolute;
    right: 40px;
    bottom: 44px;
    display: flex;
    align-items: center;
    gap: 14px;
    color: rgba(255,255,255,.62);
    text-transform: uppercase;
    letter-spacing: .15em;
    font-size: 10px;
    text-decoration: none;
    transform: rotate(90deg);
    transform-origin: right bottom;
}

.inl-scroll-cue i {
    display: block;
    width: 55px;
    height: 1px;
    background: rgba(255,255,255,.42);
}


/* PROCESS STRIP */

.inl-process-strip {
    border-bottom: 1px solid var(--inl-line);
    background: var(--inl-paper);
}

.inl-process-items {
    min-height: 92px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-transform: uppercase;
    letter-spacing: .15em;
    font-size: 11px;
    font-weight: 700;
}

.inl-process-items i {
    color: var(--inl-purple);
    font-style: normal;
}


/* GENERAL SECTIONS */

.inl-section {
    padding: 145px 0;
}

.inl-section-intro {
    display: grid;
    grid-template-columns: .8fr 2fr;
    gap: 80px;
    padding-bottom: 105px;
}

.inl-section-intro h2,
.inl-work-heading h2 {
    margin: 0;
    font-size: clamp(48px, 5vw, 80px);
    line-height: .98;
    letter-spacing: -.045em;
    font-weight: 400;
}

.inl-section-intro h2 strong,
.inl-work-heading h2 strong {
    display: block;
    font-weight: 700;
}

.inl-section-intro > div:last-child > p {
    max-width: 660px;
    margin: 32px 0 0;
    color: var(--inl-muted);
    font-size: 18px;
    line-height: 1.7;
}


/* CAPABILITY */

.inl-capability {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(360px, .65fr);
    min-height: 660px;
    margin-bottom: 80px;
    background: var(--inl-paper);
}

.inl-capability-reverse {
    grid-template-columns: minmax(360px, .65fr) minmax(0, 1.35fr);
}

.inl-capability-reverse .inl-capability-media {
    order: 2;
}

.inl-capability-media {
    display: block;
    min-height: 620px;
    overflow: hidden;
}

.inl-capability-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s cubic-bezier(.2,.7,.2,1);
}

.inl-capability-media:hover img {
    transform: scale(1.025);
}

.inl-capability-content {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 70px;
}

.inl-number {
    position: absolute;
    top: 40px;
    right: 40px;
    color: rgba(17,17,17,.28);
    font-size: 13px;
}

.inl-capability-content h3 {
    margin: 20px 0 28px;
    font-size: clamp(38px, 3.3vw, 58px);
    line-height: 1.02;
    letter-spacing: -.04em;
    font-weight: 400;
}

.inl-capability-content h3 strong {
    display: block;
    font-weight: 700;
}

.inl-capability-content > p:not(.inl-kicker):not(.inl-tags) {
    color: var(--inl-muted);
    font-size: 16px;
    line-height: 1.7;
}

.inl-tags {
    margin: 25px 0 38px;
    padding-top: 22px;
    border-top: 1px solid var(--inl-line);
    color: var(--inl-muted);
    font-size: 12px;
    line-height: 1.7;
}

.inl-arrow-link {
    align-self: flex-start;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--inl-ink);
}


/* INTEGRATED */

.inl-integrated {
    background: var(--inl-dark);
    color: #fff;
}

.inl-integrated-inner {
    padding-top: 150px;
    padding-bottom: 150px;
}

.inl-kicker-light {
    color: rgba(255,255,255,.52);
}

.inl-integrated h2 {
    max-width: 1050px;
    margin: 32px 0;
    color: #fff;
    font-size: clamp(55px, 6.4vw, 100px);
    line-height: .94;
    letter-spacing: -.05em;
    font-weight: 400;
}

.inl-integrated h2 strong {
    display: block;
    font-weight: 700;
}

.inl-integrated > .inl-container > p:not(.inl-kicker) {
    max-width: 620px;
    color: rgba(255,255,255,.64);
    font-size: 18px;
    line-height: 1.7;
}

.inl-btn-light {
    margin-top: 35px;
    background: #fff;
    color: #111;
}

.inl-btn-light:hover {
    color: #111;
}


/* WORK */

.inl-work {
    background: var(--inl-paper);
}

.inl-work-heading {
    display: grid;
    grid-template-columns: 1.5fr .6fr;
    gap: 80px;
    align-items: end;
    margin-bottom: 75px;
}

.inl-work-heading > p {
    margin: 0;
    color: var(--inl-muted);
    line-height: 1.7;
}

.inl-work-heading .inl-kicker {
    margin-bottom: 24px;
}

.inl-work-grid {
    display: grid;
    grid-template-columns: 1.35fr .65fr;
    grid-template-rows: repeat(2, 260px);
    gap: 2px;
    background: #fff;
}

.inl-work-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 38px;
    overflow: hidden;
    background: #262329;
    color: #fff;
    text-decoration: none;
}

.inl-work-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 70% 25%, rgba(91,43,130,.55), transparent 38%);
    transition: transform .45s ease;
}

.inl-work-card:hover::before {
    transform: scale(1.08);
}

.inl-work-card-large {
    grid-row: 1 / 3;
}

.inl-work-card span,
.inl-work-card strong,
.inl-work-card i {
    position: relative;
    z-index: 1;
}

.inl-work-card span {
    margin-bottom: 7px;
    color: rgba(255,255,255,.62);
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: 10px;
}

.inl-work-card strong {
    font-size: 28px;
    font-weight: 500;
}

.inl-work-card i {
    position: absolute;
    right: 34px;
    bottom: 34px;
    font-size: 22px;
    font-style: normal;
}


/* RESPONSIVE */

@media (max-width: 991px) {

    .inl-container {
        width: min(calc(100% - 44px), var(--inl-max));
    }

    .inl-hero {
        min-height: 720px;
    }

    .inl-hero-inner {
        padding-top: 160px;
        padding-bottom: 85px;
    }

    .inl-section {
        padding: 100px 0;
    }

    .inl-section-intro,
    .inl-work-heading {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .inl-capability,
    .inl-capability-reverse {
        grid-template-columns: 1fr;
    }

    .inl-capability-reverse .inl-capability-media {
        order: 0;
    }

    .inl-capability-media {
        min-height: 480px;
    }

    .inl-capability-content {
        padding: 55px 40px;
    }

}

@media (max-width: 767px) {

    .inl-container {
        width: min(calc(100% - 34px), var(--inl-max));
    }

    .inl-hero {
        min-height: 680px;
    }

    .inl-hero h1 {
        font-size: clamp(48px, 14vw, 72px);
    }

    .inl-hero-copy {
        font-size: 16px;
    }

    .inl-actions {
        align-items: flex-start;
        flex-direction: column;
        gap: 24px;
    }

    .inl-scroll-cue {
        display: none;
    }

    .inl-process-items {
        min-height: 72px;
        overflow-x: auto;
        justify-content: flex-start;
        gap: 18px;
        white-space: nowrap;
    }

    .inl-section {
        padding: 80px 0;
    }

    .inl-section-intro {
        padding-bottom: 60px;
    }

    .inl-capability {
        margin-bottom: 40px;
    }

    .inl-capability-media {
        min-height: 340px;
    }

    .inl-capability-content {
        padding: 48px 28px;
    }

    .inl-integrated-inner {
        padding-top: 95px;
        padding-bottom: 95px;
    }

    .inl-work-grid {
        display: block;
    }

    .inl-work-card {
        min-height: 280px;
        margin-bottom: 2px;
    }

    .inl-work-card-large {
        min-height: 420px;
    }

}


/* =========================================================
   IRETURA_NEW_LOOK_FULLWIDTH_V1
   Escape Porto's boxed page/content container.
   Scoped strictly to the New Look page template.
   ========================================================= */

body.page-template-page-iretura-new-look {
    overflow-x: hidden;
}

/*
 * Porto can wrap page templates in #main / .container structures.
 * The New Look owns its own internal .inl-container widths,
 * so the outer Porto content area must not constrain it.
 */
body.page-template-page-iretura-new-look #main {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.page-template-page-iretura-new-look #main > .container,
body.page-template-page-iretura-new-look #main > .container-fluid,
body.page-template-page-iretura-new-look .main-content,
body.page-template-page-iretura-new-look .content-area {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/*
 * Final breakout safeguard.
 *
 * Regardless of which Porto wrapper surrounds the template,
 * the New Look canvas spans the viewport.
 */
body.page-template-page-iretura-new-look #iretura-new-look {
    position: relative;
    left: 50%;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
}


/*
 * Our own content container remains intentionally controlled.
 * Backgrounds/media are full bleed; text does not hug the screen.
 */
body.page-template-page-iretura-new-look .inl-container {
    width: min(calc(100% - 96px), 1380px);
    max-width: 1380px;
    margin-left: auto;
    margin-right: auto;
}


/* Large desktop */
@media (min-width: 1600px) {

    body.page-template-page-iretura-new-look .inl-container {
        max-width: 1480px;
    }

}


/* Tablet */
@media (max-width: 991px) {

    body.page-template-page-iretura-new-look .inl-container {
        width: calc(100% - 48px);
    }

}


/* Mobile */
@media (max-width: 767px) {

    body.page-template-page-iretura-new-look .inl-container {
        width: calc(100% - 34px);
    }

}


/* =========================================================
   IRETURA_NEW_LOOK_STUDIO_HERO_V1
   Full-bleed Iretura Media Hub hero.
   CMYK becomes the New Look accent language.
   ========================================================= */

.inl-site {
    /*
     * Iretura CMYK digital equivalents.
     * Used as controlled accents rather than large rainbow fields.
     */
    --inl-cyan: #00a8e8;
    --inl-magenta: #ec008c;
    --inl-yellow: #ffd500;
    --inl-key: #080808;

    --inl-purple: var(--inl-magenta);
}


/* HERO IMAGE */

.inl-hero {
    min-height: calc(100vh - 70px);
    background: var(--inl-key);
}

.inl-hero-media {
    overflow: hidden;
}

.inl-hero-photo {
    position: absolute;
    inset: 0;

    background-image:
        url("https://iretura.com/wp-content/uploads/2026/10/podcast-studio.jpeg");

    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;

    transform: scale(1.002);
}


/*
 * Darken the copy side strongly while allowing the studio
 * environment to remain visible toward the centre/right.
 */
.inl-hero-overlay {
    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.91) 0%,
            rgba(0,0,0,.80) 28%,
            rgba(0,0,0,.54) 52%,
            rgba(0,0,0,.24) 76%,
            rgba(0,0,0,.16) 100%
        ),
        linear-gradient(
            0deg,
            rgba(0,0,0,.64) 0%,
            rgba(0,0,0,.10) 55%,
            rgba(0,0,0,.20) 100%
        );
}


/* HERO CONTENT */

.inl-hero-inner {
    position: relative;
    z-index: 2;
    padding-top: 180px;
    padding-bottom: 100px;
}

.inl-hero h1 {
    max-width: 990px;
    text-shadow: 0 2px 25px rgba(0,0,0,.16);
}

.inl-hero-copy {
    max-width: 625px;
    color: rgba(255,255,255,.86);
}


/* CMYK EYEBROW */

.inl-eyebrow {
    color: rgba(255,255,255,.82);
}

.inl-eyebrow span:nth-of-type(1) {
    color: var(--inl-cyan);
}

.inl-eyebrow span:nth-of-type(2) {
    color: var(--inl-magenta);
}

.inl-eyebrow span:nth-of-type(3) {
    color: var(--inl-yellow);
}


/*
 * CTA remains sophisticated:
 * black/white button with a CMYK signature edge,
 * rather than a large magenta block.
 */
.inl-btn-primary {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.36);
    background: rgba(8,8,8,.84);
    color: #fff;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.inl-btn-primary::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;

    background:
        linear-gradient(
            to bottom,
            var(--inl-cyan) 0 33.333%,
            var(--inl-magenta) 33.333% 66.666%,
            var(--inl-yellow) 66.666% 100%
        );
}

.inl-btn-primary:hover {
    background: #fff;
    border-color: #fff;
    color: #080808;
}


/* PROCESS STRIP — CMYK SIGNATURE */

.inl-process-items i:nth-of-type(1) {
    color: var(--inl-cyan);
}

.inl-process-items i:nth-of-type(2) {
    color: var(--inl-magenta);
}

.inl-process-items i:nth-of-type(3) {
    color: var(--inl-yellow);
}

.inl-process-items i:nth-of-type(4) {
    color: var(--inl-key);
}


/* MOBILE HERO */

@media (max-width: 991px) {

    .inl-hero {
        min-height: 760px;
    }

    .inl-hero-photo {
        /*
         * Preserve the central studio area rather than allowing
         * the far-left wall to dominate narrower screens.
         */
        background-position: 58% center;
    }

    .inl-hero-overlay {
        background:
            linear-gradient(
                90deg,
                rgba(0,0,0,.88) 0%,
                rgba(0,0,0,.67) 70%,
                rgba(0,0,0,.40) 100%
            ),
            linear-gradient(
                0deg,
                rgba(0,0,0,.68) 0%,
                rgba(0,0,0,.14) 65%
            );
    }

}


@media (max-width: 767px) {

    .inl-hero {
        min-height: 720px;
    }

    .inl-hero-photo {
        background-position: 57% center;
    }

    .inl-hero-overlay {
        background:
            linear-gradient(
                90deg,
                rgba(0,0,0,.86),
                rgba(0,0,0,.60)
            ),
            linear-gradient(
                0deg,
                rgba(0,0,0,.72) 0%,
                rgba(0,0,0,.16) 70%
            );
    }

    .inl-hero-inner {
        padding-top: 130px;
        padding-bottom: 75px;
    }

}


/* =========================================================
   IRETURA_NEW_LOOK_HEADER_V1
   Homepage-specific navigation system.
   Porto global header remains untouched on inner pages.
   ========================================================= */


/* Hide Porto header ONLY where the New Look template is active */

body.page-template-page-iretura-new-look #header {
    display: none !important;
}


/*
 * Porto sometimes reserves header spacing separately.
 * Remove it only on this template.
 */

body.page-template-page-iretura-new-look .header-wrapper {
    display: none !important;
}


/* HEADER */

.inl-header {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;

    color: #fff;

    background:
        linear-gradient(
            to bottom,
            rgba(0,0,0,.48),
            rgba(0,0,0,0)
        );

    transition:
        background .3s ease,
        box-shadow .3s ease,
        backdrop-filter .3s ease;
}

body.admin-bar .inl-header {
    top: 32px;
}


.inl-header-inner {
    width: min(calc(100% - 80px), 1480px);
    height: 92px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 55px;

    border-bottom: 1px solid rgba(255,255,255,.20);

    transition:
        height .3s ease,
        border-color .3s ease;
}


/* BRAND */

.inl-brand {
    position: relative;

    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;

    color: #fff !important;
    text-decoration: none !important;
}

.inl-brand-word {
    font-size: 31px;
    line-height: 1;
    letter-spacing: -.055em;
    font-weight: 800;
    text-transform: lowercase;
}

.inl-brand-cmyk {
    display: grid;
    grid-template-columns: repeat(4, 1fr);

    width: 52px;
    height: 3px;
    margin-top: 7px;
}

.inl-brand-cmyk i:nth-child(1) {
    background: #00a8e8;
}

.inl-brand-cmyk i:nth-child(2) {
    background: #ec008c;
}

.inl-brand-cmyk i:nth-child(3) {
    background: #ffd500;
}

.inl-brand-cmyk i:nth-child(4) {
    background: #fff;
}


/* NAVIGATION */

.inl-navigation {
    justify-self: end;

    display: flex;
    align-items: center;
    gap: clamp(22px, 2.3vw, 42px);
}

.inl-navigation > a,
.inl-nav-dropdown-toggle {
    position: relative;

    padding: 34px 0;

    border: 0;
    background: transparent;

    color: rgba(255,255,255,.86) !important;

    font-family: inherit;
    font-size: 13px;
    line-height: 1;
    font-weight: 600;

    text-decoration: none !important;

    cursor: pointer;

    transition: color .2s ease;
}

.inl-navigation > a::after,
.inl-nav-dropdown-toggle::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: 25px;

    width: 0;
    height: 1px;

    background: #fff;

    transition: width .25s ease;
}

.inl-navigation > a:hover,
.inl-nav-dropdown-toggle:hover {
    color: #fff !important;
}

.inl-navigation > a:hover::after,
.inl-nav-dropdown-toggle:hover::after {
    width: 100%;
}

.inl-nav-dropdown-toggle span {
    display: inline-block;
    margin-left: 7px;

    font-size: 15px;
    font-weight: 400;

    transition: transform .25s ease;
}


/* CTA */

.inl-header-cta {
    min-height: 45px;

    display: inline-flex;
    align-items: center;
    gap: 20px;

    padding: 0 20px;

    border: 1px solid rgba(255,255,255,.55);

    color: #fff !important;

    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 10px;
    font-weight: 700;

    text-decoration: none !important;

    transition:
        background .25s ease,
        color .25s ease,
        border-color .25s ease;
}

.inl-header-cta::before {
    content: "";

    width: 3px;
    height: 18px;

    background:
        linear-gradient(
            to bottom,
            #00a8e8 0 33.333%,
            #ec008c 33.333% 66.666%,
            #ffd500 66.666% 100%
        );
}

.inl-header-cta i {
    font-size: 15px;
    font-style: normal;
}

.inl-header-cta:hover {
    background: #fff;
    border-color: #fff;
    color: #080808 !important;
}


/* SCROLLED HEADER */

.inl-header.is-scrolled {
    background: rgba(8,8,8,.94);

    box-shadow:
        0 8px 35px rgba(0,0,0,.14);

    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.inl-header.is-scrolled .inl-header-inner {
    height: 72px;
    border-bottom-color: transparent;
}


/* CAPABILITIES DROPDOWN */

.inl-nav-dropdown {
    position: static;
}

.inl-capabilities-menu {
    position: absolute;

    top: 100%;
    left: 50%;

    width: min(calc(100% - 80px), 1200px);

    display: grid;
    grid-template-columns: .72fr 1.28fr;

    padding: 46px;

    background: #0c0c0c;

    box-shadow:
        0 30px 80px rgba(0,0,0,.32);

    opacity: 0;
    visibility: hidden;

    transform:
        translate(-50%, 12px);

    transition:
        opacity .22s ease,
        visibility .22s ease,
        transform .22s ease;
}

.inl-nav-dropdown:hover .inl-capabilities-menu,
.inl-nav-dropdown.is-open .inl-capabilities-menu {
    opacity: 1;
    visibility: visible;

    transform:
        translate(-50%, 0);
}

.inl-nav-dropdown:hover .inl-nav-dropdown-toggle span,
.inl-nav-dropdown.is-open .inl-nav-dropdown-toggle span {
    transform: rotate(45deg);
}


.inl-capabilities-menu-intro {
    padding-right: 55px;
    border-right: 1px solid rgba(255,255,255,.13);
}

.inl-capabilities-menu-intro > span {
    display: block;

    margin-bottom: 24px;

    color: rgba(255,255,255,.45);

    text-transform: uppercase;
    letter-spacing: .15em;
    font-size: 10px;
    font-weight: 700;
}

.inl-capabilities-menu-intro strong {
    display: block;

    color: #fff;

    font-size: clamp(29px, 2.5vw, 42px);
    line-height: 1.04;
    letter-spacing: -.04em;
    font-weight: 500;
}


.inl-capabilities-links {
    padding-left: 55px;
}

.inl-capabilities-links a {
    display: grid;
    grid-template-columns: 42px 1fr auto;
    align-items: center;
    gap: 10px;

    min-height: 51px;

    border-bottom: 1px solid rgba(255,255,255,.10);

    color: #fff !important;

    text-decoration: none !important;
}

.inl-capabilities-links a:first-child {
    border-top: 1px solid rgba(255,255,255,.10);
}

.inl-capabilities-links a > span {
    color: rgba(255,255,255,.32);

    font-size: 10px;
}

.inl-capabilities-links a strong {
    font-size: 14px;
    font-weight: 500;
}

.inl-capabilities-links a i {
    font-size: 15px;
    font-style: normal;

    transition: transform .2s ease;
}

.inl-capabilities-links a:hover i {
    transform: translateX(5px);
}


/* MOBILE TOGGLE */

.inl-menu-toggle {
    display: none;

    width: 44px;
    height: 44px;

    padding: 0;

    border: 0;
    background: transparent;

    cursor: pointer;
}

.inl-menu-toggle span {
    display: block;

    width: 24px;
    height: 1px;

    margin: 6px auto;

    background: #fff;

    transition:
        transform .25s ease,
        opacity .25s ease;
}


/* HERO NOW SITS BEHIND HEADER */

body.page-template-page-iretura-new-look .inl-hero {
    min-height: 100vh;
}


/* TABLET / MOBILE */

@media (max-width: 1100px) {

    .inl-header-inner {
        width: calc(100% - 48px);

        grid-template-columns: auto auto;
        justify-content: space-between;

        height: 78px;
    }

    .inl-header-cta {
        display: none;
    }

    .inl-menu-toggle {
        display: block;
    }

    .inl-navigation {
        position: fixed;

        top: 78px;
        right: 0;
        bottom: 0;
        left: 0;

        display: block;

        padding: 35px 24px 60px;

        overflow-y: auto;

        background: #080808;

        opacity: 0;
        visibility: hidden;

        transform: translateY(-10px);

        transition:
            opacity .25s ease,
            visibility .25s ease,
            transform .25s ease;
    }

    body.admin-bar .inl-navigation {
        top: 110px;
    }

    .inl-header.menu-open .inl-navigation {
        opacity: 1;
        visibility: visible;

        transform: translateY(0);
    }

    .inl-header.menu-open .inl-menu-toggle span:first-child {
        transform: translateY(3.5px) rotate(45deg);
    }

    .inl-header.menu-open .inl-menu-toggle span:last-child {
        transform: translateY(-3.5px) rotate(-45deg);
    }


    .inl-navigation > a,
    .inl-nav-dropdown-toggle {
        width: 100%;

        display: flex;
        justify-content: space-between;

        padding: 19px 0;

        border-bottom: 1px solid rgba(255,255,255,.12);

        color: #fff !important;

        font-size: 18px;
        text-align: left;
    }

    .inl-navigation > a::after,
    .inl-nav-dropdown-toggle::after {
        display: none;
    }


    .inl-capabilities-menu {
        position: static;

        width: 100%;

        display: none;

        padding: 15px 0 22px;

        box-shadow: none;

        opacity: 1;
        visibility: visible;

        transform: none;

        background: transparent;
    }

    .inl-nav-dropdown.is-open .inl-capabilities-menu {
        display: block;
        transform: none;
    }

    .inl-capabilities-menu-intro {
        display: none;
    }

    .inl-capabilities-links {
        padding: 0 0 0 18px;
    }

    .inl-capabilities-links a {
        grid-template-columns: 32px 1fr auto;

        min-height: 52px;
    }

}


@media (max-width: 782px) {

    body.admin-bar .inl-header {
        top: 46px;
    }

    body.admin-bar .inl-navigation {
        top: 124px;
    }

}


@media (max-width: 767px) {

    .inl-header-inner {
        width: calc(100% - 34px);
    }

    .inl-brand-word {
        font-size: 27px;
    }

}


/* =========================================================
   IRETURA_WHAT_WE_DO_PHOTO_V1
   Iretura studio photograph behind What We Do introduction.
   Capability cards below remain unchanged.
   ========================================================= */


/*
 * The existing New Look template uses the capabilities
 * introduction as the opening portion of this section.
 */

.inl-capabilities-intro {
    position: relative;
    isolation: isolate;

    /*
     * Break this INTRO out to full viewport width while
     * preserving the inner editorial grid.
     */
    width: 100vw;
    max-width: 100vw;

    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);

    min-height: 570px;

    display: grid;
    align-items: center;

    padding-top: 110px;
    padding-bottom: 110px;

    background-image:
        linear-gradient(
            90deg,
            rgba(5,5,5,.80) 0%,
            rgba(5,5,5,.67) 38%,
            rgba(5,5,5,.48) 68%,
            rgba(5,5,5,.34) 100%
        ),
        linear-gradient(
            0deg,
            rgba(0,0,0,.44) 0%,
            rgba(0,0,0,.06) 55%,
            rgba(0,0,0,.16) 100%
        ),
        url("https://iretura.com/wp-content/uploads/2026/10/photo-studio.jpeg");

    background-repeat: no-repeat;
    background-size: cover;

    /*
     * Slight bias to the left keeps the Iretura wall branding
     * within the desktop composition.
     */
    background-position: center center;

    color: #fff;
}


/*
 * Restore the same content width used throughout New Look
 * if the intro's existing child is the site container.
 */

.inl-capabilities-intro > .inl-container {
    width: min(calc(100% - 96px), 1380px);
    margin-left: auto;
    margin-right: auto;
}


/* WHAT WE DO */

.inl-capabilities-intro .inl-eyebrow,
.inl-capabilities-intro .inl-section-label {
    color: rgba(255,255,255,.88) !important;
}


/* MAIN HEADING */

.inl-capabilities-intro h2 {
    color: #fff !important;

    text-shadow:
        0 3px 30px rgba(0,0,0,.16);
}


/*
 * Preserve the visual contrast between the regular first line
 * and heavier "Multiple capabilities." treatment.
 */

.inl-capabilities-intro h2 strong {
    color: #fff !important;
}


/* DESCRIPTION */

.inl-capabilities-intro p {
    color: rgba(255,255,255,.82) !important;
}


/*
 * Tiny CMYK signature beside the section label.
 */

.inl-capabilities-intro .inl-section-label::after,
.inl-capabilities-intro .inl-eyebrow::after {
    content: "";

    display: inline-block;

    width: 38px;
    height: 2px;

    margin-left: 13px;
    vertical-align: middle;

    background:
        linear-gradient(
            90deg,
            #00a8e8 0 33.333%,
            #ec008c 33.333% 66.666%,
            #ffd500 66.666% 100%
        );
}


/* TABLET */

@media (max-width: 991px) {

    .inl-capabilities-intro {
        min-height: 530px;

        padding-top: 90px;
        padding-bottom: 90px;

        background-position: 42% center;

        background-image:
            linear-gradient(
                90deg,
                rgba(5,5,5,.82) 0%,
                rgba(5,5,5,.62) 70%,
                rgba(5,5,5,.43) 100%
            ),
            url("https://iretura.com/wp-content/uploads/2026/10/photo-studio.jpeg");
    }

    .inl-capabilities-intro > .inl-container {
        width: calc(100% - 48px);
    }

}


/* MOBILE */

@media (max-width: 767px) {

    .inl-capabilities-intro {
        min-height: 560px;

        padding-top: 78px;
        padding-bottom: 78px;

        /*
         * Keep the studio wall / shooting area useful in
         * the much narrower mobile crop.
         */
        background-position: 35% center;

        background-image:
            linear-gradient(
                90deg,
                rgba(5,5,5,.82),
                rgba(5,5,5,.59)
            ),
            linear-gradient(
                0deg,
                rgba(0,0,0,.54),
                rgba(0,0,0,.08)
            ),
            url("https://iretura.com/wp-content/uploads/2026/10/photo-studio.jpeg");
    }

    .inl-capabilities-intro > .inl-container {
        width: calc(100% - 34px);
    }

}


/* =========================================================
   IRETURA_WHAT_WE_DO_PHOTO_V2
   Correct target:
   #capabilities > .inl-container > .inl-section-intro
   ========================================================= */


/*
 * Keep the capability section itself in its existing
 * editorial layout. Only its introduction becomes photographic.
 */

#capabilities.inl-capabilities > .inl-container > .inl-section-intro {
    position: relative;
    isolation: isolate;

    width: 100vw;
    max-width: 100vw;

    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);

    min-height: 570px;

    display: grid;
    align-items: center;

    /*
     * Preserve the existing two-column editorial structure
     * while giving it full-width breathing room.
     */
    padding:
        110px
        max(48px, calc((100vw - 1380px) / 2));

    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.82) 0%,
            rgba(0,0,0,.70) 34%,
            rgba(0,0,0,.48) 64%,
            rgba(0,0,0,.27) 100%
        ),
        linear-gradient(
            0deg,
            rgba(0,0,0,.42) 0%,
            rgba(0,0,0,.05) 58%,
            rgba(0,0,0,.13) 100%
        ),
        url("https://iretura.com/wp-content/uploads/2026/10/photo-studio.jpeg");

    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;

    color: #fff;
}


/* WHAT WE DO */

#capabilities .inl-section-intro .inl-kicker {
    color: #fff !important;
}


/* CMYK signature beside WHAT WE DO */

#capabilities .inl-section-intro .inl-kicker::after {
    content: "";

    display: inline-block;

    width: 42px;
    height: 3px;

    margin-left: 14px;
    vertical-align: middle;

    background:
        linear-gradient(
            90deg,
            #00a8e8 0 33.333%,
            #ec008c 33.333% 66.666%,
            #ffd500 66.666% 100%
        );
}


/* HEADLINE */

#capabilities .inl-section-intro h2,
#capabilities .inl-section-intro h2 strong {
    color: #fff !important;
}

#capabilities .inl-section-intro h2 {
    text-shadow:
        0 4px 35px rgba(0,0,0,.18);
}


/* BODY COPY */

#capabilities .inl-section-intro p:not(.inl-kicker) {
    color: rgba(255,255,255,.84) !important;
    max-width: 650px;
}


/*
 * Give the first capability card some deliberate separation
 * from the photographic introduction.
 */

#capabilities .inl-section-intro + .inl-capability {
    margin-top: 90px;
}


/* TABLET */

@media (max-width: 991px) {

    #capabilities.inl-capabilities > .inl-container > .inl-section-intro {
        min-height: 520px;

        padding:
            85px
            24px;

        background:
            linear-gradient(
                90deg,
                rgba(0,0,0,.82) 0%,
                rgba(0,0,0,.63) 72%,
                rgba(0,0,0,.43) 100%
            ),
            url("https://iretura.com/wp-content/uploads/2026/10/photo-studio.jpeg");

        background-size: cover;
        background-position: 40% center;
    }

}


/* MOBILE */

@media (max-width: 767px) {

    #capabilities.inl-capabilities > .inl-container > .inl-section-intro {
        min-height: 540px;

        padding:
            70px
            17px;

        background:
            linear-gradient(
                90deg,
                rgba(0,0,0,.82),
                rgba(0,0,0,.55)
            ),
            linear-gradient(
                0deg,
                rgba(0,0,0,.54),
                rgba(0,0,0,.06)
            ),
            url("https://iretura.com/wp-content/uploads/2026/10/photo-studio.jpeg");

        background-size: cover;
        background-position: 34% center;
    }

    #capabilities .inl-section-intro + .inl-capability {
        margin-top: 60px;
    }

}


/* =========================================================
   IRETURA_CAPABILITIES_PHOTO_FINAL_V1

   FINAL INTENT:
   Process strip
       ↓
   Continuous photo starts at #capabilities
       ↓
   What We Do + every capability
       ↓
   Photo ends at </section>
       ↓
   The Iretura Advantage

   Supersedes PHOTO_V1 and PHOTO_V2 experiments.
   ========================================================= */


/* =========================================================
   1. ENTIRE CAPABILITIES SECTION = ONE PHOTO ENVIRONMENT
   ========================================================= */

#capabilities.inl-capabilities {
    position: relative;
    isolation: isolate;

    padding-top: 0;
    padding-bottom: 110px;

    background:
        linear-gradient(
            90deg,
            rgba(5,5,5,.79) 0%,
            rgba(5,5,5,.61) 36%,
            rgba(5,5,5,.43) 68%,
            rgba(5,5,5,.34) 100%
        ),
        linear-gradient(
            0deg,
            rgba(0,0,0,.48) 0%,
            rgba(0,0,0,.13) 42%,
            rgba(0,0,0,.23) 100%
        ),
        url("https://iretura.com/wp-content/uploads/2026/10/photo-studio.jpeg");

    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;

    color: #fff;
}


/*
 * The source image is 4:3 while the section is much taller.
 * Keep the photograph visually continuous instead of tiling.
 */

#capabilities.inl-capabilities::before {
    content: "";

    position: absolute;
    inset: 0;
    z-index: -1;

    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.03) 0%,
            rgba(0,0,0,.18) 42%,
            rgba(0,0,0,.43) 100%
        );
}


/* =========================================================
   2. NEUTRALISE THE EARLIER INTRO-ONLY PHOTO EXPERIMENTS
   ========================================================= */

#capabilities.inl-capabilities > .inl-container > .inl-section-intro {
    width: auto;
    max-width: none;

    min-height: 560px;

    margin-left: 0;
    margin-right: 0;

    padding:
        115px
        0
        100px;

    /*
     * Critical:
     * photograph now belongs to #capabilities,
     * NOT to the intro itself.
     */
    background: transparent !important;
    background-image: none !important;

    color: #fff;
}


/*
 * The incorrect V1 selector is also explicitly neutralised.
 */

#capabilities .inl-capabilities-intro {
    width: auto;
    max-width: none;

    margin-left: 0;
    margin-right: 0;

    background: transparent !important;
    background-image: none !important;
}


/* =========================================================
   3. INTRO TYPOGRAPHY
   ========================================================= */

#capabilities .inl-section-intro .inl-kicker {
    color: rgba(255,255,255,.92) !important;
}

#capabilities .inl-section-intro h2,
#capabilities .inl-section-intro h2 strong {
    color: #fff !important;
}

#capabilities .inl-section-intro h2 {
    text-shadow:
        0 4px 30px rgba(0,0,0,.25);
}

#capabilities .inl-section-intro p:not(.inl-kicker) {
    max-width: 650px;

    color: rgba(255,255,255,.83) !important;
}


/* CMYK signature */

#capabilities .inl-section-intro .inl-kicker::after {
    content: "";

    display: inline-block;

    width: 42px;
    height: 3px;

    margin-left: 14px;

    vertical-align: middle;

    background:
        linear-gradient(
            90deg,
            #00a8e8 0 33.333%,
            #ec008c 33.333% 66.666%,
            #ffd500 66.666% 100%
        );
}


/* =========================================================
   4. CAPABILITY CARDS
   ========================================================= */

/*
 * Remove the opaque paper blocks that currently conceal
 * the section photograph.
 */

#capabilities .inl-capability,
#capabilities .inl-capability-reverse {
    position: relative;

    overflow: hidden;

    margin-bottom: 38px;

    background:
        rgba(7,7,7,.68) !important;

    border:
        1px solid rgba(255,255,255,.16);

    box-shadow:
        0 25px 80px rgba(0,0,0,.17);

    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}


/*
 * Give every capability card a small CMYK signature.
 */

#capabilities .inl-capability::before {
    content: "";

    position: absolute;
    z-index: 4;

    top: 0;
    left: 0;

    width: 100%;
    height: 3px;

    background:
        linear-gradient(
            90deg,
            #00a8e8 0 33.333%,
            #ec008c 33.333% 66.666%,
            #ffd500 66.666% 100%
        );
}


/* MEDIA */

#capabilities .inl-capability-media {
    position: relative;
}

#capabilities .inl-capability-media::after {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.08),
            rgba(0,0,0,.20)
        );
}

#capabilities .inl-capability-media img {
    position: relative;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* =========================================================
   5. CAPABILITY TEXT = WHITE
   ========================================================= */

#capabilities .inl-capability-content {
    color: #fff;
}

#capabilities .inl-capability-content .inl-kicker {
    color: rgba(255,255,255,.67) !important;
}

#capabilities .inl-capability-content h3,
#capabilities .inl-capability-content h3 strong {
    color: #fff !important;
}

#capabilities
.inl-capability-content
> p:not(.inl-kicker):not(.inl-tags) {
    color: rgba(255,255,255,.72) !important;
}

#capabilities .inl-tags {
    border-top-color:
        rgba(255,255,255,.17) !important;

    color:
        rgba(255,255,255,.57) !important;
}

#capabilities .inl-number {
    color:
        rgba(255,255,255,.28) !important;
}

#capabilities .inl-arrow-link {
    color: #fff !important;
}

#capabilities .inl-arrow-link span {
    color: #fff !important;
}


/* =========================================================
   6. FIRST CARD TRANSITION
   ========================================================= */

#capabilities .inl-section-intro + .inl-capability {
    margin-top: 0;
}


/* =========================================================
   7. HARD STOP AT IRETURA ADVANTAGE
   ========================================================= */

/*
 * This next sibling is intentionally opaque.
 * It creates the exact end-point requested for the photograph.
 */

#capabilities + .inl-integrated {
    position: relative;
    z-index: 2;

    background: #0b0b0b !important;
}


/* =========================================================
   8. TABLET
   ========================================================= */

@media (max-width: 991px) {

    #capabilities.inl-capabilities {
        padding-bottom: 70px;

        background:
            linear-gradient(
                90deg,
                rgba(5,5,5,.77),
                rgba(5,5,5,.49)
            ),
            linear-gradient(
                0deg,
                rgba(0,0,0,.52),
                rgba(0,0,0,.13)
            ),
            url("https://iretura.com/wp-content/uploads/2026/10/photo-studio.jpeg");

        background-size: cover;
        background-position: 40% center;
    }


    #capabilities.inl-capabilities
    > .inl-container
    > .inl-section-intro {

        min-height: 500px;

        padding:
            90px
            0
            75px;
    }


    #capabilities .inl-capability,
    #capabilities .inl-capability-reverse {
        background:
            rgba(7,7,7,.74) !important;
    }

}


/* =========================================================
   9. MOBILE
   ========================================================= */

@media (max-width: 767px) {

    #capabilities.inl-capabilities {
        padding-bottom: 45px;

        background:
            linear-gradient(
                90deg,
                rgba(5,5,5,.76),
                rgba(5,5,5,.51)
            ),
            linear-gradient(
                0deg,
                rgba(0,0,0,.55),
                rgba(0,0,0,.17)
            ),
            url("https://iretura.com/wp-content/uploads/2026/10/photo-studio.jpeg");

        background-size: cover;
        background-position: 34% center;
    }


    #capabilities.inl-capabilities
    > .inl-container
    > .inl-section-intro {

        min-height: 480px;

        padding:
            75px
            0
            60px;
    }


    #capabilities .inl-capability,
    #capabilities .inl-capability-reverse {
        margin-bottom: 24px;

        background:
            rgba(7,7,7,.78) !important;

        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }


    #capabilities .inl-capability-content {
        padding:
            48px
            28px;
    }

}


/* =========================================================
   IRETURA_PHASE6_V1
   Official logo + capabilities 03–05
   ========================================================= */


/* OFFICIAL IRETURA LOGO */

.inl-brand {
    display: inline-flex;
    align-items: center;
}

.inl-brand-logo {
    display: block;

    width: 200px;
    height: 40px;

    max-width: none;

    object-fit: contain;
    object-position: left center;
}


/*
 * The temporary typographic logo is no longer used.
 * Keep these hidden defensively in case cached markup appears.
 */

.inl-brand-word,
.inl-brand-cmyk {
    display: none !important;
}


/* PRINT VISUAL */

.inl-capability-media-print {
    position: relative;

    background:
        linear-gradient(
            135deg,
            rgba(0,168,232,.92) 0%,
            rgba(236,0,140,.80) 48%,
            rgba(255,213,0,.88) 100%
        );
}

.inl-capability-visual-placeholder {
    position: absolute;
    inset: 0;

    display: flex;
    align-items: flex-end;

    padding: 48px;

    background:
        linear-gradient(
            0deg,
            rgba(0,0,0,.60),
            rgba(0,0,0,.03) 65%
        );
}

.inl-capability-visual-placeholder span {
    color: #fff;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .11em;
    text-transform: uppercase;
}


/* DIGITAL VISUAL */

.inl-capability-media-digital {
    position: relative;

    display: flex;
    align-items: center;

    background:
        #090909;
}

.inl-digital-visual {
    position: relative;

    width: 100%;
    min-height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 70px;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 78% 22%,
            rgba(0,168,232,.20),
            transparent 34%
        ),
        radial-gradient(
            circle at 18% 80%,
            rgba(236,0,140,.18),
            transparent 35%
        ),
        #090909;
}

.inl-digital-label {
    margin-bottom: 30px;

    color: rgba(255,255,255,.47);

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .16em;
}

.inl-digital-visual strong {
    position: relative;
    z-index: 2;

    color: #fff;

    font-size: clamp(38px, 4vw, 67px);
    line-height: .98;

    letter-spacing: -.05em;
    font-weight: 500;
}

.inl-digital-lines {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    width: 150px;
    height: 4px;

    margin-top: 45px;
}

.inl-digital-lines i:nth-child(1) {
    background: #00a8e8;
}

.inl-digital-lines i:nth-child(2) {
    background: #ec008c;
}

.inl-digital-lines i:nth-child(3) {
    background: #ffd500;
}


/* MOBILE LOGO */

@media (max-width: 767px) {

    .inl-brand-logo {
        width: 165px;
        height: auto;
    }

    .inl-capability-visual-placeholder {
        padding: 30px;
    }

    .inl-digital-visual {
        min-height: 380px;
        padding: 42px 30px;
    }

}


/* =========================================================
   IRETURA_PRINT_REAL_IMAGE_V1
   03 / Print & Branding
   Background only — no structural changes
   ========================================================= */

#capabilities .inl-capability-media-print {
    position: relative;

    background:
        linear-gradient(
            0deg,
            rgba(0,0,0,.18),
            rgba(0,0,0,.02)
        ),
        url("https://iretura.com/wp-content/uploads/2026/10/printing-press-scaled.jpg")
        center center / cover no-repeat !important;
}


/*
 * Phase 6 originally created a graphic placeholder inside
 * this media area. Hide its text treatment while preserving
 * the media container itself.
 */

#capabilities
.inl-capability-media-print
.inl-capability-visual-placeholder {
    position: absolute;
    inset: 0;

    display: block !important;

    padding: 0;

    background: transparent !important;

    pointer-events: none;
}

#capabilities
.inl-capability-media-print
.inl-capability-visual-placeholder span {
    display: none !important;
}


/* Maintain the same dimensions as capabilities 01/02 */

#capabilities .inl-capability-media-print {
    min-height: 620px;
}


@media (max-width: 991px) {

    #capabilities .inl-capability-media-print {
        min-height: 480px;

        background-position: center center !important;
    }

}


@media (max-width: 767px) {

    #capabilities .inl-capability-media-print {
        min-height: 340px;
    }

}


/* =========================================================
   IRETURA_EVENTS_REAL_IMAGE_V1
   04 / Events & Experiences
   Background only — preserve existing structure
   ========================================================= */

#capabilities .inl-capability-media-events {
    position: relative;

    min-height: 620px;

    background:
        linear-gradient(
            0deg,
            rgba(0,0,0,.14),
            rgba(0,0,0,.01)
        ),
        url("https://iretura.com/wp-content/uploads/2026/06/Dr-Ime-Okon-Birthday-01899-scaled.jpg")
        center center / cover no-repeat !important;

    overflow: hidden;
}


/*
 * The Phase 6 Events card already contains an image.
 * Hide that image visually rather than changing markup.
 * The real image above now belongs to the media container.
 */

#capabilities
.inl-capability-media-events
> img {
    opacity: 0 !important;

    width: 100%;
    height: 100%;

    object-fit: cover;

    pointer-events: none;
}


/* Responsive crop */

@media (max-width: 991px) {

    #capabilities .inl-capability-media-events {
        min-height: 480px;

        background-position: center center !important;
    }

}


@media (max-width: 767px) {

    #capabilities .inl-capability-media-events {
        min-height: 340px;

        background-position: center center !important;
    }

}


/* =========================================================
   IRETURA_DIGITAL_WELVID_V1
   05 / Digital Infrastructure
   Real Welvid interface — no HTML changes
   ========================================================= */

#capabilities .inl-capability-media-digital {
    position: relative;

    min-height: 620px;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 20% 15%,
            rgba(0,168,232,.10),
            transparent 32%
        ),
        radial-gradient(
            circle at 84% 82%,
            rgba(236,0,140,.08),
            transparent 30%
        ),
        #0b0b0b !important;
}


/*
 * Replace the Phase 6 abstract digital treatment visually
 * without modifying its HTML.
 */

#capabilities .inl-capability-media-digital::before {
    content: "";

    position: absolute;
    z-index: 2;

    inset: 48px;

    background:
        url("https://iretura.com/wp-content/uploads/2026/10/welvid-homepage.png")
        center center / contain no-repeat;

    filter:
        drop-shadow(0 24px 45px rgba(0,0,0,.38));

    pointer-events: none;
}


/*
 * Small browser-frame effect around the product screenshot.
 */

#capabilities .inl-capability-media-digital::after {
    content: "";

    position: absolute;
    z-index: 1;

    top: 32px;
    right: 32px;
    bottom: 32px;
    left: 32px;

    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;

    background: rgba(255,255,255,.025);

    box-shadow:
        0 30px 80px rgba(0,0,0,.24);

    pointer-events: none;
}


/* Suppress the old Phase 6 abstract visual */

#capabilities
.inl-capability-media-digital
.inl-digital-visual {
    opacity: 0 !important;

    pointer-events: none;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 991px) {

    #capabilities .inl-capability-media-digital {
        min-height: 480px;
    }

    #capabilities .inl-capability-media-digital::before {
        inset: 34px;
    }

    #capabilities .inl-capability-media-digital::after {
        top: 22px;
        right: 22px;
        bottom: 22px;
        left: 22px;
    }

}


@media (max-width: 767px) {

    #capabilities .inl-capability-media-digital {
        min-height: 340px;
    }

    #capabilities .inl-capability-media-digital::before {
        inset: 20px;
    }

    #capabilities .inl-capability-media-digital::after {
        top: 12px;
        right: 12px;
        bottom: 12px;
        left: 12px;

        border-radius: 5px;
    }

}


/* =========================================================
   IRETURA_ADVANTAGE_REAL_IMAGE_V1
   The Iretura Advantage
   Real Iretura image — visual treatment only
   ========================================================= */

body.page-template-page-iretura-new-look
.inl-integrated {
    position: relative;

    background:
        linear-gradient(
            90deg,
            rgba(5,5,5,.90) 0%,
            rgba(5,5,5,.82) 30%,
            rgba(5,5,5,.60) 58%,
            rgba(5,5,5,.28) 100%
        ),
        url("https://iretura.com/wp-content/uploads/2026/10/share-your-brief-scaled.jpg")
        center center / cover no-repeat !important;
}


/*
 * Keep the existing content above the photographic layer.
 * No dimensions or section structure are changed.
 */

body.page-template-page-iretura-new-look
.inl-integrated
.inl-container {
    position: relative;
    z-index: 2;
}


/*
 * Preserve strong readability against the photograph.
 */

body.page-template-page-iretura-new-look
.inl-integrated h2,
body.page-template-page-iretura-new-look
.inl-integrated p {
    text-shadow:
        0 2px 24px rgba(0,0,0,.22);
}


/*
 * Subtle edge treatment between Capabilities
 * and The Iretura Advantage.
 */

body.page-template-page-iretura-new-look
.inl-integrated::before {
    content: "";

    position: absolute;
    z-index: 1;

    top: 0;
    left: 0;
    right: 0;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            #00a8e8 0 25%,
            #ec008c 25% 50%,
            #ffd500 50% 75%,
            rgba(255,255,255,.28) 75% 100%
        );

    opacity: .72;

    pointer-events: none;
}


/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 991px) {

    body.page-template-page-iretura-new-look
    .inl-integrated {
        background:
            linear-gradient(
                90deg,
                rgba(5,5,5,.90) 0%,
                rgba(5,5,5,.76) 48%,
                rgba(5,5,5,.42) 100%
            ),
            url("https://iretura.com/wp-content/uploads/2026/10/share-your-brief-scaled.jpg")
            center center / cover no-repeat !important;
    }

}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 767px) {

    body.page-template-page-iretura-new-look
    .inl-integrated {
        background:
            linear-gradient(
                90deg,
                rgba(5,5,5,.91) 0%,
                rgba(5,5,5,.75) 65%,
                rgba(5,5,5,.54) 100%
            ),
            url("https://iretura.com/wp-content/uploads/2026/10/share-your-brief-scaled.jpg")
            center center / cover no-repeat !important;
    }

}


/* =========================================================
   IRETURA_03_05_REAL_MARKUP_V1
   Real image elements for Print + Digital
   ========================================================= */


/* ---------------------------------------------------------
   03 — PRINT & BRANDING
   --------------------------------------------------------- */

body.page-template-page-iretura-new-look
.inl-capability-media-print {
    background: #080808 !important;
    overflow: hidden;
}

body.page-template-page-iretura-new-look
.inl-capability-media-print::before,
body.page-template-page-iretura-new-look
.inl-capability-media-print::after {
    content: none !important;
    display: none !important;
}

body.page-template-page-iretura-new-look
.inl-capability-media-print > img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 620px;
    object-fit: cover;
    object-position: center;
}


/* ---------------------------------------------------------
   05 — DIGITAL INFRASTRUCTURE
   Keep the complete Welvid interface visible.
   --------------------------------------------------------- */

body.page-template-page-iretura-new-look
.inl-capability-media-digital {
    position: relative;
    overflow: hidden;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: clamp(24px, 4vw, 54px);

    background:
        radial-gradient(
            circle at 75% 20%,
            rgba(0,168,232,.13),
            transparent 38%
        ),
        #090909 !important;
}

body.page-template-page-iretura-new-look
.inl-capability-media-digital::before,
body.page-template-page-iretura-new-look
.inl-capability-media-digital::after {
    content: none !important;
    display: none !important;
}

body.page-template-page-iretura-new-look
.inl-capability-media-digital > img {
    position: relative;
    z-index: 2;

    display: block;

    width: 100%;
    height: auto;
    max-width: 100%;

    object-fit: contain;

    filter:
        drop-shadow(0 24px 50px rgba(0,0,0,.38));
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 991px) {

    body.page-template-page-iretura-new-look
    .inl-capability-media-print > img {
        min-height: 480px;
    }

}


@media (max-width: 767px) {

    body.page-template-page-iretura-new-look
    .inl-capability-media-print > img {
        min-height: 340px;
    }

    body.page-template-page-iretura-new-look
    .inl-capability-media-digital {
        padding: 20px;
    }

}


/* =========================================================
   IRETURA_ADVANTAGE_SPECIFICITY_FIX_V1

   Overrides the historical:
   #capabilities + .inl-integrated {
       background: #0b0b0b !important;
   }

   Keep the photograph as the definitive Advantage background.
   ========================================================= */

body.page-template-page-iretura-new-look
#capabilities + .inl-integrated {
    position: relative;

    background-image:
        linear-gradient(
            90deg,
            rgba(5,5,5,.86) 0%,
            rgba(5,5,5,.74) 34%,
            rgba(5,5,5,.44) 67%,
            rgba(5,5,5,.18) 100%
        ),
        url("https://iretura.com/wp-content/uploads/2026/10/share-your-brief-scaled.jpg") !important;

    background-size:
        cover,
        cover !important;

    background-position:
        center center,
        center center !important;

    background-repeat:
        no-repeat,
        no-repeat !important;

    background-color: #080808 !important;
}


/* Tablet */

@media (max-width: 991px) {

    body.page-template-page-iretura-new-look
    #capabilities + .inl-integrated {

        background-image:
            linear-gradient(
                90deg,
                rgba(5,5,5,.88) 0%,
                rgba(5,5,5,.70) 55%,
                rgba(5,5,5,.32) 100%
            ),
            url("https://iretura.com/wp-content/uploads/2026/10/share-your-brief-scaled.jpg") !important;

        background-position:
            center center,
            center center !important;
    }

}


/* Mobile */

@media (max-width: 767px) {

    body.page-template-page-iretura-new-look
    #capabilities + .inl-integrated {

        background-image:
            linear-gradient(
                90deg,
                rgba(5,5,5,.90) 0%,
                rgba(5,5,5,.72) 65%,
                rgba(5,5,5,.42) 100%
            ),
            url("https://iretura.com/wp-content/uploads/2026/10/share-your-brief-scaled.jpg") !important;

        background-position:
            center center,
            center center !important;
    }

}


/* =========================================================
   IRETURA_ADVANTAGE_FLIP_V1
   Horizontally mirror Share Your Brief background
   ========================================================= */

body.page-template-page-iretura-new-look
#capabilities + .inl-integrated {
    position: relative;
    isolation: isolate;
    overflow: hidden;

    /*
     * Remove photograph from the element itself.
     * The image is now rendered by ::after so it can be flipped.
     */
    background: #080808 !important;
}


/* FLIPPED PHOTOGRAPH */

body.page-template-page-iretura-new-look
#capabilities + .inl-integrated::after {
    content: "";

    position: absolute;
    z-index: -2;

    /*
     * Slight overscan prevents a hairline appearing
     * at the edge after transformation.
     */
    inset: -1px;

    background-image:
        url("https://iretura.com/wp-content/uploads/2026/10/share-your-brief-scaled.jpg");

    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;

    transform: scaleX(-1);
    transform-origin: center;

    pointer-events: none;
}


/* READABILITY OVERLAY */

body.page-template-page-iretura-new-look
#capabilities + .inl-integrated::before {
    content: "";

    position: absolute;
    z-index: -1;

    inset: 0;

    height: auto;

    /*
     * Darker where the copy sits on the left,
     * increasingly transparent toward the image.
     */
    background:
        linear-gradient(
            90deg,
            rgba(5,5,5,.88) 0%,
            rgba(5,5,5,.78) 30%,
            rgba(5,5,5,.48) 62%,
            rgba(5,5,5,.18) 100%
        );

    opacity: 1;

    pointer-events: none;
}


/* CONTENT ABOVE BOTH BACKGROUND LAYERS */

body.page-template-page-iretura-new-look
#capabilities + .inl-integrated
.inl-integrated-inner {
    position: relative;
    z-index: 2;
}


/* TABLET */

@media (max-width: 991px) {

    body.page-template-page-iretura-new-look
    #capabilities + .inl-integrated::before {
        background:
            linear-gradient(
                90deg,
                rgba(5,5,5,.90) 0%,
                rgba(5,5,5,.76) 52%,
                rgba(5,5,5,.32) 100%
            );
    }

}


/* MOBILE */

@media (max-width: 767px) {

    body.page-template-page-iretura-new-look
    #capabilities + .inl-integrated::before {
        background:
            linear-gradient(
                90deg,
                rgba(5,5,5,.91) 0%,
                rgba(5,5,5,.76) 68%,
                rgba(5,5,5,.46) 100%
            );
    }

}


/* =========================================================
   IRETURA_SELECTED_WORK_REAL_IMAGES_V1
   Real Iretura project imagery
   ========================================================= */


/*
 * Shared card treatment
 */

body.page-template-page-iretura-new-look
#selected-work .inl-work-card {
    isolation: isolate;

    background-color: #111;

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


/*
 * 01 — PRODUCTION
 * Large left-hand feature
 */

body.page-template-page-iretura-new-look
#selected-work .inl-work-card:nth-child(1) {
    background-image:
        url("https://iretura.com/wp-content/uploads/2020/01/olomu-fest-114-of-184-scaled.jpg");

    background-position: center center;
}


/*
 * 02 — STORIES IN STILLS
 */

body.page-template-page-iretura-new-look
#selected-work .inl-work-card:nth-child(2) {
    background-image:
        url("https://iretura.com/wp-content/uploads/2020/01/Iretura-74-scaled.jpg");

    background-position: center center;
}


/*
 * 03 — EVENT COVERAGE
 */

body.page-template-page-iretura-new-look
#selected-work .inl-work-card:nth-child(3) {
    background-image:
        url("https://iretura.com/wp-content/uploads/2020/01/Iretura-88-scaled.jpg");

    background-position: center center;
}


/*
 * Replace the old purple radial visual with
 * a photographic readability treatment.
 */

body.page-template-page-iretura-new-look
#selected-work .inl-work-card::before {
    content: "";

    position: absolute;
    z-index: 0;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(5,5,5,.05) 0%,
            rgba(5,5,5,.10) 38%,
            rgba(5,5,5,.78) 100%
        );

    transition:
        background .35s ease;
}


/*
 * Subtle premium interaction.
 * The image itself stays stable — only overlay changes.
 */

body.page-template-page-iretura-new-look
#selected-work .inl-work-card:hover::before {
    transform: none;

    background:
        linear-gradient(
            180deg,
            rgba(5,5,5,.02) 0%,
            rgba(5,5,5,.06) 34%,
            rgba(5,5,5,.67) 100%
        );
}


/*
 * Keep card copy clearly above photograph.
 */

body.page-template-page-iretura-new-look
#selected-work .inl-work-card span,
body.page-template-page-iretura-new-look
#selected-work .inl-work-card strong,
body.page-template-page-iretura-new-look
#selected-work .inl-work-card i {
    position: relative;
    z-index: 2;
}


/*
 * Make project names more editorial.
 */

body.page-template-page-iretura-new-look
#selected-work .inl-work-card strong {
    max-width: 80%;

    color: #fff;

    text-shadow:
        0 2px 20px rgba(0,0,0,.28);
}


/*
 * Small category labels
 */

body.page-template-page-iretura-new-look
#selected-work .inl-work-card span {
    color: rgba(255,255,255,.78);
}


/*
 * Arrow remains visible against all photographs.
 */

body.page-template-page-iretura-new-look
#selected-work .inl-work-card i {
    color: #fff;
}


/* MOBILE */

@media (max-width: 767px) {

    body.page-template-page-iretura-new-look
    #selected-work .inl-work-card:nth-child(1),
    body.page-template-page-iretura-new-look
    #selected-work .inl-work-card:nth-child(2),
    body.page-template-page-iretura-new-look
    #selected-work .inl-work-card:nth-child(3) {
        background-position: center center;
    }

}


/* =========================================================
   IRETURA_BUILT_BY_PRODUCTS_V1
   Digital products built by Iretura
   ========================================================= */

body.page-template-page-iretura-new-look
.inl-products {
    position: relative;
    overflow: hidden;
    padding: 140px 0;
    background: #080808;
    color: #fff;
}


body.page-template-page-iretura-new-look
.inl-products::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            #00a8e8 0 25%,
            #ec008c 25% 50%,
            #ffd500 50% 75%,
            rgba(255,255,255,.45) 75% 100%
        );
}


body.page-template-page-iretura-new-look
.inl-products-heading {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
    gap: 80px;
    align-items: end;
    margin-bottom: 75px;
}


body.page-template-page-iretura-new-look
.inl-products-heading h2 {
    max-width: 850px;
    margin: 0;

    color: #fff;
    font-size: clamp(46px, 5.3vw, 82px);
    line-height: .98;
    letter-spacing: -.045em;
    font-weight: 400;
}


body.page-template-page-iretura-new-look
.inl-products-heading h2 strong {
    display: block;
    font-weight: 700;
}


body.page-template-page-iretura-new-look
.inl-products-heading > p {
    margin: 0;
    max-width: 430px;

    color: rgba(255,255,255,.60);
    line-height: 1.75;
}


body.page-template-page-iretura-new-look
.inl-product-grid {
    display: grid;
    gap: 2px;

    background: rgba(255,255,255,.10);
}


body.page-template-page-iretura-new-look
.inl-product-card {
    position: relative;

    display: grid;
    grid-template-columns: .78fr 1.22fr;
    min-height: 590px;

    overflow: hidden;

    background: #101010;
    color: #fff;

    text-decoration: none;
}


body.page-template-page-iretura-new-look
.inl-product-card:hover {
    color: #fff;
    text-decoration: none;
}


body.page-template-page-iretura-new-look
.inl-product-copy {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;

    padding: 58px;
}


body.page-template-page-iretura-new-look
.inl-product-number {
    margin-bottom: auto;

    color: rgba(255,255,255,.35);

    font-size: 12px;
    letter-spacing: .18em;
}


body.page-template-page-iretura-new-look
.inl-product-type {
    margin: 0 0 16px;

    color: rgba(255,255,255,.48);

    font-size: 10px;
    font-weight: 600;
    line-height: 1.4;

    text-transform: uppercase;
    letter-spacing: .14em;
}


body.page-template-page-iretura-new-look
.inl-product-card h3 {
    margin: 0 0 20px;

    color: #fff;

    font-size: clamp(46px, 5vw, 76px);
    line-height: .95;
    letter-spacing: -.045em;
}


body.page-template-page-iretura-new-look
.inl-product-description {
    max-width: 440px;
    margin: 0 0 35px;

    color: rgba(255,255,255,.65);

    font-size: 15px;
    line-height: 1.75;
}


body.page-template-page-iretura-new-look
.inl-product-link {
    color: #fff;

    font-size: 12px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .12em;
}


body.page-template-page-iretura-new-look
.inl-product-link i {
    display: inline-block;
    margin-left: 8px;

    font-style: normal;

    transition: transform .25s ease;
}


body.page-template-page-iretura-new-look
.inl-product-card:hover
.inl-product-link i {
    transform: translateX(6px);
}


/* WELVID */

body.page-template-page-iretura-new-look
.inl-product-card-welvid {
    background:
        radial-gradient(
            circle at 85% 40%,
            rgba(0,168,232,.16),
            transparent 36%
        ),
        #101010;
}


body.page-template-page-iretura-new-look
.inl-product-visual {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 55px 55px 55px 10px;
}


body.page-template-page-iretura-new-look
.inl-product-visual img {
    display: block;

    width: 100%;
    height: auto;
    max-height: 480px;

    object-fit: contain;

    filter: drop-shadow(0 35px 55px rgba(0,0,0,.42));

    transition: transform .5s ease;
}


body.page-template-page-iretura-new-look
.inl-product-card-welvid:hover
.inl-product-visual img {
    transform: translateY(-5px);
}


/* RYLANEXT */

body.page-template-page-iretura-new-look
.inl-product-card-rylanext {
    background:
        radial-gradient(
            circle at 78% 50%,
            rgba(236,0,140,.16),
            transparent 33%
        ),
        radial-gradient(
            circle at 92% 25%,
            rgba(255,213,0,.09),
            transparent 24%
        ),
        #101010;
}


body.page-template-page-iretura-new-look
.inl-product-monogram {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-width: 0;
    padding: 55px;

    color: #fff;

    line-height: .78;
    letter-spacing: -.065em;

    transition: transform .5s ease;
}


body.page-template-page-iretura-new-look
.inl-product-monogram span {
    font-size: clamp(76px, 10vw, 155px);
    font-weight: 300;
}


body.page-template-page-iretura-new-look
.inl-product-monogram strong {
    font-size: clamp(92px, 12vw, 185px);
    font-weight: 800;
}


body.page-template-page-iretura-new-look
.inl-product-card-rylanext:hover
.inl-product-monogram {
    transform: scale(1.025);
}


/* TABLET */

@media (max-width: 991px) {

    body.page-template-page-iretura-new-look
    .inl-products {
        padding: 105px 0;
    }

    body.page-template-page-iretura-new-look
    .inl-products-heading {
        grid-template-columns: 1fr;
        gap: 30px;
        margin-bottom: 55px;
    }

    body.page-template-page-iretura-new-look
    .inl-product-card {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    body.page-template-page-iretura-new-look
    .inl-product-copy {
        min-height: 420px;
        padding: 45px;
    }

    body.page-template-page-iretura-new-look
    .inl-product-visual,
    body.page-template-page-iretura-new-look
    .inl-product-monogram {
        min-height: 420px;
        padding: 45px;
    }

}


/* MOBILE */

@media (max-width: 767px) {

    body.page-template-page-iretura-new-look
    .inl-products {
        padding: 80px 0;
    }

    body.page-template-page-iretura-new-look
    .inl-products-heading {
        margin-bottom: 40px;
    }

    body.page-template-page-iretura-new-look
    .inl-products-heading h2 {
        font-size: clamp(40px, 12vw, 58px);
    }

    body.page-template-page-iretura-new-look
    .inl-product-copy {
        min-height: 390px;
        padding: 32px;
    }

    body.page-template-page-iretura-new-look
    .inl-product-visual,
    body.page-template-page-iretura-new-look
    .inl-product-monogram {
        min-height: 300px;
        padding: 30px;
    }

}


/* =========================================================
   IRETURA_MEDIA_HUB_V1
   Physical production environment
   ========================================================= */

body.page-template-page-iretura-new-look
.inl-media-hub {
    position: relative;
    background: #080808;
    color: #fff;
}


body.page-template-page-iretura-new-look
.inl-media-hub-stage {
    position: relative;
    min-height: 850px;
    overflow: hidden;
}


body.page-template-page-iretura-new-look
.inl-media-hub-primary {
    position: absolute;
    inset: 0;
}


body.page-template-page-iretura-new-look
.inl-media-hub-primary img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}


body.page-template-page-iretura-new-look
.inl-media-hub-overlay {
    position: absolute;
    z-index: 1;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(5,5,5,.94) 0%,
            rgba(5,5,5,.82) 30%,
            rgba(5,5,5,.42) 62%,
            rgba(5,5,5,.20) 100%
        ),
        linear-gradient(
            0deg,
            rgba(5,5,5,.64) 0%,
            transparent 45%
        );
}


body.page-template-page-iretura-new-look
.inl-media-hub-content {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(330px, .55fr);

    gap: 90px;
    align-items: end;

    min-height: 850px;
    padding-top: 130px;
    padding-bottom: 100px;
}


body.page-template-page-iretura-new-look
.inl-media-hub-copy {
    max-width: 790px;
}


body.page-template-page-iretura-new-look
.inl-media-hub-copy h2 {
    margin: 0 0 30px;

    max-width: 800px;

    color: #fff;

    font-size: clamp(58px, 7.3vw, 112px);
    font-weight: 300;
    line-height: .88;
    letter-spacing: -.055em;
}


body.page-template-page-iretura-new-look
.inl-media-hub-copy h2 strong {
    display: block;
    font-weight: 700;
}


body.page-template-page-iretura-new-look
.inl-media-hub-lead {
    max-width: 590px;

    margin: 0 0 35px;

    color: rgba(255,255,255,.72);

    font-size: 17px;
    line-height: 1.7;
}


body.page-template-page-iretura-new-look
.inl-media-hub-services {
    display: flex;
    flex-wrap: wrap;

    gap: 9px;

    max-width: 650px;

    margin-bottom: 42px;
}


body.page-template-page-iretura-new-look
.inl-media-hub-services span {
    display: inline-flex;
    align-items: center;

    min-height: 34px;

    padding: 8px 13px;

    border: 1px solid rgba(255,255,255,.20);
    border-radius: 100px;

    background: rgba(0,0,0,.18);
    backdrop-filter: blur(7px);

    color: rgba(255,255,255,.80);

    font-size: 10px;
    font-weight: 600;

    letter-spacing: .10em;
    text-transform: uppercase;
}


body.page-template-page-iretura-new-look
.inl-media-hub-cta {
    display: inline-flex;
    align-items: center;

    gap: 15px;

    padding-bottom: 8px;

    border-bottom: 1px solid rgba(255,255,255,.42);

    color: #fff;

    font-size: 12px;
    font-weight: 600;

    letter-spacing: .12em;
    text-decoration: none;
    text-transform: uppercase;
}


body.page-template-page-iretura-new-look
.inl-media-hub-cta:hover {
    color: #fff;
    text-decoration: none;
}


body.page-template-page-iretura-new-look
.inl-media-hub-cta i {
    font-style: normal;

    transition: transform .25s ease;
}


body.page-template-page-iretura-new-look
.inl-media-hub-cta:hover i {
    transform: translateX(6px);
}


/* Secondary podcast image */

body.page-template-page-iretura-new-look
.inl-media-hub-secondary {
    align-self: end;

    border: 1px solid rgba(255,255,255,.18);

    background: rgba(8,8,8,.64);

    backdrop-filter: blur(12px);

    box-shadow: 0 30px 70px rgba(0,0,0,.30);
}


body.page-template-page-iretura-new-look
.inl-media-hub-secondary-image {
    aspect-ratio: 4 / 3;

    overflow: hidden;
}


body.page-template-page-iretura-new-look
.inl-media-hub-secondary-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .6s ease;
}


body.page-template-page-iretura-new-look
.inl-media-hub-secondary:hover
.inl-media-hub-secondary-image img {
    transform: scale(1.035);
}


body.page-template-page-iretura-new-look
.inl-media-hub-caption {
    display: flex;
    justify-content: space-between;
    align-items: center;

    gap: 25px;

    padding: 20px 22px;
}


body.page-template-page-iretura-new-look
.inl-media-hub-caption span {
    color: rgba(255,255,255,.42);

    font-size: 9px;
    font-weight: 600;

    letter-spacing: .13em;
    text-transform: uppercase;
}


body.page-template-page-iretura-new-look
.inl-media-hub-caption strong {
    color: #fff;

    font-size: 12px;
    font-weight: 600;

    text-align: right;
}


/* restrained CMYK edge */

body.page-template-page-iretura-new-look
.inl-media-hub::before {
    content: "";

    position: absolute;
    z-index: 5;

    top: 0;
    left: 0;
    right: 0;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            #00a8e8 0 33.333%,
            #ec008c 33.333% 66.666%,
            #ffd500 66.666% 100%
        );
}


/* TABLET */

@media (max-width: 991px) {

    body.page-template-page-iretura-new-look
    .inl-media-hub-stage {
        min-height: 760px;
    }

    body.page-template-page-iretura-new-look
    .inl-media-hub-content {
        grid-template-columns: 1fr;

        gap: 55px;

        min-height: 760px;

        padding-top: 110px;
        padding-bottom: 70px;
    }

    body.page-template-page-iretura-new-look
    .inl-media-hub-secondary {
        width: min(480px, 72%);
        margin-left: auto;
    }

}


/* MOBILE */

@media (max-width: 767px) {

    body.page-template-page-iretura-new-look
    .inl-media-hub-stage,
    body.page-template-page-iretura-new-look
    .inl-media-hub-content {
        min-height: auto;
    }

    body.page-template-page-iretura-new-look
    .inl-media-hub-primary img {
        object-position: 58% center;
    }

    body.page-template-page-iretura-new-look
    .inl-media-hub-overlay {
        background:
            linear-gradient(
                180deg,
                rgba(5,5,5,.82) 0%,
                rgba(5,5,5,.67) 45%,
                rgba(5,5,5,.94) 100%
            );
    }

    body.page-template-page-iretura-new-look
    .inl-media-hub-content {
        display: block;

        padding-top: 95px;
        padding-bottom: 55px;
    }

    body.page-template-page-iretura-new-look
    .inl-media-hub-copy h2 {
        font-size: clamp(52px, 16vw, 74px);
    }

    body.page-template-page-iretura-new-look
    .inl-media-hub-lead {
        font-size: 15px;
    }

    body.page-template-page-iretura-new-look
    .inl-media-hub-secondary {
        width: 100%;

        margin: 65px 0 0;
    }

    body.page-template-page-iretura-new-look
    .inl-media-hub-caption {
        padding: 17px 18px;
    }

}


/* =========================================================
   IRETURA_PORTO_GLOBAL_HEADER_CSS_V2
   ========================================================= */


/*
 * Hide Porto visually only when PHP confirms that the
 * replacement header is active.
 */

body.iretura-global-header-active
.header-wrapper > #header,

body.iretura-global-header-active
.header-wrapper > header#header,

body.iretura-global-header-active
#header {
    display: none !important;
}


/*
 * Existing New Look header CSS is scoped to the custom
 * homepage body in several places. These bridge rules make
 * the same component usable on ordinary corporate pages.
 */

body.iretura-global-header-active
.inl-header {
    position: fixed;
    z-index: 9998;

    top: 0;
    left: 0;
    right: 0;

    width: 100%;

    background: rgba(8,8,8,.97);

    box-shadow:
        0 10px 35px rgba(0,0,0,.13);

    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}


body.admin-bar.iretura-global-header-active
.inl-header {
    top: 32px;
}


/*
 * Homepage keeps its transparent hero treatment.
 */

body.page-template-page-iretura-new-look
.inl-header {
    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.72) 0%,
            rgba(0,0,0,.28) 62%,
            transparent 100%
        );

    box-shadow: none;
}


body.page-template-page-iretura-new-look
.inl-header.is-scrolled {
    background: rgba(8,8,8,.96);

    box-shadow:
        0 12px 38px rgba(0,0,0,.18);
}


/*
 * Ordinary pages need clearance beneath the fixed header.
 * Homepage deliberately remains full bleed.
 */

body.iretura-global-header-active:not(
    .page-template-page-iretura-new-look
) .page-wrapper {
    padding-top: 92px;
}


/*
 * Preserve header component layout outside homepage.
 */

body.iretura-global-header-active
.inl-header-inner {
    width: min(100% - 48px, 1440px);
    min-height: 92px;

    margin-inline: auto;

    display: flex;
    align-items: center;

    gap: 34px;
}


body.iretura-global-header-active
.inl-brand {
    flex: 0 0 auto;
}


body.iretura-global-header-active
.inl-brand-logo {
    display: block;

    width: 200px;
    height: auto;
}


body.iretura-global-header-active
.inl-navigation {
    display: flex;
    align-items: center;

    gap: 28px;

    margin-left: auto;
}


body.iretura-global-header-active
.inl-navigation > a,
body.iretura-global-header-active
.inl-nav-dropdown-toggle {
    color: #fff;

    font-size: 12px;
    font-weight: 600;

    letter-spacing: .055em;

    text-decoration: none;
}


body.iretura-global-header-active
.inl-header-cta {
    flex: 0 0 auto;

    display: inline-flex;
    align-items: center;

    gap: 13px;

    color: #080808;

    background: #fff;

    padding: 14px 18px;

    text-decoration: none;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .07em;
    text-transform: uppercase;
}


body.iretura-global-header-active
.inl-header-cta:hover {
    color: #080808;
    text-decoration: none;
}


@media (max-width: 1100px) {

    body.iretura-global-header-active
    .inl-header-inner {
        min-height: 78px;

        width: min(100% - 34px, 1440px);
    }

    body.iretura-global-header-active:not(
        .page-template-page-iretura-new-look
    ) .page-wrapper {
        padding-top: 78px;
    }

}


@media (max-width: 782px) {

    body.admin-bar.iretura-global-header-active
    .inl-header {
        top: 46px;
    }

}


/* =========================================================
   IRETURA_BUILT_BY_HORIZONTAL_V1
   Compact horizontal technology portfolio
   ========================================================= */

body.page-template-page-iretura-new-look
#built-by-iretura.inl-products {
    padding: 110px 0;
}


/* Two products across one horizontal row */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;

    background: rgba(255,255,255,.14);
    border-top: 1px solid rgba(255,255,255,.14);
    border-bottom: 1px solid rgba(255,255,255,.14);
}


/* Each product becomes a compact horizontal panel */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-card {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(180px, .55fr);

    min-height: 390px;

    background: #101010;
}


/* Product copy */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-copy {
    min-width: 0;
    padding: 42px 38px 38px;

    display: flex;
    flex-direction: column;
}


/* Number no longer forces huge vertical spacing */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-number {
    margin: 0 0 55px;
}


/* Compact category */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-type {
    margin-bottom: 12px;

    font-size: 9px;
    line-height: 1.45;
}


/* Product name */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-card h3 {
    margin: 0 0 16px;

    font-size: clamp(38px, 3.3vw, 58px);
    line-height: .96;
}


/* Description */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-description {
    max-width: 360px;
    margin: 0 0 26px;

    font-size: 13px;
    line-height: 1.65;
}


/* CTA naturally stays toward bottom */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-link {
    margin-top: auto;
}


/* Welvid screenshot */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-visual {
    position: relative;
    min-width: 0;
    min-height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 28px 0 28px 12px;

    overflow: hidden;
}


body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-visual img {
    width: 115%;
    max-width: none;
    height: auto;

    object-fit: contain;

    transform: translateX(4%);
}


/* RYLANext identity occupies right side */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-monogram {
    position: relative;

    width: auto;
    height: auto;
    min-height: 100%;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    padding: 30px 20px;

    overflow: hidden;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-card {
        grid-template-columns: 1fr;
        grid-template-rows: auto 210px;

        min-height: 0;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-number {
        margin-bottom: 40px;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-visual,
    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-monogram {
        min-height: 210px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    body.page-template-page-iretura-new-look
    #built-by-iretura.inl-products {
        padding: 80px 0;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-grid {
        grid-template-columns: 1fr;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-card {
        grid-template-columns: minmax(0, 1fr) 120px;
        grid-template-rows: auto;

        min-height: 310px;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-copy {
        padding: 30px 24px;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-number {
        margin-bottom: 32px;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-card h3 {
        font-size: 36px;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-description {
        font-size: 12px;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-visual {
        padding: 18px 0;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-visual,
    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-monogram {
        min-height: 100%;
    }

}


/* Very narrow phones */
@media (max-width: 480px) {

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-card {
        grid-template-columns: 1fr;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-visual,
    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-monogram {
        min-height: 170px;
    }

}



/* =========================================================
   IRETURA_BUILT_BY_PRODUCT_LOGOS_V1
   Official Welvid + RYLANext identities
   ========================================================= */

body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-logo-visual {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    min-width: 0;
    min-height: 100%;

    padding: 34px;

    overflow: hidden;
}


/* Logo images remain square and undistorted */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-logo-visual img {
    display: block;

    width: min(100%, 220px);
    height: auto;
    aspect-ratio: 1 / 1;

    object-fit: contain;

    transform: none;

    transition:
        transform .45s ease,
        opacity .45s ease;
}


/* Subtle interaction */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-card:hover
.inl-product-logo-visual img {
    transform: scale(1.035);
}


/* Welvid gets its purple identity from the artwork */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-card-welvid
.inl-product-logo-visual {
    background: #101010;
}


/* RYLANext gets its pink identity from the artwork */
body.page-template-page-iretura-new-look
#built-by-iretura .inl-product-card-rylanext
.inl-product-logo-visual {
    background: #101010;
}


@media (max-width: 1100px) {

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-logo-visual {
        min-height: 210px;
        padding: 26px;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-logo-visual img {
        width: min(100%, 170px);
    }

}


@media (max-width: 767px) {

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-logo-visual {
        padding: 18px;
    }

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-logo-visual img {
        width: min(100%, 130px);
    }

}


@media (max-width: 480px) {

    body.page-template-page-iretura-new-look
    #built-by-iretura .inl-product-logo-visual {
        min-height: 170px;
    }

}



/* =========================================================
   IRETURA_SELECTED_CLIENTELE_V1
   Selected clientele / trust wall
   ========================================================= */

body.page-template-page-iretura-new-look
#selected-clientele.inl-clientele {
    position: relative;
    overflow: hidden;

    padding: 120px 0 110px;

    background:
        linear-gradient(
            180deg,
            #f7f7f5 0%,
            #ffffff 100%
        );

    color: #090909;
}


/* CMYK editorial rule */
body.page-template-page-iretura-new-look
#selected-clientele.inl-clientele::before {
    content: "";

    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #00a8e8 0 25%,
            #ec008c 25% 50%,
            #ffd500 50% 75%,
            #080808 75% 100%
        );
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-clientele-head {
    display: grid;

    grid-template-columns:
        minmax(150px, .55fr)
        minmax(320px, 1.15fr)
        minmax(260px, .8fr);

    gap: 42px;

    align-items: start;

    padding-bottom: 58px;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-clientele-kicker {
    padding-top: 10px;

    font-size: 10px;
    font-weight: 800;

    line-height: 1.2;

    letter-spacing: .18em;
    text-transform: uppercase;

    color: #777;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-clientele-kicker::before {
    content: "";

    display: inline-block;

    width: 24px;
    height: 2px;

    margin-right: 10px;

    vertical-align: middle;

    background: #ec008c;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-clientele-head h2 {
    margin: 0;

    max-width: 620px;

    font-size: clamp(42px, 5vw, 76px);
    font-weight: 700;

    line-height: .94;

    letter-spacing: -.055em;

    color: #090909;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-clientele-head h2 span {
    display: block;

    color: #777;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-clientele-head p {
    margin: 5px 0 0;

    max-width: 420px;

    font-size: 14px;
    font-weight: 400;

    line-height: 1.75;

    color: #666;
}


/* ---------------------------------------------------------
   CLIENT WALL
   --------------------------------------------------------- */

body.page-template-page-iretura-new-look
#selected-clientele .inl-clientele-grid {
    display: grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    border-top: 1px solid #dededb;
    border-left: 1px solid #dededb;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-client {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    min-width: 0;
    min-height: 168px;

    padding: 26px 24px;

    overflow: hidden;

    background: rgba(255,255,255,.72);

    border-right: 1px solid #dededb;
    border-bottom: 1px solid #dededb;

    transition:
        background .3s ease,
        transform .3s ease;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-client::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 0;
    height: 3px;

    background: #00a8e8;

    transition: width .35s ease;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-client:nth-child(4n+2)::after {
    background: #ec008c;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-client:nth-child(4n+3)::after {
    background: #ffd500;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-client:nth-child(4n+4)::after {
    background: #080808;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-client:hover {
    z-index: 2;

    background: #fff;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-client:hover::after {
    width: 100%;
}


/* ---------------------------------------------------------
   TYPOGRAPHIC IDENTITIES
   --------------------------------------------------------- */

body.page-template-page-iretura-new-look
#selected-clientele .inl-client-text span {
    display: block;

    max-width: 180px;

    margin: 0 auto;

    text-align: center;

    font-size: clamp(16px, 1.45vw, 22px);
    font-weight: 750;

    line-height: 1.05;

    letter-spacing: -.035em;

    color: #111;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-client-text strong {
    display: block;

    margin-top: 3px;

    font-weight: 800;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-client-text em {
    font-style: normal;

    color: #ec008c;
}


/* ---------------------------------------------------------
   REAL LOGOS
   --------------------------------------------------------- */

body.page-template-page-iretura-new-look
#selected-clientele .inl-client-logo img {
    display: block;

    width: auto;
    max-width: 175px;

    height: auto;
    max-height: 88px;

    object-fit: contain;

    filter: grayscale(1);
    opacity: .74;

    transition:
        filter .35s ease,
        opacity .35s ease,
        transform .35s ease;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-client-logo:hover img {
    filter: grayscale(0);
    opacity: 1;

    transform: scale(1.025);
}


/* ---------------------------------------------------------
   FOOT
   --------------------------------------------------------- */

body.page-template-page-iretura-new-look
#selected-clientele .inl-clientele-foot {
    display: flex;
    flex-wrap: wrap;

    gap: 12px 30px;

    padding-top: 30px;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-clientele-foot span {
    position: relative;

    font-size: 9px;
    font-weight: 800;

    letter-spacing: .17em;
    text-transform: uppercase;

    color: #929292;
}


body.page-template-page-iretura-new-look
#selected-clientele .inl-clientele-foot span:not(:last-child)::after {
    content: "•";

    position: absolute;
    right: -18px;

    color: #ccc;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1100px) {

    body.page-template-page-iretura-new-look
    #selected-clientele.inl-clientele {
        padding: 95px 0 90px;
    }

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-clientele-head {
        grid-template-columns: 1fr 2fr;

        gap: 24px 36px;
    }

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-clientele-head p {
        grid-column: 2;
    }

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-clientele-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

}


@media (max-width: 767px) {

    body.page-template-page-iretura-new-look
    #selected-clientele.inl-clientele {
        padding: 76px 0 70px;
    }

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-clientele-head {
        display: block;

        padding-bottom: 38px;
    }

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-clientele-kicker {
        margin-bottom: 24px;
    }

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-clientele-head h2 {
        margin-bottom: 24px;
    }

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-clientele-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-client {
        min-height: 132px;

        padding: 20px 16px;
    }

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-client-logo img {
        max-width: 130px;
        max-height: 68px;
    }

}


@media (max-width: 420px) {

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-client {
        min-height: 116px;
    }

    body.page-template-page-iretura-new-look
    #selected-clientele .inl-client-text span {
        font-size: 15px;
    }

}



/* =========================================================
   IRETURA_MEDIA_HUB_COMMERCIAL_V1
   ========================================================= */

body.page-template-page-iretura-media-hub {
    background: #080808;
}

body.page-template-page-iretura-media-hub
#main,
body.page-template-page-iretura-media-hub
.main-content {
    padding: 0 !important;
    margin: 0 !important;
}

.inl-hub-page {
    background: #fff;
    color: #090909;
}

.inl-hub-kicker {
    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.inl-hub-kicker::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 2px;
    margin-right: 10px;
    vertical-align: middle;
    background: #ec008c;
}


/* HERO */

.inl-hub-hero {
    position: relative;
    display: flex;
    align-items: flex-end;
    min-height: 92vh;
    overflow: hidden;
    background: #090909;
    color: #fff;
}

.inl-hub-hero-image {
    position: absolute;
    inset: 0;
    background:
        url('/wp-content/uploads/2026/10/photo-studio.jpeg')
        center 45% / cover no-repeat;
}

.inl-hub-hero-shade {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.88) 0%,
            rgba(0,0,0,.58) 48%,
            rgba(0,0,0,.20) 100%
        ),
        linear-gradient(
            0deg,
            rgba(0,0,0,.72) 0%,
            transparent 50%
        );
}

.inl-hub-hero-inner {
    position: relative;
    z-index: 2;
    width: 100%;
    padding-top: 190px;
    padding-bottom: 145px;
}

.inl-hub-eyebrow {
    margin-bottom: 28px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: rgba(255,255,255,.72);
}

.inl-hub-hero h1 {
    margin: 0;
    max-width: 930px;
    font-size: clamp(58px, 8.2vw, 126px);
    font-weight: 700;
    line-height: .86;
    letter-spacing: -.065em;
    color: #fff;
}

.inl-hub-hero h1 span {
    color: rgba(255,255,255,.56);
}

.inl-hub-hero-inner > p {
    max-width: 590px;
    margin: 38px 0 0;
    font-size: 17px;
    line-height: 1.65;
    color: rgba(255,255,255,.78);
}

.inl-hub-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 36px;
}

.inl-hub-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    min-height: 56px;
    padding: 0 26px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-decoration: none !important;
    transition: .25s ease;
}

.inl-hub-button-primary {
    background: #fff;
    color: #080808 !important;
}

.inl-hub-button-primary:hover {
    background: #ffd500;
}

.inl-hub-button-secondary {
    border: 1px solid rgba(255,255,255,.35);
    color: #fff !important;
}

.inl-hub-button-secondary:hover {
    background: #fff;
    color: #080808 !important;
}

.inl-hub-hero-bottom {
    position: absolute;
    z-index: 2;
    left: 0;
    bottom: 0;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    width: 100%;
    border-top: 1px solid rgba(255,255,255,.18);
}

.inl-hub-hero-bottom span {
    padding: 18px 24px;
    border-right: 1px solid rgba(255,255,255,.18);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .14em;
    text-align: center;
    text-transform: uppercase;
    color: rgba(255,255,255,.65);
}


/* INTRO */

.inl-hub-intro {
    padding: 120px 0;
    background: #f6f6f3;
}

.inl-hub-intro-grid {
    display: grid;
    grid-template-columns: .55fr 1.2fr .8fr;
    gap: 45px;
    align-items: start;
}

.inl-hub-intro h2,
.inl-hub-colab h2,
.inl-hub-rates-head h2,
.inl-hub-policy h2,
.inl-hub-production h2 {
    margin: 0;
    font-size: clamp(44px, 5.5vw, 80px);
    font-weight: 700;
    line-height: .92;
    letter-spacing: -.055em;
}

.inl-hub-intro h2 span,
.inl-hub-colab h2 span,
.inl-hub-rates-head h2 span,
.inl-hub-policy h2 span,
.inl-hub-production h2 span {
    color: #888;
}

.inl-hub-intro p {
    margin: 5px 0 0;
    font-size: 15px;
    line-height: 1.75;
    color: #666;
}


/* COLAB */

.inl-hub-colab {
    padding: 120px 0;
    background: #fff;
}

.inl-hub-colab-grid {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    min-height: 690px;
    background: #0a0a0a;
}

.inl-hub-colab-content {
    padding: clamp(50px, 6vw, 92px);
    color: #fff;
}

.inl-hub-colab-content .inl-hub-kicker {
    margin-bottom: 32px;
    color: rgba(255,255,255,.6);
}

.inl-hub-colab-content h2 {
    color: #fff;
}

.inl-hub-colab-content > p {
    max-width: 490px;
    margin: 30px 0 0;
    font-size: 15px;
    line-height: 1.75;
    color: rgba(255,255,255,.68);
}

.inl-hub-price-feature {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-top: 44px;
}

.inl-hub-price-feature strong {
    font-size: clamp(52px, 6vw, 86px);
    line-height: 1;
    letter-spacing: -.06em;
    color: #fff;
}

.inl-hub-price-feature span {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    color: rgba(255,255,255,.55);
}

.inl-hub-colab-options {
    display: flex;
    gap: 45px;
    margin-top: 34px;
    padding-top: 25px;
    border-top: 1px solid rgba(255,255,255,.18);
}

.inl-hub-colab-options div {
    display: grid;
    gap: 4px;
}

.inl-hub-colab-options span {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(255,255,255,.45);
}

.inl-hub-colab-options strong {
    font-size: 20px;
    color: #fff;
}

.inl-hub-colab-content
p.inl-hub-note {
    margin-top: 28px;
    font-size: 11px;
    color: rgba(255,255,255,.45);
}

.inl-hub-colab-photo {
    min-height: 620px;
    background:
        url('/wp-content/uploads/2026/10/photo-studio.jpeg')
        center / cover no-repeat;
}

.inl-hub-text-link {
    display: inline-flex;
    gap: 28px;
    margin-top: 30px;
    padding-bottom: 8px;
    border-bottom: 1px solid currentColor;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    text-decoration: none !important;
    color: #fff !important;
}


/* RATES */

.inl-hub-rates {
    padding: 120px 0;
    background: #f5f5f2;
}

.inl-hub-rates-head {
    display: grid;
    grid-template-columns: .55fr 1.2fr .8fr;
    gap: 45px;
    padding-bottom: 60px;
}

.inl-hub-rates-head p {
    margin: 5px 0 0;
    max-width: 390px;
    font-size: 14px;
    line-height: 1.7;
    color: #666;
}

.inl-hub-rate-grid {
    border-top: 1px solid #d8d8d4;
}

.inl-hub-rate-card {
    display: grid;
    grid-template-columns: 80px 1fr auto;
    gap: 35px;
    align-items: center;
    min-height: 180px;
    padding: 34px 10px;
    border-bottom: 1px solid #d8d8d4;
}

.inl-hub-rate-number,
.inl-hub-rate-type {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #999;
}

.inl-hub-rate-card h3 {
    margin: 7px 0;
    font-size: clamp(27px, 3vw, 43px);
    line-height: 1;
    letter-spacing: -.04em;
}

.inl-hub-rate-card p {
    max-width: 520px;
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    color: #777;
}

.inl-hub-rate-price {
    min-width: 210px;
    text-align: right;
}

.inl-hub-rate-price strong {
    display: block;
    font-size: clamp(28px, 3vw, 43px);
    line-height: 1;
    letter-spacing: -.04em;
}

.inl-hub-rate-price span {
    display: block;
    margin-top: 6px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #999;
}


/* PRODUCTION */

.inl-hub-production {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    min-height: 720px;
    background: #090909;
}

.inl-hub-production-image {
    min-height: 620px;
    background:
        url('/wp-content/uploads/2026/10/podcast-studio.jpeg')
        center / cover no-repeat;
}

.inl-hub-production-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(55px, 7vw, 110px);
    color: #fff;
}

.inl-hub-production-copy .inl-hub-kicker {
    margin-bottom: 30px;
    color: rgba(255,255,255,.55);
}

.inl-hub-production h2 {
    color: #fff;
}

.inl-hub-production p {
    max-width: 470px;
    margin: 30px 0 0;
    font-size: 15px;
    line-height: 1.75;
    color: rgba(255,255,255,.65);
}

.inl-hub-text-link-light {
    align-self: flex-start;
}


/* POLICY */

.inl-hub-policy {
    padding: 120px 0;
    background: #fff;
}

.inl-hub-policy-grid {
    display: grid;
    grid-template-columns: .8fr 1.2fr;
    gap: 90px;
}

.inl-hub-policy .inl-hub-kicker {
    margin-bottom: 28px;
}

.inl-hub-policy-list {
    border-top: 1px solid #ddd;
}

.inl-hub-policy-list > div {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 20px;
    padding: 22px 0;
    border-bottom: 1px solid #ddd;
}

.inl-hub-policy-list span {
    font-size: 9px;
    font-weight: 800;
    color: #aaa;
}

.inl-hub-policy-list p {
    margin: 0;
    max-width: 630px;
    font-size: 14px;
    line-height: 1.65;
    color: #555;
}


/* FINAL CTA */

.inl-hub-final {
    position: relative;
    padding: 110px 0;
    overflow: hidden;
    background: #0a0a0a;
    color: #fff;
}

.inl-hub-final::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background:
        linear-gradient(
            90deg,
            #00a8e8 0 25%,
            #ec008c 25% 50%,
            #ffd500 50% 75%,
            #080808 75% 100%
        );
}

.inl-hub-final-inner {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 70px;
    align-items: end;
}

.inl-hub-final .inl-hub-kicker {
    margin-bottom: 28px;
    color: rgba(255,255,255,.5);
}

.inl-hub-final h2 {
    margin: 0;
    font-size: clamp(52px, 7vw, 100px);
    line-height: .88;
    letter-spacing: -.06em;
    color: #fff;
}

.inl-hub-final p {
    max-width: 430px;
    margin: 0 0 30px;
    font-size: 15px;
    line-height: 1.7;
    color: rgba(255,255,255,.65);
}


/* RESPONSIVE */

@media (max-width: 991px) {

    .inl-hub-intro-grid,
    .inl-hub-rates-head {
        grid-template-columns: 1fr 2fr;
    }

    .inl-hub-intro-grid > :last-child,
    .inl-hub-rates-head > :last-child {
        grid-column: 2;
    }

    .inl-hub-colab-grid,
    .inl-hub-production {
        grid-template-columns: 1fr;
    }

    .inl-hub-colab-photo,
    .inl-hub-production-image {
        min-height: 520px;
    }

    .inl-hub-policy-grid {
        grid-template-columns: 1fr;
        gap: 55px;
    }

}


@media (max-width: 767px) {

    .inl-hub-hero {
        min-height: 760px;
    }

    .inl-hub-hero-inner {
        padding-top: 170px;
        padding-bottom: 145px;
    }

    .inl-hub-hero h1 {
        font-size: clamp(52px, 16vw, 78px);
    }

    .inl-hub-hero-bottom {
        grid-template-columns: repeat(3, 1fr);
    }

    .inl-hub-hero-bottom span:nth-child(4),
    .inl-hub-hero-bottom span:nth-child(5) {
        display: none;
    }

    .inl-hub-intro,
    .inl-hub-colab,
    .inl-hub-rates,
    .inl-hub-policy,
    .inl-hub-final {
        padding-top: 78px;
        padding-bottom: 78px;
    }

    .inl-hub-intro-grid,
    .inl-hub-rates-head {
        display: block;
    }

    .inl-hub-intro-grid > *,
    .inl-hub-rates-head > * {
        margin-bottom: 26px;
    }

    .inl-hub-colab-grid {
        min-height: 0;
    }

    .inl-hub-colab-content {
        padding: 48px 28px;
    }

    .inl-hub-colab-photo,
    .inl-hub-production-image {
        min-height: 420px;
    }

    .inl-hub-colab-options {
        gap: 28px;
    }

    .inl-hub-rate-card {
        grid-template-columns: 42px 1fr;
        gap: 20px;
        padding: 30px 0;
    }

    .inl-hub-rate-price {
        grid-column: 2;
        min-width: 0;
        text-align: left;
    }

    .inl-hub-production-copy {
        padding: 65px 28px;
    }

    .inl-hub-final-inner {
        grid-template-columns: 1fr;
        gap: 45px;
    }

}



/* =========================================================
   IRETURA_COLAB_REAL_BACKGROUND_V1
   ========================================================= */

body.page-template-page-iretura-media-hub
.inl-hub-colab-photo {
    background-image:
        linear-gradient(
            180deg,
            rgba(0,0,0,.02) 0%,
            rgba(0,0,0,.16) 100%
        ),
        url('/wp-content/uploads/2026/10/iretura-colab-scaled.jpg') !important;

    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}


@media (max-width: 767px) {

    body.page-template-page-iretura-media-hub
    .inl-hub-colab-photo {
        background-position: center center !important;
    }

}



/* =========================================================
   IRETURA_MEDIA_HUB_TRUE_FULLWIDTH_V1
   Remove Porto page constraints while preserving
   Iretura's own internal content containers.
   ========================================================= */

body.page-template-page-iretura-media-hub {
    overflow-x: hidden;
}

body.page-template-page-iretura-media-hub #main,
body.page-template-page-iretura-media-hub .main-content,
body.page-template-page-iretura-media-hub .main-content-wrap,
body.page-template-page-iretura-media-hub .content-body,
body.page-template-page-iretura-media-hub #content,
body.page-template-page-iretura-media-hub .page-content,
body.page-template-page-iretura-media-hub .container-fluid,
body.page-template-page-iretura-media-hub
#main > .container,
body.page-template-page-iretura-media-hub
.main-content > .container {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* The custom page itself must occupy the viewport */

body.page-template-page-iretura-media-hub
.inl-hub-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* Every major Media Hub section reaches edge-to-edge */

body.page-template-page-iretura-media-hub
.inl-hub-hero,
body.page-template-page-iretura-media-hub
.inl-hub-intro,
body.page-template-page-iretura-media-hub
.inl-hub-colab,
body.page-template-page-iretura-media-hub
.inl-hub-rates,
body.page-template-page-iretura-media-hub
.inl-hub-production,
body.page-template-page-iretura-media-hub
.inl-hub-policy,
body.page-template-page-iretura-media-hub
.inl-hub-final {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}


/*
 * Keep text/content aligned to Iretura's editorial grid.
 * This affects only our own containers, not the
 * full-width section backgrounds.
 */

body.page-template-page-iretura-media-hub
.inl-hub-page > section > .inl-container {
    width: min(100% - 64px, 1440px);
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}


/*
 * Production section is intentionally different:
 * image and dark content panel remain full bleed.
 */

body.page-template-page-iretura-media-hub
.inl-hub-production {
    width: 100vw !important;
    max-width: 100vw !important;
}


/* MOBILE */

@media (max-width: 767px) {

    body.page-template-page-iretura-media-hub
    .inl-hub-page > section > .inl-container {
        width: calc(100% - 36px);
        max-width: none;
    }

}



/* =========================================================
   IRETURA_MEDIA_HUB_TRUE_FULLWIDTH_V1
   Remove Porto page constraints while preserving
   Iretura's own internal content containers.
   ========================================================= */

body.page-template-page-iretura-media-hub {
    overflow-x: hidden;
}

body.page-template-page-iretura-media-hub #main,
body.page-template-page-iretura-media-hub .main-content,
body.page-template-page-iretura-media-hub .main-content-wrap,
body.page-template-page-iretura-media-hub .content-body,
body.page-template-page-iretura-media-hub #content,
body.page-template-page-iretura-media-hub .page-content,
body.page-template-page-iretura-media-hub .container-fluid,
body.page-template-page-iretura-media-hub
#main > .container,
body.page-template-page-iretura-media-hub
.main-content > .container {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* The custom page itself must occupy the viewport */

body.page-template-page-iretura-media-hub
.inl-hub-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* Every major Media Hub section reaches edge-to-edge */

body.page-template-page-iretura-media-hub
.inl-hub-hero,
body.page-template-page-iretura-media-hub
.inl-hub-intro,
body.page-template-page-iretura-media-hub
.inl-hub-colab,
body.page-template-page-iretura-media-hub
.inl-hub-rates,
body.page-template-page-iretura-media-hub
.inl-hub-production,
body.page-template-page-iretura-media-hub
.inl-hub-policy,
body.page-template-page-iretura-media-hub
.inl-hub-final {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}


/*
 * Keep text/content aligned to Iretura's editorial grid.
 * This affects only our own containers, not the
 * full-width section backgrounds.
 */

body.page-template-page-iretura-media-hub
.inl-hub-page > section > .inl-container {
    width: min(100% - 64px, 1440px);
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}


/*
 * Production section is intentionally different:
 * image and dark content panel remain full bleed.
 */

body.page-template-page-iretura-media-hub
.inl-hub-production {
    width: 100vw !important;
    max-width: 100vw !important;
}


/* MOBILE */

@media (max-width: 767px) {

    body.page-template-page-iretura-media-hub
    .inl-hub-page > section > .inl-container {
        width: calc(100% - 36px);
        max-width: none;
    }

}



/* =========================================================
   IRETURA_MEDIA_HUB_REMOVE_PORTO_TITLEBAR_V1
   Custom Media Hub hero replaces Porto title/breadcrumb bar.
   ========================================================= */

body.page-template-page-iretura-media-hub
.page-top {
    display: none !important;
}

body.page-template-page-iretura-media-hub
.page-title {
    display: none !important;
}

body.page-template-page-iretura-media-hub
.page-title-wrap {
    display: none !important;
}

body.page-template-page-iretura-media-hub
.breadcrumbs-wrap {
    display: none !important;
}

body.page-template-page-iretura-media-hub
.breadcrumb {
    display: none !important;
}


/* Remove any space left by Porto above our custom hero */

body.page-template-page-iretura-media-hub
#main,
body.page-template-page-iretura-media-hub
.main-content,
body.page-template-page-iretura-media-hub
.inl-hub-page {
    margin-top: 0 !important;
    padding-top: 0 !important;
}



/* ==========================================================
   IRETURA_COLAB_OFFERINGS_V3
   ========================================================== */

body.page-template-page-iretura-media-hub
.inl-hub-colab-lead {
    max-width: 720px;
    margin-bottom: 22px;
}

body.page-template-page-iretura-media-hub
.inl-colab-capacity {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    align-items: center;
    padding: 15px 18px;
    margin: 0 0 22px;
    border-left: 3px solid #00a8e8;
    background: rgba(255,255,255,.06);
}

body.page-template-page-iretura-media-hub
.inl-colab-amenities {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 30px;
}

body.page-template-page-iretura-media-hub
.inl-colab-amenities span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    font-size: 13px;
    line-height: 1.2;
}

body.page-template-page-iretura-media-hub
.inl-colab-plans {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 8px;
}

body.page-template-page-iretura-media-hub
.inl-colab-plan {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 24px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.045);
}

body.page-template-page-iretura-media-hub
.inl-colab-plan-featured {
    border-top: 3px solid #ffd500;
}

body.page-template-page-iretura-media-hub
.inl-colab-plan-label {
    margin-bottom: 14px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

body.page-template-page-iretura-media-hub
.inl-colab-plan-price {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 15px;
}

body.page-template-page-iretura-media-hub
.inl-colab-plan-price strong {
    font-size: clamp(26px, 3vw, 38px);
    line-height: 1;
    letter-spacing: -.04em;
}

body.page-template-page-iretura-media-hub
.inl-colab-plan-price span {
    opacity: .68;
    font-size: 13px;
}

body.page-template-page-iretura-media-hub
.inl-colab-plan p {
    margin-bottom: 18px;
}

body.page-template-page-iretura-media-hub
.inl-colab-plan .inl-hub-text-link {
    margin-top: auto;
}

body.page-template-page-iretura-media-hub
.inl-colab-offer {
    padding: 10px 12px;
    margin: 0 0 18px;
    background: #ffd500;
    color: #080808;
    font-size: 13px;
    font-weight: 800;
}

body.page-template-page-iretura-media-hub
.inl-colab-benefits {
    margin: 0 0 18px;
    padding-left: 18px;
}

body.page-template-page-iretura-media-hub
.inl-colab-benefits li {
    margin: 5px 0;
}

body.page-template-page-iretura-media-hub
.inl-colab-booking-alert {
    display: grid;
    gap: 4px;
    margin-top: 20px;
    padding: 17px 19px;
    border: 1px solid rgba(255,255,255,.14);
}

body.page-template-page-iretura-media-hub
.inl-colab-booking-alert strong {
    color: #00a8e8;
}

body.page-template-page-iretura-media-hub
.inl-hub-colab-photo {
    position: relative;
    overflow: hidden;
}

body.page-template-page-iretura-media-hub
.inl-colab-photo-label {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 24px;
    display: grid;
    gap: 4px;
    padding: 16px 18px;
    background: rgba(8,8,8,.82);
    backdrop-filter: blur(8px);
}

body.page-template-page-iretura-media-hub
.inl-colab-photo-label span {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #ffd500;
}

body.page-template-page-iretura-media-hub
.inl-colab-photo-label strong {
    font-size: 16px;
}

@media (max-width: 1100px) {

    body.page-template-page-iretura-media-hub
    .inl-colab-plans {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 767px) {

    body.page-template-page-iretura-media-hub
    .inl-colab-capacity {
        display: grid;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-plan {
        padding: 20px;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-photo-label {
        left: 18px;
        right: 18px;
        bottom: 18px;
    }

}


/* ==========================================================
   IRETURA_MEDIA_HUB_MOBILE_V1
   Mobile containment + responsive CoLab cards
   ========================================================== */

@media (max-width: 767px) {

    /*
     * Prevent Media Hub children from creating horizontal
     * overflow inside inherited Porto wrappers.
     */
    body.page-template-page-iretura-media-hub,
    body.page-template-page-iretura-media-hub #main,
    body.page-template-page-iretura-media-hub .main-content,
    body.page-template-page-iretura-media-hub .inl-container,
    body.page-template-page-iretura-media-hub section {
        max-width: 100%;
    }

    body.page-template-page-iretura-media-hub {
        overflow-x: hidden;
    }

    body.page-template-page-iretura-media-hub *,
    body.page-template-page-iretura-media-hub *::before,
    body.page-template-page-iretura-media-hub *::after {
        box-sizing: border-box;
    }


    /*
     * Consistent mobile page gutter.
     */
    body.page-template-page-iretura-media-hub
    .inl-container {
        width: 100%;
        max-width: none;
        margin-left: auto;
        margin-right: auto;
        padding-left: 20px;
        padding-right: 20px;
    }


    /*
     * CoLab becomes one true mobile column.
     */
    body.page-template-page-iretura-media-hub
    .inl-hub-colab-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
        min-width: 0;
        gap: 34px;
    }

    body.page-template-page-iretura-media-hub
    .inl-hub-colab-content,
    body.page-template-page-iretura-media-hub
    .inl-colab-plans,
    body.page-template-page-iretura-media-hub
    .inl-colab-plan {
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-plans {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }


    /*
     * Cards.
     */
    body.page-template-page-iretura-media-hub
    .inl-colab-plan {
        display: flex;
        flex-direction: column;
        padding: 24px 22px;
        overflow: hidden;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-plan-label {
        max-width: 100%;
        font-size: 12px;
        line-height: 1.45;
        letter-spacing: .11em;
        overflow-wrap: anywhere;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-plan-price strong {
        display: block;
        max-width: 100%;
        font-size: clamp(32px, 10vw, 44px);
        line-height: 1;
        overflow-wrap: anywhere;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-plan-price span {
        font-size: 16px;
        line-height: 1.45;
    }


    /*
     * Weekly promotion:
     * it must remain inside its parent card.
     */
    body.page-template-page-iretura-media-hub
    .inl-colab-offer {
        display: block;
        position: static;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin: 4px 0 22px;
        padding: 16px 17px;
        transform: none;
        left: auto;
        right: auto;

        font-size: 16px;
        line-height: 1.5;
        overflow-wrap: break-word;
        word-break: normal;
    }


    /*
     * Monthly benefits.
     */
    body.page-template-page-iretura-media-hub
    .inl-colab-benefits {
        width: 100%;
        margin: 10px 0 22px;
        padding-left: 22px;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-benefits li {
        padding-left: 2px;
        margin: 8px 0;
        line-height: 1.45;
    }


    /*
     * Amenity pills wrap rather than push page width.
     */
    body.page-template-page-iretura-media-hub
    .inl-colab-amenities {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        min-width: 0;
        gap: 8px;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-amenities span {
        max-width: 100%;
        white-space: normal;
    }


    /*
     * Booking links cannot exceed card.
     */
    body.page-template-page-iretura-media-hub
    .inl-colab-plan .inl-hub-text-link {
        width: 100%;
        max-width: 100%;
    }


    /*
     * Booking notice.
     */
    body.page-template-page-iretura-media-hub
    .inl-colab-booking-alert {
        width: 100%;
        max-width: 100%;
        padding: 18px;
    }


    /*
     * CoLab image follows content rather than maintaining
     * desktop dimensions.
     */
    body.page-template-page-iretura-media-hub
    .inl-hub-colab-photo {
        width: 100%;
        min-width: 0;
        min-height: 360px;
    }


    /*
     * Protect other Media Hub grids/cards from the same
     * desktop-width problem.
     */
    body.page-template-page-iretura-media-hub
    .inl-hub-production,
    body.page-template-page-iretura-media-hub
    .inl-hub-rates,
    body.page-template-page-iretura-media-hub
    .inl-hub-policy,
    body.page-template-page-iretura-media-hub
    .inl-hub-final {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

}


/*
 * Very small phones.
 */
@media (max-width: 390px) {

    body.page-template-page-iretura-media-hub
    .inl-container {
        padding-left: 16px;
        padding-right: 16px;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-plan {
        padding: 22px 18px;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-plan-price strong {
        font-size: 34px;
    }

    body.page-template-page-iretura-media-hub
    .inl-colab-offer {
        padding: 15px;
        font-size: 15px;
    }

}


/* ==========================================================
   IRETURA_MOBILE_FOOTER_V1
   Mobile only — desktop footer unaffected
   ========================================================== */

@media (max-width: 767px) {

    /*
     * Footer containment
     */
    #footer,
    .footer,
    footer.footer,
    .footer-wrapper,
    #footer .container,
    #footer .container-fluid {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: hidden;
        box-sizing: border-box;
    }

    #footer *,
    #footer *::before,
    #footer *::after {
        box-sizing: border-box;
        max-width: 100%;
    }


    /*
     * Proper mobile gutters
     */
    #footer .container,
    #footer .container-fluid {
        padding-left: 20px !important;
        padding-right: 20px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }


    /*
     * Porto footer rows/columns:
     * force genuine single-column mobile layout.
     */
    #footer .row {
        display: flex;
        flex-wrap: wrap;
        width: auto;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    #footer .row > [class*="col-"] {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 28px;
    }


    /*
     * Footer logo
     */
    #footer img {
        height: auto;
    }

    #footer .logo img,
    #footer .footer-logo img,
    #footer img.logo {
        width: auto !important;
        max-width: 190px !important;
        height: auto !important;
    }


    /*
     * Typography / long contact information
     */
    #footer p,
    #footer address,
    #footer li,
    #footer a,
    #footer span {
        overflow-wrap: anywhere;
        word-break: normal;
    }

    #footer address {
        line-height: 1.65;
    }


    /*
     * Navigation lists
     */
    #footer ul {
        max-width: 100%;
        padding-left: 0;
    }

    #footer .menu,
    #footer .footer-menu,
    #footer .nav {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        width: 100%;
    }

    #footer .menu li,
    #footer .footer-menu li,
    #footer .nav li {
        display: block;
        width: 100%;
        margin: 0;
    }


    /*
     * Footer widgets must not retain desktop widths.
     */
    #footer .widget,
    #footer .footer-widget,
    #footer .widget_text,
    #footer .textwidget {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }


    /*
     * Social icons remain horizontal.
     */
    #footer .share-links,
    #footer .social-icons,
    #footer .social-links {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
    }


    /*
     * Bottom/copyright bar
     */
    #footer .footer-bottom,
    #footer .footer-bottom .container,
    #footer .footer-bottom .container-fluid {
        width: 100%;
        max-width: 100%;
    }

    #footer .footer-bottom .row {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    #footer .footer-bottom .row > * {
        width: 100%;
        max-width: 100%;
        margin: 0 !important;
        text-align: left;
    }

    #footer .footer-copyright,
    #footer .copyright {
        width: 100%;
        line-height: 1.6;
    }


    /*
     * No footer element may force viewport overflow.
     */
    #footer table,
    #footer iframe,
    #footer form,
    #footer input,
    #footer textarea,
    #footer select {
        width: 100%;
        max-width: 100%;
    }

}


@media (max-width: 390px) {

    #footer .container,
    #footer .container-fluid {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    #footer .logo img,
    #footer .footer-logo img,
    #footer img.logo {
        max-width: 170px !important;
    }

}


/* ==========================================================
   IRETURA_MOBILE_FOOTER_V2
   Correct left clipping / alignment / copyright
   ========================================================== */

@media (max-width: 767px) {

    /*
     * Reset Porto negative gutters that are pushing
     * footer content beyond the left edge.
     */
    #footer {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    #footer .footer-main,
    #footer .footer-top,
    #footer .footer-middle,
    #footer .footer-bottom {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    /*
     * The container owns the mobile gutter.
     */
    #footer .container,
    #footer .container-fluid {
        width: 100% !important;
        max-width: 100% !important;

        margin-left: auto !important;
        margin-right: auto !important;

        padding-left: 22px !important;
        padding-right: 22px !important;

        transform: none !important;
        left: auto !important;
        right: auto !important;
    }


    /*
     * Kill Bootstrap/Porto negative row margins.
     */
    #footer .row {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;

        width: 100% !important;
        max-width: 100% !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        padding: 0 !important;

        transform: none !important;
        left: auto !important;
        right: auto !important;
    }


    /*
     * Every footer column begins at the same left edge.
     */
    #footer .row > [class*="col-"],
    #footer .widget,
    #footer .footer-widget,
    #footer .widget_text,
    #footer .textwidget {
        position: relative !important;

        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        padding-left: 0 !important;
        padding-right: 0 !important;

        transform: none !important;
        left: auto !important;
        right: auto !important;
    }


    /*
     * Contact/footer typography.
     */
    #footer h1,
    #footer h2,
    #footer h3,
    #footer h4,
    #footer h5,
    #footer h6,
    #footer p,
    #footer address {
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
    }

    #footer p,
    #footer address,
    #footer a,
    #footer span {
        overflow-wrap: break-word !important;
        word-break: normal !important;
    }


    /*
     * Long email/address must fit naturally.
     */
    #footer a[href^="mailto:"],
    #footer a[href^="tel:"] {
        display: inline-block;
        max-width: 100% !important;
        white-space: normal !important;
    }


    /*
     * Social icons should remain compact and horizontal.
     */
    #footer .share-links,
    #footer .social-icons,
    #footer .social-links {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        width: auto !important;
        gap: 10px !important;
    }


    /*
     * CTA should not look like a desktop-width block.
     */
    #footer a.btn,
    #footer .btn,
    #footer button,
    #footer input[type="submit"] {
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }


    /*
     * Copyright area.
     */
    #footer .footer-bottom {
        padding-top: 22px !important;
        padding-bottom: 22px !important;
    }

    #footer .footer-bottom .container,
    #footer .footer-bottom .container-fluid {
        padding-left: 22px !important;
        padding-right: 22px !important;
    }

    #footer .footer-copyright,
    #footer .copyright {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        text-align: left !important;
        line-height: 1.55 !important;
    }

}


@media (max-width: 390px) {

    #footer .container,
    #footer .container-fluid,
    #footer .footer-bottom .container,
    #footer .footer-bottom .container-fluid {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

}
