@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
  --black: #0c0c0b;
  --charcoal: #1c1a16;
  --ink: #11100e;
  --ink-soft: #5f584b;
  --paper: #f1ede4;
  --cream: #fffdf7;
  --gold: #c99716;
  --yellow: #e7c342;
  --line: rgba(17,16,14,.15);
  --display: 'Space Grotesk', sans-serif;
  --body: 'Manrope', sans-serif;
  --mono: 'DM Mono', monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--body); -webkit-font-smoothing: antialiased; }
a { color: inherit; }
.seo-header { background: var(--cream); border-bottom: 1px solid var(--line); }
.seo-nav { width: min(1120px, calc(100% - 44px)); margin: auto; min-height: 82px; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.seo-logo { display: block; width: 84px; height: auto; }
.seo-home { font-family: var(--mono); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; border-bottom: 1px solid var(--gold); padding-bottom: 5px; }
.seo-hero { background: var(--black); color: var(--cream); padding: 96px max(22px, calc((100% - 1120px) / 2)) 86px; }
.seo-kicker { color: var(--yellow); font: .67rem var(--mono); letter-spacing: .15em; text-transform: uppercase; }
.seo-hero h1 { max-width: 850px; margin: 21px 0 26px; font: 500 clamp(3rem, 7vw, 6.9rem)/.9 var(--display); letter-spacing: -.085em; }
.seo-hero h1 em { color: var(--yellow); font-style: normal; }
.seo-lead { max-width: 690px; color: rgba(255,253,247,.72); font-size: 1.05rem; line-height: 1.75; margin: 0; }
.seo-wrap { width: min(1120px, calc(100% - 44px)); margin: auto; }
.seo-content { padding: 82px 0 100px; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(230px, .6fr); gap: 92px; }
.seo-article { max-width: 720px; }
.seo-article h2 { margin: 0 0 18px; font: 500 clamp(2rem, 4vw, 3.6rem)/.98 var(--display); letter-spacing: -.07em; }
.seo-article h3 { margin: 36px 0 10px; font: 600 1.25rem/1.15 var(--display); letter-spacing: -.04em; }
.seo-article p, .seo-article li { color: var(--ink-soft); font-size: .96rem; line-height: 1.85; }
.seo-article ul { padding-left: 20px; }
.seo-article li { margin: 9px 0; }
.seo-aside { align-self: start; background: var(--cream); border-top: 3px solid var(--gold); padding: 25px; }
.seo-aside strong { display: block; font: 600 1.35rem/1.05 var(--display); letter-spacing: -.04em; margin-bottom: 16px; }
.seo-aside p { color: var(--ink-soft); font-size: .78rem; line-height: 1.6; margin: 0 0 17px; }
.seo-aside a { display: block; color: var(--black); font: .66rem var(--mono); letter-spacing: .05em; text-transform: uppercase; text-decoration: none; border-top: 1px solid var(--line); padding-top: 14px; }
.seo-cta { background: var(--gold); color: var(--black); padding: 54px max(22px, calc((100% - 1120px) / 2)); }
.seo-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.seo-cta h2 { margin: 0; max-width: 570px; font: 500 clamp(2rem, 4vw, 3.9rem)/.95 var(--display); letter-spacing: -.075em; }
.seo-button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 20px; background: var(--black); color: var(--cream); font: 700 .72rem var(--mono); letter-spacing: .03em; text-decoration: none; white-space: nowrap; }
.seo-footer { background: var(--charcoal); color: var(--cream); padding: 28px max(22px, calc((100% - 1120px) / 2)); display: flex; justify-content: space-between; gap: 22px; align-items: center; }
.seo-footer small { color: rgba(255,253,247,.55); font: .6rem var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.seo-footer a { color: var(--yellow); font: .61rem var(--mono); letter-spacing: .06em; text-transform: uppercase; text-decoration: none; }
.whatsapp-widget { position: fixed; right: 22px; bottom: 22px; z-index: 20; display: flex; align-items: center; gap: 12px; padding: 9px 9px 9px 16px; color: var(--black); background: var(--yellow); box-shadow: 0 14px 30px rgba(0,0,0,.22); border: 1px solid rgba(12,12,11,.24); text-decoration: none; transition: transform .25s, background .25s; }
.whatsapp-widget:hover { transform: translateY(-4px); background: var(--gold); }
.whatsapp-copy { display: grid; gap: 2px; font: .58rem/1.25 var(--mono); letter-spacing: .04em; }
.whatsapp-copy strong { font: 600 .72rem var(--display); letter-spacing: -.02em; }
.whatsapp-copy span { opacity: .72; }
.whatsapp-icon { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 50%; background: var(--black); color: var(--yellow); }
@media (max-width: 760px) {
  .seo-content { grid-template-columns: 1fr; gap: 42px; padding-top: 58px; }
  .seo-hero { padding-top: 70px; padding-bottom: 66px; }
  .seo-cta-inner { display: grid; }
  .seo-footer { align-items: flex-start; flex-direction: column; }
  .whatsapp-widget { right: 14px; bottom: 14px; padding-left: 12px; }
}