/* Shared etched glass surfaces. Static gradients and small inset highlights
   give the approved cards depth without new filters or animation. */
:root{
 --panel-edge:linear-gradient(125deg,#91c7ed 0%,#597faa 24%,#405c8c 46%,#716098 74%,#b18cc8 100%);
 --panel-edge-soft:linear-gradient(125deg,#6485a6 0%,#344e70 38%,#4d426c 72%,#88729f 100%);
 --panel-fill:linear-gradient(130deg,#07121d,#030910 75%);
 --panel-bevel:inset 0 1px 0 #b3deff20,inset 0 -1px 0 #040610b3;
 --panel-depth:0 6px 18px #0005,0 0 8px #426ad51a;
}

/* Primary frames: the same palette and depth at every viewport size. */
.home-phase-one :is(.glass-panel,.system-panel,.system-status,.proof-item),
.services-page .glass-panel,
.contact-page .glass-panel,
.not-found .error-code{
 border-color:transparent;
 background:var(--panel-fill) padding-box,var(--panel-edge) border-box;
 box-shadow:var(--panel-bevel),var(--panel-depth);
}

/* Smaller framed content uses a quieter edge so the outer card reads first. */
body :is(.ecosystem-module,.mini-site,.profile-card,.metric,.care-grid>div,
 .support-response,.builder-browser,.builder-services>span,.builder-phone>i,
 .time-list>span,.call-panel,.message-panel,.next-panel,.handoff,
 .order-receipt,.order-recent,.google-insights>div,.health-grid>div,
 .monitor-grid>div,.connected-modules>div,.kit-mini>div),
.system-panel .confirm-row,
.compact-preview .preview-browser{
 border-color:transparent;
 background:linear-gradient(135deg,#08131f,#030a12) padding-box,var(--panel-edge-soft) border-box;
 box-shadow:inset 0 1px 0 #add7ff14,inset 0 -1px 0 #02050b80;
}
.builder-phone{
 border-color:transparent;
 background:linear-gradient(#030914,#030914) padding-box,var(--panel-edge) border-box;
 box-shadow:inset 0 1px 0 #d4e7ff33,0 20px 40px #000;
}

/* Preserve borderless mobile steps and the hero's shaped connected label. */
@media(min-width:601px){
 .home-phase-one .clarity-map .map-step{
  border-color:transparent;
  background:linear-gradient(135deg,#07121e,#030810) padding-box,var(--panel-edge-soft) border-box;
  box-shadow:var(--panel-bevel);
 }
}
@media(max-width:600px){
 .home-phase-one .map-icon{
  border-color:transparent;
  background:linear-gradient(135deg,#07121e,#030810) padding-box,var(--panel-edge) border-box;
  box-shadow:var(--panel-bevel);
 }
}

/* Conversation bubbles keep their original fills and selected/success colors.
   Inset edges add definition without changing their dimensions. */
.chat-bubble{
 box-shadow:inset 0 1px 0 #89b7eb38,inset 1px 0 0 #668abe24,
  inset -1px 0 0 #9474c43b,inset 0 -1px 0 #6d619638;
}
.chat-bubble.out{box-shadow:inset 0 1px 0 #a3caff4a,inset -1px -1px 0 #b390e63b}
.care-icons>i{border-color:#53688f #6f588c #594e7b #4d7596}
.g-tabs{border-color:#587aa2 #786095 #445174 #587aa2;box-shadow:inset 0 1px 0 #add7ff14}
.time-list>b{border-color:#668de0 #9c7dd8 #796bb1 #668de0;box-shadow:inset 0 1px 0 #adcaff28}
.confirm-banner{border-color:#4b9c9b #547d92 #447c80 #4b9c9b;box-shadow:inset 0 1px 0 #a7e8dc16}

/* Bring the approved Contact process treatment to desktop as well. */
.contact-page .contact-steps{
 position:relative;
 background:linear-gradient(130deg,#06111b,#030910 75%) padding-box,
  linear-gradient(135deg,#778da5,#3b698c 36%,#414960 63%,#796293) border-box;
}
.contact-page .contact-step-circuits{
 position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0;
}
.contact-page .contact-steps>:not(.contact-step-circuits){position:relative;z-index:1}
.contact-page .contact-steps:has(.contact-step-circuits) .contact-step:after{display:none}
.contact-page .contact-step>strong{
 position:relative;border-color:transparent;
 background:radial-gradient(circle at 8% 0%,#3464a855,transparent 55%),
  linear-gradient(140deg,#091827,#02070d) padding-box,
  linear-gradient(135deg,#80caff,#506db2 36%,#555a8b 66%,#aa7cce) border-box;
 box-shadow:inset 0 1px 0 #a6dfff24,0 0 9px #397bee22;
}
.contact-page .contact-step>strong:before{
 content:'';position:absolute;left:5px;top:-4px;width:10px;height:7px;pointer-events:none;
 background:radial-gradient(ellipse,#a9dfff 0%,#328eff80 23%,#328eff00 72%);
}
.contact-page .contact-step>div{
 border-color:transparent;
 background:linear-gradient(135deg,#07101b,#02070d) padding-box,
  linear-gradient(125deg,#7da6cc,#446684 42%,#665083 74%,#9a7db5) border-box;
 box-shadow:inset 0 1px 0 #add7ff14,inset 0 -1px 0 #02050b80;
}
.contact-page .contact-ready{
 border-color:transparent;
 background:linear-gradient(135deg,#07101b,#02070d) padding-box,
  linear-gradient(115deg,#617e8e,#3f5068 55%,#756281) border-box;
 box-shadow:var(--panel-bevel);
}

/* Quiet matching field and popup frames; active feedback remains stronger. */
.contact-page .form-row :is(input,textarea,select),
.contact-page .service-select-trigger{
 border-color:transparent;
 background:linear-gradient(#020711,#020711) padding-box,var(--panel-edge-soft) border-box;
 box-shadow:inset 0 1px 3px #0008;
}
.contact-page .form-row :is(input,textarea,select):focus,
.contact-page .service-select-trigger:is(:focus-visible,[aria-expanded="true"]){
 border-color:#a99bff;box-shadow:var(--interaction-glow);
}
.lang-menu,.service-select-list{
 border-color:transparent;
 background:linear-gradient(#080d1b,#080d1b) padding-box,var(--panel-edge-soft) border-box;
 box-shadow:var(--panel-bevel),0 10px 28px #000b,0 0 12px #6664d622;
}
@media(hover:hover){
 .services-page .service-card:hover{
  border-color:transparent;
  background:var(--panel-fill) padding-box,
   linear-gradient(125deg,#b8e5ff,#7ca8ed 34%,#9382d3 65%,#d3abed) border-box;
  box-shadow:var(--panel-bevel),0 0 0 1px #8375d533,0 0 15px #586edc33;
 }
 .contact-page .form-row :is(input,textarea,select):hover,
 .contact-page .service-select-trigger:hover{border-color:var(--interaction-edge);box-shadow:var(--interaction-glow)}
}
.services-page .service-card:focus-visible{box-shadow:var(--panel-bevel),var(--interaction-glow)}