/* =========================================
   ADO MEDTECH - THEME (token + override BS)
   ========================================= */

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Zen+Dots&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');

/* H: Brand tokens 
*/
:root {
  --ado-orange: #f07d21;
  --medtech-gray: #3c3c3c;

  --bg: #ffffff;
  --bg-soft: #f6f7f9;

  --text: #111111;
  --text-muted: #6b7280;

  --border: #e5e7eb;

  /* Accento freddo “tech” (usare poco) */
  --tech-cyan: #06b6d4;

  /* Tipografia */
  --font-body:
    Inter, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-display: 'Zen Dots', var(--font-body);

  /* Raggi/ombre (coerenti su tutta la pagina) */
  --radius-lg: 18px;
  --shadow-soft: 0 12px 30px rgba(0, 0, 0, 0.06);
}

/* H: Typography 
*/
body {
  font-family: var(--font-body);
  color: var(--text);
  background: var(--bg);
}

/* Titoli */
h1,
.h1 {
  font-family: var(--font-display);
  letter-spacing: 0.02em;
}

h2,
.h2 {
  letter-spacing: 0.04em; /* più tech */
  font-family: var(--font-display);
  line-height: 1.15;
  font-size: clamp(1.35rem, 1.9vw, 1.75rem);
}

h3,
h4,
h5,
h6 {
  font-family: var(--font-body);
  font-weight: 600;
}
.section-kicker {
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.8rem;
  color: rgba(17, 17, 17, 0.55);
}
/* H: Override 
Override Bootstrap via CSS vars 
*/
:root {
  --bs-body-color: var(--text);
  --bs-body-bg: var(--bg);

  --bs-primary: var(--ado-orange);
  --bs-secondary: var(--medtech-gray);

  --bs-link-color: var(--medtech-gray);
  --bs-link-hover-color: var(--ado-orange);

  --bs-border-color: var(--border);

  --bs-border-radius-lg: var(--radius-lg);
}

/* Bottoni un pelo più “premium” senza stravolgere BS 
*/
.btn {
  border-radius: 14px;
}
.btn-primary {
  --bs-btn-bg: var(--ado-orange);
  --bs-btn-border-color: var(--ado-orange);
  --bs-btn-hover-bg: #e86f13; /* leggermente più scuro */
  --bs-btn-hover-border-color: #e86f13;
  --bs-btn-active-bg: #d8630f;
  --bs-btn-active-border-color: #d8630f;
}

.btn-outline-secondary {
  --bs-btn-color: var(--medtech-gray);
  --bs-btn-border-color: rgba(60, 60, 60, 0.35);
  --bs-btn-hover-bg: rgba(60, 60, 60, 0.08);
  --bs-btn-hover-border-color: rgba(60, 60, 60, 0.45);
}

/* Utility per sfondi soft */
.bg-soft {
  background: var(--bg-soft);
}