:root {
  --iphix-hub-ink: #07142d;
  --iphix-hub-navy: #071c3e;
  --iphix-hub-blue: #2458ff;
  --iphix-hub-cyan: #1cc9e8;
  --iphix-hub-muted: #61728f;
  --iphix-hub-line: #dce5f2;
  --iphix-hub-soft: #f3f7fc;
}

.iphix-content-hub,
.iphix-about-refresh {
  color: var(--iphix-hub-ink);
  background: #fff;
  overflow: clip;
}

.iphix-content-hub *,
.iphix-about-refresh * {
  box-sizing: border-box;
}

.iphix-hub-hero {
  position: relative;
  padding: clamp(74px, 8vw, 126px) 0 clamp(68px, 7vw, 108px);
  border-bottom: 1px solid var(--iphix-hub-line);
  background:
    radial-gradient(circle at 84% 30%, rgba(28, 201, 232, .16), transparent 27%),
    radial-gradient(circle at 58% 4%, rgba(36, 88, 255, .1), transparent 31%),
    linear-gradient(145deg, #fff 0%, #f7faff 58%, #edf5ff 100%);
}

.iphix-hub-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .43;
  background-image: linear-gradient(rgba(9, 38, 82, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(9, 38, 82, .045) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(to bottom, #000, transparent 88%);
}

.iphix-hub-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(380px, .88fr);
  align-items: center;
  gap: clamp(48px, 7vw, 104px);
}

.iphix-hub-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 28px;
  color: #6d7c96;
  font-size: 12px;
  font-weight: 700;
}

.iphix-hub-breadcrumb a { color: #2458ff; text-decoration: none; }
.iphix-hub-breadcrumb a:hover { text-decoration: underline; }

.iphix-hub-kicker {
  display: block;
  margin-bottom: 16px;
  color: var(--iphix-hub-blue);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.iphix-hub-hero-copy h1 {
  max-width: 780px;
  margin: 0;
  color: var(--iphix-hub-ink);
  font-size: clamp(45px, 5.1vw, 76px);
  line-height: .98;
  letter-spacing: -.055em;
}

.iphix-hub-hero-copy > p {
  max-width: 710px;
  margin: 28px 0 0;
  color: var(--iphix-hub-muted);
  font-size: clamp(17px, 1.45vw, 20px);
  line-height: 1.72;
}

.iphix-hub-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
}

.iphix-hub-actions a { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; }

.iphix-hub-visual {
  position: relative;
  min-height: 470px;
  margin: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(163, 184, 219, .58);
  border-radius: 36px;
  background: linear-gradient(155deg, rgba(255,255,255,.94), rgba(229,239,255,.92));
  box-shadow: 0 38px 90px rgba(23, 62, 127, .16);
  overflow: hidden;
  isolation: isolate;
}

.iphix-hub-visual:before,
.iphix-hub-visual:after {
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(2px);
  z-index: -1;
}

.iphix-hub-visual:before { width: 340px; height: 340px; right: -120px; top: -110px; background: rgba(28, 201, 232, .2); }
.iphix-hub-visual:after { width: 280px; height: 280px; left: -115px; bottom: -110px; background: rgba(36, 88, 255, .14); }

.iphix-hub-visual > img {
  position: relative;
  z-index: 1;
  width: min(80%, 390px);
  max-height: 390px;
  object-fit: contain;
  filter: drop-shadow(0 28px 34px rgba(9, 29, 65, .22));
  transition: transform .55s cubic-bezier(.2,.7,.2,1);
}

.iphix-hub-visual:hover > img { transform: translateY(-7px) rotate(-1deg); }

.iphix-hub-visual.is-photo { display: block; }
.iphix-hub-visual.is-photo > img { width: 100%; max-width: none; height: 100%; max-height: none; object-fit: cover; filter: none; }
.iphix-hub-visual.is-photo:hover > img { transform: scale(1.018); }
.iphix-hub-visual.is-console-photo > img { object-position: center 58%; }
.iphix-hub-photo-credit {
  position:absolute;
  z-index:4;
  top:18px;
  left:18px;
  padding:7px 9px;
  border-radius:9px;
  background:rgba(7,20,45,.78);
  color:#fff;
  font-size:9px;
  font-weight:700;
  line-height:1.2;
  text-decoration:none;
  backdrop-filter:blur(10px);
}
.iphix-hub-photo-credit:hover { background:#07142d; color:#fff; }

.iphix-hub-orbit {
  position: absolute;
  width: 72%;
  aspect-ratio: 1;
  border: 1px solid rgba(36, 88, 255, .2);
  border-radius: 50%;
  animation: iphix-hub-orbit 18s linear infinite;
}

.iphix-hub-orbit:before,
.iphix-hub-orbit:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--iphix-hub-cyan);
  box-shadow: 0 0 0 8px rgba(28, 201, 232, .12);
}
.iphix-hub-orbit:before { top: 8%; left: 22%; }
.iphix-hub-orbit:after { right: 4%; bottom: 26%; background: var(--iphix-hub-blue); box-shadow: 0 0 0 8px rgba(36, 88, 255, .1); }

.iphix-hub-visual figcaption {
  position: absolute;
  z-index: 3;
  right: 24px;
  bottom: 24px;
  width: min(280px, calc(100% - 48px));
  padding: 17px 19px;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 16px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 16px 38px rgba(11, 36, 82, .16);
  backdrop-filter: blur(14px);
}
.iphix-hub-visual figcaption b,
.iphix-hub-visual figcaption small { display: block; }
.iphix-hub-visual figcaption b { font-size: 14px; }
.iphix-hub-visual figcaption small { margin-top: 4px; color: var(--iphix-hub-muted); line-height: 1.45; }

.iphix-hub-symptoms {
  position: relative;
  padding: clamp(68px, 7vw, 100px) 0;
  color: #fff;
  background: linear-gradient(125deg, #061630 0%, #0c2d5d 62%, #113f73 100%);
  overflow: hidden;
}
.iphix-hub-symptoms:after { content:""; position:absolute; width:480px; height:480px; right:-190px; top:-230px; border:72px solid rgba(28,201,232,.08); border-radius:50%; }

.iphix-hub-split {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  gap: clamp(48px, 8vw, 118px);
  align-items: start;
}

.iphix-hub-split h2,
.iphix-hub-section-head h2,
.iphix-hub-faq h2,
.iphix-hub-detail-panel h2,
.iphix-about-principles h2,
.iphix-about-local h2 {
  margin: 0;
  color: inherit;
  font-size: clamp(34px, 3.3vw, 52px);
  line-height: 1.05;
  letter-spacing: -.045em;
}

.iphix-hub-split > div > p { margin: 20px 0 0; color: #b8c8df; font-size: 16px; line-height: 1.7; }
.iphix-hub-split .iphix-hub-kicker { color: #65e5f4; }

.iphix-hub-split ul,
.iphix-hub-detail-panel ul,
.iphix-about-local ul { margin: 0; padding: 0; list-style: none; }

.iphix-hub-split li {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 14px;
  padding: 17px 0;
  border-bottom: 1px solid rgba(255,255,255,.13);
  font-size: 16px;
  line-height: 1.5;
}
.iphix-hub-split li:first-child { padding-top: 4px; }
.iphix-hub-split li svg { width: 20px; color: #54dcf0; }

.iphix-content-hub .iphix-section { padding: clamp(72px, 7.6vw, 112px) 0; }

.iphix-hub-section-head {
  display: flex;
  justify-content: space-between;
  gap: 32px;
  align-items: end;
  margin-bottom: 42px;
}
.iphix-hub-section-head > div > p { margin: 13px 0 0; color: var(--iphix-hub-muted); font-size: 16px; }
.iphix-hub-section-head > a:not(.btn-ghost) { color: var(--iphix-hub-blue); font-size: 14px; font-weight: 800; text-decoration: none; }

.iphix-hub-service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid var(--iphix-hub-line);
  border-radius: 26px;
  overflow: hidden;
  box-shadow: 0 24px 56px rgba(27, 57, 105, .08);
}

.iphix-hub-service-grid > a {
  position: relative;
  min-height: 214px;
  padding: 29px;
  display: flex;
  flex-direction: column;
  color: var(--iphix-hub-ink);
  text-decoration: none;
  background: #fff;
  border-right: 1px solid var(--iphix-hub-line);
  border-bottom: 1px solid var(--iphix-hub-line);
  transition: background .25s ease, transform .25s ease;
}
.iphix-hub-service-grid > a:nth-child(3n) { border-right: 0; }
.iphix-hub-service-grid > a:nth-last-child(-n+3) { border-bottom: 0; }
.iphix-hub-service-grid > a:hover { z-index: 1; background: #f3f7ff; transform: translateY(-3px); }
.iphix-hub-service-grid > a > span { width: 44px; height: 44px; display:grid; place-items:center; border-radius: 13px; color:#fff; background:linear-gradient(135deg,var(--iphix-hub-blue),var(--iphix-hub-cyan)); box-shadow:0 10px 24px rgba(36,88,255,.2); }
.iphix-hub-service-grid > a > span svg { width:20px; }
.iphix-hub-service-grid b { margin-top: 30px; font-size: 18px; }
.iphix-hub-service-grid small { margin-top: 7px; color: var(--iphix-hub-muted); }
.iphix-hub-service-grid > a > svg { position:absolute; right:26px; bottom:25px; width:19px; color:var(--iphix-hub-blue); }

.iphix-hub-models { padding: clamp(74px, 7.5vw, 110px) 0; background: var(--iphix-hub-soft); border-block: 1px solid var(--iphix-hub-line); }

.iphix-hub-model-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid #cad7e9;
}
.iphix-hub-model-grid a {
  min-height: 84px;
  padding: 20px 4px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  color: var(--iphix-hub-ink);
  text-decoration: none;
  border-bottom: 1px solid #cad7e9;
}
.iphix-hub-model-grid a:nth-child(3n+2) { margin-inline: 30px; }
.iphix-hub-model-grid a:hover b { color: var(--iphix-hub-blue); }
.iphix-hub-model-grid b { font-size: 15px; line-height: 1.35; transition: color .2s ease; }
.iphix-hub-model-grid span { display:flex; align-items:center; gap:6px; color:var(--iphix-hub-blue); font-size:12px; font-weight:800; white-space:nowrap; }
.iphix-hub-model-grid span svg { width:15px; }

.iphix-hub-empty { padding: 50px; border: 1px solid var(--iphix-hub-line); border-radius: 22px; background: #fff; }
.iphix-hub-empty h3 { margin:0; font-size:28px; }
.iphix-hub-empty p { margin:12px 0 22px; color:var(--iphix-hub-muted); }

.iphix-hub-process { padding: clamp(74px, 7.5vw, 110px) 0; background:#fff; }
.iphix-hub-steps { margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); list-style:none; border-top:1px solid var(--iphix-hub-line); }
.iphix-hub-steps li { min-height:166px; padding:25px 24px 24px 0; border-bottom:1px solid var(--iphix-hub-line); }
.iphix-hub-steps li + li { padding-left:24px; border-left:1px solid var(--iphix-hub-line); }
.iphix-hub-steps span { display:block; color:#b7c4d6; font-size:32px; font-weight:850; letter-spacing:-.04em; }
.iphix-hub-steps b { display:block; margin-top:37px; font-size:16px; line-height:1.45; }

.iphix-hub-detail-panel { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(45px,8vw,112px); padding:clamp(34px,4vw,58px); border:1px solid var(--iphix-hub-line); border-radius:28px; background:linear-gradient(145deg,#f8fbff,#edf4ff); box-shadow:0 26px 70px rgba(25,57,108,.08); }
.iphix-hub-detail-panel > div > p { margin:18px 0 0; color:var(--iphix-hub-muted); line-height:1.7; }
.iphix-hub-detail-panel li { display:grid; grid-template-columns:28px 1fr; gap:13px; padding:16px 0; border-bottom:1px solid #cfdaea; color:#293953; line-height:1.55; }
.iphix-hub-detail-panel li:last-child { border-bottom:0; }
.iphix-hub-detail-panel li svg { width:19px; color:var(--iphix-hub-blue); }

.iphix-hub-faq { padding:clamp(76px,8vw,118px) 0; background:var(--iphix-hub-navy); color:#fff; }
.iphix-hub-faq-grid { display:grid; grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr); gap:clamp(48px,8vw,120px); align-items:start; }
.iphix-hub-faq .iphix-hub-kicker { color:#61dff2; }
.iphix-hub-faq-grid > div:first-child > p { margin:20px 0 26px; color:#b8c8df; line-height:1.7; }
.iphix-hub-faq .btn-ghost { color:#fff; border-color:rgba(255,255,255,.34); }
.iphix-hub-accordion details { border-bottom:1px solid rgba(255,255,255,.17); }
.iphix-hub-accordion summary { position:relative; padding:22px 42px 22px 0; cursor:pointer; list-style:none; font-size:17px; font-weight:750; }
.iphix-hub-accordion summary::-webkit-details-marker { display:none; }
.iphix-hub-accordion summary svg { position:absolute; right:2px; top:22px; width:20px; color:#61dff2; transition:transform .2s ease; }
.iphix-hub-accordion details[open] summary svg { transform:rotate(180deg); }
.iphix-hub-accordion details p { margin:0; padding:0 42px 22px 0; color:#b8c8df; line-height:1.7; }

.iphix-hub-related { padding:clamp(74px,7vw,105px) 0; background:#fff; }
.iphix-hub-related-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border:1px solid var(--iphix-hub-line); border-radius:22px; overflow:hidden; }
.iphix-hub-related-grid a { min-height:118px; display:flex; justify-content:space-between; align-items:flex-end; gap:12px; padding:25px; color:var(--iphix-hub-ink); text-decoration:none; border-right:1px solid var(--iphix-hub-line); background:#fff; transition:background .2s ease,color .2s ease; }
.iphix-hub-related-grid a:last-child { border-right:0; }
.iphix-hub-related-grid a:hover { background:#f3f7ff; }
.iphix-hub-related-grid a.is-primary { color:#fff; background:linear-gradient(135deg,var(--iphix-hub-blue),#168fdc); }
.iphix-hub-related-grid svg { width:20px; flex:0 0 auto; }

.iphix-about-refresh + .elementor,
.iphix-about-refresh + .elementor-location-single { border-top:1px solid var(--iphix-hub-line); }

.iphix-about-principles { padding:clamp(78px,8vw,118px) 0; color:#fff; background:linear-gradient(125deg,#061630,#0d315f); }
.iphix-about-principles > .iphix-wrap { display:grid; grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr); gap:clamp(48px,8vw,120px); }
.iphix-about-principles > .iphix-wrap > div:first-child p { margin:22px 0 0; color:#b9c9df; line-height:1.72; }
.iphix-about-principles .iphix-hub-kicker { color:#61dff2; }
.iphix-about-principle-list { border-top:1px solid rgba(255,255,255,.16); }
.iphix-about-principle-list article { display:grid; grid-template-columns:58px minmax(0,1fr); padding:24px 0; border-bottom:1px solid rgba(255,255,255,.16); }
.iphix-about-principle-list article > span { grid-row:1/3; color:#61dff2; font-weight:850; }
.iphix-about-principle-list h3 { margin:0; color:#fff; font-size:18px; }
.iphix-about-principle-list p { margin:7px 0 0; color:#b9c9df; line-height:1.6; }

.iphix-about-local { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(45px,7vw,90px); align-items:center; }
.iphix-about-local figure { margin:0; min-height:440px; border-radius:26px; overflow:hidden; box-shadow:0 30px 70px rgba(21,55,108,.15); }
.iphix-about-local figure img { width:100%; height:100%; min-height:440px; object-fit:cover; }
.iphix-about-local ul { margin-top:26px; border-top:1px solid var(--iphix-hub-line); }
.iphix-about-local li { display:grid; grid-template-columns:120px 1fr; gap:20px; padding:14px 0; border-bottom:1px solid var(--iphix-hub-line); }
.iphix-about-local li span { color:var(--iphix-hub-muted); line-height:1.5; }

@keyframes iphix-hub-orbit { to { transform:rotate(360deg); } }

@media (max-width: 1024px) {
  .iphix-hub-hero-grid { grid-template-columns:minmax(0,1fr) minmax(330px,.78fr); gap:42px; }
  .iphix-hub-visual { min-height:410px; }
  .iphix-hub-service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .iphix-hub-service-grid > a:nth-child(3n) { border-right:1px solid var(--iphix-hub-line); }
  .iphix-hub-service-grid > a:nth-child(2n) { border-right:0; }
  .iphix-hub-service-grid > a:nth-last-child(-n+3) { border-bottom:1px solid var(--iphix-hub-line); }
  .iphix-hub-service-grid > a:nth-last-child(-n+2) { border-bottom:0; }
  .iphix-hub-model-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .iphix-hub-model-grid a:nth-child(3n+2) { margin-inline:0; }
  .iphix-hub-model-grid a:nth-child(2n+1) { margin-right:28px; }
  .iphix-hub-related-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .iphix-hub-related-grid a { border-bottom:1px solid var(--iphix-hub-line); }
  .iphix-hub-related-grid a:nth-child(2n) { border-right:0; }
  .iphix-hub-related-grid a:nth-last-child(-n+2) { border-bottom:0; }
}

@media (max-width: 767px) {
  .iphix-hub-hero { padding:48px 0 58px; }
  .iphix-hub-hero-grid,
  .iphix-hub-split,
  .iphix-hub-faq-grid,
  .iphix-hub-detail-panel,
  .iphix-about-principles > .iphix-wrap,
  .iphix-about-local { grid-template-columns:1fr; }
  .iphix-hub-hero-grid { gap:34px; }
  .iphix-hub-breadcrumb { margin-bottom:22px; }
  .iphix-hub-hero-copy h1 { font-size:clamp(40px,12vw,57px); }
  .iphix-hub-hero-copy > p { margin-top:22px; font-size:16px; line-height:1.65; }
  .iphix-hub-actions { display:grid; grid-template-columns:1fr; margin-top:26px; }
  .iphix-hub-actions a { width:100%; }
  .iphix-hub-visual { min-height:350px; border-radius:24px; }
  .iphix-hub-visual > img { width:min(75%,300px); max-height:285px; }
  .iphix-hub-visual.is-photo > img { width:100%; max-height:none; }
  .iphix-hub-visual figcaption { right:14px; bottom:14px; width:calc(100% - 28px); }
  .iphix-hub-symptoms { padding:62px 0; }
  .iphix-hub-split { gap:38px; }
  .iphix-hub-section-head { align-items:flex-start; flex-direction:column; gap:18px; margin-bottom:30px; }
  .iphix-hub-section-head h2,
  .iphix-hub-split h2,
  .iphix-hub-faq h2,
  .iphix-hub-detail-panel h2,
  .iphix-about-principles h2,
  .iphix-about-local h2 { font-size:35px; }
  .iphix-hub-service-grid { grid-template-columns:1fr; border-radius:20px; }
  .iphix-hub-service-grid > a { min-height:176px; border-right:0!important; border-bottom:1px solid var(--iphix-hub-line)!important; }
  .iphix-hub-service-grid > a:last-child { border-bottom:0!important; }
  .iphix-hub-model-grid { grid-template-columns:1fr; }
  .iphix-hub-model-grid a { margin:0!important; }
  .iphix-hub-model-grid span { font-size:11px; }
  .iphix-hub-steps { grid-template-columns:1fr; }
  .iphix-hub-steps li,
  .iphix-hub-steps li + li { min-height:0; display:grid; grid-template-columns:52px 1fr; gap:8px; align-items:center; padding:20px 0; border-left:0; }
  .iphix-hub-steps b { margin:0; }
  .iphix-hub-detail-panel { padding:28px 22px; gap:30px; border-radius:22px; }
  .iphix-hub-faq { padding:68px 0; }
  .iphix-hub-faq-grid { gap:42px; }
  .iphix-hub-related-grid { grid-template-columns:1fr; }
  .iphix-hub-related-grid a { min-height:96px; border-right:0!important; border-bottom:1px solid var(--iphix-hub-line)!important; }
  .iphix-hub-related-grid a:last-child { border-bottom:0!important; }
  .iphix-about-principles { padding:68px 0; }
  .iphix-about-local { gap:38px; }
  .iphix-about-local figure,
  .iphix-about-local figure img { min-height:300px; }
  .iphix-about-local li { grid-template-columns:90px 1fr; gap:14px; }
}

@media (prefers-reduced-motion: reduce) {
  .iphix-hub-orbit { animation:none; }
  .iphix-hub-visual > img,
  .iphix-hub-service-grid > a { transition:none; }
}
