/* ============================================================
   GESMEXA · Blog stylesheet
   ============================================================ */
:root{
  --green-900:#0A3328;--green-700:#0F4D3F;--green-500:#1E6B5A;--green-100:#D4E2DC;
  --gold-700:#A88636;--gold-500:#C9A961;--gold-300:#E0CB95;--gold-100:#F4EBD0;
  --navy-900:#0B1F3A;--navy-700:#1A3A5C;
  --cream-50:#FAF7EE;--cream-100:#F5F1E8;--cream-200:#EFE9D9;--cream-300:#E5DCC4;
  --ink-900:#15171C;--ink-600:#4B5563;--ink-400:#8B8F99;
  --alert-700:#A92D2D;
  --ff-display:'Fraunces',ui-serif,Georgia,serif;
  --ff-body:'Plus Jakarta Sans',ui-sans-serif,system-ui,sans-serif;
  --r-md:12px;--r-lg:20px;
  --shadow-md:0 4px 12px rgba(15,77,63,.08),0 2px 4px rgba(15,77,63,.05);
  --ease-out:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--ff-body);font-size:17.5px;line-height:1.7;color:var(--ink-900);background:var(--cream-100);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:'kern','liga','calt'}
img,svg{max-width:100%;display:block}
a{color:var(--green-700);text-decoration:none;transition:color .2s var(--ease-out)}
a:hover{color:var(--gold-700)}
a.body-link{border-bottom:1px solid var(--gold-300);padding-bottom:1px}
a.body-link:hover{border-bottom-color:var(--gold-700)}

/* ===== TOP NAV (compartida) ===== */
.top-nav{position:sticky;top:0;z-index:50;background:rgba(245,241,232,.92);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--cream-300)}
.top-nav__inner{max-width:1100px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.top-nav__brand{display:flex;align-items:center;gap:10px;font-family:var(--ff-display);font-weight:600;font-size:1.3rem;color:var(--navy-900);letter-spacing:-.01em}
.top-nav__brand img{width:34px;height:34px;border-radius:6px}
.top-nav__cta{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:var(--green-700);color:var(--cream-50)!important;border-radius:999px;font-weight:600;font-size:.88rem;transition:background .2s,transform .2s}
.top-nav__cta:hover{background:var(--green-900);transform:translateY(-1px)}
.top-nav__cta svg{width:16px;height:16px}
@media (max-width:560px){.top-nav__cta span{display:none}}

/* ===== BREADCRUMB ===== */
.breadcrumb{max-width:760px;margin:0 auto;padding:24px 24px 0;font-size:.85rem;color:var(--ink-600)}
.breadcrumb a{color:var(--ink-600);border-bottom:1px solid transparent;transition:border-color .2s}
.breadcrumb a:hover{color:var(--green-700);border-bottom-color:var(--gold-500)}
.breadcrumb__sep{margin:0 8px;color:var(--ink-400)}

/* ===== ARTICLE ===== */
.article-header{max-width:760px;margin:0 auto;padding:32px 24px 16px}
.article-tag{display:inline-block;font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-700);margin-bottom:1rem}
.article-title{font-family:var(--ff-display);font-size:clamp(2rem,5.5vw,3.4rem);font-weight:400;color:var(--navy-900);line-height:1.08;letter-spacing:-.025em;margin:0 0 .6em;font-variation-settings:"SOFT" 50,"opsz" 144}
.article-title em{font-style:italic;color:var(--green-700);font-variation-settings:"SOFT" 100;font-weight:500}
.article-lede{font-size:1.18rem;color:var(--ink-600);max-width:680px;line-height:1.55;margin:0 0 1.8em}
.article-lede strong{color:var(--ink-900);font-weight:600}
.article-meta{display:flex;align-items:center;flex-wrap:wrap;gap:16px;font-size:.88rem;color:var(--ink-600);padding-bottom:24px;border-bottom:1px solid var(--cream-300);margin-bottom:32px}
.article-meta__author{display:flex;align-items:center;gap:8px;font-weight:500;color:var(--navy-900)}
.article-meta__author::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--green-700)}

/* ===== ARTICLE BODY ===== */
.article-body{max-width:680px;margin:0 auto;padding:0 24px 64px;font-size:17.5px;line-height:1.75}
.article-body p{margin:0 0 1.4em;color:var(--ink-900)}
.article-body p strong{font-weight:600;color:var(--ink-900)}
.article-body h2{font-family:var(--ff-display);font-size:clamp(1.55rem,3vw,2rem);font-weight:500;color:var(--navy-900);line-height:1.2;letter-spacing:-.015em;margin:2.4em 0 .7em;font-variation-settings:"SOFT" 30,"opsz" 144}
.article-body h2::before{content:"";display:block;width:40px;height:2px;background:var(--gold-500);margin-bottom:18px}
.article-body h3{font-family:var(--ff-display);font-size:1.3rem;font-weight:500;color:var(--navy-900);margin:2em 0 .5em;line-height:1.25}
.article-body h4{font-family:var(--ff-body);font-size:1.02rem;font-weight:700;color:var(--navy-900);margin:1.6em 0 .4em;letter-spacing:-.005em}
.article-body ul,.article-body ol{margin:0 0 1.4em;padding-left:1.4em}
.article-body li{margin-bottom:.5em;color:var(--ink-900)}
.article-body blockquote{margin:2em 0;padding:24px 28px;background:var(--cream-50);border-left:3px solid var(--gold-500);border-radius:0 var(--r-md) var(--r-md) 0;font-family:var(--ff-display);font-size:1.15rem;font-style:italic;color:var(--navy-900);line-height:1.45;font-variation-settings:"SOFT" 100,"opsz" 144}
.article-body blockquote p{margin:0;color:var(--navy-900)}
.article-body .callout{margin:2em 0;padding:24px 28px;background:var(--cream-50);border:1px solid var(--cream-300);border-radius:var(--r-md);font-size:.97rem;line-height:1.55}
.article-body .callout--warning{background:rgba(169,45,45,.04);border-color:rgba(169,45,45,.2)}
.article-body .callout--tip{background:rgba(15,77,63,.04);border-color:var(--green-100)}
.article-body .callout__title{font-family:var(--ff-display);font-size:1.05rem;font-weight:600;color:var(--navy-900);margin:0 0 8px;display:flex;align-items:center;gap:8px}
.article-body .callout__title::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold-500)}
.article-body .callout--warning .callout__title::before{background:var(--alert-700)}
.article-body .callout--tip .callout__title::before{background:var(--green-700)}
.article-body .callout p:last-child{margin:0}
.article-body table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:.94rem;background:var(--cream-50);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-md)}
.article-body table thead{background:var(--navy-900);color:var(--cream-50)}
.article-body table th{padding:14px 18px;text-align:left;font-weight:600;font-size:.88rem;letter-spacing:.02em}
.article-body table td{padding:14px 18px;border-top:1px solid var(--cream-300);color:var(--ink-900)}
.article-body table tr:nth-child(even) td{background:var(--cream-100)}

/* ===== INLINE CTA ===== */
.inline-cta{margin:2.4em 0;padding:32px;background:linear-gradient(160deg,var(--green-700) 0%,var(--green-900) 100%);color:var(--cream-50);border-radius:var(--r-lg);text-align:center;position:relative;overflow:hidden}
.inline-cta::before{content:"";position:absolute;top:-50px;right:-50px;width:200px;height:200px;background:radial-gradient(circle,rgba(201,169,97,.18) 0%,transparent 60%);pointer-events:none}
.inline-cta__title{font-family:var(--ff-display);font-size:1.4rem;font-weight:500;color:var(--cream-50);margin:0 0 8px;line-height:1.2}
.inline-cta__title em{font-style:italic;color:var(--gold-500);font-variation-settings:"SOFT" 100}
.inline-cta__text{margin:0 0 20px;color:rgba(245,241,232,.85);font-size:.97rem;line-height:1.5}
.inline-cta__btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:var(--gold-500);color:var(--navy-900);border-radius:999px;font-weight:600;font-size:.95rem;transition:transform .2s,background .2s;text-decoration:none}
.inline-cta__btn:hover{background:var(--gold-700);color:var(--cream-50);transform:translateY(-1px)}
.inline-cta__btn svg{width:18px;height:18px}

/* ===== FAQ ===== */
.faq-section{max-width:680px;margin:0 auto;padding:48px 24px 32px;border-top:1px solid var(--cream-300)}
.faq-section h2{font-family:var(--ff-display);font-size:1.8rem;font-weight:500;color:var(--navy-900);margin:0 0 1.2em;line-height:1.2;font-variation-settings:"SOFT" 30}
.faq-list{display:grid;gap:12px}
.faq-item{background:var(--cream-50);border:1px solid var(--cream-300);border-radius:var(--r-md);overflow:hidden;transition:border-color .25s}
.faq-item[open]{border-color:var(--gold-300)}
.faq-item summary{padding:18px 22px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;font-weight:600;font-size:1rem;color:var(--navy-900);list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{background:rgba(201,169,97,.04)}
.faq-item__icon{flex-shrink:0;color:var(--gold-700);font-size:1.4rem;font-weight:400;transition:transform .3s var(--ease-out);line-height:1}
.faq-item[open] .faq-item__icon{transform:rotate(45deg)}
.faq-item__body{padding:0 22px 20px;color:var(--ink-600);font-size:.97rem;line-height:1.6}
.faq-item__body p{margin:0 0 10px}
.faq-item__body p:last-child{margin:0}

/* ===== RELATED ===== */
.related-section{max-width:1100px;margin:0 auto;padding:48px 24px 64px;border-top:1px solid var(--cream-300)}
.related-section h2{font-family:var(--ff-display);font-size:1.6rem;font-weight:500;color:var(--navy-900);margin:0 0 1.2em;line-height:1.2;font-variation-settings:"SOFT" 30}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media (max-width:880px){.related-grid{grid-template-columns:1fr}}
.related-card{background:var(--cream-50);border:1px solid var(--cream-300);border-radius:var(--r-lg);padding:24px;display:flex;flex-direction:column;transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),border-color .25s;text-decoration:none}
.related-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--gold-300)}
.related-card__tag{font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-700);margin-bottom:12px}
.related-card h3{font-family:var(--ff-display);font-size:1.1rem;line-height:1.25;font-weight:500;margin:0 0 8px;color:var(--navy-900);font-variation-settings:"SOFT" 50}
.related-card p{margin:0;color:var(--ink-600);font-size:.9rem;line-height:1.5}

/* ===== FOOTER ===== */
.footer{background:var(--navy-900);color:rgba(245,241,232,.7);padding:48px 0 24px;font-size:.9rem}
.footer__container{max-width:1100px;margin:0 auto;padding:0 24px}
.footer__top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:32px;margin-bottom:32px;padding-bottom:32px;border-bottom:1px solid rgba(255,255,255,.08)}
.footer__brand-row{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.footer__brand-row img{width:36px;height:36px;border-radius:6px;background:var(--cream-50);padding:2px}
.footer__brand-row strong{font-family:var(--ff-display);font-size:1.4rem;color:var(--cream-50);font-weight:600}
.footer__desc{max-width:380px;font-size:.88rem;line-height:1.55}
.footer__links{display:flex;gap:24px;flex-wrap:wrap;font-size:.88rem}
.footer__links a{color:rgba(245,241,232,.7)}
.footer__links a:hover{color:var(--gold-500)}
.footer__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;font-size:.82rem;color:rgba(245,241,232,.4)}
.footer__bottom a{color:rgba(245,241,232,.5)}
.footer__bottom a:hover{color:var(--gold-500)}

/* ===== WA FLOAT ===== */
.wa-float{position:fixed;bottom:24px;right:24px;z-index:90;width:56px;height:56px;background:#25D366;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(37,211,102,.4),0 2px 6px rgba(0,0,0,.15);transition:transform .25s,box-shadow .25s}
.wa-float:hover{transform:scale(1.08);color:#fff;box-shadow:0 12px 32px rgba(37,211,102,.5)}
.wa-float svg{width:28px;height:28px}
.wa-float::before{content:"";position:absolute;inset:0;border-radius:50%;background:#25D366;opacity:.5;animation:waPulse 2.2s ease-out infinite;z-index:-1}
@keyframes waPulse{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.6);opacity:0}}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
:focus-visible{outline:2px solid var(--gold-500);outline-offset:3px;border-radius:4px}

/* ===== BLOG INDEX ===== */
.blog-index-hero{max-width:1100px;margin:0 auto;padding:48px 24px 32px;text-align:center}
.blog-index-hero h1{font-family:var(--ff-display);font-size:clamp(2.2rem,5.5vw,3.6rem);font-weight:400;color:var(--navy-900);line-height:1.08;letter-spacing:-.025em;margin:0 0 .4em;font-variation-settings:"SOFT" 50,"opsz" 144}
.blog-index-hero h1 em{font-style:italic;color:var(--green-700);font-variation-settings:"SOFT" 100;font-weight:500}
.blog-index-hero p{font-size:1.15rem;color:var(--ink-600);max-width:560px;margin:0 auto;line-height:1.55}
.blog-index-grid{max-width:1100px;margin:0 auto;padding:32px 24px 64px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media (max-width:880px){.blog-index-grid{grid-template-columns:1fr}}
.post-card{background:var(--cream-50);border:1px solid var(--cream-300);border-radius:var(--r-lg);padding:32px 28px;display:flex;flex-direction:column;transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),border-color .25s;text-decoration:none}
.post-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--gold-300)}
.post-card__tag{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-700);margin-bottom:14px;align-self:flex-start}
.post-card h2{font-family:var(--ff-display);font-size:1.35rem;line-height:1.22;font-weight:500;margin:0 0 12px;color:var(--navy-900);font-variation-settings:"SOFT" 50}
.post-card p{color:var(--ink-600);font-size:.95rem;margin:0 0 16px;flex-grow:1;line-height:1.55}
.post-card__link{display:inline-flex;align-items:center;gap:6px;font-size:.92rem;font-weight:600;color:var(--green-700)}
.post-card__link::after{content:"→";transition:transform .25s var(--ease-out)}
.post-card:hover .post-card__link::after{transform:translateX(4px)}