/* =========================================================
   ART8 · estrategias.css
   Página Art8 Estratégias Digitais.
   ========================================================= */
.e-hero { position: relative; overflow: hidden; padding: calc(var(--header-h) + 36px) 0 76px; min-height: min(660px, 100svh); display: flex; align-items: center; }
.e-hero-glow { position: absolute; left: 42%; top: -60px; width: 900px; height: 900px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 201, 0, .14), transparent 62%); pointer-events: none; }
.e-bg8 { position: absolute; right: 9%; top: 50px; height: 500px; width: auto; opacity: .1; pointer-events: none; }
.e-hero .container { position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.e-hero .area-logo { height: 84px; width: auto; }
.e-hero h1 { margin-top: 32px; max-width: 700px; font-size: clamp(30px, 3.6vw, 46px); line-height: 1.12; font-weight: 800; }
.e-hero-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 40px; }
.e-chart { width: 100%; max-width: 600px; justify-self: end; }
.e-chart .ev { background: #111; border: 1px solid var(--line-2); }
@media (max-width: 980px) {
  .e-hero { min-height: 0; }
  .e-hero .container { grid-template-columns: minmax(0, 1fr); }
  .e-chart { justify-self: center; }
  .e-hero .area-logo { height: 64px; }
  .e-bg8 { right: -40px; height: 360px; }
}
@media (max-width: 560px) { .e-hero-actions .btn { width: 100%; } }

.e-intro { padding: 76px 0; border-top: 1px solid var(--line); }
.e-intro .container { display: flex; gap: clamp(32px, 7vw, 96px); }
.e-intro .l { flex: 0 0 min(480px, 44%); }
.e-intro .r { flex: 1; }
.e-intro h2 { margin-top: 16px; font-size: clamp(28px, 3vw, 36px); line-height: 1.15; font-weight: 800; }
.e-intro .lead { font-size: clamp(18px, 1.6vw, 21px); font-weight: 300; line-height: 1.6; color: #e6e6e6; }
.e-intro .more { margin-top: 20px; font-size: 16px; font-weight: 300; line-height: 1.6; color: #bdbdbd; }
@media (max-width: 860px) { .e-intro .container { flex-direction: column; gap: 24px; } .e-intro .l { flex: none; } }

.e-services { background: var(--light); color: var(--ink); padding: 84px 0 92px; }
.e-services .eyebrow { color: var(--ink); display: flex; align-items: center; gap: 14px; font-size: 13px; }
.e-services .eyebrow::before { content: ""; width: 48px; height: 3px; background: linear-gradient(90deg, #b18000, #ffc900); }
.e-services h2 { margin: 18px 0 44px; font-size: clamp(28px, 3.2vw, 38px); line-height: 1.1; font-weight: 800; }
.e-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.e-card { border: 1px solid #cfc8b8; padding: 30px 28px; min-height: 190px; }
.e-card i { display: block; width: 40px; height: 4px; margin-bottom: 18px; background: linear-gradient(90deg, #b18000, #ffc900); }
.e-card h3 { font-size: 20px; line-height: 1.25; font-weight: 700; }
.e-card p { margin-top: 10px; font-size: 15px; line-height: 1.6; color: #3a3a38; }
@media (max-width: 980px) { .e-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .e-grid { grid-template-columns: 1fr; } .e-card { min-height: 0; } }

.e-method { position: relative; background: var(--bg-2); padding: 0 0 84px; }
.e-method .tick { position: absolute; left: var(--pad); top: 0; width: 2px; height: 56px; background: linear-gradient(#b18000, #ffc200); }
.e-strip { display: flex; align-items: center; gap: 20px; padding-top: 56px; flex-wrap: wrap; }
.e-strip img { height: 48px; width: auto; }
.e-strip .rule { flex: 1; min-width: 40px; height: 1px; background: linear-gradient(90deg, #b18000, transparent); }
.e-method-body { display: flex; gap: clamp(28px, 4.5vw, 64px); align-items: center; margin-top: 52px; }
.e-num { font-size: clamp(120px, 15.5vw, 220px); line-height: 1; font-weight: 800; flex: none; }
.e-method h2 { font-size: clamp(26px, 2.6vw, 36px); line-height: 1.12; font-weight: 800; }
.e-method .txt { margin-top: 16px; max-width: 720px; font-size: 16px; font-weight: 300; line-height: 1.65; color: #c4c4c4; }
.e-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.e-chips span { border: 1px solid #3a3a3a; padding: 10px 16px; font-size: 13px; font-weight: 500; color: #e6e6e6; }
.e-chips span.hl { border-color: var(--gold-2); color: var(--gold-3); }
.e-get { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 48px; }
.e-get div { border-top: 2px solid var(--gold-2); background: #141414; padding: 18px 20px; font-size: 14px; font-weight: 500; line-height: 1.5; color: #e6e6e6; }
@media (max-width: 980px) { .e-get { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .e-method-body { flex-direction: column; align-items: flex-start; gap: 4px; margin-top: 32px; } .e-num { font-size: 110px; } }
@media (max-width: 480px) { .e-get { grid-template-columns: 1fr; } }