/* INKAVANTA — página de Dominios y Hosting (complementa ../assets/css/estilos.css) */

.logo{flex:0 0 auto}
.logo img{height:30px;width:auto;max-width:220px}
.logo-tag{margin-left:4px;padding:4px 10px;border-radius:999px;border:1px solid var(--line-d);font:500 12px var(--mono);letter-spacing:.06em;color:var(--accent);white-space:nowrap}
.top .menu{gap:22px}
.top .menu a{white-space:nowrap}
.m-inicio{display:inline-flex;align-items:center;gap:4px;padding-left:20px;border-left:1px solid var(--line-d)}
.top .wrap>.btn{flex:0 0 auto;white-space:nowrap}
@media (max-width:1180px) and (min-width:981px){.logo-tag{display:none}}

/* Menú desplegable antes que en la web principal (el logo real es más ancho) */
@media (max-width:1100px){
  .menu-btn{display:inline-flex}
  .top .wrap>.btn{display:none}
  .top .menu{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--ink);border-bottom:1px solid #2E2926;padding:8px 24px 20px;display:none}
  .top .menu.abierto{display:flex}
  .top .menu a{padding:14px 0;border-bottom:1px solid #2E2926;font-size:16px}
  .top .menu .btn{display:inline-flex;margin-top:14px;border-bottom:0}
  .m-inicio{padding-left:0;border-left:0}
}
@media (min-width:1101px){.top .menu .btn{display:none}}
@media (max-width:420px){.logo-tag{display:none}}

/* ---------- Hero con buscador ---------- */
.dh-hero{position:relative;overflow:hidden;color:var(--paper);padding:110px 0 120px;background-color:var(--ink);
  background-image:radial-gradient(ellipse 70% 60% at 50% 0%,rgba(233,162,59,.16),transparent 70%),radial-gradient(#3A3330 1px,transparent 1px);
  background-size:auto,28px 28px}
.dh-hero-in{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:26px}
.dh-hero h1{font-size:clamp(38px,5.6vw,72px);line-height:1.03;letter-spacing:-.03em;max-width:900px}
.dh-sub{font-size:19px;color:var(--on-dark);max-width:640px}
.dh-ring{position:absolute;left:50%;top:-340px;width:900px;height:900px;margin-left:-450px;border-radius:50%;border:1px dashed #3A3330;pointer-events:none}
.dh-chip{position:absolute;font:700 clamp(18px,2vw,26px) var(--display);color:var(--paper);border:1px solid var(--ink3);background:rgba(38,34,31,.75);border-radius:16px;padding:12px 18px;pointer-events:none;backdrop-filter:blur(4px)}
.dh-chip.c1{left:7%;top:24%;color:var(--accent);border-color:rgba(233,162,59,.45)}
.dh-chip.c2{right:8%;top:20%}
.dh-chip.c3{left:10%;bottom:16%}
.dh-chip.c4{right:11%;bottom:22%;color:var(--labs);border-color:rgba(92,200,184,.4)}
@media (max-width:1100px){.dh-chip{display:none}}

.search-xl{width:100%;max-width:820px;display:flex;flex-direction:column;gap:14px;text-align:left}
.search-xl .dsearch{position:relative;background:#FFFFFF;border:2px solid #FFFFFF;border-radius:20px;padding:8px;box-shadow:0 30px 70px rgba(0,0,0,.5),0 0 0 6px rgba(233,162,59,.14);flex-wrap:nowrap;align-items:center}
.search-xl .dsearch:focus-within{border-color:var(--accent);box-shadow:0 30px 70px rgba(0,0,0,.5),0 0 0 6px rgba(233,162,59,.3)}
.search-xl .www{padding-left:18px;font:500 clamp(18px,2.2vw,26px) var(--mono);color:#8A817A}
.search-xl .dsearch input{border:0;background:transparent;font:600 clamp(24px,3vw,34px)/1.2 var(--display);letter-spacing:-.01em;color:var(--ink);padding:16px 10px 16px 4px;min-width:0}
.search-xl .dsearch input::placeholder{color:#A39A92;font-weight:500}
.search-xl .dsearch input:focus{outline:none}
.search-xl .dsearch button{border-radius:14px;min-height:64px;padding:0 30px;font-size:18px;flex:0 0 auto}
.search-xl .exts{justify-content:center}
.search-xl .exts span{background:rgba(38,34,31,.6)}
.search-xl .dres .drow{padding:14px 16px}
.search-xl .dres .drow b{font-size:20px}
.search-xl .dres .dmsg{text-align:center}
@media (max-width:560px){
  .search-xl .www{display:none}
  .search-xl .dsearch input{font-size:22px;padding-left:12px}
  .search-xl .dsearch button{padding:0 16px}
  .search-xl .dsearch button svg{display:none}
}
.dh-trust{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;font-size:14px;color:var(--on-dark)}
.dh-trust li{display:flex;align-items:center;gap:8px}
.dh-trust svg{color:var(--accent)}

/* ---------- Razones + comparación ---------- */
.razones{margin-bottom:56px}
.compare{display:flex;flex-wrap:wrap;align-items:stretch;gap:18px}
.cmp-col{flex:1 1 380px;min-width:0;border-radius:22px;padding:28px;display:flex;flex-direction:column;gap:4px}
.cmp-sin{background:#fff;border:1px dashed #CFC6BD}
.cmp-con{background:var(--ink);color:var(--paper);box-shadow:0 26px 60px rgba(27,24,25,.2)}
.cmp-tag{align-self:flex-start;font:500 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:6px 12px;border-radius:999px;margin-bottom:12px}
.cmp-sin .cmp-tag{background:#F6D9D4;color:#8A2414}
.cmp-con .cmp-tag{background:var(--accent);color:var(--ink)}
.cmp-row{display:grid;grid-template-columns:80px 1fr;gap:12px;align-items:baseline;padding:12px 0;border-bottom:1px solid #EEE8E0}
.cmp-con .cmp-row{border-color:#36302C}
.cmp-row:last-child{border-bottom:0}
.cmp-row small{font-size:13px;color:var(--muted2)}
.cmp-con .cmp-row small{color:var(--on-dark2)}
.cmp-row b{font:500 16px var(--mono);overflow-wrap:anywhere}
.cmp-sin .cmp-row b{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(138,36,20,.45)}
.cmp-con .cmp-row b{color:var(--paper)}
.cmp-row:nth-child(n+4) b{font-family:var(--body)}
.cmp-sin .cmp-row:nth-child(n+4) b{text-decoration:none}
.cmp-vs{align-self:center;width:52px;height:52px;border-radius:50%;background:var(--accent);color:var(--ink);display:flex;align-items:center;justify-content:center;font:700 16px var(--display);margin:-8px auto}
@media (min-width:860px){.cmp-vs{margin:0 -34px;z-index:1;flex:0 0 52px}}

/* ---------- Extensiones ---------- */
.exts-grid{--min:280px;margin-bottom:48px}
.ext-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:10px}
.ext-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.ext-name{font:700 38px/1 var(--display);letter-spacing:-.02em}
.ext-badge{background:var(--ink);color:var(--accent);font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:5px 10px;white-space:nowrap}
.ext-card small{font:500 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink)}
.ext-card p{color:var(--muted);font-size:15px;flex:1}
.ext-link{font-weight:600;font-size:15px;color:var(--ink);align-self:flex-start;border-bottom:2px solid var(--accent);padding-bottom:2px;min-height:28px}
.ext-dest{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.ext-dest .ext-name{color:var(--accent)}
.ext-dest .ext-badge{background:var(--accent);color:var(--ink)}
.ext-dest small{color:var(--accent)}
.ext-dest p{color:var(--on-dark)}
.ext-dest .ext-link{color:var(--paper)}
.ext-tip{background:#FBF3E6;border-color:#EBD7B5}
.ext-tip h3{font-size:20px}
.ext-tip p{color:var(--muted)}
.ext-tip .ico{background:var(--accent);color:var(--ink)}

.tips{background:#fff;border:1px solid var(--line);border-radius:22px;padding:32px;display:flex;flex-wrap:wrap;gap:20px 48px}
.tips h3{flex:1 1 240px;font-size:24px}
.tips ol{flex:3 1 560px;min-width:0;margin:0;padding:0;list-style:none;counter-reset:t;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px 32px}
.tips li{counter-increment:t;position:relative;padding-left:40px;color:var(--muted);font-size:15px}
.tips li::before{content:counter(t);position:absolute;left:0;top:-2px;width:28px;height:28px;border-radius:8px;background:var(--ink);color:var(--accent);font:600 14px var(--display);display:flex;align-items:center;justify-content:center}
.tips li b{color:var(--ink)}

/* ---------- Gestión incluida ---------- */
.gestion{margin-top:56px;background:var(--ink);color:var(--paper);border-radius:22px;padding:32px;display:flex;flex-wrap:wrap;gap:20px 48px;align-items:flex-start}
.gestion h3{flex:1 1 220px;font-size:24px}
.gestion ul{flex:3 1 560px;min-width:0;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:14px 28px}
.gestion li{display:flex;gap:12px;align-items:center;font-size:15px;color:var(--on-dark)}
.gestion li svg{color:var(--accent);flex:0 0 20px}
.gestion li b{color:var(--paper);font-weight:600}

/* ---------- Correo ---------- */
.mail-wrap{display:flex;flex-wrap:wrap;gap:56px;align-items:center}
.mail-txt{flex:1 1 440px;min-width:0;display:flex;flex-direction:column;gap:20px}
.mail-txt .checks{color:var(--on-dark)}
.mail-txt .checks svg{color:var(--accent)}
.mail-txt .btn{align-self:flex-start}
.inbox{flex:1 1 420px;min-width:0;position:relative;background:var(--paper);color:var(--ink);border-radius:22px;padding:10px;box-shadow:0 30px 70px rgba(0,0,0,.45);margin-bottom:64px}
.inbox-bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;align-items:center;padding:14px 16px 12px}
.inbox-bar b{font:600 16px var(--display)}
.inbox-bar span{font:500 13px var(--mono);color:var(--accent-ink);background:#FBF3E6;border-radius:999px;padding:5px 12px}
.inbox-row{display:flex;gap:12px;align-items:center;background:#fff;border-radius:14px;padding:14px;margin-top:8px}
.inbox-row.nuevo{box-shadow:inset 3px 0 0 var(--accent)}
.av{width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font:600 15px var(--display)}
.ib{flex:1;min-width:0;display:flex;flex-direction:column}
.ib b{font-size:14px}
.ib em{font-style:normal;font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inbox-row time{font-size:12px;color:var(--muted2)}
.inbox-sign{position:absolute;right:-14px;bottom:-64px;background:var(--ink);color:var(--paper);border:1px solid var(--ink3);border-radius:16px;padding:14px 18px;display:flex;flex-direction:column;gap:2px;box-shadow:0 18px 40px rgba(0,0,0,.4)}
.inbox-sign small{font:500 11px var(--mono);color:var(--accent);text-transform:uppercase;letter-spacing:.1em}
.inbox-sign b{font-size:14px}
.inbox-sign span{font:500 12px var(--mono);color:var(--on-dark2)}
@media (max-width:600px){.inbox-sign{right:8px}}

/* ---------- Hosting ---------- */
.host-grid{--min:300px;margin-bottom:24px}
.host-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px;display:flex;flex-direction:column;gap:14px}
.host-card h3{font-size:22px}
.host-card p{color:var(--muted);font-size:15px}
.host-card ul{list-style:none;margin:0 0 6px;padding:0;display:flex;flex-direction:column;gap:9px;font-size:15px;flex:1}
.host-card li{display:flex;gap:10px;align-items:center}
.host-card li svg{color:var(--accent-ink);flex:0 0 16px}
.host-card .btn{align-self:flex-start}
.host-feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.host-feats div{background:var(--paper);padding:22px;display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center}
.host-feats svg{grid-row:span 2;color:var(--accent-ink)}
.host-feats b{font:600 16px var(--display)}
.host-feats span{font-size:14px;color:var(--muted)}

/* ---------- Confianza ---------- */
.trust{display:flex;flex-wrap:wrap;gap:24px 56px;align-items:flex-start}
.trust>div:first-child{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:16px}
.trust-txt{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:16px;font-size:17px;color:var(--muted)}
.trust-txt strong{color:var(--ink)}
.trust-txt .btn{align-self:flex-start;margin-top:6px}

/* ---------- Preguntas ---------- */
.faq-wrap{display:flex;flex-wrap:wrap;gap:40px 64px;align-items:flex-start}
.faq-wrap>div:first-child{flex:1 1 320px;min-width:0}
.faq{flex:2 1 560px;min-width:0;display:flex;flex-direction:column;gap:10px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:16px;padding:0 22px;transition:border-color .2s}
.faq details[open]{border-color:var(--ink)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font:600 17px var(--display);min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary span{flex:0 0 30px;height:30px;border-radius:50%;background:var(--paper);display:flex;align-items:center;justify-content:center;font:500 20px var(--body);transition:transform .25s,background .25s}
.faq details[open] summary span{transform:rotate(45deg);background:var(--accent)}
.faq details p{margin:0;padding:0 0 22px;color:var(--muted);font-size:16px;max-width:720px}

/* ---------- CTA final ---------- */
.final{display:flex;flex-wrap:wrap;gap:40px 64px;align-items:center}
.final>div:first-child{flex:1.4 1 460px;min-width:0;display:flex;flex-direction:column;gap:18px}
.final-btns{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:12px}
.final-btns>.btn{min-height:56px;font-size:16px}