/* ---------- Font ospitati localmente (niente chiamate a Google) ---------- */

@font-face{ font-family:'Cormorant Garamond'; font-style:normal; font-weight:300; font-display:swap;
    src:url('fonts/cormorant-garamond-latin-300-normal.woff2') format('woff2'); }
@font-face{ font-family:'Cormorant Garamond'; font-style:italic; font-weight:300; font-display:swap;
    src:url('fonts/cormorant-garamond-latin-300-italic.woff2') format('woff2'); }
@font-face{ font-family:'Cormorant Garamond'; font-style:normal; font-weight:400; font-display:swap;
    src:url('fonts/cormorant-garamond-latin-400-normal.woff2') format('woff2'); }
@font-face{ font-family:'Cormorant Garamond'; font-style:italic; font-weight:400; font-display:swap;
    src:url('fonts/cormorant-garamond-latin-400-italic.woff2') format('woff2'); }
@font-face{ font-family:'Cormorant Garamond'; font-style:normal; font-weight:500; font-display:swap;
    src:url('fonts/cormorant-garamond-latin-500-normal.woff2') format('woff2'); }
@font-face{ font-family:'Cormorant Garamond'; font-style:italic; font-weight:500; font-display:swap;
    src:url('fonts/cormorant-garamond-latin-500-italic.woff2') format('woff2'); }

@font-face{ font-family:'Jost'; font-style:normal; font-weight:300; font-display:swap;
    src:url('fonts/jost-latin-300-normal.woff2') format('woff2'); }
@font-face{ font-family:'Jost'; font-style:normal; font-weight:400; font-display:swap;
    src:url('fonts/jost-latin-400-normal.woff2') format('woff2'); }
@font-face{ font-family:'Jost'; font-style:normal; font-weight:500; font-display:swap;
    src:url('fonts/jost-latin-500-normal.woff2') format('woff2'); }

/* ============================================================
   LEVANTE 2.0 — Foglio di stile unico
   Palette: notte ionica + avorio + ottone
   Display: Cormorant Garamond · Utility: Jost
   ============================================================ */

:root{
    --ink:        #04121f;
    --ink-2:      #0a2136;
    --ink-3:      #123249;
    --ivory:      #f4f0e8;
    --ivory-dim:  rgba(244, 240, 232, .62);
    --ivory-faint:rgba(244, 240, 232, .10);
    --brass:      #c2a24c;
    --brass-soft: #e0c87e;
    --sea:        #6fb9dc;

    --serif: 'Cormorant Garamond', Georgia, serif;
    --sans:  'Jost', 'Helvetica Neue', sans-serif;

    --shell: 1180px;
    --rule: 1px solid var(--ivory-faint);
}

*{ margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }

html{ scroll-behavior:smooth; }

body{
    font-family:var(--sans);
    font-weight:300;
    background:var(--ink);
    color:var(--ivory);
    overflow-x:hidden;
    line-height:1.7;
    top:0 !important;
    position:relative !important;
}

/* Fondale: notte ionica, luce bassa sull'orizzonte */
#bg-fixed{
    position:fixed;
    inset:0;
    z-index:-1;
    background:
        radial-gradient(120% 80% at 50% 100%, rgba(111,185,220,.16), transparent 60%),
        radial-gradient(90% 60% at 12% 0%, rgba(194,162,76,.09), transparent 55%),
        linear-gradient(180deg, var(--ink) 0%, var(--ink-2) 55%, var(--ink) 100%);
}

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

::selection{ background:var(--brass); color:var(--ink); }

:focus-visible{
    outline:2px solid var(--brass-soft);
    outline-offset:3px;
}

/* ---------- Tipografia ---------- */

.eyebrow{
    font-family:var(--sans);
    font-weight:400;
    text-transform:uppercase;
    letter-spacing:.42em;
    font-size:10px;
    color:var(--brass);
}

.display{
    font-family:var(--serif);
    font-weight:300;
    line-height:1.05;
    letter-spacing:.02em;
}

.lede{
    font-family:var(--serif);
    font-size:clamp(17px, 2.2vw, 21px);
    font-style:italic;
    line-height:1.75;
    color:var(--ivory-dim);
}

/* ---------- Rosa dei venti: firma grafica ---------- */
/* Levante è il vento di levante: il segno che divide le sezioni. */

.vento{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    margin:0 auto;
    max-width:280px;
    color:var(--brass);
}

.vento::before,
.vento::after{
    content:'';
    flex:1;
    height:1px;
    background:linear-gradient(90deg, transparent, currentColor);
}

.vento::after{ background:linear-gradient(270deg, transparent, currentColor); }

.vento svg{ width:22px; height:22px; flex:none; opacity:.9; }

/* ---------- Header ---------- */

header{
    position:fixed;
    top:0;
    left:0;
    right:0;
    height:84px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 clamp(18px, 5vw, 54px);
    z-index:100;
    background:rgba(4,18,31,.55);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-bottom:var(--rule);
    transition:background .5s ease;
}

.logo img{
    height:46px;
    width:46px;
    object-fit:cover;
    border-radius:50%;
    border:1px solid rgba(194,162,76,.45);
}

.header-title{ text-align:center; }

.header-title h1{
    font-family:var(--serif);
    font-weight:300;
    font-size:clamp(22px, 4vw, 34px);
    letter-spacing:.34em;
    line-height:1;
    text-indent:.34em;
}

.header-title p{
    margin-top:6px;
    font-size:9px;
    letter-spacing:.3em;
    text-transform:uppercase;
    color:var(--brass);
}

/* ---------- Navigazione ---------- */

.menu-toggle{
    width:34px;
    height:16px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    cursor:pointer;
    background:none;
    border:none;
    padding:0;
    z-index:101;
}

.menu-toggle span{
    height:1px;
    background:var(--ivory);
    transition:.5s cubic-bezier(.19,1,.22,1);
}

.menu-toggle.open span:nth-child(1){ transform:translateY(7.5px) rotate(45deg); }
.menu-toggle.open span:nth-child(2){ opacity:0; }
.menu-toggle.open span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg); }

.menu-panel{
    position:fixed;
    inset:0;
    background:
        radial-gradient(80% 60% at 50% 100%, rgba(111,185,220,.14), transparent 65%),
        var(--ink);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:4px;
    transition:.9s cubic-bezier(.19,1,.22,1);
    transform:translateY(-100%);
    z-index:99;
    visibility:hidden;
}

.menu-panel.open{ transform:translateY(0); visibility:visible; }

.menu-panel a{
    font-family:var(--serif);
    font-weight:300;
    font-size:clamp(26px, 5vw, 40px);
    letter-spacing:.14em;
    text-decoration:none;
    color:var(--ivory);
    padding:8px 20px;
    position:relative;
    transition:color .4s ease;
}

.menu-panel a::after{
    content:'';
    position:absolute;
    left:50%;
    bottom:4px;
    width:0;
    height:1px;
    background:var(--brass);
    transform:translateX(-50%);
    transition:width .5s cubic-bezier(.19,1,.22,1);
}

.menu-panel a:hover{ color:var(--brass-soft); }
.menu-panel a:hover::after{ width:calc(100% - 40px); }

.menu-panel a[aria-current="page"]{ color:var(--brass); }

/* ---------- Impaginazione ---------- */

.shell{
    max-width:var(--shell);
    margin-inline:auto;
    padding-inline:clamp(20px, 6vw, 48px);
}

.section{ padding:clamp(64px, 10vw, 118px) 0; }

.section-head{
    text-align:center;
    margin-bottom:clamp(40px, 6vw, 68px);
}

.section-head .eyebrow{ display:block; margin-bottom:18px; }

.section-head h2{
    font-family:var(--serif);
    font-weight:300;
    font-size:clamp(34px, 6vw, 58px);
    line-height:1.08;
    letter-spacing:.03em;
}

.section-head p{
    margin:18px auto 0;
    max-width:620px;
    font-family:var(--serif);
    font-style:italic;
    font-size:clamp(15px, 2vw, 18px);
    color:var(--ivory-dim);
}

.page-top{ padding-top:150px; }

/* ---------- Selettore lingua ---------- */

.lang-switch{
    position:fixed;
    top:96px;
    right:clamp(18px, 5vw, 54px);
    display:flex;
    gap:8px;
    z-index:90;
}

.lang-switch img{
    width:22px;
    height:auto;
    cursor:pointer;
    border-radius:2px;
    opacity:.55;
    transition:.35s ease;
}

.lang-switch img:hover{ opacity:1; transform:translateY(-2px); }

/* ---------- Bottoni ---------- */

.btn{
    display:inline-block;
    font-family:var(--sans);
    font-weight:400;
    font-size:11px;
    letter-spacing:.28em;
    text-transform:uppercase;
    text-decoration:none;
    padding:16px 38px;
    border:1px solid var(--brass);
    color:var(--brass-soft);
    background:transparent;
    position:relative;
    overflow:hidden;
    transition:color .5s ease;
    cursor:pointer;
}

.btn::before{
    content:'';
    position:absolute;
    inset:0;
    background:var(--brass);
    transform:scaleY(0);
    transform-origin:bottom;
    transition:transform .5s cubic-bezier(.19,1,.22,1);
    z-index:-1;
}

.btn:hover{ color:var(--ink); }
.btn:hover::before{ transform:scaleY(1); }

.btn-solid{
    background:var(--brass);
    color:var(--ink);
}

.btn-solid:hover{ color:var(--brass-soft); }
.btn-solid::before{ background:var(--ink); }

/* ---------- Rivelazione allo scroll ---------- */

.reveal{
    opacity:0;
    transform:translateY(34px);
    transition:opacity 1.1s cubic-bezier(.19,1,.22,1), transform 1.1s cubic-bezier(.19,1,.22,1);
}

.reveal.active{ opacity:1; transform:none; }

/* ---------- Footer ---------- */

footer{
    border-top:var(--rule);
    padding:64px 0 40px;
    text-align:center;
    background:rgba(4,18,31,.6);
}

.footer-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(190px, 1fr));
    gap:38px;
    text-align:left;
    margin-bottom:48px;
}

.footer-col h4{
    font-family:var(--sans);
    font-weight:400;
    font-size:10px;
    letter-spacing:.32em;
    text-transform:uppercase;
    color:var(--brass);
    margin-bottom:16px;
}

.footer-col p,
.footer-col a{
    display:block;
    font-size:13px;
    color:var(--ivory-dim);
    text-decoration:none;
    margin-bottom:8px;
    transition:color .35s ease;
}

.footer-col a:hover{ color:var(--brass-soft); }

.footer-base{
    border-top:var(--rule);
    padding-top:28px;
    font-size:10px;
    letter-spacing:.2em;
    text-transform:uppercase;
    color:rgba(244,240,232,.4);
}

.footer-base p{ margin-bottom:6px; }
.footer-base a{ color:var(--brass); text-decoration:none; }

/* ---------- Widget Google ---------- */

.goog-te-banner-frame.skiptranslate,
.skiptranslate iframe{ display:none !important; }
.goog-logo-link, .goog-te-gadget span{ display:none !important; }
.goog-te-gadget{ font-size:0 !important; }

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 900px){
    header{ height:72px; }
    .logo img{ height:40px; width:40px; }
    .lang-switch{ top:84px; }
}

@media (max-width: 560px){
    header{ height:66px; }
    .logo img{ height:36px; width:36px; }
    .header-title h1{ font-size:19px; letter-spacing:.26em; text-indent:.26em; }
    .header-title p{ font-size:8px; letter-spacing:.22em; }
    .lang-switch{ top:76px; right:16px; }
    .lang-switch img{ width:19px; }
    .page-top{ padding-top:126px; }
    .footer-grid{ text-align:center; gap:30px; }
}

@media (prefers-reduced-motion: reduce){
    *,*::before,*::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.01ms !important;
        scroll-behavior:auto !important;
    }
    .reveal{ opacity:1; transform:none; }
}

/* ============================================================
   COMPONENTI
   ============================================================ */

/* ---------- Intro ---------- */

#intro{
    position:fixed;
    inset:0;
    background:var(--ink);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:9999;
    animation:introOut 1.2s ease 2.4s forwards;
}

#intro img{
    width:min(56vw, 230px);
    animation:introLogo 2.4s cubic-bezier(.19,1,.22,1) forwards;
}

@keyframes introLogo{
    0%{ opacity:0; transform:scale(.94); filter:blur(6px); }
    45%{ opacity:1; transform:scale(1); filter:blur(0); }
    100%{ opacity:1; transform:scale(1); }
}

@keyframes introOut{ to{ opacity:0; visibility:hidden; } }

/* ---------- Hero ---------- */

.hero{
    position:relative;
    min-height:100svh;
    display:grid;
    place-items:center;
    text-align:center;
    padding:120px clamp(20px,6vw,48px) 80px;
    overflow:hidden;
}

.hero-media{
    position:absolute;
    inset:0;
    z-index:0;
}

.hero-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center 40%;
    transform:scale(1.06);
    animation:heroDrift 22s ease-in-out infinite alternate;
}

@keyframes heroDrift{
    from{ transform:scale(1.06) translate3d(0,0,0); }
    to{ transform:scale(1.14) translate3d(0,-1.5%,0); }
}

.hero-media::after{
    content:'';
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg, rgba(4,18,31,.72) 0%, rgba(4,18,31,.42) 40%, rgba(4,18,31,.92) 100%);
}

.hero-inner{
    position:relative;
    z-index:1;
    max-width:820px;
}

.hero-inner .eyebrow{ display:block; margin-bottom:26px; }

.hero-inner h2{
    font-family:var(--serif);
    font-weight:300;
    font-size:clamp(50px, 12vw, 132px);
    letter-spacing:.16em;
    line-height:.98;
    text-indent:.16em;
}

.hero-inner .lede{ margin:26px auto 0; max-width:560px; }

.hero-actions{
    margin-top:44px;
    display:flex;
    gap:16px;
    justify-content:center;
    flex-wrap:wrap;
}

.hero-scroll{
    position:absolute;
    bottom:28px;
    left:50%;
    transform:translateX(-50%);
    z-index:1;
    font-size:9px;
    letter-spacing:.32em;
    text-transform:uppercase;
    color:var(--ivory-dim);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
}

.hero-scroll::after{
    content:'';
    width:1px;
    height:44px;
    background:linear-gradient(180deg, var(--brass), transparent);
    animation:scrollPulse 2.6s ease-in-out infinite;
}

@keyframes scrollPulse{
    0%,100%{ opacity:.3; transform:scaleY(.6); transform-origin:top; }
    50%{ opacity:1; transform:scaleY(1); transform-origin:top; }
}

/* ---------- Storia: testo + immagine ---------- */

.split{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:clamp(32px, 6vw, 76px);
    align-items:center;
}

.split-media{
    position:relative;
    aspect-ratio:3/4;
    overflow:hidden;
}

.split-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform 1.4s cubic-bezier(.19,1,.22,1);
}

.split-media:hover img{ transform:scale(1.05); }

.split-media::after{
    content:'';
    position:absolute;
    inset:12px;
    border:1px solid rgba(194,162,76,.32);
    pointer-events:none;
}

.split-body h2{
    font-family:var(--serif);
    font-weight:300;
    font-size:clamp(32px, 5vw, 52px);
    line-height:1.1;
    margin:18px 0 24px;
}

.split-body p{
    color:var(--ivory-dim);
    font-size:15px;
    margin-bottom:16px;
}

.split-sign{
    margin-top:26px;
    font-family:var(--serif);
    font-style:italic;
    font-size:19px;
    color:var(--brass-soft);
}

.split-sign small{
    display:block;
    font-family:var(--sans);
    font-style:normal;
    font-size:9px;
    letter-spacing:.28em;
    text-transform:uppercase;
    color:var(--ivory-dim);
    margin-top:6px;
}

/* ---------- Degustazione ---------- */

.tasting{
    position:relative;
    border:1px solid rgba(194,162,76,.3);
    padding:clamp(40px, 6vw, 76px) clamp(24px, 5vw, 60px);
    text-align:center;
    background:rgba(10,33,54,.4);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.tasting h2{
    font-family:var(--serif);
    font-weight:300;
    font-size:clamp(34px, 6vw, 56px);
    line-height:1.08;
    margin:18px 0 22px;
}

.tasting .lede{ max-width:600px; margin:0 auto 36px; }

.tasting-badges{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:40px;
}

.badge{
    border:1px solid rgba(194,162,76,.45);
    border-radius:60px;
    padding:7px 18px;
    font-size:9px;
    letter-spacing:.2em;
    text-transform:uppercase;
    color:var(--brass-soft);
}

/* ---------- Carta: righe con leader ---------- */

.menu-wrapper{
    max-width:900px;
    margin-inline:auto;
    display:flex;
    flex-direction:column;
    gap:clamp(52px, 8vw, 88px);
}

.menu-block h3{
    font-family:var(--serif);
    font-weight:300;
    font-style:italic;
    font-size:clamp(28px, 4.5vw, 40px);
    letter-spacing:.06em;
    color:var(--brass-soft);
    text-align:center;
    margin-bottom:8px;
}

.menu-block > .vento{ margin-bottom:36px; }

.menu-item{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:baseline;
    gap:8px;
    padding:20px 0;
    border-bottom:var(--rule);
}

.menu-item:last-child{ border-bottom:none; }

.menu-item .name{
    font-family:var(--serif);
    font-size:clamp(18px, 2.4vw, 22px);
    font-weight:300;
    letter-spacing:.01em;
    line-height:1.35;
    max-width:64ch;
}

.menu-item .allerg{
    display:block;
    font-family:var(--sans);
    font-size:10px;
    letter-spacing:.16em;
    color:rgba(244,240,232,.42);
    margin-top:7px;
}

.menu-item .price{
    font-family:var(--serif);
    font-size:clamp(18px, 2.4vw, 21px);
    color:var(--brass-soft);
    white-space:nowrap;
    padding-left:24px;
}

.menu-item.new .name::before{
    content:'Novità';
    display:inline-block;
    font-family:var(--sans);
    font-size:8px;
    letter-spacing:.22em;
    text-transform:uppercase;
    color:var(--ink);
    background:var(--brass);
    padding:2px 8px;
    border-radius:2px;
    margin-right:10px;
    vertical-align:middle;
    transform:translateY(-2px);
}

.menu-note{
    text-align:center;
    font-size:11px;
    letter-spacing:.14em;
    color:rgba(244,240,232,.45);
    border-top:var(--rule);
    padding-top:30px;
}

.menu-note strong{ color:var(--brass); font-weight:400; }

/* ---------- Cantina ---------- */

.wine-row{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:baseline;
    gap:10px;
    padding:16px 0;
    border-bottom:var(--rule);
}

.wine-row:last-child{ border-bottom:none; }

.wine-row .name{
    font-family:var(--serif);
    font-size:clamp(17px, 2.2vw, 20px);
    font-weight:300;
}

.wine-row .cantina{
    display:block;
    font-family:var(--sans);
    font-size:10px;
    letter-spacing:.2em;
    text-transform:uppercase;
    color:rgba(244,240,232,.45);
    margin-top:5px;
}

.wine-row .price{
    font-family:var(--serif);
    font-size:16px;
    color:var(--brass-soft);
    white-space:nowrap;
    text-align:right;
}

.wine-row .price em{
    font-style:normal;
    display:block;
    font-family:var(--sans);
    font-size:9px;
    letter-spacing:.16em;
    color:rgba(244,240,232,.4);
    margin-top:3px;
}

/* ---------- Servizi ---------- */

.servizi-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
    gap:1px;
    background:var(--ivory-faint);
    border:var(--rule);
}

.servizio{
    background:var(--ink);
    padding:clamp(32px, 4vw, 48px) clamp(24px, 3vw, 36px);
    position:relative;
    transition:background .6s ease;
    min-height:290px;
    display:flex;
    flex-direction:column;
}

.servizio:hover{ background:var(--ink-2); }

.servizio-num{
    font-family:var(--sans);
    font-size:10px;
    letter-spacing:.3em;
    color:var(--brass);
    margin-bottom:22px;
}

.servizio svg{
    width:30px;
    height:30px;
    stroke:var(--brass);
    fill:none;
    stroke-width:1;
    margin-bottom:22px;
}

.servizio h3{
    font-family:var(--serif);
    font-weight:300;
    font-size:clamp(24px, 3vw, 30px);
    line-height:1.15;
    margin-bottom:14px;
}

.servizio p{
    font-size:14px;
    color:var(--ivory-dim);
    flex:1;
}

.servizio-meta{
    margin-top:22px;
    padding-top:16px;
    border-top:var(--rule);
    font-size:10px;
    letter-spacing:.2em;
    text-transform:uppercase;
    color:var(--brass-soft);
}

/* ---------- Gallery ---------- */

.gallery-grid{
    columns:3;
    column-gap:14px;
}

.gallery-grid figure{
    break-inside:avoid;
    margin-bottom:14px;
    overflow:hidden;
    position:relative;
    cursor:zoom-in;
}

.gallery-grid img{
    width:100%;
    transition:transform 1.2s cubic-bezier(.19,1,.22,1), filter .7s ease;
    filter:saturate(.9);
}

.gallery-grid figure:hover img{ transform:scale(1.06); filter:saturate(1.05); }

/* Lightbox */
#lightbox{
    position:fixed;
    inset:0;
    background:rgba(4,18,31,.96);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:9998;
    padding:24px;
    cursor:zoom-out;
}

#lightbox.open{ display:flex; }

#lightbox img{
    max-width:92vw;
    max-height:88vh;
    object-fit:contain;
    border:1px solid rgba(194,162,76,.3);
}

#lightbox .close{
    position:absolute;
    top:22px;
    right:26px;
    font-size:30px;
    color:var(--ivory);
    background:none;
    border:none;
    cursor:pointer;
    line-height:1;
}

/* ---------- Recensioni ---------- */

.rec-grid{
    columns:3;
    column-gap:14px;
}

.rec-grid figure{
    break-inside:avoid;
    margin-bottom:14px;
    border:var(--rule);
    background:rgba(10,33,54,.5);
    padding:8px;
}

/* ---------- Mappa ---------- */

.map-box{
    border:var(--rule);
    background:rgba(10,33,54,.4);
    min-height:320px;
    display:grid;
    place-items:center;
    padding:28px;
    text-align:center;
}

.map-box iframe{
    width:100%;
    height:380px;
    border:0;
    display:block;
    filter:grayscale(1) invert(.92) contrast(.85);
}

/* ---------- Cookie banner ---------- */

#cookie-banner{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    background:var(--ink-2);
    border-top:1px solid rgba(194,162,76,.4);
    color:var(--ivory);
    padding:26px clamp(20px,5vw,48px);
    z-index:9997;
    display:none;
    text-align:center;
    font-size:13px;
}

#cookie-banner p{ color:var(--ivory-dim); margin-bottom:16px; }

#cookie-banner label{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin:0 12px 16px;
    font-size:12px;
    letter-spacing:.08em;
    cursor:pointer;
}

#cookie-banner .cookie-actions{
    display:flex;
    gap:12px;
    justify-content:center;
    flex-wrap:wrap;
    align-items:center;
}

#cookie-banner .btn{ padding:12px 26px; font-size:10px; }

/* ---------- Responsive componenti ---------- */

@media (max-width: 900px){
    .split{ grid-template-columns:1fr; }
    .split-media{ aspect-ratio:4/3; max-height:420px; }
    .gallery-grid, .rec-grid{ columns:2; }
}

@media (max-width: 620px){
    .hero-inner h2{ font-size:clamp(40px, 15vw, 62px); letter-spacing:.1em; text-indent:.1em; }
    .menu-item .price, .wine-row .price{ padding-left:14px; }
    .gallery-grid, .rec-grid{ columns:1; }
    .servizi-grid{ grid-template-columns:1fr; }
}


/* ============================================================
   LA CARTA — inchiostro su carta
   Le pagine dei menù ribaltano la palette: il resto del sito è
   la notte sul mare, la carta è carta stampata.
   ============================================================ */

body.page-carta #bg-fixed{
    background:
        radial-gradient(100% 70% at 50% 0%, #fcfaf4, transparent 65%),
        linear-gradient(180deg, #f5f1e8 0%, #efe9dc 60%, #e8e0d0 100%);
}

body.page-carta header{
    background:var(--ink);
    border-bottom:1px solid rgba(194,162,76,.35);
}

/* Dentro <main> la palette si inverte. Header e footer restano scuri. */
main.carta{
    --ivory:       #14212c;
    --ivory-dim:   rgba(20,33,44,.68);
    --ivory-faint: rgba(20,33,44,.16);
    --brass:       #8a6d21;
    --brass-soft:  #6d5516;
    color:var(--ivory);
}

main.carta .lede{ color:var(--ivory-dim); }

/* Fascia della portata: piena, come sulla carta stampata */
main.carta .menu-block h3{
    background:linear-gradient(100deg, #04121f, #0a2136 55%, #17394f);
    color:#f2ecdc;
    font-family:var(--serif);
    font-style:italic;
    font-weight:400;
    font-size:clamp(24px, 3.6vw, 34px);
    letter-spacing:.1em;
    padding:15px 20px 17px;
    margin-bottom:6px;
    text-align:center;
    box-shadow:0 10px 24px rgba(20,33,44,.14);
}

/* La rosa dei venti resta la firma del titolo di pagina, non si ripete
   sotto ogni portata: la fascia basta già a separare. */
main.carta .menu-block > .vento{ display:none; }

main.carta .menu-item{
    padding:19px 6px;
    border-bottom:1px solid var(--ivory-faint);
}

main.carta .menu-item:nth-child(odd){ background:rgba(255,255,255,.4); }

main.carta .menu-item .name{
    font-weight:400;
    color:var(--ivory);
}

main.carta .menu-item .allerg{
    color:rgba(20,33,44,.55);
    font-weight:400;
}

main.carta .menu-item .price{
    font-weight:500;
    color:var(--brass-soft);
}

main.carta .menu-item.new .name::before{
    background:#8a6d21;
    color:#f5f1e8;
}

main.carta .wine-row{
    padding:15px 6px;
    border-bottom:1px solid var(--ivory-faint);
}

main.carta .wine-row:nth-child(odd){ background:rgba(255,255,255,.4); }

main.carta .wine-row .name{ font-weight:400; }
main.carta .wine-row .cantina{ color:rgba(20,33,44,.5); }
main.carta .wine-row .price{ color:var(--brass-soft); font-weight:500; }
main.carta .wine-row .price em{ color:rgba(20,33,44,.5); }

main.carta .menu-note{
    color:rgba(20,33,44,.62);
    border-top:1px solid var(--ivory-faint);
}

main.carta .menu-note strong{ color:var(--brass); }

main.carta .btn{
    border-color:var(--brass);
    color:var(--brass-soft);
}

main.carta .btn:hover{ color:#f5f1e8; }
main.carta .btn::before{ background:var(--brass); }

main.carta .section-head p{ color:var(--ivory-dim); }

/* ---------- Sottotitolo di blocco (cantina) ---------- */

.block-sub{
    text-align:center;
    font-family:var(--serif);
    font-style:italic;
    font-size:14px;
    color:var(--ivory-dim);
    margin:16px 0 22px;
}

/* ---------- Nota in evidenza ---------- */

.nota{
    max-width:820px;
    margin:0 auto clamp(48px, 7vw, 84px);
    border-left:2px solid var(--brass);
    background:rgba(194,162,76,.07);
    padding:22px clamp(20px, 3vw, 30px);
}

.nota p{
    font-size:14px;
    color:var(--ivory-dim);
    margin:0;
}

main.carta .menu-note a,
main.carta .block-sub a{
    color:var(--brass-soft);
    text-decoration:underline;
    text-underline-offset:3px;
}