/* VANTRIX v6 — targeted Solutions page layout refinements.
   Homepage assets & JS remain untouched. */

/* Slightly tighter but still generous vertical rhythm. */
@media (min-width: 801px) {
  .devices-page .device-section { padding-top: 88px; padding-bottom: 88px; }
  .devices-page .device-section-top { margin-bottom: 43px; gap: 36px; }
  .devices-page .device-section h2 { font-size: clamp(31px,3.8vw,60px); }
  .devices-page .device-workspaces h2 { margin-bottom: 32px; }
  .devices-page .workspace-photo { aspect-ratio: 16/7.3; }
  .devices-page .workspace-information { min-height: 130px; }
  .devices-page .device-category-list { margin-bottom: 28px; }
  .devices-page .device-category-list button { padding-block: 19px !important; }
}

/* Crucial bug fix: the image MUST NOT grow when a buying-guidance accordion opens. */
.devices-page .device-gallery-panel[data-state="active"] { align-items: start; }
.devices-page .device-gallery-panel .gallery-photo {
  height: 545px;
  min-height: 0;
  max-height: none;
  align-self: start;
  flex-shrink: 0;
  overflow: hidden;
}
.devices-page .device-gallery-panel .gallery-photo img { height: 100%; }
.devices-page .gallery-information { min-width: 0; }
.devices-page .device-considerations details[open] > p { animation: deviceAccordionReveal .22s ease-out; }
@keyframes deviceAccordionReveal { from { opacity:.35; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }

/* Comparison heading and body must share a predictable column system. */
.devices-page .device-comparison .device-section-top {
  align-items: center;
  gap: 48px;
}
.devices-page .device-comparison .device-section-top > h2 { max-width: 860px; }
.devices-page .device-comparison .device-section-top > p {
  max-width: 280px;
  padding-bottom: 0;
}
.devices-page .device-comparison .comparison-controls {
  grid-template-columns: 26.3% 36.85% 36.85%;
  column-gap: 0;
  align-items: start;
}
.devices-page .device-comparison .comparison-controls > label { padding-right: 28px; }
.devices-page .device-comparison .comparison-controls > span { align-self: center; }
.devices-page .device-comparison .device-comparison-table th,
.devices-page .device-comparison .device-comparison-table td {
  box-sizing: border-box;
  vertical-align: top;
  padding-right: 28px;
}

/* Ecosystem: real VANTRIX wordmark + clear, handsome manufacturer text.
   No unapproved OEM logos or false partner badges. */
.devices-page .device-ecosystem { position:relative; isolation:isolate; }
.devices-page .device-ecosystem .device-width { isolation:isolate; }
.devices-page .device-ecosystem .device-width::after {
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
  right:0;
  top:3px;
  width: clamp(140px,18vw,235px);
  height: 48px;
  opacity:.66;
  background: url('/assets/vantrix-wordmark.webp') center / contain no-repeat;
  mix-blend-mode:multiply;
}
.devices-page .device-ecosystem .device-manufacturers {
  gap: 11px;
  margin: 45px 0 28px;
  display:grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
}
.devices-page .device-ecosystem .device-manufacturers span {
  min-height: 84px;
  padding: 20px 24px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  border: 1px solid #d3dde3;
  background: linear-gradient(145deg,#ffffffad,#e9f1f59c);
  font-size: clamp(23px,2.6vw,35px);
  letter-spacing:-.05em;
  transition: background .25s ease, border-color .25s ease, transform .25s ease;
}
.devices-page .device-ecosystem .device-manufacturers span:hover {
  background: #f9fcff;
  border-color: #8fcadd;
  transform: translateY(-2px);
}
.devices-page .device-ecosystem .device-manufacturers i {
  top: 17px;
  left: auto;
  right: 17px;
  bottom:auto;
  width:5px;
  height:5px;
  background:#2398b3;
}

/* The conversion form should feel like a designed part of the page, not dark empty inputs. */
.devices-page .device-conversion-grid { align-items: start; gap: 6%; }
.devices-page .device-conversion .device-final-copy { padding-top: 17px; }
.devices-page .device-conversion .device-final-copy h2 { font-size: clamp(33px,3.65vw,56px); }
.devices-page .device-quote-form {
  position:relative;
  isolation:isolate;
  border:1px solid #2d5970;
  border-radius:17px;
  padding: 35px;
  background: linear-gradient(150deg,#133149 0%,#0b2133 57%,#071928 100%);
  box-shadow: 0 22px 75px #0005, inset 0 1px 0 #74dff62b;
}
.devices-page .device-quote-form::before {
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  right:0;
  width:74%;
  height:110px;
  border-top-right-radius:17px;
  pointer-events:none;
  background:radial-gradient(ellipse at top right,#34c9ea26,transparent 72%);
}
.devices-page .quote-form-heading .device-micro { color:#6de8ff; }
.devices-page .quote-form-heading h3 { color:#f5fbff; }
.devices-page .quote-form-heading > p { color:#b0c9d8; }
.devices-page .quote-fields { gap:20px 18px; }
.devices-page .quote-fields label { color:#d0e2ed; }
.devices-page .quote-fields input,
.devices-page .quote-fields textarea,
.devices-page .quote-fields select {
  border:1px solid #35566a;
  border-radius:8px;
  background:#0c2032;
  color:#f6fcff;
  box-shadow:inset 0 2px 9px #0002;
  min-height:49px;
  transition: border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.devices-page .quote-fields input:focus,
.devices-page .quote-fields textarea:focus,
.devices-page .quote-fields select:focus {
  border-color:#6cdff3;
  background:#102b40;
  box-shadow:0 0 0 3px #39c7e71b;
  outline:none;
}
.devices-page .quote-fields label:focus-within {color:#dffcff;}
.devices-page .quote-actions .device-button {border-radius:7px;}
.devices-page .quote-privacy { color:#aac1d0; }
.devices-page .quote-status { min-height:20px; }

@media (max-width:1100px) and (min-width:801px) {
  .devices-page .device-gallery-panel .gallery-photo {height:500px;}
  .devices-page .device-quote-form { padding:25px; }
  .devices-page .quote-fields {grid-template-columns:1fr;}
}
@media (max-width:800px) {
  .devices-page .device-gallery-panel .gallery-photo { height:auto; aspect-ratio: 4/3; }
  .devices-page .device-section { padding-top:69px; padding-bottom:69px; }
  .devices-page .device-comparison .comparison-controls {grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:18px;}
  .devices-page .device-comparison .comparison-controls > span {grid-column:1/-1;}
  .devices-page .device-comparison .comparison-controls > label {padding-right:0;}
  .devices-page .device-comparison .device-section-top > p {max-width:480px;}
  .devices-page .device-ecosystem .device-manufacturers {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .devices-page .device-ecosystem .device-manufacturers span {min-height:70px;padding:15px;font-size:clamp(21px,4.5vw,31px);}
  .devices-page .device-ecosystem .device-width::after {width:125px;height:31px;top:0;}
  .devices-page .device-quote-form {padding:25px 22px;}
  .devices-page .device-conversion .device-final-copy {padding:0;}
  .devices-page .device-conversion .device-final-copy h2 {font-size:clamp(31px,5.6vw,43px);}
}
@media (max-width:420px) {
  .devices-page .device-gallery-panel .gallery-photo {aspect-ratio:auto;height:355px;}
  .devices-page .device-ecosystem .device-width::after {display:none;}
  .devices-page .device-ecosystem .device-manufacturers span {min-height:63px;padding:13px;font-size:23px;}
  .devices-page .device-quote-form {padding:22px 16px;}
  .devices-page .quote-fields {grid-template-columns:1fr;}
  .devices-page .device-comparison .comparison-controls {column-gap:14px;}
}
@media (prefers-reduced-motion:reduce) {
  .devices-page .device-considerations details[open]>p,
  .devices-page .device-ecosystem .device-manufacturers span {animation:none;transition:none;}
}