/**
 * Мобильная вёрстка: один столбец, без горизонтального скролла страницы.
 */

/* Полноширинные баннеры — см. base.html (.layout-full-bleed, 100vw) */

@media (max-width: 720px) {
  :root {
    --story-preview-max-height: 33vh;
  }

  html {
    overflow-x: clip;
  }

  body {
    overflow-x: clip;
  }

  /* Контентные картинки — не шире экрана; превью сторис — отдельные правила ниже */
  .content-wrap img:not([class]):not(.story-strip-preview-media),
  .card-body img,
  article p img,
  .thread-chat-list img {
    max-width: 100%;
    height: auto;
  }

  video:not(.story-strip-preview-video):not(#story-video),
  iframe,
  table {
    max-width: 100%;
  }

  .container {
    padding-left: var(--container-pad);
    padding-right: var(--container-pad);
  }

  /* Сетки каталога и карточек — один столбец */
  .grid,
  .footer-grid,
  .detail-page,
  .guide-tour-grid,
  .guide-tour-small-grid,
  .guide-adventures-grid,
  .my-work-grid,
  .owner-stats-grid,
  .group-wall-polls-grid,
  .sd-detail-layout,
  .sd-amenity-grid,
  .tb-amenity-grid,
  .planning-top-grid,
  article.detail-page.sd-detail-layout {
    grid-template-columns: 1fr !important;
  }

  article.detail-page.sd-detail-layout {
    padding-left: 0 !important;
    padding-right: 0 !important;
    gap: 16px !important;
  }

  .planning-sidebar,
  [style*="min-width:260px"],
  [style*="min-width: 260px"] {
    min-width: 0 !important;
    width: 100% !important;
  }

  .profile-catalog-actions,
  .profile-catalog-bottom .partners-grid,
  .photo-gallery-grid,
  .role-video-strip {
    grid-template-columns: 1fr !important;
  }

  /* Ленты карточек — вертикально; полосы сторис — горизонтальная прокрутка */
  .my-adventures-row,
  .my-domiki-row:not(.my-domiki-row--grid8),
  .my-work-grid .my-adventures-row,
  .pub-profile-work-track,
  .pub-profile-work-row {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    overflow-x: visible !important;
    align-items: stretch !important;
  }

  .my-adventures-card-wrap,
  .my-adventures-card,
  .my-domiki-card,
  .pub-profile-work-card,
  .venue-detail-work-grid .pub-profile-work-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* Профиль: квадраты авантюр/групп — фиксированный размер, горизонтальная лента */
  #my-adventures-strip .my-adventures-row,
  #my-groups-strip .my-adventures-row,
  .my-work-grid .my-adventures-row {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    align-items: flex-start !important;
  }
  #my-adventures-strip .my-adventures-card-wrap,
  #my-groups-strip .my-adventures-card-wrap,
  #my-adventures-strip .my-adventures-card,
  #my-groups-strip .my-adventures-card,
  .my-work-grid .my-adventures-card-wrap,
  .my-work-grid .my-adventures-card {
    width: 128px !important;
    min-width: 128px !important;
    max-width: 128px !important;
  }

  /* Превью сторис на странице — не выше 1/3 экрана */
  .stories-grid,
  .tb-stories-track,
  .group-stories-track,
  [data-stories-track] {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    align-items: flex-end !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
  }

  .stories-section .story-item,
  .story-item[data-story-id],
  .story-item--create-placeholder,
  .profile-moment-card,
  .adventure-story-card,
  .public-story-card,
  .group-story-card,
  .tb-story-card {
    flex: 0 0 auto !important;
    width: calc(var(--story-preview-max-height) * 9 / 16) !important;
    min-width: calc(var(--story-preview-max-height) * 9 / 16) !important;
    max-width: min(42vw, calc(var(--story-preview-max-height) * 9 / 16)) !important;
    max-height: var(--story-preview-max-height) !important;
    height: var(--story-preview-max-height) !important;
    min-height: 0 !important;
    aspect-ratio: 9 / 16 !important;
    overflow: hidden;
    scroll-snap-align: start;
  }

  .tb-story-card {
    aspect-ratio: auto !important;
    height: auto !important;
    max-height: var(--story-preview-max-height) !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .tb-story-card img,
  .tb-story-card video {
    width: 100% !important;
    height: auto !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: calc(var(--story-preview-max-height) - 1.75rem) !important;
    aspect-ratio: 9 / 16 !important;
    object-fit: cover !important;
    object-position: center;
    display: block;
  }

  .tb-story-meta {
    flex-shrink: 0;
    font-size: 10px !important;
    line-height: 1.15 !important;
    padding: 4px !important;
  }

  .group-story-card-meta {
    font-size: 9px !important;
    padding: 10px 5px 5px !important;
  }

  .stories-section .story-item video,
  .stories-section .story-item img,
  .story-item[data-story-id] video,
  .story-item[data-story-id] img,
  .group-story-card img,
  .group-story-card video,
  .story-strip-preview-media {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: 100% !important;
    object-fit: cover !important;
    object-position: center;
    display: block;
  }

  .story-preview {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden;
  }

  .story-preview-hit {
    position: absolute !important;
    inset: 0 !important;
    z-index: 1;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    appearance: none;
    -webkit-appearance: none;
  }

  .story-preview-hit .story-strip-preview-media,
  .story-preview-hit > video,
  .story-preview-hit .story-overlay {
    pointer-events: none;
  }

  .story-preview--image .story-strip-preview-media {
    opacity: 0 !important;
    visibility: hidden !important;
  }

  .story-preview--video .story-strip-preview-media {
    opacity: 0 !important;
    visibility: hidden !important;
  }

  .story-preview--image,
  .story-preview--video {
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-color: #cbd5e1;
  }

  .story-strip-preview-media {
    position: absolute !important;
    inset: 0 !important;
    object-fit: cover !important;
    object-position: center;
  }

  .story-strip-preview-video--hidden {
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    pointer-events: none !important;
  }

  .story-strip-preview-poster[hidden] {
    display: none !important;
  }

  .story-preview--video:not(.story-preview--ready) .story-preview-hit::after {
    content: "▶";
    position: absolute;
    left: 50%;
    top: 44%;
    transform: translate(-50%, -50%);
    z-index: 2;
    font-size: 24px;
    line-height: 1;
    color: rgba(255, 255, 255, 0.95);
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
    pointer-events: none;
  }

  .story-preview .story-overlay {
    z-index: 3;
  }

  .story-media-container video,
  .story-media-container img,
  #story-video,
  #story-image {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center;
    display: block;
  }

  /* Минимальные ширины в героях и формах */
  .pub-hero-text,
  .pub-hero-top,
  .role-hero-top {
    min-width: 0 !important;
  }

  .pub-hero-text {
    flex: 1 1 100%;
  }

  /* Заголовок «Воспоминания» — только десктоп */
  .stories-header,
  .profile-moments-head > h3,
  .adventure-stories-strip-wrap-inner > .home-section-title {
    display: none !important;
  }

  .profile-moments-head {
    margin-bottom: 0 !important;
    gap: 6px !important;
  }

  /* Минимальный зазор между баннером и сторисами */
  .hero-banner,
  .pub-hero,
  .role-hero,
  .adventure-cover-header,
  .adventure-hero-placeholder {
    margin-bottom: 0 !important;
  }

  body.hero-page main {
    padding-top: 0 !important;
  }

  .container.content-wrap > .stories-section:first-child,
  .stories-section.home-main-section {
    margin-top: 0 !important;
    margin-bottom: 10px !important;
    padding-top: 2px !important;
  }

  .page-bleed-breakout {
    margin-bottom: 0 !important;
  }

  body.hero-page .dashboard-role-content.row {
    --bs-gutter-y: 0;
    margin-top: 0 !important;
  }

  body.hero-page .container-fluid.pt-0 {
    padding-top: 0 !important;
  }

  .profile-moments-strip--has-stories {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    padding: 2px var(--container-pad, 12px) 6px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  .profile-moments-strip--has-stories .profile-moments-head,
  .profile-moments-strip--show-create .profile-moments-head {
    display: none !important;
  }

  .profile-moments-strip--has-stories .stories-section,
  .profile-moments-strip--has-stories .stories-carousel-wrap,
  .profile-moments-strip--show-create .stories-section,
  .profile-moments-strip--show-create .stories-carousel-wrap {
    margin: 0 !important;
    padding-top: 0 !important;
  }

  .profile-moments-strip--show-create .stories-carousel-nav {
    display: none !important;
  }

  .story-item--create-placeholder,
  .story-item--create-placeholder.story-item {
    pointer-events: auto !important;
  }

  .story-item--create-placeholder * {
    pointer-events: none !important;
  }

  .story-item--uploading {
    pointer-events: none !important;
    position: relative;
  }

  .profile-moments-add-btn--in-head {
    display: none !important;
  }

  .profile-moments-add-btn--on-story {
    display: inline-flex !important;
  }

  .profile-moments-strip .story-delete-btn,
  .profile-moments-strip [data-story-delete] {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    top: 4px !important;
    right: 4px !important;
    z-index: 12 !important;
    font-size: 18px !important;
  }

  .profile-story-with-add {
    width: calc(var(--story-preview-max-height, 33vh) * 9 / 16) !important;
    min-width: calc(var(--story-preview-max-height, 33vh) * 9 / 16) !important;
    max-width: min(42vw, calc(var(--story-preview-max-height, 33vh) * 9 / 16)) !important;
    max-height: var(--story-preview-max-height, 33vh) !important;
    height: var(--story-preview-max-height, 33vh) !important;
  }

  .profile-moments-strip,
  .public-stories-strip {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    padding: 4px var(--container-pad, 12px) 6px !important;
  }

  .public-stories-strip {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .adventure-stories-strip-wrap {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
  }

  .adventure-stories-strip-wrap-inner {
    margin-bottom: 4px !important;
    gap: 6px !important;
  }

  /* Истории на главной: без боковых отступов карусели */
  .stories-carousel-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Малая сетка авантюр на главной — один столбец */
  .adv-card-small-grid {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
  }

  .business-under-hero-row {
    padding-left: 0;
    padding-right: 0;
  }

  .container-fluid.px-3,
  .container-fluid.px-4 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }


  .row > [class*="col-"] {
    max-width: 100%;
  }

  .ui-kartoteka--panels .ui-kartoteka-tabs,
  .ui-kartoteka--stacked .ui-kartoteka-tabs {
    flex-wrap: wrap !important;
  }

  .adventure-detail .container-fluid {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Обложки: фиксированное соотношение сторон, без сплющивания */
  .card-img,
  .card-img--cover,
  .card-img--search-cover,
  .card-img--link {
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
  }

  .card-img img,
  .card-img--cover img,
  .card-img--search-cover img,
  .card-img--link img,
  .miravi-carousel--card .miravi-carousel__slide img,
  .pub-profile-work-card img,
  .my-adventures-card img,
  .my-domiki-card-cover img,
  .adv-card-small img,
  .adv-card-large img,
  .pub-prof-album-cover img,
  .profile-catalog-bottom .adv-media,
  .home-news-main-visual-square img,
  .home-news-sub-media-square img,
  .adventure-cover-header img,
  .pub-hero-media {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center;
    display: block;
  }

  .pub-profile-work-card,
  .my-adventures-card,
  .adv-card-small {
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .my-domiki-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
  }

  .my-domiki-card-cover,
  .my-domiki-card-cover--singledom {
    aspect-ratio: 16 / 10 !important;
    width: 100%;
  }

  .my-domiki-card-cover--singledom {
    aspect-ratio: 1 / 1 !important;
  }

  .my-domiki-row--grid8 {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
    overflow-x: visible !important;
    flex-direction: unset !important;
    flex-wrap: unset !important;
    align-items: stretch !important;
  }

  .my-domiki-row--grid8 .my-domiki-card-wrap,
  .my-domiki-row--grid8 .my-domiki-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  .my-domiki-card-title {
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    display: block !important;
    white-space: normal !important;
    word-break: break-word;
  }

  .profile-catalog-bottom .partner-card {
    min-height: 0 !important;
    width: 100% !important;
    aspect-ratio: 4 / 5;
    height: auto !important;
  }

  .pub-prof-album-cover {
    aspect-ratio: 4 / 3;
    width: 100%;
  }

  /* Каталог / поиск: тап по названию бизнеса на мобильных */
  .card--catalog-business .card-title--business-link {
    color: inherit;
    text-decoration: none;
  }
  .card--catalog-business .card-title--business-link:active {
    opacity: 0.82;
  }

  /* Текст в карточках: переносы, без обрезки заголовков и описаний */
  .card .card-title,
  .card .card-body,
  .card .card-body p,
  .card .card-body .muted,
  .card .meta-row,
  .card .meta-row span {
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
    display: block !important;
    white-space: normal !important;
    text-overflow: clip !important;
    word-break: break-word;
    overflow-wrap: anywhere;
    hyphens: auto;
  }

  .card .meta-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .pub-profile-work-card-title,
  .my-adventures-card-title,
  .pub-prof-feed-title,
  .pub-prof-feed-preview,
  .profile-feed-adv-chip-name {
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
    display: block !important;
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  .profile-feed-thumb,
  .adventure-post-thumb {
    max-height: none !important;
  }

  .pub-hero-title {
    font-size: 16px !important;
    margin-bottom: 4px !important;
    line-height: 1.08 !important;
  }

  .pub-hero-meta {
    font-size: 11px !important;
    line-height: 1.2 !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    overflow: hidden !important;
  }

  .pub-hero-cta-row {
    gap: 0 !important;
    padding-top: 4px !important;
  }

  .pub-hero-cta-title {
    font-size: clamp(7px, 2.2vw, 9px) !important;
    line-height: 1.05 !important;
    white-space: normal !important;
    word-break: break-word;
  }

  .pub-hero-cta-subtitle {
    display: none !important;
  }

  /* Главная и событие: баннерные CTA (.cta-row / .cta-link) */
  .hero-banner .hero-overlay,
  .pub-hero--event-page .pub-hero-copy {
    padding-bottom: 6px !important;
    gap: 0 !important;
  }

  .hero-banner .hero-copy,
  .pub-hero--event-page .pub-hero-role-copy {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    flex: 0 0 auto !important;
    max-width: 100% !important;
  }

  .hero-banner .cta-row,
  .pub-hero--event-page .cta-row {
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 6px 0 0 !important;
    padding-top: 0 !important;
    flex: 0 0 auto !important;
    flex-wrap: nowrap !important;
  }

  .hero-banner .cta-link,
  .pub-hero--event-page .cta-link,
  .pub-hero--event-page .cta-link--static,
  .pub-hero--event-page button.cta-link {
    padding: 1px 0 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
    display: block !important;
    text-decoration: none !important;
    color: #fff !important;
    text-align: left !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  .hero-banner .cta-link::before,
  .pub-hero--event-page .cta-link::before {
    left: 1px !important;
    right: 30% !important;
  }

  .hero-banner .cta-link-title,
  .pub-hero--event-page .cta-link-title {
    font-size: clamp(9px, 2.8vw, 11px) !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.02em;
    word-break: break-word;
    text-decoration: none !important;
    color: #fff !important;
    font-family: inherit !important;
  }

  .hero-banner .cta-link-subtitle,
  .pub-hero--event-page .cta-link-subtitle {
    display: none !important;
  }

  .pub-hero--event-page .pub-hero-event-hashtags {
    font-size: 11px !important;
    line-height: 1.15 !important;
    margin-top: 2px !important;
    -webkit-line-clamp: 1 !important;
    line-clamp: 1 !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
  }

  /* Главная: отступ под двухрядную шапку */
  .hero-banner .hero-overlay {
    padding-top: calc(var(--header-clearance, 118px) + env(safe-area-inset-top, 0px)) !important;
  }

  .hero-banner .hero-overlay h1 {
    font-size: 16px !important;
    line-height: 1.06 !important;
    margin: 0 0 2px !important;
  }

  .hero-banner .hero-overlay p {
    font-size: 11px !important;
    line-height: 1.15 !important;
    margin: 0 !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    overflow: hidden !important;
  }

  body.hero-page .home-main-section {
    margin-bottom: 10px !important;
  }

  body.hero-page .home-section-head {
    margin-bottom: 4px !important;
    gap: 4px !important;
    align-items: center !important;
  }

  body.hero-page .home-section-title {
    font-size: 17px !important;
    line-height: 1.06 !important;
    margin: 0 !important;
  }

  body.hero-page .home-section-more {
    font-size: 11px !important;
    line-height: 1.1 !important;
    padding: 0 !important;
    min-height: 0 !important;
  }

  body.hero-page .home-news-section {
    padding: 8px 10px !important;
    border-radius: 12px !important;
  }

  body.hero-page .home-news-section > h2 {
    margin: 0 0 4px !important;
  }

  body.hero-page .hero-banner {
    background-size: cover !important;
    background-position: center center !important;
  }

  body.hero-page .home-news-main {
    margin-bottom: 8px !important;
  }

  body.hero-page .home-news-title-row,
  body.hero-page .home-news-sub-title-row {
    margin-bottom: 0 !important;
    gap: 4px !important;
  }

  body.hero-page .home-news-main-title,
  body.hero-page .home-news-sub-title {
    line-height: 1.1 !important;
    margin: 0 !important;
  }

  body.hero-page .home-news-main-meta,
  body.hero-page .home-news-sub-meta {
    margin-top: 0 !important;
    padding-top: 0 !important;
    gap: 4px !important;
  }

  body.hero-page .home-news-swipe-hint {
    margin-top: 4px !important;
  }

  body.hero-page .home-news-sub-page {
    gap: 6px !important;
  }

  body.hero-page .adventure-grid {
    display: block !important;
    grid-template-columns: none !important;
    margin-bottom: 14px !important;
    gap: 0 !important;
  }

  body.hero-page .adventure-grid__desktop-only {
    display: none !important;
  }

  body.hero-page .adventure-grid__mobile-only {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100%;
  }

  body.hero-page .adventure-grid-mobile-duo .adv-card-small-grid {
    gap: 6px !important;
    height: auto !important;
    grid-column: auto !important;
    grid-row: auto !important;
    order: unset !important;
  }

  body.hero-page .adventure-grid-mobile-duo--single {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.hero-page .adv-overlay {
    padding: 8px 10px !important;
  }

  body.hero-page .adv-title {
    margin-bottom: 2px !important;
    line-height: 1.1 !important;
  }

  body.hero-page .adv-desc,
  body.hero-page .adv-desc-small {
    line-height: 1.15 !important;
  }

  body.hero-page .adv-meta-line {
    margin-bottom: 1px !important;
  }

  body.hero-page .second-banner {
    margin-top: 4px !important;
    margin-bottom: 12px !important;
  }

  body.hero-page .stories-section.home-main-section {
    margin-bottom: 8px !important;
  }

  /* Карточки ленты — полный текст; баннер авантюры — clamp в base.html */
  .adv-overlay .adv-desc,
  .adv-overlay .adv-desc-small {
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
    overflow: visible !important;
    display: block !important;
    max-height: none !important;
  }

  .adv-overlay .adv-title,
  .adv-overlay .adv-desc,
  .adv-overlay .adv-desc-small,
  .adv-overlay .adv-meta-line {
    overflow: visible !important;
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  .profile-feed-grid {
    gap: 12px !important;
  }

  .profile-feed-headrow {
    flex-wrap: wrap !important;
  }

  .profile-feed-adv-chip {
    max-width: 100% !important;
    margin-left: 0 !important;
  }
}

@media (max-width: 480px) {
  .my-domiki-row--grid8 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .stories-section .story-item,
  .story-item[data-story-id] {
    flex: 0 0 auto !important;
    max-width: min(42vw, calc(var(--story-preview-max-height, 33vh) * 9 / 16)) !important;
  }
}