@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,600;1,400&family=Source+Sans+3:wght@300;400;600&display=swap');

*{box-sizing:border-box;margin:0;padding:0}

:root{
  --red:#CC0000;
  --black:#1a1a1a;
  --gray:#555;
  --light:#f7f7f5;
  --border:#ccc;
  --field-bg:#fafaf8;
  --font-body:'Source Sans 3',sans-serif;
  --font-serif:'EB Garamond',serif;
}

body{
  font-family:var(--font-body);
  font-size:13px;
  color:var(--black);
  background:#e8e8e4;
  padding:24px 16px;
  line-height:1.5;
}

BUTTON {
  background:var(--black);
  color:white;
  border:none;
  padding:12px 20px;
  font-family:var(--font-body);
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  border-radius:3px;
  box-shadow:0 4px 16px rgba(204,0,0,0.35);
  z-index:100;
}
BUTTON:hover{background:#aa0000}

.doc-wrap{
  max-width:820px;
  margin:40px auto;
  background:white;
  box-shadow:0 4px 32px rgba(0,0,0,0.12);
}

/* ---- HEADER ---- */
.header{
  display:flex;
  align-items:stretch;
  border-bottom:2px solid var(--red);
}
.header-logo{
  background:var(--red);
  color:white;
  padding:14px 22px;
  min-width:220px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.header-logo .org-name{
  font-family:var(--font-serif);
  font-size:15px;
  font-weight:600;
  letter-spacing:0.02em;
  line-height:1.3;
}
.header-logo .cf{
  font-size:10px;
  margin-top:4px;
  opacity:0.85;
}
.header-addr{
  margin-left:auto;
  padding:14px 22px;
  text-align:right;
  font-size:11px;
  color:var(--gray);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
}
.header-addr .city{
  font-family:var(--font-serif);
  font-size:22px;
  font-weight:600;
  color:var(--red);
  line-height:1.1;
}

/* ---- SEZIONI ---- */
.section{
  padding:22px 28px;
  border-bottom:1px solid #e8e8e4;
}
.section:last-child{border-bottom:none}

.section-title{
  font-family:var(--font-serif);
  font-size:18px;
  font-weight:600;
  text-align:center;
  margin-bottom:18px;
  color:var(--black);
}
.section-sub{
  font-size:11px;
  text-align:center;
  color:var(--gray);
  margin-top:-12px;
  margin-bottom:16px;
}
.block-title{
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;

    background: linear-gradient(90deg, #c62828, #e53935);
    color: #fff;

    padding: 10px 14px;
    border-radius: 6px;
    margin-top: 25px;

    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    transition: all 0.3s ease;

}

.block-title:hover {
    transform: translateX(4px);
}

.block-title:first-child{margin-top:0}


/* ---- CAMPI FORM ---- */
.field-group{display:flex;flex-direction:column;gap:10px; padding: 15px 15px}
.field-row{display:flex;gap:12px;flex-wrap:wrap}
.field{display:flex;flex-direction:column;gap:3px;flex:1;min-width:120px}
.field label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--gray)}
.field input,
.field select,
.field textarea {
  border: none;
  border-bottom: 2px solid #ccc;
  padding: 8px 4px;
  transition: all 0.2s ease;
  background: transparent;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
  outline: none;
  border-bottom: 2px solid #e53935;
  background: #fff5f5;
}
.field input:hover,
.field select:hover {
  border-bottom: 2px solid #e53935;
  background: #fff5f5
}
.field textarea{resize:vertical;min-height:56px;border:1px solid var(--border);border-radius:2px;padding:6px 8px}
.field textarea:focus{border-color:var(--red)}
.field select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23999'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 4px center}

.field:focus-within label {
  color: #e53935;
}

label.required::after {
  content: " *";
  color: #e53935;
}

.field-group {
  background: #fff;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.step.active {
  animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px);}
  to { opacity: 1; transform: translateY(0);}
}

/* ---- CHECKBOX SETTIMANE ---- */
.weeks-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px 16px;
  margin-top:4px;
}
.check-item{
  display:flex;
  align-items:center;
  gap:8px;
  padding:5px 8px;
  border:1px solid transparent;
  border-radius:3px;
  cursor:pointer;
  transition:all .15s;
}
.check-item:hover{background:var(--light)}
.check-item input[type=checkbox]{
  width:14px;height:14px;
  accent-color:var(--red);
  cursor:pointer;
  flex-shrink:0;
}
.check-item span{font-size:12px}
.check-item input:checked + span{font-weight:600;color:var(--red)}

/* ---- TABELLA QUOTE ---- */
.quote-table{width:100%;border-collapse:collapse;margin-top:8px}
.quote-table td{padding:7px 10px;font-size:12px;border:1px solid #ddd}
.quote-table .cb-col{width:28px;text-align:center}
.quote-table .price{font-weight:600;white-space:nowrap}
.quote-table tr:hover td{background:var(--light)}
.quote-table input[type=radio]{accent-color:var(--red);cursor:pointer}
.note-small{font-size:11px;color:var(--gray);margin-top:8px;line-height:1.5}
.note-small u{color:var(--black)}

/* ---- BONIFICO ---- */
.bonifico-box{
  background:var(--light);
  border-left:3px solid var(--red);
  padding:12px 14px;
  margin-top:12px;
  font-size:12px;
  line-height:1.7;
}
.bonifico-box strong{display:block}
.iban{font-family:monospace;font-size:13px;font-weight:600;letter-spacing:.04em}

/* ---- FIRMA ---- */
.firma-row{
  display:flex;
  gap:24px;
  margin-top:16px;
  flex-wrap:wrap;
}
.firma-block{flex:1;min-width:140px}
.firma-block label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--gray);display:block;margin-bottom:4px}
.firma-line{border-bottom:1px solid var(--black);height:28px}

/* ---- TESTO BODY ---- */
.body-text{font-size:12px;line-height:1.7;color:var(--black);text-align:justify}
.body-text + .body-text{margin-top:8px}
.body-text u{text-decoration:underline}

/* ---- CONSENSO BOX ---- */
.consenso-box{
  border:1px solid var(--border);
  border-radius:3px;
  padding:14px 16px;
  margin-top:14px;
  background:var(--light);
}
.consenso-box .title{font-weight:600;font-size:12px;margin-bottom:8px}
.consenso-row{display:flex;gap:24px;align-items:center;margin:8px 0}
.consenso-row label{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:13px;font-weight:600}
.consenso-row input{accent-color:var(--red);width:16px;height:16px}

/* ---- AUTORIZZAZIONE PERSONE ---- */
.auth-person{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:10px;
  margin-bottom:10px;
  padding-bottom:10px;
  border-bottom:1px dashed #e0e0e0;
}
.auth-person:last-child{border-bottom:none}

/* ---- ORARIO ---- */
.orario-table{width:100%;border-collapse:collapse;margin-top:6px}
.orario-table td{padding:5px 8px;font-size:12px;border-bottom:1px solid #f0ede8}
.orario-table td:first-child{font-weight:600;white-space:nowrap;width:130px;color:var(--red)}

/* ---- SCONTI ---- */
.sconti-list{list-style:none;padding:0;margin-top:8px}
.sconti-list li{font-size:12px;padding:4px 0;border-bottom:1px solid #f0ede8;padding-left:12px;position:relative}
.sconti-list li::before{content:"•";color:var(--red);position:absolute;left:0}

/* ---- QUESTIONARIO ---- */
.question-block{margin-bottom:14px}
.question-block .q-text{font-size:12px;margin-bottom:8px;font-weight:600}
.yesno{display:flex;gap:16px;margin-bottom:6px}
.yesno label{display:flex;align-items:center;gap:5px;font-size:12px;cursor:pointer}
.yesno input{accent-color:var(--red)}

/* ---- NAV TABS ---- */
.nav-bar{
  background:var(--black);
  display:flex;
  overflow-x:auto;
  position:sticky;
  top:0;
  z-index:10;
  gap:0;
}
.nav-bar a{
  display:block;
  background:transparent;
  border:none;
  color:rgba(255,255,255,0.6);
  font-family:var(--font-body);
  font-size:11px;
  padding:10px 14px;
  cursor:pointer;
  white-space:nowrap;
  text-decoration:none;
  border-bottom:2px solid transparent;
  transition:all .15s;
}
.nav-bar a:hover{color:white;background:rgba(255,255,255,0.05)}

/* ---- PRINT ---- */
.print-btn{
  position:fixed;
  bottom:24px;
  right:24px;
  background:var(--red);
  color:white;
  border:none;
  padding:12px 20px;
  font-family:var(--font-body);
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  border-radius:3px;
  box-shadow:0 4px 16px rgba(204,0,0,0.35);
  z-index:100;
}
.print-btn:hover{background:#aa0000}

@media print{
  body{background:white;padding:0}
  .doc-wrap{box-shadow:none;max-width:100%}
  .nav-bar,.print-btn{display:none}  .section{page-break-inside:avoid}
}



/**************/
.step {
  display:none;
}

.step.active {
  display:block;
}

.step-nav {
  display:flex;
  justify-content:space-between;
  margin-top:30px;
}


.progress {
  width: 100%;
  height: 6px;
  background: #eee;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}

.progress-bar {
  height: 100%;
  background: linear-gradient(90deg, #e53935, #ff6f61);
  width: 12%;
  transition: width 0.3s ease;
}