:root {
  --paper-000:#FFFFFF; --paper-050:#FAFBFC; --paper-100:#F2F5F9;
  --paper-200:#E9EDF3; --paper-300:#DBE2EB;
  --ink-900:#071630; --ink-800:#0B2040; --ink-600:#1E3149;
  --ink-400:#5B81A1; --ink-200:#C2D1DE; --ink-100:#E2E9F1;
  --champ-700:#7C6035; --champ-500:#C4A177;
  --wa:#25D366;
  --r-card:24px; --r-sheet:44px; --shadow:0 12px 40px rgba(11,32,64,.10);
}
* { box-sizing:border-box; }
html,body { margin:0; }
body {
  background:var(--paper-050); color:var(--ink-800);
  font-family:'Manrope',system-ui,sans-serif; line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
.wrap { max-width:520px; margin:0 auto; padding:40px 16px 56px; }

.head { text-align:center; }
.logo {
  font-family:'Unbounded',sans-serif; font-weight:500; font-size:30px;
  letter-spacing:-.02em; color:var(--ink-800);
}
.tagline { color:var(--ink-400); font-size:14px; margin:8px 0 0;
  text-transform:uppercase; letter-spacing:.12em; }
.rating {
  display:inline-flex; align-items:center; gap:6px; margin-top:16px;
  font-family:'JetBrains Mono',ui-monospace,monospace; font-size:14px;
  color:var(--champ-700); text-decoration:none; letter-spacing:.04em;
}
.rating__star { color:var(--champ-500); }

.about {
  text-align:center; color:var(--ink-600); font-size:16px;
  margin:24px auto 0; max-width:420px;
}

.actions { display:flex; flex-direction:column; gap:12px; margin-top:32px; }
.btn {
  display:flex; align-items:center; justify-content:center;
  min-height:56px; padding:0 24px; border-radius:50px;
  border:1.5px solid var(--ink-200); background:var(--paper-000);
  color:var(--ink-800); font-family:'Manrope'; font-size:17px; font-weight:600;
  text-decoration:none; cursor:pointer; transition:transform .08s ease, border-color .2s;
}
.btn:active { transform:scale(.98); }
.btn--primary { background:var(--wa); border-color:var(--wa); color:#063A18; }

.places { margin-top:56px; }
.places__title {
  font-family:'Unbounded'; font-weight:400; font-size:13px;
  text-transform:uppercase; letter-spacing:.16em; color:var(--ink-400);
  text-align:center; margin:0 0 24px;
}
.cards { display:flex; flex-direction:column; gap:16px; }
.card {
  background:var(--paper-000); border:1.5px solid var(--paper-300);
  border-radius:var(--r-card); padding:20px; box-shadow:var(--shadow);
}
.card__city { font-family:'Unbounded'; font-weight:500; font-size:18px; margin:0; }
.card__addr { color:var(--ink-600); margin:8px 0 0; font-size:15px; }
.card__hours { color:var(--ink-400); margin:4px 0 16px; font-size:14px; }
.card__route {
  display:inline-flex; min-height:44px; align-items:center; padding:0 20px;
  border-radius:50px; border:1.5px solid var(--ink-800); color:var(--ink-800);
  text-decoration:none; font-weight:600; font-size:15px;
}

.foot { text-align:center; color:var(--ink-400); font-size:13px; margin-top:48px; }

/* Шторка */
.sheet[hidden] { display:none; }
.sheet { position:fixed; inset:0; z-index:50; display:flex; align-items:flex-end; }
.sheet__backdrop { position:absolute; inset:0; background:rgba(7,22,48,.45); }
.sheet__panel {
  position:relative; width:100%; max-width:520px; margin:0 auto;
  background:var(--paper-050); border-radius:var(--r-sheet) var(--r-sheet) 0 0;
  border-top:1px solid var(--paper-300); padding:12px 16px 28px;
  animation:rise .22s ease; box-shadow:0 -12px 40px rgba(11,32,64,.16);
}
@keyframes rise { from { transform:translateY(100%); } to { transform:translateY(0); } }
.sheet__grab { width:40px; height:4px; border-radius:2px; background:var(--ink-200);
  margin:0 auto 16px; }
.sheet__title { font-family:'Unbounded'; font-weight:400; font-size:16px;
  text-align:center; margin:0 0 16px; }
.sheet__opt {
  display:flex; flex-direction:column; align-items:center; width:100%;
  min-height:56px; justify-content:center; margin-bottom:10px;
  border:1.5px solid var(--ink-200); background:var(--paper-000);
  border-radius:50px; font-family:'Manrope'; font-size:17px; font-weight:600;
  color:var(--ink-800); cursor:pointer;
}
.sheet__hint { font-size:12px; font-weight:400; color:var(--ink-400);
  text-transform:none; letter-spacing:0; margin-top:2px; }
.sheet__cancel { width:100%; min-height:48px; background:none; border:none;
  color:var(--ink-400); font-family:'Manrope'; font-size:15px; cursor:pointer; margin-top:4px; }

@media (prefers-color-scheme:dark) {
  /* таплинк всегда светлый по брендбуку каталога — тёмный фон только для 3D.
     Оставляем светлую тему принудительно. */
}
