/* MisterBite — Corporate UI */
:root{
  --brand:#0f3e73;         /* blu principale (pulsanti)   */
  --brand-2:#154d91;       /* blu scuro hover              */
  --outline:#0f3e7333;     /* bordo outline                */
  --ink:#0b1b2b;           /* testo primario               */
  --muted:#5b6a7a;         /* testo secondario             */
  --card:#ffffff;          /* sfondo card                  */
  --ring:0 0 0 4px #0f3e7326;
  --hero-from:#f7fbff;     /* gradient hero chiaro         */
  --hero-to:#eef3f9;       /* gradient hero leggero        */
  --shadow:0 12px 40px rgba(13, 35, 64, .08);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; font-family: ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--ink); background:#f6f8fb;
}

/* Header + nav */
.topbar{
  position:sticky; top:0; z-index:50; backdrop-filter:saturate(120%) blur(6px);
  background:rgba(255,255,255,.85); border-bottom:1px solid #e7edf5;
}
.navwrap{ max-width:1180px; margin:0 auto; padding:12px 16px; display:flex; align-items:center; gap:16px }
.navleft{ display:flex; align-items:center; gap:10px }
.navleft img{ height:34px }
.navleft a{ color:var(--ink); text-decoration:none; font-weight:800; letter-spacing:.2px }
.navright{ margin-left:auto; display:flex; gap:12px; flex-wrap:wrap }
.navright a{ text-decoration:none; color:var(--ink); padding:8px 10px; border-radius:10px }
.navright a:hover{ background:#eef3f9 }

/* Hero */
.site-header{
  background: linear-gradient(180deg, var(--hero-from) 0%, var(--hero-to) 100%);
  padding: 56px 16px 32px; text-align:left; border-bottom:1px solid #e7edf5;
}
.hero{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns: 1.2fr .8fr; gap:20px; align-items:center }
@media (max-width: 980px){ .hero{ grid-template-columns: 1fr; text-align:center } }
.hero h1{ margin:0 0 10px; font-size: clamp(28px, 5vw, 46px); line-height:1.08; letter-spacing:.2px }
.hero p{ margin:0 0 20px; color:#3a5065; font-size: clamp(16px, 2.4vw, 19px) }
.hero-logo{ justify-self:center; max-width:160px; opacity:.95 }

/* Buttons */
.btn{ display:inline-block; padding:12px 18px; border-radius:14px; font-weight:800; letter-spacing:.2px; text-decoration:none; box-shadow:var(--shadow); }
.btn-primary{ background:var(--brand); color:#fff }
.btn-primary:hover{ background:var(--brand-2) }
.btn-outline{ background:#fff; color:var(--brand); border:2px solid var(--outline); box-shadow:none }
.btn-outline:hover{ border-color:var(--brand); }

/* 🔴 Bottone “pericolo” (admin) */
.btn.danger, .btn-danger{
  background:#b91c1c;
  color:#fff !important;
  border:0 !important;
  box-shadow:var(--shadow);
}
.btn.danger:hover, .btn-danger:hover{ filter:brightness(0.95); }

/* Layout / Cards */
.container{ max-width:1180px; margin:0 auto; padding:24px 16px }
.grid{ display:grid; gap:20px } .grid.two{ grid-template-columns:repeat(2,minmax(0,1fr)) }
@media (max-width: 900px){ .grid.two{ grid-template-columns:1fr } }
.card{ background:var(--card); border:1px solid #e7edf5; border-radius:18px; padding:24px; box-shadow:var(--shadow) }
.card h2,.card h3{ margin:0 0 12px }
.badge{ display:inline-block; padding:6px 10px; background:#eef5ff; border:1px solid #dbe7ff; color:#25415f; border-radius:999px; font-size:12px }
.note{ color:var(--muted) }
.warn{ background:#fff8ef; border:1px solid #ffe2bd; color:#8a4b05; padding:12px; border-radius:12px }
.ok{ background:#ecfdf5; border:1px solid #bbf7d0; color:#065f46; padding:12px; border-radius:12px }

/* Forms */
label{ display:block; margin:12px 0 6px; font-weight:700 }
input[type=text],input[type=email],input[type=tel],textarea,select,input[type=file]{
  width:100%; background:#fff; border:1px solid #d7dfe9; border-radius:12px; padding:12px; font-size:16px; outline:none
}
input:focus,textarea:focus,select:focus{ box-shadow:var(--ring); border-color: var(--brand) }
.control-inline{ display:flex; gap:12px; flex-wrap:wrap } .control-inline>*{ flex:1 1 240px }

/* Footer */
.site-footer{ padding:30px 16px; text-align:center; color:#6b7685; border-top:1px solid #e7edf5; background:#fff }