/* ==========================================================================
   the-seo-company — shared stylesheet
   Editorial / trade-press design system: paper background, serif display
   type, mono labels, flat ink + one accent color. No gradients, no blur,
   no glassmorphism, no floating decoration.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,500;1,9..144,600&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

/* ---- Design tokens ---- */
:root{
  --bg:#F7F3E8;
  --bg-panel:#FFFEFB;
  --bg-alt:#EFE9D8;
  --bg-dark:#17140F;

  --ink:#17140F;
  --ink-soft:#5B564A;
  --ink-faint:#8E876F;

  --accent:#C23B22;
  --accent-ink:#8E2A18;
  --accent-soft:#F3DCD3;

  --line:#D9D0B7;
  --line-strong:#17140F;
  --line-dark:#3A362B;

  --radius-sm:3px;
  --radius:4px;
  --radius-lg:6px;

  --container: 1180px;
  --font-serif: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', 'SF Mono', 'Courier New', monospace;
}

/* ---- Reset ---- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; }
input,textarea,select{ font-family:inherit; font-size:inherit; }
h1,h2,h3,h4{ font-family:var(--font-serif); font-weight:600; line-height:1.08; letter-spacing:-0.01em; color:var(--ink); }
h1{ font-size:clamp(2.6rem,5vw,4.2rem); }
h2{ font-size:clamp(2rem,3.4vw,2.75rem); }
h3{ font-size:1.32rem; font-weight:600; }
p{ color:var(--ink-soft); }
.container{ width:100%; max-width:var(--container); margin:0 auto; padding:0 24px; }
section{ position:relative; }

/* ---- Utility ---- */
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-mono); font-size:.74rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink); background:transparent; border:1px solid var(--line-strong);
  padding:6px 12px; border-radius:var(--radius-sm);
  margin-bottom:20px;
}
.section-head{ max-width:640px; margin-bottom:56px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head p{ margin-top:14px; font-size:1.08rem; }
.pad{ padding:96px 0; }
.pad-sm{ padding:64px 0; }
.bg-alt{ background:var(--bg-alt); }
.bg-dark{ background:var(--bg-dark); color:#F7F3E8; }
.bg-dark h1,.bg-dark h2,.bg-dark h3{ color:#F7F3E8; }
.bg-dark p{ color:#B9B29B; }
.text-center{ text-align:center; }
.accent-text{ color:var(--accent); }
.divider{ height:1px; background:var(--line); border:0; }
mark{ background:transparent; color:var(--accent); font-style:italic; }

/* ---- Buttons ---- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 24px; border-radius:var(--radius-sm);
  font-weight:600; font-size:.92rem; border:1.5px solid transparent;
  transition:background .15s ease, color .15s ease, border-color .15s ease, transform .1s ease;
  white-space:nowrap;
  font-family:var(--font-body);
}
.btn-primary{ background:var(--ink); color:var(--bg); border-color:var(--ink); }
.btn-primary:hover{ background:var(--bg-dark); }
.btn-accent{ background:var(--accent); color:#fff; border-color:var(--accent); }
.btn-accent:hover{ background:var(--accent-ink); border-color:var(--accent-ink); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--line-strong); }
.btn-ghost:hover{ background:var(--ink); color:var(--bg); }
.btn-ghost-light{ background:transparent; color:#F7F3E8; border-color:#5B564A; }
.btn-ghost-light:hover{ background:#F7F3E8; color:var(--ink); }
.btn-block{ width:100%; }
.btn-sm{ padding:9px 16px; font-size:.82rem; }
.btn svg{ width:16px; height:16px; }
.btn:active{ transform:translateY(1px); }

/* ---- Header / Nav ---- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:var(--bg);
  border-bottom:1.5px solid var(--line-strong);
}
.nav{ display:flex; align-items:center; justify-content:space-between; padding:18px 0; }
.brand{ display:flex; align-items:center; gap:10px; font-family:var(--font-serif); font-weight:600; font-size:1.28rem; color:var(--ink); }
.brand-mark{
  width:32px; height:32px; border:1.5px solid var(--line-strong); border-radius:var(--radius-sm); background:var(--ink);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.brand-mark svg{ width:16px; height:16px; }
.brand small{ font-family:var(--font-mono); font-weight:500; color:var(--ink-faint); font-size:.68rem; display:block; letter-spacing:.02em; }

.nav-links{ display:flex; align-items:center; gap:32px; }
.nav-links a{
  font-family:var(--font-mono); font-weight:500; font-size:.82rem; letter-spacing:.02em; color:var(--ink-soft);
  position:relative; padding:6px 0; transition:color .15s ease; text-transform:uppercase;
}
.nav-links a:hover, .nav-links a.active{ color:var(--ink); }
.nav-links a.active::after{
  content:''; position:absolute; left:0; right:0; bottom:-4px; height:2px; background:var(--accent);
}
.nav-cta{ display:flex; align-items:center; gap:14px; }
.nav-toggle{
  display:none; flex-direction:column; gap:5px; background:none; border:0; padding:8px;
}
.nav-toggle span{ width:22px; height:2px; background:var(--ink); transition:transform .2s ease, opacity .2s ease; }

.mobile-menu{
  display:none; flex-direction:column; gap:4px; padding:12px 24px 24px;
  border-top:1.5px solid var(--line-strong); background:var(--bg);
}
.mobile-menu a{ padding:12px 4px; font-family:var(--font-mono); font-size:.85rem; text-transform:uppercase; font-weight:500; color:var(--ink-soft); border-bottom:1px solid var(--line); }
.mobile-menu a:last-of-type{ border-bottom:0; }
.mobile-menu.open{ display:flex; }
.mobile-menu .btn{ margin-top:12px; }

@media (max-width:860px){
  .nav-links, .nav-cta{ display:none; }
  .nav-toggle{ display:flex; }
}
@media (max-width:420px){
  .brand{ font-size:1.05rem; white-space:nowrap; }
}

/* ---- Hero ---- */
.hero{ padding:80px 0 100px; }
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:64px; align-items:center; }
.hero h1{ margin-bottom:22px; }
.hero-lead{ font-size:1.14rem; max-width:520px; margin-bottom:34px; font-family:var(--font-serif); font-style:italic; color:var(--ink-soft); }
.hero-cta{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:36px; }
.hero-proof{ display:flex; align-items:center; gap:12px; padding-top:18px; border-top:1px solid var(--line); }
.hero-proof-text{ font-family:var(--font-mono); font-size:.78rem; color:var(--ink-soft); letter-spacing:.02em; }
.hero-proof-text strong{ color:var(--ink); }

.hero-visual{ position:relative; }
.hero-card{
  background:var(--bg-panel); border:1.5px solid var(--line-strong); border-radius:var(--radius-lg);
  padding:30px; position:relative; z-index:2;
}
.hero-card-head{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:6px 14px; margin-bottom:22px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.hero-card-head span{ font-family:var(--font-mono); font-size:.72rem; font-weight:600; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; }
.hero-metric{ display:flex; align-items:baseline; gap:10px; margin-bottom:6px; }
.hero-metric .num{ font-family:var(--font-serif); font-size:2.6rem; font-weight:600; }
.hero-metric .delta{
  display:inline-flex; align-items:center; gap:4px; background:var(--accent-soft); color:var(--accent-ink);
  font-family:var(--font-mono); font-size:.74rem; font-weight:600; padding:4px 9px; border-radius:var(--radius-sm);
}
.hero-chart{ display:flex; align-items:flex-end; gap:7px; height:90px; margin:22px 0 8px; }
.hero-chart i{ flex:1; background:var(--line); border-radius:1px 1px 0 0; }
.hero-chart i.on{ background:var(--ink); }
.hero-card-row{ display:flex; justify-content:space-between; padding:12px 0; border-top:1px solid var(--line); font-family:var(--font-mono); font-size:.82rem; }
.hero-card-row span:first-child{ color:var(--ink-soft); }
.hero-card-row span:last-child{ font-weight:600; }

@media (max-width:980px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-visual{ order:-1; max-width:460px; margin:0 auto; }
}

/* ---- Logo strip ---- */
.logo-strip{ padding:36px 0; border-bottom:1.5px solid var(--line-strong); border-top:1.5px solid var(--line-strong); }
.logo-strip p{ text-align:center; font-family:var(--font-mono); font-size:.72rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:24px; }
.logo-row{ display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; }
.logo-row span{ font-family:var(--font-serif); font-weight:600; font-size:1.1rem; color:var(--ink-faint); letter-spacing:-.01em; }

/* ---- Cards / grids ---- */
.grid{ display:grid; gap:24px; }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }
.grid-2{ grid-template-columns:repeat(2,1fr); }
@media (max-width:900px){ .grid-3,.grid-4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .grid-3,.grid-4,.grid-2{ grid-template-columns:1fr; } }

.card{
  background:var(--bg-panel); border:1.5px solid var(--line-strong); border-radius:var(--radius);
  padding:30px; transition:border-color .15s ease, background .15s ease;
}
.card:hover{ border-color:var(--accent); }
.card-icon{
  width:40px; height:40px; border:1.5px solid var(--line-strong); border-radius:var(--radius-sm);
  display:flex; align-items:center; justify-content:center; margin-bottom:20px;
}
.card-icon svg{ width:20px; height:20px; stroke:var(--ink); }
.card h3{ margin-bottom:10px; }
.card p{ font-size:.95rem; }
.card-link{ display:inline-flex; align-items:center; gap:6px; margin-top:16px; font-family:var(--font-mono); font-weight:600; font-size:.8rem; color:var(--accent); text-transform:uppercase; letter-spacing:.02em; }
.card-link svg{ width:14px; height:14px; transition:transform .15s ease; }
.card:hover .card-link svg{ transform:translateX(3px); }

.tag-list{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.tag{ font-family:var(--font-mono); font-size:.72rem; font-weight:500; color:var(--ink-soft); background:transparent; border:1px solid var(--line); padding:5px 10px; border-radius:var(--radius-sm); }

/* ---- Process / steps ---- */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
@media (max-width:900px){ .steps{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .steps{ grid-template-columns:1fr; } }
.step{ position:relative; padding-top:8px; border-top:2px solid var(--line-strong); padding-top:18px; }
.step-num{
  font-family:var(--font-mono); font-weight:600; font-size:.78rem; color:var(--ink-faint);
  margin-bottom:14px; letter-spacing:.05em;
}
.step h3{ font-size:1.1rem; margin-bottom:8px; }
.step p{ font-size:.92rem; }

/* ---- Stats ---- */
.stats-bar{ display:grid; grid-template-columns:repeat(4,1fr); }
@media (max-width:700px){ .stats-bar{ grid-template-columns:repeat(2,1fr); } }
.stat{ text-align:center; padding:8px 16px; border-left:1px solid #3A362B; }
.stat:first-child{ border-left:0; }
@media (max-width:700px){ .stat:nth-child(2n+1){ border-left:0; } }
.stat .num{ font-family:var(--font-serif); font-size:clamp(2rem,4vw,2.8rem); font-weight:600; color:var(--accent); }
.stat .label{ font-family:var(--font-mono); font-size:.74rem; color:#B9B29B; margin-top:8px; letter-spacing:.03em; text-transform:uppercase; }

/* ---- Testimonials ---- */
.testimonial{
  background:var(--bg-panel); border:1.5px solid var(--line-strong); border-radius:var(--radius);
  padding:34px 30px; display:flex; flex-direction:column; height:100%;
}
.stars{ font-family:var(--font-serif); font-size:2.6rem; color:var(--accent); line-height:.6; margin-bottom:6px; font-style:italic; }
.testimonial p{ color:var(--ink); font-family:var(--font-serif); font-style:italic; font-size:1.05rem; flex:1; line-height:1.5; }
.testimonial-who{ display:flex; align-items:center; gap:12px; margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.testimonial-avatar{
  width:34px; height:34px; border:1.5px solid var(--line-strong); border-radius:var(--radius-sm);
  display:flex; align-items:center; justify-content:center; color:var(--ink); font-weight:600; font-family:var(--font-mono); font-size:.72rem;
}
.testimonial-who strong{ display:block; font-size:.88rem; font-family:var(--font-body); }
.testimonial-who span{ font-size:.76rem; color:var(--ink-faint); font-family:var(--font-mono); }

/* ---- CTA banner ---- */
.cta-banner{
  background:var(--bg-dark); border-radius:var(--radius-lg); padding:60px 56px;
  display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap;
  border:1.5px solid var(--bg-dark);
}
.cta-banner h2{ color:#F7F3E8; max-width:480px; margin-bottom:10px; }
.cta-banner p{ color:#B9B29B; max-width:440px; }
.cta-banner-actions{ display:flex; gap:14px; flex-wrap:wrap; }

/* ---- Pricing ---- */
.pricing-toggle{ display:flex; align-items:center; justify-content:center; gap:14px; margin:0 0 48px; }
.pricing-toggle span{ font-family:var(--font-mono); font-weight:500; font-size:.82rem; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.03em; }
.pricing-toggle span.active{ color:var(--ink); }
.switch{ width:48px; height:26px; border-radius:var(--radius-sm); background:var(--ink); position:relative; border:0; flex-shrink:0; }
.switch::after{
  content:''; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:2px; background:var(--bg);
  transition:transform .2s ease;
}
.switch.on{ background:var(--accent); }
.switch.on::after{ transform:translateX(22px); }
.save-badge{ font-family:var(--font-mono); font-size:.68rem; font-weight:600; color:var(--accent-ink); background:var(--accent-soft); padding:3px 8px; border-radius:var(--radius-sm); }

.price-card{
  background:var(--bg-panel); border:1.5px solid var(--line-strong); border-radius:var(--radius); padding:34px 28px;
  display:flex; flex-direction:column; position:relative;
}
.price-card.featured{ border-color:var(--accent); border-width:2px; }
.price-badge{
  position:absolute; top:-13px; left:28px;
  background:var(--accent); color:#fff; font-family:var(--font-mono); font-size:.68rem; font-weight:600; letter-spacing:.04em;
  padding:5px 12px; border-radius:var(--radius-sm); text-transform:uppercase; white-space:nowrap;
}
.price-card h3{ margin-bottom:6px; }
.price-card .price-desc{ font-size:.88rem; margin-bottom:22px; }
.price-amount-block{ margin-bottom:24px; padding-bottom:24px; border-bottom:1px solid var(--line); }
.price-amount{ display:flex; align-items:baseline; gap:6px; flex-wrap:wrap; }
.price-amount .num{ font-family:var(--font-serif); font-size:1.7rem; font-weight:600; }
.price-amount .per{ color:var(--ink-faint); font-size:.85rem; font-family:var(--font-mono); }
.price-usd{ color:var(--ink-faint); font-size:.82rem; font-family:var(--font-mono); margin-top:6px; }
.price-mpesa{ margin-top:8px; }
.price-features{ display:flex; flex-direction:column; gap:13px; margin-bottom:28px; flex:1; }
.price-features li{ display:flex; align-items:flex-start; gap:10px; font-size:.9rem; color:var(--ink-soft); }
.price-features svg{ width:16px; height:16px; flex-shrink:0; margin-top:3px; stroke:var(--accent); }

/* ---- FAQ / accordion ---- */
.accordion{ max-width:760px; margin:0 auto; }
.acc-item{ border-bottom:1px solid var(--line-strong); }
.acc-q{
  width:100%; text-align:left; background:none; border:0; padding:22px 4px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  font-family:var(--font-serif); font-weight:600; font-size:1.08rem; color:var(--ink);
}
.acc-q .plus{
  width:22px; height:22px; flex-shrink:0; position:relative; transition:transform .2s ease;
}
.acc-q .plus::before,.acc-q .plus::after{ content:''; position:absolute; top:50%; left:50%; background:var(--ink); transform:translate(-50%,-50%); }
.acc-q .plus::before{ width:14px; height:2px; }
.acc-q .plus::after{ width:2px; height:14px; }
.acc-item.open .acc-q .plus{ transform:rotate(45deg); }
.acc-item.open .acc-q .plus::before,.acc-item.open .acc-q .plus::after{ background:var(--accent); }
.acc-a{ max-height:0; overflow:hidden; transition:max-height .25s ease; }
.acc-a p{ padding:0 30px 22px 4px; font-size:.94rem; }
.acc-item.open .acc-a{ max-height:240px; }

/* ---- Forms ---- */
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width:640px){ .form-grid{ grid-template-columns:1fr; } }
.field{ display:flex; flex-direction:column; gap:8px; }
.field.full{ grid-column:1/-1; }
.field label{ font-family:var(--font-mono); font-size:.76rem; font-weight:600; color:var(--ink); text-transform:uppercase; letter-spacing:.03em; }
.field input, .field select, .field textarea{
  border:1.5px solid var(--line-strong); border-radius:var(--radius-sm); padding:13px 15px;
  background:var(--bg-panel); transition:border-color .15s ease;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--accent);
}
.field textarea{ resize:vertical; min-height:130px; }
.field .error{ font-family:var(--font-mono); font-size:.74rem; color:var(--accent); min-height:1em; }
.field.invalid input, .field.invalid select, .field.invalid textarea{ border-color:var(--accent); }
.form-success{
  display:none; text-align:center; padding:60px 20px; border:1.5px dashed var(--line-strong); border-radius:var(--radius-lg);
}
.form-success.show{ display:block; }
.form-success .check{
  width:54px; height:54px; border:1.5px solid var(--line-strong); margin:0 auto 20px;
  display:flex; align-items:center; justify-content:center;
}
.form-success .check svg{ width:24px; height:24px; stroke:var(--accent); }

/* ---- Contact layout ---- */
.contact-grid{ display:grid; grid-template-columns:1.3fr .9fr; gap:48px; align-items:start; }
@media (max-width:900px){ .contact-grid{ grid-template-columns:1fr; } }
.contact-info-card{
  background:var(--bg-dark); color:#F7F3E8; border-radius:var(--radius-lg); padding:34px; display:flex; flex-direction:column; gap:26px;
}
.contact-info-card h3{ color:#F7F3E8; }
.contact-row{ display:flex; gap:14px; align-items:flex-start; }
.contact-row .ic{
  width:36px; height:36px; border:1.5px solid #3A362B; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
}
.contact-row .ic svg{ width:17px; height:17px; stroke:#F7F3E8; }
.contact-row strong{ display:block; font-size:.9rem; margin-bottom:3px; }
.contact-row span, .contact-row a{ font-size:.86rem; color:#B9B29B; font-family:var(--font-mono); }
.social-row{ display:flex; gap:10px; margin-top:6px; }
.social-row a{
  width:36px; height:36px; border:1.5px solid #3A362B;
  display:flex; align-items:center; justify-content:center; transition:border-color .15s ease;
}
.social-row a:hover{ border-color:var(--accent); }
.social-row svg{ width:15px; height:15px; stroke:#F7F3E8; }

/* ---- Team ---- */
.team-card{ text-align:center; }
.team-avatar{
  width:74px; height:74px; border:1.5px solid var(--line-strong); margin:0 auto 18px;
  display:flex; align-items:center; justify-content:center; color:var(--ink); font-family:var(--font-serif);
  font-weight:600; font-size:1.3rem;
}
.team-card h3{ font-size:1.05rem; margin-bottom:2px; }
.team-card .role{ font-family:var(--font-mono); font-size:.76rem; color:var(--accent); font-weight:600; margin-bottom:10px; text-transform:uppercase; letter-spacing:.02em; }
.team-card p{ font-size:.88rem; }

/* ---- Values ---- */
.value-item{ display:flex; gap:16px; }
.value-item .ic{
  width:42px; height:42px; border:1.5px solid var(--line-strong); flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
}
.value-item .ic svg{ width:20px; height:20px; stroke:var(--ink); }
.value-item h3{ font-size:1.05rem; margin-bottom:6px; }
.value-item p{ font-size:.92rem; }

/* ---- Case studies ---- */
.case-card{ overflow:hidden; padding:0; display:flex; flex-direction:column; }
.case-card-top{ padding:28px 28px 0; }
.case-card-industry{ font-family:var(--font-mono); font-size:.72rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--accent); margin-bottom:10px; }
.case-metrics{ display:flex; gap:0; border-top:1px solid var(--line-strong); margin-top:24px; }
.case-metrics div{ flex:1; padding:18px 22px; text-align:center; }
.case-metrics div:first-child{ border-right:1px solid var(--line-strong); }
.case-metrics .num{ font-family:var(--font-serif); font-weight:600; font-size:1.5rem; color:var(--accent); }
.case-metrics .label{ font-family:var(--font-mono); font-size:.7rem; color:var(--ink-faint); margin-top:2px; text-transform:uppercase; }

/* ---- Breadcrumb / page hero ---- */
.page-hero{ padding:56px 0 40px; text-align:center; }
.page-hero .eyebrow{ margin-left:auto; margin-right:auto; }
.page-hero p{ max-width:600px; margin:16px auto 0; font-size:1.05rem; }

/* ---- Footer ---- */
.site-footer{ background:var(--bg-dark); color:#B9B29B; padding:72px 0 28px; }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1.2fr; gap:32px; padding-bottom:56px; }
@media (max-width:900px){ .footer-top{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .footer-top{ grid-template-columns:1fr; } }
.footer-top h4{ color:#F7F3E8; font-family:var(--font-mono); font-size:.76rem; letter-spacing:.05em; text-transform:uppercase; margin-bottom:18px; }
.footer-top ul{ display:flex; flex-direction:column; gap:12px; }
.footer-top a{ font-size:.88rem; color:#B9B29B; transition:color .15s ease; }
.footer-top a:hover{ color:#F7F3E8; }
.footer-brand p{ color:#8C876F; font-size:.86rem; margin:16px 0 20px; max-width:280px; }
.footer-newsletter{ display:flex; gap:8px; margin-top:6px; }
.footer-newsletter input{
  flex:1; min-width:0; padding:11px 14px; border-radius:var(--radius-sm); border:1.5px solid #3A362B;
  background:transparent; color:#F7F3E8; font-size:.85rem;
}
.footer-newsletter input::placeholder{ color:#6B674F; }
.footer-newsletter button{
  background:var(--accent); color:#fff; border:0; border-radius:var(--radius-sm); padding:0 16px; font-weight:600; font-size:.85rem;
}
.footer-bottom{
  border-top:1px solid #3A362B; padding-top:24px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px;
}
.footer-bottom p{ font-family:var(--font-mono); font-size:.78rem; color:#6B674F; }
.footer-legal{ display:flex; gap:22px; }
.footer-legal a{ font-family:var(--font-mono); font-size:.78rem; color:#8C876F; }
.footer-legal a:hover{ color:#F7F3E8; }

/* ---- Reveal on scroll ---- */
.reveal{ opacity:0; transform:translateY(14px); transition:opacity .5s ease, transform .5s ease; }
.reveal.in{ opacity:1; transform:translateY(0); }

/* ---- Misc responsive ---- */
@media (max-width:900px){
  .cta-banner{ padding:44px 30px; flex-direction:column; text-align:center; }
  .cta-banner p{ margin:0 auto; }
  .cta-banner-actions{ justify-content:center; }
}
@media (max-width:640px){
  .pad{ padding:64px 0; }
  h1{ line-height:1.14; }
}