.meth-intro { font-size:17px; color:var(--ink-2); line-height:1.8; max-width:680px; margin-bottom:72px; }

/* FLOW */
.meth-flow { display:flex; flex-direction:column; gap:0; margin-bottom:80px; }
.meth-step { display:grid; grid-template-columns:64px 1fr; gap:0 28px; }
.meth-icon-col { display:flex; flex-direction:column; align-items:center; }
.meth-icon { width:56px; height:56px; border-radius:50%; background:var(--teal); display:flex; align-items:center; justify-content:center; color:var(--cream); flex-shrink:0; border:2px solid var(--teal-2); }
.meth-icon svg { width:26px; height:26px; }
.meth-line { flex:1; width:2px; background:var(--border); margin:8px auto; min-height:32px; }
.meth-step:last-child .meth-line { display:none; }
.meth-content { padding:0 0 48px 0; }
.meth-num { font-family:var(--font-d); font-size:11px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--amber-2); margin-bottom:8px; }
.meth-title { font-family:var(--font-d); font-size:clamp(19px,2.2vw,26px); font-weight:900; color:var(--teal); margin-bottom:14px; letter-spacing:-0.02em; }
.meth-body { font-size:15px; color:var(--ink-2); line-height:1.85; margin-bottom:20px; max-width:640px; }
.meth-deliverable { display:flex; align-items:flex-start; gap:10px; background:var(--cream-2); border:1px solid var(--border); border-radius:10px; padding:16px 20px; max-width:640px; }
.meth-deliverable-label { font-family:var(--font-d); font-size:10px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--teal); flex-shrink:0; padding-top:2px; }
.meth-deliverable-text { font-size:13px; color:var(--ink-2); line-height:1.65; }

/* TIMELINE */
.meth-timeline { border:1px solid var(--border); border-radius:16px; overflow:hidden; display:grid; grid-template-columns:repeat(3,1fr); }
.mt-item { padding:36px 32px; border-right:1px solid var(--border); }
.mt-item:last-child { border-right:none; }
.mt-num { font-family:var(--font-d); font-size:clamp(32px,4vw,44px); font-weight:900; letter-spacing:-0.03em; color:var(--teal); line-height:1; margin-bottom:10px; }
.mt-num .amber { color:var(--amber); }
.mt-label { font-family:var(--font-d); font-size:13px; font-weight:800; color:var(--teal); margin-bottom:6px; }
.mt-body { font-size:12px; color:var(--ink-3); line-height:1.6; }

/* CLIENT EXPERIENCE */
.eng-list { display:flex; flex-direction:column; gap:20px; }
.eng-stage { border:1px solid var(--border); border-radius:16px; padding:40px 44px; background:var(--cream); position:relative; overflow:hidden; }
.eng-stage::before { content:''; position:absolute; top:0; left:0; width:100%; height:3px; background:var(--amber); }
.eng-stage-num { font-family:var(--font-d); font-size:11px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--amber-2); margin-bottom:10px; }
.eng-stage-title { font-family:var(--font-d); font-size:clamp(19px,2.2vw,24px); font-weight:900; color:var(--teal); margin-bottom:14px; letter-spacing:-0.02em; }
.eng-stage-body { font-size:15px; color:var(--ink-2); line-height:1.85; max-width:680px; }
.eng-substack { margin-top:22px; }
.eng-sublabel { font-family:var(--font-d); font-size:10px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--teal); margin-bottom:10px; }
.eng-taglist { display:flex; flex-wrap:wrap; gap:8px; }
.eng-chip { font-family:var(--font-d); font-size:10px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--teal); background:var(--teal-ghost); padding:7px 14px; border-radius:100px; }

/* BUILD LOOP DIAGRAM */
.loop-diagram { margin:28px 0 8px; }
.loop-nodes { display:flex; align-items:flex-start; gap:8px; max-width:520px; }
.loop-node { display:flex; flex-direction:column; align-items:center; text-align:center; flex:1; }
.loop-icon { width:44px; height:44px; border-radius:50%; background:var(--teal); color:var(--cream); display:flex; align-items:center; justify-content:center; margin-bottom:8px; flex-shrink:0; }
.loop-icon svg { width:20px; height:20px; }
.loop-node-label { font-family:var(--font-d); font-size:12px; font-weight:800; color:var(--teal); }
.loop-arrow-between { color:var(--amber-2); font-size:18px; font-weight:700; flex-shrink:0; padding-top:10px; }
.loop-return { display:block; width:100%; max-width:520px; height:36px; color:var(--amber); margin-top:2px; }
.loop-repeat-label { font-size:12px; color:var(--ink-3); font-style:italic; margin-top:4px; max-width:520px; }

.contact-alt-link { font-family:var(--font-d); font-weight:700; color:var(--teal); text-decoration:none; border-bottom:2px solid var(--amber); transition:color 0.2s; }
.contact-alt-link:hover { color:var(--teal-2); }

/* CTA */
.cta { padding:120px 56px; background:var(--teal-3); position:relative; overflow:hidden; text-align:center; }
.cta-glow { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:600px; height:400px; background:radial-gradient(ellipse,rgba(245,168,0,0.09) 0%,transparent 65%); pointer-events:none; }
.cta-inner { position:relative; z-index:1; max-width:580px; margin:0 auto; }
.cta-title { font-family:var(--font-d); font-weight:900; font-size:clamp(32px,4vw,52px); letter-spacing:-0.02em; line-height:1.05; color:var(--cream); margin-bottom:16px; }
.cta-title .amber { color:var(--amber); }
.cta-sub { font-size:17px; color:rgba(242,239,233,0.45); line-height:1.8; margin-bottom:40px; }
.cta-actions { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.btn-outline { font-family:var(--font-d); font-size:15px; font-weight:600; color:rgba(242,239,233,0.5); text-decoration:none; padding:15px 8px; display:inline-flex; align-items:center; gap:6px; transition:color 0.2s; }
.btn-outline:hover { color:var(--cream); }

@media(max-width:960px){
  .meth-step{grid-template-columns:48px 1fr;gap:0 18px;}
  .meth-icon{width:44px;height:44px;}
  .meth-icon svg{width:20px;height:20px;}
  .meth-timeline{grid-template-columns:1fr;}
  .mt-item{border-right:none;border-bottom:1px solid var(--border);}
  .mt-item:last-child{border-bottom:none;}
  .eng-stage{padding:28px 24px;}
  .loop-icon{width:36px;height:36px;}
  .loop-icon svg{width:16px;height:16px;}
  .loop-node-label{font-size:10px;}
}
@media(max-width:600px){
  .cta-actions{flex-direction:column;align-items:center;}
}
