.caller-hero { background-color:#f8fbff; }
.caller-hero h1 { margin:17px 0 8px; color:#0b1630; font-size:clamp(40px,4.8vw,58px); line-height:1.2; }
.caller-hero h2 { margin:0 0 18px; color:#18345f; font-size:clamp(23px,2.4vw,30px); line-height:1.5; }
.caller-hero p { margin:0; color:#52647e; font-size:16px; line-height:1.9; }
.caller-text-link { align-self:center; padding:12px 0; color:#235de2; font-size:14px; font-weight:700; }
.caller-tags { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.caller-tags span { padding:7px 12px; border:1px solid #d4e1f2; border-radius:999px; color:#49617f; background:rgba(255,255,255,.72); font-size:12px; }
.caller-soft { background:linear-gradient(180deg,#f7faff,#f3f7ff); }
.caller-intro-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(320px,.65fr); align-items:center; gap:72px; }
.caller-intro h2 { margin:18px 0; font-size:clamp(30px,3.6vw,43px); line-height:1.35; }
.caller-intro p { color:#586a84; line-height:1.9; }
.caller-intro-visual { position:relative; min-width:0; margin:0; padding:22px; border:1px solid #e0e9f7; border-radius:32px; background:radial-gradient(circle at 50% 45%,#fff 0,#f3f8ff 64%,#edf4ff 100%); box-shadow:0 24px 70px rgba(29,78,160,.12); }
.caller-intro-visual:before { content:""; position:absolute; inset:12% 13%; border:1px solid rgba(72,129,235,.12); border-radius:50%; }
.caller-intro-visual img { position:relative; z-index:1; width:100%; height:auto; display:block; }
.caller-intro-visual figcaption { position:relative; z-index:2; display:flex; justify-content:center; flex-wrap:wrap; gap:8px; margin-top:-16px; }
.caller-intro-visual figcaption span { padding:7px 11px; border:1px solid #d9e6f7; border-radius:999px; color:#49617f; background:rgba(255,255,255,.9); box-shadow:0 6px 18px rgba(31,73,143,.08); font-size:11px; font-weight:750; }
.caller-status { position:relative; overflow:hidden; background:#fff; }
.caller-status:before { content:""; position:absolute; top:-170px; left:50%; width:680px; height:300px; transform:translateX(-50%); border-radius:50%; background:radial-gradient(ellipse,rgba(75,120,255,.1),transparent 70%); pointer-events:none; }
.caller-status-grid { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.caller-status-grid article { min-width:0; padding:28px 30px; display:grid; grid-template-columns:62px minmax(0,1fr); align-items:start; gap:20px; border:1px solid #e0e8f4; border-radius:20px; background:linear-gradient(145deg,#fff,#fbfdff); box-shadow:0 12px 36px rgba(31,73,143,.06); }
.caller-status-icon { width:58px; height:58px; display:grid; place-items:center; border-radius:18px; color:#fff; box-shadow:0 10px 24px currentColor; }
.caller-status-icon svg { width:29px; height:29px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.caller-status-icon.status-red { color:#fff; background:linear-gradient(145deg,#ff6c70,#ee3f50); box-shadow:0 12px 25px rgba(238,63,80,.2); }
.caller-status-icon.status-purple { color:#fff; background:linear-gradient(145deg,#7368ff,#5244e7); box-shadow:0 12px 25px rgba(82,68,231,.2); }
.caller-status-icon.status-orange { color:#fff; background:linear-gradient(145deg,#ffbd48,#f39820); box-shadow:0 12px 25px rgba(243,152,32,.2); }
.caller-status-icon.status-green { color:#fff; background:linear-gradient(145deg,#45d391,#1eae72); box-shadow:0 12px 25px rgba(30,174,114,.2); }
.caller-status-grid h3 { margin:3px 0 9px; font-size:19px; }
.caller-status-grid p { margin:0; color:#586a84; font-size:14px; line-height:1.85; }
.caller-feature-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.caller-feature-grid article { min-width:0; padding:27px; border:1px solid #dce6f5; border-radius:18px; background:#fff; }
.caller-feature-grid article { box-shadow:0 12px 32px rgba(31,73,143,.055); }
.caller-feature-icon { width:45px; height:45px; display:grid; place-items:center; margin-inline:auto; border-radius:13px; color:#235de2; background:#edf4ff; font-size:12px; font-weight:850; }
.caller-page h3 { color:#203654; }.caller-feature-grid h3 { margin:18px 0 9px; font-size:19px; }
.caller-page article p,.caller-process p { margin:0; color:#586a84; font-size:14px; line-height:1.85; }
.caller-note { margin:22px 0 0; color:#697a92; font-size:12px; line-height:1.8; text-align:center; }
.caller-scenes-layout { display:grid; grid-template-columns:minmax(300px,.82fr) minmax(0,1.35fr); align-items:center; gap:42px; }
.caller-scenes-visual { min-width:0; margin:0; padding:20px; border:1px solid #dce7f6; border-radius:28px; background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(232,242,255,.82)); box-shadow:0 20px 55px rgba(31,73,143,.09); }
.caller-scenes-visual img { width:100%; height:auto; display:block; }
.caller-scene-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.caller-scene-grid article { min-width:0; padding:24px; border:1px solid #dfe7f3; border-radius:15px; background:rgba(255,255,255,.9); }
.caller-scene-grid span { color:#235de2; font-size:11px; font-weight:800; }.caller-scene-grid h3 { margin:8px 0 7px; font-size:19px; }
.caller-process { margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; list-style:none; }
.caller-process li { min-width:0; padding:25px; border-top:2px solid #cddbf1; background:#f8faff; }
.caller-process b { color:#235de2; font-size:24px; }.caller-process h3 { margin:14px 0 7px; font-size:18px; }
@media(max-width:1000px) {
  .caller-intro-grid { grid-template-columns:1fr 320px; gap:36px; }
  .caller-scenes-layout { grid-template-columns:300px minmax(0,1fr); gap:26px; }
  .caller-status-grid article { padding:24px; grid-template-columns:54px minmax(0,1fr); gap:16px; }
  .caller-status-icon { width:52px; height:52px; border-radius:16px; }
  .caller-scene-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .caller-feature-grid,.caller-process { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:700px) {
  .caller-intro-grid { grid-template-columns:1fr; gap:34px; }
  .caller-intro-visual { width:min(440px,100%); margin:auto; padding:14px; }
  .caller-scenes-layout { grid-template-columns:1fr; }
  .caller-scenes-visual { width:min(480px,100%); margin:auto; }
  .caller-status-grid { grid-template-columns:1fr; gap:14px; }
  .caller-status-grid article { padding:21px; }
  .caller-feature-grid,.caller-process,.caller-scene-grid { grid-template-columns:1fr; gap:14px; }
  .caller-feature-grid article,.caller-process li,.caller-scene-grid article { padding:22px; }
  .caller-note { text-align:left; }
}
@media(max-width:380px) {
  .caller-status-grid article { grid-template-columns:44px minmax(0,1fr); gap:13px; padding:18px; }
  .caller-status-icon { width:44px; height:44px; border-radius:13px; }
  .caller-status-icon svg { width:24px; height:24px; }
  .caller-intro-visual figcaption { margin-top:-8px; }
}
