:root {
            --cream: #E2E8CE;
            --editorial-red: #BF4646;
            --deep-rust: #A03A13;
            --navy: #1A3263;
            --forest-teal: #215E61;
            --text-dark: #111111;
            --white: #FFFFFF;
            --font-main: 'Inter', sans-serif;
        }

        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
            letter-spacing: -0.02em;
        }

        body {
            font-family: var(--font-main);
            background-color: #BF4646;
            color: var(--text-dark);
            overflow-x: hidden;
            -webkit-font-smoothing: antialiased;
        }

        /* --- TYPOGRAPHY UTILITIES --- */
        h1, h2, h3, h4 {
            font-weight: 400;
            line-height: 1.1;
            color: var(--text-dark);
        }

        .label-uppercase {
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: 0.2em;
            font-weight: 500;
            color: rgba(17, 17, 17, 0.6);
            display: block;
            margin-bottom: 15px;
        }

        .paragraph-block {
            font-size: 18px;
            line-height: 1.6;
            font-weight: 300;
            color: rgba(17, 17, 17, 0.85);
        }

        /* --- NAVIGATION & HAMBURGER --- */
        .editorial-nav {
            position: fixed;
            top: 0;
            left: 0;
            height: 100px;
            width: 100%;
            padding: 30px 50px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            z-index: 1000;
        }

.nav-logo{
    display:flex;
    align-items:center;
    cursor:pointer;
}

.nav-logo img{
    height:250px;
    width:auto;
    display:block;
    object-fit:contain;
}
        .hamburger {
            width: 30px;
            height: 16px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            cursor: pointer;
            z-index: 1001;
        }

        .hamburger span {
            width: 100%;
            height: 1px;
            background-color: var(--white);
            transition: transform 0.4s ease, opacity 0.4s ease;
        }

        .hamburger.active span:nth-child(1) {
            transform: translateY(7.5px) rotate(45deg);
        }

        .hamburger.active span:nth-child(2) {
            opacity: 0;
        }

        .hamburger.active span:nth-child(3) {
            transform: translateY(-7.5px) rotate(-45deg);
        }

        .menu-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100vh;
            background-color: var(--cream);
            z-index: 999;
            display: flex;
            flex-direction: column;
            justify-content: center;
            padding: 10% 8%;
            transform: translateY(-100%);
            transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
        }

        .menu-overlay.active {
            transform: translateY(0);
        }

        .menu-grid {
            display: grid;
            grid-template-columns: 2fr 1fr;
            align-items: flex-end;
        }

        .primary-links {
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .primary-links a {
            font-size: 5vw;
            color: var(--text-dark);
            text-decoration: none;
            font-weight: 300;
            line-height: 1;
            transition: padding-left 0.3s ease, color 0.3s ease;
        }

        .primary-links a:hover {
            padding-left: 20px;
            color: var(--editorial-red);
        }

        .secondary-links {
            display: flex;
            flex-direction: column;
            gap: 15px;
        }

        .secondary-links a {
            font-size: 16px;
            color: rgba(17, 17, 17, 0.6);
            text-decoration: none;
        }

        .secondary-links a:hover {
            color: var(--text-dark);
        }

        /* --- BUTTONS --- */
        .editorial-btn {
            display: inline-block;
            padding: 15px 40px;
            border: 1px solid var(--text-dark);
            background: transparent;
            color: var(--text-dark);
            text-transform: uppercase;
            font-size: 12px;
            letter-spacing: 0.15em;
            text-decoration: none;
            margin-top: 30px;
            transition: all 0.3s ease;
            cursor: pointer;
        }

        .editorial-btn:hover {
            background-color: var(--text-dark);
            color: var(--white);
        }

        /* --- VIEWPORT MANAGEMENT --- */
        .journal-page {
            display: none;
            width: 100%;
            position: relative;
        }

        .journal-page.active-view {
            display: block;
        }

        /* --- HOME: SECTION 1 (EDITORIAL HERO) --- */
        .hero-section {
            background-color: #BF4646;
            height: 100vh;
            display: grid;
            grid-template-columns: 1fr 2fr 1.5fr;
            padding: 140px 50px 50px 50px;
            gap: 40px;
            align-items: stretch;
        }

        .hero-left {
            display: flex;
            align-items: flex-start;
        }

        .vertical-label {
            writing-mode: vertical-rl;
            text-transform: uppercase;
            letter-spacing: 0.3em;
            font-size: 12px;
            color: rgba(17, 17, 17, 0.5);
        }

        .hero-center {
            display: flex;
            flex-direction: column;
            justify-content: center;
            max-width: 650px;
        }

        .hero-center h1 {
            font-size: clamp(32px, 4vw, 56px);
            margin-bottom: 40px;
            letter-spacing: -0.03em;
        }

        .hero-right {
            background-color: #d1d6bc; /* Fallback tonal block */
            background-size: cover;
            background-position: center;
            border-radius: 2px;
            filter: grayscale(1);
            transition: filter 0.5s ease;
            /* Placeholder premium documentary imagery represented via high-quality SVG gradient data URI */
            background-image: url("https://i.pinimg.com/736x/9f/c9/d1/9fc9d1672ce6f4d38af3d4d48d3b918d.jpg");
        }

        .hero-right:hover {
            filter: grayscale(0);
        }

        /* --- HOME: SECTION 2 (ASYMMETRICAL ESSAY) --- */
        .essay-section {
            background-color: var(--white);
            padding: 120px 50px;
            display: flex;
            gap: 80px;
            align-items: center;
        }

        .essay-image-block {
            width: 60%;
            height: 70vh;
            background-color: #f0f0f0;
            background-image: url("https://i.pinimg.com/736x/5d/9f/d3/5d9fd39c31f00577404141ee9d62647c.jpg");
            background-size: cover;
            background-position: center;
        }

        .essay-content-block {
            width: 40%;
            max-width: 450px;
        }

        .essay-content-block h2 {
            font-size: 36px;
            margin-bottom: 25px;
        }

        /* --- HOME: SECTION 3 (FULL WIDTH STATEMENT) --- */
        .statement-section {
            background-color: var(--navy);
            color: var(--cream);
            padding: 160px 50px;
            text-align: center;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .statement-quote {
            font-size: clamp(28px, 3.5vw, 48px);
            max-width: 900px;
            font-weight: 300;
            line-height: 1.3;
        }

        /* --- HOME: SECTION 4 (ALTERNATING ROWS) --- */
        .alternating-section {
            background-color: var(--white);
            padding: 120px 50px;
        }

        .alternating-row {
            display: flex;
            margin-bottom: 100px;
            align-items: center;
            gap: 80px;
        }

        .alternating-row:nth-child(even) {
            flex-direction: row-reverse;
        }

        .row-text {
            flex: 1;
            max-width: 500px;
        }

        .row-text h3 {
            font-size: 28px;
            margin-bottom: 20px;
        }
.row-img{
    flex:1.2;
    height:50vh;
    background-color:#fafafa;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}
        /* --- HOME: SECTION 5 (FLOATING OVERLAY BLOCK) --- */
        .fullscreen-overlay-section {
            height: 120vh;
            position: relative;
            background-image: url("https://i.pinimg.com/736x/69/16/c6/6916c64ee304a14d5b95998c65466aba.jpg");
            background-size: cover;
            background-position: center;
        }

        .floating-editorial-box {
            position: absolute;
            bottom: 80px;
            left: 80px;
            background-color: var(--editorial-red);
            color: var(--white);
            padding: 60px;
            max-width: 500px;
        }

        .floating-editorial-box h3 {
            color: var(--white);
            font-size: 32px;
            margin-bottom: 20px;
        }

        .floating-editorial-box p {
            color: rgba(255,255,255,0.9);
        }

        /* --- HOME: SPECIAL SECTION (THE READING WALL) --- */
        .reading-wall-section {
            background-color: var(--white);
            padding: 120px 0;
        }

        .wall-strip {
            height: 25vh;
            width: 100%;
            position: relative;
            background-size: cover;
            background-position: center;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            background-image: url("https://i.pinimg.com/736x/81/d9/4c/81d94c527fa182a80a7e1ca3daa7f6be.jpg");
        }

        .wall-overlay-title {
            font-size: 6vw;
            color: var(--text-dark);
            text-transform: uppercase;
            font-weight: 600;
            letter-spacing: 0.1em;
            opacity: 0.15;
            transition: opacity 0.4s ease;
        }

        .wall-strip:hover .wall-overlay-title {
            opacity: 0.8;
            color: var(--editorial-red);
        }

        /* --- HOME: SPECIAL SECTION (CHILDHOOD NOTES) --- */
        .childhood-notes-section {
            background-color: var(--editorial-red);
            color: var(--white);
            padding: 120px 50px;
        }

        .notes-grid {
            display: flex;
            flex-direction: column;
            gap: 120px;
            max-width: 1000px;
            margin: 0 auto;
        }

        .note-block {
            color: var(--white);
        }

        .note-block h3 {
            color: var(--white);
            font-size: 36px;
            margin-bottom: 20px;
        }

        .note-block p {
            color: rgba(255, 255, 255, 0.9);
        }

        .note-w-50 { width: 50%; }
        .note-w-70 { width: 70%; align-self: flex-end; }
        .note-w-60 { width: 60%; }
        .note-w-80 { width: 80%; align-self: flex-end; }

        /* --- LEARNING PAGE (ARCHIVE LAYOUT) --- */
        .learning-archive-section {
            padding: 140px 50px 100px 50px;
        }

        .learning-archive-section h1 {
            font-size: 64px;
            margin-bottom: 80px;
        }

        .archive-row {
            display: grid;
            grid-template-columns: 1.2fr 1fr;
            gap: 80px;
            margin-bottom: 140px;
            align-items: flex-start;
        }

        .archive-row:nth-child(even) {
            grid-template-columns: 1fr 1.2fr;
        }

.archive-img{
    height:65vh;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

/* Card 1 */
.archive-img-1{
    background-image:url('https://i.pinimg.com/736x/a8/70/52/a870528490bf94e3c28c158e35c2e624.jpg');
}

/* Card 2 */
.archive-img-2{
    background-image:url('https://i.pinimg.com/736x/b1/45/55/b14555a34af062d51dfd336c1013629d.jpg');
}

/* Card 3 */
.archive-img-3{
    background-image:url('https://i.pinimg.com/736x/78/80/23/7880237fd549b61c63d030cde321310c.jpg');
}

/* Card 4 */
.archive-img-4{
    background-image:url('https://i.pinimg.com/736x/52/f5/e6/52f5e672d7659090d4dbc0812ea71123.jpg');
}
        .archive-desc h2 {
            font-size: 32px;
            margin-bottom: 20px;
        }

        /* --- PROGRAMS PAGE (EDITORIAL CATALOGUE) --- */
        .programs-catalog-section {
            background-color: var(--cream);
            padding: 140px 50px 100px 50px;
        }

        .catalog-container {
            max-width: 900px;
            margin: 0 auto;
        }

        .catalog-block {
            margin-bottom: 120px;
            border-bottom: 1px solid rgba(17, 17, 17, 0.1);
            padding-bottom: 80px;
        }

        .catalog-block:last-child {
            border-bottom: none;
        }

.catalog-img{
    height:50vh;
    width:100%;
    margin-bottom:40px;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

.catalog-img-1{
    background-image:url('https://images.unsplash.com/photo-1516979187457-637abb4f9353?auto=format&fit=crop&w=1400&q=80');
}

.catalog-img-2{
    background-image:url('https://images.unsplash.com/photo-1509062522246-3755977927d7?auto=format&fit=crop&w=1400&q=80');
}

.catalog-img-3{
    background-image:url('https://images.unsplash.com/photo-1455390582262-044cdead277a?auto=format&fit=crop&w=1400&q=80');
}

.catalog-img-4{
    background-image:url('https://images.unsplash.com/photo-1522202176988-66273c2fd55f?auto=format&fit=crop&w=1400&q=80');
}        .catalog-block h2 {
            font-size: 38px;
            margin-bottom: 20px;
        }

        /* --- ABOUT PAGE (EDITORIAL TIMELINE) --- */
        .about-section {
            padding: 140px 50px;
        }

        .timeline-container {
            max-width: 800px;
            margin: 0 auto;
            position: relative;
        }

        .timeline-node {
            display: grid;
            grid-template-columns: 150px 1fr;
            gap: 40px;
            margin-bottom: 100px;
        }

        .timeline-year {
            font-size: 48px;
            font-weight: 300;
            color: var(--editorial-red);
            line-height: 1;
        }

        .timeline-content h3 {
            font-size: 24px;
            margin-bottom: 15px;
        }

        .timeline-spacer-img {
            height: 40vh;
            width: 100%;
            background-color: #f7f7f7;
            margin: 40px 0;
            background-image: url("https://i.pinimg.com/736x/d5/75/3e/d5753e5631b2ef5525bc0b1765ab64cf.jpg");
        }

        /* --- CONTACT PAGE (SPLIT PANEL) --- */
        .contact-section {
            background-color: var(--forest-teal);
            color: var(--white);
            min-height: 100vh;
            display: grid;
            grid-template-columns: 1fr 1fr;
            padding: 140px 50px;
            gap: 100px;
            align-items: center;
        }

        .contact-left h2 {
            color: var(--white);
            font-size: 48px;
            line-height: 1.2;
        }

        .contact-right form {
            display: flex;
            flex-direction: column;
            gap: 30px;
        }

        .editorial-field {
            display: flex;
            flex-direction: column;
            border-bottom: 1px solid rgba(255, 255, 255, 0.3);
            padding-bottom: 10px;
        }

        .editorial-field label {
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: 0.15em;
            color: rgba(255, 255, 255, 0.6);
            margin-bottom: 10px;
        }

        .editorial-field input, .editorial-field textarea {
            background: transparent;
            border: none;
            outline: none;
            color: var(--white);
            font-family: var(--font-main);
            font-size: 16px;
        }

        .contact-submit {
            align-self: flex-start;
            border-color: var(--white);
            color: var(--white);
        }

        .contact-submit:hover {
            background-color: var(--white);
            color: var(--forest-teal);
        }

        /* --- PRIVACY & TERMS PANELS --- */
        .legal-section {
            padding: 140px 50px;
            max-width: 800px;
            margin: 0 auto;
        }

        .legal-section h1 {
            font-size: 44px;
            margin-bottom: 40px;
        }

        .legal-section h3 {
            font-size: 20px;
            margin-top: 40px;
            margin-bottom: 15px;
        }

        .legal-section p {
            font-size: 16px;
            line-height: 1.7;
            color: rgba(17,17,17,0.8);
            margin-bottom: 20px;
        }

        /* --- FOOTER --- */
        .editorial-footer {
            background-color: var(--navy);
            color: var(--cream);
            padding: 100px 50px 40px 50px;
        }

        .footer-top {
            display: grid;
            grid-template-columns: 2fr repeat(3, 1fr);
            gap: 60px;
            border-bottom: 1px solid rgba(226, 232, 206, 0.1);
            padding-bottom: 60px;
            margin-bottom: 40px;
        }

        .footer-logo {
            font-size: 24px;
            font-weight: 600;
            letter-spacing: 0.05em;
            text-transform: uppercase;
        }

        .footer-col h4 {
            color: rgba(226, 232, 206, 0.4);
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: 0.15em;
            margin-bottom: 20px;
        }

        .footer-col ul {
            list-style: none;
        }

        .footer-col ul li {
            margin-bottom: 12px;
        }

        .footer-col ul li a {
            color: var(--cream);
            text-decoration: none;
            font-size: 14px;
            font-weight: 300;
        }

        .footer-col ul li a:hover {
            color: var(--editorial-red);
        }

        .newsletter-input-wrap {
            display: flex;
            border-bottom: 1px solid rgba(226, 232, 206, 0.3);
            padding-bottom: 5px;
        }

        .newsletter-input-wrap input {
            background: transparent;
            border: none;
            outline: none;
            color: var(--cream);
            font-family: var(--font-main);
            font-size: 14px;
            flex: 1;
        }

        .newsletter-btn {
            background: transparent;
            border: none;
            color: var(--cream);
            cursor: pointer;
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: 0.1em;
        }

        .footer-bottom-statement {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 13px;
            color: rgba(226, 232, 206, 0.5);
            font-weight: 300;
        }

        /* --- RESPONSIVE MEDIA QUERIES --- */
        @media (max-width: 968px) {
            .hero-section {
                grid-template-columns: 1fr;
                height: auto;
                padding-bottom: 80px;
            }
            .hero-right {
                display: none;
            }
            .vertical-label {
                writing-mode: horizontal-tb;
                margin-bottom: 30px;
            }
            .essay-section {
                flex-direction: column;
            }
            .essay-image-block, .essay-content-block {
                width: 100%;
            }
            .alternating-row {
                flex-direction: column !important;
            }
            .contact-section {
                grid-template-columns: 1fr;
                gap: 60px;
            }
            .footer-top {
                grid-template-columns: 1fr 1fr;
            }
            .note-w-50, .note-w-60, .note-w-70, .note-w-80 {
                width: 100%;
            }
            .archive-row {
                grid-template-columns: 1fr !important;
                gap: 40px;
            }
            .menu-grid {
                grid-template-columns: 1fr;
                gap: 50px;
            }
            .primary-links a {
                font-size: 32px;
            }
        }

.unsubscribe-wrap{
    margin-top:12px;
}

.unsubscribe-btn{
    opacity:.8;
}

.unsubscribe-btn:hover{
    opacity:1;
}