.route-page {
  --paper:#f4f4f0;
  --ink:#080909;
  --stone:#f4f4f0;
  --coal:#080909;
  --coal-2:#121313;
  --sage:#b9bbb6;
  --muted:#565958;
  --mineral:#d7d8d4;
  background:var(--paper);color:var(--ink);
}
.route-page .site-nav { background:rgba(8,9,9,.94);border-bottom:1px solid var(--line-dark); }
.route-page .brand {
  grid-column:1;grid-row:1;justify-self:start;display:flex;flex-direction:column;
  color:var(--stone);line-height:1.15;
}
.route-page .brand strong { font-size:13px;font-weight:600; }
.route-page .brand span { margin-top:3px;color:var(--sage);font-size:10px;font-weight:400; }
.route-page .nav-links {
  grid-column:2;grid-row:1;justify-self:center;display:flex;gap:24px;
  color:var(--stone);font-size:12px;
}
.route-page .nav-links a,.route-page .nav-cta { text-decoration:none; }
.route-page .nav-action {
  grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:16px;
  color:var(--stone);
}
.route-page .nav-cta { font-size:12px; }
.route-page .button {
  min-height:48px;display:inline-flex;align-items:center;padding:0 18px;
  border:1px solid currentColor;background:transparent;color:inherit;
  text-decoration:none;font-weight:550;
}
.route-page .button:hover { background:var(--stone);color:var(--coal); }
.route-page .button.secondary { margin-left:8px;color:var(--sage); }
.route-page .hero-actions { display:flex;align-items:center;flex-wrap:wrap;gap:8px; }
.route-hero {
  position:relative;min-height:78svh;display:flex;align-items:flex-end;
  padding:150px 5vw 76px;overflow:hidden;color:var(--stone);background:var(--coal);
}
.route-hero-media { position:absolute;inset:0;background-position:center;background-size:cover; }
.mortgage-page .route-hero-media { background-image:url("assets/user-photos/IMG_9738.jpg");background-position:center 44%; }
.installment-page .route-hero-media { background-image:url("assets/stock/dubai-construction-pexels-3367920.jpg"); }
.route-hero-media::after {
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(12,18,22,.96),rgba(12,18,22,.6) 58%,rgba(12,18,22,.22)),
  linear-gradient(0deg,rgba(12,18,22,.92),transparent 55%);
}
.route-hero-content { position:relative;z-index:2;width:min(900px,100%); }
.back-link { display:inline-block;margin-bottom:22px;color:var(--sage);font-size:13px;text-decoration:none; }
.route-hero h1 { font-size:72px; }
.route-hero p { max-width:700px;color:rgba(232,236,232,.85);font-size:18px; }
.route-hero .hero-actions { margin-top:30px; }
.route-strip {
  display:grid;grid-template-columns:repeat(3,1fr);background:var(--coal-2);color:var(--stone);
  border-top:1px solid var(--line-dark);
}
.route-strip div { min-height:118px;padding:25px 5vw;border-right:1px solid var(--line-dark); }
.route-strip strong { display:block;margin-bottom:6px;font-size:20px; }
.route-strip span { color:var(--sage);font-size:12px; }
.route-section { padding:100px 5vw; }
.route-section.dark { background:var(--coal);color:var(--stone); }
.route-section.stone { background:var(--stone); }
.route-title-grid { display:grid;grid-template-columns:1.1fr .65fr;gap:56px;margin-bottom:48px; }
.route-title-grid h2 { margin:0;font-size:50px;font-weight:520;line-height:1.08; }
.route-title-grid p { align-self:end;margin:0;color:var(--muted);font-size:17px; }
.dark .route-title-grid p { color:var(--sage); }
.qualifier-grid { display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line-light); }
.qualifier { min-height:240px;padding:30px;border-bottom:1px solid var(--line-light); }
.qualifier:nth-child(odd) { border-right:1px solid var(--line-light); }
.qualifier span { color:#55717e;font-size:12px; }
.qualifier h3 { margin:42px 0 12px;font-size:24px; }
.qualifier p { color:var(--muted); }
.process-grid { display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-dark); }
.process-item { min-height:280px;padding:28px 24px;border-right:1px solid var(--line-dark); }
.process-item:last-child { border-right:0; }
.process-item span { color:var(--mineral);font-size:12px; }
.process-item h3 { margin:70px 0 15px;font-size:22px; }
.process-item p { color:var(--sage);font-size:14px; }
.comparison { width:100%;border-collapse:collapse; }
.comparison th,.comparison td { padding:20px 16px;border-bottom:1px solid var(--line-light);text-align:left;vertical-align:top; }
.comparison th { color:#55717e;font-size:12px;font-weight:650; }
.comparison td:first-child { width:30%;font-weight:650; }
.calc-panel { display:grid;grid-template-columns:1fr 1fr;gap:52px; }
.calc-form { padding:34px;background:#fff;border:1px solid var(--line-light);border-radius:6px; }
.calc-form h3 { font-size:28px;margin-bottom:22px; }
.calc-fields { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.calc-form input { width:100%;min-height:50px;padding:0 12px;border:1px solid var(--line-light);border-radius:4px; }
.calc-results { display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:22px;background:var(--line-light); }
.calc-result { padding:20px;background:var(--paper); }
.calc-result strong { display:block;font-size:26px; }
.calc-result span { color:var(--muted);font-size:11px; }
.calc-note { align-self:center; }
.calc-note h3 { font-size:34px; }
.calc-note p { color:var(--muted);font-size:17px; }
.inline-cta { margin-top:28px; }
.route-photo-split { display:grid;grid-template-columns:1fr 1fr;min-height:620px; }
.mortgage-page .route-photo {
  background:url("assets/stock/dubai-skyline-nejc-soklic.jpg") center 58% / cover;
}
.installment-page .route-photo {
  background:url("assets/stock/dubai-construction-pexels-3367920.jpg") center / cover;
}
.route-photo-copy { padding:80px 7vw;display:flex;flex-direction:column;justify-content:center;background:var(--stone); }
.route-photo-copy h2 { font-size:46px;line-height:1.1; }
.route-photo-copy p { color:var(--muted);font-size:17px; }

@media(max-width:760px){
  .route-page .site-nav { grid-template-columns:1fr auto; }
  .route-page .brand { grid-column:1; }
  .route-page .nav-links,.route-page .nav-cta { display:none; }
  .route-page .nav-action { grid-column:2; }
  .route-hero { min-height:82svh;padding:120px 20px 54px; }
  .route-hero h1 { font-size:42px; }
  .route-hero p { font-size:16px; }
  .route-strip { grid-template-columns:1fr; }
  .route-strip div { min-height:auto;padding:20px;border-right:0;border-bottom:1px solid var(--line-dark); }
  .route-section { padding:72px 20px; }
  .route-title-grid { grid-template-columns:1fr;gap:20px; }
  .route-title-grid h2 { font-size:35px; }
  .qualifier-grid,.process-grid,.calc-panel,.route-photo-split { grid-template-columns:1fr; }
  .qualifier:nth-child(odd) { border-right:0; }
  .process-item { min-height:220px;border-right:0;border-bottom:1px solid var(--line-dark); }
  .process-item h3 { margin-top:45px; }
  .calc-fields,.calc-results { grid-template-columns:1fr; }
  .route-photo { min-height:500px; }
  .route-photo-copy { padding:70px 20px; }
  .route-photo-copy h2 { font-size:35px; }
  .comparison { font-size:13px; }
  .comparison th,.comparison td { padding:14px 8px; }
}
