@font-face {
    font-family: 'ORBE Editorial';
    src: local('Ravenna Serie Regular'), local('Ravenna');
    font-display: swap;
}

:root {
    --orbe-font: 'ORBE Editorial', 'Times New Roman', Georgia, serif;
    --orbe-sans: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', sans-serif;
    --paper: #fbfaf7;
    --ink: #111111;
    --muted: #6f6b63;
    --line: rgba(17, 17, 17, .14);
    --soft: rgba(17, 17, 17, .045);
    --max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--orbe-sans);
    text-rendering: geometricPrecision;
}

a { color: inherit; text-decoration: none; }

.orbe-discovery-shell {
    min-height: 100vh;
    background:
        radial-gradient(circle at 50% 0%, rgba(255,255,255,.92), transparent 34rem),
        linear-gradient(180deg, #fffefa 0%, var(--paper) 100%);
}

.discover-topbar {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 20;
    height: 76px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: 0 clamp(22px, 4vw, 58px);
    background: rgba(251, 250, 247, .78);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(17,17,17,.06);
}

.brand-mark {
    font-size: 13px;
    letter-spacing: .32em;
    font-weight: 600;
}

.topbar-nav {
    display: flex;
    gap: 24px;
    color: var(--muted);
    font-size: 12px;
    letter-spacing: .18em;
}

.topbar-nav a,
.language-switcher a {
    transition: opacity .25s ease;
}
.topbar-nav a:hover,
.language-switcher a:hover { opacity: .48; }

.language-switcher {
    justify-self: end;
    display: flex;
    gap: 8px;
    align-items: center;
    font-size: 12px;
    letter-spacing: .16em;
    color: var(--muted);
}
.language-switcher .active { color: var(--ink); }

.entrance,
.architectural-map,
.district-intro,
.hall,
.discover-footer {
    width: min(var(--max), calc(100% - 44px));
    margin-inline: auto;
}

.entrance {
    min-height: 100svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 80px;
}

.eyebrow,
.section-kicker {
    margin: 0 0 28px;
    color: var(--muted);
    font-size: 12px;
    letter-spacing: .28em;
    text-transform: uppercase;
}

h1,
h2 {
    font-family: var(--orbe-font);
    font-weight: 400;
    letter-spacing: -.055em;
    line-height: .92;
    margin: 0;
}

h1 {
    max-width: 1050px;
    font-size: clamp(66px, 11vw, 156px);
}

h2 {
    max-width: 980px;
    font-size: clamp(54px, 8.8vw, 128px);
}

.lead {
    max-width: 720px;
    margin: 34px 0 0;
    font-size: clamp(21px, 2.3vw, 33px);
    line-height: 1.26;
    letter-spacing: -.03em;
    color: #2c2a27;
}

.body-copy {
    max-width: 690px;
    margin: 30px 0 0;
    font-size: clamp(17px, 1.3vw, 21px);
    line-height: 1.62;
    color: var(--muted);
}

.quiet-link {
    width: fit-content;
    margin-top: 48px;
    padding-bottom: 7px;
    border-bottom: 1px solid var(--ink);
    font-size: 13px;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.architectural-map {
    min-height: 78svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 110px 0;
    border-top: 1px solid var(--line);
}

.map-grid {
    margin-top: 70px;
    border-top: 1px solid var(--line);
}

.map-line {
    min-height: 92px;
    display: grid;
    grid-template-columns: 110px 1fr;
    align-items: center;
    border-bottom: 1px solid var(--line);
    transition: background .25s ease, padding .25s ease;
}

.map-line:hover {
    background: var(--soft);
    padding-left: 18px;
}

.map-line span {
    color: var(--muted);
    letter-spacing: .18em;
}
.map-line strong {
    font-family: var(--orbe-font);
    font-size: clamp(30px, 4vw, 58px);
    font-weight: 400;
    letter-spacing: -.04em;
}

.district {
    border-top: 1px solid var(--line);
}

.district-intro {
    min-height: 82svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 120px 0;
}

.hall {
    min-height: 92svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 96px 0;
    border-top: 1px solid rgba(17,17,17,.075);
}

.explore-more {
    max-width: 760px;
    margin-top: 42px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.explore-more summary {
    cursor: pointer;
    list-style: none;
    padding: 22px 0;
    font-size: 12px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #383530;
}
.explore-more summary::-webkit-details-marker { display: none; }
.explore-more summary::after {
    content: '+';
    float: right;
    font-size: 17px;
}
.explore-more[open] summary::after { content: '–'; }

.explore-content {
    padding: 0 0 28px;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.72;
}

.gallery-list,
.roadmap,
.join-paths {
    width: min(var(--max), calc(100% - 44px));
    margin: 0 auto 160px;
    border-top: 1px solid var(--line);
}

.gallery-row,
.roadmap-line,
.join-path {
    display: grid;
    grid-template-columns: 220px 1fr 1.2fr;
    gap: 34px;
    padding: 42px 0;
    border-bottom: 1px solid var(--line);
}

.gallery-row span,
.roadmap-line span,
.join-path span {
    color: var(--muted);
    font-size: 12px;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.gallery-row h3,
.roadmap-line h3,
.join-path strong {
    margin: 0;
    font-family: var(--orbe-font);
    font-weight: 400;
    font-size: clamp(28px, 3.4vw, 48px);
    line-height: 1;
    letter-spacing: -.045em;
}

.gallery-row p,
.roadmap-line p,
.join-path p {
    margin: 0;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.6;
}

.join-path {
    transition: background .25s ease, padding .25s ease;
}
.join-path:hover {
    background: var(--soft);
    padding-left: 18px;
}

.discover-footer {
    padding: 80px 0 100px;
    border-top: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    gap: 30px;
    color: var(--muted);
    font-size: 13px;
}

.reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
}
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 760px) {
    .discover-topbar {
        height: 68px;
        grid-template-columns: 1fr auto;
    }
    .topbar-nav { display: none; }
    .language-switcher { font-size: 11px; }
    .entrance,
    .architectural-map,
    .district-intro,
    .hall,
    .discover-footer,
    .gallery-list,
    .roadmap,
    .join-paths {
        width: min(100% - 30px, var(--max));
    }
    h1 { font-size: clamp(54px, 17vw, 86px); }
    h2 { font-size: clamp(46px, 15vw, 74px); }
    .lead { font-size: 22px; }
    .map-line {
        grid-template-columns: 64px 1fr;
        min-height: 78px;
    }
    .gallery-row,
    .roadmap-line,
    .join-path {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 34px 0;
    }
    .discover-footer {
        flex-direction: column;
    }
}