/* ══════════════════════════════════════════════════════════════
   Formularul de urgență. Folosește tokenii din styles.css și
   componentele din landing.css — aici e doar ce e specific triajului.
   ══════════════════════════════════════════════════════════════ */

.urg-body{background:var(--paper)}

.urg{padding:clamp(40px,8vh,96px) var(--gut) clamp(80px,12vh,140px)}
.urg__inner{max-width:760px;margin:0 auto}

/* ─── ANTET ─────────────────────────────────── */
.urg__head{margin-bottom:clamp(32px,5vh,56px)}
.urg__title{
  font-family:var(--display);font-weight:400;
  font-size:clamp(34px,6.4vw,62px);line-height:1.06;letter-spacing:-.015em;
  margin:14px 0 20px;color:var(--bone);
}
.urg__title .italic{
  font-style:italic;
  background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:var(--gold);
  padding-right:.14em;margin-right:-.06em;
}
.urg__lede{font-size:clamp(16px,1.9vw,18px);line-height:1.65;color:var(--bone-2);max-width:54ch;margin:0 0 18px}
.urg__now{font-size:14.5px;color:var(--bone-3);margin:0}
.urg__now a{color:var(--gold-ink);font-weight:600;text-decoration:none;border-bottom:1px solid rgba(138,107,18,.4)}

/* ─── PROGRES ───────────────────────────────── */
.urg__progres{display:flex;align-items:center;gap:16px;margin-bottom:28px}
.urg__bara{flex:1;height:2px;background:var(--rule);position:relative;overflow:hidden}
.urg__bara i{
  position:absolute;inset:0 auto 0 0;width:16.6%;
  background:var(--gold-grad);transition:width .5s var(--ease);
}
.urg__contor{font-size:11.5px;color:var(--bone-3);letter-spacing:.07em;white-space:nowrap}

/* ─── PAȘII ─────────────────────────────────── */
.urg__pas{
  display:none;border:0;margin:0;padding:0;
  animation:urgIntra .45s var(--ease) both;
}
.urg__pas.is-activ{display:block}
@keyframes urgIntra{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .urg__pas{animation:none}
  .urg__bara i{transition:none}
}

.urg__legend{
  font-family:var(--display);font-weight:400;
  font-size:clamp(23px,3.4vw,32px);line-height:1.2;
  color:var(--bone);margin-bottom:12px;padding:0;
}
.urg__ajutor{font-size:14.5px;line-height:1.6;color:var(--bone-3);margin:0 0 26px;max-width:56ch}

/* ─── LISTE DE BIFAT ────────────────────────── */
.urg__check,.urg__optiuni{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:10px}

.urg__check label,.urg__optiuni label{
  display:flex;gap:14px;align-items:flex-start;
  padding:15px 18px;cursor:pointer;
  background:var(--paper-2);border:1px solid var(--rule);
  transition:border-color .22s var(--ease),background .22s var(--ease);
}
.urg__check label:hover,.urg__optiuni label:hover{border-color:var(--rule-2)}

.urg__check input,.urg__optiuni input{
  appearance:none;-webkit-appearance:none;flex:0 0 auto;
  width:19px;height:19px;margin-top:1px;
  border:1px solid var(--rule-2);background:var(--paper);
  cursor:pointer;position:relative;transition:border-color .2s,background .2s;
}
.urg__optiuni input{border-radius:50%}
.urg__check input:checked,.urg__optiuni input:checked{
  border-color:var(--gold-deep);background:var(--gold-grad);
}
.urg__check input:checked::after{
  content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;
  border:solid #241B05;border-width:0 2px 2px 0;transform:rotate(42deg);
}
.urg__optiuni input:checked::after{
  content:"";position:absolute;inset:5px;border-radius:50%;background:#241B05;
}
.urg__check input:focus-visible,.urg__optiuni input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

.urg__check label:has(input:checked),
.urg__optiuni label:has(input:checked){
  border-color:var(--gold-deep);background:rgba(201,162,39,.08);
}

.urg__check span,.urg__optiuni span{font-size:15px;line-height:1.5;color:var(--bone)}
.urg__check em{display:block;font-style:normal;font-size:12.5px;color:var(--bone-3);margin-top:3px;line-height:1.45}
.urg__optiuni strong{display:block;font-weight:600;margin-bottom:3px}
.urg__optiuni span{display:block}
.urg__optiuni span strong + *{font-size:13px;color:var(--bone-3)}

/* Semnele de alarmă capătă accent cald, nu roșu de alertă —
   nu vrem să sperie pe cineva care doar citește lista. */
.urg__check--alarma label{background:#FAF3E4;border-color:rgba(156,122,18,.22)}

/* ─── PANOUL 112 ────────────────────────────── */
.urg__alerta{
  margin:0 0 26px;padding:24px 26px;
  background:#1A1510;color:#F1EADB;border-left:2px solid var(--gold);
}
.urg__alerta-tit{
  font-family:var(--display);font-size:clamp(20px,2.8vw,26px);
  margin:0 0 10px;color:#F0DC9A;
}
.urg__alerta p{font-size:15px;line-height:1.6;color:#CFC4B0;margin:0 0 18px}
.urg__alerta-cta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.urg__alerta-mic{font-size:13px;color:#8C806D;margin:0}
.urg__alerta .btn--ghost{border-color:rgba(241,234,219,.3);color:#F1EADB}
.urg__alerta .btn--ghost:hover{background:rgba(241,234,219,.08)}

/* ─── CÂMPURI ───────────────────────────────── */
.urg__form .field{margin-bottom:14px}
.urg__form .field--wide{grid-column:auto}

/* ─── NAVIGARE ──────────────────────────────── */
.urg__nav{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.urg__nav--final{margin-top:22px}

/* ─── REZUMAT ───────────────────────────────── */
.urg__rezumat{
  margin:0 0 26px;border-top:1px solid var(--rule);
}
.urg__rand{
  display:grid;grid-template-columns:150px 1fr;gap:18px;
  padding:13px 0;border-bottom:1px solid var(--rule);
}
.urg__rand span{font-size:11.5px;letter-spacing:.06em;color:var(--bone-3);text-transform:uppercase;padding-top:3px}
.urg__rand p{margin:0;font-size:15px;line-height:1.55;color:var(--bone);white-space:pre-wrap}

/* ─── ACORD ─────────────────────────────────── */
.urg__acord{
  display:flex;gap:14px;align-items:flex-start;
  padding:18px 20px;background:var(--paper-2);border:1px solid var(--rule);
  cursor:pointer;margin-bottom:4px;
}
.urg__acord input{
  appearance:none;-webkit-appearance:none;flex:0 0 auto;
  width:19px;height:19px;margin-top:1px;
  border:1px solid var(--rule-2);background:var(--paper);cursor:pointer;position:relative;
}
.urg__acord input:checked{border-color:var(--gold-deep);background:var(--gold-grad)}
.urg__acord input:checked::after{
  content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;
  border:solid #241B05;border-width:0 2px 2px 0;transform:rotate(42deg);
}
.urg__acord input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.urg__acord span{font-size:13.5px;line-height:1.6;color:var(--bone-2)}

.urg__stare{min-height:1.3em;margin:14px 0 0;font-size:14px;color:#A8673E}
.urg__mic{font-size:12.5px;line-height:1.6;color:var(--bone-3);margin:18px 0 0;max-width:58ch}

/* ─── CONFIRMARE ────────────────────────────── */
.urg__gata{
  padding:clamp(30px,5vw,46px);
  background:#1A1510;color:#F1EADB;border-left:2px solid var(--gold);
}
.urg__gata .eyebrow{color:var(--gold)}
.urg__gata-tit{
  font-family:var(--display);font-weight:400;
  font-size:clamp(26px,4.2vw,40px);line-height:1.14;
  margin:12px 0 16px;color:#F0DC9A;
}
.urg__gata p{font-size:15.5px;line-height:1.65;color:#CFC4B0;margin:0 0 26px;max-width:52ch}
.urg__gata-cta{display:flex;flex-wrap:wrap;gap:12px}
.urg__gata .btn--ghost{border-color:rgba(241,234,219,.3);color:#F1EADB}
.urg__gata .btn--ghost:hover{background:rgba(241,234,219,.08)}
.urg__gata .urg__mic{color:#8C806D;margin-top:22px}

/* ─── CE URMEAZĂ ────────────────────────────── */
.urg__dupa{margin-top:clamp(64px,10vh,110px);padding-top:clamp(40px,6vh,64px);border-top:1px solid var(--rule)}
.urg__dupa .sec-title{margin-bottom:34px}

/* ─── TELEFON ───────────────────────────────── */
@media (max-width:860px){
  .urg{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
  .urg__rand{grid-template-columns:1fr;gap:4px}
  .urg__rand span{padding-top:0}
  .urg__nav .btn{flex:1 1 auto;justify-content:center}
  /* 16px minim, altfel iOS face zoom la atingerea câmpului */
  .urg__form input,.urg__form select,.urg__form textarea{font-size:16px}
}
