/*
Theme Name: Guia do Café Expresso
Theme URI: https://guiadocafeexpresso.com.br/
Description: Tema-filho editorial do Astra para o Guia do Café Expresso.
Author: Guia do Café Expresso
Template: astra
Version: 1.0.0
Text Domain: cafe-expresso
*/

:root {
  --coffee-950: #21150f;
  --coffee-800: #4a2a1b;
  --coffee-700: #6b3d25;
  --coffee-500: #a86b3d;
  --cream: #f7f0e6;
  --paper: #fffaf4;
  --sage: #65735a;
  --gold: #d6a24a;
}

body { background: var(--paper); color: var(--coffee-950); }
.ce-shell { overflow: hidden; }
.ce-hero { min-height: 650px; display: flex; align-items: center; position: relative; color: #fff; background: linear-gradient(90deg, rgba(25,14,8,.92), rgba(25,14,8,.48)), url('https://images.unsplash.com/photo-1498804103079-a6351b050096?auto=format&fit=crop&w=1800&q=85') center/cover; }
.ce-hero:after { content: ''; position: absolute; inset: auto 0 0; height: 120px; background: linear-gradient(transparent, var(--paper)); }
.ce-hero__inner { max-width: 1180px; width: calc(100% - 40px); margin: 0 auto; position: relative; z-index: 1; padding: 100px 0 140px; }
.ce-eyebrow { text-transform: uppercase; letter-spacing: .18em; font-size: 12px; color: #f3cf8b; font-weight: 700; }
.ce-hero h1 { color: #fff; font-size: clamp(42px, 7vw, 84px); line-height: .98; max-width: 760px; margin: 20px 0; font-family: Georgia, serif; }
.ce-hero p { max-width: 590px; font-size: 20px; line-height: 1.6; color: #f4e8db; }
.ce-button { display: inline-block; background: var(--gold); color: var(--coffee-950); padding: 15px 24px; border-radius: 999px; text-decoration: none; font-weight: 700; margin-top: 20px; }
.ce-section { max-width: 1180px; width: calc(100% - 40px); margin: 0 auto; padding: 92px 0; }
.ce-section--soft { max-width: none; width: auto; background: var(--cream); }
.ce-section--soft > * { max-width: 1180px; width: calc(100% - 40px); margin-left: auto; margin-right: auto; }
.ce-kicker { color: var(--coffee-700); text-transform: uppercase; letter-spacing: .14em; font-size: 12px; font-weight: 700; }
.ce-title { color: var(--coffee-950); font-family: Georgia, serif; font-size: clamp(32px, 4vw, 54px); line-height: 1.05; margin: 12px 0 18px; }
.ce-intro { max-width: 670px; font-size: 18px; line-height: 1.7; color: #765e4e; }
.ce-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 42px; }
.ce-card { background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0 14px 36px rgba(73,42,25,.10); }
.ce-card img { width: 100%; height: 220px; object-fit: cover; display: block; }
.ce-card__body { padding: 24px; }
.ce-card h3 { margin: 0 0 8px; color: var(--coffee-800); font-family: Georgia, serif; font-size: 26px; }
.ce-card p { color: #765e4e; line-height: 1.6; margin-bottom: 18px; }
.ce-card a { color: var(--coffee-700); font-weight: 700; text-decoration: none; }
.ce-path { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.ce-path__image { min-height: 450px; border-radius: 28px; background: url('https://images.unsplash.com/photo-1447933601403-0c6688de566e?auto=format&fit=crop&w=1200&q=85') center/cover; box-shadow: 24px 24px 0 var(--gold); }
.ce-list { list-style: none; padding: 0; margin: 28px 0 0; }
.ce-list li { display: flex; gap: 14px; padding: 15px 0; border-bottom: 1px solid #eadbca; font-size: 17px; }
.ce-list strong { color: var(--coffee-700); }
.ce-featured { display: grid; grid-template-columns: 1.25fr .75fr; gap: 24px; margin-top: 42px; }
.ce-featured__main { min-height: 380px; border-radius: 24px; padding: 34px; display: flex; align-items: end; color: #fff; background: linear-gradient(0deg, rgba(22,12,6,.88), rgba(22,12,6,.05)), url('https://images.unsplash.com/photo-1501339847302-ac426a4a7cbb?auto=format&fit=crop&w=1400&q=85') center/cover; }
.ce-featured__main h3 { font: 36px/1.08 Georgia, serif; color: #fff; margin: 0; }
.ce-side { display: grid; gap: 24px; }
.ce-side article { min-height: 178px; border-radius: 24px; padding: 26px; background: var(--coffee-800); color: #fff; }
.ce-side article:nth-child(2) { background: var(--sage); }
.ce-side h3 { color: #fff; margin: 0 0 10px; font: 25px Georgia, serif; }
.ce-side p { color: #f3eadf; margin: 0; line-height: 1.5; }
.ce-disclosure { font-size: 12px; color: #806f61; padding: 25px 0 45px; }
@media (max-width: 800px) { .ce-cards, .ce-path, .ce-featured { grid-template-columns: 1fr; } .ce-path__image { min-height: 300px; box-shadow: 12px 12px 0 var(--gold); } .ce-hero { min-height: 600px; } }
