/* ===========================================================
   MATERIALION — Ficha técnica estilo documento (fondo blanco)
   Inspirada en formato de hoja de datos industrial: densa,
   clara, imprimible en páginas A4 completas.
   =========================================================== */
:root{
  --fd-ink:#101820;          /* texto principal */
  --fd-gray:#5A6570;         /* etiquetas / secundario */
  --fd-line:#D8E0E3;         /* bordes */
  --fd-line-2:#EBF0F2;       /* divisores suaves */
  --fd-fill:#F4F7F8;         /* fondos suaves */
  --fd-accent:#008A8D;       /* teal profundo Materialion (legible en blanco) */
  --fd-accent-2:#0FB3B0;     /* teal medio */
  --fd-accent-soft:#E7F5F5;  /* tinte para avisos */
  --fd-mono:"IBM Plex Mono",ui-monospace,monospace;
  --fd-sans:"IBM Plex Sans",system-ui,sans-serif;
  --fd-disp:"Manrope",system-ui,sans-serif;
}

/* ---- Lienzo en pantalla: documento blanco centrado ---- */
.fd-stage{background:#3d4750;padding:26px 12px 48px}
.fd-doc{
  background:#fff;color:var(--fd-ink);max-width:880px;margin:0 auto;
  padding:34px 38px 26px;box-shadow:0 18px 60px rgba(0,0,0,.45);
  font-family:var(--fd-sans);font-size:.86rem;line-height:1.45;
}
.fd-doc a{color:var(--fd-accent)}

/* ---- Cabecera de marca ---- */
.fd-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;
  padding-bottom:12px;border-bottom:3px solid var(--fd-ink)}
.fd-brand{display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.fd-brand-row{display:flex;align-items:center;gap:13px}
.fd-brand-row img{height:76px;width:auto}
.fd-brand .b-word{font-family:var(--fd-disp);font-weight:800;font-size:1.92rem;letter-spacing:.08em;color:var(--fd-ink);line-height:1}
.fd-brand .b-word .b-ion{color:var(--fd-accent)}
.fd-brand .b-sub{font-family:var(--fd-mono);font-size:.68rem;color:var(--fd-gray);letter-spacing:.06em}
.fd-headright{text-align:right}
.fd-headright .h-lab{font-family:var(--fd-mono);font-size:.68rem;letter-spacing:.18em;color:var(--fd-gray)}
.fd-headright .h-code{font-family:var(--fd-disp);font-weight:800;font-size:1.28rem;letter-spacing:-.01em}
.fd-headright .h-date{font-family:var(--fd-mono);font-size:.7rem;color:var(--fd-gray);margin-top:2px}

/* ---- Título + datos de empresa ---- */
.fd-titlebar{display:flex;justify-content:space-between;gap:22px;align-items:flex-start;
  padding:16px 0 14px;border-bottom:1.5px solid var(--fd-line)}
.fd-title h1{font-family:var(--fd-disp);font-weight:800;font-size:1.9rem;line-height:1.05;
  letter-spacing:-.02em;margin:0;color:var(--fd-ink)}
.fd-title .t-eyebrow{font-family:var(--fd-mono);font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--fd-accent);margin-bottom:6px}
.fd-company{font-size:.74rem;color:var(--fd-gray);text-align:right;line-height:1.55;flex-shrink:0;max-width:360px;white-space:nowrap}
.fd-company b{color:var(--fd-ink)}

/* ---- Historia del material ---- */
.fd-story{font-size:.84rem;line-height:1.65;color:#33474E;margin:14px 0 2px;
  padding:12px 16px;background:var(--fd-fill);border-left:3px solid var(--fd-accent);border-radius:4px}
.fd-story b{color:var(--fd-ink)}

/* ---- Tarjetas de métricas destacadas ---- */
.fd-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0}
.fd-card{border:1.5px solid var(--fd-line);border-radius:8px;padding:10px 12px;background:var(--fd-fill)}
.fd-card .c-lab{font-family:var(--fd-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--fd-gray)}
.fd-card .c-val{font-family:var(--fd-disp);font-weight:800;font-size:1.62rem;letter-spacing:-.01em;margin-top:3px;color:var(--fd-ink)}
.fd-card .c-val small{font-size:.95rem;font-weight:700;color:var(--fd-gray)}
.fd-card.hero{background:var(--fd-accent);border-color:var(--fd-accent)}
.fd-card.hero .c-lab{color:#CFF3F2}
.fd-card.hero .c-val{color:#fff}
.fd-card.hero .c-val small{color:#B7ECEA}

/* ---- Layout de dos columnas (foto + especificaciones) ---- */
.fd-cols{display:grid;grid-template-columns:320px 1fr;gap:20px;margin:6px 0 4px}
.fd-photo{border:1.5px solid var(--fd-line);border-radius:8px;overflow:hidden;background:#fff}
.fd-photo img{width:100%;height:auto;display:block}
.fd-photo .p-cap{font-family:var(--fd-mono);font-size:.66rem;color:var(--fd-gray);
  text-align:center;padding:7px 8px;border-top:1px solid var(--fd-line-2)}

/* ---- Encabezado de sección ---- */
.fd-sec{margin:16px 0 6px;font-family:var(--fd-mono);font-size:.74rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--fd-accent);
  display:flex;align-items:center;gap:10px}
.fd-sec::after{content:"";flex:1;height:1px;background:var(--fd-line)}

/* ---- Tabla de especificaciones (etiqueta izq / valor der) ---- */
.fd-table{width:100%;border-collapse:collapse}
.fd-table td{padding:6.5px 4px;border-bottom:1px solid var(--fd-line-2);vertical-align:top}
.fd-table td.k{color:var(--fd-gray);font-size:.8rem;width:46%}
.fd-table td.v{font-family:var(--fd-mono);font-weight:600;font-size:.84rem;text-align:right;color:var(--fd-ink)}
.fd-table tr:last-child td{border-bottom:none}

/* ---- Grillas de tablas ---- */
.fd-grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 26px}
.fd-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 22px;align-items:start}
.fd-grid3 .fd-table td.k{width:auto}
.fd-grid3 .fd-table td{padding:6px 3px}
.fd-grid3 .fd-table td.v{font-size:.8rem}

/* ---- Tabla multicolumna (propiedades por estado, tratamientos) ---- */
.fd-mtable{width:100%;border-collapse:collapse;margin-top:6px}
.fd-mtable th{background:var(--fd-accent);color:#fff;font-family:var(--fd-mono);font-size:.64rem;
  letter-spacing:.05em;text-transform:uppercase;padding:7px 8px;border:1px solid var(--fd-accent);font-weight:600}
.fd-mtable td{border:1px solid var(--fd-line);padding:7px 8px;text-align:center;
  font-family:var(--fd-mono);font-size:.78rem;font-weight:600;color:var(--fd-ink)}
.fd-mtable td:first-child{text-align:left;font-family:var(--fd-sans);font-weight:600}
.fd-mtable td small{display:block;font-size:.62rem;color:var(--fd-gray);font-weight:500}
.fd-note{font-size:.7rem;color:var(--fd-gray);margin:6px 0 0;font-style:italic}
.fd-supply{font-size:.8rem;color:var(--fd-gray);margin:2px 0 0;line-height:1.6}
.fd-supply b{color:var(--fd-ink)}

/* ---- Chips (aplicaciones) ---- */
.fd-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.fd-chip{font-size:.76rem;padding:4px 10px;border:1px solid var(--fd-line);border-radius:20px;background:#fff;color:var(--fd-ink)}

/* ---- Cajas informativas en fila (procesamiento) ---- */
.fd-boxes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:6px}
.fd-box{border:1.5px solid var(--fd-line);border-radius:8px;padding:10px 12px}
.fd-box h4{margin:0 0 4px;font-family:var(--fd-disp);font-weight:800;font-size:.82rem}
.fd-box p{margin:0;font-size:.76rem;color:var(--fd-gray);line-height:1.5}

/* ---- Gráficas ---- */
.fd-charts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.fd-charts .fd-chart{margin-top:0}
@media(max-width:760px){.fd-charts{grid-template-columns:1fr}}
.fd-chart{border:1.5px solid var(--fd-line);border-radius:8px;padding:12px 14px 8px;margin-top:6px;background:#fff}
.fd-chart h4{margin:0 0 2px;font-family:var(--fd-disp);font-weight:800;font-size:.86rem}
.fd-chart .ch-sub{font-family:var(--fd-mono);font-size:.66rem;color:var(--fd-gray);margin-bottom:6px}
.fd-chart svg{width:100%;height:auto;display:block}
.fd-chart .ch-src{font-family:var(--fd-mono);font-size:.62rem;color:var(--fd-gray);margin-top:4px}
.fd-chart .ch-warn{font-size:.64rem;line-height:1.5;color:#8A5E10;background:#FBF3DF;
  border-left:3px solid #D9A83F;border-radius:4px;padding:6px 9px;margin-top:7px}
.fd-warn{font-size:.74rem;line-height:1.55;color:#8A5E10;background:#FBF3DF;
  border-left:3px solid #D9A83F;border-radius:4px;padding:9px 12px;margin-top:12px}
.fd-warn b{color:#6E4A0A}

/* ---- Aviso técnico ---- */
.fd-aviso{background:var(--fd-accent-soft);border:1.5px solid #BCE2E1;border-radius:8px;
  padding:12px 16px;margin-top:16px}
.fd-aviso h4{margin:0 0 6px;color:var(--fd-accent);font-family:var(--fd-disp);font-weight:800;font-size:.84rem}
.fd-aviso p{margin:0 0 6px;font-size:.68rem;line-height:1.55;color:#33474E}
.fd-aviso p:last-child{margin-bottom:0}

/* ---- Fuentes ---- */
.fd-fuentes{font-family:var(--fd-mono);font-size:.64rem;color:var(--fd-gray);line-height:1.6;
  margin:6px 0 0;padding-left:16px}

/* ---- Pie del documento ---- */
.fd-foot{display:flex;justify-content:space-between;gap:14px;margin-top:16px;padding-top:10px;
  border-top:1.5px solid var(--fd-line);font-family:var(--fd-mono);font-size:.64rem;color:var(--fd-gray)}

/* ---- Barra de acciones (pantalla) ---- */
.fd-actions{max-width:880px;margin:0 auto 14px;display:flex;gap:10px;align-items:center;justify-content:flex-end}
.fd-actions .fa-spacer{margin-right:auto;font-family:var(--fd-mono);font-size:.74rem;color:#9fb0b6}

/* ---- Responsive ---- */
@media(max-width:760px){
  .fd-doc{padding:22px 16px}
  .fd-head{flex-direction:column;align-items:flex-start;gap:10px}
  .fd-headright{text-align:left}
  .fd-headright .h-code{font-size:1.05rem;word-break:break-word}
  .fd-brand-row img{height:54px}
  .fd-brand .b-word{font-size:1.42rem}
  .fd-mtable{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .fd-mtable th,.fd-mtable td{white-space:nowrap}
  .fd-actions{padding:0 14px;justify-content:center;flex-wrap:wrap;gap:8px}
  .fd-actions .fa-spacer{display:none}
  .fd-actions .btn{font-size:.84rem;padding:.65em 1em;min-height:42px}
  .fd-cards{grid-template-columns:repeat(2,1fr)}
  .fd-cols{grid-template-columns:1fr}
  .fd-grid2{grid-template-columns:1fr}
  .fd-grid3{grid-template-columns:1fr!important}
  .fd-boxes{grid-template-columns:1fr}
  .fd-titlebar{flex-direction:column}
  .fd-company{text-align:left;max-width:none;white-space:normal}
}

/* ---- Impresión: documento a página completa A4 ---- */
@media print{
  @page{size:A4;margin:9mm 10mm}
  body{background:#fff!important}
  body::before{display:none!important}
  .site-header,.wa-float,.fd-actions,.drawer,.drawer-overlay,.crumbs{display:none!important}
  .fd-stage{background:#fff!important;padding:0!important}
  .fd-doc{box-shadow:none!important;max-width:none!important;padding:0!important;font-size:.8rem}
  .fd-card,.fd-box,.fd-chart,.fd-aviso,.fd-photo{break-inside:avoid;page-break-inside:avoid}
  .fd-sec{break-after:avoid;page-break-after:avoid}
  .fd-pagebreak{break-before:page;page-break-before:always}
  *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
}