:root {
    --tw-journey-gold: #f0b52d;
    --tw-journey-gold-soft: #ffd15a;
    --tw-journey-bg: #03101a;
    --tw-journey-text: #f7f8fb;
    --tw-journey-muted: rgba(231, 239, 245, .84);
}

/*
 * Stage 05 / Journey — v0.5.8
 * Geometry calibrated to the approved 724x283 reference.
 * Background artwork only is raster; all dates, icons and copy remain real
 * HTML/ACF content.
 */
.tw-about-journey {
    position: relative;
    isolation: isolate;
    width: 100%;
    aspect-ratio: 724 / 283;
    min-height: 0;
    overflow: hidden;
    background: var(--tw-journey-bg);
    border: 0;
}

.tw-about-journey__visual {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    background: #03101a;
}

/* Clean artwork derived from the approved reference: mountains + gold route,
 * without any baked text, dates or icons. */
.tw-about-journey__visual::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;
    background: url('../images/journey-background-reference-clean.png') center / 100% 100% no-repeat;
    opacity: 1;
    filter: none;
    transform: none;
}

.tw-about-journey__background,
.tw-about-journey__mountains,
.tw-about-journey__line-image,
.tw-about-journey__glow {
    display: none !important;
}

.tw-about-journey__shade {
    position: absolute;
    z-index: 2;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(1,8,14,.02) 0%, rgba(1,8,14,0) 45%, rgba(1,8,14,.015) 60%, rgba(1,8,14,.04) 100%),
        linear-gradient(90deg, rgba(1,8,14,.04), transparent 8%, transparent 92%, rgba(1,8,14,.04));
}

/* Fine gold corner sweeps from the frozen reference. */
.tw-about-journey__visual::after {
    content: "";
    position: absolute;
    z-index: 3;
    left: 0;
    right: 0;
    bottom: 0;
    height: 18%;
    pointer-events: none;
    opacity: .72;
    background:
        linear-gradient(13deg, transparent 0 4.7%, rgba(238,176,43,.43) 4.95%, rgba(238,176,43,.10) 5.22%, transparent 5.58%) left bottom / 23% 100% no-repeat,
        linear-gradient(-13deg, transparent 0 4.7%, rgba(238,176,43,.40) 4.95%, rgba(238,176,43,.08) 5.22%, transparent 5.58%) right bottom / 23% 100% no-repeat;
}

.tw-about-journey__container {
    position: absolute;
    z-index: 7;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

.tw-about-journey__header {
    position: absolute;
    z-index: 8;
    top: 1.35%;
    left: 50%;
    width: 70%;
    margin: 0;
    transform: translateX(-50%);
    text-align: center;
    direction: rtl;
}

.tw-about-journey__title {
    margin: 0 !important;
    color: var(--tw-journey-text);
    font-size: clamp(17px, 2.05vw, 39px);
    line-height: 1.08;
    font-weight: 850;
    letter-spacing: -.024em;
    white-space: nowrap;
    text-shadow: 0 2px 10px rgba(0,0,0,.74);
}
.tw-about-journey__title em {
    color: var(--tw-journey-gold);
    font-style: normal;
    font-weight: inherit;
    text-shadow: 0 0 14px rgba(240,181,45,.18);
}

.tw-about-journey__header p {
    margin: .36em 0 0;
    color: rgba(239,244,248,.91);
    font-size: clamp(9px, 1.08vw, 20px);
    line-height: 1.36;
    font-weight: 500;
    white-space: nowrap;
    text-shadow: 0 2px 8px rgba(0,0,0,.76);
}

.tw-about-journey__track {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-width: 0;
    margin: 0;
    direction: ltr;
}

.tw-about-journey__item {
    position: absolute;
    top: 0;
    width: 16.8%;
    height: 100%;
    transform: translateX(-50%);
    text-align: center;
    direction: rtl;
    color: var(--tw-journey-text);
}
.tw-about-journey__item--0 { left: 11.05%; }
.tw-about-journey__item--1 { left: 29.83%; }
.tw-about-journey__item--2 { left: 49.17%; }
.tw-about-journey__item--3 { left: 68.92%; }
.tw-about-journey__item--4 { left: 89.23%; }

/* Route artwork already contains milestones 2-5. Only milestone 1 needs its
 * vertical node completed because it sits outside the clean source crop. */
.tw-about-journey__node { display: none; }
.tw-about-journey__item--0 .tw-about-journey__node {
    display: block;
    position: absolute;
    z-index: 4;
    top: 57.35%;
    left: 50%;
    width: 8px;
    height: 8px;
    transform: translate(-50%,-50%);
    border: 1.5px solid #fff5c6;
    border-radius: 50%;
    background: #f5ba32;
    box-shadow: 0 0 4px #fff, 0 0 12px rgba(242,178,43,.90);
}
.tw-about-journey__item--0 .tw-about-journey__node::after {
    content: "";
    position: absolute;
    top: 7px;
    left: 50%;
    width: 1px;
    height: 24px;
    transform: translateX(-50%);
    background: linear-gradient(180deg, rgba(240,181,45,.65), rgba(47,112,139,.34), transparent);
}

.tw-about-journey__year {
    position: absolute;
    z-index: 5;
    top: 56.5%;
    left: 0;
    right: 0;
    color: #fff8df;
    font-size: clamp(10px, 1.04vw, 20px);
    font-weight: 850;
    line-height: 1.08;
    white-space: nowrap;
    unicode-bidi: plaintext;
    text-shadow: 0 2px 7px rgba(0,0,0,.86);
}
.tw-about-journey__item--0 .tw-about-journey__year { top: 50.25%; }
.tw-about-journey__year bdi { unicode-bidi: isolate; }

.tw-about-journey__icon {
    position: absolute;
    z-index: 5;
    top: 64.2%;
    left: 50%;
    width: clamp(22px, 2.55vw, 49px);
    height: clamp(22px, 2.55vw, 49px);
    transform: translateX(-50%);
    display: grid;
    place-items: center;
    color: var(--tw-journey-gold);
    filter: drop-shadow(0 0 7px rgba(240,181,45,.13));
}
.tw-about-journey__icon svg,
.tw-about-journey__icon-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.tw-about-journey__icon svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.72;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Reserve a fixed title band and a separate description band so long ACF copy
 * can never collide, while retaining the reference's vertical rhythm. */
.tw-about-journey__item h3 {
    position: absolute;
    z-index: 5;
    top: 74.4%;
    left: -1%;
    right: -1%;
    height: 8.8%;
    margin: 0 !important;
    padding: 0 .2em;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    color: #fff;
    font-size: clamp(10px, 1.20vw, 23px);
    line-height: 1.24;
    font-weight: 820;
    text-shadow: 0 2px 8px rgba(0,0,0,.82);
    overflow: hidden;
}

.tw-about-journey__item p {
    position: absolute;
    z-index: 5;
    top: 84.15%;
    left: 2%;
    right: 2%;
    height: 10.8%;
    margin: 0;
    color: rgba(235,242,247,.88);
    font-size: clamp(8px, .86vw, 16px);
    line-height: 1.42;
    font-weight: 430;
    text-shadow: 0 2px 7px rgba(0,0,0,.76);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Static reference: no reveal translation/jitter. */
.tw-about-journey [data-tw-reveal] {
    opacity: 1 !important;
    transition: none !important;
}
.tw-about-journey__header[data-tw-reveal] { transform: translateX(-50%) !important; }
.tw-about-journey__track[data-tw-reveal] { transform: none !important; }

@media (max-width: 900px) {
    .tw-about-journey {
        width: 100%;
        aspect-ratio: 724 / 283;
    }
    .tw-about-journey__title { font-size: clamp(13px, 4.1vw, 26px); }
    .tw-about-journey__header p { font-size: clamp(7px, 2.15vw, 14px); }
    .tw-about-journey__year { font-size: clamp(7px, 2.1vw, 13px); }
    .tw-about-journey__icon { width: clamp(18px, 4.8vw, 31px); height: clamp(18px, 4.8vw, 31px); }
    .tw-about-journey__item h3 { font-size: clamp(7px, 2.05vw, 13px); }
    .tw-about-journey__item p { font-size: clamp(5px, 1.5vw, 9px); }
}

@media (prefers-reduced-motion: reduce) {
    .tw-about-journey *,
    .tw-about-journey *::before,
    .tw-about-journey *::after {
        animation: none !important;
        transition: none !important;
    }
}


/* v0.5.9 — stage 05 tighter typography + full-section reference background */
.tw-about-journey__visual::before {
    background: url('../images/journey-background-reference-clean-v059.png') center / 100% 100% no-repeat;
}

.tw-about-journey__shade {
    background:
        linear-gradient(180deg, rgba(1,8,14,.01) 0%, rgba(1,8,14,0) 26%, rgba(1,8,14,.015) 58%, rgba(1,8,14,.02) 100%),
        linear-gradient(90deg, rgba(1,8,14,.025), transparent 8%, transparent 92%, rgba(1,8,14,.025));
}

.tw-about-journey__header {
    top: 2.2%;
    width: 62%;
}

.tw-about-journey__title {
    font-size: clamp(15px, 1.82vw, 34px);
    line-height: 1.06;
    letter-spacing: -.022em;
}

.tw-about-journey__header p {
    margin-top: .34em;
    font-size: clamp(8px, .94vw, 17px);
    line-height: 1.22;
    font-weight: 520;
}

.tw-about-journey__item {
    width: 15.6%;
}
.tw-about-journey__item--0 { left: 11.18%; }
.tw-about-journey__item--1 { left: 29.9%; }
.tw-about-journey__item--2 { left: 49.22%; }
.tw-about-journey__item--3 { left: 68.88%; }
.tw-about-journey__item--4 { left: 89.15%; }

.tw-about-journey__item--0 .tw-about-journey__node {
    top: 57.8%;
}
.tw-about-journey__item--0 .tw-about-journey__node::after {
    height: 30px;
    background: linear-gradient(180deg, rgba(240,181,45,.75), rgba(62,133,166,.42), rgba(62,133,166,.12), transparent);
}

.tw-about-journey__year {
    top: 55.7%;
    font-size: clamp(9px, .96vw, 18px);
    line-height: 1;
}
.tw-about-journey__item--0 .tw-about-journey__year { top: 49.8%; }

.tw-about-journey__icon {
    top: 66.2%;
    width: clamp(18px, 2.1vw, 38px);
    height: clamp(18px, 2.1vw, 38px);
}

.tw-about-journey__item h3 {
    top: 80.0%;
    left: 2%;
    right: 2%;
    height: 8.4%;
    padding: 0;
    align-items: flex-start;
    font-size: clamp(8.4px, 1.02vw, 18.5px);
    line-height: 1.18;
    font-weight: 800;
    text-wrap: balance;
    overflow: hidden;
}

.tw-about-journey__item p {
    top: 88.3%;
    left: 3%;
    right: 3%;
    height: 10.3%;
    font-size: clamp(6.1px, .70vw, 12.6px);
    line-height: 1.36;
    font-weight: 420;
    text-wrap: pretty;
    -webkit-line-clamp: 3;
}

@media (max-width: 900px) {
    .tw-about-journey__header { width: 78%; top: 2.5%; }
    .tw-about-journey__title { font-size: clamp(12px, 3.35vw, 24px); }
    .tw-about-journey__header p { font-size: clamp(6.4px, 1.75vw, 11px); }
    .tw-about-journey__year { font-size: clamp(7px, 1.75vw, 11.5px); }
    .tw-about-journey__icon { width: clamp(14px, 3.8vw, 24px); height: clamp(14px, 3.8vw, 24px); }
    .tw-about-journey__item h3 { font-size: clamp(6px, 1.75vw, 11px); }
    .tw-about-journey__item p { font-size: clamp(4.8px, 1.18vw, 8px); }
}


/* v0.6.0 — exact frozen-reference copy + tighter geometry */
.tw-about-journey__header {
    top: 2.9%;
    width: 58%;
}
.tw-about-journey__title {
    font-size: clamp(15px, 1.72vw, 32px);
    line-height: 1.03;
    font-weight: 860;
    letter-spacing: -.03em;
}
.tw-about-journey__header p {
    margin-top: .42em;
    font-size: clamp(7.8px, .86vw, 16px);
    line-height: 1.16;
    font-weight: 520;
}
.tw-about-journey__item { width: 15.2%; }
.tw-about-journey__item--0 { left: 11.15%; }
.tw-about-journey__item--1 { left: 29.95%; }
.tw-about-journey__item--2 { left: 49.20%; }
.tw-about-journey__item--3 { left: 68.98%; }
.tw-about-journey__item--4 { left: 89.08%; }
.tw-about-journey__item--0 .tw-about-journey__node { top: 57.55%; }
.tw-about-journey__item--0 .tw-about-journey__node::after { height: 29px; }
.tw-about-journey__year { top: 56.0%; font-size: clamp(9px, .94vw, 17px); line-height: 1; }
.tw-about-journey__item--0 .tw-about-journey__year { top: 49.95%; }
.tw-about-journey__icon { top: 67.3%; width: clamp(18px, 1.95vw, 36px); height: clamp(18px, 1.95vw, 36px); }
.tw-about-journey__icon svg { stroke-width: 1.58; }
.tw-about-journey__item h3 {
    top: 80.55%;
    left: 0; right: 0;
    height: 5.7%;
    font-size: clamp(8.1px, .94vw, 17px);
    line-height: 1.08;
    font-weight: 820;
    align-items: center;
    text-wrap: nowrap;
}
.tw-about-journey__item p {
    top: 87.2%;
    left: 2.5%; right: 2.5%;
    height: 9.1%;
    font-size: clamp(6px, .66vw, 12px);
    line-height: 1.28;
    font-weight: 420;
    -webkit-line-clamp: unset;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: .08em;
    overflow: hidden;
}
.tw-about-journey__item p span { display: block; }
@media (max-width: 900px) {
    .tw-about-journey__header { width: 78%; top: 3.2%; }
    .tw-about-journey__title { font-size: clamp(12px, 3.2vw, 22px); }
    .tw-about-journey__header p { font-size: clamp(6px, 1.6vw, 10px); }
    .tw-about-journey__year { font-size: clamp(6.8px, 1.68vw, 11px); }
    .tw-about-journey__icon { width: clamp(13px, 3.3vw, 22px); height: clamp(13px, 3.3vw, 22px); }
    .tw-about-journey__item h3 { font-size: clamp(5.8px, 1.48vw, 10px); }
    .tw-about-journey__item p { font-size: clamp(4.5px, 1.05vw, 7px); }
}


/* v0.6.1 — exact reference geometry: real ACF copy over cleaned reference artwork */
.tw-about-journey {
    width: 100%;
    aspect-ratio: 724 / 283;
    background: #03101a;
    overflow: hidden;
}

.tw-about-journey__visual::before {
    inset: 0;
    background: url('../images/journey-background-exact-v061.png') center center / 100% 100% no-repeat;
    opacity: 1;
    filter: none;
    transform: none;
}

.tw-about-journey__visual::after,
.tw-about-journey__shade,
.tw-about-journey__background,
.tw-about-journey__mountains,
.tw-about-journey__line-image,
.tw-about-journey__glow {
    display: none !important;
}

.tw-about-journey__header {
    top: 1.15%;
    left: 50%;
    width: 58%;
    transform: translateX(-50%);
}
.tw-about-journey__title {
    font-size: clamp(18px, 2.05vw, 39px);
    line-height: 1.02;
    font-weight: 900;
    letter-spacing: -.028em;
    white-space: nowrap;
}
.tw-about-journey__header p {
    margin: .38em 0 0;
    font-size: clamp(9px, 1.02vw, 19px);
    line-height: 1.16;
    font-weight: 500;
    white-space: nowrap;
}

.tw-about-journey__item {
    width: 15.8%;
    height: 100%;
}
.tw-about-journey__item--0 { left: 11.05%; }
.tw-about-journey__item--1 { left: 29.70%; }
.tw-about-journey__item--2 { left: 49.17%; }
.tw-about-journey__item--3 { left: 68.78%; }
.tw-about-journey__item--4 { left: 89.09%; }

/* Milestone dots/stems are already part of the clean artwork. */
.tw-about-journey__node,
.tw-about-journey__item--0 .tw-about-journey__node {
    display: none !important;
}

.tw-about-journey__year {
    top: 54.55%;
    font-size: clamp(10px, 1.08vw, 20px);
    line-height: 1;
    font-weight: 900;
    color: #fff9e5;
    text-shadow: 0 2px 7px rgba(0,0,0,.88);
}
.tw-about-journey__item--0 .tw-about-journey__year { top: 48.55%; }

.tw-about-journey__icon {
    top: 61.35%;
    width: clamp(24px, 2.65vw, 50px);
    height: clamp(24px, 2.65vw, 50px);
    color: #f2b62b;
    filter: drop-shadow(0 0 7px rgba(240,181,45,.16));
}
.tw-about-journey__icon svg { stroke-width: 1.65; }

.tw-about-journey__item h3 {
    top: 72.75%;
    left: -2%;
    right: -2%;
    height: auto;
    display: block;
    margin: 0 !important;
    padding: 0;
    font-size: clamp(10px, .96vw, 18px);
    line-height: 1.15;
    font-weight: 850;
    white-space: nowrap;
    overflow: visible;
    text-shadow: 0 2px 8px rgba(0,0,0,.82);
}

.tw-about-journey__item p {
    top: 80.55%;
    left: 1.5%;
    right: 1.5%;
    height: auto;
    margin: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    color: rgba(238,244,248,.92);
    font-size: clamp(7.5px, .72vw, 13.5px);
    line-height: 1.42;
    font-weight: 430;
    text-wrap: balance;
    text-shadow: 0 2px 7px rgba(0,0,0,.76);
}

@media (max-width: 900px) {
    .tw-about-journey { width: 100%; aspect-ratio: 724 / 283; }
    .tw-about-journey__header { top: 1.4%; width: 74%; }
    .tw-about-journey__title { font-size: clamp(12px, 3.7vw, 25px); }
    .tw-about-journey__header p { font-size: clamp(6px, 1.9vw, 12px); }
    .tw-about-journey__year { font-size: clamp(7px, 1.85vw, 12px); }
    .tw-about-journey__icon { width: clamp(16px, 4.4vw, 29px); height: clamp(16px, 4.4vw, 29px); }
    .tw-about-journey__item h3 { font-size: clamp(6px, 1.68vw, 11px); }
    .tw-about-journey__item p { font-size: clamp(4.8px, 1.25vw, 8px); }
}


/* v0.6.3 — approved mobile Journey reference (valid CSS)
 * Desktop geometry above remains frozen. This block only applies to phones. */
@media (max-width: 767px) {
    .tw-about-journey {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 0;
        aspect-ratio: 941 / 1672;
        overflow: hidden;
        background: #020a12;
    }

    .tw-about-journey__visual {
        position: absolute;
        inset: 0;
        background: #020a12;
    }

    /* The approved mobile artwork is used only as the cinematic scenery/route
       reference layer. All visible labels/icons below remain live HTML/ACF. */
    .tw-about-journey__visual::before {
        content: \"\";
        position: absolute;
        inset: 0;
        display: block !important;
        background: url('../images/journey-mobile-reference-v062.png') center top / 100% 100% no-repeat;
        opacity: .96;
        filter: none;
        transform: none;
    }

    /* Suppress the baked reference labels while preserving the mountain/route
       composition underneath. */
    .tw-about-journey__visual::after {
        content: \"\";
        position: absolute;
        inset: 0;
        display: block !important;
        pointer-events: none;
        background:
            radial-gradient(ellipse 48% 7% at 50% 7%, rgba(2,10,18,.93) 0 68%, rgba(2,10,18,.56) 82%, transparent 100%),
            radial-gradient(ellipse 20% 11% at 87% 28%, rgba(2,10,18,.91) 0 70%, rgba(2,10,18,.42) 86%, transparent 100%),
            radial-gradient(ellipse 23% 12% at 70% 43%, rgba(2,10,18,.91) 0 70%, rgba(2,10,18,.40) 86%, transparent 100%),
            radial-gradient(ellipse 25% 12% at 54% 58%, rgba(2,10,18,.91) 0 70%, rgba(2,10,18,.40) 86%, transparent 100%),
            radial-gradient(ellipse 27% 12% at 38% 72%, rgba(2,10,18,.92) 0 70%, rgba(2,10,18,.42) 86%, transparent 100%),
            radial-gradient(ellipse 31% 13% at 25% 88%, rgba(2,10,18,.93) 0 70%, rgba(2,10,18,.44) 86%, transparent 100%);
    }

    .tw-about-journey__shade,
    .tw-about-journey__background,
    .tw-about-journey__mountains,
    .tw-about-journey__line-image,
    .tw-about-journey__glow {
        display: none !important;
    }

    .tw-about-journey__container,
    .tw-about-journey__track {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
    }

    .tw-about-journey__header {
        position: absolute;
        top: 4.55%;
        left: 50%;
        width: 90%;
        transform: translateX(-50%) !important;
        text-align: center;
        direction: rtl;
    }

    .tw-about-journey__title {
        margin: 0 !important;
        font-size: 6.05vw;
        line-height: 1.10;
        font-weight: 900;
        letter-spacing: -.035em;
        white-space: nowrap;
        text-shadow: 0 3px 14px rgba(0,0,0,.82);
    }

    .tw-about-journey__header p {
        margin: 1.55vw 0 0;
        font-size: 3.22vw;
        line-height: 1.25;
        font-weight: 500;
        white-space: nowrap;
        color: rgba(245,248,251,.94);
        text-shadow: 0 2px 10px rgba(0,0,0,.82);
    }

    .tw-about-journey__item {
        position: absolute;
        top: 0;
        width: 30%;
        height: 100%;
        transform: translateX(-50%);
        text-align: center;
        direction: rtl;
        color: #fff;
    }

    .tw-about-journey__item--0 { left: 25.6%; --tw-y-year:77.0%; --tw-y-icon:81.0%; --tw-y-title:86.1%; --tw-y-copy:89.4%; }
    .tw-about-journey__item--1 { left: 38.9%; --tw-y-year:63.0%; --tw-y-icon:66.3%; --tw-y-title:70.3%; --tw-y-copy:73.6%; }
    .tw-about-journey__item--2 { left: 54.8%; --tw-y-year:49.4%; --tw-y-icon:52.7%; --tw-y-title:57.1%; --tw-y-copy:60.3%; }
    .tw-about-journey__item--3 { left: 69.7%; --tw-y-year:34.4%; --tw-y-icon:37.7%; --tw-y-title:41.5%; --tw-y-copy:44.7%; }
    .tw-about-journey__item--4 { left: 86.3%; --tw-y-year:20.7%; --tw-y-icon:23.8%; --tw-y-title:27.0%; --tw-y-copy:30.4%; }

    .tw-about-journey__node { display: none !important; }

    .tw-about-journey__year {
        position: absolute;
        top: var(--tw-y-year) !important;
        left: 0;
        right: 0;
        color: #fff9e7;
        font-size: 3.35vw;
        line-height: 1;
        font-weight: 900;
        white-space: nowrap;
        text-shadow: 0 2px 8px rgba(0,0,0,.90);
    }

    .tw-about-journey__icon {
        position: absolute;
        top: var(--tw-y-icon) !important;
        left: 50%;
        width: 6.4vw;
        height: 6.4vw;
        transform: translateX(-50%);
        display: grid;
        place-items: center;
        color: #f2b62b;
        filter: drop-shadow(0 0 8px rgba(240,181,45,.18));
    }

    .tw-about-journey__icon svg {
        width: 100%;
        height: 100%;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.7;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .tw-about-journey__icon-image {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .tw-about-journey__item h3 {
        position: absolute;
        top: var(--tw-y-title) !important;
        left: -6%;
        right: -6%;
        height: auto;
        margin: 0 !important;
        padding: 0;
        display: block;
        color: #fff;
        font-size: 4.05vw;
        line-height: 1.12;
        font-weight: 850;
        white-space: normal;
        overflow: visible;
        text-wrap: balance;
        text-shadow: 0 2px 10px rgba(0,0,0,.90);
    }

    .tw-about-journey__item p {
        position: absolute;
        top: var(--tw-y-copy) !important;
        left: -7%;
        right: -7%;
        height: auto;
        margin: 0;
        padding: 0;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
        color: rgba(243,247,250,.94);
        font-size: 3.05vw;
        line-height: 1.43;
        font-weight: 450;
        text-wrap: balance;
        text-shadow: 0 2px 9px rgba(0,0,0,.92);
    }

    /* On very narrow devices retain the exact reference proportions instead
       of collapsing the milestones into a horizontal/stacked layout. */
    @media (max-width: 430px) {
        .tw-about-journey__title { font-size: 6.2vw; }
        .tw-about-journey__header p { font-size: 3.12vw; }
        .tw-about-journey__year { font-size: 3.25vw; }
        .tw-about-journey__icon { width: 6.2vw; height: 6.2vw; }
        .tw-about-journey__item h3 { font-size: 3.9vw; }
        .tw-about-journey__item p { font-size: 2.9vw; line-height: 1.40; }
    }
}


@media screen and (max-width: 767px) {
    body.tehranweb-about-template .tw-about-journey {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 941 / 1672 !important;
        overflow: hidden !important;
    }
    body.tehranweb-about-template .tw-about-journey__container,
    body.tehranweb-about-template .tw-about-journey__track,
    body.tehranweb-about-template .tw-about-journey__visual {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
    }
    body.tehranweb-about-template .tw-about-journey__visual::before {
        display: block !important;
        inset: 0 !important;
        background-image: url('../images/journey-mobile-reference-v062.png') !important;
        background-position: center top !important;
        background-size: 100% 100% !important;
        background-repeat: no-repeat !important;
        opacity: .96 !important;
        transform: none !important;
    }
    body.tehranweb-about-template .tw-about-journey__header {
        top: 4.55% !important;
        left: 50% !important;
        width: 90% !important;
        transform: translateX(-50%) !important;
    }
    body.tehranweb-about-template .tw-about-journey__item {
        top: 0 !important;
        width: 30% !important;
        height: 100% !important;
        transform: translateX(-50%) !important;
    }
    body.tehranweb-about-template .tw-about-journey__item--0 { left: 25.6% !important; }
    body.tehranweb-about-template .tw-about-journey__item--1 { left: 38.9% !important; }
    body.tehranweb-about-template .tw-about-journey__item--2 { left: 54.8% !important; }
    body.tehranweb-about-template .tw-about-journey__item--3 { left: 69.7% !important; }
    body.tehranweb-about-template .tw-about-journey__item--4 { left: 86.3% !important; }
}


/* v0.6.4 — hard mobile layout switch.
 * This does not depend solely on viewport media queries. JS applies
 * .tw-about-journey--mobile from the actual rendered section width/device.
 */
.tw-about-journey.tw-about-journey--mobile,
body.tehranweb-about-mobile .tw-about-journey {
    --tw-mobile-scale: calc(var(--tw-journey-width, 390px) / 941);
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    height: calc(var(--tw-journey-width, 390px) * 1.7768331562) !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
    background: #020a12 !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual,
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__container,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__container,
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__track,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__track {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::before,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    background-image: url('../images/journey-mobile-reference-v062.png') !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: 100% 100% !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
}

/* Cover only the baked labels from the visual reference. The route, lights,
   mountains and depth stay untouched underneath the live HTML content. */
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::after,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        radial-gradient(ellipse 48% 6.6% at 50% 7.0%, rgba(2,10,18,.965) 0 72%, rgba(2,10,18,.65) 87%, transparent 100%),
        radial-gradient(ellipse 19% 10.5% at 86.5% 28.4%, rgba(2,10,18,.955) 0 72%, rgba(2,10,18,.60) 87%, transparent 100%),
        radial-gradient(ellipse 22% 10.5% at 69.5% 43.2%, rgba(2,10,18,.955) 0 72%, rgba(2,10,18,.58) 87%, transparent 100%),
        radial-gradient(ellipse 23% 11.0% at 53.0% 58.1%, rgba(2,10,18,.955) 0 72%, rgba(2,10,18,.58) 87%, transparent 100%),
        radial-gradient(ellipse 24% 10.8% at 35.2% 72.4%, rgba(2,10,18,.955) 0 72%, rgba(2,10,18,.58) 87%, transparent 100%),
        radial-gradient(ellipse 27% 12.0% at 21.0% 87.8%, rgba(2,10,18,.965) 0 72%, rgba(2,10,18,.62) 87%, transparent 100%) !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__shade,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__shade,
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__background,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__background,
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__mountains,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mountains,
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__line-image,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__line-image,
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__glow,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__glow,
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__node,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__node {
    display: none !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__header,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header {
    position: absolute !important;
    top: 4.65% !important;
    left: 50% !important;
    width: 88% !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
    text-align: center !important;
    direction: rtl !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__title,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__title {
    margin: 0 !important;
    font-size: calc(var(--tw-journey-width, 390px) * .0585) !important;
    line-height: 1.08 !important;
    font-weight: 900 !important;
    letter-spacing: -.035em !important;
    white-space: nowrap !important;
    color: #f8f9fb !important;
    text-shadow: 0 3px 14px rgba(0,0,0,.82) !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__title em,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__title em {
    color: #efb22b !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__header p,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header p {
    margin: calc(var(--tw-journey-width, 390px) * .014) 0 0 !important;
    font-size: calc(var(--tw-journey-width, 390px) * .0315) !important;
    line-height: 1.26 !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    color: rgba(245,248,251,.95) !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.84) !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__item,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item {
    position: absolute !important;
    top: 0 !important;
    width: 29% !important;
    height: 100% !important;
    transform: translateX(-50%) !important;
    text-align: center !important;
    direction: rtl !important;
    color: #fff !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--0,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--0 { left: 20.8% !important; --tw-y-year:77.1%; --tw-y-icon:80.7%; --tw-y-title:85.0%; --tw-y-copy:88.7%; }
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--1,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--1 { left: 35.2% !important; --tw-y-year:62.6%; --tw-y-icon:65.8%; --tw-y-title:70.0%; --tw-y-copy:73.5%; }
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--2,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--2 { left: 53.1% !important; --tw-y-year:49.8%; --tw-y-icon:52.5%; --tw-y-title:56.7%; --tw-y-copy:60.0%; }
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--3,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--3 { left: 69.2% !important; --tw-y-year:34.9%; --tw-y-icon:37.4%; --tw-y-title:41.0%; --tw-y-copy:44.5%; }
.tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--4,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--4 { left: 87.5% !important; --tw-y-year:20.6%; --tw-y-icon:23.1%; --tw-y-title:26.7%; --tw-y-copy:30.0%; }

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__year,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__year {
    position: absolute !important;
    top: var(--tw-y-year) !important;
    left: 0 !important;
    right: 0 !important;
    font-size: calc(var(--tw-journey-width, 390px) * .032) !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    color: #fff8e2 !important;
    white-space: nowrap !important;
    text-shadow: 0 2px 8px rgba(0,0,0,.90) !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon {
    position: absolute !important;
    top: var(--tw-y-icon) !important;
    left: 50% !important;
    width: calc(var(--tw-journey-width, 390px) * .059) !important;
    height: calc(var(--tw-journey-width, 390px) * .059) !important;
    transform: translateX(-50%) !important;
    display: grid !important;
    place-items: center !important;
    color: #efb22b !important;
    filter: drop-shadow(0 0 8px rgba(240,181,45,.18)) !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__item h3,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item h3 {
    position: absolute !important;
    top: var(--tw-y-title) !important;
    left: -5% !important;
    right: -5% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    font-size: calc(var(--tw-journey-width, 390px) * .0385) !important;
    line-height: 1.13 !important;
    font-weight: 850 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-wrap: balance !important;
    color: #fff !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.90) !important;
}

.tw-about-journey.tw-about-journey--mobile .tw-about-journey__item p,
body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item p {
    position: absolute !important;
    top: var(--tw-y-copy) !important;
    left: -7% !important;
    right: -7% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    overflow: hidden !important;
    font-size: calc(var(--tw-journey-width, 390px) * .029) !important;
    line-height: 1.40 !important;
    font-weight: 450 !important;
    text-wrap: balance !important;
    color: rgba(245,248,251,.95) !important;
    text-shadow: 0 2px 9px rgba(0,0,0,.92) !important;
}


/* v0.6.5 — mobile Journey: independent vertical composition calibrated to the
 * approved 941x1672 mobile reference. Desktop rules above are untouched. */
@media (max-width: 767px) {
    body.tehranweb-about-template .tw-about-journey,
    .tw-about-journey.tw-about-journey--mobile,
    body.tehranweb-about-mobile .tw-about-journey {
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 941 / 1672 !important;
        overflow: hidden !important;
        background: #020a12 !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual,
    body.tehranweb-about-template .tw-about-journey__container,
    body.tehranweb-about-template .tw-about-journey__track,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__container,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__track {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual::before,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::before,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::before {
        content: "" !important;
        display: block !important;
        position: absolute !important;
        inset: 0 !important;
        background-image: url('../images/journey-mobile-clean-v065.png') !important;
        background-position: center top !important;
        background-size: 100% 100% !important;
        background-repeat: no-repeat !important;
        opacity: 1 !important;
        filter: none !important;
        transform: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual::after,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::after,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::after {
        display: none !important;
        content: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__shade,
    body.tehranweb-about-template .tw-about-journey__background,
    body.tehranweb-about-template .tw-about-journey__mountains,
    body.tehranweb-about-template .tw-about-journey__line-image,
    body.tehranweb-about-template .tw-about-journey__glow,
    body.tehranweb-about-template .tw-about-journey__node {
        display: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__header,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__header,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header {
        position: absolute !important;
        top: 4.45% !important;
        left: 50% !important;
        width: 92% !important;
        margin: 0 !important;
        transform: translateX(-50%) !important;
        text-align: center !important;
        direction: rtl !important;
    }

    body.tehranweb-about-template .tw-about-journey__title,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__title,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__title {
        margin: 0 !important;
        font-size: clamp(17px, 4.75vw, 21px) !important;
        line-height: 1.08 !important;
        font-weight: 900 !important;
        letter-spacing: -.035em !important;
        white-space: nowrap !important;
        color: #f7f8fb !important;
        text-shadow: 0 3px 12px rgba(0,0,0,.78) !important;
    }

    body.tehranweb-about-template .tw-about-journey__header p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__header p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header p {
        margin: 1.15% 0 0 !important;
        font-size: clamp(9px, 2.55vw, 11px) !important;
        line-height: 1.28 !important;
        font-weight: 500 !important;
        white-space: nowrap !important;
        color: rgba(244,248,251,.94) !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.80) !important;
    }

    body.tehranweb-about-template .tw-about-journey__item,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item {
        position: absolute !important;
        top: 0 !important;
        width: 27.5% !important;
        height: 100% !important;
        transform: translateX(-50%) !important;
        text-align: center !important;
        direction: rtl !important;
        color: #fff !important;
    }

    body.tehranweb-about-template .tw-about-journey__item--0 { left: 23.0% !important; --tw-y-year:77.8%; --tw-y-icon:80.4%; --tw-y-title:84.4%; --tw-y-copy:87.4%; }
    body.tehranweb-about-template .tw-about-journey__item--1 { left: 36.0% !important; --tw-y-year:62.0%; --tw-y-icon:65.0%; --tw-y-title:68.0%; --tw-y-copy:71.2%; }
    body.tehranweb-about-template .tw-about-journey__item--2 { left: 53.0% !important; --tw-y-year:49.7%; --tw-y-icon:52.5%; --tw-y-title:56.2%; --tw-y-copy:59.5%; }
    body.tehranweb-about-template .tw-about-journey__item--3 { left: 72.0% !important; --tw-y-year:35.0%; --tw-y-icon:37.8%; --tw-y-title:41.0%; --tw-y-copy:44.0%; }
    body.tehranweb-about-template .tw-about-journey__item--4 { left: 87.0% !important; --tw-y-year:20.4%; --tw-y-icon:23.4%; --tw-y-title:26.7%; --tw-y-copy:29.9%; }

    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--0,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--0 { left: 23.0% !important; --tw-y-year:77.8%; --tw-y-icon:80.4%; --tw-y-title:84.4%; --tw-y-copy:87.4%; }
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--1,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--1 { left: 36.0% !important; --tw-y-year:62.0%; --tw-y-icon:65.0%; --tw-y-title:68.0%; --tw-y-copy:71.2%; }
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--2,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--2 { left: 53.0% !important; --tw-y-year:49.7%; --tw-y-icon:52.5%; --tw-y-title:56.2%; --tw-y-copy:59.5%; }
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--3 { left: 72.0% !important; --tw-y-year:35.0%; --tw-y-icon:37.8%; --tw-y-title:41.0%; --tw-y-copy:44.0%; }
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--4,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--4 { left: 87.0% !important; --tw-y-year:20.4%; --tw-y-icon:23.4%; --tw-y-title:26.7%; --tw-y-copy:29.9%; }

    body.tehranweb-about-template .tw-about-journey__year,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__year,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__year {
        position: absolute !important;
        top: var(--tw-y-year) !important;
        left: 0 !important;
        right: 0 !important;
        font-size: clamp(9px, 2.55vw, 11px) !important;
        line-height: 1 !important;
        font-weight: 900 !important;
        color: #fff9e7 !important;
        white-space: nowrap !important;
        text-shadow: 0 2px 7px rgba(0,0,0,.88) !important;
    }

    body.tehranweb-about-template .tw-about-journey__icon,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon {
        position: absolute !important;
        top: var(--tw-y-icon) !important;
        left: 50% !important;
        width: clamp(18px, 5.0vw, 22px) !important;
        height: clamp(18px, 5.0vw, 22px) !important;
        transform: translateX(-50%) !important;
        display: grid !important;
        place-items: center !important;
        color: #f0b52d !important;
        filter: drop-shadow(0 0 6px rgba(240,181,45,.16)) !important;
    }

    body.tehranweb-about-template .tw-about-journey__item h3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item h3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item h3 {
        position: absolute !important;
        top: var(--tw-y-title) !important;
        left: -2% !important;
        right: -2% !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        overflow: hidden !important;
        font-size: clamp(11px, 3.10vw, 13px) !important;
        line-height: 1.22 !important;
        font-weight: 850 !important;
        white-space: normal !important;
        text-wrap: balance !important;
        color: #fff !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.90) !important;
    }

    body.tehranweb-about-template .tw-about-journey__item p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item p {
        position: absolute !important;
        top: var(--tw-y-copy) !important;
        left: -1% !important;
        right: -1% !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 3 !important;
        overflow: hidden !important;
        font-size: clamp(8px, 2.25vw, 9.5px) !important;
        line-height: 1.38 !important;
        font-weight: 430 !important;
        white-space: normal !important;
        text-wrap: balance !important;
        color: rgba(242,247,250,.94) !important;
        text-shadow: 0 2px 7px rgba(0,0,0,.90) !important;
    }
}


/* v0.6.6 — mobile timeline: titles only, no milestone descriptions */
@media (max-width: 767px) {
    body.tehranweb-about-template .tw-about-journey__item p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item p {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        max-height: 0 !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.tehranweb-about-template .tw-about-journey__item h3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item h3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item h3 {
        left: -10% !important;
        right: -10% !important;
        max-width: 120% !important;
        font-size: clamp(11px, 3.2vw, 14px) !important;
        line-height: 1.18 !important;
        -webkit-line-clamp: 2 !important;
        text-wrap: balance !important;
    }
}


/* v0.6.7 — definitive mobile cleanup: one visual layer only.
 * Uses the approved mobile reference for the exact mountain/route composition,
 * obscures only baked copy, and renders a single live title layer on top. */
.tw-about-journey__mobile-mask { display: none; }

@media (max-width: 767px) {
    body.tehranweb-about-template .tw-about-journey,
    .tw-about-journey.tw-about-journey--mobile,
    body.tehranweb-about-mobile .tw-about-journey {
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 941 / 1672 !important;
        overflow: hidden !important;
        background: #020a12 !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual,
    body.tehranweb-about-template .tw-about-journey__container,
    body.tehranweb-about-template .tw-about-journey__track,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__container,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__track,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__container,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__track {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual::before,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::before,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::before {
        content: "" !important;
        display: block !important;
        position: absolute !important;
        inset: 0 !important;
        background-image: url('../images/journey-mobile-reference-v062.png') !important;
        background-position: center top !important;
        background-size: 100% 100% !important;
        background-repeat: no-repeat !important;
        opacity: 1 !important;
        filter: none !important;
        transform: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual::after,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::after,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::after,
    body.tehranweb-about-template .tw-about-journey__shade,
    body.tehranweb-about-template .tw-about-journey__background,
    body.tehranweb-about-template .tw-about-journey__mountains,
    body.tehranweb-about-template .tw-about-journey__line-image,
    body.tehranweb-about-template .tw-about-journey__glow,
    body.tehranweb-about-template .tw-about-journey__node {
        display: none !important;
        content: none !important;
    }

    /* Blur just the baked title/copy zones from the reference image. The gold
       route, milestone dots, years and icons remain the untouched reference. */
    body.tehranweb-about-template .tw-about-journey__mobile-mask,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mobile-mask,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mobile-mask {
        display: block !important;
        position: absolute !important;
        z-index: 4 !important;
        border-radius: 14px !important;
        background: rgba(2, 10, 18, .60) !important;
        -webkit-backdrop-filter: blur(13px) saturate(.78) !important;
        backdrop-filter: blur(13px) saturate(.78) !important;
        box-shadow: inset 0 0 30px rgba(2,10,18,.28) !important;
        pointer-events: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__mobile-mask--header,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mobile-mask--header,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mobile-mask--header {
        left: 6% !important; top: 3.1% !important; width: 88% !important; height: 9.6% !important;
    }
    body.tehranweb-about-template .tw-about-journey__mobile-mask--4,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mobile-mask--4,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mobile-mask--4 {
        left: 73.4% !important; top: 25.7% !important; width: 24.8% !important; height: 10.2% !important;
    }
    body.tehranweb-about-template .tw-about-journey__mobile-mask--3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mobile-mask--3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mobile-mask--3 {
        left: 58.0% !important; top: 40.8% !important; width: 25.8% !important; height: 10.2% !important;
    }
    body.tehranweb-about-template .tw-about-journey__mobile-mask--2,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mobile-mask--2,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mobile-mask--2 {
        left: 38.4% !important; top: 55.4% !important; width: 29.2% !important; height: 10.8% !important;
    }
    body.tehranweb-about-template .tw-about-journey__mobile-mask--1,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mobile-mask--1,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mobile-mask--1 {
        left: 21.5% !important; top: 69.2% !important; width: 29.5% !important; height: 10.6% !important;
    }
    body.tehranweb-about-template .tw-about-journey__mobile-mask--0,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mobile-mask--0,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mobile-mask--0 {
        left: 7.0% !important; top: 83.3% !important; width: 30.5% !important; height: 10.2% !important;
    }

    /* Header: one live layer only. */
    body.tehranweb-about-template .tw-about-journey__header,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__header,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header {
        z-index: 9 !important;
        top: 4.55% !important;
        left: 50% !important;
        width: 90% !important;
        transform: translateX(-50%) !important;
        text-align: center !important;
    }
    body.tehranweb-about-template .tw-about-journey__title,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__title,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__title {
        margin: 0 !important;
        font-size: clamp(16px, 4.65vw, 20px) !important;
        line-height: 1.08 !important;
        font-weight: 900 !important;
        white-space: nowrap !important;
        color: #f8f9fb !important;
        text-shadow: 0 3px 12px rgba(0,0,0,.88) !important;
    }
    body.tehranweb-about-template .tw-about-journey__header p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__header p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header p {
        margin: 1.0% 0 0 !important;
        font-size: clamp(8px, 2.35vw, 10px) !important;
        line-height: 1.24 !important;
        white-space: nowrap !important;
        color: rgba(245,248,251,.95) !important;
    }

    /* On mobile, the reference artwork supplies year + icon. Hide the live
       duplicates and render only one ACF-driven milestone title. */
    body.tehranweb-about-template .tw-about-journey__year,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__year,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__year,
    body.tehranweb-about-template .tw-about-journey__icon,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon,
    body.tehranweb-about-template .tw-about-journey__item p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item p {
        display: none !important;
        visibility: hidden !important;
    }

    body.tehranweb-about-template .tw-about-journey__item,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item {
        position: absolute !important;
        top: 0 !important;
        width: 27% !important;
        height: 100% !important;
        transform: translateX(-50%) !important;
        text-align: center !important;
    }

    body.tehranweb-about-template .tw-about-journey__item--0,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--0,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--0 { left: 23.3% !important; --tw-y-title:84.95%; }
    body.tehranweb-about-template .tw-about-journey__item--1,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--1,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--1 { left: 36.7% !important; --tw-y-title:70.30%; }
    body.tehranweb-about-template .tw-about-journey__item--2,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--2,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--2 { left: 53.5% !important; --tw-y-title:56.85%; }
    body.tehranweb-about-template .tw-about-journey__item--3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--3 { left: 70.6% !important; --tw-y-title:41.55%; }
    body.tehranweb-about-template .tw-about-journey__item--4,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--4,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--4 { left: 86.6% !important; --tw-y-title:27.15%; }

    body.tehranweb-about-template .tw-about-journey__item h3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item h3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item h3 {
        position: absolute !important;
        z-index: 10 !important;
        top: var(--tw-y-title) !important;
        left: -6% !important;
        right: -6% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        overflow: hidden !important;
        font-size: clamp(10.5px, 3.0vw, 13px) !important;
        line-height: 1.16 !important;
        font-weight: 850 !important;
        white-space: normal !important;
        color: #fff !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.95) !important;
    }
}


/* v0.6.8 — final mobile split: clean background, no mask panels,
   mobile shows only live years + titles, desktop remains untouched. */
.tw-about-journey__mobile-mask { display: none !important; }

@media (max-width: 767px) {
    body.tehranweb-about-template .tw-about-journey,
    .tw-about-journey.tw-about-journey--mobile,
    body.tehranweb-about-mobile .tw-about-journey {
        position: relative !important;
        width: 100% !important;
        aspect-ratio: 941 / 1672 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        background: #020a12 !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual,
    body.tehranweb-about-template .tw-about-journey__container,
    body.tehranweb-about-template .tw-about-journey__track,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__container,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__track,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__container,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__track {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual::before,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::before,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::before {
        content: "" !important;
        position: absolute !important;
        inset: 0 !important;
        background: url('../images/journey-mobile-background-clean-v068.png') center top / 100% 100% no-repeat !important;
        opacity: 1 !important;
        filter: none !important;
        transform: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual::after,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::after,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::after {
        content: "" !important;
        position: absolute !important;
        inset: 0 !important;
        pointer-events: none !important;
        background:
            linear-gradient(180deg, rgba(2,10,18,.60) 0%, rgba(2,10,18,.42) 6%, rgba(2,10,18,.12) 11%, rgba(2,10,18,0) 18%),
            radial-gradient(50% 18% at 91% 31%, rgba(2,10,18,.30) 0%, rgba(2,10,18,0) 70%),
            radial-gradient(42% 15% at 72% 46%, rgba(2,10,18,.22) 0%, rgba(2,10,18,0) 72%),
            radial-gradient(42% 15% at 56% 61%, rgba(2,10,18,.18) 0%, rgba(2,10,18,0) 72%),
            radial-gradient(42% 15% at 37% 75%, rgba(2,10,18,.16) 0%, rgba(2,10,18,0) 72%),
            radial-gradient(42% 15% at 20% 89%, rgba(2,10,18,.16) 0%, rgba(2,10,18,0) 72%) !important;
    }

    body.tehranweb-about-template .tw-about-journey__shade,
    body.tehranweb-about-template .tw-about-journey__background,
    body.tehranweb-about-template .tw-about-journey__mountains,
    body.tehranweb-about-template .tw-about-journey__line-image,
    body.tehranweb-about-template .tw-about-journey__glow,
    body.tehranweb-about-template .tw-about-journey__mobile-mask,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__shade,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__background,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mountains,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__line-image,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__glow,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mobile-mask,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__shade,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__background,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mountains,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__line-image,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__glow,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mobile-mask {
        display: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__header,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__header,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header {
        position: absolute !important;
        z-index: 9 !important;
        top: 3.1% !important;
        left: 50% !important;
        width: 86% !important;
        transform: translateX(-50%) !important;
        text-align: center !important;
    }

    body.tehranweb-about-template .tw-about-journey__title,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__title,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__title {
        margin: 0 !important;
        font-size: clamp(14px, 4.55vw, 19px) !important;
        line-height: 1.1 !important;
        font-weight: 900 !important;
        white-space: nowrap !important;
        color: #fbfcfd !important;
        text-shadow: 0 3px 12px rgba(0,0,0,.88) !important;
    }

    body.tehranweb-about-template .tw-about-journey__header p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__header p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header p {
        margin: .55em 0 0 !important;
        font-size: clamp(7px, 2.15vw, 9px) !important;
        line-height: 1.22 !important;
        white-space: nowrap !important;
        color: rgba(245,248,251,.94) !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.85) !important;
    }

    body.tehranweb-about-template .tw-about-journey__item p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item p {
        display: none !important;
        visibility: hidden !important;
    }

    body.tehranweb-about-template .tw-about-journey__item,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item {
        position: absolute !important;
        top: 0 !important;
        width: var(--tw-mobile-width, 26%) !important;
        height: 100% !important;
        transform: translateX(-50%) !important;
        text-align: center !important;
        direction: rtl !important;
    }

    body.tehranweb-about-template .tw-about-journey__item--0,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--0,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--0 { left: 13.7% !important; --tw-mobile-width: 27%; --tw-year-top: 82.8%; --tw-icon-top: 86.9%; --tw-title-top: 92.4%; }
    body.tehranweb-about-template .tw-about-journey__item--1,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--1,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--1 { left: 28.2% !important; --tw-mobile-width: 26%; --tw-year-top: 68.6%; --tw-icon-top: 72.9%; --tw-title-top: 78.2%; }
    body.tehranweb-about-template .tw-about-journey__item--2,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--2,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--2 { left: 49.4% !important; --tw-mobile-width: 30%; --tw-year-top: 54.2%; --tw-icon-top: 58.6%; --tw-title-top: 63.9%; }
    body.tehranweb-about-template .tw-about-journey__item--3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--3 { left: 70.3% !important; --tw-mobile-width: 30%; --tw-year-top: 39.2%; --tw-icon-top: 43.4%; --tw-title-top: 48.7%; }
    body.tehranweb-about-template .tw-about-journey__item--4,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--4,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--4 { left: 84.9% !important; --tw-mobile-width: 27%; --tw-year-top: 24.2%; --tw-icon-top: 28.2%; --tw-title-top: 33.7%; }

    body.tehranweb-about-template .tw-about-journey__year,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__year,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__year {
        position: absolute !important;
        z-index: 9 !important;
        top: var(--tw-year-top) !important;
        left: -8% !important;
        right: -8% !important;
        display: block !important;
        color: #fff6d7 !important;
        font-size: clamp(8px, 2.35vw, 11px) !important;
        line-height: 1 !important;
        font-weight: 850 !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.92) !important;
        white-space: nowrap !important;
    }

    body.tehranweb-about-template .tw-about-journey__icon,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon {
        position: absolute !important;
        z-index: 9 !important;
        top: var(--tw-icon-top) !important;
        left: 50% !important;
        width: 18px !important;
        height: 18px !important;
        display: grid !important;
        place-items: center !important;
        transform: translateX(-50%) !important;
        color: #f0b52d !important;
        filter: drop-shadow(0 0 5px rgba(240,181,45,.15)) !important;
    }
    body.tehranweb-about-template .tw-about-journey__icon svg,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon svg,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon svg {
        stroke-width: 1.6 !important;
    }

    body.tehranweb-about-template .tw-about-journey__item h3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item h3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item h3 {
        position: absolute !important;
        z-index: 10 !important;
        top: var(--tw-title-top) !important;
        left: -8% !important;
        right: -8% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        overflow: hidden !important;
        align-items: flex-start !important;
        justify-content: center !important;
        font-size: clamp(9px, 2.85vw, 12px) !important;
        line-height: 1.15 !important;
        font-weight: 850 !important;
        white-space: normal !important;
        text-wrap: balance !important;
        color: #ffffff !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.96) !important;
    }
}


/* v0.6.9 — mobile Journey matches approved reference.
   Mobile keeps the same visual as the approved mobile reference image,
   but hides the descriptive text under each title. */
@media (max-width: 767px) {
    body.tehranweb-about-template .tw-about-journey,
    .tw-about-journey.tw-about-journey--mobile,
    body.tehranweb-about-mobile .tw-about-journey {
        position: relative !important;
        width: 100% !important;
        aspect-ratio: 941 / 1672 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        isolation: isolate !important;
        background: #020a12 !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual::before,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::before,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::before {
        content: '' !important;
        position: absolute !important;
        inset: 0 !important;
        background: url('../images/journey-mobile-background-clean-v069.png') center top / 100% 100% no-repeat !important;
        opacity: 1 !important;
        filter: none !important;
        transform: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual::after,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::after,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::after {
        content: '' !important;
        position: absolute !important;
        inset: 0 !important;
        background: none !important;
        pointer-events: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__background,
    body.tehranweb-about-template .tw-about-journey__mountains,
    body.tehranweb-about-template .tw-about-journey__line-image,
    body.tehranweb-about-template .tw-about-journey__glow,
    body.tehranweb-about-template .tw-about-journey__shade,
    body.tehranweb-about-template .tw-about-journey__mobile-mask,
    body.tehranweb-about-template .tw-about-journey__node,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__background,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mountains,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__line-image,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__glow,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__shade,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mobile-mask,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__node,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__background,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mountains,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__line-image,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__glow,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__shade,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mobile-mask,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__node {
        display: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__container,
    body.tehranweb-about-template .tw-about-journey__track,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__container,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__track,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__container,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__track {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.tehranweb-about-template .tw-about-journey__header,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__header,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header {
        position: absolute !important;
        z-index: 12 !important;
        top: 3.4% !important;
        left: 50% !important;
        width: 86.5% !important;
        transform: translateX(-50%) !important;
        text-align: center !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.tehranweb-about-template .tw-about-journey__title,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__title,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__title {
        margin: 0 !important;
        padding: 0 !important;
        font-size: clamp(13px, 4.65vw, 18.5px) !important;
        line-height: 1.08 !important;
        font-weight: 900 !important;
        letter-spacing: 0 !important;
        white-space: nowrap !important;
        color: #ffffff !important;
        text-shadow: 0 3px 10px rgba(0,0,0,.86) !important;
    }

    body.tehranweb-about-template .tw-about-journey__title em,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__title em,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__title em {
        color: #f1b733 !important;
        font-style: normal !important;
    }

    body.tehranweb-about-template .tw-about-journey__header p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__header p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header p {
        margin: .45em 0 0 !important;
        padding: 0 !important;
        font-size: clamp(7px, 2.15vw, 8.6px) !important;
        line-height: 1.22 !important;
        white-space: nowrap !important;
        color: rgba(245,248,251,.96) !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.84) !important;
    }

    body.tehranweb-about-template .tw-about-journey__item,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item {
        position: absolute !important;
        top: 0 !important;
        width: var(--tw-mobile-width, 28%) !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: translateX(-50%) !important;
        text-align: center !important;
        direction: rtl !important;
        overflow: visible !important;
        z-index: 12 !important;
    }

    body.tehranweb-about-template .tw-about-journey__item p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item p {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }

    body.tehranweb-about-template .tw-about-journey__item--0,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--0,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--0 { left: 17.5% !important; --tw-mobile-width: 35%; --tw-year-top: 81.0%; --tw-icon-top: 85.1%; --tw-title-top: 90.0%; }
    body.tehranweb-about-template .tw-about-journey__item--1,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--1,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--1 { left: 37.1% !important; --tw-mobile-width: 31%; --tw-year-top: 64.0%; --tw-icon-top: 68.0%; --tw-title-top: 72.8%; }
    body.tehranweb-about-template .tw-about-journey__item--2,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--2,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--2 { left: 57.2% !important; --tw-mobile-width: 36%; --tw-year-top: 48.8%; --tw-icon-top: 52.9%; --tw-title-top: 57.7%; }
    body.tehranweb-about-template .tw-about-journey__item--3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--3 { left: 76.3% !important; --tw-mobile-width: 30%; --tw-year-top: 31.6%; --tw-icon-top: 35.6%; --tw-title-top: 40.6%; }
    body.tehranweb-about-template .tw-about-journey__item--4,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--4,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--4 { left: 89.0% !important; --tw-mobile-width: 23%; --tw-year-top: 15.2%; --tw-icon-top: 19.3%; --tw-title-top: 24.2%; }

    body.tehranweb-about-template .tw-about-journey__year,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__year,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__year {
        position: absolute !important;
        z-index: 13 !important;
        top: var(--tw-year-top) !important;
        left: -6% !important;
        right: -6% !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #fff7d7 !important;
        font-size: clamp(9px, 3vw, 14px) !important;
        line-height: 1 !important;
        font-weight: 850 !important;
        white-space: nowrap !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.94) !important;
    }

    body.tehranweb-about-template .tw-about-journey__icon,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon {
        position: absolute !important;
        z-index: 13 !important;
        top: var(--tw-icon-top) !important;
        left: 50% !important;
        width: 22px !important;
        height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: grid !important;
        place-items: center !important;
        transform: translateX(-50%) !important;
        color: #f2b72f !important;
        filter: drop-shadow(0 0 6px rgba(242,183,47,.16)) !important;
    }

    body.tehranweb-about-template .tw-about-journey__icon svg,
    body.tehranweb-about-template .tw-about-journey__icon-image,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon svg,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon-image,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon svg,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon-image {
        width: 100% !important;
        height: 100% !important;
        stroke-width: 1.7 !important;
    }

    body.tehranweb-about-template .tw-about-journey__item h3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item h3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item h3 {
        position: absolute !important;
        z-index: 14 !important;
        top: var(--tw-title-top) !important;
        left: -9% !important;
        right: -9% !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 3 !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: clamp(11.5px, 3.85vw, 18px) !important;
        line-height: 1.14 !important;
        font-weight: 900 !important;
        white-space: normal !important;
        text-wrap: balance !important;
        color: #ffffff !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.96) !important;
    }
}


/* v0.7.0 — final mobile Journey correction.
   User-approved rules:
   - mobile and desktop stay visually separate
   - mobile shows only year + icon + title
   - no title backgrounds / no duplicate text / no description text
   - keep the approved mobile reference image treatment
*/
@media (max-width: 767px) {
    body.tehranweb-about-template .tw-about-journey,
    body.tehranweb-about-mobile .tw-about-journey,
    .tw-about-journey.tw-about-journey--mobile {
        position: relative !important;
        width: 100% !important;
        aspect-ratio: 941 / 1672 !important;
        min-height: 0 !important;
        overflow: hidden !important;
        isolation: isolate !important;
        background: #020a12 !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual {
        position: absolute !important;
        inset: 0 !important;
        overflow: hidden !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual::before,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::before,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::before {
        content: '' !important;
        position: absolute !important;
        inset: 0 !important;
        background: url('../images/journey-mobile-background-clean-v069.png') center top / 100% 100% no-repeat !important;
        opacity: 1 !important;
        filter: none !important;
        transform: none !important;
        z-index: 0 !important;
    }

    body.tehranweb-about-template .tw-about-journey__visual::after,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__visual::after,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__visual::after {
        content: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__background,
    body.tehranweb-about-template .tw-about-journey__mountains,
    body.tehranweb-about-template .tw-about-journey__line-image,
    body.tehranweb-about-template .tw-about-journey__glow,
    body.tehranweb-about-template .tw-about-journey__shade,
    body.tehranweb-about-template .tw-about-journey__mobile-mask,
    body.tehranweb-about-template .tw-about-journey__node,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__background,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mountains,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__line-image,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__glow,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__shade,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__mobile-mask,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__node,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__background,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mountains,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__line-image,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__glow,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__shade,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__mobile-mask,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__node {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }

    body.tehranweb-about-template .tw-about-journey__container,
    body.tehranweb-about-template .tw-about-journey__track,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__container,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__track,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__container,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__track {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        z-index: 2 !important;
    }

    body.tehranweb-about-template .tw-about-journey__header,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__header {
        position: absolute !important;
        top: 3.2% !important;
        left: 50% !important;
        width: 86.2% !important;
        transform: translateX(-50%) !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: center !important;
        z-index: 5 !important;
        background: none !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__title,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__title,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__title {
        margin: 0 !important;
        padding: 0 !important;
        font-size: clamp(13px, 4.9vw, 18.5px) !important;
        line-height: 1.08 !important;
        font-weight: 900 !important;
        letter-spacing: 0 !important;
        white-space: nowrap !important;
        color: #ffffff !important;
        text-shadow: 0 3px 10px rgba(0,0,0,.90) !important;
        background: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__title em,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__title em,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__title em {
        color: #f1b733 !important;
        font-style: normal !important;
    }

    body.tehranweb-about-template .tw-about-journey__header p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__header p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__header p {
        margin: .4em 0 0 !important;
        padding: 0 !important;
        font-size: clamp(7px, 2.2vw, 8.8px) !important;
        line-height: 1.22 !important;
        color: rgba(245,248,251,.97) !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.86) !important;
        white-space: nowrap !important;
        background: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__item,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item {
        position: absolute !important;
        top: var(--tw-m-top) !important;
        left: var(--tw-m-left) !important;
        width: var(--tw-m-width) !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        text-align: center !important;
        direction: rtl !important;
        overflow: visible !important;
        background: none !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        border: 0 !important;
        z-index: 6 !important;
    }

    body.tehranweb-about-template .tw-about-journey__item::before,
    body.tehranweb-about-template .tw-about-journey__item::after,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item::before,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item::after,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item::before,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item::after {
        display: none !important;
        content: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__item > p,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item > p,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item > p {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        max-height: 0 !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 0 !important;
        line-height: 0 !important;
    }

    body.tehranweb-about-template .tw-about-journey__item--0,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--0,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--0 { --tw-m-left: 2.8%; --tw-m-top: 74.8%; --tw-m-width: 34.2%; }
    body.tehranweb-about-template .tw-about-journey__item--1,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--1,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--1 { --tw-m-left: 19.6%; --tw-m-top: 60.5%; --tw-m-width: 34.5%; }
    body.tehranweb-about-template .tw-about-journey__item--2,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--2,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--2 { --tw-m-left: 39.2%; --tw-m-top: 45.7%; --tw-m-width: 37.2%; }
    body.tehranweb-about-template .tw-about-journey__item--3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--3 { --tw-m-left: 62.4%; --tw-m-top: 30.9%; --tw-m-width: 29.8%; }
    body.tehranweb-about-template .tw-about-journey__item--4,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item--4,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item--4 { --tw-m-left: 76.8%; --tw-m-top: 13.3%; --tw-m-width: 18.5%; }

    body.tehranweb-about-template .tw-about-journey__year,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__year,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__year {
        position: relative !important;
        display: block !important;
        margin: 0 0 8px !important;
        padding: 0 !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        color: #fff6d8 !important;
        font-size: clamp(10px, 3vw, 14px) !important;
        line-height: 1 !important;
        font-weight: 850 !important;
        white-space: nowrap !important;
        text-shadow: 0 2px 8px rgba(0,0,0,.96) !important;
        background: none !important;
    }

    body.tehranweb-about-template .tw-about-journey__icon,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        transform: none !important;
        z-index: 7 !important;
        width: 23px !important;
        height: 23px !important;
        margin: 0 auto 9px !important;
        padding: 0 !important;
        display: grid !important;
        place-items: center !important;
        color: #f2b72f !important;
        filter: drop-shadow(0 0 6px rgba(242,183,47,.22)) !important;
        background: none !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    body.tehranweb-about-template .tw-about-journey__icon svg,
    body.tehranweb-about-template .tw-about-journey__icon-image,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon svg,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__icon-image,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon svg,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__icon-image {
        width: 100% !important;
        height: 100% !important;
        display: block !important;
        stroke-width: 1.65 !important;
    }

    body.tehranweb-about-template .tw-about-journey__item h3,
    body.tehranweb-about-mobile .tw-about-journey .tw-about-journey__item h3,
    .tw-about-journey.tw-about-journey--mobile .tw-about-journey__item h3 {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        z-index: 8 !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: clamp(12px, 4.4vw, 19px) !important;
        line-height: 1.12 !important;
        font-weight: 900 !important;
        white-space: normal !important;
        text-wrap: balance !important;
        color: #ffffff !important;
        text-shadow: 0 2px 9px rgba(0,0,0,.96) !important;
        background: none !important;
        box-shadow: none !important;
        border: 0 !important;
    }
}


/* v0.7.6 — ACF desktop background is authoritative.
 * If tw_about_journey_background is populated in WordPress admin, the uploaded
 * image replaces every bundled fallback/background layer for desktop Journey.
 * Mobile is a separate frozen section and is intentionally unaffected.
 */
@media (min-width: 768px) {
    .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__visual::before,
    body.tehranweb-about-template .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__visual::before {
        display: none !important;
        content: none !important;
        background: none !important;
        opacity: 0 !important;
    }

    .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__background,
    body.tehranweb-about-template .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__background {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: absolute !important;
        inset: 0 !important;
        z-index: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        object-fit: cover !important;
        object-position: center center !important;
        filter: none !important;
        transform: none !important;
    }

    /* Prevent any old fallback layers from covering the ACF-selected image. */
    .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__mountains,
    .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__line-image,
    .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__glow,
    body.tehranweb-about-template .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__mountains,
    body.tehranweb-about-template .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__line-image,
    body.tehranweb-about-template .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__glow {
        display: none !important;
    }

    .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__shade,
    body.tehranweb-about-template .tw-about-journey.tw-about-journey--custom-bg .tw-about-journey__shade {
        display: block !important;
        visibility: visible !important;
    }
}


/* v0.10.3 — Journey desktop heading position ONLY.
   Move the title/subtitle group slightly lower, with no other visual changes. */
@media (min-width: 901px) {
    body.tehranweb-about-template .tw-about-journey__header {
        top: 4.6% !important;
    }
}
