:root{
  --bg: #ffffff;
  --surface: #fafafa;
  --muted: #6b7280;
  --text: #0d0f12;
  --accent: #933339;
  --accent-2: #b44a50;
  --line: #e5e7eb;
  --maxw: 1180px;
}
*{box-sizing:border-box}
html,body{margin:0}
html{scroll-behavior:smooth}
body{font-family:Roboto,system-ui,-apple-system,Segoe UI,Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 20px}

/* Font gestito via Google Fonts; rimosso @font-face locale non valido */

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;gap:12px;align-items:center}
.brand img{height:38px;width:auto}
.brand b{font-weight:600;letter-spacing:.4px}
.menu{display:flex;gap:22px;align-items:center}
.menu a{font-family:Roboto,system-ui,-apple-system,Segoe UI,Arial,Helvetica,sans-serif;font-weight:500;color:#111827}
.menu a:hover{color:var(--accent)}
.cta{padding:10px 14px;border:1px solid var(--accent);background:transparent;color:var(--accent);font-weight:600}
.burger{display:none;gap:6px;flex-direction:column;background:none;border:0}
.burger span{display:block;height:2px;width:22px;background:#111827}
@media (max-width: 980px){.menu{display:none}.burger{display:flex}}

/* Mobile menu */
.mobile{display:none;background:#fff;border-top:1px solid var(--line)}
.mobile a{display:block;padding:14px 22px;border-bottom:1px solid var(--line);color:#111827}

/* Hero */
.hero{position:relative;padding:92px 0 72px;background:radial-gradient(900px 420px at 10% -10%,rgba(147,51,57,.05),transparent 60%)}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.eyebrow{display:inline-block;font-size:12px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted)}
h1{margin:.2em 0 .4em;font-size:clamp(32px,4vw,48px);line-height:1.15}
.section-head h2,h1,h2,h3,h4{font-family:"Momo Trust Display", Roboto, system-ui, -apple-system, Segoe UI, Arial, Helvetica, sans-serif;font-weight:400}
.lead{font-size:clamp(16px,1.4vw,18px);color:#374151;max-width:56ch}
.hero-actions{display:flex;gap:14px;margin-top:22px;flex-wrap:wrap}
.ghost{padding:10px 14px;border:1px solid var(--line);color:#111827}
.card{background:#fff;border:1px solid var(--line);padding:18px}
.hero-media{position:relative}
.ph{aspect-ratio: 16/10;background:#f3f4f6;border:1px dashed #d1d5db;display:grid;place-items:center}
.ph small{color:var(--muted)}
.ph.card{padding:0} /* niente padding attorno all'immagine dell'hero */
.ph img{width:100%;height:100%;object-fit:cover;object-position:center center;display:block}
.badges{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.badge{font-size:12px;padding:6px 10px;border:1px solid var(--accent);color:#fff;background:var(--accent)}
@media (max-width: 980px){.hero-grid{grid-template-columns:1fr}.hero{padding:70px 0}}

/* Sections */
.section{padding:72px 0;border-top:1px solid var(--line);background:var(--bg);scroll-margin-top:64px}
.section#contact, #contact{
  background-color: var(--surface);
  /* overlay bianco per rendere il pattern meno predominante */
  background-image: linear-gradient(rgba(255,255,255,.85), rgba(255,255,255,.85)), url('images/bg-pattern-linee.jpg');
  background-repeat: no-repeat, repeat;
  background-position: center top, center top;
}
.section#certifications, #certifications{
  background-color: var(--surface);
  background-image: linear-gradient(rgba(255,255,255,.85), rgba(255,255,255,.85)), url('images/bg-pattern-linee.jpg');
  background-repeat: no-repeat, repeat;
  background-position: center top, center top;
}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}
.section-head h2{margin:0;font-size:clamp(22px,2.6vw,32px)}
.muted{color:var(--muted)}

.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media (max-width: 960px){.grid-3,.grid-2{grid-template-columns:1fr}}

.service{padding:18px;border:1px solid var(--line);background:#fff}
.service h3{margin:8px 0 6px;font-size:18px}
.service h3{font-family:"Momo Trust Display", Roboto, system-ui, -apple-system, Segoe UI, Arial, Helvetica, sans-serif;font-weight:400}
.service p{color:#374151}

.split{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
@media (max-width: 980px){.split{grid-template-columns:1fr}}

/* Timeline */
.timeline{display:grid;gap:16px}
.tl-item{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
.dot{width:10px;height:10px;background:var(--accent);margin-top:8px}
.tl-item h4{margin:0 0 6px}
.tl-item h4{font-family:"Momo Trust Display", Roboto, system-ui, -apple-system, Segoe UI, Arial, Helvetica, sans-serif;font-weight:400}

/* Cards with placeholders */
.imgcard{border:1px solid var(--line);background:#fff}
.imgcard .ph{height:220px;overflow:hidden;width:100%;aspect-ratio:auto}
/* Progetti: aumentare altezza per ridurre taglio del contenuto */
#projects .imgcard .ph{height:260px}
/* Customs detail: aumentare altezza per ridurre taglio del contenuto */
#customs-detail .imgcard .ph{height:260px}
.imgcard .content{padding:16px}
.cards{margin-top:16px}

/* Altezza fissa per le immagini nelle card (uniformità dimensioni) */

/* Nota sotto immagine (Customs): più piccola e corsiva */
.imgcard .content .muted--small-italic{font-size:14px;font-style:italic}

/* Certifications row */
.logos{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.logos .mini{height:28px;width:88px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:#6b7280;font-size:12px}

/* Docs lists */
.docs{list-style:none;padding:0;margin:8px 0 0}
.docs li{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.docs li:first-child{border-top:0}
.docs a{color:#111827;display:inline-flex;align-items:center}
.docs a::before{content:"";display:inline-block;width:14px;height:16px;margin-right:8px;background-color:var(--accent);opacity:.85;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Crect x='3' y='2' width='12' height='16' rx='2' fill='%23000'/%3E%3Cpolygon points='12,2 18,8 12,8' fill='%23000'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Crect x='3' y='2' width='12' height='16' rx='2' fill='%23000'/%3E%3Cpolygon points='12,2 18,8 12,8' fill='%23000'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}
.docs a:hover::before{opacity:1}
.docs .tag{font-size:12px;padding:4px 8px;border:1px solid var(--line);background:var(--surface);color:#6b7280}

/* Contact form */
.contact{display:grid;gap:10px}
.contact input,.contact textarea{width:100%;padding:10px 12px;border:1px solid var(--line);background:#fff;color:#111827}
.contact input:focus,.contact textarea:focus{outline:2px solid rgba(147,51,57,.2);outline-offset:1px}

/* Locations list */
.locations{list-style:none;padding:0;margin:12px 0 0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px 18px}
@media (max-width: 960px){.locations{grid-template-columns:1fr}}
.locations li{padding:10px 0}
.locations .badge{display:inline-block;margin-bottom:6px;font-family:"Momo Trust Display", Roboto, system-ui, -apple-system, Segoe UI, Arial, Helvetica, sans-serif;font-weight:400;color:#fff}
.locations .address{display:block;color:#374151}
.locations .phone a{color:#111827}

/* Footer */
.site-footer{padding:46px 0;border-top:1px solid rgba(255,255,255,.12);background:#0d0f12;color:#fff}
.foot{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}
.site-footer small{color:#e5e7eb}
.site-footer .muted{color:#e5e7eb;font-size:14px}
.site-footer a{color:#fff}
@media (max-width: 980px){.foot{grid-template-columns:1fr}}

/* Logo nel footer: ridotto del 50% rispetto al brand globale */
.site-footer .brand img{height:38px}
/* Decorative banner under header */
.banner {
  --banner-height: calc(clamp(240px, 36vw, 480px) + 100px);
  width: 100%;
  height: var(--banner-height);
  overflow: hidden;
  line-height: 0; /* remove extra inline spacing */
}
.banner img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center center; /* centralità orizzontale/verticale */
}
/* Utility class suggerita */
.momo-trust-display-regular{
  font-family:"Momo Trust Display", sans-serif;
  font-weight:400;
  font-style:normal;
}

/* Cookie consent popup */
.cookie-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 999;
}
.cookie-consent {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 20px;
  display: flex;
  justify-content: center;
  z-index: 1000;
}
.cookie-box {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
  max-width: 720px;
  width: calc(100% - 40px);
  padding: 16px 18px;
}
.cookie-actions {
  display: flex;
  gap: 12px;
  margin-top: 12px;
}
.cookie-btn {
  padding: 10px 14px;
  border-radius: 8px;
  border: 1px solid transparent;
  cursor: pointer;
  font-weight: 600;
}
.cookie-btn--primary {
  background: #111827;
  color: #fff;
}
.cookie-btn--ghost {
  background: transparent;
  border-color: #111827;
  color: #111827;
}
.cookie-details summary {
  cursor: pointer;
  margin-top: 8px;
}
.cookie-settings {
  position: fixed;
  left: 20px;
  bottom: 20px;
  z-index: 1000;
  background: #000;
  border: none;
  color: #fff;
  border-radius: 0;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 3px 10px rgba(0,0,0,0.12);
}
.hidden {
  display: none !important;
}
