/* Spanish Out Loud articles: same flat Costa del Sol system as styles.css */
.nav-links a[aria-current=page]{border-bottom-color:var(--ink)}

/* hero */
.art-hero{padding:clamp(28px,4.5vw,56px) 0 clamp(36px,4.5vw,56px);border-bottom:1px solid var(--line)}
.art-hero-inner{max-width:880px}
.art-hero h1{font:800 clamp(38px,5.4vw,68px)/.98 var(--display);letter-spacing:-.04em;text-wrap:balance;margin:0 0 26px}
.art-index-hero h1{font-size:clamp(48px,7vw,100px);line-height:.92;letter-spacing:-.045em;margin-bottom:22px}
.art-hero .kicker{margin-bottom:14px}
.crumbs{margin-bottom:26px;font-size:14.5px;color:var(--muted)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:6px 0}
.crumbs li:not(:last-child)::after{content:"/";margin:0 10px;color:#9AA3B5}
.crumbs a{text-decoration:none;font-weight:600;color:var(--ink)}
.crumbs a:hover{text-decoration:underline}
.crumbs [aria-current]{max-width:32ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.answer{background:var(--paper);border:1.5px solid var(--line);border-left:6px solid var(--sun);border-radius:18px;padding:20px 24px;max-width:46em}
.answer .tagline{color:var(--blue);font-size:12px;margin-bottom:10px}
.answer p:last-child{font-size:clamp(17px,1.4vw,19px);line-height:1.6}
.art-meta{display:flex;flex-wrap:wrap;gap:6px 0;margin-top:22px;font-size:14.5px;color:var(--muted)}
.art-meta span:not(:last-child)::after{content:"·";margin:0 10px;color:#9AA3B5}

/* layout */
.art-layout{display:grid;gap:36px;padding:clamp(36px,5vw,64px) 0 clamp(56px,7vw,96px)}
@media (min-width:1080px){.art-layout.has-toc{grid-template-columns:260px minmax(0,720px);gap:72px;justify-content:start}.art-layout:not(.has-toc){grid-template-columns:minmax(0,720px)}}
.toc-wrap{min-width:0}
@media (min-width:1080px){.toc{position:sticky;top:96px}}
.toc{background:var(--paper);border:1.5px solid var(--line);border-radius:20px;padding:20px 22px}
.toc .tagline{color:var(--blue);font-size:12px;margin-bottom:12px}
.toc ol{counter-reset:t;display:grid;gap:2px}
.toc li{counter-increment:t;display:flex;gap:10px;font-size:15px;line-height:1.4}
.toc li::before{content:counter(t,decimal-leading-zero);font:800 13px/1.6 var(--display);color:var(--blue);flex:none;width:22px}
.toc a{text-decoration:none;color:var(--muted);padding:4px 0}
.toc a:hover{color:var(--ink);text-decoration:underline}

/* prose */
.prose{font-size:18px;line-height:1.7;min-width:0}
.prose>*+*{margin-top:1.1em}
.prose p,.prose li{color:#22304A}
.prose h2{font:800 clamp(28px,3vw,38px)/1.1 var(--display);letter-spacing:-.03em;margin-top:2.1em;scroll-margin-top:90px;text-wrap:balance}
.prose h3{font:700 clamp(21px,2vw,24px)/1.25 var(--display);letter-spacing:-.015em;margin-top:1.8em;scroll-margin-top:90px}
.prose h4{font:700 18px/1.3 var(--sans);margin-top:1.5em}
.prose h2+*,.prose h3+*{margin-top:.6em}
.prose a{color:var(--blue);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;font-weight:500}
.prose a:hover{color:var(--ink)}
.prose strong{color:var(--ink);font-weight:700}
.prose ul,.prose ol{padding-left:1.4em}
.prose ul{list-style:disc}.prose ol{list-style:decimal}
.prose li+li{margin-top:.4em}
.prose li::marker{color:var(--blue);font-weight:700}
.prose li>ul,.prose li>ol{margin-top:.4em}
.prose blockquote{margin:1.4em 0;padding:18px 22px;background:var(--paper);border:1.5px solid var(--line);border-left:6px solid var(--blue);border-radius:16px}
.prose blockquote>*+*{margin-top:.7em}
.prose code{font:500 .88em/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;background:#0B1D3A0D;padding:.12em .4em;border-radius:6px}
.prose hr{border:0;border-top:1.5px solid var(--line);margin:2.4em 0}
.prose figure{margin:1.6em 0}
.prose figure img{border-radius:18px;border:1.5px solid var(--line)}
.prose figcaption{font-size:14.5px;color:var(--muted);margin-top:10px}
.prose .table{overflow-x:auto;border:1.5px solid var(--line);border-radius:16px;background:var(--paper);margin:1.5em 0}
.prose table{border-collapse:collapse;width:100%;font-size:16px;line-height:1.45}
.prose th{background:var(--ink);color:#fff;text-align:left;font:700 14px/1.3 var(--sans);letter-spacing:.02em;padding:12px 16px}
.prose td{padding:12px 16px;border-top:1px solid var(--line);vertical-align:top;color:#22304A}
.prose tr:nth-child(even) td{background:#F6F3EC80}

/* blocks */
.takeaways{background:var(--teal);border-radius:22px;padding:24px 26px}
.prose .takeaways h2{font:700 13px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--teal-ink);margin:0 0 14px}
.takeaways ul{list-style:none;padding:0;display:grid;gap:10px}
.takeaways li{position:relative;padding-left:30px;color:#123A36;font-size:17px;line-height:1.5}
.takeaways li+li{margin-top:0}
.takeaways li::before{content:"";position:absolute;left:0;top:.42em;width:16px;height:16px;border-radius:50%;background:var(--teal-ink)}
.art-cta-inline{background:var(--ink);color:#fff;border-radius:24px;padding:28px;margin:2.2em 0!important}
.art-cta-inline .tagline{color:var(--sun);font-size:12px}
.prose .art-cta-inline p{color:#C9D2E3}
.art-cta-inline .art-cta-title{font:800 clamp(26px,2.6vw,32px)/1.05 var(--display);letter-spacing:-.03em;color:#fff!important;margin:10px 0 8px}
.art-cta-inline .waitlist{margin-top:20px}
.art-cta-inline .field{border-color:#fff}
.art-cta-inline .btn-ink{background:var(--sun);color:var(--ink)}
.art-cta-inline .btn-ink:hover{background:#FFD24D}
.prose .art-cta-inline .form-note{color:#C9D2E3;font-size:14.5px}
.art-cta-inline .btn .spin{border-color:#0B1D3A40;border-top-color:var(--ink)}
.art-faq{margin-top:2.6em!important}
.art-faq .faq{margin-top:18px}
.prose .faq summary{font-size:clamp(18px,1.6vw,20px)}
.prose .faq .ans{font-size:17px;line-height:1.65}
.sources{margin-top:2.6em!important;border-top:2px solid var(--ink);padding-top:6px}
.prose .sources h2{font-size:22px;margin-top:18px}
.sources ol{font-size:15.5px;line-height:1.5}
.sources li span{display:block;color:var(--muted);font-size:14.5px}

/* cards */
.art-list{display:grid;gap:20px}
@media (min-width:760px){.art-list{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.art-list{grid-template-columns:repeat(3,1fr)}}
.art-card{height:100%;display:flex;flex-direction:column;gap:12px;background:var(--paper);border:1.5px solid var(--line);border-radius:28px;padding:28px;text-decoration:none;transition:border-color .15s,transform .15s}
.art-card:hover{border-color:var(--ink);transform:translateY(-2px)}
.art-card .tagline{color:var(--blue);font-size:12px}
.art-card h2,.art-card h3{font:800 clamp(24px,2.2vw,30px)/1.06 var(--display);letter-spacing:-.03em;text-wrap:balance}
.art-card p:not(.tagline){color:var(--muted);font-size:16px}
.art-card-foot{margin-top:auto;padding-top:14px;display:flex;justify-content:space-between;align-items:center;font-size:14.5px;color:var(--muted)}
.art-card .go{font-weight:700;color:var(--ink)}
.art-index{padding-top:clamp(36px,5vw,64px)}
.related{background:var(--paper);border-top:1px solid var(--line)}
.related .h2{font-size:clamp(32px,4vw,52px);margin-bottom:36px}
.related .art-card{background:var(--cal)}
@media (max-width:599px){.art-card{padding:22px;border-radius:24px}.prose{font-size:17px}.answer{padding:18px 18px}.art-cta-inline{padding:22px}}
