/* === RESET === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-size:1rem;line-height:1.7;
  color:#2d3436;
  background:#faf8f5;
}

img{max-width:100%;height:auto;display:block}
a{color:#1a6d73;text-decoration:none;transition:color .2s}
a:hover{color:#0e4f54}
::selection{background:#1a6d73;color:#fff}

/* === TYPOGRAPHY === */
h1,h2,h3,h4{
  font-family:'DM Serif Display',Georgia,serif;
  line-height:1.25;color:#1a1a2e;font-weight:400;
}
h1{font-size:2.75rem;margin-bottom:.75rem}
h2{font-size:1.9rem;margin-top:2.5rem;margin-bottom:.6rem}
h3{font-size:1.35rem;margin-top:1.75rem;margin-bottom:.4rem}
h4{font-size:1.1rem;margin-top:1.25rem;margin-bottom:.3rem}
p{margin-bottom:1.25rem;color:#4a5568;line-height:1.8}
ul,ol{margin-bottom:1.25rem;padding-left:1.5rem}
li{margin-bottom:.35rem;line-height:1.7}
strong{color:#1a1a2e}
small{font-size:.85rem;color:#94a3b8}
hr{border:none;border-top:1px solid #e8e2da;margin:2.5rem 0}

/* === LAYOUT === */
.container{max-width:1120px;margin:0 auto;padding:0 1.5rem}
.main{padding-top:2rem;padding-bottom:3rem}

/* === HEADER === */
.header{
  background:#fff;
  border-bottom:1px solid #e8e2da;
  position:sticky;top:0;z-index:100;
}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{
  font-size:1.2rem;font-weight:800;color:#1a1a2e;
  display:flex;align-items:center;gap:.5rem;
  letter-spacing:-.02em;
}
.logo:hover{color:#1a6d73;text-decoration:none}
.logo-icon{
  width:34px;height:34px;
  background:#1a6d73;
  border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:1rem;font-weight:800;
}
.nav-links{display:flex;list-style:none;gap:0;align-items:center}
.nav-links a{
  padding:.5rem .9rem;border-radius:6px;
  color:#5a6577;font-size:.875rem;font-weight:500;
  transition:all .2s;
}
.nav-links a:hover{background:#f0ece6;color:#1a6d73;text-decoration:none}
.nav-links a.active{background:#1a6d73;color:#fff}
.nav-toggle{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer;padding:8px;border-radius:6px}
.nav-toggle:hover{background:#f0ece6}
.nav-toggle span{display:block;width:20px;height:2px;background:#5a6577;border-radius:2px}

/* === HERO === */
.hero{
  text-align:center;
  padding:5rem 0 4rem;
  background:#1a6d73;
  border-radius:16px;
  margin-bottom:3rem;
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:'';
  position:absolute;top:0;left:0;right:0;bottom:0;
  background:
    radial-gradient(circle at 20% 80%,rgba(255,255,255,.06) 0%,transparent 50%),
    radial-gradient(circle at 80% 20%,rgba(255,255,255,.04) 0%,transparent 50%);
  pointer-events:none;
}
.hero h1{font-size:2.8rem;margin-bottom:.75rem;color:#fff;position:relative}
.hero p{font-size:1.15rem;color:rgba(255,255,255,.88);max-width:620px;margin:0 auto;line-height:1.7;position:relative}

/* === SECTIONS === */
.section{margin-bottom:3.5rem}
.section-header{
  display:flex;align-items:baseline;justify-content:space-between;
  margin-bottom:1.5rem;padding-bottom:.6rem;
  border-bottom:2px solid #e8e2da;
}
.section-header h2{margin:0;border:none;padding:0}
.section-header .section-link{
  font-size:.85rem;font-weight:600;color:#1a6d73;
  transition:all .2s;white-space:nowrap;margin-left:1rem;
}
.section-header .section-link:hover{color:#0e4f54}

/* === GRID === */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:1.5rem}

/* === CARDS === */
.card{
  background:#fff;
  border:1px solid #e8e2da;
  border-radius:12px;
  transition:all .3s ease;
  overflow:hidden;
}
.card:hover{
  border-color:#c4bdb2;
  box-shadow:0 8px 24px rgba(0,0,0,.06);
  transform:translateY(-3px);
}
.card-img{overflow:hidden;line-height:0;background:#f4f1ec;aspect-ratio:320/120}
.card-img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.card:hover .card-img img{transform:scale(1.03)}
.card-img-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:2rem;color:#d4cec6;background:#f4f1ec}
.card-body{padding:1.25rem 1.5rem 1.5rem}
.card h3,.card h2{font-size:1.2rem;margin-bottom:.4rem;margin-top:0}
.card h3 a,.card h2 a{color:#1a1a2e}
.card h3 a:hover,.card h2 a:hover{color:#1a6d73}
.card-meta{font-size:.8rem;color:#94a3b8;margin-bottom:.6rem;display:flex;gap:.75rem;flex-wrap:wrap}
.card-link{font-weight:600;font-size:.85rem;display:inline-flex;align-items:center;gap:.35rem;margin-top:.4rem;color:#1a6d73}
.card-link:hover{color:#0e4f54;gap:.5rem}
.card-rating{
  display:inline-flex;align-items:center;gap:.25rem;
  color:#c48b2a;font-weight:600;font-size:.8rem;
  margin:.6rem 1.5rem 0;
  background:#fef7e9;
  padding:.25rem .65rem;border-radius:6px;width:fit-content;
}
.card-badge{
  position:absolute;top:.75rem;right:.75rem;z-index:2;
  display:inline-block;
  background:#1a6d73;color:#fff;
  font-size:.7rem;font-weight:600;padding:.3rem .75rem;
  border-radius:999px;letter-spacing:.02em;
}
.card-featured{border:2px solid rgba(26,109,115,.15);background:#fff}
.card-featured .card-img{aspect-ratio:400/160}
.card-featured .btn{margin-top:.4rem}

/* === BUTTONS === */
.btn{
  display:inline-flex;align-items:center;gap:.4rem;
  background:#1a6d73;color:#fff;
  padding:.65rem 1.4rem;
  border-radius:8px;
  font-weight:600;font-size:.875rem;
  transition:all .2s;
  border:none;cursor:pointer;
}
.btn:hover{background:#0e4f54;color:#fff;text-decoration:none;transform:translateY(-1px)}
.btn-large{padding:.9rem 2rem;font-size:1rem;border-radius:10px}
.btn-success{background:#d4785c}
.btn-success:hover{background:#b86348}
.btn-outline{background:transparent;border:2px solid #d4cec6;color:#5a6577}
.btn-outline:hover{background:#f0ece6;border-color:#c4bdb2;color:#1a1a2e;box-shadow:none}

/* === ARTICLE === */
.article{max-width:740px;margin:0 auto}
.article-header{margin-bottom:2rem}
.article-image{margin-bottom:1.5rem;border-radius:12px;overflow:hidden;background:#f4f1ec;aspect-ratio:800/300}
.article-image img{display:block;width:100%;height:100%;object-fit:cover}
.article-img-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:1.5rem;color:#d4cec6;background:#f4f1ec;font-weight:600;text-transform:uppercase;letter-spacing:.15em}
.breadcrumbs{font-size:.8rem;color:#94a3b8;margin-bottom:.75rem;display:flex;gap:.4rem;flex-wrap:wrap}
.breadcrumbs a{color:#1a6d73}
.breadcrumbs a:hover{color:#0e4f54}
.breadcrumbs .sep{color:#d4cec6}
.article h1{font-size:2.2rem;margin-bottom:.75rem}
.article-meta{
  display:flex;gap:.75rem;flex-wrap:wrap;
  font-size:.85rem;color:#94a3b8;
  margin-bottom:.75rem;padding-bottom:.75rem;
  border-bottom:1px solid #e8e2da;
}
.article-meta span{display:inline-flex;align-items:center;gap:.3rem}
.article-meta .rating{color:#c48b2a;font-weight:600}
.article-excerpt{
  font-size:1.05rem;color:#5a6577;
  border-left:3px solid #1a6d73;
  padding:.5rem 0 .5rem 1rem;
  margin-bottom:1.5rem;
  background:#f4f1ec;
  border-radius:0 6px 6px 0;
  line-height:1.7;
}

/* === TOC === */
.toc{
  background:#f4f1ec;
  border:1px solid #e8e2da;
  border-radius:10px;padding:1rem 1.25rem;margin-bottom:2rem;
}
.toc strong{display:block;margin-bottom:.4rem;font-size:.9rem;color:#1a1a2e}
.toc ul{list-style:none;padding:0;margin:0}
.toc li{margin-bottom:.2rem}
.toc a{color:#5a6577;font-size:.85rem;padding:.15rem 0;display:inline-block}
.toc a:hover{color:#1a6d73}
.toc ul ul{padding-left:1rem;margin-top:.1rem}

/* === ARTICLE CONTENT === */
.article-content{font-size:1.025rem;line-height:1.85}
.article-content p{color:#4a5568;margin-bottom:1.25rem}
.article-content h2{margin-top:2.5rem;padding-bottom:.4rem;border-bottom:1px solid #e8e2da}
.article-content h3{margin-top:2rem}
.article-content h2:first-child{margin-top:0}
.article-content ul,.article-content ol{margin-bottom:1.5rem}
.article-content li{margin-bottom:.35rem}
.article-content a{color:#1a6d73;text-decoration:underline;text-underline-offset:2px;text-decoration-color:rgba(26,109,115,.3)}
.article-content a:hover{color:#0e4f54;text-decoration-color:#0e4f54}
.article-content blockquote{
  border-left:3px solid #1a6d73;
  padding:.5rem 0 .5rem 1rem;margin:1.5rem 0;
  color:#5a6577;font-style:italic;
  background:#f4f1ec;border-radius:0 6px 6px 0;
}
.article-content blockquote p{margin-bottom:0}

/* Tables */
.article-content table{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:.9rem}
.article-content table td,.article-content table th{
  border:1px solid #e8e2da;
  padding:.7rem .85rem;text-align:left;
}
.article-content th{background:#1a6d73;font-weight:600;color:#fff;font-size:.85rem}
.article-content tr:nth-child(even) td{background:#faf8f5}

/* Callout boxes */
.callout{background:#f4f1ec;border:1px solid #e8e2da;border-radius:10px;padding:1.1rem 1.35rem;margin:1.5rem 0}
.callout-title{font-weight:700;color:#1a6d73;margin-bottom:.4rem;display:flex;align-items:center;gap:.4rem}
.callout p:last-child{margin-bottom:0}
.callout-success{background:#f0f7f4;border-color:rgba(26,109,115,.15)}
.callout-success .callout-title{color:#1a6d73}
.callout-warning{background:#fef7e9;border-color:rgba(196,139,42,.15)}
.callout-warning .callout-title{color:#c48b2a}
.callout-error{background:#fdf0ed;border-color:rgba(212,120,92,.15)}
.callout-error .callout-title{color:#d4785c}

/* Pros/Cons */
.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.5rem 0}
@media(max-width:640px){.pros-cons{grid-template-columns:1fr}}
.pros,.cons{border-radius:10px;padding:1.1rem}
.pros{background:#f0f7f4;border:1px solid rgba(26,109,115,.12)}
.cons{background:#fdf0ed;border:1px solid rgba(212,120,92,.12)}
.pros-title,.cons-title{font-weight:700;margin-bottom:.6rem;display:flex;align-items:center;gap:.4rem}
.pros-title{color:#1a6d73}
.cons-title{color:#d4785c}
.pros ul,.cons ul{list-style:none;padding:0;margin:0}
.pros li,.cons li{padding:.2rem 0;padding-left:1.5rem;position:relative}
.pros li::before{content:'\2713';position:absolute;left:0;color:#1a6d73;font-weight:700}
.cons li::before{content:'\2717';position:absolute;left:0;color:#d4785c;font-weight:700}

/* Key Takeaways */
.key-takeaways{background:#f4f1ec;border:1px solid #e8e2da;border-radius:10px;padding:1.25rem;margin:1.5rem 0}
.key-takeaways-title{font-weight:700;color:#1a6d73;margin-bottom:.6rem;display:flex;align-items:center;gap:.4rem;font-size:1rem}
.key-takeaways ul{list-style:none;padding:0;margin:0}
.key-takeaways li{padding:.3rem 0;padding-left:1.5rem;position:relative;color:#4a5568}
.key-takeaways li::before{content:'\2192';position:absolute;left:0;color:#1a6d73;font-weight:600}

/* Score */
.score-box{display:inline-flex;align-items:center;gap:.6rem;background:#fef7e9;border:1px solid rgba(196,139,42,.15);border-radius:10px;padding:.7rem 1.1rem;margin:1rem 0}
.score-number{font-size:1.5rem;font-weight:700;color:#c48b2a;line-height:1}
.score-label{font-size:.8rem;color:#7a6330}

/* === DISCLOSURE === */
.disclosure{background:#fef7e9;border:1px solid #e8e2da;border-radius:10px;padding:.85rem 1.1rem;margin:2rem 0;font-size:.85rem;color:#7a6330;display:flex;align-items:flex-start;gap:.6rem}
.disclosure-icon{flex-shrink:0;width:22px;height:22px;background:#c48b2a;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.7rem}

/* === CTA BOX === */
.cta-box{background:#f0f7f4;border:1px solid rgba(26,109,115,.15);border-radius:12px;padding:2rem;text-align:center;margin:2rem 0}
.cta-box p{font-size:1.05rem;margin-bottom:1rem;color:#1a1a2e;font-weight:500}
.cta-box .btn{font-size:1rem}

/* === POST NAV === */
.post-nav{display:flex;justify-content:space-between;gap:1rem;margin:2.5rem 0;flex-wrap:wrap}
.post-nav-link{flex:1;padding:1rem;background:#fff;border:1px solid #e8e2da;border-radius:10px;font-size:.85rem;font-weight:500;transition:all .2s;text-align:center;min-width:140px}
.post-nav-link:hover{background:#f4f1ec;border-color:#c4bdb2;text-decoration:none}
.post-nav-link.prev{text-align:left}
.post-nav-link.next{text-align:right}

/* === PAGINATION === */
.pagination{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:2rem}
.pagination .btn{min-width:110px}

/* === VERDICT === */
.verdict{background:#f4f1ec;border:1px solid #e8e2da;border-radius:12px;padding:1.75rem;margin:2rem 0}
.verdict-title{font-size:1.1rem;color:#1a6d73;margin-bottom:.75rem;display:flex;align-items:center;gap:.4rem;font-family:'Inter',sans-serif;font-weight:700}
.verdict-text{font-size:1rem;color:#4a5568;line-height:1.8}
.verdict-text p:last-child{margin-bottom:0}

/* === SHARE BUTTONS === */
.share-section{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin:2rem 0;padding:1rem;background:#f4f1ec;border-radius:10px}
.share-label{font-size:.85rem;font-weight:600;color:#5a6577}
.share-buttons{display:flex;gap:.4rem;flex-wrap:wrap}
.share-btn{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .85rem;border-radius:6px;font-size:.8rem;font-weight:600;color:#fff;transition:all .2s;text-decoration:none}
.share-btn:hover{color:#fff;transform:translateY(-1px);text-decoration:none}
.share-whatsapp{background:#25D366}
.share-whatsapp:hover{background:#1da851}
.share-facebook{background:#1877F2}
.share-facebook:hover{background:#166fe5}
.share-pinterest{background:#E60023}
.share-pinterest:hover{background:#cc0000}
.share-email{background:#6b7280}
.share-email:hover{background:#4b5563}

/* === PRICE SUMMARY === */
.price-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.75rem;margin-bottom:2rem;padding:1.5rem;background:#f4f1ec;border:1px solid #e8e2da;border-radius:12px}
.price-stat{text-align:center}
.price-label{display:block;font-size:.7rem;color:#94a3b8;margin-bottom:.2rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.price-value{display:block;font-size:1.4rem;font-weight:700;color:#1a1a2e}
.price-value small{font-weight:500;font-size:.75rem;color:#94a3b8}
.price-low{color:#1a6d73}
.price-high{color:#d4785c}
.price-save-val{color:#1a6d73}
.price-save .price-label{color:#1a6d73}

/* === PRICE CHART === */
.price-chart-section{margin:2rem 0;padding:1.5rem;background:#fff;border:1px solid #e8e2da;border-radius:12px}
.price-chart-section h2{margin-top:0;border:none;padding:0}
.price-chart-desc{color:#94a3b8;font-size:.85rem;margin-bottom:1.25rem}
.chart-wrapper{position:relative;max-width:100%}
.chart-wrapper canvas{display:block;width:100%!important}
.price-update-info{text-align:right;font-size:.75rem;color:#94a3b8;margin-top:.6rem}

/* === RELATED ARTICLES === */
.related-section{margin:2.5rem 0}
.related-section h2{margin-bottom:1rem}

/* === NEWSLETTER === */
.newsletter-section{
  background:#f4f1ec;
  border:1px solid #e8e2da;
  border-radius:12px;
  padding:2.5rem 2rem;
  text-align:center;
  margin:3rem 0;
}
.newsletter-section h2{margin-top:0;border:none;color:#1a1a2e}
.newsletter-section p{color:#5a6577;max-width:480px;margin:0 auto 1.25rem;font-size:.95rem}
.newsletter-form{display:flex;gap:.5rem;max-width:400px;margin:0 auto}
.newsletter-form input{
  flex:1;padding:.7rem 1rem;
  border-radius:8px;border:1px solid #d4cec6;
  background:#fff;color:#2d3436;font-size:.9rem;
  outline:none;transition:border-color .2s;
}
.newsletter-form input:focus{border-color:#1a6d73}
.newsletter-form .btn{flex-shrink:0}
.footer-newsletter .newsletter-form{flex-direction:column;gap:.4rem;max-width:100%}
.footer-newsletter .newsletter-form input{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.1)}
.footer-newsletter .newsletter-form input:focus{border-color:rgba(255,255,255,.3)}
.footer-newsletter .newsletter-form .btn{width:100%;justify-content:center}
.footer-newsletter p{font-size:.8rem;line-height:1.5;margin-bottom:.6rem;color:rgba(255,255,255,.5)}
.btn-small{padding:.45rem 1rem;font-size:.8rem;border-radius:6px}

/* === FAQ === */
.faq-section{margin:2rem 0}
.faq-section h2{margin-bottom:.75rem}
.faq-list{border:1px solid #e8e2da;border-radius:10px;overflow:hidden;background:#fff}
.faq-item{border-bottom:1px solid #e8e2da}
.faq-item:last-child{border-bottom:none}
.faq-question{padding:.9rem 1.1rem;font-weight:600;color:#1a1a2e;cursor:pointer;transition:all .2s;list-style:none;display:flex;align-items:center;gap:.5rem;font-size:.95rem}
.faq-question:hover{background:#f4f1ec;color:#1a6d73}
.faq-question::-webkit-details-marker{display:none}
.faq-question::before{content:'';display:inline-block;width:8px;height:8px;border-right:2px solid #94a3b8;border-bottom:2px solid #94a3b8;transform:rotate(-45deg);transition:transform .25s;flex-shrink:0}
.faq-item[open] .faq-question::before{transform:rotate(45deg)}
.faq-answer{padding:0 1.1rem .85rem 2rem;color:#4a5568;font-size:.9rem;line-height:1.7}
.faq-answer p:last-child{margin-bottom:0}
.faq-answer a{color:#1a6d73;text-decoration:underline}

/* === LANGUAGE DROPDOWN (HEADER) === */
.nav-lang-dropdown{position:relative}
.lang-toggle{cursor:pointer;display:flex;align-items:center;gap:3px}
.lang-dropdown{display:none;position:absolute;top:100%;right:0;background:#fff;border:1px solid #e8e2da;border-radius:8px;padding:.3rem;box-shadow:0 8px 24px rgba(0,0,0,.08);min-width:150px;z-index:200;list-style:none}
.lang-dropdown.open{display:block}
.lang-dropdown li{margin:0}
.lang-dropdown a{display:block;padding:.45rem .85rem;border-radius:6px;font-size:.8rem;color:#5a6577;white-space:nowrap}
.lang-dropdown a:hover{background:#f4f1ec;color:#1a6d73}
.lang-dropdown a.active{background:#1a6d73;color:#fff}

/* === LANGUAGE FLAGS (FOOTER) === */
.lang-flags{display:flex;gap:.5rem;flex-wrap:wrap}
.lang-flag{display:inline-flex;align-items:center;justify-content:center;width:44px;height:32px;border-radius:6px;border:2px solid transparent;font-size:1.5rem;line-height:1;transition:all .2s;background:rgba(255,255,255,.05)}
.lang-flag:hover{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.1);transform:translateY(-2px)}
.lang-flag.active{border-color:#1a6d73;background:rgba(26,109,115,.2)}

/* === COMMENTS === */
.comments-section{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid #e8e2da}
.comments-section h2{margin-top:0;border:none;padding:0}

/* === FOOTER === */
.footer{background:#1a1a2e;color:rgba(255,255,255,.5);padding:3.5rem 0 1.5rem;margin-top:4rem}
.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;margin-bottom:2rem}
.footer-section h3,.footer-section h4{color:#fff;margin-bottom:.75rem;font-size:.95rem;font-family:'Inter',sans-serif;font-weight:700}
.footer-section p{color:rgba(255,255,255,.45);font-size:.85rem;line-height:1.6}
.footer-section ul{list-style:none;padding:0;margin:0}
.footer-section li{margin-bottom:.35rem}
.footer-section a{color:rgba(255,255,255,.5);font-size:.85rem}
.footer-section a:hover{color:#fff}
.footer-disclosure{font-size:.8rem;color:rgba(255,255,255,.3);line-height:1.5}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:1.25rem;text-align:center;font-size:.8rem;color:rgba(255,255,255,.25)}

/* === QUICK STATS === */
.quick-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.75rem;margin:1.5rem 0}
.stat-card{background:#fff;border:1px solid #e8e2da;border-radius:10px;padding:1.1rem;text-align:center}
.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.04)}
.stat-value{font-size:1.35rem;font-weight:700;color:#1a6d73;line-height:1.2}
.stat-label{font-size:.75rem;color:#94a3b8;margin-top:.2rem}

/* === PROSE (static pages) === */
.prose{max-width:740px}
.prose h2{margin-top:2rem}
.prose p{line-height:1.8}

/* === RESPONSIVE === */
@media(max-width:768px){
  html{font-size:15px}
  h1{font-size:1.8rem}
  .hero h1{font-size:2rem}
  .hero{padding:3rem 0 2.5rem}
  .hero p{font-size:1rem}
  .nav-links{
    display:none;position:absolute;top:68px;left:0;right:0;
    background:#fff;flex-direction:column;
    padding:.5rem;border-bottom:1px solid #e8e2da;
    box-shadow:0 8px 24px rgba(0,0,0,.06);gap:0;
  }
  .nav-links.open{display:flex}
  .nav-links a{padding:.6rem .85rem;border-radius:6px}
  .nav-toggle{display:flex}
  .grid{grid-template-columns:1fr}
  .article-meta{flex-wrap:wrap;gap:.4rem}
  .quick-stats{grid-template-columns:repeat(2,1fr)}
  .article-content table{font-size:.8rem}
  .article-content td,.article-content th{padding:.45rem .55rem}
  .share-section{flex-direction:column;align-items:flex-start}
  .newsletter-form{flex-direction:column}
  .price-summary{grid-template-columns:repeat(2,1fr)}
  .footer-content{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .container{padding:0 1rem}
  .hero h1{font-size:1.7rem}
  .hero{padding:2rem 0 1.5rem}
  .quick-stats{grid-template-columns:1fr 1fr}
  .cta-box{padding:1.25rem}
  .post-nav{flex-direction:column}
  .footer-content{grid-template-columns:1fr}
}

/* === ANIMATIONS === */
@keyframes fadeInUp{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.hero h1,.hero p{animation:fadeInUp .5s ease-out both}
.hero p{animation-delay:.1s}
.card{animation:fadeInUp .4s ease-out both}
.card:nth-child(2){animation-delay:.08s}
.card:nth-child(3){animation-delay:.15s}