/* A secondary acquisition-build offer within the existing GetAttn identity. */
.buyer-site.systems-page { background:#19201c;color:#f7f5ef; }
.buyer-site .header nav { gap:20px; white-space:nowrap; }
.systems-hero { padding:62px 0 68px; }
.systems-hero-grid { display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:7%; }
.systems-hero h1 { font-size:clamp(44px,4.8vw,68px);line-height:1.05;letter-spacing:-.05em;max-width:650px;margin:20px 0 24px; }
.systems-lede { font-size:18px;line-height:1.65;max-width:570px;color:#f7f5efbd; }
.systems-actions { display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin:28px 0; }
.systems-diagram { margin:0;min-width:0; }
.systems-diagram figcaption { font-size:12px;line-height:1.6;margin:16px 12px 0;color:#f7f5efa6;max-width:400px; }
.systems-flow { padding:30px;border:1px solid #f7f5ef29;border-radius:20px;background:linear-gradient(150deg,#303a33,#19201c 80%);box-shadow:0 28px 70px #0003,inset 0 1px 0 #f7f5ef12; }
.systems-flow-brand { display:flex;justify-content:flex-end;margin-bottom:26px; }
.systems-flow-brand img { width:105px;height:auto; }
.systems-flow-nodes { display:grid;gap:30px; }
.system-node { position:relative;display:flex;align-items:center;gap:16px;padding:21px 20px;background:#f7f5ef;color:#19201c;border-radius:10px;box-shadow:0 5px 0 #a8aaa3,0 15px 24px #0002; }
.system-node:not(:last-child):after { content:"";position:absolute;left:41px;top:100%;height:30px;border-left:1px solid #f7f5ef88; }
.system-node-icon { width:40px;height:40px;flex:none;border:1px solid #19201c2e;display:grid;place-items:center;border-radius:50%; }
.system-node strong { font-size:16px;font-weight:600; }
.system-node p { font-size:13px;line-height:1.5;margin:5px 0 0;color:#19201cb8; }
.systems-flow.is-motion-ready .system-node { animation:system-assemble 1.1s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--step-delay,0s);animation-play-state:paused; }
.systems-flow .system-node-1 { --step-delay:.65s; }
.systems-flow .system-node-2 { --step-delay:1.3s; }
.systems-flow.is-motion-ready[data-motion="playing"] .system-node { animation-play-state:running; }
@keyframes system-assemble { from { opacity:0;transform:translateY(18px); } to { opacity:1;transform:translateY(0); } }
.systems-entry { padding-top:0!important; }
.systems-entry-panel { background:#f7f5ef;color:#19201c;padding:48px;border-radius:16px;display:grid;grid-template-columns:1.5fr .6fr;gap:8%;align-items:center; }
.systems-entry-panel .eyebrow { color:#19201c9c; }
.systems-entry-panel h2 { font-size:clamp(30px,3.1vw,44px);line-height:1.12;letter-spacing:-.04em;margin:14px 0 18px;max-width:640px; }
.systems-entry-panel p:not(.eyebrow) { line-height:1.65;font-size:17px;color:#19201cc4;max-width:620px;margin-bottom:24px; }
.systems-entry-panel .button-dark { color:#f7f5ef;background:#19201c; }
.systems-entry-art { min-width:0;display:grid;place-items:center;gap:25px;background:#19201c;border-radius:50%;aspect-ratio:1;padding:28%;box-shadow:inset 0 2px 0 #f7f5ef29,0 15px 24px #19201c1a; }
.systems-entry-art>img { width:80px;max-width:none;filter:drop-shadow(0 4px 0 #8a9087); }
.systems-entry-tools { display:flex;gap:18px;color:#f7f5ef99; }
.systems-entry-tools .icon { width:18px;height:18px; }
.systems-section-heading { display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:end;margin-bottom:36px; }
.systems-page h2 { font-size:clamp(34px,3.5vw,50px);line-height:1.1;letter-spacing:-.04em;margin:0; }
.systems-section-heading>p { color:#f7f5efb8;line-height:1.65;margin:0; }
.systems-build-grid { display:grid;grid-template-columns:1fr 1fr;column-gap:7%; }
.systems-build { display:flex;gap:20px;padding:32px 0;border-top:1px solid #f7f5ef26;min-width:0; }
.systems-build-icon { width:42px;height:42px;flex:none;border:1px solid #f7f5ef33;border-radius:10px;display:grid;place-items:center; }
.systems-build h3 { font-size:26px;line-height:1.18;letter-spacing:-.03em;margin:3px 0 15px; }
.systems-build p { font-size:16px;line-height:1.65;color:#f7f5efa6;margin:0 0 14px; }
.systems-build p.systems-deliverable { color:#f7f5ef;margin:0; }
.systems-page .tools-row { margin-top:20px;padding:28px;background:#f7f5ef;color:#19201c;border-radius:12px; }
.systems-process { background:#f7f5ef;color:#19201c; }
.systems-process-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:6%;margin-top:38px; }
.systems-process-icon { display:grid;place-items:center;width:42px;height:42px;border:1px solid #19201c3d;border-radius:50%;margin-bottom:20px; }
.systems-process h3 { font-size:25px;line-height:1.2;letter-spacing:-.03em;margin:0 0 14px; }
.systems-process p { font-size:16px;line-height:1.65;color:#19201cc4;margin:0; }
.systems-closing>.wrap { border-top:1px solid #f7f5ef29;padding-top:40px;display:flex;gap:36px;align-items:center;justify-content:space-between; }
.systems-closing h2 { max-width:650px; }
.systems-closing p { max-width:630px;color:#f7f5efb8;line-height:1.65;margin:20px 0 0; }
.systems-closing .button { flex:none; }
.faq-list .systems-faq-link { margin-top:14px;display:inline-flex; }
@media(max-width:1050px) { .buyer-site .header nav { display:none; }.buyer-site .menu-toggle { display:block; }.buyer-site .mobile-nav { top:88px; }.systems-hero-grid { gap:5%; }.systems-flow { padding:22px; }.system-node { padding:17px 14px;gap:12px; }.systems-entry-panel { padding:36px; } }
@media(max-width:850px) { .buyer-site .mobile-nav { top:80px; }.systems-hero-grid { grid-template-columns:1fr;gap:38px; }.systems-hero h1 { max-width:700px; }.systems-diagram { max-width:480px;width:100%;margin:auto; }.systems-entry-panel { grid-template-columns:1fr; }.systems-entry-art { display:none; }.systems-build-grid { grid-template-columns:1fr; }.systems-section-heading { grid-template-columns:1fr;gap:20px; }.systems-process-grid { grid-template-columns:1fr;gap:30px; }.systems-process-grid article { border-top:1px solid #19201c2e;padding-top:24px; }.systems-closing>.wrap { align-items:flex-start;flex-direction:column; } }
@media(max-width:600px) { .systems-hero { padding:32px 0 44px; }.systems-hero h1 { font-size:44px; }.systems-lede { font-size:17px; }.systems-actions { gap:20px; }.systems-entry-panel { padding:28px 24px; }.systems-build { gap:15px; }.systems-build h3 { font-size:25px; }.systems-flow { padding:24px 20px; }.systems-page h2 { font-size:36px; } }
@media(prefers-reduced-motion:reduce) { .systems-flow.is-motion-ready .system-node { animation:none;opacity:1;transform:none; } }
@media(max-width:850px) { .systems-flow.is-motion-ready .system-node { animation:none;opacity:1;transform:none; } }
