/* Premium data composition: the phone bridges the capture row and dashboard. */
.connected-data-system{background:radial-gradient(ellipse at 47% 45%,#063758 0%,#03111d 58%,#020d16 100%)}
@media(min-width:1024px){
 .connected-data-system{--data-width:min(1268px,86vw);--data-inset:calc((100% - var(--data-width))/2);display:grid;grid-template-columns:minmax(0,48fr) minmax(0,24fr) minmax(0,28fr);grid-template-rows:100px 300px auto;column-gap:28px;row-gap:0;padding:0 var(--data-inset) 0}
 .connected-data-system>.technology-wave{position:absolute;top:0;left:0;right:0;width:100%;height:100px;background:#f7f8fb;margin:0}
 .connected-data-system .capture,.connected-data-system .insights{display:contents}
 .connected-data-system .capture .editorial{grid-column:1;grid-row:2;padding:10px 0 0 22px;margin:0;align-self:start;min-width:0}
 .connected-data-system .capture .editorial h2{font-size:clamp(32px,2.9vw,42px)!important;line-height:1.06;letter-spacing:-1.3px;margin:0}
 .connected-data-system .capture .editorial .eyebrow{font-size:11px;letter-spacing:2px;margin:0 0 18px;color:#8bddff}
 .connected-data-system .capture .editorial>p:not(.eyebrow){font-size:17px;line-height:1.4;max-width:490px;margin:18px 0 14px;color:#c5d5e2}
 .connected-data-system .capture .pill{background:#fff;border-color:#fff;color:#071a31;font-size:14px;padding:14px 25px;box-shadow:0 4px 16px #0002}
 .connected-data-system .capture .phone{grid-column:2;grid-row:1/4;align-self:start;justify-self:end;position:relative;top:48px;left:auto;right:auto;bottom:auto;width:250px;max-width:none;height:450px;margin:0 10px 0 0;transform:rotate(6deg);transform-origin:center;z-index:4;padding:30px 12px 12px;box-shadow:0 0 0 3px #aaa,0 0 0 7px #e3e4e4,0 18px 35px #0005}
 .connected-data-system .capture .feedback{grid-column:3;grid-row:2;align-self:start;margin:12px 0 0;gap:12px;z-index:2}
 .connected-data-system .feedback article{padding:16px 18px;border:1px solid #dfe9f2;border-radius:12px}
 .connected-data-system .feedback h3{font-size:14px;margin-bottom:12px;color:#071a31}
 .connected-data-system .feedback blockquote{font-size:18px;line-height:1.25;margin-bottom:12px;gap:10px}
 .connected-data-system .feedback blockquote>span{font-size:38px}
 .connected-data-system .feedback .stars{font-size:27px}
 .connected-data-system .rating strong{font-size:22px;white-space:nowrap}
 .connected-data-system .dashboard-panel{grid-column:1/3;grid-row:3;align-self:start;min-width:0;padding:30px 28px 20px;border-radius:20px;background:linear-gradient(140deg,#061a29,#020c14 55%,#061a29);border-color:#3e85ae;box-shadow:0 0 0 6px #15354d35,0 0 35px #168cff30!important}
 .connected-data-system .dashboard-panel>.eyebrow{font-size:11px;letter-spacing:1.7px;color:#8bddff;margin-bottom:10px}
 .connected-data-system .dashboard-panel>h2{font-size:clamp(26px,2.35vw,34px)!important;line-height:1.12;letter-spacing:-1px;max-width:calc(100% - 190px);margin:0}
 .connected-data-system .dashboard-panel>p:not(.eyebrow){font-size:15px;line-height:1.4;margin:8px 0 20px;color:#c5d5e2}
 .connected-data-system .premium-dashboard-stage{padding-bottom:60px}
 .connected-data-system .premium-live-dashboard{padding:12px;border-color:#25475f;background:linear-gradient(130deg,#04131f,#020a11);border-radius:13px}
 .connected-data-system .dash-nav{gap:10px;margin-bottom:14px;font-size:11px}
 .connected-data-system .dash-nav>strong{font-size:16px;letter-spacing:1px}
 .connected-data-system .dash-nav button{font-size:10px;padding:9px 8px}
 .connected-data-system .dash-nav select{font-size:10px;width:110px;padding:9px}
 .connected-data-system .kpis{gap:10px}
 .connected-data-system .kpis article{padding:16px 12px;background:linear-gradient(125deg,#0a2031,#06131f);border-color:#28475f}
 .connected-data-system .kpis strong{font-size:24px}
 .connected-data-system .kpis span{font-size:11px;line-height:1.25;margin:6px 0}
 .connected-data-system .kpis small{font-size:11px;color:#00db91}
 .connected-data-system .dashboard-panel .dash-charts{grid-template-columns:1.2fr 1fr;gap:12px;margin-top:12px}
 .connected-data-system .dash-charts article{padding:16px;background:linear-gradient(135deg,#081d2b,#05101a);border-color:#29485e}
 .connected-data-system .dash-charts h3{font-size:14px;margin-bottom:20px}
 .connected-data-system .premium-live-dashboard .bar-chart{height:175px}
 .connected-data-system .dash-charts .profile-chart{min-height:175px;gap:18px}
 .connected-data-system .profile-chart li{font-size:12px}
 .connected-data-system .donut{width:130px;height:130px;flex-shrink:0}
 .connected-data-system .premium-dashboard-stage .device-callout{width:28%;scale:.88;padding:14px;background:linear-gradient(130deg,#fff,#f9fcff);box-shadow:0 5px 0 #77baff66,0 12px 25px #0003}
 .connected-data-system .premium-dashboard-stage .callout-samples{left:-75px;top:45px}
 .connected-data-system .premium-dashboard-stage .callout-response{right:-65px;top:66px}
 .connected-data-system .premium-dashboard-stage .callout-audience{left:-62px;bottom:-43px;width:38%}
 .connected-data-system .premium-dashboard-stage .callout-location{right:-50px;bottom:-42px;width:34%}
 .connected-data-system .insight-panel{grid-column:3;grid-row:3;align-self:stretch;display:flex;flex-direction:column;min-width:0;padding:24px 18px 16px;border:1px solid #ddecf4;border-radius:16px;background:linear-gradient(135deg,#f1fbff,#dfeff7);color:#071a31;position:relative;z-index:2}
 .connected-data-system .insight-panel>.eyebrow{font-size:10px;letter-spacing:1.6px;margin-bottom:14px;color:#6898ba}
 .connected-data-system .insight-panel>h2{font-size:clamp(26px,2.2vw,32px)!important;line-height:1.1;letter-spacing:-1px;margin:0}
 .connected-data-system .insight-panel>p:not(.eyebrow){font-size:12px;line-height:1.4;margin:14px 0;color:#6c839b}
 .connected-data-system .insight-panel .feature-rows{gap:8px;margin-bottom:14px}
 .connected-data-system .feature-row{padding:10px 8px;gap:10px;min-height:64px;background:#ffffffb3;border-radius:12px}
 .connected-data-system .feature-row .icon-tile{width:38px;height:38px;background:transparent}
 .connected-data-system .feature-row strong{font-size:12px;line-height:1.2}
 .connected-data-system .feature-row span span{font-size:10px;line-height:1.3;margin-top:4px}
 .connected-data-system .feature-row>b{font-size:23px;margin-right:0}
 .connected-data-system .insight-panel>.dashboard-device-scene{height:166px;flex-shrink:0;margin-top:auto;background:#dcebf3}
 .connected-data-system>.capability,.connected-data-system>.outputs{grid-column:1/-1;padding-left:22px;padding-right:22px}
 .connected-data-system>.outputs{padding-top:70px}
}
@media(min-width:1024px) and (max-width:1199px){
 .connected-data-system{column-gap:20px;grid-template-rows:90px 330px auto}
 .connected-data-system .capture .phone{width:210px;height:430px;margin-right:0;padding:28px 9px 10px}
 .connected-data-system .capture .editorial{padding-left:0}
 .connected-data-system .capture .editorial>p:not(.eyebrow){font-size:15px}
 .connected-data-system .questionnaire h3{font-size:16px;margin-bottom:12px}
 .connected-data-system .questionnaire label,.connected-data-system .questionnaire legend{font-size:10px}
 .connected-data-system .questionnaire fieldset{margin-bottom:10px}
 .connected-data-system .choices span{font-size:9px;padding:8px 2px}
 .connected-data-system .feedback article{padding:13px}
 .connected-data-system .feedback blockquote{font-size:15px}
 .connected-data-system .feedback .stars{font-size:22px}
 .connected-data-system .dashboard-panel{padding:24px 18px 20px}
 .connected-data-system .dashboard-panel>h2{max-width:calc(100% - 150px)}
 .connected-data-system .dash-nav{flex-wrap:wrap}
 .connected-data-system .dash-nav [role=tablist]{order:3;flex:1 0 100%;justify-content:space-between}
 .connected-data-system .dash-nav select{margin-left:auto}
 .connected-data-system .kpis article{padding:12px 8px}
 .connected-data-system .kpis strong{font-size:20px}
 .connected-data-system .kpis span{font-size:9px}
 .connected-data-system .donut{width:90px;height:90px}
 .connected-data-system .profile-chart li{font-size:10px}
 .connected-data-system .insight-panel{padding:22px 14px 14px}
 .connected-data-system .feature-row{gap:7px}
 .connected-data-system .feature-row .icon-tile{width:29px;height:29px}
}

/* Data Outputs sits directly on the shared background. */
.connected-data-system .outputs{background:transparent;border:0;border-radius:0;box-shadow:none}

/* Keep the samples callout outside the first KPI's text area. */
@media(min-width:1024px){
 .connected-data-system .premium-dashboard-stage .callout-samples{width:22%;scale:.78;left:calc(-17.16% + 8px);padding:12px}
}

/* Samples callout belongs to the location chart, with the key beneath the bars. */
.connected-data-system .premium-live-dashboard .dash-charts>article>h3{text-align:right}
.connected-data-system .premium-live-dashboard .engagement-location-panel{position:relative;overflow:visible}
.connected-data-system .premium-dashboard-stage .dash-charts .callout-samples{position:absolute;left:-55px;right:auto;top:50px;bottom:auto;width:clamp(110px,38%,150px);padding:12px;scale:.85;z-index:3;background:linear-gradient(130deg,#fff,#f9fcff);border:1px solid #d8eaff;border-radius:12px;box-shadow:0 5px 0 #77baff66,0 12px 25px #0003}
.connected-data-system .premium-live-dashboard .chart-legend{position:static;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 16px;margin:12px 0 0;padding:0;font-size:10px;line-height:1.3}
@media(max-width:650px){.connected-data-system .premium-dashboard-stage .dash-charts .callout-samples{left:-12px;top:46px;width:110px;padding:9px}}

/* Align the callout's top with the lower edge of the KPI row above the chart. */
.connected-data-system .premium-dashboard-stage .dash-charts .callout-samples{top:-16px;transform-origin:left top}
@media(max-width:650px){.connected-data-system .premium-dashboard-stage .dash-charts .callout-samples{top:-12px}}

/* Static dashboard branding and navigation labels. */
.connected-data-system .dash-nav .dashboard-brand-logo{display:block;width:92px;height:36px;object-fit:contain;flex-shrink:0}
.connected-data-system .dashboard-view-labels{display:flex;align-items:center;gap:2px;flex:1;white-space:nowrap}
.connected-data-system .dashboard-view-labels>span{display:block;font-size:10px;line-height:1.2;padding:9px 8px;border-radius:5px;color:#bdc9d2;cursor:default}
.connected-data-system .dashboard-view-labels>.is-current{background:#1b303d;color:#fff}
.connected-data-system .dashboard-period{display:block;font-size:10px;line-height:1.2;padding:10px 12px;border-radius:7px;white-space:nowrap;background:#0a1c29;border:1px solid #193347;color:#d7e0e7}
@media(min-width:1024px){
 .connected-data-system .capture .feedback{align-self:end;margin:0 0 20px}
 .connected-data-system .premium-dashboard-stage .callout-location{top:var(--location-callout-top,80%);bottom:auto;transform-origin:right top}
}
@media(max-width:1199px){.connected-data-system .dashboard-view-labels{order:3;flex:1 0 100%;justify-content:space-between}.connected-data-system .dashboard-period{margin-left:auto}}
@media(max-width:650px){.connected-data-system .dash-nav .dashboard-brand-logo{width:72px;height:28px}.connected-data-system .dashboard-view-labels>span{font-size:8px;padding:7px 5px}.connected-data-system .dashboard-period{font-size:8px;padding:7px}}

/* Verified profile UI, contained within the existing capture phone. */
.connected-data-system .verified-interaction{height:100%;min-height:0;display:flex;flex-direction:column;color:#071a31;font-family:inherit}
.connected-data-system .verified-profile-heading{display:flex;align-items:center;gap:7px;margin:0 0 12px;flex-shrink:0}
.connected-data-system .verified-profile-heading h3{margin:0;flex:1;font-size:13px;line-height:1.15;font-weight:600;letter-spacing:-.25px}
.connected-data-system .verified-avatar{width:28px;height:28px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;background:#eaf4ff;color:#168aff}
.connected-data-system .verified-avatar svg{width:20px;height:20px}
.connected-data-system .verified-status{display:grid;place-items:center;flex-shrink:0;width:17px;height:17px;border-radius:50%;color:#fff;background:linear-gradient(135deg,#26a9e8,#087bff)}
.connected-data-system .verified-status svg{width:13px;height:13px}
.connected-data-system .verified-interaction dl{display:grid;grid-template-rows:repeat(6,minmax(0,1fr)) minmax(0,1.2fr);gap:7px;flex:1;min-height:0;margin:0}
.connected-data-system .verified-field{display:flex;align-items:center;gap:11px;padding:7px 8px;border:1px solid #e0edfd;border-radius:12px;background:linear-gradient(120deg,#fff,#f7fbff);box-shadow:0 3px 9px #168aff04;min-width:0;min-height:0}
.connected-data-system .verified-field-icon{display:grid;place-items:center;width:32px;height:32px;flex-shrink:0;border-radius:10px;background:#eaf4ff;color:#168aff}
.connected-data-system .verified-field-icon svg{width:22px;height:22px}
.connected-data-system .verified-field>div{min-width:0}
.connected-data-system .verified-field dt{font-size:8px;line-height:1.2;letter-spacing:1px;text-transform:uppercase;font-weight:600;color:#7a92b3;margin:0 0 4px}
.connected-data-system .verified-field dd{font-size:13px;line-height:1.2;font-weight:500;color:#071a31;margin:0}
.connected-data-system .verified-field:last-child dd{font-size:11px}
@media(min-width:1200px){.connected-data-system .capture .phone{height:520px;top:-22px}}
@media(min-width:1024px) and (max-width:1199px){.connected-data-system .capture .phone{height:510px;top:-32px}.connected-data-system .verified-profile-heading{gap:5px}.connected-data-system .verified-profile-heading h3{font-size:11px}.connected-data-system .verified-field{gap:8px;padding:6px}.connected-data-system .verified-field-icon{width:27px;height:27px}.connected-data-system .verified-field-icon svg{width:20px;height:20px}.connected-data-system .verified-field dt{font-size:7px;letter-spacing:.7px}.connected-data-system .verified-field dd{font-size:12px}.connected-data-system .verified-field:last-child dd{font-size:10px}}
@media(min-width:651px) and (max-width:1023px){.connected-data-system .phone{height:620px}}
@media(max-width:650px){.connected-data-system .phone{height:580px}}
/* Keep the measured location position; only lift its dashboard stacking layer. */
.connected-data-system .dashboard-panel{z-index:3}

/* White insight surface with raised feature rows and unframed devices. */
.connected-data-system .insight-panel{background:#fff}
.connected-data-system .insight-panel .feature-row{background:#fff;box-shadow:0 4px 14px #15354e0d,0 1px 3px #15354e08}
.connected-data-system .insight-panel>.dashboard-device-scene{background:transparent}

/* A compact, consistent line-icon set in the pre-verified trial bars' blue. */
.connected-data-system .insight-panel .feature-row .icon-tile{width:32px;height:32px;border-radius:9px;border:0;background:#32a5ed0d;color:#32a5ed}
.connected-data-system .insight-panel .icon-tile .icon{display:block;width:21px;height:21px;color:#32a5ed}
.connected-data-system .insight-panel .feature-row>b{color:#32a5ed}

/* Expand the location illustration across the existing floating white card. */
.connected-data-system .callout-location .location-map-data{display:grid;grid-template-columns:minmax(0,40fr) minmax(0,60fr);gap:6px;align-items:center;height:125px;width:100%}
.connected-data-system .premium-dashboard-stage .callout-location .location-map-data svg{display:block;width:100%;height:100%;max-height:none;min-width:0}
@media(max-width:650px){.connected-data-system .callout-location .location-map-data{height:92px;gap:3px}}
