/* ═══════════════════════════════════════════════════════════════════════
   BLOG — Nattiva Travel
   Paleta oficial do Manual de Identidade Visual v1 (22/07/2026):
   Carvão #373737 · Bronze #523F38 · Âmbar #FCA311 · Papel #F6F1EC · Tinta #2A2420
   Tipografia oficial: Bitter (título) + Work Sans (corpo).
   Âmbar é usado só em ponto de destaque — nunca como fundo dominante.
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  --charcoal:#373737;
  --bronze:#523F38;
  --amber:#FCA311;
  --paper:#F6F1EC;
  --ink:#2A2420;

  /* tons derivados por opacidade das 5 cores oficiais — nunca um matiz novo */
  --charcoal-2:#2E2E2E;
  --paper-2:#EDE5DA;
  --hairline:rgba(42,36,32,.12);
  --hairline-on-dark:rgba(246,241,236,.14);
  --ink-soft:rgba(42,36,32,.62);
  --paper-soft:rgba(246,241,236,.6);

  --font-display:'Bitter',Georgia,'Times New Roman',serif;
  --font-body:'Work Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --gutter:64px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
@media(max-width:760px){ :root{ --gutter:28px; } }
@media(max-width:420px){ :root{ --gutter:22px; } }

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:96px}
@media(prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *,*::before,*::after{animation:none!important;transition:none!important} }
body{font-family:var(--font-body);background:var(--paper);color:var(--ink);line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:800;letter-spacing:-.01em}
::selection{background:var(--amber);color:var(--charcoal)}
a:focus-visible,button:focus-visible{outline:2px solid var(--amber);outline-offset:3px}

/* ── grão sutil sobre fundos escuros (textura, não cor) ───────────────── */
.grain{position:relative}
.grain::before{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:1;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ── cursor autoral (desktop, ponteiro fino, sem reduced-motion) ─────── */
/* ── reveal de título (cortina, não fade genérico) ────────────────────── */
.reveal-mask{overflow:hidden;display:block}
.reveal-mask>*{display:block;transform:translateY(105%);transition:transform .85s var(--ease)}
.reveal-mask.in>*{transform:translateY(0)}
@media(prefers-reduced-motion:reduce){ .reveal-mask>*{transform:none} }

/* ── nav ───────────────────────────────────────────────────────────────── */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:20px var(--gutter);display:flex;align-items:center;justify-content:space-between;background:rgba(55,55,55,.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .35s var(--ease),padding .35s var(--ease),box-shadow .35s var(--ease)}
.nav.scrolled{background:rgba(246,241,236,.94);padding-top:13px;padding-bottom:13px;box-shadow:0 1px 0 var(--hairline)}
.nav-logo{height:36px;width:auto;filter:brightness(0) invert(1);transition:filter .35s var(--ease)}
.nav.scrolled .nav-logo{filter:none}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{font-size:14px;font-weight:600;color:#fff;transition:color .3s var(--ease),opacity .2s}
.nav-links a:hover{opacity:.72}
.nav.scrolled .nav-links a{color:var(--ink)}
.nav-links a.active{color:var(--amber)}
.nav-cta{border:1.4px solid rgba(255,255,255,.7)!important;color:#fff!important;font-weight:700;padding:9px 18px;border-radius:2px;transition:all .3s var(--ease)}
.nav-cta:hover{background:var(--amber);border-color:var(--amber)!important;color:var(--charcoal)!important;opacity:1}
.nav.scrolled .nav-cta{border-color:var(--amber)!important;color:var(--charcoal)!important;background:var(--amber)}
.nav.scrolled .nav-cta:hover{background:#e6930a}
.nav-burger{display:none;background:none;border:none;width:30px;height:30px;position:relative;z-index:110}
.nav-burger span{position:absolute;left:2px;right:2px;height:1.6px;background:#fff;transition:background .3s var(--ease)}
.nav.scrolled .nav-burger span{background:var(--ink)}
.nav-burger span:nth-child(1){top:10px}
.nav-burger span:nth-child(2){top:17px}
@media(max-width:760px){ .nav-links{display:none} .nav-burger{display:block} }

/* ── hero (listagem e leitura) ─────────────────────────────────────────── */
.hero{position:relative;color:#fff;overflow:hidden;display:flex;align-items:flex-end;background:var(--charcoal)}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.hero-tint{position:absolute;inset:0;background:linear-gradient(180deg,rgba(42,36,32,.5) 0%,rgba(42,36,32,.8) 62%,var(--charcoal) 100%)}
.hero-in{position:relative;z-index:2;width:100%;max-width:1080px;margin:0 auto;padding:0 28px}
.hero-eyebrow{font-family:var(--font-body);font-size:13px;color:var(--amber);font-weight:700;letter-spacing:.04em;margin-bottom:18px;display:flex;align-items:center;gap:10px}
.hero-eyebrow::before{content:'';width:22px;height:1px;background:var(--amber)}
.hero-title{font-weight:800;font-size:clamp(1.9rem,4.6vw,3.4rem);line-height:1.1;margin-bottom:16px;max-width:820px;text-wrap:balance}
.hero-sub{font-family:var(--font-body);font-size:clamp(15px,1.6vw,18px);color:var(--paper-soft);max-width:560px;line-height:1.75;font-weight:400}

.journal-hero{min-height:64vh;padding:150px 0 64px}
.journal-hero .hero-bg{background-image:url('/consultoria/assets/mostar.jpg');background-position:center 42%}

/* ── main / grid ───────────────────────────────────────────────────────── */
.main{max-width:1080px;margin:0 auto;padding:80px 28px 96px}
.journal-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:40px;padding-bottom:24px;border-bottom:1.4px solid var(--hairline)}
.journal-heading small{display:block;font-family:var(--font-body);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze);margin-bottom:10px;font-weight:700}
.journal-heading h2{font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.15}
.journal-heading p{font-family:var(--font-body);font-size:13px;color:var(--ink-soft);max-width:200px;text-align:right}
@media(max-width:640px){ .journal-heading{flex-direction:column;align-items:flex-start;gap:10px} .journal-heading p{text-align:left;max-width:none} }

.articles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 28px}
@media(max-width:900px){ .articles-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(max-width:620px){ .articles-grid{grid-template-columns:1fr;gap:36px} }

/* ── featured card ─────────────────────────────────────────────────────── */
.featured-card{grid-column:1/-1;display:grid;grid-template-columns:1.15fr 1fr;background:#fff;border:1.4px solid var(--hairline);overflow:hidden;transition:box-shadow .4s var(--ease)}
.featured-card:hover{box-shadow:0 34px 64px -30px rgba(42,36,32,.32)}
.featured-img{min-height:420px;overflow:hidden}
.featured-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.featured-card:hover .featured-img img,.featured-img.is-hover img{transform:scale(1.045)}
.featured-body{padding:44px;display:flex;flex-direction:column;justify-content:center}
.featured-label{font-family:var(--font-body);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);margin-bottom:16px}
.featured-title{font-size:clamp(1.4rem,2.4vw,1.9rem);line-height:1.22;color:var(--charcoal);margin-bottom:16px;overflow-wrap:anywhere}
.featured-excerpt{font-family:var(--font-body);font-size:14.5px;color:var(--ink-soft);line-height:1.8;margin-bottom:22px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.featured-cta{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-body);font-size:13px;font-weight:700;color:var(--charcoal);position:relative;align-self:flex-start;padding-bottom:4px}
.featured-cta::after{content:'';position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--amber);transform-origin:left;transform:scaleX(.28);transition:transform .4s var(--ease)}
.featured-card:hover .featured-cta::after{transform:scaleX(1)}
@media(max-width:760px){ .featured-card{grid-template-columns:1fr} .featured-img{min-height:260px} .featured-body{padding:28px} }

/* ── article card ──────────────────────────────────────────────────────── */
.article-card{display:block}
.article-img{aspect-ratio:4/3;overflow:hidden;margin-bottom:20px;background:var(--paper-2)}
.article-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.article-card:hover .article-img img{transform:scale(1.045)}
.article-body{border-top:2px solid var(--charcoal);padding-top:20px}
.article-title{font-size:19px;line-height:1.3;color:var(--charcoal);margin-bottom:10px;overflow-wrap:anywhere;font-weight:700}
.article-excerpt{font-family:var(--font-body);font-size:14px;color:var(--ink-soft);line-height:1.7;margin-bottom:14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.article-meta{display:flex;align-items:center;gap:8px;font-family:var(--font-body);font-size:12px;color:var(--ink-soft)}
.article-meta .dot{width:3px;height:3px;border-radius:50%;background:currentColor}

/* ── load more ─────────────────────────────────────────────────────────── */
.load-more-wrap{text-align:center;margin-top:52px}
.btn-load{font-family:var(--font-body);font-size:13px;font-weight:700;border:1.4px solid var(--charcoal);background:transparent;color:var(--charcoal);padding:14px 32px;border-radius:2px;cursor:pointer;transition:all .3s var(--ease)}
.btn-load:hover{background:var(--charcoal);color:var(--paper)}
.btn-load:disabled{opacity:.4;cursor:default}

/* ── empty / loading ───────────────────────────────────────────────────── */
.state-msg{grid-column:1/-1;text-align:center;padding:80px 24px;background:#fff;border-top:2px solid var(--amber)}
.state-msg h3{font-size:20px;margin-bottom:10px;color:var(--charcoal)}
.state-msg p{font-family:var(--font-body);font-size:14px;color:var(--ink-soft);line-height:1.7}

/* ── invite / lead-cta band ───────────────────────────────────────────── */
.journal-invite,.lead-cta-inner{position:relative;color:#fff;background:var(--charcoal);padding:48px;display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap;overflow:hidden}
.journal-invite{margin-top:76px}
.journal-invite small,.lead-cta-eyebrow{font-family:var(--font-body);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);display:block;margin-bottom:14px;position:relative;z-index:1}
.journal-invite h2,.lead-cta-title{font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.2;margin-bottom:10px;color:#fff;position:relative;z-index:1}
.journal-invite p,.lead-cta-sub{font-family:var(--font-body);font-size:14px;color:var(--paper-soft);max-width:520px;line-height:1.75;position:relative;z-index:1}
.journal-invite a,.lead-cta-btn{flex-shrink:0;background:var(--amber);color:var(--charcoal);font-family:var(--font-body);font-weight:700;font-size:14px;padding:16px 26px;border-radius:2px;white-space:nowrap;transition:background .3s var(--ease),transform .3s var(--ease);position:relative;z-index:1}
.journal-invite a:hover,.lead-cta-btn:hover{background:#e6930a;transform:translateY(-2px)}
@media(max-width:640px){ .journal-invite,.lead-cta-inner{flex-direction:column;align-items:flex-start;padding:32px 24px} .journal-invite a,.lead-cta-btn{width:100%;text-align:center} }

/* ── footer ────────────────────────────────────────────────────────────── */
.footer{background:var(--ink);color:var(--paper-soft);padding:56px 24px 40px;text-align:center;margin-top:0}
.footer img{height:42px;opacity:.9;margin:0 auto 16px}
.footer p{font-family:var(--font-body);font-size:12.5px;line-height:2}
.footer a{color:var(--amber);margin:0 8px}

/* ═══════════════════════════════════════════════════════════════════════
   PÁGINA DE LEITURA (artigo individual)
   ═══════════════════════════════════════════════════════════════════════ */
.reading .hero{min-height:66vh;padding:150px 0 60px}
.hero-breadcrumb{font-family:var(--font-body);font-size:12px;letter-spacing:.02em;opacity:.75;margin-bottom:18px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hero-breadcrumb a:hover{color:var(--amber)}
.hero-breadcrumb span{opacity:.5}
.hero-meta{display:flex;align-items:center;gap:20px;font-family:var(--font-body);font-size:13px;color:var(--paper-soft);flex-wrap:wrap;margin-top:6px}
.hero-meta-item{display:flex;align-items:center;gap:7px}

.article-wrap{max-width:740px;margin:0 auto;padding:64px 28px 8px}
.article-wrap>.article-excerpt{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:20px;color:var(--charcoal);line-height:1.7;border-left:3px solid var(--amber);padding-left:22px;margin-bottom:44px}
.article-content{font-family:var(--font-body);font-size:17px;line-height:1.9;color:var(--ink);overflow-wrap:anywhere}
.article-content h2{font-family:var(--font-display);font-weight:800;font-size:27px;line-height:1.28;color:var(--charcoal);margin:48px 0 16px}
.article-content h3{font-family:var(--font-display);font-weight:700;font-size:21px;line-height:1.4;color:var(--charcoal);margin:36px 0 12px}
.article-content p{margin-bottom:22px}
.article-content strong{font-weight:700;color:var(--charcoal)}
.article-content a{color:var(--charcoal);text-decoration:underline;text-decoration-color:var(--amber);text-decoration-thickness:2px;text-underline-offset:3px}
.article-content ul,.article-content ol{margin:0 0 22px 22px}
.article-content li{margin-bottom:8px}
.article-content blockquote{border-left:3px solid var(--amber);padding:20px 24px;margin:32px 0;background:var(--paper);font-family:var(--font-display);font-style:italic;color:var(--charcoal)}
.article-content img{width:100%;margin:32px 0}
.article-content hr{border:none;border-top:1.4px solid var(--hairline);margin:40px 0}
.article-content table{display:block;max-width:100%;overflow-x:auto}
.article-content iframe,.article-content video{max-width:100%}

/* gallery */
.gallery{max-width:1100px;margin:56px auto;padding:0 28px}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.gallery-item{overflow:hidden;cursor:pointer;aspect-ratio:4/3;background:var(--paper-2)}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .45s var(--ease)}
.gallery-item:hover img{transform:scale(1.06)}

/* lightbox */
.lightbox{display:none;position:fixed;inset:0;z-index:500;background:rgba(42,36,32,.97);align-items:center;justify-content:center}
.lightbox.open{display:flex}
.lb-img{max-width:90vw;max-height:88vh;object-fit:contain}
.lb-close,.lb-prev,.lb-next{position:absolute;background:none;border:none;color:#fff;font-size:1.9rem;cursor:pointer;padding:.5rem 1rem;opacity:.8;transition:opacity .2s;line-height:1}
.lb-close:hover,.lb-prev:hover,.lb-next:hover{opacity:1;color:var(--amber)}
.lb-close{top:1rem;right:1.25rem;font-size:1.5rem}
.lb-prev{left:.5rem}
.lb-next{right:.5rem}
@media(max-width:480px){ .lb-prev{left:0} .lb-next{right:0} }

/* lead cta + related */
.lead-cta,.related{max-width:1080px;margin:64px auto;padding:0 28px}
.related-title{font-size:26px;color:var(--charcoal);margin-bottom:32px}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px}
.related-card{display:block}
.related-img-wrap{aspect-ratio:4/3;overflow:hidden;margin-bottom:16px;background:var(--paper-2)}
.related-img-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.related-card:hover .related-img-wrap img{transform:scale(1.05)}
.related-info{padding-top:16px;border-top:2px solid var(--charcoal)}
.related-time{font-family:var(--font-body);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--amber);display:block;margin-bottom:6px}
.related-info h3{font-size:16px;line-height:1.4;color:var(--charcoal);font-weight:700}

/* ── mobile menu panel ─────────────────────────────────────────────────── */
.mobile-panel{position:fixed;inset:0;background:var(--paper);z-index:99;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:24px;padding:0 40px;transform:translateY(-100%);transition:transform .45s var(--ease)}
.mobile-panel.open{transform:translateY(0)}
.mobile-panel a{font-family:var(--font-display);font-weight:800;font-size:26px;color:var(--charcoal)}
.mobile-panel .nav-cta{background:var(--amber)!important;border-color:var(--amber)!important;color:var(--charcoal)!important;margin-top:6px}

@media(max-width:680px){
  .journal-hero{min-height:56vh;padding:120px 0 48px}
  .reading .hero{min-height:52vh;padding:120px 0 44px}
  .main{padding:56px 22px 64px}
  .featured-body{padding:24px}
  .article-wrap{padding:44px 22px 8px}
  .article-wrap>.article-excerpt{font-size:18px;padding-left:16px}
  .article-content{font-size:16px}
  .article-content h2{font-size:23px}
  .footer img{height:38px}
}
