:root {
    /* 
      "The Grounded Journey" Aesthetic Palette 
      Solid, earthy, structured, reliable.
    */
    --bg-main: #F4EBE1; /* Slightly richer warm clay/sand (v4) */
    --text-dark: #1F2522; /* Deeper forest slate (v4) */
    --text-muted: #5C635D;
    
    --brand-terracotta: #D56942; /* More vivid terracotta (v4) */
    --brand-action: #A64E2E; /* Darker shade for WCAG AA text contrast */
    --brand-forest: #3A4F41;     /* Richer density (v4) */
    --brand-accent: #E3B062;     /* Subtle warm ochre accent (v4) */
    
    --card-bg: #FFFFFF;
    --dark-section-bg: #1C2423; /* Darker, more grounded background (v4) */
    
    /* Modern Geometric Typography */
    --font-main: 'Outfit', sans-serif;
    
    --space-sm: 1.5rem;
    --space-md: 3rem;
    --space-lg: 5rem;
    --space-xl: 8rem;
    
    --grid-max-width: 1200px;
}

/* Base Reset & Configuration */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    background-color: var(--bg-main);
    color: var(--text-dark);
    font-family: var(--font-main);
    font-size: clamp(1.125rem, 1.3vw, 1.25rem); /* Fluid scaling with v3's 18px baseline */
    font-weight: 400;
    line-height: 1.7; /* Restored v3 line height */
    -webkit-font-smoothing: antialiased;
}

body::after {
    content: "";
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='woodgrain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.01 0.1' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23woodgrain)' opacity='0.04'/%3E%3C/svg%3E");
    pointer-events: none;
    z-index: 9999;
}

/* =========================================================================
   TYPOGRAPHY
   ========================================================================= */
h1, h2, h3, blockquote {
    font-weight: 600;
    line-height: 1.2;
    color: var(--text-dark);
}

.main-title {
    font-size: clamp(2.3rem, 6.5vw, 4.5rem);
    line-height: 1.15;
    letter-spacing: -0.03em;
    font-weight: 600;
    margin-bottom: 4.5rem;
    color: var(--text-dark);
}

.section-title {
    font-size: clamp(2.2rem, 4vw, 3rem);
    letter-spacing: -0.02em;
    margin-bottom: 1.5rem;
}

.statement-title {
    font-size: clamp(1.8rem, 3vw, 2.4rem);
    margin-bottom: 1rem;
}

.subtitle {
    font-size: 1.35rem;
    font-weight: 500;
    color: var(--brand-terracotta);
    margin-bottom: 1.5rem;
}

.sub-title {
    font-size: 1.25rem;
    color: var(--text-muted);
}

.body-text, p {
    color: var(--text-dark);
    margin-bottom: 1.5rem; /* Restored v3 spacing */
}

p:last-child {
    margin-bottom: 0;
}

/* Utility Classes */
.text-center { text-align: center; }
.text-light { color: #FFFFFF !important; }
.text-light p, .text-light.body-text { color: rgba(255, 255, 255, 0.9) !important; opacity: 0.9; }
.text-light h2, .text-light h3 { color: #FFFFFF !important; }

.mx-auto { margin-left: auto; margin-right: auto; }
.mt-sm { margin-top: var(--space-sm); }
.mt-md { margin-top: var(--space-md); }
.mt-lg { margin-top: var(--space-lg); }
.mt-xl { margin-top: var(--space-xl); }
.mb-sm { margin-bottom: var(--space-sm); }
.mb-md { margin-bottom: var(--space-md); }
.my-lg { margin-top: var(--space-lg); margin-bottom: var(--space-lg); }

.note { font-size: 0.95rem; opacity: 0.7; }
.narrow-text-block { max-width: 580px; }

/* =========================================================================
   LAYOUT & GRID STRUCTURE
   ========================================================================= */
.page-container {
    padding-top: 6vh;
    padding-bottom: 10vh;
}

.section {
    padding: var(--space-xl) 5vw var(--space-lg); /* Ensure sections have breathing room at bottom too */
}

.grid-container {
    max-width: var(--grid-max-width);
    margin: 0 auto;
}

.split-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
}

.align-center { align-items: center; }

@media (max-width: 900px) {
    .split-grid { grid-template-columns: 1fr; gap: 2rem; }
}

/* =========================================================================
   HERO & FUNCTIONAL SHAPE MOVEMENT (PENDULATION)
   ========================================================================= */
.hero-section {
    padding: 10vh 5vw 0;
}

.hero-content-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: stretch;
}

.hero-text {
    max-width: 600px;
}

/* =========================================================================
   ANIMATION: THE WINDOW OF TOLERANCE (HERO)
   ========================================================================= */
#seismo-svg {
    animation: movie-fade 30s linear infinite;
}
#scroll-path-group {
    animation: scroll-path-movie 30s linear infinite;
    will-change: transform;
}
#movie-window-top {
    animation: scroll-window-top 30s linear infinite;
    will-change: transform;
}
#movie-window-bottom {
    animation: scroll-window-bottom 30s linear infinite;
    will-change: transform;
}
#scroll-observer-dot {
    animation: scroll-dot-movie 30s linear infinite;
    will-change: transform;
}
#label-seq-1 {
    animation: seq-1-fade 30s linear infinite;
    will-change: opacity;
}
#label-seq-2 {
    animation: seq-2-fade 30s linear infinite;
    will-change: opacity;
}
#label-seq-3 {
    animation: seq-3-fade 30s linear infinite;
    will-change: opacity;
}

@keyframes movie-fade {
    0%      { opacity: 0; }
    2%      { opacity: 1; }
    98%     { opacity: 1; }
    100%    { opacity: 0; }
}

@keyframes scroll-path-movie {
    0%   { transform: translateX(400px); }
    100% { transform: translateX(-440px); }
}

@keyframes scroll-window-top {
    0%      { transform: translateY(0px); opacity: 1; }
    38.09%  { transform: translateY(0px); animation-timing-function: ease-in-out; }
    52.38%  { transform: translateY(-60px); }
    98%     { transform: translateY(-60px); opacity: 1; }
    99%     { transform: translateY(-60px); opacity: 0; }
    99.1%   { transform: translateY(0px); opacity: 0; }
    100%    { transform: translateY(0px); opacity: 1; }
}

@keyframes scroll-window-bottom {
    0%      { transform: translateY(0px); opacity: 1; }
    38.09%  { transform: translateY(0px); animation-timing-function: ease-in-out; }
    52.38%  { transform: translateY(60px); }
    98%     { transform: translateY(60px); opacity: 1; }
    99%     { transform: translateY(60px); opacity: 0; }
    99.1%   { transform: translateY(0px); opacity: 0; }
    100%    { transform: translateY(0px); opacity: 1; }
}

@keyframes scroll-dot-movie {
    /* Seq 1 */
    0%     { transform: translateY(0px); animation-timing-function: ease-in-out; }
    3.57%  { transform: translateY(100px); animation-timing-function: ease-in-out; }
    7.14%  { transform: translateY(-100px); animation-timing-function: linear; }
    10.71% { transform: translateY(-100px); animation-timing-function: ease-in-out; }
    13.09% { transform: translateY(120px); animation-timing-function: linear; }
    17.85% { transform: translateY(120px); animation-timing-function: ease-in-out; }
    21.42% { transform: translateY(-120px); animation-timing-function: ease-in-out; }
    27.38% { transform: translateY(0px); animation-timing-function: ease-in-out; }
    30.95% { transform: translateY(80px); animation-timing-function: linear; }
    34.52% { transform: translateY(80px); animation-timing-function: ease-in-out; }
    38.09% { transform: translateY(0px); animation-timing-function: ease-in-out; }

    /* Seq 2 */
    41.66% { transform: translateY(60px); animation-timing-function: ease-in-out; }
    45.23% { transform: translateY(0px); animation-timing-function: ease-in-out; }
    48.80% { transform: translateY(-60px); animation-timing-function: ease-in-out; }
    52.38% { transform: translateY(0px); animation-timing-function: ease-in-out; }

    /* Seq 3 */
    57.14% { transform: translateY(-80px); animation-timing-function: ease-in-out; }
    66.66% { transform: translateY(80px); animation-timing-function: ease-in-out; }
    76.19% { transform: translateY(-80px); animation-timing-function: ease-in-out; }
    85.71% { transform: translateY(80px); animation-timing-function: ease-in-out; }
    95.23% { transform: translateY(-80px); animation-timing-function: ease-in-out; }
    100%   { transform: translateY(0px); }
}

@keyframes seq-1-fade {
    0%    { opacity: 0; }
    2%    { opacity: 1; }
    35%   { opacity: 1; }
    38%   { opacity: 0; }
    100%  { opacity: 0; }
}

@keyframes seq-2-fade {
    0%    { opacity: 0; }
    38%   { opacity: 0; }
    40%   { opacity: 1; }
    50%   { opacity: 1; }
    52%   { opacity: 0; }
    100%  { opacity: 0; }
}

@keyframes seq-3-fade {
    0%    { opacity: 0; }
    53%   { opacity: 0; }
    55%   { opacity: 1; }
    96%   { opacity: 1; }
    98%   { opacity: 0; }
    100%  { opacity: 0; }
}

/* =========================================================================
   ANIMATION: THE PENDULATION BREATH 3-1-7 (SOMATIC DIFFERENCE)
   ========================================================================= */

.anim-aura {
    transform-origin: 250px 250px;
    animation: pulse-aura 12s infinite;
    will-change: transform, opacity;
}

.anim-outer-ring {
    transform-origin: 250px 250px;
    animation: rotate-slow 24s linear infinite;
    will-change: transform;
}

.anim-inner-ring {
    transform-origin: 250px 250px;
    animation: pulse-ring-deep 12s infinite;
    will-change: transform;
}

.anim-core-dot-group {
    transform-origin: 250px 250px;
    animation: pendulate-dot 12s infinite;
    will-change: transform;
}

#label-inhale { animation: inhale-fade 12s infinite; }
#label-hold { animation: hold-fade 12s infinite; }
#label-exhale { animation: exhale-fade 12s infinite; }

/* 12s Master Loop Keyframes (3s Inhale, 1s Hold, 7s Exhale, 1s Rest) */

@keyframes rotate-slow {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes pulse-aura {
    0%      { transform: scale(0.6); opacity: 0; animation-timing-function: ease-in-out; }
    25%     { transform: scale(1.1); opacity: 1; }
    33.33%  { transform: scale(1.1); opacity: 1; animation-timing-function: ease-in-out; }
    91.66%  { transform: scale(0.6); opacity: 0; }
    100%    { transform: scale(0.6); opacity: 0; }
}

@keyframes pulse-ring-deep {
    0%      { transform: scale(0.85); stroke-width: 4px; opacity: 0.9; animation-timing-function: ease-in-out; }
    25%     { transform: scale(1.35); stroke-width: 1.5px; opacity: 0.3; }
    33.33%  { transform: scale(1.35); stroke-width: 1.5px; opacity: 0.3; animation-timing-function: ease-in-out; }
    91.66%  { transform: scale(0.85); stroke-width: 4px; opacity: 0.9; }
    100%    { transform: scale(0.85); stroke-width: 4px; opacity: 0.9; }
}

@keyframes pendulate-dot {
    0%      { transform: translateX(0); animation-timing-function: ease-in-out; }
    25%     { transform: translateX(160px); } 
    33.33%  { transform: translateX(160px); animation-timing-function: ease-in-out; }
    91.66%  { transform: translateX(0); } 
    100%    { transform: translateX(0); } 
}

@keyframes inhale-fade {
    0%    { opacity: 0; }
    2%    { opacity: 1; }
    23%   { opacity: 1; }
    25%   { opacity: 0; }
    100%  { opacity: 0; }
}

@keyframes hold-fade {
    0%    { opacity: 0; }
    25%   { opacity: 0; }
    27%   { opacity: 1; }
    31%   { opacity: 1; }
    33.33%{ opacity: 0; }
    100%  { opacity: 0; }
}

@keyframes exhale-fade {
    0%    { opacity: 0; }
    33.33%{ opacity: 0; }
    35%   { opacity: 1; }
    89%   { opacity: 1; }
    91.66%{ opacity: 0; }
    100%  { opacity: 0; }
}

/* =========================================================================
   TESTIMONIAL: THE PROPORTIONAL CARD STYLE
   ========================================================================= */
.testimonial-solid {
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    padding: 1.5rem; /* Thin padding to frame the screenshot perfectly */
    border-radius: 12px;
    border: 1px solid rgba(47, 54, 48, 0.05);
    box-shadow: 0 4px 12px rgba(47, 54, 48, 0.02), 0 16px 48px rgba(47, 54, 48, 0.05);
    max-width: 600px; /* Matches the visual width of the quote above */
    margin: 0 auto;
}

.testimonial-solid-image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 4px; /* Slight inner rounding if needed, or 0 if pure blend */
}

@media (max-width: 900px) {
    .testimonial-solid {
        padding: 1rem;
    }
    .hero-content-split { grid-template-columns: 1fr; text-align: center; gap: 4rem; }
    .hero-text { margin: 0 auto; }
}

/* =========================================================================
   UI ELEMENTS & CARDS
   ========================================================================= */
.solid-btn {
    display: inline-block;
    padding: 1.25rem 2.5rem;
    background-color: var(--brand-action);
    color: #FFFFFF;
    text-decoration: none;
    border-radius: 4px; /* Grounded, slightly sharp edges */
    font-weight: 600;
    font-size: 1rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.solid-btn:hover {
    background-color: #BA5834;
    transform: translateY(-2px);
}

.solid-card {
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    padding: 4rem;
    border-radius: 12px;
    border: 1px solid rgba(47, 54, 48, 0.05);
    box-shadow: 0 4px 12px rgba(47, 54, 48, 0.02), 0 12px 48px rgba(47, 54, 48, 0.04);
}

.narrative-card {
    max-width: 800px;
    margin: 0 auto;
    text-align: left; /* Shift from center to left alignment for better reading of dense text */
}

.narrative-card .section-title {
    max-width: 600px; /* Keep title relatively constrained */
    margin-bottom: 2rem;
}

/* Visual Break */
.visual-break blockquote {
    font-size: clamp(2.2rem, 4vw, 3.5rem);
    text-align: center;
    max-width: 900px;
    margin: 0 auto;
}

.highlight {
    color: var(--brand-terracotta);
}

/* Cards Grid (Process & Testimonials) */
.cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2.5rem;
}

.info-card {
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    padding: 3rem;
    border-radius: 12px;
    border: 1px solid rgba(47, 54, 48, 0.05);
    border-top: 4px solid var(--brand-forest);
    box-shadow: 0 4px 12px rgba(47, 54, 48, 0.02), 0 12px 32px rgba(47, 54, 48, 0.03);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.info-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(47, 54, 48, 0.04), 0 24px 64px rgba(47, 54, 48, 0.06);
}

.card-number {
    font-size: 3rem;
    font-weight: 700;
    color: var(--bg-main);
    text-shadow: -1px -1px 0 var(--brand-forest), 1px -1px 0 var(--brand-forest), -1px 1px 0 var(--brand-forest), 1px 1px 0 var(--brand-forest);
    margin-bottom: 1rem;
    line-height: 1;
}

.quote-text {
    font-style: italic;
    margin-bottom: 1.5rem;
}

.info-card cite {
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-style: normal;
    color: var(--brand-action);
}

/* Lists */
.structured-list {
    list-style: none;
}

.structured-list li {
    margin-bottom: 1rem;
    padding-left: 2rem;
    position: relative;
}

.structured-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    width: 10px;
    height: 10px;
    background-color: var(--brand-terracotta);
    border-radius: 2px;
}

.text-light .structured-list li::before {
    background-color: #FFFFFF;
}

/* Dark Sections */
.dark-section {
    background-color: var(--dark-section-bg);
    padding: var(--space-xl) 5vw;
    margin-top: var(--space-xl);
    position: relative;
    z-index: 10000;
}

/* Offer Section */
.offer-card {
    background-color: var(--card-bg);
    border-radius: 12px; /* Slightly larger radius */
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(47, 54, 48, 0.04); /* Softer shadow */
}

.offer-header {
    background-color: var(--brand-forest);
    padding: 5rem 12%; /* Slightly more internal padding */
    color: #FFFFFF;
    text-align: center;
    border-top: 6px solid var(--brand-terracotta); /* Subtle accent line */
}

.offer-header h2, .offer-header p {
    color: #FFFFFF;
}

.offer-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    padding: 4rem 10%;
}

.investment-box {
    background-color: var(--bg-main);
    padding: 2.5rem;
    border-radius: 8px;
    margin-top: 2rem;
}

@media (max-width: 768px) {
    .offer-body { grid-template-columns: 1fr; gap: 3rem; }
    .solid-card { padding: 3rem 1.5rem; }
    .offer-body { padding: 3rem 1.5rem; }
}

/* Callout Block */
.callout-block {
    padding: 2.5rem;
    background-color: var(--bg-main);
    border-left: 6px solid var(--brand-terracotta);
    text-align: left;
}

.callout-block p {
    font-size: 1.8rem;
    font-weight: 600;
    color: var(--text-dark);
    margin: 0;
}

/* Guide Image */
.profile-image {
    width: 100%;
    max-width: 450px;
    height: auto;
    display: block;
    border-radius: 8px;
    box-shadow: -15px 15px 0 var(--brand-terracotta);
}

/* FAQ Accordion */
.faq-wrapper {
    max-width: 800px;
    margin: 0 auto;
}

.faq-item {
    margin-bottom: 1rem;
}

.faq-btn {
    width: 100%;
    text-align: left;
    background-color: var(--card-bg);
    border: none;
    padding: 1.5rem 2rem;
    font-family: var(--font-main);
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--text-dark);
    cursor: pointer;
    border-radius: 4px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 2px 10px rgba(47, 54, 48, 0.03);
    transition: background-color 0.3s ease;
    gap: 1rem;
}

.faq-btn:hover {
    background-color: #FAFAFA;
}

.faq-btn::after {
    content: '+';
    font-size: 1.5rem;
    color: var(--brand-action);
    transition: transform 0.3s ease;
    flex: 0 0 auto;
}

.faq-btn.active::after {
    transform: rotate(45deg);
}

.faq-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
}

.faq-content p {
    padding: 1.5rem 2rem;
    margin: 0;
}

/* Footer Divider */
.solid-divider {
    width: 80px;
    height: 4px;
    background-color: var(--brand-forest);
    border: none;
    margin: var(--space-xl) auto;
}

/* =========================================================================
   STICKY HEADER
   ========================================================================= */
.sticky-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    padding: 8px 5vw;
    background-color: rgba(243, 239, 233, 0.85); /* var(--bg-main) with opacity */
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(47, 54, 48, 0.05);
    
    /* Hidden by default state */
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.5s ease;
}

.sticky-header.header-visible {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}

.sticky-header p, .sticky-header h1, .sticky-header a, .sticky-header div {
    margin: 0;
}

.sticky-header .header-content {
    max-width: var(--grid-max-width);
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top-lang-switcher {
    position: absolute;
    top: 1.5rem;
    right: 5vw;
    z-index: 100;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-main);
    font-size: 0.95rem;
    font-weight: 500;
}

.active-lang {
    color: var(--text-dark);
}

.lang-sep {
    color: var(--text-muted);
    opacity: 0.5;
}

.lang-link {
    text-decoration: none;
    color: var(--text-muted);
    transition: color 0.3s ease;
}

.lang-link:hover {
    color: var(--brand-action);
}

.sticky-header .brand-name {
    font-size: 14px;
    letter-spacing: 0.05em;
    font-weight: 500;
    color: var(--text-dark);
    margin: 0;
}

.pill-btn {
    display: inline-block;
    padding: 6px 16px;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-dark);
    background-color: transparent;
    text-decoration: none;
    border: 1px solid var(--text-dark);
    border-radius: 30px;
    transition: all 0.3s ease;
}

.pill-btn:hover {
    background-color: rgba(47, 54, 48, 0.05);
}

/* =========================================================================
   GLOBAL FOOTER
   ========================================================================= */
.premium-footer {
    background-color: var(--dark-section-bg);
    color: rgba(255, 255, 255, 0.8);
    padding: var(--space-xl) 5vw 4rem;
    border-top: none;
    position: relative;
    z-index: 10000;
}

.footer-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 3rem;
    margin-bottom: var(--space-lg);
}

/* Precise proportional alignment for footer columns */
.footer-grid .footer-col:nth-child(1) {
    justify-self: start;
    text-align: left;
}

.footer-grid .footer-col:nth-child(2) {
    justify-self: center;
    text-align: left;
}

.footer-grid .footer-col:nth-child(3) {
    justify-self: end;
    text-align: left;
}

.footer-heading {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #FFFFFF;
}

.footer-sub {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.7);
}

.footer-email {
    font-size: 1.1rem;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
    transition: all 0.3s ease;
}

.footer-email:hover {
    color: var(--brand-action);
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 8px;
}

.footer-link {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: color 0.3s ease;
    display: block;
    padding: 8px 0;
}

.footer-link:hover {
    color: #FFFFFF;
}

.footer-bottom {
    border-top: 2px solid var(--brand-terracotta);
    padding-top: 2rem;
    text-align: center;
}

.copyright {
    color: rgba(255, 255, 255, 0.7);
    opacity: 0.7;
    font-size: 0.9rem;
    margin: 0 !important;
}

@media (max-width: 900px) {
    .sticky-header .header-content {
        flex-wrap: nowrap;
    }
    .pill-btn {
        padding: 6px 12px;
    }
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }
    .footer-grid .footer-col:nth-child(2),
    .footer-grid .footer-col:nth-child(3) {
        justify-self: start;
        text-align: left;
    }
}

/* Visibility Utilities */
.hide-desktop { display: none !important; }
@media (max-width: 900px) {
    .hide-desktop { display: block !important; }
    .hide-mobile { display: none !important; }
}

/* =========================================================================
   PHOTOGRAPHIC VISUAL BREAKS
   ========================================================================= */
.visual-break-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(8px);
    box-shadow: 0 10px 40px rgba(47, 54, 48, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.6);
}

@media (min-width: 900px) {
    .visual-break-container {
        flex-direction: row;
        align-items: stretch;
    }
}

.visual-break-image {
    width: 100%;
    height: 300px;
    object-fit: cover;
    display: block;
}

@media (min-width: 900px) {
    .visual-break-image {
        width: 50%;
        height: auto;
        min-height: 400px;
    }
}

.visual-break-text {
    padding: 3rem 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
}

@media (min-width: 900px) {
    .visual-break-text {
        width: 50%;
        padding: 4rem;
        text-align: left;
    }
}

.visual-break-standalone {
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(47, 54, 48, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.6);
}

.visual-break-standalone img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    display: block;
}


/* =========================================================================
   ACCESSIBILITY: REDUCED MOTION
   ========================================================================= */
@media (prefers-reduced-motion: reduce) {
    *, ::before, ::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}