/* Layout: cabecera ligera → titular centrado → panel con grano y conversación de ejemplo → tres accesos → secciones B2B/B2C en dos columnas */
/* Geist alojada en fonts/ (Vercel, SIL OFL 1.1: fonts/OFL.txt). Sin peticiones a otros dominios. */
@font-face{font-family:"Geist";src:url("fonts/Geist-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Geist";src:url("fonts/Geist-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Geist";src:url("fonts/Geist-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Geist";src:url("fonts/Geist-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Geist";src:url("fonts/Geist-Italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Geist";src:url("fonts/Geist-MediumItalic.woff2") format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:"Geist";src:url("fonts/Geist-SemiBoldItalic.woff2") format("woff2");font-weight:600;font-style:italic;font-display:swap}
@font-face{font-family:"Geist";src:url("fonts/Geist-BoldItalic.woff2") format("woff2");font-weight:700;font-style:italic;font-display:swap}
:root{
  --bg:#FAF8F4; --fg:#1B1E1A; --muted:#5D635B; --line:#E5E1D8; --surface:#FFFFFF; --bubble:#F2EFE9;
  --sage:#7F9C7B; --sage-ink:#3F5C3D; --sage-soft:#E6EEE3; --coral:#E3826A; --sand:#E8D7B8;
  --btn:#1B1E1A; --btn-fg:#FAF8F4;
  --g1:#8FAE8A; --g2:#E7D3AE; --g3:#E8907A; --g4:#5F8A7A;
  --me:#FBFAF7; --me-line:#E2DED5;
  --warn-soft:#FBE7DF; --warn-ink:#93412C;
  --display:"Geist", system-ui, sans-serif;
  --body:"Geist", system-ui, sans-serif;
  --r-lg:28px; --r-md:18px; --r-sm:12px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#111311; --fg:#EDECE7; --muted:#A2A79E; --line:#272B26; --surface:#1A1D19; --bubble:#232722;
    --sage:#9DB898; --sage-ink:#B7D0B2; --sage-soft:#1F2A1E; --coral:#EE967F; --sand:#5A4E3A;
    --btn:#EDECE7; --btn-fg:#111311;
    --g1:#3E5A3C; --g2:#6B5A3C; --g3:#7A3F32; --g4:#24433B;
    --me:#2A2E29; --me-line:#363B35;
    --warn-soft:#3B241D; --warn-ink:#F2B6A5;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#111311; --fg:#EDECE7; --muted:#A2A79E; --line:#272B26; --surface:#1A1D19; --bubble:#232722;
  --sage:#9DB898; --sage-ink:#B7D0B2; --sage-soft:#1F2A1E; --coral:#EE967F; --sand:#5A4E3A;
  --btn:#EDECE7; --btn-fg:#111311;
  --g1:#3E5A3C; --g2:#6B5A3C; --g3:#7A3F32; --g4:#24433B;
  --me:#2A2E29; --me-line:#363B35;
  --warn-soft:#3B241D; --warn-ink:#F2B6A5;
  color-scheme:dark;
}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--fg);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px, env(safe-area-inset-left, 0px));padding-right:max(16px, env(safe-area-inset-right, 0px))}
h1,h2,h3{font-family:var(--display);font-weight:500;letter-spacing:-0.025em;text-wrap:balance;margin:0}
p{margin:0}
:focus-visible{outline:2px solid var(--coral);outline-offset:3px;border-radius:6px}

/* Cabecera */
header{position:sticky;top:env(safe-area-inset-top, 0px);z-index:20;background:color-mix(in srgb, var(--bg) 86%, transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid transparent}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top, 0px);z-index:10;background:var(--bg)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--display);font-weight:600;font-size:21px;letter-spacing:-0.02em}
.orb{width:24px;height:24px;border-radius:50%;background:radial-gradient(circle at 32% 30%, #FFF4DC 0%, var(--sand) 22%, var(--sage) 58%, var(--g4) 100%);box-shadow:inset -2px -3px 6px rgba(0,0,0,.18)}
.links{display:flex;gap:28px;font-size:15px;color:var(--muted)}
.links a{text-decoration:none}
.links a:hover{color:var(--fg)}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:11px 20px;font:500 15px/1 var(--body);text-decoration:none;border:1px solid transparent;cursor:pointer;white-space:nowrap}
.btn-dark{background:var(--btn);color:var(--btn-fg)}
.btn-dark:hover{opacity:.88}
.btn-ghost{background:var(--surface);color:var(--fg);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--muted)}

/* Portada */
.hero{padding-block:72px 40px;text-align:center}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--sage-soft);color:var(--sage-ink);border-radius:999px;padding:7px 14px;font-size:14px;font-weight:500}
.dot{width:7px;height:7px;border-radius:50%;background:var(--sage)}
.hero h1{font-size:clamp(42px, 7.2vw, 88px);line-height:1.02;margin-top:26px}
.hero .lead{font-size:clamp(18px, 2vw, 21px);max-width:640px;margin:22px auto 0;color:var(--muted)}
.cta-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:32px}

/* Panel con grano */
.stage{position:relative;margin-top:56px;border-radius:var(--r-lg);overflow:hidden;padding:44px 16px 28px;
  background:
    radial-gradient(60% 70% at 12% 30%, var(--g2) 0%, transparent 60%),
    radial-gradient(55% 65% at 88% 78%, var(--g3) 0%, transparent 62%),
    radial-gradient(70% 80% at 80% 10%, var(--g4) 0%, transparent 60%),
    linear-gradient(160deg, var(--g1), var(--g4));}
.stage::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.32;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.stage > *{position:relative;z-index:1}
.tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:6px}
.tab{border:0;background:transparent;color:#fff;font:500 15px/1 var(--body);padding:11px 18px;border-radius:999px;cursor:pointer;text-shadow:0 1px 2px rgba(0,0,0,.18)}
.tab[aria-selected="true"]{background:var(--surface);color:var(--fg);text-shadow:none}
.chat{text-align:left;width:min(100%, 460px);margin:22px auto 0;background:var(--surface);border-radius:26px;padding:20px;box-shadow:0 24px 60px -24px rgba(20,30,20,.45)}
.chat-head{display:flex;align-items:center;gap:12px;padding-bottom:14px}
.chat-head .orb{width:36px;height:36px}
.chat-head strong{display:block;font-size:15px;font-weight:600}
.chat-head span{display:block;font-size:13px;color:var(--sage-ink)}
.chat-head > div{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.msgs{display:flex;flex-direction:column;gap:10px}
.msg{max-width:84%;padding:11px 14px;border-radius:16px;font-size:15px;line-height:1.45}
.me{align-self:flex-end;background:var(--me);color:var(--fg);border:1px solid var(--me-line);border-bottom-right-radius:6px}
.ai{align-self:flex-start;background:var(--bubble);border-bottom-left-radius:6px}
.plan{align-self:flex-start;width:84%;border:1px solid var(--line);border-radius:var(--r-md);padding:14px;font-size:14px}
.plan h4{margin:0 0 10px;font:600 14px/1.3 var(--body)}
.plan dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0}
.plan dt{font-family:var(--body);font-size:12px;color:var(--muted);padding-top:2px}
.plan dd{margin:0}
.unit.warn{background:var(--warn-soft);color:var(--warn-ink)}
.plan .note{display:block;color:var(--muted);font-size:13px;margin-top:2px}
.file{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:13px;border:1px solid var(--me-line);background:var(--surface);border-radius:8px;padding:4px 8px}
.unit{font-family:var(--body);font-size:12.5px;background:var(--sage-soft);color:var(--sage-ink);padding:1px 6px;border-radius:6px;white-space:nowrap}
.composer{display:flex;gap:8px;margin-top:16px}
.composer div{flex:1;min-width:0;border:1px solid var(--line);border-radius:999px;padding:11px 16px;color:var(--muted);font-size:14px}
.send{width:42px;height:42px;border-radius:50%;background:var(--btn);color:var(--btn-fg);display:grid;place-items:center;flex:none}
.stage-note{text-align:center;color:#fff;font-size:13px;margin-top:18px;text-shadow:0 1px 2px rgba(0,0,0,.25)}

/* Accesos */
.areas{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:20px;padding-block:56px 24px}
.area{display:flex;flex-direction:column;gap:10px;padding-top:20px;border-top:1px solid var(--line);text-decoration:none}
.area .tag{font-family:var(--body);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.area h3{font-size:26px}
.area p{color:var(--muted)}
.area .go{margin-top:auto;font-weight:500;color:var(--fg)}
.area:hover h3{color:var(--sage-ink)}

/* Sección */
.section{padding-block:72px}
.section-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:16px;margin-bottom:32px}
.section-head h2{font-size:clamp(34px, 4.6vw, 54px);line-height:1.05}
.section-head p{color:var(--muted);max-width:420px}
.split{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:20px}
.panel{border-radius:var(--r-lg);padding:32px;display:flex;flex-direction:column;gap:16px;min-width:0}
.panel.pro{background:var(--surface);border:1px solid var(--line)}
.panel.you{background:var(--sage-soft)}
.who{font-family:var(--body);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.panel h3{font-size:clamp(24px, 2.6vw, 30px);line-height:1.15}
.panel ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.panel li{display:grid;grid-template-columns:18px 1fr;gap:10px}
.panel li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--sage);margin-top:9px}
.panel .btn{align-self:flex-start;margin-top:auto}
.panel p{color:var(--muted)}
.panel.you .photo{flex:1 1 0;height:0;min-height:180px;border-radius:var(--r-md)}
@media (max-width: 860px){ .panel.you .photo{flex:none;height:220px} }
.photo{display:block;width:100%;max-width:100%;object-fit:cover;background:var(--bubble)}


@media (max-width: 860px){
  .links{display:none}
  .areas,.split{grid-template-columns:1fr}
  .hero{padding-block:48px 24px}
  .panel{padding:24px}
}
@media (prefers-reduced-motion: no-preference){
  .msgs > *{animation:rise .5s ease both}
  .msgs > *:nth-child(2){animation-delay:.08s}
  .msgs > *:nth-child(3){animation-delay:.16s}
  .msgs > *:nth-child(4){animation-delay:.24s}
}
@keyframes rise{from{transform:translateY(6px)}to{transform:none}}

/* Valores de ejemplo */
.values{margin-top:20px;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;background:var(--surface)}
.values-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 16px;margin-bottom:20px}
.values-head h3{font-size:clamp(22px, 2.4vw, 28px)}
.values-head p{color:var(--muted);font-size:15px}
.vgrid{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:12px}
.vcard{border-radius:var(--r-md);background:var(--bg);padding:16px;display:flex;flex-direction:column;gap:4px;min-width:0}
.vcard .name{font-size:13px;color:var(--muted);letter-spacing:.02em}
.vcard .val{font-size:28px;font-weight:500;letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.vcard .val small{font-size:14px;font-weight:400;color:var(--muted);margin-left:4px}
.vcard .what{font-size:14px;color:var(--muted);line-height:1.4}
.values-note{margin-top:16px;font-size:13px;color:var(--muted)}

/* Confianza */
.trust{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:20px}
.trust .panel ul li::before{background:var(--sage)}
.trust .panel.no li::before{background:var(--coral)}
.privacy{margin-top:20px;border-radius:var(--r-lg);background:var(--sage-soft);padding:32px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px;align-items:center}
.privacy h3{font-size:clamp(26px, 3vw, 36px);line-height:1.1}
.privacy p{color:var(--muted)}

/* Preguntas */
.faq{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:22px;font-size:clamp(18px, 2vw, 21px);font-weight:500;letter-spacing:-0.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:24px;font-weight:400;color:var(--muted);transition:transform .2s ease}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--muted);max-width:68ch;padding-bottom:22px}

/* Cierre */
.closing{position:relative;overflow:hidden;border-radius:var(--r-lg);padding:64px 24px;text-align:center;color:#fff;
  background:radial-gradient(60% 80% at 15% 20%, var(--g2) 0%, transparent 60%),radial-gradient(60% 80% at 90% 90%, var(--g3) 0%, transparent 60%),linear-gradient(150deg, var(--g1), var(--g4))}
.closing h2{font-size:clamp(32px, 4.6vw, 54px);line-height:1.05;text-shadow:0 1px 3px rgba(0,0,0,.18)}
.closing p{margin:16px auto 0;max-width:520px;text-shadow:0 1px 2px rgba(0,0,0,.2)}
.closing .cta-row{margin-top:28px}
.closing .btn-ghost{background:var(--surface);color:var(--fg);border-color:transparent}

/* Pie */
footer{border-top:1px solid var(--line);padding-block:48px 28px;color:var(--muted);font-size:14px;margin-top:72px}
.fcols{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3, minmax(0,1fr));gap:28px}
.fcols h4{margin:0 0 12px;font-size:13px;font-weight:500;color:var(--fg);letter-spacing:.04em;text-transform:uppercase}
.fcols ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.fcols a{text-decoration:none}
.fcols a:hover{color:var(--fg)}
.fcols .brand{color:var(--fg);margin-bottom:12px}
.funding{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:16px 32px;margin-top:40px;padding:16px 20px;border-radius:var(--r-md);background:#FFFFFF}
.funding img{height:40px;width:auto;max-width:100%}

/* Páginas legales */
.legal{max-width:760px;margin:0 auto;padding-block:56px 24px}
.legal .eyebrow{font-size:13px;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.legal h1{font-size:clamp(36px, 5vw, 52px);line-height:1.05;margin-top:8px}
.legal .updated{color:var(--muted);margin-top:12px;font-size:14px}
.legal h2{font-size:22px;margin-top:40px}
.legal p,.legal li{color:var(--fg);max-width:68ch}
.legal p{margin-top:12px}
.legal ul{padding-left:20px;margin:12px 0 0;display:flex;flex-direction:column;gap:6px}
.legal dl{display:grid;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:10px 20px;margin:16px 0 0;padding:20px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
.legal dt{color:var(--muted)}
.legal dd{margin:0}
.pending{background:var(--warn-soft);color:var(--warn-ink);border-radius:6px;padding:1px 6px;font-size:.92em}
.contact-grid{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:20px;margin-top:32px}
.mailbox{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:8px}
.mailbox code{font-family:var(--body);font-size:17px;font-weight:500;user-select:all;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 12px}
.copy-status{font-size:13px;color:var(--sage-ink)}
.prefs{margin-top:16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
.pref{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 20px}
.pref + .pref{border-top:1px solid var(--line)}
.pref strong{display:block;font-weight:500}
.pref span{color:var(--muted);font-size:14px}
.switch{appearance:none;-webkit-appearance:none;flex:none;width:44px;height:26px;border-radius:999px;background:var(--line);position:relative;cursor:pointer;transition:background .2s}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--surface);box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .2s}
.switch:checked{background:var(--sage)}
.switch:checked::after{transform:translateX(18px)}
.switch:disabled{cursor:not-allowed;opacity:.6}

@media (max-width: 860px){
  .vgrid{grid-template-columns:repeat(2, minmax(0,1fr))}
  .trust,.privacy,.contact-grid{grid-template-columns:1fr}
  .fcols{grid-template-columns:repeat(2, minmax(0,1fr))}
  .values,.privacy{padding:22px}
  .legal dl{grid-template-columns:1fr;gap:2px}
  .legal dd{margin-bottom:10px}
}
