/* Public website theme, adapted from the Sogo hotel template by Colorlib (CC BY 3.0, credit link in the footer).
   Playfair Display headings, light Roboto text, full-screen photo heroes, amber accent = Branding "accent" color. */

.public-site { font-family: "Roboto", Arial, sans-serif; font-weight: 300; font-size: 16px; line-height: 1.8; color: #6c757d; background: #fff; }
.public-site h1, .public-site h2, .public-site h3, .public-site h4, .public-site h5 { font-family: "Playfair Display", Georgia, serif; color: #000; }
.public-site strong, .public-site b, .public-site label, .public-site .form-label { font-weight: 500; }
.public-site ::selection { background: var(--brand-accent); color: var(--brand-accent-text); }
.public-site .form-control, .public-site .form-select { font-weight: 400; }
.heading { font-size: 60px; font-weight: 700; line-height: 1.15; margin-bottom: 1.25rem; }
.heading-sm { font-size: 40px; font-weight: 700; line-height: 1.2; margin-bottom: 1rem; }
.section { padding: 7em 0; }
.section-light { background: #f2f4fb; }
.text-white-75 { color: rgba(255, 255, 255, .75); }
.public-site main { overflow-x: clip; }   /* wide row gutters (g-5) and the round inset photo must not cause sideways scroll on phones */
.public-site main a:not(.btn):not(.nav-link):not(.alert-link) { color: inherit; }
.link-caps { text-transform: uppercase; letter-spacing: .1em; font-weight: 500; font-size: .85rem; color: #000 !important; border-bottom: 2px solid var(--brand-accent); text-decoration: none; }
@media (max-width: 991.98px) { .section { padding: 3.5em 0; } .heading { font-size: 40px; } .heading-sm { font-size: 30px; } }

/* buttons: pill shaped, accent filled */
.public-site .btn { border-radius: 50px; }
.btn-reserve { background: var(--brand-accent); color: var(--brand-accent-text); border: 2px solid var(--brand-accent); padding: .6rem 1.8rem; font-weight: 500; }
.btn-reserve:hover, .btn-reserve:focus-visible { background: #000; border-color: #000; color: #fff; }
.btn-outline-white-primary { border: 2px solid var(--brand-accent); color: #fff; background: transparent; font-weight: 500; }
.btn-outline-white-primary:hover, .btn-outline-white-primary:focus-visible { background: var(--brand-accent); color: var(--brand-accent-text); }

/* header: floats over the photo on hero pages, solid black once scrolled and on every other page */
.site-header { background: var(--brand-nav); transition: background .3s ease, padding .3s ease; }
.site-header .navbar { padding: .9rem 0; }
.site-header-inner { max-width: 1600px; padding: 0 2.5rem; }
.has-hero .site-header:not(.scrolled) { background: transparent; }
.has-hero .site-header:not(.scrolled) .navbar { padding: 2rem 0; }
.site-header .brand-logo { height: 40px; }
.site-header .brand-name, .footer-brand span { font-family: "Playfair Display", Georgia, serif; font-size: 28px; font-weight: 700; color: #fff; line-height: 1; }
.site-header .nav-link { color: rgba(255, 255, 255, .85); font-weight: 400; font-size: .95rem; letter-spacing: .05em; position: relative; }
.site-header .nav-link:hover, .site-header .nav-link.active { color: #fff; }
.site-header .nav-link.active::after { content: ""; position: absolute; left: .5rem; right: .5rem; bottom: .1rem; height: 2px; background: var(--brand-accent); }
.header-phone { color: rgba(255, 255, 255, .85); text-decoration: none; font-weight: 400; }
.header-phone:hover { color: #fff; }
@media (max-width: 991.98px) {
  .site-header-inner { padding: 0 1rem; }
  .has-hero .site-header:not(.scrolled) .navbar { padding: 1rem 0; }
  .site-header .brand-name { font-size: 22px; }
  /* open menu: a solid panel, readable over the photo */
  .site-header .navbar-collapse.show, .site-header .navbar-collapse.collapsing { background: var(--brand-nav); margin: .75rem -1rem 0; padding: .5rem 1rem; }
  .site-header .nav-link.active::after { display: none; }
}
.page-alerts { position: relative; z-index: 1000; }
.has-hero .page-alerts { position: absolute; left: 0; right: 0; top: 110px; }

/* full-screen photo hero */
.site-hero { position: relative; background-size: cover; background-position: center; background-color: #1a1a1a; min-height: 700px; height: 100vh; }
.site-hero.overlay::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .45); }
.site-hero > .container { position: relative; height: 100%; }
.site-hero-inner { height: 100%; padding: 120px 0 80px; }
.site-hero .heading { font-size: 80px; color: #fff; line-height: 1.05; font-weight: 700; max-width: 900px; }
.site-hero.inner-page { height: 60vh; min-height: 480px; }
.site-hero.inner-page .heading { font-size: 64px; }
.custom-caption { font-size: 14px; letter-spacing: .2em; font-weight: 400; }
.custom-caption .stars { color: var(--brand-accent); letter-spacing: .1em; margin: 0 .25rem; }
.hero-sub { color: rgba(255, 255, 255, .85); font-size: 1.15rem; max-width: 640px; }
.custom-breadcrumbs { list-style: none; padding: 0; }
.custom-breadcrumbs li { display: inline-block; color: #fff; margin: 0 4px; text-transform: uppercase; font-size: 14px; letter-spacing: .1em; font-weight: 500; }
.custom-breadcrumbs a { color: #fff; border-bottom: 2px solid var(--brand-accent); text-decoration: none; }
@media (max-width: 991.98px) { .site-hero .heading, .site-hero.inner-page .heading { font-size: 40px; } .site-hero { min-height: 560px; } }

/* scroll hint */
.mouse { position: absolute; left: 50%; bottom: 140px; transform: translateX(-50%); z-index: 1; }
.mouse-icon { display: block; width: 25px; height: 45px; border: 2px solid #fff; border-radius: 15px; }
.mouse-wheel { display: block; width: 3px; height: 6px; margin: 6px auto 0; background: #fff; border-radius: 50%; animation: wheel-up-down 1.6s ease infinite; }
@keyframes wheel-up-down { 0% { transform: translateY(0); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateY(20px); opacity: 0; } }
@media (max-height: 760px) { .mouse { display: none; } }

/* availability bar, pulled up over the hero */
.check-availability { position: relative; margin-top: -110px; z-index: 2; }
.block-32 { background: #fff; padding: 30px; border-radius: 10px; box-shadow: 0 2px 80px -10px rgba(0, 0, 0, .2); }
.block-32 .form-label { color: #000; font-weight: 700; }
.block-32 .form-control, .block-32 .form-select { height: 52px; border: 2px solid #e9ecef; border-radius: 6px; }
.block-32 .form-control:focus, .block-32 .form-select:focus { border-color: var(--brand-accent); box-shadow: none; }
.block-32 .btn-reserve { height: 52px; }
.block-32 textarea.form-control { height: auto; }
.contact-form .form-control { border: 2px solid #e9ecef; border-radius: 6px; }
.contact-form .form-control:focus { border-color: var(--brand-accent); box-shadow: none; }

/* welcome: big photo with a round inset */
.welcome-photo { border-radius: 6px; overflow: hidden; }
.img-absolute { position: absolute; right: -30px; bottom: -80px; margin: 0; }
.img-absolute img { width: 250px; height: 250px; object-fit: cover; border-radius: 50%; border: 10px solid #f2f4fb; }
@media (max-width: 1199.98px) { .img-absolute { right: 0; bottom: -60px; } .img-absolute img { width: 160px; height: 160px; } }

/* amenities */
.amenity-strip { background: var(--brand-nav); color: rgba(255, 255, 255, .8); font-size: .9rem; }
.amenity-strip li { display: flex; align-items: center; gap: .5rem; }
.amenity-strip i, .amenity i { color: var(--brand-accent); }
.amenity i { display: block; font-size: 2.2rem; margin-bottom: .5rem; }
.amenity span { color: #000; font-weight: 400; }

/* room cards */
.room { display: block; text-decoration: none; background: #fff; }
.room .img-wrap { overflow: hidden; }
.room .img-wrap img { transition: transform .3s ease-in-out; }
.room:hover .img-wrap img, .room:focus-visible .img-wrap img { transform: scale(1.05); }
.room-info h3 { font-size: 20px; margin-bottom: .25rem; }
.room-price, .room-kicker { letter-spacing: .1em; font-size: .85rem; color: #6c757d; font-weight: 400; }
.room-kicker { display: block; text-transform: uppercase; color: var(--brand-accent); font-weight: 500; margin-bottom: .5rem; }
.room-row + .room-row { margin-top: 5rem; }
.room-row { scroll-margin-top: 110px; }
.room-photo { border-radius: 6px; overflow: hidden; box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .35); }
.room-facts { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem 1rem; margin: 1.25rem 0 1.75rem; color: #000; font-weight: 400; }
.room-facts i { color: var(--brand-accent); margin-right: .5rem; }

/* photo slider */
.photo-slider { border-radius: 6px; overflow: hidden; }
.photo-slider .carousel-item img { aspect-ratio: 16 / 7; object-fit: cover; }
.photo-slider .carousel-caption { left: 0; right: 0; bottom: 0; padding: 3rem 1.5rem 1.25rem; text-align: left; background: linear-gradient(transparent, rgba(0, 0, 0, .7));
  font-family: "Playfair Display", Georgia, serif; font-size: 1.4rem; }
.photo-slider .carousel-caption span { display: block; font-family: "Roboto", Arial, sans-serif; font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; color: var(--brand-accent); }
@media (max-width: 767.98px) { .photo-slider .carousel-item img { aspect-ratio: 4 / 3; } .photo-slider .carousel-caption { font-size: 1.05rem; } }

/* parallax photo sections (menu, call to action) */
.bg-image { position: relative; background-size: cover; background-position: center; background-attachment: fixed; }
.bg-image.overlay::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .6); }
.bg-image > .container { position: relative; }
@media (max-width: 991.98px), (hover: none) { .bg-image { background-attachment: scroll; } }   /* fixed backgrounds jitter on phones */
.cta-title { font-size: 2.1rem; font-weight: 700; }

/* breakfast & diner menu */
.menu-tabs .nav { gap: 1rem; }
.menu-tabs .nav-link { background: none; border: 0; color: #fff; text-transform: uppercase; letter-spacing: .2em; font-weight: 500; font-size: 1.05rem; padding: .25rem .5rem; position: relative; opacity: .7; }
.menu-tabs .nav-link::before { content: ""; position: absolute; left: 50%; right: 50%; bottom: -4px; height: 2px; background: var(--brand-accent); transition: left .3s, right .3s; }
.menu-tabs .nav-link.active, .menu-tabs .nav-link:hover { opacity: 1; color: #fff; }
.menu-tabs .nav-link.active::before { left: .5rem; right: .5rem; }
.food-menu { margin-bottom: 2.5rem; }
.food-menu .price { display: block; color: var(--brand-accent); font-family: "Playfair Display", Georgia, serif; font-size: 1.4rem; margin-bottom: .5rem; }
.food-menu h3 { color: #fff; font-size: 1.6rem; }
.food-menu p { color: rgba(255, 255, 255, .7); margin: 0; }

/* testimonials */
.testimonial img { object-fit: cover; }
.testimonial blockquote p { font-size: 1.05rem; color: #343a40; font-style: italic; }
.testimonial figcaption { color: #000; }

/* contact */
.contact-tile { background: #fff; border-radius: 6px; box-shadow: 0 2px 30px -10px rgba(0, 0, 0, .15); }
.contact-tile h3 { font-family: "Roboto", Arial, sans-serif; font-weight: 500; }

/* footer */
.site-footer { background: var(--brand-nav); color: rgba(255, 255, 255, .5); }
.site-footer a { color: rgba(255, 255, 255, .7); text-decoration: none; }
.site-footer a:hover { color: #fff; }
.site-footer .footer-brand { color: #fff; }
.site-footer .footer-heading { font-family: "Roboto", Arial, sans-serif; color: #fff; font-size: .85rem; text-transform: uppercase; letter-spacing: .15em; margin-bottom: 1.25rem; font-weight: 500; }
.site-footer .footer-links li { margin-bottom: .5rem; }
.footer-contact span.d-block { color: #fff; }
.footer-contact i { color: var(--brand-accent); }
.footer-bottom { border-top: 1px solid rgba(255, 255, 255, .1); }
.site-footer { border-top: 4px solid var(--brand-accent); border-image: linear-gradient(90deg in oklch, var(--brand-primary), var(--brand-accent)) 1; }
.site-footer .btn-reserve { color: var(--brand-accent-text); }
.site-footer .btn-reserve:hover { color: #fff; background: transparent; border-color: #fff; }

/* scroll-in fade, like the template's AOS "fade-up" (site.js adds .in); hidden only when JS is running */
.js .reveal { opacity: 0; transform: translateY(30px); transition: opacity .9s ease, transform .9s ease; }
.js .reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .js .reveal { opacity: 1; transform: none; transition: none; }
  .mouse-wheel { animation: none; }
  .room .img-wrap img, .site-header { transition: none; }
}
.g-hero h1 { font-weight: 700; }