{"id":1004,"date":"2025-10-08T16:22:50","date_gmt":"2025-10-08T16:22:50","guid":{"rendered":"https:\/\/bergold.it\/?page_id=1004"},"modified":"2026-02-28T11:35:59","modified_gmt":"2026-02-28T11:35:59","slug":"home","status":"publish","type":"page","link":"https:\/\/bergold.it\/en\/","title":{"rendered":"home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1004\" class=\"elementor elementor-1004\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e9c18c1 e-con-full e-flex e-con e-parent\" data-id=\"e9c18c1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7055199 elementor-widget elementor-widget-html\" data-id=\"7055199\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n\/* ============================\r\n   VIEWPORT ROBUSTO + ALTEZZA MOBILE\r\n   ============================ *\/\r\n:root {\r\n  --vw: 100dvw;\r\n  --vh: 100dvh;\r\n  --hero-m-height: 70dvh; \/* regola qui *\/\r\n  --brand: #b6cd43;\r\n}\r\n@supports not (width: 1dvw) {\r\n  :root { --vw: 100svw; --vh: 100svh; --hero-m-height: 70svh; }\r\n}\r\n@supports not (width: 1svw) {\r\n  :root { --vw: 100vw; --vh: 100vh; --hero-m-height: 70vh; }\r\n}\r\nhtml, body { overflow-x: hidden; }\r\n\r\n\/* ============================\r\n   WRAPPER VIDEO FULL-BLEED\r\n   ============================ *\/\r\n.video-bg-wrapper {\r\n  position: relative;\r\n  width: var(--vw);\r\n  max-width: var(--vw);\r\n  aspect-ratio: 16\/9; \/* desktop\/tablet *\/\r\n  overflow: hidden;\r\n  background: #000;\r\n  background-image: url('poster.jpg'); \/* \u2705 metti qui un poster reale *\/\r\n  background-size: cover;\r\n  background-position: center;\r\n}\r\n\r\n\/* ignora padding\/margini dei container del tema *\/\r\n.video-bg-wrapper.full-bleed { margin-left: 50%; transform: translateX(-50%); }\r\n\r\n\/* fallback se manca aspect-ratio *\/\r\n@supports not (aspect-ratio: 1 \/ 1) {\r\n  .video-bg-wrapper { height: 0; padding-top: 56.25%; } \/* 16:9 *\/\r\n}\r\n\r\n\/* ============================\r\n   MOUNT DEL PLAYER (vuoto finch\u00e9 non c\u2019\u00e8 consenso)\r\n   ============================ *\/\r\n.video-bg-mount{\r\n  position:absolute; inset:0;\r\n  width:100%; height:100%;\r\n  z-index:0;\r\n}\r\n.video-bg-mount iframe{\r\n  position:absolute; inset:0;\r\n  width:100%; height:100%;\r\n  border:none;\r\n  pointer-events:none;\r\n  display:block;\r\n}\r\n\r\n\/* Scrim per contrasto testo *\/\r\n.video-bg-wrapper::after {\r\n  content: \"\"; position: absolute; inset: 0;\r\n  background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.25) 30%, rgba(0,0,0,.45) 100%);\r\n  pointer-events: none; z-index: 1;\r\n}\r\n\r\n\/* ============================\r\n   OVERLAY TESTI (centrato)\r\n   ============================ *\/\r\n.video-overlay {\r\n  position: absolute; inset: 0;\r\n  display: flex; flex-direction: column;\r\n  align-items: center; justify-content: center;\r\n  text-align: center;\r\n  padding: clamp(16px, 3vw, 48px);\r\n  z-index: 2;\r\n  max-width: min(1100px, 92vw);\r\n  margin: 0 auto;\r\n}\r\n\r\n.video-eyebrow {\r\n  margin: 0 0 clamp(6px, 1vw, 12px);\r\n  font-weight: 700; font-size: clamp(14px, 1.4vw, 20px);\r\n  letter-spacing: .12em; text-transform: uppercase;\r\n  color: #fff; text-shadow: 0 2px 6px rgba(0,0,0,.35);\r\n}\r\n\r\n.video-title {\r\n  margin: 0;\r\n  color: #fff; font-weight: 800; line-height: 1.1;\r\n  font-size: clamp(28px, 6vw, 72px);\r\n  text-transform: uppercase; text-shadow: 0 4px 16px rgba(0,0,0,.35);\r\n}\r\n\r\n\/* ============================\r\n   TOGGLE AUDIO (basso a destra)\r\n   - nascosto finch\u00e9 il video non \u00e8 caricato\r\n   ============================ *\/\r\n.audio-toggle{\r\n  position:absolute; right:12px; bottom:12px;\r\n  z-index:3;\r\n\r\n  width:46px !important;\r\n  height:46px !important;\r\n  min-width:46px !important;\r\n  min-height:46px !important;\r\n\r\n  display:flex !important;\r\n  align-items:center !important;\r\n  justify-content:center !important;\r\n\r\n  padding:0 !important;\r\n  line-height:0 !important;\r\n\r\n  border-radius:999px !important;\r\n  background: rgba(0,0,0,.38);\r\n  border: 1px solid rgba(255,255,255,.22);\r\n  color:#fff;\r\n\r\n  backdrop-filter: blur(3px);\r\n  cursor:pointer;\r\n  appearance: none;\r\n  -webkit-appearance: none;\r\n\r\n  transition: background .15s ease, transform .15s ease, opacity .15s ease, box-shadow .15s ease;\r\n  box-shadow: 0 6px 18px rgba(0,0,0,.22);\r\n\r\n  opacity: 0;             \/* \ud83d\udc48 nascosto prima del consenso *\/\r\n  pointer-events: none;   \/* \ud83d\udc48 disabilitato prima del consenso *\/\r\n}\r\n.video-bg-wrapper.is-video-loaded .audio-toggle{\r\n  opacity: 1;\r\n  pointer-events: auto;\r\n}\r\n.audio-toggle:hover{ background: rgba(0,0,0,.55); transform: translateY(-1px); }\r\n.audio-toggle:active{ transform: translateY(0); }\r\n.audio-toggle:focus-visible{\r\n  outline: 2px solid rgba(255,255,255,.85);\r\n  outline-offset: 2px;\r\n  box-shadow: 0 0 0 6px rgba(255,255,255,.18);\r\n}\r\n\r\n.audio-toggle svg{\r\n  width: 78%;\r\n  height: 78%;\r\n  max-width: 34px;\r\n  max-height: 34px;\r\n  display:block;\r\n  margin:0;\r\n  fill: currentColor;\r\n  pointer-events:none;\r\n  transform: translateX(-1px);\r\n}\r\n\r\n.audio-toggle .icon-on{ display:none; }\r\n.audio-toggle.on .icon-on{ display:block; }\r\n.audio-toggle.on .icon-off{ display:none; }\r\n\r\n.audio-toggle.on::after{\r\n  content:\"\"; position:absolute; inset:-6px; border-radius:inherit;\r\n  box-shadow: 0 0 0 0 rgba(255,255,255,.35);\r\n  animation: pulse 1.6s ease-out infinite;\r\n}\r\n@keyframes pulse{ to{ box-shadow: 0 0 0 14px rgba(255,255,255,0); } }\r\n\r\n\/* ============================\r\n   PILL INFORMATIVA (solo finch\u00e9 non c\u2019\u00e8 consenso)\r\n   ============================ *\/\r\n.video-consent-pill{\r\n  position:absolute;\r\n  left:50%;\r\n  bottom:12px;\r\n  transform: translateX(-50%);\r\n  z-index:3;\r\n  pointer-events:none;\r\n\r\n  background: rgba(0,0,0,.62);\r\n  color:#fff;\r\n  border:2px solid var(--brand);\r\n  border-radius:999px;\r\n  padding:9px 14px;\r\n  font-size:12px;\r\n  font-weight:900;\r\n  letter-spacing:.02em;\r\n  text-transform:uppercase;\r\n  box-shadow:0 6px 16px rgba(0,0,0,.25);\r\n  backdrop-filter: blur(2px);\r\n\r\n  opacity: 1;\r\n  transition: opacity .2s ease;\r\n}\r\n.video-bg-wrapper.is-video-loaded .video-consent-pill{\r\n  opacity: 0;\r\n}\r\n\r\n\/* MOBILE: hero ~70% viewport + cover *\/\r\n@media (max-width: 640px) {\r\n  .video-bg-wrapper {\r\n    height: var(--hero-m-height);\r\n    aspect-ratio: auto;\r\n  }\r\n\r\n  .video-bg-mount iframe {\r\n    top: 50%; left: 50%;\r\n    height: var(--hero-m-height);\r\n    width: calc(var(--hero-m-height) * 16 \/ 9);\r\n    transform: translate(-50%, -50%);\r\n    max-width: none; max-height: none;\r\n    min-width: 100%; min-height: 100%;\r\n  }\r\n\r\n  .video-overlay {\r\n    padding: calc(16px + env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom));\r\n  }\r\n\r\n  .video-eyebrow { font-size: 10px; letter-spacing: .16em; margin-bottom: 6px; }\r\n  .video-title   { font-size: clamp(20px, 7.2vw, 40px); line-height: 1.12; }\r\n\r\n  .audio-toggle{\r\n    width:42px !important;\r\n    height:42px !important;\r\n    min-width:42px !important;\r\n    min-height:42px !important;\r\n    right:10px; bottom:10px;\r\n  }\r\n  .audio-toggle svg{ max-width: 30px; max-height: 30px; }\r\n\r\n  .video-consent-pill{ bottom: 10px; font-size: 11px; }\r\n}\r\n\r\n\/* ACCESSIBILIT\u00c0: se reduce motion, non carico il video automaticamente *\/\r\n@media (prefers-reduced-motion: reduce) {\r\n  .video-consent-pill{ display:none; }\r\n}\r\n<\/style>\r\n\r\n<div class=\"video-bg-wrapper full-bleed\" id=\"heroVideoWrap\">\r\n  <!-- QUI verr\u00e0 creato l'iframe SOLO dopo consenso -->\r\n  <div class=\"video-bg-mount\" id=\"heroVideoMount\" aria-hidden=\"true\"><\/div>\r\n\r\n  <!-- Bottone audio -->\r\n  <button class=\"audio-toggle\" id=\"heroAudioToggle\" type=\"button\" aria-label=\"Attiva audio\" aria-pressed=\"false\">\r\n    <svg class=\"icon-off\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\r\n      <path d=\"M16.5 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zM19 12c0 .94-.2 1.82-.54 2.64l1.51 1.51C20.63 14.91 21 13.5 21 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27 7.73 9H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.38-.31 2.63-.95 3.69-1.81L19.73 21 21 19.73 4.27 3zM12 4L9.91 6.09 12 8.18V4z\"><\/path>\r\n    <\/svg>\r\n    <svg class=\"icon-on\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\r\n      <path d=\"M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z\"><\/path>\r\n    <\/svg>\r\n  <\/button>\r\n\r\n  <!-- Pill finch\u00e9 non c'\u00e8 consenso -->\r\n  <div class=\"video-consent-pill\" id=\"heroConsentPill\" aria-hidden=\"true\">\r\n    Accetta i cookie per vedere il video\r\n  <\/div>\r\n\r\n  <div class=\"video-overlay\">\r\n    <p class=\"video-eyebrow\">Prodotti artigianali, dal frutto al laboratorio<\/p>\r\n    <h1 class=\"video-title\">Tradizione calabrese che profuma di bergamotto<\/h1>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function(){\r\n  const YT_ID = \"AB51pnFIQJ0\";\r\n\r\n  const wrap  = document.getElementById('heroVideoWrap');\r\n  const mount = document.getElementById('heroVideoMount');\r\n  const btn   = document.getElementById('heroAudioToggle');\r\n\r\n  let player = null;\r\n  let loaded = false;\r\n\r\n  \/\/ \u2705 Per far partire il video SOLO dopo accettazione banner:\r\n  \/\/ marketing \u00e8 la scelta corretta per YouTube. Se vuoi ampliare, aggiungi:\r\n  \/\/ 'cmplz_statistics', 'cmplz_preferences' ecc.\r\n  const REQUIRED_COOKIES = ['cmplz_marketing'];\r\n\r\n  function getCookie(name){\r\n    const v = document.cookie.split('; ').find(row => row.startsWith(name + '='));\r\n    return v ? decodeURIComponent(v.split('=')[1]) : '';\r\n  }\r\n\r\n  function isTruthy(v){\r\n    return ['allow', 'yes', 'true', '1'].includes(String(v || '').toLowerCase());\r\n  }\r\n\r\n  function hasYoutubeConsent(){\r\n    \/\/ 1) prima controlla esplicitamente la categoria richiesta (marketing)\r\n    const anyRequired = REQUIRED_COOKIES.some(c => {\r\n      const v = getCookie(c);\r\n      return v ? isTruthy(v) : false;\r\n    });\r\n    if (anyRequired) return true;\r\n\r\n    \/\/ 2) fallback: stato globale (in alcuni setup pu\u00f2 essere presente)\r\n    const status = getCookie('cmplz_consent_status');\r\n    if (status) return isTruthy(status);\r\n\r\n    return false;\r\n  }\r\n\r\n  function loadYouTubeApi(){\r\n    return new Promise((resolve, reject) => {\r\n      if (window.YT && window.YT.Player) return resolve();\r\n\r\n      const existing = document.querySelector('script[data-yt-api=\"1\"]');\r\n      if (existing) {\r\n        const t0 = Date.now();\r\n        const timer = setInterval(() => {\r\n          if (window.YT && window.YT.Player) { clearInterval(timer); resolve(); }\r\n          if (Date.now() - t0 > 12000) { clearInterval(timer); reject(new Error('YT API timeout')); }\r\n        }, 150);\r\n        return;\r\n      }\r\n\r\n      const tag = document.createElement('script');\r\n      tag.src = \"https:\/\/www.youtube.com\/iframe_api\";\r\n      tag.async = true;\r\n      tag.dataset.ytApi = \"1\";\r\n\r\n      tag.onload = () => {\r\n        const t0 = Date.now();\r\n        const timer = setInterval(() => {\r\n          if (window.YT && window.YT.Player) { clearInterval(timer); resolve(); }\r\n          if (Date.now() - t0 > 12000) { clearInterval(timer); reject(new Error('YT API timeout')); }\r\n        }, 150);\r\n      };\r\n\r\n      tag.onerror = () => reject(new Error('Impossibile caricare YT API'));\r\n      document.head.appendChild(tag);\r\n    });\r\n  }\r\n\r\n  function buildIframe(){\r\n    \/\/ iframe creato SOLO dopo consenso (zero richieste YouTube prima)\r\n    const origin = encodeURIComponent(window.location.origin);\r\n\r\n    const iframe = document.createElement('iframe');\r\n    iframe.id = \"heroVideo\";\r\n    iframe.title = \"Video di sfondo\";\r\n    iframe.setAttribute('role','presentation');\r\n    iframe.setAttribute('aria-hidden','true');\r\n    iframe.setAttribute('tabindex','-1');\r\n    iframe.allow = \"autoplay; encrypted-media\";\r\n    iframe.referrerPolicy = \"strict-origin-when-cross-origin\";\r\n\r\n    iframe.src =\r\n      \"https:\/\/www.youtube-nocookie.com\/embed\/\" + YT_ID +\r\n      \"?autoplay=1&mute=1&playsinline=1&loop=1&playlist=\" + YT_ID +\r\n      \"&controls=0&rel=0&modestbranding=1&fs=0&disablekb=1&enablejsapi=1\" +\r\n      \"&origin=\" + origin;\r\n\r\n    mount.innerHTML = \"\";\r\n    mount.appendChild(iframe);\r\n  }\r\n\r\n  function resetUI(){\r\n    wrap.classList.remove('is-video-loaded');\r\n    btn.classList.remove('on');\r\n    btn.setAttribute('aria-pressed', 'false');\r\n    btn.setAttribute('aria-label', 'Attiva audio');\r\n  }\r\n\r\n  function destroyVideo(){\r\n    \/\/ rimuove player + iframe (utile se revocano il consenso)\r\n    try {\r\n      if (player && typeof player.destroy === 'function') player.destroy();\r\n    } catch(e){}\r\n    player = null;\r\n\r\n    mount.innerHTML = \"\"; \/\/ elimina iframe\r\n    loaded = false;\r\n    resetUI();\r\n  }\r\n\r\n  async function loadVideoIfAllowed(){\r\n    if (loaded) return;\r\n\r\n    \/\/ accessibilit\u00e0: rispetta reduce motion\r\n    if (window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;\r\n\r\n    if (!hasYoutubeConsent()) return;\r\n\r\n    loaded = true;\r\n    buildIframe();\r\n\r\n    try {\r\n      await loadYouTubeApi();\r\n    } catch(e) {\r\n      \/\/ se API non carica, rimaniamo senza video (ma senza rompere layout)\r\n      loaded = false;\r\n      return;\r\n    }\r\n\r\n    \/\/ inizializza player (serve per toggle mute\/unmute)\r\n    try {\r\n      player = new YT.Player('heroVideo', {\r\n        events: {\r\n          onReady: function(e){\r\n            try { e.target.mute(); } catch(err){}\r\n            wrap.classList.add('is-video-loaded');\r\n          }\r\n        }\r\n      });\r\n    } catch(e) {\r\n      \/\/ fallback: se qualcosa va storto, non bloccare la pagina\r\n      loaded = false;\r\n    }\r\n  }\r\n\r\n  function onConsentChange(){\r\n    \/\/ se consentono \u2192 carica\r\n    if (hasYoutubeConsent()) {\r\n      loadVideoIfAllowed();\r\n      return;\r\n    }\r\n    \/\/ se NON consentono e il video era carico \u2192 smonta\r\n    if (loaded) destroyVideo();\r\n  }\r\n\r\n  \/\/ Toggle audio (funziona solo quando il video \u00e8 caricato)\r\n  btn.addEventListener('click', function(){\r\n    if (!player) return;\r\n\r\n    try {\r\n      if (player.isMuted && player.isMuted()) {\r\n        player.unMute();\r\n        player.setVolume(100);\r\n        player.playVideo();\r\n        btn.classList.add('on');\r\n        btn.setAttribute('aria-pressed','true');\r\n        btn.setAttribute('aria-label','Disattiva audio');\r\n      } else {\r\n        player.mute();\r\n        btn.classList.remove('on');\r\n        btn.setAttribute('aria-pressed','false');\r\n        btn.setAttribute('aria-label','Attiva audio');\r\n      }\r\n    } catch(e){}\r\n  });\r\n\r\n  \/\/ 1) Prova subito (se l'utente ha gi\u00e0 consenso salvato)\r\n  document.addEventListener('DOMContentLoaded', function(){\r\n    loadVideoIfAllowed();\r\n  });\r\n\r\n  \/\/ 2) Eventi Complianz: quando cambia stato\/categorie\r\n  \/\/ (nomi evento comuni; se nel tuo sito ne arriva uno diverso, lo intercettiamo comunque col poll sotto)\r\n  document.addEventListener('cmplz_status_change', onConsentChange);\r\n  document.addEventListener('cmplz_event_marketing', onConsentChange);\r\n  document.addEventListener('cmplz_event_statistics', onConsentChange);\r\n  document.addEventListener('cmplz_event_preferences', onConsentChange);\r\n  document.addEventListener('cmplz_event_functional', onConsentChange);\r\n\r\n  \/\/ 3) Fallback: poll leggero (se il banner non emette eventi, o vengono bloccati)\r\n  const poll = setInterval(() => {\r\n    if (loaded && hasYoutubeConsent()) return; \/\/ gi\u00e0 ok\r\n    onConsentChange();\r\n  }, 600);\r\n\r\n  \/\/ stop poll dopo 2 minuti\r\n  setTimeout(() => clearInterval(poll), 120000);\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1a2aeb3 e-con-full e-flex e-con e-parent\" data-id=\"1a2aeb3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-193387b elementor-widget elementor-widget-html\" data-id=\"193387b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ===== HOME HUB PRO (3 sopra + 2 sotto larghe) \u2014 stile Bergold ===== -->\r\n<section class=\"bergold-hub\">\r\n  <div class=\"bh-wrap\">\r\n    <header class=\"bh-hero\">\r\n      <p class=\"bh-kicker\">Benvenuti<\/p>\r\n      <h1 class=\"bh-title\">Il bergamotto, la nostra storia, il nostro territorio<\/h1>\r\n      <p class=\"bh-subtitle\">\r\n        Scopri chi siamo, dove ci troviamo e le nostre linee. Poi approfondisci con un click.\r\n      <\/p>\r\n    <\/header>\r\n\r\n    <div class=\"bh-grid\">\r\n      <!-- 1) DOVE SIAMO -->\r\n      <a class=\"bh-card bh-card--photo bh-reveal\"\r\n         href=\"https:\/\/bergold.it\/dove-siamo\/\"\r\n         aria-label=\"Vai alla pagina Dove siamo\">\r\n        <div class=\"bh-media\" aria-hidden=\"true\">\r\n          <img src=\"https:\/\/bergold.it\/wp-content\/uploads\/2026\/02\/sfondo-bergamotto.png\" alt=\"\" loading=\"lazy\" decoding=\"async\">\r\n        <\/div>\r\n\r\n        <div class=\"bh-overlay\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"bh-glow\" aria-hidden=\"true\"><\/div>\r\n\r\n        <div class=\"bh-body\">\r\n          <span class=\"bh-pill\">Dove siamo<\/span>\r\n          <h2 class=\"bh-h2\">Un luogo meraviglioso<\/h2>\r\n          <p class=\"bh-p\">Mare, colline e profumi mediterranei: scopri il territorio e come raggiungerci.<\/p>\r\n\r\n          <span class=\"bh-cta bh-cta--btn\">\r\n            Scopri di pi\u00f9\r\n            <span class=\"bh-arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n          <\/span>\r\n        <\/div>\r\n      <\/a>\r\n\r\n      <!-- 2) CHI SIAMO -->\r\n      <a class=\"bh-card bh-card--photo bh-reveal\"\r\n         href=\"https:\/\/bergold.it\/chi-siamo\/\"\r\n         aria-label=\"Vai alla pagina Chi siamo\">\r\n        <div class=\"bh-media\" aria-hidden=\"true\">\r\n          <img src=\"https:\/\/bergold.it\/wp-content\/uploads\/2026\/02\/bergamotto-3.jpg\" alt=\"\" loading=\"lazy\" decoding=\"async\">\r\n        <\/div>\r\n\r\n        <div class=\"bh-overlay\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"bh-glow\" aria-hidden=\"true\"><\/div>\r\n\r\n        <div class=\"bh-body\">\r\n          <span class=\"bh-pill\">Chi siamo<\/span>\r\n          <h2 class=\"bh-h2\">Filiera pulita, cura artigianale<\/h2>\r\n          <p class=\"bh-p\">Un lavoro fatto di qualit\u00e0, trasparenza e rispetto della materia prima.<\/p>\r\n\r\n          <span class=\"bh-cta bh-cta--btn\">\r\n            Scopri di pi\u00f9\r\n            <span class=\"bh-arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n          <\/span>\r\n        <\/div>\r\n      <\/a>\r\n\r\n      <!-- 3) PRODOTTI (FEATURE) -->\r\n      <a class=\"bh-card bh-card--feature bh-reveal\"\r\n         href=\"https:\/\/bergold.it\/prodotti\/\"\r\n         aria-label=\"Vai alla pagina Prodotti\">\r\n        <div class=\"bh-media\" aria-hidden=\"true\">\r\n          <img src=\"https:\/\/bergold.it\/wp-content\/uploads\/2026\/01\/sfondo-bergold-manutenzione.jpg\" alt=\"\" loading=\"lazy\" decoding=\"async\">\r\n        <\/div>\r\n\r\n        <div class=\"bh-overlay bh-overlay--feature\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"bh-glow bh-glow--feature\" aria-hidden=\"true\"><\/div>\r\n\r\n        <div class=\"bh-body\">\r\n          <span class=\"bh-pill\">Prodotti<\/span>\r\n          <h2 class=\"bh-h2\">Dalla pianta alla bottiglia<\/h2>\r\n          <p class=\"bh-p\">\r\n            Succhi, polpe, marmellate, canditi, liquori, miele e olio aromatizzato: scopri tutte le linee.\r\n          <\/p>\r\n\r\n          <div class=\"bh-chips\" aria-label=\"Linee principali\">\r\n            <span class=\"bh-chip\">Succhi<\/span>\r\n            <span class=\"bh-chip\">Polpe<\/span>\r\n            <span class=\"bh-chip\">Marmellate<\/span>\r\n            <span class=\"bh-chip\">Canditi<\/span>\r\n          <\/div>\r\n\r\n          <span class=\"bh-cta bh-cta--btn\">\r\n            Vai ai prodotti\r\n            <span class=\"bh-arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n          <\/span>\r\n        <\/div>\r\n      <\/a>\r\n\r\n      <!-- 4) BERGAMOTTO (WIDE) -->\r\n      <a class=\"bh-wide bh-reveal\"\r\n         href=\"https:\/\/bergold.it\/bergamotto\/\"\r\n         aria-label=\"Vai alla pagina Bergamotto\">\r\n        <div class=\"bh-wide__media\" aria-hidden=\"true\">\r\n          <img src=\"https:\/\/bergold.it\/wp-content\/uploads\/2026\/02\/foto-bergamotto-home.jpg\" alt=\"\" loading=\"lazy\" decoding=\"async\">\r\n          <div class=\"bh-wide__shade\" aria-hidden=\"true\"><\/div>\r\n        <\/div>\r\n\r\n        <div class=\"bh-wide__content\">\r\n          <span class=\"bh-pill\">Bergamotto<\/span>\r\n          <h2 class=\"bh-h2 bh-h2--wide\">Perch\u00e9 \u00e8 speciale<\/h2>\r\n          <p class=\"bh-p bh-p--wide\">\r\n            Propriet\u00e0, curiosit\u00e0 e utilizzi dell\u2019oro verde della costa ionica.\r\n          <\/p>\r\n\r\n          <ul class=\"bh-list\" aria-label=\"Sezioni principali\">\r\n            <li><span class=\"bh-dot\" aria-hidden=\"true\"><\/span> Perch\u00e9 \u00e8 famoso<\/li>\r\n            <li><span class=\"bh-dot\" aria-hidden=\"true\"><\/span> Perch\u00e9 acquistarlo<\/li>\r\n            <li><span class=\"bh-dot\" aria-hidden=\"true\"><\/span> In cucina e benessere<\/li>\r\n          <\/ul>\r\n\r\n          <span class=\"bh-cta bh-cta--btn\">\r\n            Approfondisci\r\n            <span class=\"bh-arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n          <\/span>\r\n        <\/div>\r\n      <\/a>\r\n\r\n      <!-- 5) CONTATTACI (WIDE) \u2014 SOLO TESTO, NESSUNA IMMAGINE -->\r\n      <a class=\"bh-wide bh-wide--contact bh-reveal\"\r\n         href=\"https:\/\/bergold.it\/contattaci\/\"\r\n         aria-label=\"Vai alla pagina Contattaci\">\r\n\r\n        <div class=\"bh-wide__content bh-wide__content--contact\">\r\n          <span class=\"bh-pill\">Contattaci<\/span>\r\n\r\n          <h2 class=\"bh-h2 bh-h2--wide\">Parliamo del tuo progetto<\/h2>\r\n\r\n          <p class=\"bh-p bh-p--wide bh-p--lead\">\r\n            Informazioni sui prodotti, richieste commerciali o collaborazioni: scrivici e ti rispondiamo il prima possibile.\r\n          <\/p>\r\n\r\n          <ul class=\"bh-contactList\" aria-label=\"Recapiti\">\r\n            <li>\r\n              <span class=\"bh-contactIcon\" aria-hidden=\"true\">\u2709\ufe0f<\/span>\r\n              <span class=\"bh-contactText\">info@bergold.it<\/span>\r\n            <\/li>\r\n            <li>\r\n              <span class=\"bh-contactIcon\" aria-hidden=\"true\">\ud83d\udcde<\/span>\r\n              <span class=\"bh-contactText\">347 2683477<\/span>\r\n            <\/li>\r\n          <\/ul>\r\n\r\n          <span class=\"bh-cta bh-cta--btn\">\r\n            Apri il modulo\r\n            <span class=\"bh-arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n          <\/span>\r\n        <\/div>\r\n      <\/a>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n  .bergold-hub{\r\n    --brand:#b6cd43;\r\n    --ink:#0e0e0e;\r\n    --muted: rgba(14,14,14,.72);\r\n    --soft:#f3f7e8;\r\n    --card:#ffffff;\r\n    --radius: 28px;\r\n    --radius2: 22px;\r\n    --shadow: 0 22px 55px rgba(0,0,0,.12);\r\n    --shadow2: 0 14px 34px rgba(0,0,0,.10);\r\n\r\n    position: relative;\r\n    background: #fff;\r\n    padding: clamp(28px, 4.8vw, 70px) 16px;\r\n    overflow: hidden;\r\n  }\r\n\r\n  \/* full-bleed *\/\r\n  .bergold-hub{\r\n    margin-left: calc(50% - 50vw);\r\n    margin-right: calc(50% - 50vw);\r\n    width: 100vw;\r\n    max-width: 100vw;\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  \/* sfondo soft *\/\r\n  .bergold-hub::before,\r\n  .bergold-hub::after{\r\n    content:\"\";\r\n    position:absolute;\r\n    width: 760px; height: 760px;\r\n    border-radius: 999px;\r\n    filter: blur(34px);\r\n    opacity: .40;\r\n    pointer-events:none;\r\n    z-index:0;\r\n  }\r\n  .bergold-hub::before{\r\n    left: -380px; top: -420px;\r\n    background: radial-gradient(circle at 30% 30%, rgba(182,205,67,.38), rgba(0,0,0,0) 62%);\r\n  }\r\n  .bergold-hub::after{\r\n    right: -420px; bottom: -520px;\r\n    background: radial-gradient(circle at 30% 30%, rgba(182,205,67,.22), rgba(0,0,0,0) 60%);\r\n  }\r\n\r\n  .bh-wrap{\r\n    position:relative;\r\n    z-index:1;\r\n    max-width: 1180px;\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .bh-hero{\r\n    max-width: 900px;\r\n    margin: 0 auto 22px;\r\n  }\r\n\r\n  \/* \u2705 \u201cBenvenuti\u201d centrato *\/\r\n  .bh-kicker{\r\n    margin:0 0 10px;\r\n    font-size: 12px;\r\n    font-weight: 900;\r\n    letter-spacing: .16em;\r\n    text-transform: uppercase;\r\n    color: rgba(14,14,14,.62);\r\n    text-align:center;\r\n  }\r\n\r\n  .bh-title{\r\n    margin:0 0 10px;\r\n    font-size: clamp(26px, 3.6vw, 48px);\r\n    line-height: 1.06;\r\n    font-weight: 1000;\r\n    color: var(--ink);\r\n  }\r\n  .bh-subtitle{\r\n    margin:0;\r\n    font-size: clamp(15px, 1.5vw, 18px);\r\n    line-height: 1.65;\r\n    color: var(--muted);\r\n    max-width: 72ch;\r\n  }\r\n\r\n  \/* GRID *\/\r\n  .bh-grid{\r\n    display:grid;\r\n    grid-template-columns: repeat(12, minmax(0, 1fr));\r\n    gap: 16px;\r\n    margin-top: 22px;\r\n    align-items: stretch;\r\n  }\r\n\r\n  \/* CARD base *\/\r\n  .bh-card{\r\n    position:relative;\r\n    border-radius: var(--radius);\r\n    overflow:hidden;\r\n    text-decoration:none;\r\n    color:#fff;\r\n    box-shadow: var(--shadow2);\r\n    transform: translateY(0);\r\n    transition: transform .18s ease, box-shadow .18s ease;\r\n    min-height: 270px;\r\n    outline: none;\r\n  }\r\n  .bh-card:hover{\r\n    transform: translateY(-4px);\r\n    box-shadow: var(--shadow);\r\n  }\r\n  .bh-card:focus-visible{\r\n    outline: 3px solid rgba(0,0,0,.8);\r\n    outline-offset: 3px;\r\n  }\r\n\r\n  \/* bordo premium *\/\r\n  .bh-card::before,\r\n  .bh-wide::before{\r\n    content:\"\";\r\n    position:absolute; inset:0;\r\n    border-radius: inherit;\r\n    padding: 2px;\r\n    background: linear-gradient(135deg, rgba(182,205,67,.95), rgba(182,205,67,.25), rgba(255,255,255,.15));\r\n    -webkit-mask:\r\n      linear-gradient(#000 0 0) content-box,\r\n      linear-gradient(#000 0 0);\r\n    -webkit-mask-composite: xor;\r\n    mask-composite: exclude;\r\n    pointer-events:none;\r\n    z-index: 3;\r\n    opacity:.95;\r\n  }\r\n\r\n  \/* \u2705 MOD: wrapper media sempre \u201ccontenitore\u201d, immagini sempre cover *\/\r\n  .bh-media{\r\n    position:absolute; inset:0;\r\n    z-index:0;\r\n    overflow:hidden; \/* NEW *\/\r\n  }\r\n  .bh-media img{\r\n    position:absolute; \/* NEW *\/\r\n    inset:0;           \/* NEW *\/\r\n    width:100%;\r\n    height:100%;\r\n    object-fit: cover;\r\n    display:block;     \/* NEW *\/\r\n    transform: scale(1.04);\r\n    transition: transform .55s ease;\r\n    filter: saturate(1.05) contrast(1.03);\r\n  }\r\n  .bh-card:hover .bh-media img{ transform: scale(1.10); }\r\n\r\n  \/* \u2705 overlay pi\u00f9 scuro per migliorare leggibilit\u00e0 *\/\r\n  .bh-overlay{\r\n    position:absolute; inset:0; z-index:1;\r\n    background:\r\n      radial-gradient(900px 420px at 20% 0%, rgba(182,205,67,.18), transparent 60%),\r\n      linear-gradient(180deg,\r\n        rgba(0,0,0,.10) 0%,\r\n        rgba(0,0,0,.26) 40%,\r\n        rgba(0,0,0,.88) 100%\r\n      );\r\n  }\r\n  .bh-overlay--feature{\r\n    background:\r\n      radial-gradient(900px 420px at 20% 0%, rgba(182,205,67,.26), transparent 60%),\r\n      linear-gradient(180deg,\r\n        rgba(0,0,0,.08) 0%,\r\n        rgba(0,0,0,.28) 38%,\r\n        rgba(0,0,0,.90) 100%\r\n      );\r\n  }\r\n\r\n  \/* glow *\/\r\n  .bh-glow{\r\n    position:absolute;\r\n    width: 260px; height: 260px;\r\n    border-radius: 999px;\r\n    background: radial-gradient(circle at 30% 30%, rgba(182,205,67,.55), rgba(182,205,67,0) 64%);\r\n    left:-80px; top:-90px;\r\n    z-index:2;\r\n    filter: blur(6px);\r\n    opacity: .9;\r\n    pointer-events:none;\r\n  }\r\n  .bh-glow--feature{\r\n    width: 320px; height: 320px;\r\n    left:-90px; top:-110px;\r\n    opacity: 1;\r\n  }\r\n\r\n  \/* ====== ALLINEAMENTO CONTENUTI CARD ====== *\/\r\n  .bh-body{\r\n    position:absolute;\r\n    inset: 0;\r\n    z-index:2;\r\n    padding: 18px 18px 16px;\r\n\r\n    display: grid;\r\n    align-content: end;\r\n    grid-template-rows: auto auto auto 1fr auto;\r\n  }\r\n  .bh-card--feature .bh-body{\r\n    grid-template-rows: auto auto auto auto 1fr auto;\r\n  }\r\n\r\n  \/* \u2705 pannello \u201cscuro\u201d sotto i testi per farli leggere meglio *\/\r\n  .bh-card .bh-body{\r\n    position:absolute;\r\n  }\r\n  .bh-card .bh-body::before{\r\n    content:\"\";\r\n    position:absolute;\r\n    left:0; right:0; bottom:0;\r\n    height: 78%;\r\n    background: linear-gradient(180deg,\r\n      rgba(0,0,0,0) 0%,\r\n      rgba(0,0,0,.55) 45%,\r\n      rgba(0,0,0,.78) 100%\r\n    );\r\n    backdrop-filter: blur(3px);\r\n    z-index:0;\r\n  }\r\n  .bh-card .bh-body > *{\r\n    position:relative;\r\n    z-index:1;\r\n  }\r\n\r\n  .bh-pill{\r\n    display:inline-flex;\r\n    align-items:center;\r\n    gap:8px;\r\n    padding: 7px 12px;\r\n    border-radius: 999px;\r\n    allow: auto;\r\n    background: rgba(255,255,255,.90);\r\n    color: rgba(14,14,14,.78);\r\n    font-weight: 900;\r\n    letter-spacing: .12em;\r\n    text-transform: uppercase;\r\n    font-size: 11px;\r\n    border: 1px solid rgba(182,205,67,.35);\r\n    box-shadow: 0 10px 22px rgba(0,0,0,.10);\r\n    backdrop-filter: blur(4px);\r\n  }\r\n  .bh-pill--feature{\r\n    background: rgba(182,205,67,.95);\r\n    color:#0b0b0b;\r\n    border-color: rgba(182,205,67,.95);\r\n  }\r\n\r\n  .bh-h2{\r\n    margin: 12px 0 8px;\r\n    font-size: 20px;\r\n    line-height: 1.15;\r\n    font-weight: 1000;\r\n    color: var(--brand);\r\n    text-shadow: 0 12px 26px rgba(0,0,0,.58);\r\n    -webkit-text-stroke: .35px rgba(0,0,0,.18);\r\n  }\r\n\r\n  .bh-p{\r\n    margin:0 0 12px;\r\n    font-size: 14px;\r\n    line-height: 1.6;\r\n    color: rgba(255,255,255,.98);\r\n    max-width: 56ch;\r\n    text-shadow: 0 12px 26px rgba(0,0,0,.62);\r\n  }\r\n\r\n  \/* Clamp (uniforma altezze) *\/\r\n  .bh-card .bh-h2{\r\n    display: -webkit-box;\r\n    -webkit-box-orient: vertical;\r\n    -webkit-line-clamp: 2;\r\n    overflow: hidden;\r\n  }\r\n  .bh-card .bh-p{\r\n    display: -webkit-box;\r\n    -webkit-box-orient: vertical;\r\n    -webkit-line-clamp: 3;\r\n    overflow: hidden;\r\n  }\r\n  .bh-card--feature .bh-p{\r\n    -webkit-line-clamp: 4;\r\n  }\r\n\r\n  .bh-cta{\r\n    display:inline-flex;\r\n    align-items:center;\r\n    gap:10px;\r\n    padding: 10px 14px;\r\n    border-radius: 999px;\r\n    background: rgba(182,205,67,.92);\r\n    border: 2px solid rgba(182,205,67,.92);\r\n    color: #fff;\r\n    font-weight: 1000;\r\n    letter-spacing: .02em;\r\n    box-shadow: 0 12px 26px rgba(0,0,0,.18);\r\n    width: fit-content;\r\n    transition: transform .16s ease, color .16s ease, filter .16s ease;\r\n  }\r\n  .bh-cta--btn{ background: var(--brand); border-color: var(--brand); }\r\n\r\n  .bh-card:hover .bh-cta,\r\n  .bh-wide:hover .bh-cta{\r\n    color:#000;\r\n    transform: translateY(-1px);\r\n    filter: brightness(1.03);\r\n  }\r\n\r\n  .bh-arrow{\r\n    display:inline-block;\r\n    transform: translateX(0);\r\n    transition: transform .16s ease;\r\n  }\r\n  .bh-card:hover .bh-arrow,\r\n  .bh-wide:hover .bh-arrow{\r\n    transform: translateX(3px);\r\n  }\r\n\r\n  .bh-chips{\r\n    display:flex;\r\n    flex-wrap:wrap;\r\n    gap:8px;\r\n    margin: 6px 0 12px;\r\n  }\r\n  .bh-chip{\r\n    font-size: 12px;\r\n    font-weight: 900;\r\n    padding: 7px 10px;\r\n    border-radius: 999px;\r\n    background: rgba(255,255,255,.12);\r\n    border: 1px solid rgba(255,255,255,.20);\r\n    color: rgba(255,255,255,.92);\r\n    backdrop-filter: blur(4px);\r\n  }\r\n\r\n  \/* posizionamento top row *\/\r\n  .bh-card:nth-child(1){ grid-column: 1 \/ span 4; }\r\n  .bh-card:nth-child(2){ grid-column: 5 \/ span 4; }\r\n  .bh-card:nth-child(3){ grid-column: 9 \/ span 4; }\r\n\r\n  \/* WIDE cards *\/\r\n  .bh-wide{\r\n    position:relative;\r\n    display:grid;\r\n    grid-template-columns: 1.1fr .9fr;\r\n    border-radius: var(--radius);\r\n    overflow:hidden;\r\n    text-decoration:none;\r\n    color: var(--ink);\r\n    background: #fff;\r\n    box-shadow: var(--shadow2);\r\n    transition: transform .18s ease, box-shadow .18s ease;\r\n    min-height: 280px;\r\n  }\r\n  .bh-wide:hover{\r\n    transform: translateY(-4px);\r\n    box-shadow: var(--shadow);\r\n  }\r\n  .bh-wide:focus-visible{\r\n    outline: 3px solid rgba(0,0,0,.8);\r\n    outline-offset: 3px;\r\n  }\r\n  .bh-wide:nth-child(4){ grid-column: 1 \/ span 6; }\r\n  .bh-wide:nth-child(5){ grid-column: 7 \/ span 6; }\r\n\r\n  \/* \u2705 MOD: anche nelle wide l\u2019immagine riempie sempre il contenitore *\/\r\n  .bh-wide__media{\r\n    position:relative;\r\n    min-height: 280px;\r\n    overflow:hidden; \/* NEW *\/\r\n  }\r\n  .bh-wide__media img{\r\n    position:absolute; \/* NEW *\/\r\n    inset:0;           \/* NEW *\/\r\n    width:100%;\r\n    height:100%;\r\n    object-fit: cover;\r\n    display:block;     \/* NEW *\/\r\n    transform: scale(1.02);\r\n    transition: transform .55s ease;\r\n    filter: saturate(1.04) contrast(1.02);\r\n  }\r\n  .bh-wide:hover .bh-wide__media img{ transform: scale(1.08); }\r\n\r\n  .bh-wide__shade{\r\n    position:absolute; inset:0;\r\n    background: linear-gradient(90deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,.12) 45%, rgba(0,0,0,.45) 100%);\r\n  }\r\n\r\n  \/* CTA sempre alla stessa quota nelle wide *\/\r\n  .bh-wide__content{\r\n    padding: 18px 18px 16px;\r\n    display:flex;\r\n    flex-direction:column;\r\n    height: 100%;\r\n    justify-content:flex-start;\r\n    background:\r\n      radial-gradient(680px 320px at 20% 20%, rgba(182,205,67,.18), transparent 60%),\r\n      linear-gradient(180deg, rgba(243,247,232,.9), #fff);\r\n  }\r\n  .bh-wide__content .bh-cta{ margin-top: auto; }\r\n\r\n  .bh-h2--wide{\r\n    text-shadow: none;\r\n    -webkit-text-stroke: 0;\r\n    color: var(--brand);\r\n    font-size: 22px;\r\n    margin-top: 12px;\r\n  }\r\n  .bh-p--wide{\r\n    color: var(--muted);\r\n    margin-bottom: 12px;\r\n    text-shadow: none;\r\n  }\r\n\r\n  .bh-list{\r\n    list-style:none;\r\n    padding:0;\r\n    margin: 0 0 14px;\r\n    display:grid;\r\n    gap:8px;\r\n    color: rgba(14,14,14,.78);\r\n    font-weight: 800;\r\n  }\r\n  .bh-dot{\r\n    display:inline-block;\r\n    width:8px; height:8px;\r\n    border-radius:999px;\r\n    background: var(--brand);\r\n    box-shadow: 0 0 0 5px rgba(182,205,67,.18);\r\n    margin-right:10px;\r\n    transform: translateY(1px);\r\n  }\r\n\r\n  \/* ========= CONTATTACI (WIDE) \u2014 SOLO TESTO ========= *\/\r\n  .bh-wide--contact{ grid-template-columns: 1fr; } \/* \u2705 niente colonna media *\/\r\n\r\n  .bh-wide__content--contact{\r\n    position:relative;\r\n    overflow:hidden;\r\n    background:\r\n      radial-gradient(700px 260px at 20% 10%, rgba(182,205,67,.22), transparent 62%),\r\n      radial-gradient(560px 220px at 90% 80%, rgba(182,205,67,.14), transparent 62%),\r\n      linear-gradient(180deg, rgba(243,247,232,.9), #fff);\r\n  }\r\n  \/* \u201criempie\u201d un po\u2019 la box senza immagini (solo gradienti) *\/\r\n  .bh-wide__content--contact::after{\r\n    content:\"\";\r\n    position:absolute;\r\n    width: 420px; height: 420px;\r\n    border-radius: 999px;\r\n    right: -180px; top: -180px;\r\n    background: radial-gradient(circle at 30% 30%, rgba(182,205,67,.22), rgba(182,205,67,0) 66%);\r\n    filter: blur(2px);\r\n    pointer-events:none;\r\n    z-index:0;\r\n  }\r\n  .bh-wide__content--contact > *{ position:relative; z-index:1; }\r\n\r\n  .bh-p--lead{\r\n    font-size: 15px;\r\n    line-height: 1.65;\r\n    max-width: 52ch;\r\n  }\r\n\r\n  .bh-contactList{\r\n    list-style:none;\r\n    padding:0;\r\n    margin: 6px 0 14px;\r\n    display:grid;\r\n    gap:10px;\r\n    font-weight: 1000;\r\n    color: rgba(14,14,14,.78);\r\n  }\r\n  .bh-contactList li{\r\n    display:flex;\r\n    align-items:center;\r\n    gap:10px;\r\n  }\r\n  .bh-contactIcon{\r\n    width: 34px;\r\n    height: 34px;\r\n    display:inline-flex;\r\n    align-items:center;\r\n    justify-content:center;\r\n    border-radius: 999px;\r\n    background: rgba(182,205,67,.18);\r\n    box-shadow: 0 0 0 6px rgba(182,205,67,.12);\r\n    font-size: 15px;\r\n    flex: 0 0 auto;\r\n  }\r\n  .bh-contactText{ letter-spacing: .01em; }\r\n\r\n  \/* ===== RESPONSIVE ===== *\/\r\n  @media (max-width: 980px){\r\n    .bh-grid{ grid-template-columns: repeat(6, minmax(0,1fr)); }\r\n    .bh-card:nth-child(1){ grid-column: 1 \/ span 6; min-height: 250px; }\r\n    .bh-card:nth-child(2){ grid-column: 1 \/ span 3; min-height: 240px; }\r\n    .bh-card:nth-child(3){ grid-column: 4 \/ span 3; min-height: 240px; }\r\n\r\n    .bh-wide:nth-child(4){ grid-column: 1 \/ span 6; }\r\n    .bh-wide:nth-child(5){ grid-column: 1 \/ span 6; }\r\n\r\n    .bh-wide{ grid-template-columns: 1fr; }\r\n    .bh-wide__media{ min-height: 220px; }\r\n  }\r\n\r\n  @media (max-width: 640px){\r\n    .bh-grid{ grid-template-columns: 1fr; }\r\n    .bh-card:nth-child(1),\r\n    .bh-card:nth-child(2),\r\n    .bh-card:nth-child(3),\r\n    .bh-wide:nth-child(4),\r\n    .bh-wide:nth-child(5){ grid-column: auto !important; }\r\n\r\n    .bh-body{ padding: 16px; }\r\n    .bh-h2{ font-size: 18px; }\r\n  }\r\n\r\n  \/* ===== REVEAL ===== *\/\r\n  .bh-reveal{\r\n    opacity:0;\r\n    transform: translateY(10px);\r\n    transition: opacity .55s ease, transform .55s ease;\r\n    will-change: opacity, transform;\r\n  }\r\n  .bh-reveal.is-in{\r\n    opacity:1;\r\n    transform:none;\r\n  }\r\n\r\n  @media (prefers-reduced-motion: reduce){\r\n    .bh-reveal{ opacity:1 !important; transform:none !important; transition:none !important; }\r\n    .bh-card, .bh-wide, .bh-media img, .bh-wide__media img{ transition:none !important; transform:none !important; }\r\n  }\r\n<\/style>\r\n\r\n<script>\r\n  document.addEventListener('DOMContentLoaded', function(){\r\n    const els = document.querySelectorAll('.bergold-hub .bh-reveal');\r\n    const io = new IntersectionObserver((entries)=>{\r\n      entries.forEach(e=>{\r\n        if(e.isIntersecting){\r\n          e.target.classList.add('is-in');\r\n          io.unobserve(e.target);\r\n        }\r\n      });\r\n    }, { threshold: 0.14 });\r\n    els.forEach(el=>io.observe(el));\r\n  });\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Accetta i cookie per vedere il video Prodotti artigianali, dal frutto al laboratorio Tradizione calabrese che profuma di bergamotto Benvenuti [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1004","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/bergold.it\/en\/wp-json\/wp\/v2\/pages\/1004","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bergold.it\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bergold.it\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bergold.it\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bergold.it\/en\/wp-json\/wp\/v2\/comments?post=1004"}],"version-history":[{"count":68,"href":"https:\/\/bergold.it\/en\/wp-json\/wp\/v2\/pages\/1004\/revisions"}],"predecessor-version":[{"id":1879,"href":"https:\/\/bergold.it\/en\/wp-json\/wp\/v2\/pages\/1004\/revisions\/1879"}],"wp:attachment":[{"href":"https:\/\/bergold.it\/en\/wp-json\/wp\/v2\/media?parent=1004"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}