/* Service explanations extend the existing glass/modal system. */
.rf-dialog.rf-dialog--service{width:min(1080px,calc(100vw - 32px));max-height:90dvh;padding:24px 36px 32px;overscroll-behavior:contain;scrollbar-gutter:stable;background:radial-gradient(ellipse at 10% 0%,#30305366,transparent 50%),linear-gradient(135deg,#141b31,#090e1e)}
.rf-dialog--service .dialog-close{position:sticky;top:0;z-index:5;box-shadow:0 8px 22px #080c1dcc;background:#202b45}
.rf-dialog--service #dialog-heading{max-width:760px;font-family:var(--display);font-size:clamp(1.75rem,3.8vw,2.7rem);line-height:1.14;margin:10px 0 20px;letter-spacing:-.045em}
.service-explorer{--example-accent:#a899ff;min-width:0}
.service-explorer-intro{max-width:760px;margin-bottom:28px}
.service-example-label{display:block;color:var(--example-accent);font-size:.875rem;line-height:1.6;font-weight:600}
.service-explorer-intro>p{margin:10px 0 0;line-height:1.7}
.rf-dialog--service .service-example-picker>h3{font-size:1rem;margin:0 0 12px;letter-spacing:0}
.service-example-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.service-example-tabs button{min-height:46px;padding:11px 17px;border:1px solid #424c6b;border-radius:12px;background:#10162a;color:#d1daf1;font:inherit;font-size:.875rem;line-height:1.5;transition:background .2s,border-color .2s,box-shadow .2s}
.service-example-tabs button:hover{background:#222a43;border-color:#8390b3}
.service-example-tabs button[aria-selected=true]{border-color:var(--example-accent);background:#343354;color:#fff;box-shadow:inset 0 0 20px #aa9eff0d}
.service-example-panel{min-width:0}
.service-example-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px;align-items:start}
.service-example-preview{margin:0;min-width:0;border:1px solid #444e72;border-radius:18px;background:linear-gradient(150deg,#232646,#0f1427);overflow:hidden;box-shadow:0 20px 45px #03071344}
.example-preview-bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:15px 20px;border-bottom:1px solid #474e6b;font-size:.75rem;letter-spacing:.07em;color:#c4cee6;background:#11182e}
.example-preview-bar>span:first-child{font-weight:700;color:#edf0ff}
.example-preview-bar>span:last-child{letter-spacing:0}
.example-preview-content{padding:26px 22px 20px}
.example-preview-eyebrow{font-size:.875rem;color:var(--example-accent)}
.rf-dialog--service .example-preview-content h4{font-family:var(--display);font-size:clamp(1.45rem,2.4vw,2rem);line-height:1.2;letter-spacing:-.045em;margin:12px 0}
.rf-dialog--service .example-preview-content>p{font-size:1rem;line-height:1.65;margin:0;color:#c4cde4}
.example-preview-items{display:grid;gap:10px;margin-top:24px}
.example-preview-items>div{display:flex;align-items:center;gap:13px;padding:14px;border:1px solid #41496a;border-radius:12px;background:#12192dbb}
.example-preview-number{display:grid;place-items:center;flex:0 0 32px;height:32px;border:1px solid #536080;border-radius:9px;font-size:.75rem;color:var(--example-accent)}
.example-preview-items strong{display:block;font-size:.875rem;line-height:1.5;font-weight:600;color:#f1f3ff}
.example-preview-items>div>div>span{display:block;font-size:.875rem;line-height:1.6;color:#bfc9e0;margin-top:3px}
.example-preview-journey{padding:16px 20px;border-top:1px solid #41496a;font-size:.875rem;color:#dae2f6;text-align:center}
.service-example-preview figcaption{padding:12px 18px;background:#0a1020;color:#aebbd5;font-size:.75rem;line-height:1.6;text-align:center}
.service-example-preview--app .example-preview-items>div{border-radius:16px;background:#192537}
.service-example-preview--app .example-preview-content{background:radial-gradient(ellipse at 100% 0%,#367b882b,transparent 70%)}
.rf-dialog--service .service-example-copy h3{font-family:var(--display);font-size:1.5rem;line-height:1.3;margin:12px 0 14px;letter-spacing:-.025em}
.rf-dialog--service .service-example-copy p{font-size:1rem;line-height:1.7;margin:0}
.rf-dialog--service .service-example-copy h4{font-size:1rem;font-weight:600;margin:23px 0 12px}
.rf-dialog--service .service-example-copy ul{list-style:none;padding:0;display:grid;gap:12px}
.rf-dialog--service .service-example-copy li{position:relative;padding-left:24px;font-size:1rem;line-height:1.6}
.service-example-copy li::before{content:'✓';position:absolute;left:0;top:0;color:var(--example-accent)}
.rf-dialog--service .service-example-copy .service-example-tech{font-size:.875rem;line-height:1.7;color:#b8c5df;margin-top:24px;padding-top:20px;border-top:1px solid #3c4562}
.service-example-delivery{margin-top:30px;padding-top:24px;border-top:1px solid #3c4562}
.rf-dialog--service .service-example-delivery h3{font-size:1rem;margin:0 0 16px}
.service-example-delivery ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;padding:0;gap:18px}
.rf-dialog--service .service-example-delivery li{font-size:.875rem;line-height:1.6;display:flex;gap:10px;align-items:start}
.service-example-delivery li>span{font-size:.75rem;line-height:1.6;flex:none;padding:3px 7px;color:var(--example-accent);border:1px solid #41496a;border-radius:7px}
.service-example-footer{margin-top:26px;padding:23px;border:1px solid #41496a;background:#111a2d;border-radius:16px}
.rf-dialog--service .service-example-footer>p{font-size:1rem;line-height:1.6;margin:0 0 15px}
.service-example-actions{display:flex;flex-wrap:wrap;gap:10px}
.rf-dialog--service .service-example-actions .btn{margin:0;min-height:48px;font-size:.875rem;padding:12px 18px;line-height:1.5}
.service-example-footer>small{display:block;font-size:.75rem;line-height:1.6;color:#b3c0d9;margin-top:14px}
.service-example-hint{display:flex;align-items:center;gap:8px;margin-top:17px;color:#c8d6ff;font-size:.875rem;line-height:1.5;font-weight:500}
.service-example-hint::after{content:'↗';transition:transform .2s}
a:hover>.service-example-hint::after{transform:translate(2px,-2px)}
@media(max-width:740px){
  .rf-dialog.rf-dialog--service{width:calc(100vw - 20px);max-height:92dvh;padding:16px 20px 22px;border-radius:20px}
  .service-example-layout{grid-template-columns:minmax(0,1fr);gap:24px}
  .service-example-copy{grid-row:1}
  .service-example-tabs{gap:7px}
  .service-example-tabs button{padding:10px 12px}
  .service-example-delivery ol{grid-template-columns:1fr;gap:14px}
  .service-example-actions{display:grid;grid-template-columns:minmax(0,1fr)}
  .service-example-footer{padding:18px}
}
@media(max-width:380px){.rf-dialog.rf-dialog--service{padding:14px}.service-example-tabs{display:grid;grid-template-columns:1fr}.example-preview-content{padding:20px 16px}}
@media(prefers-reduced-motion:reduce){.service-example-tabs button,.service-example-hint::after{transition:none}}
