/* ====================================================================
   PV PREMIUM — site-wide editorial polish
   Each section is independent; comment out blocks to disable.
   v1.0  (2026-04-25)
   ==================================================================== */

/* --- 1) HERO COVER · KEN BURNS SLOW ZOOM ----------------------------- */
.pv-acc-hero .wp-block-cover__image-background,
.wp-block-cover.pv-acc-hero img.wp-block-cover__image-background,
.pv-contact-hero .wp-block-cover__image-background,
body.single-room .uicore-page-title-wrapper .uicore-bg-image,
body.single-room .pv-room-hero img,
.pv-hero-zoom img,
.pv-hero-zoom .wp-block-cover__image-background {
    animation: pv-kenburns 28s ease-out infinite alternate;
    transform-origin: 50% 50%;
    will-change: transform;
}
@keyframes pv-kenburns {
    0%   { transform: scale(1)    translate3d(0,0,0); }
    100% { transform: scale(1.08) translate3d(-1.5%, -1%, 0); }
}

/* --- 2) SECTION DIVIDERS · GOLD HAIRLINE ORNAMENT -------------------- */
/* Place a hairline ornament between major page sections.
   Apply class .pv-divider on a wp:group, OR pseudo-element will be
   auto-injected after specific section classes below. */
.pv-divider {
    width: 100%;
    text-align: center;
    padding: 70px 24px 40px;
    background: #fff;
}
.pv-divider::before {
    content: "";
    display: inline-block;
    width: 60px; height: 1px;
    background: #C9A96E;
    vertical-align: middle;
    margin: 0 14px 0 0;
}
.pv-divider::after {
    content: "◆";
    display: inline-block;
    color: #C9A96E;
    font-size: 9px;
    vertical-align: middle;
    transform: translateY(-1px);
}
.pv-divider .pv-divider__sym {
    display: inline-block;
    width: 60px; height: 1px;
    background: #C9A96E;
    vertical-align: middle;
    margin: 0 0 0 14px;
}

/* Auto-divider: only between intro group and grid section on accommodation
   (purely visual — no markup change required). */
.pv-acc-intro + .pv-acc-grid-section { position: relative; }
.pv-acc-intro + .pv-acc-grid-section::before {
    content: "◆";
    position: absolute;
    top: -12px; left: 50%;
    transform: translateX(-50%);
    color: #C9A96E;
    font-size: 9px;
    background: #fff;
    padding: 0 14px;
    z-index: 2;
}
.pv-acc-intro {
    border-bottom: 1px solid rgba(201,169,110,0.28);
}

/* --- 3) BRAND SELECTION + CUSTOM SCROLLBAR --------------------------- */
::selection {
    background: #C9A96E;
    color: #fff;
    text-shadow: none;
}
::-moz-selection {
    background: #C9A96E;
    color: #fff;
}
/* Thin custom scrollbar (Webkit) */
@media (min-width: 768px) {
    html::-webkit-scrollbar { width: 10px; }
    html::-webkit-scrollbar-track { background: #F8F6F3; }
    html::-webkit-scrollbar-thumb {
        background: linear-gradient(180deg, #C9A96E, #A8895A);
        border: 2px solid #F8F6F3;
        border-radius: 10px;
    }
    html::-webkit-scrollbar-thumb:hover { background: #192A3D; }
    /* Firefox */
    html { scrollbar-width: thin; scrollbar-color: #C9A96E #F8F6F3; }
}

/* --- 4) UNIFIED PREMIUM BUTTON SYSTEM -------------------------------- */
/* Canonical: .pv-btn (primary navy → gold hover)
              .pv-btn--ghost (transparent + gold border)
              .pv-btn--gold (gold filled)
   Also retro-fits: WP block buttons, FluentForm submit, UiCore primary. */
.pv-btn,
.wp-block-button .wp-block-button__link,
.uicore-btn-primary,
.uicore-btn,
button.ff-btn-submit,
.frm-fluent-form button[type="submit"] {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #192A3D !important;
    color: #fff !important;
    border: 1px solid #192A3D !important;
    border-radius: 0 !important;
    padding: 18px 38px !important;
    font-family: var(--pv-font-body, 'DM Sans'), sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: .25em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition: background .35s ease, color .35s ease, border-color .35s ease, transform .25s ease !important;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.pv-btn:hover,
.wp-block-button .wp-block-button__link:hover,
.uicore-btn-primary:hover,
.uicore-btn:hover,
button.ff-btn-submit:hover,
.frm-fluent-form button[type="submit"]:hover {
    background: #C9A96E !important;
    border-color: #C9A96E !important;
    color: #fff !important;
}
.pv-btn--ghost {
    background: transparent !important;
    color: #192A3D !important;
    border-color: #C9A96E !important;
}
.pv-btn--ghost:hover {
    background: #C9A96E !important;
    color: #fff !important;
}
.pv-btn--gold {
    background: #C9A96E !important;
    border-color: #C9A96E !important;
}
.pv-btn--gold:hover {
    background: #192A3D !important;
    border-color: #192A3D !important;
}

/* Header "Book Online" pill — keep the white-on-navy intent but unify the look */
.uicore-header .uicore-btn,
header .uicore-btn,
.uicore-btn[href*="reserve-online"],
a[href*="reserve-online"].uicore-btn {
    padding: 14px 26px !important;
    font-size: 11px !important;
    letter-spacing: .22em !important;
}

/* --- 5) BODY LINK · GOLD UNDERLINE REVEAL ---------------------------- */
/* Scoped to long-form content (paragraphs inside groups, post content),
   skips nav/header/footer/cards/buttons. */
.pv-acc-intro p a:not(.pv-btn):not(.wp-block-button__link),
.pv-contact-info a:not(.pv-btn):not(.uicore-btn),
.entry-content p a:not(.pv-btn):not(.uicore-btn):not(.wp-block-button__link),
.single-room .pv-room-text p a {
    color: inherit;
    text-decoration: none;
    background-image: linear-gradient(#C9A96E, #C9A96E);
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 0% 1px;
    transition: background-size .4s cubic-bezier(.2,.7,.2,1), color .25s ease;
    padding-bottom: 2px;
}
.pv-acc-intro p a:hover,
.pv-contact-info a:hover,
.entry-content p a:hover,
.single-room .pv-room-text p a:hover {
    background-size: 100% 1px;
    color: #C9A96E;
}

/* --- 6) DROP CAP · OPENING PARAGRAPHS -------------------------------- */
/* Apply class .pv-dropcap on the <p> you want, OR on a wrapping group. */
.pv-dropcap > p:first-of-type::first-letter,
p.pv-dropcap::first-letter {
    font-family: var(--pv-font-head, 'EB Garamond'), serif;
    font-weight: 500;
    font-size: 4.2em;
    line-height: .92;
    float: left;
    margin: .12em .14em -.05em 0;
    color: #C9A96E;
}
@media (max-width: 600px) {
    .pv-dropcap > p:first-of-type::first-letter,
    p.pv-dropcap::first-letter { font-size: 3.4em; }
}

/* --- 7) IMAGES · SLOW ZOOM + GENTLE WARM GRADE ----------------------- */
/* Cards already have it on .pv-rooms__img. Extend to other key surfaces. */
.pv-room-gallery__img,
.pv-acc-hero .wp-block-cover__image-background,
.pv-room-gallery__item img,
.pv-feature-tile img,
.pv-image-zoom img {
    transition: transform 1.1s cubic-bezier(.2,.7,.2,1),
                filter .6s ease !important;
}
.pv-room-gallery__item:hover img,
.pv-feature-tile:hover img,
.pv-image-zoom:hover img {
    transform: scale(1.06) !important;
    filter: saturate(1.06) brightness(1.02) !important;
}

/* --- 8) SCROLL-FADE · sections lift in -------------------------------- */
/* JS adds .pv-in when section enters viewport. Initial state hidden. */
.pv-fade {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .9s cubic-bezier(.2,.7,.2,1),
                transform .9s cubic-bezier(.2,.7,.2,1);
    will-change: opacity, transform;
}
.pv-fade.pv-in,
.pv-fade.pv-in-now {
    opacity: 1;
    transform: translateY(0);
}
/* Stagger children when on a parent with .pv-fade-stagger */
.pv-fade-stagger.pv-in > * { animation: pv-rise .9s cubic-bezier(.2,.7,.2,1) both; }
.pv-fade-stagger.pv-in > *:nth-child(1) { animation-delay: .05s; }
.pv-fade-stagger.pv-in > *:nth-child(2) { animation-delay: .15s; }
.pv-fade-stagger.pv-in > *:nth-child(3) { animation-delay: .25s; }
.pv-fade-stagger.pv-in > *:nth-child(4) { animation-delay: .35s; }
.pv-fade-stagger.pv-in > *:nth-child(5) { animation-delay: .45s; }
.pv-fade-stagger.pv-in > *:nth-child(n+6) { animation-delay: .55s; }
@keyframes pv-rise {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0);    }
}

/* --- 9) HEADER · TRANSPARENT OVER HERO, SOLID ON SCROLL -------------- */
/* UiCore navbar is `.uicore-navbar`. JS toggles .pv-header-solid on <body>. */
.uicore-navbar {
    transition: background .35s ease, box-shadow .35s ease, padding .35s ease !important;
}
body.pv-header-solid .uicore-navbar {
    background: rgba(255,255,255,0.96) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1px 0 rgba(25,42,61,0.06),
                0 12px 30px -22px rgba(25,42,61,0.18) !important;
}
body.pv-header-solid .uicore-navbar a,
body.pv-header-solid .uicore-navbar .uicore-menu a {
    color: #192A3D !important;
}
body.pv-header-solid .uicore-navbar a:hover,
body.pv-header-solid .uicore-navbar .uicore-menu a:hover {
    color: #C9A96E !important;
}
/* Tighten the navbar height once solid for editorial feel */
body.pv-header-solid .uicore-navbar { padding-top: 8px !important; padding-bottom: 8px !important; }

/* --- 11) FOOTER · gold hairline + tighter rhythm --------------------- */
footer.uicore-footer,
footer.site-footer,
.uicore-footer {
    position: relative;
    padding-top: 80px !important;
}
footer.uicore-footer::before,
footer.site-footer::before,
.uicore-footer::before {
    content: "";
    position: absolute;
    top: 0; left: 50%;
    transform: translateX(-50%);
    width: 60px; height: 2px;
    background: #C9A96E;
}
footer.uicore-footer a,
.uicore-footer a {
    color: rgba(255,255,255,.78) !important;
    text-decoration: none !important;
    transition: color .25s ease !important;
}
footer.uicore-footer a:hover,
.uicore-footer a:hover { color: #C9A96E !important; }
footer.uicore-footer .uicore-footer-bottom,
.uicore-footer .uicore-footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.10) !important;
    margin-top: 50px;
    padding-top: 28px !important;
    font-size: 12px;
    letter-spacing: .12em;
    color: rgba(255,255,255,0.55);
}

/* --- 12) 404 · SEARCH · FORM SUCCESS — minimal premium skin ---------- */
body.error404 .entry-content,
body.search .search-results,
.ff-message-success,
.ff_msg_class.ff-message-success {
    text-align: center;
    padding: 60px 24px;
    font-family: var(--pv-font-body), sans-serif;
}
body.error404 h1,
body.search h1 {
    font-family: var(--pv-font-head), serif !important;
    font-size: clamp(40px, 6vw, 80px) !important;
    color: #192A3D !important;
    margin-bottom: 18px !important;
}
.ff-message-success,
.ff_msg_class.ff-message-success {
    background: #F8F6F3;
    border: 1px solid #C9A96E;
    border-radius: 0;
    color: #192A3D !important;
    font-size: 16px;
    line-height: 1.7;
    padding: 28px 32px;
}

/* --- 13) ACCESSIBILITY · prefers-reduced-motion --------------------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001s !important;
        animation-delay: 0s !important;
        transition-duration: .001s !important;
        scroll-behavior: auto !important;
    }
    .pv-fade { opacity: 1 !important; transform: none !important; }
    .pv-acc-hero .wp-block-cover__image-background { animation: none !important; }
}

/* --- BONUS · global smooth scroll + sane focus ring ----------------- */
html { scroll-behavior: smooth; }
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 2px solid #C9A96E !important;
    outline-offset: 3px !important;
}
