/* Inicio de TeRePido · se carga después de theme.css */
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{background:var(--surface)}
.defs{position:absolute;width:0;height:0;overflow:hidden}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}.narrow{max-width:780px}
.row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.center{text-align:center}
h1,h2,h3{margin:0;line-height:1.08;letter-spacing:-.035em;font-variation-settings:"ROND" 100}
h1{font-size:clamp(38px,8.4vw,72px);font-weight:800}
h2{font-size:clamp(30px,5.4vw,48px);font-weight:800;text-align:center;margin-bottom:12px}
h3{font-size:20px;font-weight:750;letter-spacing:-.015em}
.hl{color:var(--primary);background:linear-gradient(transparent 70%,var(--tertiary-container) 70%,var(--tertiary-container) 94%,transparent 94%);-webkit-box-decoration-break:clone;box-decoration-break:clone}
.sub{color:var(--on-surface-variant);text-align:center;max-width:640px;margin:0 auto 32px;font-size:18px}

/* Barra superior */
.top{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--surface) 92%,transparent)}
.bar{display:flex;align-items:center;gap:6px;min-height:68px}
.bar .brand{margin-right:auto}
.links{display:flex;gap:4px;margin-right:8px}
.links a{color:var(--on-surface-variant);text-decoration:none;font-weight:600;font-size:15px;padding:10px 14px;border-radius:var(--r-full);transition:background-color .2s}
.links a:hover{background:var(--surface-high);color:var(--on-surface)}
@media (max-width:900px){.links{display:none}}
@media (max-width:520px){#h-cta{display:none}.bar .brand .wm{font-size:20px}.bar .brand img{width:30px;height:30px}}

/* Portada */
.hero{padding:28px 0 56px;overflow:hidden}
.hgrid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
@media (max-width:900px){.hgrid{grid-template-columns:1fr;gap:36px}}
.eyebrow{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 16px;border-radius:var(--r-full);background:var(--tertiary-container);color:var(--on-tertiary-container);font-weight:700;font-size:14px;margin-bottom:20px}
.eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--pink)}
.lead{font-size:clamp(17px,2.2vw,20px);color:var(--on-surface-variant);margin:22px 0 28px;max-width:560px}
.lead b{color:var(--on-surface)}
.cta{display:flex;gap:12px;flex-wrap:wrap}
@media (max-width:520px){.cta .btn{width:100%}}
.small{color:var(--on-surface-variant);font-size:14px;margin-top:16px}
.hvis{position:relative;display:flex;justify-content:center;padding:24px 0 40px;min-height:520px}
.blob{position:absolute;pointer-events:none}
.blob use{fill:currentColor}
.b1{width:380px;height:380px;color:var(--primary-container);top:10px;left:50%;margin-left:-230px;animation:spin 60s linear infinite}
.b2{width:150px;height:150px;color:var(--tertiary-container);bottom:10px;right:4%;animation:spin 40s linear infinite reverse}
.b3{width:90px;height:90px;color:var(--secondary-container);top:0;right:12%}
@keyframes spin{to{transform:rotate(360deg)}}
.phone{position:relative;width:270px;background:var(--surface-lowest);border-radius:40px;padding:10px 10px 18px;box-shadow:0 30px 60px -20px rgba(30,40,90,.35),0 0 0 8px #1b1d24;z-index:1;color:#1A1C22;background:#fff}
.ph-img{height:190px;border-radius:30px 30px 18px 18px;background:radial-gradient(circle at 30% 30%,#ffd1e0,transparent 55%),linear-gradient(135deg,#ff8fb5,#e64980 55%,#4263eb);position:relative}
.ph-dot{position:absolute;bottom:10px;width:7px;height:7px;border-radius:9px;background:rgba(255,255,255,.6);left:50%}
.ph-dot:nth-child(1){margin-left:-22px;width:18px;background:#fff}.ph-dot:nth-child(2){margin-left:0}.ph-dot:nth-child(3){margin-left:12px}
.ph-t{font-weight:800;margin:14px 8px 2px;font-size:17px;letter-spacing:-.01em}
.ph-p{margin:0 8px;font-size:21px;font-weight:800}.ph-p s{color:#8a8d91;font-size:14px;font-weight:500}
.ph-l{font-size:12px;font-weight:700;margin:10px 8px 6px;color:#464B57}
.ph-c{display:flex;gap:6px;flex-wrap:wrap;padding:0 8px}
.ph-c i{font-style:normal;font-size:13px;font-weight:600;border-radius:10px;padding:5px 11px;box-shadow:inset 0 0 0 1.5px #C6CAD5}
.ph-c i.on{background:#4263EB;color:#fff;box-shadow:none;border-radius:999px}
.ph-b{margin:16px 8px 0;background:#4263EB;color:#fff;font-weight:700;text-align:center;padding:13px;border-radius:999px}
.order{position:absolute;z-index:2;right:max(0px,calc(50% - 250px));bottom:6px;width:210px;background:var(--surface-lowest);color:var(--on-surface);border-radius:22px 22px 22px 6px;padding:14px 16px;box-shadow:var(--e3);animation:float 5s ease-in-out infinite}
.order p{margin:4px 0;font-size:13px;display:flex;align-items:center;gap:8px}
.order i{width:8px;height:8px;border-radius:50%;background:var(--pink-soft);flex:none}
.order .o-h{font-weight:800;font-size:12px;color:var(--primary);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.order .o-t{font-weight:800;font-size:16px;margin-top:8px}
@keyframes float{50%{transform:translateY(-10px)}}
@media (max-width:900px){.hvis{min-height:0;padding-top:8px}.b1{width:320px;height:320px;margin-left:-160px}.order{right:4%;bottom:-6px}}

/* Secciones */
.sec{padding:72px 0}
.sec.tint{background:var(--surface-low);border-radius:48px;margin:0 8px}
@media (max-width:600px){.sec{padding:56px 0}.sec.tint{border-radius:32px;margin:0 4px}}
.chats{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:840px;margin:0 auto 40px}
@media (max-width:700px){.chats{grid-template-columns:1fr}}
.chat{background:var(--surface-c);border-radius:var(--r-2xl);padding:20px;display:flex;flex-direction:column;gap:8px}
.chat .ct{margin:0 0 6px;font-weight:800;text-align:center;font-size:15px;color:var(--on-surface-variant)}
.chat.ok{background:var(--primary-container)}.chat.ok .ct{color:var(--on-primary-container)}
.chat .in,.chat .out{margin:0;padding:9px 14px;border-radius:18px;max-width:85%;font-size:15px;color:#1A1C22}
.chat .in{background:#fff;align-self:flex-start;border-bottom-left-radius:6px}.chat .out{background:#d9fdd3;align-self:flex-end;border-bottom-right-radius:6px}
.ficha{background:#fff;color:#1A1C22;border-radius:22px 22px 22px 6px;padding:14px 18px;align-self:flex-start;box-shadow:var(--e1);min-width:230px}
.ficha p{margin:5px 0;display:flex;align-items:center;gap:10px;font-size:15px}
.ficha i{width:9px;height:9px;border-radius:50%;background:#FF6B9E;flex:none}
.ficha .fh{font-weight:700}.ficha .ft{font-weight:800;margin-top:8px;color:#4263EB}
.chat .cap{margin:10px 0 0;font-size:14px;text-align:center;color:var(--on-surface-variant)}
.chat.ok .cap{color:var(--on-primary-container)}
.cards4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:980px){.cards4{grid-template-columns:1fr 1fr}}@media (max-width:560px){.cards4{grid-template-columns:1fr}}
.cards4>div{position:relative;background:var(--surface-low);border-radius:var(--r-xl);padding:24px 22px;overflow:hidden;transition:border-radius .5s var(--spring)}
.cards4>div:hover{border-radius:var(--r-lg)}
.cards4 p{color:var(--on-surface-variant);margin:8px 0 0;font-size:15px}
.ic-bg{position:absolute;width:64px;height:64px;top:22px;left:22px}
.ic-bg use{fill:currentColor}
.ic{position:relative;display:flex;align-items:center;justify-content:center;width:64px;height:64px;margin-bottom:18px}
.ic svg{width:28px;height:28px}
.c1 .ic-bg,.c4 .ic-bg{color:var(--primary-container)}.c1 .ic,.c4 .ic{color:var(--on-primary-container)}
.c2 .ic-bg{color:var(--tertiary-container)}.c2 .ic{color:var(--on-tertiary-container)}
.c3 .ic-bg{color:var(--secondary-container)}.c3 .ic{color:var(--on-secondary-container)}
.steps{list-style:none;padding:0;margin:28px auto 36px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1000px}
@media (max-width:820px){.steps{grid-template-columns:1fr}}
.steps li{background:var(--surface-lowest);border-radius:var(--r-xl);padding:24px}
.steps strong{display:block;font-size:20px;margin:14px 0 6px;letter-spacing:-.015em}.steps span{color:var(--on-surface-variant)}
.steps .url{color:var(--primary);word-break:break-all}
.num{position:relative;display:flex;align-items:center;justify-content:center;width:60px;height:60px}
.nbg{position:absolute;inset:0;width:60px;height:60px;color:var(--primary)}.nbg use{fill:currentColor}
.steps li:nth-child(2) .nbg{color:var(--pink)}.steps li:nth-child(3) .nbg{color:var(--secondary)}
.num b{position:relative;color:#fff;font-size:24px;font-weight:800}
.tags{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:820px;margin:0 auto}
.tags span{display:inline-flex;align-items:center;height:44px;padding:0 18px;border-radius:var(--r-md);font-weight:650;background:var(--secondary-container);color:var(--on-secondary-container)}
.tags span:nth-child(3n+2){background:var(--tertiary-container);color:var(--on-tertiary-container)}
.tags span:nth-child(3n){background:var(--primary-container);color:var(--on-primary-container)}
.prices{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:28px;align-items:stretch}
.price{background:var(--primary-container);color:var(--on-primary-container);border-radius:var(--r-2xl);padding:30px 28px;width:100%;max-width:420px;display:flex;flex-direction:column}
.price.alt{background:var(--surface-lowest);color:var(--on-surface)}
.price h3{font-size:22px}
.price .big{font-size:48px;font-weight:800;margin:10px 0 14px;letter-spacing:-.04em;font-variation-settings:"ROND" 100}.price .big small{font-size:17px;font-weight:600;letter-spacing:0;opacity:.75}
.price ul{padding:0;margin:0 0 16px;flex:1;list-style:none}
.price li{margin:10px 0;padding-left:30px;position:relative}
.price li::before{content:"";position:absolute;left:0;top:3px;width:18px;height:18px;border-radius:50%;background:var(--primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
.price.alt li::before{background-color:var(--pink)}
.note{font-size:14px;margin:0 0 18px;opacity:.8}
.price .btn{width:100%}
.faq{background:var(--surface-low);border-radius:var(--r-2xl);padding:6px 22px;margin-top:20px}
.faq details{border-bottom:1px solid var(--outline-variant);padding:4px 0}.faq details:last-child{border-bottom:0}
.faq summary{font-weight:700;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;font-size:17px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";width:32px;height:32px;flex:none;border-radius:50%;background:var(--surface-high) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23464B57' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/16px no-repeat;transition:transform .4s var(--spring),border-radius .4s var(--spring)}
.faq details[open] summary::after{transform:rotate(45deg);border-radius:10px}
.faq details p{color:var(--on-surface-variant);margin:0 0 16px}
.final{padding:24px 0 72px}
.fbox{position:relative;overflow:hidden;background:var(--primary);color:var(--on-primary);border-radius:48px;padding:64px 24px;text-align:center}
.fbox h2{color:var(--on-primary);position:relative}
.fbox p{position:relative;opacity:.9;font-size:18px;margin:0 0 26px}
.fbox .btn{position:relative}
.fb1,.fb2{position:absolute;pointer-events:none}.fb1 use,.fb2 use{fill:currentColor}
.fb1{width:260px;height:260px;left:-80px;bottom:-110px;color:var(--pink)}
.fb2{width:180px;height:180px;right:-50px;top:-60px;color:color-mix(in srgb,var(--on-primary) 18%,transparent)}
.btn.light{background:var(--surface-lowest);color:var(--primary)}
@media (prefers-color-scheme:dark){.btn.light{background:var(--on-primary);color:var(--primary)}}
footer{padding:28px 0 40px}
footer .row{justify-content:space-between}
footer nav{display:flex;gap:6px;flex-wrap:wrap}
footer nav a{color:var(--on-surface-variant);text-decoration:none;padding:8px 12px;border-radius:var(--r-full);font-weight:600;font-size:14px}
footer nav a:hover{background:var(--surface-high)}
footer .copy{color:var(--on-surface-variant);font-size:13px;width:100%}
.mcta{display:none}
@media (max-width:640px){
  .mcta{display:flex;position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:9;transition:transform .45s var(--spring),opacity .3s}
  .mcta .btn{width:100%;box-shadow:var(--e3);border-radius:var(--r-lg)}
  .mcta.hide{transform:translateY(140%);opacity:0;pointer-events:none}
  footer{padding-bottom:110px}
}
