.elementor-2727 .elementor-element.elementor-element-d3606be{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS for container, class: .elementor-element-d3606be */.tis-footer {
    display: none;
}/* End custom CSS */
/* Start custom CSS *//* ══════════════════════════════════════════════════════════════
   I BORBONI — CSS  v7
   ══════════════════════════════════════════════════════════════ */

/* ─── RESET ─────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ──────────────────────────────────────────────────────────────────
   CLASSI BASE es-*
─────────────────────────────────────────────────────────────────── */
.es-p {
  position: relative;
  width: 100vw;
  height: 100vh;
  flex-shrink: 0;
  overflow: hidden;
  background: #ffffff;
  color: #0a0a0a;
}
.es-p--dk { background: #0a0a0a; color: #ffffff; }

.es-brand {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 300;
  font-size: 10px;
  letter-spacing: 0.38em;
  text-transform: uppercase;
}
.es-display {
  font-family: 'Neue Haas Display Black', 'Cormorant Garamond', serif;
  font-weight: 300;
  line-height: 0.95;
  letter-spacing: 0.02em;
}
.es-display--xl { font-size: clamp(52px, 7.5vw, 100px); }
.es-display--lg { font-size: clamp(40px, 5.5vw, 72px); }
.es-display--md { font-size: clamp(28px, 3.5vw, 46px); }
.es-serif { font-family: 'Cormorant Garamond', serif; font-weight: 400; line-height: 1.4; }
.es-serif-i { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300; line-height: 1.4; }
.es-sub { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: clamp(12px, 1.3vw, 18px); letter-spacing: 0.06em; }
.es-vert {
  position: absolute;
  font-family: 'Cormorant Garamond', serif;
  font-weight: 700;
  font-size: clamp(60px, 8vw, 110px);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  transform: rotate(180deg);
  letter-spacing: 0.02em;
  line-height: 1;
}

.es-split { display: flex; width: 100%; height: 100%; }
.es-col { height: 100%; }
.es-col-35 { width: 35%; }
.es-col-40 { width: 40%; }
.es-col-45 { width: 45%; }
.es-col-50 { width: 50%; }
.es-col-55 { width: 55%; }
.es-col-60 { width: 60%; }
.es-col-65 { width: 65%; }

.es-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 60px 52px;
  height: 100%;
}
.es-content--top { justify-content: flex-start; padding-top: 80px; }
.es-content--btm { justify-content: flex-end; padding-bottom: 70px; }
.es-content--sb { justify-content: space-between; padding-top: 65px; padding-bottom: 55px; }
.es-content--ctr { justify-content: center; align-items: center; text-align: center; }

.es-bg {
  position: absolute;
  inset: 0;
  width: 100%; height: 100% !important;
  object-fit: cover;
  object-position: center;
}
.es-overlay { position: absolute; inset: 0; z-index: 1; }
.es-overlay--dk { background: rgba(10,10,10,0.48); }
.es-overlay--l  { background: rgba(10,10,10,0.22); }
.es-above { position: relative; z-index: 2; }

.es-list { margin-top: 6px; }
.es-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 5px 0;
  border-bottom: 1px solid rgba(128,128,128,0.15);
  gap: 12px;
}
.es-row-name {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: 13px;
  letter-spacing: 0.04em;
  flex: 1;
  line-height: 1.4;
}
.es-row-price {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 600;
  font-size: 13px;
  white-space: nowrap;
}

.es-scroll-arrow {
  position: absolute;
  bottom: 36px; right: 44px;
  z-index: 10;
  font-family: 'Cormorant Garamond', serif;
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  display: flex;
  align-items: center;
  gap: 8px;
}

.es-logo-wrap { display: flex; justify-content: center; align-items: center; height: 100%; }
.es-logo-wrap img { width: auto; height: auto; max-width: 260px; object-fit: contain; }

.es-p07-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 60% 40%;
  width: 100%; height: 100%;
  gap: 3px;
}
.es-p07-layout .es-cell-full { grid-row: 1 / 3; }
.es-p10-layout {
  display: grid;
  grid-template-columns: 38% 62%;
  width: 100%; height: 100%;
  gap: 3px;
  position: relative;
}
.es-p18-layout {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr;
  width: 100%; height: 100%;
  gap: 3px;
}

.tis-footer { display: none; }

/* ─── NAV PILLS ─────────────────────────────────────────────────── */
#ib-nav {
  position: fixed;
  bottom: 28px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 300;
  display: flex;
  gap: 8px;
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 999px;
  padding: 6px 10px;
  pointer-events: all;
}
.ib-nav-btn {
  font-family: 'Cormorant Garamond', serif;
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  padding: 7px 20px;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  background: transparent;
  color: #0a0a0a;
  transition: background 0.25s ease, color 0.25s ease;
}
.ib-nav-btn.ib-nav-active { background: #0a0a0a; color: #ffffff; }

#ib-hud {
  position: fixed;
  bottom: 72px;
  left: 0; right: 0;
  display: flex;
  justify-content: space-between;
  padding: 0 44px;
  z-index: 200;
  pointer-events: none;
  color: #0a0a0a;
  transition: color 0.4s ease;
}
#ib-hud.ib-hud--lt { color: #ffffff; }
#ib-count, #ib-scroll-lbl {
  font-family: 'Cormorant Garamond', serif;
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

#ib-story { width: 100%; height: 100vh; overflow: hidden; }
#ib-track { display: flex; height: 100vh; will-change: transform; }

/* ─── TIPOGRAFIA SPECIFICA ──────────────────────────────────────── */
.ib-pizza {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-size: 11px !important;
  display: flex !important;
  flex-direction: column !important;
}
.ib-wine { font-style: italic; display: flex !important; flex-direction: column !important; }
.ib-desc {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 300;
  font-size: 11px;
  font-style: italic;
  color: #888;
  letter-spacing: 0.02em;
  text-transform: none;
  display: block;
  margin-top: 1px;
  line-height: 1.3;
}
.ib-tag {
  display: inline-block;
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: 8px;
  letter-spacing: 0.2em;
  border: 1px solid currentColor;
  padding: 1px 5px;
  margin-left: 6px;
  vertical-align: middle;
  text-transform: uppercase;
  color: #888;
}

.ib-p05-big {
  position: absolute;
  right: 48px;
  top: 50%;
  transform: translateY(-50%);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-family: 'Neue Haas Display Black', 'Cormorant Garamond', serif;
  font-weight: 300;
  font-size: clamp(36px, 5vw, 68px);
  letter-spacing: 0.04em;
  line-height: 1;
  color: #0a0a0a;
}
.ib-p05-body {
  position: absolute;
  left: 52px;
  top: 50%;
  transform: translateY(-50%);
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-style: italic;
  font-size: clamp(18px, 2vw, 28px);
  line-height: 1.7;
  color: #0a0a0a;
  max-width: 55%;
}

.three-col { display:flex; flex-direction: row; }

/* ══════════════════════════════════════════════════════════════════
   MOBILE PATCH v7 — max-width 767px
   FIX: la regola colonna-immagine usa
        :not(.es-content):not(:has(.es-content))
        per identificare in modo affidabile le colonne foto
═══════════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {

  /* ── NAV PILLS / HUD ─────────────────────────────────────── */
  #ib-nav { bottom: 16px !important; }
  #ib-hud { display: none !important; }

  /* ── STORY / TRACK RESET ─────────────────────────────────── */
  #ib-story {
    height: auto !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }
  #ib-track {
    flex-direction: column !important;
    height: auto !important;
    transform: none !important;
    overflow: visible !important;
    will-change: auto !important;
  }

  /* ── PANEL BASE — altezza auto, no padding ──────────────── */
  .es-p {
    height: auto !important;
    min-height: 0 !important;
    width: 100vw !important;
    padding: 0 !important;
  }

  /* ── SPLIT diventa colonna ──────────────────────────────── */
  .es-split {
    flex-direction: column !important;
    height: auto !important;
  }

  /* ── COLONNE: width 100% ────────────────────────────────── */
  .es-col,
  .es-col-35, .es-col-40, .es-col-45,
  .es-col-50, .es-col-55, .es-col-60, .es-col-65 {
    width: 100% !important;
  }

  /* ─────────────────────────────────────────────────────────
     COLONNA IMMAGINE = NON è .es-content e NON contiene .es-content
     → altezza 65vw, padding zero
  ───────────────────────────────────────────────────────── */
  .es-col:not(.es-content):not(:has(.es-content)):not([data-square]) {
    height: 65vw !important;
    min-height: 240px !important;
    max-height: 400px !important;
    padding: 0 !important;
  }

  /* ─────────────────────────────────────────────────────────
     COLONNA TESTO = è .es-content o contiene .es-content
     → altezza auto, padding interno
  ───────────────────────────────────────────────────────── */
  .es-col.es-content,
  .es-col:has(> .es-content) {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 32px 24px !important;
  }

  /* es-content interno (per panel singoli senza split) */
  .es-content {
    padding: 32px 24px !important;
    height: auto !important;
  }

  /* ─────────────────────────────────────────────────────────
     P02 ABOUT US — foto QUADRATA 1:1 su mobile
     Specificità elevata (.es-col.es-col-45[data-square]) per
     battere la regola generale :not(:has(.es-content)) (0,3,0)
  ───────────────────────────────────────────────────────── */
  .es-col.es-col-45[data-square="true"],
  .es-col[data-square="true"] {
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    width: 100% !important;
    position: relative !important;
    overflow: hidden !important;
  }
  .es-col[data-square="true"] picture {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }
  .es-col[data-square="true"] img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
  }

  /* ─────────────────────────────────────────────────────────
     PANEL FULL-BLEED SCURI CON OVERLAY
     WP wrappa sempre img in <picture>, quindi usiamo :has(> picture)
  ───────────────────────────────────────────────────────── */
  .es-p--dk:has(> picture) {
    height: 78svh !important;
    min-height: 420px !important;
    padding: 0 !important;
  }

  /* La es-content dentro un dark full-bleed gestisce il padding */
  .es-p--dk:has(> picture) .es-content,
  .es-p--dk:has(> picture) .es-above.es-content {
    padding: 32px 24px !important;
    height: 100% !important;
  }

  /* Closing (ultimo panel) → autoextending con padding bottom per nav */
  .es-p--dk:last-child:has(> picture) {
    height: auto !important;
    min-height: 90svh !important;
    padding: 0 0 100px 0 !important;
  }

  /* P18 Drinks divisore 1 (solo foto, no testo) → ridotto */
  .es-p--dk#ib-panel-drink:not(:has(.es-content)) {
    height: 60vw !important;
    min-height: 280px !important;
    max-height: 380px !important;
    padding: 0 !important;
  }

  /* ─────────────────────────────────────────────────────────
     PANEL STACCO SOLO IMMAGINE (P05 doppia esp / 25 / 53)
     Chiaro, senza split, senza testo, con solo <picture>
  ───────────────────────────────────────────────────────── */
  .es-p:not(.es-p--dk):not(:has(.es-split)):not(:has(.es-content)):has(> picture) {
    height: 65vw !important;
    min-height: 280px !important;
    max-height: 400px !important;
    padding: 0 !important;
  }

  /* ─────────────────────────────────────────────────────────
     LOGO HERO ridotto su mobile
  ───────────────────────────────────────────────────────── */
  .es-p--dk:has(> picture) .es-content img[alt="This Is i Borboni"] {
    max-width: 200px !important;
    margin-bottom: 14px !important;
  }
  .es-p--dk:last-child .es-content img[alt="This Is i Borboni"] {
    max-width: 160px !important;
    margin-bottom: 24px !important;
  }
  .es-p--dk:has(> picture) .es-content p.es-display--md {
    font-size: 18px !important;
    letter-spacing: 0.14em !important;
  }

  /* ─────────────────────────────────────────────────────────
     GAP TITOLO ↔ LISTA — riduco margin
  ───────────────────────────────────────────────────────── */
  .es-content > p.es-display--lg,
  .es-content > p.es-display--xl,
  .es-content > p.es-display--md {
    margin-bottom: 4px !important;
  }
  .es-content > p.es-serif-i,
  .es-content > p.es-sub {
    margin-bottom: 14px !important;
  }
  .es-list { margin-top: 4px !important; }

  /* ── TIPOGRAFIA ──────────────────────────────────────────── */
  .es-display--xl { font-size: 40px !important; }
  .es-display--lg { font-size: 30px !important; }
  .es-display--md { font-size: 22px !important; }

  /* ─────────────────────────────────────────────────────────
     COCKTAIL PRICE "12" — riduco font + margin top minimo
  ───────────────────────────────────────────────────────── */
  .es-p .es-content > p.es-display[style*="font-size:42px"],
  .es-p .es-content > p.es-display[style*="font-size:36px"],
  .es-p .es-content > p.es-display[style*="font-size:32px"] {
    font-size: 24px !important;
    margin-top: 12px !important;
    line-height: 1 !important;
  }

  /* ─────────────────────────────────────────────────────────
     "MORE THAN A PIZZERIA" statement
  ───────────────────────────────────────────────────────── */
  .es-p:has(> .ib-p05-big) {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 48px 24px !important;
    min-height: 0 !important;
  }
  .ib-p05-big {
    position: relative !important;
    right: auto !important; top: auto !important;
    transform: none !important;
    writing-mode: horizontal-tb !important;
    text-orientation: initial !important;
    font-size: clamp(26px, 7vw, 40px) !important;
    margin-bottom: 16px !important;
  }
  .ib-p05-body {
    position: relative !important;
    left: auto !important; top: auto !important;
    transform: none !important;
    max-width: 100% !important;
    font-size: clamp(15px, 4vw, 20px) !important;
  }

  /* ─────────────────────────────────────────────────────────
     P03/P14/P31 content centrale
  ───────────────────────────────────────────────────────── */
  .es-content.es-content--ctr {
    padding: 48px 24px !important;
  }
  .es-content[style*="padding:60px 10vw"],
  .es-content[style*="padding:60px 6vw"] {
    padding: 32px 24px !important;
  }

  /* ─────────────────────────────────────────────────────────
     P06 BORBONICHE COLLAGE 3 FOTO + testo
  ───────────────────────────────────────────────────────── */
  .es-p > div[style*="grid-template-columns: 55% 45%"] {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto !important;
    height: auto !important;
  }
  .es-p > div[style*="grid-template-columns: 55% 45%"] > div:first-child {
    height: 80vw !important;
    min-height: 320px !important;
    max-height: 460px !important;
  }
  .es-p > div[style*="grid-template-columns: 55% 45%"] > div:last-child {
    padding: 28px 24px !important;
    height: auto !important;
  }

  /* ─────────────────────────────────────────────────────────
     P21 WINE / P29 LIQUORI: griglie multi-col → 1 colonna
  ───────────────────────────────────────────────────────── */
  .es-content > div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .es-content > div[style*="grid-template-columns: repeat(3"] {
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }

  /* ─────────────────────────────────────────────────────────
     COLLAGE GENERICI (es-p07/p18/p10)
  ───────────────────────────────────────────────────────── */
  .es-p07-layout, .es-p18-layout, .es-p10-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
  }
  .es-p07-layout .es-cell-full,
  .es-p07-layout > div:not(.es-cell-full),
  .es-p18-layout > div,
  .es-p10-layout > div:last-child {
    height: 60vw !important;
    min-height: 220px !important;
    max-height: 380px !important;
    position: relative !important;
    overflow: hidden !important;
  }

  .es-vert { display: none !important; }

  /* ── LOGO WRAP / SCROLL / PICTURE ────────────────────────── */
  .es-logo-wrap { padding: 48px 24px !important; height: auto !important; }
  .es-logo-wrap img { max-width: 180px !important; }
  .es-scroll-arrow { display: none !important; }
  picture:has(> .es-bg) {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important; height: 100% !important;
    display: block !important;
  }
}
/* ── END MOBILE ────────────────────────────────────────────────── *//* End custom CSS */