/* Customer frontend only. 20261026-responsive1. No business or language state changes. */
:root { --luyo-content-width: 1120px; }
html { min-width: 0; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { min-width: 0; }
body > main, body > .page, body > .app { box-sizing: border-box; min-width: 0; }
body > .travel-page, body > .catalog-page, body > .hotel-app,
body > .vip-page, body > .saved-page, body > main.page,
body > main.app, body > div.page, body > div.app,
body > .guides-page, body > .notice-page, body > .trust-page, body > .safety-page {
  width: min(100%, var(--luyo-content-width)) !important;
  max-width: var(--luyo-content-width) !important;
  margin-inline: auto;
}
html body.app-shell {
  --m-app-width: 1120px;
  --m-header: clamp(80px, 25vw, 280px);
  --m-tabbar: 88px;
  padding-top: 0 !important;
}
html body.app-shell #header { position: relative !important; inset: auto !important; width: 100% !important; }
html body.app-shell #header .navs {
  left: 50% !important;
  transform: translateX(-50%);
  width: min(100%, var(--m-app-width)) !important;
}
html body.app-shell #header .navs ul { width: 100% !important; max-width: none !important; }
html body.app-shell #header .navs li a { white-space: normal; overflow-wrap: anywhere; }
html body.app-shell #luyo-nav-status { max-width: min(100%, var(--m-app-width)); }
/* Keep horizontal galleries scrollable; do not hide document overflow to mask defects. */
.travel-page img, .catalog-page img, .hotel-app img { max-width: 100%; }
.travel-page .travel-section, .travel-page .section-head, .catalog-toolbar,
.travel-page .travel-section-head, .luyo-wheel .topbar { min-width: 0; }
.travel-page input, .travel-page select, .travel-page textarea,
.catalog-page input, .catalog-page select, .hotel-app input, .hotel-app select { min-width: 0; }
.profile-app .user-copy, .profile-app .asset-card { min-width: 0; }
.profile-app #profile-name { overflow-wrap: anywhere; }
.wallet-page .wallet-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wallet-page .wallet-action { min-width: 0; overflow-wrap: anywhere; }
.wallet-page .wallet-action .wallet-icon { flex-shrink: 0; }
.home-page .quick-card strong { white-space: normal; overflow-wrap: anywhere; line-height: 1.4; }
.home-page .quick-card:nth-child(1) { --quick-color: #1676cf; }
.home-page .quick-card:nth-child(2) { --quick-color: #b9630c; }
.home-page .quick-card:nth-child(3) { --quick-color: #087e9a; }
.home-page .quick-card:nth-child(4) { --quick-color: #7751c7; }
.home-page .quick-card:nth-child(5) { --quick-color: #16848b; }
.home-page .quick-card:nth-child(6) { --quick-color: #278552; }
.home-page .quick-card:nth-child(7) { --quick-color: #be4964; }
.home-page .quick-card:nth-child(8) { --quick-color: #4e64ba; }
.home-page .quick-card .quick-icon {
  background: var(--quick-color) !important; color: #fff !important;
  box-shadow: 0 5px 12px color-mix(in srgb, var(--quick-color) 24%, transparent) !important;
}
.home-page .quick-icon .main, .home-page .quick-icon .accent { fill: #fff !important; stroke: #fff !important; }
.hotel-app .hotel-toolbar h1, .hotel-app .card-bottom > *,
.catalog-page .product-bottom > *, .catalog-page .travel-product-bottom > * { min-width: 0; overflow-wrap: anywhere; }
.hotel-app .chip { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.catalog-tour .tour-theme-label { overflow-wrap: anywhere; -webkit-line-clamp: unset; }
.catalog-page .catalog-toolbar, .hotel-app .hotel-toolbar {
  background: linear-gradient(110deg, #edf9fa, #f4f3fc); border-bottom-color: #d6e9ed;
}
.hotel-app .hotel-toolbar { margin-inline: 0; padding-inline: 16px; }
.hotel-app .hotel-card { box-shadow: 0 5px 18px #17334b09; }
body > main.page .bar-inner, body > main.app .bar-inner,
.bar > .bar-inner, body.catalog-travel .travel-bar-inner { width: min(100%, 1088px); max-width: 1088px; }
.notice-page > .page-head { width: auto; max-width: none; margin-inline: -16px; }
body #app .news-container .btn-container {
  width: calc(100% - 32px) !important; max-width: 1088px; min-width: 0;
  height: auto !important; gap: 12px; overflow-wrap: anywhere;
}

@media (min-width: 600px) {
  .home-page .home-hero, .home-page .hero-hit { min-height: 320px; }
  .home-page .hero-hit { padding-inline: 28px; }
  .home-page .hero-title { max-width: 580px; font-size: 36px; }
  .home-page .hero-copy { max-width: 580px; font-size: 16px; }
  .home-page .quick-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .home-page .dest-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: 220px; }
  .home-page .dest-card:first-child { grid-row: auto; }
  .home-page .hotel-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-page .guide-card { flex-basis: 300px; height: 190px; }
  .catalog-page .product-list, .catalog-page .travel-products,
  .hotel-app .hotel-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .guides-page .guide-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-page .product-list > *, .catalog-page .travel-products > *,
  .hotel-app .hotel-list > * { min-width: 0; }
  .catalog-page .field-grid, .catalog-page .travel-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-tour .travel-categories.tour-theme-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .catalog-travel .travel-gallery-track figure { aspect-ratio: 2; }
  .catalog-page .photo-gallery img { height: 360px; }
  body.catalog-travel .travel-featured-row .travel-product { flex-basis: 320px; }
  .hotel-app .hotel-card > img { height: auto; aspect-ratio: 16 / 10; }
  .hotel-app .gallery > img { height: clamp(300px, 40vw, 480px); }
  .profile-app .profile-hero { padding-inline: 28px; }
  .profile-app .asset-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .profile-app .asset-wide { grid-column: auto; }
  .profile-app .asset-wide .asset-row { min-height: 100%; align-items: center; }
  .profile-app .profile-content { padding-inline: 28px; }
  .orders-page .order-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .orders-page .order-card { min-width: 0; margin-bottom: 0; }
  .luyo-wheel .page { max-width: 800px !important; }
  .luyo-wheel .wheel-grid { grid-template-rows: repeat(3, 136px); }
  .luyo-wheel .prize-cell img { width: 76px; height: 76px; }
  .luyo-wheel .prize-name { font-size: 13px; min-height: 36px; }
}
@media (min-width: 900px) {
  .home-page .home-hero, .home-page .hero-hit { min-height: 380px; }
  .home-page .hotel-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .catalog-page .product-list, .catalog-page .travel-products,
  .hotel-app .hotel-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .catalog-page .travel-filter-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .catalog-page .travel-filter-grid .field:first-child { grid-column: auto; }
  .hotel-app .search-card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; }
  .hotel-app .search-card > :is(fieldset:first-child, #cities-group, #search-selection, .keyword-field) { grid-column: 1 / -1; }
  .catalog-tour .travel-categories.tour-theme-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .catalog-tour .catalog-page #travel-content > article { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .catalog-tour .catalog-page #travel-content > article > :is(.tour-hero, .tour-facts, .travel-detail-intro, .tour-story) { grid-column: 1 / -1; }
  .catalog-tour .catalog-page #travel-content > article > * { min-width: 0; }
  .profile-app .profile-content { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; align-items: start; }
  .profile-app .profile-content > .wheel-banner,
  .profile-app .profile-content > .benefit-center { grid-column: 1 / -1; }
  .profile-app .profile-content > .profile-section { min-width: 0; }
  .profile-app .profile-content > .profile-section:has(#orders-heading) { grid-column: 1 / -1; }
  .profile-app .profile-content > .profile-section:has(#services-heading) { grid-column: 1 / -1; }
  .profile-app .profile-section:has(#services-heading) { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); column-gap: 28px; }
  .profile-app .profile-section:has(#services-heading) > .section-head { grid-column: 1 / -1; }
}
@media (max-width: 599px) {
  body > .travel-page, body > .catalog-page, body > .hotel-app,
  body > .vip-page, body > .saved-page, body > main.page,
  body > main.app, body > div.page, body > div.app { width: 100% !important; }
  .travel-page .travel-section-head h2, .catalog-toolbar h1 { min-width: 0; overflow-wrap: anywhere; }
  .travel-page .travel-more, .section-head > button { flex-shrink: 0; }
  .profile-app .asset-value { overflow-wrap: anywhere; }
  .order-main .price { flex-shrink: 0; max-width: 45%; overflow-wrap: anywhere; }
}
@media (max-width: 359px) {
  .wallet-page .wallet-actions { grid-template-columns: minmax(0, 1fr); }
  .home-page .home-search { grid-template-columns: 18px minmax(0,1fr) 50px 44px; gap: 4px; padding-left: 8px; }
  .home-page .home-search button { padding-inline: 6px; }
  .home-page .home-search input { font-size: 16px; }
  .luyo-wheel .topbar { height: auto; min-height: 56px; gap: 6px; }
  .luyo-wheel .topbar h1 { flex: 1; min-width: 0; font-size: 15px; }
  .luyo-wheel .board-heading { flex-wrap: wrap; }
  .luyo-wheel .chance-row { flex-wrap: wrap; }
  .luyo-wheel .draw-center strong { font-size: 17px; }
}
