@import url('model-icons.css');
.example-intro,.example-story,.example-next{padding:72px 0;background:#fff;color:#172d42;scroll-margin-top:110px}
.example-intro h2,.example-next h2{font-size:clamp(28px,3vw,40px);line-height:1.2;margin:12px 0 20px;letter-spacing:-.035em}
.example-intro> .container>p{max-width:820px;color:#4c6275}
.example-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:30px 0 22px}
.example-picker a{display:flex;align-items:center;gap:14px;padding:18px;background:#f1f6fa;border:1px solid #dce6ee;border-radius:9px;text-decoration:none;font-weight:650;font-size:15px}
.example-picker a>span:last-child{margin-left:auto;color:#006ac4}.example-picker a:hover{background:#e6f2fc;border-color:#83b7db}
.model-icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;background:#e4f2fe;border-radius:10px;color:#006cc4;font-size:24px}
.example-disclosure{font-size:13px;line-height:1.65}
.example-story{border-top:1px solid #e0e8ef}.example-story:nth-of-type(even){background:#f4f7fa}
.example-layout{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.example-copy h2{font-size:clamp(28px,3vw,39px);line-height:1.2;letter-spacing:-.035em;margin:22px 0 30px}
.example-number{font-size:16px;color:#1477b9;margin-right:10px}.example-copy h3{font-size:15px;margin:0 0 6px}.example-copy p{font-size:16px;line-height:1.75;margin:0}
.example-problem{color:#536676;margin-bottom:22px}.example-gain{border-left:3px solid #087aca;padding-left:20px;margin-bottom:26px}.example-gain h3{color:#0067b2}
.example-visual{background:#fff;border:1px solid #d7e4ef;border-radius:16px;box-shadow:0 16px 42px #1839560a;overflow:hidden}
.example-visual-heading{padding:24px;display:flex;gap:14px;align-items:center;background:#102d45;color:white}
.example-visual-heading span:not(.model-icon){font-size:10px;font-weight:750;letter-spacing:.12em;color:#85caff}.example-visual-heading h3{font-size:17px;line-height:1.4;margin:5px 0 0;color:white}
.example-steps{list-style:none;margin:0;padding:28px 26px 4px;counter-reset:steps}.example-steps li{display:flex;gap:18px;position:relative;padding-bottom:28px}.example-steps li:not(:last-child):before{content:"";position:absolute;left:16px;top:34px;bottom:0;width:1px;background:#c5ddeb}
.example-step-number{width:34px;height:34px;border-radius:50%;background:#e7f4fc;color:#0062aa;display:grid;place-items:center;font-size:14px;font-weight:750;flex-shrink:0}.example-steps h4{font-size:16px;margin:3px 0 5px;color:#163952}.example-steps p{font-size:14px;line-height:1.65;margin:0;color:#516878}
.example-tools{padding:0 26px 24px}.example-tools p{font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:750;color:#536979}.example-tools ul{list-style:none;display:flex;flex-wrap:wrap;gap:7px;padding:0;margin:0}.example-tools li{font-size:12px;padding:6px 10px;border-radius:5px;background:#edf4f8;color:#264c66}
.example-scope{border-top:1px solid #e0e8ef;padding:18px 26px;margin:0;color:#596d7c;font-size:12px;line-height:1.6}
.example-next{background:#eaf4fc}.example-preparation{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px;margin:35px 0}.example-preparation span{color:#0878c5;font-size:13px;font-weight:750}.example-preparation h3{font-size:18px;margin:10px 0}.example-preparation p{font-size:15px;color:#526a7e;line-height:1.7}
.example-picker a:focus-visible,.example-story a:focus-visible{outline:3px solid #087bd2;outline-offset:4px}
.one-site .example-next .button-secondary{color:#075e9c;border-color:#7fa8c6;background:transparent}.one-site .example-next .button-secondary:hover{background:#dcecf8;color:#064778}
@media(max-width:1000px){.example-layout{gap:30px}.example-picker{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.example-intro,.example-story,.example-next{padding:44px 0}.example-layout,.example-preparation{grid-template-columns:1fr;gap:24px}.example-picker{grid-template-columns:1fr}.example-copy h2{margin-top:16px}.example-visual-heading{padding:20px}.example-steps{padding:24px 20px 0}.example-tools,.example-scope{padding-left:20px;padding-right:20px}}