/*
Theme Name: Reliant
Theme URI: https://reliant.email
Description: Tema corporativo para Reliant — autenticación de correo SPF, DKIM, DMARC.
Version: 1.0.1
Author: Reliant
Author URI: https://reliant.email
Text Domain: reliant
*/

/* Reliant — design tokens */
:root{
  --bg: #FAFAFA;
  --surface: #FFFFFF;
  --ink: #222222;
  --ink-2: #333333;
  --ink-3: #777777;
  --line: #EDEDED;
  --line-strong: #E2E2E2;
  --red: #CA110F;
  --red-ink: #A50D0B;

  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 10px;

  --container: 1180px;
  --gutter: clamp(20px, 4vw, 40px);

  --t-display: clamp(40px, 5.6vw, 72px);
  --t-h1: clamp(32px, 4vw, 48px);
  --t-h2: clamp(24px, 2.6vw, 34px);
  --t-h3: 20px;
  --t-body: 16px;
  --t-small: 14px;
  --t-mono: 13px;
}

*{ box-sizing: border-box; }
html, body{ margin:0; padding:0; }
html{ -webkit-text-size-adjust: 100%; }
body{
  background: var(--bg);
  color: var(--ink);
  font-family: 'IBM Plex Sans', system-ui, -apple-system, Segoe UI, Helvetica, Arial, sans-serif;
  font-size: var(--t-body);
  line-height: 1.5;
  font-feature-settings: "ss01","cv11";
  -webkit-font-smoothing: antialiased;
}
a{ color: inherit; text-decoration: none; }

/* Layout */
.container{ width: 100%; max-width: var(--container); margin: 0 auto; padding-inline: var(--gutter); }
section{ padding-block: clamp(72px, 9vw, 128px); }
@media (max-width: 600px){
  section{ padding-block: 56px; }
}
.eyebrow{
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
  font-weight: 500;
  font-family: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}
.divider{ height: 1px; background: var(--line); border: 0; }

/* Type */
h1, h2, h3, h4{ font-weight: 500; letter-spacing: -0.01em; margin: 0; color: var(--ink); }
h1{ font-size: var(--t-display); line-height: 1.04; letter-spacing: -0.025em; font-weight: 500; }
h2{ font-size: var(--t-h1); line-height: 1.1; letter-spacing: -0.02em; }
h3{ font-size: var(--t-h2); line-height: 1.15; letter-spacing: -0.015em; }
h4{ font-size: var(--t-h3); line-height: 1.3; }
p{ margin: 0; color: var(--ink-2); }
.lede{ font-size: 18px; line-height: 1.55; color: var(--ink-2); max-width: 56ch; }
.muted{ color: var(--ink-3); }
.mono{ font-family: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace; }

/* Buttons */
.btn{
  display: inline-flex; align-items: center; gap: 8px;
  font-family: inherit; font-size: 15px; font-weight: 500;
  padding: 11px 18px; border-radius: var(--r-md);
  border: 1px solid transparent; cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
  white-space: nowrap;
}
.btn-primary{ background: var(--ink); color: #fff; }
.btn-primary:hover{ background: #000; }
.btn-outline{ background: transparent; color: var(--ink); border-color: var(--line-strong); }
.btn-outline:hover{ border-color: var(--ink); }
.btn-ghost{ background: transparent; color: var(--ink-2); padding-inline: 0; }
.btn-ghost:hover{ color: var(--red); }
.btn:hover .arrow{ transform: translateX(2px); }
.btn .arrow{ transition: transform .2s ease; display: inline-flex; }

/* Cards */
.card{
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}

/* Nav */
.nav{
  position: sticky; top: 0; z-index: 50;
  background: rgba(250,250,250,0.85);
  backdrop-filter: saturate(140%) blur(8px);
  -webkit-backdrop-filter: saturate(140%) blur(8px);
  border-bottom: 1px solid var(--line);
}
.nav-inner{
  display: flex; align-items: center; justify-content: space-between;
  height: 64px;
}
.nav-logo{ display: flex; align-items: center; gap: 10px; }
.nav-logo .logo-full{ height: 32px; width: auto; display: block; }
.nav-logo .mark{ width: 14px; height: 22px; }
.nav-logo .word{ font-weight: 600; font-size: 18px; letter-spacing: -0.01em; }
.nav-inner .nav-links{ display: flex; gap: 28px; }
.nav-inner .nav-links a{ font-size: 14.5px; color: var(--ink-2); position: relative; }
.nav-inner .nav-links a:hover{ color: var(--red); }
.nav-cta{ display: flex; align-items: center; gap: 12px; }

/* Mobile menu toggle */
.nav-toggle{
  display: none; align-items: center; justify-content: center;
  background: transparent; border: 0; padding: 6px; margin: -6px -6px -6px 0;
  color: var(--ink); cursor: pointer;
}

/* Mobile menu overlay + sheet */
.nav-overlay{
  display: none; position: fixed; inset: 0; top: 64px;
  background: rgba(15,15,15,0.32);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  z-index: 45;
}
.nav-overlay.open{ display: block; }
.nav-mobile{
  display: none; flex-direction: column;
  position: fixed; top: 64px; left: 0; right: 0; z-index: 46;
  height: 72vh; max-height: 72vh; overflow-y: auto;
  background: var(--surface); color: var(--ink);
  border-bottom-left-radius: 18px; border-bottom-right-radius: 18px;
  box-shadow: 0 24px 48px rgba(0,0,0,0.16);
  padding: 8px 20px 20px;
}
.nav-mobile.open{ display: flex; }
.nav-mobile a{
  padding: 17px 2px; font-size: 16px; font-weight: 500;
  color: var(--ink); border-bottom: 1px solid var(--line);
}
.nav-mobile a:hover{ color: var(--red); }
.nav-mobile-cta{
  margin-top: auto; margin-bottom: 4px;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  background: var(--ink) !important; color: #fff !important; border: 0 !important;
  border-radius: var(--r-md); padding: 16px !important; font-weight: 600;
}
.nav-mobile-cta:hover{ background: #000 !important; }
body.nav-open{ overflow: hidden; }

@media (max-width: 760px){
  .nav-inner .nav-links{ display: none; }
  .nav-cta{ display: none; }
  .nav-toggle{ display: inline-flex; }
}

/* Hero */
.hero{ padding-top: clamp(72px, 9vw, 120px); padding-bottom: clamp(64px, 7vw, 104px); }
.hero-status{
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 13px; color: var(--ink-2);
  border: 1px solid var(--line);
  background: var(--surface);
  padding: 6px 12px; border-radius: 999px;
  margin-bottom: 28px;
}
.hero-status .dot{
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 0 4px rgba(202,17,15,0.12);
}
.hero h1 .mark-inline{
  display: inline-block; width: 0.36em; height: 0.92em;
  background: var(--red); transform: skewX(-12deg);
  vertical-align: -0.08em; margin-inline: 0.08em 0.16em;
}
.hero-sub{ margin-top: 28px; max-width: 60ch; }
.hero-cta{ display: flex; gap: 12px; margin-top: 36px; flex-wrap: wrap; }

/* Hero B — two-column with terminal */
.hero-grid-b{
  display: grid; grid-template-columns: 1.05fr 1fr; gap: 64px; align-items: center;
}
@media (max-width: 900px){ .hero-grid-b{ grid-template-columns: 1fr; gap: 40px; } }

/* Section header */
.section-head{ display: grid; grid-template-columns: 280px 1fr; gap: 64px; margin-bottom: 56px; }
.section-head .label{ display: flex; flex-direction: column; gap: 12px; }
.section-head .label .num{ font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 12px; color: var(--red); letter-spacing: 0.1em; }
@media (max-width: 760px){ .section-head{ grid-template-columns: 1fr; gap: 16px; margin-bottom: 36px; } }

/* Status terminal */
.terminal{
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  font-family: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: var(--t-mono);
  overflow: hidden;
}
.terminal-head{
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; border-bottom: 1px solid var(--line);
  color: var(--ink-3); font-size: 12px; letter-spacing: 0.04em;
}
.terminal-head .domain{ color: var(--ink); }
.terminal-head .pulse{ display: inline-flex; align-items: center; gap: 8px; }
.terminal-head .pulse .dot{
  width: 6px; height: 6px; border-radius: 50%; background: var(--red);
  animation: rpulse 1.6s ease-in-out infinite;
}
@keyframes rpulse{
  0%, 100%{ opacity: 1; }
  50%{ opacity: 0.35; }
}
.terminal-body{ padding: 18px 20px; display: flex; flex-direction: column; gap: 14px; }
.term-row{ display: grid; grid-template-columns: 56px 1fr auto; gap: 16px; align-items: baseline; }
.term-row .key{ color: var(--ink-3); }
.term-row .val{ color: var(--ink); white-space: pre-wrap; word-break: break-all; }
.term-row .val .hi{ color: var(--red); }
.term-row .status{
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 3px; border: 1px solid var(--line-strong);
  color: var(--ink-2);
}
.term-row .status.ok::before{ content:""; width:6px;height:6px;border-radius:50%; background:#22A06B; display:inline-block; }
.term-row .status.fail{ color: var(--red); border-color: rgba(202,17,15,0.25); }
.term-row .status.fail::before{ content:""; width:6px;height:6px;border-radius:50%; background:var(--red); display:inline-block; }
.term-row .status.warn::before{ content:""; width:6px;height:6px;border-radius:50%; background:#C58B00; display:inline-block; }
.terminal-foot{
  border-top: 1px solid var(--line); padding: 10px 16px;
  display: flex; justify-content: space-between; color: var(--ink-3); font-size: 12px;
}
@media (max-width: 480px){
  .term-row{ grid-template-columns: 1fr; gap: 4px; }
  .term-row .status{ justify-self: flex-start; }
  .terminal-foot{ flex-direction: column; gap: 4px; }
}

/* Problem stripe */
.three-col{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.three-col .cell{ padding: 40px 32px; border-right: 1px solid var(--line); }
.three-col .cell:last-child{ border-right: 0; }
.three-col .cell .num{ font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: var(--ink-3); letter-spacing: 0.12em; }
.three-col .cell .stat{ font-size: 44px; font-weight: 500; letter-spacing: -0.02em; margin: 14px 0 8px; }
.three-col .cell p{ color: var(--ink-2); font-size: 14.5px; max-width: 32ch; }
.three-col .cell .src{ display: block; margin-top: 10px; font-size: 12px; color: var(--ink-3); font-family: 'IBM Plex Mono', monospace; }
@media (max-width: 760px){
  .three-col{ grid-template-columns: 1fr; }
  .three-col .cell{ border-right: 0; border-bottom: 1px solid var(--line); }
  .three-col .cell:last-child{ border-bottom: 0; }
}

/* How it works */
.steps{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
@media (max-width: 900px){ .steps{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px){ .steps{ grid-template-columns: 1fr; } }
.step{ border-top: 1px solid var(--line); padding-top: 20px; display: flex; flex-direction: column; gap: 12px; }
.step .n{ font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: var(--red); letter-spacing: 0.1em; }
.step h4{ font-size: 17px; font-weight: 500; }
.step p{ font-size: 14.5px; color: var(--ink-2); }

/* Services */
.svc-list{ display: block; width: 100%; }
.svc{
  display: grid; grid-template-columns: 110px 1fr auto; gap: 32px; align-items: baseline;
  padding: 28px 0; border-top: 1px solid var(--line);
}
.svc:hover{ background: rgba(0,0,0,0.012); }
.svc:hover .svc-title{ color: var(--red); }
.svc:last-child{ border-bottom: 1px solid var(--line); }
.svc-tag{ font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: var(--ink-3); letter-spacing: 0.08em; }
.svc-title{ font-size: 18px; font-weight: 500; transition: color .15s ease; }
.svc-desc{ font-size: 14.5px; color: var(--ink-2); margin-top: 4px; max-width: 56ch; }
.svc-arrow{ color: var(--ink-3); transition: color .15s, transform .2s; }
.svc:hover .svc-arrow{ color: var(--red); transform: translateX(3px); }
.svc-note{ margin-top: 20px; font-size: 13px; color: var(--ink-3); max-width: 70ch; }
@media (max-width: 600px){
  .svc{ grid-template-columns: 1fr; gap: 8px; padding: 22px 0; }
  .svc-arrow{ display: none; }
}

/* Dashboard preview */
.product{ background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.product-chrome{
  display: flex; align-items: center; gap: 14px;
  padding: 12px 16px; border-bottom: 1px solid var(--line);
  font-size: 12px; color: var(--ink-3);
  font-family: 'IBM Plex Mono', monospace;
}
.product-chrome .dots{ display: flex; gap: 6px; }
.product-chrome .dots span{ width: 10px; height: 10px; border-radius: 50%; background: var(--line-strong); transition: background-color .15s ease; }
.product-chrome .dots:hover span:nth-child(1){ background: #FF5F57; }
.product-chrome .dots:hover span:nth-child(2){ background: #FFBD2E; }
.product-chrome .dots:hover span:nth-child(3){ background: #28C840; }
.product-chrome .url{ flex: 1; text-align: center; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-chrome-spacer{ width: 60px; flex: none; }
.product-body{ display: grid; grid-template-columns: 200px 1fr; min-height: 460px; background: var(--bg); }

/* Sidebar — oscura, como el panel real */
.product-side{ background: #ffffff; padding: 18px 14px; display: flex; flex-direction: column; gap: 2px; font-size: 13.5px; }
.product-side .p-domain{
  font-size: 11px; color: #888888; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 16px 8px 6px; font-family: 'IBM Plex Mono', monospace;
}
.product-side .grp{ font-size: 11px; color: #888888; letter-spacing: 0.1em; text-transform: uppercase; padding: 16px 8px 6px; }
.product-side a{ display: flex; align-items: center; gap: 10px; padding: 9px 8px; border-radius: 6px; color: #222222; }
.product-side a:hover{ background: rgba(25,25,25,0.06); color: #222222; }
.product-side a.active{ background: #222222; color: #fff; font-weight: 500; }

.product-main{ padding: 28px 28px 32px; min-width: 0; }
.product-crumb{ font-size: 12.5px; color: var(--ink-3); margin-bottom: 6px; }
.product-title{ font-size: 30px; font-weight: 500; letter-spacing: -0.01em; margin-bottom: 24px; }
.product-section-title{ font-size: 14.5px; font-weight: 500; color: var(--ink); margin: 28px 0 12px; }
.product-main > .product-section-title:first-of-type{ margin-top: 0; }

.product-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px; }
.product-grid--4{ grid-template-columns: repeat(4, 1fr); }
.metric{ background: var(--surface); border: 1px solid var(--line); border-radius: 6px; padding: 16px; }
.metric .k{ font-size: 11.5px; color: var(--ink-3); letter-spacing: 0.06em; text-transform: uppercase; font-family: 'IBM Plex Mono', monospace; }
.metric .v{ font-size: 26px; font-weight: 500; margin-top: 6px; letter-spacing: -0.01em; }
.metric .delta{ font-size: 12px; color: var(--ink-3); margin-top: 4px; }
.metric .delta.up{ color: #22A06B; }
.metric .delta.down{ color: var(--red); }

/* Gráfico de volumen */
.chart-card{ background: var(--surface); border: 1px solid var(--line); border-radius: 6px; padding: 20px 20px 16px; margin-bottom: 24px; }
.chart-scroll{ overflow-x: auto; -webkit-overflow-scrolling: touch; }
.bar-chart{ display: flex; align-items: flex-end; gap: 6px; height: 140px; }
.bar-col{ flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 6px; }
.bar-col .bar{ width: 100%; border-radius: 2px 2px 0 0; background: #22A06B; min-height: 3px; }
.bar-col .bar.fail{ background: var(--red); }
.bar-day{ font-family: 'IBM Plex Mono', monospace; font-size: 9.5px; color: var(--ink-3); white-space: nowrap; }
.chart-legend{ display: flex; gap: 18px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--ink-2); }
.chart-legend span{ display: inline-flex; align-items: center; gap: 6px; }
.chart-legend .dot{ width: 8px; height: 8px; border-radius: 50%; display: inline-block; background: #22A06B; }
.chart-legend .dot.fail{ background: var(--red); }
@media (max-width: 760px){ .bar-chart{ min-width: 560px; } }

.tbl{ width: 100%; border-collapse: collapse; font-size: 13.5px; background: var(--surface); }
.tbl th{ text-align: left; font-weight: 500; color: var(--ink-3); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; font-family: 'IBM Plex Mono', monospace; padding: 10px 8px; border-bottom: 1px solid var(--line); }
.tbl td{ padding: 12px 8px; border-bottom: 1px solid var(--line); color: var(--ink-2); }
.tbl tr:last-child td{ border-bottom: 0; }
.tbl .domain{ color: var(--ink); font-weight: 500; }
.tbl .pass{ color: #22A06B; }
.tbl .fail{ color: var(--red); }
.tbl .warn{ color: #C58B00; }
.tbl .check{ display: inline-flex; align-items: center; gap: 6px; font-family: 'IBM Plex Mono', monospace; font-size: 12px; }
.tbl .check::before{ content:""; width:6px;height:6px;border-radius:50%; background: currentColor; }
.tbl-wrap{ overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 -4px 24px; border: 1px solid var(--line); border-radius: 6px; }
.tbl-wrap .tbl{ min-width: 480px; border: 0; }
.tbl-wrap:last-child{ margin-bottom: 0; }
@media (max-width: 760px){
  .product-body{ grid-template-columns: 1fr; }
  .product-side{ display: none; }
  .product-grid{ grid-template-columns: 1fr; }
  .product-grid--4{ grid-template-columns: repeat(2, 1fr); }
  .product-main{ padding: 20px; }
  .product-chrome{ padding: 10px 12px; gap: 8px; }
  .product-chrome-spacer{ display: none; }
}

/* Pricing */
.price-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.price{ padding: 36px 32px; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 18px; background: var(--surface); }
.price:last-child{ border-right: 0; }
.price.featured{ background: var(--bg); position: relative; }
.price.featured::before{
  content: "Recomendado"; position: absolute; top: 18px; right: 20px;
  font-size: 11px; letter-spacing: 0.08em; color: var(--red);
  font-family: 'IBM Plex Mono', monospace;
}
.price h4{ font-size: 18px; font-weight: 500; }
.price .desc{ font-size: 14px; color: var(--ink-3); min-height: 40px; }
.price .amount{ display: flex; align-items: baseline; gap: 4px; }
.price .amount .n{ font-size: 44px; font-weight: 500; letter-spacing: -0.02em; }
.price .amount .u{ font-size: 14px; color: var(--ink-3); }
.price ul{ list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.price ul li{ display: flex; gap: 10px; align-items: flex-start; color: var(--ink-2); }
.price ul li::before{ content:""; flex: 0 0 14px; height: 1px; background: var(--ink); margin-top: 11px; }
.price .setup-fee{ font-size: 12.5px; color: var(--ink-3); margin-top: -10px; }
.price-note{ margin-top: 20px; font-size: 13px; color: var(--ink-3); }
@media (max-width: 900px){
  .price-grid{ grid-template-columns: 1fr; }
  .price{ border-right: 0; border-bottom: 1px solid var(--line); }
  .price:last-child{ border-bottom: 0; }
}

/* Diagnóstico gratis — banner + widget */
.price-diagnostic{
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: center;
  border-radius: var(--r-lg); background: var(--ink); position: relative; overflow: hidden;
  padding: 48px; margin-bottom: 40px;
}
.price-diagnostic::before{
  content: ""; position: absolute; top: -120px; right: -120px; width: 320px; height: 320px;
  border-radius: 50%; background: radial-gradient(circle, rgba(202,17,15,0.35), rgba(202,17,15,0) 70%);
  pointer-events: none;
}
.price-diagnostic-info{ position: relative; }
.price-diagnostic-info .tag{
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase;
  color: #fff; font-family: 'IBM Plex Mono', monospace; margin-bottom: 14px;
}
.price-diagnostic-info .tag::before{
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--red); box-shadow: 0 0 0 4px rgba(202,17,15,0.3);
}
.price-diagnostic-info h4{ font-size: 26px; color: #fff; margin-bottom: 10px; }
.price-diagnostic-info p{ font-size: 14.5px; color: rgba(255,255,255,0.68); max-width: 38ch; }
.price-diagnostic .rl-widget{ position: relative; color: #fff; }
.price-diagnostic .rl-input{ border-color: rgba(255,255,255,0.16); }
.price-diagnostic .rl-foot{ color: rgba(255,255,255,0.55); }
.price-diagnostic .rl-err{ color: #FF8582; }
@media (max-width: 760px){
  .price-diagnostic{ grid-template-columns: 1fr; gap: 24px; padding: 32px 24px; }
}

.rl-widget{ width: 100%; font-family: inherit; color: var(--ink); }
.rl-input{
  width: 100%; padding: 12px 14px; border: 1px solid var(--line-strong); border-radius: var(--r-md);
  font-size: 15px; margin-bottom: 10px; box-sizing: border-box; font-family: inherit;
}
.rl-btn{
  width: 100%; padding: 12px; background: var(--red); color: #fff; border: 0; border-radius: var(--r-md);
  font-size: 15px; font-weight: 500; cursor: pointer; font-family: inherit;
}
.rl-btn:hover{ background: var(--red-ink); }
.rl-btn[disabled]{ opacity: .6; cursor: default; }
.rl-err{ color: var(--red); font-size: 13px; margin-top: 6px; }
.rl-foot{ color: var(--ink-3); font-size: 12px; margin-top: 10px; }
.rl-alarm{
  font-size: 14px; line-height: 1.6; background: #FFF5F5; border: 1px solid #F2CACA;
  border-radius: var(--r-md); padding: 16px; margin-bottom: 14px; color:#000;
}
.rl-alarm b{ color: var(--red); }
.rl-ask{ font-weight: 500; margin: 0 0 10px; font-size: 14px; color:white;}
.rl-done-msg{
  font-size: 14px; line-height: 1.6; color: #1A7D36; background: #F1FAF3;
  border: 1px solid #CBE9D3; border-radius: var(--r-md); padding: 18px; text-align: center;
}

/* FAQ */
.faq{ border-top: 1px solid var(--line); }
.faq details{ border-bottom: 1px solid var(--line); padding: 22px 0; }
.faq summary{ list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; font-size: 17px; font-weight: 500; }
.faq summary::-webkit-details-marker{ display: none; }
.faq summary .plus{ width: 20px; height: 20px; position: relative; flex: none; }
.faq summary .plus::before, .faq summary .plus::after{
  content:""; position: absolute; background: var(--ink-2);
  left: 50%; top: 50%; transform: translate(-50%,-50%);
  transition: transform .2s ease, background .2s ease;
}
.faq summary .plus::before{ width: 12px; height: 1.5px; }
.faq summary .plus::after{ width: 1.5px; height: 12px; }
.faq details[open] summary .plus::after{ transform: translate(-50%,-50%) rotate(90deg); opacity: 0; }
.faq details[open] summary{ color: var(--red); }
.faq details[open] summary .plus::before{ background: var(--red); }
.faq p{ margin-top: 14px; max-width: 70ch; color: var(--ink-2); font-size: 15px; }

/* CTA strip */
.cta-strip{
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding-block: clamp(80px, 9vw, 128px);
}
.cta-strip h2{ max-width: 18ch; }
.cta-strip .row{ display: grid; grid-template-columns: 1.2fr 1fr; gap: 64px; align-items: end; }
@media (max-width: 760px){ .cta-strip .row{ grid-template-columns: 1fr; gap: 32px; } }
.contact-form{ margin: 56px auto 0; padding-top: 48px; border-top: 1px solid var(--line); max-width: 640px; }

/* Gravity Forms — heredar el estilo del tema.
   !important necesario: el CSS propio de GF ("orbital"/gravity-theme) puede
   cargar después del nuestro según el plugin, y pelea por especificidad en
   inputs/botón (color de marca por defecto, azul). */
.contact-form .gform_wrapper{ font-family: inherit !important; }
.contact-form .gform_fields{ list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.contact-form .gfield{ list-style: none; }
.contact-form .gfield_label{ display: block; font-size: 13px; font-weight: 500; color: var(--ink-2) !important; margin-bottom: 6px; }
.contact-form .gfield_required{ color: var(--red) !important; margin-left: 2px; }
.contact-form .ginput_container input[type="text"],
.contact-form .ginput_container input[type="email"],
.contact-form .ginput_container input[type="tel"],
.contact-form .ginput_container input[type="number"],
.contact-form .ginput_container input[type="url"],
.contact-form .ginput_container select,
.contact-form .ginput_container textarea{
  width: 100%; padding: 12px 14px !important; border: 1px solid var(--line-strong) !important; border-radius: var(--r-md) !important;
  font-size: 15px !important; font-family: inherit !important; box-sizing: border-box; color: var(--ink) !important; background: var(--surface) !important;
  box-shadow: none !important;
}
.contact-form .ginput_container textarea{ min-height: 120px; resize: vertical; }
.contact-form .ginput_container input:focus,
.contact-form .ginput_container textarea:focus,
.contact-form .ginput_container select:focus{ outline: none !important; border-color: var(--ink) !important; box-shadow: none !important; }
.contact-form .gform_footer{ margin: 8px 0 0; padding: 0; }
.contact-form .gform_button{
  background: var(--red) !important; color: #fff !important; border: 0 !important; border-radius: var(--r-md) !important;
  padding: 12px 24px !important; font-size: 15px !important; font-weight: 500; font-family: inherit !important; cursor: pointer;
  box-shadow: none !important; text-transform: none !important;
}
.contact-form .gform_button:hover{ background: var(--red-ink) !important; }
.contact-form .gfield_description.validation_message,
.contact-form .gfield_validation_message{ color: var(--red) !important; font-size: 12.5px; margin-top: 4px; }
.contact-form .gfield_error input,
.contact-form .gfield_error textarea,
.contact-form .gfield_error select{ border-color: var(--red) !important; }
.contact-form .validation_error{
  color: var(--red); font-size: 13.5px; border: 1px solid rgba(202,17,15,0.25);
  background: #FFF5F5; border-radius: var(--r-md); padding: 12px 16px; margin-bottom: 16px;
}
.contact-form .gform_confirmation_message{
  font-size: 14px; line-height: 1.6; color: #1A7D36; background: #F1FAF3;
  border: 1px solid #CBE9D3; border-radius: var(--r-md); padding: 18px;
}

/* Legal pages (privacidad / aviso legal / cookies) */
.legal-page{ padding-block: clamp(56px, 7vw, 96px); }
.legal-container{ max-width: 760px; }
.legal-head{ margin-bottom: 40px; }
.legal-head .eyebrow{ display: block; margin-bottom: 14px; }
.legal-head h1{ font-size: var(--t-h1); }
.legal-body h3{ font-size: 18px; font-weight: 600; margin: 36px 0 12px; }
.legal-body h3:first-child{ margin-top: 0; }
.legal-body p{ font-size: 15px; line-height: 1.7; margin-bottom: 14px; }
.legal-body a{ color: var(--red); text-decoration: underline; text-underline-offset: 2px; }
.legal-body .lede{ max-width: none; margin-bottom: 8px; }
.legal-table{ width: 100%; border-collapse: collapse; margin: 20px 0 28px; font-size: 14px; }
.legal-table th{
  text-align: left; font-weight: 600; color: var(--ink); padding: 10px 12px;
  border-bottom: 2px solid var(--line-strong); font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em;
}
.legal-table td{ padding: 12px; border-bottom: 1px solid var(--line); color: var(--ink-2); vertical-align: top; }
.legal-table code{ font-family: 'IBM Plex Mono', monospace; background: var(--bg); padding: 2px 6px; border-radius: 4px; font-size: 0.9em; }
@media (max-width: 600px){ .legal-table{ display: block; overflow-x: auto; white-space: nowrap; } }
.legal-disclaimer{
  margin-top: 40px; padding: 16px 18px; font-size: 13px; color: var(--ink-3);
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--r-md);
}

/* Accesibilidad — utilidad estándar de WordPress, usada por the_posts_pagination() */
.screen-reader-text{
  border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
  height: 1px; margin: -1px; overflow: hidden; padding: 0;
  position: absolute !important; width: 1px; word-wrap: normal !important;
}

/* Blog — listado */
.blog-page{ padding-block: clamp(72px, 9vw, 128px); }
.blog-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.blog-card{
  display: flex; flex-direction: column;
  border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden;
  background: var(--surface); transition: border-color .15s ease;
}
.blog-card:hover{ border-color: var(--ink); }
.blog-card:hover h3{ color: var(--red); }
.blog-card-thumb{ aspect-ratio: 16 / 10; overflow: hidden; background: var(--bg); }
.blog-card-thumb img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.blog-card-body{ padding: 20px 22px 24px; display: flex; flex-direction: column; gap: 8px; }
.blog-card-date{
  font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: var(--ink-3); letter-spacing: 0.06em;
}
.blog-card h3{ font-size: 19px; font-weight: 500; transition: color .15s ease; }
.blog-card p{ font-size: 14px; color: var(--ink-2); }
.blog-empty{ font-size: 15px; color: var(--ink-2); }
@media (max-width: 900px){ .blog-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px){ .blog-grid{ grid-template-columns: 1fr; } }

/* Paginación (the_posts_pagination) */
.pagination{ margin-top: 48px; }
.pagination .nav-links{ display: flex; justify-content: center; align-items: center; gap: 8px; flex-wrap: wrap; }
.pagination .page-numbers{
  display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px;
  padding: 0 12px; border: 1px solid var(--line-strong); border-radius: var(--r-md);
  font-size: 14px; color: var(--ink-2); font-family: 'IBM Plex Mono', monospace;
}
a.page-numbers:hover{ border-color: var(--ink); color: var(--ink); }
.pagination .page-numbers.current{ background: var(--ink); color: #fff; border-color: var(--ink); }
.pagination .page-numbers.dots{ border: 0; }

/* Blog — entrada individual */
.blog-post{ padding-block: clamp(56px, 7vw, 96px); }
.blog-back{ display: inline-block; font-size: 13.5px; color: var(--ink-3); margin-bottom: 20px; }
.blog-back:hover{ color: var(--red); }
.blog-post-head .blog-card-date{ display: block; margin-bottom: 10px; }
.blog-post-head h1{ font-size: var(--t-h1); margin-bottom: 8px; }
.blog-post-thumb{ margin: 32px 0; border-radius: var(--r-lg); overflow: hidden; }
.blog-post-thumb img{ width: 100%; display: block; }

.entry-content{ font-size: 16px; line-height: 1.75; color: var(--ink-2); }
.entry-content h2{ font-size: 26px; margin: 40px 0 16px; color: var(--ink); }
.entry-content h3{ font-size: 20px; margin: 32px 0 12px; color: var(--ink); }
.entry-content p{ margin-bottom: 18px; }
.entry-content ul, .entry-content ol{ margin: 0 0 18px; padding-left: 22px; }
.entry-content li{ margin-bottom: 8px; }
.entry-content a{ color: var(--red); text-decoration: underline; text-underline-offset: 2px; }
.entry-content img{ max-width: 100%; height: auto; border-radius: var(--r-md); margin: 24px 0; }
.entry-content blockquote{
  border-left: 3px solid var(--red); margin: 24px 0; padding: 4px 0 4px 20px;
  font-style: italic; color: var(--ink-2);
}
.entry-content code{
  font-family: 'IBM Plex Mono', monospace; background: var(--bg); padding: 2px 6px;
  border-radius: 4px; font-size: 0.9em;
}
.entry-content pre{
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 16px; overflow-x: auto;
}
.entry-content pre code{ background: none; padding: 0; }

/* Footer */
.foot{ padding: 56px 0 40px; }
.foot-grid{ display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; }
.foot-grid h5{ font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-3); font-weight: 500; margin: 0 0 14px; font-family: 'IBM Plex Mono', monospace; }
.foot-grid ul{ list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.foot-grid li a{ color: var(--ink-2); }
.foot-grid li a:hover{ color: var(--red); }
.foot-bottom{ display: flex; justify-content: space-between; padding-top: 32px; margin-top: 40px; border-top: 1px solid var(--line); font-size: 13px; color: var(--ink-3); }
@media (max-width: 760px){ .foot-grid{ grid-template-columns: 1fr 1fr; } .foot-bottom{ flex-direction: column; gap: 8px; } }

/* Trust row */
.trust{ display: flex; flex-wrap: wrap; gap: 40px; align-items: center; padding: 28px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.trust .label{ font-size: 12px; color: var(--ink-3); letter-spacing: 0.1em; text-transform: uppercase; font-family: 'IBM Plex Mono', monospace; }
.trust .companies{ display: flex; flex-wrap: wrap; gap: 36px; align-items: center; color: var(--ink-3); font-size: 18px; font-weight: 500; letter-spacing: -0.01em; }

.bg-shade{ background: #F4F4F4; }
#moove_gdpr_cookie_info_bar.moove-gdpr-dark-scheme {
    background-color: rgba(32, 32, 32, 0.8)!important;
    border-top: 0px solid #fff;
}
button.mgbutton.moove-gdpr-infobar-allow-all.gdpr-fbo-0 {
    border-radius: 8px!important;
}
#moove_gdpr_cookie_info_bar:not(.gdpr-full-screen-infobar).moove-gdpr-dark-scheme .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content a.mgbutton.moove-gdpr-infobar-reject-btn, #moove_gdpr_cookie_info_bar:not(.gdpr-full-screen-infobar).moove-gdpr-dark-scheme .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content button.mgbutton.moove-gdpr-infobar-reject-btn {
    background-color: transparent;
    box-shadow: inset 0 0 0 1px currentColor;
    opacity: .7;
    color: #fff;
    border-radius: 9px!important;
}
button.mgbutton.moove-gdpr-infobar-settings-btn.change-settings-button.gdpr-fbo-2.gdpr-settings-btn-style-2 {
    border-radius: 8px!important;
}