/* ============================================================
   DUALMED — hoja de estilos principal
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,500&family=IBM+Plex+Sans:wght@400;500;600;700&display=swap');

:root{
  --ink:        #1A1A17;
  --bone:       #F7F4EE;
  --bone-2:     #EFEAE0;
  --petrol:     #1E5375;
  --petrol-70:  #2C6E8F;
  --clinic:     #317195;
  --clinic-10:  #E8F1F5;
  --coral:      #8B2C2C;
  --coral-dark: #6E2222;
  --line:       #D9D2C3;

  --serif: 'Newsreader', Georgia, serif;
  --sans:  'IBM Plex Sans', -apple-system, Segoe UI, Roboto, sans-serif;

  --radius: 4px;
  --max: 1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--bone);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
.skip-link{position:absolute;left:-9999px;top:8px;background:#fff;padding:10px;z-index:100}.skip-link:focus{left:8px}
img{max-width:100%;display:block;}
a{color:inherit;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 28px;}

h1,h2,h3{
  font-family:var(--serif);
  font-weight:500;
  margin:0 0 .4em;
  color:var(--petrol);
  letter-spacing:-.01em;
}
h1{font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1.06;}
h2{font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.15;}
h3{font-size:1.05rem;font-weight:600;font-family:var(--sans);color:var(--ink);}
p{margin:0 0 1em;max-width:62ch;}

.eyebrow{
  font-size:.8rem;
  color:var(--clinic);
  font-weight:600;
  margin-bottom:.6em;
}

/* ---------- header / expediente tabs ---------- */
header.site{
  position:sticky;top:0;z-index:40;
  background:var(--bone);
  border-bottom:1px solid var(--line);
}
.nav-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 0;gap:24px;
}
.nav-actions{display:flex;gap:10px;align-items:center}
.logo{
  font-family:var(--serif);font-size:1.3rem;color:var(--petrol);
  text-decoration:none;font-weight:600;white-space:nowrap;
  display:inline-flex;align-items:center;
}
.logo span{color:var(--coral);}
.logo img{height:46px;width:auto;display:block;}

.tabs{
  display:flex;gap:2px;background:var(--bone-2);
  border:1px solid var(--line);border-radius:var(--radius);
  padding:3px;
}
.tabs a{
  padding:9px 18px;font-size:.88rem;font-weight:600;text-decoration:none;
  color:var(--petrol-70);border-radius:2px;
}
.tabs a.active{background:var(--petrol);color:var(--bone);}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:11px 20px;border-radius:var(--radius);
  font-weight:600;font-size:.9rem;text-decoration:none;
  border:1px solid transparent;white-space:nowrap;
}
.btn-primary{background:var(--coral);color:#fff;}
.btn-primary:hover{background:var(--coral-dark);}
.btn-ghost{border-color:var(--petrol);color:var(--petrol);}
.btn-ghost:hover{background:var(--petrol);color:var(--bone);}

/* ---------- hero ---------- */
.hero{padding:64px 0 40px;border-bottom:1px solid var(--line);}
.hero-pro{padding:78px 0 62px;background:radial-gradient(circle at 85% 15%,#dcecf2 0,transparent 35%),var(--bone)}
.hero-grid{
  display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;
}
.hero-copy p.lead{font-size:1.12rem;color:var(--petrol-70);}
.hero-cta{display:flex;gap:14px;margin-top:22px;flex-wrap:wrap;}
.trust-row{display:flex;gap:18px;flex-wrap:wrap;margin-top:26px;color:var(--petrol);font-size:.82rem;font-weight:600}
.product-window{background:#fff;border:1px solid var(--line);box-shadow:0 24px 60px rgba(21,61,80,.15);border-radius:12px;overflow:hidden;transform:rotate(1deg)}
.window-top{display:flex;align-items:center;gap:6px;padding:13px 16px;background:var(--petrol);color:#fff}.window-top span{width:8px;height:8px;border-radius:50%;background:#e6b066}.window-top span:nth-child(2){background:#df776d}.window-top span:nth-child(3){background:#72b694}.window-top b{margin-left:10px;font-size:.75rem}
.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:20px}.metric-row div{background:var(--clinic-10);padding:13px;border-radius:6px}.metric-row small{display:block;color:#667b84}.metric-row strong{font-family:var(--serif);font-size:1.5rem;color:var(--petrol)}
.timeline{padding:0 20px 16px}.timeline p{display:grid;grid-template-columns:10px 45px 1fr auto;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding:10px 0;margin:0;font-size:.8rem}.timeline i{width:7px;height:7px;border-radius:50%;background:var(--clinic)}.timeline em{font-style:normal;color:var(--clinic);font-size:.68rem;background:var(--clinic-10);padding:3px 6px}.security-note{background:#eef5f1;border-top:1px solid #c8ddd2;padding:12px 20px;color:#2e684c;font-size:.72rem;font-weight:600}
.proof-strip{background:var(--petrol);color:#dbe9ef;padding:15px 0}.proof-strip .wrap{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.78rem;font-weight:600}

/* --- expediente card visual (signature element) --- */
.chart-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:0 1px 0 var(--line);overflow:hidden;
}
.chart-head{
  background:var(--petrol);color:var(--bone);
  padding:14px 18px;display:flex;justify-content:space-between;align-items:center;
  font-size:.78rem;letter-spacing:.02em;
}
.chart-head .dot{width:7px;height:7px;border-radius:50%;background:var(--coral);display:inline-block;margin-right:8px;}
.chart-body{padding:20px 18px;}
.chart-field{
  display:flex;justify-content:space-between;gap:12px;
  padding:10px 0;border-bottom:1px dashed var(--line);font-size:.86rem;
}
.chart-field:last-child{border-bottom:none;}
.chart-field .k{color:#6b6a63;}
.chart-field .v{font-weight:600;color:var(--petrol);}
.chart-tick{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--clinic-10);color:var(--clinic);
  font-size:.72rem;font-weight:600;padding:3px 8px;border-radius:2px;
}

/* ---------- feature list (form-field style, not cards) ---------- */
.section{padding:56px 0;border-bottom:1px solid var(--line);}
.section-head{max-width:640px;margin-bottom:34px;}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:#fff}.feature-grid article{padding:24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:210px}.feature-grid article:nth-child(4n){border-right:0}.feature-grid article span{font-family:var(--serif);color:var(--coral);font-size:1rem}.feature-grid article p{font-size:.84rem;color:#5e625f}
.compare-section{background:#eaf1f4}.compare-table{background:#fff;border:1px solid #c7d8df}.compare-table>div{display:grid;grid-template-columns:1fr .45fr 1.5fr;gap:18px;padding:14px 18px;border-bottom:1px solid #dce6ea;align-items:center;font-size:.86rem}.compare-table>div:last-child{border-bottom:0}.compare-head{background:var(--petrol);color:#fff}.compare-table strong{color:#246a52}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.check-list{list-style:none;padding:0;margin:0}.check-list li{padding:13px 0 13px 30px;border-bottom:1px solid var(--line);position:relative}.check-list li:before{content:'✓';position:absolute;left:0;color:#287454;font-weight:700}.text-link{color:var(--petrol);font-weight:700;text-decoration:none}.faq{border-top:1px solid var(--line)}.faq details{border-bottom:1px solid var(--line);padding:16px 0}.faq summary{font-weight:700;color:var(--petrol);cursor:pointer}.faq details p{margin:12px 0 0;color:#5e625f}.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}.legal-page{max-width:900px}.legal-page h2{margin-top:30px}.legal-page p{max-width:78ch}

.field-list{
  display:grid;grid-template-columns:1fr 1fr;gap:0 48px;
  border-top:1px solid var(--line);
}
.field-list .item{
  display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);
}
.field-list .box{
  flex:0 0 18px;height:18px;margin-top:2px;
  border:1.5px solid var(--clinic);border-radius:3px;position:relative;
}
.field-list .box::after{
  content:"";position:absolute;left:3px;top:0px;width:5px;height:9px;
  border-right:2px solid var(--clinic);border-bottom:2px solid var(--clinic);
  transform:rotate(40deg);
}
.field-list .txt{font-size:.94rem;}
.field-list .txt b{display:block;color:var(--petrol);font-weight:600;font-size:.96rem;margin-bottom:1px;}
.field-list .txt small{color:#6b6a63;}

@media (max-width:760px){.field-list{grid-template-columns:1fr;}}

/* ---------- compliance / trio ---------- */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;}
.trio .num{
  font-family:var(--serif);font-size:1rem;color:var(--coral);margin-bottom:10px;
}
@media (max-width:820px){.trio{grid-template-columns:1fr;}}

/* ---------- pricing ---------- */
.plan-toggle{
  display:inline-flex;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;margin-bottom:30px;
}
.plan-toggle button{
  border:none;background:#fff;padding:10px 18px;font-family:var(--sans);
  font-weight:600;font-size:.86rem;cursor:pointer;color:var(--petrol-70);
}
.plan-toggle button.active{background:var(--petrol);color:var(--bone);}

.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.plan{
  padding:26px 22px;border-left:1px solid var(--line);background:#fff;
  display:flex;flex-direction:column;
}
.plan:first-child{border-left:none;}
.plan.featured{background:var(--petrol);color:var(--bone);}
.plan.featured h3, .plan.featured .price{color:var(--bone);}
.plan.featured .plan-note{color:#c8d6d3;}
.plan .badge{
  align-self:flex-start;font-size:.68rem;font-weight:700;letter-spacing:.02em;
  background:var(--coral);color:#fff;padding:2px 8px;border-radius:2px;margin-bottom:10px;
}
.plan h3{margin-bottom:4px;}
.plan .plan-note{font-size:.78rem;color:#6b6a63;margin-bottom:16px;}
.plan .price{font-family:var(--serif);font-size:1.9rem;color:var(--petrol);margin-bottom:2px;}
.plan .price small{font-size:.85rem;font-weight:400;}
.plan .period{font-size:.76rem;color:#6b6a63;margin-bottom:18px;}
.plan ul{list-style:none;margin:0 0 20px;padding:0;font-size:.84rem;flex:1;}
.plan li{padding:6px 0;border-top:1px solid var(--line);}
.plan.featured li{border-top:1px solid #2a5450;}
.plan a.btn{justify-content:center;}

@media (max-width:900px){.plans{grid-template-columns:1fr 1fr;}.plan{border-left:none;border-top:1px solid var(--line);}.plan:first-child{border-top:none;}}
@media (max-width:560px){.plans{grid-template-columns:1fr;}}

/* ---------- modality note ---------- */
.modality-note{
  background:var(--clinic-10);border:1px solid var(--clinic);border-radius:var(--radius);
  padding:14px 18px;font-size:.86rem;color:var(--petrol-70);margin-bottom:26px;
}

/* ---------- CTA band ---------- */
.cta-band{
  background:var(--petrol);color:var(--bone);padding:56px 0;text-align:left;
}
.cta-band h2{color:var(--bone);}
.cta-band p{color:#c8d6d3;}
.cta-band .btn-primary{background:var(--coral);}

/* ---------- footer ---------- */
footer.site{padding:40px 0;font-size:.84rem;color:#6b6a63;}
footer.site .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;}
footer.site a{text-decoration:none;color:var(--petrol-70);}

.foot-links{display:flex;gap:18px;}

@media (max-width:820px){
  .hero-grid{grid-template-columns:1fr;}
  .nav-row{flex-wrap:wrap;}
  .tabs{order:3;width:100%;overflow-x:auto}.tabs a{padding:8px 12px}.nav-actions{margin-left:auto}.feature-grid{grid-template-columns:1fr 1fr}.feature-grid article:nth-child(odd){border-right:1px solid var(--line)}.feature-grid article:nth-child(even){border-right:0}.split{grid-template-columns:1fr;gap:30px}.compare-table>div{grid-template-columns:1fr}.compare-head{display:none!important}
}
@media(max-width:520px){.wrap{padding:0 18px}.nav-actions .btn-primary{display:none}.feature-grid{grid-template-columns:1fr}.feature-grid article{border-right:0!important;min-height:auto}.metric-row{grid-template-columns:1fr}.timeline p{grid-template-columns:10px 42px 1fr}.timeline em{display:none}}
