/* Tema claro para INTERFIBRA */
:root{--bg:#f6f9ff;--surface:#ffffff;--ink:#1f2d3d;--muted:#5b6b85;--brand:#0ea5e9;--brand-2:#22c55e;--ring:rgba(14,165,233,.25);--border:#e6ebf5}
*{box-sizing:border-box}
html,body{padding:0;margin:0}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,Helvetica,sans-serif;line-height:1.6;color:var(--ink);background:var(--bg)}
img{max-width:100%;display:block}

.container{max-width:1100px;margin:0 auto;padding:0 20px}

/* Header & Nav */
.header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.9);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px}
.brand img{height:44px;width:auto}

.menu{list-style:none;display:flex;gap:20px;align-items:center;margin:0;padding:0}
.menu a{color:var(--ink);text-decoration:none;font-weight:600;transition:.2s ease}
.menu a:hover{color:#000}
.menu .cta{background:var(--brand);color:#fff;padding:10px 14px;border-radius:10px;box-shadow:0 6px 20px rgba(14,165,233,.25)}

#nav-toggle{display:none}
.burger{display:none;cursor:pointer;padding:8px;border-radius:10px;border:1px solid var(--border)}
.burger span{display:block;width:22px;height:2px;background:var(--ink);margin:5px 2px;transition:.2s}

/* Hero */
.hero{padding:90px 0;background:linear-gradient(135deg,#e6f7ff 0%,#f6f9ff 60%);position:relative}
.hero:after{content:"";position:absolute;right:-120px;top:-80px;width:420px;height:420px;background:radial-gradient(closest-side,rgba(14,165,233,.25),transparent);filter:blur(10px);border-radius:50%}
.hero h1{font-size:44px;line-height:1.1;margin:0 0 12px;color:#0b1b2b}
.hero p{color:var(--muted);margin:0 0 22px;max-width:680px}
.actions{display:flex;gap:12px;flex-wrap:wrap}

/* Buttons */
.btn{display:inline-block;font-weight:700;text-decoration:none;border-radius:12px;padding:12px 16px;border:1px solid var(--border);color:var(--ink);background:#fff;transition:.2s ease}
.btn:hover{box-shadow:0 6px 16px rgba(2,6,23,.08);transform:translateY(-1px)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.outline{background:transparent}
.btn.block{display:block;text-align:center;width:100%}

/* Sections */
.section{padding:68px 0}
.section.alt{background:linear-gradient(180deg,#f0f5ff,rgba(255,255,255,0))}
.section h2{font-size:30px;margin:0 0 10px;color:#0b1b2b}
.sub{color:var(--muted);margin:0 0 18px}

/* Grid */
.grid{display:grid;gap:20px}
.cards{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.cards-alt{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.features{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}

/* Cards */
.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:0 6px 20px rgba(2,6,23,.04)}
.card h3{margin:0 0 6px}
.card .price{font-weight:800;font-size:26px;margin:8px 0 14px;color:#0b1b2b}
.card .price span{font-weight:600;color:var(--muted);font-size:16px}
.card ul{margin:0 0 18px 18px;line-height:1.8;color:#3b4a63}

/* Chips (filtros) */
.filters{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 20px}
.chip{appearance:none;border:1px solid var(--border);background:#fff;color:var(--ink);padding:8px 12px;border-radius:999px;cursor:pointer;font-weight:600}
.chip.active{background:var(--brand);border-color:var(--brand);color:#fff}

/* Features */
.feature h3{margin:0 0 6px}
.feature p{margin:0;color:var(--muted)}

/* FAQ */
.faq details{background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px 14px;box-shadow:0 6px 14px rgba(2,6,23,.03)}
.faq details+details{margin-top:10px}
.faq summary{cursor:pointer;font-weight:700}
.faq p{color:var(--muted);margin:8px 0 0}

/* Contact */
.contact .contact-actions{display:flex;gap:12px;flex-wrap:wrap}
.small{color:#6b7e9a}
.note{display:block;color:#6b7e9a;margin-top:10px}

/* Footer */
.footer{border-top:1px solid var(--border);padding:28px 0;color:#6b7e9a;background:#fff}
.footer .legal{font-size:12px;margin:6px 0 0}

/* Responsive Nav */
@media (max-width: 860px){
  .burger{display:block}
  .menu{position:fixed;inset:68px 16px auto 16px;background:#fff;border:1px solid var(--border);border-radius:14px;padding:14px;display:none;flex-direction:column;gap:8px;box-shadow:0 10px 30px rgba(2,6,23,.08)}
  #nav-toggle:checked ~ .menu{display:flex}
  .menu .cta{display:block;text-align:center}
}
