/* base.css — общие стили GOSTI: шрифты, сброс, шапка/меню/модалка/футер,
   аккордеоны (day-panel), карусели (auto-scroll-track) — всё, что
   используется на каждой странице сайта. Перенесено из единого
   <style> блока прежнего прототипа V_Gory_GO.dc.html без изменений
   визуального результата. Постранично-специфичные стили (хиро главной,
   хиро тура, сетка «день за днём», карточки жилья и т.п.) — в
   home.css / tour.css. */

@font-face{font-family:'OKS Free';src:url('/fonts/oks-free.otf') format('opentype');font-display:swap}
@font-face{font-family:'DiTulum';src:url('/fonts/DiTulum3.otf') format('opentype');font-display:swap}
html{scroll-behavior:smooth}
body{margin:0;background:#F7F1E8;font-family:'Inter',sans-serif}
a{color:#E37822;text-decoration:none}
a:hover{color:#C7531C}
::selection{background:#F3AF54;color:#2A2520}
button{font-family:'Inter',sans-serif}

.full-photo{background-color:#EFE6D6}
.hero-photo{background-color:#2A2520;background-size:cover !important}
.photo-portrait{aspect-ratio:3/4;position:relative;overflow:hidden}
.photo-portrait-tall{aspect-ratio:2/3;position:relative;overflow:hidden}

/* Карточки-обложки: раньше CSS background-image, теперь настоящий
   lazy-loaded <img> (perf-требование из задачи рефакторинга) —
   абсолютно заполняет родителя, градиент-оверлей рисуется поверх. */
.card-cover-img{position:absolute;inset:0;width:100%;height:100%;display:block}

.auto-scroll-track{display:flex;gap:20px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.auto-scroll-track::-webkit-scrollbar{display:none}

.nav-mobile-only{display:none !important}
.mobile-menu-toggle{align-items:center;justify-content:center}
@media(max-width:640px){
  .nav-desktop-only{display:none !important}
  .nav-mobile-only{display:inline-block !important}
  .nav-mobile-only.mobile-menu-toggle{display:inline-flex !important}
}
@media(max-width:640px){
  .header-bar{gap:8px}
  .dest-back-arrow{display:none !important}
  .brand-group{gap:8px}
  .nav-group{gap:10px}
}

.day-panel{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows 0.35s cubic-bezier(0.4,0,0.2,1),opacity 0.25s ease,visibility 0s linear 0.35s}
.day-panel-open{grid-template-rows:1fr;opacity:1;visibility:visible;transition-delay:0s}
.day-panel-inner{min-height:0;overflow:hidden}
@media(prefers-reduced-motion:reduce){.day-panel{transition:none}}

.brand-mark-circle{position:relative;width:44px;height:44px;border-radius:50%;background:#E37822;overflow:hidden;flex:none;display:inline-flex;align-items:center;justify-content:center}
.brand-mark-circle .brand-mark-img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}
.brand-mark-circle.brand-mark-circle-lg{width:46px;height:46px}
@media(max-width:640px){.brand-mark-circle{width:38px;height:38px}}
.brand-wordmark{font-family:'OKS Free',serif;font-size:clamp(20px,3.4vw,25px);line-height:1;color:#FBF4E7;letter-spacing:0.3px;white-space:nowrap;flex:none;position:relative;z-index:1}
@media(max-width:640px){.brand-wordmark{font-size:19px}}
.nav-link{transition:opacity 0.2s ease}
.nav-link:hover{opacity:0.72}
.header-bar{position:relative}
.header-bar::before{content:'';position:absolute;inset:0;border-radius:inherit;background-image:url(/media/brand/gosti-pattern-strip.webp);background-repeat:repeat-x;background-position:left center;background-size:auto 68%;opacity:0.24;pointer-events:none;z-index:0}
@media(max-width:640px){.header-bar::before{background-size:auto 55%}}

/* Модалка заявки / мобильное меню: main.js снимает атрибут [hidden] и
   сам выставляет display:flex при открытии (а не CSS-классом) — так
   стандартное поведение [hidden]{display:none} из UA-стиля не
   перебивается собственным правилом автора. */