/* Sunshine Inn guest responsive polish - generated after full public file inspection */
:root{
  --sinn-guest-navy:#123C69;
  --sinn-guest-blue:#2563EB;
  --sinn-guest-sky:#38BDF8;
  --sinn-guest-bg:#F8FAFC;
  --sinn-guest-green:#0F6B4A;
  --sinn-guest-text:#111827;
  --sinn-guest-muted:#53657E;
  --sinn-guest-line:rgba(18,60,105,.14);
  --sinn-guest-shadow:0 18px 48px rgba(18,60,105,.12);
}

html,body{
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
}

body{
  color:var(--sinn-guest-text);
  background:var(--sinn-guest-bg);
}

img,video,canvas,svg,iframe{
  max-width:100%;
}

a,button,.btn,.nav-link,.mobile-menu-card,.room-card,.activity-card,.experience-card,.value-card{
  -webkit-tap-highlight-color:transparent;
}

.container,
.container-fluid{
  max-width:100%;
}

.row{
  min-width:0;
}

.row > [class*="col"]{
  min-width:0;
}

/* Public navbar: stable, readable, and centered on phones */
.premium-navbar{
  width:100%;
  max-width:100vw;
}

.premium-navbar .container-fluid{
  min-width:0;
}

.premium-navbar .navbar-brand,
.brand-text,
.user-name-short{
  min-width:0;
}

.premium-dropdown,
.premium-dropdown .dropdown-item,
.premium-dropdown .dropdown-item i,
.premium-dropdown .dropdown-item span{
  opacity:1 !important;
  visibility:visible !important;
}

.premium-dropdown .dropdown-item{
  color:var(--sinn-guest-navy) !important;
  background:#FFFFFF !important;
}

.premium-dropdown .dropdown-item:hover,
.premium-dropdown .dropdown-item:focus{
  color:#FFFFFF !important;
  background:var(--sinn-guest-blue) !important;
}

.premium-dropdown .dropdown-item.text-danger,
.premium-dropdown .dropdown-item.text-danger i,
.premium-dropdown .dropdown-item.text-danger span{
  color:#111827 !important;
}

.premium-dropdown .dropdown-item.text-danger:hover,
.premium-dropdown .dropdown-item.text-danger:focus,
.premium-dropdown .dropdown-item.text-danger:hover i,
.premium-dropdown .dropdown-item.text-danger:focus i,
.premium-dropdown .dropdown-item.text-danger:hover span,
.premium-dropdown .dropdown-item.text-danger:focus span{
  color:#FFFFFF !important;
  background:#111827 !important;
}

.mobile-landscape-menu{
  max-width:min(430px, calc(100vw - 20px)) !important;
}

.mobile-menu-card,
.mobile-action-btn,
.mobile-user-mini{
  color:var(--sinn-guest-navy) !important;
}

.mobile-menu-card:hover,
.mobile-menu-card:focus,
.mobile-menu-card.active{
  color:#FFFFFF !important;
  background:var(--sinn-guest-blue) !important;
}

.mobile-menu-card:hover .mobile-card-title,
.mobile-menu-card:focus .mobile-card-title,
.mobile-menu-card.active .mobile-card-title{
  color:#FFFFFF !important;
}

.mobile-menu-card:hover .mobile-card-icon,
.mobile-menu-card:focus .mobile-card-icon,
.mobile-menu-card.active .mobile-card-icon{
  color:var(--sinn-guest-blue) !important;
  background:#FFFFFF !important;
}

.mobile-user-mini,
.mobile-user-name,
.mobile-user-role{
  opacity:1 !important;
  visibility:visible !important;
}

.mobile-user-name{
  color:var(--sinn-guest-navy) !important;
}

.mobile-user-role{
  color:var(--sinn-guest-muted) !important;
}

/* Public section rhythm */
.section-padding,
.rooms-section,
.activities-section,
.about-section,
.bookings-page,
.profile-section{
  max-width:100vw;
}

.section-head,
.panel-header,
.booking-panel-header{
  min-width:0;
}

.section-title,
.rooms-title,
.activity-title,
.about-title,
.profile-hero-title,
.bookings-title{
  overflow-wrap:anywhere;
}

.section-text,
.rooms-subtitle,
.activity-subtitle,
.about-subtitle,
.profile-hero-subtitle,
.bookings-subtitle{
  overflow-wrap:anywhere;
}

/* Cards should not stretch past viewport */
.room-card,
.index-room-card,
.activity-card,
.about-card,
.value-card,
.experience-card,
.contact-card,
.booking-panel,
.profile-card,
.profile-form-card,
.login-card,
.register-card,
.premium-footer,
.premium-modal .modal-content{
  max-width:100%;
}

.room-desc,
.index-room-body p,
.activity-card p,
.about-card p,
.experience-body p,
.value-card p,
.modal-description,
.features-box li,
.payment-detail-box p,
.receipt-line-title span,
.table td,
.table th{
  overflow-wrap:anywhere;
  word-break:normal;
}

/* Room cards and highlighted rooms */
#roomsGrid,
#indexRoomsGrid{
  max-width:100%;
}

.room-card-body,
.index-room-body{
  min-width:0;
}

.room-footer,
.index-room-meta,
.index-room-highlight-row{
  min-width:0;
}

.btn-book,
.btn-premium,
.btn-modal-primary,
.btn-modal-outline,
.final-book-btn{
  white-space:normal;
  line-height:1.2;
}

/* Filter/search panels on public pages */
.room-filter-panel,
.index-room-filter-panel,
.panel-tools,
.booking-filter-row{
  max-width:100%;
}

.room-type-select,
.index-room-type-select,
.status-select,
.form-control,
.form-select{
  max-width:100%;
}

/* Tables: keep layout intact without page-wide overflow */
.table-wrap,
.booking-table-wrap,
.table-responsive,
.dataTables_wrapper{
  width:100%;
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

.table-wrap table,
.booking-table-wrap table{
  margin-bottom:0;
}

/* Modal behavior: fit viewport on every device */
.modal,
.modal-open{
  padding-right:0 !important;
}

.modal-dialog{
  max-width:min(100% - 20px, var(--bs-modal-width, 900px));
  margin-left:auto;
  margin-right:auto;
}

.modal-dialog-scrollable .modal-content{
  max-height:calc(100dvh - 24px);
}

.modal-dialog-scrollable .modal-body{
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}

.premium-modal .modal-body,
.premium-modal .modal-header,
.premium-modal .modal-footer{
  min-width:0;
}

.premium-modal .modal-footer{
  gap:10px;
  flex-wrap:wrap;
}

.premium-modal .modal-footer .btn,
.premium-modal .modal-footer a{
  min-width:150px;
}

/* Booking form: compact but readable across phone and tablet */
#roomModal.room-booking-only .modal-dialog{
  width:min(100vw - 16px, 960px) !important;
  max-width:min(100vw - 16px, 960px) !important;
}

#roomModal.room-booking-only .modal-content{
  max-height:calc(100dvh - 16px) !important;
  overflow:hidden !important;
}

#roomModal.room-booking-only .modal-body{
  max-height:calc(100dvh - 132px) !important;
  overflow-y:auto !important;
  overscroll-behavior:contain;
}

#bookingForm,
#bookingFormElement,
#bookingForm .row{
  min-width:0;
}

#bookingForm .form-label{
  color:var(--sinn-guest-navy) !important;
  font-weight:800;
}

#bookingForm .form-control,
#bookingForm .form-select{
  color:#111827 !important;
  background:#FFFFFF !important;
  border-color:rgba(18,60,105,.18) !important;
}

#bookingForm small,
#bookingForm .text-muted{
  color:#5D6F89 !important;
}

.booking-calendar-panel,
.payment-step-card,
.payment-method-grid,
.payment-summary-card,
.booking-receipt-card,
.payment-detail-box,
.payment-receipt-panel{
  max-width:100%;
  min-width:0;
}

.payment-method-grid{
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 160px), 1fr)) !important;
}

.payment-method-card{
  min-width:0;
}

.payment-card-qr-preview,
.payment-qr-img{
  max-width:180px;
  height:auto;
}

.receipt-line,
.payment-summary-total{
  gap:10px;
  min-width:0;
}

.receipt-line strong,
.payment-summary-total strong{
  white-space:normal;
  text-align:right;
}

/* House rules A4 modal: separated and stable */
.house-rules-dialog{
  width:min(100vw - 20px, 760px) !important;
  max-width:min(100vw - 20px, 760px) !important;
}

.house-rules-modal-content{
  max-height:calc(100dvh - 20px) !important;
  overflow:hidden !important;
  border-radius:22px !important;
}

.house-rules-paper{
  width:min(100%, 720px) !important;
  max-width:100% !important;
  max-height:calc(100dvh - 20px) !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch;
}

.house-rules-list,
.house-rules-list li,
.house-rules-greeting,
.house-rules-note{
  overflow-wrap:anywhere;
}

.house-rules-actions{
  position:sticky;
  bottom:0;
  background:#FFFFFF;
  padding-top:12px;
  box-shadow:0 -10px 22px rgba(255,255,255,.90);
}

/* Footer alignment */
.premium-footer-inner,
.footer-contact-list,
.footer-contact-item{
  min-width:0;
}

.footer-contact-item > span:not(.footer-contact-icon),
.footer-contact-item > a{
  overflow-wrap:anywhere;
}

/* Authentication pages */
.login-page,
.register-page,
.login-shell,
.register-shell,
.login-form-area,
.register-form-area{
  max-width:100vw;
  min-width:0;
}

.login-card,
.register-card{
  width:min(100%, 450px) !important;
}

.login-card .form-control,
.register-card .form-control{
  color:#111827 !important;
  background:#FFFFFF !important;
}

/* Medium devices */
@media (max-width:991.98px){
  .section-padding,
  .rooms-section,
  .activities-section{
    padding-top:58px !important;
    padding-bottom:64px !important;
  }

  .rooms-hero,
  .activity-hero,
  .about-hero,
  .profile-hero{
    min-height:auto !important;
  }

  .section-head{
    align-items:flex-start !important;
    text-align:left;
    gap:16px;
  }

  .premium-navbar .navbar-brand{
    max-width:calc(100vw - 78px);
  }

  .desktop-navbar-content{
    display:none !important;
  }

  .mobile-menu-btn{
    display:flex !important;
    flex:0 0 auto;
  }

  .mobile-landscape-menu{
    left:50% !important;
    right:auto !important;
    transform:translate(-50%, -12px) scale(.98) !important;
  }

  .mobile-landscape-menu.show{
    transform:translate(-50%, 0) scale(1) !important;
  }

  .mobile-menu-grid{
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:center !important;
    gap:5px !important;
    overflow:hidden !important;
  }

  .mobile-menu-card{
    flex:1 1 0 !important;
    min-width:0 !important;
    max-width:none !important;
    padding-left:3px !important;
    padding-right:3px !important;
  }

  .mobile-action-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  }

  .room-filter-panel,
  .index-room-filter-panel{
    display:block !important;
  }

  .room-filter-actions,
  .index-room-filter-actions{
    display:none !important;
  }

  .room-type-select,
  .index-room-type-select{
    display:block !important;
  }

  .contact-hero h1,
  .rooms-title,
  .activity-title,
  .about-title,
  .profile-hero-title,
  .bookings-title{
    font-size:clamp(2rem, 7vw, 3.5rem) !important;
  }

  .login-shell,
  .register-shell{
    display:block !important;
    min-height:auto !important;
    overflow:visible !important;
  }

  .login-visual,
  .register-visual{
    min-height:auto !important;
  }
}

/* Small devices */
@media (max-width:767.98px){
  .container{
    padding-left:14px !important;
    padding-right:14px !important;
  }

  .premium-navbar .container-fluid{
    padding-left:10px !important;
    padding-right:10px !important;
  }

  .brand-logo{
    width:46px !important;
    height:35px !important;
    min-width:46px !important;
  }

  .brand-text span:first-child{
    font-size:13px !important;
    max-width:112px !important;
  }

  .brand-text span:last-child{
    font-size:8px !important;
  }

  .mobile-landscape-menu{
    width:min(96vw, 420px) !important;
    max-width:min(96vw, 420px) !important;
    padding:9px !important;
    border-radius:20px !important;
  }

  .mobile-menu-title{
    font-size:12px !important;
  }

  .mobile-menu-subtitle{
    font-size:9px !important;
  }

  .mobile-menu-card{
    min-height:52px !important;
    border-radius:13px !important;
    gap:3px !important;
  }

  .mobile-card-icon{
    width:21px !important;
    height:21px !important;
    min-width:21px !important;
    border-radius:8px !important;
    font-size:10px !important;
  }

  .mobile-card-title{
    font-size:7px !important;
  }

  .mobile-action-grid{
    grid-template-columns:1fr !important;
  }

  .mobile-action-btn{
    min-height:38px !important;
  }

  .hero-section,
  .rooms-hero,
  .activity-hero,
  .about-hero,
  .profile-hero,
  .contact-hero{
    padding-top:42px !important;
    padding-bottom:58px !important;
  }

  .section-padding,
  .rooms-section,
  .activities-section{
    padding-top:42px !important;
    padding-bottom:50px !important;
  }

  .section-head,
  .row.align-items-end{
    text-align:center !important;
    justify-content:center !important;
  }

  .section-head > *,
  .row.align-items-end > *{
    text-align:center !important;
  }

  .section-text,
  .rooms-subtitle,
  .activity-subtitle,
  .about-subtitle,
  .contact-hero p{
    max-width:100% !important;
  }

  .room-card,
  .activity-card,
  .value-card,
  .experience-card,
  .contact-card,
  .booking-panel,
  .profile-card,
  .profile-form-card{
    border-radius:22px !important;
  }

  .room-img,
  .room-carousel,
  .activity-img,
  .experience-img,
  .about-img{
    max-height:260px;
  }

  .room-footer,
  .index-room-meta,
  .panel-tools,
  .stats-grid,
  .profile-actions,
  .house-rules-actions{
    flex-direction:column !important;
    align-items:stretch !important;
  }

  .room-footer .btn-book,
  .room-footer .disabled-room,
  .room-price,
  .btn-book,
  .profile-actions .btn,
  .house-rules-agree-btn,
  .house-rules-back-btn{
    width:100% !important;
    justify-content:center !important;
    text-align:center !important;
  }

  .modal-dialog{
    width:calc(100vw - 14px) !important;
    max-width:calc(100vw - 14px) !important;
    margin-top:7px !important;
    margin-bottom:7px !important;
  }

  .premium-modal .modal-header,
  .premium-modal .modal-footer{
    padding:12px 14px !important;
  }

  .premium-modal .modal-body{
    padding:12px !important;
  }

  .premium-modal .modal-footer .btn,
  .premium-modal .modal-footer a{
    width:100% !important;
    min-width:0 !important;
  }

  .modal-room-carousel,
  .modal-room-carousel .carousel-inner,
  .modal-room-carousel .carousel-item,
  .modal-room-carousel img,
  .modal-room-img{
    height:220px !important;
    max-height:220px !important;
  }

  #roomModal.room-booking-only .modal-body{
    max-height:calc(100dvh - 118px) !important;
    padding:8px !important;
  }

  #roomModal.room-booking-only #bookingForm.booking-form-card{
    padding:10px !important;
    border-radius:16px !important;
  }

  #bookingForm .row.g-3{
    --bs-gutter-x:.65rem !important;
    --bs-gutter-y:.55rem !important;
  }

  #bookingForm .booking-section-title{
    margin-top:4px !important;
    margin-bottom:0 !important;
    padding:9px 10px !important;
  }

  #bookingForm .form-control,
  #bookingForm .form-select{
    min-height:39px !important;
    font-size:13px !important;
  }

  #bookingForm textarea.form-control{
    min-height:76px !important;
  }

  .booking-calendar-panel{
    padding:10px !important;
  }

  .booking-calendar-grid,
  .booking-calendar-days{
    gap:4px !important;
  }

  .booking-cal-day{
    min-height:36px !important;
    padding:3px !important;
    font-size:12px !important;
  }

  .payment-method-grid{
    grid-template-columns:1fr !important;
  }

  .payment-step-card,
  .payment-detail-box,
  .payment-receipt-panel,
  .booking-receipt-card{
    padding:12px !important;
    border-radius:16px !important;
  }

  .receipt-line,
  .payment-summary-total{
    align-items:flex-start !important;
  }

  .house-rules-dialog{
    width:calc(100vw - 12px) !important;
    max-width:calc(100vw - 12px) !important;
  }

  .house-rules-paper{
    max-height:calc(100dvh - 12px) !important;
    padding:14px !important;
    border-radius:16px !important;
  }

  .house-rules-header{
    padding-bottom:8px !important;
  }

  .house-rules-logo{
    width:64px !important;
    height:auto !important;
  }

  .house-rules-header h3{
    font-size:1.45rem !important;
  }

  .house-rules-list{
    padding-left:0 !important;
  }

  .house-rules-list li{
    font-size:12.2px !important;
    line-height:1.42 !important;
    padding-left:26px !important;
    margin-bottom:6px !important;
  }

  .bookings-page{
    padding-left:10px !important;
    padding-right:10px !important;
  }

  .bookings-hero,
  .profile-card,
  .profile-form-card{
    padding-left:16px !important;
    padding-right:16px !important;
  }

  .stats-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
  }

  .login-page,
  .register-page{
    padding:10px !important;
  }

  .login-visual,
  .register-visual{
    padding:24px 16px !important;
    text-align:center !important;
  }

  .login-form-area,
  .register-form-area{
    padding:12px !important;
  }

  .login-card,
  .register-card{
    padding:20px 16px !important;
    border-radius:24px !important;
  }

  .login-visual h1,
  .register-visual h1{
    font-size:clamp(2rem, 10vw, 3rem) !important;
  }

  .premium-footer-inner{
    text-align:center;
  }

  .footer-contact-item{
    justify-content:center;
    text-align:left;
  }
}

/* Very small phones */
@media (max-width:390px){
  .container{
    padding-left:10px !important;
    padding-right:10px !important;
  }

  .brand-text span:first-child{
    max-width:92px !important;
  }

  .mobile-landscape-menu{
    width:calc(100vw - 10px) !important;
    padding:7px !important;
  }

  .mobile-menu-card{
    min-height:48px !important;
    padding:4px 1px !important;
  }

  .mobile-card-icon{
    width:19px !important;
    height:19px !important;
    min-width:19px !important;
    font-size:9px !important;
  }

  .mobile-card-title{
    font-size:6.35px !important;
    letter-spacing:-.15px;
  }

  .section-eyebrow,
  .hero-badge{
    font-size:10px !important;
    max-width:100%;
    white-space:normal !important;
  }

  .modal-room-carousel,
  .modal-room-carousel .carousel-inner,
  .modal-room-carousel .carousel-item,
  .modal-room-carousel img,
  .modal-room-img{
    height:188px !important;
    max-height:188px !important;
  }

  #bookingForm .form-control,
  #bookingForm .form-select{
    min-height:36px !important;
    font-size:12px !important;
  }

  .house-rules-paper{
    padding:11px !important;
  }

  .house-rules-header h3{
    font-size:1.25rem !important;
  }

  .house-rules-list li,
  .house-rules-greeting,
  .house-rules-note{
    font-size:11.4px !important;
  }
}

/* Large displays: avoid stretched content */
@media (min-width:1400px){
  .container{
    max-width:1320px;
  }

  .hero-content,
  .rooms-hero-content,
  .activity-hero-content,
  .about-hero-content,
  .profile-hero-content{
    max-width:1320px;
  }
}


/* Profile mobile header compact + visible */
.profile-hero{
  min-height:auto !important;
  background:#F8FAFC !important;
  color:#123C69 !important;
  overflow:visible !important;
}

.profile-hero::before,
.profile-hero::after{
  display:none !important;
}

.profile-hero-content{
  padding:32px 14px 18px !important;
  color:#123C69 !important;
  text-align:center !important;
}

.profile-hero .hero-badge,
.profile-hero .hero-badge i{
  color:#FFFFFF !important;
  background:#2563EB !important;
  border-color:#2563EB !important;
  box-shadow:0 10px 24px rgba(37, 99, 235,.22) !important;
  text-shadow:none !important;
}

.profile-title,
.profile-title span{
  color:#123C69 !important;
  text-shadow:none !important;
}

.profile-title span{
  color:#0F6B4A !important;
}

.profile-subtitle{
  color:#334155 !important;
  text-shadow:none !important;
  margin-bottom:0 !important;
}

.profile-section{
  margin-top:0 !important;
  padding-top:12px !important;
}

@media (max-width:576px){
  .profile-hero{
    min-height:auto !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
  }

  .profile-hero-content{
    padding:18px 12px 10px !important;
  }

  .profile-hero .hero-badge{
    margin-bottom:8px !important;
    padding:6px 10px !important;
    font-size:10.5px !important;
  }

  .profile-title{
    font-size:1.62rem !important;
    line-height:1.05 !important;
    letter-spacing:-.7px !important;
    margin-bottom:7px !important;
  }

  .profile-subtitle{
    max-width:310px !important;
    font-size:11.7px !important;
    line-height:1.42 !important;
  }

  .profile-section{
    margin-top:0 !important;
    padding-top:8px !important;
    padding-bottom:34px !important;
  }

  .profile-card{
    border-radius:22px !important;
  }
}


/* Homepage Our Values mobile compact spacing */
@media (max-width:576px){
  body.index-page .showcase-section{
    padding-top:22px !important;
    padding-bottom:20px !important;
  }

  body.index-page .showcase-section > .container{
    padding-left:10px !important;
    padding-right:10px !important;
  }

  body.index-page .showcase-section .text-center.mb-5{
    margin-bottom:9px !important;
  }

  body.index-page .showcase-section .section-eyebrow{
    padding:4px 8px !important;
    font-size:8.4px !important;
    gap:4px !important;
    margin-bottom:5px !important;
  }

  body.index-page .showcase-section .section-title{
    max-width:300px !important;
    font-size:1.14rem !important;
    line-height:1.08 !important;
    margin-top:5px !important;
    margin-bottom:4px !important;
    letter-spacing:-.45px !important;
  }

  body.index-page .showcase-section .text-center > p,
  body.index-page .showcase-section p.mx-auto{
    max-width:310px !important;
    font-size:10.2px !important;
    line-height:1.28 !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
  }

  body.index-page .showcase-section .row.g-4{
    gap:5px !important;
    margin-top:0 !important;
    align-items:stretch !important;
  }

  body.index-page .showcase-section .col-md-4{
    flex-basis:98px !important;
    width:98px !important;
    max-width:98px !important;
    min-width:98px !important;
  }

  body.index-page .showcase-section .value-card{
    width:98px !important;
    min-width:98px !important;
    max-width:98px !important;
    height:104px !important;
    min-height:104px !important;
    max-height:104px !important;
    padding:7px 5px !important;
    border-radius:12px !important;
    gap:3px !important;
    box-shadow:0 10px 24px rgba(18,60,105,.09) !important;
  }

  body.index-page .showcase-section .value-icon{
    flex:0 0 22px !important;
    width:22px !important;
    min-width:22px !important;
    height:22px !important;
    border-radius:8px !important;
    font-size:10px !important;
  }

  body.index-page .showcase-section .value-card h5{
    min-height:17px !important;
    font-size:7.5px !important;
    line-height:1.05 !important;
    margin:0 !important;
  }

  body.index-page .showcase-section .value-card p{
    font-size:6.35px !important;
    line-height:1.12 !important;
    -webkit-line-clamp:4 !important;
    margin:0 !important;
  }
}

@media (max-width:390px){
  body.index-page .showcase-section{
    padding-top:19px !important;
    padding-bottom:18px !important;
  }

  body.index-page .showcase-section .text-center.mb-5{
    margin-bottom:8px !important;
  }

  body.index-page .showcase-section .section-title{
    font-size:1.04rem !important;
    margin-top:4px !important;
    margin-bottom:3px !important;
  }

  body.index-page .showcase-section .text-center > p,
  body.index-page .showcase-section p.mx-auto{
    max-width:285px !important;
    font-size:9.2px !important;
    line-height:1.23 !important;
  }

  body.index-page .showcase-section .row.g-4{
    gap:4px !important;
  }

  body.index-page .showcase-section .col-md-4,
  body.index-page .showcase-section .value-card{
    flex-basis:88px !important;
    width:88px !important;
    max-width:88px !important;
    min-width:88px !important;
  }

  body.index-page .showcase-section .value-card{
    height:96px !important;
    min-height:96px !important;
    max-height:96px !important;
    padding:6px 4px !important;
  }

  body.index-page .showcase-section .value-icon{
    flex-basis:20px !important;
    width:20px !important;
    min-width:20px !important;
    height:20px !important;
    font-size:9px !important;
  }

  body.index-page .showcase-section .value-card h5{
    min-height:15px !important;
    font-size:6.9px !important;
  }

  body.index-page .showcase-section .value-card p{
    font-size:5.9px !important;
    line-height:1.08 !important;
  }
}

/* Guest-facing tablet / iPad card containment */
@media (min-width: 768px) and (max-width: 1199.98px) {
  html, body { overflow-x: hidden; max-width: 100%; }
  .container, .container-fluid, .row, [class*="col-"] { min-width: 0; }
  .card, .room-card, .activity-card, .booking-card, .contact-card,
  .feature-card, .team-card, .profile-card, .payment-card {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden;
  }
  .card-body, .room-card-body, .activity-card-body { overflow-wrap: anywhere; }
  .card img, .room-card img, .activity-card img { width: 100%; max-width: 100%; object-fit: cover; }
  .btn-group, .card-actions, .booking-actions, .payment-actions,
  .d-flex.gap-2, .d-flex.gap-3 { flex-wrap: wrap !important; gap: 8px !important; }
  .btn, button, a.btn { max-width: 100%; white-space: normal; }
  .table-responsive { width: 100%; max-width: 100%; overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .modal-dialog { max-width: calc(100vw - 32px) !important; margin: 16px auto !important; }
  input, select, textarea, .form-control, .form-select, .input-group { min-width: 0; max-width: 100%; }
}