/* ===== LOGISOURCE — GLOBAL CSS v3.0 SAFE ===== */

:root{
  /* Brand */
  --brand:#1b4f8a;
  --brand-2:#00A8FF;

  /* Neutrals */
  --ink:#1f2937;         /* testo principale */
  --text:var(--ink);     /* alias per compatibilità */
  --muted:#6b7280;       /* testo secondario */

  /* UI */
  --bg:#f7fbff;          /* sfondo pagina */
  --card:#ffffff;        /* sfondo blocchi */
  --border:#E8EEF5;      /* bordo/blocco */
  --radius:18px;
  --shadow:0 10px 25px rgba(0,0,0,.06);
}

/* ==== BASE ==== */
*, *::before, *::after { box-sizing:border-box; }
html, body { margin:0; padding:0; }
body{
  font-family:system-ui,-apple-system,'Segoe UI',Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.55;
}

body, .site, .site-main {
  background-color: var(--bg);
}

/* Uniforma lo spazio sotto l’header */
:root { --page-top-gap: 28px; } /* usa il valore della pagina Steel Products */

body.page .elementor-location-header + .elementor,
body.page .elementor-location-header + .site-main {
  margin-top: var(--page-top-gap);
}

/* Rimuove margini/padding iniziali del primo section */
body.page .elementor > .elementor-section:first-of-type {
  margin-top: 0;
  padding-top: 0;
}

/* Evita margine extra sul primo H1 della pagina */
body.page .elementor h1:first-child {
  margin-top: 0;
}


/* HEADER */
/* 1) Nascondi l’header del tema */
.site-header{ display:none; }

/* 2) Header Elementor/UAEL: contenitore centrato e max 1000px */
header.elementor-location-header{
  background:var(--bg); /* stesso sfondo del sito (facoltativo) */
}
header.elementor-location-header .elementor-section.elementor-section-boxed > .elementor-container,
header.elementor-location-header .elementor-container{
  max-width:1000px;
  width:100%;
  margin-left:auto;
  margin-right:auto;
  padding-left:0;
  padding-right:0;
}

/* Se la sezione dell’header è “Stretched”, riallineala al centro */
header.elementor-location-header .elementor-section.elementor-section-stretched{
  left:50%;
  transform:translateX(-50%);
  width:100%;
}
header.elementor-location-header .elementor-section.elementor-section-stretched > .elementor-container{
  max-width:1000px;
}

/* 3) Centra il menu (Elementor Nav Menu e UAEL Nav Menu) */
header.elementor-location-header .elementor-widget-nav-menu .elementor-nav-menu,
header.elementor-location-header .uael-nav-menu .uael-nav-menu__container,
header.elementor-location-header .uael-nav-menu .uael-nav-menu__wrapper{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:20px;
  margin:0 auto;
}

/* Assicura che il widget menu non “tiri” a tutta larghezza */
header.elementor-location-header .elementor-widget-nav-menu,
header.elementor-location-header .uael-nav-menu{
  width:100%;
}

/* 4) Mobile: hamburger centrato */
header.elementor-location-header .elementor-menu-toggle,
header.elementor-location-header .uael-hamburger{
  margin-left:auto;
  margin-right:auto;
}

/* Font stack semplice con fallback + scala titoli */
body{
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size:16px; line-height:1.6; font-weight:400;
}
h1,h2,h3{
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-weight:700; line-height:1.2;
}
h1{font-size:36px;}
h2{font-size:28px;}
h3{font-size:22px;}
h4,h5,h6{font:inherit;}

/* CONTAINER */
.wrap, .section, .page-content{
  max-width:1000px;
  margin:0 auto;
  padding:48px 20px;
}
.section{ max-width:1000px; padding:0 8px 40px; }
.page-content{ max-width:1000px; padding:0 16px 32px; }

/* HERO uniforme (stile Steel) */
.page-hero{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:16px;
  padding:28px 24px;
  margin:0 auto 32px;
  max-width:1100px;
  color:var(--ink);
  display:grid;
  gap:10px;
}
.page-hero h1{
  font-size:42px;
  font-weight:700;
  letter-spacing:-0.3px;
  line-height:1.1;
  margin:0 0 8px 0;
  color:var(--ink);
}
.page-hero p{
  font-size:17px;
  line-height:1.5;
  color:var(--muted);
  margin:0;
}

/* ===== Griglia principale 12 colonne (come Steel) ===== */
.grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:22px;
}

/* ===== Card immagine + testo ===== */
.card{
  grid-column:span 12;
  background:var(--card);
  /* niente border di default per matchare Steel Products */
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  display:flex;
  flex-direction:column; /* media sopra, testo sotto */
}
/* bordo opzionale quando serve */
.card--border{ border:1px solid var(--border); }

/* Variante orizzontale su desktop */
.card--row{ flex-direction:row; }

/* Pattern legacy con wrapper (mantieni per pagine già fatte) */
.media-wrap{
  position:relative;
  width:100%;
  padding-top:56.25%; /* 16:9 */
  background:#e5e7eb;
  overflow:hidden;
}
.media-wrap > img,
.media-wrap > video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; display:block;
}

/* Contenuto testuale della card */
.content{ padding:20px; }
.content h2{ margin:0 0 8px; font-size:24px; line-height:1.25; color:var(--ink); }
.content p{ margin:0 0 10px; color:var(--muted); }
.content ul{ margin:10px 0 0 18px; padding:0; }
.content li{ margin:4px 0; }

@media (min-width:980px){
  .card--row .media{ width:46%; }
  .card--row .content{ width:54%; }
}

/* ===== Card solo testo (tipo Equestrian) ===== */
.tcard{
  grid-column:span 12;
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:var(--shadow);
  padding:24px;
}
.tcard h2{ margin:0 0 8px; font-size:24px; line-height:1.25; color:var(--ink); }
.tcard p{ margin:0 0 12px; color:var(--muted); }
.tcard ul{ margin:8px 0 0 18px; padding:0; }
.tcard li{ margin:6px 0; }

/* Card larghezza piena quando serve esplicitamente */
.card--full, .tcard--full { grid-column:span 12; }

/* Da 720px in su: card metà riga (NON full width) */
@media (min-width:720px){
  .card{ grid-column:span 6; }
  .tcard{ grid-column:span 6; }
}

/* ===== Griglia legacy auto-fit (compat Equestrian/Fashion esistenti) ===== */
.card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:24px;
  margin:0 0 24px 0;
}

/* ===== Sezione immagini semplici (4 slot) ===== */
.image-card img{
  width:100%;
  height:auto;
  border-radius:12px;
  display:block;
}

/* ===== CTA / Contact unificati ===== */
.cta{
  margin-top:34px;
  background:linear-gradient(135deg, var(--brand), var(--brand-2));
  color:#fff;
  border-radius:var(--radius);
  padding:26px;
  box-shadow:var(--shadow);
}
.cta h3{ margin:0 0 8px; font-size:22px; }
.cta p{ margin:0 0 16px; color:#eef6ff; }
.cta .btn{
  display:inline-block;
  padding:12px 18px;
  background:#fff;
  color:var(--brand);
  border-radius:12px;
  text-decoration:none;
  font-weight:600;
}

.contact-section{ margin:24px 0 56px; }
.contact-card{ text-align:center; }
.contact-card .button{
  display:inline-block;
  margin-top:8px;
  padding:10px 16px;
  border-radius:10px;
  border:1px solid var(--border);
  text-decoration:none;
  color:var(--brand);
  min-height:44px;
  line-height:1.2;
  -webkit-tap-highlight-color:transparent;
}
.contact-card .button:hover{
  background:var(--brand-2);
  color:#fff;
  transition:.2s ease;
}

/* ===== Bullets personalizzati e KPI (About/Services) ===== */
.ls-bullets{ list-style:none; padding:0; margin:8px 0 0; }
.ls-bullets li{ margin:8px 0; padding-left:26px; position:relative; color:var(--muted); }
.ls-bullets li::before{
  content:""; position:absolute; left:0; top:6px;
  width:14px; height:14px; border-radius:4px;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
}
.ls-kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:18px; }
.ls-kpis .chip{
  background:#fff; border:1px dashed #DBE6F2;
  border-radius:12px; padding:10px 12px; text-align:center;
  font-size:14px; color:var(--brand);
}

/* ===== Utility ===== */
.uael-nav-menu .no-click{ pointer-events:none; cursor:default; }

/* ===== Responsive rifiniture ===== */
@media (max-width:1024px){
  .section{ max-width:1000px; padding:0 16px 40px; }
  .page-hero{ padding:24px 20px; }
}
@media (max-width:860px){
  .section{ max-width:740px; padding:0 16px 32px; }
  .page-hero h1{ font-size:32px; letter-spacing:-0.2px; }
  .page-hero{ padding:22px 18px; }
}
@media (max-width:600px){
  .wrap, .section, .page-content{ padding:24px 14px; }
  .grid{ gap:16px; }
  .card{ grid-column:span 12; border-radius:14px; }
  .tcard{ grid-column:span 12; border-radius:14px; }
  .content h2{ font-size:22px; }
  .contact-card .button{ width:100%; text-align:center; }
}
@media (max-width:360px){
  .page-hero h1{ font-size:26px; }
}

/* ===== MENU MOBILE UAEL (overlay fisso e logo ridimensionato) ===== */
.uael-nav-menu__layout-vertical {
  background:#ffffff !important;
  z-index:9999 !important;
  position:fixed !important;
  top:0; left:0; right:0;
  padding-top:70px; /* distanza dal logo */
  min-height:100vh; /* copre tutta la viewport */
}
header img, .uael-nav-menu__logo img {
  height:auto !important;
  width:auto !important;
  max-width:140px !important;
}

/* Compat Steel: supporta <img class="media"> senza wrapper */
.media{ width:100%; display:block; background:#e5e7eb; }
@supports (aspect-ratio: 16/9){
  .media{ aspect-ratio:16/9; object-fit:cover; }
}
@media (min-width:980px){
  .card--row .media{ width:46%; }
  .card--row .content{ width:54%; }
}