:root {
  --olive-950: #20282c;
  --olive-900: #30393d;
  --olive-700: #68767b;
  --olive-500: #98a3a6;
  --olive-300: #d8ddde;
  --olive-100: #eceeed;
  --paper: #f7f5f0;
  --ink: #263336;
  --line: rgba(38, 51, 54, 0.18);
  --display: "Bodoni Moda", Georgia, serif;
  --body: "Manrope", system-ui, sans-serif;
  --mono: "IBM Plex Mono", monospace;
  --shell: min(1240px, calc(100vw - 72px));
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { scroll-behavior: smooth; background: var(--paper); }
body { min-width: 320px; color: var(--ink); background: var(--paper); font-family: var(--body); line-height: 1.7; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--olive-500); outline-offset: 4px; }

.skip-link { position: fixed; top: 12px; left: 12px; z-index: 50; padding: 10px 14px; color: var(--paper); background: var(--olive-950); font-weight: 700; text-decoration: none; transform: translateY(-180%); }
.skip-link:focus { transform: translateY(0); }

.route-nav { display: grid; grid-template-columns: 1fr auto; align-items: center; width: var(--shell); min-height: 86px; margin: 0 auto; border-bottom: 1px solid var(--line); }
.route-nav a { text-decoration: none; }
.route-nav__back, .route-nav__instagram, .site-language a, .route-kicker, .route-origin, .negoiu-hero__scroll, .section-code, .route-console span, .route-console strong, .route-stage__meta, .photo-slot, .route-footer { font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.12em; text-transform: uppercase; }
.route-nav__back { font-weight: 500; }
.route-nav__actions { display: flex; gap: 18px; align-items: center; justify-self: end; }
.route-nav__instagram { color: var(--olive-700); }
.site-language { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: 999px; }
.site-language a { display: grid; min-width: 34px; min-height: 28px; padding: 0 7px; border-radius: 999px; place-items: center; }
.site-language a[aria-current="page"] { color: var(--paper); background: var(--olive-950); }

.negoiu-hero { position: relative; display: grid; grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.28fr); width: var(--shell); min-height: min(760px, calc(100svh - 86px)); margin: 0 auto; overflow: hidden; background: var(--olive-900); }
.negoiu-hero::before { position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(239, 242, 242, 0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(239, 242, 242, 0.06) 1px, transparent 1px); background-size: 48px 48px; content: ""; }
.negoiu-hero__copy { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: clamp(44px, 6vw, 84px); color: var(--paper); }
.route-kicker { color: var(--olive-300); }
.negoiu-hero h1 { margin-top: 28px; font-family: var(--body); font-size: clamp(4rem, 8.3vw, 8.9rem); font-weight: 600; line-height: 0.76; letter-spacing: -0.085em; }
.negoiu-hero h1 em { color: var(--olive-300); font-family: var(--display); font-weight: 500; }
.route-origin { margin-top: 52px; color: rgba(242, 243, 234, 0.78); line-height: 1.9; }
.route-origin span { margin-right: 12px; color: var(--olive-300); }
.negoiu-hero__scroll { position: absolute; bottom: 26px; left: clamp(44px, 6vw, 84px); z-index: 3; color: rgba(242, 243, 234, 0.56); }

.cover-slot { position: relative; isolation: isolate; min-height: 600px; overflow: hidden; background: radial-gradient(circle at 60% 45%, transparent 0 82px, rgba(231, 235, 236, 0.24) 83px 84px, transparent 85px 128px, rgba(231, 235, 236, 0.18) 129px 130px, transparent 131px 178px, rgba(231, 235, 236, 0.12) 179px 180px, transparent 181px), linear-gradient(145deg, #a0abad, #707d81 48%, #475257); }
.cover-slot img { position: absolute; inset: 0; z-index: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 34%; }
.cover-slot::before { position: absolute; inset: 0; z-index: 1; background: linear-gradient(120deg, rgba(32, 40, 44, 0.14), transparent 48%), linear-gradient(18deg, transparent 0 63%, rgba(246, 247, 247, 0.08) 63.1% 63.3%, transparent 63.4%); content: ""; }
.cover-slot__axis { position: absolute; top: 34px; right: 38px; z-index: 2; color: rgba(242, 243, 234, 0.9); font: 500 0.68rem var(--mono); letter-spacing: 0.15em; text-shadow: 0 1px 14px rgba(18, 24, 15, 0.5); }
.cover-slot__label { position: absolute; right: 42px; bottom: 40px; z-index: 2; color: rgba(242, 243, 234, 0.94); font: 500 0.64rem/1.8 var(--mono); letter-spacing: 0.14em; text-align: right; text-shadow: 0 1px 14px rgba(18, 24, 15, 0.5); }
.cover-slot__corner { position: absolute; inset: 28px; z-index: 2; border-top: 1px solid rgba(242, 243, 234, 0.48); border-right: 1px solid rgba(242, 243, 234, 0.48); }

.route-console { display: grid; grid-template-columns: repeat(5, 1fr); width: var(--shell); margin: 0 auto; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.route-console > div { min-height: 128px; padding: 26px 22px; border-left: 1px solid var(--line); }
.route-console span, .route-console strong { display: block; }
.route-console span { color: var(--olive-700); }
.route-console strong { margin-top: 22px; font-weight: 500; }

.route-intro { display: grid; grid-template-columns: 0.35fr 1fr; gap: clamp(40px, 9vw, 132px); width: var(--shell); padding: clamp(110px, 14vw, 180px) 0; margin: 0 auto; border-bottom: 1px solid var(--line); }
.section-code { color: var(--olive-700); }
.route-intro h2, .gallery-blueprint h2 { max-width: 14ch; font-family: var(--display); font-size: clamp(3.2rem, 6.3vw, 6.5rem); font-weight: 500; line-height: 0.92; letter-spacing: -0.06em; }
.route-intro h2 em, .gallery-blueprint h2 em { color: var(--olive-700); font-weight: 500; }
.route-intro > div > p { max-width: 64ch; margin-top: 34px; color: #657075; font-size: 1rem; }

.route-stages { width: var(--shell); margin: 0 auto; }
.route-stage { display: grid; grid-template-columns: 92px minmax(260px, 0.72fr) minmax(340px, 1.28fr); gap: clamp(28px, 5vw, 76px); align-items: center; min-height: 630px; padding: clamp(70px, 9vw, 120px) 0; border-bottom: 1px solid var(--line); }
.route-stage--reverse { grid-template-columns: 92px minmax(340px, 1.28fr) minmax(260px, 0.72fr); }
.route-stage--reverse .route-stage__copy { order: 3; }
.route-stage--reverse .photo-slot { order: 2; }
.route-stage__meta { align-self: stretch; padding-top: 8px; border-right: 1px solid var(--line); color: var(--olive-700); }
.route-stage__meta span { display: block; color: var(--olive-950); font-family: var(--display); font-size: 2.4rem; letter-spacing: -0.04em; line-height: 1; }
.route-stage__meta p { margin-top: 18px; }
.route-stage__copy h3 { font-family: var(--display); font-size: clamp(2.7rem, 4.7vw, 5rem); font-weight: 500; line-height: 0.94; letter-spacing: -0.055em; }
.route-stage__copy h3 em { color: var(--olive-700); font-weight: 500; }
.route-stage__copy > p { max-width: 50ch; margin-top: 30px; color: #657075; }
.photo-slot { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 430px; padding: 24px; overflow: hidden; color: rgba(242, 243, 234, 0.78); background: linear-gradient(145deg, var(--olive-500), var(--olive-700)); }
.photo-slot::before { position: absolute; inset: 18px; border-top: 1px solid rgba(242, 243, 234, 0.32); border-right: 1px solid rgba(242, 243, 234, 0.32); content: ""; }
.photo-slot p { align-self: flex-end; writing-mode: vertical-rl; }
.photo-slot--wide { min-height: 500px; background: linear-gradient(125deg, #adb6b8, #707d82 62%, #4d5a5f); }

.gallery-blueprint { width: var(--shell); padding: clamp(110px, 14vw, 180px) 0; margin: 0 auto; }
.gallery-blueprint__heading { display: grid; grid-template-columns: 0.35fr 1fr; gap: clamp(40px, 9vw, 132px); align-items: start; }
.gallery-blueprint__grid { display: grid; grid-template-columns: 1.2fr 0.8fr 0.8fr; gap: 16px; margin-top: 70px; }
.gallery-blueprint__grid div { position: relative; min-height: 310px; background: #d9ddde; }
.gallery-blueprint__grid div:first-child { min-height: 470px; background: #7f8c90; }
.gallery-blueprint__grid div:nth-child(2) { align-self: end; background: #bbc2c4; }
.gallery-blueprint__grid div:nth-child(3) { background: #59666b; }
.gallery-blueprint__grid span { position: absolute; top: 18px; left: 18px; font: 500 0.65rem var(--mono); letter-spacing: 0.12em; }

.route-footer { display: flex; justify-content: space-between; width: var(--shell); padding: 34px 0 48px; margin: 0 auto; border-top: 1px solid var(--line); color: var(--olive-700); }
.route-footer a { text-decoration: none; }

@media (max-width: 840px) {
  :root { --shell: min(100% - 36px, 680px); }
  .route-nav { grid-template-columns: 1fr auto; min-height: 72px; }
  .route-nav__code, .route-nav__instagram { display: none; }
  .route-nav__actions { gap: 8px; }
  .negoiu-hero { grid-template-columns: 1fr; min-height: auto; }
  .negoiu-hero__copy { min-height: 540px; padding: 56px 26px 78px; }
  .negoiu-hero h1 { font-size: clamp(4rem, 20vw, 7rem); }
  .negoiu-hero__scroll { left: 26px; }
  .cover-slot { min-height: 430px; }
  .route-console { grid-template-columns: 1fr 1fr; }
  .route-console > div:last-child { grid-column: 1 / -1; }
  .route-intro, .gallery-blueprint__heading { grid-template-columns: 1fr; gap: 34px; }
  .route-stage, .route-stage--reverse { grid-template-columns: 58px 1fr; gap: 28px; min-height: 0; }
  .route-stage__meta { grid-row: 1 / span 2; }
  .route-stage__copy, .route-stage--reverse .route-stage__copy { order: initial; }
  .photo-slot, .route-stage--reverse .photo-slot { grid-column: 2; order: initial; min-height: 390px; }
  .gallery-blueprint__grid { grid-template-columns: 1fr 1fr; }
  .gallery-blueprint__grid div:first-child { grid-column: 1 / -1; }
}

@media (max-width: 520px) {
  .route-nav__back { font-size: 0.58rem; letter-spacing: 0.08em; }
  .route-origin { font-size: 0.6rem; }
  .route-console { grid-template-columns: 1fr; }
  .route-console > div:last-child { grid-column: auto; }
  .route-console > div { min-height: 108px; }
  .route-stage, .route-stage--reverse { grid-template-columns: 1fr; padding: 76px 0; }
  .route-stage__meta { grid-row: auto; padding-bottom: 18px; border-right: 0; border-bottom: 1px solid var(--line); }
  .route-stage__meta span, .route-stage__meta p { display: inline-block; }
  .route-stage__meta p { margin: 0 0 0 14px; }
  .photo-slot, .route-stage--reverse .photo-slot { grid-column: 1; min-height: 360px; }
  .gallery-blueprint__grid { grid-template-columns: 1fr; }
  .gallery-blueprint__grid div:first-child { grid-column: auto; }
  .gallery-blueprint__grid div { min-height: 320px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.01ms !important; }
}