/* ── Design Build Digital — Marketing Theme ───────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --bg:#FFFFFF;
  --bg-2:#FBF9F8;
  --bg-3:#F5F2F0;
  --bg-4:#EBE8E5;
  --border:#E5E2DF;
  --border-2:#D4D0CC;
  --text:#1A1A1A;
  --text-2:#4A4A4A;
  --text-3:#757575;
  --accent:#F06840;
  --accent-hover:#E05A32;
  --accent-dim:rgba(240,104,64,0.08);
  --accent-border:rgba(240,104,64,0.2);
  --green:#059669;
  --green-bg:rgba(5,150,105,0.06);
  --green-border:rgba(5,150,105,0.15);
}
html{scroll-behavior:smooth;}
body{font-family:'DM Sans',sans-serif;font-size:15px;line-height:1.65;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;}

/* ── Shared section styles ──────────────────────────────────────── */
section{padding:88px 48px;}
.section-inner{max-width:1100px;margin:0 auto;}
.section-tag{display:inline-block;font-size:10px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--accent);margin-bottom:14px;}
h2{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:clamp(40px,5vw,64px);letter-spacing:0.01em;line-height:0.95;text-transform:uppercase;margin-bottom:16px;color:var(--text);}
h2 em{font-style:normal;color:var(--accent);}

/* ── Fade-up animation ──────────────────────────────────────────── */
.fade-up{opacity:0;transform:translateY(16px);transition:opacity 0.5s ease,transform 0.5s ease;}
.fade-up.visible{opacity:1;transform:translateY(0);}

/* ── How It Works (shared) ──────────────────────────────────────── */
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);margin-top:44px;}
.step{background:var(--bg-2);padding:32px 28px;position:relative;}
.step-num{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:48px;color:var(--border-2);letter-spacing:0.02em;line-height:1;margin-bottom:16px;}
.step-title{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:20px;letter-spacing:0.04em;text-transform:uppercase;color:var(--text);margin-bottom:10px;}
.step-desc{font-size:13px;color:var(--text-2);line-height:1.7;}
.step-arr{position:absolute;top:38px;right:-9px;width:18px;height:18px;background:var(--accent);display:flex;align-items:center;justify-content:center;color:#fff;font-size:9px;z-index:1;}

@media(max-width:768px){
  section{padding:56px 20px;}
  .steps-grid{grid-template-columns:1fr;}
  .step-arr{display:none;}
}
