/* Creaflow — documentos legales y contacto (prefijo l-).
   Los tokens vienen de site.css; aquí no se define ningún color nuevo. */

.l-page{padding-top:clamp(16px,3vw,32px);padding-bottom:clamp(48px,8vw,96px)}

/* ---------- Cabecera del documento: dos losetas ---------- */
.l-mast{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,.35fr);gap:14px}
.l-mast>*{min-width:0}
.l-mast__main{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:clamp(28px,5vw,72px);
  min-height:clamp(220px,28vw,320px);padding:clamp(22px,4vw,48px) clamp(22px,4vw,48px) clamp(48px,6vw,76px);border-radius:var(--r);color:var(--paper);
  background:radial-gradient(120% 140% at 0 0,rgba(64,156,152,.16),transparent 55%),var(--night)}
.l-mast__main h1{max-width:18ch;font-size:clamp(2rem,1.1rem + 3.6vw,3.7rem);line-height:1.06;color:var(--paper)}
.l-mast__main::after{content:"";position:absolute;left:0;right:0;bottom:0;height:24px;
  background:repeating-linear-gradient(90deg,var(--line-d) 0 1px,transparent 1px 12px);border-top:1px solid var(--line-d)}
.l-mast__main::before{content:"";position:absolute;bottom:0;left:clamp(22px,4vw,48px);width:2px;height:24px;background:var(--rec);z-index:1}
.l-label{display:inline-flex;align-items:center;gap:.65em;font:500 .8125rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.l-label--dark{color:var(--teal-l)}
.l-label--dark::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--rec);flex:none}
.l-label--ink{color:var(--muted)}
.l-mast__side{display:flex;flex-direction:column;justify-content:space-between;gap:20px;padding:clamp(20px,2.4vw,28px);border-radius:var(--r);background:var(--tile);color:var(--ink)}
.l-updated{display:flex;flex-direction:column;gap:6px;font-size:1.0625rem;font-weight:600;line-height:1.3}
.l-mast__side p:last-child{font-size:.9375rem;line-height:1.5;color:var(--muted)}
.l-mast__side a{color:var(--teal-d);word-break:break-word}
.l-mast__side a:hover{color:var(--ink)}

/* ---------- Hoja: documento a ~70ch + margen de apoyo ---------- */
.l-sheet{display:grid;grid-template-columns:minmax(0,70ch) minmax(0,300px);gap:clamp(32px,7vw,112px);justify-content:center;margin-top:clamp(32px,5vw,64px)}
.l-sheet>*{min-width:0}
.l-doc{font-size:1.0625rem;line-height:1.7;color:var(--ink)}
.l-doc p+p,.l-doc p+ul,.l-doc ul+p,.l-doc p+.l-tablewrap,.l-doc .l-tablewrap+p,.l-doc p+.l-take,.l-doc .l-take+p,.l-doc ul+ul{margin-top:1em}
.l-doc a{overflow-wrap:anywhere}
.l-lead{font-size:clamp(1.15rem,1.05rem + .5vw,1.35rem);line-height:1.5;font-weight:500;text-wrap:pretty}
.l-sec{margin-top:clamp(36px,5vw,56px);padding-top:clamp(22px,3vw,32px);border-top:1px solid var(--line)}
.l-sec h2{margin:.5rem 0 1rem;font-size:clamp(1.4rem,1.15rem + 1vw,1.85rem);line-height:1.2;letter-spacing:-.012em}
.l-n{display:flex;align-items:center;gap:.65rem;font:500 .8125rem/1 var(--mono);letter-spacing:.06em;color:var(--teal-d)}
.l-n::before{content:"";width:18px;height:2px;background:var(--rec)}
.l-doc h3{margin:1.6em 0 .5em;font-size:1.0625rem;line-height:1.35;letter-spacing:0}
.l-doc em{font-style:italic}
.l-doc code{font:500 .9em var(--mono);padding:.1em .35em;border-radius:6px;background:var(--tile)}

.l-list{display:grid;gap:.55em}
.l-list li{position:relative;padding-left:1.4rem}
.l-list li::before{content:"";position:absolute;left:.1rem;top:.72em;width:7px;height:7px;border-radius:2px;background:var(--teal)}

/* El texto que se acepta en la casilla de pago: la única loseta oscura del documento */
.l-take{margin-block:1.25rem;padding:clamp(18px,2.6vw,26px);border-radius:var(--r);background:var(--night);color:var(--paper);
  background-image:radial-gradient(120% 140% at 0 0,rgba(64,156,152,.16),transparent 55%)}
.l-take .l-label{margin-bottom:.7rem}
.l-take p{font-size:1.0625rem;line-height:1.55;color:var(--paper);text-wrap:pretty}

/* Tablas: solo para datos */
.l-tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-s);background:var(--surface);-webkit-overflow-scrolling:touch}
.l-tablewrap:focus-visible{outline:2px solid var(--teal-d);outline-offset:2px}
.l-table{width:100%;min-width:560px;font-size:.9375rem;line-height:1.5;text-align:left}
.l-table th,.l-table td{padding:12px 14px;vertical-align:top;border-bottom:1px solid var(--line);text-align:left}
.l-table tbody tr:last-child>*{border-bottom:0}
.l-table thead th{font:500 .8125rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--tile);white-space:nowrap}
.l-table tbody th{font-weight:600}
.l-table code{white-space:nowrap}

/* Margen de apoyo (no es un índice) */
.l-aside{position:sticky;top:calc(var(--header-h) + 24px);align-self:start;display:grid;gap:28px;font-size:.9375rem;line-height:1.55;color:var(--muted)}
.l-aside h2{margin-bottom:.6rem;font:500 .8125rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.l-aside>div{padding-top:14px;border-top:1px solid var(--line)}
.l-aside ul{display:grid;gap:2px}
.l-aside li a{display:inline-flex;align-items:center;min-height:36px}
.l-aside p+p{margin-top:.6em}
.l-aside .btn{margin-top:.8rem}
.l-chatbtn{display:none}
html.js .l-chatbtn{display:inline-flex}

@media (max-width:1000px){
  .l-sheet{grid-template-columns:minmax(0,1fr)}
  .l-aside{position:static;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px 28px}
}
@media (max-width:760px){
  .l-mast{grid-template-columns:minmax(0,1fr)}
  .l-doc{font-size:1rem}
  .l-aside li a{min-height:44px}
}

/* ---------- Contacto: página partida ---------- */
.l-contact{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:14px;align-items:stretch}
.l-contact>*{min-width:0}
.l-chat{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:36px;min-height:clamp(380px,48vw,520px);
  padding:clamp(22px,4vw,48px) clamp(22px,4vw,48px) clamp(48px,6vw,76px);border-radius:var(--r);color:var(--paper);
  background:radial-gradient(120% 140% at 0 0,rgba(64,156,152,.16),transparent 55%),var(--night)}
.l-chat::after{content:"";position:absolute;left:0;right:0;bottom:0;height:24px;border-top:1px solid var(--line-d);
  background:repeating-linear-gradient(90deg,var(--line-d) 0 1px,transparent 1px 12px)}
.l-chat::before{content:"";position:absolute;bottom:0;left:clamp(22px,4vw,48px);width:2px;height:24px;background:var(--rec);z-index:1}
.l-chat h1{max-width:12ch;font-size:clamp(2.2rem,1.2rem + 4vw,4rem);line-height:1.04;color:var(--paper)}
.l-chat p{max-width:36ch;color:var(--muted-d);font-size:1.0625rem;line-height:1.6}
.l-chat .l-actions{display:grid;gap:12px;justify-items:start}
.l-chat .l-label{max-width:none;color:var(--teal-l)}
.l-chat .btn:focus-visible{outline-color:var(--teal-l)}
.l-chat a{color:var(--teal-l)}
.l-chat a:hover{color:#fff}
.l-nojs{display:block}
html.js .l-nojs{display:none}

.l-ways{display:flex;flex-direction:column}
.l-way{display:grid;grid-template-columns:78px minmax(0,1fr);gap:6px 18px;padding:clamp(18px,2.4vw,26px) 0;border-top:1px solid var(--line)}
.l-way:first-child{border-top:0;padding-top:4px}
.l-way .l-label{align-self:start;padding-top:.5em;color:var(--teal-d)}
.l-way h2{font-size:clamp(1.25rem,1.05rem + .8vw,1.6rem);line-height:1.2;letter-spacing:-.01em}
.l-way p{margin-top:.5rem;color:var(--muted);line-height:1.6;max-width:52ch}
.l-way p:first-of-type{color:var(--ink)}
.l-way a{overflow-wrap:anywhere}
.l-way address{font-style:normal;margin-top:.5rem;font-size:1.0625rem;line-height:1.55}
.l-mail{display:inline-flex;align-items:center;min-height:44px;font:500 clamp(1.05rem,.9rem + .6vw,1.3rem)/1.3 var(--mono);color:var(--teal-d)}
.l-more{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 28px;margin-top:clamp(28px,4vw,48px);padding-top:clamp(18px,2.4vw,26px);border-top:1px solid var(--line)}
.l-more h2{grid-column:1/-1;margin-bottom:6px;font:500 .8125rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.l-more a{display:flex;align-items:center;min-height:44px;font-weight:600}

@media (max-width:900px){
  .l-contact{grid-template-columns:minmax(0,1fr)}
  .l-chat{min-height:0}
  .l-chat h1{max-width:none}
}
@media (max-width:640px){
  .l-way{grid-template-columns:minmax(0,1fr)}
  .l-way .l-label{padding-top:0}
  .l-more{grid-template-columns:minmax(0,1fr)}
}

/* ---------- Impresión ---------- */
@media print{
  .site-header,.site-footer,.skip,.sc,.sc-launch,[data-supchat-badge],.l-aside,.l-chatbtn,.l-mast__main::before,.l-mast__main::after{display:none !important}
  html,body{background:#fff !important;color:#000 !important}
  body{display:block}
  .l-page{padding:0}
  .l-mast{display:block}
  .l-mast__main{min-height:0;padding:0 0 12pt;border-radius:0;background:none;color:#000;border-bottom:2pt solid #000}
  .l-mast__main h1{color:#000;font-size:24pt;max-width:none}
  .l-label--dark,.l-label--ink,.l-n{color:#000}
  .l-label--dark::before{display:none}
  .l-mast__side{padding:8pt 0;background:none;border-radius:0}
  .l-sheet{display:block;margin-top:12pt}
  .l-doc{font-size:10.5pt;line-height:1.5;color:#000}
  .l-sec{break-inside:auto;border-top:.5pt solid #000;margin-top:14pt;padding-top:10pt}
  .l-sec h2{break-after:avoid;font-size:14pt}
  .l-take{background:none;color:#000;border:1pt solid #000;border-radius:0;padding:8pt}
  .l-take p,.l-take .l-label{color:#000}
  .l-tablewrap{overflow:visible;border-color:#000;break-inside:avoid}
  .l-table{min-width:0;font-size:9pt}
  .l-table thead th{background:none;color:#000}
  .l-doc a{color:#000}
  .l-doc a[href^="http"]::after{content:" (" attr(href) ")";font-size:.85em}
  .l-doc code{background:none}
}