/* ==========================================================================
   Lake View Farm — section styles (hero, content blocks, forms, footer)
   Companion to lakeview.css.  Loaded last.
   ========================================================================== */

/* ------------------------------------------------------------- 1. Hero */

.lv-hero {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: flex-end;
    padding: 210px 0 60px;
    overflow: hidden;
    background: var(--lv-ink);
    isolation: isolate;
}

.lv-hero-bg {
    position: absolute;
    /* extra bleed so the theme's .img-parallax scrub never exposes an edge */
    inset: -22% 0;
    z-index: -2;
    overflow: hidden;
}

.lv-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.lv-hero-veil {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(27, 24, 21, .78) 0%, rgba(27, 24, 21, .28) 34%, rgba(27, 24, 21, .55) 72%, rgba(27, 24, 21, .88) 100%);
}

.lv-hero-inner {
    width: min(1290px, 100% - 40px);
    margin-inline: auto;
    position: relative;
    z-index: 2;
}

.lv-hero-copy {
    text-align: center;
    max-width: 900px;
    margin: 0 auto 58px;
    color: #fff;
}

/* The GSAP hero timeline animates `.bk-hero-text .hero-slug` and
   `.bk-hero-text .btn-wrap`, so those class names have to stay on the markup.
   These rules re-skin what the original bookora stylesheet puts on them —
   two-class selectors, in a sheet that loads later, so they win. */
.lv-hero .bk-hero-text {
    padding: 0;
    max-width: 900px;
}

.lv-hero .hero-slug,
.lv-hero-slug {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 10px 24px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .28);
    background: rgba(255, 255, 255, .08);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 26px;
}

.lv-hero .hero-slug::before,
.lv-hero .hero-slug::after {
    content: none;
}

.lv-hero .hero-slug i,
.lv-hero-slug i {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--lv-gold);
    margin: 0;
    top: auto;
    left: auto;
    right: auto;
    position: static;
}

.lv-hero h1 {
    font-family: var(--lv-head);
    font-weight: 700;
    font-size: clamp(38px, 6vw, 82px);
    line-height: 1.04;
    letter-spacing: -.03em;
    color: #fff;
    margin: 0 0 24px;
}

.lv-hero h1 em {
    font-style: italic;
    font-weight: 400;
    color: var(--lv-gold);
}

.lv-hero-sub {
    font-size: 18px;
    line-height: 1.75;
    color: rgba(255, 255, 255, .82);
    max-width: 62ch;
    margin: 0 auto 34px;
}

.lv-hero-actions,
.lv-hero .btn-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    margin: 0;
}

/* neutralise the original theme's hero button skin — .lv-btn supplies it */
.lv-hero .btn-wrap a,
.lv-hero .btn-wrap a:last-child {
    margin: 0;
    padding: 16px 34px;
    border-radius: 999px;
    font-size: 15px;
    line-height: 1;
    text-transform: none;
    letter-spacing: 0;
}

/* --- the compact enquiry bar sitting in the hero ----------------------- */

.lv-enquiry-bar {
    background: var(--lv-paper);
    border-radius: 22px;
    padding: 22px;
    box-shadow: var(--lv-shadow-lg);
    border: 1px solid rgba(255, 255, 255, .5);
}

.lv-enquiry-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding: 0 8px 16px;
}

.lv-enquiry-head h2 {
    font-family: var(--lv-head);
    font-size: 17px;
    font-weight: 700;
    margin: 0;
    color: var(--lv-bark);
    display: flex;
    align-items: center;
    gap: 10px;
}

.lv-enquiry-head h2 i {
    color: var(--lv-gold);
}

.lv-enquiry-head span {
    font-size: 13.5px;
    color: var(--lv-muted);
}

.lv-enquiry-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr) auto;
    gap: 12px;
    align-items: end;
}

.lv-field {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.lv-field > label {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--lv-muted);
    padding-left: 2px;
}

.lv-field input,
.lv-field select,
.lv-field textarea {
    width: 100%;
    font-family: var(--lv-body);
    font-size: 15px;
    color: var(--lv-bark);
    background: #fff;
    border: 1px solid var(--lv-line);
    border-radius: 12px;
    padding: 14px 16px;
    transition: border-color .25s, box-shadow .25s, background .25s;
    appearance: none;
    -webkit-appearance: none;
}

.lv-field select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%237d7469' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 40px;
    cursor: pointer;
}

.lv-field textarea {
    resize: vertical;
    min-height: 130px;
    line-height: 1.65;
}

.lv-field input:focus,
.lv-field select:focus,
.lv-field textarea:focus {
    outline: none;
    border-color: var(--lv-gold);
    box-shadow: 0 0 0 4px rgba(194, 157, 104, .18);
}

.lv-field input::placeholder,
.lv-field textarea::placeholder {
    color: #b3aa9d;
}

.lv-enquiry-grid .lv-btn {
    padding: 15px 30px;
    height: 50px;
}

.lv-enquiry-note {
    padding: 14px 8px 0;
    font-size: 13px;
    color: var(--lv-muted);
    display: flex;
    align-items: center;
    gap: 8px;
}

.lv-enquiry-note i {
    color: var(--lv-sage);
}

/* hero marquee strip beneath everything */
.lv-hero-strip {
    position: relative;
    background: var(--lv-bark);
    color: var(--lv-cream);
    padding: 18px 0;
    overflow: hidden;
}

/* jquery.marquee wraps the content in .js-marquee-wrapper > .js-marquee ×2
   (duplicated:true) and relies on floats to keep the copies side by side.
   Floats are fragile here — if either copy is measured before the webfont
   lands, the second one drops onto its own line and the strip renders as two
   stacked rows. Flex on the wrapper pins them into a single row regardless;
   the wrapper's inline width is untouched so the plugin's scroll maths still
   works. */
.lv-hero-strip .marquee-left {
    white-space: nowrap;
}

.lv-hero-strip .js-marquee-wrapper {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.lv-hero-strip .js-marquee {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    white-space: nowrap;
    float: none !important;
}

.lv-strip-item {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    padding: 0 26px;
    font-family: var(--lv-head);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.lv-strip-item i {
    color: var(--lv-gold);
    font-size: 11px;
}

/* -------------------------------------------------------------- 2. About */

.lv-about-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 70px;
    align-items: center;
}

.lv-about-media {
    position: relative;
}

/* Fixed height + containment: the bk-img-app curtain animates the height of
   the inner div, and this wrapper stops that reflow reaching the page. */
.lv-about-media .lv-img-main {
    height: 540px;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: var(--lv-shadow);
    contain: layout paint;
}

.lv-about-media .lv-img-main .bk-img-app {
    height: 100%;
    overflow: hidden;
}

.lv-about-media .lv-img-main img {
    width: 100%;
    height: 540px;
    object-fit: cover;
    display: block;
}

.lv-about-media .lv-img-sub {
    position: absolute;
    right: -34px;
    bottom: -44px;
    width: 250px;
    border-radius: 20px;
    overflow: hidden;
    border: 8px solid var(--lv-paper);
    box-shadow: var(--lv-shadow);
}

.lv-about-media .lv-img-sub img {
    width: 100%;
    height: 210px;
    object-fit: cover;
    display: block;
}

.lv-about-badge {
    position: absolute;
    left: -28px;
    top: 40px;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: var(--lv-gold);
    color: #fff;
    display: grid;
    place-content: center;
    text-align: center;
    box-shadow: 0 20px 44px rgba(194, 157, 104, .4);
}

.lv-about-badge strong {
    display: block;
    font-family: var(--lv-head);
    font-size: 38px;
    line-height: 1;
}

.lv-about-badge span {
    font-size: 11.5px;
    letter-spacing: .16em;
    text-transform: uppercase;
    opacity: .9;
}

.lv-about-points {
    list-style: none;
    margin: 30px 0 34px;
    padding: 0;
    display: grid;
    gap: 16px;
}

.lv-about-points li {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    font-size: 15.5px;
    line-height: 1.7;
    color: var(--lv-bark);
}

.lv-about-points i {
    flex: none;
    width: 26px;
    height: 26px;
    margin-top: 2px;
    border-radius: 50%;
    background: rgba(194, 157, 104, .16);
    color: var(--lv-gold-2);
    display: grid;
    place-items: center;
    font-size: 11px;
}

/* ------------------------------------------------- 3. Stats / facilities */

.lv-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    padding: 54px 0 0;
    margin-top: 54px;
    border-top: 1px solid var(--lv-line);
}

.lv-sec--dark .lv-stats {
    border-color: rgba(243, 238, 231, .16);
}

.lv-stat strong {
    display: flex;
    align-items: baseline;
    font-family: var(--lv-head);
    font-size: 52px;
    font-weight: 700;
    line-height: 1;
    color: var(--lv-gold);
}

/* direct child only — odometer builds a tree of <span>s inside the <strong> */
.lv-stat > span {
    display: block;
    margin-top: 10px;
    font-size: 14px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--lv-muted);
}

.lv-stat .odometer {
    display: inline-block;
    line-height: 1;
}

.lv-sec--dark .lv-stat > span {
    color: rgba(243, 238, 231, .68);
}

.lv-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
}

.lv-feature {
    position: relative;
    padding: 40px 34px;
    border-radius: var(--lv-radius);
    background: var(--lv-paper);
    border: 1px solid var(--lv-line);
    overflow: hidden;
    transition: transform .45s cubic-bezier(.2, .8, .2, 1), box-shadow .45s, border-color .45s;
}

.lv-sec--cream .lv-feature {
    background: #fff;
}

.lv-feature::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 3px;
    background: var(--lv-gold);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .5s cubic-bezier(.2, .8, .2, 1);
}

.lv-feature:hover {
    transform: translateY(-8px);
    box-shadow: var(--lv-shadow);
    border-color: rgba(194, 157, 104, .4);
}

.lv-feature:hover::before {
    transform: scaleX(1);
}

.lv-feature-ico {
    width: 62px;
    height: 62px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: rgba(194, 157, 104, .14);
    color: var(--lv-gold-2);
    font-size: 24px;
    margin-bottom: 22px;
    transition: background .4s, color .4s;
}

.lv-feature:hover .lv-feature-ico {
    background: var(--lv-gold);
    color: #fff;
}

.lv-feature h3 {
    font-family: var(--lv-head);
    font-size: 21px;
    font-weight: 700;
    margin: 0 0 12px;
    color: var(--lv-bark);
}

.lv-feature p {
    margin: 0;
    font-size: 15px;
    line-height: 1.75;
    color: var(--lv-muted);
}

/* ------------------------------------------------------------ 4. Venues */

.lv-venue-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.lv-venue {
    position: relative;
    /* column layout so the meta strip and price row line up across cards
       regardless of how long each description runs */
    display: flex;
    flex-direction: column;
    border-radius: var(--lv-radius);
    overflow: hidden;
    background: #fff;
    box-shadow: 0 12px 34px rgba(43, 38, 34, .08);
    transition: transform .5s cubic-bezier(.2, .8, .2, 1), box-shadow .5s;
}

.lv-venue:hover {
    transform: translateY(-10px);
    box-shadow: var(--lv-shadow-lg);
}

.lv-venue-img {
    position: relative;
    overflow: hidden;
    height: 260px;
}

.lv-venue-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 1.1s cubic-bezier(.2, .8, .2, 1);
}

.lv-venue:hover .lv-venue-img img {
    transform: scale(1.08);
}

.lv-venue-cap {
    position: absolute;
    top: 16px;
    right: 16px;
    padding: 8px 16px;
    border-radius: 999px;
    background: rgba(27, 24, 21, .86);
    color: var(--lv-gold);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .08em;
}

.lv-venue-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 28px 28px 30px;
}

.lv-venue-body h3 {
    font-family: var(--lv-head);
    font-size: 23px;
    font-weight: 700;
    margin: 0 0 10px;
    color: var(--lv-bark);
}

.lv-venue-body p {
    font-size: 15px;
    line-height: 1.7;
    color: var(--lv-muted);
    margin: 0 0 20px;
}

.lv-venue-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    /* pushed to the bottom so every card's price row sits at the same height */
    margin-top: auto;
    padding: 18px 0;
    margin-bottom: 20px;
    border-top: 1px solid var(--lv-line);
    border-bottom: 1px solid var(--lv-line);
    font-size: 13.5px;
    color: var(--lv-muted);
}

.lv-venue-meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.lv-venue-meta i {
    color: var(--lv-gold-2);
    font-size: 12px;
}

.lv-venue-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

/* ----------------------------------------------------------- 5. Packages */

.lv-pkg-wrap {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 60px;
    align-items: center;
}

.lv-pkg-img {
    border-radius: 24px;
    overflow: hidden;
    box-shadow: var(--lv-shadow);
}

.lv-pkg-img img {
    width: 100%;
    height: 560px;
    object-fit: cover;
    display: block;
    transition: opacity .5s ease;
}

.lv-acc-item {
    border: 1px solid var(--lv-line);
    border-radius: 16px;
    background: #fff;
    margin-bottom: 14px;
    overflow: hidden;
    transition: border-color .35s, box-shadow .35s;
}

.lv-acc-item.is-open {
    border-color: rgba(194, 157, 104, .5);
    box-shadow: 0 16px 40px rgba(43, 38, 34, .08);
}

.lv-acc-head {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 26px;
    background: transparent;
    border: 0;
    cursor: pointer;
    text-align: left;
    font-family: var(--lv-head);
    font-size: 18px;
    font-weight: 700;
    color: var(--lv-bark);
}

/* the button also carries Bootstrap's .accordion-button, because script.js
   listens on that class to cross-fade the companion image. Undo the parts of
   Bootstrap's skin that would otherwise show through. */
.lv-acc-item .lv-acc-head,
.lv-acc-item .lv-acc-head:not(.collapsed),
.lv-acc-item .lv-acc-head:focus {
    background: transparent;
    box-shadow: none;
    color: var(--lv-bark);
    outline: none;
}

.lv-acc-item .lv-acc-head:focus-visible {
    box-shadow: 0 0 0 3px rgba(194, 157, 104, .35);
}

.lv-acc-item .lv-acc-head::after {
    content: none;
}

.lv-acc-head small {
    display: block;
    margin-top: 5px;
    font-family: var(--lv-body);
    font-size: 13.5px;
    font-weight: 500;
    color: var(--lv-gold-2);
    letter-spacing: .04em;
}

.lv-acc-head .lv-acc-sign {
    flex: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid var(--lv-line);
    display: grid;
    place-items: center;
    font-size: 12px;
    color: var(--lv-bark);
    transition: transform .4s, background .3s, color .3s, border-color .3s;
}

.lv-acc-item.is-open .lv-acc-sign {
    transform: rotate(180deg);
    background: var(--lv-gold);
    border-color: var(--lv-gold);
    color: #fff;
}

.lv-acc-body {
    display: none;
    padding: 0 26px 26px;
}

.lv-acc-body p {
    margin: 0 0 16px;
    font-size: 15px;
    line-height: 1.8;
    color: var(--lv-muted);
}

.lv-acc-body ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 20px;
}

.lv-acc-body li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14.5px;
    color: var(--lv-bark);
}

.lv-acc-body li i {
    color: var(--lv-gold-2);
    font-size: 11px;
}

/* ------------------------------------------------------------ 6. Pricing */

.lv-price-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    align-items: stretch;
}

.lv-price {
    display: flex;
    flex-direction: column;
    padding: 42px 34px 38px;
    border-radius: var(--lv-radius);
    background: #fff;
    border: 1px solid var(--lv-line);
    transition: transform .45s cubic-bezier(.2, .8, .2, 1), box-shadow .45s;
}

.lv-price:hover {
    transform: translateY(-8px);
    box-shadow: var(--lv-shadow);
}

.lv-price.is-featured {
    background: var(--lv-bark);
    border-color: var(--lv-bark);
    color: var(--lv-cream);
    box-shadow: var(--lv-shadow-lg);
}

.lv-price-flag {
    display: inline-block;
    align-self: flex-start;
    padding: 6px 16px;
    border-radius: 999px;
    background: var(--lv-gold);
    color: #fff;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.lv-price h3 {
    font-family: var(--lv-head);
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 8px;
}

.lv-price > p {
    font-size: 14.5px;
    line-height: 1.7;
    color: var(--lv-muted);
    margin: 0 0 24px;
}

.lv-price.is-featured > p {
    color: rgba(243, 238, 231, .72);
}

.lv-price-amount {
    display: flex;
    align-items: baseline;
    gap: 6px;
    padding-bottom: 24px;
    margin-bottom: 24px;
    border-bottom: 1px solid var(--lv-line);
}

.lv-price.is-featured .lv-price-amount {
    border-color: rgba(243, 238, 231, .18);
}

.lv-price-amount strong {
    font-family: var(--lv-head);
    font-size: 46px;
    font-weight: 700;
    line-height: 1;
    color: var(--lv-gold);
}

.lv-price-amount span {
    font-size: 14px;
    color: var(--lv-muted);
}

.lv-price.is-featured .lv-price-amount span {
    color: rgba(243, 238, 231, .66);
}

.lv-price ul {
    list-style: none;
    margin: 0 0 30px;
    padding: 0;
    display: grid;
    gap: 13px;
    flex: 1;
}

.lv-price li {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    font-size: 14.5px;
    line-height: 1.6;
}

.lv-price li i {
    flex: none;
    margin-top: 4px;
    font-size: 11px;
    color: var(--lv-gold-2);
}

.lv-price.is-featured li i {
    color: var(--lv-gold);
}

.lv-price-foot {
    font-size: 13px;
    color: var(--lv-muted);
    text-align: center;
    margin: 14px 0 0;
}

/* ------------------------------------------------------------ 7. Gallery */

.lv-gallery {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 210px;
    /* dense back-fills the holes the wide/tall spans would otherwise leave */
    grid-auto-flow: dense;
    gap: 18px;
}

.lv-gal-item {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    display: block;
}

.lv-gal-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 1.1s cubic-bezier(.2, .8, .2, 1);
}

.lv-gal-item:hover img {
    transform: scale(1.07);
}

.lv-gal-item::after {
    content: "\f00e";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgba(27, 24, 21, .5);
    color: #fff;
    font-size: 22px;
    opacity: 0;
    transition: opacity .4s ease;
}

.lv-gal-item:hover::after {
    opacity: 1;
}

.lv-gal-item.is-tall {
    grid-row: span 2;
}

.lv-gal-item.is-wide {
    grid-column: span 2;
}

/* ------------------------------------------------------- 8. Testimonials */

.lv-testi-sec {
    position: relative;
    background: var(--lv-bark);
    color: var(--lv-cream);
    overflow: hidden;
}

.lv-testi-bg {
    position: absolute;
    inset: 0;
    opacity: .14;
}

.lv-testi-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lv-testi-sec > .lv-shell {
    position: relative;
    z-index: 2;
}

.lv-testi-slider {
    padding-bottom: 60px;
}

/* equal-height cards regardless of quote length */
.lv-testi-slider .swiper-slide {
    height: auto;
    display: flex;
}

.lv-testi {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 40px 34px;
    border-radius: var(--lv-radius);
    background: rgba(243, 238, 231, .06);
    border: 1px solid rgba(243, 238, 231, .14);
}

.lv-testi-stars {
    color: var(--lv-gold);
    font-size: 13px;
    letter-spacing: 3px;
    margin-bottom: 18px;
}

.lv-testi p {
    font-size: 16px;
    line-height: 1.85;
    color: rgba(243, 238, 231, .86);
    margin: 0 0 26px;
}

.lv-testi-by {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: auto;
    padding-top: 22px;
    border-top: 1px solid rgba(243, 238, 231, .14);
}

.lv-testi-by img {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    object-fit: cover;
}

.lv-testi-by strong {
    display: block;
    font-family: var(--lv-head);
    font-size: 16px;
    color: var(--lv-cream);
}

.lv-testi-by span {
    font-size: 13px;
    color: var(--lv-gold);
}

.lv-testi-slider .swiper-pagination {
    bottom: 0;
}

.lv-testi-slider .swiper-pagination-bullet {
    width: 9px;
    height: 9px;
    background: rgba(243, 238, 231, .4);
    opacity: 1;
}

.lv-testi-slider .swiper-pagination-bullet-active {
    background: var(--lv-gold);
    width: 26px;
    border-radius: 6px;
}

/* --------------------------------------------------------------- 9. Blog */

.lv-blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.lv-post {
    border-radius: var(--lv-radius);
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--lv-line);
    transition: transform .45s cubic-bezier(.2, .8, .2, 1), box-shadow .45s;
}

.lv-post:hover {
    transform: translateY(-8px);
    box-shadow: var(--lv-shadow);
}

.lv-post-img {
    height: 230px;
    overflow: hidden;
}

.lv-post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.1s cubic-bezier(.2, .8, .2, 1);
}

.lv-post:hover .lv-post-img img {
    transform: scale(1.07);
}

.lv-post-body {
    padding: 28px;
}

.lv-post-meta {
    display: flex;
    gap: 18px;
    font-size: 13px;
    color: var(--lv-muted);
    margin-bottom: 12px;
}

.lv-post-meta i {
    color: var(--lv-gold-2);
    margin-right: 6px;
    font-size: 11px;
}

.lv-post-body h3 {
    font-family: var(--lv-head);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 12px;
    color: var(--lv-bark);
}

.lv-post-body p {
    font-size: 14.5px;
    line-height: 1.75;
    color: var(--lv-muted);
    margin: 0 0 18px;
}

.lv-post-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-family: var(--lv-head);
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--lv-gold-2);
}

.lv-post-link i {
    transition: transform .35s;
}

.lv-post-link:hover i {
    transform: translateX(5px);
}

/* ------------------------------------------------------------ 10. Contact */

.lv-contact-grid {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 60px;
    align-items: start;
}

.lv-contact-list {
    display: grid;
    gap: 22px;
    margin: 32px 0 0;
    padding: 0;
    list-style: none;
}

.lv-contact-list li {
    display: flex;
    gap: 18px;
    align-items: flex-start;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--lv-line);
}

.lv-contact-list li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.lv-contact-ico {
    flex: none;
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: rgba(194, 157, 104, .14);
    color: var(--lv-gold-2);
    display: grid;
    place-items: center;
    font-size: 18px;
}

.lv-contact-list h4 {
    font-family: var(--lv-head);
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 5px;
    color: var(--lv-bark);
}

.lv-contact-list p,
.lv-contact-list a {
    margin: 0;
    font-size: 15px;
    line-height: 1.7;
    color: var(--lv-muted);
}

.lv-contact-list a:hover {
    color: var(--lv-gold-2);
}

.lv-form-card {
    background: #fff;
    border: 1px solid var(--lv-line);
    border-radius: 24px;
    padding: 44px;
    box-shadow: var(--lv-shadow);
}

.lv-form-card h3 {
    font-family: var(--lv-head);
    font-size: 26px;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--lv-bark);
}

.lv-form-card > p {
    font-size: 15px;
    color: var(--lv-muted);
    margin: 0 0 28px;
}

.lv-form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.lv-form-grid .lv-col-full {
    grid-column: 1 / -1;
}

/* form response messages, shared by both forms */
.lv-form-msg {
    display: none;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border-radius: 12px;
    font-size: 14.5px;
    line-height: 1.6;
    margin-bottom: 20px;
}

.lv-form-msg.is-ok {
    display: flex;
    background: rgba(95, 112, 89, .12);
    color: #46583f;
    border: 1px solid rgba(95, 112, 89, .3);
}

.lv-form-msg.is-err {
    display: flex;
    background: rgba(178, 74, 60, .1);
    color: #a2402f;
    border: 1px solid rgba(178, 74, 60, .28);
}

.lv-enquiry-bar .lv-form-msg {
    margin: 0 0 16px;
}

/* ----------------------------------------------------------- 11. Location */

.lv-location-grid {
    display: grid;
    grid-template-columns: 1.25fr 1fr;
    gap: 34px;
    align-items: stretch;
}

.lv-map {
    position: relative;
    min-height: 460px;
    border-radius: 24px;
    overflow: hidden;
    border: 1px solid var(--lv-line);
    box-shadow: var(--lv-shadow);
    background: var(--lv-cream-2);
}

/* shown until the embed mounts, then removed */
.lv-map-placeholder {
    position: absolute;
    inset: 0;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 12px;
    color: var(--lv-muted);
    font-size: 14px;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.lv-map-placeholder i {
    font-size: 30px;
    color: var(--lv-gold);
    opacity: .7;
}

.lv-map-fallback {
    margin-top: 14px;
    font-size: 15px;
}

.lv-map-fallback a {
    color: var(--lv-gold-2);
    font-weight: 600;
}

.lv-map iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

.lv-location-card {
    display: flex;
    flex-direction: column;
    padding: 40px 36px;
    border-radius: 24px;
    background: var(--lv-bark);
    color: var(--lv-cream);
    box-shadow: var(--lv-shadow);
}

.lv-location-card h3 {
    font-family: var(--lv-head);
    font-size: 26px;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--lv-cream);
}

.lv-location-address {
    font-size: 15px;
    line-height: 1.75;
    color: rgba(243, 238, 231, .72);
    margin: 0 0 26px;
    padding-bottom: 26px;
    border-bottom: 1px solid rgba(243, 238, 231, .16);
}

.lv-location-list {
    list-style: none;
    margin: 0 0 30px;
    padding: 0;
    display: grid;
    gap: 22px;
    flex: 1;
}

.lv-location-list li {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.lv-location-list .lv-contact-ico {
    background: rgba(194, 157, 104, .18);
    color: var(--lv-gold);
}

.lv-location-list h4 {
    font-family: var(--lv-head);
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 4px;
    color: var(--lv-cream);
}

.lv-location-list p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.7;
    color: rgba(243, 238, 231, .7);
}

.lv-location-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.lv-location-actions .lv-btn {
    flex: 1 1 190px;
}

.lv-location-actions .lv-btn--outline {
    border-color: rgba(243, 238, 231, .3);
    color: var(--lv-cream);
}

.lv-location-actions .lv-btn--outline:hover {
    border-color: var(--lv-gold);
    color: var(--lv-gold);
}

/* --------------------------------------------------- 12. Popup enquiry */

.lv-modal {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: grid;
    place-items: center;
    padding: 24px;
}

.lv-modal[hidden] {
    display: none;
}

.lv-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(27, 24, 21, .62);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    opacity: 0;
    transition: opacity .32s ease;
}

.lv-modal.is-open .lv-modal-backdrop {
    opacity: 1;
}

.lv-modal-panel {
    position: relative;
    width: min(720px, 100%);
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding: 40px;
    border-radius: 24px;
    background: var(--lv-paper);
    box-shadow: var(--lv-shadow-lg);
    opacity: 0;
    transform: translateY(24px) scale(.97);
    transition: opacity .32s ease, transform .32s cubic-bezier(.2, .8, .2, 1);
    -webkit-overflow-scrolling: touch;
}

.lv-modal.is-open .lv-modal-panel {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.lv-modal-close {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid var(--lv-line);
    background: #fff;
    color: var(--lv-bark);
    display: grid;
    place-items: center;
    cursor: pointer;
    z-index: 2;
    transition: background .25s, color .25s, border-color .25s;
}

.lv-modal-close:hover {
    background: var(--lv-bark);
    border-color: var(--lv-bark);
    color: #fff;
}

.lv-modal-head {
    display: flex;
    align-items: center;
    gap: 18px;
    padding-right: 48px;
    margin-bottom: 26px;
}

.lv-modal-mark {
    flex: none;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--lv-cream);
}

.lv-modal-head h3 {
    font-family: var(--lv-head);
    font-size: 24px;
    font-weight: 700;
    margin: 0 0 5px;
    color: var(--lv-bark);
}

.lv-modal-head p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--lv-muted);
}

.lv-modal-foot {
    margin: 22px 0 0;
    padding-top: 20px;
    border-top: 1px solid var(--lv-line);
    font-size: 14px;
    color: var(--lv-muted);
    text-align: center;
}

.lv-modal-foot a {
    color: var(--lv-gold-2);
    font-weight: 600;
}

body.lv-modal-open {
    overflow: hidden;
}

/* ------------------------------------------- 13. Floating contact button */

.lv-fab {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1100;
    display: flex;
    /* DOM order is WhatsApp, Call, toggle — so the toggle sits in the corner
       and the two shortcuts stack upward above it */
    flex-direction: column;
    align-items: flex-end;
    gap: 14px;
}

.lv-fab-toggle {
    width: 58px;
    height: 58px;
    border: 0;
    border-radius: 50%;
    background: var(--lv-gold);
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    box-shadow: 0 14px 34px rgba(194, 157, 104, .45);
    transition: transform .4s cubic-bezier(.2, .8, .2, 1), background .3s;
}

.lv-fab-toggle:hover {
    background: var(--lv-gold-2);
}

.lv-fab-toggle i {
    display: block;
    transition: transform .4s cubic-bezier(.2, .8, .2, 1);
}

.lv-fab.is-open .lv-fab-toggle {
    background: var(--lv-bark);
}

.lv-fab.is-open .lv-fab-toggle i {
    transform: rotate(135deg);
}

.lv-fab-item {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 50px;
    padding: 0 20px 0 15px;
    border-radius: 999px;
    color: #fff;
    font-family: var(--lv-head);
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: 0 12px 28px rgba(27, 24, 21, .28);
    /* folded away until the toggle is pressed */
    opacity: 0;
    visibility: hidden;
    transform: translateY(14px) scale(.85);
    transition: opacity .3s ease, transform .38s cubic-bezier(.2, .8, .2, 1), visibility .3s;
}

.lv-fab-item i {
    font-size: 19px;
}

.lv-fab.is-open .lv-fab-item {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}

/* stagger so they spring out one after the other */
.lv-fab.is-open .lv-fab-call {
    transition-delay: .05s;
}

.lv-fab.is-open .lv-fab-wa {
    transition-delay: .12s;
}

.lv-fab-wa {
    background: #25d366;
}

.lv-fab-wa:hover {
    background: #1eb455;
    color: #fff;
}

.lv-fab-call {
    background: var(--lv-bark);
}

.lv-fab-call:hover {
    background: var(--lv-ink);
    color: #fff;
}

/* ------------------------------------------------------------- 14. Footer */

.lv-footer {
    background: var(--lv-ink);
    color: rgba(243, 238, 231, .7);
    padding: 86px 0 0;
}

.lv-footer-top {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1.3fr;
    gap: 48px;
    padding-bottom: 60px;
    border-bottom: 1px solid rgba(243, 238, 231, .12);
}

.lv-footer-brand img {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--lv-cream);
    margin-bottom: 22px;
}

.lv-footer p {
    font-size: 15px;
    line-height: 1.85;
    margin: 0 0 20px;
}

.lv-footer h4 {
    font-family: var(--lv-head);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--lv-cream);
    margin: 0 0 24px;
}

.lv-footer ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 13px;
}

.lv-footer ul a {
    font-size: 15px;
    color: rgba(243, 238, 231, .7);
    transition: color .3s, padding-left .3s;
}

.lv-footer ul a:hover {
    color: var(--lv-gold);
    padding-left: 6px;
}

.lv-footer-hours li {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    font-size: 14.5px;
    padding-bottom: 12px;
    border-bottom: 1px dashed rgba(243, 238, 231, .14);
}

.lv-footer-hours li span:last-child {
    color: var(--lv-gold);
}

.lv-social {
    display: flex;
    gap: 12px;
    margin-top: 26px;
}

.lv-social a {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid rgba(243, 238, 231, .2);
    display: grid;
    place-items: center;
    color: rgba(243, 238, 231, .8);
    font-size: 14px;
    transition: background .3s, color .3s, border-color .3s, transform .35s;
}

.lv-social a:hover {
    background: var(--lv-gold);
    border-color: var(--lv-gold);
    color: #fff;
    transform: translateY(-3px);
}

.lv-footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    padding: 26px 0;
    font-size: 14px;
}

.lv-footer-bottom a {
    color: rgba(243, 238, 231, .7);
}

.lv-footer-bottom a:hover {
    color: var(--lv-gold);
}

/* scroll to top — script.js fadeIn()s this, which restores display:block,
   so centre the glyph with line-height rather than grid */
.bk-scrollup {
    position: fixed;
    /* bottom-left: the floating contact button owns the bottom-right corner */
    left: 24px;
    bottom: 24px;
    z-index: 800;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: none;
    text-align: center;
    line-height: 50px;
    background: var(--lv-gold);
    color: #fff;
    cursor: pointer;
    box-shadow: 0 14px 34px rgba(194, 157, 104, .4);
    transition: background .3s, transform .35s;
}

.bk-scrollup:hover {
    background: var(--lv-bark);
    transform: translateY(-3px);
}

/* ---------------------------------------------------------- 12. Responsive */

@media (max-width: 1400px) {
    .lv-nav ul {
        gap: 24px;
    }

    .lv-nav a {
        font-size: 13px;
        letter-spacing: .07em;
    }
}

/* Between the burger breakpoint and ~1300px the two nav halves plus the logo
   already fill the bar; keeping the CTA pushed it past the viewport edge and
   gave the whole page a horizontal scrollbar. Drop the CTA first, collapse to
   the burger later. */
@media (max-width: 1300px) {
    .lv-header-cta {
        display: none;
    }

    .lv-nav--right {
        justify-content: flex-start;
    }
}

@media (max-width: 1200px) {
    .lv-enquiry-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .lv-enquiry-grid .lv-btn {
        grid-column: 1 / -1;
    }

    .lv-about-grid,
    .lv-pkg-wrap,
    .lv-contact-grid,
    .lv-location-grid {
        grid-template-columns: 1fr;
        gap: 56px;
    }

    .lv-location-grid {
        gap: 28px;
    }

    .lv-map {
        min-height: 400px;
    }

    /* the packages photo sits above the accordion once stacked — 560px of
       image before any copy is too much scrolling */
    .lv-pkg-img img {
        height: 380px;
    }

    .lv-about-media .lv-img-sub {
        right: 0;
    }

    .lv-venue-grid,
    .lv-feature-grid,
    .lv-price-grid,
    .lv-blog-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .lv-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px 30px;
    }
}

@media (max-width: 1080px) {

    /* header collapses to: logo centred, burger right */
    .lv-header-inner {
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    }

    .lv-nav--left ul,
    .lv-nav--right ul {
        display: none;
    }

    .lv-header-cta {
        display: none;
    }

    .lv-nav--right {
        justify-content: flex-end;
    }

    .lv-burger {
        display: block;
    }


    .lv-hero {
        padding-top: 190px;
    }
}

@media (max-width: 860px) {
    .lv-sec {
        padding: 84px 0;
    }

    .lv-sec--tight {
        padding: 64px 0;
    }

    .lv-hero {
        min-height: auto;
        padding: 175px 0 48px;
    }

    .lv-enquiry-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Card grids stay two-up down to 700px — a tablet is wide enough for two
       venue cards, and a single column here made them read as banners. They
       drop to one column in the 700px block further down. */
    .lv-form-grid {
        grid-template-columns: 1fr;
    }

    .lv-gallery {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 180px;
    }

    .lv-gal-item.is-wide {
        grid-column: span 2;
    }

    .lv-footer-top {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px;
    }

    .lv-acc-body ul {
        grid-template-columns: 1fr;
    }

    .lv-form-card {
        padding: 30px 24px;
    }

    .lv-about-media .lv-img-main,
    .lv-about-media .lv-img-main img {
        height: 380px;
    }

    .lv-about-badge {
        left: 12px;
        width: 112px;
        height: 112px;
    }

    .lv-about-badge strong {
        font-size: 30px;
    }

    .lv-map {
        min-height: 320px;
    }

    .lv-location-card {
        padding: 30px 24px;
    }

    .lv-modal {
        padding: 0;
        place-items: end stretch;
    }

    .lv-modal-panel {
        width: 100%;
        max-height: 92vh;
        padding: 28px 20px 32px;
        border-radius: 22px 22px 0 0;
        transform: translateY(40px);
    }

    .lv-modal-head {
        gap: 14px;
        margin-bottom: 20px;
    }

    .lv-modal-mark {
        width: 50px;
        height: 50px;
    }

    .lv-modal-head h3 {
        font-size: 21px;
    }

    /* the popup textarea does not need to be tall on a phone */
    .lv-modal .lv-field textarea {
        min-height: 92px;
    }
}

@media (max-width: 700px) {

    .lv-venue-grid,
    .lv-feature-grid,
    .lv-price-grid,
    .lv-blog-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .lv-brand {
        width: 92px;
        height: 92px;
    }


    .lv-enquiry-grid {
        grid-template-columns: 1fr;
    }

    .lv-hero-actions .lv-btn {
        width: 100%;
    }

    .lv-stats,
    .lv-footer-top {
        grid-template-columns: 1fr;
    }

    .lv-gallery {
        grid-template-columns: 1fr;
    }

    .lv-gal-item.is-wide,
    .lv-gal-item.is-tall {
        grid-column: auto;
        grid-row: auto;
    }

    .lv-about-media .lv-img-sub {
        display: none;
    }

    .lv-location-actions .lv-btn {
        flex: 1 1 100%;
    }

    /* the logo is already in the header — drop it from the popup so the
       heading gets the full width beside the close button */
    .lv-modal-mark {
        display: none;
    }

    .lv-modal-head {
        padding-right: 54px;
    }

    /* pull the floating controls in from the edges on small screens */
    .lv-fab {
        right: 16px;
        bottom: 16px;
        gap: 12px;
    }

    .lv-fab-toggle {
        width: 52px;
        height: 52px;
        font-size: 18px;
    }

    .lv-fab-item {
        height: 46px;
        font-size: 13px;
    }

    .bk-scrollup {
        left: 16px;
        bottom: 16px;
        width: 44px;
        height: 44px;
        line-height: 44px;
    }
}