/*
Theme Name: Legal Trade
Theme URI: https://legaltrade.cl
Author: CEALE
Description: Sitio institucional de Legal Trade. Landing informativa y documentos legales (privacidad, terminos, soporte y eliminacion de cuenta) en espanol, ingles y chino. Sin plugins, sin dependencias externas.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: legaltrade
*/

/* ── Reset mínimo ─────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body, h1, h2, h3, h4, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
ul[class], ol[class] { list-style: none; padding: 0; }
img { max-width: 100%; display: block; height: auto; }

/* ── Tipografía de marca ──────────────────────────────────────────
   Archivo, del Manual de Marca. Auto-alojada y no traída de Google:
   el sitio no tiene dependencias externas, y pedirle la fuente a un
   tercero filtraría la IP de cada visitante — mal detalle en un sitio
   cuya política de privacidad promete lo contrario.
   Fuente variable, subconjuntos latin y latin-ext: 67 KB en total.
   Licencia OFL en assets/fonts/OFL.txt.
   ──────────────────────────────────────────────────────────────── */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('assets/fonts/archivo-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                 U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
                 U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('assets/fonts/archivo-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7,
                 U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F,
                 U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
                 U+2C60-2C7F, U+A720-A7FF;
}

/* ── Variables ────────────────────────────────────────────────────
   Manual de Marca Legal Trade, agosto 2026.
   El rojo pleno queda para la marca y acentos; las acciones van en
   tinta, para no competir con el semáforo de prescripción.
   ──────────────────────────────────────────────────────────────── */
:root {
  --lt-ink:         #201E1D;
  --lt-ink-dark:    #141312;
  --lt-ink-soft:    #EAE8E8;
  --lt-red:         #EC3013;   /* rojo de marca */
  --lt-red-soft:    #FCE7E3;
  --lt-emphasis:    #AE1800;   /* rojo apto para texto */
  --lt-bg:          #F3F2F2;
  --lt-surface:     #FFFFFF;
  --lt-border:      #DBD9D9;
  --lt-text:        #201E1D;
  --lt-muted:       #605D5D;
  --lt-green:       #116B4A;
  --lt-green-soft:  #E3F1EA;
  --lt-amber:       #8A5A00;
  --lt-amber-soft:  #F6EEDE;
  --lt-stop:        #AE1800;   /* rojo del semáforo, distinto del de marca */
  --lt-stop-soft:   #F7E7E3;
  --lt-radius:      12px;
  --lt-wrap:        1060px;
  --lt-prose:       760px;
}

/* ── Base ─────────────────────────────────────────────────────── */
body {
  margin: 0;
  background: var(--lt-bg);
  color: var(--lt-text);
  font-family: 'Archivo', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", "Noto Sans", "Noto Sans SC", Arial, sans-serif;
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
/* Archivo no tiene glifos chinos: en chino manda la del sistema. */
html[lang="zh-CN"] body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC",
               "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  line-height: 1.85;
}
h1, h2, h3, h4, .lt-brand span { font-weight: 800; letter-spacing: -0.01em; }
a { color: var(--lt-emphasis); text-decoration: none; }
a:hover, a:focus-visible { text-decoration: underline; }
:focus-visible { outline: 3px solid var(--lt-red); outline-offset: 2px; }

.lt-wrap { width: 100%; max-width: var(--lt-wrap); margin: 0 auto; padding: 0 20px; }
.lt-skip {
  position: absolute; left: -9999px; top: 0; background: var(--lt-red);
  color: #FFFFFF; padding: 10px 16px; z-index: 100; font-weight: 600;
}
.lt-skip:focus { left: 8px; top: 8px; }

/* ── Cabecera ─────────────────────────────────────────────────── */
.lt-header {
  background: var(--lt-ink);
  color: #fff;
  border-bottom: 3px solid var(--lt-red);
}
.lt-header a { color: #fff; }
.lt-header-inner {
  display: flex; align-items: center; gap: 20px;
  flex-wrap: wrap; padding-top: 14px; padding-bottom: 14px;
}
.lt-brand { display: flex; align-items: center; gap: 11px; font-weight: 700; letter-spacing: .2px; }
.lt-brand:hover { text-decoration: none; }
/* El manual prohíbe redondear la marca. */
.lt-brand img { width: 34px; height: 34px; }
.lt-brand span { font-size: 18px; }
.lt-brand small {
  display: block; font-size: 11px; font-weight: 500; letter-spacing: .8px;
  text-transform: uppercase; color: rgba(255,255,255,.62);
}
.lt-nav { margin-left: auto; display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.lt-nav a { font-size: 15px; color: rgba(255,255,255,.85); }
.lt-nav a:hover { color: #fff; }
.lt-nav a[aria-current="page"] { color: #fff; font-weight: 600; box-shadow: inset 0 -2px 0 var(--lt-red); }
.lt-langs { display: flex; gap: 8px; align-items: center; }
.lt-langs a {
  font-size: 13px; padding: 3px 9px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.28); color: rgba(255,255,255,.82);
}
.lt-langs a:hover { text-decoration: none; border-color: var(--lt-red); }
.lt-langs a.is-active { background: var(--lt-red); border-color: var(--lt-red); color: #fff; font-weight: 700; }

/* ── Hero ─────────────────────────────────────────────────────── */
.lt-hero {
  background: linear-gradient(160deg, var(--lt-ink) 0%, var(--lt-ink-dark) 100%);
  color: #fff; padding: 70px 0 78px;
}
.lt-hero h1 {
  font-size: clamp(30px, 5vw, 45px); line-height: 1.18;
  letter-spacing: -.5px; max-width: 17ch; margin-bottom: 20px;
}
.lt-hero p.lead { font-size: clamp(17px, 2.1vw, 20px); color: rgba(255,255,255,.86); max-width: 58ch; }
.lt-cta { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 32px; }
.lt-btn {
  display: inline-block; padding: 13px 26px; border-radius: var(--lt-radius);
  font-weight: 650; font-size: 16px; border: 1.5px solid transparent; transition: .15s;
}
.lt-btn:hover { text-decoration: none; transform: translateY(-1px); }
.lt-btn-gold { background: var(--lt-red); color: #fff; }
.lt-btn-gold:hover { background: var(--lt-emphasis); }
.lt-btn-ghost { border-color: rgba(255,255,255,.42); color: #fff; }
.lt-btn-ghost:hover { border-color: #fff; background: rgba(255,255,255,.08); }
.lt-badge {
  display: inline-block; font-size: 12px; letter-spacing: 1.1px; text-transform: uppercase;
  font-weight: 700; color: var(--lt-red); border: 1px solid rgba(236,48,19,.45);
  padding: 5px 12px; border-radius: 999px; margin-bottom: 22px;
}

/* ── Secciones ────────────────────────────────────────────────── */
.lt-section { padding: 66px 0; }
.lt-section.alt { background: var(--lt-surface); border-block: 1px solid var(--lt-border); }
.lt-section h2 {
  font-size: clamp(23px, 3.2vw, 30px); letter-spacing: -.3px;
  margin-bottom: 12px; line-height: 1.25;
}
.lt-section > .lt-wrap > p.sub { color: var(--lt-muted); max-width: 62ch; margin-bottom: 34px; }

.lt-grid { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(258px, 1fr)); }
.lt-card {
  background: var(--lt-surface); border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius); padding: 26px;
}
.lt-section.alt .lt-card { background: var(--lt-bg); }
.lt-card h3 { font-size: 17px; margin-bottom: 8px; }
.lt-card p { color: var(--lt-muted); font-size: 15.5px; }
.lt-step {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 50%; margin-bottom: 14px;
  background: var(--lt-ink-soft); color: var(--lt-ink); font-weight: 700; font-size: 14px;
}

/* ── Semáforo ─────────────────────────────────────────────────── */
.lt-lights { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(216px, 1fr)); }
.lt-light { border-radius: var(--lt-radius); padding: 22px; border: 1px solid transparent; }
.lt-light strong { display: flex; align-items: center; gap: 9px; font-size: 16px; margin-bottom: 6px; }
.lt-light .dot { width: 13px; height: 13px; border-radius: 50%; flex: none; }
.lt-light p { font-size: 15px; margin: 0; }
.lt-light.g { background: var(--lt-green-soft); border-color: #bfe3d3; color: #0b4f36; }
.lt-light.g .dot { background: var(--lt-green); }
.lt-light.a { background: var(--lt-amber-soft); border-color: #ecd8ac; color: #6d4604; }
.lt-light.a .dot { background: var(--lt-amber); }
.lt-light.r { background: var(--lt-stop-soft); border-color: #f0cdc9; color: #7d1a15; }
.lt-light.r .dot { background: var(--lt-stop); }

/* ── Planes ───────────────────────────────────────────────────── */
.lt-plans { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(252px, 1fr)); align-items: start; }
.lt-plan {
  background: var(--lt-surface); border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius); padding: 28px; height: 100%;
}
.lt-plan.free { border-color: var(--lt-green); box-shadow: 0 0 0 3px var(--lt-green-soft); }
.lt-plan h3 { font-size: 16px; text-transform: uppercase; letter-spacing: .7px; color: var(--lt-muted); margin-bottom: 10px; }
.lt-price { font-size: 31px; font-weight: 700; letter-spacing: -.6px; }
.lt-price small { font-size: 14px; font-weight: 500; color: var(--lt-muted); letter-spacing: 0; }
.lt-plan ul { list-style: none; padding: 0; margin: 18px 0 0; }
.lt-plan li { position: relative; padding-left: 24px; margin-bottom: 9px; font-size: 15.5px; color: var(--lt-muted); }
.lt-plan li::before {
  content: ""; position: absolute; left: 3px; top: .58em;
  width: 8px; height: 8px; border-radius: 50%; background: var(--lt-red);
}

/* ── Aviso ────────────────────────────────────────────────────── */
.lt-notice {
  background: var(--lt-red-soft); border: 1px solid #ecd9a9;
  border-left: 4px solid var(--lt-red); border-radius: var(--lt-radius);
  padding: 20px 24px; margin-top: 34px;
}
.lt-notice p { font-size: 15.5px; margin: 0; color: #5c4712; }
.lt-notice strong { color: #4a3a0e; }

/* ── Páginas de texto ─────────────────────────────────────────── */
.lt-page { padding: 52px 0 76px; }
.lt-page-head { max-width: var(--lt-prose); margin: 0 auto 34px; }
.lt-page-head h1 { font-size: clamp(27px, 4vw, 37px); letter-spacing: -.5px; line-height: 1.2; }
.lt-updated { color: var(--lt-muted); font-size: 14.5px; margin-top: 12px; }
.lt-prose {
  max-width: var(--lt-prose); margin: 0 auto;
  background: var(--lt-surface); border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius); padding: 42px clamp(22px, 4vw, 48px);
}
.lt-prose > *:first-child { margin-top: 0; }
.lt-prose h2 {
  font-size: 21px; margin: 40px 0 12px; padding-top: 22px;
  border-top: 1px solid var(--lt-border); letter-spacing: -.2px; line-height: 1.3;
}
.lt-prose > h2:first-of-type { border-top: 0; padding-top: 0; margin-top: 0; }
.lt-prose h3 { font-size: 17.5px; margin: 26px 0 8px; }
.lt-prose p, .lt-prose li { color: #24384f; }
.lt-prose p { margin: 0 0 15px; }
.lt-prose ul, .lt-prose ol { margin: 0 0 16px; padding-left: 24px; }
.lt-prose li { margin-bottom: 7px; }
.lt-prose strong { color: var(--lt-text); }
.lt-prose table {
  width: 100%; border-collapse: collapse; margin: 8px 0 20px; font-size: 15px;
}
.lt-prose th, .lt-prose td {
  border: 1px solid var(--lt-border); padding: 10px 13px;
  text-align: left; vertical-align: top;
}
.lt-prose th { background: var(--lt-ink-soft); font-weight: 650; color: var(--lt-ink); }
.lt-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.lt-prose .box {
  background: var(--lt-ink-soft); border-radius: var(--lt-radius);
  padding: 18px 22px; margin: 0 0 22px;
}
.lt-prose .box p:last-child { margin-bottom: 0; }
.lt-prose .box.warn { background: var(--lt-red-soft); border-left: 4px solid var(--lt-red); }
.lt-toc {
  background: var(--lt-bg); border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius); padding: 20px 24px; margin: 0 0 30px;
}
.lt-toc p { font-weight: 650; font-size: 14px; text-transform: uppercase; letter-spacing: .6px; color: var(--lt-muted); margin-bottom: 10px; }
.lt-toc ol { margin: 0; padding-left: 20px; font-size: 15px; }
.lt-toc li { margin-bottom: 4px; }

/* ── Pie ──────────────────────────────────────────────────────── */
.lt-footer {
  background: var(--lt-ink-dark); color: rgba(255,255,255,.68);
  padding: 46px 0 34px; font-size: 14.5px; margin-top: auto;
}
.lt-footer a { color: rgba(255,255,255,.82); }
.lt-footer a:hover { color: #fff; }
.lt-footer-grid {
  display: grid; gap: 30px; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  padding-bottom: 28px; border-bottom: 1px solid rgba(255,255,255,.13);
}
.lt-footer h4 {
  color: #fff; font-size: 13px; text-transform: uppercase;
  letter-spacing: .9px; margin-bottom: 12px;
}
.lt-footer ul { list-style: none; padding: 0; margin: 0; }
.lt-footer li { margin-bottom: 7px; }
.lt-legalbox { padding-top: 24px; font-size: 13.5px; line-height: 1.7; color: rgba(255,255,255,.55); }
.lt-legalbox strong { color: rgba(255,255,255,.82); font-weight: 600; }

body { display: flex; flex-direction: column; min-height: 100vh; }
.lt-main { flex: 1 0 auto; }

@media (max-width: 720px) {
  body { font-size: 16.5px; }
  .lt-header-inner { gap: 12px; }
  .lt-nav { margin-left: 0; width: 100%; gap: 16px; font-size: 14px; }
  .lt-hero { padding: 52px 0 58px; }
  .lt-section { padding: 48px 0; }
  .lt-prose { padding: 28px 20px; }
}

@media print {
  .lt-header, .lt-footer, .lt-toc, .lt-skip { display: none; }
  body { background: #fff; font-size: 11.5pt; }
  .lt-prose { border: 0; padding: 0; max-width: none; }
}

/* ── Quiénes somos y equipo ──────────────────────────────────── */

/* El ancla queda bajo la cabecera fija: sin esto el título se esconde. */
#quienes-somos {
  scroll-margin-top: 90px;
}

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.lt-about {
  max-width: var(--lt-prose);
}

.lt-about p {
  color: var(--lt-muted);
  margin-bottom: 14px;
}

.lt-team-title {
  margin-top: 48px;
  font-size: 1.35rem;
  color: var(--lt-ink);
}

.lt-team {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 18px;
  margin-top: 24px;
}

.lt-member {
  background: var(--lt-surface);
  border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.lt-member-foto {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  background: var(--lt-ink-soft);
}

/* Sin fotografía todavía: iniciales sobre el azul de la marca. */
.lt-member-inicial {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--lt-ink);
  background: var(--lt-ink-soft);
}

.lt-member-body {
  padding: 18px 20px 22px;
}

.lt-member-body h4 {
  font-size: 1.02rem;
  line-height: 1.35;
  color: var(--lt-text);
  margin-bottom: 4px;
}

.lt-member-cargo {
  font-size: .82rem;
  color: var(--lt-ink);
  margin-bottom: 12px;
}

.lt-member-bio {
  font-size: .88rem;
  line-height: 1.65;
  color: var(--lt-muted);
}

.lt-member-idiomas {
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.lt-tag {
  font-size: .7rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--lt-ink);
  border: 1px solid var(--lt-border);
  background: var(--lt-bg);
  border-radius: 999px;
  padding: 3px 9px;
}

@media (max-width: 640px) {
  .lt-team { grid-template-columns: 1fr; }
  .lt-member { flex-direction: row; align-items: flex-start; }
  .lt-member-foto { width: 108px; flex: 0 0 108px; }
  .lt-member-body { padding: 14px 16px 16px; }
}