/* --- ULTRA-PREMIUM ARCHITECTURAL STYLING SYSTEM --- */
        :root {
            --bg-editorial: #F8DE22;
            --accent-industrial: #F77F00;
            --sheet-white: #FFFFFF;
            --ink-black: #050505;
            --font-display: "Bebas Neue", sans-serif;
            --font-editorial: "Courier Prime", monospace;
            --font-body: "Plus Jakarta Sans", sans-serif;
            --raw-border: 5px solid #050505;
            --fine-border: 2px solid #050505;
            --glass-backdrop: rgba(255, 255, 255, 0.15);
            --transition-kinetic: all 0.7s cubic-bezier(0.19, 1, 0.22, 1);
            --transition-snap: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
        }

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            user-select: none;
        }

        body {
            background-color: var(--bg-editorial);
            color: var(--ink-black);
            font-family: var(--font-body);
            overflow-x: hidden;
            -webkit-font-smoothing: antialiased;
        }

        /* --- DISPLAY DESIGN ENGINE --- */
        h1, h2, h3, h4, h5, .nav-item, .editorial-giant-num, .btn-action {
            font-family: var(--font-display);
            text-transform: uppercase;
            line-height: 0.85;
            letter-spacing: -0.01em;
            color: var(--ink-black);
        }

        p {
            font-size: 1.05rem;
            font-weight: 300;
            line-height: 1.7;
            color: rgba(5, 5, 5, 0.85);
        }

        /* --- NAVIGATION MANIFESTO --- */
        header {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 1000;
            padding: 2.5rem 4%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            transition: var(--transition-kinetic);
            background: transparent;
        }

        header.sticky-scrolled {
            background-color: var(--bg-editorial);
            padding: 1.2rem 4%;
            border-bottom: var(--fine-border);
        }

        .brand-logo {
            font-size: 2.5rem;
            cursor: pointer;
            font-weight: 900;
        }

        .brand-logo span {
            color: var(--accent-industrial);
            text-transform: uppercase;
            -webkit-text-stroke: 1px var(--ink-black);
        }

        .nav-center-menu {
            display: flex;
            gap: 4rem;
        }

        .nav-item {
            font-size: 1.5rem;
            position: relative;
            cursor: pointer;
            padding: 0.2rem 0;
        }

        .nav-item::after {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 0;
            width: 0;
            height: 3px;
            background-color: var(--ink-black);
            transition: var(--transition-kinetic);
        }

        .nav-item:hover::after, .nav-item.active-route::after {
            width: 100%;
        }

        .nav-right-action .btn-contact {
            background-color: var(--ink-black);
            color: var(--bg-editorial);
            border: var(--fine-border);
            padding: 0.8rem 2.2rem;
            font-family: var(--font-display);
            font-size: 1.3rem;
            cursor: pointer;
            transition: var(--transition-snap);
        }

        .nav-right-action .btn-contact:hover {
            background-color: var(--accent-industrial);
            color: var(--ink-black);
            transform: translateY(-2px);
        }

        /* Responsive Mobile Architecture */
        .hamburger-icon {
            display: none;
            flex-direction: column;
            gap: 7px;
            cursor: pointer;
            z-index: 1010;
            border: var(--fine-border);
            padding: 10px;
            background: var(--bg-editorial);
        }

        .hamburger-icon span {
            width: 32px;
            height: 3px;
            background-color: var(--ink-black);
            transition: var(--transition-snap);
        }

        /* --- SPA PANEL CONTROLLER --- */
        .spa-view-panel {
            display: none;
        }

        .spa-view-panel.active-view {
            display: block;
        }

        /* ========================================================= */
        /* --- CORE JOURNALISTIC SECTION COMPOSITIONS (HOME) ------- */
        /* ========================================================= */

        /* SECTION 1: FLOATING EDITORIAL HERO */
        .hero-diagonal-canvas {
            min-height: 100vh;
            position: relative;
            display: flex;
            align-items: center;
            overflow: hidden;
            padding-top: 100px;
        }

        .hero-diagonal-bg-txt {
            font-size: 18vw;
            position: absolute;
            width: 200%;
            text-align: center;
            transform: rotate(-8deg) translate(-10%, -5%);
            color: transparent;
            -webkit-text-stroke: 2px rgba(5, 5, 5, 0.08);
            z-index: 1;
            white-space: nowrap;
        }

        .hero-cutout-car {
            position: absolute;
            right: 5%;
            margin-top: -7rem;
            width: 55%;
            z-index: 3;
        }

        @keyframes floatingChassis {
            0%, 100% { transform: translateY(0px) rotate(0deg); }
            50% { transform: translateY(-20px) rotate(2deg); }
        }

        .hero-editorial-aside {
            position: relative;
            z-index: 4;
            max-width: 450px;
            margin-left: 8%;
            border-left: var(--raw-border);
            padding-left: 2.5rem;
        }

        .hero-editorial-aside p {
            font-family: var(--font-editorial);
            font-size: 1.1rem;
            margin-bottom: 2rem;
        }

        .hero-giant-watermark {
            position: absolute;
            bottom: -5rem;
            left: 2%;
            font-size: 25rem;
            opacity: 0.15;
            z-index: 2;
        }

        .hero-floating-tags {
            position: absolute;
            background-color: var(--accent-industrial);
            color: var(--ink-black);
            border: var(--fine-border);
            padding: 0.4rem 1.2rem;
            font-family: var(--font-display);
            font-size: 1.4rem;
            z-index: 5;
        }

        /* SECTION 2: INFINITE DIAGONAL IMAGE STRIP */
        .diagonal-strip-section {
            padding: 12rem 0;
            background: var(--ink-black);
            transform: rotate(-3deg) scale(1.05);
            overflow: hidden;
            display: flex;
            align-items: center;
            border-top: var(--raw-border);
            border-bottom: var(--raw-border);
        }

        .diagonal-strip-track {
            display: flex;
            gap: 6rem;
            white-space: nowrap;
            animation: continuousTrackMove 35s linear infinite;
        }

        @keyframes continuousTrackMove {
            0% { transform: translateX(0); }
            100% { transform: translateX(-50%); }
        }

        .strip-item-block {
            display: inline-flex;
            align-items: center;
            gap: 3rem;
        }

        .strip-item-block img {
            width: 450px;
            height: 300px;
            object-fit: cover;
            border: var(--raw-border);
            border-color: var(--bg-editorial);
        }

        .strip-item-block p {
            color: var(--bg-editorial);
            font-family: var(--font-editorial);
            white-space: normal;
            max-width: 300px;
        }

        /* SECTION 3: VERTICAL NEWSPAPER COLUMNS */
        .newspaper-columns-section {
            background-color: var(--accent-industrial);
            padding: 10rem 4%;
            display: flex;
            gap: 3rem;
            border-bottom: var(--raw-border);
        }

        .news-col {
            flex: 1;
            background: var(--bg-editorial);
            border: var(--raw-border);
            padding: 2.5rem;
            display: flex;
            flex-direction: column;
            position: relative;
        }

        .news-col:nth-child(even) {
            transform: translateY(4rem);
        }

        .news-col img {
            width: 100%;
            height: 220px;
            object-fit: cover;
            border: var(--fine-border);
            margin-bottom: 1.5rem;
        }

        .news-col h3 {
            font-size: 2.5rem;
            margin-bottom: 1rem;
        }

        .news-col p {
            font-size: 0.95rem;
            margin-bottom: 4rem;
        }

        .news-col-num {
            position: absolute;
            bottom: 1rem;
            right: 1.5rem;
            font-size: 4rem;
            opacity: 0.2;
        }

        /* SECTION 4: HUGE ROTATED FRAMES */
        .rotated-frames-section {
            padding: 15rem 4%;
            position: relative;
            min-height: 120vh;
        }

        .rotated-frame-container {
            position: relative;
            width: 100%;
            height: 700px;
        }

        .massive-rotated-frame {
            position: absolute;
            width: 420px;
            background: var(--sheet-white);
            border: var(--raw-border);
            padding: 1.5rem;
            box-shadow: 15px 15px 0px rgba(5,5,5,1);
            transition: var(--transition-kinetic);
            cursor: crosshair;
        }

        .massive-rotated-frame img {
            width: 100%;
            height: 280px;
            object-fit: cover;
            border: var(--fine-border);
        }

        .massive-rotated-frame h3 {
            font-size: 2.2rem;
            margin: 1rem 0 0.5rem 0;
        }

        .massive-rotated-frame blockquote {
            font-family: var(--font-editorial);
            font-style: italic;
            font-size: 0.9rem;
            border-left: 3px solid var(--accent-industrial);
            padding-left: 0.8rem;
            margin-top: 1rem;
        }

        .massive-rotated-frame:hover {
            transform: rotate(0deg) scale(1.05) !important;
            z-index: 50 !important;
        }

        /* SECTION 5: FULL FIXED WORKSHOP WITH CINEMATIC PANEL */
        .fixed-workshop-parallax {
            height: 90vh;
            background-image: linear-gradient(rgba(5,5,5,0.4), rgba(5,5,5,0.4)), url('https://i.pinimg.com/736x/74/7d/b2/747db2f9dedf98eb92eeedbd8472fbf3.jpg');
            background-attachment: fixed;
            background-position: center;
            background-size: cover;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            padding-right: 10%;
            border-top: var(--raw-border);
            border-bottom: var(--raw-border);
        }

        .floating-transparent-panel {
            background: rgba(248, 222, 34, 0.15);
            backdrop-filter: blur(15px);
            -webkit-backdrop-filter: blur(15px);
            border: var(--raw-border);
            border-color: var(--bg-editorial);
            padding: 4rem;
            max-width: 600px;
            color: var(--sheet-white);
            transform: translateY(2rem);
        }

        .floating-transparent-panel h2 {
            color: var(--bg-editorial);
            font-size: 4rem;
            margin-bottom: 1.5rem;
        }

        .floating-transparent-panel p {
            color: var(--sheet-white);
            font-size: 1.1rem;
        }

        /* SECTION 6: GIANT CIRCULAR EDITORIAL LAYOUT */
        .circular-editorial-section {
            padding: 12rem 4%;
            text-align: center;
            position: relative;
        }

        .circles-rotator-harness {
            display: flex;
            justify-content: center;
            gap: 4rem;
            flex-wrap: wrap;
            margin-top: 6rem;
        }

        .enormous-editorial-circle {
            width: 380px;
            height: 380px;
            border-radius: 50%;
            border: var(--raw-border);
            background: var(--sheet-white);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 3rem;
            position: relative;
            transition: var(--transition-kinetic);
        }

        .enormous-editorial-circle i {
            font-size: 3rem;
            color: var(--accent-industrial);
            margin-bottom: 1rem;
        }

        .enormous-editorial-circle h3 {
            font-size: 2.2rem;
            margin-bottom: 0.5rem;
        }

        .enormous-editorial-circle p {
            font-size: 0.9rem;
        }

        .circle-connector-line {
            position: absolute;
            top: 50%;
            left: 100%;
            width: 5rem;
            height: 5px;
            background: var(--ink-black);
            z-index: -1;
        }

        .enormous-editorial-circle:hover {
            transform: rotate(15deg);
            background: var(--accent-industrial);
        }

        /* SECTION 7: LARGE STAIRCASE LAYOUT */
        .staircase-layout-section {
            padding: 12rem 8%;
            display: flex;
            flex-direction: column;
            gap: 8rem;
        }

        .staircase-step {
            display: flex;
            flex-direction: column;
            max-width: 500px;
            position: relative;
        }

        .staircase-step img {
            width: 100%;
            height: 350px;
            object-fit: cover;
            border: var(--raw-border);
            box-shadow: 12px 12px 0px var(--ink-black);
        }

        .staircase-step h3 {
            font-size: 3.5rem;
            margin: 2rem 0 1rem 0;
        }

        .staircase-step:nth-child(1) { align-self: flex-start; }
        .staircase-step:nth-child(2) { align-self: center; transform: translateY(-4rem); }
        .staircase-step:nth-child(3) { align-self: flex-end; transform: translateY(-8rem); }

        /* SECTION 8: OVERSIZED HORIZONTAL TIMELINE */
        .horizontal-timeline-section {
            padding: 10rem 0;
            background: var(--ink-black);
            color: var(--bg-editorial);
            overflow-x: auto;
            border-top: var(--raw-border);
            border-bottom: var(--raw-border);
        }

        .timeline-horizontal-track {
            display: flex;
            padding: 0 10%;
            min-width: 1600px;
            justify-content: space-between;
            position: relative;
        }

        .timeline-horizontal-track::before {
            content: '';
            position: absolute;
            top: 40px;
            left: 0;
            width: 100%;
            height: 4px;
            background: var(--accent-industrial);
            z-index: 1;
        }

        .timeline-stop-node {
            position: relative;
            z-index: 2;
            width: 250px;
        }

        .node-indicator-dot {
            width: 80px;
            height: 80px;
            background: var(--bg-editorial);
            border: var(--fine-border);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-family: var(--font-display);
            font-size: 1.8rem;
            color: var(--ink-black);
            margin-bottom: 2rem;
        }

        .timeline-stop-node h4 {
            color: var(--sheet-white);
            font-size: 2rem;
            margin-bottom: 1rem;
        }

        .timeline-floating-img {
            width: 100%;
            height: 150px;
            object-fit: cover;
            border: var(--fine-border);
            border-color: var(--accent-industrial);
            margin-top: 1.5rem;
        }

        /* SECTION 9: LAYERED TRANSPARENT ARCYLIC CARDS */
        .layered-acrylic-section {
            background-color: var(--accent-industrial);
            padding: 12rem 4%;
            position: relative;
            min-height: 110vh;
        }

        .acrylic-stack-container {
            position: relative;
            max-width: 1000px;
            margin: 0 auto;
            height: 650px;
        }

        .layered-acrylic-card {
            position: absolute;
            width: 600px;
            background: rgba(255, 255, 255, 0.12);
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
            border: var(--raw-border);
            border-color: rgba(5,5,5,0.7);
            padding: 3.5rem;
            color: var(--ink-black);
            transition: var(--transition-kinetic);
        }

        .layered-acrylic-card .giant-card-num {
            font-family: var(--font-display);
            font-size: 5rem;
            position: absolute;
            top: 1rem;
            right: 2rem;
            opacity: 0.25;
        }

        .layered-acrylic-card h3 {
            font-size: 3rem;
            margin-bottom: 1rem;
        }

        .layered-acrylic-card p {
            font-family: var(--font-editorial);
        }

        .layered-acrylic-card:hover {
            background: var(--sheet-white);
            transform: scale(1.03) translate(-10px, -10px);
            z-index: 40 !important;
        }

        /* SECTION 10: EDITORIAL MOSAIC COLLAGE */
        .editorial-mosaic-section {
            padding: 12rem 4%;
        }

        .mosaic-container-grid {
            display: grid;
            grid-template-columns: repeat(12, 1fr);
            gap: 2.5rem;
            grid-auto-flow: dense;
        }

        .mosaic-tile {
            border: var(--raw-border);
            background: var(--sheet-white);
            overflow: hidden;
            position: relative;
        }

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

        .tile-wide { grid-column: span 8; height: 400px; }
        .tile-square { grid-column: span 4; height: 400px; }
        .tile-tall { grid-column: span 4; grid-row: span 2; height: 650px; }
        .tile-tiny { grid-column: span 4; height: 250px; }
        .tile-medium { grid-column: span 4; height: 350px; }

        /* SECTION 11: OFFSET ASYMMETRICAL SPLIT LAYOUT */
        .offset-split-section {
            padding: 12rem 6%;
            position: relative;
        }

        .offset-text-block {
            max-width: 550px;
            margin-bottom: 4rem;
        }

        .offset-text-block h2 {
            font-size: 5rem;
            margin-bottom: 1.5rem;
        }

        .offset-image-wrap {
            margin-left: 35%;
            width: 65%;
            position: relative;
            border: var(--raw-border);
        }

        .offset-image-wrap img {
            width: 100%;
            height: 600px;
            object-fit: cover;
            display: block;
        }

        .floating-overlay-paragraph {
            position: absolute;
            bottom: -5rem;
            left: -15%;
            background: var(--sheet-white);
            border: var(--raw-border);
            padding: 3rem;
            max-width: 420px;
            box-shadow: 15px 15px 0px var(--ink-black);
        }

        /* SECTION 12: GIANT BACKGROUND SERVICE NUMBERS */
        .giant-numbers-section {
            padding: 12rem 4%;
            position: relative;
            overflow: hidden;
        }

        .number-flow-block {
            position: relative;
            margin-bottom: 12rem;
            padding-left: 20%;
        }

        .flow-giant-bg-num {
            position: absolute;
            left: 0;
            top: -4rem;
            font-size: 16rem;
            color: var(--accent-industrial);
            line-height: 0.8;
            z-index: 1;
            opacity: 0.8;
        }

        .flow-content-panel {
            position: relative;
            z-index: 2;
            max-width: 650px;
        }

        .flow-content-panel h3 {
            font-size: 3.5rem;
            margin-bottom: 1rem;
        }

        /* SECTION 13: ZIGZAG STORY LAYOUT */
        .zigzag-story-section {
            padding: 12rem 4%;
        }

        .story-block-node {
            display: flex;
            align-items: center;
            gap: 8rem;
            margin-bottom: 15rem;
        }

        .story-block-node:nth-child(even) {
            flex-direction: row-reverse;
        }

        .story-media-pane {
            width: 50%;
            border: var(--raw-border);
        }

        .story-media-pane img {
            width: 100%;
            height: 500px;
            object-fit: cover;
            display: block;
        }

        .story-text-pane {
            width: 50%;
        }

        .story-text-pane blockquote {
            font-family: var(--font-editorial);
            font-size: 1.8rem;
            line-height: 1.4;
            margin-bottom: 2rem;
            border-left: 6px solid var(--ink-black);
            padding-left: 1.5rem;
        }

        /* SECTION 14: INTERACTIVE WORKSHOP BOARD */
        .workshop-board-section {
            padding: 12rem 4%;
            background-color: var(--ink-black);
            color: var(--sheet-white);
            border-top: var(--raw-border);
            border-bottom: var(--raw-border);
        }

        .board-canvas-grid {
            position: relative;
            height: 800px;
            background: #111;
            border: var(--raw-border);
            border-color: var(--bg-editorial);
            overflow: hidden;
        }

        .pinned-note-item {
            position: absolute;
            background: var(--sheet-white);
            color: var(--ink-black);
            padding: 2rem;
            border: var(--fine-border);
            width: 280px;
            box-shadow: 8px 8px 0px rgba(0,0,0,0.3);
            cursor: move;
            transition: transform 0.3s ease;
        }

        .pinned-note-item img {
            width: 100%;
            height: 150px;
            object-fit: cover;
            border: var(--fine-border);
            margin-top: 1rem;
        }

        .pinned-note-item::before {
            content: '';
            position: absolute;
            top: -10px;
            left: 50%;
            transform: translateX(-50%);
            width: 35px;
            height: 12px;
            background: rgba(247, 127, 0, 0.7);
        }

        .pinned-note-item:hover {
            transform: rotate(0deg) scale(1.05) !important;
            z-index: 99;
        }

        /* SECTION 15: LARGE AUTO JOURNAL MAGAZINE SPREAD */
        .magazine-journal-spread {
            padding: 15rem 8%;
            background: var(--sheet-white);
            border-bottom: var(--raw-border);
        }

        .magazine-masthead-title {
            font-size: 8rem;
            text-align: center;
            border-bottom: 4px double var(--ink-black);
            padding-bottom: 2rem;
            margin-bottom: 4rem;
        }

        .magazine-columns-layout {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 6rem;
        }

        .magazine-main-article {
            border-right: var(--fine-border);
            padding-right: 4rem;
        }

        .magazine-pullquote-block {
            font-family: var(--font-editorial);
            font-size: 2.5rem;
            line-height: 1.2;
            font-weight: 700;
            margin: 3rem 0;
            text-transform: uppercase;
            color: var(--accent-industrial);
        }

        .magazine-photography-frame {
            border: var(--raw-border);
            margin-bottom: 3rem;
        }

        .magazine-photography-frame img {
            width: 100%;
            height: 500px;
            object-fit: cover;
            display: block;
        }

        .magazine-sidebar-callouts {
            display: flex;
            flex-direction: column;
            gap: 4rem;
        }

        .editorial-callout-node {
            border-bottom: var(--fine-border);
            padding-bottom: 2rem;
        }

        .editorial-callout-node h4 {
            font-size: 2rem;
            margin-bottom: 0.8rem;
        }

        /* SECTION 16: FLOATING SUBSCRIBE BLOCK */
        .floating-subscribe-section {
            background-color: var(--accent-industrial);
            padding: 10rem 4%;
            display: flex;
            justify-content: center;
        }

        .floating-white-panel {
            background: var(--sheet-white);
            border: var(--raw-border);
            width: 100%;
            max-width: 1100px;
            padding: 5rem;
            box-shadow: 25px 25px 0px var(--ink-black);
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
        }

        .subscribe-form-side form {
            display: flex;
            flex-direction: column;
            gap: 1.5rem;
        }

        .subscribe-form-side input[type="email"] {
            width: 100%;
            border: var(--raw-border);
            padding: 1.2rem;
            font-family: var(--font-body);
            font-size: 1.1rem;
        }

        .btn-form-action {
            background: var(--ink-black);
            color: var(--bg-editorial);
            border: none;
            padding: 1.2rem;
            font-family: var(--font-display);
            font-size: 1.5rem;
            cursor: pointer;
            transition: var(--transition-snap);
        }

        .btn-form-action:hover {
            background: var(--accent-industrial);
            color: var(--ink-black);
        }

        .unsubscribe-trigger-link {
            display: inline-block;
            margin-top: 2rem;
            font-family: var(--font-editorial);
            font-size: 0.9rem;
            color: rgba(5,5,5,0.6);
            cursor: pointer;
            text-decoration: underline;
        }

        /* ========================================================= */
        /* --- INTERNAL EDITORIAL PAGES (SPA VIEWS) ---------------- */
        /* ========================================================= */
        .view-hero-banner {
            background: var(--accent-industrial);
            padding: 14rem 4% 6rem 4%;
            border-bottom: var(--raw-border);
        }

        .view-hero-banner h1 {
            font-size: 8rem;
        }

        /* Auto Care Layouts */
        .care-gallery-diagonal {
            padding: 8rem 4%;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 4rem;
        }

        /* Services Layouts */
        .services-staircase-grid {
            padding: 8rem 4%;
            display: flex;
            flex-direction: column;
            gap: 6rem;
        }

        /* Workshop Layouts */
        .workshop-pinned-board {
            padding: 6rem 4%;
        }

        /* Articles Layouts */
        .articles-newspaper-masonry {
            padding: 8rem 4%;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 2.5rem;
        }

        /* Contact Layouts */
        .contact-composition-grid {
            padding: 8rem 4%;
            display: grid;
            grid-template-columns: 1.2fr 1fr;
            gap: 6rem;
        }

        .contact-card-panel {
            background: var(--sheet-white);
            border: var(--raw-border);
            padding: 4rem;
            box-shadow: 15px 15px 0px var(--ink-black);
        }

        .form-input-group {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
            margin-bottom: 2rem;
        }

        .form-input-group label {
            font-family: var(--font-display);
            font-size: 1.3rem;
        }

        .form-input-group input, .form-input-group textarea {
            border: var(--fine-border);
            padding: 1rem;
            font-family: var(--font-body);
            font-size: 1rem;
            background: transparent;
        }

        /* --- THE CLEAN MINIMALIST FOOTER --- */
        footer {
            background-color: var(--ink-black);
            color: var(--bg-editorial);
            padding: 3rem 4%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-top: var(--fine-border);
        }

        .footer-nav-links {
            display: flex;
            gap: 3rem;
            font-family: var(--font-display);
            font-size: 1.3rem;
        }

        .footer-nav-links span {
            cursor: pointer;
            transition: var(--transition-snap);
        }

        .footer-nav-links span:hover {
            color: var(--sheet-white);
        }

        .footer-legal-panel {
            display: flex;
            gap: 2rem;
            font-size: 0.9rem;
            font-family: var(--font-body);
            opacity: 0.7;
        }

        .footer-legal-panel span {
            cursor: pointer;
        }

        .footer-legal-panel span:hover {
            text-decoration: underline;
        }

        /* ========================================================= */
        /* --- RESPONSIVE ADAPTABILITY MATRIX ---------------------- */
        /* ========================================================= */
        @media (max-width: 1200px) {
            .hero-diagonal-canvas { flex-direction: column; text-align: center; padding-bottom: 6rem; }
            .hero-cutout-car { position: relative; width: 80%; right: 0; margin-top: 4rem; }
            .hero-editorial-aside { margin-left: 4%; max-width: 90%; border-left: none; border-top: var(--raw-border); padding-left: 0; padding-top: 2rem; }
            .newspaper-columns-section, .circles-rotator-harness, .mosaic-container-grid, .story-block-node, .magazine-columns-layout, .floating-white-panel, .care-gallery-diagonal, .articles-newspaper-masonry, .contact-composition-grid { grid-template-columns: 1fr; flex-direction: column; gap: 4rem; }
            .news-col:nth-child(even), .staircase-step { transform: none !important; align-self: flex-start !important; max-width: 100%; }
            .massive-rotated-frame, .layered-acrylic-card { position: relative; width: 100%; top: 0 !important; left: 0 !important; transform: none !important; margin-bottom: 2rem; }
            .rotated-frame-container, .acrylic-stack-container { height: auto; }
            .offset-image-wrap { margin-left: 0; width: 100%; }
            .floating-overlay-paragraph { position: relative; bottom: 0; left: 0; margin-top: 2rem; max-width: 100%; }
            .story-media-pane, .story-text-pane, .magazine-main-article { width: 100%; padding-right: 0; border-right: none; }
            .number-flow-block { padding-left: 0; }
            .flow-giant-bg-num { position: relative; top: 0; font-size: 8rem; }
        }

        @media (max-width: 768px) {
            .nav-center-menu, .nav-right-action { display: none; }
            .hamburger-icon { display: flex; }

            .nav-center-menu.drawer-active {
                display: flex;
                flex-direction: column;
                position: absolute;
                top: 100%; left: 0; width: 100%;
                background-color: var(--bg-editorial);
                padding: 3rem;
                border-bottom: var(--raw-border);
                gap: 2rem;
                z-index: 1005;
            }

            .view-hero-banner h1, .magazine-masthead-title { font-size: 4rem; }
            footer { flex-direction: column; gap: 2rem; text-align: center; }
            .footer-nav-links, .footer-legal-panel { flex-direction: column; gap: 1rem; }
        }