/* ============ GUÍAS SEO · Suiza Conecta ============
   Mismo sistema visual que la home: negro / nieve / rojo suizo, Poppins + Geist Mono. */
:root{
  --black:#000; --coal:#131309; --coal-2:#1F1F1F;
  --snow:#fff; --paper:#F4F4EF;
  --red:#E2001A; --red-dark:#B00014;
  --gold:#F5B301;
  --ease:cubic-bezier(0.32,0.72,0,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; overflow-x:clip; -webkit-text-size-adjust:100%}
body{margin:0; background:var(--paper); color:var(--coal); font-family:"Poppins",system-ui,sans-serif; font-size:16.5px; line-height:1.65; overflow-x:hidden; -webkit-font-smoothing:antialiased}
::selection{background:var(--red); color:#fff}
a{color:inherit}
h1,h2,h3{font-weight:700; line-height:1.08; letter-spacing:-.015em; margin:0}
.mono{font-family:"Geist Mono",monospace; font-variant-numeric:tabular-nums}
:focus-visible{outline:3px solid var(--red); outline-offset:2px}
.gwrap{width:min(820px, calc(100vw - 40px)); margin-inline:auto}

/* cabecera */
.gnav{position:sticky; top:12px; z-index:50; width:min(1180px, calc(100vw - 24px)); margin:12px auto 0;
  display:flex; align-items:center; gap:14px; background:rgba(10,10,8,.85); color:#fff;
  backdrop-filter:blur(16px) saturate(1.3); -webkit-backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(255,255,255,.16); border-radius:999px; padding:8px 10px 8px 16px; box-shadow:0 14px 34px rgba(0,0,0,.25)}
.gbrand{display:flex; align-items:center; gap:10px; text-decoration:none; font-weight:700; font-size:15px; white-space:nowrap}
.gbrand .cross{width:30px; height:30px; border-radius:8px; background:var(--red); display:grid; place-items:center; flex:none}
.gnav .sp{flex:1}
.gnav a.gback{font-size:13.5px; font-weight:600; text-decoration:none; opacity:.85}
.gnav a.gback:hover{opacity:1}
.gbtn{display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid transparent; border-radius:999px;
  padding:9px 18px; font-weight:600; font-size:14px; text-decoration:none; transition:transform .3s var(--ease), background .3s var(--ease)}
.gbtn:hover{transform:translateY(-1px)}
.gbtn-red{background:var(--red); color:#fff}
.gbtn-red:hover{background:var(--red-dark)}
.gbtn-line{background:transparent; color:var(--coal); border-color:rgba(19,19,9,.3)}
.gbtn-line:hover{border-color:var(--coal)}
.gbtn-snow{background:#fff; color:#000}
.gbtn-ghostd{background:transparent; color:#fff; border-color:rgba(255,255,255,.4)}

/* héroe de la guía */
.ghero{padding:52px 0 8px}
.gkick{display:inline-flex; align-items:center; gap:8px; font-family:"Geist Mono",monospace; font-size:12px; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--red)}
.gkick::before{content:""; width:26px; height:2px; background:var(--red)}
.ghero h1{font-size:clamp(34px, 6.2vw, 54px); margin:14px 0 12px}
.glede{font-size:18.5px; color:#3d3d34; max-width:64ch}
.gmeta{display:flex; flex-wrap:wrap; gap:8px 20px; margin-top:18px; font-family:"Geist Mono",monospace; font-size:12.5px; color:#6a6a5e}
.gmeta b{color:var(--coal)}

/* respuesta rápida */
.quick{margin:30px 0 6px; background:#fff; border:1px solid rgba(19,19,9,.12); border-left:6px solid var(--red);
  border-radius:14px; padding:22px 24px; box-shadow:0 10px 30px rgba(19,19,9,.07)}
.quick .qtag{font-family:"Geist Mono",monospace; font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--red)}
.quick p{margin:8px 0 0; font-size:17px}
.quick p b{color:#000}

/* cuerpo */
.gbody{padding:14px 0 0}
.gbody h2{font-size:clamp(24px, 3.6vw, 30px); margin:38px 0 12px}
.gbody p{margin:0 0 14px; color:#2b2b24}
.gbody ul{margin:0 0 16px; padding-left:20px; color:#2b2b24}
.gbody li{margin-bottom:8px}
.gbody a{color:var(--red-dark); font-weight:600}
.steps{list-style:none; counter-reset:st; margin:6px 0 18px; padding:0}
.steps li{counter-increment:st; position:relative; background:#fff; border:1px solid rgba(19,19,9,.12); border-radius:14px;
  padding:16px 18px 16px 64px; margin-bottom:10px}
.steps li::before{content:counter(st, decimal-leading-zero); position:absolute; left:16px; top:14px;
  font-family:"Geist Mono",monospace; font-weight:700; font-size:15px; color:#fff; background:var(--red);
  width:34px; height:34px; border-radius:10px; display:grid; place-items:center}
.steps li b{display:block; margin-bottom:2px}
.gtable{width:100%; border-collapse:collapse; background:#fff; border:1px solid rgba(19,19,9,.12); border-radius:14px; overflow:hidden; margin:6px 0 10px; font-size:15.5px}
.gtable th{background:var(--coal); color:#fff; text-align:left; padding:12px 16px; font-size:13px; letter-spacing:.06em; text-transform:uppercase}
.gtable td{padding:11px 16px; border-top:1px solid rgba(19,19,9,.08)}
.gtable td:last-child{font-family:"Geist Mono",monospace; font-weight:700; white-space:nowrap; text-align:right}
.gnote{font-size:13.5px; color:#6a6a5e; margin:0 0 18px}
.warn{background:#fff8e6; border:1px solid #ecd9a0; border-radius:14px; padding:18px 20px; margin:18px 0}
.warn b{color:#7a5b00}

/* FAQ */
.gfaq{margin-top:10px}
.gfaq details{background:#fff; border:1px solid rgba(19,19,9,.12); border-radius:14px; padding:4px 20px; margin-bottom:10px}
.gfaq summary{cursor:pointer; font-weight:600; padding:14px 0; list-style:none; display:flex; justify-content:space-between; gap:14px}
.gfaq summary::-webkit-details-marker{display:none}
.gfaq summary::after{content:"+"; font-family:"Geist Mono",monospace; color:var(--red); font-weight:700}
.gfaq details[open ] summary::after{content:"–"}
.gfaq details p{padding:0 0 16px; color:#2b2b24}

/* CTA monetización */
.gcta{margin:44px 0 8px; background:#000; color:#F5F5F0; border-radius:20px; padding:30px 28px; position:relative; overflow:hidden}
.gcta::after{content:""; position:absolute; right:-46px; top:-46px; width:170px; height:170px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #FFE066, var(--gold) 55%, #B57E00); opacity:.16}
.gcta h2{color:#fff; font-size:26px; margin-bottom:8px}
.gcta p{color:#C9C9BE; max-width:56ch}
.gcta .row{display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; position:relative; z-index:1}
.gcta .fine{margin-top:14px; font-size:12.5px; color:#8f8f84}

/* fuentes y relacionadas */
.gsrc{margin:34px 0 0; font-size:13.5px; color:#6a6a5e}
.gsrc a{color:var(--red-dark); font-weight:600}
.grel{padding:40px 0 54px}
.grel h2{font-size:22px; margin-bottom:16px}
.grel-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:12px}
.grel a{display:block; background:#fff; border:1px solid rgba(19,19,9,.12); border-radius:16px; padding:18px; text-decoration:none;
  transition:transform .3s var(--ease), border-color .3s var(--ease)}
.grel a:hover{transform:translateY(-3px); border-color:var(--red)}
.grel .rtag{font-family:"Geist Mono",monospace; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--red)}
.grel b{display:block; font-size:17px; line-height:1.25; margin:6px 0 4px}
.grel span{font-size:13.5px; color:#6a6a5e}
.gfoot{background:#000; color:#A8A89E; font-size:13.5px}
.gfoot .gwrap{padding-top:26px; padding-bottom:30px}
.gfoot a{color:#fff; font-weight:600; text-decoration:none}
.gfoot a:hover{text-decoration:underline}

@media (max-width:640px){
  body{font-size:16px}
  .ghero{padding-top:36px}
  .grel-grid{grid-template-columns:1fr}
  .gcta{padding:24px 20px}
  .quick{padding:18px}
  .steps li{padding-left:58px}
  .gnav a.gback{display:none}
}