/* Borgo Punta Villa 3.9.3 — motion & tonal refinement.
   An additive visual layer above the original 3.9.1, without changing content. */
:root {
  --navy:#1a5686;
  --navy-deep:#164876;
  --blue-soft:#f1f7fc;
  --paper:#f7fafd;
  --white:#fcfdff;
  --ink:#1b3447;
  --muted:#627585;
  --line:#dfebf4;
  --bpv-accent:#2876ab;
  --bpv-accent-bright:#bae6ff;
  --bpv-ease:cubic-bezier(.22,1,.36,1);
}
body {background:var(--white)}
.bpv-residence,.bpv-photo-page,.ferry-page,.pet-friendly-section,.discover-section {background:var(--white)}
.apartments-home,.archive-section,.page-hero,.apartment-title,.where-hero,.ferry-hero{background:var(--paper)}
.where-practical-section{background:#f3f8fc}
.site-footer{background:#16436a}

/* Typography: the accent comes exclusively from colour, NEVER font weight. */
h1,h2,h3,
.hero h1,.intro-copy h2,.pet-friendly-copy h2,.discover-copy h2,
.feature-copy h2,.final-cta h2,.page-hero h1,.apartment-title h1 {
  font-family:var(--font);
  font-weight:450;
  letter-spacing:-.047em;
  text-wrap:pretty;
}
h1,h2 {font-synthesis:none}
.hero h1 {letter-spacing:-.059em;line-height:.9}
.intro-copy h2,.discover-copy h2,.pet-friendly-copy h2 {line-height:1.035}
.bpv-accent,
.pet-friendly-copy strong {
  color:var(--bpv-accent);
  font-weight:inherit!important;
  font-style:normal!important;
}
.hero .bpv-accent,.split-feature .bpv-accent,.final-cta .bpv-accent,
.bpv-residence-island .bpv-accent {color:var(--bpv-accent-bright)}
.hero .bpv-accent {text-shadow:0 2px 14px rgba(8,34,63,.24)}
.kicker:not(.light),.card-code,.number-label {color:var(--navy)}
.kicker {font-weight:520;letter-spacing:.18em}
.section-head h2 {margin-bottom:0}
.text-link {font-weight:520;transition:color .3s ease}
.text-link:hover {color:var(--bpv-accent)}

/* Crisp editorial separators instead of decorative boxes and heavy treatments. */
.intro-label>span {font-variant-numeric:tabular-nums;color:var(--bpv-accent);font-weight:450}
.intro-section .intro-copy,
.discover-copy,.pet-friendly-copy {min-width:0}
.intro-columns {gap:clamp(24px,3.7vw,56px)}
.intro-columns p {font-size:clamp(16px,1.45vw,18px)}
.apartments-home .section-head,
.archive-section .section-head {padding-bottom:26px;border-bottom:1px solid var(--line)}
.visual-side {background:#eff6fc;border:1px solid rgba(26,86,134,.055)}
.card-photo {border-radius:17px}
.card-photo img {transition:transform 1s var(--bpv-ease),filter .8s ease}
.card:hover .card-photo img {transform:scale(1.055)}
.card h3,.card-code {font-weight:500}
.pet-badge {font-weight:520;background:rgba(252,253,255,.94)}
.tripadvisor-card {border-color:var(--line)}

/* Lighter, measured interaction feedback: buttons stay recognizable and clickable. */
.button-primary,.button-outline,.button-ghost {font-weight:530;transition:background-color .32s ease,border-color .32s ease,color .32s ease,opacity .32s ease,transform .38s var(--bpv-ease),box-shadow .32s ease}
.button-primary:hover,.button-outline:hover {transform:translateY(-2px);box-shadow:0 10px 27px rgba(13,67,106,.10)}
.button-ghost:hover {opacity:1;transform:translateY(-2px)}
.hero-actions .button-ghost span {display:none} /* legacy decorative arrow, not a link */
.button-primary:focus-visible,.button-outline:focus-visible,.button-ghost:focus-visible,.text-link:focus-visible,
.desktop-menu a:focus-visible,.language-toggle:focus-visible,.menu-toggle:focus-visible {outline:2px solid var(--bpv-accent);outline-offset:4px}

/* Transparent navigation over the photo; readable frosted navigation after scrolling. */
.site-header.bpv-header-over-hero {
  position:fixed;inset:0 0 auto;width:100%;z-index:300;
  background:linear-gradient(180deg,rgba(5,32,59,.34),rgba(5,32,59,.045) 86%,transparent);
  border-bottom:1px solid transparent;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  transition:background-color .38s ease,border-color .38s ease,box-shadow .38s ease,backdrop-filter .38s ease;
}
.site-header.bpv-header-over-hero .official-logo {filter:brightness(0) invert(1);transition:filter .3s ease}
.site-header.bpv-header-over-hero .desktop-menu>a:not(.button-primary),
.site-header.bpv-header-over-hero .language-toggle,
.site-header.bpv-header-over-hero .menu-toggle {color:#fff}
.site-header.bpv-header-over-hero .desktop-menu>a:not(.button-primary):after {background:#fff}
.site-header.bpv-header-over-hero .desktop-menu .button-primary.mini {color:var(--navy);background:#fff;border-color:#fff}
.site-header.bpv-header-over-hero .menu-toggle {border-color:rgba(255,255,255,.58)}
.site-header.bpv-header-over-hero.bpv-header-scrolled,
.site-header.bpv-header-over-hero.bpv-header-menu-open {
  background:rgba(252,253,255,.967);border-bottom-color:rgba(26,86,134,.11);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  box-shadow:0 9px 33px rgba(20,69,103,.055);
}
.site-header.bpv-header-over-hero.bpv-header-scrolled .official-logo,
.site-header.bpv-header-over-hero.bpv-header-menu-open .official-logo {filter:none}
.site-header.bpv-header-over-hero.bpv-header-scrolled .desktop-menu>a:not(.button-primary),
.site-header.bpv-header-over-hero.bpv-header-scrolled .language-toggle,
.site-header.bpv-header-over-hero.bpv-header-scrolled .menu-toggle,
.site-header.bpv-header-over-hero.bpv-header-menu-open .desktop-menu>a:not(.button-primary),
.site-header.bpv-header-over-hero.bpv-header-menu-open .language-toggle,
.site-header.bpv-header-over-hero.bpv-header-menu-open .menu-toggle {color:var(--navy)}
.site-header.bpv-header-over-hero.bpv-header-scrolled .desktop-menu>a:not(.button-primary):after,
.site-header.bpv-header-over-hero.bpv-header-menu-open .desktop-menu>a:not(.button-primary):after {background:var(--navy)}
.site-header.bpv-header-over-hero.bpv-header-scrolled .desktop-menu .button-primary.mini,
.site-header.bpv-header-over-hero.bpv-header-menu-open .desktop-menu .button-primary.mini {color:#fff;background:var(--navy);border-color:var(--navy)}
.site-header.bpv-header-over-hero.bpv-header-scrolled .menu-toggle,
.site-header.bpv-header-over-hero.bpv-header-menu-open .menu-toggle {border-color:rgba(26,86,134,.22)}
.site-header.bpv-header-over-hero .language-popover,
.site-header.bpv-header-over-hero .mobile-menu {color:var(--ink)}

/* Real page scroll, no scroll trapping, pinning, snap or scroll handler cancellation. */
html {scroll-snap-type:none}
/* Progressive editorial motion, only switched on if IntersectionObserver is available.
   Images are revealed by a soft bottom-to-top crop. Text arrives gently. */
@media (prefers-reduced-motion:no-preference) {
  .bpv-motion-on .bpv-reveal {
    transition-property:opacity,transform,clip-path;
    transition-duration:.85s,.94s,1.12s;
    transition-timing-function:var(--bpv-ease);
    transition-delay:var(--bpv-reveal-delay,0ms);
  }
  .bpv-motion-on .bpv-reveal:not(.bpv-visible) {
    opacity:0;transform:translate3d(0,29px,0);
  }
  .bpv-motion-on .bpv-reveal.bpv-reveal-text:not(.bpv-visible) {
    opacity:.07;transform:translate3d(0,25px,0);
    clip-path:inset(0 0 14% 0);
  }
  .bpv-motion-on .bpv-reveal.bpv-reveal-media:not(.bpv-visible) {
    opacity:.55;transform:translate3d(0,26px,0);
    clip-path:inset(0 0 17% 0);
  }
  .bpv-motion-on .bpv-reveal.bpv-visible {
    opacity:1;transform:none;clip-path:inset(0 0 0 0);
  }
  /* Precise two-line kinetic typography: no bold, no layout jumps, no new words. */
  .bpv-heading-split .bpv-heading-line {display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
  .bpv-heading-split .bpv-heading-line-inner {display:block;transition:transform 1.02s var(--bpv-ease),opacity .92s var(--bpv-ease)}
  .bpv-motion-on .bpv-heading-split.bpv-reveal:not(.bpv-visible) .bpv-heading-line-inner {
    transform:translate3d(0,90%,0);opacity:.2;
  }
  .bpv-motion-on .bpv-heading-split.bpv-reveal.bpv-visible .bpv-heading-line-inner {transform:none;opacity:1}
  .bpv-heading-line:nth-child(2) .bpv-heading-line-inner {transition-delay:110ms}
  /* Gentle first-load choreography in the hero, using the same original elements. */
  .bpv-hero-entrance .hero .kicker,
  .bpv-hero-entrance .hero .hero-tagline,
  .bpv-hero-entrance .hero .hero-actions {
    animation:bpv-hero-enter .92s var(--bpv-ease) both;
  }
  .bpv-hero-entrance .hero h1 .bpv-heading-line-inner {
    animation:bpv-hero-enter 1.06s var(--bpv-ease) both;
  }
  .bpv-hero-entrance .hero h1 .bpv-heading-line:nth-child(1) .bpv-heading-line-inner {animation-delay:100ms}
  .bpv-hero-entrance .hero h1 .bpv-heading-line:nth-child(2) .bpv-heading-line-inner {animation-delay:205ms}
  .bpv-hero-entrance .hero .kicker {animation-delay:70ms}
  .bpv-hero-entrance .hero .hero-tagline {animation-delay:290ms}
  .bpv-hero-entrance .hero .hero-actions {animation-delay:410ms}
  @keyframes bpv-hero-enter {
    from {opacity:.15;transform:translate3d(0,18px,0)}
    to {opacity:1;transform:none}
  }
  /* Keep natural responsive layout; motion is never positioned or fixed. */
  .bpv-motion-on .bpv-reveal.bpv-visible {will-change:auto}
  .hero .bpv-reveal {transition-duration:1s,1.1s,1.1s}
}
@media (prefers-reduced-motion:reduce) {
  .bpv-reveal {opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
  .site-header.bpv-header-over-hero {transition:none}
  .card-photo img {transition:none}
}
@media (max-width:1020px) {
  .site-header.bpv-header-over-hero .mobile-menu {background:var(--white)}
  .site-header.bpv-header-over-hero .mobile-menu a {color:var(--navy)}
  .site-header.bpv-header-over-hero .mobile-menu .mobile-cta {color:#fff}
}
@media (max-width:720px) {
  .site-header.bpv-header-over-hero .menu-toggle {min-height:42px}
  .bpv-motion-on .bpv-reveal {transition-duration:.65s,.72s,.82s}
  .intro-columns {gap:17px}
}

/* Two visual lines replace the original <br> but keep its line break in every motion mode. */
.bpv-heading-split .bpv-heading-line {display:block;overflow:visible}
@media (prefers-reduced-motion:no-preference) {
  .bpv-motion-on .bpv-heading-split .bpv-heading-line {overflow:hidden}
}
