/* Cuenta Clara identity. Shared, portable, no external resources. */
.cc{--blue:#21645b;--navy:#143e3b;--ink:#203b37;--muted:#62726b;--paper:#f8f7f2;--line:#dce3d9;--green:#21645b}
.cc .topline{background:#143e3b;color:#e6eedf;letter-spacing:.09em;font-size:10px;padding:9px 18px}
.cc header .header-inner{display:grid;grid-template-columns:auto 1fr auto;gap:36px;min-height:100px;align-items:center}
.cc .brand{display:inline-flex;gap:12px;flex-shrink:0;letter-spacing:0;line-height:1;text-decoration:none}
.cc .brand-symbol{display:block;width:44px;height:44px;flex-shrink:0}
.cc .brand-name{display:block;font-size:25px;font-weight:750;letter-spacing:-1px;color:#143e3b;white-space:nowrap}
.cc .brand-name em{font-weight:450;color:#21645b}
.cc .brand-name small{display:block;font-size:10px;letter-spacing:.07em;font-weight:500;margin-top:8px;color:#62726b}
.cc header nav{justify-self:center;gap:26px;flex-wrap:wrap;min-width:0}
.cc header nav a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap;padding:6px 0}
.cc .badge{border-radius:30px;border-color:#dce3d9;color:#526b5d;background:#f6f8f0}
.cc .hero{padding:64px 0 38px;gap:52px}.cc .hero h1{letter-spacing:-2px;line-height:1.12}.cc .hero-note{background:#edf1e5;border:0;border-radius:18px;padding:30px;position:relative}.cc .hero-note strong{font-size:22px;line-height:1.4;letter-spacing:-.5px}.cc .hero-note p{margin-top:15px;line-height:1.7}
.cc .card{border-radius:16px;border-color:#dce3d9;box-shadow:0 3px 12px #203b3704}.cc .icon{background:#edf1e5;color:#21645b}.cc .card.featured{background:#143e3b;border-color:#143e3b}.cc .featured .icon{background:#315b4f;color:#daebbc}.cc .featured .card-action{color:#d1e7ad}.cc .featured p,.cc .featured .tag{color:#d0ddd3}.cc .card:hover{border-color:#9dbba0;box-shadow:0 8px 24px #143e3b0b}
.cc .panel,.cc .article,.cc .result{border-radius:16px}.cc .result-head{background:#143e3b}.cc .btn{background:#21645b}.cc .btn:hover{background:#143e3b}
.cc .ad{background:#f0f0e9;border:1px solid #e0e2d8;border-radius:12px;min-height:120px;color:#7a8076;margin:34px 0;padding:20px;gap:8px}.cc .ad strong{font-size:9px;letter-spacing:.18em;color:#858b80}.cc .ad span{font-size:13px}.cc .ad small{font-size:10px}.cc .small-ad{min-height:250px;margin-top:26px}
.cc footer{background:#f0f2e9}.cc .footer-top{align-items:flex-start}.cc .footer-links{flex-wrap:wrap}.cc .footer-links a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:800px){.cc header .header-inner{grid-template-columns:1fr auto;gap:10px 20px;padding-top:18px;padding-bottom:10px}.cc header nav{grid-column:1/-1;grid-row:2;justify-self:start;gap:26px;border-top:1px solid #e6e9df;width:100%;padding-top:4px}.cc .hero{gap:25px}.cc .hero-note{padding:24px}}
@media(max-width:560px){.cc header .header-inner{min-height:0;gap:12px;padding-top:16px;padding-bottom:8px}.cc .brand-name{font-size:23px;letter-spacing:-.8px}.cc .brand-symbol{width:40px;height:40px}.cc .brand-name small{font-size:9px;margin-top:7px}.cc .brand{gap:10px}.cc header nav{font-size:13px;gap:24px;margin:0;justify-content:flex-start}.cc header .badge{display:none}.cc .topline{font-size:8px;letter-spacing:.045em}.cc .hero{padding:30px 0 18px}.cc .hero h1{font-size:35px;letter-spacing:-1.2px}.cc .hero-note{display:block;margin-top:8px;padding:21px}.cc .hero-note strong{font-size:18px}.cc .hero-note p{font-size:13px;margin-top:8px}.cc .ad{min-height:120px;margin:28px 0}.cc .small-ad{min-height:250px}.cc .card{border-radius:13px}.cc .footer-top{align-items:flex-start}.cc .footer-links{gap:3px 18px}.cc .footer-top .brand{margin-bottom:8px}}
@media print{.cc .ad{display:none!important}}
/* On phones the tools come before the first advertising space. */
@media(max-width:560px){.cc main:has(.hero){display:flex;flex-direction:column}.cc .hero{order:0}.cc .hero-note{display:none}.cc #calculadoras{order:1}.cc .hero+.ad{order:2}.cc #calculadoras+.ad{order:3}.cc .explain-grid{order:4}.cc .explain-grid+.ad{order:5}}
/* Editorial guides */
.cc .guide-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:20px 0 30px}.cc .guide-tile{display:block;text-decoration:none;background:white;border:1px solid var(--line);border-radius:14px;padding:25px}.cc .guide-tile h3{font-size:21px;line-height:1.35;margin:12px 0}.cc .guide-tile p{font-size:14px;color:var(--muted)}.cc .guide-link{color:var(--blue);font-size:14px;font-weight:650}.cc .guide-article h1{max-width:760px}.cc .guide-intro{font-size:18px!important}.cc .guide-toc{display:block;background:#f2f4eb;padding:20px;border-radius:12px;margin:24px 0;font-weight:400}.cc .guide-toc ol{margin-bottom:0;padding-left:24px}.cc .guide-toc a{display:inline-block;padding:5px 0}.cc .guide-article section{scroll-margin-top:20px}.cc .guide-cta{background:#eef2e6;padding:22px;border-radius:12px;margin:30px 0}.cc .guide-cta h2{margin-top:0}.cc .guide-cta .btn{color:white;text-decoration:none;display:inline-block}.cc .table-scroll{overflow-x:auto;max-width:100%}.cc table{border-collapse:collapse;width:100%;font-size:14px}.cc th,.cc td{text-align:left;padding:12px;border-bottom:1px solid var(--line)}.cc caption{text-align:left;color:var(--muted);padding:12px 0}.cc .home-guides{margin-top:40px;order:6}.cc .home-guides .section-head{flex-wrap:wrap}.cc .guide-article a{overflow-wrap:anywhere}.cc .guide-article .formula{background:#f1f4e9}
@media(max-width:560px){.cc .guide-list{grid-template-columns:1fr}.cc .guide-tile{padding:20px}.cc .guide-article h1{font-size:30px}.cc .guide-toc{padding:16px}.cc header nav{gap:17px;font-size:12px}.cc .guide-article th,.cc .guide-article td{padding:9px;font-size:13px}}
