/* =====================================================================
   Ali Baba Tours — дизайн-система публичных страниц («Ocean editorial»).
   Палитра прежняя: глубокий синий, яркий синий, голубой, цвета курортов.
   Заголовки — Onest (современный гротеск), текст — Manrope.
   Подключение: <link rel="stylesheet" href="/css/site.css"> (header.php
   подключает сам, если страница не сделала этого в <head>).
   ===================================================================== */

:root {
    /* Палитра (имена --home-* сохранены — на них опираются стили страниц) */
    --home-bg: #ffffff;
    --home-bg-soft: #f2f7fc;
    --home-blue: #087bfa;
    --home-blue-light: #00a4f5;
    --home-navy: #10284b;
    --home-ink: #0a2540;
    --home-deep: #061a30;
    --home-text: #33465f;
    --home-muted: #66798f;
    --home-border: #e2e9f1;
    --home-line: #d3dee9;
    --home-star: #f5b301;
    --home-sale: #e5484d;
    --home-wa: #1fa855;

    /* Цвета курортов — те же, что в темах страницы экскурсий */
    --c-sharm: #2563eb;
    --c-hurghada: #d97706;
    --c-phuket: #059669;
    --c-vietnam: #0d9488;

    --home-gradient: linear-gradient(120deg, #087bfa 0%, #00a4f5 100%);
    --ocean: linear-gradient(160deg, #061a30 0%, #0a2540 45%, #0b3a6e 100%);
    --home-shadow: 0 1px 2px rgba(10, 37, 64, .06), 0 12px 32px -12px rgba(10, 37, 64, .18);
    --home-shadow-hover: 0 2px 4px rgba(10, 37, 64, .06), 0 28px 56px -18px rgba(10, 37, 64, .32);
    --glow: 0 8px 20px -10px rgba(8, 123, 250, .45);
    --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");

    --r-sm: 8px;
    --r: 14px;
    --r-lg: 22px;
    --home-radius: var(--r);
    --home-radius-sm: var(--r-sm);

    --home-container: 1240px;
    --home-gutter: 18px;
    --home-font: 'Manrope', 'Segoe UI', Tahoma, system-ui, -apple-system, sans-serif;
    --font-display: 'Onest', 'Manrope', 'Segoe UI', system-ui, sans-serif;
    --ease-out: cubic-bezier(.16, 1, .3, 1);
}
@media (min-width: 768px) { :root { --home-gutter: 32px; } }
/* Арабский: у Onest нет арабского начертания — заголовки рисуем системным гротеском */
[dir="rtl"] { --font-display: 'Manrope', Tahoma, 'Segoe UI', sans-serif; }

.home-container, .s-container {
    width: 100%;
    max-width: calc(var(--home-container) + 2 * var(--home-gutter));
    margin-inline: auto;
    padding-inline: var(--home-gutter);
}
.visually-hidden {
    position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------- Типографика разделов ---------- */
.kicker {
    display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px;
    font: 700 13px/1.2 var(--home-font); letter-spacing: .16em; text-transform: uppercase; color: var(--home-blue);
}
.kicker::before { content: ""; width: 28px; height: 1.5px; background: currentColor; }
[dir="rtl"] .kicker { letter-spacing: 0; }
.s-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px 28px; margin: 0 0 32px; }
.s-head > .kicker { grid-column: 1 / -1; margin-bottom: -4px; }
.s-title {
    margin: 0; font: 600 clamp(34px, 4.6vw, 58px)/1.02 var(--font-display);
    letter-spacing: -.015em; color: var(--home-ink); text-wrap: balance;
}
.s-title em, .display em { font-style: normal; font-weight: 500; color: var(--home-blue); }
.s-sub { grid-column: 1 / -1; margin: 0; max-width: 620px; font-size: 17px; line-height: 1.6; color: var(--home-muted); }
.s-link {
    display: inline-flex; align-items: center; gap: 8px; color: var(--home-ink); font-weight: 700; font-size: 15px;
    text-decoration: none; white-space: nowrap; padding-bottom: 3px;
    background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1.5px no-repeat;
    transition: background-size .35s var(--ease-out), color .2s ease;
}
.s-link:hover { color: var(--home-blue); background-size: 40% 1.5px; }
.s-link::after { content: "→"; transition: transform .3s var(--ease-out); }
.s-link:hover::after { transform: translateX(4px); }
[dir="rtl"] .s-link::after { content: "←"; }
[dir="rtl"] .s-link:hover::after { transform: translateX(-4px); }
.on-dark .s-title, .on-dark .s-link { color: #fff; }
.on-dark .s-title em { color: var(--home-blue-light); }
.on-dark .s-sub { color: rgba(255, 255, 255, .7); }
.on-dark .kicker { color: var(--home-blue-light); }

/* ---------- Кнопки ---------- */
.btn {
    position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    min-height: 52px; padding: 13px 26px; border-radius: 12px; border: 1.5px solid transparent;
    font: 700 16px/1.2 var(--home-font); text-decoration: none; cursor: pointer; white-space: nowrap;
    transition: transform .25s var(--ease-out), box-shadow .25s ease, background-color .2s ease, border-color .2s ease, color .2s ease;
}
.btn--primary { background: var(--home-gradient); color: #fff; box-shadow: var(--glow); }
.btn--primary:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 20px 40px -12px rgba(8, 123, 250, .65); }
.btn--ghost { background: #fff; color: var(--home-ink); border-color: var(--home-line); }
.btn--ghost:hover { border-color: var(--home-ink); transform: translateY(-2px); }
.btn--glass { background: rgba(255, 255, 255, .12); color: #fff; border-color: rgba(255, 255, 255, .35); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.btn--glass:hover { background: rgba(255, 255, 255, .22); color: #fff; transform: translateY(-2px); }
.btn--wa { background: var(--home-wa); color: #fff; box-shadow: 0 14px 30px -12px rgba(31, 168, 85, .7); }
.btn--wa:hover { background: #188f47; color: #fff; transform: translateY(-2px); }
.btn--sm { min-height: 42px; padding: 9px 18px; font-size: 14px; border-radius: 10px; }
.btn--block { width: 100%; }
.btn:focus-visible, .s-link:focus-visible { outline: 3px solid rgba(8, 123, 250, .45); outline-offset: 3px; }
.btn svg { flex-shrink: 0; }
[dir="rtl"] .btn .i-arrow { transform: scaleX(-1); }

/* ---------- Строки с разделителями ---------- */
.rows { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--home-border); }
.rows > li { border-bottom: 1px solid var(--home-border); }

/* ---------- Вкладки-фильтры (сегментированный переключатель) ---------- */
.tabs {
    display: flex; gap: 6px; overflow-x: auto; margin: 0; padding: 5px; list-style: none; width: max-content; max-width: 100%;
    background: var(--home-bg-soft); border: 1px solid var(--home-border); border-radius: 14px; scrollbar-width: none;
}
.tabs::-webkit-scrollbar { display: none; }
.tabs a, .tabs button {
    position: relative; display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 9px 16px; margin: 0;
    border: 0; border-radius: 10px; background: none; color: var(--home-muted);
    font: 700 15px var(--home-font); text-decoration: none; white-space: nowrap; cursor: pointer;
    transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
}
.tabs a:hover, .tabs button:hover { color: var(--home-ink); }
.tabs .is-active, .tabs [aria-current], .tabs [aria-pressed="true"] {
    background: #fff; color: var(--home-ink); box-shadow: 0 1px 2px rgba(10, 37, 64, .08), 0 6px 16px -8px rgba(10, 37, 64, .25);
}
.tabs .is-active::before, .tabs [aria-current]::before, .tabs [aria-pressed="true"]::before {
    content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--tab-color, var(--home-blue));
}
@media (max-width: 767px) { .tabs { width: auto; } }

/* ---------- Метка курорта ---------- */
.place { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; color: var(--home-muted); }
.place::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--place, var(--home-muted)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--place, #999) 20%, transparent); }
.place--sharm { --place: var(--c-sharm); }
.place--hurghada { --place: var(--c-hurghada); }
.place--phuket { --place: var(--c-phuket); }
.place--vietnam { --place: var(--c-vietnam); }

/* ---------- Карточка тура ---------- */
.tcard {
    position: relative; display: flex; flex-direction: column; height: 100%; overflow: hidden;
    background: #fff; border-radius: var(--r-lg); box-shadow: var(--home-shadow);
    transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out);
}
.tcard:hover { transform: translateY(-6px); box-shadow: var(--home-shadow-hover); }
.tcard__media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--home-bg-soft); }
.tcard__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .9s var(--ease-out); }
.tcard:hover .tcard__media img { transform: scale(1.07); }
.tcard__media::after { content: ""; position: absolute; inset: 55% 0 0; background: linear-gradient(180deg, transparent, rgba(6, 26, 48, .55)); pointer-events: none; }
.tcard__sale {
    position: absolute; top: 12px; inset-inline-start: 12px; z-index: 1; padding: 5px 10px; border-radius: 999px;
    background: var(--home-sale); color: #fff; font: 800 12px/1.2 var(--home-font); letter-spacing: .02em;
}
.tcard__sale--hot { background: #fff; color: var(--home-ink); }
.tcard__rate {
    position: absolute; bottom: 12px; inset-inline-end: 12px; z-index: 1; display: inline-flex; align-items: center; gap: 4px;
    padding: 4px 9px; border-radius: 999px; background: rgba(255, 255, 255, .92); color: var(--home-ink); font: 800 12px/1.2 var(--home-font);
}
.tcard__rate b { color: var(--home-star); }
.tcard__dur { position: absolute; bottom: 12px; inset-inline-start: 12px; z-index: 1; color: #fff; font: 700 13px/1.2 var(--home-font); text-shadow: 0 1px 6px rgba(0, 0, 0, .35); }
.tcard__body { display: flex; flex-direction: column; gap: 6px; flex: 1; padding: 16px 18px 18px; }
.tcard__title { margin: 0; font: 700 17px/1.3 var(--home-font); color: var(--home-ink); }
.tcard__link { color: inherit; text-decoration: none; }
.tcard__link::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.tcard__link:focus-visible { outline: none; }
.tcard:focus-within { outline: 3px solid rgba(8, 123, 250, .45); outline-offset: 3px; }
.tcard__meta { margin: 0; font-size: 13px; color: var(--home-muted); }
.tcard__price {
    display: flex; align-items: baseline; gap: 6px; margin-top: auto; padding-top: 12px;
    border-top: 1px dashed var(--home-line); font-size: 13px; color: var(--home-muted);
}
.tcard__price strong { font-size: 21px; font-weight: 800; color: var(--home-ink); letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.tcard__price s { color: var(--home-muted); }
.tcard__go {
    margin-inline-start: auto; align-self: center; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%;
    background: var(--home-bg-soft); color: var(--home-blue); transition: background-color .3s ease, color .3s ease, transform .3s var(--ease-out);
}
.tcard:hover .tcard__go { background: var(--home-blue); color: #fff; transform: rotate(-45deg); }
[dir="rtl"] .tcard__go svg { transform: scaleX(-1); }

/* ---------- Шапка внутренней страницы ---------- */
.page-head { position: relative; padding-block: 40px 28px; }
.page-head__crumbs { margin: 0 0 14px; font-size: 14px; color: var(--home-muted); }
.page-head__crumbs a { color: var(--home-muted); text-decoration: none; }
.page-head__crumbs a:hover { color: var(--home-blue); }
.page-head h1 { margin: 0; font: 600 clamp(40px, 6vw, 72px)/1 var(--font-display); letter-spacing: -.02em; color: var(--home-ink); text-wrap: balance; }
.page-head h1 em { font-style: normal; font-weight: 500; color: var(--home-blue); }
.page-head p { margin: 14px 0 0; max-width: 640px; font-size: 18px; line-height: 1.6; color: var(--home-muted); }

/* «Океанская» шапка страницы: тёмный градиент, свечение и зерно.
   Заезжает под закреплённую панель шапки сайта, поэтому сама добавляет отступ сверху. */
.page-hero {
    position: relative; isolation: isolate; overflow: hidden; color: #fff; background: var(--ocean);
    padding-block: 48px 56px;
}
.page-hero::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: radial-gradient(60% 80% at 85% 10%, rgba(0, 164, 245, .35), transparent 60%), radial-gradient(50% 60% at 10% 100%, rgba(8, 123, 250, .3), transparent 60%);
}
.page-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: var(--grain); opacity: .3; mix-blend-mode: overlay; pointer-events: none; }
.page-hero .page-head { padding: 0; }
.page-hero .page-head h1 { color: #fff; }
.page-hero .page-head h1 em { color: var(--home-blue-light); }
.page-hero .page-head p, .page-hero .page-head__crumbs, .page-hero .page-head__crumbs a { color: rgba(255, 255, 255, .72); }
.page-hero .page-head__crumbs a:hover { color: #fff; }
.page-hero .tabs { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .14); }
.page-hero .tabs a, .page-hero .tabs button { color: rgba(255, 255, 255, .75); }
.page-hero .tabs a:hover, .page-hero .tabs button:hover { color: #fff; }
.page-hero .tabs .is-active, .page-hero .tabs [aria-current], .page-hero .tabs [aria-pressed="true"] { background: #fff; color: var(--home-ink); }

/* ---------- Текст статей ---------- */
.prose { max-width: 720px; font-size: 18px; line-height: 1.75; color: var(--home-text); }
.prose h2 { margin: 1.8em 0 .5em; font: 600 34px/1.15 var(--font-display); color: var(--home-ink); }
.prose h3 { margin: 1.5em 0 .4em; font-size: 21px; color: var(--home-ink); }
.prose a { color: var(--home-blue); }
.prose img { max-width: 100%; height: auto; border-radius: var(--r); }
.prose ul, .prose ol { padding-inline-start: 1.3em; }
.prose blockquote { margin: 1.5em 0; padding: 4px 0; padding-inline-start: 22px; border-inline-start: 3px solid var(--home-blue); font: 500 24px/1.45 var(--font-display); color: var(--home-ink); }

/* ---------- Поля форм ---------- */
.field { display: grid; gap: 7px; margin: 0 0 16px; }
.field > label { font-size: 14px; font-weight: 700; color: var(--home-ink); }
.input, .field input, .field select, .field textarea {
    width: 100%; min-height: 52px; padding: 12px 15px; border: 1.5px solid var(--home-line); border-radius: 12px;
    background: #fff; font: 500 16px var(--home-font); color: var(--home-ink); transition: border-color .2s ease, box-shadow .2s ease;
}
.field textarea { min-height: 130px; resize: vertical; }
.input:focus, .field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--home-blue); box-shadow: 0 0 0 4px rgba(8, 123, 250, .14); }

/* ---------- Появление при прокрутке (js: /js/site-motion.js) ---------- */
.js [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease-out), transform .9s var(--ease-out); transition-delay: calc(var(--d, 0) * 90ms); }
.js [data-reveal].is-in { opacity: 1; transform: none; }

/* ---------- Подвал (pages/components/site-footer.php) ---------- */
.home-footer { position: relative; isolation: isolate; overflow: hidden; background: var(--home-deep); color: rgba(255, 255, 255, .7); padding-block: 72px 28px; font-family: var(--home-font); }
.home-footer::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: radial-gradient(50% 70% at 100% 0%, rgba(8, 123, 250, .28), transparent 65%), radial-gradient(40% 60% at 0% 100%, rgba(0, 164, 245, .14), transparent 60%);
}
.home-footer a { color: inherit; }
.home-footer__grid { display: grid; gap: 36px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-footer__brand, .home-footer__ask { grid-column: 1 / -1; }
@media (min-width: 1024px) {
    .home-footer__grid { grid-template-columns: 1.5fr 1fr 1fr 1.2fr 1.6fr; gap: 44px; }
    .home-footer__brand, .home-footer__ask { grid-column: auto; }
}
.home-footer__logo { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: #fff; }
.home-footer__logo-mark { color: var(--home-blue-light); }
.home-footer__logo-text { display: flex; flex-direction: column; line-height: 1; }
.home-footer__logo-text strong { font: 600 30px/1 var(--font-display); color: #fff; }
.home-footer__logo-text span { margin-top: 4px; font-size: 11px; font-weight: 800; letter-spacing: .3em; text-transform: uppercase; color: var(--home-blue-light); }
.home-footer__about { margin: 16px 0 18px; font-size: 15px; line-height: 1.65; max-width: 320px; }
.home-footer__social { display: flex; gap: 10px; flex-wrap: wrap; }
.home-footer__social a {
    display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; color: #fff;
    background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12); transition: background-color .25s ease, transform .25s var(--ease-out);
}
.home-footer__social a:hover { background: var(--home-blue); transform: translateY(-3px); }
.home-footer h2 { margin: 0 0 16px; font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--home-blue-light); }
.home-footer ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 11px; }
.home-footer ul a { color: rgba(255, 255, 255, .82); text-decoration: none; font-size: 15px; transition: color .2s ease; }
.home-footer ul a:hover { color: #fff; }
.home-footer__contacts li { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; color: rgba(255, 255, 255, .82); }
.home-footer__contacts svg { color: var(--home-blue-light); flex-shrink: 0; margin-top: 3px; }
.home-footer__ask p { margin: 0 0 14px; font-size: 15px; }
.home-footer__form { display: flex; gap: 6px; padding: 6px; border-radius: 14px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); }
.home-footer__form:focus-within { border-color: var(--home-blue-light); }
.home-footer__form input {
    flex: 1; min-width: 0; min-height: 44px; padding: 10px 12px; border: 0; border-radius: 10px;
    background: transparent; font: 500 15px var(--home-font); color: #fff;
}
.home-footer__form input::placeholder { color: rgba(255, 255, 255, .45); }
.home-footer__form input:focus { outline: none; }
.home-footer__form .home-btn, .home-footer__form button {
    min-height: 44px; padding: 8px 18px; border: 0; border-radius: 10px; background: var(--home-gradient); color: #fff;
    font: 700 14px var(--home-font); cursor: pointer; box-shadow: none;
}
.home-footer__big {
    margin: 56px 0 0; font: 500 clamp(56px, 13vw, 190px)/.9 var(--font-display); letter-spacing: -.03em;
    color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, .22); white-space: nowrap; overflow: hidden; user-select: none;
}
.home-footer__bottom {
    display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px;
    margin-top: 28px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .12);
    font-size: 13px; color: rgba(255, 255, 255, .5);
}
.home-footer__bottom a { color: rgba(255, 255, 255, .65); }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    .js [data-reveal] { opacity: 1; transform: none; }
}
@media (hover: none) {
    .tcard:hover { transform: none; }
    .tcard:hover .tcard__media img { transform: none; }
}
@media (max-width: 599px) {
    .s-head { grid-template-columns: 1fr; gap: 10px; margin-bottom: 26px; }
    .s-head > .s-link { justify-self: start; grid-row: auto; }
}


/* =====================================================================
   Премиальная версия (2026-10-19): современный гротеск Onest в заголовках,
   плотный трекинг, акцентное слово — светлым начертанием без курсива,
   сдержанные тени и микродвижения.
   ===================================================================== */
body { font-feature-settings: "ss01" on, "cv11" on; }
h1, h2, h3, .s-title, .page-head h1 { font-kerning: normal; }
.s-title { font: 600 clamp(30px, 3.6vw, 48px)/1.08 var(--font-display); letter-spacing: -.035em; }
.page-head h1 { font: 600 clamp(34px, 4.4vw, 56px)/1.06 var(--font-display); letter-spacing: -.04em; }
.s-title em, .display em, .page-head h1 em { font-style: normal; font-weight: 300; color: var(--home-blue); }
.on-dark .s-title em, .page-hero .page-head h1 em { color: var(--home-blue-light); }
.s-sub { font-size: 16px; }
.kicker { font-size: 12px; letter-spacing: .2em; font-weight: 700; }
.kicker::before { width: 22px; height: 1px; }

.btn { min-height: 50px; padding: 12px 24px; border-radius: 10px; font-weight: 600; letter-spacing: -.005em; }
.btn--primary { background: var(--home-blue); box-shadow: 0 1px 0 rgba(255, 255, 255, .25) inset, var(--glow); }
.btn--primary:hover { background: #0a6fe0; transform: translateY(-1px); box-shadow: 0 1px 0 rgba(255, 255, 255, .25) inset, 0 12px 26px -12px rgba(8, 123, 250, .6); }
.btn--ghost:hover, .btn--glass:hover, .btn--wa:hover { transform: translateY(-1px); }
.btn--sm { min-height: 40px; border-radius: 9px; }

.tabs { border-radius: 12px; }
.tabs a, .tabs button { border-radius: 9px; font-weight: 600; }

.tcard { border-radius: 18px; box-shadow: 0 1px 2px rgba(10, 37, 64, .05), 0 8px 24px -14px rgba(10, 37, 64, .22); }
.tcard:hover { transform: translateY(-4px); }
.tcard:hover .tcard__media img { transform: scale(1.04); }
.tcard__title { font-family: var(--font-display); font-weight: 600; letter-spacing: -.015em; }
.tcard__price strong { font-family: var(--font-display); font-weight: 600; letter-spacing: -.02em; }
.tcard:hover .tcard__go { transform: translateX(3px); }
[dir="rtl"] .tcard:hover .tcard__go { transform: translateX(-3px); }

.prose h2 { font: 600 30px/1.2 var(--font-display); letter-spacing: -.025em; }
.prose blockquote { font: 400 22px/1.5 var(--font-display); letter-spacing: -.01em; }

.home-footer__logo-text strong { font-weight: 600; letter-spacing: -.02em; font-size: 26px; }
.home-footer__big { font-weight: 600; letter-spacing: -.05em; font-size: clamp(54px, 12vw, 176px); -webkit-text-stroke: 1px rgba(255, 255, 255, .16); }

/* Заголовки на внутренних страницах — плотнее (Onest шире антиквы) */
h1, h2, h3 { letter-spacing: -.02em; }


/* =====================================================================
   iOS-слой (2026-10-21): больше воздуха и меньше декора, системный шрифт
   (SF Pro на устройствах Apple, Onest на остальных), «жидкое стекло»,
   капсульные кнопки, сегментированные переключатели, крупные области нажатия.
   ===================================================================== */
:root {
    --home-font: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Onest', 'Manrope', 'Segoe UI', system-ui, sans-serif;
    --font-display: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Onest', 'Manrope', 'Segoe UI', system-ui, sans-serif;
    --home-bg-soft: #f2f4f8;
    --home-text: #3a4a5e;
    --home-muted: #6e7a89;
    --home-border: rgba(60, 60, 67, .12);
    --home-line: rgba(60, 60, 67, .18);
    --ios-fill: rgba(118, 118, 128, .12);
    --ios-fill-2: rgba(118, 118, 128, .08);
    --ios-sep: rgba(60, 60, 67, .14);
    --grain: none;
    --r-sm: 10px;
    --r: 16px;
    --r-lg: 24px;
    --glow: none;
    --home-shadow: 0 0 0 .5px rgba(10, 37, 64, .06), 0 6px 20px -10px rgba(10, 37, 64, .16);
    --home-shadow-hover: 0 0 0 .5px rgba(10, 37, 64, .06), 0 16px 36px -14px rgba(10, 37, 64, .26);
    --glass: rgba(255, 255, 255, .62);
    --glass-dark: rgba(20, 28, 40, .32);
    --glass-border: rgba(255, 255, 255, .6);
    --glass-blur: blur(24px) saturate(180%);
    --glass-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 10px 30px -10px rgba(10, 37, 64, .25);
    --spring: cubic-bezier(.32, .72, 0, 1);
}
[dir="rtl"] { --font-display: -apple-system, 'SF Arabic', 'Segoe UI', Tahoma, sans-serif; --home-font: -apple-system, 'SF Arabic', 'Segoe UI', Tahoma, sans-serif; }
body { font-feature-settings: normal; letter-spacing: -.011em; }
h1, h2, h3 { letter-spacing: -.022em; }

/* Типографика по шкале iOS */
.kicker { gap: 0; margin-bottom: 8px; font: 600 15px/1.3 var(--home-font); letter-spacing: -.01em; text-transform: none; color: var(--home-blue); }
.kicker::before { display: none; }
.s-head { margin-bottom: 24px; align-items: end; }
.s-title { font: 700 clamp(28px, 3.4vw, 40px)/1.1 var(--font-display); letter-spacing: -.028em; }
.s-title em, .display em, .page-head h1 em { font-weight: 700; color: var(--home-blue); }
.s-sub { font-size: 17px; line-height: 1.5; color: var(--home-muted); }
.s-link { padding: 0; background: none; color: var(--home-blue); font-weight: 500; font-size: 17px; letter-spacing: -.02em; }
.s-link:hover { color: var(--home-blue); background: none; opacity: .75; }
.s-link::after { content: "›"; font-size: 1.25em; line-height: 1; transform: translateY(-1px); }
.s-link:hover::after { transform: translate(2px, -1px); }
.page-head h1 { font: 700 clamp(32px, 4.4vw, 52px)/1.08 var(--font-display); letter-spacing: -.03em; }
.page-head p { font-size: 17px; }
.prose { font-size: 17px; line-height: 1.65; }
.prose h2 { font: 700 26px/1.2 var(--font-display); letter-spacing: -.025em; }
.prose blockquote { font: 500 20px/1.5 var(--font-display); }

/* Кнопки — капсулы, нажатие с лёгким сжатием */
.btn { min-height: 50px; padding: 13px 24px; border-radius: 999px; border: 0; font: 600 17px/1.15 var(--home-font); letter-spacing: -.02em; box-shadow: none; }
.btn:active { transform: scale(.97); }
.btn--primary { background: var(--home-blue); color: #fff; box-shadow: none; }
.btn--primary:hover { background: #0a6fe0; transform: none; box-shadow: none; }
.btn--ghost { background: var(--ios-fill); color: var(--home-blue); border: 0; }
.btn--ghost:hover { background: rgba(118, 118, 128, .18); transform: none; }
.btn--glass {
    background: rgba(255, 255, 255, .2); color: #fff; border: 0;
    -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), inset 0 0 0 1px rgba(255, 255, 255, .22);
}
.btn--glass:hover { background: rgba(255, 255, 255, .3); transform: none; }
.btn--wa { background: #25d366; color: #fff; box-shadow: none; }
.btn--wa:hover { background: #1fbe5a; transform: none; }
.btn--sm { min-height: 40px; padding: 9px 16px; font-size: 15px; border-radius: 999px; }
.btn:focus-visible, .s-link:focus-visible { outline: 3px solid rgba(8, 123, 250, .4); outline-offset: 2px; }

/* Сегментированный переключатель (UISegmentedControl) */
.tabs { gap: 2px; padding: 2px; border: 0; border-radius: 10px; background: var(--ios-fill); }
.tabs a, .tabs button { min-height: 34px; padding: 6px 14px; border-radius: 8px; font: 600 14px/1.2 var(--home-font); letter-spacing: -.01em; color: var(--home-ink); }
.tabs a:hover, .tabs button:hover { color: var(--home-ink); background: rgba(255, 255, 255, .45); }
.tabs .is-active, .tabs [aria-current], .tabs [aria-pressed="true"] { background: #fff; box-shadow: 0 3px 8px rgba(0, 0, 0, .12), 0 3px 1px rgba(0, 0, 0, .04), 0 0 0 .5px rgba(0, 0, 0, .04); }
.tabs .is-active::before, .tabs [aria-current]::before, .tabs [aria-pressed="true"]::before { width: 6px; height: 6px; }
@media (max-width: 767px) { .tabs a, .tabs button { min-height: 36px; } }

.place::before { box-shadow: none; width: 6px; height: 6px; }
.place { font-weight: 500; }

/* Карточка тура: крупные скругления, стеклянные метки на фото */
.tcard { border-radius: var(--r-lg); box-shadow: var(--home-shadow); }
.tcard:hover { transform: translateY(-3px); box-shadow: var(--home-shadow-hover); }
.tcard:active { transform: scale(.985); }
.tcard__media::after { display: none; }
.tcard:hover .tcard__media img { transform: scale(1.03); }
.tcard__sale, .tcard__rate, .tcard__dur {
    padding: 5px 10px; border-radius: 999px; font: 600 12px/1.2 var(--home-font); letter-spacing: 0; text-shadow: none;
    -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
}
.tcard__sale { background: rgba(229, 72, 77, .92); color: #fff; }
.tcard__sale--hot { background: rgba(255, 255, 255, .78); color: var(--home-ink); }
.tcard__rate { background: rgba(255, 255, 255, .78); }
.tcard__dur { background: rgba(20, 28, 40, .38); color: #fff; bottom: 12px; }
.tcard__body { padding: 14px 16px 16px; gap: 4px; }
.tcard__title { font: 600 17px/1.3 var(--font-display); letter-spacing: -.022em; }
.tcard__price { padding-top: 10px; border-top: 0; font-size: 13px; }
.tcard__price strong { font: 700 19px/1 var(--font-display); letter-spacing: -.02em; }
.tcard__go { width: 30px; height: 30px; background: var(--ios-fill); color: var(--home-blue); }
.tcard:hover .tcard__go { background: var(--home-blue); color: #fff; transform: none; }
.tcard__go svg { width: 15px; height: 15px; }

/* Поля ввода в стиле iOS */
.input, .field input, .field select, .field textarea { min-height: 50px; border: 0; border-radius: 12px; background: var(--ios-fill-2); font-size: 17px; }
.input:focus, .field input:focus, .field select:focus, .field textarea:focus { background: #fff; box-shadow: 0 0 0 3px rgba(8, 123, 250, .35); }
.field > label { font-size: 13px; font-weight: 500; color: var(--home-muted); text-transform: uppercase; letter-spacing: .01em; }

.rows { border-top-width: .5px; }
.rows > li { border-bottom-width: .5px; }

/* Появление — мягче и короче */
.js [data-reveal] { transform: translateY(14px); transition: opacity .7s var(--spring), transform .7s var(--spring); transition-delay: calc(var(--d, 0) * 60ms); }

/* Подвал — светлый и тихий, как на сайтах Apple */
.home-footer { background: var(--home-bg-soft); color: var(--home-muted); padding-block: 56px 28px; border-top: .5px solid var(--ios-sep); }
.home-footer::before { display: none; }
.home-footer__logo, .home-footer__logo-text strong { color: var(--home-ink); }
.home-footer__logo-mark { color: var(--home-blue); }
.home-footer__logo-text strong { font: 700 22px/1 var(--font-display); letter-spacing: -.03em; }
.home-footer__logo-text span { color: var(--home-muted); letter-spacing: .2em; }
.home-footer__about { font-size: 14px; color: var(--home-muted); }
.home-footer h2 { font: 600 13px/1.3 var(--home-font); letter-spacing: -.005em; text-transform: none; color: var(--home-ink); }
.home-footer ul { gap: 9px; }
.home-footer ul a, .home-footer__contacts li { color: var(--home-muted); font-size: 14px; }
.home-footer ul a:hover { color: var(--home-ink); }
.home-footer__contacts svg { color: var(--home-muted); }
.home-footer__social a { width: 40px; height: 40px; border-radius: 50%; border: 0; background: var(--ios-fill); color: var(--home-ink); }
.home-footer__social a:hover { background: var(--home-blue); color: #fff; transform: none; }
.home-footer__ask p { font-size: 14px; }
.home-footer__form { padding: 4px; border: 0; border-radius: 999px; background: #fff; box-shadow: 0 0 0 .5px var(--ios-sep); }
.home-footer__form:focus-within { box-shadow: 0 0 0 3px rgba(8, 123, 250, .35); }
.home-footer__form input { color: var(--home-ink); min-height: 42px; padding-inline: 14px; }
.home-footer__form input::placeholder { color: #8e96a3; }
.home-footer__form .home-btn, .home-footer__form button { min-height: 42px; border-radius: 999px; background: var(--home-blue); font-size: 15px; font-weight: 600; }
.home-footer__big { display: none; }
.home-footer__bottom { margin-top: 36px; border-top: .5px solid var(--ios-sep); color: #8e96a3; font-size: 12px; }
.home-footer__bottom a { color: var(--home-muted); }

/* Материал «стекло» для страниц */
.glass {
    background: var(--glass); border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow);
    -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
}
.glass--dark { background: var(--glass-dark); border-color: rgba(255, 255, 255, .22); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 10px 30px -10px rgba(0, 0, 0, .35); }
@media (prefers-reduced-transparency: reduce) { .glass { background: #fff; } .glass--dark { background: rgba(20, 28, 40, .85); } }


/* =====================================================================
   РЕДИЗАЙН 2026 (DESIGN.md, «Разделённая сцена»): токены.
   Этот блок стоит последним и перекрывает всё выше. Старые имена --home-*
   переназначены на новые, поэтому prices / reviews / useful-info / 404 и др.
   получают новую палитру без правки каждого файла.
   Компоненты (кнопки, поля, подвал, панели) — в css/ab-base.css.
   ===================================================================== */
:root {
    /* основа */
    --bg: #FFFFFF;
    --surface: #EEF3FA;
    --surface-2: #DCE7F7;
    --ink: #0B2347;
    --muted: #4A5B75;
    /* действие */
    --accent: #0062E0;
    --accent-hover: #004FB8;
    --accent-active: #0047A8;
    --accent-ink: #FFFFFF;
    /* поле цвета */
    --sea: #0A3B8C;
    --on-sea: #FFFFFF;
    --on-sea-muted: #A9C4EE;
    /* служебные */
    --sun: #FDB833;
    --wa: #1A7F45;
    --wa-hover: #146637;
    --danger: #B42318;
    --line: #C9D6EA;
    --scrim: rgba(11, 35, 71, .55);
    --backdrop: rgba(11, 35, 71, .45);
    /* углы */
    --r-hold: 0;
    --r-press: 999px;

    /* шрифт и шкала */
    --font: 'Geologica', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    --step-small: clamp(0.8125rem, 0.79rem + 0.1vw, 0.875rem);
    --step-body: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
    --step-lead: clamp(1.25rem, 1.1rem + 0.7vw, 1.625rem);
    --step-head: clamp(2rem, 1.3rem + 3.2vw, 4rem);
    --step-display: clamp(3rem, 1rem + 8.5vw, 9rem);

    /* отступы и сетка */
    --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
    --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px; --s-11: 160px;
    --margin: 16px;
    --container: 1280px;
    --gap: 16px;
    --header-h: 56px;
    --bar-h: 64px;
    --section-y: var(--s-8);

    /* движение */
    --ease-out: cubic-bezier(.2, .7, .2, 1);
    --ease-sheet: cubic-bezier(.32, .72, 0, 1);
    --dur-fast: 160ms;
    --dur: 240ms;
    --dur-ui-max: 300ms;

    /* ---- старые имена → новые токены ---- */
    --home-bg: var(--bg);           --home-bg-soft: var(--surface);
    --home-blue: var(--accent);     --home-blue-light: var(--accent);
    --home-navy: var(--ink);        --home-ink: var(--ink);   --home-deep: var(--ink);
    --home-text: var(--ink);        --home-muted: var(--muted);
    --home-border: var(--surface-2); --home-line: var(--line);
    --home-star: var(--sun);        --home-sale: var(--ink);  --home-wa: var(--wa);
    --home-gradient: var(--accent); --ocean: var(--sea);
    --home-shadow: none; --home-shadow-hover: none; --glow: none; --grain: none;
    --r-sm: 0; --r: 0; --r-lg: 0;
    --home-radius: 0; --home-radius-sm: 0;
    --c-sharm: var(--accent); --c-hurghada: var(--accent); --c-phuket: var(--accent); --c-vietnam: var(--accent);
    --home-container: var(--container);
    --home-gutter: var(--margin);
    --home-font: var(--font);
    --font-display: var(--font);
    --spring: var(--ease-sheet);
    --ios-fill: var(--surface);
    --ios-fill-2: var(--surface);
    --ios-sep: var(--surface-2);
    --glass: var(--bg);
    --glass-dark: var(--ink);
    --glass-border: transparent;
    --glass-blur: none;
    --glass-shadow: none;
}
@media (min-width: 768px)  { :root { --margin: 24px; --gap: 24px; --section-y: var(--s-9); } }
@media (min-width: 1024px) { :root { --margin: 40px; --gap: 24px; --header-h: 72px; --section-y: var(--s-10); } }
[dir="rtl"] {
    --font: 'IBM Plex Sans Arabic', 'Geologica', Tahoma, sans-serif;
    --home-font: var(--font);
    --font-display: var(--font);
}
