/* ============================================================
   15-THEME DESIGN PHILOSOPHY SHOWCASE
   Batch 1: Themes 01-03 (About Me variations)
   ============================================================ */


/* ============================================================
   GLOBAL RESET + BASE
   ============================================================ */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", sans-serif;
    background: #fff;
    color: #1a1a1a;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }


/* ============================================================
   GLOBAL JUMP NAVIGATION
   Floating button + slide-in panel for jumping between themes.
   ============================================================ */
.global-nav-toggle {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 48px;
    height: 48px;
    background: #1a1a1a;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.18);
    transition: transform 0.2s ease;
}
.global-nav-toggle:hover { transform: scale(1.05); }
.global-nav-toggle span {
    display: block;
    width: 18px;
    height: 2px;
    background: #fff;
    border-radius: 1px;
    transition: all 0.3s ease;
}
.global-nav {
    position: fixed;
    top: 0;
    right: -400px;
    width: 360px;
    max-width: 90vw;
    height: 100vh;
    background: #1a1a1a;
    color: #fff;
    z-index: 9998;
    padding: 20px;
    overflow-y: auto;
    transition: right 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.global-nav.open { right: 0; }
.global-nav-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 4px 24px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    margin-bottom: 16px;
}
.global-nav-header h2 {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-weight: 500;
    color: rgba(255,255,255,0.6);
}
.global-nav-close {
    background: transparent;
    color: #fff;
    border: none;
    font-size: 28px;
    cursor: pointer;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    transition: background 0.2s ease;
}
.global-nav-close:hover { background: rgba(255,255,255,0.1); }
.global-nav-list {
    list-style: none;
    counter-reset: none;
}
.global-nav-list li {
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.global-nav-list a,
.global-nav-list li.upcoming {
    display: block;
    padding: 14px 8px;
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    transition: padding-left 0.2s ease, color 0.2s ease;
}
.global-nav-list a:hover {
    padding-left: 16px;
    color: #f59e0b;
}
.global-nav-list li.upcoming {
    color: rgba(255,255,255,0.35);
    cursor: default;
}
.global-nav-list em {
    font-style: normal;
    font-size: 11px;
    opacity: 0.6;
    margin-left: 4px;
}


/* ============================================================
   INTRO BANNER
   ============================================================ */
.intro-banner {
    min-height: 100vh;
    background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 30px;
}
.intro-content {
    max-width: 720px;
    text-align: center;
    animation: introFade 1.2s ease forwards;
}
@keyframes introFade {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
.intro-tag {
    font-size: 13px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    margin-bottom: 24px;
}
.intro-banner h1 {
    font-size: clamp(40px, 7vw, 80px);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.02em;
    margin-bottom: 24px;
}
.intro-sub {
    font-size: 18px;
    color: rgba(255,255,255,0.75);
    line-height: 1.6;
    margin-bottom: 40px;
}
.intro-cta {
    display: inline-block;
    color: #fff;
    text-decoration: none;
    padding: 14px 32px;
    border: 1px solid rgba(255,255,255,0.4);
    border-radius: 100px;
    font-size: 14px;
    transition: all 0.3s ease;
}
.intro-cta:hover {
    background: #fff;
    color: #1a1a1a;
    border-color: #fff;
}


/* ============================================================
   BATCH PLACEHOLDER (between batches)
   ============================================================ */
.batch-placeholder {
    background: #f5f5f0;
    padding: 80px 30px;
    text-align: center;
    color: #555;
    border-top: 1px solid #ddd;
}
.batch-placeholder-inner { max-width: 600px; margin: 0 auto; }
.batch-tag {
    font-size: 12px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #999;
    margin-bottom: 16px;
}
.batch-placeholder h2 {
    font-size: 32px;
    font-weight: 500;
    color: #1a1a1a;
    margin-bottom: 16px;
}
.batch-placeholder p {
    font-size: 15px;
    line-height: 1.7;
}


/* ============================================================
   REVEAL ANIMATION (used in multiple themes)
   .reveal animates immediately on load with optional delay.
   .reveal-on-scroll triggers via IntersectionObserver in JS.
   ============================================================ */
.reveal,
.reveal-on-scroll {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}
.reveal.visible,
.reveal-on-scroll.visible {
    opacity: 1;
    transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
    .reveal, .reveal-on-scroll {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}


/* ============================================================
   ============================================================
   THEME 01 — ABOUT ME · MINIMALIST
   Editorial / NYT / Anthropic feel.
   Cream + charcoal + terracotta. Serif. Generous whitespace.
   ============================================================
   ============================================================ */
.theme-01 {
    background: #FAFAF7;
    color: #1A1A1A;
    font-family: "Crimson Pro", Georgia, "Times New Roman", serif;
    padding: 0;
}

/* T01 NAV */
.t01-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(250,250,247,0.92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 18px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(0,0,0,0.06);
}
.t01-nav-name {
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -0.01em;
}
.t01-nav-links {
    display: flex;
    gap: 32px;
    font-family: -apple-system, sans-serif;
    font-size: 13px;
}
.t01-nav-links a {
    color: #555;
    text-decoration: none;
    transition: color 0.2s ease;
}
.t01-nav-links a:hover { color: #B85C38; }

/* T01 HERO */
.t01-hero {
    padding: 120px 60px 80px;
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
}
.t01-hero-inner {
    max-width: 820px;
}
.t01-meta {
    color: #999;
    font-size: 12px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 32px;
    font-family: -apple-system, sans-serif;
}
.t01-title {
    font-size: clamp(40px, 6vw, 72px);
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: -0.015em;
    margin-bottom: 32px;
    color: #1A1A1A;
}
.t01-title em {
    font-style: italic;
    color: #B85C38;
}
.t01-tagline {
    font-size: 22px;
    line-height: 1.55;
    color: #444;
    margin-bottom: 48px;
    max-width: 720px;
}
.t01-hero-actions {
    display: flex;
    align-items: center;
    gap: 32px;
    flex-wrap: wrap;
}
.t01-btn-primary {
    display: inline-block;
    padding: 14px 32px;
    background: #1A1A1A;
    color: #FAFAF7;
    text-decoration: none;
    font-size: 15px;
    font-family: -apple-system, sans-serif;
    border-radius: 100px;
    transition: all 0.3s ease;
}
.t01-btn-primary:hover {
    background: #B85C38;
    transform: translateY(-2px);
}
.t01-btn-text {
    color: #1A1A1A;
    text-decoration: none;
    font-size: 16px;
    font-style: italic;
    border-bottom: 1px solid #1A1A1A;
    padding-bottom: 4px;
    transition: all 0.3s ease;
}
.t01-btn-text:hover {
    color: #B85C38;
    border-bottom-color: #B85C38;
    padding-right: 12px;
}
.t01-hero-rule {
    width: 60px;
    height: 1px;
    background: #B85C38;
    margin-top: 80px;
}

/* T01 SECTIONS */
.t01-section {
    padding: 100px 60px;
    border-top: 1px solid rgba(0,0,0,0.06);
}
.t01-section-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.t01-section-num {
    font-family: -apple-system, sans-serif;
    font-size: 12px;
    letter-spacing: 0.25em;
    color: #B85C38;
    margin-bottom: 16px;
    font-weight: 500;
}
.t01-section-title {
    font-size: clamp(32px, 4.5vw, 52px);
    font-weight: 400;
    line-height: 1.15;
    margin-bottom: 64px;
    color: #1A1A1A;
    max-width: 760px;
    letter-spacing: -0.01em;
}
.t01-prose {
    max-width: 720px;
}
.t01-lead {
    font-size: 22px;
    line-height: 1.6;
    color: #2a2a2a;
    margin-bottom: 28px;
}
.t01-prose p {
    font-size: 18px;
    line-height: 1.75;
    color: #444;
    margin-bottom: 28px;
}
.t01-quote {
    margin: 48px 0;
    padding: 32px 0 32px 32px;
    border-left: 3px solid #B85C38;
}
.t01-quote p {
    font-size: 24px;
    line-height: 1.5;
    font-style: italic;
    color: #1A1A1A;
    margin-bottom: 16px;
}
.t01-quote cite {
    font-size: 14px;
    color: #888;
    font-style: normal;
    font-family: -apple-system, sans-serif;
    letter-spacing: 0.05em;
}

/* T01 JOURNEY */
.t01-journey { background: #F4EFE6; }
.t01-chapter {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 60px;
    padding: 60px 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}
.t01-chapter:last-child { border-bottom: none; }
.t01-chapter-meta {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-family: -apple-system, sans-serif;
}
.t01-chapter-num {
    font-size: 11px;
    letter-spacing: 0.25em;
    color: #B85C38;
    text-transform: uppercase;
}
.t01-chapter-period {
    font-size: 14px;
    color: #888;
}
.t01-chapter-body h3 {
    font-size: 28px;
    font-weight: 400;
    margin-bottom: 16px;
    color: #1A1A1A;
    line-height: 1.25;
}
.t01-chapter-body p {
    font-size: 17px;
    line-height: 1.75;
    color: #444;
}

/* T01 WORK LIST */
.t01-work-list {
    list-style: none;
}
.t01-work-list li {
    border-bottom: 1px solid rgba(0,0,0,0.08);
}
.t01-work-list li:first-child {
    border-top: 1px solid rgba(0,0,0,0.08);
}
.t01-work-list a {
    display: grid;
    grid-template-columns: 60px 1fr auto 40px;
    gap: 32px;
    align-items: baseline;
    padding: 28px 0;
    color: #1A1A1A;
    text-decoration: none;
    transition: padding 0.4s ease;
}
.t01-work-list a:hover {
    padding-left: 24px;
    background: rgba(184,92,56,0.04);
}
.t01-work-list a:hover .t01-work-arrow {
    transform: translateX(8px);
    color: #B85C38;
}
.t01-work-list a:hover .t01-work-title {
    color: #B85C38;
}
.t01-work-num {
    font-family: -apple-system, sans-serif;
    font-size: 13px;
    color: #999;
    letter-spacing: 0.05em;
}
.t01-work-title {
    font-size: 26px;
    font-weight: 400;
    transition: color 0.3s ease;
}
.t01-work-meta {
    font-family: -apple-system, sans-serif;
    font-size: 13px;
    color: #888;
}
.t01-work-arrow {
    font-size: 20px;
    color: #1A1A1A;
    transition: all 0.3s ease;
    text-align: right;
}

/* T01 CONTACT */
.t01-contact { background: #1A1A1A; color: #FAFAF7; }
.t01-contact .t01-section-title { color: #FAFAF7; }
.t01-contact-sub {
    font-size: 19px;
    line-height: 1.6;
    color: rgba(255,255,255,0.7);
    margin-bottom: 56px;
    max-width: 600px;
}
.t01-form {
    max-width: 640px;
    margin-bottom: 48px;
}
.t01-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}
.t01-form label {
    display: block;
    margin-bottom: 20px;
}
.t01-form-row label { margin-bottom: 0; }
.t01-form label span {
    display: block;
    font-family: -apple-system, sans-serif;
    font-size: 12px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    margin-bottom: 8px;
}
.t01-form input,
.t01-form textarea {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(255,255,255,0.2);
    padding: 12px 0;
    color: #FAFAF7;
    font-size: 16px;
    font-family: -apple-system, sans-serif;
    transition: border-color 0.3s ease;
    resize: vertical;
}
.t01-form input:focus,
.t01-form textarea:focus {
    outline: none;
    border-bottom-color: #B85C38;
}
.t01-contact .t01-btn-primary {
    background: #B85C38;
    color: #FAFAF7;
    margin-top: 24px;
}
.t01-contact .t01-btn-primary:hover {
    background: #FAFAF7;
    color: #1A1A1A;
}
.t01-form-success {
    display: none;
    margin-top: 20px;
    padding: 16px;
    background: rgba(184,92,56,0.15);
    border-left: 3px solid #B85C38;
    color: #FAFAF7;
    font-size: 15px;
    font-family: -apple-system, sans-serif;
}
.t01-form-success.visible { display: block; }
.t01-contact-direct {
    padding-top: 32px;
    border-top: 1px solid rgba(255,255,255,0.1);
    font-family: -apple-system, sans-serif;
    color: rgba(255,255,255,0.7);
    font-size: 15px;
}
.t01-contact-direct a {
    color: rgba(255,255,255,0.85);
    text-decoration: none;
    transition: color 0.3s ease;
}
.t01-contact-direct a:hover { color: #B85C38; }
.t01-divider { margin: 0 12px; opacity: 0.5; }

.t01-footer {
    padding: 40px 60px;
    text-align: center;
    background: #1A1A1A;
    color: rgba(255,255,255,0.4);
    font-family: -apple-system, sans-serif;
    font-size: 12px;
    border-top: 1px solid rgba(255,255,255,0.1);
}


/* ============================================================
   ============================================================
   THEME 02 — ABOUT ME · EDGY
   Terminal / hacker. Black, matrix green, magenta accent.
   Monospace, scanlines, glitch text.
   ============================================================
   ============================================================ */
.theme-02 {
    background: #0a0a0f;
    color: #c5d6c5;
    font-family: "JetBrains Mono", "SF Mono", Menlo, Monaco, monospace;
    position: relative;
    overflow-x: hidden;
}

/* T02 NAV */
.t02-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(10,10,15,0.92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 16px 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(0,255,65,0.15);
    font-size: 13px;
}
.t02-nav-name { color: #00FF41; font-weight: 500; }
.t02-prompt { color: #FF006E; }
.t02-nav-links { display: flex; gap: 24px; }
.t02-nav-links a {
    color: #c5d6c5;
    text-decoration: none;
    font-size: 12px;
    transition: color 0.2s ease;
}
.t02-nav-links a:hover { color: #00FF41; }

/* T02 HERO */
.t02-hero {
    position: relative;
    padding: 120px 40px 100px;
    max-width: 1100px;
    margin: 0 auto;
    overflow: hidden;
}
.t02-scanlines {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 2px,
        rgba(0,255,65,0.025) 2px,
        rgba(0,255,65,0.025) 4px
    );
    pointer-events: none;
    animation: t02-scan 8s linear infinite;
}
@keyframes t02-scan {
    0% { transform: translateY(0); }
    100% { transform: translateY(20px); }
}
.t02-hero-inner { position: relative; z-index: 2; }
.t02-status {
    color: #00FF41;
    font-size: 12px;
    margin-bottom: 32px;
    letter-spacing: 0.05em;
    animation: t02-statusBlink 2s ease-in-out infinite;
}
@keyframes t02-statusBlink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}
.t02-title {
    margin-bottom: 32px;
    line-height: 1.2;
}
.t02-line {
    display: block;
    margin-bottom: 16px;
}
.t02-title .t02-line:first-child {
    color: rgba(197,214,197,0.6);
    font-size: 16px;
    margin-bottom: 24px;
}
.t02-title .t02-line:nth-child(2) {
    font-size: clamp(36px, 5.5vw, 64px);
    color: #FF006E;
    text-shadow: 0 0 20px rgba(255,0,110,0.4);
    font-weight: 700;
    margin-bottom: 12px;
}
.t02-title .t02-line:nth-child(3) {
    font-size: clamp(20px, 2.5vw, 28px);
    color: #00FF41;
    font-weight: 400;
}
.t02-glitch {
    position: relative;
    animation: t02-glitchPulse 4s ease-in-out infinite;
}
@keyframes t02-glitchPulse {
    0%, 90%, 100% {
        text-shadow: 0 0 20px rgba(255,0,110,0.4);
    }
    91%, 93%, 95% {
        text-shadow:
            -2px 0 #00FF41,
            2px 0 #00F0FF,
            0 0 20px rgba(255,0,110,0.4);
        transform: translateX(-1px);
    }
    92%, 94%, 96% {
        text-shadow:
            2px 0 #00FF41,
            -2px 0 #00F0FF,
            0 0 20px rgba(255,0,110,0.4);
        transform: translateX(1px);
    }
}
.t02-blink {
    animation: t02-cursorBlink 1s step-end infinite;
    color: #00FF41;
}
@keyframes t02-cursorBlink {
    50% { opacity: 0; }
}
.t02-tagline {
    color: rgba(197,214,197,0.7);
    font-size: 14px;
    line-height: 1.7;
    margin-bottom: 40px;
    max-width: 720px;
}
.t02-hero-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.t02-btn {
    display: inline-block;
    padding: 12px 24px;
    background: transparent;
    color: #00FF41;
    border: 1px solid #00FF41;
    text-decoration: none;
    font-family: inherit;
    font-size: 13px;
    transition: all 0.3s ease;
    cursor: pointer;
}
.t02-btn:hover {
    background: #00FF41;
    color: #0a0a0f;
    box-shadow: 0 0 24px rgba(0,255,65,0.5);
}
.t02-btn-pink {
    color: #FF006E;
    border-color: #FF006E;
}
.t02-btn-pink:hover {
    background: #FF006E;
    box-shadow: 0 0 24px rgba(255,0,110,0.5);
}

/* T02 SECTIONS */
.t02-section {
    padding: 80px 40px;
    border-top: 1px solid rgba(0,255,65,0.1);
    position: relative;
}
.t02-section-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.t02-section-num {
    color: #FF006E;
    font-size: 13px;
    letter-spacing: 0.05em;
    margin-bottom: 16px;
}
.t02-section-title {
    font-size: clamp(28px, 4vw, 44px);
    color: #c5d6c5;
    font-weight: 500;
    margin-bottom: 48px;
    line-height: 1.2;
}
.t02-pink { color: #FF006E; }
.t02-pink-text { color: #FF006E !important; }

/* T02 TERMINAL BLOCK */
.t02-terminal-block {
    background: #161B22;
    border: 1px solid #30363D;
    border-radius: 8px;
    margin-bottom: 32px;
    overflow: hidden;
    max-width: 700px;
}
.t02-terminal-bar {
    background: #21262D;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #30363D;
}
.t02-dot { width: 12px; height: 12px; border-radius: 50%; }
.t02-r { background: #FF5F56; }
.t02-y { background: #FFBD2E; }
.t02-g { background: #27C93F; }
.t02-terminal-title {
    margin-left: auto;
    margin-right: auto;
    font-size: 12px;
    color: #8B949E;
}
.t02-terminal-body {
    padding: 20px 24px;
    font-size: 14px;
    line-height: 1.8;
}
.t02-terminal-body pre {
    font-family: inherit;
    color: #c5d6c5;
    white-space: pre-wrap;
}
.t02-key { color: #58A6FF; }
.t02-val { color: #00FF41; }
.t02-num { color: #FF006E; }

.t02-prose {
    font-size: 15px;
    line-height: 1.85;
    color: rgba(197,214,197,0.85);
    margin-bottom: 32px;
    max-width: 800px;
}
.t02-quote {
    margin: 32px 0;
    padding: 24px 32px;
    background: rgba(255,0,110,0.06);
    border-left: 3px solid #FF006E;
    max-width: 800px;
}
.t02-quote p {
    font-size: 17px;
    line-height: 1.6;
    color: #fff;
    font-style: italic;
}

/* T02 STACK */
.t02-stack-section { background: rgba(0,255,65,0.02); }
.t02-stack-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
}
.t02-stack-card {
    background: rgba(0,0,0,0.4);
    border: 1px solid rgba(0,255,65,0.2);
    padding: 20px;
    border-radius: 6px;
    transition: all 0.3s ease;
}
.t02-stack-card:hover {
    border-color: #00FF41;
    box-shadow: 0 0 20px rgba(0,255,65,0.15);
    transform: translateY(-2px);
}
.t02-stack-prefix {
    display: inline-block;
    color: #00FF41;
    font-size: 11px;
    margin-bottom: 12px;
    letter-spacing: 0.05em;
}
.t02-stack-prefix.t02-yellow { color: #FFBD2E; }
.t02-stack-card h4 {
    color: #fff;
    font-size: 16px;
    margin-bottom: 8px;
    font-weight: 500;
}
.t02-stack-card p {
    color: rgba(197,214,197,0.7);
    font-size: 13px;
    line-height: 1.6;
}

/* T02 PROJECTS */
.t02-projects {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid rgba(0,255,65,0.15);
    border-radius: 6px;
    overflow: hidden;
}
.t02-project {
    display: grid;
    grid-template-columns: 100px 200px 1fr;
    gap: 24px;
    padding: 16px 24px;
    color: #c5d6c5;
    text-decoration: none;
    border-bottom: 1px solid rgba(0,255,65,0.1);
    transition: background 0.2s ease;
    align-items: center;
}
.t02-project:last-child { border-bottom: none; }
.t02-project:hover {
    background: rgba(0,255,65,0.05);
}
.t02-project:hover .t02-project-name {
    color: #FF006E;
}
.t02-commit {
    color: #FFBD2E;
    font-size: 13px;
}
.t02-project-name {
    color: #00FF41;
    font-weight: 500;
    font-size: 15px;
    transition: color 0.3s ease;
}
.t02-project-desc {
    color: rgba(197,214,197,0.6);
    font-size: 13px;
}

/* T02 CONTACT */
.t02-contact-section { background: rgba(255,0,110,0.03); }
.t02-form {
    max-width: 600px;
    margin: 32px 0;
}
.t02-form label {
    display: block;
    margin-bottom: 20px;
}
.t02-label {
    display: block;
    color: rgba(197,214,197,0.7);
    font-size: 12px;
    margin-bottom: 8px;
    letter-spacing: 0.05em;
}
.t02-form input,
.t02-form textarea {
    width: 100%;
    background: rgba(0,0,0,0.4);
    border: 1px solid rgba(0,255,65,0.2);
    color: #c5d6c5;
    padding: 12px 14px;
    font-family: inherit;
    font-size: 14px;
    border-radius: 4px;
    transition: all 0.3s ease;
}
.t02-form input:focus,
.t02-form textarea:focus {
    outline: none;
    border-color: #00FF41;
    background: rgba(0,255,65,0.04);
}
.t02-form input::placeholder,
.t02-form textarea::placeholder {
    color: rgba(197,214,197,0.3);
}
.t02-form-success {
    display: none;
    margin-top: 16px;
    padding: 12px 16px;
    background: rgba(0,255,65,0.1);
    border-left: 3px solid #00FF41;
    color: #00FF41;
    font-size: 13px;
}
.t02-form-success.visible { display: block; }
.t02-direct {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
    color: rgba(197,214,197,0.7);
    font-size: 13px;
    padding: 24px 0 8px;
    border-top: 1px solid rgba(0,255,65,0.1);
    margin-top: 32px;
}
.t02-direct a {
    color: #00FF41;
    text-decoration: none;
    transition: color 0.2s ease;
}
.t02-direct a:hover { color: #FF006E; }

.t02-footer {
    padding: 32px 40px;
    background: rgba(0,0,0,0.5);
    color: rgba(197,214,197,0.5);
    font-size: 12px;
    text-align: center;
    border-top: 1px solid rgba(0,255,65,0.15);
}


/* ============================================================
   ============================================================
   THEME 03 — ABOUT ME · PROFESSIONAL
   Corporate consulting. Navy + white + gold accent.
   Photo-driven, sans-serif throughout, conservative animations.
   ============================================================
   ============================================================ */
.theme-03 {
    background: #FFFFFF;
    color: #0F1B2E;
    font-family: "Inter", -apple-system, sans-serif;
}

/* T03 NAV */
.t03-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 20px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(15,27,46,0.06);
}
.t03-nav-name {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.15em;
    color: #0F1B2E;
}
.t03-nav-links { display: flex; gap: 36px; }
.t03-nav-links a {
    color: #0F1B2E;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    transition: color 0.2s ease;
}
.t03-nav-links a:hover { color: #B8893A; }

/* T03 HERO */
.t03-hero {
    padding: 80px 60px 120px;
    background: #FFFFFF;
}
.t03-hero-grid {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 80px;
    align-items: center;
}
.t03-hero-text {
    animation: t03-fadeUp 1s ease forwards;
}
@keyframes t03-fadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}
.t03-hero-tag {
    color: #B8893A;
    font-size: 12px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 24px;
    font-weight: 600;
}
.t03-hero h1 {
    font-size: clamp(36px, 5vw, 60px);
    font-weight: 600;
    line-height: 1.1;
    color: #0F1B2E;
    margin-bottom: 24px;
    letter-spacing: -0.02em;
}
.t03-hero-sub {
    font-size: 18px;
    line-height: 1.6;
    color: #4A5568;
    margin-bottom: 40px;
    max-width: 580px;
}
.t03-hero-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    padding: 32px 0;
    border-top: 1px solid rgba(15,27,46,0.08);
    border-bottom: 1px solid rgba(15,27,46,0.08);
    margin-bottom: 40px;
}
.t03-stat-num {
    display: block;
    font-size: 48px;
    font-weight: 700;
    color: #0F1B2E;
    line-height: 1;
    margin-bottom: 8px;
    letter-spacing: -0.02em;
}
.t03-stat-label {
    display: block;
    font-size: 12px;
    color: #6B7280;
    line-height: 1.4;
}
.t03-hero-actions {
    display: flex;
    align-items: center;
    gap: 32px;
    flex-wrap: wrap;
}
.t03-btn-primary {
    display: inline-block;
    padding: 14px 28px;
    background: #0F1B2E;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s ease;
}
.t03-btn-primary:hover {
    background: #B8893A;
}
.t03-btn-text {
    color: #0F1B2E;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    border-bottom: 1px solid #0F1B2E;
    padding-bottom: 4px;
    transition: all 0.3s ease;
}
.t03-btn-text:hover {
    color: #B8893A;
    border-bottom-color: #B8893A;
}
.t03-hero-image {
    position: relative;
    aspect-ratio: 4/5;
    overflow: hidden;
}
.t03-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 6s ease;
    animation: t03-imageReveal 1.4s ease forwards;
}
@keyframes t03-imageReveal {
    from { opacity: 0; transform: scale(1.05); }
    to { opacity: 1; transform: scale(1); }
}
.t03-hero-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 60%, rgba(15,27,46,0.4) 100%);
    pointer-events: none;
}

/* T03 SECTIONS */
.t03-section {
    padding: 100px 60px;
    border-top: 1px solid rgba(15,27,46,0.06);
}
.t03-section-inner {
    max-width: 1280px;
    margin: 0 auto;
}
.t03-section-header {
    margin-bottom: 64px;
    max-width: 880px;
}
.t03-section-label {
    display: block;
    color: #B8893A;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.t03-section h2 {
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 600;
    line-height: 1.2;
    color: #0F1B2E;
    letter-spacing: -0.015em;
}
.t03-about-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 80px;
    align-items: start;
}
.t03-about-text p {
    font-size: 17px;
    line-height: 1.75;
    color: #4A5568;
    margin-bottom: 24px;
}
.t03-pull-quote {
    padding: 32px 40px;
    background: #F7F4ED;
    border-left: 4px solid #B8893A;
    position: sticky;
    top: 100px;
}
.t03-pull-quote p {
    font-size: 19px;
    line-height: 1.55;
    color: #0F1B2E;
    font-style: italic;
}

/* T03 EXPERIENCE TIMELINE */
.t03-experience { background: #FAFAFA; }
.t03-timeline {
    display: flex;
    flex-direction: column;
    gap: 0;
}
.t03-role {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 60px;
    padding: 48px 0;
    border-top: 1px solid rgba(15,27,46,0.08);
}
.t03-role:first-child { border-top: none; }
.t03-role-period {
    font-size: 13px;
    font-weight: 600;
    color: #B8893A;
    letter-spacing: 0.05em;
    padding-top: 4px;
}
.t03-role-body h3 {
    font-size: 22px;
    font-weight: 600;
    color: #0F1B2E;
    margin-bottom: 6px;
    letter-spacing: -0.01em;
}
.t03-role-org {
    font-size: 14px;
    color: #6B7280;
    margin-bottom: 16px;
    font-weight: 500;
}
.t03-role-body p {
    font-size: 15px;
    line-height: 1.7;
    color: #4A5568;
    margin-bottom: 16px;
}
.t03-role-tags {
    list-style: none;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 16px;
}
.t03-role-tags li {
    font-size: 11px;
    font-weight: 600;
    color: #0F1B2E;
    background: #FFFFFF;
    padding: 6px 12px;
    border: 1px solid rgba(15,27,46,0.12);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* T03 CREDENTIALS */
.t03-cred-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 24px;
}
.t03-cred-card {
    background: #FFFFFF;
    border: 1px solid rgba(15,27,46,0.08);
    padding: 32px;
    transition: all 0.3s ease;
}
.t03-cred-card:hover {
    border-color: #B8893A;
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(15,27,46,0.06);
}
.t03-cred-tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    color: #B8893A;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(184,137,58,0.2);
}
.t03-cred-card h4 {
    font-size: 18px;
    font-weight: 600;
    color: #0F1B2E;
    margin-bottom: 10px;
    line-height: 1.3;
    letter-spacing: -0.01em;
}
.t03-cred-card p {
    font-size: 13px;
    line-height: 1.6;
    color: #6B7280;
}

/* T03 CONTACT */
.t03-contact-section { background: #0F1B2E; color: #FFFFFF; }
.t03-contact-section .t03-section-label { color: #B8893A; }
.t03-contact-section h2 { color: #FFFFFF; }
.t03-contact-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 80px;
}
.t03-form label {
    display: block;
    margin-bottom: 20px;
}
.t03-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 0;
}
.t03-form-row label { margin-bottom: 0; }
.t03-form label span {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: rgba(255,255,255,0.6);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.t03-form input,
.t03-form textarea,
.t03-form select {
    width: 100%;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.15);
    color: #FFFFFF;
    padding: 14px 16px;
    font-family: inherit;
    font-size: 15px;
    transition: all 0.3s ease;
}
.t03-form input:focus,
.t03-form textarea:focus,
.t03-form select:focus {
    outline: none;
    border-color: #B8893A;
    background: rgba(255,255,255,0.08);
}
.t03-form select option {
    background: #0F1B2E;
    color: #FFFFFF;
}
.t03-contact-section .t03-btn-primary {
    background: #B8893A;
    margin-top: 16px;
}
.t03-contact-section .t03-btn-primary:hover {
    background: #FFFFFF;
    color: #0F1B2E;
}
.t03-form-success {
    display: none;
    margin-top: 16px;
    padding: 16px;
    background: rgba(184,137,58,0.15);
    border-left: 3px solid #B8893A;
    color: #FFFFFF;
    font-size: 14px;
}
.t03-form-success.visible { display: block; }
.t03-contact-info h4 {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #B8893A;
    margin-bottom: 24px;
}
.t03-contact-info dl {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}
.t03-contact-info dt {
    font-size: 11px;
    font-weight: 600;
    color: rgba(255,255,255,0.5);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 4px;
}
.t03-contact-info dd {
    font-size: 15px;
    color: #FFFFFF;
}
.t03-contact-info dd a {
    color: #FFFFFF;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.3s ease;
}
.t03-contact-info dd a:hover {
    border-bottom-color: #B8893A;
}

.t03-footer {
    padding: 48px 60px;
    background: #0a1322;
    color: rgba(255,255,255,0.5);
    font-size: 13px;
    text-align: center;
}
.t03-footer-meta {
    margin-top: 8px;
    font-size: 11px;
    color: rgba(255,255,255,0.3);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
    .t01-nav, .t02-nav, .t03-nav { padding: 16px 24px; }
    .t01-nav-links, .t02-nav-links, .t03-nav-links { gap: 16px; font-size: 12px; }
    .t01-hero, .t01-section, .t02-hero, .t02-section, .t03-hero, .t03-section {
        padding-left: 24px;
        padding-right: 24px;
    }
    .t01-hero { padding-top: 60px; padding-bottom: 60px; }
    .t01-section, .t03-section { padding-top: 60px; padding-bottom: 60px; }
    .t01-chapter, .t03-role {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .t01-form-row, .t03-form-row,
    .t01-work-list a {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .t01-work-list a { padding: 20px 0; }
    .t01-work-arrow { display: none; }
    .t02-project { grid-template-columns: 1fr; gap: 8px; padding: 16px 20px; }
    .t02-stack-grid { grid-template-columns: 1fr; }
    .t03-hero-grid, .t03-about-grid, .t03-contact-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .t03-hero-stats { grid-template-columns: 1fr; gap: 16px; }
    .t03-stat-num { font-size: 36px; }
    .t03-pull-quote { position: static; }
}


/* ============================================================
   ============================================================
   THEME 04 — JOURNALIST · EDITORIAL
   Newspaper / NYT magazine. Black serif masthead, drop caps,
   sepia photo, pull quotes, multi-column body type.
   Palette: ivory #FBF9F4, ink black #15140F, oxblood #7A2F1D
   ============================================================
   ============================================================ */
.theme-04 {
    background: #FBF9F4;
    color: #15140F;
    font-family: "Crimson Pro", "Times New Roman", Georgia, serif;
}

.t04-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(251,249,244,0.96);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 16px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(21,20,15,0.1);
}
.t04-nav-name {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.25em;
    font-family: -apple-system, sans-serif;
}
.t04-nav-links {
    display: flex;
    gap: 32px;
    font-family: -apple-system, sans-serif;
    font-size: 12px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.t04-nav-links a {
    color: #15140F;
    text-decoration: none;
    transition: color 0.2s ease;
}
.t04-nav-links a:hover { color: #7A2F1D; }

.t04-masthead {
    padding: 80px 60px 40px;
    text-align: center;
    border-bottom: 4px double #15140F;
    max-width: 1100px;
    margin: 0 auto;
}
.t04-masthead-meta {
    display: flex;
    justify-content: space-between;
    font-family: -apple-system, sans-serif;
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #555;
    padding-bottom: 24px;
    border-bottom: 1px solid #15140F;
    margin-bottom: 24px;
}
.t04-masthead-title {
    font-family: "Playfair Display", "Crimson Pro", serif;
    font-size: clamp(60px, 11vw, 130px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.03em;
    margin-bottom: 16px;
    color: #15140F;
}
.t04-masthead-sub {
    font-style: italic;
    font-size: 17px;
    color: #4a4438;
}

.t04-hero {
    padding: 60px 60px 80px;
    max-width: 1100px;
    margin: 0 auto;
    border-bottom: 1px solid rgba(21,20,15,0.15);
}
.t04-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 60px;
    align-items: start;
}
.t04-hero-figure {
    position: relative;
}
.t04-hero-figure img {
    width: 100%;
    aspect-ratio: 4/5;
    object-fit: cover;
    filter: sepia(20%) contrast(105%) brightness(96%);
    transition: filter 0.5s ease;
}
.t04-hero-figure:hover img {
    filter: sepia(0%) contrast(100%) brightness(100%);
}
.t04-hero-figure figcaption {
    margin-top: 12px;
    font-size: 12px;
    font-style: italic;
    color: #6c6557;
    font-family: -apple-system, sans-serif;
    line-height: 1.5;
}
.t04-byline {
    font-family: -apple-system, sans-serif;
    font-size: 13px;
    letter-spacing: 0.05em;
    color: #4a4438;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 12px;
}
.t04-byline-rule {
    display: inline-block;
    width: 40px;
    height: 1px;
    background: #4a4438;
}
.t04-headline {
    font-size: clamp(32px, 4.2vw, 52px);
    font-weight: 500;
    line-height: 1.15;
    letter-spacing: -0.02em;
    margin-bottom: 24px;
    color: #15140F;
}
.t04-deck {
    font-size: 19px;
    line-height: 1.6;
    color: #4a4438;
    margin-bottom: 32px;
}
.t04-hero-actions {
    display: flex;
    align-items: center;
    gap: 28px;
    flex-wrap: wrap;
}
.t04-btn-primary {
    display: inline-block;
    padding: 12px 28px;
    background: #15140F;
    color: #FBF9F4;
    text-decoration: none;
    font-family: -apple-system, sans-serif;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.05em;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
}
.t04-btn-primary:hover {
    background: #7A2F1D;
}
.t04-btn-text {
    color: #15140F;
    text-decoration: none;
    font-family: -apple-system, sans-serif;
    font-size: 13px;
    border-bottom: 1px solid #15140F;
    padding-bottom: 3px;
    transition: all 0.3s ease;
}
.t04-btn-text:hover {
    color: #7A2F1D;
    border-bottom-color: #7A2F1D;
}

.t04-section {
    padding: 80px 60px;
    border-top: 1px solid rgba(21,20,15,0.12);
}
.t04-section-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.t04-section-header { margin-bottom: 48px; }
.t04-section-label {
    display: block;
    font-family: -apple-system, sans-serif;
    font-size: 11px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: #7A2F1D;
    margin-bottom: 12px;
    font-weight: 600;
}
.t04-section-title {
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 500;
    line-height: 1.15;
    letter-spacing: -0.015em;
    color: #15140F;
}

.t04-prose {
    max-width: 720px;
    column-count: 1;
}
.t04-lead {
    font-size: 19px;
    line-height: 1.7;
    margin-bottom: 24px;
    color: #15140F;
}
.t04-prose p {
    font-size: 17px;
    line-height: 1.75;
    color: #2a2520;
    margin-bottom: 20px;
}
.t04-dropcap {
    float: left;
    font-family: "Playfair Display", "Crimson Pro", serif;
    font-size: 64px;
    font-weight: 700;
    line-height: 0.9;
    margin: 4px 12px 0 0;
    color: #7A2F1D;
}
.t04-pullquote {
    margin: 56px 0;
    padding: 32px 40px;
    border-top: 3px solid #15140F;
    border-bottom: 1px solid #15140F;
    max-width: 720px;
}
.t04-pullquote p {
    font-size: 24px;
    line-height: 1.45;
    font-style: italic;
    color: #15140F;
    margin-bottom: 16px;
    font-family: "Playfair Display", serif;
}
.t04-pullquote cite {
    font-style: normal;
    font-family: -apple-system, sans-serif;
    font-size: 12px;
    letter-spacing: 0.05em;
    color: #7A2F1D;
}

.t04-bylines-section { background: #F4EFE5; }
.t04-byline-entry {
    padding: 36px 0;
    border-top: 1px solid rgba(21,20,15,0.12);
    transition: padding-left 0.4s ease;
    cursor: default;
}
.t04-byline-entry:hover {
    padding-left: 16px;
    background: rgba(122,47,29,0.03);
}
.t04-byline-meta {
    display: flex;
    gap: 16px;
    font-family: -apple-system, sans-serif;
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.t04-pub {
    color: #7A2F1D;
    font-weight: 700;
}
.t04-date { color: #6c6557; }
.t04-byline-entry h3 {
    font-size: 26px;
    font-weight: 500;
    line-height: 1.2;
    margin-bottom: 12px;
    color: #15140F;
    letter-spacing: -0.01em;
}
.t04-byline-entry p {
    font-size: 16px;
    line-height: 1.65;
    color: #4a4438;
    margin-bottom: 16px;
    max-width: 760px;
}
.t04-read-time {
    font-family: -apple-system, sans-serif;
    font-size: 12px;
    color: #888;
    font-style: italic;
}

.t04-beats-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 60px;
}
.t04-beat {
    padding: 24px 0;
    border-top: 2px solid #15140F;
}
.t04-beat-num {
    display: block;
    font-family: "Playfair Display", serif;
    font-size: 32px;
    font-weight: 700;
    color: #7A2F1D;
    margin-bottom: 8px;
}
.t04-beat h4 {
    font-size: 22px;
    font-weight: 500;
    margin-bottom: 8px;
    color: #15140F;
    letter-spacing: -0.01em;
}
.t04-beat p {
    font-size: 15px;
    line-height: 1.65;
    color: #4a4438;
}

.t04-contact-section { background: #15140F; color: #FBF9F4; }
.t04-contact-section .t04-section-title { color: #FBF9F4; }
.t04-contact-section .t04-section-label { color: #C97D63; }
.t04-contact-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 60px;
    align-items: start;
}
.t04-form label {
    display: block;
    margin-bottom: 18px;
}
.t04-form label span {
    display: block;
    font-family: -apple-system, sans-serif;
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: rgba(251,249,244,0.5);
    margin-bottom: 8px;
}
.t04-form input,
.t04-form textarea,
.t04-form select {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(251,249,244,0.25);
    padding: 12px 0;
    color: #FBF9F4;
    font-size: 16px;
    font-family: inherit;
    transition: border-color 0.3s ease;
}
.t04-form select option {
    background: #15140F;
    color: #FBF9F4;
}
.t04-form input:focus,
.t04-form textarea:focus,
.t04-form select:focus {
    outline: none;
    border-bottom-color: #C97D63;
}
.t04-contact-section .t04-btn-primary {
    background: #C97D63;
    color: #15140F;
    margin-top: 12px;
}
.t04-contact-section .t04-btn-primary:hover {
    background: #FBF9F4;
}
.t04-form-success {
    display: none;
    margin-top: 16px;
    padding: 14px 16px;
    background: rgba(201,125,99,0.15);
    border-left: 2px solid #C97D63;
    color: #FBF9F4;
    font-size: 14px;
}
.t04-form-success.visible { display: block; }
.t04-contact-secure {
    background: rgba(251,249,244,0.04);
    padding: 28px;
    border-left: 2px solid #C97D63;
}
.t04-contact-secure h4 {
    font-family: -apple-system, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #C97D63;
    margin-bottom: 12px;
}
.t04-contact-secure p {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(251,249,244,0.85);
    font-family: -apple-system, sans-serif;
}
.t04-contact-secure hr {
    margin: 24px 0;
    border: none;
    border-top: 1px solid rgba(251,249,244,0.1);
}
.t04-contact-secure dl {
    display: grid;
    gap: 12px;
    font-family: -apple-system, sans-serif;
}
.t04-contact-secure dt {
    font-size: 10px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: rgba(251,249,244,0.5);
}
.t04-contact-secure dd {
    font-size: 14px;
    color: #FBF9F4;
}

.t04-footer {
    padding: 32px 60px;
    background: #0d0c08;
    color: rgba(251,249,244,0.4);
    font-size: 12px;
    text-align: center;
}
.t04-footer-meta {
    margin-top: 6px;
    font-size: 11px;
    color: rgba(251,249,244,0.25);
    font-style: italic;
}


/* ============================================================
   ============================================================
   THEME 05 — SOFTWARE ENGINEER · DARK TECHNICAL
   Senior IC portfolio. Deep blue-black, electric cyan accent,
   subtle grid pattern, code-block typography, technical poise.
   Palette: #0B0E14 / #00D9FF (cyan) / #E8EAED text
   ============================================================
   ============================================================ */
.theme-05 {
    background: #0B0E14;
    color: #E8EAED;
    font-family: "Inter", -apple-system, sans-serif;
    position: relative;
}

.t05-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(11,14,20,0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    padding: 18px 48px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(0,217,255,0.08);
}
.t05-nav-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: "JetBrains Mono", monospace;
    font-size: 14px;
    color: #00D9FF;
}
.t05-logo-mark {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #00D9FF;
    border-radius: 2px;
    animation: t05-mark 3s ease-in-out infinite;
}
@keyframes t05-mark {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(0.85); }
}
.t05-nav-links {
    display: flex;
    gap: 28px;
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
}
.t05-nav-links a {
    color: rgba(232,234,237,0.7);
    text-decoration: none;
    transition: color 0.2s ease;
}
.t05-nav-links a:hover { color: #00D9FF; }

.t05-hero {
    padding: 100px 48px 120px;
    position: relative;
    overflow: hidden;
}
.t05-grid-bg {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(0,217,255,0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0,217,255,0.04) 1px, transparent 1px);
    background-size: 60px 60px;
    pointer-events: none;
    mask-image: radial-gradient(ellipse at center, black 0%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse at center, black 0%, transparent 70%);
}
.t05-hero-inner {
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}
.t05-eyebrow {
    color: #00D9FF;
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
    letter-spacing: 0.05em;
    margin-bottom: 28px;
}
.t05-headline {
    font-size: clamp(40px, 6vw, 72px);
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin-bottom: 28px;
    color: #E8EAED;
    max-width: 1000px;
}
.t05-accent {
    color: #00D9FF;
    position: relative;
}
.t05-deck {
    font-size: 19px;
    line-height: 1.6;
    color: rgba(232,234,237,0.7);
    margin-bottom: 56px;
    max-width: 800px;
}
.t05-hero-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    padding: 32px 0;
    border-top: 1px solid rgba(0,217,255,0.15);
    border-bottom: 1px solid rgba(0,217,255,0.15);
    margin-bottom: 48px;
    max-width: 900px;
}
.t05-stat-num {
    display: block;
    font-family: "JetBrains Mono", monospace;
    font-size: 36px;
    font-weight: 500;
    color: #00D9FF;
    line-height: 1;
    margin-bottom: 10px;
    letter-spacing: -0.01em;
}
.t05-stat-label {
    display: block;
    font-size: 12px;
    color: rgba(232,234,237,0.55);
    letter-spacing: 0.05em;
}
.t05-hero-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.t05-btn-primary {
    display: inline-block;
    padding: 14px 28px;
    background: #00D9FF;
    color: #0B0E14;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s ease;
}
.t05-btn-primary:hover {
    background: #fff;
    box-shadow: 0 0 30px rgba(0,217,255,0.4);
}
.t05-btn-ghost {
    display: inline-block;
    padding: 13px 28px;
    background: transparent;
    color: #E8EAED;
    text-decoration: none;
    font-weight: 500;
    font-size: 14px;
    border: 1px solid rgba(232,234,237,0.25);
    transition: all 0.3s ease;
}
.t05-btn-ghost:hover {
    border-color: #00D9FF;
    color: #00D9FF;
}

.t05-section {
    padding: 100px 48px;
    border-top: 1px solid rgba(0,217,255,0.08);
}
.t05-section-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.t05-section-num {
    color: #00D9FF;
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
    margin-bottom: 16px;
}
.t05-section-title {
    font-size: clamp(32px, 4vw, 48px);
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.015em;
    margin-bottom: 56px;
    color: #E8EAED;
    max-width: 800px;
}

.t05-about-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 60px;
    align-items: start;
}
.t05-about-text p {
    font-size: 17px;
    line-height: 1.75;
    color: rgba(232,234,237,0.78);
    margin-bottom: 20px;
    max-width: 640px;
}
.t05-about-card {
    background: rgba(0,217,255,0.03);
    border: 1px solid rgba(0,217,255,0.15);
    padding: 32px;
    border-radius: 4px;
}
.t05-card-label {
    color: #00D9FF;
    font-family: "JetBrains Mono", monospace;
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.t05-about-card h4 {
    font-size: 19px;
    font-weight: 600;
    color: #E8EAED;
    margin-bottom: 12px;
    letter-spacing: -0.01em;
}
.t05-card-body {
    font-size: 14px;
    line-height: 1.65;
    color: rgba(232,234,237,0.7);
}

.t05-systems-section { background: rgba(0,217,255,0.015); }
.t05-systems-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
.t05-system-card {
    background: rgba(232,234,237,0.025);
    border: 1px solid rgba(0,217,255,0.12);
    padding: 28px;
    border-radius: 4px;
    transition: all 0.3s ease;
    position: relative;
}
.t05-system-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 1px;
    background: #00D9FF;
    transition: width 0.6s ease;
}
.t05-system-card:hover::before { width: 100%; }
.t05-system-card:hover {
    border-color: rgba(0,217,255,0.35);
    transform: translateY(-2px);
}
.t05-system-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    font-family: "JetBrains Mono", monospace;
    font-size: 11px;
}
.t05-system-tag {
    color: #00D9FF;
    letter-spacing: 0.05em;
}
.t05-system-status {
    color: rgba(232,234,237,0.5);
    padding: 4px 10px;
    border: 1px solid rgba(232,234,237,0.15);
    border-radius: 100px;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}
.t05-system-card h3 {
    font-size: 22px;
    font-weight: 600;
    line-height: 1.25;
    margin-bottom: 14px;
    color: #E8EAED;
    letter-spacing: -0.01em;
}
.t05-system-card p {
    font-size: 14px;
    line-height: 1.65;
    color: rgba(232,234,237,0.65);
    margin-bottom: 18px;
}
.t05-system-stack {
    list-style: none;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.t05-system-stack li {
    font-family: "JetBrains Mono", monospace;
    font-size: 11px;
    color: rgba(232,234,237,0.6);
    padding: 4px 10px;
    background: rgba(232,234,237,0.04);
    border-radius: 2px;
}

.t05-stack-cols {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    margin-bottom: 64px;
}
.t05-stack-col h4 {
    font-family: "JetBrains Mono", monospace;
    font-size: 12px;
    font-weight: 500;
    color: #00D9FF;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(0,217,255,0.12);
}
.t05-stack-col ul {
    list-style: none;
}
.t05-stack-col li {
    font-size: 14px;
    color: #E8EAED;
    padding: 8px 0;
    border-bottom: 1px solid rgba(232,234,237,0.06);
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
}
.t05-stack-col li span {
    font-family: "JetBrains Mono", monospace;
    font-size: 11px;
    color: rgba(232,234,237,0.45);
}
.t05-quote {
    margin-top: 60px;
    padding: 32px 40px;
    background: rgba(0,217,255,0.04);
    border-left: 2px solid #00D9FF;
    max-width: 900px;
}
.t05-quote p {
    font-size: 19px;
    line-height: 1.55;
    color: #E8EAED;
    font-style: italic;
}

.t05-contact-section { background: rgba(0,217,255,0.02); }
.t05-contact-sub {
    font-size: 17px;
    line-height: 1.6;
    color: rgba(232,234,237,0.7);
    margin-bottom: 40px;
    max-width: 700px;
    margin-top: -32px;
}
.t05-form {
    max-width: 700px;
}
.t05-form label {
    display: block;
    margin-bottom: 20px;
}
.t05-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 0;
}
.t05-form-row label { margin-bottom: 0; }
.t05-form label span {
    display: block;
    font-family: "JetBrains Mono", monospace;
    font-size: 11px;
    color: rgba(232,234,237,0.5);
    letter-spacing: 0.05em;
    margin-bottom: 8px;
    text-transform: lowercase;
}
.t05-form input,
.t05-form textarea {
    width: 100%;
    background: rgba(232,234,237,0.04);
    border: 1px solid rgba(232,234,237,0.1);
    color: #E8EAED;
    padding: 12px 14px;
    font-family: inherit;
    font-size: 14px;
    border-radius: 4px;
    transition: all 0.3s ease;
}
.t05-form input:focus,
.t05-form textarea:focus {
    outline: none;
    border-color: #00D9FF;
    background: rgba(0,217,255,0.04);
}
.t05-form-success {
    display: none;
    margin-top: 16px;
    padding: 12px 16px;
    background: rgba(0,217,255,0.08);
    border-left: 2px solid #00D9FF;
    color: #00D9FF;
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
}
.t05-form-success.visible { display: block; }
.t05-contact-direct {
    margin-top: 48px;
    padding-top: 32px;
    border-top: 1px solid rgba(0,217,255,0.12);
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    align-items: center;
    color: rgba(232,234,237,0.6);
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
}
.t05-contact-direct a {
    color: #E8EAED;
    text-decoration: none;
    transition: color 0.2s ease;
}
.t05-contact-direct a:hover { color: #00D9FF; }

.t05-footer {
    padding: 32px 48px;
    background: #060810;
    color: rgba(232,234,237,0.4);
    font-family: "JetBrains Mono", monospace;
    font-size: 12px;
    text-align: center;
    border-top: 1px solid rgba(0,217,255,0.1);
}


/* ============================================================
   ============================================================
   THEME 06 — AI TRAINER · NEURAL
   Research lab feel. Dark sophisticated background, animated
   neural network canvas in the hero, soft monochrome with
   electric green pulse for active elements.
   Palette: #0E1518 / #5DCAA5 (sage-mint) / #E8EAEC text
   ============================================================
   ============================================================ */
.theme-06 {
    background: #0E1518;
    color: #E8EAEC;
    font-family: "Inter", -apple-system, sans-serif;
}

.t06-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(14,21,24,0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    padding: 18px 48px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(93,202,165,0.1);
}
.t06-nav-name {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
    color: #E8EAEC;
}
.t06-nav-mark {
    color: #5DCAA5;
    font-size: 16px;
    animation: t06-pulse 3s ease-in-out infinite;
}
@keyframes t06-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}
.t06-nav-links {
    display: flex;
    gap: 28px;
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
}
.t06-nav-links a {
    color: rgba(232,234,236,0.7);
    text-decoration: none;
    transition: color 0.2s ease;
}
.t06-nav-links a:hover { color: #5DCAA5; }

.t06-hero {
    position: relative;
    padding: 120px 48px;
    overflow: hidden;
    min-height: 80vh;
    display: flex;
    align-items: center;
}
.t06-network {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
.t06-hero-inner {
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    width: 100%;
}
.t06-hero-eyebrow {
    color: #5DCAA5;
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
    letter-spacing: 0.05em;
    margin-bottom: 28px;
}
.t06-hero-title {
    font-size: clamp(36px, 5.5vw, 68px);
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin-bottom: 32px;
    color: #E8EAEC;
    max-width: 980px;
}
.t06-glow {
    color: #5DCAA5;
    text-shadow: 0 0 40px rgba(93,202,165,0.3);
}
.t06-hero-sub {
    font-size: 19px;
    line-height: 1.6;
    color: rgba(232,234,236,0.72);
    margin-bottom: 40px;
    max-width: 800px;
}
.t06-hero-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.t06-btn-primary {
    display: inline-block;
    padding: 14px 32px;
    background: #5DCAA5;
    color: #0E1518;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    border: none;
    cursor: pointer;
    font-family: inherit;
    border-radius: 100px;
    transition: all 0.3s ease;
}
.t06-btn-primary:hover {
    background: #fff;
    box-shadow: 0 0 30px rgba(93,202,165,0.4);
    transform: translateY(-2px);
}
.t06-btn-ghost {
    display: inline-block;
    padding: 13px 32px;
    background: transparent;
    color: #E8EAEC;
    text-decoration: none;
    font-weight: 500;
    font-size: 14px;
    border: 1px solid rgba(232,234,236,0.2);
    border-radius: 100px;
    transition: all 0.3s ease;
}
.t06-btn-ghost:hover {
    border-color: #5DCAA5;
    color: #5DCAA5;
}

.t06-section {
    padding: 100px 48px;
    border-top: 1px solid rgba(93,202,165,0.08);
}
.t06-section-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.t06-section-num {
    color: #5DCAA5;
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
    margin-bottom: 16px;
    letter-spacing: 0.05em;
}
.t06-section-title {
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 500;
    line-height: 1.15;
    letter-spacing: -0.015em;
    margin-bottom: 48px;
    color: #E8EAEC;
    max-width: 800px;
}

.t06-prose { max-width: 760px; }
.t06-lead {
    font-size: 19px;
    line-height: 1.7;
    color: #E8EAEC;
    margin-bottom: 24px;
}
.t06-prose p {
    font-size: 17px;
    line-height: 1.75;
    color: rgba(232,234,236,0.78);
    margin-bottom: 20px;
}
.t06-prose em {
    color: #5DCAA5;
    font-style: italic;
}
.t06-quote {
    margin-top: 40px;
    padding: 32px 40px;
    background: rgba(93,202,165,0.04);
    border-left: 2px solid #5DCAA5;
    max-width: 900px;
}
.t06-quote p {
    font-size: 21px;
    line-height: 1.55;
    color: #E8EAEC;
    font-style: italic;
    margin-bottom: 14px;
}
.t06-quote cite {
    font-family: "JetBrains Mono", monospace;
    font-size: 12px;
    color: rgba(232,234,236,0.55);
    font-style: normal;
}

.t06-research-section { background: rgba(93,202,165,0.02); }
.t06-research-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
.t06-research-card {
    background: rgba(232,234,236,0.03);
    border: 1px solid rgba(93,202,165,0.12);
    padding: 32px;
    border-radius: 8px;
    transition: all 0.3s ease;
}
.t06-research-card:hover {
    border-color: rgba(93,202,165,0.4);
    background: rgba(93,202,165,0.03);
    transform: translateY(-2px);
}
.t06-research-icon {
    width: 48px;
    height: 48px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(93,202,165,0.08);
    border-radius: 8px;
}
.t06-research-card h4 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 12px;
    color: #E8EAEC;
    letter-spacing: -0.01em;
}
.t06-research-card p {
    font-size: 14px;
    line-height: 1.65;
    color: rgba(232,234,236,0.7);
}

.t06-pub-list {
    list-style: none;
}
.t06-pub {
    display: grid;
    grid-template-columns: 70px 1fr;
    gap: 32px;
    padding: 28px 0;
    border-top: 1px solid rgba(93,202,165,0.08);
    transition: padding-left 0.4s ease;
}
.t06-pub:hover {
    padding-left: 16px;
    background: rgba(93,202,165,0.02);
}
.t06-pub-year {
    font-family: "JetBrains Mono", monospace;
    font-size: 14px;
    color: #5DCAA5;
    font-weight: 500;
}
.t06-pub-body h4 {
    font-size: 19px;
    font-weight: 500;
    margin-bottom: 8px;
    line-height: 1.35;
    letter-spacing: -0.005em;
}
.t06-pub-body h4 a {
    color: #E8EAEC;
    text-decoration: none;
    transition: color 0.2s ease;
}
.t06-pub-body h4 a:hover { color: #5DCAA5; }
.t06-pub-body p {
    font-size: 14px;
    line-height: 1.65;
    color: rgba(232,234,236,0.65);
    margin-bottom: 8px;
}
.t06-pub-venue {
    font-family: "JetBrains Mono", monospace;
    font-size: 11px;
    color: rgba(232,234,236,0.5);
    letter-spacing: 0.05em;
}

.t06-contact-section { background: rgba(93,202,165,0.025); }
.t06-contact-sub {
    font-size: 17px;
    line-height: 1.6;
    color: rgba(232,234,236,0.72);
    margin-bottom: 40px;
    max-width: 700px;
    margin-top: -32px;
}
.t06-form {
    max-width: 720px;
}
.t06-form label {
    display: block;
    margin-bottom: 20px;
}
.t06-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 0;
}
.t06-form-row label { margin-bottom: 0; }
.t06-form label span {
    display: block;
    font-family: "JetBrains Mono", monospace;
    font-size: 11px;
    color: rgba(232,234,236,0.55);
    letter-spacing: 0.05em;
    margin-bottom: 8px;
}
.t06-form input,
.t06-form textarea,
.t06-form select {
    width: 100%;
    background: rgba(232,234,236,0.04);
    border: 1px solid rgba(232,234,236,0.1);
    color: #E8EAEC;
    padding: 12px 14px;
    font-family: inherit;
    font-size: 14px;
    border-radius: 6px;
    transition: all 0.3s ease;
}
.t06-form select option {
    background: #0E1518;
    color: #E8EAEC;
}
.t06-form input:focus,
.t06-form textarea:focus,
.t06-form select:focus {
    outline: none;
    border-color: #5DCAA5;
    background: rgba(93,202,165,0.04);
}
.t06-form-success {
    display: none;
    margin-top: 16px;
    padding: 12px 16px;
    background: rgba(93,202,165,0.08);
    border-left: 2px solid #5DCAA5;
    color: #5DCAA5;
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
}
.t06-form-success.visible { display: block; }
.t06-contact-direct {
    margin-top: 40px;
    padding-top: 32px;
    border-top: 1px solid rgba(93,202,165,0.1);
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    align-items: center;
    color: rgba(232,234,236,0.65);
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
}
.t06-contact-direct a {
    color: #E8EAEC;
    text-decoration: none;
    transition: color 0.2s ease;
}
.t06-contact-direct a:hover { color: #5DCAA5; }

.t06-footer {
    padding: 32px 48px;
    background: #0a1012;
    color: rgba(232,234,236,0.4);
    font-family: "JetBrains Mono", monospace;
    font-size: 12px;
    text-align: center;
    border-top: 1px solid rgba(93,202,165,0.1);
}


/* ============================================================
   RESPONSIVE FOR THEMES 4-6
   ============================================================ */
@media (max-width: 900px) {
    .t04-nav, .t05-nav, .t06-nav { padding: 14px 24px; }
    .t04-nav-links, .t05-nav-links, .t06-nav-links { gap: 16px; font-size: 12px; }
    .t04-masthead { padding: 50px 24px 30px; }
    .t04-masthead-meta { flex-direction: column; gap: 4px; align-items: center; }
    .t04-hero, .t04-section, .t05-hero, .t05-section, .t06-hero, .t06-section {
        padding-left: 24px;
        padding-right: 24px;
    }
    .t04-hero { padding-top: 40px; padding-bottom: 50px; }
    .t04-hero-grid, .t04-contact-grid,
    .t05-about-grid, .t05-form-row,
    .t06-form-row {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    .t04-beats-grid { grid-template-columns: 1fr; gap: 24px; }
    .t05-systems-grid, .t06-research-grid {
        grid-template-columns: 1fr;
    }
    .t05-stack-cols { grid-template-columns: repeat(2, 1fr); gap: 24px; }
    .t05-hero-stats { grid-template-columns: 1fr; gap: 24px; }
    .t05-hero { padding-top: 60px; padding-bottom: 80px; }
    .t06-hero { padding-top: 80px; padding-bottom: 80px; min-height: auto; }
    .t06-pub { grid-template-columns: 1fr; gap: 8px; }
}


/* ============================================================
   ============================================================
   THEME 07 — JUNIOR DEVELOPER · BRIGHT
   Cheerful, warm, hand-drawn feel. Coral + cream + electric blue.
   Soft blobs, rounded everything, big emoji, friendly type.
   Palette: #FFF8F0 cream / #FF6B6B coral / #4ECDC4 mint / #FFE66D yellow
   ============================================================
   ============================================================ */
.theme-07 {
    background: #FFF8F0;
    color: #2C2A4A;
    font-family: "Inter", -apple-system, sans-serif;
    overflow: hidden;
    position: relative;
}

.t07-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255,248,240,0.92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 18px 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #FFE66D;
}
.t07-nav-name {
    font-size: 18px;
    font-weight: 700;
    color: #2C2A4A;
    display: flex;
    align-items: center;
    gap: 8px;
}
.t07-nav-emoji {
    display: inline-block;
    animation: t07-wave 2.5s ease-in-out infinite;
    transform-origin: 70% 70%;
}
@keyframes t07-wave {
    0%, 60%, 100% { transform: rotate(0deg); }
    10%, 30% { transform: rotate(14deg); }
    20% { transform: rotate(-8deg); }
    40%, 50% { transform: rotate(10deg); }
}
.t07-nav-links {
    display: flex;
    gap: 28px;
    font-size: 14px;
}
.t07-nav-links a {
    color: #2C2A4A;
    text-decoration: none;
    transition: all 0.2s ease;
    font-weight: 500;
    position: relative;
}
.t07-nav-links a:hover {
    color: #FF6B6B;
}
.t07-nav-links a::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 2px;
    background: #FF6B6B;
    transition: width 0.3s ease;
}
.t07-nav-links a:hover::after { width: 100%; }

.t07-hero {
    position: relative;
    padding: 80px 40px 100px;
    overflow: hidden;
    min-height: 80vh;
    display: flex;
    align-items: center;
}

/* Floating gradient blobs */
.t07-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0.5;
    pointer-events: none;
    animation: t07-float 12s ease-in-out infinite;
}
.t07-blob-1 {
    background: #FF6B6B;
    width: 400px;
    height: 400px;
    top: -100px;
    right: -100px;
    animation-delay: 0s;
}
.t07-blob-2 {
    background: #4ECDC4;
    width: 350px;
    height: 350px;
    bottom: -100px;
    left: -50px;
    animation-delay: 4s;
}
.t07-blob-3 {
    background: #FFE66D;
    width: 280px;
    height: 280px;
    top: 50%;
    left: 50%;
    animation-delay: 8s;
}
@keyframes t07-float {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(30px, -40px) scale(1.1); }
    66% { transform: translate(-20px, 30px) scale(0.95); }
}

.t07-hero-inner {
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    width: 100%;
}
.t07-wave {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: #FFE66D;
    padding: 10px 20px;
    border-radius: 100px;
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 32px;
    box-shadow: 4px 4px 0 #2C2A4A;
}
.t07-wave-emoji {
    font-size: 24px;
    animation: t07-wave 2.5s ease-in-out infinite;
    transform-origin: 70% 70%;
}
.t07-hero-title {
    font-size: clamp(40px, 6vw, 76px);
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 28px;
    color: #2C2A4A;
    letter-spacing: -0.02em;
}
.t07-highlight {
    position: relative;
    z-index: 1;
    padding: 0 8px;
    display: inline-block;
}
.t07-highlight::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    transform: skew(-3deg);
}
.t07-highlight-1::after {
    background: #FF6B6B;
    opacity: 0.85;
}
.t07-highlight-2::after {
    background: #4ECDC4;
    opacity: 0.85;
}
.t07-hero-sub {
    font-size: 18px;
    line-height: 1.6;
    color: #5A5870;
    margin-bottom: 36px;
    max-width: 720px;
}
.t07-hero-actions {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 60px;
}
.t07-btn-primary {
    display: inline-block;
    padding: 14px 28px;
    background: #2C2A4A;
    color: #FFF8F0;
    text-decoration: none;
    border-radius: 100px;
    font-weight: 600;
    font-size: 15px;
    border: none;
    cursor: pointer;
    font-family: inherit;
    box-shadow: 4px 4px 0 #FF6B6B;
    transition: all 0.2s ease;
}
.t07-btn-primary:hover {
    transform: translate(-2px, -2px);
    box-shadow: 6px 6px 0 #FF6B6B;
}
.t07-btn-text {
    color: #2C2A4A;
    text-decoration: none;
    font-weight: 500;
    font-size: 15px;
    transition: color 0.2s ease;
}
.t07-btn-text:hover { color: #FF6B6B; }
.t07-hero-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    max-width: 720px;
}
.t07-stat {
    background: #FFF;
    border: 2px solid #2C2A4A;
    border-radius: 16px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    box-shadow: 3px 3px 0 #2C2A4A;
    transition: all 0.2s ease;
}
.t07-stat:hover {
    transform: translate(-2px, -2px);
    box-shadow: 5px 5px 0 #2C2A4A;
}
.t07-stat-emoji { font-size: 28px; }
.t07-stat-num {
    display: block;
    font-size: 24px;
    font-weight: 800;
    color: #2C2A4A;
    line-height: 1;
}
.t07-stat-label {
    display: block;
    font-size: 12px;
    color: #5A5870;
    margin-top: 2px;
}

.t07-section {
    padding: 100px 40px;
    position: relative;
    z-index: 2;
}
.t07-section-inner { max-width: 1100px; margin: 0 auto; }
.t07-section-header { margin-bottom: 56px; max-width: 800px; }
.t07-section-tag {
    display: inline-block;
    background: #FFE66D;
    color: #2C2A4A;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 6px 14px;
    border-radius: 100px;
    margin-bottom: 16px;
    border: 2px solid #2C2A4A;
}
.t07-section h2 {
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 700;
    line-height: 1.2;
    color: #2C2A4A;
    letter-spacing: -0.015em;
}
.t07-about-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 60px;
    align-items: start;
}
.t07-about-text p {
    font-size: 17px;
    line-height: 1.75;
    color: #5A5870;
    margin-bottom: 20px;
}
.t07-about-card {
    background: #4ECDC4;
    color: #2C2A4A;
    border: 2px solid #2C2A4A;
    border-radius: 20px;
    padding: 32px;
    box-shadow: 6px 6px 0 #2C2A4A;
    position: sticky;
    top: 100px;
}
.t07-card-emoji {
    font-size: 36px;
    margin-bottom: 12px;
    display: block;
}
.t07-about-card h4 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 12px;
}
.t07-about-card p {
    font-size: 14px;
    line-height: 1.65;
    color: #2C2A4A;
}

.t07-builds-section { background: #2C2A4A; color: #FFF8F0; }
.t07-builds-section h2 { color: #FFF8F0; }
.t07-builds-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}
.t07-build-card {
    background: #FFF8F0;
    color: #2C2A4A;
    border: 2px solid #FFF8F0;
    border-radius: 24px;
    overflow: hidden;
    transition: all 0.3s ease;
}
.t07-build-card:hover {
    transform: translateY(-6px) rotate(-0.5deg);
    box-shadow: 0 16px 0 -4px rgba(255,107,107,0.3);
}
.t07-build-image {
    aspect-ratio: 16/10;
    overflow: hidden;
    position: relative;
}
.t07-build-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}
.t07-build-card:hover .t07-build-image img {
    transform: scale(1.05);
}
.t07-build-tag {
    display: inline-block;
    background: #FFE66D;
    color: #2C2A4A;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 5px 12px;
    border-radius: 100px;
    margin: 24px 24px 0;
}
.t07-build-card h3 {
    font-size: 22px;
    font-weight: 700;
    margin: 12px 24px 8px;
    line-height: 1.2;
    letter-spacing: -0.01em;
}
.t07-build-card p {
    font-size: 14px;
    line-height: 1.6;
    color: #5A5870;
    margin: 0 24px 16px;
}
.t07-build-link {
    display: inline-block;
    margin: 0 24px 24px;
    color: #FF6B6B;
    font-weight: 600;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s ease;
}
.t07-build-link:hover { color: #2C2A4A; }

.t07-learning-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 60px;
}
.t07-learning-card {
    background: #FFF;
    border: 2px solid #2C2A4A;
    border-radius: 20px;
    padding: 28px;
    box-shadow: 4px 4px 0 #2C2A4A;
    transition: all 0.2s ease;
}
.t07-learning-card:hover {
    transform: translate(-3px, -3px);
    box-shadow: 7px 7px 0 #2C2A4A;
}
.t07-learning-emoji {
    font-size: 32px;
    margin-bottom: 14px;
    display: block;
}
.t07-learning-card h4 {
    font-size: 18px;
    font-weight: 700;
    color: #2C2A4A;
    margin-bottom: 8px;
}
.t07-learning-card p {
    font-size: 14px;
    line-height: 1.6;
    color: #5A5870;
    margin-bottom: 16px;
}
.t07-progress {
    background: #FFE66D;
    border: 1px solid #2C2A4A;
    border-radius: 100px;
    height: 12px;
    overflow: hidden;
    margin-bottom: 8px;
}
.t07-progress-bar {
    height: 100%;
    background: #FF6B6B;
    border-radius: 100px;
    transition: width 1.2s cubic-bezier(0.85, 0, 0.15, 1);
}
.t07-progress-label {
    font-size: 12px;
    color: #5A5870;
    font-weight: 500;
}
.t07-quote {
    background: #FFE66D;
    border: 2px solid #2C2A4A;
    border-radius: 20px;
    padding: 32px 40px;
    box-shadow: 6px 6px 0 #2C2A4A;
}
.t07-quote p {
    font-size: 22px;
    line-height: 1.5;
    color: #2C2A4A;
    font-weight: 500;
    font-style: italic;
    margin-bottom: 16px;
}
.t07-quote cite {
    font-size: 13px;
    color: #5A5870;
    font-style: normal;
}

.t07-contact-section { background: #FF6B6B; color: #FFF8F0; }
.t07-contact-section h2 { color: #FFF8F0; }
.t07-contact-section .t07-section-tag { background: #FFF8F0; color: #FF6B6B; border-color: #FFF8F0; }
.t07-contact-sub {
    font-size: 18px;
    line-height: 1.6;
    color: rgba(255,248,240,0.9);
    margin-bottom: 40px;
    max-width: 720px;
}
.t07-form {
    max-width: 600px;
    margin-bottom: 40px;
}
.t07-form label {
    display: block;
    margin-bottom: 18px;
}
.t07-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 0;
}
.t07-form-row label { margin-bottom: 0; }
.t07-form label span {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: rgba(255,248,240,0.9);
    margin-bottom: 8px;
}
.t07-form input,
.t07-form textarea {
    width: 100%;
    background: #FFF8F0;
    border: 2px solid #2C2A4A;
    color: #2C2A4A;
    padding: 12px 16px;
    border-radius: 12px;
    font-family: inherit;
    font-size: 15px;
    transition: all 0.2s ease;
}
.t07-form input:focus,
.t07-form textarea:focus {
    outline: none;
    box-shadow: 4px 4px 0 #2C2A4A;
    transform: translate(-2px, -2px);
}
.t07-contact-section .t07-btn-primary {
    background: #FFE66D;
    color: #2C2A4A;
    box-shadow: 4px 4px 0 #2C2A4A;
}
.t07-contact-section .t07-btn-primary:hover {
    box-shadow: 6px 6px 0 #2C2A4A;
}
.t07-form-success {
    display: none;
    margin-top: 16px;
    padding: 14px 18px;
    background: #FFE66D;
    color: #2C2A4A;
    border-radius: 12px;
    font-weight: 600;
    border: 2px solid #2C2A4A;
}
.t07-form-success.visible { display: block; }
.t07-contact-direct {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    padding-top: 32px;
    border-top: 1px solid rgba(255,248,240,0.2);
}
.t07-contact-direct a {
    color: #FFF8F0;
    text-decoration: none;
    font-size: 15px;
    transition: color 0.2s ease;
}
.t07-contact-direct a:hover { color: #FFE66D; }

.t07-footer {
    padding: 32px 40px;
    background: #2C2A4A;
    color: rgba(255,248,240,0.6);
    font-size: 13px;
    text-align: center;
}


/* ============================================================
   THEME 07 RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
    .t07-nav { padding: 14px 24px; }
    .t07-nav-links { gap: 16px; font-size: 12px; }
    .t07-hero, .t07-section { padding-left: 24px; padding-right: 24px; }
    .t07-hero { padding-top: 60px; padding-bottom: 80px; }
    .t07-hero-stats { grid-template-columns: 1fr; }
    .t07-about-grid, .t07-builds-grid, .t07-learning-grid, .t07-form-row {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .t07-about-card { position: static; }
}


/* ============================================================
   ============================================================
   THEME 08 — FRONT-END AGENCY · FUSION
   The complete Culinary Geometry stylesheet, scope-prefixed to
   .theme-08 so it lives alongside the other themes without
   conflicting. Three philosophies in one: Neo-Brutalist
   (typography, contrast, raw edges), Glassmorphic depth (modal
   blur, subtle borders), and Cinematic Grid (clip-path reveals,
   scroll animations).
   Class names also renamed with .t08- prefix to match the HTML.
   Original code: github.com/jdbostonbu-ops
   ============================================================
   ============================================================ */

.theme-08 {
    --t08-bg-dark: #070707;
    --t08-text-light: #f5f5f5;
    --t08-accent: #FF4D00;
    --t08-surface: #121212;
    --t08-surface-border: rgba(255, 255, 255, 0.1);
    
    --t08-font-title: clamp(2.5rem, 5vw + 1rem, 6rem);
    --t08-font-heading: clamp(1.25rem, 2vw + 0.5rem, 2rem);
    --t08-font-body: clamp(0.875rem, 1vw + 0.5rem, 1.125rem);
    
    --t08-ease-cinematic: cubic-bezier(0.85, 0, 0.15, 1);
    --t08-ease-bounce: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.theme-08 *, .theme-08 *::before, .theme-08 *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.theme-08 {
    background-color: var(--t08-bg-dark);
    color: var(--t08-text-light);
    font-family: "Helvetica Neue", Inter, system-ui, sans-serif;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

.theme-08 .t08-hero {
    height: 40vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2rem;
    position: relative;
}

.theme-08 .t08-hero-title {
    font-size: var(--t08-font-title);
    text-transform: uppercase;
    letter-spacing: -0.05em;
    font-weight: 900;
    line-height: 1;
    margin-bottom: 0.5rem;
    clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
    animation: t08TextReveal 1.2s var(--t08-ease-cinematic) forwards;
}

.theme-08 .t08-hero-subtitle {
    font-size: var(--t08-font-body);
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    opacity: 0;
    animation: t08FadeUp 1s var(--t08-ease-cinematic) 0.6s forwards;
}

.theme-08 .t08-grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
    gap: 3vw;
    padding: 2vw 4vw 8vw;
    width: 100%;
    max-width: 1800px;
    margin: 0 auto;
}

.theme-08 .t08-card {
    perspective: 1200px;
    aspect-ratio: 3 / 4;
    width: 100%;
    position: relative;
    outline: none;
}

.theme-08 .t08-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 0.9s var(--t08-ease-bounce);
    will-change: transform;
}

.theme-08 .t08-card:hover .t08-card-inner,
.theme-08 .t08-card:focus-within .t08-card-inner {
    transform: rotateY(180deg);
}

.theme-08 .t08-card-front, 
.theme-08 .t08-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    border-radius: 0.25rem;
    overflow: hidden;
    background-color: var(--t08-surface);
}

.theme-08 .t08-card-front {
    clip-path: polygon(0 50%, 100% 50%, 100% 50%, 0 50%);
    transition: clip-path 1s var(--t08-ease-cinematic);
}

.theme-08 .t08-card.is-visible .t08-card-front {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.theme-08 .t08-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(80%) contrast(120%);
    transition: filter 0.5s ease, transform 0.5s ease;
}

.theme-08 .t08-card:hover .t08-card-image {
    filter: grayscale(0%) contrast(100%);
    transform: scale(1.05);
}

.theme-08 .card-title-front {
    position: absolute;
    bottom: 1.5rem;
    left: 1.5rem;
    right: 1.5rem;
    font-size: var(--t08-font-heading);
    font-weight: 700;
    text-transform: uppercase;
    text-shadow: 0 4px 12px rgba(0,0,0,0.8);
    z-index: 2;
}

.theme-08 .t08-card-front::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 50%);
    pointer-events: none;
}

.theme-08 .t08-card-back {
    transform: rotateY(180deg);
    padding: 2rem;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--t08-surface-border);
    background: linear-gradient(135deg, var(--t08-surface) 0%, #000 100%);
}

.theme-08 .recipe-title {
    font-size: var(--t08-font-heading);
    color: var(--t08-accent);
    margin-bottom: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.theme-08 .t08-recipe-meta {
    font-size: var(--t08-font-body);
    color: #aaa;
    margin-bottom: 1.5rem;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--t08-surface-border);
    padding-bottom: 0.5rem;
}

.theme-08 .t08-recipe-ingredients {
    list-style: none;
    font-size: var(--t08-font-body);
    line-height: 1.6;
    flex-grow: 1;
}

.theme-08 .t08-recipe-ingredients li::before {
    content: '▹';
    color: var(--t08-accent);
    margin-right: 0.5rem;
}

.theme-08 .t08-btn-view {
    margin-top: 1.5rem;
    padding: 1rem;
    background: transparent;
    color: var(--t08-text-light);
    border: 1px solid var(--t08-accent);
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: all 0.3s var(--t08-ease-cinematic);
    width: 100%;
}

.theme-08 .t08-btn-view:hover, .theme-08 .t08-btn-view:focus-visible {
    background: var(--t08-accent);
    color: var(--t08-bg-dark);
    outline: none;
}

.theme-08 .t08-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s var(--t08-ease-cinematic);
    padding: 1rem;
}

.theme-08 .t08-modal.is-open {
    opacity: 1;
    pointer-events: auto;
}

.theme-08 .t08-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.theme-08 .t08-modal-content {
    position: relative;
    width: 100%;
    max-width: 1000px;
    max-height: 90vh;
    background: var(--t08-surface);
    border: 1px solid var(--t08-surface-border);
    border-radius: 0.5rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(40px) scale(0.98);
    transition: transform 0.6s var(--t08-ease-bounce);
    z-index: 1;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

.theme-08 .t08-modal.is-open .t08-modal-content {
    transform: translateY(0) scale(1);
}

.theme-08 .t08-close-btn {
    position: absolute;
    top: 1rem;
    right: 1.5rem;
    background: none;
    border: none;
    color: var(--t08-text-light);
    font-size: 2.5rem;
    cursor: pointer;
    z-index: 10;
    transition: color 0.3s;
    line-height: 1;
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

.theme-08 .t08-close-btn:hover, .theme-08 .t08-close-btn:focus-visible {
    color: var(--t08-accent);
    outline: none;
}

.theme-08 .t08-modal-image {
    width: 100%;
    height: 35vh;
    object-fit: cover;
    border-bottom: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-modal-body {
    padding: 2rem;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--t08-accent) var(--t08-surface);
}

.theme-08 .t08-modal-body::-webkit-scrollbar {
    width: 6px;
}
.theme-08 .t08-modal-body::-webkit-scrollbar-track {
    background: var(--t08-surface);
}
.theme-08 .t08-modal-body::-webkit-scrollbar-thumb {
    background-color: var(--t08-accent);
}

.theme-08 .t08-modal-title {
    font-size: clamp(1.8rem, 3vw + 1rem, 3rem);
    color: var(--t08-text-light);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    font-weight: 900;
}

.theme-08 .t08-modal-meta {
    margin-bottom: 2rem;
}

.theme-08 .t08-modal-section {
    margin-bottom: 2rem;
}

.theme-08 .t08-modal-section h3 {
    text-transform: uppercase;
    color: var(--t08-accent);
    font-size: 0.85rem;
    letter-spacing: 0.15em;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-modal-instructions p {
    font-size: var(--t08-font-body);
    line-height: 1.8;
    color: #ccc;
    margin-bottom: 1rem;
}

@media (min-width: 768px) {
    .theme-08 .t08-modal-content {
        flex-direction: row;
        height: 70vh;
    }
    .theme-08 .t08-modal-image {
        width: 45%;
        height: 100%;
        border-bottom: none;
        border-right: 1px solid var(--t08-surface-border);
    }
    .theme-08 .t08-modal-body {
        width: 55%;
        padding: 3rem;
    }
}

@keyframes t08TextReveal {
    0% { clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%); transform: translateY(20px); }
    100% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); transform: translateY(0); }
}

@keyframes t08FadeUp {
    0% { opacity: 0; transform: translateY(10px); }
    100% { opacity: 1; transform: translateY(0); }
}
/* ═══════════════════════════════════════════
   SITE NAV
═══════════════════════════════════════════ */
.theme-08 .t08-site-nav {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.5rem 4vw;
    z-index: 10;
}

.theme-08 .t08-nav-brand {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--t08-text-light);
    opacity: 0.5;
}

.theme-08 .t08-nav-contact-link {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--t08-text-light);
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.25);
    padding: 0.45em 1.2em;
    border-radius: 2px;
    transition: background 0.3s var(--t08-ease-cinematic),
                border-color 0.3s var(--t08-ease-cinematic),
                color 0.3s var(--t08-ease-cinematic);
}

.theme-08 .t08-nav-contact-link:hover,
.theme-08 .t08-nav-contact-link:focus-visible {
    background: var(--t08-accent);
    border-color: var(--t08-accent);
    color: #fff;
    outline: none;
}

/* ═══════════════════════════════════════════
   CONTACT SECTION
═══════════════════════════════════════════ */
.theme-08 .t08-contact-section {
    width: 100%;
    padding: 8vw 4vw;
    border-top: 1px solid var(--t08-surface-border);
    background: linear-gradient(180deg, var(--t08-bg-dark) 0%, #0d0d0d 100%);
}

.theme-08 .t08-contact-inner {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.theme-08 .t08-contact-kicker {
    font-size: 0.7rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--t08-accent);
    margin-bottom: 1.2rem;
}

.theme-08 .t08-contact-title {
    font-size: clamp(2.5rem, 6vw, 5rem);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -0.03em;
    line-height: 1;
    color: var(--t08-text-light);
    margin-bottom: 0.5rem;
}

.theme-08 .t08-contact-role {
    font-size: 0.85rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #666;
    margin-bottom: 3.5rem;
}

.theme-08 .t08-contact-details {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    align-items: center;
}

.theme-08 .t08-contact-item {
    display: flex;
    align-items: baseline;
    gap: 1.25rem;
    flex-wrap: wrap;
    justify-content: center;
}

.theme-08 .t08-contact-label {
    font-size: 0.62rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #555;
    flex-shrink: 0;
    min-width: 70px;
    text-align: right;
}

.theme-08 .t08-contact-value {
    font-size: clamp(0.95rem, 1.5vw, 1.15rem);
    color: var(--t08-text-light);
    letter-spacing: 0.02em;
}

.theme-08 .t08-contact-link {
    text-decoration: none;
    color: var(--t08-text-light);
    border-bottom: 1px solid rgba(255, 77, 0, 0.4);
    transition: color 0.3s var(--t08-ease-cinematic),
                border-color 0.3s var(--t08-ease-cinematic);
    padding-bottom: 2px;
}

.theme-08 .t08-contact-link:hover,
.theme-08 .t08-contact-link:focus-visible {
    color: var(--t08-accent);
    border-color: var(--t08-accent);
    outline: none;
}

@media (max-width: 600px) {
    .theme-08 .t08-contact-item {
        flex-direction: column;
        align-items: center;
        gap: 0.3rem;
    }
    .theme-08 .t08-contact-label {
        text-align: center;
        min-width: auto;
    }
    .theme-08 .t08-site-nav {
        padding: 1.2rem 5vw;
    }
}

/* ═══════════════════════════════════════════
   NAV LINKS
═══════════════════════════════════════════ */
.theme-08 .t08-nav-links {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.theme-08 .t08-nav-link {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(245,245,245,0.55);
    text-decoration: none;
    transition: color 0.3s ease;
}

.theme-08 .t08-nav-link:hover { color: var(--t08-text-light); }

/* ═══════════════════════════════════════════
   SHARED SECTION STYLES
═══════════════════════════════════════════ */
.theme-08 .t08-section-kicker {
    font-size: 0.7rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--t08-accent);
    margin-bottom: 1rem;
}

.theme-08 .t08-section-heading {
    font-size: clamp(2rem, 5vw, 4rem);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -0.03em;
    line-height: 1;
    color: var(--t08-text-light);
    margin-bottom: 3rem;
}

/* ═══════════════════════════════════════════
   CHEF BIO
═══════════════════════════════════════════ */
.theme-08 .t08-chef-bio-section {
    padding: 10vw 4vw;
    border-top: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-chef-bio-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6vw;
    align-items: center;
}

.theme-08 .t08-chef-bio-body {
    font-size: var(--t08-font-body);
    color: #aaa;
    line-height: 1.85;
    margin-bottom: 1.5rem;
}

.theme-08 .t08-chef-bio-stats {
    display: flex;
    gap: 3rem;
    margin-top: 2.5rem;
    padding-top: 2.5rem;
    border-top: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-chef-stat-num {
    display: block;
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 900;
    color: var(--t08-accent);
    letter-spacing: -0.04em;
    line-height: 1;
}

.theme-08 .t08-chef-stat-label {
    display: block;
    font-size: 0.65rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #555;
    margin-top: 0.4rem;
}

.theme-08 .t08-chef-bio-image-wrap {
    position: relative;
}

.theme-08 .t08-chef-bio-image {
    width: 100%;
    aspect-ratio: 3/4;
    object-fit: cover;
    filter: grayscale(30%);
    border-radius: 2px;
}

.theme-08 .t08-chef-bio-image-wrap::after {
    content: '';
    position: absolute;
    inset: 1rem -1rem -1rem 1rem;
    border: 1px solid rgba(255,77,0,0.3);
    border-radius: 2px;
    pointer-events: none;
    z-index: -1;
}

/* ═══════════════════════════════════════════
   PHILOSOPHY
═══════════════════════════════════════════ */
.theme-08 .t08-philosophy-section {
    padding: 10vw 4vw;
    border-top: 1px solid var(--t08-surface-border);
    text-align: center;
    background: linear-gradient(180deg, var(--t08-bg-dark) 0%, #0a0a0a 100%);
}

.theme-08 .t08-philosophy-inner {
    max-width: 860px;
    margin: 0 auto;
}

.theme-08 .t08-quote-mark {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 1.4em;
    color: var(--t08-accent);
    opacity: 0.6;
    line-height: 0;
    vertical-align: -0.1em;
}

.theme-08 .t08-philosophy-quote {
    font-size: clamp(1.4rem, 3vw, 2.4rem);
    font-weight: 700;
    color: var(--t08-text-light);
    line-height: 1.4;
    letter-spacing: -0.02em;
    font-style: normal;
    margin-bottom: 2rem;
}

.theme-08 .t08-philosophy-attr {
    font-size: 0.72rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #555;
}

/* ═══════════════════════════════════════════
   SERVICES
═══════════════════════════════════════════ */
.theme-08 .t08-services-section {
    padding: 10vw 4vw;
    border-top: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-services-inner {
    max-width: 1200px;
    margin: 0 auto;
}

.theme-08 .t08-services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
    gap: 1px;
    border: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-service-card {
    padding: 3rem 2.5rem;
    border-right: 1px solid var(--t08-surface-border);
    border-bottom: 1px solid var(--t08-surface-border);
    transition: background 0.4s ease;
}

.theme-08 .t08-service-card:hover {
    background: rgba(255,77,0,0.04);
}

.theme-08 .t08-service-num {
    font-size: 0.65rem;
    letter-spacing: 0.22em;
    color: var(--t08-accent);
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.theme-08 .t08-service-title {
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--t08-text-light);
    margin-bottom: 1rem;
}

.theme-08 .t08-service-body {
    font-size: 0.9rem;
    color: #777;
    line-height: 1.75;
    margin-bottom: 1.5rem;
}

.theme-08 .t08-service-detail {
    font-size: 0.65rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #444;
    padding-top: 1rem;
    border-top: 1px solid var(--t08-surface-border);
}

/* ═══════════════════════════════════════════
   GALLERY
═══════════════════════════════════════════ */
.theme-08 .t08-gallery-section {
    padding: 10vw 4vw;
    border-top: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 280px;
    gap: 4px;
    max-width: 1400px;
    margin: 0 auto;
}

.theme-08 .t08-gallery-item {
    overflow: hidden;
    position: relative;
}

.theme-08 .t08-gallery-item--tall {
    grid-row: span 2;
}

.theme-08 .t08-gallery-item--wide {
    grid-column: span 2;
}

.theme-08 .t08-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(60%);
    transition: filter 0.6s ease, transform 0.6s ease;
}

.theme-08 .t08-gallery-item:hover img {
    filter: grayscale(0%);
    transform: scale(1.04);
}

/* ═══════════════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════════════ */
.theme-08 .t08-testimonials-section {
    padding: 10vw 4vw;
    border-top: 1px solid var(--t08-surface-border);
    background: #0a0a0a;
}

.theme-08 .t08-testimonials-inner {
    max-width: 1200px;
    margin: 0 auto;
}

.theme-08 .t08-testimonials-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
    gap: 1px;
    border: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-testimonial-card {
    padding: 3rem 2.5rem;
    border-right: 1px solid var(--t08-surface-border);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
    transition: background 0.4s ease;
}

.theme-08 .t08-testimonial-card:hover {
    background: rgba(255,255,255,0.02);
}

.theme-08 .t08-testimonial-quote {
    font-size: 0.95rem;
    color: #aaa;
    line-height: 1.85;
    font-style: italic;
}

.theme-08 .t08-testimonial-attr {
    font-size: 0.65rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--t08-accent);
}

/* ═══════════════════════════════════════════
   EVENTS
═══════════════════════════════════════════ */
.theme-08 .t08-events-section {
    padding: 10vw 4vw;
    border-top: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-events-inner {
    max-width: 1000px;
    margin: 0 auto;
}

.theme-08 .t08-events-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    border-top: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-event-item {
    display: flex;
    align-items: center;
    gap: 3rem;
    padding: 2.5rem 0;
    border-bottom: 1px solid var(--t08-surface-border);
    transition: background 0.3s ease;
}

.theme-08 .t08-event-item:hover {
    background: rgba(255,77,0,0.03);
    padding-left: 1rem;
    padding-right: 1rem;
    margin: 0 -1rem;
}

.theme-08 .t08-event-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 60px;
    flex-shrink: 0;
}

.theme-08 .t08-event-month {
    font-size: 0.6rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--t08-accent);
}

.theme-08 .t08-event-day {
    font-size: 2.5rem;
    font-weight: 900;
    color: var(--t08-text-light);
    line-height: 1;
    letter-spacing: -0.04em;
}

.theme-08 .t08-event-info {
    flex: 1;
}

.theme-08 .t08-event-title {
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--t08-text-light);
    margin-bottom: 0.4rem;
}

.theme-08 .t08-event-detail {
    font-size: 0.78rem;
    color: #666;
    letter-spacing: 0.06em;
}

.theme-08 .t08-event-cta {
    font-size: 0.65rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--t08-text-light);
    text-decoration: none;
    border: 1px solid rgba(255,77,0,0.4);
    padding: 0.6em 1.4em;
    border-radius: 2px;
    flex-shrink: 0;
    transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

.theme-08 .t08-event-cta:hover {
    background: var(--t08-accent);
    border-color: var(--t08-accent);
    color: #fff;
}

/* ═══════════════════════════════════════════
   BOOKING CTAs + NEWSLETTER
═══════════════════════════════════════════ */
.theme-08 .t08-contact-cta-group {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 3.5rem;
}

.theme-08 .t08-contact-cta-btn {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 1em 2.2em;
    border-radius: 2px;
    transition: all 0.3s var(--t08-ease-cinematic);
    background: var(--t08-accent);
    color: #fff;
    border: 1px solid var(--t08-accent);
}

.theme-08 .t08-contact-cta-btn:hover {
    background: transparent;
    color: var(--t08-accent);
}

.theme-08 .t08-contact-cta-btn--outline {
    background: transparent;
    color: var(--t08-text-light);
    border: 1px solid rgba(255,255,255,0.2);
}

.theme-08 .t08-contact-cta-btn--outline:hover {
    border-color: var(--t08-accent);
    color: var(--t08-accent);
}

.theme-08 .t08-newsletter-wrap {
    margin-top: 4rem;
    padding-top: 3rem;
    border-top: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-newsletter-label {
    font-size: 0.7rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #555;
    margin-bottom: 1.2rem;
}

.theme-08 .t08-newsletter-form {
    display: flex;
    gap: 0;
    max-width: 420px;
    margin: 0 auto;
    border: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-newsletter-input {
    flex: 1;
    background: transparent;
    border: none;
    color: var(--t08-text-light);
    padding: 0.85em 1.2em;
    font-size: 0.85rem;
    outline: none;
    font-family: inherit;
}

.theme-08 .t08-newsletter-input::placeholder { color: #444; }

.theme-08 .t08-newsletter-btn {
    background: var(--t08-accent);
    color: #fff;
    border: none;
    padding: 0.85em 1.5em;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    cursor: pointer;
    font-family: inherit;
    transition: opacity 0.3s ease;
}

.theme-08 .t08-newsletter-btn:hover { opacity: 0.85; }

.theme-08 .t08-newsletter-thanks {
    font-size: 0.75rem;
    letter-spacing: 0.14em;
    color: var(--t08-accent);
    margin-top: 1rem;
    text-transform: uppercase;
}

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 768px) {
    .theme-08 .t08-chef-bio-inner { grid-template-columns: 1fr; }
    .theme-08 .t08-chef-bio-image-wrap { order: -1; }
    .theme-08 .t08-chef-bio-image { aspect-ratio: 4/3; }
    .theme-08 .t08-chef-bio-stats { gap: 1.5rem; }
    .theme-08 .t08-gallery-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 200px; }
    .theme-08 .t08-gallery-item--tall { grid-row: span 1; }
    .theme-08 .t08-gallery-item--wide { grid-column: span 2; }
    .theme-08 .t08-event-item { flex-wrap: wrap; gap: 1.5rem; }
    .theme-08 .t08-nav-links { gap: 1rem; }
    .theme-08 .t08-nav-link { display: none; }
}

@media (max-width: 480px) {
    .theme-08 .t08-gallery-grid { grid-template-columns: 1fr; }
    .theme-08 .t08-gallery-item--wide { grid-column: span 1; }
    .theme-08 .t08-contact-cta-group { flex-direction: column; align-items: center; }
}

/* ═══════════════════════════════════════════
   BOOKING & EVENT FLIP CARDS
═══════════════════════════════════════════ */
.theme-08 .t08-flip-card-wrap {
    margin: 2rem auto 0;
    max-width: 860px;
}

.theme-08 .t08-flip-card {
    width: 100%;
    min-height: 560px;
    position: relative;
}

/* Front visible by default, back hidden */
.theme-08 .t08-flip-card-front {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #0d0d0d 0%, #1a1a1a 100%);
    border: 1px solid var(--t08-surface-border);
    border-radius: 4px;
    min-height: 200px;
    transition: opacity 0.3s ease, transform 0.6s ease;
}

.theme-08 .t08-flip-card-back {
    display: none;
    background: var(--t08-surface);
    border: 1px solid var(--t08-surface-border);
    border-radius: 4px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--t08-accent) var(--t08-surface);
    animation: t08SlideReveal 0.5s ease forwards;
}

@keyframes t08SlideReveal {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* When flipped — hide front, show back */
.theme-08 .t08-flip-card.is-flipped .t08-flip-card-front { display: none; }
.theme-08 .t08-flip-card.is-flipped .t08-flip-card-back  { display: block; }

.theme-08 .t08-flip-card-inner { width: 100%; }

.theme-08 .t08-flip-card-front-content {
    text-align: center;
    padding: 3rem;
}

.theme-08 .t08-flip-card-icon {
    font-size: 3rem;
    display: block;
    margin-bottom: 1rem;
    line-height: 1;
}

.theme-08 .t08-flip-card-label {
    font-size: 1.2rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--t08-text-light);
    margin-bottom: 0.5rem;
}

.theme-08 .t08-flip-card-sub {
    font-size: 0.75rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #555;
}

/* ── BOOKING FORM ── */
.theme-08 .t08-booking-form-wrap,
.theme-08 .t08-event-enquiry-wrap {
    padding: 2.5rem;
    width: 100%;
}

.theme-08 .t08-form-title {
    font-size: 1.2rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--t08-text-light);
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--t08-surface-border);
}

.theme-08 .t08-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.theme-08 .t08-form-group {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 1rem;
}

.theme-08 .t08-form-label {
    font-size: 0.6rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #666;
}

.theme-08 .t08-form-input {
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--t08-surface-border);
    color: var(--t08-text-light);
    padding: 0.75em 1em;
    font-size: 0.875rem;
    font-family: inherit;
    outline: none;
    transition: border-color 0.3s ease;
    border-radius: 2px;
    width: 100%;
}

.theme-08 .t08-form-input:focus {
    border-color: var(--t08-accent);
}

.theme-08 .t08-form-input::placeholder { color: #444; }

.theme-08 .t08-form-select option {
    background: #1a1a1a;
    color: var(--t08-text-light);
}

.theme-08 .t08-form-textarea {
    resize: vertical;
    min-height: 90px;
}

.theme-08 .t08-form-actions {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
    flex-wrap: wrap;
}

.theme-08 .t08-form-submit-btn {
    background: var(--t08-accent);
    color: #fff;
    border: none;
    padding: 0.85em 2em;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    cursor: pointer;
    font-family: inherit;
    border-radius: 2px;
    transition: opacity 0.3s ease;
    flex: 1;
}

.theme-08 .t08-form-submit-btn:hover { opacity: 0.85; }

.theme-08 .t08-form-cancel-btn {
    background: transparent;
    color: #555;
    border: 1px solid var(--t08-surface-border);
    padding: 0.85em 1.5em;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    cursor: pointer;
    font-family: inherit;
    border-radius: 2px;
    transition: color 0.3s ease, border-color 0.3s ease;
}

.theme-08 .t08-form-cancel-btn:hover {
    color: var(--t08-text-light);
    border-color: rgba(255,255,255,0.3);
}

.theme-08 .t08-form-thanks {
    text-align: center;
    padding: 3rem 2rem;
}

.theme-08 .t08-thanks-icon {
    font-size: 3rem;
    color: var(--t08-accent);
    margin-bottom: 1rem;
    line-height: 1;
}

.theme-08 .t08-thanks-title {
    font-size: 1.5rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--t08-text-light);
    margin-bottom: 1rem;
}

.theme-08 .t08-thanks-body {
    font-size: 0.9rem;
    color: #777;
    line-height: 1.7;
    margin-bottom: 2rem;
    max-width: 360px;
    margin-left: auto;
    margin-right: auto;
}

/* ── CALENDAR ── */
.theme-08 .t08-cal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.2rem;
}

.theme-08 .t08-cal-nav {
    background: transparent;
    border: 1px solid var(--t08-surface-border);
    color: var(--t08-text-light);
    font-size: 1.2rem;
    width: 36px;
    height: 36px;
    cursor: pointer;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.3s ease;
    font-family: inherit;
}

.theme-08 .t08-cal-nav:hover { border-color: var(--t08-accent); color: var(--t08-accent); }

.theme-08 .t08-cal-month-label {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--t08-text-light);
}

.theme-08 .t08-cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-bottom: 1rem;
}

.theme-08 .cal-day-name {
    font-size: 0.55rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #555;
    text-align: center;
    padding: 4px 0;
}

.theme-08 .t08-cal-day {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    border-radius: 2px;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.2s ease;
    color: var(--t08-text-light);
}

.theme-08 .t08-cal-day.empty { cursor: default; }
.theme-08 .t08-cal-day.past { color: #333; cursor: default; }

.theme-08 .t08-cal-day.t08-booked {
    background: rgba(255,77,0,0.12);
    color: var(--t08-accent);
    cursor: not-allowed;
    border-color: rgba(255,77,0,0.2);
}

.theme-08 .t08-cal-day.t08-available {
    background: rgba(255,255,255,0.04);
    border-color: var(--t08-surface-border);
}

.theme-08 .t08-cal-day.t08-available:hover {
    background: rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.3);
}

.theme-08 .t08-cal-day.t08-selected {
    background: var(--t08-accent);
    color: #fff;
    border-color: var(--t08-accent);
}

.theme-08 .t08-cal-legend {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: 0.6rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #555;
    margin-bottom: 1.2rem;
    flex-wrap: wrap;
}

.theme-08 .t08-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    display: inline-block;
}

.theme-08 .t08-legend-dot.t08-booked { background: rgba(255,77,0,0.4); }
.theme-08 .t08-legend-dot.t08-available { background: rgba(255,255,255,0.15); border: 1px solid var(--t08-surface-border); }
.theme-08 .t08-legend-dot.t08-selected { background: var(--t08-accent); }

.theme-08 .t08-time-slots-wrap {
    margin-bottom: 1.2rem;
}

.theme-08 .t08-time-slots-label {
    font-size: 0.62rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--t08-accent);
    margin-bottom: 0.8rem;
}

.theme-08 .t08-time-slots {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.theme-08 .t08-time-slot {
    font-size: 0.72rem;
    padding: 0.4em 1em;
    border: 1px solid var(--t08-surface-border);
    border-radius: 2px;
    cursor: pointer;
    color: var(--t08-text-light);
    transition: all 0.2s ease;
    background: transparent;
    font-family: inherit;
    letter-spacing: 0.06em;
}

.theme-08 .t08-time-slot:hover, .theme-08 .t08-time-slot.t08-selected {
    background: var(--t08-accent);
    border-color: var(--t08-accent);
    color: #fff;
}

.theme-08 .t08-time-slot.taken {
    color: #333;
    border-color: #222;
    cursor: not-allowed;
}

.theme-08 .t08-enquiry-form { padding-top: 0; }

.theme-08 .t08-event-form-actions {
    display: flex;
    gap: 1rem;
    margin-top: 1rem;
    flex-wrap: wrap;
}

@media (max-width: 600px) {
    .theme-08 .t08-form-row { grid-template-columns: 1fr; }
    .theme-08 .t08-booking-form-wrap, .theme-08 .t08-event-enquiry-wrap { padding: 1.5rem; }
    .theme-08 .t08-flip-card, .theme-08 .t08-flip-card-inner { min-height: 700px; }
}




/* ============================================================
   ============================================================
   THEME 09 — FOOD TRUCK · BRUTALIST
   Anti-design. Raw concrete, hard borders, no rounded corners,
   oversized condensed type, electric red, hand-stamped feel.
   Palette: #F2EDE0 cream / #1A1815 charcoal / #E63946 alarm red
   ============================================================
   ============================================================ */
.theme-09 {
    background: #F2EDE0;
    color: #1A1815;
    font-family: "Inter", -apple-system, sans-serif;
    overflow-x: hidden;
}

.t09-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #1A1815;
    color: #F2EDE0;
    padding: 14px 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 4px solid #E63946;
}
.t09-nav-name {
    font-size: 18px;
    font-weight: 900;
    letter-spacing: 0.05em;
}
.t09-nav-links {
    display: flex;
    gap: 24px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
}
.t09-nav-links a {
    color: #F2EDE0;
    text-decoration: none;
    transition: all 0.15s ease;
    padding: 4px 8px;
}
.t09-nav-links a:hover {
    background: #E63946;
    color: #F2EDE0;
}

.t09-hero {
    padding: 80px 32px 40px;
    background: #F2EDE0;
    border-bottom: 4px solid #1A1815;
    position: relative;
}
.t09-hero-grid {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 60px;
    align-items: center;
    margin-bottom: 60px;
}
.t09-stamp {
    border: 4px solid #1A1815;
    padding: 16px 24px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    background: #E63946;
    color: #F2EDE0;
    transform: rotate(-3deg);
    width: fit-content;
    margin-bottom: 24px;
    box-shadow: 6px 6px 0 #1A1815;
}
.t09-stamp-num {
    font-size: 14px;
    font-weight: 900;
    letter-spacing: 0.15em;
}
.t09-stamp-big {
    font-size: 48px;
    line-height: 1;
    margin-top: 4px;
    letter-spacing: -0.02em;
}
.t09-hero-meta {
    display: flex;
    gap: 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.15em;
    color: #1A1815;
}
.t09-hero-title {
    font-family: "Inter", sans-serif;
    font-weight: 900;
    line-height: 0.85;
    letter-spacing: -0.04em;
    color: #1A1815;
    text-transform: uppercase;
    font-size: clamp(60px, 11vw, 160px);
}
.t09-hero-title span {
    display: block;
}
.t09-line-1 {
    color: #1A1815;
    transform: translateX(0);
    animation: t09-slideIn 0.6s cubic-bezier(0.85, 0, 0.15, 1) 0.1s both;
}
.t09-line-2 {
    color: #E63946;
    -webkit-text-stroke: 0;
    animation: t09-slideIn 0.6s cubic-bezier(0.85, 0, 0.15, 1) 0.25s both;
}
.t09-line-3 {
    font-size: 0.5em;
    color: #1A1815;
    letter-spacing: 0.15em;
    margin: 0.2em 0;
    animation: t09-slideIn 0.6s cubic-bezier(0.85, 0, 0.15, 1) 0.4s both;
}
.t09-line-4 {
    color: #1A1815;
    animation: t09-slideIn 0.6s cubic-bezier(0.85, 0, 0.15, 1) 0.55s both;
}
.t09-line-5 {
    color: #E63946;
    animation: t09-slideIn 0.6s cubic-bezier(0.85, 0, 0.15, 1) 0.7s both;
}
@keyframes t09-slideIn {
    from { opacity: 0; transform: translateX(-40px); }
    to { opacity: 1; transform: translateX(0); }
}
.t09-marquee {
    background: #1A1815;
    color: #F2EDE0;
    padding: 16px 0;
    overflow: hidden;
    border-top: 4px solid #E63946;
    border-bottom: 4px solid #E63946;
    white-space: nowrap;
}
.t09-marquee-track {
    display: inline-flex;
    gap: 0;
    animation: t09-marquee 30s linear infinite;
}
.t09-marquee-track span {
    display: inline-block;
    padding: 0 24px;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.1em;
    white-space: nowrap;
}
@keyframes t09-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
.t09-hero-sub {
    max-width: 1280px;
    margin: 60px auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
    flex-wrap: wrap;
    padding-top: 40px;
    border-top: 2px solid #1A1815;
}
.t09-hero-sub p {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    max-width: 600px;
}
.t09-cta-primary {
    display: inline-block;
    padding: 18px 36px;
    background: #1A1815;
    color: #F2EDE0;
    text-decoration: none;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-size: 14px;
    border: 4px solid #1A1815;
    transition: all 0.15s ease;
    cursor: pointer;
    font-family: inherit;
}
.t09-cta-primary:hover {
    background: #E63946;
    border-color: #E63946;
    transform: translate(-3px, -3px);
    box-shadow: 6px 6px 0 #1A1815;
}

.t09-section {
    padding: 80px 32px;
    border-top: 4px solid #1A1815;
}
.t09-section-inner {
    max-width: 1280px;
    margin: 0 auto;
}
.t09-section-mark {
    display: inline-block;
    background: #1A1815;
    color: #F2EDE0;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.15em;
    margin-bottom: 24px;
}
.t09-section-title {
    font-size: clamp(36px, 6vw, 72px);
    font-weight: 900;
    letter-spacing: -0.03em;
    line-height: 1;
    margin-bottom: 48px;
    text-transform: uppercase;
}

.t09-menu { background: #F2EDE0; }
.t09-menu-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
    border: 4px solid #1A1815;
    margin-bottom: 60px;
}
.t09-menu-item {
    padding: 28px;
    border-right: 2px solid #1A1815;
    border-bottom: 2px solid #1A1815;
    background: #F2EDE0;
    transition: all 0.15s ease;
    position: relative;
    cursor: default;
}
.t09-menu-item:nth-child(2n) { border-right: none; }
.t09-menu-item:nth-last-child(-n+2) { border-bottom: none; }
.t09-menu-item:hover {
    background: #1A1815;
    color: #F2EDE0;
}
.t09-menu-item:hover .t09-menu-tag {
    background: #E63946;
    color: #F2EDE0;
}
.t09-menu-num {
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.15em;
    color: #E63946;
}
.t09-menu-item h3 {
    font-size: 32px;
    font-weight: 900;
    letter-spacing: -0.02em;
    margin: 8px 0 12px;
    text-transform: uppercase;
}
.t09-menu-item p {
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 16px;
    max-width: 500px;
}
.t09-menu-tag {
    display: inline-block;
    background: #1A1815;
    color: #F2EDE0;
    padding: 4px 10px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.15em;
}
.t09-menu-item:hover .t09-menu-tag {
    background: #E63946;
}

.t09-menu-sides {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border: 4px solid #1A1815;
}
.t09-side-block {
    padding: 28px;
    border-right: 2px solid #1A1815;
}
.t09-side-block:last-child { border-right: none; }
.t09-side-block h4 {
    font-size: 14px;
    font-weight: 900;
    letter-spacing: 0.15em;
    margin-bottom: 16px;
    color: #E63946;
    padding-bottom: 12px;
    border-bottom: 2px solid #1A1815;
}
.t09-side-block ul {
    list-style: none;
}
.t09-side-block li {
    font-size: 14px;
    font-weight: 700;
    padding: 8px 0;
    border-bottom: 1px dashed rgba(26,24,21,0.2);
    letter-spacing: 0.05em;
}
.t09-side-block li:last-child { border-bottom: none; }

.t09-where-section { background: #1A1815; color: #F2EDE0; }
.t09-where-section .t09-section-mark {
    background: #E63946;
    color: #F2EDE0;
}
.t09-where-sub {
    font-size: 14px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(242,237,224,0.7);
    margin-bottom: 40px;
}
.t09-schedule {
    border: 3px solid #F2EDE0;
}
.t09-schedule-row {
    display: grid;
    grid-template-columns: 100px 1fr 140px;
    align-items: center;
    padding: 18px 24px;
    border-bottom: 2px solid #F2EDE0;
    transition: all 0.15s ease;
}
.t09-schedule-row:last-child { border-bottom: none; }
.t09-schedule-row:hover:not(.t09-closed) {
    background: #E63946;
}
.t09-schedule-row.t09-closed {
    color: rgba(242,237,224,0.4);
    background: rgba(242,237,224,0.05);
}
.t09-day {
    font-size: 18px;
    font-weight: 900;
    letter-spacing: 0.1em;
    color: #E63946;
}
.t09-schedule-row.t09-closed .t09-day { color: rgba(242,237,224,0.4); }
.t09-loc {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.05em;
}
.t09-time {
    font-size: 14px;
    font-weight: 700;
    text-align: right;
    letter-spacing: 0.05em;
}
.t09-where-warning {
    margin-top: 32px;
    padding: 16px 20px;
    background: #E63946;
    color: #F2EDE0;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1.5;
}

.t09-story-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
    margin-bottom: 60px;
}
.t09-story-text p {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.7;
    letter-spacing: 0.05em;
    margin-bottom: 16px;
    text-transform: uppercase;
}
.t09-dropcap {
    float: left;
    font-size: 80px;
    font-weight: 900;
    line-height: 0.85;
    margin: 0 12px 0 0;
    color: #E63946;
}
.t09-story-image {
    border: 4px solid #1A1815;
    overflow: hidden;
}
.t09-story-image img {
    width: 100%;
    aspect-ratio: 4/5;
    object-fit: cover;
    display: block;
    filter: contrast(110%) saturate(110%);
}
.t09-story-caption {
    display: block;
    background: #1A1815;
    color: #F2EDE0;
    padding: 10px 16px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.15em;
}
.t09-quote {
    background: #E63946;
    color: #F2EDE0;
    padding: 40px;
    border: 4px solid #1A1815;
    box-shadow: 8px 8px 0 #1A1815;
}
.t09-quote p {
    font-size: 28px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin-bottom: 16px;
    text-transform: uppercase;
}
.t09-quote cite {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.15em;
    font-style: normal;
}

.t09-contact-section { background: #F2EDE0; }
.t09-contact-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 60px;
    align-items: start;
}
.t09-form {
    background: #1A1815;
    color: #F2EDE0;
    padding: 40px;
    border: 4px solid #1A1815;
}
.t09-form label {
    display: block;
    margin-bottom: 16px;
}
.t09-form label span {
    display: block;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.15em;
    margin-bottom: 6px;
    color: #E63946;
}
.t09-form input,
.t09-form textarea,
.t09-form select {
    width: 100%;
    background: transparent;
    border: 2px solid #F2EDE0;
    color: #F2EDE0;
    padding: 10px 14px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.15s ease;
}
.t09-form select option {
    background: #1A1815;
    color: #F2EDE0;
}
.t09-form input:focus,
.t09-form textarea:focus,
.t09-form select:focus {
    outline: none;
    border-color: #E63946;
}
.t09-form .t09-cta-primary {
    background: #E63946;
    border-color: #E63946;
    color: #F2EDE0;
    margin-top: 8px;
}
.t09-form .t09-cta-primary:hover {
    background: #F2EDE0;
    color: #1A1815;
    border-color: #F2EDE0;
}
.t09-form-success {
    display: none;
    margin-top: 16px;
    padding: 14px;
    background: #E63946;
    color: #F2EDE0;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.1em;
    border: 2px solid #F2EDE0;
}
.t09-form-success.visible { display: block; }
.t09-contact-info h4 {
    font-size: 16px;
    font-weight: 900;
    letter-spacing: 0.1em;
    margin-bottom: 12px;
    color: #E63946;
    padding-bottom: 8px;
    border-bottom: 3px solid #1A1815;
}
.t09-contact-info p {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: 0.05em;
    margin-bottom: 16px;
}
.t09-contact-info p strong {
    display: block;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.15em;
    margin-bottom: 4px;
    color: #1A1815;
}

.t09-footer {
    background: #1A1815;
    color: #E63946;
    text-align: center;
    padding: 24px 32px;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.15em;
}


/* ============================================================
   THEMES 7-9 RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
    .t09-nav { padding: 12px 20px; }
    .t09-nav-links { gap: 12px; font-size: 11px; }
    .t09-hero, .t09-section { padding-left: 20px; padding-right: 20px; }
    .t09-hero-grid, .t09-menu-grid, .t09-menu-sides, .t09-story-grid, .t09-contact-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    .t09-menu-item { border-right: none; border-bottom: 2px solid #1A1815; }
    .t09-menu-item:last-child { border-bottom: none; }
    .t09-side-block { border-right: none; border-bottom: 2px solid #1A1815; }
    .t09-side-block:last-child { border-bottom: none; }
    .t09-schedule-row { grid-template-columns: 80px 1fr 100px; padding: 14px 16px; }
    .t09-hero-sub { flex-direction: column; align-items: flex-start; }
}


/* ============================================================
   ============================================================
   THEME 13 — PLANT NURSERY · BOTANICAL
   Warm cream + deep forest green + terracotta clay.
   Soft serif headlines, organic SVG leaf decorations, gentle
   sway animations, generous whitespace.
   Palette: #F5F1E8 cream / #2D4A2B forest / #C97D63 clay
   ============================================================
   ============================================================ */
.theme-13 {
    background: #F5F1E8;
    color: #2A2820;
    font-family: "Inter", -apple-system, sans-serif;
    overflow: hidden;
    position: relative;
}

.t13-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(245,241,232,0.92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 18px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(45,74,43,0.12);
}
.t13-nav-name {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 24px;
    font-weight: 500;
    color: #2D4A2B;
    letter-spacing: -0.01em;
    font-style: italic;
}
.t13-nav-leaf {
    color: #2D4A2B;
    animation: t13-sway 6s ease-in-out infinite;
    transform-origin: bottom center;
}
@keyframes t13-sway {
    0%, 100% { transform: rotate(-3deg); }
    50% { transform: rotate(3deg); }
}
.t13-nav-links {
    display: flex;
    gap: 32px;
    font-size: 14px;
}
.t13-nav-links a {
    color: #2D4A2B;
    text-decoration: none;
    transition: color 0.2s ease;
}
.t13-nav-links a:hover { color: #C97D63; }

.t13-hero {
    padding: 80px 60px 100px;
    position: relative;
    overflow: hidden;
}
.t13-hero-leaves {
    position: absolute;
    inset: 0;
    pointer-events: none;
    color: #2D4A2B;
    z-index: 1;
}
.t13-leaf {
    position: absolute;
    animation: t13-leaf-float 14s ease-in-out infinite;
}
.t13-leaf-1 {
    top: 10%;
    right: 5%;
    transform: rotate(15deg);
    animation-delay: 0s;
}
.t13-leaf-2 {
    bottom: 12%;
    left: 8%;
    transform: rotate(-25deg);
    animation-delay: 4s;
}
.t13-leaf-3 {
    top: 50%;
    right: 25%;
    transform: rotate(45deg);
    animation-delay: 8s;
}
@keyframes t13-leaf-float {
    0%, 100% { transform: translateY(0) rotate(15deg); }
    50% { transform: translateY(-20px) rotate(20deg); }
}
.t13-hero-grid {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 80px;
    align-items: center;
    position: relative;
    z-index: 2;
}
.t13-eyebrow {
    color: #C97D63;
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 16px;
    font-style: italic;
    margin-bottom: 24px;
    letter-spacing: 0.02em;
}
.t13-hero-title {
    font-family: "Crimson Pro", Georgia, serif;
    font-size: clamp(40px, 5.5vw, 68px);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: #2D4A2B;
    margin-bottom: 28px;
}
.t13-hero-title em {
    font-style: italic;
    color: #C97D63;
}
.t13-hero-deck {
    font-size: 19px;
    line-height: 1.7;
    color: #555048;
    margin-bottom: 36px;
    max-width: 540px;
    font-family: "Crimson Pro", Georgia, serif;
}
.t13-hero-actions {
    display: flex;
    align-items: center;
    gap: 32px;
    flex-wrap: wrap;
}
.t13-btn-primary {
    display: inline-block;
    padding: 14px 30px;
    background: #2D4A2B;
    color: #F5F1E8;
    text-decoration: none;
    border-radius: 100px;
    font-size: 15px;
    font-weight: 500;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s ease;
}
.t13-btn-primary:hover {
    background: #C97D63;
    transform: translateY(-2px);
}
.t13-btn-text {
    color: #2D4A2B;
    text-decoration: none;
    font-size: 16px;
    font-style: italic;
    border-bottom: 1px solid #2D4A2B;
    padding-bottom: 4px;
    transition: all 0.3s ease;
    font-family: "Crimson Pro", Georgia, serif;
}
.t13-btn-text:hover {
    color: #C97D63;
    border-bottom-color: #C97D63;
    padding-right: 12px;
}
.t13-hero-image {
    border-radius: 8px 80px 8px 80px;
    overflow: hidden;
    aspect-ratio: 4/5;
}
.t13-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.2s ease;
}
.t13-hero-image:hover img {
    transform: scale(1.04);
}

.t13-section {
    padding: 100px 60px;
    border-top: 1px solid rgba(45,74,43,0.1);
    position: relative;
    z-index: 2;
}
.t13-section-inner {
    max-width: 1280px;
    margin: 0 auto;
}
.t13-section-header {
    margin-bottom: 64px;
    max-width: 760px;
}
.t13-section-mark {
    display: inline-block;
    color: #C97D63;
    font-family: "Crimson Pro", Georgia, serif;
    font-style: italic;
    font-size: 16px;
    margin-bottom: 16px;
}
.t13-section h2 {
    font-family: "Crimson Pro", Georgia, serif;
    font-size: clamp(32px, 4.5vw, 52px);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: -0.015em;
    color: #2D4A2B;
    margin-bottom: 16px;
}
.t13-section-deck {
    font-size: 18px;
    line-height: 1.7;
    color: #555048;
    font-family: "Crimson Pro", Georgia, serif;
    font-style: italic;
}

.t13-shop-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}
.t13-plant-card {
    background: #FFF;
    border: 1px solid rgba(45,74,43,0.12);
    border-radius: 8px 32px 8px 32px;
    overflow: hidden;
    transition: all 0.4s ease;
}
.t13-plant-card:hover {
    border-color: #2D4A2B;
    transform: translateY(-6px);
    box-shadow: 0 16px 40px rgba(45,74,43,0.08);
}
.t13-plant-image {
    aspect-ratio: 4/5;
    overflow: hidden;
    background: #E8E2D2;
}
.t13-plant-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s ease;
}
.t13-plant-card:hover .t13-plant-image img {
    transform: scale(1.05);
}
.t13-plant-body {
    padding: 24px;
}
.t13-plant-tag {
    display: inline-block;
    color: #C97D63;
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-weight: 500;
}
.t13-plant-card h3 {
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 24px;
    font-weight: 400;
    color: #2D4A2B;
    margin-bottom: 12px;
    line-height: 1.2;
    letter-spacing: -0.01em;
}
.t13-plant-card p {
    font-size: 14px;
    line-height: 1.7;
    color: #555048;
    margin-bottom: 20px;
}
.t13-plant-foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 16px;
    border-top: 1px solid rgba(45,74,43,0.1);
}
.t13-plant-price {
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 22px;
    color: #2D4A2B;
    font-weight: 500;
}
.t13-plant-link {
    color: #C97D63;
    text-decoration: none;
    font-size: 14px;
    font-style: italic;
    border-bottom: 1px solid #C97D63;
    padding-bottom: 2px;
    transition: padding-right 0.3s ease;
    font-family: "Crimson Pro", serif;
}
.t13-plant-link:hover { padding-right: 8px; }

.t13-philosophy { background: #2D4A2B; color: #F5F1E8; }
.t13-philosophy .t13-section-mark { color: #C97D63; }
.t13-philosophy h2 { color: #F5F1E8; }
.t13-philosophy-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: start;
}
.t13-philosophy-text p {
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 19px;
    line-height: 1.7;
    color: rgba(245,241,232,0.85);
    margin-bottom: 20px;
}
.t13-philosophy-pillars {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.t13-pillar {
    padding: 28px 32px;
    background: rgba(245,241,232,0.05);
    border: 1px solid rgba(245,241,232,0.15);
    border-radius: 8px 28px 8px 28px;
    transition: all 0.3s ease;
}
.t13-pillar:hover {
    background: rgba(245,241,232,0.08);
    border-color: #C97D63;
}
.t13-pillar-num {
    display: block;
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 14px;
    color: #C97D63;
    margin-bottom: 8px;
    letter-spacing: 0.1em;
    font-style: italic;
}
.t13-pillar h4 {
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 22px;
    font-weight: 400;
    color: #F5F1E8;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}
.t13-pillar p {
    font-size: 14px;
    line-height: 1.7;
    color: rgba(245,241,232,0.7);
}

.t13-quote-section {
    background: #F5F1E8;
    padding: 100px 60px;
    text-align: center;
    border-top: 1px solid rgba(45,74,43,0.1);
    position: relative;
}
.t13-quote-inner {
    max-width: 800px;
    margin: 0 auto;
    position: relative;
}
.t13-quote-leaf {
    color: #2D4A2B;
    margin: 0 auto 32px;
    display: block;
}
.t13-quote {
    font-family: "Crimson Pro", Georgia, serif;
    font-size: clamp(22px, 3vw, 32px);
    line-height: 1.45;
    color: #2D4A2B;
    font-style: italic;
    font-weight: 400;
    margin-bottom: 24px;
}
.t13-quote cite {
    display: block;
    font-size: 16px;
    color: #C97D63;
    font-style: italic;
    margin-top: 24px;
    font-family: "Crimson Pro", serif;
}

.t13-studio-grid {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 80px;
    align-items: center;
}
.t13-studio-image {
    aspect-ratio: 4/5;
    overflow: hidden;
    border-radius: 32px 8px 32px 8px;
}
.t13-studio-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.t13-studio-lead {
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 22px;
    line-height: 1.6;
    color: #2D4A2B;
    margin-bottom: 20px;
    font-style: italic;
}
.t13-studio-text p {
    font-size: 17px;
    line-height: 1.75;
    color: #555048;
    margin-bottom: 20px;
}

.t13-visit-section { background: #E8E2D2; }
.t13-visit-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 80px;
    align-items: start;
}
.t13-form {
    background: #FFF;
    padding: 40px;
    border-radius: 8px 40px 8px 40px;
    border: 1px solid rgba(45,74,43,0.12);
}
.t13-form-title {
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 28px;
    font-weight: 400;
    color: #2D4A2B;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}
.t13-form-sub {
    font-size: 14px;
    color: #555048;
    margin-bottom: 28px;
    font-style: italic;
}
.t13-form label {
    display: block;
    margin-bottom: 18px;
}
.t13-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 0;
}
.t13-form-row label { margin-bottom: 0; }
.t13-form label span {
    display: block;
    font-size: 12px;
    color: #2D4A2B;
    margin-bottom: 6px;
    font-weight: 500;
    letter-spacing: 0.05em;
}
.t13-form input,
.t13-form textarea,
.t13-form select {
    width: 100%;
    background: #F5F1E8;
    border: 1px solid rgba(45,74,43,0.15);
    color: #2A2820;
    padding: 12px 14px;
    border-radius: 6px;
    font-family: inherit;
    font-size: 14px;
    transition: all 0.3s ease;
}
.t13-form select option { background: #F5F1E8; }
.t13-form input:focus,
.t13-form textarea:focus,
.t13-form select:focus {
    outline: none;
    border-color: #2D4A2B;
}
.t13-form-success {
    display: none;
    margin-top: 16px;
    padding: 14px 18px;
    background: rgba(45,74,43,0.08);
    color: #2D4A2B;
    border-left: 3px solid #2D4A2B;
    border-radius: 4px;
    font-size: 14px;
    font-style: italic;
}
.t13-form-success.visible { display: block; }
.t13-visit-info h4 {
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 18px;
    color: #2D4A2B;
    margin-bottom: 12px;
    margin-top: 28px;
    font-style: italic;
}
.t13-visit-info h4:first-child { margin-top: 0; }
.t13-visit-info address,
.t13-visit-info p {
    font-style: normal;
    font-size: 15px;
    color: #555048;
    line-height: 1.6;
    margin-bottom: 8px;
}
.t13-visit-info a {
    color: #C97D63;
    text-decoration: none;
    transition: color 0.2s ease;
}
.t13-visit-info a:hover { color: #2D4A2B; }
.t13-visit-info dl {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 6px 12px;
    font-size: 14px;
    color: #555048;
}
.t13-visit-info dt {
    font-weight: 500;
    color: #2D4A2B;
}

.t13-footer {
    padding: 40px 60px;
    background: #2D4A2B;
    color: rgba(245,241,232,0.65);
    text-align: center;
    font-size: 14px;
}
.t13-footer-meta {
    margin-top: 6px;
    font-size: 12px;
    color: rgba(245,241,232,0.4);
    font-style: italic;
    font-family: "Crimson Pro", serif;
}


/* ============================================================
   ============================================================
   THEME 14 — ARCHITECTURE FIRM · ARCHITECTURAL
   Editorial monochrome. Heavy black + crisp white + taupe.
   Massive typography, asymmetric grids, project numbers as huge
   design elements, slow scroll-triggered reveals.
   Palette: #FFFFFF / #0E0E0E / #968875 (taupe accent)
   ============================================================
   ============================================================ */
.theme-14 {
    background: #FFFFFF;
    color: #0E0E0E;
    font-family: "Inter", -apple-system, sans-serif;
}

.t14-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255,255,255,0.96);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 20px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(14,14,14,0.08);
}
.t14-nav-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: #0E0E0E;
}
.t14-nav-mark {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #0E0E0E;
}
.t14-nav-links {
    display: flex;
    gap: 36px;
    font-size: 13px;
}
.t14-nav-links a {
    color: #0E0E0E;
    text-decoration: none;
    transition: color 0.2s ease;
    letter-spacing: 0.02em;
}
.t14-nav-links a:hover { color: #968875; }

.t14-hero {
    padding: 80px 60px 0;
}
.t14-hero-grid {
    max-width: 1400px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 60px;
    margin-bottom: 80px;
}
.t14-hero-meta {
    padding-top: 8px;
    border-top: 2px solid #0E0E0E;
}
.t14-hero-section {
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #0E0E0E;
    margin-bottom: 8px;
    font-weight: 500;
}
.t14-hero-location {
    font-size: 11px;
    letter-spacing: 0.05em;
    color: #968875;
    text-transform: uppercase;
}
.t14-hero-text {
    grid-column: 2;
}
.t14-hero-title {
    font-size: clamp(48px, 8vw, 120px);
    font-weight: 300;
    line-height: 0.95;
    letter-spacing: -0.04em;
    color: #0E0E0E;
    max-width: 1100px;
}
.t14-hero-title em {
    font-style: italic;
    font-weight: 200;
    color: #968875;
}
.t14-hero-deck-wrap {
    grid-column: 2;
    max-width: 600px;
    margin-top: 40px;
}
.t14-hero-deck {
    font-size: 19px;
    line-height: 1.55;
    color: #3a3a3a;
}
.t14-hero-image {
    width: 100%;
    overflow: hidden;
}
.t14-hero-image img {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    display: block;
}
.t14-hero-caption {
    max-width: 1400px;
    margin: 16px auto 0;
    padding: 0 60px;
    font-size: 11px;
    color: #968875;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.t14-section {
    padding: 120px 60px;
    border-top: 1px solid rgba(14,14,14,0.08);
}
.t14-section-inner {
    max-width: 1400px;
    margin: 0 auto;
}
.t14-section-num {
    font-size: 11px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: #968875;
    margin-bottom: 20px;
    font-weight: 500;
}
.t14-section-title {
    font-size: clamp(36px, 5vw, 72px);
    font-weight: 300;
    line-height: 1.05;
    letter-spacing: -0.025em;
    color: #0E0E0E;
    margin-bottom: 80px;
    max-width: 900px;
}

.t14-projects-section { background: #F8F7F4; }
.t14-project-list {
    list-style: none;
    counter-reset: none;
}
.t14-project {
    display: grid;
    grid-template-columns: 100px 1fr 1.4fr;
    gap: 60px;
    padding: 60px 0;
    border-top: 1px solid rgba(14,14,14,0.12);
    align-items: start;
}
.t14-project:last-child { border-bottom: 1px solid rgba(14,14,14,0.12); }
.t14-project-num {
    font-size: 64px;
    font-weight: 200;
    line-height: 1;
    color: #0E0E0E;
    letter-spacing: -0.04em;
}
.t14-project-meta {
    padding-top: 12px;
}
.t14-project-tag {
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #968875;
    margin-bottom: 20px;
    font-weight: 500;
}
.t14-project-meta h3 {
    font-size: 32px;
    font-weight: 400;
    line-height: 1.1;
    color: #0E0E0E;
    margin-bottom: 8px;
    letter-spacing: -0.015em;
}
.t14-project-loc {
    font-size: 13px;
    color: #968875;
    letter-spacing: 0.05em;
}
.t14-project-image {
    overflow: hidden;
}
.t14-project-image img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    transition: transform 1s ease;
}
.t14-project:hover .t14-project-image img {
    transform: scale(1.02);
}
.t14-project-text {
    grid-column: 2 / span 2;
    margin-top: 20px;
    max-width: 800px;
}
.t14-project-text p {
    font-size: 16px;
    line-height: 1.7;
    color: #3a3a3a;
    margin-bottom: 16px;
}
.t14-project-meta-line {
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #968875;
    margin-top: 12px;
    font-weight: 500;
}

.t14-practice-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 100px;
    align-items: start;
}
.t14-practice-text p {
    font-size: 18px;
    line-height: 1.7;
    color: #3a3a3a;
    margin-bottom: 24px;
}
.t14-practice-meta h4 {
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #968875;
    margin-bottom: 16px;
    margin-top: 36px;
    font-weight: 500;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(14,14,14,0.12);
}
.t14-practice-meta h4:first-child { margin-top: 0; }
.t14-practice-meta ul {
    list-style: none;
}
.t14-practice-meta li {
    font-size: 14px;
    color: #0E0E0E;
    padding: 6px 0;
    border-bottom: 1px solid rgba(14,14,14,0.05);
}
.t14-practice-meta li:last-child { border-bottom: none; }

.t14-quote-section {
    background: #0E0E0E;
    color: #FFFFFF;
    padding: 140px 60px;
    text-align: center;
}
.t14-quote-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.t14-quote {
    font-size: clamp(28px, 4vw, 48px);
    font-weight: 300;
    line-height: 1.25;
    letter-spacing: -0.015em;
    color: #FFFFFF;
    margin-bottom: 32px;
    font-family: inherit;
}
.t14-quote-cite {
    font-size: 11px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: #968875;
    font-style: normal;
    font-weight: 500;
}

.t14-people-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
}
.t14-person {
    display: flex;
    flex-direction: column;
}
.t14-person-image {
    aspect-ratio: 1/1.2;
    overflow: hidden;
    margin-bottom: 24px;
    background: #F0EDE6;
}
.t14-person-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(100%) contrast(105%);
    transition: filter 0.6s ease;
}
.t14-person:hover .t14-person-image img {
    filter: grayscale(0%) contrast(100%);
}
.t14-person-role {
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #968875;
    margin-bottom: 8px;
    font-weight: 500;
}
.t14-person-meta h3 {
    font-size: 28px;
    font-weight: 400;
    color: #0E0E0E;
    margin-bottom: 16px;
    letter-spacing: -0.015em;
}
.t14-person-bio {
    font-size: 15px;
    line-height: 1.7;
    color: #3a3a3a;
}
.t14-person-bio em {
    font-style: italic;
    color: #968875;
}

.t14-contact-section { background: #F8F7F4; }
.t14-contact-deck {
    font-size: 18px;
    line-height: 1.6;
    color: #3a3a3a;
    max-width: 700px;
    margin-bottom: 64px;
    margin-top: -64px;
}
.t14-contact-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 100px;
    align-items: start;
}
.t14-form label {
    display: block;
    margin-bottom: 24px;
}
.t14-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-bottom: 0;
}
.t14-form-row label { margin-bottom: 0; }
.t14-form label span {
    display: block;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #968875;
    margin-bottom: 8px;
    font-weight: 500;
}
.t14-form input,
.t14-form textarea,
.t14-form select {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(14,14,14,0.2);
    color: #0E0E0E;
    padding: 12px 0;
    font-family: inherit;
    font-size: 16px;
    transition: border-color 0.3s ease;
}
.t14-form input:focus,
.t14-form textarea:focus,
.t14-form select:focus {
    outline: none;
    border-bottom-color: #0E0E0E;
}
.t14-btn-primary {
    display: inline-block;
    padding: 16px 40px;
    background: #0E0E0E;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s ease;
    margin-top: 16px;
}
.t14-btn-primary:hover {
    background: #968875;
}
.t14-form-success {
    display: none;
    margin-top: 24px;
    padding: 16px 0;
    border-top: 1px solid #0E0E0E;
    font-size: 13px;
    letter-spacing: 0.05em;
    color: #0E0E0E;
}
.t14-form-success.visible { display: block; }
.t14-contact-info h4 {
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #968875;
    margin-bottom: 12px;
    margin-top: 32px;
    font-weight: 500;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(14,14,14,0.12);
}
.t14-contact-info h4:first-child { margin-top: 0; }
.t14-contact-info address {
    font-style: normal;
    font-size: 15px;
    color: #0E0E0E;
    line-height: 1.6;
    margin-bottom: 8px;
}
.t14-contact-info p {
    font-size: 14px;
    color: #3a3a3a;
    margin-bottom: 6px;
}
.t14-contact-info a {
    color: #0E0E0E;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.3s ease;
}
.t14-contact-info a:hover {
    border-bottom-color: #968875;
}

.t14-footer {
    padding: 60px;
    background: #0E0E0E;
    color: #968875;
    text-align: center;
    font-size: 12px;
    letter-spacing: 0.1em;
}
.t14-footer-meta {
    margin-top: 8px;
    font-size: 11px;
    color: rgba(150,136,117,0.6);
}


/* ============================================================
   ============================================================
   THEME 15 — INDEPENDENT BOOKSTORE · VINTAGE TYPOGRAPHY
   1940s book jacket. Warm cream paper, deep green, ochre, oxblood.
   Centered serif compositions, ornamental dividers, drop caps,
   roman numerals, generous decorative whitespace.
   Palette: #F2EAD3 cream / #1F3D2F forest / #B8470A oxblood / #B89A4D ochre
   ============================================================
   ============================================================ */
.theme-15 {
    background: #F2EAD3;
    color: #2A2418;
    font-family: "Playfair Display", "Crimson Pro", Georgia, "Times New Roman", serif;
    overflow-x: hidden;
}

.t15-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(242,234,211,0.96);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 16px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #1F3D2F;
}
.t15-nav-brand {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 22px;
    font-weight: 700;
    color: #1F3D2F;
    letter-spacing: 0.02em;
    font-style: italic;
}
.t15-nav-links {
    display: flex;
    gap: 32px;
    font-size: 13px;
    letter-spacing: 0.05em;
}
.t15-nav-links a {
    color: #1F3D2F;
    text-decoration: none;
    transition: color 0.2s ease;
    font-style: italic;
}
.t15-nav-links a:hover { color: #B8470A; }

.t15-hero {
    padding: 100px 60px;
    text-align: center;
    border-bottom: 4px double #1F3D2F;
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
}
.t15-ornament {
    color: #1F3D2F;
    font-size: 28px;
    margin: 0 auto;
    display: block;
}
.t15-ornament-top { margin-bottom: 32px; opacity: 0.7; }
.t15-ornament-bottom { margin-top: 56px; opacity: 0.7; color: #B89A4D; }
.t15-hero-est {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 14px;
    color: #B8470A;
    letter-spacing: 0.3em;
    margin-bottom: 32px;
    font-style: italic;
}
.t15-hero-title {
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(56px, 12vw, 180px);
    font-weight: 900;
    line-height: 0.85;
    letter-spacing: -0.025em;
    color: #1F3D2F;
    margin-bottom: 28px;
}
.t15-hero-line-1, .t15-hero-line-2 {
    display: block;
}
.t15-hero-amp {
    display: block;
    color: #B8470A;
    font-size: 0.5em;
    line-height: 1;
    margin: 0.1em 0;
    font-weight: 400;
}
.t15-hero-kicker {
    font-family: "Playfair Display", Georgia, serif;
    font-style: italic;
    font-size: clamp(20px, 2.5vw, 28px);
    color: #B8470A;
    margin-bottom: 24px;
    letter-spacing: 0.02em;
}
.t15-hero-rule {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin: 24px 0;
}
.t15-hero-rule::before,
.t15-hero-rule::after {
    content: '';
    display: block;
    width: 80px;
    height: 1px;
    background: #1F3D2F;
}
.t15-hero-rule-bullet {
    color: #B89A4D;
    font-size: 14px;
}
.t15-hero-subtitle {
    font-size: 14px;
    color: #1F3D2F;
    letter-spacing: 0.15em;
    margin-bottom: 40px;
    font-family: "Playfair Display", serif;
}
.t15-hero-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    flex-wrap: wrap;
}
.t15-btn-primary {
    display: inline-block;
    padding: 14px 36px;
    background: #1F3D2F;
    color: #F2EAD3;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    border: 2px solid #1F3D2F;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s ease;
}
.t15-btn-primary:hover {
    background: #B8470A;
    border-color: #B8470A;
}
.t15-btn-text {
    color: #1F3D2F;
    text-decoration: none;
    font-size: 16px;
    font-style: italic;
    transition: color 0.3s ease;
    font-family: "Playfair Display", serif;
}
.t15-btn-text:hover { color: #B8470A; }

.t15-section {
    padding: 100px 60px;
    border-top: 1px solid rgba(31,61,47,0.15);
}
.t15-section-inner {
    max-width: 1280px;
    margin: 0 auto;
}
.t15-section-header {
    text-align: center;
    margin-bottom: 80px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}
.t15-section-mark {
    display: inline-block;
    color: #B8470A;
    font-style: italic;
    font-size: 18px;
    margin-bottom: 16px;
    letter-spacing: 0.02em;
}
.t15-section h2 {
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(40px, 6vw, 72px);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: #1F3D2F;
    margin-bottom: 24px;
}
.t15-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin: 24px 0;
}
.t15-divider span:first-child,
.t15-divider span:last-child {
    display: block;
    width: 60px;
    height: 1px;
    background: #B89A4D;
}
.t15-divider-mark {
    color: #B89A4D;
    font-size: 18px;
}
.t15-section-deck {
    font-style: italic;
    font-size: 18px;
    color: #5a5040;
    line-height: 1.6;
    max-width: 640px;
    margin: 0 auto;
}

.t15-shelves-section { background: #F2EAD3; }
.t15-shelves-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}
.t15-book-card {
    background: #FFFCF3;
    border: 1px solid rgba(31,61,47,0.18);
    transition: all 0.4s ease;
    overflow: hidden;
}
.t15-book-card:hover {
    border-color: #B8470A;
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(31,61,47,0.08);
}
.t15-book-image {
    aspect-ratio: 4/5;
    overflow: hidden;
    background: #E8DBB8;
    border-bottom: 2px solid #1F3D2F;
}
.t15-book-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: sepia(15%) contrast(105%);
    transition: filter 0.5s ease;
}
.t15-book-card:hover .t15-book-image img {
    filter: sepia(0%) contrast(100%);
}
.t15-book-body { padding: 28px; }
.t15-book-genre {
    display: block;
    font-size: 10px;
    letter-spacing: 0.25em;
    color: #B8470A;
    margin-bottom: 12px;
    font-family: "Playfair Display", serif;
    font-weight: 600;
}
.t15-book-card h3 {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 24px;
    font-weight: 700;
    color: #1F3D2F;
    margin-bottom: 6px;
    line-height: 1.2;
    letter-spacing: -0.01em;
}
.t15-book-author {
    font-style: italic;
    font-size: 14px;
    color: #5a5040;
    margin-bottom: 16px;
}
.t15-book-blurb {
    font-size: 14px;
    line-height: 1.65;
    color: #2A2418;
    margin-bottom: 20px;
    font-family: "Playfair Display", Georgia, serif;
}
.t15-book-foot {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding-top: 16px;
    border-top: 1px dashed rgba(31,61,47,0.25);
}
.t15-book-price {
    font-size: 24px;
    font-weight: 700;
    color: #B8470A;
    font-family: "Playfair Display", serif;
}
.t15-book-staff {
    font-style: italic;
    font-size: 12px;
    color: #5a5040;
    letter-spacing: 0.05em;
}

.t15-events-section { background: #FFFCF3; }
.t15-events-list {
    list-style: none;
    border-top: 2px solid #1F3D2F;
}
.t15-event {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 40px;
    padding: 36px 0;
    border-bottom: 1px solid rgba(31,61,47,0.15);
    transition: padding 0.4s ease;
}
.t15-event:last-child { border-bottom: 2px solid #1F3D2F; }
.t15-event:hover {
    padding-left: 16px;
    background: rgba(184,71,10,0.03);
}
.t15-event-date {
    text-align: center;
    border: 2px solid #1F3D2F;
    padding: 14px 8px;
    background: #F2EAD3;
}
.t15-event-month {
    display: block;
    font-size: 11px;
    letter-spacing: 0.2em;
    color: #B8470A;
    margin-bottom: 4px;
    font-weight: 700;
}
.t15-event-day {
    display: block;
    font-family: "Playfair Display", serif;
    font-size: 36px;
    line-height: 1;
    color: #1F3D2F;
    font-weight: 700;
    letter-spacing: -0.02em;
}
.t15-event-year {
    display: block;
    font-size: 10px;
    letter-spacing: 0.15em;
    color: #5a5040;
    margin-top: 6px;
    font-style: italic;
}
.t15-event-info { padding-top: 4px; }
.t15-event-type {
    display: inline-block;
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #B89A4D;
    margin-bottom: 8px;
    font-weight: 700;
}
.t15-event-info h3 {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 26px;
    font-weight: 700;
    color: #1F3D2F;
    margin-bottom: 8px;
    line-height: 1.2;
    letter-spacing: -0.01em;
}
.t15-event-info h3 em {
    font-style: italic;
    color: #B8470A;
}
.t15-event-detail {
    font-size: 15px;
    line-height: 1.65;
    color: #2A2418;
    font-family: "Playfair Display", serif;
}
.t15-event-detail em {
    font-style: italic;
    color: #B8470A;
}

.t15-quote-section {
    background: #1F3D2F;
    color: #F2EAD3;
    padding: 100px 60px;
    text-align: center;
    border-top: none;
}
.t15-quote-inner {
    max-width: 900px;
    margin: 0 auto;
    position: relative;
}
.t15-quote-mark {
    font-family: "Playfair Display", serif;
    font-size: 96px;
    color: #B89A4D;
    line-height: 0.6;
    display: block;
    margin-bottom: 16px;
}
.t15-quote {
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(24px, 3.5vw, 38px);
    line-height: 1.35;
    color: #F2EAD3;
    font-style: italic;
    font-weight: 400;
    margin-bottom: 32px;
}
.t15-quote-cite {
    font-size: 13px;
    letter-spacing: 0.2em;
    color: #B89A4D;
    font-style: normal;
    text-transform: uppercase;
    font-weight: 600;
    font-family: "Playfair Display", serif;
}

.t15-about-section { background: #F2EAD3; }
.t15-about-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 80px;
    align-items: start;
}
.t15-about-lead {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 22px;
    line-height: 1.55;
    color: #1F3D2F;
    margin-bottom: 24px;
}
.t15-about-text p {
    font-size: 17px;
    line-height: 1.75;
    color: #2A2418;
    margin-bottom: 20px;
    font-family: "Playfair Display", Georgia, serif;
}
.t15-dropcap {
    float: left;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 80px;
    font-weight: 900;
    line-height: 0.8;
    margin: 8px 14px 0 0;
    color: #B8470A;
    letter-spacing: -0.02em;
}
.t15-about-side {
    background: #FFFCF3;
    border: 2px solid #1F3D2F;
    padding: 32px;
    position: sticky;
    top: 100px;
}
.t15-about-side h4 {
    font-family: "Playfair Display", serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #B8470A;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #1F3D2F;
    font-style: italic;
}
.t15-about-side dl {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}
.t15-about-side dt {
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #5a5040;
    margin-bottom: 2px;
}
.t15-about-side dd {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 16px;
    color: #1F3D2F;
    font-weight: 500;
}

.t15-visit-section { background: #FFFCF3; }
.t15-visit-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 80px;
    align-items: start;
}
.t15-form {
    background: #F2EAD3;
    padding: 40px;
    border: 2px solid #1F3D2F;
}
.t15-form-title {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 30px;
    font-weight: 700;
    color: #1F3D2F;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}
.t15-form-sub {
    font-size: 14px;
    color: #5a5040;
    margin-bottom: 28px;
    font-style: italic;
    font-family: "Playfair Display", serif;
}
.t15-form label {
    display: block;
    margin-bottom: 18px;
}
.t15-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 0;
}
.t15-form-row label { margin-bottom: 0; }
.t15-form label span {
    display: block;
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #1F3D2F;
    margin-bottom: 6px;
    font-weight: 700;
}
.t15-form input,
.t15-form textarea,
.t15-form select {
    width: 100%;
    background: #FFFCF3;
    border: 1px solid rgba(31,61,47,0.3);
    color: #2A2418;
    padding: 12px 14px;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 15px;
    transition: all 0.3s ease;
}
.t15-form select option { background: #FFFCF3; }
.t15-form input:focus,
.t15-form textarea:focus,
.t15-form select:focus {
    outline: none;
    border-color: #B8470A;
}
.t15-form-success {
    display: none;
    margin-top: 16px;
    padding: 14px 18px;
    background: #B8470A;
    color: #F2EAD3;
    font-size: 14px;
    font-style: italic;
    font-family: "Playfair Display", Georgia, serif;
}
.t15-form-success.visible { display: block; }
.t15-visit-info h4 {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 18px;
    font-style: italic;
    color: #B8470A;
    margin-bottom: 12px;
    margin-top: 32px;
    font-weight: 700;
    padding-bottom: 8px;
    border-bottom: 1px solid #1F3D2F;
}
.t15-visit-info h4:first-child { margin-top: 0; }
.t15-visit-info address {
    font-style: normal;
    font-size: 16px;
    color: #1F3D2F;
    line-height: 1.6;
    margin-bottom: 8px;
    font-family: "Playfair Display", Georgia, serif;
}
.t15-visit-info p {
    font-size: 15px;
    color: #2A2418;
    margin-bottom: 6px;
    font-family: "Playfair Display", Georgia, serif;
}
.t15-visit-info a {
    color: #B8470A;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.3s ease;
}
.t15-visit-info a:hover {
    border-bottom-color: #B8470A;
}
.t15-visit-info dl {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 6px 12px;
    font-size: 14px;
    color: #1F3D2F;
    font-family: "Playfair Display", Georgia, serif;
}
.t15-visit-info dt {
    font-weight: 700;
    color: #5a5040;
}
.t15-visit-note {
    margin-top: 32px;
    padding: 16px 18px;
    background: rgba(184,71,10,0.08);
    border-left: 3px solid #B8470A;
    font-style: italic;
    font-size: 14px !important;
    color: #5a5040 !important;
    line-height: 1.6;
}

.t15-footer {
    padding: 60px;
    background: #1F3D2F;
    color: #F2EAD3;
    text-align: center;
    border-top: 4px double #B89A4D;
}
.t15-ornament-footer {
    color: #B89A4D;
    font-size: 24px;
    margin-bottom: 16px;
    opacity: 0.8;
}
.t15-footer p {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 14px;
    margin-bottom: 4px;
}
.t15-footer-meta {
    font-style: italic;
    font-size: 12px !important;
    color: #B89A4D !important;
    letter-spacing: 0.05em;
}


/* ============================================================
   THEMES 13-15 RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
    .t13-nav, .t14-nav, .t15-nav { padding: 14px 24px; }
    .t13-nav-links, .t14-nav-links, .t15-nav-links { gap: 16px; font-size: 12px; }
    .t13-hero, .t13-section, .t14-hero, .t14-section, .t15-hero, .t15-section {
        padding-left: 24px;
        padding-right: 24px;
    }
    .t13-hero { padding-top: 50px; padding-bottom: 60px; }
    .t13-hero-grid, .t13-philosophy-grid, .t13-studio-grid, .t13-visit-grid,
    .t13-shop-grid, .t13-form-row,
    .t14-hero-grid, .t14-practice-grid, .t14-people-grid, .t14-contact-grid, .t14-form-row,
    .t15-shelves-grid, .t15-about-grid, .t15-visit-grid, .t15-form-row {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    .t14-hero-text, .t14-hero-deck-wrap { grid-column: 1; }
    .t14-project { grid-template-columns: 1fr; gap: 16px; padding: 40px 0; }
    .t14-project-text { grid-column: 1; }
    .t14-project-num { font-size: 48px; }
    .t14-hero-caption { padding: 0 24px; }
    .t14-quote-section { padding: 80px 24px; }
    .t15-event { grid-template-columns: 100px 1fr; gap: 20px; }
    .t15-about-side { position: static; }
}


/* ============================================================
   ============================================================
   THEME 10 — IT APPRENTICESHIP NON-PROFIT
   Trust + warmth. Designed to make hesitant applicants
   feel welcome. Conservative motion, real scale of statements.
   Palette: #FAF7F2 warm off-white / #1F4D5C deep teal-blue /
            #D88C2A amber accent / #2A2A26 deep neutral text
   ============================================================
   ============================================================ */
.theme-10 {
    background: #FAF7F2;
    color: #2A2A26;
    font-family: "Inter", -apple-system, sans-serif;
}

.t10-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(250,247,242,0.96);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 18px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(31,77,92,0.12);
}
.t10-nav-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 18px;
    font-weight: 600;
    color: #1F4D5C;
    letter-spacing: -0.01em;
}
.t10-nav-mark {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: #D88C2A;
    border-radius: 4px;
}
.t10-nav-links {
    display: flex;
    gap: 32px;
    font-size: 14px;
}
.t10-nav-links a {
    color: #1F4D5C;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}
.t10-nav-links a:hover { color: #D88C2A; }

.t10-hero {
    padding: 80px 60px 60px;
}
.t10-hero-grid {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 80px;
    align-items: center;
}
.t10-eyebrow {
    color: #D88C2A;
    font-size: 13px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 24px;
}
.t10-hero-title {
    font-size: clamp(40px, 5.5vw, 68px);
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: #1F4D5C;
    margin-bottom: 28px;
}
.t10-hero-title em {
    font-style: italic;
    color: #D88C2A;
    font-weight: 500;
}
.t10-hero-deck {
    font-size: 18px;
    line-height: 1.65;
    color: #4A4A45;
    margin-bottom: 36px;
    max-width: 580px;
}
.t10-hero-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 32px;
}
.t10-btn-primary {
    display: inline-block;
    padding: 14px 28px;
    background: #1F4D5C;
    color: #FAF7F2;
    text-decoration: none;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s ease;
}
.t10-btn-primary:hover {
    background: #D88C2A;
    transform: translateY(-2px);
}
.t10-btn-secondary {
    display: inline-block;
    padding: 13px 28px;
    background: transparent;
    color: #1F4D5C;
    text-decoration: none;
    border: 2px solid #1F4D5C;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    transition: all 0.3s ease;
}
.t10-btn-secondary:hover {
    background: #1F4D5C;
    color: #FAF7F2;
}
.t10-hero-quick {
    padding-top: 32px;
    border-top: 1px solid rgba(31,77,92,0.15);
    font-size: 15px;
    color: #4A4A45;
}
.t10-hero-quick p { margin-bottom: 6px; }
.t10-hero-quick strong {
    color: #1F4D5C;
    font-weight: 600;
}
.t10-hero-image {
    aspect-ratio: 4/5;
    overflow: hidden;
    border-radius: 8px;
}
.t10-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.t10-hero-caption {
    margin-top: 14px;
    font-size: 13px;
    color: #6A6A65;
    font-style: italic;
}

.t10-stats-strip {
    background: #1F4D5C;
    color: #FAF7F2;
    padding: 60px;
}
.t10-stats-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
}
.t10-stat {
    text-align: left;
    border-left: 3px solid #D88C2A;
    padding-left: 20px;
}
.t10-stat-num {
    display: block;
    font-size: 48px;
    font-weight: 700;
    color: #FAF7F2;
    line-height: 1;
    margin-bottom: 12px;
    letter-spacing: -0.02em;
}
.t10-stat-label {
    display: block;
    font-size: 13px;
    color: rgba(250,247,242,0.75);
    line-height: 1.5;
}

.t10-section {
    padding: 100px 60px;
    border-top: 1px solid rgba(31,77,92,0.1);
}
.t10-section-inner {
    max-width: 1280px;
    margin: 0 auto;
}
.t10-section-header {
    margin-bottom: 56px;
    max-width: 760px;
}
.t10-section-mark {
    display: inline-block;
    color: #D88C2A;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.t10-section h2 {
    font-size: clamp(32px, 4vw, 46px);
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.015em;
    color: #1F4D5C;
    margin-bottom: 20px;
}
.t10-section-deck {
    font-size: 17px;
    line-height: 1.65;
    color: #4A4A45;
}

.t10-phases {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}
.t10-phase {
    background: #FFF;
    border: 1px solid rgba(31,77,92,0.15);
    padding: 36px 40px;
    border-radius: 8px;
    transition: all 0.3s ease;
    border-left: 4px solid #D88C2A;
}
.t10-phase:hover {
    border-color: #1F4D5C;
    border-left-color: #1F4D5C;
    box-shadow: 0 8px 24px rgba(31,77,92,0.08);
}
.t10-phase-num {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #D88C2A;
    margin-bottom: 8px;
}
.t10-phase-meta {
    font-size: 14px;
    color: #6A6A65;
    margin-bottom: 12px;
}
.t10-phase-meta strong {
    color: #1F4D5C;
    font-weight: 600;
}
.t10-phase h3 {
    font-size: 24px;
    font-weight: 600;
    color: #1F4D5C;
    margin-bottom: 14px;
    letter-spacing: -0.01em;
}
.t10-phase p {
    font-size: 16px;
    line-height: 1.7;
    color: #4A4A45;
    margin-bottom: 16px;
}
.t10-phase-list {
    list-style: none;
    padding: 0;
}
.t10-phase-list li {
    font-size: 14px;
    color: #4A4A45;
    padding: 6px 0 6px 24px;
    position: relative;
}
.t10-phase-list li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: #D88C2A;
    font-weight: 700;
}

.t10-eligibility-section { background: #F5F0E8; }
.t10-eligibility-grid {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 80px;
    align-items: start;
}
.t10-eligibility-text h2 { margin-bottom: 24px; }
.t10-eligibility-lead {
    font-size: 18px;
    line-height: 1.65;
    color: #4A4A45;
    font-style: italic;
}
.t10-eligibility-pillars {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.t10-pillar {
    background: #FFF;
    padding: 20px 22px;
    border-radius: 6px;
    border: 1px solid rgba(31,77,92,0.12);
    display: flex;
    align-items: flex-start;
    gap: 12px;
    transition: all 0.3s ease;
}
.t10-pillar:hover {
    border-color: #D88C2A;
    transform: translateY(-2px);
}
.t10-pillar-icon {
    color: #D88C2A;
    font-weight: 700;
    font-size: 18px;
    flex-shrink: 0;
}
.t10-pillar p {
    font-size: 14px;
    line-height: 1.55;
    color: #2A2A26;
    margin: 0;
}

.t10-stories-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}
.t10-story-card {
    background: #FFF;
    border: 1px solid rgba(31,77,92,0.12);
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
}
.t10-story-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(31,77,92,0.1);
}
.t10-story-image {
    aspect-ratio: 4/3;
    overflow: hidden;
}
.t10-story-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.t10-story-body {
    padding: 28px;
}
.t10-story-meta {
    font-size: 12px;
    color: #D88C2A;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.t10-story-quote {
    font-size: 17px;
    line-height: 1.55;
    color: #1F4D5C;
    font-style: italic;
    margin-bottom: 20px;
    font-weight: 500;
}
.t10-story-now {
    font-size: 14px;
    color: #4A4A45;
    padding-top: 16px;
    border-top: 1px solid rgba(31,77,92,0.12);
}

.t10-employers-section { background: #1F4D5C; color: #FAF7F2; }
.t10-employers-section h2 { color: #FAF7F2; }
.t10-employers-section .t10-section-mark { color: #D88C2A; }
.t10-employers-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 80px;
    align-items: start;
}
.t10-employers-text p {
    font-size: 17px;
    line-height: 1.65;
    color: rgba(250,247,242,0.85);
    margin-bottom: 20px;
}
.t10-employers-section .t10-btn-primary {
    background: #D88C2A;
    margin-top: 16px;
}
.t10-employers-section .t10-btn-primary:hover {
    background: #FAF7F2;
    color: #1F4D5C;
}
.t10-employer-list {
    background: rgba(250,247,242,0.06);
    padding: 32px;
    border-radius: 8px;
    border: 1px solid rgba(250,247,242,0.15);
}
.t10-employer-list h4 {
    color: #D88C2A;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(250,247,242,0.15);
}
.t10-employer-list ul {
    list-style: none;
}
.t10-employer-list li {
    font-size: 15px;
    color: #FAF7F2;
    padding: 8px 0;
    border-bottom: 1px solid rgba(250,247,242,0.08);
}
.t10-employer-list li:last-child { border-bottom: none; }
.t10-employer-note {
    margin-top: 16px;
    font-size: 13px;
    color: rgba(250,247,242,0.6);
    font-style: italic;
}

.t10-apply-section { background: #F5F0E8; }
.t10-apply-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 60px;
    align-items: start;
}
.t10-form {
    background: #FFF;
    padding: 40px;
    border-radius: 8px;
    border: 1px solid rgba(31,77,92,0.12);
}
.t10-form label {
    display: block;
    margin-bottom: 18px;
}
.t10-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 0;
}
.t10-form-row label { margin-bottom: 0; }
.t10-form label span {
    display: block;
    font-size: 13px;
    color: #1F4D5C;
    font-weight: 600;
    margin-bottom: 6px;
}
.t10-form input,
.t10-form textarea,
.t10-form select {
    width: 100%;
    background: #FAF7F2;
    border: 1px solid rgba(31,77,92,0.2);
    color: #2A2A26;
    padding: 12px 14px;
    border-radius: 6px;
    font-family: inherit;
    font-size: 15px;
    transition: all 0.3s ease;
}
.t10-form select option { background: #FAF7F2; }
.t10-form input:focus,
.t10-form textarea:focus,
.t10-form select:focus {
    outline: none;
    border-color: #D88C2A;
}
.t10-form-note {
    margin-top: 16px;
    font-size: 13px;
    color: #6A6A65;
    line-height: 1.55;
}
.t10-form-note a { color: #D88C2A; text-decoration: none; border-bottom: 1px solid #D88C2A; }
.t10-form-success {
    display: none;
    margin-top: 16px;
    padding: 14px 18px;
    background: rgba(216,140,42,0.12);
    color: #1F4D5C;
    border-left: 3px solid #D88C2A;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
}
.t10-form-success.visible { display: block; }
.t10-apply-info h4 {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #D88C2A;
    margin-bottom: 14px;
    margin-top: 28px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(31,77,92,0.15);
}
.t10-apply-info h4:first-child { margin-top: 0; }
.t10-apply-info p {
    font-size: 15px;
    line-height: 1.6;
    color: #2A2A26;
    margin-bottom: 14px;
}
.t10-apply-info p strong {
    color: #1F4D5C;
    font-weight: 600;
    display: block;
    margin-bottom: 2px;
}
.t10-apply-info a {
    color: #D88C2A;
    text-decoration: none;
    transition: color 0.2s ease;
}
.t10-apply-info a:hover { color: #1F4D5C; }
.t10-apply-info address {
    font-style: normal;
    font-size: 15px;
    color: #2A2A26;
    line-height: 1.6;
    margin-bottom: 8px;
}
.t10-apply-note {
    margin-top: 12px;
    font-size: 13px !important;
    color: #6A6A65 !important;
    font-style: italic;
}

.t10-footer {
    padding: 40px 60px;
    background: #1F4D5C;
    color: rgba(250,247,242,0.75);
    text-align: center;
    font-size: 14px;
}
.t10-footer-meta {
    margin-top: 8px;
    font-size: 12px;
    color: rgba(250,247,242,0.45);
    line-height: 1.6;
}


/* ============================================================
   ============================================================
   THEME 11 — JUSTICE-IMPACTED RESOURCES
   Dignified, calm, plain. Designed for someone reading at a
   hard moment. Soft cream + deep slate-blue + warm coral.
   No glossy stock people. No celebration of struggle.
   Palette: #F8F4ED soft cream / #2C3E50 deep slate-blue /
            #C77965 warm coral / #2A2A26 text
   ============================================================
   ============================================================ */
.theme-11 {
    background: #F8F4ED;
    color: #2A2A26;
    font-family: "Inter", -apple-system, sans-serif;
}

.t11-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(248,244,237,0.96);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 18px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(44,62,80,0.12);
}
.t11-nav-brand {
    font-size: 18px;
    font-weight: 600;
    color: #2C3E50;
    letter-spacing: -0.01em;
}
.t11-nav-links {
    display: flex;
    gap: 28px;
    font-size: 14px;
}
.t11-nav-links a {
    color: #2C3E50;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}
.t11-nav-links a:hover { color: #C77965; }

.t11-hero {
    padding: 100px 60px 80px;
}
.t11-hero-inner {
    max-width: 880px;
    margin: 0 auto;
}
.t11-eyebrow {
    color: #C77965;
    font-size: 14px;
    margin-bottom: 24px;
    line-height: 1.5;
    font-weight: 500;
}
.t11-hero-title {
    font-size: clamp(40px, 5.5vw, 60px);
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.015em;
    color: #2C3E50;
    margin-bottom: 28px;
}
.t11-hero-title em {
    font-style: italic;
    color: #C77965;
    font-weight: 500;
}
.t11-hero-deck {
    font-size: 19px;
    line-height: 1.7;
    color: #3F3F39;
    margin-bottom: 16px;
}
.t11-hero-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin: 32px 0;
}
.t11-btn-primary {
    display: inline-block;
    padding: 14px 28px;
    background: #2C3E50;
    color: #F8F4ED;
    text-decoration: none;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s ease;
}
.t11-btn-primary:hover { background: #C77965; }
.t11-btn-secondary {
    display: inline-block;
    padding: 13px 28px;
    background: transparent;
    color: #2C3E50;
    text-decoration: none;
    border: 2px solid #2C3E50;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    transition: all 0.3s ease;
}
.t11-btn-secondary:hover {
    background: #2C3E50;
    color: #F8F4ED;
}
.t11-hero-note {
    margin-top: 32px;
    padding: 20px 24px;
    background: rgba(199,121,101,0.1);
    border-left: 3px solid #C77965;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.65;
    color: #3F3F39;
}
.t11-hero-note a {
    color: #C77965;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid #C77965;
}

.t11-section {
    padding: 100px 60px;
    border-top: 1px solid rgba(44,62,80,0.1);
}
.t11-section-inner {
    max-width: 1280px;
    margin: 0 auto;
}
.t11-section-header {
    margin-bottom: 56px;
    max-width: 800px;
}
.t11-section-mark {
    display: inline-block;
    color: #C77965;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.t11-section h2 {
    font-size: clamp(32px, 4vw, 46px);
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.015em;
    color: #2C3E50;
    margin-bottom: 20px;
}
.t11-section-deck {
    font-size: 17px;
    line-height: 1.7;
    color: #3F3F39;
}

.t11-resources-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}
.t11-resource-card {
    background: #FFF;
    border: 1px solid rgba(44,62,80,0.15);
    border-radius: 8px;
    padding: 32px;
    transition: all 0.3s ease;
}
.t11-resource-card:hover {
    border-color: #C77965;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(44,62,80,0.06);
}
.t11-resource-tag {
    display: inline-block;
    font-size: 11px;
    color: #C77965;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.t11-resource-card h3 {
    font-size: 22px;
    font-weight: 600;
    color: #2C3E50;
    margin-bottom: 14px;
    letter-spacing: -0.01em;
    line-height: 1.25;
}
.t11-resource-card p {
    font-size: 15px;
    line-height: 1.65;
    color: #3F3F39;
    margin-bottom: 20px;
}
.t11-resource-link {
    color: #2C3E50;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    border-bottom: 1px solid #2C3E50;
    padding-bottom: 3px;
    transition: all 0.3s ease;
}
.t11-resource-link:hover {
    color: #C77965;
    border-bottom-color: #C77965;
    padding-right: 12px;
}

.t11-help-section { background: #2C3E50; color: #F8F4ED; }
.t11-help-section h2 { color: #F8F4ED; }
.t11-help-section .t11-section-mark { color: #C77965; }
.t11-hotlines {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 40px;
}
.t11-hotline {
    background: rgba(248,244,237,0.06);
    padding: 28px;
    border-radius: 6px;
    border-left: 4px solid #C77965;
    transition: all 0.3s ease;
}
.t11-hotline:hover {
    background: rgba(248,244,237,0.1);
}
.t11-hotline-tag {
    color: #C77965;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.t11-hotline-name {
    font-size: 18px;
    font-weight: 600;
    color: #F8F4ED;
    margin-bottom: 4px;
}
.t11-hotline-num {
    font-size: 22px;
    margin-bottom: 8px;
}
.t11-hotline-num a {
    color: #F8F4ED;
    text-decoration: none;
    font-weight: 600;
    border-bottom: 1px solid rgba(248,244,237,0.3);
    transition: border-color 0.3s ease;
}
.t11-hotline-num a:hover {
    border-bottom-color: #C77965;
}
.t11-hotline-detail {
    font-size: 13px;
    color: rgba(248,244,237,0.7);
}
.t11-help-note {
    background: rgba(199,121,101,0.1);
    padding: 20px 24px;
    border-left: 3px solid #C77965;
    border-radius: 4px;
    font-size: 15px;
    line-height: 1.7;
    color: rgba(248,244,237,0.92);
    max-width: 1000px;
}

.t11-stories-section { background: #F8F4ED; }
.t11-quotes-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    max-width: 1000px;
    margin: 0 auto;
}
.t11-quote {
    background: #FFF;
    padding: 32px 36px;
    border-left: 3px solid #C77965;
    border-radius: 4px;
    transition: all 0.3s ease;
}
.t11-quote:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(44,62,80,0.06);
}
.t11-quote p {
    font-size: 17px;
    line-height: 1.7;
    color: #2C3E50;
    font-style: italic;
    margin-bottom: 20px;
    font-weight: 500;
}
.t11-quote cite {
    display: block;
    font-size: 13px;
    color: #C77965;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding-top: 16px;
    border-top: 1px solid rgba(44,62,80,0.12);
}

.t11-contact-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 60px;
    align-items: start;
}
.t11-form {
    background: #FFF;
    padding: 36px;
    border-radius: 8px;
    border: 1px solid rgba(44,62,80,0.12);
}
.t11-form label {
    display: block;
    margin-bottom: 18px;
}
.t11-form label span {
    display: block;
    font-size: 13px;
    color: #2C3E50;
    font-weight: 600;
    margin-bottom: 6px;
}
.t11-form input,
.t11-form textarea,
.t11-form select {
    width: 100%;
    background: #F8F4ED;
    border: 1px solid rgba(44,62,80,0.2);
    color: #2A2A26;
    padding: 12px 14px;
    border-radius: 6px;
    font-family: inherit;
    font-size: 15px;
    transition: all 0.3s ease;
}
.t11-form select option { background: #F8F4ED; }
.t11-form input:focus,
.t11-form textarea:focus,
.t11-form select:focus {
    outline: none;
    border-color: #C77965;
}
.t11-form-success {
    display: none;
    margin-top: 16px;
    padding: 14px 18px;
    background: rgba(199,121,101,0.12);
    color: #2C3E50;
    border-left: 3px solid #C77965;
    border-radius: 4px;
    font-size: 14px;
}
.t11-form-success.visible { display: block; }
.t11-contact-info h4 {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #C77965;
    margin-bottom: 14px;
    margin-top: 28px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(44,62,80,0.15);
}
.t11-contact-info h4:first-child { margin-top: 0; }
.t11-contact-info p {
    font-size: 15px;
    line-height: 1.65;
    color: #2A2A26;
    margin-bottom: 14px;
}
.t11-contact-info a {
    color: #C77965;
    text-decoration: none;
    transition: color 0.2s ease;
}
.t11-contact-info a:hover { color: #2C3E50; }
.t11-contact-info address {
    font-style: normal;
    font-size: 15px;
    color: #2A2A26;
    line-height: 1.6;
    margin-bottom: 8px;
}
.t11-contact-note {
    font-size: 13px;
    color: #6A6A65;
    font-style: italic;
    line-height: 1.6;
}

.t11-footer {
    padding: 40px 60px;
    background: #2C3E50;
    color: rgba(248,244,237,0.7);
    text-align: center;
    font-size: 14px;
    line-height: 1.7;
}
.t11-footer-meta {
    margin-top: 8px;
    font-size: 13px;
    color: rgba(248,244,237,0.5);
    font-style: italic;
}


/* ============================================================
   ============================================================
   THEME 12 — WEDDING PLANNER · LUXE
   Gold + cream luxury. Slow elegant motion, display serif
   headlines, generous spacing, gold rule dividers,
   editorial photography.
   Palette: #FBF7EF cream / #2A2521 charcoal / #B89A4D antique gold
   ============================================================
   ============================================================ */
.theme-12 {
    background: #FBF7EF;
    color: #2A2521;
    font-family: "Crimson Pro", Georgia, "Times New Roman", serif;
}

.t12-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(251,247,239,0.96);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 20px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(184,154,77,0.3);
}
.t12-nav-brand {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 22px;
    font-style: italic;
    color: #2A2521;
    letter-spacing: 0.02em;
    font-weight: 500;
}
.t12-nav-links {
    display: flex;
    gap: 36px;
    font-size: 13px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-family: -apple-system, sans-serif;
}
.t12-nav-links a {
    color: #2A2521;
    text-decoration: none;
    transition: color 0.2s ease;
    font-weight: 500;
}
.t12-nav-links a:hover { color: #B89A4D; }

.t12-hero {
    position: relative;
    height: 90vh;
    min-height: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
}
.t12-hero-image {
    position: absolute;
    inset: 0;
    z-index: 1;
}
.t12-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.t12-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(42,37,33,0.4) 0%, rgba(42,37,33,0.55) 100%);
}
.t12-hero-content {
    position: relative;
    z-index: 2;
    color: #FBF7EF;
    padding: 0 60px;
    max-width: 900px;
}
.t12-hero-est {
    font-family: "Playfair Display", serif;
    font-style: italic;
    font-size: 14px;
    color: #B89A4D;
    letter-spacing: 0.3em;
    margin-bottom: 24px;
}
.t12-hero-title {
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(56px, 9vw, 120px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: -0.02em;
    margin-bottom: 24px;
    color: #FBF7EF;
}
.t12-hero-title em {
    font-style: italic;
    color: #B89A4D;
    font-weight: 300;
}
.t12-hero-kicker {
    font-family: "Playfair Display", serif;
    font-style: italic;
    font-size: clamp(18px, 2.2vw, 24px);
    color: #FBF7EF;
    margin-bottom: 24px;
    letter-spacing: 0.05em;
    font-weight: 400;
}
.t12-hero-rule {
    width: 80px;
    height: 1px;
    background: #B89A4D;
    margin: 24px auto;
}
.t12-hero-sub {
    font-size: 17px;
    color: rgba(251,247,239,0.92);
    margin-bottom: 36px;
    line-height: 1.5;
    font-style: italic;
}
.t12-btn-primary {
    display: inline-block;
    padding: 16px 36px;
    background: transparent;
    color: #FBF7EF;
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    border: 1px solid #B89A4D;
    cursor: pointer;
    font-family: -apple-system, sans-serif;
    transition: all 0.4s ease;
}
.t12-btn-primary:hover {
    background: #B89A4D;
    color: #2A2521;
}

.t12-section {
    padding: 120px 60px;
    border-top: 1px solid rgba(184,154,77,0.2);
}
.t12-section-inner {
    max-width: 1280px;
    margin: 0 auto;
}
.t12-section-header {
    text-align: center;
    margin-bottom: 80px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}
.t12-section-mark {
    display: inline-block;
    color: #B89A4D;
    font-style: italic;
    font-size: 16px;
    margin-bottom: 16px;
    letter-spacing: 0.05em;
    font-family: "Playfair Display", serif;
}
.t12-section h2 {
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(40px, 5.5vw, 64px);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: #2A2521;
    margin-bottom: 24px;
}
.t12-section h2 em {
    font-style: italic;
    color: #B89A4D;
    font-weight: 300;
}
.t12-section-deck {
    font-size: 18px;
    line-height: 1.65;
    color: #4A453F;
    font-style: italic;
}
.t12-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 24px;
}
.t12-divider span:first-child,
.t12-divider span:last-child {
    display: block;
    width: 60px;
    height: 1px;
    background: #B89A4D;
}
.t12-divider-mark {
    color: #B89A4D;
    font-size: 16px;
}

.t12-philosophy-section {
    padding-top: 100px;
}
.t12-philosophy-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 80px;
    align-items: start;
}
.t12-philosophy-text h2 {
    text-align: left;
    margin-bottom: 32px;
}
.t12-philosophy-text p {
    font-size: 18px;
    line-height: 1.7;
    color: #3F3A36;
    margin-bottom: 20px;
}
.t12-philosophy-side {
    background: #FFF;
    padding: 36px;
    border: 1px solid rgba(184,154,77,0.3);
}
.t12-philosophy-side h4 {
    font-family: "Playfair Display", serif;
    font-size: 16px;
    font-style: italic;
    color: #B89A4D;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid #B89A4D;
}
.t12-philosophy-side dl {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    font-size: 15px;
}
.t12-philosophy-side dt {
    font-size: 12px;
    color: #6A6A65;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 2px;
    font-family: -apple-system, sans-serif;
    font-weight: 500;
}
.t12-philosophy-side dd {
    color: #2A2521;
    font-weight: 500;
}
.t12-philosophy-side dd em {
    font-style: italic;
    color: #B89A4D;
}

.t12-portfolio-section { background: #2A2521; color: #FBF7EF; }
.t12-portfolio-section h2 { color: #FBF7EF; }
.t12-portfolio-section .t12-section-mark { color: #B89A4D; }
.t12-portfolio-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
}
.t12-portfolio-item {
    transition: transform 0.4s ease;
}
.t12-portfolio-item:hover {
    transform: translateY(-6px);
}
.t12-portfolio-image {
    aspect-ratio: 4/5;
    overflow: hidden;
    margin-bottom: 24px;
}
.t12-portfolio-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1s ease;
}
.t12-portfolio-item:hover .t12-portfolio-image img {
    transform: scale(1.04);
}
.t12-portfolio-tag {
    display: inline-block;
    font-size: 11px;
    color: #B89A4D;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-family: -apple-system, sans-serif;
}
.t12-portfolio-meta h3 {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 32px;
    font-weight: 400;
    color: #FBF7EF;
    margin-bottom: 8px;
    letter-spacing: -0.015em;
}
.t12-portfolio-loc {
    font-style: italic;
    color: #B89A4D;
    margin-bottom: 12px;
    font-size: 15px;
}
.t12-portfolio-detail {
    font-size: 15px;
    line-height: 1.65;
    color: rgba(251,247,239,0.78);
}
.t12-portfolio-detail em {
    font-style: italic;
    color: #B89A4D;
}

.t12-quote-section {
    background: #FBF7EF;
    padding: 100px 60px;
    text-align: center;
}
.t12-quote-inner {
    max-width: 900px;
    margin: 0 auto;
    position: relative;
}
.t12-quote-mark {
    display: block;
    font-family: "Playfair Display", serif;
    font-size: 96px;
    color: #B89A4D;
    line-height: 0.6;
    margin-bottom: 16px;
}
.t12-quote {
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(24px, 3.5vw, 36px);
    line-height: 1.4;
    color: #2A2521;
    font-style: italic;
    font-weight: 300;
    margin-bottom: 32px;
}
.t12-quote-cite {
    display: block;
    font-size: 12px;
    color: #B89A4D;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-style: normal;
    font-weight: 600;
    font-family: -apple-system, sans-serif;
}

.t12-services-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}
.t12-service {
    background: #FFF;
    padding: 40px 44px;
    border: 1px solid rgba(184,154,77,0.2);
    transition: all 0.4s ease;
}
.t12-service:hover {
    border-color: #B89A4D;
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(42,37,33,0.06);
}
.t12-service-num {
    display: inline-block;
    font-family: "Playfair Display", serif;
    font-style: italic;
    font-size: 36px;
    color: #B89A4D;
    margin-bottom: 14px;
    line-height: 1;
}
.t12-service h3 {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 28px;
    font-weight: 400;
    color: #2A2521;
    margin-bottom: 16px;
    letter-spacing: -0.015em;
}
.t12-service p {
    font-size: 16px;
    line-height: 1.7;
    color: #3F3A36;
    margin-bottom: 16px;
}
.t12-service-investment {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid rgba(184,154,77,0.3);
    font-size: 14px;
    font-style: italic;
    color: #B89A4D !important;
    font-weight: 500;
    margin-bottom: 0 !important;
    font-family: "Playfair Display", serif;
}

.t12-contact-section { background: #FBF7EF; }
.t12-contact-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 80px;
    align-items: start;
    text-align: left;
}
.t12-contact-section .t12-section-header { text-align: center; }
.t12-form {
    background: #FFF;
    padding: 44px;
    border: 1px solid rgba(184,154,77,0.3);
}
.t12-form label {
    display: block;
    margin-bottom: 22px;
}
.t12-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 0;
}
.t12-form-row label { margin-bottom: 0; }
.t12-form label span {
    display: block;
    font-family: -apple-system, sans-serif;
    font-size: 11px;
    color: #B89A4D;
    font-weight: 600;
    margin-bottom: 8px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}
.t12-form input,
.t12-form textarea,
.t12-form select {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(42,37,33,0.25);
    color: #2A2521;
    padding: 12px 0;
    font-family: "Crimson Pro", Georgia, serif;
    font-size: 16px;
    transition: border-color 0.3s ease;
}
.t12-form input:focus,
.t12-form textarea:focus,
.t12-form select:focus {
    outline: none;
    border-bottom-color: #B89A4D;
}
.t12-contact-section .t12-btn-primary {
    color: #2A2521;
    border-color: #2A2521;
    margin-top: 16px;
    background: #2A2521;
    color: #FBF7EF;
}
.t12-contact-section .t12-btn-primary:hover {
    background: #B89A4D;
    color: #FBF7EF;
    border-color: #B89A4D;
}
.t12-form-success {
    display: none;
    margin-top: 24px;
    padding: 16px 0;
    border-top: 1px solid #B89A4D;
    font-style: italic;
    font-size: 14px;
    color: #2A2521;
}
.t12-form-success.visible { display: block; }
.t12-contact-info h4 {
    font-family: "Playfair Display", serif;
    font-size: 16px;
    font-style: italic;
    color: #B89A4D;
    margin-bottom: 12px;
    margin-top: 32px;
    padding-bottom: 12px;
    border-bottom: 1px solid #B89A4D;
}
.t12-contact-info h4:first-child { margin-top: 0; }
.t12-contact-info address {
    font-style: normal;
    font-size: 16px;
    color: #2A2521;
    line-height: 1.7;
    margin-bottom: 8px;
}
.t12-contact-info p {
    font-size: 15px;
    color: #2A2521;
    margin-bottom: 8px;
    line-height: 1.6;
}
.t12-contact-info p em {
    font-style: italic;
    color: #B89A4D;
}
.t12-contact-info a {
    color: #2A2521;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.3s ease;
}
.t12-contact-info a:hover {
    border-bottom-color: #B89A4D;
}

.t12-footer {
    padding: 60px;
    background: #2A2521;
    color: #B89A4D;
    text-align: center;
    font-family: "Playfair Display", Georgia, serif;
    font-style: italic;
}
.t12-footer p {
    font-size: 16px;
    margin-bottom: 6px;
}
.t12-footer-meta {
    font-size: 12px !important;
    color: rgba(184,154,77,0.6) !important;
    letter-spacing: 0.05em;
    font-style: normal !important;
    font-family: -apple-system, sans-serif !important;
    text-transform: uppercase;
}


/* ============================================================
   THEMES 10-12 RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
    .t10-nav, .t11-nav, .t12-nav { padding: 14px 24px; }
    .t10-nav-links, .t11-nav-links, .t12-nav-links { gap: 16px; font-size: 12px; }
    .t10-hero, .t10-section, .t11-hero, .t11-section, .t12-section {
        padding-left: 24px;
        padding-right: 24px;
    }
    .t10-stats-strip { padding: 40px 24px; }
    .t10-hero-grid, .t10-stats-inner, .t10-eligibility-grid, .t10-eligibility-pillars,
    .t10-stories-grid, .t10-employers-grid, .t10-apply-grid, .t10-form-row,
    .t11-resources-grid, .t11-hotlines, .t11-quotes-list, .t11-contact-grid,
    .t12-philosophy-grid, .t12-portfolio-grid, .t12-services-grid, .t12-contact-grid, .t12-form-row {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .t10-stats-inner { gap: 28px; }
    .t12-hero { height: auto; min-height: auto; padding: 100px 24px; }
    .t12-quote-section { padding: 80px 24px; }
    .t12-section-deck { font-size: 16px; }
}