/*
Theme Name: Veneta Lacci Multilang
Theme URI: https://venetalacci.it/
Author: Veneta Lacci (draft)
Description: Tema WordPress moderno B2B (grafica chiara, hero full-screen, cards con immagini categorie, compatibile Gutenberg).
Version: 1.5.4-v4
Requires at least: 6.0
Requires PHP: 7.4
License: GPL v2 or later
Text Domain: venetalacci
Tags: custom-logo, custom-menu, featured-images, block-styles, wide-blocks
*/

:root{
  --vl-bg:#f6f8fb;
  --vl-surface:#ffffff;
  --vl-text:#0f172a;
  --vl-muted:#475569;
  --vl-accent:#2563eb;
  --vl-accent-2:#06b6d4;
  --vl-border:rgba(15,23,42,.10);
  --vl-radius:22px;
  --vl-max:1240px;
  --vl-shadow:0 26px 60px rgba(2,6,23,.12);
  --vl-shadow-soft:0 14px 34px rgba(2,6,23,.10);
  --vl-font:Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  --vl-logo-h:52px;
  --vl-header-h:78px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--vl-font);
  background:var(--vl-bg);
  color:var(--vl-text);
  line-height:1.6;
}
a{color:inherit;text-decoration:none}
p{margin:0 0 14px}
/* Layout */
.vl-container{max-width:var(--vl-max);margin:0 auto;padding:0 24px}
/* Header */
.vl-topbar{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--vl-border);
}
.vl-header{
  height:var(--vl-header-h);
  display:flex; align-items:center; justify-content:space-between;
}
.vl-brand{display:flex; align-items:center; gap:10px}
.vl-brand img,.custom-logo{height:var(--vl-logo-h); width:auto}
.vl-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:18px;align-items:center}
.vl-nav a{color:var(--vl-text);font-weight:600;opacity:.92;padding:10px 12px;border-radius:999px}
.vl-nav a:hover{background:rgba(2,6,23,.05);opacity:1}
/* Hero full screen */
.vl-hero{
  min-height:100vh;
  padding-top: var(--vl-header-h);
  display:flex;
  align-items:stretch;
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.92)),
    radial-gradient(900px 500px at 15% 10%, rgba(37,99,235,.20), transparent 60%),
    radial-gradient(900px 500px at 90% 0%, rgba(6,182,212,.22), transparent 55%);
}
.vl-hero.has-image{
  background:
    linear-gradient(180deg, rgba(255,255,255,.64), rgba(255,255,255,.94)),
    var(--vl-hero-image) center/cover no-repeat;
}
.vl-hero-inner{
  display:flex;
  align-items:center;
  width:100%;
  padding: 54px 0 56px;
}
.vl-hero-card{
  max-width: 820px;
}
.vl-eyebrow{
  color:var(--vl-accent);
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
  font-size:12px;
}
.vl-h1{
  font-size:clamp(34px,5vw,60px);
  line-height:1.06;
  margin:14px 0 18px;
  letter-spacing:-.02em;
}
.vl-lead{
  font-size:18px;
  color:var(--vl-muted);
  max-width:62ch;
}
.vl-cta{margin-top:26px;display:flex;gap:14px;flex-wrap:wrap}
.vl-btn{
  padding:14px 22px;
  border-radius:999px;
  font-weight:800;
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--vl-border);
}
.vl-btn.primary{
  border:none;
  background:linear-gradient(135deg,var(--vl-accent),var(--vl-accent-2));
  color:#fff;
  box-shadow: var(--vl-shadow-soft);
}
.vl-btn.primary:hover{filter:brightness(1.03)}
.vl-btn.ghost{
  background:#fff;
  color:var(--vl-text);
}
.vl-btn.ghost:hover{background:#f2f5fb}
/* Sections */
.vl-section{padding:90px 0}
.vl-section.tight{padding:70px 0}
.vl-kicker{
  font-size:14px; color:var(--vl-accent); font-weight:800; letter-spacing:.08em; text-transform:uppercase;
}
.vl-title{
  font-size:34px; line-height:1.15; margin:10px 0 10px; letter-spacing:-.02em;
}
.vl-subtitle{color:var(--vl-muted); max-width:70ch}
.vl-grid{display:grid; grid-template-columns:repeat(12,1fr); gap:22px; margin-top:26px}
.vl-card{
  background:var(--vl-surface);
  border:1px solid rgba(15,23,42,.06);
  border-radius:var(--vl-radius);
  box-shadow: var(--vl-shadow);
  padding:28px;
}
.vl-card h3{margin:0 0 6px; font-size:18px}
.vl-card p{color:var(--vl-muted); margin:0}
.vl-col-4{grid-column:span 4}
.vl-col-6{grid-column:span 6}
.vl-col-12{grid-column:span 12}

/* Category cards with images */
.vl-cat{
  position:relative;
  overflow:hidden;
  padding:0;
  min-height: 280px;
  display:flex;
  align-items:flex-end;
  border-radius: var(--vl-radius);
  box-shadow: var(--vl-shadow);
  border:1px solid rgba(15,23,42,.06);
  background: linear-gradient(135deg, rgba(37,99,235,.12), rgba(6,182,212,.10));
}
.vl-cat::before{
  content:"";
  position:absolute; inset:0;
  background: var(--vl-cat-image, linear-gradient(135deg, rgba(37,99,235,.22), rgba(6,182,212,.18))) center/cover no-repeat;
  transform: scale(1.02);
  opacity: .95;
}
.vl-cat::after{
  content:"";
  position:absolute; inset:0;
  /* Stronger readable overlay at the bottom (text area) */
  background: linear-gradient(180deg,
    rgba(255,255,255,0.10) 0%,
    rgba(255,255,255,0.55) 40%,
    rgba(255,255,255,0.92) 75%,
    rgba(255,255,255,0.98) 100%);
}
.vl-cat .vl-cat-inner{
  position:relative;
  z-index: 3;
  width:100%;
  padding: 22px;
}
.vl-cat .vl-cat-title{
  font-size:20px;
  font-weight:900;
  margin:0 0 6px;
  letter-spacing:-.01em;
  color: var(--vl-text);
  text-shadow: 0 1px 1px rgba(255,255,255,.65);
}
.vl-cat .vl-cat-desc{
  color: rgba(15,23,42,.75);
  margin:0 0 12px;
  max-width: 46ch;
  text-shadow: 0 1px 1px rgba(255,255,255,.55);
}
.vl-badges{display:flex;gap:8px;flex-wrap:wrap}
.vl-badge{
  display:inline-flex; align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.92);
  border:1px solid rgba(15,23,42,.10);
  font-size:12px;
  color: rgba(15,23,42,.85);
  font-weight:800;
  box-shadow: 0 10px 24px rgba(2,6,23,.08);
}

/* Feature strip */
.vl-strip{
  background: linear-gradient(135deg, rgba(37,99,235,.10), rgba(6,182,212,.10));
  border:1px solid rgba(15,23,42,.06);
  border-radius: var(--vl-radius);
  padding: 22px;
}
.vl-strip strong{font-weight:900}
.vl-strip p{color:var(--vl-muted)}

/* Footer */
.vl-footer{
  background:#0b1220;
  color:#dbe3ee;
  padding:70px 0;
  margin-top:20px;
}
.vl-footer a{color:#dbe3ee; opacity:.95}
/* Content pages */
.vl-content{
  padding-top: calc(var(--vl-header-h) + 28px);
  padding-bottom: 40px;
}
.vl-content h1{font-size:clamp(28px,3.8vw,44px); margin:0 0 14px; letter-spacing:-.02em}
.vl-content h2{margin-top:28px}
.vl-content p, .vl-content li{color:var(--vl-muted); font-size:16px}

/* Responsive */
@media(max-width:980px){
  .vl-col-4,.vl-col-6{grid-column:span 12}
  .vl-nav ul{gap:10px}
  .vl-hero-inner{padding: 42px 0 46px}
  .vl-cat{min-height: 250px}
}


/* Dropdown (submenu) */
.vl-nav li{position:relative}
.vl-nav .sub-menu{
  display:none !important;
  position:absolute;
  top: calc(100% + 10px);
  left: 0;
  min-width: 240px;
  padding: 10px;
  background: rgba(255,255,255,.98);
  border: 1px solid var(--vl-border);
  border-radius: 16px;
  box-shadow: var(--vl-shadow-soft);
  z-index: 200;
}
.vl-nav .sub-menu{flex-direction:column}
.vl-nav li:hover > .sub-menu,
.vl-nav li:focus-within > .sub-menu{display:block !important}

/* Internal page hero */
.vl-page-hero{
  padding-top: var(--vl-header-h);
  min-height: 48vh;
  background:
    radial-gradient(900px 500px at 15% 0%, rgba(37,99,235,.18), transparent 60%),
    radial-gradient(900px 500px at 90% 10%, rgba(6,182,212,.18), transparent 55%),
    linear-gradient(180deg, #ffffff, #f6f8fb);
  border-bottom: 1px solid rgba(15,23,42,.06);
}
.vl-page-hero.has-image{
  background:
    linear-gradient(90deg, rgba(255,255,255,.88) 0%, rgba(255,255,255,.70) 55%, rgba(255,255,255,.42) 100%),
    linear-gradient(180deg, rgba(255,255,255,.40), rgba(255,255,255,.86)),
    var(--vl-page-hero-image) center/cover no-repeat;
}
.vl-page-hero-inner{
  padding: 64px 0 56px;
}
.vl-page-title{
  font-size: clamp(28px, 3.8vw, 46px);
  line-height: 1.08;
  margin: 0 0 10px;
  letter-spacing: -.02em;
}
.vl-page-lead{color: var(--vl-muted); max-width: 72ch; font-size: 16px}
.vl-page-breadcrumbs{color: var(--vl-muted); font-size: 13px; margin-top: 6px}

.vl-page-hero-inner{max-width: 980px}
.vl-page-lead{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 70ch;
}

/* Header alignment */
.vl-header{
  justify-content:flex-start;
  gap:40px;
}
.vl-nav{
  margin-left:auto;
}

/* Wider container for header */
.vl-container-wide{max-width:none;margin:0 auto;padding:0 24px}

/* Ensure combined Cordini e Corde shows image if available */
.vl-cat[data-cat='cordini-e-corde']::before{
  background: var(--vl-cat-image, linear-gradient(135deg, rgba(37,99,235,.22), rgba(6,182,212,.18))) center/cover no-repeat;
}

.vl-col-3{grid-column:span 3}
@media(max-width:980px){.vl-col-3{grid-column:span 12}}

/* Forms (modern) */
.vl-form-wrap{
  max-width: 980px;
  margin-top: 18px;
}
.vl-form{
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  box-shadow: var(--vl-shadow-soft);
  padding: 22px;
}
.vl-form label{
  display:block;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .02em;
  color: rgba(15,23,42,.80);
  margin: 0 0 8px;
}
.vl-form input,
.vl-form select,
.vl-form textarea{
  width: 100%;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.14);
  padding: 12px 12px;
  font-size: 14px;
  background: rgba(255,255,255,.98);
  outline: none;
  transition: box-shadow .15s ease, border-color .15s ease, transform .15s ease;
}
.vl-form textarea{min-height: 110px; resize: vertical;}
.vl-form input:focus,
.vl-form select:focus,
.vl-form textarea:focus{
  border-color: rgba(37,99,235,.55);
  box-shadow: 0 0 0 6px rgba(37,99,235,.12);
}
.vl-form .vl-btn{margin-top: 14px}
.vl-form .vl-help{
  font-size: 12px;
  color: var(--vl-muted);
  margin-top: 10px;
}

/* Home sector cards */
.vl-cat{position:relative;overflow:hidden;text-decoration:none}
.vl-cat-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.02)}
.vl-cat-cta{display:inline-flex;align-items:center;gap:8px;font-weight:900;font-size:12px;letter-spacing:.02em;color:rgba(15,23,42,.85);background:rgba(255,255,255,.92);border:1px solid rgba(15,23,42,.10);padding:8px 12px;border-radius:999px;box-shadow:0 10px 24px rgba(2,6,23,.08);}

/* Settori in cui operiamo (Home) */
.vl-sectors-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
@media (max-width: 980px){
  .vl-sectors-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .vl-sectors-grid{ grid-template-columns: 1fr; }
}
.vl-feature{
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  padding: 16px 16px 14px;
  box-shadow: var(--vl-shadow-soft);
}
.vl-feature-title{
  font-weight: 900;
  letter-spacing: -.01em;
  margin-bottom: 6px;
  color: var(--vl-text);
}
.vl-feature-desc{
  color: rgba(15,23,42,.72);
  font-size: 14px;
  line-height: 1.4;
}




/* Footer social icons */
.footer-social{
  display:flex;
  justify-content:center;
  gap:20px;
  margin:24px 0 0;
  align-items:center;
  width:100%;
}
.footer-social a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.footer-social img{
  width:32px;
  height:32px;
  transition:transform .25s ease, opacity .25s ease;
}
.footer-social a:hover img{
  transform:translateY(-3px);
  opacity:.85;
}


/* === HERO FONT REFINEMENT === */
.hero-title {
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.15;
}

.vl-lead {
  font-size: 17px;
  line-height: 1.6;
  color: #3a3a3a;
  max-width: 520px;
}

.vl-eyebrow {
  font-size: 12px;
  letter-spacing: 0.12em;
  font-weight: 700;
  text-transform: uppercase;
}

.vl-btn.primary {
  font-weight: 600;
  letter-spacing: 0.02em;
}

@media (max-width: 768px) {
  .hero-title {
    font-size: 32px;
    line-height: 1.2;
  }
  .vl-lead {
    font-size: 16px;
  }
}

/* Mobile menu / overlay + submenu toggles */
@media (max-width: 980px){

  .vl-dots{
    position: fixed;
    top: 14px;
    right: 14px;
    z-index: 1000002;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,.12);
    background: rgba(255,255,255,.95);
    font-size: 22px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }

  /* overlay vero (non pseudo-elemento) */
  .vl-overlay{
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    z-index: 1000000;
    display: none;
  }
  body.vl-menu-open .vl-overlay{ display:block; }

  /* pannello menu */
  .vl-nav{
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    height: 100vh !important;
    width: min(82vw, 320px) !important;
    background: #fff !important;
    border-left: 1px solid rgba(0,0,0,.12) !important;
    padding: 72px 14px 14px !important;
    z-index: 1000001 !important;

    transform: translateX(105%) !important;
    transition: transform .25s ease !important;
    overflow: auto !important;

    display: block !important;
    pointer-events: auto !important;
  }
  body.vl-menu-open .vl-nav{ transform: translateX(0) !important; }

  .vl-nav ul{
    display:flex !important;
    flex-direction:column !important;
    gap:6px !important;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
  }
  .vl-nav a{
    display:block !important;
    padding:12px 12px !important;
    text-decoration:none !important;
    border-radius:12px !important;
  }
}

/* Desktop: niente bottone ⋮ e niente overlay, menu normale sempre visibile */
@media (min-width: 981px){
  .vl-dots{ display:none !important; }
  .vl-overlay{ display:none !important; }
  .vl-nav{
    position: static !important;
    transform: none !important;
    height: auto !important;
    width: auto !important;
    padding: 0 !important;
    overflow: visible !important;
  }
}

@media (max-width: 980px){

  /* di default, chiudi sottomenu */
  .vl-nav .sub-menu,
  .vl-nav .children{
    display: none !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    margin: 6px 0 0 0 !important;
    padding: 6px 0 0 12px !important;
    border-left: 2px solid rgba(0,0,0,.10) !important;
    background: transparent !important;
  }

  /* quando il LI è "aperto" */
  .vl-nav li.vl-sub-open > .sub-menu,
  .vl-nav li.vl-sub-open > .children{
    display: block !important;
  }

  /* wrapper per link + freccia */
  .vl-nav .vl-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }

  /* freccina */
  .vl-nav .vl-sub-toggle{
    width: 38px;
    height: 38px;
    border-radius: 10px;
    border: 1px solid rgba(0,0,0,.10);
    background: rgba(255,255,255,.95);
    font-size: 16px;
    line-height: 1;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex: 0 0 auto;
    cursor: pointer;
  }

  /* ruota quando aperto */
  .vl-nav li.vl-sub-open > .vl-item .vl-sub-toggle{
    transform: rotate(180deg);
  }

  /* un filo più “submenu” */
  .vl-nav .sub-menu a,
  .vl-nav .children a{
    padding: 10px 12px !important;
    font-size: 15px !important;
  }
}

/* WP Google Maps: forza altezza e visibilità */
#wpgmza_map, .wpgmza_map, .wpgmza_map_container{
  width: 100% !important;
  min-height: 420px !important;
}
