/* Boda de Cris y Pablo — estilo común, paleta Castelo */

:root{
  --verde:#005422; --verde-2:#0A6B31; --verde-3:#2E7D4F;
  --verde-suave:#E4EEE7; --verde-borde:#C3D8C9;
  --crema:#FAF7F1; --papel:#FFFFFF; --tinta:#14261B; --tenue:#6B7A70;
  --alerta:#A64B3A; --ambar:#B8860B;
  --display:"Fraunces",Georgia,serif; --body:"Karla",system-ui,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--crema);color:var(--tinta);font-family:var(--body);
     font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
.wrap{max-width:1320px;margin:0 auto;padding:0 20px 70px}
a{color:var(--verde-2)}

/* ---- barra de navegación ---- */
.nav{background:var(--verde);color:var(--papel)}
.nav-in{max-width:1320px;margin:0 auto;padding:0 20px;display:flex;flex-wrap:wrap;
        align-items:center;gap:4px;min-height:56px}
.marca{font-family:var(--display);font-weight:600;font-size:17px;margin-right:20px;
       color:var(--papel);text-decoration:none;white-space:nowrap}
.marca em{font-style:normal;opacity:.6;font-weight:400}
.nav a.enl{color:rgba(255,255,255,.78);text-decoration:none;font-size:14px;
           padding:8px 13px;border-radius:99px}
.nav a.enl:hover{background:rgba(255,255,255,.12);color:var(--papel)}
.nav a.enl[aria-current="page"]{background:var(--papel);color:var(--verde);font-weight:700}

/* ---- cabeceras ---- */
header.pag{padding:40px 0 18px}
.eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;
         color:var(--verde-3);font-weight:700;margin:0 0 12px}
h1{font-family:var(--display);font-weight:600;font-size:clamp(30px,4.5vw,46px);
   line-height:1.05;margin:0 0 12px;color:var(--verde)}
h2{font-family:var(--display);font-weight:600;color:var(--verde)}
.lede{max-width:68ch;color:var(--tenue);margin:0}

/* ---- controles ---- */
button{font-family:var(--body);font-size:13px;padding:7px 13px;border-radius:99px;
       cursor:pointer;background:var(--papel);border:1px solid var(--verde-borde);color:var(--verde)}
button:hover{border-color:var(--verde);background:var(--verde-suave)}
button.primary{background:var(--verde);border-color:var(--verde);color:var(--papel);font-weight:700}
button.primary:hover{background:var(--verde-2)}
button.activo{background:var(--verde-3);border-color:var(--verde-3);color:var(--papel);font-weight:700}
button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--verde-3);outline-offset:2px}
input[type=search]{background:var(--papel);border:1px solid var(--verde-borde);color:var(--tinta);
                   font-family:var(--body);font-size:13px;padding:7px 12px;border-radius:99px;min-width:180px}

.pill{font-size:12px;font-weight:700;color:var(--papel);background:var(--verde);
      border-radius:99px;padding:3px 11px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--c);display:inline-block;flex-shrink:0}

.msg{font-size:12px;font-weight:700;color:var(--verde-3);opacity:0;transition:opacity .25s}
.msg.on{opacity:1}
.msg.mal{color:var(--alerta)}
.estado{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:12px;color:var(--tenue)}
.estado::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--verde-3)}
.estado.guardando::before{background:var(--ambar)}
.estado.error::before{background:var(--alerta)}
.estado.error{color:var(--alerta)}

/* ---- tarjetas ---- */
.caja{background:var(--papel);border:1px solid var(--verde-borde);border-radius:8px;padding:20px}
.rejilla{display:grid;gap:20px}
.r3{grid-template-columns:repeat(3,1fr)}
.r2{grid-template-columns:repeat(2,1fr)}

.ficha{display:inline-flex;align-items:center;gap:6px;background:var(--papel);
       border:1px solid var(--verde-borde);border-left:3px solid var(--c);
       border-radius:4px;padding:4px 9px;font-size:13px;cursor:grab;white-space:nowrap;max-width:100%}
.ficha:hover{border-color:var(--verde)}
.ficha.dragging{opacity:.3}
.ficha.sel{box-shadow:0 0 0 2px var(--verde-3);border-color:var(--verde-3)}
.ficha.oculta{display:none}
.ficha span.nom{overflow:hidden;text-overflow:ellipsis;min-width:0}
.ficha .quitar{border:none;background:none;padding:0 0 0 2px;font-size:14px;line-height:1;
               color:var(--tenue);cursor:pointer;border-radius:3px;flex-shrink:0}
.ficha .quitar:hover{color:var(--alerta);background:none}

.vacio{color:var(--tenue);font-size:13px;font-style:italic;padding:6px 2px}

/* ---- tablas ---- */
table.datos{width:100%;border-collapse:collapse;font-size:14px}
table.datos th{text-align:right;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
               color:var(--tenue);font-weight:700;padding:0 0 10px 14px;
               border-bottom:1px solid var(--verde-borde)}
table.datos th:first-child{text-align:left;padding-left:0}
table.datos td{padding:10px 0 10px 14px;border-bottom:1px solid var(--verde-suave);text-align:right}
table.datos td:first-child{text-align:left;padding-left:0}
table.datos tfoot td{font-weight:700;border-bottom:none;padding-top:14px}
.num{font-variant-numeric:tabular-nums}
.fuerte{font-weight:700;color:var(--verde);font-size:16px}

footer.pie{margin-top:36px;padding-top:20px;border-top:1px solid var(--verde-borde);
           color:var(--tenue);font-size:13px;max-width:78ch}
footer.pie b{color:var(--tinta)}

@media (max-width:900px){
  .r3,.r2{grid-template-columns:1fr}
}