/* ============================================================
   dPA · DIÁRIO DE UM PAROQUIANO DE ALDEIA · HOME
   Brandbook v1.0 — Playfair Display (italic é assinatura) + Inter.
   Preto-aldeão #111 · creme de papel · vermelho-paroquial. Café na mão.
   ============================================================ */

:root{
  --aldeao:#111111; --paroquial:#C0312B; --papel:#F0ECE4; --papel-suave:#E8DDD0;
  --taupe:#877F72; --card:#1A1A1A; --profundo:#0A0A0A; --hover:#A8271F;
  --soft:rgba(240,236,228,.10); --strong:rgba(240,236,228,.18); --accent-soft:rgba(192,49,43,.35);
  --serif:'Playfair Display',Georgia,serif;
  --sans:'Inter',system-ui,-apple-system,"Segoe UI",sans-serif;
  --container:1180px; --narrow:740px;
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top:74px; -webkit-text-size-adjust:100%; }
img,svg{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
body{ background:var(--aldeao); color:var(--papel); font-family:var(--sans);
  font-size:1.0625rem; line-height:1.7; overflow-x:hidden; position:relative;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
body::before{ content:''; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:url(/assets/img/texture.png); background-size:600px; opacity:.05; mix-blend-mode:screen; }
main,.topnav,.footer{ position:relative; z-index:1; }
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:clamp(1.25rem,5vw,2.5rem); }
.container--narrow{ max-width:var(--narrow); }

.eyebrow{ display:inline-block; font-size:.75rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--taupe); margin-bottom:1rem; }
.eyebrow--red{ color:var(--paroquial); }

.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; margin-bottom:2.5rem; }
.sec-head__title{ font-family:var(--serif); font-size:clamp(2rem,3.6vw,3rem); font-weight:700; line-height:1.08; letter-spacing:-.01em; color:var(--papel); max-width:18ch; }
.sec-head__link{ font-size:.875rem; font-weight:600; color:var(--paroquial); white-space:nowrap; padding-bottom:.3rem; }
.sec-head__link:hover{ color:var(--papel); }

/* ---- BOTÕES ---- */
.btn{ display:inline-flex; align-items:center; gap:.5rem; font-size:.9375rem; font-weight:600; letter-spacing:.01em;
  padding:.85rem 1.6rem; border-radius:4px; border:1px solid transparent; transition:all 220ms var(--ease); cursor:pointer; }
.btn--red{ background:var(--paroquial); color:#fff; }
.btn--red:hover{ background:var(--hover); transform:translateY(-2px); box-shadow:0 12px 30px rgba(192,49,43,.32); }
.btn--ghost{ border-color:rgba(240,236,228,.35); color:var(--papel); }
.btn--ghost:hover{ border-color:var(--papel); background:rgba(240,236,228,.06); }

/* ---- TOPNAV ---- */
.topnav{ position:fixed; inset:0 0 auto 0; z-index:100; transition:background 300ms,border-color 300ms;
  background:linear-gradient(to bottom,rgba(0,0,0,.55),transparent); }
.topnav.is-stuck{ background:rgba(17,17,17,.92); backdrop-filter:blur(16px) saturate(140%); -webkit-backdrop-filter:blur(16px) saturate(140%); border-bottom:1px solid var(--soft); }
.topnav__inner{ max-width:var(--container); margin-inline:auto; padding:.8rem clamp(1.25rem,5vw,2.5rem); display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.topnav__logo-img{ height:34px; width:auto; }
.topnav__menu{ display:flex; gap:1.6rem; align-items:center; }
.topnav__menu a{ font-size:.875rem; font-weight:500; color:rgba(240,236,228,.78); transition:color 200ms; white-space:nowrap; }
.topnav__menu a:hover{ color:var(--papel); }
.topnav__cta{ padding:.4rem 1rem; border:1px solid var(--accent-soft); border-radius:4px; color:var(--papel); }
.topnav__cta:hover{ background:var(--paroquial); border-color:var(--paroquial); color:#fff; }
.topnav__burger{ display:none; width:30px; height:22px; flex-direction:column; justify-content:space-between; padding:3px 0; background:none; border:0; cursor:pointer; }
.topnav__burger span{ display:block; height:2px; background:var(--papel); }

/* ---- HERO ---- */
.hero{ position:relative; height:100svh; min-height:600px; max-height:920px; overflow:hidden; background:var(--profundo); }
.hero__stage{ position:absolute; inset:0; z-index:1; }
.hero__slide{ position:absolute; inset:0; opacity:0; transition:opacity 1300ms var(--ease); }
.hero__slide.is-active{ opacity:1; }
.hero__parallax{ position:absolute; inset:-7%; will-change:transform; transition:transform 700ms var(--ease); }
.hero__img{ position:absolute; inset:0; background-size:cover; background-position:center; transform:scale(1.05); filter:saturate(.85) brightness(.92); }
.hero__slide.is-active .hero__img{ animation:kenburns 11s linear forwards; }
@keyframes kenburns{ from{transform:scale(1.05)} to{transform:scale(1.16)} }
.hero__scrim{ position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(to top,rgba(8,8,8,.96) 4%,rgba(10,8,8,.62) 36%,rgba(10,8,8,.22) 64%,rgba(20,10,8,.4) 100%); }
.hero__scrim::after{ content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 30% 80%,rgba(192,49,43,.16),transparent 55%); }
.hero__anchor{ position:absolute; right:-2%; bottom:-6%; width:min(38vw,440px); z-index:2; opacity:.10; pointer-events:none; }
.hero__content{ position:absolute; inset:auto 0 0 0; z-index:3; padding-bottom:clamp(3.5rem,9vh,7rem); }
.hero__caption{ will-change:transform,opacity; transition:opacity 500ms var(--ease),transform 500ms var(--ease); max-width:44rem; }
.hero__caption.is-swapping{ opacity:0; transform:translateY(20px); }
.hero__ed{ display:inline-flex; align-items:center; gap:.65rem; font-size:.8125rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--paroquial); margin-bottom:1.25rem; }
.hero__ed::before{ content:''; width:28px; height:2px; background:currentColor; }
.hero__title{ font-family:var(--serif); font-style:italic; font-weight:700; font-size:clamp(2.6rem,6.4vw,5rem); line-height:1.02; letter-spacing:-.01em; color:var(--papel); text-shadow:0 2px 50px rgba(0,0,0,.5); }
.hero__sub{ font-size:clamp(1rem,1.6vw,1.2rem); color:rgba(240,236,228,.8); max-width:48ch; margin-top:1.4rem; line-height:1.6; font-style:normal; }
.hero__actions{ display:flex; gap:.85rem; flex-wrap:wrap; margin-top:2rem; }
.hero__nav{ display:flex; align-items:center; gap:.6rem; margin-top:2.4rem; }
.hero__dot{ width:36px; height:3px; border-radius:2px; background:rgba(240,236,228,.28); overflow:hidden; position:relative; cursor:pointer; border:0; padding:0; }
.hero__dot::after{ content:''; position:absolute; inset:0; width:0; background:var(--paroquial); }
.hero__dot.is-active::after{ width:100%; transition:width var(--dur,7000ms) linear; }
.hero__dot:hover{ background:rgba(240,236,228,.5); }
.hero__cue{ position:absolute; right:clamp(1.25rem,5vw,2.5rem); bottom:clamp(2rem,5vh,3rem); z-index:3; font-size:.75rem; font-weight:600; letter-spacing:.06em; color:rgba(240,236,228,.7); writing-mode:vertical-rl; font-family:var(--serif); font-style:italic; }

/* ---- MANIFESTO ---- */
.manifesto{ padding:clamp(5rem,10vw,8.5rem) 0; text-align:center; position:relative; }
.manifesto::after{ content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 50% 0,rgba(192,49,43,.08),transparent 58%); pointer-events:none; }
.manifesto__lead{ font-family:var(--serif); font-style:italic; font-size:clamp(2rem,4.2vw,3.1rem); font-weight:700; line-height:1.18; color:var(--papel); position:relative; }
.manifesto__body{ font-size:1.1875rem; line-height:1.78; color:rgba(240,236,228,.82); max-width:60ch; margin:1.75rem auto 0; position:relative; }
.manifesto__body em{ font-family:var(--serif); font-style:italic; color:var(--papel-suave); }
.manifesto__sign{ margin-top:2rem; font-family:var(--serif); font-size:1.3rem; color:var(--papel); position:relative; }
.manifesto__sign em{ font-style:italic; color:var(--paroquial); }

/* ---- PILARES ---- */
.pilares{ padding:clamp(4rem,7vw,6rem) 0; border-top:1px solid var(--soft); }
.pilares__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.pilar{ padding:2rem 1.75rem; border:1px solid var(--soft); border-radius:8px; border-top:3px solid var(--paroquial); background:rgba(255,255,255,.015); }
.pilar__n{ font-family:var(--serif); font-style:italic; font-size:2rem; color:var(--paroquial); }
.pilar__t{ font-family:var(--serif); font-size:1.4rem; font-weight:700; margin-top:.5rem; line-height:1.2; }
.pilar__d{ color:var(--taupe); font-size:.9375rem; line-height:1.6; margin-top:.75rem; }

/* ---- MANUAL / EBOOK ---- */
.manual{ padding:clamp(5rem,9vw,8rem) 0; }
.manual__grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.manual__cover img{ width:100%; border-radius:8px; box-shadow:0 30px 70px rgba(0,0,0,.5); border:1px solid var(--soft); }
.manual__title{ font-family:var(--serif); font-size:clamp(2rem,4vw,3.2rem); font-weight:700; line-height:1.04; margin-top:.5rem; }
.manual__lead{ font-family:var(--serif); font-style:italic; font-size:clamp(1.15rem,2vw,1.4rem); color:var(--papel-suave); margin-top:1.25rem; line-height:1.45; }
.manual__list{ margin-top:1.5rem; display:flex; flex-direction:column; gap:.65rem; }
.manual__list li{ position:relative; padding-left:1.5rem; color:rgba(240,236,228,.82); font-size:.9875rem; }
.manual__list li::before{ content:'⚓'; position:absolute; left:0; color:var(--paroquial); font-size:.85rem; }
.manual__buy{ display:flex; align-items:center; gap:1.5rem; margin-top:2rem; flex-wrap:wrap; }
.manual__price{ font-family:var(--serif); font-size:2rem; font-weight:700; color:var(--papel); }

/* ---- CAFÉ ---- */
.cafe{ padding:clamp(5rem,9vw,7.5rem) 0; background:var(--profundo); border-block:1px solid var(--soft); }
.cafe__inner{ position:relative; max-width:760px; text-align:center; margin-inline:auto; }
.cafe__anchor{ height:54px; width:auto; margin:0 auto 1.5rem; opacity:.7; }
.cafe__title{ font-family:var(--serif); font-style:italic; font-size:clamp(2rem,4vw,3rem); font-weight:700; line-height:1.1; }
.cafe__desc{ color:rgba(240,236,228,.8); font-size:1.1rem; line-height:1.7; margin:1.25rem auto 2rem; max-width:54ch; }

/* ---- DO BLOG (DINÂMICO, dark cards) ---- */
.frombog{ padding:clamp(5rem,9vw,7.5rem) 0; }
.grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.card{ display:flex; flex-direction:column; background:var(--card); border:1px solid var(--soft); border-radius:8px; overflow:hidden; transition:transform 250ms var(--ease),box-shadow 250ms,border-color 200ms; }
.card:hover{ transform:translateY(-3px); box-shadow:0 18px 44px rgba(0,0,0,.4); border-color:var(--strong); }
.card__top{ height:5px; background:var(--c-accent,var(--paroquial)); }
.card__body{ padding:1.6rem 1.5rem 1.5rem; display:flex; flex-direction:column; flex:1; }
.card__ed{ font-size:.6875rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--c-accent,var(--paroquial)); margin-bottom:.75rem; }
.card__title{ font-family:var(--serif); font-size:1.4rem; font-weight:700; line-height:1.18; color:var(--papel); }
.card:hover .card__title{ color:var(--c-accent,var(--paroquial)); }
.card__excerpt{ font-size:.9375rem; color:var(--taupe); line-height:1.6; margin-top:.75rem; flex:1; }
.card__meta{ display:flex; align-items:center; gap:.5rem; margin-top:1.25rem; padding-top:1rem; border-top:1px solid var(--soft); font-size:.8125rem; color:var(--taupe); }
.card__meta strong{ color:var(--papel); font-weight:600; }
.card__dot{ width:3px; height:3px; border-radius:50%; background:var(--taupe); }
.blog-skeleton{ height:230px; border-radius:8px; background:linear-gradient(100deg,#1a1a1a 30%,#222 50%,#1a1a1a 70%); background-size:200% 100%; animation:shimmer 1.4s linear infinite; }
@keyframes shimmer{ to{ background-position:-200% 0; } }
.empty{ grid-column:1/-1; padding:3.5rem 2rem; text-align:center; background:var(--card); border-radius:10px; border:1px dashed var(--strong); }
.empty p{ color:var(--taupe); font-family:var(--serif); font-style:italic; font-size:1.15rem; }
.empty a{ color:var(--paroquial); font-weight:600; font-style:normal; font-family:var(--sans); }

/* ---- FOOTER ---- */
.footer{ background:var(--profundo); color:var(--papel); padding-block:clamp(3.5rem,6vw,5rem); border-top:3px solid var(--paroquial); }
.footer__top{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.5rem; padding-bottom:2rem; border-bottom:1px solid var(--soft); margin-bottom:2.5rem; }
.footer__logo{ height:46px; width:auto; }
.footer__tag{ font-family:var(--serif); font-style:italic; font-size:1.2rem; color:var(--papel-suave); }
.footer__nav{ display:grid; grid-template-columns:repeat(2,minmax(0,220px)); gap:2rem; margin-bottom:2.5rem; }
.footer__col h4{ font-size:.6875rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--paroquial); margin-bottom:.9rem; }
.footer__col a{ display:block; font-size:.9rem; color:var(--taupe); padding:.22rem 0; transition:color 180ms; }
.footer__col a:hover{ color:var(--papel); }
.footer__meta{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; font-size:.8125rem; color:var(--taupe); padding-top:1.75rem; border-top:1px solid var(--soft); }
.footer__meta a{ color:var(--papel-suave); }
.footer__meta a:hover{ color:var(--paroquial); }

/* ---- REVEAL ---- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity 700ms var(--ease),transform 700ms var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }

/* ---- RESPONSIVO ---- */
@media (max-width:960px){
  .topnav__menu{ display:none; } .topnav__burger{ display:flex; }
  .topnav__menu.is-open{ display:flex; position:absolute; top:100%; left:0; right:0; flex-direction:column; background:rgba(17,17,17,.97); backdrop-filter:blur(16px); padding:1.25rem clamp(1.25rem,5vw,2.5rem); gap:1rem; border-bottom:1px solid var(--soft); }
  .pilares__grid,.grid{ grid-template-columns:1fr 1fr; }
  .manual__grid{ grid-template-columns:1fr; } .manual__cover{ max-width:340px; }
}
@media (max-width:620px){
  .pilares__grid,.grid{ grid-template-columns:1fr; } .footer__nav{ grid-template-columns:1fr; }
  .hero__cue{ display:none; } .hero{ min-height:560px; }
}
@media (prefers-reduced-motion:reduce){
  .hero__slide.is-active .hero__img{ animation:none; transform:scale(1.05); }
  .hero__parallax{ transition:none; } .hero__dot.is-active::after{ transition:none; width:100%; }
  .blog-skeleton{ animation:none; } .reveal{ opacity:1; transform:none; transition:none; }
}