/* ARK Showcase home page. Layout and most styling come from the same stack as the
   HomeRunner property pages (YOOtheme + HomeRunner CSS + ARK chrome.css under
   body.single-property). This file only covers what the booking engine would
   otherwise render: hero sizing, the inquiry widget, availability block, mobile
   capsule bar, inquiry dialog, owner band. Values match the live PDP. */

.sc-preview-flag { background: #1A1D24; color: #fff; font: 600 13px/1.4 'Manrope', system-ui, sans-serif; text-align: center; padding: 8px 16px; }

/* Hero: same per-breakpoint image heights as the PDP builder template */
.ark-sc-hero .el-image { max-height: 300px; }
@media (min-width: 640px) { .ark-sc-hero .el-image { max-height: 400px; } }
@media (min-width: 960px) { .ark-sc-hero .el-image { max-height: 600px; } }
.ark-sc-hero .uk-slider-items > * { min-width: 200px; }
@media (min-width: 960px) { .ark-sc-hero .uk-slider-items > * { min-width: 400px; } }
.ark-sc-hero .ark-sc-allphotos { max-width: 210px; }
.ark-sc-hero .ark-sc-allphotos-sm { max-width: 145px; }

/* Builder-level overrides the PDP template carries (orange title, inherited font, bare card) */
.ark-sc-main .uk-text-secondary { color: #F48847 !important; }
.ark-sc-main { font-family: inherit !important; }
@media (max-width: 767px) { .ark-sc-main h2.uk-heading-medium { font-size: 2.5rem; } }
.ark-sc-main .js-sticky .uk-card { padding: 0 !important; }

/* Section rhythm: same 40px above / 26px below the line headings as the PDP */
.ark-sc-main h1.uk-heading-line { margin: 40px 0 26px !important; }
.ark-sc-main h1.uk-heading-line + * { margin-top: 0 !important; }
.ark-sc-main .sc-hood p { margin: 0 0 16px; max-width: none; }
.sc-explore { margin-top: 64px; }
.sc-explore .uk-list { margin-bottom: 0; }

/* Inquiry widget (in the PDP booking card); type sizes match the booking widget */
.sc-widget .homelocal-booking-widget-body { padding: 20px; }
.sc-widget .rent-unit { font-size: 15px; font-weight: 600; color: #9AA0AD; }
.sc-widget .rent-unit .rent-amount { font-size: 26px; font-weight: 800; color: #1A1D24; letter-spacing: -.01em; }
.sc-widget .sc-minstay { font-size: 13px; font-weight: 600; color: #5A5F6D; margin: 4px 0 16px; }
.sc-widget .hk-form-label { display: block; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .14em; color: #9AA0AD; }
.sc-widget .hk-input, .sc-widget .hk-select { width: 100%; height: 40px; border: .8px solid rgba(26,29,36,.10); border-radius: 12px; font: 500 14.5px/1.2 'Manrope', system-ui, sans-serif; color: #1A1D24; background: #fff; padding: 0 12px; box-sizing: border-box; }
.sc-widget .sc-widget__grid { row-gap: 12px; margin-bottom: 18px; }
.sc-widget .discount-row { background: #FFE9D8; color: #E4762F; border-radius: 999px; padding: 8px 13px; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; width: auto; }
.sc-widget .sc-widget__cta { width: 100%; }
.sc-widget .sc-widget__note { font-size: 12px; color: #9AA0AD; text-align: center; margin: 10px 0 0; }

/* Availability block (stands in for the PDP rates calendar) */
.sc-avail { background: #fff; border-radius: 16px; box-shadow: 0 1px 2px rgba(26,29,36,.06), 0 3px 8px rgba(26,29,36,.06); padding: 8px 22px 18px; }
.sc-avail__row { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgba(26,29,36,.06); font-size: 15px; }
.sc-avail__row span { color: #5A5F6D; }
.sc-avail__row b { color: #1A1D24; font-weight: 700; text-align: right; }
.sc-avail p { margin: 14px 0 0; font-size: 14px; color: #5A5F6D; }

.sc-nearby { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 4px 0 0; }

.sc-endspace { height: 72px; }
.sc-eyebrow { display: block; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #E4762F; margin-bottom: 10px; }

/* Mobile capsule bar: same shape as the HomeRunner sticky booking bar */
.sc-mobilebar { position: fixed; left: 12px; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 980; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; border: .8px solid rgba(26,29,36,.06); border-radius: 999px; padding: 10px 10px 10px 18px; box-shadow: 0 2px 4px rgba(26,29,36,.08), 0 12px 24px rgba(26,29,36,.10), 0 32px 56px rgba(26,29,36,.12); font-family: 'Manrope', system-ui, sans-serif; transition: transform .3s cubic-bezier(.2,.7,.2,1), opacity .3s; }
.sc-mobilebar.is-hidden { transform: translateY(140%); opacity: 0; }
.sc-mobilebar div { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.sc-mobilebar b { font-size: 16px; font-weight: 800; color: #1A1D24; }
.sc-mobilebar span { font-size: 11.5px; font-weight: 600; color: #9AA0AD; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-mobilebar .uk-button { flex: none; height: 44px; line-height: 44px; padding: 0 18px; border-radius: 999px; }
@media (max-width: 959px) { body.ark-sc-page { padding-bottom: calc(84px + env(safe-area-inset-bottom)); } }

/* Inquiry dialog */
.sc-dialog { border: 0; padding: 0; color: #1A1D24; font-family: 'Manrope', system-ui, sans-serif; width: min(640px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); border-radius: 24px; box-shadow: 0 30px 64px rgba(26,29,36,.16); }
.sc-dialog::backdrop { background: rgba(26,29,36,.55); backdrop-filter: blur(4px); }
.sc-x { position: absolute; top: 14px; right: 14px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(26,29,36,.10); background: #fff; font-size: 24px; line-height: 1; cursor: pointer; color: #1A1D24; }
.sc-form, .sc-done { padding: 36px clamp(20px, 5vw, 40px) 32px; }
.sc-form h2, .sc-done h2 { font-size: 28px; font-weight: 800; letter-spacing: -.015em; margin: 0 0 8px; color: #1A1D24; }
.sc-form p, .sc-done p { color: #5A5F6D; font-size: 15px; }
.sc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; margin-bottom: 14px; }
.sc-form label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 700; color: #1A1D24; }
.sc-form input, .sc-form select, .sc-form textarea { font: 500 15px/1.4 'Manrope', system-ui, sans-serif; color: #1A1D24; background: #fff; border: 1px solid #D5D9E5; border-radius: 12px; padding: 11px 14px; width: 100%; min-height: 46px; box-sizing: border-box; }
.sc-form textarea { resize: vertical; margin-bottom: 16px; }
.sc-form input:focus, .sc-form select:focus, .sc-form textarea:focus { outline: none; border-color: #F48847; box-shadow: 0 0 0 3px rgba(244,136,71,.2); }
.sc-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sc-form__err { background: #FDECEC; color: #8C2B2B !important; border-radius: 12px; padding: 10px 14px; font-size: 14px; }
.sc-btn--block { width: 100%; }
.sc-form button[disabled] { opacity: .6; cursor: progress; }
.sc-badge { display: inline-flex; align-items: center; gap: 8px; background: #E4F1EA; color: #1F5A3A; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 6px 12px; border-radius: 999px; margin-bottom: 14px; }
.sc-badge i { width: 7px; height: 7px; border-radius: 50%; background: #3D8A5C; }

@media (max-width: 639px) {
  .sc-grid { grid-template-columns: 1fr; }
}