@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@300;400;500&display=swap'); :root {
    --abyssal: #faf9f6;
    --seafoam: #334455;
    --gold: #2b82c9;
    --crashing: #0f2238;
    --footer-navy: #0B1525;
    --footer-muted: #cbd5e0;
    --white: #fff;
    --sand: #eae2d5;
    --serif: 'Montserrat',Georgia,serif;
    --sans: 'Inter',Arial,sans-serif;
    --mono: 'JetBrains Mono',monospace
}

* {
    box-sizing: border-box
}

/* Reset universale per una corretta gestione del box model */
*, *::before, *::after {
    box-sizing: border-box;
}

/* Opzionale: rimuovi margini di default che possono causare overflow orizzontale */
body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    /* Previene scroll orizzontali indesiderati */
}

div.ccm-panel-content ul.nav, div.ccm-panel-content menu {
    display: block;
}

#ccm-theme-grid-edit-mode-row-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

::-moz-selection {
    background-color: #272727;
    color: #fff;
    text-shadow: none
}

::selection {
    background-color: #272727;
    color: #fff;
    text-shadow: none
}

/* Global Styles */


 .placeholder-cream\/30: :placeholder {
        color:#0f22384d
    }

    @supports (color: color-mix(in lab,red,red)) {
        .placeholder-cream\/30::placeholder {
            color:color-mix(in oklab,var(--color-cream) 30%,transparent)
        }
    }

    .placeholder-cream\/40: :placeholder {
        color:#0f223866
    }

    @supports (color: color-mix(in lab,red,red)) {
        .placeholder-cream\/40::placeholder {
            color:color-mix(in oklab,var(--color-cream) 40%,transparent)
        }
    }

    .opacity-0 {
        opacity: 0
    }

    .opacity-15 {
        opacity: .15
    }

    .opacity-20 {
        opacity: .2
    }

    .opacity-30 {
        opacity: .3
    }

    .opacity-55 {
        opacity: .55
    }

    .opacity-60 {
        opacity: .6
    }

    .opacity-65 {
        opacity: .65
    }

    .opacity-70 {
        opacity: .7
    }

    .opacity-75 {
        opacity: .75
    }

    .opacity-80 {
        opacity: .8
    }

    .shadow-2xl {
        --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color,#00000040);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }

    .shadow-inner {
        --tw-shadow: inset 0 2px 4px 0 var(--tw-shadow-color,#0000000d);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }

    .shadow-lg {
        --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }

    .shadow-md {
        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }

    .shadow-sm {
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }

    .shadow-xl {
        --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }

    .blur-3xl {
        --tw-blur: blur(var(--blur-3xl));
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .blur-\[40px\] {
        --tw-blur: blur(40px);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .blur-\[60px\] {
        --tw-blur: blur(60px);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .blur-\[100px\] {
        --tw-blur: blur(100px);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .blur-\[120px\] {
        --tw-blur: blur(120px);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .blur-\[140px\] {
        --tw-blur: blur(140px);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .blur-\[150px\] {
        --tw-blur: blur(150px);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .blur-\[160px\] {
        --tw-blur: blur(160px);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .blur-\[180px\] {
        --tw-blur: blur(180px);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .brightness-95 {
        --tw-brightness: brightness(95%);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .brightness-\[0\.92\] {
        --tw-brightness: brightness(.92);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .brightness-\[0\.94\] {
        --tw-brightness: brightness(.94);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .brightness-\[0\.95\] {
        --tw-brightness: brightness(.95);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .brightness-\[0\.96\] {
        --tw-brightness: brightness(.96);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .brightness-\[0\.97\] {
        --tw-brightness: brightness(.97);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .brightness-\[0\.98\] {
        --tw-brightness: brightness(.98);
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .backdrop-blur-md {
        --tw-backdrop-blur: blur(var(--blur-md));
        -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
        backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)
    }

    .backdrop-blur-sm {
        --tw-backdrop-blur: blur(var(--blur-sm));
        -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
        backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)
    }

    .backdrop-blur-xs {
        --tw-backdrop-blur: blur(var(--blur-xs));
        -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
        backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)
    }

    .transition {
        transition-property: color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    .transition-all {
        transition-property: all;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    .transition-colors {
        transition-property: color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    .transition-opacity {
        transition-property: opacity;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    .transition-transform {
        transition-property: transform,translate,scale,rotate;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    .duration-300 {
        --tw-duration: .3s;
        transition-duration: .3s
    }

    .duration-500 {
        --tw-duration: .5s;
        transition-duration: .5s
    }

    .duration-700 {
        --tw-duration: .7s;
        transition-duration: .7s
    }

    .duration-1000,.duration-\[1s\] {
        --tw-duration: 1s;
        transition-duration: 1s
    }

    .duration-\[2\.5s\] {
        --tw-duration: 2.5s;
        transition-duration: 2.5s
    }

    .duration-\[2s\] {
        --tw-duration: 2s;
        transition-duration: 2s
    }

    .duration-\[3s\] {
        --tw-duration: 3s;
        transition-duration: 3s
    }

    .ease-out {
        --tw-ease: var(--ease-out);
        transition-timing-function: var(--ease-out)
    }

    .select-none {
        -webkit-user-select: none;
        user-select: none
    }


   .shadow-2xl {
        --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color,#00000040);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }



/* Assicurati che il wrapper non blocchi l'altezza totale */
#smooth-wrapper {
    height: 100vh;
    overflow: hidden;
    /* ScrollSmoother gestisce questo overflow */
    width: 100%;
}

#smooth-content {
    overflow: visible;

    min-height: 100vh;
    width: 100%;
}

html,body {
    margin: 0;
    background: var(--abyssal);
    color: var(--crashing);
    font-family: var(--sans);
    overflow-x: hidden
}

body.is-locked {
    overflow: hidden
}

a {
    color: inherit;
    text-decoration: none
}

img {
    max-width: 100%;
    display: block
}

::selection {
    background: var(--gold);
    color: white
}

.dg-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 100%;
    transform: scaleX(0);
    transform-origin: left;
    background: var(--gold);
    z-index: 10000
}

#water-canvas {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    opacity: .16
}

#smooth-wrapper,#smooth-content {
    position: relative;
    z-index: 1
}

.site-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 3;
    padding: 20px 48px;
    border-bottom: 1px solid transparent;
    transition: .45s ease;
    text-transform: uppercase
}

.site-header.is-scrolled {
    padding: 14px 48px;
    background: rgba(250,249,246,.94);
    backdrop-filter: blur(18px);
    border-color: rgba(15,34,56,.1);
    box-shadow: 0 10px 30px rgba(15,34,56,.05)
}

.site-header__inner {
    max-width: 90vw;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px
}

.brand {
    display: flex;
    flex-direction: column;
}

.brand img {
  width:auto;height:80px;mix-blend-mode:exclusion
}

.brand__place {
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: .3em;
    color: rgba(15,34,56,.55);
    margin-top: 2px
}

.desktop-nav {
    display: flex;
    gap: 28px;
    font-family: var(--mono);
    font-size: 13px;
    letter-spacing: .12em;
    color: rgba(15,34,56,.7)
}

.desktop-nav a {
    position: relative
}

.desktop-nav a:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 0;
    height: 1px;
    background: var(--gold);
    transition: .35s
}

.desktop-nav a:hover:after {
    width: 100%
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 14px
}

.btn-book {
    border: 1px solid rgba(43,130,201,.35);
      background: var(--gold);
    color: white;
    padding: 13px 18px;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .18em;
    text-transform: uppercase;
    transition: .35s
}

.btn-book:hover {
    background: white;
    color: var(--gold);
}

.menu-toggle {
    width: 44px;
    height: 44px;
    border: 1px solid rgba(15,34,56,.16);
    border-radius: 50%;
    background: rgba(255,255,255,.35);
    display: grid;
    place-content: center;
    gap: 6px
}

.menu-toggle span {
    width: 18px;
    height: 1px;
    background: var(--crashing);
    display: block
}

.menu-panel {
    position: fixed;
    inset: 0;
    z-index: 9500;
    background: var(--footer-muted);
    color: white;
    clip-path: circle(0 at calc(100% - 60px) 46px);
    pointer-events: none;
    transition: clip-path .95s cubic-bezier(.16,1,.3,1)
}

.menu-panel.is-open {
    clip-path: circle(150% at calc(100% - 60px) 46px);
    pointer-events: auto
}

.menu-close {
    position: absolute;
    right: 48px;
    top: 26px;
    z-index: 3;
    width: 48px;
    height: 48px;
    border: 1px solid rgba(255,255,255,.25);
    background: transparent;
    color: white;
    border-radius: 50%;
    font-size: 32px;
    line-height: 1
}

.menu-list {
    list-style: none;
    padding: 0;
    margin: 24px 0 0
}

.menu-list a {
    font-family: var(--serif);
    font-size: clamp(44px,7vw,100px);
    font-weight: 300;
    line-height: 1.02;
    letter-spacing: .04em;
    color: white;
    transition: .4s
}

.menu-list a:hover {
    color: var(--gold);
    padding-left: 18px
}

.sfondo{
    border: 1px solid rgba(255,255,255,.12);
    padding: 18px;
    position: absolute;
    width: 57%;
    height: 100vh;
    top: 0;
    right: 0;
    z-index: -1;
}
.sfondo img{

    width: 100%;
    height: 100%;object-fit:cover

}
.menu-card img {
    height: 90vh;
    width: 100%;
    object-fit: cover;
    filter: brightness(.75)
}

.menu-card p {
    margin: 18px 0 0;
    color: rgba(255,255,255,.75);
    font-family: var(--serif);
    font-style: italic;
    font-size: 24px
}

.section-padding {
    padding: clamp(90px,10vw,100px) 0;
}

.hero-section {
    height: 100vh;
    min-height: 720px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    background: var(--abyssal)
}

.hero-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
    transform-origin: center
}

.hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(.85) saturate(.88);
    transform: scale(1.07)
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom,rgba(250,249,246,.72),rgba(250,249,246,.25),rgba(250,249,246,.95));
    z-index: 1
}

.hero-content {
    position: relative;
    z-index: 2;
    user-select: none
}

.hero-kicker,.kicker {
    font-family: var(--mono);
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: .42em;
    color: #efb955;
    font-weight: 500
}

.hero-title {
 font-family: 'Kunstler Script', 'Commercial Script', cursive;
  font-style: normal;
    font-size: clamp(66px,12vw,172px);
    font-weight: 500;
    letter-spacing: .1em;
    line-height: .92;
    margin: 18px 0;
    color: white;   line-height: .98;
    letter-spacing: .02em;
    color: white;
}

.hero-sub {
    max-width: 650px;
    margin: auto;
    color: white;
    font-size: 1.1rem;
    line-height: 1.6;
    letter-spacing: .16em;
    font-weight: 300
}

.scroll-hint {
    position: absolute;
    bottom: 36px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: rgba(51,68,85,.65);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px
}

.scroll-hint span {
    color: var(--gold);
    font-size: 18px;
    animation: bob 2s infinite
}

@keyframes bob {
    50% {
        transform: translateY(8px)
    }
}

.section-title {
    font-family: var(--serif);
    font-weight: 300;
    font-size: clamp(44px,6vw,4.3rem);
    line-height: .98;
    letter-spacing: .02em;
    color: var(--crashing);
    text-transform: uppercase;
    margin: 0
}
.location-panel .section-title {
   font-family: 'Kunstler Script', 'Commercial Script', cursive;
    font-weight: 500;
    font-size: clamp(44px,5vw,4rem);
    line-height: .98;
    letter-spacing: .02em;
    color: white;
    text-transform: none;
    margin: 0
}
.section-title em {
    color: var(--gold);
    font-style: italic;
    text-transform: none
}

.lead-copy {
    color: rgba(51,68,85,.75);
    font-size: 1.1rem;
    line-height: 1.8;
    letter-spacing: .08em;
    font-weight: 300
}

.quote {
    font-family: var(--serif);
    font-size: clamp(22px,2.4vw,34px);
    font-style: italic;
    line-height: 1.35;
    color: rgba(51,68,85,.9);
    border-left: 2px solid rgba(43,130,201,.4);
    padding-left: 22px
}

.timeline-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 1px;
    background: rgba(15,34,56,.08);
    border: 1px solid rgba(15,34,56,.08)
}

.story-card {
    background: rgba(255,255,255,.48);
    padding: 42px;
    min-height: 310px
}

.story-card span,.amenity-card span,.drag-card span {
    font-family: var(--mono);
    font-size: .7rem;
    letter-spacing: .25em;
    color: var(--gold);
    text-transform: uppercase
}

.story-card h3,.amenity-card h3 {
    font-family: var(--serif);
    font-size: 32px;
    text-transform: uppercase;
    font-weight: 300;
    margin: 34px 0 18px
}

.story-card p,.amenity-card p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: rgba(51,68,85,.74);
    font-weight: 300
}

.essence-section {
    background: #fff;
    height:70vh;
    width:100vw;
    display: flex;
    justify-content: center;
    align-items: center;
}
.image-stack {
    position: relative;
    max-width: 520px;
    min-height: 640px
}

.image-stack__main {
    width: 84%;
    height: 600px;
    object-fit: cover;
}

.image-stack__small {
    position: absolute;
    right: 6px;
    bottom: 58px;
    width: 48%;
    height: 330px;
    object-fit: cover;
    border: 1px solid white;
}

.image-badge {
    position: absolute;
    left: 28px;
    top: 28px;
    background: rgba(255,255,255,.9);
    padding: 11px 15px;
    border: 1px solid rgba(15,34,56,.08);
    font-family: var(--mono);
    font-size: 8px;
    letter-spacing: .25em;
    color: var(--gold);
    text-transform: uppercase
}

.gallery-section {
    overflow: hidden
}

.gallery-heading {
    margin-bottom: 60px
}

.deco-gallery {
    height: 980px;
    position: relative
}

.gallery-item {
    position: absolute;
    margin: 0;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 30px 70px rgba(15,34,56,.11)
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.8s cubic-bezier(.16,1,.3,1);
    filter: brightness(.82)
}

.gallery-item:hover img {
    transform: scale(1.07)
}

.gallery-item figcaption {
    position: absolute;
    left: 28px;
    bottom: 25px;
    color: white;
    font-family: var(--serif);
    font-size: 32px;
    line-height: 1.1;
    text-shadow: 0 8px 20px rgba(0,0,0,.32)
}

.gallery-item figcaption span {
    display: block;
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: .28em;
    color: #d7ecff;
    text-transform: uppercase;
    margin-bottom: 8px
}

.gallery-item--large {
    left: 4vw;
    top: 0;
    width: 48vw;
    height: 620px
}

.gallery-item--tall {
    right: 8vw;
    top: 120px;
    width: 28vw;
    height: 610px
}

.gallery-item--wide {
    left: 25vw;
    bottom: -11rem;
    width: 52vw;
    height: 360px
}

.drag-section {
    background: #f4f1eb;
    overflow: hidden
}

.drag-rail {
    display: flex;
    gap: 28px;
    padding-left: 8vw;
    width: max-content;
    cursor: grab
}

.drag-card {
    width: min(72vw,520px);
    height: 600px;
    position: relative;
    overflow: hidden;
    flex: 0 0 auto;
    background: #111
}

.drag-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(.78);
    transition: .8s
}

.drag-card:hover img {
    filter: brightness(.92);
    transform: scale(1.04)
}

.drag-card span {
    position: absolute;
    left: 28px;
    top: 28px;
    color: #cfe9ff
}

.drag-card h3 {
    position: absolute;
    left: 28px;
    bottom: 28px;
    color: white;
    font-family: var(--serif);
    font-size: 46px;
    font-weight: 300;
    text-transform: uppercase;
    max-width: 70%
}

.suite-controls {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .2em;
    color: rgba(51,68,85,.55)
}

.suite-controls button {
    width: 48px;
    height: 48px;
    border: 1px solid rgba(15,34,56,.18);
    border-radius: 50%;
    background: transparent;
    color: var(--crashing);
    transition: .3s
}

.suite-controls button:hover {
    border-color: var(--gold);
    color: var(--gold)
}

.suite-copy h3 {
    font-family: var(--serif);
    font-size: clamp(34px,4vw,58px);
    font-weight: 300;
    text-transform: uppercase;
    line-height: 1.05
}

.suite-meta {
    display: flex;
    gap: 30px;
    color: var(--gold);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 24px
}

.suite-copy ul {
    list-style: none;
    padding: 0;
    margin: 25px 0;
    display: grid;
    gap: 11px
}

.suite-copy li {
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(51,68,85,.78)
}

.suite-copy li:before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--gold);
    margin-right: 10px
}

.suite-rate {
    border-top: 1px solid rgba(15,34,56,.1);
    padding-top: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px
}

.suite-rate strong {
    font-family: var(--serif);
    font-size: 34px;
    color: var(--gold);
    font-weight: 300
}

.suite-rate button {
    border: 1px solid rgba(43,130,201,.45);
    background: transparent;
    color: var(--gold);
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .18em;
    text-transform: uppercase;
    padding: 14px 18px
}

.suite-rate button:hover {
    background: var(--gold);
    color: white
}

.suite-image {
    height: 680px;
    overflow: hidden;
    background: #dce4ea
}

.suite-image img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.max-heading {
    max-width: 760px
}

.amenities-section {
    background: var(--abyssal)
}

.amenity-card {
    height: 430px;
    background: white;
    border: 1px solid rgba(15,34,56,.08);
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: .45s;
    box-shadow: 0 18px 50px rgba(15,34,56,.04)
}

.amenity-card:hover {
    border-color: rgba(43,130,201,.35);
    transform: translateY(-8px)
}

.amenity-card img {
    height: 0;
    opacity: 0;
    object-fit: cover;
    transition: .55s
}

.amenity-card:hover img {
    height: 120px;
    opacity: 1;
    margin: 18px 0
}

.reviews-section {
    background: #fff
}

.review-swiper {
    overflow: visible
}

.review-swiper blockquote {
    background: var(--abyssal);
    border: 1px solid rgba(15,34,56,.08);
    padding: 44px;
    min-height: 280px;
    font-family: var(--serif);
    font-size: 1.25rem;
    line-height: 1.35;
    color: var(--crashing);
    font-style: italic
}

.review-swiper cite {
    display: block;
    margin-top: 28px;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .2em;
    color: wheat;
    text-transform: uppercase;
    font-style: normal
}

.site-footer {
    position: relative;
    z-index: 2;
    background: var(--crashing);
    color: white;
    padding: 90px 0
}

.site-footer h2 {
    font-family: var(--serif);
    font-size: 58px;
    font-weight: 300;
    line-height: 1
}

.site-footer h3 {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .25em;
    color: var(--gold);
    text-transform: uppercase
}

.site-footer p,.site-footer a {
    color: rgba(255,255,255,.68);
    line-height: 1.8
}

.footer-form {
    display: flex;
    gap: 10px
}

.footer-form input {
    flex: 1;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.14);
    padding: 15px;
    color: white
}

.footer-form button {
    border: 1px solid var(--gold);
    background: var(--gold);
    color: white;
    padding: 0 18px;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .18em;
    text-transform: uppercase
}

.booking-drawer {
    position: fixed;
    top: 0;
    right: 0;
    width: min(100%,520px);
    height: 100%;
    background: var(--abyssal);
    z-index: 9700;
    padding: 42px;
    box-shadow: -40px 0 80px rgba(15,34,56,.18);
    transform: translateX(105%);
    transition: .7s cubic-bezier(.16,1,.3,1)
}

.booking-drawer.is-open {
    transform: translateX(0)
}

.booking-close {
    position: absolute;
    right: 22px;
    top: 18px;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(15,34,56,.13);
    border-radius: 50%;
    background: white;
    font-size: 26px
}

.booking-drawer h3 {
    font-family: var(--serif);
    font-size: 44px;
    font-weight: 300;
    text-transform: uppercase
}

.booking-form {
    display: grid;
    gap: 18px;
    margin-top: 34px
}

.booking-form label {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: rgba(51,68,85,.72);
    display: grid;
    gap: 8px
}

.booking-form input,.booking-form select {
    border: 1px solid rgba(15,34,56,.14);
    background: white;
    padding: 14px;
    color: var(--crashing);
    font-family: var(--sans);
    font-size: 14px
}

.booking-form button {
    margin-top: 12px;
    background: var(--gold);
    color: white;
    border: 0;
    padding: 18px;
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .2em;
    text-transform: uppercase
}

.drawer-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15,34,56,.42);
    backdrop-filter: blur(8px);
    z-index: 9600;
    opacity: 0;
    pointer-events: none;
    transition: .45s
}

.drawer-overlay.is-open {
    opacity: 1;
    pointer-events: auto
}

.reveal-clip {
    clip-path: inset(0 100% 0 0)
}

@media(max-width: 991px) {
    .desktop-nav {
        display:none
    }

    .site-header {
        padding: 16px 0px;
    }

    .site-header.is-scrolled {
        padding: 12px 0;
    }

    .btn-book {
        display: none
    }

    .hero-section {
        min-height: 640px
    }

    .timeline-grid {
        grid-template-columns: 1fr
    }

    .story-card {
        min-height: 230px
    }

    .image-stack {
        min-height: auto
    }

    .image-stack__main {
        height: 460px
    }

    .deco-gallery {
        height: auto;
        display: grid;
        gap: 20px
    }

    .gallery-item {
        position: relative;
        inset: auto!important;
        width: 100%!important;
        height: 420px!important
    }

    .drag-card {
        height: 460px
    }

    .suite-image {
        height: 470px
    }

    .footer-form {
        flex-direction: column
    }

    .site-footer h2 {
        font-size: 42px
    }

    .menu-list a {
        font-size: 48px
    }
}

@media(max-width: 575px) {
    .brand__name {
        font-size:24px
    }

    .brand__place {
        font-size: 8px
    }

    .hero-title {
        letter-spacing: .055em
    }

    .section-title {
        font-size: 1.9rem;
    }

    .story-card {
        padding: 28px
    }

    .amenity-card {
        height: auto
    }

    .review-swiper blockquote {
        font-size: 24px;
        padding: 30px
    }

    .booking-drawer {
        padding: 34px 24px
    }

    .suite-rate {
        align-items: flex-start;
        flex-direction: column
    }
}

.page-hero {
    min-height: 100vh;
    padding: 170px 0 90px;
    display: flex;
    align-items: end;
    position: relative;
    overflow: hidden;
    background: #fff
}

.page-hero__bg {
    position: absolute;
    inset: 0;
    opacity: 1;
}

.page-hero__bg:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,rgba(250,249,246,.02),rgba(250,249,246,.74));
}

.page-hero__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.85) brightness(1.02);
    transform: scale(1.05)
}

.page-hero .container {
    position: relative;
    z-index: 2
}

.filter-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 42px
}

.filter-row button {
    border: 1px solid rgba(15,34,56,.15);
    background: white;
    padding: 12px 18px;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--crashing)
}

.filter-row button.is-active,.filter-row button:hover {
    background: var(--gold);
    border-color: var(--gold);
    color: white
}

.page-card {
    height: 100%;
    background: #fff;
    border: 1px solid rgba(15,34,56,.08);
    box-shadow: 0 18px 50px rgba(15,34,56,.04);
    overflow: hidden;
    transition: .45s
}.page-card2 {
    height: 100%;
    background: #fff;
    border: 1px solid rgba(15,34,56,.08);
    box-shadow: 0 18px 50px rgba(15,34,56,.04);
    overflow: hidden;
    transition: .45s
}


.page-card__img {
    height: 350px;
    overflow: hidden;
    background: transparent;
}

.page-card__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 1s
}


.page-card__body {
    padding: 28px
}

.meta {
    font-family: var(--mono);
    font-size: 1rem;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--gold)
}

.page-card h3,.contact-card h3 {
    font-family: var(--serif);
    font-size: 34px;
    font-weight: 300;
    text-transform: uppercase;
    line-height: 1.05;
    margin: 18px 0
}

.page-card p,.page-card li,.contact-card p {
    font-size: 14px;
    line-height: 1.75;
    color: rgba(51,68,85,.72);
    font-weight: 300
}

.page-card ul {
    padding-left: 18px;
    margin: 22px 0
}

.card-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-top: 1px solid rgba(15,34,56,.08);
    padding-top: 22px;
    width: 28vw;
}

.card-actions strong {
    font-family: var(--serif);
    font-size: 28px;
    color: var(--gold);
    font-weight: 300
}

.card-actions button,.contact-form button {
    border: 1px solid var(--gold);
    background: var(--gold);
    color: white;
    padding: 13px 16px;
    font-family: var(--mono);
    font-size: .7rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    min-width: 35%;
}


.faq-list {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
}

.faq-item {
  border-bottom: 1px solid rgba(15, 34, 56, 0.12);
  transition: background-color 0.3s ease;
}

.faq-question {
  width: 100%;
  border: 0;
  background: transparent;
  padding: 24px 0;
  text-align: left;
  display: grid;
  grid-template-columns: 180px 1fr auto; /* Colonna Categoria | Colonna Domanda | Icona */
  align-items: baseline;
  gap: 20px;
  font-family: var(--serif);
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 400;
  color: var(--crashing);
  cursor: pointer;
  transition: color 0.3s ease;
}

.faq-question:hover {
  color: var(--gold);
}

.faq-question span {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gold);
}

/* Icona + / - */
.faq-question b {
  font-family: var(--mono);
  font-size: 20px;
  font-weight: 300;
  color: var(--gold);
  line-height: 1;
  transition: transform 0.3s ease;
}

/* Animazione cambio icona quando aperto */
.faq-item.is-open .faq-question b {
  transform: rotate(45deg); /* Trasforma il + in una X */
}

/* Risposta allineata esattamente con la colonna della domanda */
.faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease-out, padding 0.3s ease;
  padding: 0 0 0 200px; /* Offset di 200px (180px colonna + 20px gap) per perfetto allineamento */
  overflow: hidden;
}

.faq-answer-content {
  min-height: 0;
}

.faq-item.is-open .faq-answer {
  grid-template-rows: 1fr;
  padding-bottom: 24px;
}

.faq-answer p {
  max-width: 800px;
  color: rgba(51, 68, 85, 0.85);
  font-size: 16px;
  line-height: 1.7;
  margin: 0;
  padding: 0; /* Rimosso il padding-left: 8rem problematico */
}

/* --- Layout Responsive (Mobile e Tablet) --- */
@media (max-width: 768px) {
  .faq-question {
    grid-template-columns: 1fr auto; /* In colonna su mobile */
    gap: 10px;
    padding: 20px 0;
  }

  .faq-question span {
    grid-column: 1 / -1; /* La categoria va sopra a tutta larghezza */
    display: block;
    margin-bottom: 4px;
  }

  .faq-answer {
    padding-left: 0; /* Su mobile annulla lo spostamento a sinistra */
  }
}
.contact-card,.contact-form {
    background: white;
    border: 1px solid rgba(15,34,56,.08);
    padding: 38px;
    box-shadow: 0 18px 50px rgba(15,34,56,.04)
}

.contact-form label {
    display: grid;
    gap: 8px;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: rgba(51,68,85,.7)
}

.contact-form input,.contact-form select,.contact-form textarea {
    border: 1px solid rgba(15,34,56,.14);
    background: #faf9f6;
    padding: 14px;
    font-family: var(--sans);
    font-size: 14px;
    color: var(--crashing)
}

@media(max-width: 991px) {
    .page-hero {
        min-height:62vh;
        padding-top: 140px
    }

    .page-card__img {
        height: 260px
    }

    .card-actions {
        align-items: flex-start;
        flex-direction: column
    }

    .faq-answer {
        padding-left: 0
    }
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom,rgba(0,0,0,.72),rgba(0,0,0,.85),rgba(0,0,0,.65));
    z-index: 1;
    opacity: .5;
}

/* Hero Swiper Fix */
.hero-swiper {
    width: 100%;
    height: 100vh;
    /* Forza l'altezza al viewport */
    position: relative;
    overflow: hidden;
}

.hero-swiper .swiper-wrapper {
    height: 100%;
}

.hero-swiper .swiper-slide {
    width: 100%;
    height: 100%;
    position: absolute;
    /* Necessario per l'effetto fade */
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.8s ease-in-out;
}

.hero-swiper .swiper-slide-active {
    opacity: 1;
}

/* La tua immagine di sfondo */
.swiper-slide-bg {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Correzione per lo Swiper: evita che prenda il 100vw forzato */
.hero-swiper {
    width: 100%;
    height: 100vh;
    position: relative;
    overflow: hidden;
}

.hero-swiper .swiper-slide {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-swiper .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.swiper {
    position: absolute;
    width: 100vw!important;
    min-width: 100vw!important;
    height: 100vh;
    object-fit: cover;
    margin: auto;
    top: 0;
    left: 0;
}

.ha-hero__bg .swiper .swiper-slide-bg {
    width: 100%;
    height: 100vh;
    object-fit: cover
}
.swiper-pagination {
    position: relative;
    text-align: center;
    transform: translateZ(0);
    transition: opacity .3s;
    z-index: 10;margin-top:3rem
}


.ha-hero__bg .swiper-slide-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    top: 0;
    left: 0
}

.benacus-footer {
    position: relative;
    z-index: 2;
    background: #0B1525!important;
    color: #fff;
    padding: 96px 0 44px;
    border-top: 1px solid rgba(255,255,255,.10);
    overflow: hidden;
    user-select: none
}

.footer-watermark {
    position: absolute;
    z-index: 0;
    left: -3vw;
    bottom: -7vw;
    font-family: var(--serif);
    font-size: clamp(150px,24vw,380px);
    line-height: .75;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: rgba(255,255,255,.035);
    pointer-events: none
}

.benacus-footer .container {
    z-index: 1
}

.footer-main-row {
    border-bottom: 1px solid rgba(255,255,255,.10)
}

.footer-logo {
    display: inline-flex;
    flex-direction: column;
    text-decoration: none
}

.footer-logo__name {
  
  
    line-height: .95;
    text-transform: none;
    letter-spacing: .2em;
    color: #fff;
    font-weight: 300;font-family: 'Kunstler Script', 'Commercial Script', cursive;
    font-weight: 500;
    font-size: clamp(44px,4vw,3rem);
    line-height: .98;
    letter-spacing: .02em;
}

.footer-logo__place {
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: #2b82c9;
    margin-top: 8px;
    font-weight: 600
}

.footer-quote {
    font-family: var(--serif);
    font-style: italic;
    font-size: 15px;
    line-height: 1.85;
    color: rgba(203,213,224,.86);
    margin: 32px 0 0;
    max-width: 330px
}

.footer-coordinates {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 32px;
    padding: 12px 16px;
    border: 1px solid rgba(43,130,201,.28);
    background: rgba(0,0,0,.32);
    border-radius: 3px;
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #2b82c9
}

.benacus-footer h3 {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .25em;
    color: #2b82c9;
    text-transform: uppercase;
    font-weight: 700;
    margin: 0 0 24px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255,255,255,.10)
}

.footer-nav {
    display: flex;
    flex-direction: column;
    gap: 15px
}

.footer-nav a {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(203,213,224,.82);
    transition: .3s
}

.footer-nav a:hover {
    color: #2b82c9;
    transform: translateX(4px)
}

.footer-weather {
    border: 1px solid rgba(43,130,201,.20);
    background: rgba(0,0,0,.25);
    padding: 20px;
    border-radius: 3px;
    font-family: var(--mono);
    transition: .3s
}

.footer-weather:hover {
    border-color: rgba(43,130,201,.42)
}

.footer-weather__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 1px solid rgba(255,255,255,.10);
    padding-bottom: 12px
}

.footer-weather__head span,.footer-weather__tip span {
    display: block;
    font-size: 9px;
    letter-spacing: .25em;
    text-transform: uppercase;
    color: #2b82c9
}

.footer-weather__head small {
    display: block;
    margin-top: 5px;
    font-family: var(--sans);
    font-size: 10px;
    color: rgba(255,255,255,.60);
    letter-spacing: .08em
}

.footer-weather__head b {
    font-size: 22px;
    color: #2b82c9
}

.footer-weather__temp {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    padding: 18px 0
}

.footer-weather__temp strong {
    font-family: var(--serif);
    font-size: 42px;
    font-weight: 300;
    color: #fff
}

.footer-weather__temp em {
    font-style: normal;
    font-size: 18px;
    color: #2b82c9;
    margin-right: auto
}

.footer-weather__temp div {
    text-align: right
}

.footer-weather__temp span {
    display: block;
    font-family: var(--serif);
    font-style: italic;
    font-size: 14px;
    letter-spacing: .08em;
    color: #2b82c9
}

.footer-weather__temp small {
    display: block;
    margin-top: 4px;
    font-size: 8px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(255,255,255,.55)
}

.footer-weather__metrics {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    border-top: 1px solid rgba(255,255,255,.10);
    border-bottom: 1px solid rgba(255,255,255,.10);
    padding: 12px 0;
    color: rgba(255,255,255,.52);
    font-size: 9px;
    letter-spacing: .12em;
    text-transform: uppercase
}

.footer-weather__metrics span:last-child {
    text-align: right
}

.footer-weather__metrics b {
    font-weight: 400;
    color: rgba(255,255,255,.78)
}

.footer-weather__tip {
    margin-top: 14px;
    background: rgba(0,0,0,.30);
    border: 1px solid rgba(43,130,201,.15);
    padding: 13px
}

.footer-weather__tip p {
    font-family: var(--serif);
    font-style: italic;
    font-size: 12px;
    line-height: 1.6;
    color: rgba(255,255,255,.80);
    margin: 6px 0 0
}

.footer-weather__days {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 8px;
    margin-top: 14px
}

.footer-weather__days div {
    background: rgba(0,0,0,.20);
    border: 1px solid rgba(255,255,255,.06);
    padding: 8px 4px;
    text-align: center
}

.footer-weather__days span {
    display: block;
    font-size: 8px;
    color: rgba(255,255,255,.40);
    text-transform: uppercase
}

.footer-weather__days b {
    display: block;
    margin-top: 3px;
    font-family: var(--sans);
    font-size: 12px;
    color: #fff;
    font-weight: 400
}

.footer-desc {
    font-size: 13px;
    line-height: 1.85;
    color: rgba(203,213,224,.72);
    font-weight: 300
}

.footer-pill-form {
    position: relative;
    display: flex;
    align-items: center;
    margin: 22px 0 30px
}

.footer-pill-form input {
    width: 100%;
    background: #fff!important;
    color: #0f2238!important;
    border: 1px solid rgba(255,255,255,.10)!important;
    border-radius: 999px!important;
    padding: 15px 58px 15px 18px!important;
    font-size: 13px
}

.footer-pill-form button {
    position: absolute;
    right: 5px;
    width: 40px;
    height: 40px;
    border-radius: 50%!important;
    padding: 0!important;
    background: #2b82c9!important;
    border: 1px solid #2b82c9!important;
    color: #fff!important;
    font-size: 20px;
    line-height: 1
}

.footer-pill-form button:hover {
    background: #fff!important;
    color: #0f2238!important;
    border-color: #fff!important
}

.footer-contacts {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 13px;
    border-top: 1px solid rgba(255,255,255,.10);
    padding-top: 22px;
}

/* Righe contatti principali */
.footer-contacts > a,
.footer-contacts > p {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    column-gap: 10px;
    width: 100%;
    font-family: var(--mono);
    font-size: 11px;
    line-height: 1.8;
    letter-spacing: .04em;
    color: rgba(203,213,224,.80);
    margin: 0;
}

/* Solo le icone dirette di telefono, email e indirizzo */
.footer-contacts > a > span,
.footer-contacts > p > span {
    width: 24px;
    min-width: 24px;
    height: 24px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2b82c9;
    line-height: 1;
}

/* Social: una voce sotto l'altra */
.footer-contacts .social-links {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 13px;
    width: 100%;
    margin: 0;
    padding: 0;
}

.footer-contacts .social-link {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    column-gap: 10px;
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: var(--mono);
    font-size: 11px;
    line-height: 1.8;
    letter-spacing: .04em;
    color: rgba(203,213,224,.80);
    text-decoration: none;
    white-space: nowrap;
}

.footer-contacts .fm-icon {
    width: 24px;
    min-width: 24px;
    height: 24px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2b82c9;
    line-height: 0;
}

.footer-contacts .fm-icon svg {
    display: block;
    width: 20px;
    height: 20px;
}

.footer-contacts .fm-label {
    display: block;
    width: auto;
    height: auto;
    margin: 0;
    color: inherit;
    line-height: inherit;
    white-space: nowrap;
}

.footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding-top: 26px
}

.footer-bottom p {
    margin: 0;
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(255,255,255,.42)
}

@media(max-width: 991px) {
    .benacus-footer {
        padding-top:72px
    }

    .footer-logo__name {
        font-size: 34px
    }

    .footer-bottom {
        align-items: flex-start;
        flex-direction: column
    }

    .footer-weather__temp {
        align-items: flex-start
    }

    .footer-weather__metrics {
        grid-template-columns: 1fr
    }

    .footer-weather__metrics span:last-child {
        text-align: left
    }
}

@media(max-width: 575px) {
    .footer-weather__days {
        grid-template-columns:1fr
    }

    .footer-logo__name {
        font-size: 30px;
        letter-spacing: .14em
    }
}

/* Official content update */
.official-table-wrap {
    overflow: auto;
    border: 1px solid rgba(51,68,85,.12);
    border-radius: 22px;
    background: rgba(255,255,255,.72);
    box-shadow: 0 22px 70px rgba(36,55,70,.08)
}

.official-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 860px;
    color: var(--ink)
}

.official-table th,.official-table td {
    padding: 20px 18px;
    border-bottom: 1px solid rgba(51,68,85,.10);
    vertical-align: top
}

.official-table th {
    font-family: var(--sans);
    text-transform: uppercase;
    font-size: .72rem;
    letter-spacing: .16em;
    color: rgba(51,68,85,.55);
    background: rgba(230,238,241,.65)
}

.official-table td:first-child {
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: rgba(51,68,85,.58)
}

.faq-question span {
    display: block;
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .18em;
    color: rgba(43,130,201,.65);
    margin-bottom: 8px
}

.page-card__body a {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid rgba(43,130,201,.35)
}.card {
    opacity: 1 !important;
    transform: none !important;
}
.nav-link {font-family:"Cormorant Garamond",serif!important;font-size:clamp(2.8rem,6.2vw,4.6rem)!important;line-height:.9!important;font-weight:300!important;letter-spacing:-.045em!important;color:rgba(15,34,56,.78)!important;}
 .nav-link :hover{color:var(--color-gold)!important;}
/* === Digitalgarda responsive/functionality fixes 2026-05-26 === */
html, body { min-height: 100%; overflow-x: clip; }
body:not(.is-locked) { overflow-y: auto; }
#smooth-wrapper { width: 100%; min-height: 100vh; height: auto; overflow: visible; }
#smooth-content { min-height: 100vh; overflow: visible; }
@media (min-width: 992px) {
  #smooth-wrapper { height: 100vh; overflow: hidden; }
  #smooth-content { overflow: visible; }
}
@media (max-width: 991.98px) {
  #smooth-wrapper, #smooth-content { transform: none !important; height: auto !important; overflow: visible !important; }
  .hero-section, .panel-section {
        height: 100svh;
        min-height: 80vh;
        padding-top: 140px;
    }.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom,rgba(0,0,0,.42),rgba(0,0,0,.85),rgba(0,0,0,.65));
    z-index: 1;
    opacity: .5;
}
/* 1. Il container principale usa la nuova unità svh (Short Viewport Height) */
.hero-swiper {
  width: 100%;
  height: 100vh; /* Fallback per browser vecchi */
  height: 100svh; /* Usa la reale altezza visibile escludendo le barre del browser */
}

.swiper-slide {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

/* 2. Il wrapper del video e il video occupano esattamente il 100% dell'area */
.video-wrap {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
}

/* 3. Il video copre l'intero schermo mantenendo le proporzioni senza distorcersi */
.video-wrap video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}


}
  .site-header__inner { gap: 12px; }
  .desktop-nav { display: none !important; }
  .btn-book { padding: 12px 15px; font-size: 10px; }
  .menu-panel { overflow-y: auto; -webkit-overflow-scrolling: touch; }
  .section-title, .hero-title { overflow-wrap: anywhere; }
}

.swiper { position: relative; width: 100%; min-width: 0; height: auto; top: auto; left: auto; margin-left: auto; margin-right: auto; overflow: hidden; z-index: 1; }
.hero-swiper { position: absolute; inset: 0; width: 100% !important; min-width: 0 !important; height: 100% !important; }
.hero-swiper .swiper-wrapper, .hero-swiper .swiper-slide { width: 100%; height: 100%; }
.hero-swiper .swiper-slide { position: relative; inset: auto; opacity: 1; display: block; }
.hero-swiper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; }
.hero-swiper .swiper-pagination { bottom: clamp(22px, 5vh, 58px) !important; z-index: 5; }
.review-swiper, .reviews-slider { position: relative; overflow: hidden; width: 100%; min-width: 0; height: auto; }
.review-swiper .swiper-slide, .reviews-slider .swiper-slide { height: auto; }

.amenity-card { height: 100%; min-height: 520px; justify-content: flex-start; gap: 18px; }
.amenity-card:hover { transform: translateY(-4px); }
.amenity-card img { width: 100%; height: 190px; opacity: 1; margin: 10px 0 4px; border-radius: 18px; object-fit: cover; transition: transform .55s ease; }
.amenity-card:hover img { height: 190px; opacity: 1; margin: 10px 0 4px; transform: scale(1.025); }
@media (max-width: 575.98px) { .amenity-card { min-height: 0; padding: 22px; } .amenity-card img, .amenity-card:hover img { height: 210px; } }

.location-section { position: relative; background: var(--crashing); color: var(--abyssal); border-top: 1px solid rgba(43,130,201,.18); border-bottom: 1px solid rgba(43,130,201,.18); overflow: hidden; }
.location-section:before { content:""; position:absolute; inset:0; pointer-events:none; background: radial-gradient(circle at 18% 20%, rgba(202,182,75,.16), transparent 34%), linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,0)); }
.location-panel { position: relative; padding: clamp(26px, 4vw, 54px); border: 1px solid rgba(202,182,75,.26); background: rgba(250,249,246,.06); backdrop-filter: blur(10px); min-height: 100%; }
.location-icon { width: 42px; height: 42px; display:flex; align-items:center; justify-content:center; border: 1px solid rgba(202,182,75,.32); color: var(--gold); border-radius: 999px; }
.location-tabs { display:flex; gap:10px; flex-wrap:wrap; border-bottom: 1px solid rgba(202,182,75,.20); padding-bottom: 12px; margin: 26px 0; }
.location-tab { border: 1px solid rgba(202,182,75,.28); background: transparent; color: rgba(250,249,246,.72); padding: 10px 14px; border-radius: 999px; font-family: var(--mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; }
.location-tab.is-active { color: var(--crashing); background: var(--gold); }
.location-copy { color: rgba(250,249,246,.78); font-size: 1rem; line-height: 1.8; }
.location-copy strong { color: var(--gold); font-weight: 600; }
.location-facts { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:16px; margin-top: 28px; padding-top: 24px; border-top: 1px solid rgba(202,182,75,.18); }
.location-facts span { display:block; font-family: var(--mono); color: rgba(202,182,75,.82); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; margin-bottom: 6px; }
.location-facts b { color: var(--abyssal); font-weight: 500; }
.map-frame { position: relative; overflow: hidden; border-radius: 30px; border: 1px solid rgba(202,182,75,.24); min-height: 520px; box-shadow: 0 30px 90px rgba(0,0,0,.20); }
.map-frame iframe { display:block; width:100%; height:100%; min-height:520px; filter: saturate(.85) contrast(.96); }
@media (max-width: 767.98px) { .location-facts { grid-template-columns:1fr; } .map-frame, .map-frame iframe { min-height: 380px; } }

.dintorni-cards-section { background: var(--abyssal); }
.dintorni-card { height:100%; background:#fff; border:1px solid rgba(51,68,85,.10); box-shadow:0 22px 65px rgba(36,55,70,.07); overflow:hidden; border-radius:24px; transition:transform .35s ease, box-shadow .35s ease; }
.dintorni-card:hover { transform: translateY(-6px); box-shadow:0 30px 85px rgba(36,55,70,.12); }
.dintorni-card img { width:100%; height:230px; object-fit:cover; }
.dintorni-card__body { padding:26px; }
.dintorni-card__meta { display:block; font-family:var(--mono); color:rgba(43,130,201,.72); font-size:10px; letter-spacing:.16em; text-transform:uppercase; margin-bottom:10px; }
.dintorni-card h3 { font-family:var(--serif); font-size:clamp(1.7rem,2.4vw,2.25rem); color:var(--crashing); margin-bottom:10px; }
.dintorni-card p { color:rgba(51,68,85,.72); line-height:1.7; margin:0; }

/* === Digitalgarda additions: header languages, reviews, room detail, contact premium, realtime weather === */
.lang-switch{display:flex;align-items:center;gap:4px;border:1px solid rgba(202,182,75,.28);border-radius:999px;padding:4px;background:rgba(250,249,246,.08);backdrop-filter:blur(12px)}
.lang-switch a{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:999px;text-decoration:none;color:rgba(250,249,246,.76);font-family:var(--mono);font-size:10px;letter-spacing:.12em;transition:.25s ease}
.site-header.is-scrolled .lang-switch a{color:rgba(15,34,56,.72)}
.lang-switch a.is-active,.lang-switch a:hover{background:var(--gold);color:var(--crashing)}
.menu-lang-switch{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 28px}
.menu-lang-switch a{border:1px solid rgba(202,182,75,.32);border-radius:999px;padding:10px 16px;color:var(--gold);text-decoration:none;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.menu-lang-switch a:hover{background:var(--gold);color:var(--crashing)}
.btn-book.book2{display: none;}
	
@media(max-width:575.98px){.lang-switch{display:inline-}
                           .header-actions .btn-book{display: none;}
                          
	.btn-book.book2{position:fixed;bottom:0;left:0;width:100vw;z-index:999;display: block;font-size: .7rem;font-family:var(--serif); text-align:center}
	
	.menu-lang-switch{display:flex;gap:10px;flex-wrap:wrap;margin:0px 0 28px}.sfondo {
display:none
}}

.benacus-reviews{position:relative;background:linear-gradient(180deg,#fff 0%,var(--abyssal) 100%);overflow:hidden}
.benacus-reviews:before{content:"";position:absolute;right:4vw;top:-70px;font-family:var(--serif);font-size:28vw;line-height:1;color:rgba(43,130,201,.045);pointer-events:none}
.benacus-review-swiper{padding:8px 0 56px;overflow:hidden!important}
.benacus-review-swiper .swiper-slide{height:auto}
.benacus-review-swiper blockquote{height:100%;min-height:330px;margin:0;border-radius:28px;background:var(--crashing);color:var(--abyssal);box-shadow:0 24px 80px rgba(36,55,70,.12);position:relative;overflow:hidden}
.benacus-review-swiper blockquote:after{content:"";position:absolute;inset:auto 28px 28px auto;width:70px;height:1px;background:var(--gold)}
.benacus-review-swiper .swiper-pagination{bottom:10px!important}
.benacus-review-swiper .swiper-pagination-bullet{background:var(--crashing);opacity:.28}.benacus-review-swiper .swiper-pagination-bullet-active{opacity:1;background:var(--gold)}

.room-type-page .room-hero{position:relative;overflow:hidden}.room-intro-section{background:#fff}.room-drag-gallery{background:#fff}.room-gallery-rail{gap:28px;padding:0 6vw 24px}.room-gallery-card{min-width:min(520px,78vw);height:620px;border-radius:30px;overflow:hidden}.room-gallery-card img{height:100%;filter:saturate(.9) contrast(.96)}.room-gallery-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.58) 100%);pointer-events:none}.room-gallery-card span,.room-gallery-card h3{position:relative;z-index:2}.room-features-section{background:var(--abyssal)}.room-feature-panel{height:100%;padding:clamp(28px,4vw,48px);border-radius:28px;background:#fff;border:1px solid rgba(15,34,56,.08);box-shadow:0 26px 80px rgba(36,55,70,.08)}.room-feature-panel span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--gold);margin-bottom:22px}.room-feature-panel h3{font-family:var(--serif);font-size:clamp(2rem,3vw,3rem);color:var(--crashing);margin-bottom:20px}.room-feature-panel ul{list-style:none;margin:0;padding:0}.room-feature-panel li{padding:14px 0;border-bottom:1px solid rgba(15,34,56,.08);color:rgba(36,55,70,.78)}.room-feature-panel p{color:rgba(36,55,70,.78);line-height:1.8}.room-feature-panel--gold{background:var(--crashing);color:#fff}.room-feature-panel--gold h3,.room-feature-panel--gold p{color:var(--abyssal)}.room-feature-panel--gold .btn-book{margin-top:20px}.room-cta-section{background:var(--crashing);color:#fff}.room-cta-box{max-width:980px;margin:auto;text-align:center;border:1px solid rgba(202,182,75,.25);border-radius:34px;padding:clamp(34px,7vw,86px);background:radial-gradient(circle at 50% 0%,rgba(202,182,75,.16),transparent 45%)}.room-cta-box h2{font-family:var(--serif);font-size:clamp(2.4rem,6vw,5.8rem);line-height:.95;color:var(--abyssal);margin-bottom:22px}.room-cta-box p{max-width:680px;margin:0 auto 26px;color:rgba(250,249,246,.76)}

.contact-premium-section{background:var(--abyssal);position:relative;overflow:hidden}.contact-info-panel,.contact-form-shell{height:100%;border-radius:30px;border:1px solid rgba(15,34,56,.08);box-shadow:0 30px 90px rgba(36,55,70,.08);background:#fff;padding:clamp(28px,4vw,56px)}.contact-info-panel{background:var(--crashing);color:#fff}.contact-info-panel h2{font-family: 'Kunstler Script', 'Commercial Script', cursive;
    font-weight: 500;font-size:clamp(2.2rem,4vw,4rem);line-height:1;color:var(--abyssal);margin-bottom:22px}.contact-info-panel p{color:rgba(250,249,246,.78);line-height:1.8}.contact-lines{display:grid;gap:12px;margin:28px 0}.contact-lines a,.contact-lines span{color:var(--abyssal);text-decoration:none;border-bottom:1px solid rgba(202,182,75,.22);padding-bottom:12px}.contact-mini-map{height:280px;border-radius:24px;overflow:hidden;border:1px solid rgba(202,182,75,.25);margin-top:28px}.contact-mini-map iframe{width:100%;height:100%;display:block;filter:saturate(.85) contrast(.95)}.contact-form-shell .form-control{border-radius:0;border:0;border-bottom:1px solid rgba(15,34,56,.18);background:rgba(250,249,246,.65);min-height:56px;padding:14px 16px;box-shadow:none}.contact-form-shell textarea.form-control{min-height:150px}.contact-form-shell .form-control:focus{border-color:var(--gold);background:#fff;box-shadow:none}

.footer-weather.is-loading{border-color:rgba(250,249,246,.16)}
.footer-weather.is-loading .footer-weather__head b{animation:benacusPulse 1.2s ease-in-out infinite}
.footer-weather.is-live{border-color:rgba(202,182,75,.42);box-shadow:0 22px 70px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08)}
.footer-weather.is-error{border-color:rgba(255,255,255,.18);opacity:.86}
.footer-weather.is-error [data-weather-apparent]{color:rgba(250,249,246,.58)}
@keyframes benacusPulse{0%,100%{opacity:.45;transform:scale(.95)}50%{opacity:1;transform:scale(1.04)}}
@media(max-width:991.98px){.brand img {
    width: 178px;
    height: auto;
    mix-blend-mode: exclusion;
}.room-gallery-card{height:520px}.contact-info-panel,.contact-form-shell{border-radius:22px}.benacus-review-swiper blockquote{min-height:260px;font-size:24px;padding:32px}
                           .site-header__inner{
                                       grid-template-columns:auto auto;
                                       max-width: 99vw;
                                       width: 99vw;
                                       margin: auto;
                                       margin-left: 0;
                                       display: flex;
                                       align-items: center;
                                       justify-content: space-between;
                                       gap: 11px;
                                       }
                           .header-actions{justify-content:flex-end}
  .page-hero__bg:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,rgba(0,0,0,.22),rgba(0,0,0,.14));
}.story-card h3,.amenity-card h3 {
    font-family: var(--serif);
    font-size: 1.7rem;
    text-transform: uppercase;
    font-weight: 300;
    margin: 34px 0 18px
}
.hero-title {

    font-size: clamp(2rem,10vw,172px);
  
}

	.hero-section .section-title, .page-hero .section-title{
    font-family: var(--serif);
    font-weight: 300;
    font-size: clamp(2.3rem,4vw,4rem);
    line-height: 1.2;
    letter-spacing: .02em;
    color: white;margin-bottom:2rem

}
                 .hero-section .lead-copy, .page-hero .lead-copy {
    color: rgba(255,255,255,1);
    font-size: 1rem;
    line-height: 1.8;
    letter-spacing: .08em;
    font-weight: 300
}
       .menu-close {
    position: absolute;
    right: 25px;
    top: 23px;
    z-index: 3;
    width: 48px;
    height: 48px;
    border: 1px solid rgba(255,255,255,.25);
    background: transparent;
    color: white;
    border-radius: 50%;
    font-size: 32px;
    line-height: 1
}
                          
                          }
@media(max-width:575.98px){.room-gallery-card{min-width:84vw;height:440px}.room-feature-panel{border-radius:22px}.contact-mini-map{height:230px}}

/* Location tabs functional state */
.location-tab {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .25s ease;
}
.location-tab:hover,
.location-tab:focus-visible {
  border-color: rgba(43,130,201,.72);
  color: var(--abyssal);
  outline: none;
  transform: translateY(-1px);
}
.location-tab.is-active:hover,
.location-tab.is-active:focus-visible {
  color: var(--crashing);
}
.location-pane { display: none; }
.location-pane.is-active { display: block; }
.location-pane[hidden] { display: none !important; }

/* Definitive fix: clickable and visible Home location tabs */
.location-panel,
.location-tabs,
.location-tab,
.location-copy { position: relative; z-index: 3; }
.location-tabs { pointer-events: auto; }
.location-tab { cursor: pointer; pointer-events: auto; user-select: none; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.location-pane { display: none; opacity: 1; visibility: visible; }
.location-pane.is-active { display: block !important; opacity: 1 !important; visibility: visible !important; }
.location-pane[hidden]:not(.is-active) { display: none !important; }
.location-tab.is-active { box-shadow: 0 14px 34px rgba(202,182,75,.18); }
 .ha-swiper{border-radius:0;overflow:hidden;box-shadow:var(--shadow-2xl);}
    .ha-swiper .swiper-slide{height:60vh;border:4px solid white}
    .ha-swiper img{width:100%;height:100%;object-fit:cover;transform:scale(1)}
    .ha-swiper .swiper-pagination-bullet{background:rgba(0,0,25,.75);opacity:.65}
    .ha-swiper .swiper-pagination-bullet-active{background:var(--abyssal);opacity:1}

.essence-section img{position:absolute;
  object-fit:cover;
    width: 100%;
    height: auto;max-height:90vh;z-index:0
   
}

#slide-video{width: 100%;}

.page-template-camere .swiper {
  position: relative;
  display: block;
  width: 100% !important;
  height: 350px;
  margin: 0.5rem 0 0.8rem 0;
}

.page-template-camere .swiper-wrapper{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;  /* This makes images fill the container */
  object-position: center; /* Center the crop */
}
.page-template-camere .swiper-slide {
  width: 100% !important;
  height: 100% !important;
  /* Remove display:block - let Swiper handle it */
  /* Remove object-fit - that's for images, not containers */
}

/* Apply object-fit to the IMAGE inside the slide */
.page-template-camere .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;  /* This makes images fill the container */
  object-position: center; /* Center the crop */
}
.page-template-camere .swiper-slide img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
/* Keep your navigation and pagination styles as they are */
.page-template-camere .swiper-button-next,
.page-template-camere .swiper-button-prev {
  color: #2c3e4f;
  background: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(4px);
  width: 36px;
  height: 36px;
  border-radius: 40px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  transition: 0.2s;padding:.5rem
}

.page-template-camere .swiper-button-next::after,
.page-template-camere .swiper-button-prev::after {
  font-size: 16px;
  font-weight: 700;
}
.page-template-camere .swiper-wrapper-container {
  width: 100%;
  overflow: hidden;
  position: relative;
}

.page-template-camere .room-swiper {
  width: 100% !important;
  height: 350px;
  margin: 0;
}
.page-template-camere .swiper-button-next:hover,
.page-template-camere .swiper-button-prev:hover {
  background: white;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.page-template-camere .swiper-pagination-bullet {
  background: #b68b6b;
  opacity: 0.5;
}

.page-template-camere .swiper-pagination-bullet-active {
  background: #8f6b4f;
  opacity: 1;
}.page-template-camere .room-swiper {
  width: 100% !important;
  height: 350px;
  margin: 0.5rem 0 0.8rem 0;
  position: relative;
  overflow: hidden;
}

/* IMPORTANTE: Assicurati che il wrapper abbia le dimensioni corrette */
.page-template-camere .swiper-wrapper {
  width: 100% !important;
  height: 100% !important;
  display: flex !important; /* Swiper usa flex per le slide */
}

.page-template-camere .swiper-slide {
  width: 100% !important;
  height: 100% !important;
  flex-shrink: 0 !important; /* Impedisce alle slide di rimpicciolirsi */
  position: relative !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: #f0f0f0; /* Colore di fallback se l'immagine non carica */
}

.page-template-camere .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Importante: assicurati che le immagini siano visibili */
  opacity: 1 !important;
  visibility: visible !important;
}

/* Assicurati che le slide non siano nascoste da overflow */
.page-template-camere .swiper-slide-active,
.page-template-camere .swiper-slide-duplicate,
.page-template-camere .swiper-slide-prev,
.page-template-camere .swiper-slide-next {
  opacity: 1 !important;
  visibility: visible !important;
  display: flex !important;
}

@media (min-width: 992px) {
    .menu-panel > .container {
        margin-left: 0;
        margin-right: auto;
        padding-left: 48px;
    }
}

.card-actions .booking-link {
    border: 1px solid var(--gold);
    background: var(--gold);
    color: white;
    padding: 13px 16px;
    font-family: var(--mono);
    font-size: .7rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    min-width: 35%;
    text-align: center;
    text-decoration: none;
    display: inline-block;
}