
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
:root { --bg:#ede0b8; --surface:#f8f0d8; --border:rgba(90,48,16,0.18); --text:#2e1a08; --muted:rgba(46,26,8,0.72); --accent:#965000; }
html { scroll-behavior:smooth; }
body { font-family:'Segoe UI',system-ui,sans-serif; background:var(--bg); color:var(--text); min-height:100vh; display:flex; flex-direction:column; }
[hidden] { display:none !important; }
a { color:var(--accent); text-decoration:none; }
a:hover { text-decoration:underline; }

.site-header { position:sticky; top:0; z-index:1000; background:#1c1208; border-bottom:1px solid rgba(200,128,0,0.28); padding:0 24px; min-height:56px; display:flex; align-items:center; gap:18px; flex-shrink:0; }
.brand { display:flex; align-items:center; gap:8px; text-decoration:none; }
.brand-name { font-size:17px; font-weight:800; color:#f0e4c0; letter-spacing:-0.3px; }
.brand-name span { color:#c87000; }
.site-nav { margin-left:auto; display:flex; align-items:center; gap:4px; }
.site-nav > a { color:rgba(240,228,192,.78); font-size:13px; font-weight:700; padding:9px 10px; border-radius:8px; white-space:nowrap; }
.site-nav > a:hover, .site-nav > a[aria-current="page"] { color:#fff2c3; background:rgba(248,240,216,.08); text-decoration:none; }
.site-nav .account-link { color:#fff2c3; border:1px solid rgba(240,228,192,.24); }
.lang-picker { margin-left:5px; background:#2a1c0a; color:#f0e4c0; border:1px solid rgba(200,140,0,.35); border-radius:7px; font:inherit; font-size:12px; min-height:34px; padding:5px 8px; cursor:pointer; }
.lang-picker:focus-visible, .nav-toggle:focus-visible, .site-nav a:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible { outline:3px solid #df9700; outline-offset:2px; }
.lang-picker option { background:#1c1208; }
.nav-toggle { display:none; margin-left:auto; width:38px; height:36px; align-items:center; justify-content:center; background:rgba(248,240,216,.08); color:#f0e4c0; border:1px solid rgba(240,228,192,.24); border-radius:8px; font-size:19px; cursor:pointer; }
/* 940px fits the widest localized nav (ru needs 928px) — below it the header
   collapses to the hamburger instead of overflowing horizontally. */
@media(max-width:940px) {
  .site-header { min-height:56px; padding:0 12px; gap:10px; }
  .nav-toggle { display:inline-flex; }
  .site-nav { display:none; position:absolute; top:100%; left:0; right:0; margin:0; padding:7px 12px 12px; background:#1c1208; border-bottom:1px solid rgba(200,128,0,.28); box-shadow:0 14px 28px rgba(0,0,0,.35); flex-direction:column; align-items:stretch; gap:2px; }
  .site-header.nav-open .site-nav { display:flex; }
  .site-nav > a { padding:12px 10px; font-size:14px; }
  .site-nav .account-link { border:0; }
  .lang-picker { width:100%; margin:5px 0 0; min-height:42px; }
}

.breadcrumb { padding:12px 24px; font-size:12px; color:var(--muted); display:flex; gap:6px; align-items:center; flex-wrap:wrap; border-bottom:1px solid var(--border); background:var(--surface); }
.breadcrumb a { color:var(--muted); }
.breadcrumb a:hover { color:var(--accent); }
.sep { opacity:.5; }
.container { max-width:760px; margin:0 auto; padding:40px 24px; width:100%; }
footer { background:#1c1208; color:#cbbd9d; text-align:center; padding:20px; font-size:12px; margin-top:auto; border-top:1px solid rgba(200,128,0,0.15); }
footer a { color:#e59a32; }
.footer-links { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-bottom:8px; }
@media(max-width:600px) { .container { padding:24px 16px; } .breadcrumb { padding:10px 16px; } }

h1 { font-size:36px; font-weight:900; letter-spacing:-.6px; line-height:1.1; margin-bottom:6px; }
.route-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.route-title-copy { flex:1; min-width:0; }
.route-title-save-slot { display:flex; align-items:center; flex:0 0 auto; padding-top:2px; }
.route-title-save-btn, .static-save-link { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:36px; border-radius:999px; border:1px solid rgba(155,34,38,.30); background:#fff8e7; color:#7f2d25; font:inherit; font-size:12px; font-weight:900; padding:8px 12px; cursor:pointer; box-shadow:0 3px 10px rgba(46,26,8,.08); transition:background .15s,color .15s,border-color .15s,transform .1s; white-space:nowrap; }
.route-title-save-btn:hover, .static-save-link:hover { transform:translateY(-1px); background:#fff; border-color:rgba(178,34,42,.46); text-decoration:none; }
.route-title-save-btn.active { background:#b2222a; border-color:#b2222a; color:#fff8e7; }
.route-title-save-btn:disabled { opacity:.62; cursor:wait; transform:none; }
.route-region { font-size:10px; text-transform:uppercase; letter-spacing:2px; font-weight:700; color:var(--route-text-color); margin-bottom:8px; }
.route-country { font-size:14px; color:var(--muted); margin-bottom:18px; }
.route-hero { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:12px; margin-bottom:20px; background:var(--surface); }
.route-journey { display:flex; align-items:center; gap:12px; padding:13px 15px; margin-bottom:16px; border:1px solid var(--border); border-radius:10px; background:var(--surface); }
.journey-shape { flex:0 0 auto; border-radius:999px; background:var(--route-color); color:var(--route-on-color); font-size:9px; font-weight:850; letter-spacing:1px; text-transform:uppercase; padding:5px 9px; }
.journey-path { min-width:0; font-size:14px; font-weight:800; line-height:1.4; overflow-wrap:anywhere; }
.journey-path span { color:var(--accent); padding:0 5px; }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px; margin-bottom:14px; }
.stat { background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:12px 14px; }
.stat-label { font-size:9px; text-transform:uppercase; letter-spacing:1.5px; color:var(--muted); margin-bottom:4px; }
.stat-value { font-size:14px; font-weight:700; }
.meta-chips { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px; }
.meta-chip { font-size:11px; font-weight:600; padding:4px 10px; border-radius:20px; border:1.5px solid var(--border); color:var(--muted); background:var(--surface); }
.meta-chip.mc-easy     { color:#17603e; border-color:rgba(45,158,107,.4);  background:rgba(45,158,107,.07); }
.meta-chip.mc-moderate { color:#6f3d00; border-color:rgba(183,108,0,.4);   background:rgba(183,108,0,.07);  }
.meta-chip.mc-hard     { color:#7b2e1e; border-color:rgba(199,90,56,.4);   background:rgba(199,90,56,.07);  }
.meta-chip.mc-extreme  { color:#73171a; border-color:rgba(155,34,38,.4);   background:rgba(155,34,38,.07);  }
.meta-chip.mc-warn     { color:#73171a; border-color:rgba(155,34,38,.35);  background:rgba(155,34,38,.06);  }
.meta-chip.mc-ev       { color:#00538c; border-color:rgba(0,119,204,.4);   background:rgba(0,119,204,.07);  }
.meta-chip.mc-tier-S   { color:#663700; border-color:rgba(200,128,0,.55);  background:rgba(200,128,0,.12);  font-weight:800; }
.meta-chip.mc-tier-A   { color:#594300; border-color:rgba(160,116,0,.45);  background:rgba(160,116,0,.09);  }
.meta-chip.mc-tier-B   { color:#493812; border-color:rgba(120,80,16,.34);  background:rgba(120,80,16,.06);  }
.meta-chip.mc-tier-C   { color:#244c35; border-color:rgba(36,112,96,.38);  background:rgba(36,112,96,.07);  }
.meta-chip.mc-tier-D   { color:#44310f; border-color:rgba(90,66,24,.34);   background:rgba(90,66,24,.06);  }
.route-tldr { font-size:14px; line-height:1.7; color:var(--text); background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--route-color); border-radius:0 8px 8px 0; padding:12px 14px; margin-bottom:18px; }
.route-tldr strong { color:var(--accent); font-weight:800; letter-spacing:.3px; }
.route-desc { font-size:15px; line-height:1.8; color:var(--text); margin-bottom:18px; }
.fuel-row { display:flex; align-items:center; justify-content:flex-start; gap:10px; padding:10px 12px; background:var(--surface); border:1px solid var(--border); border-radius:8px; margin-bottom:18px; }
.fuel-info { display:flex; gap:14px; flex-wrap:wrap; }
.fuel-badge { display:flex; align-items:center; gap:6px; font-size:11px; font-weight:600; color:var(--muted); }
.fuel-badge-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.route-advisory { font-size:13px; line-height:1.7; color:rgba(46,26,8,0.78); background:rgba(200,112,0,0.07); border-left:3px solid rgba(200,112,0,0.45); border-radius:0 8px 8px 0; padding:12px 14px; margin-bottom:24px; }
.route-advisory-label { font-size:9px; text-transform:uppercase; letter-spacing:1.5px; font-weight:700; color:var(--accent); margin-bottom:5px; }
.route-freshness { margin:-8px 0 22px; padding:12px 14px; border:1px solid rgba(36,112,96,.22); border-radius:10px; background:rgba(36,112,96,.06); color:rgba(46,26,8,.72); font-size:12px; line-height:1.6; }
.route-freshness strong { color:var(--text); }
.route-freshness a { font-weight:750; white-space:nowrap; }
.route-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:32px; }
.cta { display:inline-block; background:#1c1208; color:#f0e4c0; border:1px solid rgba(200,128,0,.4); border-radius:10px; padding:12px 22px; font-size:14px; font-weight:700; transition:border-color .15s; }
.cta:hover { border-color:var(--accent); text-decoration:none; }
.share-btn { display:inline-flex; align-items:center; gap:6px; background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:10px; padding:11px 16px; font-size:14px; font-weight:700; cursor:pointer; transition:border-color .15s, background .15s; font-family:inherit; }
.share-btn:hover { border-color:var(--accent); color:var(--accent); }
.share-btn.copied { background:rgba(45,158,107,.10); border-color:rgba(45,158,107,.45); color:#17603e; }
.share-btn svg { display:block; }
.personalize-cta { display:inline-flex; align-items:center; gap:7px; background:var(--accent); color:#fff8e5; border:1px solid var(--accent); border-radius:10px; padding:12px 20px; font-size:14px; font-weight:800; cursor:pointer; transition:background .15s, transform .12s; font-family:inherit; box-shadow:0 6px 16px rgba(200,112,0,.22); }
.personalize-cta:hover { background:#b56500; border-color:#b56500; }
.personalize-cta:active { transform:translateY(1px); }
.personalize-cta svg { display:block; }
.px-band { text-align:center; background:rgba(200,112,0,0.06); border:1px solid rgba(200,112,0,0.22); border-radius:14px; padding:26px 22px 22px; margin:8px 0 24px; }
.px-band h2 { font-size:22px; margin:0 0 8px; }
.px-band p { font-size:14px; line-height:1.7; color:var(--muted); max-width:520px; margin:0 auto 16px; }
.px-band .px-band-plans { font-size:12px; margin:12px auto 0; color:var(--muted); opacity:.85; }
.route-toc { position:sticky; top:56px; z-index:40; display:flex; align-items:center; gap:4px; overflow-x:auto; scrollbar-width:thin; margin:0 -8px 28px; padding:8px; border:1px solid var(--border); border-radius:10px; background:rgba(248,240,216,.96); box-shadow:0 4px 16px rgba(46,26,8,.08); }
.route-toc-label { flex:0 0 auto; color:var(--muted); font-size:9px; font-weight:800; letter-spacing:1px; text-transform:uppercase; padding:0 6px; }
.route-toc a { flex:0 0 auto; color:var(--text); font-size:11px; font-weight:750; border-radius:7px; padding:7px 9px; }
.route-toc a:hover { color:var(--accent); background:#fffdf5; text-decoration:none; }
.section, #route-overview { scroll-margin-top:118px; }
.section { margin-bottom:36px; }
.section-title { font-size:10px; text-transform:uppercase; letter-spacing:2px; font-weight:700; color:var(--muted); margin-bottom:14px; padding-bottom:7px; border-bottom:2px solid var(--route-color); display:inline-block; }
.route-days-list { display:flex; flex-direction:column; gap:8px; }
.route-day { border:1px solid var(--border); border-radius:10px; background:var(--surface); overflow:hidden; }
.route-day > summary { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; padding:12px 14px; cursor:pointer; list-style:none; }
.route-day > summary::-webkit-details-marker { display:none; }
.route-day > summary::after { content:'+'; color:var(--accent); font-size:18px; line-height:1; grid-column:3; }
.route-day[open] > summary::after { content:'−'; }
.route-day-number { color:var(--route-text-color); font-size:10px; font-weight:850; letter-spacing:.7px; text-transform:uppercase; white-space:nowrap; }
.route-day summary strong { min-width:0; font-size:13px; line-height:1.4; overflow-wrap:anywhere; }
.route-day-highlights { margin:0 14px 13px; padding-top:10px; border-top:1px solid var(--border); color:var(--muted); font-size:11px; line-height:1.55; }
.route-day-note { margin:0 14px 13px; padding:9px 10px; border-left:3px solid var(--route-color); border-radius:0 7px 7px 0; background:rgba(200,112,0,.08); color:var(--text); font-size:11px; line-height:1.55; }
.highlights-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px; }
.highlight-card { border-radius:10px; border:1px solid var(--border); overflow:hidden; background:var(--surface); display:flex; flex-direction:column; }
.highlight-photo { width:100%; height:140px; object-fit:cover; display:block; background:var(--bg); }
.highlight-card.no-photo .highlight-body { padding-top:14px; }
.highlight-body { padding:10px 12px 12px; }
.highlight-sub { font-size:10px; text-transform:uppercase; letter-spacing:1.2px; font-weight:700; color:var(--accent); margin-bottom:3px; }
.highlight-name { font-size:14px; font-weight:800; color:var(--text); line-height:1.25; margin-bottom:5px; }
.highlight-desc { font-size:12px; color:var(--muted); line-height:1.55; }
.more-highlights { margin-top:12px; }
.more-highlights > summary { display:flex; align-items:center; justify-content:center; min-height:42px; border:1px solid var(--border); border-radius:9px; background:var(--surface); color:var(--text); font-size:12px; font-weight:800; cursor:pointer; list-style:none; }
.more-highlights > summary::-webkit-details-marker { display:none; }
.more-highlights > summary::after { content:'+'; color:var(--accent); font-size:18px; margin-left:7px; line-height:1; }
.more-highlights[open] > summary { margin-bottom:12px; }
.more-highlights[open] > summary::after { content:'−'; }
.stop-hotel-link { display:inline-flex; align-items:center; gap:5px; margin-top:8px; padding:4px 9px; font-size:11px; font-weight:600; line-height:1; color:var(--text); text-decoration:none; background:rgba(36,112,96,.08); border:1px solid rgba(36,112,96,.22); border-radius:999px; transition:background .15s, border-color .15s; }
.stop-hotel-link:hover { background:rgba(36,112,96,.16); border-color:rgba(36,112,96,.40); }
.stop-hotel-link svg { flex-shrink:0; }
.hub-links { display:flex; flex-wrap:wrap; gap:8px; }
.hub-links a { background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:9px 11px; font-size:12px; font-weight:750; color:var(--text); }
.hub-links a:hover { border-color:var(--accent); color:var(--accent); text-decoration:none; }
.planning-section { background:#f5f2df; border:1px solid rgba(36,112,96,.20); border-radius:12px; padding:16px 18px; margin-bottom:32px; }
.planning-links { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.planning-links a { display:block; background:#fffdf5; border:1px solid rgba(90,48,16,.16); border-radius:10px; padding:12px 14px; color:var(--text); }
.planning-links a:hover { border-color:rgba(36,112,96,.38); text-decoration:none; }
.planning-links strong { display:block; font-size:13px; margin-bottom:3px; }
.planning-links span { display:block; color:var(--muted); font-size:11px; line-height:1.45; }
.planning-note { color:var(--muted); font-size:11px; line-height:1.55; margin-top:12px; }
.related-list { list-style:none; display:flex; flex-direction:column; gap:10px; padding:0; margin:0; }
.related-list a { display:flex; gap:12px; align-items:center; background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:8px; color:var(--text); }
.related-list a:hover { border-color:var(--accent); text-decoration:none; }
.related-thumb { flex:0 0 56px; width:56px; height:56px; border-radius:8px; object-fit:cover; display:block; background:var(--bg); }
.related-thumb-empty { background:var(--bg); }
.related-text { flex:1; min-width:0; }
.related-text strong { display:block; font-size:13px; font-weight:800; color:var(--text); margin-bottom:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.related-text > span { display:block; font-size:11px; color:var(--muted); line-height:1.4; }
.faq-section .faq-item { background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:10px 14px; margin-bottom:8px; }
.faq-section .faq-item summary { font-size:14px; font-weight:700; color:var(--text); cursor:pointer; list-style:none; }
.faq-section .faq-item summary::-webkit-details-marker { display:none; }
.faq-section .faq-item summary::after { content:'+'; float:right; font-size:18px; color:var(--accent); line-height:1; }
.faq-section .faq-item[open] summary::after { content:'−'; }
.faq-section .faq-item p { font-size:13px; line-height:1.7; color:rgba(46,26,8,0.78); margin-top:8px; }
@media(max-width:600px) {
  h1 { font-size:26px; }
  .route-title-row { gap:8px; }
  .route-title-save-btn, .static-save-link { min-height:34px; padding:7px 10px; }
  .route-journey { align-items:flex-start; flex-direction:column; gap:8px; }
  .stats-grid { grid-template-columns:1fr 1fr; }
  .planning-links { grid-template-columns:1fr; }
  .route-day > summary { grid-template-columns:auto minmax(0,1fr) auto; gap:8px; padding:11px 12px; }
  .highlights-list { grid-template-columns:1fr; }
  .highlight-photo { height:160px; }
  .route-toc { margin-left:-4px; margin-right:-4px; border-radius:8px; }
}
