.dynamic-app .card::after { display: none; }
.dynamic-app .card { padding: 1rem; }
.dynamic-app .split { gap: .85rem; }
.dynamic-app .media-card {
  padding: 0;
  display: grid;
  grid-template-rows: 170px 1fr;
  overflow: hidden;
  background: rgba(255,255,255,.92);
}
.dynamic-app .dark .media-card,
.dynamic-app .media-card.glass { background: rgba(255,255,255,.08); }
.card-media {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.1) contrast(1.05);
  transition: transform .35s ease;
}
.media-card:hover .card-media { transform: scale(1.045); }
.card-body { display: grid; gap: .7rem; padding: 1rem; align-content: start; }
.dynamic-hero { min-height: calc(100vh - 74px); }
.card-cluster { display: grid; gap: .72rem; }
.card-cluster.diagonal { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 1rem; }
.card-cluster.horizontal { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.card-cluster.diagonal > .media-card:nth-child(3n+2) { transform: translateY(6px); }
.card-cluster.diagonal > .media-card:nth-child(3n) { transform: translateY(10px); }
.card-cluster.diagonal > .media-card:hover { transform: translateY(-4px); }
.button-stack { display: grid; grid-template-columns: minmax(210px, 300px); width: fit-content; }
.button-stack .btn { justify-content: flex-start; }
.dynamic-filter { align-items: stretch; }
.dynamic-filter input,
.dynamic-filter select { min-height: 46px; }
.dynamic-questionnaire { max-width: 1120px; margin: 0 auto; }
.dynamic-questionnaire .q-step { min-height: 360px; }
.dynamic-questionnaire .q-actions { margin-top: .5rem; }
.dynamic-app .form.card { padding: 1.1rem; }
.admin-table { margin-top: 1rem; overflow-x: auto; }
.wide-pipeline { grid-template-columns: repeat(9, 1fr); }
.dynamic-app .table-card table { min-width: 760px; }
.dynamic-app .nav-shell { width: min(1440px, calc(100% - 28px)); }
.dynamic-app .hero .actions { grid-template-columns: minmax(210px, 300px); }
@media (max-width: 1050px) {
  .card-cluster.diagonal,
  .card-cluster.horizontal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .card-cluster.diagonal > .media-card:nth-child(n) { transform: none; }
  .button-stack,
  .dynamic-app .hero .actions { width: 100%; grid-template-columns: 1fr; }
  .wide-pipeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .card-cluster.diagonal,
  .card-cluster.horizontal { grid-template-columns: 1fr; }
  .dynamic-app .media-card { grid-template-rows: 145px 1fr; }
  .dynamic-questionnaire .q-step { min-height: auto; }
  .wide-pipeline { grid-template-columns: 1fr; }
}


/* Premium ecommerce + CMS upgrade */
.ecommerce-app { --navy:#071426; --navy-2:#0a1f38; --cyan:#24c8ff; --blue:#2b78ff; --orange:#f59a23; --ink:#102033; --soft:#f4f8fc; }
.dynamic-app .compact-commerce-nav { min-height: 64px; backdrop-filter: blur(18px); }
.dynamic-app .compact-commerce-nav .nav-shell { min-height: 62px; width: min(1400px, calc(100% - 26px)); padding: .46rem .62rem; gap: .65rem; }
.dynamic-app .compact-commerce-nav .brand img { height: 38px; width: auto; }
.dynamic-app .compact-commerce-nav .nav-links { gap: .16rem; align-items: center; }
.dynamic-app .compact-commerce-nav .nav-links > a,
.dynamic-app .compact-commerce-nav .nav-group > button { font-size: .82rem; padding: .55rem .68rem; border-radius: 8px; letter-spacing: 0; }
.dynamic-app .compact-commerce-nav .nav-actions { display: flex; align-items: center; gap: .45rem; margin-left: auto; }
.dynamic-app .small-btn { min-height: 36px; padding: .48rem .72rem; font-size: .78rem; border-radius: 8px; }
.dynamic-app .mega-panel { border: 1px solid rgba(82,195,255,.23); border-radius: 8px; box-shadow: 0 28px 90px rgba(2,11,30,.38); background: rgba(7,20,38,.98); }
.dynamic-app .mega-panel-xl { min-width: min(1080px, calc(100vw - 38px)); }
.dynamic-app .mega-layout.three-col { grid-template-columns: 1.25fr 1fr .95fr; }
.dynamic-app .mega-feature { border-radius: 8px; }
.dynamic-app .accent-card { background: linear-gradient(140deg, rgba(36,200,255,.13), rgba(245,154,35,.13)); border: 1px solid rgba(255,255,255,.16); border-radius: 8px; }
.dynamic-app .hero.dynamic-hero,
.dynamic-app .commerce-hero { min-height: auto; padding: 34px 0 28px; }
.dynamic-app .hero-grid { align-items: center; gap: clamp(1.25rem, 3vw, 3rem); }
.dynamic-app .hero-copy h1,
.dynamic-app .section-head h1 { font-size: clamp(2rem, 3.1vw, 3.35rem); line-height: 1.09; max-width: 760px; letter-spacing: 0; }
.dynamic-app .commerce-hero .section-head h1 { font-size: clamp(1.9rem, 2.75vw, 3rem); }
.dynamic-app .section-head h2 { font-size: clamp(1.35rem, 2.05vw, 2.25rem); line-height: 1.15; max-width: 720px; letter-spacing: 0; }
.dynamic-app .lead { font-size: clamp(.96rem, 1.05vw, 1.08rem); max-width: 620px; line-height: 1.65; }
.dynamic-app .hero-path { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0; }
.dynamic-app .hero-path span { display: inline-flex; align-items: center; min-height: 34px; padding: .42rem .72rem; border-radius: 8px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.13); color: #eaf7ff; font-weight: 700; font-size: .84rem; }
.dynamic-app .visual-stage,
.dynamic-app .workflow-image,
.dynamic-app .product-visual { position: relative; overflow: hidden; border-radius: 8px; min-height: 330px; box-shadow: 0 30px 100px rgba(0,0,0,.34); background: #061424; }
.dynamic-app .visual-stage img,
.dynamic-app .workflow-image img,
.dynamic-app .product-visual img { width: 100%; height: 100%; min-height: 330px; object-fit: cover; display: block; filter: saturate(1.1) contrast(1.04); }
.dynamic-app .visual-overlay { position: absolute; inset: 0; background: radial-gradient(circle at 22% 20%, rgba(36,200,255,.2), transparent 35%), linear-gradient(135deg, rgba(5,16,31,.08), rgba(5,16,31,.55)); pointer-events: none; }
.dynamic-app .motion-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(36,200,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(36,200,255,.1) 1px, transparent 1px); background-size: 34px 34px; opacity: .45; animation: gridDrift 18s linear infinite; pointer-events: none; }
.dynamic-app .data-stream { position: absolute; height: 2px; width: 42%; background: linear-gradient(90deg, transparent, rgba(36,200,255,.95), rgba(245,154,35,.85), transparent); filter: drop-shadow(0 0 12px rgba(36,200,255,.65)); animation: streamFlow 4.5s ease-in-out infinite; }
.dynamic-app .stream-one { top: 24%; left: -20%; }
.dynamic-app .stream-two { top: 52%; left: -28%; animation-delay: 1.1s; }
.dynamic-app .stream-three { top: 76%; left: -18%; animation-delay: 2.2s; }
.dynamic-app .floating-panel { position: absolute; display: grid; gap: .18rem; min-width: 170px; padding: .72rem .85rem; border-radius: 8px; background: rgba(5,18,34,.78); border: 1px solid rgba(255,255,255,.18); color: #fff; box-shadow: 0 18px 40px rgba(0,0,0,.28); }
.dynamic-app .floating-panel b { font-size: .86rem; }
.dynamic-app .floating-panel span { font-size: .76rem; color: #bcd4e7; }
.dynamic-app .panel-one { top: 10%; left: 6%; }
.dynamic-app .panel-two { right: 6%; top: 42%; }
.dynamic-app .panel-three { left: 9%; bottom: 9%; }
.dynamic-app .feature-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; }
.dynamic-app .feature-chip,
.dynamic-app .metric-card { border-radius: 8px; background: #fff; border: 1px solid rgba(21,51,85,.09); box-shadow: 0 16px 45px rgba(9,30,58,.08); }
.dynamic-app .feature-chip { padding: .9rem 1rem; font-weight: 800; color: var(--ink); }
.dynamic-app .transformation-map.simplified { display: grid; gap: .7rem; margin-top: 1.3rem; }
.dynamic-app .map-stage { display: grid; gap: .22rem; padding: .95rem 1rem; border-radius: 8px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.13); }
.dynamic-app .map-stage b { color: #fff; }
.dynamic-app .map-stage span { color: #c3d8e9; }
.dynamic-app .card-cluster.diagonal { align-items: stretch; }
.dynamic-app .media-card { min-height: 100%; border-radius: 8px; border: 1px solid rgba(13,44,75,.1); box-shadow: 0 20px 55px rgba(9,30,58,.11); }
.dynamic-app .media-card .card-body h3 { font-size: clamp(1.02rem, 1.35vw, 1.28rem); line-height: 1.2; }
.dynamic-app .media-card .card-body p { line-height: 1.52; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.dynamic-app .card-actions { display: grid; grid-template-columns: 1fr; gap: .48rem; align-items: stretch; margin-top: auto; }
.dynamic-app .card-actions .btn,
.dynamic-app .button-stack .btn,
.dynamic-app .button-stack form .btn { width: 100%; min-height: 42px; border-radius: 8px; justify-content: center; }
.dynamic-app .button-stack form { width: 100%; }
.dynamic-app .price-hero { display: inline-grid; gap: .15rem; margin: 1rem 0; padding: .85rem 1rem; border: 1px solid rgba(255,255,255,.18); border-radius: 8px; background: rgba(255,255,255,.09); }
.dynamic-app .price-hero strong { color: #fff; font-size: clamp(1.45rem, 2.2vw, 2.1rem); }
.dynamic-app .price-hero span { color: #b9d2e8; font-weight: 700; text-transform: uppercase; font-size: .75rem; }
.dynamic-app .marketplace-toolbar { border-radius: 8px; background: #fff; box-shadow: 0 18px 55px rgba(9,30,58,.09); padding: .75rem; }
.dynamic-app .checkout-summary,
.dynamic-app .auth-card,
.dynamic-app .article-body { border-radius: 8px; box-shadow: 0 20px 60px rgba(9,30,58,.1); }
.dynamic-app .account-type-form {
  max-width: 720px;
}
.dynamic-app .account-other-field {
  display: none;
}
.dynamic-app .account-other-field.is-visible {
  display: grid;
}
.dynamic-app .cart-list { display: grid; gap: .65rem; }
.dynamic-app .price-line strong { font-size: 2rem; color: var(--navy); }
.dynamic-app .metrics-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .85rem; margin-bottom: 1rem; }
.dynamic-app .metric-card { padding: 1rem; display: grid; gap: .32rem; }
.dynamic-app .metric-card span { color: #55718d; font-size: .78rem; text-transform: uppercase; font-weight: 900; }
.dynamic-app .metric-card strong { color: var(--navy); font-size: clamp(1.55rem, 2.5vw, 2.5rem); line-height: 1; }
.dynamic-app .metric-card p { margin: 0; color: #58708a; font-size: .88rem; }
.dynamic-app .admin-split { align-items: start; }
.dynamic-app .table-card { overflow: auto; }
.dynamic-app .table-card table { width: 100%; border-collapse: collapse; }
.dynamic-app .table-card th,
.dynamic-app .table-card td { padding: .78rem; border-bottom: 1px solid rgba(19,47,82,.08); text-align: left; vertical-align: top; }
.dynamic-app .table-card th { color: #36536f; font-size: .78rem; text-transform: uppercase; }
.dynamic-app .article-body p { font-size: 1.08rem; line-height: 1.8; color: #30465d; }
.dynamic-app .social-product-hero .social-proof-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .65rem;
  margin-top: 1rem;
  max-width: 640px;
}
.dynamic-app .proof-tile {
  min-height: 74px;
  display: grid;
  align-content: center;
  gap: .18rem;
  padding: .72rem .82rem;
  border-radius: 8px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.14);
}
.dynamic-app .proof-tile strong { color: #fff; font-size: 1rem; }
.dynamic-app .proof-tile span { color: #bfd8ea; font-size: .8rem; font-weight: 800; text-transform: uppercase; }
.dynamic-app .pain-solution-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: .75rem;
  align-items: stretch;
}
.dynamic-app .pain-solution-grid .card {
  display: grid;
  align-content: start;
  gap: .8rem;
  border-radius: 8px;
  box-shadow: 0 18px 55px rgba(9,30,58,.09);
}
.dynamic-app .workflow-timeline {
  counter-reset: workflow;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .65rem;
  padding: 0;
  margin: 0;
  list-style: none;
}
.dynamic-app .workflow-timeline li {
  counter-increment: workflow;
  position: relative;
  display: grid;
  align-content: start;
  gap: .42rem;
  min-height: 166px;
  padding: .86rem;
  border-radius: 8px;
  background: #fff;
  border: 1px solid rgba(13,44,75,.1);
  box-shadow: 0 16px 45px rgba(9,30,58,.08);
}
.dynamic-app .workflow-timeline li::before {
  content: counter(workflow);
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #061426;
  font-weight: 700;
  background: linear-gradient(135deg, var(--cyan), var(--orange));
}
.dynamic-app .workflow-timeline strong { color: var(--navy); }
.dynamic-app .workflow-timeline span { color: #526f89; font-size: .9rem; line-height: 1.45; }
.dynamic-app .module-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}
.dynamic-app .module-card {
  display: grid;
  align-content: start;
  gap: .65rem;
  min-height: 210px;
  border-radius: 8px;
  box-shadow: 0 18px 55px rgba(9,30,58,.09);
}
.dynamic-app .module-card h3 { margin: 0; color: var(--navy); }
.dynamic-app .module-card p { margin: 0; color: #526f89; line-height: 1.55; }
@keyframes gridDrift { from { background-position: 0 0, 0 0; } to { background-position: 68px 68px, 68px 68px; } }
@keyframes streamFlow { 0% { transform: translateX(0); opacity: 0; } 15% { opacity: 1; } 100% { transform: translateX(320%); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .dynamic-app .motion-grid, .dynamic-app .data-stream { animation: none; } }
@media (max-width: 1180px) {
  .dynamic-app .compact-commerce-nav .nav-links { position: fixed; left: 14px; right: 14px; top: 72px; max-height: calc(100vh - 88px); overflow: auto; padding: 1rem; border-radius: 8px; background: rgba(7,20,38,.98); display: none; }
  .dynamic-app .compact-commerce-nav .nav-shell.open .nav-links { display: grid; }
  .dynamic-app .compact-commerce-nav .nav-actions { margin-left: 0; }
  .dynamic-app .mega-panel, .dynamic-app .mega-panel-xl { position: static; min-width: 0; box-shadow: none; margin-top: .4rem; }
  .dynamic-app .mega-layout.three-col { grid-template-columns: 1fr; }
  .dynamic-app .feature-row, .dynamic-app .metrics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dynamic-app .workflow-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dynamic-app .module-grid,
  .dynamic-app .pain-solution-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .dynamic-app .compact-commerce-nav .nav-actions .ghost { display: none; }
  .dynamic-app .hero.dynamic-hero, .dynamic-app .commerce-hero { padding: 28px 0 26px; }
  .dynamic-app .visual-stage, .dynamic-app .workflow-image, .dynamic-app .product-visual { min-height: 250px; }
  .dynamic-app .visual-stage img, .dynamic-app .workflow-image img, .dynamic-app .product-visual img { min-height: 250px; }
  .dynamic-app .floating-panel { position: static; margin: .55rem; min-width: 0; }
  .dynamic-app .feature-row, .dynamic-app .metrics-grid { grid-template-columns: 1fr; }
  .dynamic-app .hero-copy h1, .dynamic-app .section-head h1 { font-size: clamp(1.85rem, 8vw, 2.45rem); }
  .dynamic-app .social-product-hero .social-proof-strip,
  .dynamic-app .workflow-timeline,
  .dynamic-app .module-grid { grid-template-columns: 1fr; }
  .dynamic-app .workflow-timeline li { min-height: auto; }
}


/* RBAC user group console */
.dynamic-app .compact-checks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; }
.dynamic-app .compact-checks label { min-height: 38px; padding: .55rem .65rem; border-radius: 8px; background: rgba(7,20,38,.045); border: 1px solid rgba(12,44,80,.08); font-size: .84rem; font-weight: 700; color: #213b55; }
.dynamic-app .inline-group-form { display: grid; gap: .7rem; min-width: 320px; }
.dynamic-app .table-card td span { color: #67819a; font-size: .84rem; }
.dynamic-app .badge + .badge { margin-left: .25rem; }
@media (max-width: 780px) {
  .dynamic-app .compact-checks { grid-template-columns: 1fr; }
  .dynamic-app .inline-group-form { min-width: 0; }
}


/* Industry pages and Smart Quotation Tool */
.dynamic-app .pricing-agent-form { display: grid; gap: 1.05rem; }
.dynamic-app .agent-form-header { padding: 1rem; border-radius: 8px; background: linear-gradient(135deg, rgba(36,200,255,.1), rgba(245,154,35,.1)); border: 1px solid rgba(36,120,180,.14); }
.dynamic-app .agent-form-header h2 { margin: 0 0 .35rem; font-size: clamp(1.35rem, 2vw, 2rem); }
.dynamic-app .agent-form-header p { margin: 0; color: #526f89; max-width: 760px; line-height: 1.55; }
.dynamic-app .agent-question-panel { padding: 1rem; border-radius: 8px; background: #f7fbff; border: 1px solid rgba(19,47,82,.08); }
.dynamic-app .agent-question-panel h3 { margin-top: 0; }
.dynamic-app .pricing-agent-form h3 { margin: .5rem 0 0; font-size: 1rem; color: #18324f; }
.dynamic-app .pricing-agent-form textarea { min-height: 105px; }
.dynamic-app .cred-strip .badge { margin: .18rem; }
.dynamic-app .estimate-band { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .8rem; }
.dynamic-app .estimate-band .metric-card { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.15); }
.dynamic-app .estimate-band .metric-card span,
.dynamic-app .estimate-band .metric-card p { color: #c7dced; }
.dynamic-app .estimate-band .metric-card strong { color: #fff; }
@media (max-width: 820px) { .dynamic-app .estimate-band { grid-template-columns: 1fr; } }

.dynamic-app .quote-builder-form { gap: 1rem; }
.dynamic-app .quote-step-card {
  display: grid;
  gap: .85rem;
  padding: 1rem;
  border: 1px solid rgba(19,47,82,.1);
  border-radius: 8px;
  background: linear-gradient(180deg, #fff, #f8fbfe);
}
.dynamic-app .quote-step-heading {
  display: flex;
  gap: .8rem;
  align-items: flex-start;
}
.dynamic-app .quote-step-heading > span {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 8px;
  background: var(--navy);
  color: #fff;
  font-weight: 900;
}
.dynamic-app .quote-step-heading h3,
.dynamic-app .quote-step-heading p { margin: 0; }
.dynamic-app .quote-step-heading p { color: #526f89; line-height: 1.5; }
.dynamic-app .quote-choice-grid,
.dynamic-app .quote-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .65rem;
}
.dynamic-app .quote-choice {
  display: grid;
  gap: .35rem;
  min-height: 118px;
  padding: .85rem;
  border: 1px solid rgba(19,47,82,.12);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
}
.dynamic-app .quote-choice strong {
  color: #12243a;
  line-height: 1.25;
}
.dynamic-app .quote-choice span {
  color: #57718a;
  font-size: .86rem;
  line-height: 1.42;
}
.dynamic-app .quote-choice:has(input:checked) {
  border-color: rgba(0,161,255,.55);
  box-shadow: 0 0 0 3px rgba(0,161,255,.12);
  background: linear-gradient(145deg, #fff, #effaff);
}
.dynamic-app .quote-feature-group {
  border: 1px solid rgba(19,47,82,.12);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}
.dynamic-app .quote-feature-group summary {
  padding: .85rem;
  font-weight: 900;
  color: #12243a;
  cursor: pointer;
}
.dynamic-app .quote-feature-group .check-grid {
  padding: 0 .85rem .85rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.dynamic-app .quote-step-card h4 {
  margin: .35rem 0 0;
  color: #18324f;
  font-size: .92rem;
}
.dynamic-app .tier-choice { min-height: 92px; }
.dynamic-app .quote-submit-bar {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  bottom: 12px;
  z-index: 8;
  padding: .85rem;
  border-radius: 8px;
  background: rgba(7,20,38,.96);
  border: 1px solid rgba(36,200,255,.24);
  box-shadow: 0 16px 50px rgba(0,0,0,.22);
}
.dynamic-app .quote-submit-bar strong,
.dynamic-app .quote-submit-bar span { display: block; }
.dynamic-app .quote-submit-bar strong { color: #fff; }
.dynamic-app .quote-submit-bar span { color: #c7dced; font-size: .88rem; }
.dynamic-app.page-ai-pricing-agent .ai-assistant-widget,
.dynamic-app.page-ai-pricing-agent .ai-assistant-launcher,
.dynamic-app.page-ai-pricing-agent .cookie-banner,
.dynamic-app.page-ai-pricing-agent .quote-builder-form > .agent-form-header { display: none; }
.dynamic-app.page-ai-pricing-agent .cookie-banner {
  max-width: 720px;
  left: auto;
  right: 16px;
  grid-template-columns: 1fr auto;
}
.dynamic-app .quote-hero { padding: clamp(2.3rem, 5vw, 4.7rem) 0 1.8rem; }
.dynamic-app .quote-hero .wrap { max-width: 1120px; }
.dynamic-app .quote-hero-copy { max-width: 980px; }
.dynamic-app .quote-hero h1 { max-width: 820px; }
.dynamic-app .quote-hero-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1.35rem;
}
.dynamic-app .quote-hero-metrics span {
  display: grid;
  gap: .18rem;
  padding: .85rem;
  border-radius: 8px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
}
.dynamic-app .quote-hero-metrics strong { color: #fff; }
.dynamic-app .quote-hero-metrics small { color: #bdd7ea; font-weight: 700; }
.dynamic-app .quote-builder-section { padding-top: 1.4rem; }
.dynamic-app .quote-builder-section .wrap { max-width: 1120px; }
.dynamic-app .quote-builder-form {
  border: 1px solid rgba(19,47,82,.12);
  box-shadow: 0 18px 70px rgba(14, 34, 58, .1);
}
.dynamic-app .quote-two-column,
.dynamic-app .quote-addon-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem;
}
.dynamic-app .quote-addon-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dynamic-app .quote-context-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.dynamic-app .quote-context-grid label:first-child,
.dynamic-app .quote-context-grid label:nth-child(2),
.dynamic-app .quote-context-grid label:nth-child(3) { grid-column: 1 / -1; }
.dynamic-app .compact-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
}
.dynamic-app .quote-intent-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.dynamic-app .quote-intent-tile {
  min-height: 68px;
  padding: .68rem .72rem;
  align-content: start;
}
.dynamic-app .quote-intent-tile span {
  display: none;
  font-size: .78rem;
}
.dynamic-app .quote-intent-tile:has(input:checked) span { display: block; }
.dynamic-app .quote-intent-tile input,
.dynamic-app .tier-choice input {
  justify-self: end;
  margin: 0;
}
.dynamic-app .tier-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.dynamic-app .tier-choice {
  min-height: 72px;
  padding: .68rem .72rem;
}
.dynamic-app .tier-choice span { font-size: .78rem; }
.dynamic-app .premium-checks {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.dynamic-app .compact-question-panel { padding: .85rem; }
.dynamic-app .decision-hero {
  background:
    radial-gradient(circle at 16% 16%, rgba(36,200,255,.22), transparent 30%),
    linear-gradient(135deg, #071426 0%, #0b294c 52%, #07111f 100%);
}
.dynamic-app .decision-ai-form .quote-step-card {
  border-color: rgba(19, 47, 82, .14);
}
.dynamic-app .decision-ai-form .quote-step-card:hover {
  border-color: rgba(36, 200, 255, .34);
  box-shadow: 0 18px 44px rgba(8, 44, 84, .1);
}
.dynamic-app .decision-result-hero {
  background:
    radial-gradient(circle at 20% 20%, rgba(36,200,255,.2), transparent 28%),
    radial-gradient(circle at 80% 0%, rgba(247,159,31,.16), transparent 28%),
    linear-gradient(135deg, #071426, #0a2543 54%, #07111f);
}
.dynamic-app .decision-scoreboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
  margin: 1.25rem 0 1rem;
}
.dynamic-app .decision-scoreboard span,
.dynamic-app .decision-signal-grid article {
  display: grid;
  gap: .2rem;
  padding: .9rem;
  border-radius: 8px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
}
.dynamic-app .decision-scoreboard strong {
  color: #fff;
  font-size: clamp(1.2rem, 2vw, 1.65rem);
}
.dynamic-app .decision-scoreboard small {
  color: #c9deed;
  font-weight: 800;
}
.dynamic-app .decision-dashboard {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: .9rem;
  align-items: start;
}
.dynamic-app .decision-primary-card {
  background: linear-gradient(145deg, #ffffff, #eef8ff);
  border-left: 4px solid var(--cyan);
}
.dynamic-app .decision-signal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .65rem;
}
.dynamic-app .decision-signal-grid article {
  background: #f7fbff;
  border-color: rgba(19,47,82,.12);
}
.dynamic-app .decision-signal-grid strong {
  color: var(--navy);
  font-size: 1.2rem;
}
.dynamic-app .decision-signal-grid span {
  color: var(--muted);
  font-weight: 800;
  font-size: .78rem;
}
.dynamic-app .decision-timeline {
  margin-top: .8rem;
}
.dynamic-app .smart-quote-hero {
  min-height: clamp(460px, 58vh, 640px);
  display: grid;
  align-items: center;
  background:
    linear-gradient(90deg, rgba(4,13,28,.94), rgba(7,22,45,.82)),
    url('/assets/arrix-human-consulting-hero.png') center right / cover no-repeat;
}
.dynamic-app .smart-quote-hero-grid {
  grid-template-columns: minmax(0, .95fr) minmax(320px, .72fr);
  gap: clamp(1.4rem, 4vw, 4.8rem);
  align-items: center;
}
.dynamic-app .quote-hero-copy {
  max-width: 720px;
}
.dynamic-app .quote-hero-copy h1 {
  max-width: 680px;
  font-size: clamp(2.35rem, 5vw, 4.65rem);
  line-height: .98;
}
.dynamic-app .quote-hero-copy .lead {
  max-width: 720px;
  color: #d8e8f6;
}
.dynamic-app .quote-hero-copy .form-note {
  color: #b7c9dc;
  max-width: 620px;
}
.dynamic-app .quote-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: center;
}
.dynamic-app .quote-hero-actions .btn {
  width: auto;
  min-width: 180px;
  min-height: 46px;
  justify-content: center;
}
.dynamic-app .quote-builder-visual {
  position: relative;
  min-height: 390px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 30px 90px rgba(0,0,0,.34);
  background: #081629;
}
.dynamic-app .quote-builder-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(4,13,28,.08), rgba(4,13,28,.72)),
    linear-gradient(90deg, rgba(36,200,255,.14), transparent 36%);
}
.dynamic-app .quote-builder-visual img {
  width: 100%;
  height: 100%;
  min-height: 390px;
  object-fit: cover;
  object-position: center;
  display: block;
}
.dynamic-app .quote-visual-panel,
.dynamic-app .quote-visual-steps {
  position: absolute;
  z-index: 2;
}
.dynamic-app .quote-visual-panel {
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  padding: 1rem;
  border-radius: 8px;
  background: rgba(5,17,32,.86);
  border: 1px solid rgba(36,200,255,.28);
  backdrop-filter: blur(14px);
}
.dynamic-app .quote-visual-panel span,
.dynamic-app .quote-visual-panel small {
  display: block;
  color: #9edfff;
  font-weight: 900;
}
.dynamic-app .quote-visual-panel strong {
  display: block;
  color: #fff;
  font-size: 2rem;
  margin: .15rem 0;
}
.dynamic-app .quote-visual-steps {
  top: 1rem;
  left: 1rem;
  right: 1rem;
  display: flex;
  gap: .45rem;
}
.dynamic-app .quote-visual-steps span {
  flex: 1;
  padding: .48rem .55rem;
  border-radius: 999px;
  text-align: center;
  color: #071426;
  font-weight: 900;
  background: linear-gradient(135deg, rgba(36,200,255,.95), rgba(247,179,61,.95));
}
.dynamic-app .smart-quote-section {
  background:
    linear-gradient(180deg, #eef6ff, #ffffff 55%);
}
.dynamic-app .quote-builder-section > .wrap {
  max-width: 1220px;
}
.dynamic-app .smart-quote-tool {
  padding: 1rem;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(18, 45, 79, .1);
  box-shadow: 0 24px 80px rgba(14, 34, 58, .11);
  backdrop-filter: blur(18px);
}
.dynamic-app .quote-progress {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: .5rem;
  margin-bottom: 1rem;
}
.dynamic-app .quote-progress span {
  min-height: 38px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #edf3fa;
  color: #536579;
  font-weight: 600;
  font-size: .78rem;
  border: 1px solid rgba(18,45,79,.07);
}
.dynamic-app .quote-progress span.active {
  color: #061525;
  background: linear-gradient(135deg, var(--cyan), #f7b33d);
  box-shadow: 0 12px 28px rgba(36,200,255,.18);
}
.dynamic-app .smart-quote-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(330px, 410px);
  gap: 1.15rem;
  align-items: start;
}
.dynamic-app .smart-quote-main {
  display: grid;
  gap: .85rem;
}
.dynamic-app .quote-layer {
  display: none;
  padding: clamp(1rem, 2vw, 1.35rem);
  border-radius: 8px;
  background: #fff;
  border: 1px solid rgba(18, 45, 79, .13);
  box-shadow: 0 16px 44px rgba(14, 34, 58, .07);
}
.dynamic-app .quote-layer.active {
  display: grid;
  gap: .85rem;
}
.dynamic-app .quote-layer label {
  display: grid;
  gap: .45rem;
  color: #0c1a2c;
  font-weight: 900;
}
.dynamic-app .quote-layer select,
.dynamic-app .quote-layer input,
.dynamic-app .quote-layer textarea {
  min-height: 54px;
  border: 1px solid rgba(18, 45, 79, .18);
  border-radius: 8px;
  padding: .8rem .9rem;
  font-size: 1rem;
  background: linear-gradient(180deg, #fff, #f7fbff);
  color: #0c1a2c;
}
.dynamic-app .quote-layer textarea { min-height: 112px; }
.dynamic-app .quote-layer select:focus,
.dynamic-app .quote-layer input:focus,
.dynamic-app .quote-layer textarea:focus {
  outline: 3px solid rgba(36, 200, 255, .22);
  border-color: var(--cyan);
}
.dynamic-app .quote-layer p {
  margin: 0;
  color: #536579;
  line-height: 1.5;
}
.dynamic-app .other-input {
  display: none;
}
.dynamic-app .other-input.is-visible {
  display: block;
}
.dynamic-app .add-feature-btn {
  width: fit-content;
}
.dynamic-app .selected-feature-list {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.dynamic-app .selected-chip {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .45rem .6rem;
  border-radius: 999px;
  background: #eaf8ff;
  color: #09223d;
  font-weight: 900;
  border: 1px solid rgba(36, 200, 255, .28);
}
.dynamic-app .selected-chip button {
  border: 0;
  border-radius: 999px;
  width: 22px;
  height: 22px;
  color: #fff;
  background: #0d1b2e;
  cursor: pointer;
}
.dynamic-app .complexity-note,
.dynamic-app .quote-disclaimer {
  border-left: 4px solid #f7a51f;
  background: #fff8e9;
  color: #2a3240;
  padding: .8rem;
  border-radius: 8px;
}
.dynamic-app .live-estimate-panel {
  position: sticky;
  top: 112px;
  padding: 1.05rem;
  border-radius: 8px;
  background:
    radial-gradient(circle at top right, rgba(36,200,255,.2), transparent 36%),
    linear-gradient(160deg, #071426, #0b294c);
  color: #eaf7ff;
  border: 1px solid rgba(36,200,255,.28);
  box-shadow: 0 22px 80px rgba(5, 17, 32, .24);
}
.dynamic-app .live-estimate-panel h3 {
  color: #fff;
  margin: .25rem 0 .8rem;
}
.dynamic-app .live-estimate-panel dl {
  display: grid;
  grid-template-columns: 1fr;
  gap: .5rem;
  margin: 0;
}
.dynamic-app .live-estimate-panel dt {
  color: #8fdbff;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}
.dynamic-app .live-estimate-panel dd {
  margin: -.35rem 0 .25rem;
  color: #fff;
  font-weight: 800;
}
.dynamic-app .estimate-number {
  margin-top: .85rem;
  padding: .8rem;
  border-radius: 8px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
}
.dynamic-app .estimate-number small,
.dynamic-app .live-estimate-panel p {
  color: #c7dced;
  line-height: 1.45;
}
.dynamic-app .estimate-number strong {
  display: block;
  color: #fff;
  font-size: 1.3rem;
  margin-top: .18rem;
}
.dynamic-app .estimate-summary-card {
  margin-top: .75rem;
  padding: .78rem;
  border-radius: 8px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.14);
}
.dynamic-app .estimate-summary-card small {
  display: block;
  color: #8fdbff;
  font-weight: 900;
  text-transform: uppercase;
  font-size: .7rem;
  margin-bottom: .35rem;
}
.dynamic-app .estimate-summary-card strong {
  display: block;
  color: #fff;
  line-height: 1.35;
  font-size: .94rem;
}
.dynamic-app .market-priority-card {
  border-color: rgba(247,179,61,.34);
  background: linear-gradient(135deg, rgba(247,179,61,.13), rgba(36,200,255,.08));
}
.dynamic-app .estimate-summary-card span {
  display: block;
  margin-top: .28rem;
  color: #c7dced;
  font-weight: 800;
  line-height: 1.35;
  font-size: .82rem;
}
.dynamic-app .estimate-summary-card ul {
  margin: .3rem 0 0;
  padding-left: 1rem;
}
.dynamic-app .estimate-summary-card li {
  color: #eaf7ff;
  line-height: 1.35;
  margin: .24rem 0;
  font-weight: 700;
  font-size: .84rem;
}
@media (max-width: 1100px) {
  .dynamic-app .quote-choice-grid,
  .dynamic-app .quote-feature-grid,
  .dynamic-app .premium-checks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dynamic-app .quote-intent-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .dynamic-app .quote-addon-grid { grid-template-columns: 1fr; }
  .dynamic-app .smart-quote-hero-grid { grid-template-columns: 1fr; }
  .dynamic-app .quote-builder-visual { display: none; }
  .dynamic-app .quote-hero-copy h1 { font-size: clamp(2.15rem, 7vw, 4rem); }
}
@media (max-width: 860px) {
  .dynamic-app .quote-intent-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dynamic-app .smart-quote-hero {
    min-height: auto;
    padding-block: 3rem;
  }
  .dynamic-app .quote-hero-actions .btn {
    flex: 1 1 220px;
  }
}
@media (max-width: 720px) {
  .dynamic-app .quote-choice-grid,
  .dynamic-app .quote-feature-grid,
  .dynamic-app .quote-feature-group .check-grid,
  .dynamic-app .quote-two-column,
  .dynamic-app .quote-context-grid,
  .dynamic-app .compact-form-grid,
  .dynamic-app .quote-hero-metrics,
  .dynamic-app .premium-checks { grid-template-columns: 1fr; }
  .dynamic-app .quote-submit-bar { position: static; display: grid; }
  .dynamic-app .quote-submit-bar .btn { width: 100%; }
  .dynamic-app.page-ai-pricing-agent .cookie-banner { left: 12px; right: 12px; grid-template-columns: 1fr; }
  .dynamic-app .decision-scoreboard,
  .dynamic-app .decision-dashboard,
  .dynamic-app .decision-signal-grid { grid-template-columns: 1fr; }
  .dynamic-app .quote-progress { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dynamic-app .smart-quote-tool { padding: .65rem; }
  .dynamic-app .smart-quote-shell { grid-template-columns: 1fr; }
  .dynamic-app .live-estimate-panel {
    position: sticky;
    bottom: 0;
    top: auto;
    z-index: 15;
    border-radius: 8px 8px 0 0;
  }
  .dynamic-app .live-estimate-panel dl { display: none; }
  .dynamic-app .live-estimate-panel p { display: none; }
  .dynamic-app .estimate-summary-card { display: none; }
}

/* Reader comfort pass */
.dynamic-app .section-head { max-width: 860px; }
.dynamic-app .section-head.compact { max-width: 780px; }
.dynamic-app .dark .section-head h1, .dynamic-app .dark .section-head h2 { text-wrap: balance; }
.dynamic-app .form-note { max-width: 760px; line-height: 1.55; }
.dynamic-app .full-table { margin-top: 1rem; }

/* Medium-screen split cleanup */
@media (max-width: 1120px) {
  .dynamic-app .section.dark .split,
  .dynamic-app .commerce-hero .split,
  .dynamic-app .section.alt .split { grid-template-columns: 1fr; }
  .dynamic-app .section.dark .split > .media-card,
  .dynamic-app .section.dark .split > .visual-stage,
  .dynamic-app .commerce-hero .split > .media-card,
  .dynamic-app .commerce-hero .split > .visual-stage { max-width: 720px; }
}


/* Full platform integration modules */
.dynamic-app .admin-console-grid { margin: 1rem 0 1.2rem; }
.dynamic-app .integration-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.dynamic-app .policy-body { max-width: 960px; margin: 0 auto; }
.dynamic-app .policy-body p { margin: 0 0 1rem; }
.dynamic-app .chat-console { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: .75rem; align-items: start; }
.dynamic-app .chat-console textarea { min-height: 170px; }
.dynamic-app .chat-reply { background: linear-gradient(145deg, #fff, #eef8ff); border-left: 4px solid var(--cyan); }
.dynamic-app .chat-reply h3 { margin-top: 0; color: var(--navy); }
.dynamic-app .cookie-banner { position: fixed; z-index: 80; left: 18px; right: 18px; bottom: 16px; width: min(1040px, calc(100% - 36px)); margin: 0 auto; display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; padding: .85rem 1rem; border-radius: 8px; background: rgba(7,20,38,.96); color: #eaf7ff; border: 1px solid rgba(36,200,255,.25); box-shadow: 0 22px 80px rgba(0,0,0,.35); backdrop-filter: blur(18px); }
.dynamic-app .cookie-banner strong { display: block; margin-bottom: .18rem; color: #fff; }
.dynamic-app .cookie-banner p { margin: 0; color: #bcd4e7; line-height: 1.45; font-size: .9rem; }
.dynamic-app .cookie-actions { display: flex; flex-wrap: wrap; gap: .45rem; justify-content: flex-end; }
.dynamic-app .inline-group-form select { width: 100%; min-height: 40px; }
.dynamic-app .table-card form .btn { min-height: 38px; }
.dynamic-app .footer { grid-template-columns: 1.35fr 1fr 1fr; }
.dynamic-app .footer-socials { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .8rem; }
.dynamic-app .footer-socials a { display: inline-flex; min-height: 32px; align-items: center; padding: .35rem .55rem; border-radius: 8px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); }
.dynamic-app .nav-group .accent-card a:not(.btn) { display: block; color: #eaf7ff; padding: .35rem 0; }
.dynamic-app .nav-group .accent-card a:not(.btn):hover { color: #fff; }
.dynamic-app .nav-actions { white-space: nowrap; }
.dynamic-app .admin-console-grid .media-card .card-media { filter: saturate(1.05) contrast(1.08) brightness(.82); }
.dynamic-app .admin-console-grid .media-card .badge { background: rgba(36,200,255,.1); color: #0a5278; }
@media (max-width: 1050px) {
  .dynamic-app .integration-grid,
  .dynamic-app .chat-console { grid-template-columns: 1fr; }
  .dynamic-app .footer { grid-template-columns: 1fr; }
  .dynamic-app .cookie-banner { grid-template-columns: 1fr; }
  .dynamic-app .cookie-actions { justify-content: flex-start; }
}
@media (max-width: 640px) {
  .dynamic-app .cookie-banner { left: 10px; right: 10px; bottom: 10px; width: calc(100% - 20px); padding: .75rem; }
  .dynamic-app .cookie-actions .btn { width: 100%; }
}


/* Social Media AI Agent */
.dynamic-app .social-agent-form textarea { min-height: 140px; }
.dynamic-app .social-agent-form h3 { margin: .45rem 0 0; color: #18324f; }
.dynamic-app .report-action { margin: 1rem 0; background: linear-gradient(145deg, #fff, #f2f9ff); border-left: 4px solid var(--orange); }
.dynamic-app .compact-action-form { min-width: 190px; gap: .45rem; }
.dynamic-app .compact-action-form .btn { min-height: 36px; }
.dynamic-app .social-agent-form .check-grid { margin-top: .35rem; }
.dynamic-app .table-card td strong { color: #102033; }
.dynamic-app .table-card td span { display: inline-block; margin-top: .2rem; line-height: 1.45; }
.dynamic-app .metric-card:nth-child(5n) { border-top: 3px solid rgba(245,154,35,.75); }


/* ARRIX brand asset sizing */
.dynamic-app .brand img { height: 48px; width: auto; max-width: 220px; object-fit: contain; }
.dynamic-app .compact-commerce-nav .brand img { height: 46px; max-width: 220px; }
.dynamic-app .footer img { max-width: 230px; height: auto; object-fit: contain; }
@media (max-width: 720px) {
  .dynamic-app .brand img,
  .dynamic-app .compact-commerce-nav .brand img { height: 40px; max-width: 170px; }
}

.dynamic-app .brand { display: inline-flex; align-items: center; justify-content: center; padding: .22rem .5rem; border-radius: 8px; background: transparent; box-shadow: none; }
.dynamic-app .compact-commerce-nav .brand { flex: 0 0 auto; }

/* Launch navigation system */
.dynamic-app.ecommerce-app { --rail-collapsed: 58px; --rail-open: 318px; }
.dynamic-app .compact-commerce-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 90;
  width: 100%;
  border-bottom: 1px solid rgba(36,200,255,.16);
  box-shadow: 0 18px 60px rgba(0,0,0,.16);
}
.dynamic-app.ecommerce-app {
  --fixed-nav-offset: 76px;
  padding-top: var(--fixed-nav-offset);
}
.dynamic-app.ecommerce-app main {
  scroll-margin-top: var(--fixed-nav-offset);
}
.dynamic-app .compact-commerce-nav .nav-shell {
  width: min(1480px, calc(100% - 22px));
  min-height: 68px;
}
.dynamic-app .compact-commerce-nav .nav-links {
  margin-left: auto;
  gap: .28rem;
}
.dynamic-app .compact-commerce-nav .nav-links > a {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  font-weight: 850;
}
.dynamic-app .compact-commerce-nav .nav-links > a[href="/shop"]:first-of-type {
  background: rgba(36,200,255,.12);
  border: 1px solid rgba(36,200,255,.2);
  color: #fff;
}
.dynamic-app .compact-commerce-nav .nav-actions {
  gap: .42rem;
  min-width: 0;
}
.dynamic-app .compact-commerce-nav .nav-actions .btn,
.dynamic-app .compact-commerce-nav .client-login {
  border-radius: 8px;
  font-weight: 850;
}
.dynamic-app .compact-commerce-nav .nav-actions .top-action {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.14);
  color: #fff;
}
.dynamic-app .compact-commerce-nav .nav-actions .top-action[href="/shop"]:first-child {
  background: rgba(36,200,255,.15);
  border-color: rgba(36,200,255,.28);
}
.dynamic-app .left-nav-rail {
  position: fixed;
  z-index: 75;
  top: 84px;
  left: 10px;
  width: var(--rail-collapsed);
  max-height: calc(100vh - 104px);
  border-radius: 8px;
  color: #eaf7ff;
  overflow: hidden;
  transition: width .22s ease, max-height .22s ease, box-shadow .22s ease;
}
.dynamic-app .left-nav-rail:not(:hover):not(:focus-within):not(.is-open) {
  max-height: var(--rail-collapsed);
}
.dynamic-app .left-nav-rail::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 8px;
  background: rgba(4,16,32,.74);
  border: 1px solid rgba(36,200,255,.22);
  box-shadow: 0 20px 70px rgba(0,0,0,.22);
  backdrop-filter: blur(18px);
}
.dynamic-app .left-nav-rail:hover,
.dynamic-app .left-nav-rail:focus-within,
.dynamic-app .left-nav-rail.is-open {
  width: min(var(--rail-open), calc(100vw - 20px));
  max-height: calc(100vh - 104px);
  box-shadow: 0 28px 100px rgba(0,0,0,.32);
}
.dynamic-app .left-nav-toggle {
  position: relative;
  z-index: 2;
  width: 42px;
  height: 42px;
  margin: 8px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(36,200,255,.2), rgba(245,154,35,.14));
  cursor: pointer;
}
.dynamic-app .left-nav-toggle span {
  display: block;
  width: 18px;
  height: 2px;
  margin: 2px 0;
  background: #fff;
  border-radius: 2px;
}
.dynamic-app .left-nav-panel {
  position: relative;
  z-index: 2;
  display: grid;
  gap: .72rem;
  max-height: calc(100vh - 168px);
  padding: 0 .7rem .8rem;
  overflow: auto;
  opacity: 0;
  transform: translateX(-8px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
  scrollbar-width: thin;
}
.dynamic-app .left-nav-rail:hover .left-nav-panel,
.dynamic-app .left-nav-rail:focus-within .left-nav-panel,
.dynamic-app .left-nav-rail.is-open .left-nav-panel {
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}
.dynamic-app .left-nav-head {
  display: grid;
  grid-template-columns: 38px 1fr;
  align-items: center;
  gap: .58rem;
  padding: .2rem .15rem .55rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.dynamic-app .left-nav-head img {
  width: 38px;
  height: 38px;
  object-fit: contain;
}
.dynamic-app .left-nav-head strong,
.dynamic-app .left-nav-head span {
  display: block;
}
.dynamic-app .left-nav-head strong {
  color: #fff;
  line-height: 1;
}
.dynamic-app .left-nav-head span {
  margin-top: .16rem;
  color: #9fc8df;
  font-size: .78rem;
  font-weight: 800;
  text-transform: uppercase;
}
.dynamic-app .left-nav-panel nav {
  display: grid;
  gap: .4rem;
}
.dynamic-app .left-nav-panel a,
.dynamic-app .left-nav-panel summary {
  min-height: 34px;
  display: flex;
  align-items: center;
  padding: .47rem .55rem;
  border-radius: 8px;
  color: rgba(234,247,255,.86);
  text-decoration: none;
  font-weight: 780;
  font-size: .88rem;
  cursor: pointer;
}
.dynamic-app .left-nav-panel a:hover,
.dynamic-app .left-nav-panel summary:hover,
.dynamic-app .left-nav-panel a:focus-visible,
.dynamic-app .left-nav-panel summary:focus-visible {
  background: rgba(36,200,255,.12);
  color: #fff;
  outline: none;
}
.dynamic-app .left-nav-panel .rail-primary {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
  color: #fff;
}
.dynamic-app .left-nav-panel details {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px;
  background: rgba(255,255,255,.045);
  overflow: hidden;
}
.dynamic-app .left-nav-panel summary {
  justify-content: space-between;
  list-style: none;
  color: #fff;
}
.dynamic-app .left-nav-panel summary::-webkit-details-marker { display: none; }
.dynamic-app .left-nav-panel summary::after {
  content: "+";
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  color: #061426;
  background: linear-gradient(135deg, var(--cyan), var(--orange));
  font-weight: 900;
}
.dynamic-app .left-nav-panel details[open] summary::after { content: "-"; }
.dynamic-app .left-nav-panel details a {
  margin: 0 .35rem .28rem;
  min-height: 31px;
  padding-left: .68rem;
  color: #b9d8ea;
  font-size: .84rem;
  font-weight: 720;
}
.dynamic-app .left-nav-cta {
  display: grid;
  gap: .45rem;
  padding-top: .25rem;
}
.dynamic-app .left-nav-cta .btn {
  width: 100%;
  justify-content: center;
}
.dynamic-app .left-nav-cta .btn.ghost {
  color: #eaf7ff !important;
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.14) !important;
}
.dynamic-app main,
.dynamic-app .footer {
  transition: padding-left .22s ease;
}
@media (min-width: 900px) {
  .dynamic-app main,
  .dynamic-app .footer {
    padding-left: calc(var(--rail-collapsed) + 10px);
  }
}

/* Enterprise premium navigation and page polish */
.dynamic-app {
  font-family: var(--font-body);
  background: #f4f7fb;
  color: #101c2d;
  overflow-x: hidden;
}
.dynamic-app.no-left-nav main,
.dynamic-app.no-left-nav .footer {
  padding-left: 0 !important;
}
.dynamic-app.ecommerce-app {
  --navy:#061426;
  --navy-2:#0b2444;
  --blue:#1167d8;
  --cyan:#1bb8ff;
  --orange:#f59a23;
  --ink:#101c2d;
  --soft:#f4f7fb;
  --line:#d9e5f2;
  --rail-collapsed:58px;
  --rail-open:324px;
}
.dynamic-app .compact-commerce-nav {
  background: rgba(255,255,255,.97);
  border-bottom: 1px solid rgba(16,45,78,.12);
  box-shadow: 0 10px 34px rgba(8,29,58,.1);
}
.dynamic-app .compact-commerce-nav .nav-shell {
  width: min(1520px, calc(100% - 40px));
  min-height: 76px;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .55rem 0;
}
.dynamic-app .compact-commerce-nav .brand {
  min-width: 156px;
}
.dynamic-app .compact-commerce-nav .brand img {
  width: auto;
  height: 50px;
  max-width: 176px;
}
.dynamic-app .compact-commerce-nav .nav-links {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: clamp(1rem, 2.5vw, 2.4rem);
  gap: .2rem;
}
.dynamic-app .compact-commerce-nav .nav-links > a {
  color: #172c45;
  min-height: 42px;
  padding: .62rem .76rem;
  border-radius: 8px;
  font-size: .86rem;
  font-weight: 800;
}
.dynamic-app .compact-commerce-nav .nav-links > a:hover,
.dynamic-app .compact-commerce-nav .nav-links > a:focus-visible {
  background: #eef6ff;
  color: var(--blue);
  outline: none;
}
.dynamic-app .compact-commerce-nav .nav-mega-group {
  position: static;
}
.dynamic-app .compact-commerce-nav .nav-mega-group > button {
  position: relative;
  min-height: 42px;
  padding: .62rem .76rem;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #172c45;
  font-size: .86rem;
  font-weight: 800;
  cursor: pointer;
}
.dynamic-app .compact-commerce-nav .nav-mega-group > button::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: .45rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  opacity: .68;
}
.dynamic-app .compact-commerce-nav .nav-mega-group > button:hover,
.dynamic-app .compact-commerce-nav .nav-mega-group > button:focus-visible {
  background: #eef6ff;
  color: var(--blue);
  outline: none;
}
.dynamic-app .compact-commerce-nav .nav-mega-group:hover > button,
.dynamic-app .compact-commerce-nav .nav-mega-group:focus-within > button {
  color: #0f63d6;
}
.dynamic-app .compact-commerce-nav .nav-mega-group:hover > button::before,
.dynamic-app .compact-commerce-nav .nav-mega-group:focus-within > button::before {
  content: "";
  position: absolute;
  left: .72rem;
  right: .72rem;
  bottom: -17px;
  height: 3px;
  background: #0f63d6;
}
.dynamic-app:has(.nav-mega-group:hover) main,
.dynamic-app:has(.nav-mega-group:focus-within) main {
  filter: brightness(.54);
}
.dynamic-app .compact-commerce-nav .mega-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  width: 100vw;
  min-height: 430px;
  padding: 1.7rem clamp(1.25rem, 4vw, 3.5rem) 0;
  background: rgba(255,255,255,.99);
  border-top: 1px solid rgba(16,45,78,.1);
  border-bottom: 1px solid rgba(16,45,78,.14);
  box-shadow: 0 30px 80px rgba(8,29,58,.2);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-10px);
  transition: opacity .16s ease, transform .16s ease;
  overflow: hidden;
}
.dynamic-app .compact-commerce-nav .mega-panel-xl {
  width: 100vw;
}
.dynamic-app .compact-commerce-nav .nav-mega-group:hover .mega-panel,
.dynamic-app .compact-commerce-nav .nav-mega-group:focus-within .mega-panel {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.dynamic-app .compact-commerce-nav .mega-layout {
  width: min(1480px, calc(100vw - 96px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.25fr 1fr 1fr 1fr;
  gap: clamp(1.2rem, 3vw, 3.4rem);
}
.dynamic-app .compact-commerce-nav .mega-layout.three-col {
  grid-template-columns: 1.25fr 1fr 1fr;
}
.dynamic-app .compact-commerce-nav .enterprise-mega-layout.compact-four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.dynamic-app .compact-commerce-nav .mega-column {
  display: grid;
  align-content: start;
  gap: .22rem;
  padding: 0;
  border-radius: 8px;
}
.dynamic-app .compact-commerce-nav .mega-column.primary {
  background: #f4f8fd;
  border: 1px solid #d9e5f2;
}
.dynamic-app .compact-commerce-nav .mega-super {
  display: block;
  padding-bottom: .78rem;
  margin-bottom: .82rem;
  color: #15263a;
  border-bottom: 1px solid #d9e5f2;
  font-size: .86rem;
  font-weight: 600;
  letter-spacing: .01em;
  text-transform: uppercase;
}
.dynamic-app .compact-commerce-nav .mega-label {
  display: block;
  margin-bottom: .55rem;
  color: #15263a;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.dynamic-app .compact-commerce-nav .mega-column a {
  display: grid;
  gap: .15rem;
  min-height: 33px;
  padding: .35rem 0;
  border-radius: 0;
  color: #293b50;
  font-size: .82rem;
  font-weight: 650;
  line-height: 1.25;
}
.dynamic-app .compact-commerce-nav .mega-column a:hover,
.dynamic-app .compact-commerce-nav .mega-column a:focus-visible {
  background: transparent;
  color: #0f63d6;
  outline: none;
}
.dynamic-app .compact-commerce-nav .mega-feature {
  min-height: 84px;
  padding: .72rem;
  background: #fff;
  border: 1px solid #d9e5f2;
  box-shadow: 0 12px 30px rgba(8,29,58,.06);
}
.dynamic-app .compact-commerce-nav .mega-feature strong {
  color: #0f1e32;
  font-size: .96rem;
}
.dynamic-app .compact-commerce-nav .mega-feature span {
  color: #5d7188;
  font-size: .8rem;
  line-height: 1.4;
}
.dynamic-app .compact-commerce-nav .mega-promo-strip {
  width: min(1480px, calc(100vw - 96px));
  min-height: 118px;
  margin: 1.7rem auto 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  background: #edf3f9;
  border-top: 1px solid #d7e3ef;
}
.dynamic-app .compact-commerce-nav .mega-promo-strip a {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) max-content;
  grid-template-rows: auto auto;
  align-items: center;
  gap: 1rem;
  min-height: 118px;
  padding: 1rem 1.15rem;
  color: #172c45;
  text-decoration: none;
  border-right: 1px solid #d7e3ef;
}
.dynamic-app .compact-commerce-nav .mega-promo-strip a:last-child {
  border-right: 0;
}
.dynamic-app .compact-commerce-nav .mega-promo-strip img {
  grid-row: 1 / span 2;
  width: 92px;
  height: 74px;
  object-fit: cover;
  border-radius: 4px;
}
.dynamic-app .compact-commerce-nav .mega-promo-strip span {
  grid-column: 2;
  min-width: 0;
}
.dynamic-app .compact-commerce-nav .mega-promo-strip strong,
.dynamic-app .compact-commerce-nav .mega-promo-strip small {
  display: block;
}
.dynamic-app .compact-commerce-nav .mega-promo-strip strong {
  color: #142338;
  font-size: .88rem;
  font-weight: 900;
  line-height: 1.18;
}
.dynamic-app .compact-commerce-nav .mega-promo-strip small {
  margin-top: .32rem;
  color: #51657c;
  font-size: .78rem;
  line-height: 1.35;
}
.dynamic-app .compact-commerce-nav .mega-promo-strip em {
  grid-column: 3;
  grid-row: 1 / span 2;
  align-self: center;
  margin-top: 0;
  color: #0f63d6;
  font-size: .78rem;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}
.dynamic-app .compact-commerce-nav .nav-links > a[href="/shop"]:first-of-type {
  background: transparent;
  border: 0;
  color: #172c45;
}
.dynamic-app .compact-commerce-nav .nav-actions {
  margin-left: auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: .5rem;
  min-width: max-content;
}
.dynamic-app .compact-commerce-nav .nav-actions .small-btn,
.dynamic-app .compact-commerce-nav .client-login {
  min-height: 40px;
  padding: .58rem .82rem;
  border-radius: 8px;
  font-size: .8rem;
  font-weight: 850;
  box-shadow: none;
}
.dynamic-app .compact-commerce-nav .nav-actions .top-action {
  color: #17304d;
  background: #fff;
  border: 1px solid #d9e5f2;
}
.dynamic-app .compact-commerce-nav .nav-actions .top-action:hover,
.dynamic-app .compact-commerce-nav .nav-actions .btn.ghost:hover {
  color: var(--blue);
  border-color: rgba(17,103,216,.34);
  background: #f5faff;
}
.dynamic-app .compact-commerce-nav .nav-actions .top-action[href="/shop"]:first-child {
  color: #fff;
  background: #0f63d6;
  border-color: #0f63d6;
}
.dynamic-app .compact-commerce-nav .nav-actions .btn.ghost:not(.top-action) {
  color: #17304d;
  background: transparent;
  border-color: transparent;
}
.dynamic-app .compact-commerce-nav .client-login {
  color: #fff;
  background: linear-gradient(135deg, #13b9ff, #1167d8);
  border: 1px solid rgba(17,103,216,.3);
  box-shadow: 0 12px 30px rgba(17,103,216,.25);
}
.dynamic-app .account-access-menu {
  position: relative;
}
.dynamic-app .account-access-menu summary {
  list-style: none;
  cursor: pointer;
}
.dynamic-app .account-access-menu summary::-webkit-details-marker {
  display: none;
}
.dynamic-app .account-access-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 120;
  width: min(330px, calc(100vw - 32px));
  padding: .95rem;
  display: grid;
  gap: .34rem;
  color: #0c1c30;
  background: #fff;
  border: 1px solid rgba(17,103,216,.18);
  border-radius: 8px;
  box-shadow: 0 26px 70px rgba(4,20,39,.22);
}
.dynamic-app .account-access-panel .eyebrow {
  color: #1167d8;
  margin-bottom: .2rem;
}
.dynamic-app .account-access-panel a {
  min-height: 38px;
  display: flex;
  align-items: center;
  padding: .58rem .66rem;
  color: #10233b;
  text-decoration: none;
  border-radius: 8px;
  font-size: .86rem;
  font-weight: 800;
}
.dynamic-app .account-access-panel a:hover,
.dynamic-app .account-access-panel a:focus-visible {
  color: #0f63d6;
  background: #f1f7ff;
}
.dynamic-app .compact-commerce-nav .nav-toggle span {
  background: #17304d;
}
.dynamic-app .section {
  padding: clamp(58px, 6vw, 86px) 0;
}
.dynamic-app .section.alt {
  background: linear-gradient(180deg, #fff, #f7faff);
}
.dynamic-app .section.dark {
  color: #fff;
  background:
    linear-gradient(120deg, rgba(13,62,121,.9), rgba(5,18,38,.98) 42%, rgba(4,13,28,.98)),
    #061426;
  border-bottom: 1px solid rgba(27,184,255,.14);
}
.dynamic-app .section.dark::before {
  opacity: .3;
}
.dynamic-app .section-head {
  gap: .85rem;
}
.dynamic-app .eyebrow {
  color: #0f63d6;
  letter-spacing: .06em;
  font-weight: 900;
}
.dynamic-app .dark .eyebrow {
  color: #39c7ff;
}
.dynamic-app .hero-copy h1,
.dynamic-app .section-head h1 {
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.04;
}
.dynamic-app .section-head h2 {
  font-weight: 650;
  letter-spacing: 0;
}
.dynamic-app .lead {
  color: #4d6178;
}
.dynamic-app .dark .lead,
.dynamic-app .dark p {
  color: rgba(239,247,255,.76);
}
.dynamic-app .card,
.dynamic-app .media-card,
.dynamic-app .checkout-summary,
.dynamic-app .marketplace-toolbar,
.dynamic-app .module-card,
.dynamic-app .pain-solution-grid .card,
.dynamic-app .metric-card {
  border: 1px solid rgba(14,47,84,.1);
  box-shadow: 0 18px 48px rgba(8,29,58,.08);
}
.dynamic-app .media-card,
.dynamic-app .card {
  background: rgba(255,255,255,.96);
}
.dynamic-app .media-card:hover,
.dynamic-app .card:hover {
  box-shadow: 0 24px 70px rgba(8,29,58,.13);
}
.dynamic-app .btn.primary {
  background: linear-gradient(135deg, #13b9ff, #1167d8);
}
.dynamic-app .btn.ghost {
  border-color: #d9e5f2;
}
.dynamic-app .left-nav-rail::before {
  background: rgba(6,20,38,.94);
  border-color: rgba(27,184,255,.22);
  box-shadow: 0 18px 56px rgba(6,20,38,.26);
}
.dynamic-app .left-nav-panel a:hover,
.dynamic-app .left-nav-panel summary:hover,
.dynamic-app .left-nav-panel a:focus-visible,
.dynamic-app .left-nav-panel summary:focus-visible {
  background: rgba(27,184,255,.15);
}
.dynamic-app .hero-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: .8rem;
}
.dynamic-app .hero-actions .btn {
  min-width: 220px;
}
.dynamic-app .quiet-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #d9efff;
  font-weight: 850;
  text-decoration: none;
  border-bottom: 1px solid rgba(57,199,255,.44);
}
.dynamic-app .quiet-link:hover,
.dynamic-app .quiet-link:focus-visible {
  color: #fff;
  border-bottom-color: #fff;
  outline: none;
}
.dynamic-app .hero-proof {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: 1.15rem;
}
.dynamic-app .hero-proof span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: .38rem .62rem;
  border-radius: 8px;
  color: #d9efff;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.11);
  font-size: .78rem;
  font-weight: 850;
}
.dynamic-app .hero.dynamic-hero {
  min-height: calc(100vh - 76px);
  padding: clamp(74px, 8vh, 112px) 0 clamp(72px, 8vh, 108px);
  display: flex;
  align-items: center;
  background:
    radial-gradient(circle at 70% 35%, rgba(27,184,255,.2), transparent 33%),
    radial-gradient(circle at 16% 20%, rgba(17,103,216,.22), transparent 34%),
    linear-gradient(112deg, #07152e 0%, #090f22 45%, #040914 100%);
}
.dynamic-app .dynamic-hero .hero-grid {
  width: min(1560px, calc(100% - 56px));
  grid-template-columns: minmax(360px, .86fr) minmax(520px, 1.14fr);
  gap: clamp(2rem, 5vw, 5.5rem);
}
.dynamic-app .dynamic-hero .hero-copy {
  gap: 1.2rem;
}
.dynamic-app .dynamic-hero .hero-copy h1 {
  max-width: 780px;
  font-size: clamp(3.35rem, 5.7vw, 6.9rem);
  line-height: .96;
}
.dynamic-app .dynamic-hero .lead {
  max-width: 660px;
  font-size: clamp(1.04rem, 1.25vw, 1.28rem);
}
.dynamic-app .dynamic-hero .visual-stage {
  min-height: clamp(520px, 62vh, 760px);
  border-radius: 8px;
  box-shadow: 0 42px 120px rgba(0,0,0,.48);
}
.dynamic-app .dynamic-hero .visual-stage img {
  min-height: clamp(520px, 62vh, 760px);
  filter: saturate(1.08) contrast(1.06);
}
.dynamic-app .dynamic-hero .visual-overlay {
  background:
    linear-gradient(90deg, rgba(4,9,20,.08), rgba(4,9,20,.34)),
    radial-gradient(circle at 26% 24%, rgba(27,184,255,.18), transparent 34%);
}
.dynamic-app .dynamic-hero .floating-panel {
  transform: scale(1.04);
}
.dynamic-app .dynamic-hero .panel-one { top: 9%; left: 7%; }
.dynamic-app .dynamic-hero .panel-two { right: 7%; top: 44%; }
.dynamic-app .dynamic-hero .panel-three { left: 9%; bottom: 9%; }

/* Homepage stage refinement */
.dynamic-app main {
  background:
    radial-gradient(circle at 88% 6%, rgba(27,184,255,.08), transparent 26%),
    linear-gradient(180deg, #f4f7fb 0%, #eef4fb 100%);
}
.dynamic-app .wrap {
  width: min(1400px, calc(100% - clamp(40px, 6vw, 104px)));
}
.dynamic-app .hero.dynamic-hero {
  min-height: clamp(780px, 86vh, 960px);
  padding: clamp(34px, 4.5vh, 58px) 0 clamp(44px, 5vh, 72px);
  background:
    radial-gradient(circle at 72% 30%, rgba(27,184,255,.2), transparent 30%),
    radial-gradient(circle at 7% 10%, rgba(31,116,230,.23), transparent 34%),
    linear-gradient(112deg, #081831 0%, #071022 48%, #030815 100%);
}
.dynamic-app .hero.dynamic-hero::before {
  opacity: .18;
}
.dynamic-app .dynamic-hero .hero-grid {
  width: min(1420px, calc(100% - clamp(48px, 7vw, 120px)));
  grid-template-columns: minmax(420px, .92fr) minmax(520px, 1.08fr);
  gap: clamp(2.2rem, 4vw, 4.8rem);
}
.dynamic-app .dynamic-hero .hero-copy h1 {
  max-width: 720px;
  font-size: clamp(3.15rem, 5vw, 6.15rem);
  line-height: .98;
}
.dynamic-app .dynamic-hero .lead {
  max-width: 620px;
}
.dynamic-app .dynamic-hero .visual-stage {
  min-height: clamp(480px, 52vh, 620px);
  border: 1px solid rgba(255,255,255,.14);
}
.dynamic-app .dynamic-hero .visual-stage img {
  min-height: clamp(480px, 52vh, 620px);
}
.dynamic-app .section:not(.dynamic-hero) {
  overflow: hidden;
}
.dynamic-app .section.dark:not(.dynamic-hero) {
  margin-inline: clamp(18px, 2.4vw, 42px);
  border-radius: 8px;
}
.dynamic-app .section.dark:not(.dynamic-hero) + .footer,
.dynamic-app .footer {
  width: 100%;
  margin: 0;
  padding: clamp(36px, 4.5vw, 64px) max(clamp(28px, 5vw, 96px), calc((100vw - 1400px) / 2));
  border-radius: 0;
  background:
    radial-gradient(circle at 8% 0%, rgba(27,184,255,.14), transparent 28%),
    linear-gradient(120deg, #071426, #03101f);
  border: 0;
  border-top: 1px solid rgba(27,184,255,.16);
  box-shadow: none;
  grid-template-columns: minmax(300px, 1.35fr) minmax(180px, .75fr) minmax(180px, .75fr);
  align-items: start;
  gap: clamp(1.2rem, 4vw, 4rem);
}
.dynamic-app .footer > div:first-child {
  max-width: 560px;
}
.dynamic-app .footer p {
  color: rgba(231,242,252,.66);
}
.dynamic-app .benchmark-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
  margin: 0 0 clamp(1rem, 2.4vw, 2rem);
}
.dynamic-app .benchmark-strip span {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .7rem .85rem;
  border: 1px solid rgba(16,45,78,.11);
  border-radius: 8px;
  background: #fff;
  color: #0c1d33;
  font-weight: 850;
  text-align: center;
  box-shadow: 0 12px 34px rgba(8,29,58,.06);
}
.dynamic-app .pricing-tier-grid,
.dynamic-app .faq-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(.9rem, 1.8vw, 1.4rem);
}
.dynamic-app .faq-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.dynamic-app .pricing-tier {
  display: flex;
  flex-direction: column;
  gap: .72rem;
}
.dynamic-app .pricing-tier strong {
  color: #075ea8;
  font-size: clamp(1.25rem, 2vw, 1.85rem);
  line-height: 1.05;
}
.dynamic-app .pricing-tier .btn {
  margin-top: auto;
}
.dynamic-app .faq-card h3 {
  margin-bottom: .55rem;
}
.dynamic-app .breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .45rem;
  margin-bottom: .8rem;
  color: rgba(239,247,255,.72);
  font-size: .82rem;
  font-weight: 800;
}
.dynamic-app .breadcrumb a {
  color: #d9efff;
  text-decoration: none;
  border-bottom: 1px solid rgba(57,199,255,.35);
}
.dynamic-app .service-detail-hero .button-stack {
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  max-width: 640px;
}
.dynamic-app .pricing-note {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media (max-width: 820px) {
  .dynamic-app .footer {
    grid-template-columns: 1fr;
  }
  .dynamic-app .benchmark-strip,
  .dynamic-app .pricing-tier-grid,
  .dynamic-app .faq-grid {
    grid-template-columns: 1fr;
  }
  .dynamic-app .service-detail-hero .button-stack {
    grid-template-columns: 1fr;
    max-width: none;
  }
}
@media (min-width: 900px) {
  .dynamic-app .left-nav-rail {
    top: min(790px, calc(100vh - 170px));
  }
  .dynamic-app .left-nav-rail:hover,
  .dynamic-app .left-nav-rail:focus-within,
  .dynamic-app .left-nav-rail.is-open {
    top: 96px;
  }
}
@media (min-width: 981px) {
  .dynamic-app .compact-commerce-nav .nav-toggle {
    display: none;
  }
  .dynamic-app .compact-commerce-nav .nav-links {
    position: static;
    display: flex !important;
    max-height: none;
    overflow: visible;
    padding: 0;
    background: transparent;
  }
  .dynamic-app .compact-commerce-nav .nav-actions {
    margin-left: auto !important;
    flex-wrap: nowrap !important;
  }
  .dynamic-app .compact-commerce-nav .nav-actions .client-login {
    display: inline-flex;
  }
}
@media (min-width: 981px) and (max-width: 1250px) {
  .dynamic-app .compact-commerce-nav .nav-actions {
    gap: .36rem;
  }
  .dynamic-app .compact-commerce-nav .nav-actions .small-btn,
  .dynamic-app .compact-commerce-nav .client-login {
    padding: .5rem .62rem;
    font-size: .74rem;
  }
  .dynamic-app .compact-commerce-nav .nav-actions .top-action[href="/contact"] {
    display: none;
  }
}
@media (max-width: 980px) {
  .dynamic-app:has(.nav-mega-group:hover) main,
  .dynamic-app:has(.nav-mega-group:focus-within) main {
    filter: none;
  }
  .dynamic-app .compact-commerce-nav .nav-shell {
    width: min(100% - 24px, 760px);
  }
  .dynamic-app .compact-commerce-nav .nav-links {
    left: 12px;
    right: 12px;
    top: 78px;
    display: none;
    grid-template-columns: 1fr;
    border: 1px solid rgba(17,103,216,.16);
    background: rgba(255,255,255,.98);
    box-shadow: 0 18px 56px rgba(8,29,58,.14);
  }
  .dynamic-app .compact-commerce-nav .nav-shell.open .nav-links {
    display: grid !important;
  }
  .dynamic-app .compact-commerce-nav .nav-links > a {
    color: #17304d;
  }
  .dynamic-app .compact-commerce-nav .nav-mega-group {
    position: relative;
  }
  .dynamic-app .compact-commerce-nav .nav-mega-group > button {
    width: 100%;
    text-align: left;
    color: #17304d;
  }
  .dynamic-app .compact-commerce-nav .mega-panel,
  .dynamic-app .compact-commerce-nav .mega-panel-xl {
    position: static;
    display: none;
    width: 100%;
    min-height: 0;
    padding: .7rem;
    box-shadow: none;
    border: 1px solid #d9e5f2;
    border-radius: 8px;
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
  .dynamic-app .compact-commerce-nav .nav-mega-group:hover .mega-panel,
  .dynamic-app .compact-commerce-nav .nav-mega-group:focus-within .mega-panel {
    display: block;
  }
  .dynamic-app .compact-commerce-nav .mega-layout,
  .dynamic-app .compact-commerce-nav .mega-layout.three-col {
    width: 100%;
    grid-template-columns: 1fr;
    gap: .75rem;
  }
  .dynamic-app .compact-commerce-nav .enterprise-mega-layout.compact-four {
    grid-template-columns: 1fr;
  }
  .dynamic-app .compact-commerce-nav .mega-super {
    padding-bottom: .5rem;
    margin-bottom: .5rem;
  }
  .dynamic-app .compact-commerce-nav .mega-promo-strip {
    width: 100%;
    min-height: 0;
    margin-top: .85rem;
    grid-template-columns: 1fr;
    border: 1px solid #d7e3ef;
  }
  .dynamic-app .compact-commerce-nav .mega-promo-strip a {
    grid-template-columns: 58px minmax(0, 1fr);
    min-height: 82px;
    padding: .72rem;
    border-right: 0;
    border-bottom: 1px solid #d7e3ef;
  }
  .dynamic-app .compact-commerce-nav .mega-promo-strip a:last-child {
    border-bottom: 0;
  }
  .dynamic-app .compact-commerce-nav .mega-promo-strip img {
    width: 58px;
    height: 52px;
  }
  .dynamic-app .compact-commerce-nav .mega-promo-strip em {
    grid-column: 2;
    grid-row: auto;
  }
  .dynamic-app .compact-commerce-nav .nav-actions {
    margin-left: auto !important;
  }
}
@media (max-width: 720px) {
  .dynamic-app .compact-commerce-nav .nav-shell {
    min-height: 106px;
  }
  .dynamic-app .compact-commerce-nav .nav-actions {
    justify-content: flex-start;
    flex-wrap: wrap;
    overflow: visible;
  }
  .dynamic-app .compact-commerce-nav .client-login,
  .dynamic-app .compact-commerce-nav .nav-actions .small-btn {
    min-height: 32px;
    padding: .36rem .4rem;
    font-size: .64rem;
  }
  .dynamic-app .hero-actions {
    display: grid;
    gap: .6rem;
  }
  .dynamic-app .hero-actions .btn {
    width: 100%;
    min-width: 0;
  }
  .dynamic-app .quiet-link {
    justify-content: center;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 8px;
  }
  .dynamic-app .hero.dynamic-hero {
    min-height: auto;
    padding: 54px 0 56px;
  }
  .dynamic-app .dynamic-hero .hero-grid {
    width: min(100% - 32px, 620px);
    grid-template-columns: 1fr;
    gap: 1.3rem;
  }
  .dynamic-app .dynamic-hero .hero-copy h1 {
    font-size: clamp(2.35rem, 12vw, 3.4rem);
  }
  .dynamic-app .dynamic-hero .visual-stage,
  .dynamic-app .dynamic-hero .visual-stage img {
    min-height: 300px;
  }
}
@media (min-width: 1220px) {
  .dynamic-app:has(.left-nav-rail:hover) main,
  .dynamic-app:has(.left-nav-rail:focus-within) main,
  .dynamic-app:has(.left-nav-rail.is-open) main,
  .dynamic-app:has(.left-nav-rail:hover) .footer,
  .dynamic-app:has(.left-nav-rail:focus-within) .footer,
  .dynamic-app:has(.left-nav-rail.is-open) .footer {
    padding-left: calc(var(--rail-open) + 12px);
  }
}
@media (max-width: 1180px) {
  .dynamic-app .compact-commerce-nav .nav-links {
    left: 10px;
    right: 10px;
    top: 76px;
  }
  .dynamic-app .compact-commerce-nav .nav-links > a {
    justify-content: flex-start;
  }
  .dynamic-app .compact-commerce-nav .nav-actions {
    display: flex;
    flex-wrap: wrap;
  }
  .dynamic-app .left-nav-rail {
    top: min(790px, calc(100vh - 170px));
  }
  .dynamic-app .left-nav-rail:not(:hover):not(:focus-within):not(.is-open) {
    max-height: var(--rail-collapsed);
  }
}
@media (max-width: 720px) {
  .dynamic-app .compact-commerce-nav .nav-shell {
    min-height: 112px;
    align-content: center;
    align-items: center;
    flex-wrap: wrap;
    row-gap: .42rem;
    padding: .5rem .55rem .58rem;
  }
  .dynamic-app .compact-commerce-nav .brand img,
  .dynamic-app .compact-commerce-nav .brand img {
    height: 34px;
    max-width: 150px;
  }
  .dynamic-app .compact-commerce-nav .nav-toggle {
    order: 2;
    margin-left: auto;
  }
  .dynamic-app .compact-commerce-nav .nav-actions {
    order: 3;
    flex: 1 0 100%;
    gap: .3rem;
    max-width: 100%;
    padding-bottom: .05rem;
    overflow: visible;
    flex-wrap: wrap;
    scrollbar-width: none;
  }
  .dynamic-app .compact-commerce-nav .nav-actions::-webkit-scrollbar { display: none; }
  .dynamic-app .compact-commerce-nav .client-login,
  .dynamic-app .compact-commerce-nav .nav-actions .small-btn {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: .36rem .4rem;
    font-size: .64rem;
  }
  .dynamic-app .compact-commerce-nav .client-login {
    display: inline-flex;
  }
  .dynamic-app .left-nav-rail {
    top: auto;
    bottom: 16px;
    left: 12px;
    max-height: calc(100vh - 140px);
  }
  .dynamic-app .left-nav-rail:not(:hover):not(:focus-within):not(.is-open) {
    max-height: var(--rail-collapsed);
  }
  .dynamic-app .left-nav-panel {
    max-height: calc(100vh - 202px);
  }
  .dynamic-app .compact-commerce-nav .nav-links {
    top: 122px;
  }
  .dynamic-app .dynamic-hero,
  .dynamic-app .hero.dynamic-hero {
    min-height: auto;
  }
}

/* Final homepage containment pass */
@media (min-width: 721px) {
  .dynamic-app .hero.dynamic-hero {
    min-height: clamp(780px, 86vh, 960px);
    padding-top: clamp(34px, 4.5vh, 58px);
    padding-bottom: clamp(44px, 5vh, 72px);
  }
  .dynamic-app .dynamic-hero .visual-stage,
  .dynamic-app .dynamic-hero .visual-stage img {
    min-height: clamp(480px, 52vh, 620px);
  }
}

/* Restored single left navigator */
.dynamic-app.has-left-nav main,
.dynamic-app.has-left-nav .footer {
  padding-left: 0 !important;
}
.dynamic-app.has-left-nav .left-nav-rail {
  top: calc(100vh + 18px);
  left: 14px;
  z-index: 88;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-10px);
  transition: width .22s ease, max-height .22s ease, box-shadow .22s ease, opacity .18s ease, transform .18s ease;
}
.dynamic-app.has-left-nav .left-nav-rail.is-after-hero {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(0);
}
.dynamic-app.has-left-nav .left-nav-rail:hover,
.dynamic-app.has-left-nav .left-nav-rail:focus-within,
.dynamic-app.has-left-nav .left-nav-rail.is-open {
  max-height: calc(100vh - 126px);
}
@media (max-width: 720px) {
  .dynamic-app.has-left-nav .left-nav-rail,
  .dynamic-app.has-left-nav .left-nav-rail:hover,
  .dynamic-app.has-left-nav .left-nav-rail:focus-within,
  .dynamic-app.has-left-nav .left-nav-rail.is-open {
    top: auto;
    bottom: 16px;
  }
}

/* Button and card alignment pass */
.dynamic-app .btn,
.dynamic-app button.btn,
.dynamic-app a.btn,
.dynamic-app .client-login,
.dynamic-app .quiet-link,
.dynamic-app .footer-socials a,
.dynamic-app .compact-commerce-nav .nav-mega-group > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.15;
}
.dynamic-app .btn,
.dynamic-app .client-login {
  min-height: 44px;
}
.dynamic-app .small-btn,
.dynamic-app .compact-commerce-nav .nav-actions .small-btn,
.dynamic-app .compact-commerce-nav .client-login {
  min-height: 40px;
}
.dynamic-app .button-stack .btn,
.dynamic-app .hero-actions .btn,
.dynamic-app .section.dark .split > .actions .btn {
  justify-content: center;
}
.dynamic-app .card-cluster.diagonal > .media-card:nth-child(n),
.dynamic-app .card-cluster.diagonal > .media-card:hover {
  transform: none;
}
.dynamic-app .media-card {
  height: 100%;
}
.dynamic-app .media-card .card-body {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.dynamic-app .media-card .card-actions {
  margin-top: auto;
}
.dynamic-app .card-actions .btn {
  width: 100%;
}

/* Balanced card image framing */
.dynamic-app .card-media,
.dynamic-app .media-card .card-media {
  object-position: 50% 42%;
}
.dynamic-app .card-media[src*="human-consulting"],
.dynamic-app .card-media[src*="client-portal-team"],
.dynamic-app .card-media[src*="software-workflow-team"] {
  object-position: 50% 36%;
}
.dynamic-app .card-media[src*="social-ai-workstation"],
.dynamic-app .card-media[src*="security-operations-team"],
.dynamic-app .card-media[src*="ai-ml-workflow"] {
  object-position: 50% 48%;
}
.dynamic-app .media-card:hover .card-media {
  transform-origin: center center;
}
@media (max-width: 720px) {
  .dynamic-app .card-media,
  .dynamic-app .media-card .card-media {
    object-position: 50% 38%;
  }
}

/* Footer typography scale */
.dynamic-app .footer {
  font-size: .88rem;
  line-height: 1.48;
}
.dynamic-app .footer p,
.dynamic-app .footer a {
  font-size: .84rem;
  line-height: 1.48;
}
.dynamic-app .footer h3 {
  font-size: .92rem;
  line-height: 1.25;
  margin-bottom: .62rem;
}
.dynamic-app .footer-socials a {
  min-height: 28px;
  padding: .28rem .46rem;
  font-size: .76rem;
}

/* Platform flow alignment */
.dynamic-app .feature-row {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  align-items: stretch;
}
.dynamic-app .feature-chip {
  display: flex;
  align-items: center;
  min-height: 56px;
  transform: none !important;
}
.dynamic-app .intent-row {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.dynamic-app .intent-row .feature-chip {
  justify-content: center;
  text-align: center;
  text-decoration: none;
  border: 1px solid rgba(16,45,78,.12);
  box-shadow: 0 16px 42px rgba(16,45,78,.08);
}
.dynamic-app .intent-row .feature-chip:hover,
.dynamic-app .intent-row .feature-chip:focus-visible {
  border-color: rgba(27,184,255,.55);
  color: #075ea8;
}
@media (max-width: 860px) {
  .dynamic-app .feature-row {
    grid-template-columns: 1fr !important;
  }
}

/* Device adaptive system pass */
.dynamic-app,
.dynamic-app * {
  box-sizing: border-box;
}
html,
body.dynamic-app {
  max-width: 100%;
  overflow-x: hidden;
}
.dynamic-app img,
.dynamic-app video,
.dynamic-app canvas,
.dynamic-app svg {
  max-width: 100%;
}
.dynamic-app h1,
.dynamic-app h2,
.dynamic-app h3,
.dynamic-app p,
.dynamic-app a,
.dynamic-app button,
.dynamic-app span {
  overflow-wrap: break-word;
}
.dynamic-app .wrap,
.dynamic-app .dynamic-hero .hero-grid {
  width: min(1420px, calc(100% - clamp(28px, 5vw, 96px)));
}
.dynamic-app .section {
  padding-block: clamp(42px, 5.6vw, 86px);
}
.dynamic-app .split,
.dynamic-app .hero-grid,
.dynamic-app .admin-split,
.dynamic-app .chat-console,
.dynamic-app .pain-solution-grid {
  min-width: 0;
}
.dynamic-app .card-cluster.diagonal,
.dynamic-app .card-cluster.horizontal,
.dynamic-app .module-grid,
.dynamic-app .integration-grid,
.dynamic-app .market-grid,
.dynamic-app .data-examples,
.dynamic-app .service-compare,
.dynamic-app .portal-modules,
.dynamic-app .command-center,
.dynamic-app .metrics-grid,
.dynamic-app .estimate-band {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}
.dynamic-app .workflow-timeline {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
}
.dynamic-app .marketplace-toolbar,
.dynamic-app .dynamic-filter,
.dynamic-app .form-grid,
.dynamic-app .check-grid,
.dynamic-app .compact-checks {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
}
.dynamic-app input,
.dynamic-app select,
.dynamic-app textarea,
.dynamic-app button {
  min-width: 0;
  max-width: 100%;
}
.dynamic-app .table-card,
.dynamic-app .admin-table,
.dynamic-app .full-table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.dynamic-app .btn,
.dynamic-app .client-login,
.dynamic-app .quiet-link {
  white-space: normal;
}
.dynamic-app .left-nav-rail:not(:hover):not(:focus-within):not(.is-open) .left-nav-panel {
  transform: none;
}

@media (max-width: 1180px) {
  .dynamic-app .dynamic-hero .hero-grid,
  .dynamic-app .hero-grid,
  .dynamic-app .workflow-showcase .split,
  .dynamic-app .section.dark .split,
  .dynamic-app .section.alt .split,
  .dynamic-app .commerce-hero .split {
    grid-template-columns: 1fr;
  }
  .dynamic-app .dynamic-hero .hero-copy,
  .dynamic-app .section-head,
  .dynamic-app .lead {
    max-width: 820px;
  }
  .dynamic-app .dynamic-hero .visual-stage,
  .dynamic-app .dynamic-hero .visual-stage img,
  .dynamic-app .visual-stage,
  .dynamic-app .workflow-image,
  .dynamic-app .product-visual {
    min-height: clamp(340px, 48vw, 560px);
  }
  .dynamic-app .floating-panel {
    max-width: min(240px, 42vw);
  }
  .dynamic-app .footer {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 900px) {
  .dynamic-app.ecommerce-app {
    --fixed-nav-offset: 124px;
  }
  .dynamic-app .wrap,
  .dynamic-app .dynamic-hero .hero-grid {
    width: min(100% - 28px, 760px);
  }
  .dynamic-app .compact-commerce-nav .nav-shell {
    width: calc(100% - 20px);
    flex-wrap: wrap;
  }
  .dynamic-app .compact-commerce-nav .brand {
    order: 1;
  }
  .dynamic-app .compact-commerce-nav .nav-toggle {
    order: 2;
    margin-left: auto;
  }
  .dynamic-app .compact-commerce-nav .nav-links {
    order: 4;
  }
  .dynamic-app .compact-commerce-nav .nav-actions {
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    flex: 1 0 100% !important;
    order: 3;
    margin-left: 0 !important;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .35rem;
  }
  .dynamic-app .compact-commerce-nav .nav-actions .top-action[href="/contact"],
  .dynamic-app .compact-commerce-nav .nav-actions .top-action[href="/setup-admin"] {
    display: none;
  }
  .dynamic-app .compact-commerce-nav .nav-actions .btn,
  .dynamic-app .compact-commerce-nav .client-login {
    width: 100%;
    padding-inline: .45rem;
  }
  .dynamic-app .compact-commerce-nav .nav-actions .btn.ghost:not(.top-action) {
    color: #17304d;
    background: #fff;
    border: 1px solid #d9e5f2;
  }
  .dynamic-app .feature-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .dynamic-app .footer {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .dynamic-app.ecommerce-app {
    --fixed-nav-offset: 112px;
  }
  .dynamic-app .wrap,
  .dynamic-app .dynamic-hero .hero-grid {
    width: calc(100% - 22px);
  }
  .dynamic-app .section {
    padding-block: clamp(34px, 9vw, 54px);
  }
  .dynamic-app .compact-commerce-nav .nav-shell {
    width: calc(100% - 14px);
    min-height: auto;
    padding: .46rem;
  }
  .dynamic-app .compact-commerce-nav .brand img {
    height: 32px;
    max-width: 146px;
  }
  .dynamic-app .compact-commerce-nav .nav-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dynamic-app .compact-commerce-nav .nav-actions .btn,
  .dynamic-app .compact-commerce-nav .client-login {
    min-height: 34px;
    font-size: .68rem;
  }
  .dynamic-app .compact-commerce-nav .nav-links {
    top: 116px;
    left: 8px;
    right: 8px;
    max-height: calc(100vh - 126px);
  }
  .dynamic-app .hero-actions,
  .dynamic-app .button-stack,
  .dynamic-app .actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }
  .dynamic-app .hero-actions .btn,
  .dynamic-app .button-stack .btn,
  .dynamic-app .actions .btn,
  .dynamic-app .quiet-link {
    width: 100%;
    min-width: 0;
  }
  .dynamic-app .feature-row {
    grid-template-columns: 1fr !important;
  }
  .dynamic-app .feature-chip,
  .dynamic-app .card,
  .dynamic-app .media-card,
  .dynamic-app .module-card,
  .dynamic-app .metric-card {
    min-height: auto;
  }
  .dynamic-app .visual-stage,
  .dynamic-app .workflow-image,
  .dynamic-app .product-visual,
  .dynamic-app .visual-stage img,
  .dynamic-app .workflow-image img,
  .dynamic-app .product-visual img {
    min-height: 260px;
  }
  .dynamic-app .floating-panel {
    position: static;
    width: auto;
    max-width: none;
    margin: .55rem;
  }
  .dynamic-app .cookie-banner {
    left: 8px;
    right: 8px;
    bottom: 8px;
    width: calc(100% - 16px);
    max-height: min(72vh, 520px);
    overflow: auto;
  }
}

@media (max-width: 420px) {
  .dynamic-app .compact-commerce-nav .nav-actions {
    grid-template-columns: 1fr 1fr;
  }
  .dynamic-app .compact-commerce-nav .nav-actions .top-action[href="/contact"],
  .dynamic-app .compact-commerce-nav .nav-actions .top-action[href="/setup-admin"] {
    display: none;
  }
  .dynamic-app .dynamic-hero .hero-copy h1,
  .dynamic-app .hero-copy h1,
  .dynamic-app .section-head h1 {
    font-size: clamp(2rem, 11vw, 2.7rem);
    line-height: 1.02;
  }
}

/* Balanced footer, visible social icons, and assistant widget */
.dynamic-app.has-left-nav .balanced-footer,
.dynamic-app .balanced-footer {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: clamp(34px, 4vw, 58px) clamp(28px, 6vw, 96px) !important;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  align-items: stretch;
  justify-items: center;
  text-align: left;
  background: #061426;
  border-top: 1px solid rgba(36,200,255,.2);
}
.dynamic-app .balanced-footer > div {
  width: 100%;
  max-width: 360px;
  display: grid;
  align-content: start;
  justify-items: start;
  text-align: left;
  gap: .48rem;
  padding: 0 clamp(18px, 3vw, 46px);
}
.dynamic-app .balanced-footer > div + div { border-left: 1px solid rgba(255,255,255,.16); }
.dynamic-app .balanced-footer img {
  width: min(190px, 70%);
  max-height: 82px;
  object-fit: contain;
  margin-bottom: .45rem;
}
.dynamic-app .balanced-footer h3 {
  color: #fff;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.dynamic-app .balanced-footer p {
  max-width: 330px;
  color: #b9cce0;
  margin: 0;
}
.dynamic-app .balanced-footer .footer-link-panel a,
.dynamic-app .balanced-footer .footer-link-panel h3 {
  width: 100%;
}
.dynamic-app .balanced-footer a {
  color: #d9ecff;
  text-decoration: none;
}
.dynamic-app .balanced-footer a:hover,
.dynamic-app .balanced-footer a:focus-visible { color: #54d4ff; }
.dynamic-app .footer-control-menu {
  position: relative;
  width: 100%;
}
.dynamic-app .footer-control-menu summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  justify-items: start;
  gap: .45rem;
}
.dynamic-app .footer-control-menu summary::-webkit-details-marker {
  display: none;
}
.dynamic-app .footer-control-trigger {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .35rem .55rem;
  color: #dceeff;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 8px;
  background: rgba(255,255,255,.07);
  font-size: .76rem;
  font-weight: 900;
  text-transform: uppercase;
}
.dynamic-app .footer-hamburger {
  width: 18px;
  display: grid;
  gap: 3px;
}
.dynamic-app .footer-hamburger i {
  height: 2px;
  display: block;
  border-radius: 999px;
  background: #dceeff;
}
.dynamic-app .footer-control-panel {
  position: absolute;
  left: 0;
  bottom: calc(100% + 12px);
  z-index: 100;
  width: min(380px, calc(100vw - 40px));
  padding: 1rem;
  display: grid;
  gap: .34rem;
  color: #0c1c30;
  background: #fff;
  border: 1px solid rgba(17,103,216,.18);
  border-radius: 8px;
  box-shadow: 0 28px 80px rgba(0,0,0,.28);
}
.dynamic-app .footer-control-panel h3 {
  color: #0c1c30;
  margin: 0;
}
.dynamic-app .footer-control-panel p {
  color: #526984;
  max-width: none;
  margin: 0 0 .35rem;
}
.dynamic-app .footer-control-panel a {
  min-height: 36px;
  display: flex;
  align-items: center;
  padding: .54rem .62rem;
  color: #10233b;
  border-radius: 8px;
  font-size: .84rem;
  font-weight: 800;
}
.dynamic-app .footer-control-panel a:hover,
.dynamic-app .footer-control-panel a:focus-visible {
  color: #0f63d6;
  background: #f1f7ff;
}
.dynamic-app .icon-socials {
  justify-content: center;
  align-items: center;
  gap: .55rem;
  margin-top: .65rem;
}
.dynamic-app .icon-socials .social-icon {
  width: 34px;
  height: 34px;
  padding: 0;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  font-weight: 900;
  font-size: .78rem;
  text-transform: uppercase;
  border: 1px solid rgba(255,255,255,.2);
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}
.dynamic-app .social-icon.linkedin { background: #0a66c2; }
.dynamic-app .social-icon.website { background: linear-gradient(135deg, #1bb8ff, #1167d8); }
.dynamic-app .social-icon.gmail {
  color: #d93025;
  background:
    linear-gradient(135deg, #4285f4 0 18%, transparent 18%),
    linear-gradient(225deg, #34a853 0 18%, transparent 18%),
    linear-gradient(45deg, #fbbc05 0 18%, transparent 18%),
    linear-gradient(315deg, #ea4335 0 18%, #fff 18%);
}
.dynamic-app .social-icon.updates { background: #f59a23; color: #071426; }
.dynamic-app .ai-assistant-widget {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 80;
  width: min(310px, calc(100vw - 34px));
  display: grid;
  gap: .65rem;
  padding: .8rem;
  border-radius: 8px;
  background: #fff;
  border: 1px solid rgba(13,44,75,.16);
  box-shadow: 0 24px 70px rgba(5,18,34,.28);
  color: #182f48;
  transition: opacity .18s ease, transform .18s ease;
}
.dynamic-app .ai-assistant-widget.is-hidden {
  opacity: 0;
  pointer-events: none;
  transform: translateY(16px);
}
.dynamic-app .ai-assistant-close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 999px;
  background: rgba(6,20,38,.84);
  color: #fff;
  cursor: pointer;
}
.dynamic-app .assistant-photo {
  height: 190px;
  border-radius: 8px;
  overflow: hidden;
  background: #061426;
}
.dynamic-app .assistant-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
}
.dynamic-app .ai-assistant-widget p {
  margin: 0;
  color: #253b55;
  font-size: .86rem;
  line-height: 1.45;
}
.dynamic-app .assistant-actions {
  display: grid;
  gap: .42rem;
}
.dynamic-app .assistant-input {
  display: grid;
  grid-template-columns: 1fr 36px;
  gap: .35rem;
  align-items: center;
}
.dynamic-app .assistant-input input {
  min-height: 38px;
  border-radius: 8px;
  border: 1px solid rgba(18,52,88,.18);
  padding: .5rem .65rem;
  font-size: .82rem;
}
.dynamic-app .assistant-input button,
.dynamic-app .ai-assistant-launcher {
  border: 0;
  border-radius: 8px;
  background: linear-gradient(135deg, #1bb8ff, #1167d8);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}
.dynamic-app .assistant-input button { min-height: 38px; }
.dynamic-app .ai-assistant-launcher {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 79;
  width: 54px;
  height: 54px;
  display: none;
  place-items: center;
  border-radius: 999px;
  box-shadow: 0 18px 45px rgba(5,18,34,.28);
}
.dynamic-app .ai-assistant-launcher.is-visible { display: grid; }
.dynamic-app .account-flow { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 980px) {
  .dynamic-app .account-access-menu {
    width: 100%;
  }
  .dynamic-app .account-access-panel {
    position: static;
    width: 100%;
    margin-top: .55rem;
    box-shadow: none;
  }
  .dynamic-app.has-left-nav .balanced-footer,
  .dynamic-app .balanced-footer {
    grid-template-columns: 1fr;
    text-align: left;
  }
  .dynamic-app .balanced-footer > div {
    max-width: 560px;
    padding: 1.25rem 0;
  }
  .dynamic-app .balanced-footer > div + div {
    border-left: 0;
    border-top: 1px solid rgba(255,255,255,.16);
  }
  .dynamic-app .footer-control-panel {
    position: static;
    width: 100%;
    margin: .75rem 0;
  }
  .dynamic-app .account-flow { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .dynamic-app .ai-assistant-widget {
    right: 12px;
    bottom: 12px;
    max-height: calc(100dvh - 24px);
    overflow-y: auto;
  }
  .dynamic-app .assistant-photo {
    height: 112px;
  }
  .dynamic-app .ai-assistant-launcher {
    right: 14px;
    bottom: 14px;
  }
}

.dynamic-app footer.balanced-footer,
.dynamic-app footer.balanced-footer > div,
.dynamic-app footer.balanced-footer p,
.dynamic-app footer.balanced-footer h3,
.dynamic-app footer.balanced-footer a {
  text-align: left !important;
}
.dynamic-app footer.balanced-footer .icon-socials {
  justify-content: flex-start !important;
}

/* Top utility contact bar and company profile pass */
.dynamic-app.ecommerce-app {
  --fixed-nav-offset: 110px;
}
.dynamic-app .top-utility-bar {
  min-height: 34px;
  background:
    linear-gradient(90deg, rgba(245,154,35,.08), transparent 18%, transparent 82%, rgba(36,200,255,.08)),
    #061426;
  border-bottom: 1px solid rgba(245,154,35,.32);
  color: #edf7ff;
}
.dynamic-app .top-utility-inner {
  width: min(1520px, calc(100% - 40px));
  min-height: 34px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: .34rem;
}
.dynamic-app .utility-link {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  gap: .34rem;
  padding: .22rem .48rem;
  border-radius: 999px;
  color: #eaf6ff;
  text-decoration: none;
  font-size: .74rem;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
  border: 1px solid transparent;
}
.dynamic-app .utility-link:hover,
.dynamic-app .utility-link:focus-visible {
  color: #70dcff;
  background: rgba(36,200,255,.1);
  border-color: rgba(36,200,255,.22);
  outline: none;
}
.dynamic-app .utility-icon {
  min-width: 24px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(255,255,255,.1);
  color: #fff;
  font-size: .62rem;
  font-weight: 700;
  text-transform: uppercase;
}
.dynamic-app .icon-svg {
  width: 1em;
  height: 1em;
  display: block;
  flex: 0 0 auto;
}
.dynamic-app .utility-icon .icon-svg {
  width: 13px;
  height: 13px;
}
.dynamic-app .social-icon .icon-svg {
  width: 18px;
  height: 18px;
}
.dynamic-app .contact-method-icon .icon-svg {
  width: 20px;
  height: 20px;
}
.dynamic-app .mobile-quick-contact span .icon-svg {
  width: 17px;
  height: 17px;
}
.dynamic-app .utility-link.whatsapp .utility-icon,
.dynamic-app .social-icon.whatsapp,
.dynamic-app .quick-whatsapp span {
  background: linear-gradient(135deg, #20c764, #0a8f48);
  color: #fff;
}
.dynamic-app .utility-link.phone .utility-icon,
.dynamic-app .social-icon.phone {
  background: linear-gradient(135deg, #1bb8ff, #1167d8);
}
.dynamic-app .utility-link.email .utility-icon {
  background: linear-gradient(135deg, #f59a23, #f6c85e);
  color: #061426;
}
.dynamic-app .utility-link.consultation {
  margin-left: auto;
  border-color: rgba(245,154,35,.38);
  background: rgba(245,154,35,.08);
}
.dynamic-app .utility-link.consultation .utility-icon,
.dynamic-app .social-icon.consultation {
  background: #f59a23;
  color: #061426;
}
.dynamic-app .social-icon.facebook { background: #1877f2; }
.dynamic-app .social-icon.instagram { background: linear-gradient(135deg, #f58529, #dd2a7b 50%, #515bd4); }
.dynamic-app .social-icon.x { background: #111; }
.dynamic-app .social-icon.youtube { background: #ff0033; }
.dynamic-app .social-icon.social-linkedin,
.dynamic-app .utility-link.social-linkedin .utility-icon { background: #0a66c2; color: #fff; }
.dynamic-app .social-icon.social-facebook,
.dynamic-app .utility-link.social-facebook .utility-icon { background: #1877f2; color: #fff; }
.dynamic-app .social-icon.social-instagram,
.dynamic-app .utility-link.social-instagram .utility-icon { background: linear-gradient(135deg, #f58529, #dd2a7b 50%, #515bd4); color: #fff; }
.dynamic-app .social-icon.social-x,
.dynamic-app .utility-link.social-x .utility-icon { background: #111; color: #fff; }
.dynamic-app .social-icon.social-youtube,
.dynamic-app .utility-link.social-youtube .utility-icon { background: #ff0033; color: #fff; }
.dynamic-app .social-icon.social-github,
.dynamic-app .utility-link.social-github .utility-icon { background: #24292f; color: #fff; }
.dynamic-app .icon-socials .social-icon {
  text-transform: none;
}
.dynamic-app .mobile-quick-contact {
  display: none;
}
.dynamic-app .contact-method-grid,
.dynamic-app .about-objective-grid,
.dynamic-app .about-build-grid,
.dynamic-app .about-expert-grid {
  display: grid;
  gap: 1rem;
}
.dynamic-app .contact-method-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.dynamic-app .contact-method-card {
  min-height: 156px;
  display: grid;
  align-content: start;
  gap: .58rem;
  padding: 1.1rem;
  border-radius: 8px;
  border: 1px solid rgba(16,45,78,.12);
  background: #fff;
  color: #132842;
  text-decoration: none;
  box-shadow: 0 18px 48px rgba(8,29,58,.08);
}
.dynamic-app .contact-method-card:hover,
.dynamic-app .contact-method-card:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(36,200,255,.4);
  box-shadow: 0 24px 58px rgba(8,29,58,.12);
  outline: none;
}
.dynamic-app .contact-method-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #eef7ff;
  color: #1167d8;
  font-weight: 700;
  font-size: .72rem;
  text-transform: uppercase;
}
.dynamic-app .contact-method-card.primary-contact {
  border-color: rgba(32,199,100,.32);
  background: linear-gradient(135deg, rgba(32,199,100,.08), #fff 44%);
}
.dynamic-app .contact-method-card.primary-contact .contact-method-icon {
  background: linear-gradient(135deg, #20c764, #0a8f48);
  color: #fff;
}
.dynamic-app .contact-method-card strong {
  font-size: 1rem;
}
.dynamic-app .contact-method-card small {
  color: #516a85;
  line-height: 1.5;
}
.dynamic-app .contact-form-layout {
  align-items: stretch;
}
.dynamic-app .contact-note-card {
  align-content: center;
}
.dynamic-app .about-company-hero {
  background:
    radial-gradient(circle at 80% 18%, rgba(36,200,255,.22), transparent 32%),
    radial-gradient(circle at 8% 22%, rgba(245,154,35,.14), transparent 28%),
    linear-gradient(116deg, #061426 0%, #092344 56%, #03101f 100%);
}
.dynamic-app .about-hero-grid,
.dynamic-app .about-team-grid {
  align-items: center;
}
.dynamic-app .about-hero-card {
  overflow: hidden;
  border-radius: 8px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 28px 90px rgba(0,0,0,.26);
}
.dynamic-app .about-hero-card img {
  width: 100%;
  height: clamp(280px, 35vw, 430px);
  object-fit: cover;
  object-position: 50% 45%;
  display: block;
}
.dynamic-app .about-hero-card-body {
  padding: 1.25rem;
}
.dynamic-app .about-hero-card-body h2,
.dynamic-app .about-hero-card-body p {
  color: #fff;
}
.dynamic-app .about-story-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
  gap: clamp(1.1rem, 3vw, 2.4rem);
  align-items: start;
}
.dynamic-app .about-story-lead,
.dynamic-app .mission-vision-card,
.dynamic-app .about-objective-card,
.dynamic-app .about-build-card,
.dynamic-app .about-expert-card,
.dynamic-app .ecosystem-note {
  border-radius: 8px;
  border: 1px solid rgba(16,45,78,.12);
  background: #fff;
  box-shadow: 0 18px 50px rgba(8,29,58,.08);
}
.dynamic-app .about-story-lead,
.dynamic-app .mission-vision-card,
.dynamic-app .ecosystem-note {
  padding: clamp(1.15rem, 2.4vw, 2rem);
}
.dynamic-app .about-proof-strip {
  display: grid;
  gap: .85rem;
}
.dynamic-app .about-proof-strip div {
  padding: 1rem;
  border-radius: 8px;
  background: #061426;
  color: #fff;
  border-left: 3px solid #f59a23;
}
.dynamic-app .about-proof-strip strong,
.dynamic-app .about-proof-strip span {
  display: block;
}
.dynamic-app .about-proof-strip span {
  margin-top: .3rem;
  color: #b9cce0;
  line-height: 1.45;
}
.dynamic-app .mission-vision-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.dynamic-app .mission-vision-card.accent {
  border-color: rgba(245,154,35,.28);
  background: linear-gradient(135deg, #fff, #fff8ef);
}
.dynamic-app .mission-vision-card blockquote {
  margin: 1rem 0 0;
  padding: 1rem;
  border-left: 3px solid #1bb8ff;
  border-radius: 8px;
  background: #f1f8ff;
  color: #0b2a4d;
  font-weight: 850;
}
.dynamic-app .mission-vision-card.accent blockquote {
  border-left-color: #f59a23;
  background: #fff4e2;
}
.dynamic-app .about-objective-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.dynamic-app .about-objective-card,
.dynamic-app .about-build-card,
.dynamic-app .about-expert-card {
  padding: 1rem;
}
.dynamic-app .about-objective-card span {
  color: #1167d8;
  font-weight: 600;
  letter-spacing: .08em;
}
.dynamic-app .about-build-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.dynamic-app .about-expert-grid {
  grid-template-columns: 1fr;
}
.dynamic-app .about-expert-card strong {
  color: #0c2542;
}
.dynamic-app .about-ecosystem-section {
  background:
    radial-gradient(circle at 78% 16%, rgba(245,154,35,.14), transparent 28%),
    linear-gradient(112deg, #071426, #091e38);
}
.dynamic-app .ecosystem-note {
  background: rgba(255,255,255,.96);
  color: #10233b;
}
.dynamic-app .centered,
.dynamic-app .centered-actions {
  text-align: center;
  justify-content: center;
}
@media (max-width: 1180px) {
  .dynamic-app .about-objective-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dynamic-app .about-build-grid,
  .dynamic-app .contact-method-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 900px) {
  .dynamic-app.ecommerce-app {
    --fixed-nav-offset: 158px;
  }
  .dynamic-app .top-utility-inner {
    width: 100%;
    padding: .25rem .65rem;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .dynamic-app .top-utility-inner::-webkit-scrollbar {
    display: none;
  }
  .dynamic-app .utility-link {
    flex: 0 0 auto;
    min-width: 34px;
    justify-content: center;
    padding: .2rem;
  }
  .dynamic-app .utility-label {
    display: none;
  }
  .dynamic-app .utility-link.consultation {
    margin-left: 0;
  }
  .dynamic-app .compact-commerce-nav .nav-links {
    top: var(--fixed-nav-offset);
    max-height: calc(100vh - var(--fixed-nav-offset) - 12px);
  }
  .dynamic-app .mission-vision-grid,
  .dynamic-app .about-story-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .dynamic-app.ecommerce-app {
    --fixed-nav-offset: 160px;
  }
  .dynamic-app .contact-method-grid,
  .dynamic-app .about-objective-grid,
  .dynamic-app .about-build-grid {
    grid-template-columns: 1fr;
  }
  .dynamic-app .mobile-quick-contact {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 10px;
    z-index: 88;
    display: none;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .35rem;
    padding: .38rem;
    border-radius: 8px;
    background: rgba(6,20,38,.96);
    border: 1px solid rgba(36,200,255,.22);
    box-shadow: 0 18px 48px rgba(0,0,0,.28);
  }
  .dynamic-app .mobile-quick-contact a {
    min-height: 42px;
    display: grid;
    place-items: center;
    grid-auto-flow: column;
    gap: .32rem;
    border-radius: 8px;
    color: #fff;
    background: rgba(255,255,255,.08);
    text-decoration: none;
    font-size: .72rem;
    font-weight: 900;
  }
  .dynamic-app .mobile-quick-contact span {
    min-width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    font-size: .58rem;
    text-transform: uppercase;
  }
}

/* Market-demand product catalog */
.dynamic-app {
  --color-navy-950: #061826;
  --color-navy-900: #082033;
  --color-navy-800: #0b2d45;
  --color-cyan-500: #21c7f3;
  --color-cyan-400: #4ddcff;
  --color-gold-500: #d9a441;
  --color-gold-400: #f0c766;
  --color-white: #fff;
  --color-offwhite: #f7fafc;
  --color-slate-900: #111827;
  --color-slate-700: #334155;
  --color-slate-500: #64748b;
  --color-border: #d8e1ea;
  --shadow-premium: 0 24px 70px rgba(6, 24, 38, .22);
}
.dynamic-app .hero-premium.product-services-hero,
.dynamic-app .catalog-detail-hero {
  padding: clamp(70px, 8vw, 118px) 0 clamp(52px, 6vw, 86px);
  background:
    radial-gradient(circle at 78% 18%, rgba(33,199,243,.22), transparent 34%),
    linear-gradient(135deg, #061826 0%, #082033 48%, #0b2d45 100%);
  overflow: hidden;
}
.dynamic-app .product-services-hero .lead,
.dynamic-app .catalog-detail-hero .lead {
  max-width: 780px;
  color: #d8e8f7;
}
.dynamic-app .catalog-proof {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin-top: 1rem;
}
.dynamic-app .catalog-proof span {
  border: 1px solid rgba(77,220,255,.28);
  color: #dff7ff;
  background: rgba(255,255,255,.07);
  border-radius: 999px;
  padding: .42rem .68rem;
  font-size: .78rem;
  font-weight: 800;
}
.dynamic-app .catalog-command-center,
.dynamic-app .catalog-detail-panel {
  border: 1px solid rgba(77,220,255,.22);
  background: rgba(4,17,31,.72);
  border-radius: 14px;
  box-shadow: var(--shadow-premium);
  overflow: hidden;
}
.dynamic-app .command-header {
  display: flex;
  align-items: center;
  gap: .45rem;
  min-height: 50px;
  padding: .8rem 1rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
  color: #fff;
}
.dynamic-app .command-header span {
  width: 11px;
  height: 11px;
  border-radius: 999px;
  background: var(--color-cyan-500);
}
.dynamic-app .command-header span:nth-child(2) { background: var(--color-gold-500); }
.dynamic-app .command-header span:nth-child(3) { background: #68d391; margin-right: .35rem; }
.dynamic-app .command-grid {
  display: grid;
  grid-template-columns: 1.6fr .8fr .8fr 1fr;
  gap: 0;
  color: #d8e8f7;
  font-size: .82rem;
}
.dynamic-app .command-grid > * {
  padding: .8rem;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.dynamic-app .command-grid b {
  color: #fff;
  background: rgba(33,199,243,.1);
}
.dynamic-app .catalog-spotlight-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.dynamic-app .market-product-card,
.dynamic-app .industry-catalog-card,
.dynamic-app .premium-card {
  border-radius: 8px;
  border: 1px solid rgba(13,44,75,.12);
  background: #fff;
  box-shadow: 0 18px 44px rgba(6,24,38,.09);
}
.dynamic-app .market-product-card {
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 168px 1fr;
}
.dynamic-app .market-card-top {
  display: flex;
  justify-content: space-between;
  gap: .65rem;
  padding: .78rem .9rem;
  color: var(--color-slate-700);
  font-size: .78rem;
  font-weight: 900;
}
.dynamic-app .badge.gold {
  background: rgba(217,164,65,.16);
  color: #7a5108;
  border-color: rgba(217,164,65,.36);
}
.dynamic-app .market-product-card img,
.dynamic-app .industry-catalog-card img,
.dynamic-app .catalog-detail-panel img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dynamic-app .market-card-body {
  display: grid;
  gap: .8rem;
  padding: 1rem;
}
.dynamic-app .market-card-body h3,
.dynamic-app .family-card h3,
.dynamic-app .premium-card h2,
.dynamic-app .premium-card h3 {
  color: var(--color-slate-900);
  letter-spacing: 0;
}
.dynamic-app .market-card-body p,
.dynamic-app .premium-card p,
.dynamic-app .industry-catalog-card p {
  color: var(--color-slate-700);
}
.dynamic-app .market-card-meta {
  display: grid;
  gap: .55rem;
  margin: 0;
}
.dynamic-app .market-card-meta div {
  padding-top: .55rem;
  border-top: 1px solid var(--color-border);
}
.dynamic-app .market-card-meta dt {
  color: var(--color-slate-900);
  font-weight: 900;
  font-size: .78rem;
}
.dynamic-app .market-card-meta dd {
  margin: .18rem 0 0;
  color: var(--color-slate-700);
  font-size: .86rem;
  line-height: 1.45;
}
.dynamic-app .product-family-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.dynamic-app .family-card {
  padding: 1.2rem;
}
.dynamic-app .family-card h3 {
  font-size: 1rem;
  line-height: 1.55;
  font-weight: 700;
}
.dynamic-app .family-links {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: 1rem 0;
}
.dynamic-app .family-links a,
.dynamic-app .industry-pill {
  text-decoration: none;
  color: #075985;
  background: #eef9ff;
  border: 1px solid #c9efff;
  border-radius: 999px;
  padding: .42rem .62rem;
  font-weight: 800;
  font-size: .78rem;
}
.dynamic-app .family-model {
  border-top: 1px solid var(--color-border);
  padding-top: .8rem;
}
.dynamic-app .industry-catalog-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.dynamic-app .industry-catalog-card {
  display: grid;
  grid-template-columns: 190px 1fr;
  overflow: hidden;
}
.dynamic-app .industry-catalog-card > div {
  padding: 1rem;
}
.dynamic-app .catalog-flow {
  display: grid;
  gap: .65rem;
}
.dynamic-app .flow-step {
  display: grid;
  grid-template-columns: minmax(210px, .85fr) 1fr;
  gap: 1rem;
  padding: .9rem 1rem;
  border-radius: 8px;
  background: #fff;
  border: 1px solid rgba(13,44,75,.12);
  box-shadow: 0 12px 28px rgba(6,24,38,.07);
}
.dynamic-app .flow-step b {
  color: var(--color-slate-900);
}
.dynamic-app .flow-step span {
  color: var(--color-slate-700);
}
.dynamic-app .pricing-paths {
  padding: 1.2rem;
}
.dynamic-app .pricing-paths article {
  padding: .85rem 0;
  border-top: 1px solid var(--color-border);
}
.dynamic-app .pricing-paths article strong {
  color: var(--color-slate-900);
}
.dynamic-app .delivery-method-grid,
.dynamic-app .product-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.dynamic-app .delivery-method-grid .premium-card,
.dynamic-app .product-detail-grid .premium-card {
  padding: 1rem;
}
.dynamic-app .delivery-method-grid .premium-card span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--color-cyan-500);
  color: #062033;
  font-weight: 700;
  margin-bottom: .75rem;
}
.dynamic-app .catalog-detail-panel {
  display: grid;
  grid-template-rows: 280px auto;
}
.dynamic-app .catalog-detail-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.dynamic-app .catalog-detail-stats span {
  display: grid;
  gap: .2rem;
  padding: .85rem 1rem;
  color: #c8dff2;
  border-top: 1px solid rgba(255,255,255,.09);
  border-right: 1px solid rgba(255,255,255,.09);
  font-size: .78rem;
}
.dynamic-app .catalog-detail-stats b {
  color: #fff;
  font-size: .95rem;
}
.dynamic-app .industry-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin-top: .9rem;
}
.dynamic-app .dark-card {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.15);
}
.dynamic-app .dark-card h2,
.dynamic-app .dark-card p {
  color: #fff;
}
.dynamic-app .rich-service-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.dynamic-app .rich-service-card {
  display: grid;
  align-content: start;
  gap: 1rem;
  padding: 1rem;
  border-radius: 8px;
  border: 1px solid rgba(13,44,75,.12);
  background: #fff;
  box-shadow: 0 18px 44px rgba(6,24,38,.08);
}
.dynamic-app .rich-service-head {
  display: grid;
  gap: .55rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid var(--color-border);
}
.dynamic-app .rich-service-head h3 {
  color: var(--color-slate-900);
  letter-spacing: 0;
}
.dynamic-app .rich-service-head p {
  color: var(--color-slate-700);
  line-height: 1.55;
}
.dynamic-app .rich-service-meta {
  display: grid;
  gap: .65rem;
  margin: 0;
}
.dynamic-app .rich-service-meta div {
  display: grid;
  gap: .2rem;
  min-height: 84px;
  padding: .72rem .78rem;
  border-radius: 8px;
  border: 1px solid rgba(13,44,75,.1);
  background: #f6f9fc;
}
.dynamic-app .rich-service-meta dt {
  color: #0c2542;
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.dynamic-app .rich-service-meta dd {
  margin: 0;
  color: #425d78;
  font-size: .88rem;
  line-height: 1.45;
}
.dynamic-app .rich-service-card .card-actions {
  align-self: end;
}
.dynamic-app .industry-specific-grid .rich-service-card:nth-child(odd) {
  border-top: 3px solid rgba(33,199,243,.74);
}
.dynamic-app .industry-specific-grid .rich-service-card:nth-child(even),
.dynamic-app .additional-services-grid .rich-service-card:nth-child(even) {
  border-top: 3px solid rgba(217,164,65,.68);
}
.dynamic-app .additional-services-grid .rich-service-card:nth-child(odd) {
  border-top: 3px solid rgba(245,158,11,.7);
}
@media (max-width: 1100px) {
  .dynamic-app .catalog-spotlight-grid,
  .dynamic-app .delivery-method-grid,
  .dynamic-app .product-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dynamic-app .industry-catalog-grid,
  .dynamic-app .product-family-grid,
  .dynamic-app .rich-service-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .dynamic-app .catalog-spotlight-grid,
  .dynamic-app .delivery-method-grid,
  .dynamic-app .product-detail-grid {
    grid-template-columns: 1fr;
  }
  .dynamic-app .industry-catalog-card,
  .dynamic-app .flow-step {
    grid-template-columns: 1fr;
  }
  .dynamic-app .industry-catalog-card img {
    height: 190px;
  }
  .dynamic-app .command-grid {
    grid-template-columns: 1fr 1fr;
  }
  .dynamic-app .catalog-detail-stats {
    grid-template-columns: 1fr;
  }
}

.dynamic-app .sms-compliance-card,
.dynamic-app .sms-consent-box,
.dynamic-app .policy-disclosure-box {
  border: 1px solid rgba(33, 199, 243, .28);
  background:
    linear-gradient(135deg, rgba(33, 199, 243, .08), rgba(217, 164, 65, .08)),
    #ffffff;
  box-shadow: 0 18px 48px rgba(8, 26, 48, .08);
}

.dynamic-app .sms-compliance-card {
  display: grid;
  gap: 1rem;
}

.dynamic-app .sms-compliance-card h2,
.dynamic-app .policy-disclosure-box h2,
.dynamic-app .sms-policy-body h2 {
  color: var(--color-slate-900);
  letter-spacing: 0;
}

.dynamic-app .sms-disclosure-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: .7rem;
}

.dynamic-app .sms-disclosure-list span {
  min-height: 44px;
  display: flex;
  align-items: center;
  padding: .75rem .85rem;
  border: 1px solid rgba(13, 44, 75, .1);
  border-radius: 8px;
  background: #f7fbff;
  color: #10243d;
  font-weight: 850;
  font-size: .9rem;
}

.dynamic-app .sms-consent-box {
  margin: 1rem 0;
  padding: 1rem;
  border-radius: 8px;
}

.dynamic-app .consent-check {
  display: flex;
  align-items: flex-start;
  gap: .72rem;
  color: #10243d;
  font-weight: 760;
  line-height: 1.5;
}

.dynamic-app .consent-check input {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin-top: .25rem;
}

.dynamic-app .policy-disclosure-box {
  margin-top: 1.25rem;
  padding: 1.15rem;
  border-radius: 8px;
}

.dynamic-app .sms-policy-body .list {
  display: grid;
  gap: .72rem;
}

.dynamic-app .sms-policy-body .list li {
  padding: .8rem .9rem;
  border-left: 3px solid rgba(33, 199, 243, .75);
  background: #f7fbff;
  border-radius: 0 8px 8px 0;
}

@media (max-width: 720px) {
  .dynamic-app .sms-disclosure-list {
    grid-template-columns: 1fr;
  }
  .dynamic-app .consent-check {
    font-size: .9rem;
  }
}

/* Premium top-bar restraint pass */
.dynamic-app .social-rail {
  display: none !important;
}

.dynamic-app .top-utility-bar {
  min-height: 32px;
  background:
    linear-gradient(90deg, rgba(217, 164, 65, .16), transparent 18%, transparent 82%, rgba(33, 199, 243, .16)),
    #041326;
  border-bottom: 1px solid rgba(217, 164, 65, .28);
}

.dynamic-app .top-utility-inner {
  width: min(1480px, calc(100% - 44px));
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .72rem;
}

.dynamic-app .top-utility-note {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .62rem;
  color: rgba(237, 247, 255, .74);
  font-size: .72rem;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
}

.dynamic-app .top-utility-note strong {
  color: #ffffff;
  font-size: .73rem;
  letter-spacing: .01em;
}

.dynamic-app .top-utility-note span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.dynamic-app .top-utility-contact,
.dynamic-app .top-utility-socials,
.dynamic-app .top-utility-book {
  display: flex;
  align-items: center;
  gap: .28rem;
}

.dynamic-app .top-utility-contact {
  padding-left: .76rem;
  border-left: 1px solid rgba(217, 164, 65, .38);
}

.dynamic-app .utility-link {
  min-height: 25px;
  gap: .28rem;
  padding: .16rem .42rem;
  font-size: .71rem;
  font-weight: 850;
  border-radius: 999px;
}

.dynamic-app .utility-icon {
  min-width: 21px;
  width: 21px;
  height: 21px;
  font-size: .55rem;
}

.dynamic-app .utility-link.social {
  width: 27px;
  min-width: 27px;
  padding: 0;
  border-color: rgba(255, 255, 255, .1);
  background: rgba(255, 255, 255, .055);
}

.dynamic-app .utility-link.social .utility-label {
  display: none;
}

.dynamic-app .utility-link.social .utility-icon {
  background: transparent;
  color: rgba(237, 247, 255, .82);
}

.dynamic-app .utility-link.social:hover .utility-icon,
.dynamic-app .utility-link.social:focus-visible .utility-icon {
  color: #70dcff;
}

.dynamic-app .utility-link.consultation {
  margin-left: 0;
  padding-inline: .58rem;
  background: rgba(217, 164, 65, .14);
  border-color: rgba(217, 164, 65, .34);
}

.dynamic-app .utility-link.consultation .utility-icon {
  display: none;
}

.dynamic-app .compact-commerce-nav .nav-shell {
  min-height: 70px;
}

.dynamic-app .compact-commerce-nav .brand img {
  height: 46px;
}

@media (max-width: 1280px) {
  .dynamic-app .top-utility-note {
    display: none;
  }

  .dynamic-app .top-utility-contact {
    margin-left: auto;
    padding-left: 0;
    border-left: 0;
  }

  .dynamic-app .compact-commerce-nav .nav-links > a,
  .dynamic-app .compact-commerce-nav .nav-mega-group > button {
    padding-inline: .56rem;
    font-size: .8rem;
  }
}

@media (max-width: 1040px) {
  .dynamic-app .top-utility-socials {
    display: none;
  }

  .dynamic-app .utility-link.email .utility-label {
    display: none;
  }
}

@media (max-width: 720px) {
  .dynamic-app.ecommerce-app {
    --fixed-nav-offset: 118px;
  }

  .dynamic-app .top-utility-bar {
    min-height: 31px;
  }

  .dynamic-app .top-utility-inner {
    width: 100%;
    min-height: 31px;
    justify-content: center;
    padding: .18rem .5rem;
    overflow: visible;
  }

  .dynamic-app .top-utility-contact {
    width: min(100%, 430px);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .28rem;
    margin: 0 auto;
  }

  .dynamic-app .top-utility-book,
  .dynamic-app .top-utility-socials {
    display: none;
  }

  .dynamic-app .top-utility-contact .utility-link {
    min-width: 0;
    justify-content: center;
    padding: .14rem .28rem;
  }

  .dynamic-app .top-utility-contact .utility-label {
    display: none;
  }

  .dynamic-app .compact-commerce-nav .nav-shell {
    min-height: auto;
  }
}

@media (min-width: 981px) and (max-width: 1320px) {
  .dynamic-app .compact-commerce-nav .nav-shell {
    width: calc(100% - 24px);
    min-height: 68px;
    gap: .42rem;
    flex-wrap: nowrap;
  }

  .dynamic-app .compact-commerce-nav .brand {
    flex: 0 0 124px;
    min-width: 124px;
  }

  .dynamic-app .compact-commerce-nav .brand img {
    height: 38px;
    max-width: 124px;
  }

  .dynamic-app .compact-commerce-nav .nav-toggle {
    display: none !important;
  }

  .dynamic-app .compact-commerce-nav .nav-links {
    position: static !important;
    display: flex !important;
    flex: 1 1 auto;
    min-width: 0;
    margin-left: .35rem;
    gap: .04rem;
    overflow: visible;
    padding: 0;
    background: transparent;
    box-shadow: none;
    border: 0;
  }

  .dynamic-app .compact-commerce-nav .nav-links > a,
  .dynamic-app .compact-commerce-nav .nav-mega-group > button {
    width: auto;
    min-height: 36px;
    padding: .5rem .42rem;
    color: #17304d;
    font-size: .74rem;
    white-space: nowrap;
  }

  .dynamic-app .compact-commerce-nav .nav-links > a[href="/"],
  .dynamic-app .compact-commerce-nav .nav-links > a[href="/case-studies"],
  .dynamic-app .compact-commerce-nav .nav-links > a[href="/contact"] {
    display: none;
  }

  .dynamic-app .compact-commerce-nav .nav-actions {
    margin-left: .3rem !important;
    gap: .28rem;
  }

  .dynamic-app .compact-commerce-nav .nav-actions .small-btn,
  .dynamic-app .compact-commerce-nav .client-login {
    min-height: 36px;
    padding: .48rem .56rem;
    font-size: .72rem;
  }

  .dynamic-app .compact-commerce-nav .mega-panel {
    top: 100%;
  }
}

/* Isolated commerce experience: deliberately does not style the site shell. */
.commerce-experience {
  --commerce-ink: #071426;
  --commerce-navy: #081a2e;
  --commerce-blue: #2f63e8;
  --commerce-cyan: #55d8ff;
  --commerce-gold: #f2bf62;
  --commerce-paper: #f3f6fa;
  --commerce-line: rgba(12, 42, 72, .12);
  --commerce-muted: #647386;
  --commerce-shadow: 0 26px 70px rgba(8, 26, 46, .13);
  color: var(--commerce-ink);
  background: var(--commerce-paper);
}

.commerce-experience,
.commerce-experience * { box-sizing: border-box; }

.commerce-experience .section { padding-block: clamp(58px, 7vw, 96px); }

.commerce-experience .eyebrow {
  color: #446178;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.commerce-experience .btn {
  min-height: 46px;
  border-radius: 12px;
  font-weight: 800;
  letter-spacing: -.01em;
}

.commerce-experience .btn.primary {
  color: #fff;
  border-color: var(--commerce-blue);
  background: var(--commerce-blue);
  box-shadow: 0 12px 28px rgba(47, 99, 232, .22);
}

.commerce-experience .btn.primary:hover { background: #214fc8; }

.commerce-experience .btn.secondary {
  color: #eef7ff;
  border-color: rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .08);
}

.commerce-experience .btn.ghost {
  color: #253e55;
  border-color: var(--commerce-line);
  background: #fff;
}

.commerce-experience .commerce-shop-hero,
.commerce-experience .commerce-product-hero,
.commerce-experience .commerce-cart-hero,
.commerce-experience .commerce-checkout-hero,
.commerce-experience .commerce-empty-cart {
  position: relative;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 76% 10%, rgba(85, 216, 255, .18), transparent 29%),
    radial-gradient(circle at 4% 100%, rgba(47, 99, 232, .25), transparent 36%),
    linear-gradient(132deg, #071426 0%, #0a2038 58%, #0b2b46 100%);
}

.commerce-experience .commerce-shop-hero::before,
.commerce-experience .commerce-product-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .12;
  background-image:
    linear-gradient(rgba(255,255,255,.24) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: linear-gradient(90deg, transparent, #000 42%, #000);
}

.commerce-experience .commerce-shop-hero-grid,
.commerce-experience .commerce-product-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(430px, 1.08fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}

.commerce-experience .commerce-shop-hero .section-head,
.commerce-experience .commerce-product-hero .section-head { margin: 0; }

.commerce-experience .commerce-shop-hero .eyebrow,
.commerce-experience .commerce-product-hero .eyebrow,
.commerce-experience .commerce-cart-hero .eyebrow,
.commerce-experience .commerce-checkout-hero .eyebrow,
.commerce-experience .commerce-empty-cart .eyebrow { color: var(--commerce-cyan); }

.commerce-experience .commerce-shop-hero h1,
.commerce-experience .commerce-product-hero h1 {
  max-width: 780px;
  margin: .85rem 0 1.15rem;
  color: #fff;
  font-size: clamp(2.65rem, 5vw, 5.2rem);
  line-height: .99;
  letter-spacing: -.055em;
}

.commerce-experience .commerce-shop-hero .lead,
.commerce-experience .commerce-product-hero .lead {
  max-width: 670px;
  color: #b7c9d8;
  font-size: clamp(1rem, 1.3vw, 1.16rem);
  line-height: 1.72;
}

.commerce-experience .commerce-shop-hero .actions,
.commerce-experience .commerce-product-hero .actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.5rem;
}

.commerce-experience .commerce-shop-hero .actions form,
.commerce-experience .commerce-product-hero .actions form { margin: 0; }

.commerce-experience .commerce-proof-row,
.commerce-experience .commerce-product-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
  margin-top: 1.7rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, .13);
}

.commerce-experience .commerce-proof-row span,
.commerce-experience .commerce-product-facts span {
  display: grid;
  gap: .18rem;
  color: #8fa6b9;
  font-size: .72rem;
}

.commerce-experience .commerce-proof-row strong,
.commerce-experience .commerce-product-facts strong {
  color: #fff;
  font-size: 1rem;
}

.commerce-experience .commerce-feature-panel,
.commerce-experience .commerce-product-visual {
  position: relative;
  min-height: clamp(480px, 48vw, 620px);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .15);
  border-radius: 26px;
  background: #06111f;
  box-shadow: 0 38px 90px rgba(0, 0, 0, .32);
}

.commerce-experience .commerce-feature-panel > img,
.commerce-experience .commerce-product-visual > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.94) contrast(1.04);
}

.commerce-experience .commerce-feature-shade,
.commerce-experience .commerce-product-image-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(7, 20, 38, .05) 30%, rgba(7, 20, 38, .92) 100%);
}

.commerce-experience .commerce-feature-card {
  position: absolute;
  left: 1.25rem;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 1;
  padding: 1.25rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 18px;
  background: rgba(7, 20, 38, .76);
  backdrop-filter: blur(16px);
}

.commerce-experience .commerce-recommended,
.commerce-experience .commerce-card-recommended {
  display: inline-flex;
  width: fit-content;
  padding: .38rem .62rem;
  border-radius: 999px;
  color: #1d2630;
  background: var(--commerce-gold);
  font-size: .65rem;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.commerce-experience .commerce-feature-card h2 {
  margin: .7rem 0 .55rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 2.1rem);
}

.commerce-experience .commerce-feature-card p { margin: .7rem 0; color: #b9cad8; font-size: .88rem; }

.commerce-experience .commerce-feature-price { display: flex; gap: .5rem; align-items: baseline; }
.commerce-experience .commerce-feature-price strong { color: #fff; font-size: 1.5rem; }
.commerce-experience .commerce-feature-price span { color: #90a7ba; font-size: .72rem; }
.commerce-experience .commerce-feature-card > a { color: var(--commerce-cyan); font-size: .82rem; font-weight: 800; }

.commerce-experience .commerce-catalog-section,
.commerce-experience .commerce-cart-section,
.commerce-experience .commerce-checkout-section,
.commerce-experience .commerce-product-scope { background: var(--commerce-paper); }

.commerce-experience .commerce-catalog-intro,
.commerce-experience .commerce-section-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(300px, .65fr);
  gap: clamp(1.5rem, 5vw, 5rem);
  align-items: end;
  margin-bottom: 1.6rem;
}

.commerce-experience .commerce-catalog-intro h2,
.commerce-experience .commerce-section-intro h2 {
  margin: .5rem 0 0;
  color: var(--commerce-ink);
  font-size: clamp(2rem, 3.5vw, 3.7rem);
  line-height: 1.05;
  letter-spacing: -.045em;
}

.commerce-experience .commerce-catalog-intro > p,
.commerce-experience .commerce-section-intro > p { color: var(--commerce-muted); line-height: 1.7; }

.commerce-experience .commerce-category-row {
  display: flex;
  gap: .5rem;
  overflow-x: auto;
  margin-bottom: 1rem;
  padding-bottom: .35rem;
  scrollbar-width: thin;
}

.commerce-experience .commerce-category-chip {
  flex: 0 0 auto;
  padding: .6rem .82rem;
  border: 1px solid var(--commerce-line);
  border-radius: 999px;
  color: #3e5368;
  background: #fff;
  font-size: .74rem;
  font-weight: 750;
}

.commerce-experience .commerce-category-chip:hover,
.commerce-experience .commerce-category-chip.is-active {
  color: #fff;
  border-color: var(--commerce-ink);
  background: var(--commerce-ink);
}

.commerce-experience .commerce-shop-toolbar {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(200px, .45fr) auto auto;
  gap: .7rem;
  align-items: end;
  margin-bottom: .9rem;
  padding: .9rem;
  border: 1px solid var(--commerce-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 14px 38px rgba(8, 26, 46, .06);
}

.commerce-experience .commerce-shop-toolbar label { display: grid; gap: .34rem; color: #526579; font-size: .7rem; font-weight: 800; }

.commerce-experience .commerce-shop-toolbar input,
.commerce-experience .commerce-shop-toolbar select {
  min-height: 46px;
  border: 1px solid #d7dfe8;
  border-radius: 11px;
  color: #20384f;
  background: #f8fafc;
}

.commerce-experience .commerce-result-meta {
  display: flex;
  gap: .35rem;
  align-items: baseline;
  margin: 1.1rem 0;
  color: var(--commerce-muted);
  font-size: .8rem;
}

.commerce-experience .commerce-result-meta strong { color: var(--commerce-ink); font-size: 1.35rem; }

.commerce-experience .commerce-product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.55rem);
}

.commerce-experience .commerce-product-card {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--commerce-line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 16px 48px rgba(8, 26, 46, .08);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.commerce-experience .commerce-product-card:hover,
.commerce-experience .commerce-product-card:focus-within {
  transform: translateY(-5px);
  border-color: rgba(47, 99, 232, .32);
  box-shadow: var(--commerce-shadow);
}

.commerce-experience .commerce-product-card.is-recommended {
  border-color: rgba(242, 191, 98, .72);
  box-shadow: 0 22px 65px rgba(111, 73, 10, .16);
}

.commerce-experience .commerce-product-media {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #0a1b30;
}

.commerce-experience .commerce-product-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(7, 20, 38, .62));
}

.commerce-experience .commerce-product-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.commerce-experience .commerce-product-card:hover .commerce-product-media img { transform: scale(1.035); }

.commerce-experience .commerce-product-category,
.commerce-experience .commerce-card-recommended {
  position: absolute;
  z-index: 1;
  top: .8rem;
}

.commerce-experience .commerce-product-category {
  left: .8rem;
  padding: .36rem .58rem;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  color: #fff;
  background: rgba(7, 20, 38, .68);
  font-size: .62rem;
  font-weight: 800;
  backdrop-filter: blur(10px);
}

.commerce-experience .commerce-card-recommended { right: .8rem; }

.commerce-experience .commerce-product-body {
  display: grid;
  align-content: start;
  gap: .8rem;
  padding: 1.2rem;
}

.commerce-experience .commerce-billing-label { color: var(--commerce-blue); font-size: .66rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }

.commerce-experience .commerce-product-body h3 { margin: 0; font-size: clamp(1.08rem, 1.4vw, 1.35rem); line-height: 1.2; }
.commerce-experience .commerce-product-body h3 a { color: var(--commerce-ink); }

.commerce-experience .commerce-product-body > p {
  display: -webkit-box;
  min-height: 4.6em;
  margin: 0;
  overflow: hidden;
  color: var(--commerce-muted);
  font-size: .83rem;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.commerce-experience .commerce-product-body > ul {
  display: grid;
  gap: .42rem;
  min-height: 5.25rem;
  margin: 0;
  padding: .85rem 0;
  border-block: 1px solid #e7ecf1;
  list-style: none;
}

.commerce-experience .commerce-product-body > ul li {
  position: relative;
  padding-left: 1.15rem;
  color: #45596d;
  font-size: .76rem;
}

.commerce-experience .commerce-product-body > ul li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--commerce-blue);
  font-weight: 900;
}

.commerce-experience .commerce-product-buy {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .8rem;
  align-items: end;
  margin-top: auto;
}

.commerce-experience .commerce-product-buy > div { display: grid; gap: .14rem; }
.commerce-experience .commerce-product-buy strong { color: var(--commerce-ink); font-size: 1.02rem; }
.commerce-experience .commerce-product-buy span { color: #7a8795; font-size: .66rem; }
.commerce-experience .commerce-product-buy form { margin: 0; }
.commerce-experience .commerce-product-buy .btn { min-height: 42px; padding: .55rem .78rem; font-size: .72rem; }

.commerce-experience .commerce-empty-results {
  grid-column: 1 / -1;
  padding: clamp(2rem, 6vw, 5rem);
  text-align: center;
  border: 1px dashed #cbd5df;
  border-radius: 22px;
  background: #fff;
}

.commerce-experience .commerce-breadcrumb { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: 1rem; color: #87a3b8; font-size: .74rem; }
.commerce-experience .commerce-breadcrumb a { color: var(--commerce-cyan); }

.commerce-experience .commerce-product-price {
  display: flex;
  width: fit-content;
  gap: .6rem;
  align-items: baseline;
  margin-top: 1.2rem;
  padding: .75rem .9rem;
  border: 1px solid rgba(255, 255, 255, .15);
  border-radius: 14px;
  background: rgba(255, 255, 255, .06);
}

.commerce-experience .commerce-product-price strong { color: #fff; font-size: 1.4rem; }
.commerce-experience .commerce-product-price span { color: #94aabd; font-size: .7rem; }

.commerce-experience .commerce-product-visual-label {
  position: absolute;
  left: 1.1rem;
  right: 1.1rem;
  bottom: 1.1rem;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 1rem;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 14px;
  background: rgba(7,20,38,.76);
  backdrop-filter: blur(14px);
}

.commerce-experience .commerce-product-visual-label span { color: #8fa8bb; font-size: .66rem; text-transform: uppercase; }
.commerce-experience .commerce-product-visual-label strong { color: #fff; font-size: .85rem; }

.commerce-experience .commerce-product-scope-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 2.5vw, 2rem);
}

.commerce-experience .commerce-product-scope-grid > article {
  display: grid;
  align-content: start;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2.6rem);
  border: 1px solid var(--commerce-line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 16px 46px rgba(8, 26, 46, .07);
}

.commerce-experience .commerce-product-scope-grid h2 { margin: 0; color: var(--commerce-ink); font-size: clamp(1.65rem, 2.6vw, 2.6rem); line-height: 1.08; }
.commerce-experience .commerce-product-scope-grid p { color: var(--commerce-muted); line-height: 1.7; }
.commerce-experience .commerce-product-scope-grid ul { display: grid; gap: .6rem; margin: 0; padding: 0; list-style: none; }
.commerce-experience .commerce-product-scope-grid li { padding: .68rem .75rem; border-radius: 10px; color: #344b60; background: #f2f6fb; font-size: .82rem; }
.commerce-experience .commerce-product-scope-grid .actions { margin-top: auto; }
.commerce-experience .commerce-text-link { color: var(--commerce-blue); font-size: .82rem; font-weight: 850; }

.commerce-experience .commerce-product-workflow {
  color: #fff;
  background:
    radial-gradient(circle at 8% 20%, rgba(47, 99, 232, .22), transparent 27%),
    linear-gradient(135deg, #071426, #0a223a);
}

.commerce-experience .commerce-product-workflow .eyebrow { color: var(--commerce-cyan); }
.commerce-experience .commerce-product-workflow .commerce-section-intro h2 { color: #fff; }
.commerce-experience .commerce-product-workflow .commerce-section-intro > p { color: #9eb2c3; }

.commerce-experience .commerce-workflow-track {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 2rem;
}

.commerce-experience .commerce-workflow-track::before {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  top: 20px;
  height: 1px;
  background: linear-gradient(90deg, var(--commerce-cyan), rgba(85,216,255,.25), var(--commerce-gold));
}

.commerce-experience .commerce-workflow-track article { position: relative; z-index: 1; }

.commerce-experience .commerce-workflow-track article > span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  margin-bottom: 1rem;
  border: 6px solid #0a2038;
  border-radius: 999px;
  color: #071426;
  background: var(--commerce-cyan);
  font-size: .62rem;
  font-weight: 900;
}

.commerce-experience .commerce-workflow-track article:last-child > span { background: var(--commerce-gold); }
.commerce-experience .commerce-workflow-track h3 { margin: 0 0 .45rem; color: #fff; font-size: .94rem; }
.commerce-experience .commerce-workflow-track p { color: #91a8ba; font-size: .77rem; line-height: 1.55; }

.commerce-experience .commerce-cart-hero,
.commerce-experience .commerce-checkout-hero { padding-block: clamp(50px, 6vw, 76px); }

.commerce-experience .commerce-cart-hero h1,
.commerce-experience .commerce-checkout-hero h1,
.commerce-experience .commerce-empty-cart h1 {
  margin: .6rem 0;
  color: #fff;
  font-size: clamp(2.35rem, 4.5vw, 4.5rem);
  letter-spacing: -.05em;
}

.commerce-experience .commerce-cart-hero p,
.commerce-experience .commerce-checkout-hero p,
.commerce-experience .commerce-empty-cart p { max-width: 680px; color: #aebfd0; }

.commerce-experience .commerce-cart-layout,
.commerce-experience .commerce-checkout-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, .42fr);
  gap: clamp(1.2rem, 3vw, 2.5rem);
  align-items: start;
}

.commerce-experience .commerce-cart-list { display: grid; gap: 1rem; }

.commerce-experience .commerce-cart-item {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 1rem;
  overflow: hidden;
  padding: .75rem;
  border: 1px solid var(--commerce-line);
  border-radius: 18px;
  background: #fff;
}

.commerce-experience .commerce-cart-item > a { min-height: 190px; overflow: hidden; border-radius: 12px; background: #0a1b30; }
.commerce-experience .commerce-cart-item img { width: 100%; height: 100%; object-fit: cover; }
.commerce-experience .commerce-cart-item > div { display: grid; align-content: start; gap: .55rem; padding: .45rem .35rem .35rem 0; }
.commerce-experience .commerce-cart-item > div > span { color: var(--commerce-blue); font-size: .65rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.commerce-experience .commerce-cart-item h2 { margin: 0; font-size: 1.2rem; }
.commerce-experience .commerce-cart-item h2 a { color: var(--commerce-ink); }
.commerce-experience .commerce-cart-item p { color: var(--commerce-muted); font-size: .78rem; line-height: 1.5; }

.commerce-experience .commerce-cart-item-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  align-items: center;
  margin-top: auto;
  padding-top: .7rem;
  border-top: 1px solid #e5eaf0;
}

.commerce-experience .commerce-cart-item-meta strong { color: var(--commerce-ink); }
.commerce-experience .commerce-cart-item-meta span { color: #768493; font-size: .72rem; }
.commerce-experience .commerce-cart-item-meta form { margin-left: auto; }
.commerce-experience .commerce-cart-item-meta button { border: 0; color: #9a3d46; background: transparent; font-size: .72rem; font-weight: 800; cursor: pointer; }

.commerce-experience .commerce-order-summary,
.commerce-experience .commerce-checkout-summary,
.commerce-experience .commerce-checkout-form {
  padding: clamp(1.25rem, 2.5vw, 2rem);
  border: 1px solid var(--commerce-line);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(8, 26, 46, .08);
}

.commerce-experience .commerce-order-summary,
.commerce-experience .commerce-checkout-summary { position: sticky; top: 110px; }
.commerce-experience .commerce-order-summary h2 { margin: .65rem 0; color: var(--commerce-ink); font-size: clamp(1.55rem, 2.6vw, 2.25rem); }
.commerce-experience .commerce-order-summary p { color: var(--commerce-muted); font-size: .8rem; line-height: 1.6; }
.commerce-experience .commerce-order-summary .btn { width: 100%; margin-top: .65rem; }

.commerce-experience .commerce-checkout-form { display: grid; gap: .85rem; }
.commerce-experience .commerce-checkout-form h2 { margin: 0 0 .35rem; color: var(--commerce-ink); }
.commerce-experience .commerce-checkout-form label { display: grid; gap: .36rem; color: #42586d; font-size: .76rem; font-weight: 800; }
.commerce-experience .commerce-checkout-form input,
.commerce-experience .commerce-checkout-form select {
  min-height: 50px;
  border: 1px solid #d5dee7;
  border-radius: 11px;
  color: #1c344a;
  background: #f8fafc;
}

.commerce-experience .commerce-checkout-form > p { color: #718091; font-size: .7rem; }
.commerce-experience .commerce-checkout-form > p a { color: var(--commerce-blue); text-decoration: underline; }

.commerce-experience .commerce-next-steps { display: grid; gap: .38rem; padding: .9rem; border-radius: 12px; background: #edf3fb; }
.commerce-experience .commerce-next-steps strong { color: var(--commerce-ink); font-size: .8rem; }
.commerce-experience .commerce-next-steps span { color: #50667b; font-size: .72rem; }

.commerce-experience .commerce-checkout-summary ul { display: grid; gap: .85rem; margin: 0; padding: 0; list-style: none; }
.commerce-experience .commerce-checkout-summary li { display: grid; grid-template-columns: 1fr auto; gap: .8rem; padding-bottom: .75rem; border-bottom: 1px solid #e4eaf0; }
.commerce-experience .commerce-checkout-summary li div { display: grid; gap: .25rem; }
.commerce-experience .commerce-checkout-summary li strong { color: var(--commerce-ink); font-size: .78rem; }
.commerce-experience .commerce-checkout-summary li span { color: #778594; font-size: .68rem; }
.commerce-experience .commerce-checkout-summary li b { color: var(--commerce-ink); font-size: .76rem; white-space: nowrap; }
.commerce-experience .commerce-checkout-summary > div { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1.2rem; }
.commerce-experience .commerce-checkout-summary > div span { color: #68788a; font-size: .76rem; }
.commerce-experience .commerce-checkout-summary > div strong { color: var(--commerce-ink); text-align: right; }
.commerce-experience .commerce-checkout-summary > a { display: inline-block; margin-top: 1rem; color: var(--commerce-blue); font-size: .75rem; font-weight: 800; }

.commerce-experience .commerce-empty-cart { min-height: 56vh; display: grid; align-items: center; }
.commerce-experience .commerce-empty-cart .wrap { position: relative; z-index: 1; }
.commerce-experience .commerce-empty-cart .btn { margin-top: 1.25rem; }

.commerce-experience a:focus-visible,
.commerce-experience button:focus-visible,
.commerce-experience input:focus-visible,
.commerce-experience select:focus-visible {
  outline: 3px solid rgba(85, 216, 255, .7);
  outline-offset: 3px;
}

@media (max-width: 1120px) {
  .commerce-experience .commerce-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .commerce-experience .commerce-shop-hero-grid,
  .commerce-experience .commerce-product-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(360px, .78fr); gap: 1.6rem; }
  .commerce-experience .commerce-shop-hero h1,
  .commerce-experience .commerce-product-hero h1 { font-size: clamp(2.55rem, 5.6vw, 4.3rem); }
}

@media (max-width: 900px) {
  .commerce-experience .commerce-shop-hero-grid,
  .commerce-experience .commerce-product-hero-grid { grid-template-columns: 1fr; }
  .commerce-experience .commerce-feature-panel,
  .commerce-experience .commerce-product-visual { min-height: 520px; }
  .commerce-experience .commerce-shop-toolbar { grid-template-columns: 1fr 1fr; }
  .commerce-experience .commerce-shop-toolbar .btn { width: 100%; }
  .commerce-experience .commerce-workflow-track { grid-template-columns: 1fr; }
  .commerce-experience .commerce-workflow-track::before { left: 20px; right: auto; top: 20px; bottom: 20px; width: 1px; height: auto; background: linear-gradient(180deg, var(--commerce-cyan), var(--commerce-gold)); }
  .commerce-experience .commerce-workflow-track article { display: grid; grid-template-columns: 42px 1fr; column-gap: 1rem; }
  .commerce-experience .commerce-workflow-track article > span { grid-row: 1 / 3; margin: 0; }
  .commerce-experience .commerce-workflow-track h3 { align-self: end; }
  .commerce-experience .commerce-product-scope-grid,
  .commerce-experience .commerce-cart-layout,
  .commerce-experience .commerce-checkout-layout { grid-template-columns: 1fr; }
  .commerce-experience .commerce-order-summary,
  .commerce-experience .commerce-checkout-summary { position: static; }
}

@media (max-width: 720px) {
  .commerce-experience .section { padding-block: 54px; }
  .commerce-experience .commerce-shop-hero h1,
  .commerce-experience .commerce-product-hero h1 { font-size: clamp(2.45rem, 11.5vw, 3.6rem); }
  .commerce-experience .commerce-shop-hero .actions,
  .commerce-experience .commerce-product-hero .actions { display: grid; grid-template-columns: 1fr; }
  .commerce-experience .commerce-shop-hero .btn,
  .commerce-experience .commerce-product-hero .btn,
  .commerce-experience .commerce-product-hero form,
  .commerce-experience .commerce-product-hero button { width: 100%; }
  .commerce-experience .commerce-proof-row,
  .commerce-experience .commerce-product-facts { gap: .35rem; }
  .commerce-experience .commerce-proof-row span,
  .commerce-experience .commerce-product-facts span { padding-right: .35rem; font-size: .62rem; }
  .commerce-experience .commerce-feature-panel,
  .commerce-experience .commerce-product-visual { min-height: 460px; border-radius: 20px; }
  .commerce-experience .commerce-catalog-intro,
  .commerce-experience .commerce-section-intro { grid-template-columns: 1fr; gap: .8rem; }
  .commerce-experience .commerce-shop-toolbar,
  .commerce-experience .commerce-product-grid { grid-template-columns: 1fr; }
  .commerce-experience .commerce-shop-toolbar input,
  .commerce-experience .commerce-shop-toolbar select,
  .commerce-experience .commerce-checkout-form input,
  .commerce-experience .commerce-checkout-form select { font-size: 16px; }
  .commerce-experience .commerce-product-body > p,
  .commerce-experience .commerce-product-body > ul { min-height: 0; }
  .commerce-experience .commerce-product-card:hover,
  .commerce-experience .commerce-product-card:focus-within { transform: none; }
  .commerce-experience .commerce-product-buy { grid-template-columns: 1fr; }
  .commerce-experience .commerce-product-buy .btn { width: 100%; }
  .commerce-experience .commerce-cart-item { grid-template-columns: 1fr; }
  .commerce-experience .commerce-cart-item > a { min-height: 220px; }
}

@media (prefers-reduced-motion: reduce) {
  .commerce-experience *,
  .commerce-experience *::before,
  .commerce-experience *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Scoped navigation, product, service, and resource readability pass. */
.dynamic-app .compact-commerce-nav .nav-mega-group {
  display: inline-grid;
  grid-template-columns: minmax(0, auto) 30px;
  align-items: center;
}

.dynamic-app .compact-commerce-nav .nav-section-link {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  padding: .62rem .34rem .62rem .76rem;
  border-radius: 8px 0 0 8px;
  color: #172c45;
  font-size: .86rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
}

.dynamic-app .compact-commerce-nav .nav-mega-group > .nav-section-toggle {
  position: relative;
  width: 30px;
  min-width: 30px;
  min-height: 42px;
  padding: 0;
  border: 0;
  border-radius: 0 8px 8px 0;
  color: #172c45;
  background: transparent;
  cursor: pointer;
}

.dynamic-app .compact-commerce-nav .nav-mega-group > .nav-section-toggle::after {
  content: "";
  position: absolute;
  left: 9px;
  top: 16px;
  width: 7px;
  height: 7px;
  margin: 0;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  opacity: .72;
  transform: rotate(45deg);
  transform-origin: 65% 65%;
  transition: transform .18s ease;
}

.dynamic-app .compact-commerce-nav .nav-mega-group:hover > .nav-section-link,
.dynamic-app .compact-commerce-nav .nav-mega-group:focus-within > .nav-section-link,
.dynamic-app .compact-commerce-nav .nav-mega-group.is-open > .nav-section-link,
.dynamic-app .compact-commerce-nav .nav-mega-group > .nav-section-toggle:hover,
.dynamic-app .compact-commerce-nav .nav-mega-group > .nav-section-toggle:focus-visible,
.dynamic-app .compact-commerce-nav .nav-mega-group.is-open > .nav-section-toggle {
  color: #0f63d6;
  background: #eef6ff;
  outline: none;
}

.dynamic-app .compact-commerce-nav .nav-mega-group:hover > .nav-section-toggle::before,
.dynamic-app .compact-commerce-nav .nav-mega-group:focus-within > .nav-section-toggle::before,
.dynamic-app .compact-commerce-nav .nav-mega-group.is-open > .nav-section-toggle::before {
  content: none;
}

.dynamic-app .compact-commerce-nav .nav-mega-group:hover .mega-panel,
.dynamic-app .compact-commerce-nav .nav-mega-group:focus-within .mega-panel {
  opacity: 0;
  pointer-events: none;
  transform: translateY(-10px);
}

.dynamic-app .compact-commerce-nav .nav-mega-group.is-open > .nav-section-toggle::after {
  transform: rotate(225deg);
}

.dynamic-app .compact-commerce-nav .nav-mega-group.is-open .mega-panel {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.dynamic-app .compact-commerce-nav :is(.mega-super, .mega-label) {
  font-weight: 600;
}

.dynamic-app .compact-commerce-nav .mega-column a {
  font-weight: 500;
  line-height: 1.4;
}

.dynamic-app .compact-commerce-nav .mega-promo-strip :is(strong, em) {
  font-weight: 600;
}

.dynamic-app .compact-commerce-nav .nav-links > a,
.dynamic-app .compact-commerce-nav .nav-section-link,
.dynamic-app .compact-commerce-nav .nav-actions .small-btn,
.dynamic-app .compact-commerce-nav .client-login,
.dynamic-app .compact-commerce-nav .account-access-panel a {
  font-weight: 600;
}

.dynamic-app:has(.nav-mega-group:hover) main,
.dynamic-app:has(.nav-mega-group:focus-within) main {
  filter: none;
}

.dynamic-app:has(.nav-mega-group.is-open) main {
  filter: brightness(.54);
}

/* Products and Services page: page-scoped type, spacing, and aligned cards. */
.dynamic-app .products-services-experience {
  font-weight: 400;
  letter-spacing: .004em;
}

.dynamic-app .products-services-experience :is(h1, h2, h3) {
  font-weight: 500;
  text-wrap: balance;
}

.dynamic-app .products-services-experience :is(p, li, dd) {
  line-height: 1.65;
}

.dynamic-app .products-services-experience :is(.eyebrow, .badge, .btn, dt, strong, b) {
  font-weight: 600;
}

.dynamic-app .products-services-experience .section-head {
  gap: .95rem;
}

.dynamic-app .products-services-experience .section-head h1 {
  max-width: 800px;
  font-size: clamp(2.5rem, 4.5vw, 4.45rem);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.025em;
}

.dynamic-app .products-services-experience .section-head h2 {
  font-size: clamp(1.85rem, 3vw, 3.15rem);
  font-weight: 500;
  line-height: 1.18;
  letter-spacing: -.016em;
}

.dynamic-app .products-services-experience .section-head > p {
  max-width: 72ch;
  line-height: 1.7;
}

.dynamic-app .products-services-experience .product-services-hero .lead {
  max-width: 720px;
  font-size: clamp(1rem, 1.2vw, 1.12rem);
  line-height: 1.72;
}

.dynamic-app .products-services-experience .catalog-proof span {
  font-weight: 500;
  letter-spacing: .01em;
}

.dynamic-app .products-services-experience .command-grid {
  line-height: 1.45;
}

.dynamic-app .products-services-experience .command-grid > * {
  padding: .82rem .9rem;
}

.dynamic-app .products-services-experience .services-core-section {
  background: #fff;
}

.dynamic-app .products-services-experience .core-service-line-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.4rem);
}

.dynamic-app .products-services-experience .core-service-line {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(180px, .78fr) minmax(0, 1.22fr);
  overflow: hidden;
  border: 1px solid rgba(12, 42, 72, .12);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 16px 44px rgba(8, 29, 58, .075);
}

.dynamic-app .products-services-experience .core-service-image {
  min-height: 270px;
  display: block;
  overflow: hidden;
  background: #081a2e;
}

.dynamic-app .products-services-experience .core-service-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .28s ease;
}

.dynamic-app .products-services-experience .core-service-line:hover .core-service-image img,
.dynamic-app .products-services-experience .core-service-line:focus-within .core-service-image img {
  transform: scale(1.025);
}

.dynamic-app .products-services-experience .core-service-line > div {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: .78rem;
  padding: clamp(1.15rem, 2vw, 1.5rem);
}

.dynamic-app .products-services-experience .core-service-line h3 {
  margin: 0;
  font-size: clamp(1.15rem, 1.45vw, 1.42rem);
  line-height: 1.34;
}

.dynamic-app .products-services-experience .core-service-line h3 a {
  color: #10233b;
  text-decoration: none;
}

.dynamic-app .products-services-experience .core-service-line p {
  margin: 0;
  color: #53687e;
  font-size: .9rem;
  line-height: 1.65;
}

.dynamic-app .products-services-experience .core-service-line .card-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .55rem;
  margin-top: auto;
}

.dynamic-app .products-services-experience .services-commerce-bridge {
  border-block: 1px solid rgba(12, 42, 72, .08);
  background: linear-gradient(180deg, #eef4fa, #f7f9fc);
}

.dynamic-app .products-services-experience .services-shop-offer-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.dynamic-app .products-services-experience .services-shop-offer {
  min-width: 0;
  min-height: 154px;
  display: grid;
  align-content: start;
  gap: .55rem;
  padding: 1.2rem;
  border: 1px solid rgba(12, 42, 72, .11);
  border-radius: 16px;
  color: #10233b;
  background: #fff;
  text-decoration: none;
  box-shadow: 0 12px 34px rgba(8, 29, 58, .06);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.dynamic-app .products-services-experience .services-shop-offer:hover,
.dynamic-app .products-services-experience .services-shop-offer:focus-visible {
  transform: translateY(-3px);
  border-color: rgba(17, 103, 216, .34);
  box-shadow: 0 18px 44px rgba(8, 29, 58, .1);
  outline: none;
}

.dynamic-app .products-services-experience .services-shop-offer span {
  color: #1167d8;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.dynamic-app .products-services-experience .services-shop-offer strong {
  font-size: 1.02rem;
  font-weight: 500;
  line-height: 1.4;
}

.dynamic-app .products-services-experience .services-shop-offer small {
  color: #65778a;
  font-size: .82rem;
  line-height: 1.55;
}

.dynamic-app .products-services-experience .market-card-body {
  gap: .95rem;
  padding: 1.2rem;
}

.dynamic-app .products-services-experience .market-card-top {
  font-weight: 600;
}

.dynamic-app .products-services-experience .market-card-body h3 {
  min-height: 2.7em;
  margin: 0;
  font-weight: 500;
  line-height: 1.35;
}

.dynamic-app .products-services-experience .market-card-body > p {
  margin: 0;
  font-size: .9rem;
  line-height: 1.65;
}

.dynamic-app .products-services-experience .market-card-meta dt {
  font-weight: 600;
}

.dynamic-app .products-services-experience .market-card-meta dd {
  line-height: 1.58;
}

.dynamic-app .products-services-experience .family-card h3 {
  font-weight: 400;
  line-height: 1.65;
}

.dynamic-app .products-services-experience .family-links a,
.dynamic-app .products-services-experience .industry-pill {
  font-weight: 500;
  line-height: 1.35;
}

.dynamic-app .products-services-experience .rich-service-card {
  gap: 1.1rem;
  padding: clamp(1.2rem, 2vw, 1.5rem);
  border-radius: 16px;
}

.dynamic-app .products-services-experience .rich-service-head {
  gap: .68rem;
}

.dynamic-app .products-services-experience .rich-service-head h3 {
  margin: 0;
  font-weight: 500;
  line-height: 1.35;
}

.dynamic-app .products-services-experience .rich-service-head p {
  margin: 0;
  line-height: 1.65;
}

.dynamic-app .products-services-experience .rich-service-meta {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
}

.dynamic-app .products-services-experience .rich-service-meta div {
  min-height: 0;
  gap: .34rem;
  padding: .88rem;
}

.dynamic-app .products-services-experience .rich-service-meta dt {
  font-weight: 600;
  letter-spacing: .035em;
}

.dynamic-app .products-services-experience .rich-service-meta dd {
  font-size: .88rem;
  line-height: 1.6;
}

.dynamic-app .products-services-experience .delivery-method-grid .premium-card span {
  font-weight: 600;
}

/* Resource hub and related resource pages. */
.dynamic-app .resource-experience {
  font-weight: 400;
  letter-spacing: .004em;
}

.dynamic-app .resource-experience :is(h1, h2, h3) {
  font-weight: 500;
  text-wrap: balance;
}

.dynamic-app .resource-experience :is(p, li) {
  line-height: 1.65;
}

.dynamic-app .resource-experience :is(.eyebrow, .badge, .btn, strong) {
  font-weight: 600;
}

.dynamic-app .resource-experience .section-head {
  gap: .95rem;
}

.dynamic-app .resource-experience .section-head h1 {
  max-width: 820px;
  font-size: clamp(2.5rem, 4.5vw, 4.4rem);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.024em;
}

.dynamic-app .resource-experience .section-head h2 {
  font-size: clamp(1.85rem, 3vw, 3.1rem);
  font-weight: 500;
  line-height: 1.18;
  letter-spacing: -.015em;
}

.dynamic-app .resource-experience .section-head > p {
  max-width: 72ch;
  line-height: 1.7;
}

.dynamic-app .resource-experience .resource-route-map {
  display: grid;
  grid-template-columns: auto 24px auto 24px auto 24px auto;
  align-items: center;
  gap: .55rem;
  padding: clamp(1rem, 2vw, 1.35rem);
  border: 1px solid rgba(255, 255, 255, .15);
  border-radius: 18px;
  background: rgba(255, 255, 255, .07);
  box-shadow: 0 22px 58px rgba(0, 0, 0, .18);
}

.dynamic-app .resource-experience .resource-route-map span {
  min-height: 48px;
  display: grid;
  place-items: center;
  padding: .7rem .82rem;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 12px;
  color: #f5f9fd;
  background: rgba(255, 255, 255, .07);
  font-size: .85rem;
  font-weight: 500;
  text-align: center;
}

.dynamic-app .resource-experience .resource-route-map b {
  color: #55d8ff;
  font-size: 1rem;
  font-weight: 500;
  text-align: center;
}

.dynamic-app .resource-experience .resource-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.4rem);
}

.dynamic-app .resource-experience .resource-card-grid .media-card {
  min-width: 0;
  min-height: 100%;
  grid-template-rows: 190px 1fr;
  border-radius: 18px;
}

.dynamic-app .resource-experience .resource-card-grid .card-body {
  gap: .78rem;
  padding: 1.2rem;
}

.dynamic-app .resource-experience .resource-card-grid h3 {
  margin: 0;
  font-size: 1.18rem;
  font-weight: 500;
  line-height: 1.35;
}

.dynamic-app .resource-experience .resource-card-grid p {
  margin: 0;
  color: #51677d;
  font-size: .9rem;
  line-height: 1.65;
}

.dynamic-app .resource-experience .resource-card-grid .card-actions {
  margin-top: auto;
}

/* Commerce readability and aligned product information. */
.dynamic-app .commerce-experience {
  font-weight: 400;
  letter-spacing: .004em;
}

.dynamic-app .commerce-experience :is(h1, h2, h3) {
  font-weight: 500;
  text-wrap: balance;
}

.dynamic-app .commerce-experience :is(p, li) {
  line-height: 1.65;
}

.dynamic-app .commerce-experience :is(.eyebrow, .btn, .commerce-recommended, .commerce-card-recommended, .commerce-product-category, .commerce-billing-label, .commerce-text-link) {
  font-weight: 600;
}

.dynamic-app .commerce-experience :is(.commerce-category-chip, .commerce-shop-toolbar label, .commerce-feature-card > a, .commerce-result-meta strong, .commerce-product-visual-label strong, .commerce-next-steps strong) {
  font-weight: 600;
}

.dynamic-app .commerce-experience .commerce-shop-hero h1,
.dynamic-app .commerce-experience .commerce-product-hero h1 {
  max-width: 730px;
  font-size: clamp(2.55rem, 4.5vw, 4.45rem);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.025em;
}

.dynamic-app .commerce-experience .commerce-catalog-intro h2,
.dynamic-app .commerce-experience .commerce-section-intro h2 {
  font-size: clamp(1.9rem, 3vw, 3.2rem);
  font-weight: 500;
  line-height: 1.14;
  letter-spacing: -.018em;
}

.dynamic-app .commerce-experience .commerce-cart-hero h1,
.dynamic-app .commerce-experience .commerce-checkout-hero h1,
.dynamic-app .commerce-experience .commerce-empty-cart h1 {
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -.02em;
}

.dynamic-app .commerce-experience .commerce-feature-card h2,
.dynamic-app .commerce-experience .commerce-product-scope-grid h2,
.dynamic-app .commerce-experience .commerce-order-summary h2,
.dynamic-app .commerce-experience .commerce-checkout-form h2,
.dynamic-app .commerce-experience .commerce-cart-item h2 {
  font-weight: 500;
  line-height: 1.35;
}

.dynamic-app .commerce-experience .commerce-product-body {
  gap: .9rem;
  padding: 1.25rem;
}

.dynamic-app .commerce-experience .commerce-product-body h3 {
  min-height: 2.7em;
  font-weight: 500;
  line-height: 1.35;
}

.dynamic-app .commerce-experience .commerce-product-body > p {
  min-height: 4.95em;
  font-size: .9rem;
  line-height: 1.65;
}

.dynamic-app .commerce-experience .commerce-product-body > ul {
  min-height: 6.35rem;
  gap: .5rem;
}

.dynamic-app .commerce-experience .commerce-product-body > ul li {
  font-size: .82rem;
  line-height: 1.5;
}

.dynamic-app .commerce-experience .commerce-product-buy :is(strong, span),
.dynamic-app .commerce-experience .commerce-feature-price :is(strong, span),
.dynamic-app .commerce-experience .commerce-product-price :is(strong, span) {
  line-height: 1.35;
}

.dynamic-app .commerce-experience .commerce-product-buy strong,
.dynamic-app .commerce-experience .commerce-feature-price strong,
.dynamic-app .commerce-experience .commerce-product-price strong,
.dynamic-app .commerce-experience .commerce-product-facts strong,
.dynamic-app .commerce-experience .commerce-proof-row strong {
  font-weight: 600;
}

.dynamic-app .commerce-experience .commerce-product-category {
  max-width: calc(100% - 1.6rem);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dynamic-app .commerce-experience .commerce-product-card.is-recommended .commerce-product-category {
  max-width: 58%;
}

.dynamic-app .commerce-experience .commerce-product-scope-grid li {
  line-height: 1.5;
}

.dynamic-app .commerce-experience .commerce-workflow-track article > span {
  font-weight: 600;
}

.dynamic-app .commerce-experience .commerce-workflow-track h3 {
  font-weight: 500;
  line-height: 1.4;
}

.dynamic-app .commerce-experience .commerce-workflow-track p {
  font-size: .84rem;
  line-height: 1.62;
}

.dynamic-app .commerce-experience .commerce-cart-item > div > span,
.dynamic-app .commerce-experience .commerce-cart-item-meta button,
.dynamic-app .commerce-experience .commerce-checkout-summary > a {
  font-weight: 600;
}

.dynamic-app .commerce-experience .commerce-cart-item p {
  font-size: .87rem;
  line-height: 1.62;
}

.dynamic-app .commerce-experience .commerce-cart-item-meta strong {
  font-weight: 600;
}

.dynamic-app .commerce-experience .commerce-order-summary .btn + .btn {
  margin-top: .55rem;
}

.dynamic-app .commerce-experience .commerce-checkout-form {
  gap: 1rem;
}

.dynamic-app .commerce-experience .commerce-checkout-form label {
  gap: .45rem;
  font-size: .8rem;
  font-weight: 600;
  line-height: 1.45;
}

.dynamic-app .commerce-experience .commerce-checkout-form > p {
  font-size: .78rem;
  line-height: 1.55;
}

.dynamic-app .commerce-experience .commerce-checkout-summary li strong {
  font-size: .84rem;
  font-weight: 600;
  line-height: 1.45;
}

.dynamic-app .commerce-experience .commerce-checkout-summary li span,
.dynamic-app .commerce-experience .commerce-checkout-summary li b {
  font-size: .76rem;
  line-height: 1.45;
}

.dynamic-app .commerce-experience .commerce-next-steps {
  gap: .5rem;
}

.dynamic-app .commerce-experience .commerce-next-steps :is(strong, span) {
  line-height: 1.5;
}

/* Product fit, boundaries, related solutions, and buying guidance. */
.dynamic-app .commerce-experience .commerce-product-fit {
  background: linear-gradient(180deg, #eaf0f7, #f4f7fb);
}

.dynamic-app .commerce-experience .commerce-fit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.dynamic-app .commerce-experience .commerce-fit-grid > article {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: .7rem;
  padding: clamp(1.2rem, 2.2vw, 1.65rem);
  border: 1px solid rgba(12, 42, 72, .11);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 14px 38px rgba(8, 29, 58, .065);
}

.dynamic-app .commerce-experience .commerce-fit-grid > article > span {
  color: #2f63e8;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dynamic-app .commerce-experience .commerce-fit-grid h3 {
  margin: 0;
  color: #1b334a;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.55;
}

.dynamic-app .commerce-experience .commerce-fit-grid ul {
  display: grid;
  gap: .55rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.dynamic-app .commerce-experience .commerce-fit-grid li {
  position: relative;
  padding-left: 1.05rem;
  color: #4d6277;
  font-size: .87rem;
  line-height: 1.55;
}

.dynamic-app .commerce-experience .commerce-fit-grid li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .66em;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: #2f63e8;
}

.dynamic-app .commerce-experience .commerce-product-guidance {
  background: #fff;
}

.dynamic-app .commerce-experience .commerce-guidance-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(1.4rem, 4vw, 4rem);
  align-items: start;
}

.dynamic-app .commerce-experience .commerce-guidance-grid > div {
  min-width: 0;
}

.dynamic-app .commerce-experience .commerce-guidance-grid h2 {
  margin: .55rem 0 .7rem;
  color: #071426;
  font-size: clamp(1.65rem, 2.7vw, 2.65rem);
  font-weight: 500;
  line-height: 1.18;
  letter-spacing: -.015em;
}

.dynamic-app .commerce-experience .commerce-guidance-grid > div > p {
  color: #647386;
  line-height: 1.7;
}

.dynamic-app .commerce-experience .commerce-related-links {
  display: grid;
  gap: .65rem;
  margin-top: 1.2rem;
}

.dynamic-app .commerce-experience .commerce-related-links a {
  min-height: 54px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  padding: .82rem .95rem;
  border: 1px solid #dbe4ed;
  border-radius: 12px;
  color: #173b62;
  background: #f7f9fc;
  font-size: .88rem;
  font-weight: 500;
  line-height: 1.45;
  text-decoration: none;
}

.dynamic-app .commerce-experience .commerce-related-links a:hover,
.dynamic-app .commerce-experience .commerce-related-links a:focus-visible {
  color: #214fc8;
  border-color: rgba(47, 99, 232, .34);
  background: #eef3ff;
  outline: none;
}

.dynamic-app .commerce-experience .commerce-related-links b {
  color: #2f63e8;
  font-size: 1rem;
  font-weight: 500;
}

.dynamic-app .commerce-experience .commerce-product-faq {
  border-top: 1px solid #dfe6ed;
}

.dynamic-app .commerce-experience .commerce-product-faq article {
  display: grid;
  gap: .45rem;
  padding: 1rem 0;
  border-bottom: 1px solid #dfe6ed;
}

.dynamic-app .commerce-experience .commerce-product-faq h3 {
  margin: 0;
  color: #122d48;
  font-size: .98rem;
  font-weight: 500;
  line-height: 1.45;
}

.dynamic-app .commerce-experience .commerce-product-faq p {
  margin: 0;
  color: #647386;
  font-size: .87rem;
  line-height: 1.65;
}

/* Catalog and service detail pages use route-scoped classes from layout(). */
body.dynamic-app[class*="page-catalog-"] main,
body.dynamic-app[class*="page-solution-"] main {
  font-weight: 400;
  letter-spacing: .004em;
}

body.dynamic-app[class*="page-catalog-"] main :is(h1, h2, h3),
body.dynamic-app[class*="page-solution-"] main :is(h1, h2, h3) {
  font-weight: 500;
  text-wrap: balance;
}

body.dynamic-app[class*="page-catalog-"] main :is(p, li),
body.dynamic-app[class*="page-solution-"] main :is(p, li) {
  line-height: 1.65;
}

body.dynamic-app[class*="page-catalog-"] main :is(.eyebrow, .badge, .btn, strong, b),
body.dynamic-app[class*="page-solution-"] main :is(.eyebrow, .badge, .btn, strong, b) {
  font-weight: 600;
}

body.dynamic-app[class*="page-catalog-"] main .section-head,
body.dynamic-app[class*="page-solution-"] main .section-head {
  gap: .95rem;
}

body.dynamic-app[class*="page-catalog-"] main .section-head h1,
body.dynamic-app[class*="page-solution-"] main .section-head h1 {
  max-width: 800px;
  font-size: clamp(2.45rem, 4.35vw, 4.3rem);
  line-height: 1.09;
  letter-spacing: -.024em;
}

body.dynamic-app[class*="page-catalog-"] main .section-head h2,
body.dynamic-app[class*="page-solution-"] main .section-head h2 {
  font-size: clamp(1.75rem, 2.8vw, 2.9rem);
  line-height: 1.2;
  letter-spacing: -.014em;
}

body.dynamic-app[class*="page-catalog-"] main .section-head > p,
body.dynamic-app[class*="page-solution-"] main .section-head > p {
  max-width: 72ch;
  line-height: 1.7;
}

body.dynamic-app[class*="page-catalog-"] main .lead,
body.dynamic-app[class*="page-solution-"] main .lead {
  font-size: clamp(1rem, 1.2vw, 1.12rem);
  line-height: 1.72;
}

body.dynamic-app[class*="page-catalog-"] main :is(.premium-card, .faq-card),
body.dynamic-app[class*="page-solution-"] main :is(.card, .faq-card) {
  padding: clamp(1.15rem, 2vw, 1.5rem);
  border-radius: 16px;
}

body.dynamic-app[class*="page-catalog-"] main :is(.premium-card, .faq-card) h2,
body.dynamic-app[class*="page-catalog-"] main :is(.premium-card, .faq-card) h3,
body.dynamic-app[class*="page-solution-"] main :is(.card, .faq-card) h2,
body.dynamic-app[class*="page-solution-"] main :is(.card, .faq-card) h3 {
  line-height: 1.35;
}

body.dynamic-app[class*="page-catalog-"] main :is(.premium-card, .faq-card) p,
body.dynamic-app[class*="page-solution-"] main :is(.card, .faq-card) p {
  line-height: 1.65;
}

body.dynamic-app[class*="page-catalog-"] main .catalog-detail-stats span {
  gap: .3rem;
  font-size: .82rem;
  line-height: 1.45;
}

body.dynamic-app[class*="page-catalog-"] main .catalog-detail-stats b {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
}

body.dynamic-app[class*="page-catalog-"] main .product-detail-grid .premium-card {
  display: grid;
  align-content: start;
  gap: .68rem;
}

body.dynamic-app[class*="page-catalog-"] main .product-detail-grid h3,
body.dynamic-app[class*="page-solution-"] main .faq-card h3 {
  margin: 0;
  font-size: 1.04rem;
  font-weight: 500;
  line-height: 1.4;
}

body.dynamic-app[class*="page-catalog-"] main .product-detail-grid p,
body.dynamic-app[class*="page-catalog-"] main .product-detail-grid li,
body.dynamic-app[class*="page-catalog-"] main .faq-card p,
body.dynamic-app[class*="page-solution-"] main .faq-card p {
  font-size: .9rem;
  line-height: 1.62;
}

body.dynamic-app[class*="page-catalog-"] main .flow-step {
  gap: 1.1rem;
  padding: 1rem 1.1rem;
}

body.dynamic-app[class*="page-catalog-"] main .flow-step :is(b, span) {
  line-height: 1.55;
}

body.dynamic-app[class*="page-solution-"] main .map-stage {
  gap: .34rem;
  padding: 1rem 1.08rem;
}

body.dynamic-app[class*="page-solution-"] main .map-stage b {
  font-weight: 600;
  line-height: 1.45;
}

body.dynamic-app[class*="page-solution-"] main .map-stage span {
  font-size: .88rem;
  line-height: 1.6;
}

body.dynamic-app[class*="page-catalog-"] main .faq-grid,
body.dynamic-app[class*="page-solution-"] main .faq-grid {
  gap: 1rem;
}

@media (min-width: 981px) and (max-width: 1320px) {
  .dynamic-app .compact-commerce-nav .nav-mega-group {
    grid-template-columns: minmax(0, auto) 26px;
  }

  .dynamic-app .compact-commerce-nav .nav-section-link {
    min-height: 36px;
    padding: .5rem .2rem .5rem .42rem;
    font-size: .74rem;
  }

  .dynamic-app .compact-commerce-nav .nav-mega-group > .nav-section-toggle {
    width: 26px;
    min-width: 26px;
    min-height: 36px;
  }

  .dynamic-app .compact-commerce-nav .nav-mega-group > .nav-section-toggle::after {
    left: 7px;
    top: 13px;
  }
}

/* Final enterprise typography, contact-icon, and keyboard-target refinements. */
body.dynamic-app {
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.6;
}

body.dynamic-app h1,
body.dynamic-app h2 {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: -.025em;
  text-wrap: balance;
}

body.dynamic-app h3,
body.dynamic-app h4 {
  font-family: var(--font-display);
  font-weight: 650;
  letter-spacing: -.018em;
  text-wrap: balance;
}

body.dynamic-app strong {
  font-weight: 650;
}

body.dynamic-app .btn,
body.dynamic-app .nav-links a,
body.dynamic-app .nav-section-link,
body.dynamic-app .nav-section-toggle,
body.dynamic-app summary {
  font-weight: 600;
}

body.dynamic-app p,
body.dynamic-app li {
  line-height: 1.65;
}

body.dynamic-app.nav-open {
  overflow: hidden;
}

.dynamic-app .utility-link {
  min-height: 34px;
  font-size: 14px;
  font-weight: 500;
}

.dynamic-app .utility-icon {
  min-width: 26px;
  width: 26px;
  height: 26px;
}

.dynamic-app .utility-link.social-linkedin .utility-icon { background: #0a66c2; color: #fff; }
.dynamic-app .utility-link.social-facebook .utility-icon { background: #1877f2; color: #fff; }
.dynamic-app .utility-link.social-instagram .utility-icon { background: linear-gradient(135deg, #f58529, #dd2a7b 50%, #515bd4); color: #fff; }
.dynamic-app .utility-link.social-x .utility-icon { background: #111; color: #fff; }
.dynamic-app .utility-link.social-youtube .utility-icon { background: #ff0033; color: #fff; }
.dynamic-app .utility-link.social-github .utility-icon { background: #24292f; color: #fff; }

.dynamic-app .utility-link.social:hover .utility-icon,
.dynamic-app .utility-link.social:focus-visible .utility-icon {
  color: #fff;
  transform: translateY(-1px);
}

.dynamic-app .social-icon {
  min-width: 44px;
  min-height: 44px;
}

.dynamic-app .consent-status:empty {
  display: none;
}

@media (max-width: 760px) {
  .dynamic-app .mobile-quick-contact a,
  .dynamic-app .nav-toggle,
  .dynamic-app .btn,
  .dynamic-app button,
  .dynamic-app summary {
    min-height: 44px;
  }

  .dynamic-app .mobile-quick-contact a,
  .dynamic-app .btn,
  .dynamic-app button,
  .dynamic-app summary {
    font-size: max(.94rem, 15px);
  }
}

@media (max-width: 1120px) {
  .dynamic-app .products-services-experience .core-service-line-grid {
    grid-template-columns: 1fr;
  }

  .dynamic-app .products-services-experience .services-shop-offer-grid,
  .dynamic-app .resource-experience .resource-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .dynamic-app .top-utility-book .utility-link.consultation .utility-icon {
    display: inline-grid;
  }

  .dynamic-app .compact-commerce-nav .nav-mega-group {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 46px;
    width: 100%;
  }

  .dynamic-app .compact-commerce-nav .nav-section-link {
    width: 100%;
    min-height: 44px;
    padding: .72rem .78rem;
    border-radius: 8px 0 0 8px;
    color: #17304d;
    font-size: .86rem;
    white-space: normal;
  }

  .dynamic-app .compact-commerce-nav .nav-mega-group > .nav-section-toggle {
    width: 46px;
    min-width: 46px;
    min-height: 44px;
    border-left: 1px solid #dbe5ef;
  }

  .dynamic-app .compact-commerce-nav .nav-mega-group > .nav-section-toggle::after {
    left: 17px;
    top: 16px;
  }

  .dynamic-app .compact-commerce-nav .nav-mega-group > .mega-panel {
    grid-column: 1 / -1;
  }

  .dynamic-app .compact-commerce-nav .nav-mega-group:hover .mega-panel,
  .dynamic-app .compact-commerce-nav .nav-mega-group:focus-within .mega-panel {
    display: none;
  }

  .dynamic-app .compact-commerce-nav .nav-mega-group.is-open .mega-panel {
    display: block;
  }

  .dynamic-app .commerce-experience .commerce-fit-grid,
  .dynamic-app .commerce-experience .commerce-guidance-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .dynamic-app .products-services-experience .section-head h1,
  .dynamic-app .resource-experience .section-head h1,
  .dynamic-app .commerce-experience .commerce-shop-hero h1,
  .dynamic-app .commerce-experience .commerce-product-hero h1 {
    font-size: clamp(2.25rem, 10.5vw, 3.25rem);
    line-height: 1.1;
  }

  .dynamic-app .products-services-experience .section-head h2,
  .dynamic-app .resource-experience .section-head h2,
  .dynamic-app .commerce-experience .commerce-catalog-intro h2,
  .dynamic-app .commerce-experience .commerce-section-intro h2 {
    font-size: clamp(1.75rem, 8vw, 2.45rem);
    line-height: 1.2;
  }

  .dynamic-app .products-services-experience .core-service-line {
    grid-template-columns: 1fr;
  }

  .dynamic-app .products-services-experience .core-service-image {
    min-height: 0;
    aspect-ratio: 16 / 9;
  }

  .dynamic-app .products-services-experience .core-service-line .card-actions {
    grid-template-columns: 1fr;
  }

  .dynamic-app .products-services-experience .rich-service-meta,
  .dynamic-app .products-services-experience .services-shop-offer-grid,
  .dynamic-app .resource-experience .resource-card-grid {
    grid-template-columns: 1fr;
  }

  .dynamic-app .products-services-experience .market-card-body h3,
  .dynamic-app .commerce-experience .commerce-product-body h3,
  .dynamic-app .commerce-experience .commerce-product-body > p,
  .dynamic-app .commerce-experience .commerce-product-body > ul {
    min-height: 0;
  }

  .dynamic-app .products-services-experience .catalog-command-center {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .dynamic-app .products-services-experience .command-grid {
    min-width: 640px;
    grid-template-columns: 1.6fr .8fr .8fr 1fr;
  }

  .dynamic-app .resource-experience .resource-route-map {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dynamic-app .resource-experience .resource-route-map b {
    display: none;
  }

  .dynamic-app .commerce-experience .commerce-feature-panel,
  .dynamic-app .commerce-experience .commerce-product-visual {
    min-height: clamp(320px, 82vw, 400px);
  }

  .dynamic-app .commerce-experience .commerce-fit-grid > article {
    padding: 1.1rem;
  }

  body.dynamic-app[class*="page-catalog-"] main .section-head h1,
  body.dynamic-app[class*="page-solution-"] main .section-head h1 {
    font-size: clamp(2.2rem, 10vw, 3.2rem);
    line-height: 1.1;
  }

  body.dynamic-app[class*="page-catalog-"] main .section-head h2,
  body.dynamic-app[class*="page-solution-"] main .section-head h2 {
    font-size: clamp(1.65rem, 7.5vw, 2.35rem);
    line-height: 1.22;
  }
}

@media (max-width: 520px) {
  .dynamic-app .commerce-experience .commerce-proof-row,
  .dynamic-app .commerce-experience .commerce-product-facts {
    grid-template-columns: 1fr;
    gap: .5rem;
  }

  .dynamic-app .commerce-experience .commerce-proof-row span,
  .dynamic-app .commerce-experience .commerce-product-facts span {
    grid-template-columns: minmax(74px, auto) 1fr;
    align-items: baseline;
    gap: .65rem;
    padding-right: 0;
    font-size: .72rem;
  }

  .dynamic-app .resource-experience .resource-route-map {
    grid-template-columns: 1fr;
  }
}

/* Final interaction and light-type refinements for quotation, booking, and mobile navigation. */
.dynamic-app .utility-link,
.dynamic-app .utility-icon {
  font-weight: 500;
}

body.dynamic-app.page-ai-pricing-agent main {
  font-weight: 400;
  letter-spacing: .004em;
}

body.dynamic-app.page-ai-pricing-agent main :is(h1, h2, h3) {
  font-weight: 500;
  text-wrap: balance;
}

body.dynamic-app.page-ai-pricing-agent main :is(p, li, dd) {
  line-height: 1.65;
}

body.dynamic-app.page-ai-pricing-agent main :is(.eyebrow, .btn, label, .quote-progress span, .quote-visual-panel span, .quote-visual-panel small, .quote-visual-steps span, .estimate-summary-card small) {
  font-weight: 600;
}

body.dynamic-app.page-ai-pricing-agent main :is(.estimate-summary-card strong, .live-estimate-panel h3, .quote-layer h3) {
  font-weight: 500;
}

body.dynamic-app.page-ai-pricing-agent main .estimate-summary-card li,
body.dynamic-app.page-ai-pricing-agent main .live-estimate-panel dd {
  font-weight: 400;
  line-height: 1.55;
}

.dynamic-app .quote-next {
  width: fit-content;
  margin-top: .9rem;
  font-weight: 600;
}

.dynamic-app .booking-layout {
  align-items: start;
}

.dynamic-app .booking-form,
.dynamic-app .booking-guidance {
  min-width: 0;
}

.dynamic-app .booking-notice {
  padding: .8rem .9rem;
  border: 1px solid rgba(17, 103, 216, .2);
  border-radius: 10px;
  color: #173b62;
  background: #eef6ff;
  font-size: .9rem;
  line-height: 1.55;
}

.dynamic-app :is(.breadcrumb, .commerce-breadcrumb) {
  font-weight: 500;
}

.dynamic-app :is(.breadcrumb a, .commerce-breadcrumb a) {
  font-weight: 600;
}

.dynamic-app .commerce-experience .commerce-product-category,
.dynamic-app .commerce-experience .commerce-billing-label {
  min-height: 1.15rem;
  font-size: .74rem;
  line-height: 1.35;
}

@media (min-width: 721px) and (max-width: 980px) {
  .dynamic-app .quote-progress {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .dynamic-app .compact-commerce-nav .nav-actions .account-access-menu {
    grid-column: auto;
    width: 100%;
  }

  .dynamic-app .compact-commerce-nav .account-access-menu[open] .account-access-panel {
    position: fixed;
    top: var(--fixed-nav-offset);
    left: 12px;
    right: 12px;
    width: auto;
    max-width: none;
    max-height: calc(100vh - var(--fixed-nav-offset) - 16px);
    margin: 8px auto 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    box-shadow: 0 24px 64px rgba(5, 22, 43, .22);
  }
}

@media (max-width: 720px) {
  .dynamic-app.ecommerce-app {
    --fixed-nav-offset: 160px;
  }

  .dynamic-app .compact-commerce-nav .nav-actions .small-btn,
  .dynamic-app .compact-commerce-nav .client-login {
    min-height: 38px;
    font-size: .8rem;
    line-height: 1.25;
  }

  .dynamic-app .booking-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .dynamic-app.ecommerce-app {
    --fixed-nav-offset: 200px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dynamic-app .products-services-experience *,
  .dynamic-app .resource-experience *,
  .dynamic-app .compact-commerce-nav .nav-section-toggle::after {
    transition-duration: .01ms !important;
  }
}

/* Central navigation, readable type, consent, and structured detail pages. */
.dynamic-app {
  --arrix-navy: #06172f;
  --arrix-cyan: #25c8f5;
  --arrix-gold: #d9a441;
  --arrix-surface: #f7f9fc;
  --arrix-ink: #102033;
  --arrix-line: #d8e2ec;
  --arrix-focus: #ffbf47;
  --arrix-radius: 14px;
  --arrix-shadow: 0 22px 62px rgba(6, 23, 47, .12);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.6;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

.dynamic-app :is(h1, h2, h3) {
  font-family: var(--font-display);
  font-synthesis: none;
  letter-spacing: -.022em;
  text-wrap: balance;
}

body.dynamic-app #main h1 {
  font-size: clamp(2.625rem, 3.6vw, 3.25rem);
  font-weight: 700;
  line-height: 1.08;
}

body.dynamic-app #main .section-head h1 {
  font-size: clamp(2.625rem, 3.6vw, 3.25rem);
  font-weight: 700;
  line-height: 1.08;
}

body.dynamic-app #main :is(.hero, [class*="-hero"]) h1 {
  font-size: clamp(3.5rem, 4.4vw, 4.25rem);
  font-weight: 700;
  line-height: 1.04;
}

body.dynamic-app #main h2 {
  font-size: clamp(1.875rem, 2.6vw, 2.375rem);
  font-weight: 650;
  line-height: 1.14;
}

body.dynamic-app #main .section-head h2 {
  font-size: clamp(1.875rem, 2.6vw, 2.375rem);
  font-weight: 650;
  line-height: 1.14;
}

body.dynamic-app #main :is(
  .products-services-experience,
  .resource-experience,
  .commerce-experience
) h2 {
  font-size: clamp(1.875rem, 2.6vw, 2.375rem);
  font-weight: 650;
  line-height: 1.14;
}

body.dynamic-app #main h3 {
  font-size: clamp(1.1875rem, 1.45vw, 1.4375rem);
  font-weight: 650;
  line-height: 1.25;
}

body.dynamic-app #main :is(
  .card,
  .premium-card,
  .faq-card,
  .resource-card-grid,
  .core-service-line,
  .market-card-body,
  .family-card,
  .commerce-product-body,
  .commerce-workflow-track,
  .commerce-fit-grid,
  .commerce-product-faq
) h3 {
  font-size: clamp(1.1875rem, 1.45vw, 1.4375rem);
  font-weight: 650;
  line-height: 1.25;
}

body.dynamic-app #main :is(.metric-card strong, .metric-value, .stat strong) {
  font-family: var(--font-display);
  font-synthesis: none;
  letter-spacing: -.022em;
}

.dynamic-app main :is(p, li, dd) {
  line-height: 1.6;
}

.dynamic-app main :is(.section-head > p, .lead, .article-body) {
  max-width: 72ch;
}

.dynamic-app :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--arrix-focus) !important;
  outline-offset: 3px;
}

.dynamic-app .btn,
.dynamic-app button,
.dynamic-app summary,
.dynamic-app input,
.dynamic-app select {
  min-height: 44px;
}

body.dynamic-app[class] :is(button, input, select, textarea, summary) {
  font-family: var(--font-interface);
  font-synthesis: none;
}

body.dynamic-app[class] :is(.btn, button, summary) {
  font-size: 15px;
  font-weight: 600;
}

body.dynamic-app[class] :is(input, select, textarea) {
  font-size: 16px;
  font-weight: 400;
}

body.dynamic-app[class] label {
  font-size: 14px;
  font-weight: 600;
}

body.dynamic-app #main :is(p, li, dd) {
  font-size: 17px;
}

body.dynamic-app #main :is(
  .products-services-experience,
  .resource-experience,
  .commerce-experience
) :is(p, li, dd) {
  font-size: 17px;
}

body.dynamic-app #main :is(
  .card,
  .premium-card,
  .faq-card,
  .resource-card-grid,
  .core-service-line,
  .market-card-body,
  .family-card,
  .commerce-product-body,
  .commerce-feature-card,
  .commerce-workflow-track,
  .commerce-cart-item,
  .commerce-order-summary
) :is(p, li, dd) {
  font-size: 17px;
}

body.dynamic-app #main th {
  font-family: var(--font-interface);
  font-size: 14px;
  font-weight: 600;
}

body.dynamic-app #main td {
  font-family: var(--font-interface);
  font-size: 16px;
  font-weight: 400;
}

body.dynamic-app[class] #main :is(
  .badge,
  .model-badge,
  .status,
  .eyebrow,
  .article-meta,
  .form-note,
  .meta,
  .metadata,
  figcaption,
  small
) {
  font-size: 13px;
  font-weight: 500;
}

.dynamic-app .enterprise-primary-nav .nav-shell {
  width: min(1540px, calc(100% - 28px));
  min-height: 72px;
  gap: .55rem;
}

.dynamic-app .enterprise-primary-nav .nav-links {
  margin-left: .3rem;
}

.dynamic-app .enterprise-primary-nav .nav-actions {
  gap: .32rem;
}

.dynamic-app .enterprise-primary-nav .nav-primary-action {
  min-height: 44px;
  padding: .58rem .72rem;
  font-size: 15px;
  font-weight: 600;
}

.dynamic-app .enterprise-primary-nav :is(
  .nav-links a,
  .nav-section-link,
  .nav-section-toggle,
  .nav-primary-action,
  .commerce-access-menu > summary
) {
  font-family: var(--font-interface);
  font-size: 15px;
  font-weight: 600;
}

body.dynamic-app[class] .enterprise-primary-nav .nav-actions :is(
  .small-btn,
  .btn,
  summary
) {
  font-size: 15px;
  font-weight: 600;
}

.dynamic-app :is(.top-utility-note, .top-utility-note strong) {
  font-weight: 500;
}

.dynamic-app .enterprise-primary-nav .nav-primary-action.primary {
  color: #fff;
  background: linear-gradient(135deg, #25c8f5, #176fd3);
}

.dynamic-app .enterprise-primary-nav .nav-primary-action.secondary {
  color: #7a4f00;
  border-color: rgba(217, 164, 65, .55);
  background: #fff9eb;
}

.dynamic-app .enterprise-primary-nav [aria-current="page"],
.dynamic-app .enterprise-primary-nav [data-current-section="true"] {
  color: #0b5fc4;
  background: #edf6ff;
  box-shadow: inset 0 -2px 0 #25c8f5;
}

.dynamic-app .enterprise-primary-nav .mega-layout {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dynamic-app .enterprise-footer {
  display: grid;
  grid-template-columns: minmax(260px, 1.45fr) repeat(3, minmax(150px, 1fr));
  gap: clamp(1.5rem, 3vw, 2.8rem);
  padding: clamp(54px, 7vw, 88px) max(20px, calc((100% - 1440px) / 2));
  background: linear-gradient(145deg, #030d1b, #061a32);
}

.dynamic-app .enterprise-footer > div {
  min-width: 0;
}

.dynamic-app .enterprise-footer .footer-brand-panel {
  grid-row: span 2;
}

.dynamic-app .enterprise-footer .footer-brand-panel img {
  width: min(220px, 100%);
}

.dynamic-app .enterprise-footer h2 {
  margin: 0 0 .9rem;
  color: #fff;
  font-size: 1rem;
  font-weight: 650;
  letter-spacing: -.01em;
}

.dynamic-app .enterprise-footer a,
.dynamic-app .enterprise-footer p,
.dynamic-app .enterprise-footer button {
  color: rgba(235, 245, 255, .76);
  font-family: var(--font-interface);
  font-size: 15px;
  line-height: 1.55;
}

.dynamic-app .enterprise-footer a {
  min-height: 44px;
  display: flex;
  align-items: center;
  margin: 0;
}

.dynamic-app .enterprise-footer a:hover,
.dynamic-app .enterprise-footer a:focus-visible {
  color: #7cddff;
}

.dynamic-app .privacy-settings-link {
  margin-top: .8rem;
  padding: .4rem 0;
  border: 0;
  color: #7cddff !important;
  background: transparent;
  cursor: pointer;
}

.dynamic-app .consent-preferences {
  width: min(1120px, calc(100% - 32px));
  grid-template-columns: minmax(260px, 1fr) auto;
  border-radius: var(--arrix-radius);
}

.dynamic-app .consent-preferences[hidden] {
  display: none;
}

.dynamic-app .consent-preferences .cookie-customize {
  grid-column: 1 / -1;
  padding-top: .9rem;
  border-top: 1px solid rgba(255, 255, 255, .14);
}

.dynamic-app .consent-preferences .cookie-customize[hidden] {
  display: none;
}

.dynamic-app .consent-preferences fieldset {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .65rem;
  margin: 0 0 .8rem;
  padding: 0;
  border: 0;
}

.dynamic-app .consent-preferences legend {
  width: 100%;
  margin-bottom: .7rem;
  color: #fff;
  font-weight: 600;
}

.dynamic-app .consent-preferences label {
  min-width: 0;
  padding: .7rem;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 10px;
  color: #fff;
  background: rgba(255, 255, 255, .05);
  font-weight: 500;
}

.dynamic-app .consent-preferences label span {
  display: block;
  color: #bcd4e7;
  font-size: .82rem;
  font-weight: 400;
}

.dynamic-app .prototype-figure {
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 18px;
  background: #07172a;
  box-shadow: var(--arrix-shadow);
}

.dynamic-app .prototype-figure img {
  width: 100%;
  min-height: 380px;
  max-height: 610px;
  object-fit: contain;
  background: #07172a;
}

.dynamic-app .prototype-figure figcaption {
  padding: .75rem 1rem;
  color: #c9dbea;
  font-size: .82rem;
  line-height: 1.5;
}

.dynamic-app .scenario-disclosure {
  max-width: 68ch;
  padding: .8rem 1rem;
  border-left: 3px solid var(--arrix-gold);
  color: #f8e8bd;
  background: rgba(217, 164, 65, .09);
}

.dynamic-app .article-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
  gap: clamp(1rem, 3vw, 2.4rem);
  align-items: start;
}

.dynamic-app .article-layout .article-body {
  display: grid;
  gap: 1.8rem;
}

.dynamic-app .sitemap-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.dynamic-app .sitemap-group h2 {
  margin-top: 0;
  font-size: 1.25rem;
}

.dynamic-app .sitemap-links {
  display: grid;
  gap: .18rem;
  padding: 0;
  list-style: none;
}

.dynamic-app .sitemap-links a {
  min-height: 40px;
  display: flex;
  align-items: center;
  padding: .35rem .45rem;
  border-radius: 8px;
  color: #25435f;
}

.dynamic-app .sitemap-links a:hover,
.dynamic-app .sitemap-links a:focus-visible {
  color: #0b5fc4;
  background: #edf6ff;
}

@media (max-width: 1180px) {
  .dynamic-app .enterprise-primary-nav .nav-toggle {
    display: block !important;
  }

  .dynamic-app .enterprise-primary-nav .nav-links {
    display: none !important;
  }

  .dynamic-app .enterprise-primary-nav .nav-shell.open {
    align-items: center;
    flex-wrap: wrap;
  }

  .dynamic-app .enterprise-primary-nav .nav-shell.open .nav-links {
    position: static !important;
    order: 4;
    width: 100%;
    max-height: min(68vh, 720px);
    display: grid !important;
    grid-template-columns: 1fr;
    margin: .5rem 0 0;
    overflow-y: auto;
    padding: .7rem;
    border: 1px solid rgba(17, 103, 216, .16);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 56px rgba(8, 29, 58, .14);
  }

  .dynamic-app .enterprise-primary-nav .nav-mega-group {
    width: 100%;
  }

  .dynamic-app .enterprise-primary-nav .mega-panel {
    position: static;
    width: 100%;
    transform: none !important;
  }

  .dynamic-app .enterprise-primary-nav .mega-layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dynamic-app .enterprise-primary-nav .nav-actions {
    margin-left: auto !important;
  }

  .dynamic-app .enterprise-primary-nav .nav-primary-action.secondary,
  .dynamic-app .enterprise-primary-nav .nav-primary-action.ghost {
    display: none;
  }

  .dynamic-app .enterprise-footer {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dynamic-app .enterprise-footer .footer-brand-panel {
    grid-column: 1 / -1;
    grid-row: auto;
  }
}

/* ARRIX Tech-Mall (renamed from ICT-MALL 2026-08-05) — scoped marketplace styles. CSS class names keep the historical ict-mall- prefix on purpose. */
.dynamic-app .ict-mall-experience {
  --mall-ink: #071a33;
  --mall-navy: #06172f;
  --mall-blue: #0f63d8;
  --mall-cyan: #22b9f3;
  --mall-gold: #d6a33c;
  --mall-line: #d8e4f0;
  --mall-soft: #f2f7fc;
  color: var(--mall-ink);
  background: #fff;
}

.dynamic-app .ict-mall-experience .ict-mall-hero,
.dynamic-app .ict-mall-experience .ict-mall-provider-hero {
  position: relative;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 78% 18%, rgba(34, 185, 243, .22), transparent 33%),
    radial-gradient(circle at 12% 82%, rgba(214, 163, 60, .12), transparent 31%),
    linear-gradient(135deg, #06172f 0%, #0a274a 58%, #0e3a68 100%);
}

.dynamic-app .ict-mall-experience .ict-mall-hero::after,
.dynamic-app .ict-mall-experience .ict-mall-provider-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image:
    linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(90deg, transparent, #000 45%, #000);
}

.dynamic-app .ict-mall-experience .ict-mall-hero-grid,
.dynamic-app .ict-mall-experience .ict-mall-provider-hero .split {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(310px, .75fr);
  gap: clamp(2rem, 6vw, 5.5rem);
  align-items: center;
}

.dynamic-app .ict-mall-experience .ict-mall-hero .section-head,
.dynamic-app .ict-mall-experience .ict-mall-provider-hero .section-head {
  max-width: 800px;
  margin: 0;
}

.dynamic-app .ict-mall-experience .ict-mall-hero :is(h1, .lead),
.dynamic-app .ict-mall-experience .ict-mall-provider-hero :is(h1, .lead) {
  color: #fff;
}

.dynamic-app .ict-mall-experience .ict-mall-hero .lead,
.dynamic-app .ict-mall-experience .ict-mall-provider-hero .lead {
  max-width: 720px;
  color: rgba(239, 248, 255, .88);
}

.dynamic-app .ict-mall-experience .ict-mall-hero-panel,
.dynamic-app .ict-mall-experience .ict-mall-provider-profile {
  position: relative;
  padding: clamp(1.4rem, 3vw, 2.25rem);
  border: 1px solid rgba(171, 224, 255, .28);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .055));
  box-shadow: 0 28px 70px rgba(1, 10, 24, .28);
  backdrop-filter: blur(16px);
}

.dynamic-app .ict-mall-experience .ict-mall-hero-panel > span {
  display: block;
  margin-bottom: .55rem;
  color: #8fe2ff;
  font: 800 .75rem/1.2 var(--font-interface);
  letter-spacing: .12em;
  text-transform: uppercase;
}

.dynamic-app .ict-mall-experience .ict-mall-hero-panel > strong {
  display: block;
  color: #fff;
  font: 800 clamp(3.6rem, 8vw, 6.7rem)/.86 var(--font-heading);
  letter-spacing: -.07em;
}

.dynamic-app .ict-mall-experience .ict-mall-hero-panel > p {
  max-width: 28ch;
  margin: .9rem 0 1.45rem;
  color: rgba(239, 248, 255, .82);
}

.dynamic-app .ict-mall-experience .ict-mall-hero-panel dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .65rem;
  margin: 0;
}

.dynamic-app .ict-mall-experience .ict-mall-hero-panel dl div {
  padding: .75rem;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 12px;
  background: rgba(3, 19, 40, .35);
}

.dynamic-app .ict-mall-experience .ict-mall-hero-panel dt {
  color: rgba(239, 248, 255, .68);
  font-size: .7rem;
}

.dynamic-app .ict-mall-experience .ict-mall-hero-panel dd {
  margin: .28rem 0 0;
  color: #fff;
  font: 800 1.25rem/1 var(--font-heading);
}

.dynamic-app .ict-mall-experience .ict-mall-catalog {
  background:
    linear-gradient(180deg, rgba(227, 240, 251, .76), rgba(255, 255, 255, .97) 240px),
    #fff;
}

.dynamic-app .ict-mall-experience .ict-mall-tabs {
  display: flex;
  gap: .45rem;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 1rem;
  padding: .38rem;
  overflow-x: auto;
  border: 1px solid var(--mall-line);
  border-radius: 14px;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 12px 34px rgba(16, 52, 88, .08);
  scrollbar-width: thin;
}

.dynamic-app .ict-mall-experience .ict-mall-tabs a {
  flex: 0 0 auto;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .68rem 1rem;
  border-radius: 10px;
  color: #26425f;
  font: 750 .85rem/1 var(--font-interface);
  text-decoration: none;
}

.dynamic-app .ict-mall-experience .ict-mall-tabs a:is(:hover, :focus-visible),
.dynamic-app .ict-mall-experience .ict-mall-tabs a[aria-current="page"] {
  color: #fff;
  background: linear-gradient(135deg, #0c56bb, #1386df);
}

.dynamic-app .ict-mall-experience .ict-mall-filter {
  display: grid;
  grid-template-columns: minmax(240px, 1.75fr) repeat(3, minmax(155px, .85fr)) auto auto;
  gap: .75rem;
  align-items: end;
  padding: clamp(1rem, 2vw, 1.35rem);
  border: 1px solid var(--mall-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 16px 42px rgba(15, 55, 94, .08);
}

.dynamic-app .ict-mall-experience .ict-mall-filter label {
  display: grid;
  gap: .45rem;
  min-width: 0;
  margin: 0;
  color: #1e3a57;
  font: 700 .76rem/1.2 var(--font-interface);
}

.dynamic-app .ict-mall-experience .ict-mall-filter :is(input, select) {
  width: 100%;
  min-height: 46px;
  margin: 0;
  padding: .68rem .8rem;
  border: 1px solid #c8d9e8;
  border-radius: 10px;
  color: #102b48;
  background: #f9fcff;
  font: 500 .9rem/1.3 var(--font-interface);
}

.dynamic-app .ict-mall-experience .ict-mall-filter :is(input, select):focus {
  outline: 3px solid rgba(34, 185, 243, .23);
  border-color: #1477d8;
}

.dynamic-app .ict-mall-experience .ict-mall-filter .btn {
  min-height: 46px;
  white-space: nowrap;
}

.dynamic-app .ict-mall-experience .ict-mall-result-bar {
  display: flex;
  align-items: baseline;
  gap: .55rem;
  margin: 1.25rem 0;
  color: #526b83;
}

.dynamic-app .ict-mall-experience .ict-mall-result-bar strong {
  color: var(--mall-ink);
  font: 800 1.85rem/1 var(--font-heading);
}

.dynamic-app .ict-mall-experience .ict-mall-result-bar a {
  margin-left: auto;
  color: #0a60c5;
  font-weight: 750;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.45rem);
}

.dynamic-app .ict-mall-experience .ict-mall-listing-card {
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--mall-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 14px 36px rgba(11, 45, 80, .08);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-card:hover {
  transform: translateY(-3px);
  border-color: #b0d1ed;
  box-shadow: 0 24px 50px rgba(11, 45, 80, .14);
}

.dynamic-app .ict-mall-experience .ict-mall-listing-media {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #102d4e;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-media picture {
  display: contents;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .3s ease;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-card:hover .ict-mall-listing-image {
  transform: scale(1.025);
}

.dynamic-app .ict-mall-experience .ict-mall-type-badge {
  position: absolute;
  left: 1rem;
  bottom: 1rem;
  padding: .48rem .72rem;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 999px;
  color: #fff;
  background: rgba(5, 25, 49, .85);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .2);
  font: 800 .68rem/1 var(--font-interface);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 1.15rem;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-context {
  display: flex;
  justify-content: space-between;
  gap: .8rem;
  margin-bottom: .7rem;
  color: #5f748a;
  font: 700 .68rem/1.25 var(--font-interface);
  letter-spacing: .035em;
  text-transform: uppercase;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-context span:last-child {
  color: #9a6812;
  text-align: right;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-body h3 {
  margin: 0 0 .65rem;
  color: var(--mall-ink);
  font: 750 clamp(1.1rem, 1.7vw, 1.35rem)/1.22 var(--font-heading);
  letter-spacing: -.025em;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-body h3 a {
  color: inherit;
  text-decoration: none;
}

.dynamic-app .ict-mall-experience .ict-mall-listing-body > p {
  margin: 0 0 1rem;
  color: #4b647d;
  font-size: .9rem;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-line {
  display: flex;
  align-items: center;
  gap: .7rem;
  margin-top: auto;
  padding-top: .9rem;
  border-top: 1px solid #e3ecf4;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-line > span,
.dynamic-app .ict-mall-experience .ict-mall-provider-monogram {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #fff;
  background: linear-gradient(135deg, #0751b3, #1cb7ee);
  font: 800 1.05rem/1 var(--font-heading);
}

.dynamic-app .ict-mall-experience .ict-mall-provider-line small {
  display: block;
  color: #718399;
  font-size: .68rem;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-line a {
  color: #0b56aa;
  font-weight: 800;
}

.dynamic-app .ict-mall-experience .ict-mall-card-actions {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: .6rem;
  margin-top: 1rem;
}

.dynamic-app .ict-mall-experience .ict-mall-card-actions .btn {
  width: 100%;
  min-height: 44px;
  padding-inline: .7rem;
  font-size: .76rem;
}

.dynamic-app .ict-mall-experience .ict-mall-empty {
  grid-column: 1 / -1;
  padding: clamp(1.6rem, 4vw, 3rem);
  border: 1px dashed #a9c6df;
  border-radius: 18px;
  text-align: center;
  background: #f8fbfe;
}

.dynamic-app .ict-mall-experience .ict-mall-empty h2 {
  margin-top: 0;
}

.dynamic-app .ict-mall-experience .ict-mall-empty .actions {
  justify-content: center;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-invite {
  color: #fff;
  background: linear-gradient(125deg, #071a33, #0d3159);
}

.dynamic-app .ict-mall-experience .ict-mall-provider-invite :is(h2, p) {
  color: #fff;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-invite p {
  color: rgba(237, 247, 255, .8);
}

.dynamic-app .ict-mall-experience .ict-mall-provider-profile {
  color: #fff;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-monogram {
  width: 68px;
  height: 68px;
  margin-bottom: 1rem;
  border-radius: 18px;
  font-size: 1.8rem;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-profile h2 {
  margin: 0 0 .45rem;
  color: #fff;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-profile > p {
  color: rgba(239, 248, 255, .8);
}

.dynamic-app .ict-mall-experience .ict-mall-provider-profile dl {
  display: grid;
  gap: .7rem;
  margin: 1.25rem 0 0;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-profile dl div {
  padding: .75rem 0;
  border-top: 1px solid rgba(255, 255, 255, .14);
}

.dynamic-app .ict-mall-experience .ict-mall-provider-profile dt {
  color: #8fe2ff;
  font: 750 .68rem/1.2 var(--font-interface);
  letter-spacing: .06em;
  text-transform: uppercase;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-profile dd {
  margin: .3rem 0 0;
  color: #fff;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-facts {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin: 1.2rem 0 0;
}

.dynamic-app .ict-mall-experience .ict-mall-provider-facts span {
  padding: .65rem .8rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 10px;
  color: rgba(239, 248, 255, .82);
  background: rgba(255, 255, 255, .07);
}

.dynamic-app .ict-mall-experience :is(a, button, input, select):focus-visible {
  outline: 3px solid rgba(34, 185, 243, .58);
  outline-offset: 3px;
}

@media (max-width: 1180px) {
  .dynamic-app .ict-mall-experience .ict-mall-filter {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dynamic-app .ict-mall-experience .ict-mall-search-field {
    grid-column: 1 / -1;
  }

  .dynamic-app .ict-mall-experience .ict-mall-listing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .dynamic-app .ict-mall-experience .ict-mall-hero-grid,
  .dynamic-app .ict-mall-experience .ict-mall-provider-hero .split {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .dynamic-app .ict-mall-experience .ict-mall-hero-panel {
    border-radius: 18px;
  }

  .dynamic-app .ict-mall-experience .ict-mall-filter,
  .dynamic-app .ict-mall-experience .ict-mall-listing-grid {
    grid-template-columns: 1fr;
  }

  .dynamic-app .ict-mall-experience .ict-mall-filter > * {
    grid-column: 1;
  }

  .dynamic-app .ict-mall-experience .ict-mall-filter .btn {
    width: 100%;
  }

  .dynamic-app .ict-mall-experience .ict-mall-result-bar {
    flex-wrap: wrap;
  }

  .dynamic-app .ict-mall-experience .ict-mall-result-bar a {
    flex: 0 0 100%;
    margin-left: 0;
  }

  .dynamic-app .ict-mall-experience .ict-mall-card-actions {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 420px) {
  .dynamic-app .ict-mall-experience .ict-mall-hero-panel dl {
    grid-template-columns: 1fr;
  }

  .dynamic-app .ict-mall-experience .ict-mall-tabs {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dynamic-app .ict-mall-experience .ict-mall-listing-card,
  .dynamic-app .ict-mall-experience .ict-mall-listing-image {
    transition: none;
  }
}

/* ARRIX ICT-MALL desktop shell v2 — scoped below the protected website nav. */
.dynamic-app .ict-mall-experience.ict-mall-shell-v2 {
  --mall-shell-ink: #06172f;
  --mall-shell-muted: #526b83;
  --mall-shell-line: #d5e2ee;
  --mall-shell-blue: #0d64d8;
  --mall-shell-cyan: #22b9f3;
  --mall-shell-soft: #eef5fb;
  background: #f5f8fc;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-account-bar {
  position: relative;
  z-index: 34;
  color: #fff;
  border-top: 1px solid rgba(255, 255, 255, .06);
  border-bottom: 1px solid rgba(123, 191, 235, .22);
  background:
    linear-gradient(90deg, rgba(28, 184, 238, .08), transparent 28%),
    #07172b;
  box-shadow: 0 10px 28px rgba(4, 17, 35, .14);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-account-inner {
  min-height: 62px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(.8rem, 2vw, 1.5rem);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-account-brand {
  min-width: max-content;
  display: grid;
  grid-template-columns: 34px auto;
  grid-template-rows: auto auto;
  column-gap: .65rem;
  align-items: center;
  color: #fff;
  text-decoration: none;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-account-brand > span {
  grid-row: 1 / 3;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 9px;
  color: #fff;
  background: linear-gradient(135deg, #0b66d9, #22b9f3);
  font: 850 .9rem/1 var(--font-heading);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-account-brand strong {
  align-self: end;
  color: #fff;
  font: 800 .82rem/1.15 var(--font-interface);
  letter-spacing: .035em;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-account-brand small {
  align-self: start;
  color: #91acc5;
  font: 650 .62rem/1.2 var(--font-interface);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-commerce-links,
.dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions {
  display: flex;
  align-items: center;
  gap: .28rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-commerce-links {
  justify-content: center;
  min-width: 0;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-commerce-links a,
.dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions a {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .58rem .72rem;
  border-radius: 8px;
  color: #d9e8f5;
  font: 750 .72rem/1 var(--font-interface);
  text-decoration: none;
  white-space: nowrap;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-commerce-links a:is(:hover, :focus-visible),
.dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions a:is(:hover, :focus-visible) {
  color: #fff;
  background: rgba(255, 255, 255, .1);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions {
  justify-content: flex-end;
  padding-left: .75rem;
  border-left: 1px solid rgba(255, 255, 255, .13);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions > span {
  margin-right: .15rem;
  color: #8fa9c0;
  font: 700 .65rem/1 var(--font-interface);
  white-space: nowrap;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions a {
  border: 1px solid rgba(255, 255, 255, .18);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions a.is-accent {
  border-color: transparent;
  color: #06172f;
  background: linear-gradient(135deg, #8ee5ff, #2cc1f2);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero--compact,
.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero.ict-mall-hero--compact {
  min-height: 0;
  padding-block: clamp(2.5rem, 5vw, 4.5rem);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero-grid,
.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero .split {
  grid-template-columns: minmax(0, 1fr) minmax(360px, .92fr);
  gap: clamp(2rem, 4.5vw, 4.2rem);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero .section-head h1,
.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero .section-head h1 {
  max-width: 17ch;
  font-size: clamp(2.65rem, 4.8vw, 4.7rem);
  line-height: .99;
  letter-spacing: -.055em;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero .lead,
.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero .lead {
  max-width: 65ch;
  margin-top: 1rem;
  font-size: clamp(1rem, 1.4vw, 1.16rem);
  line-height: 1.65;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero .actions,
.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero .actions {
  margin-top: 1.45rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero .actions .btn.secondary,
.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero .actions .btn.secondary {
  border-color: rgba(255, 255, 255, .42);
  color: #fff;
  background: rgba(255, 255, 255, .08);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-preview-note {
  display: inline-flex;
  align-items: center;
  gap: .48rem;
  margin: 1.15rem 0 0;
  color: #a8bfd4;
  font: 700 .7rem/1.3 var(--font-interface);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-preview-note span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #4bd39d;
  box-shadow: 0 0 0 4px rgba(75, 211, 157, .13);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero-visual {
  position: relative;
  min-width: 0;
  overflow: hidden;
  aspect-ratio: 16 / 10.5;
  border: 1px solid rgba(153, 217, 255, .26);
  border-radius: 22px;
  background: #06142b;
  box-shadow: 0 30px 72px rgba(1, 10, 24, .38);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero-visual picture {
  display: contents;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .83;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(3, 14, 31, .03) 30%, rgba(3, 14, 31, .94) 100%);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero-visual-overlay {
  position: absolute;
  z-index: 2;
  left: 1.15rem;
  top: 1.1rem;
  display: grid;
  padding: .85rem 1rem;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 13px;
  background: rgba(4, 20, 43, .76);
  backdrop-filter: blur(12px);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero-visual-overlay span {
  color: #8fe2ff;
  font: 800 .62rem/1.2 var(--font-interface);
  letter-spacing: .09em;
  text-transform: uppercase;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero-visual-overlay strong {
  margin-top: .2rem;
  color: #fff;
  font: 850 2.35rem/.95 var(--font-heading);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-hero-visual-overlay small {
  margin-top: .25rem;
  color: #b9cee0;
  font-size: .66rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-stat-row {
  position: absolute;
  z-index: 2;
  left: 1.1rem;
  right: 1.1rem;
  bottom: 1.1rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem;
  margin: 0;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-stat-row div {
  padding: .72rem .78rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 11px;
  background: rgba(4, 20, 43, .76);
  backdrop-filter: blur(10px);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-stat-row dt {
  color: #9cb5ca;
  font: 700 .64rem/1.2 var(--font-interface);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-stat-row dd {
  margin: .28rem 0 0;
  color: #fff;
  font: 850 1.25rem/1 var(--font-heading);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-catalog {
  padding-block: clamp(2rem, 4vw, 4rem) clamp(4rem, 7vw, 7rem);
  background:
    linear-gradient(180deg, #eaf3fb 0, #f7faff 260px, #fff 100%);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-workspace {
  display: grid;
  grid-template-columns: minmax(270px, 292px) minmax(0, 1fr);
  gap: clamp(1.2rem, 2.5vw, 2rem);
  align-items: start;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-results-pane {
  min-width: 0;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar {
  position: sticky;
  top: 1rem;
  max-height: calc(100vh - 2rem);
  overflow: hidden;
  border: 1px solid #cdddea;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(10, 45, 80, .1);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar > summary,
.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-group > summary {
  list-style: none;
  cursor: pointer;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar > summary::-webkit-details-marker,
.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-group > summary::-webkit-details-marker {
  display: none;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-heading {
  position: relative;
  display: grid;
  gap: .25rem;
  padding: 1rem 2.8rem 1rem 1rem;
  color: #fff;
  background: linear-gradient(135deg, #071a33, #0c3158);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-heading::after,
.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-group > summary::after {
  content: "+";
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  font: 750 1.05rem/1 var(--font-interface);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar[open] > .ict-mall-sidebar-heading::after,
.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-group[open] > summary::after {
  content: "−";
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-heading > span {
  font: 800 .9rem/1.2 var(--font-interface);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-heading > small {
  color: #a8bfd4;
  font: 650 .64rem/1.35 var(--font-interface);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-content {
  max-height: calc(100vh - 86px);
  overflow-y: auto;
  padding: .7rem;
  scrollbar-width: thin;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-home {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  margin-bottom: .55rem;
  padding: .7rem .75rem;
  border-radius: 10px;
  color: #0b4f9c;
  background: #edf6ff;
  font: 800 .74rem/1.25 var(--font-interface);
  text-decoration: none;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-home strong,
.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-group > summary strong {
  min-width: 28px;
  height: 26px;
  display: inline-grid;
  place-items: center;
  padding-inline: .42rem;
  border-radius: 999px;
  color: #0b4f9c;
  background: #e8f3fc;
  font-size: .68rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-group {
  border-top: 1px solid #e0e9f1;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-group > summary {
  position: relative;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .75rem 2.6rem .75rem .7rem;
  color: #112f4e;
  font: 800 .78rem/1.25 var(--font-interface);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-group-body {
  padding: 0 .35rem .8rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-all {
  min-height: 38px;
  display: flex;
  align-items: center;
  padding: .55rem .65rem;
  border-radius: 8px;
  color: #0a60c5;
  background: #f1f7fd;
  font: 800 .7rem/1.25 var(--font-interface);
  text-decoration: none;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-commodity-links {
  max-height: 190px;
  display: grid;
  gap: .12rem;
  margin-top: .35rem;
  overflow-y: auto;
  padding-right: .2rem;
  scrollbar-width: thin;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-commodity-links a {
  min-height: 36px;
  display: flex;
  align-items: center;
  padding: .48rem .62rem;
  border-radius: 7px;
  color: #49637c;
  font: 650 .69rem/1.35 var(--font-interface);
  text-decoration: none;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-commodity-links a:is(:hover, :focus-visible) {
  color: #0b55a7;
  background: #edf5fc;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-category-provider {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .12rem .65rem;
  margin-top: .55rem;
  padding: .62rem .68rem;
  border: 1px solid #d6e4ef;
  border-radius: 9px;
  color: #173d61;
  background: #fafcff;
  text-decoration: none;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-category-provider > span {
  color: #74899d;
  font: 700 .61rem/1.2 var(--font-interface);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-category-provider > strong {
  grid-row: 1 / 3;
  grid-column: 2;
  align-self: center;
  color: #0b57ac;
  font: 850 .73rem/1 var(--font-interface);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-category-provider > small {
  color: #3d5d79;
  font-size: .63rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-directory {
  margin-top: .7rem;
  padding: .85rem;
  border-radius: 12px;
  color: #fff;
  background: linear-gradient(135deg, #071a33, #0c3158);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-directory > span {
  color: #8fe2ff;
  font: 800 .62rem/1.2 var(--font-interface);
  letter-spacing: .06em;
  text-transform: uppercase;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-directory > a {
  display: flex;
  align-items: center;
  gap: .68rem;
  margin-top: .7rem;
  color: #fff;
  text-decoration: none;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-directory i {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: #fff;
  background: linear-gradient(135deg, #0d64d8, #22b9f3);
  font: normal 850 .92rem/1 var(--font-heading);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-directory strong,
.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-directory small {
  display: block;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-directory small {
  margin-top: .16rem;
  color: #adc3d7;
  font-size: .61rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-directory p {
  margin: .72rem 0 0;
  color: #9fb7cc;
  font-size: .63rem;
  line-height: 1.4;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-tabs {
  margin-bottom: .8rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-filter {
  grid-template-columns: minmax(240px, 1fr) minmax(160px, .42fr) auto auto;
  gap: .65rem;
  padding: .9rem;
  border-radius: 14px;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-filter label {
  gap: .35rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-result-bar {
  align-items: center;
  margin: .9rem 0 1rem;
  padding: .75rem .9rem;
  border: 1px solid #dbe6ef;
  border-radius: 11px;
  background: rgba(255, 255, 255, .78);
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-result-bar > div {
  display: flex;
  align-items: baseline;
  gap: .5rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-result-bar strong {
  font-size: 1.35rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-result-bar span {
  font-size: .74rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-listing-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-listing-card {
  border-radius: 15px;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-listing-media {
  aspect-ratio: 16 / 8.6;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-listing-body {
  padding: 1rem;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-listing-body > p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-card-actions {
  grid-template-columns: 1fr;
}

.dynamic-app .ict-mall-shell-v2 .ict-mall-provider-invite {
  padding-block: clamp(2.6rem, 5vw, 4.2rem);
}

.dynamic-app .ict-mall-shell-v2 :is(.ict-mall-account-bar, .ict-mall-sidebar, .ict-mall-results-pane) a:focus-visible,
.dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar summary:focus-visible {
  outline: 3px solid rgba(34, 185, 243, .55);
  outline-offset: 2px;
}

@media (min-width: 1540px) {
  .dynamic-app .ict-mall-shell-v2 .ict-mall-listing-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-inner {
    display: flex;
    overflow-x: auto;
    scrollbar-width: thin;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-brand,
  .dynamic-app .ict-mall-shell-v2 .ict-mall-commerce-links,
  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions {
    flex: 0 0 auto;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-hero-grid,
  .dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero .split {
    grid-template-columns: minmax(0, 1fr) minmax(320px, .8fr);
    gap: 1.6rem;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-workspace {
    grid-template-columns: 1fr;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar {
    position: static;
    max-height: none;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-content {
    max-height: min(64vh, 680px);
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-filter {
    grid-template-columns: minmax(220px, 1fr) minmax(160px, .5fr) auto auto;
  }
}

@media (max-width: 820px) {
  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions > span {
    display: none;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-hero-grid,
  .dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero .split {
    grid-template-columns: 1fr;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-hero .section-head h1,
  .dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero .section-head h1 {
    max-width: 18ch;
  }
}

@media (max-width: 760px) {
  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-inner {
    width: calc(100% - 24px);
    min-height: 58px;
    padding-block: .5rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "brand account"
      "shortcuts shortcuts";
    gap: .55rem;
    overflow: visible;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-brand {
    grid-area: brand;
    min-width: 0;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-brand strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-commerce-links {
    grid-area: shortcuts;
    justify-content: flex-start;
    padding-top: .45rem;
    overflow-x: auto;
    border-top: 1px solid rgba(255, 255, 255, .12);
    scrollbar-width: thin;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions {
    grid-area: account;
    justify-self: end;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-brand small {
    display: none;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-brand {
    grid-template-rows: 1fr;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-brand > span {
    grid-row: 1;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-commerce-links a,
  .dynamic-app .ict-mall-shell-v2 .ict-mall-account-actions a {
    min-height: 40px;
    padding-inline: .65rem;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-hero--compact,
  .dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero.ict-mall-hero--compact {
    padding-block: 2.2rem 2.6rem;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-hero .section-head h1,
  .dynamic-app .ict-mall-shell-v2 .ict-mall-provider-hero .section-head h1 {
    font-size: clamp(2.25rem, 11vw, 3.3rem);
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-hero-visual {
    aspect-ratio: 16 / 11.5;
    border-radius: 16px;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-hero-visual-overlay {
    left: .8rem;
    top: .8rem;
    padding: .68rem .76rem;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-hero-visual-overlay strong {
    font-size: 1.85rem;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-stat-row {
    left: .75rem;
    right: .75rem;
    bottom: .75rem;
    gap: .35rem;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-stat-row div {
    padding: .55rem;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-stat-row dt {
    font-size: .56rem;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-stat-row dd {
    font-size: 1rem;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-workspace {
    gap: 1rem;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-filter,
  .dynamic-app .ict-mall-shell-v2 .ict-mall-listing-grid {
    grid-template-columns: 1fr;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-filter > * {
    grid-column: 1;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-result-bar {
    align-items: flex-start;
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-sidebar-content {
    max-height: min(70vh, 620px);
  }

  .dynamic-app .ict-mall-shell-v2 .ict-mall-commodity-links {
    max-height: 170px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dynamic-app .ict-mall-shell-v2 .ict-mall-listing-card,
  .dynamic-app .ict-mall-shell-v2 .ict-mall-listing-image,
  .dynamic-app .ict-mall-shell-v2 :is(a, summary) {
    transition: none;
  }
}

@media (max-width: 760px) {
  .dynamic-app {
    font-size: 16px;
  }

  body.dynamic-app #main h1,
  body.dynamic-app #main .section-head h1 {
    font-size: clamp(2rem, 8.8vw, 2.375rem);
    line-height: 1.08;
  }

  body.dynamic-app #main :is(.hero, [class*="-hero"]) h1 {
    font-size: clamp(2.375rem, 9.8vw, 2.75rem);
    line-height: 1.04;
  }

  body.dynamic-app #main h2,
  body.dynamic-app #main .section-head h2,
  body.dynamic-app #main :is(
    .products-services-experience,
    .resource-experience,
    .commerce-experience
  ) h2 {
    font-size: clamp(1.625rem, 6.8vw, 2rem);
    line-height: 1.14;
  }

  body.dynamic-app #main h3,
  body.dynamic-app #main :is(
    .card,
    .premium-card,
    .faq-card,
    .resource-card-grid,
    .core-service-line,
    .market-card-body,
    .family-card,
    .commerce-product-body,
    .commerce-workflow-track,
    .commerce-fit-grid,
    .commerce-product-faq
  ) h3 {
    font-size: clamp(1.1875rem, 5.4vw, 1.4375rem);
  }

  body.dynamic-app #main :is(p, li, dd),
  body.dynamic-app #main :is(
    .products-services-experience,
    .resource-experience,
    .commerce-experience
  ) :is(p, li, dd),
  body.dynamic-app #main :is(
    .card,
    .premium-card,
    .faq-card,
    .resource-card-grid,
    .core-service-line,
    .market-card-body,
    .family-card,
    .commerce-product-body,
    .commerce-feature-card,
    .commerce-workflow-track,
    .commerce-cart-item,
    .commerce-order-summary
  ) :is(p, li, dd) {
    font-size: 16px;
  }

  .dynamic-app .enterprise-primary-nav .nav-shell {
    min-height: 70px;
  }

  .dynamic-app .enterprise-primary-nav .nav-actions {
    order: 3;
    flex-basis: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dynamic-app .enterprise-primary-nav .commerce-access-menu,
  .dynamic-app .enterprise-primary-nav .nav-primary-action.primary {
    width: 100%;
  }

  .dynamic-app .enterprise-primary-nav .nav-primary-action.primary,
  .dynamic-app .enterprise-primary-nav .commerce-access-menu > summary {
    justify-content: center;
  }

  .dynamic-app .enterprise-primary-nav .mega-layout,
  .dynamic-app .enterprise-footer,
  .dynamic-app .sitemap-grid,
  .dynamic-app .consent-preferences fieldset,
  .dynamic-app .article-layout {
    grid-template-columns: 1fr;
  }

  .dynamic-app .consent-preferences {
    max-height: calc(100vh - 24px);
    overflow-y: auto;
    grid-template-columns: 1fr;
  }

  .dynamic-app .consent-preferences .cookie-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .dynamic-app .prototype-figure img {
    min-height: 260px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dynamic-app *,
  .dynamic-app *::before,
  .dynamic-app *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* CHG-V07-003 Gate B: final role-specific cascade enforcement.
   Canonical font-family tokens are defined once in site/styles.css. */
body.dynamic-app[class] #main :is(
  .card,
  .premium-card,
  .faq-card,
  .resource-card-grid,
  .core-service-line,
  .market-card-body,
  .family-card,
  .commerce-product-body,
  .commerce-feature-card,
  .commerce-cart-item,
  .commerce-checkout-form,
  .commerce-order-summary,
  .commerce-product-faq
) :is(h2, h3) {
  font-family: var(--font-display);
  font-size: clamp(1.1875rem, 1.45vw, 1.4375rem);
  font-weight: 650;
  line-height: 1.25;
}

body.dynamic-app[class] #main :is(
  .flow-stage b,
  .map-stage b,
  .pipe-step,
  .metric-card strong,
  .metric-value,
  .stat strong
) {
  font-family: var(--font-display);
  font-weight: 650;
  font-synthesis: none;
  letter-spacing: -.022em;
}

body.dynamic-app[class] #primary-navigation :is(
  a,
  button,
  summary,
  .mega-super,
  .mega-label
),
body.dynamic-app[class] .account-access-panel :is(a, button, summary),
body.dynamic-app[class] .left-nav-panel :is(a, summary),
body.dynamic-app[class] .enterprise-primary-nav .nav-actions .quiet-link {
  font-family: var(--font-interface);
  font-size: 15px;
  font-weight: 600;
}

body.dynamic-app[class] .enterprise-primary-nav .nav-actions .quiet-link {
  color: #18314f;
}

body.dynamic-app[class] :is(
  .top-utility-note,
  .top-utility-note strong,
  .top-utility-note span,
  .top-utility-contact a,
  .top-utility-socials a,
  .top-utility-book a,
  .utility-link
) {
  font-family: var(--font-interface);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.25;
}

body.dynamic-app[class] #main :is(.btn, button, summary) {
  font-family: var(--font-interface);
  font-size: 15px;
  font-weight: 600;
}

body.dynamic-app[class] #main :is(input, select, textarea) {
  font-family: var(--font-interface);
  font-size: 16px;
  font-weight: 400;
}

body.dynamic-app[class] #main label {
  font-family: var(--font-interface);
  font-size: 14px;
  font-weight: 600;
}

body.dynamic-app[class] #main :is(
  .metric-card span,
  .quote-progress span,
  .quote-visual-panel small,
  .quote-visual-steps span,
  .estimate-summary-card small,
  .rich-service-meta dt,
  .about-objective-card span
) {
  font-family: var(--font-interface);
  font-size: 14px;
  font-weight: 600;
}

body.dynamic-app[class] #main :is(
  .commerce-product-category,
  .commerce-recommended,
  .commerce-card-recommended,
  .commerce-cart-item > div > span,
  .commerce-cart-item-meta span,
  .commerce-checkout-summary li span
) {
  font-family: var(--font-interface);
  font-size: 13px;
  font-weight: 500;
}

body.dynamic-app[class] #main :is(
  .live-estimate-panel dt,
  .commerce-billing-label,
  .commerce-checkout-summary > div span
) {
  font-family: var(--font-interface);
  font-size: 14px;
  font-weight: 600;
}

body.dynamic-app[class] #main :is(
  .live-estimate-panel dd,
  .price-line,
  .commerce-product-buy strong,
  .commerce-feature-price strong,
  .commerce-product-price strong,
  .commerce-cart-item-meta strong,
  .commerce-checkout-summary li b,
  .commerce-checkout-summary > div strong
) {
  font-family: var(--font-interface);
  font-weight: 700;
}

body.dynamic-app[class] #main :is(
  .commerce-text-link,
  .commerce-cart-item-meta button,
  .commerce-checkout-summary > a
) {
  font-family: var(--font-interface);
  font-size: 15px;
  font-weight: 600;
}

body.dynamic-app[class] #main .visual-proof .eyebrow {
  color: #7cddff;
}

body.dynamic-app[class] #main .visual-proof .media-card :is(h2, h3) {
  color: #0f2038;
}

body.dynamic-app[class] #main .commerce-experience :is(
  .commerce-catalog-intro > p,
  .commerce-result-meta span,
  .commerce-product-buy > div > span
) {
  color: #5d6d80;
  font-family: var(--font-interface);
  font-size: 13px;
  font-weight: 500;
}

body.dynamic-app[class] #main .commerce-experience :is(
  .commerce-feature-price > span,
  .commerce-product-price > span
) {
  color: #b9cfdf;
  font-family: var(--font-interface);
  font-size: 13px;
  font-weight: 500;
}

body.dynamic-app[class] #main .feature-chip {
  font-family: var(--font-interface);
  font-size: 16px;
  font-weight: 600;
}

body.dynamic-app[class] #main :is(
  [role="tooltip"],
  .tooltip,
  .info-panel,
  .info-disclosure,
  .scenario-disclosure
) {
  font-family: var(--font-interface);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.55;
}

@media (max-width: 760px) {
  body.dynamic-app[class] #main :is(
    .card,
    .premium-card,
    .faq-card,
    .resource-card-grid,
    .core-service-line,
    .market-card-body,
    .family-card,
    .commerce-product-body,
    .commerce-feature-card,
    .commerce-cart-item,
    .commerce-checkout-form,
    .commerce-order-summary,
    .commerce-product-faq
  ) :is(h2, h3) {
    font-size: clamp(1.1875rem, 5.4vw, 1.4375rem);
  }
}

/* ARX-V05-004: route-scoped priority-service pages and coded process flows. */
.dynamic-app .priority-service-page .priority-hero .lead {
  max-width: 68ch;
}

.dynamic-app .priority-service-page .priority-proof-note {
  margin: .85rem 0 0;
  color: #c8dce9;
  font-size: .86rem;
  line-height: 1.55;
}

.dynamic-app .priority-service-page .priority-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.dynamic-app .priority-service-page .priority-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dynamic-app .priority-service-page .priority-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1.2rem;
}

.dynamic-app .priority-service-page .priority-fact {
  padding: .9rem 1rem;
  border: 1px solid rgba(89, 211, 255, .28);
  border-radius: 12px;
  background: rgba(4, 27, 52, .72);
}

.dynamic-app .priority-service-page .priority-fact span,
.dynamic-app .priority-service-page .priority-fact strong {
  display: block;
}

.dynamic-app .priority-service-page .priority-fact span {
  color: #a9c7db;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.dynamic-app .priority-service-page .priority-fact strong {
  margin-top: .3rem;
  color: #fff;
  line-height: 1.35;
}

.dynamic-app .priority-service-page .priority-example-label {
  display: inline-flex;
  align-items: center;
  margin-bottom: .65rem;
  padding: .35rem .55rem;
  border: 1px solid rgba(255, 193, 75, .54);
  border-radius: 999px;
  color: #ffd48a;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.dynamic-app .priority-service-page .priority-disclaimer {
  margin-top: 1rem;
  padding: 1rem 1.1rem;
  border-left: 4px solid #16c8f4;
  border-radius: 6px;
  background: rgba(9, 40, 67, .08);
  color: #304a61;
}

.dynamic-app .priority-service-page .related-offer-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
}

.dynamic-app .priority-service-page .related-offer-list a {
  display: flex;
  min-height: 68px;
  align-items: center;
  padding: .85rem 1rem;
  border: 1px solid rgba(13, 101, 167, .17);
  border-radius: 10px;
  background: #fff;
  color: #0d416e;
  font-weight: 700;
  text-decoration: none;
}

.dynamic-app .priority-service-page .related-offer-list a:hover {
  border-color: #13bde9;
  box-shadow: 0 10px 28px rgba(4, 43, 78, .1);
}

.dynamic-app .coded-flow {
  position: relative;
  margin-top: 1.5rem;
}

.dynamic-app .coded-flow__list {
  display: grid;
  grid-template-columns: repeat(var(--flow-columns, 4), minmax(0, 1fr));
  gap: 1.2rem;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: coded-flow;
}

.dynamic-app .coded-flow__step {
  position: relative;
  min-width: 0;
  padding: 1.15rem 1rem 1rem;
  border: 1px solid rgba(87, 210, 255, .36);
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(21, 201, 244, .12), rgba(255, 255, 255, .03)),
    #08233f;
  box-shadow: 0 14px 36px rgba(0, 11, 27, .22);
  color: #edfaff;
  counter-increment: coded-flow;
}

.dynamic-app .coded-flow__step::before {
  content: counter(coded-flow, decimal-leading-zero);
  display: inline-grid;
  width: 2.15rem;
  height: 2.15rem;
  place-items: center;
  margin-bottom: .75rem;
  border: 1px solid rgba(255, 199, 82, .55);
  border-radius: 50%;
  color: #ffd17c;
  font-size: .77rem;
  font-weight: 800;
}

.dynamic-app .coded-flow__step:not(:last-child)::after {
  content: "→";
  position: absolute;
  z-index: 2;
  top: 50%;
  right: -.94rem;
  display: grid;
  width: 1.7rem;
  height: 1.7rem;
  place-items: center;
  border: 1px solid rgba(76, 205, 247, .45);
  border-radius: 50%;
  background: #061b32;
  color: #58d7fb;
  font-weight: 800;
  transform: translateY(-50%);
}

.dynamic-app .coded-flow__heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
}

.dynamic-app .coded-flow__heading h3 {
  margin: 0;
  color: #fff;
  font-size: clamp(1rem, 1.4vw, 1.16rem);
  line-height: 1.35;
}

.dynamic-app .coded-flow__summary {
  margin: .65rem 0 0;
  color: #c6dbe9;
  font-size: .91rem;
  line-height: 1.55;
}

.dynamic-app .coded-flow__info {
  display: none;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(99, 220, 255, .66);
  border-radius: 50%;
  background: rgba(4, 22, 42, .78);
  color: #7de7ff;
  cursor: pointer;
  font-family: Georgia, serif;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;
}

.dynamic-app .coded-flow__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.dynamic-app .coded-flow[data-flow-enhanced] .coded-flow__info {
  display: inline-flex;
}

.dynamic-app .coded-flow__info:hover,
.dynamic-app .coded-flow__info[aria-expanded="true"] {
  border-color: #ffd17c;
  background: #0b3458;
  color: #ffd17c;
}

.dynamic-app .coded-flow__info:focus-visible,
.dynamic-app .priority-service-page a:focus-visible {
  outline: 3px solid #ffd166;
  outline-offset: 3px;
}

.dynamic-app .coded-flow__panel {
  margin-top: .85rem;
  padding: .8rem;
  border: 1px solid rgba(114, 220, 250, .2);
  border-radius: 9px;
  background: rgba(0, 11, 24, .46);
  color: #e1f2fb;
  font-size: .87rem;
  line-height: 1.55;
}

.dynamic-app .coded-flow__panel[hidden] {
  display: none;
}

@media (max-width: 1180px) {
  .dynamic-app .coded-flow__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dynamic-app .coded-flow__step:nth-child(2n)::after {
    content: "↓";
    top: auto;
    right: calc(50% - .85rem);
    bottom: -1.48rem;
    transform: none;
  }

  .dynamic-app .priority-service-page .priority-grid.three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .dynamic-app .priority-service-page .priority-grid,
  .dynamic-app .priority-service-page .priority-grid.three,
  .dynamic-app .priority-service-page .priority-facts,
  .dynamic-app .priority-service-page .related-offer-list,
  .dynamic-app .coded-flow__list {
    grid-template-columns: minmax(0, 1fr);
  }

  .dynamic-app .coded-flow__step:not(:last-child)::after,
  .dynamic-app .coded-flow__step:nth-child(2n)::after {
    content: "↓";
    top: auto;
    right: calc(50% - .85rem);
    bottom: -1.48rem;
    transform: none;
  }

  .dynamic-app .priority-service-page .priority-fact,
  .dynamic-app .coded-flow__step {
    min-width: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dynamic-app .priority-service-page *,
  .dynamic-app .coded-flow * {
    scroll-behavior: auto !important;
  }

  .dynamic-app .priority-service-page :is(.motion-grid, .data-stream) {
    display: none !important;
  }
}

@media print {
  .dynamic-app .priority-service-page {
    color: #000 !important;
  }

  .dynamic-app .coded-flow__list {
    display: block;
  }

  .dynamic-app .coded-flow__step {
    break-inside: avoid;
    margin: 0 0 .65rem;
    border: 1px solid #777;
    background: #fff !important;
    box-shadow: none;
    color: #000;
  }

  .dynamic-app .coded-flow__step::after,
  .dynamic-app .coded-flow__info {
    display: none !important;
  }

  .dynamic-app .coded-flow__heading h3,
  .dynamic-app .coded-flow__summary,
  .dynamic-app .coded-flow__panel {
    color: #000 !important;
  }

  .dynamic-app .coded-flow__panel,
  .dynamic-app .coded-flow__panel[hidden] {
    display: block !important;
    border-color: #aaa;
    background: #fff !important;
  }
}


/* ARRIX local preview repair: product hero carousel and compact responsive navigation. */
.dynamic-app .product-hero-carousel {
  position: relative;
  isolation: isolate;
  min-height: clamp(480px, 52vh, 620px);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .18);
  background: #061426;
}

.dynamic-app .product-hero-slides,
.dynamic-app .product-hero-slide,
.dynamic-app .product-hero-slide picture {
  position: absolute;
  inset: 0;
}

.dynamic-app .product-hero-slide {
  z-index: 0;
  opacity: 0;
  pointer-events: none;
  transform: scale(1.015);
}

.dynamic-app .product-hero-slide.is-active {
  z-index: 1;
  opacity: 1;
  pointer-events: auto;
  transform: scale(1);
}

.dynamic-app .dynamic-hero .product-hero-slide .product-hero-image {
  width: 100%;
  height: 100%;
  min-height: 0;
  display: block;
  object-fit: cover;
  object-position: center;
}

.dynamic-app .product-hero-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(2, 10, 23, .05) 20%, rgba(2, 10, 23, .86) 100%),
    linear-gradient(90deg, rgba(2, 10, 23, .55), transparent 65%);
}

.dynamic-app .product-hero-caption {
  position: absolute;
  left: clamp(1rem, 3vw, 2rem);
  right: clamp(1rem, 3vw, 2rem);
  bottom: clamp(1.2rem, 3vw, 2rem);
  z-index: 2;
  max-width: 560px;
  color: #fff;
}

.dynamic-app .product-hero-category {
  display: inline-flex;
  margin-bottom: .58rem;
  padding: .35rem .58rem;
  border: 1px solid rgba(117, 221, 255, .5);
  border-radius: 999px;
  background: rgba(3, 20, 40, .72);
  color: #9fe8ff;
  font: 600 .76rem/1.2 var(--font-interface);
  letter-spacing: .06em;
  text-transform: uppercase;
}

body.dynamic-app #main .product-hero-caption h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(1.55rem, 2.8vw, 2.45rem);
  line-height: 1.08;
}

.dynamic-app .product-hero-caption p {
  max-width: 54ch;
  margin: .7rem 0 .85rem;
  color: rgba(241, 248, 255, .88);
  font-size: .98rem;
  line-height: 1.55;
}

.dynamic-app .product-hero-caption a {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-height: 42px;
  color: #fff;
  font-weight: 650;
  text-decoration: none;
  border-bottom: 1px solid rgba(117, 221, 255, .65);
}

.dynamic-app .product-hero-caption a:hover,
.dynamic-app .product-hero-caption a:focus-visible {
  color: #8ce5ff;
  outline: none;
}

.dynamic-app .product-hero-controls {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 4;
  display: flex;
  align-items: center;
  gap: .38rem;
  padding: .38rem;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  background: rgba(3, 15, 31, .76);
  backdrop-filter: blur(12px);
}

.dynamic-app .product-hero-arrow,
.dynamic-app .product-hero-toggle,
.dynamic-app .product-hero-dot {
  border: 0;
  color: #fff;
  background: transparent;
  cursor: pointer;
}

.dynamic-app .product-hero-arrow {
  width: 34px;
  min-height: 34px;
  padding: 0;
  border-radius: 50%;
  font-size: 1.35rem;
  line-height: 1;
}

.dynamic-app .product-hero-toggle {
  min-height: 34px;
  padding: .3rem .65rem;
  border-left: 1px solid rgba(255, 255, 255, .18);
  font-size: .76rem;
  font-weight: 650;
}

.dynamic-app .product-hero-dots {
  display: flex;
  align-items: center;
  gap: .38rem;
}

.dynamic-app .product-hero-dot {
  width: 9px;
  min-width: 9px;
  min-height: 9px;
  padding: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .44);
}

.dynamic-app .product-hero-dot.is-active {
  width: 24px;
  border-radius: 999px;
  background: #48d4ff;
}

.dynamic-app .product-hero-arrow:hover,
.dynamic-app .product-hero-arrow:focus-visible,
.dynamic-app .product-hero-toggle:hover,
.dynamic-app .product-hero-toggle:focus-visible,
.dynamic-app .product-hero-dot:focus-visible {
  color: #91e8ff;
  background: rgba(255, 255, 255, .12);
  outline: 2px solid #55d8ff;
  outline-offset: 2px;
}

@media (max-width: 1180px) {
  body.dynamic-app.nav-open {
    overflow: hidden;
  }

  .dynamic-app .enterprise-primary-nav .nav-shell.open {
    flex-wrap: nowrap;
  }

  .dynamic-app .enterprise-primary-nav .nav-shell.open .nav-links {
    position: fixed !important;
    top: var(--fixed-nav-offset);
    left: 12px;
    right: 12px;
    width: auto;
    max-height: calc(100vh - var(--fixed-nav-offset) - 12px);
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: .28rem;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: .72rem;
    border: 1px solid rgba(17, 103, 216, .18);
    border-radius: 12px;
    background: rgba(255, 255, 255, .99);
    box-shadow: 0 22px 64px rgba(8, 29, 58, .22);
  }

  .dynamic-app .enterprise-primary-nav .nav-links > a {
    flex: 0 0 auto;
    width: 100%;
    min-height: 46px;
    justify-content: flex-start;
    padding: .72rem .82rem;
    color: #17304d;
  }

  .dynamic-app .enterprise-primary-nav .nav-mega-group {
    position: relative;
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 48px;
    align-items: start;
    align-content: start;
    width: 100%;
    min-height: 0;
  }

  .dynamic-app .enterprise-primary-nav .nav-section-link {
    width: 100%;
    min-height: 46px;
    padding: .72rem .82rem;
    border-radius: 8px 0 0 8px;
    color: #17304d;
  }

  .dynamic-app .enterprise-primary-nav .nav-mega-group > .nav-section-toggle {
    width: 48px;
    min-width: 48px;
    min-height: 46px;
    border-left: 1px solid #dbe5ef;
  }

  .dynamic-app .enterprise-primary-nav .nav-mega-group > .nav-section-toggle::after {
    left: 18px;
    top: 16px;
  }

  .dynamic-app .enterprise-primary-nav .nav-mega-group > .mega-panel,
  .dynamic-app .enterprise-primary-nav .nav-mega-group:hover > .mega-panel,
  .dynamic-app .enterprise-primary-nav .nav-mega-group:focus-within > .mega-panel {
    position: static;
    grid-column: 1 / -1;
    display: none !important;
    width: 100%;
    min-height: 0;
    margin: .2rem 0 .4rem;
    padding: .8rem;
    overflow: visible;
    opacity: 0;
    pointer-events: none;
    transform: none !important;
    box-shadow: none;
  }

  .dynamic-app .enterprise-primary-nav .nav-mega-group.is-open > .mega-panel {
    display: block !important;
    opacity: 1;
    pointer-events: auto;
  }

  .dynamic-app .enterprise-primary-nav .mega-layout {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem 1rem;
  }

  .dynamic-app:has(.nav-mega-group.is-open) main {
    filter: none;
  }
}

@media (max-width: 760px) {
  .dynamic-app .product-hero-carousel {
    min-height: 430px;
  }

  .dynamic-app .product-hero-controls {
    top: .7rem;
    right: .7rem;
  }

  .dynamic-app .product-hero-caption {
    bottom: 1rem;
  }

  .dynamic-app .product-hero-caption p {
    font-size: .9rem;
  }

  .dynamic-app .enterprise-primary-nav .mega-layout {
    grid-template-columns: 1fr;
  }
}

/* ARRIX brand readability: preserve approved artwork while making its embedded line legible. */
.dynamic-app .enterprise-primary-nav .brand {
  flex: 0 0 224px;
  min-width: 224px;
  padding: .15rem .3rem;
}

.dynamic-app .enterprise-primary-nav .brand img {
  width: 224px;
  height: auto;
  max-width: 100%;
  max-height: 68px;
}

body.dynamic-app #main .dynamic-hero .hero-copy h1 {
  color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .26);
}

.dynamic-app .dynamic-hero .hero-copy .lead {
  color: rgba(242, 249, 255, .9);
}

.dynamic-app .dynamic-hero .hero-proof span {
  color: #eef9ff;
  background: rgba(5, 24, 47, .74);
  border-color: rgba(116, 220, 255, .3);
}

@media (min-width: 1181px) and (max-width: 1420px) {
  .dynamic-app .enterprise-primary-nav .brand {
    flex-basis: 174px;
    min-width: 174px;
  }

  .dynamic-app .enterprise-primary-nav .brand img {
    width: 174px;
  }
}

@media (max-width: 1180px) {
  .dynamic-app .enterprise-primary-nav .brand {
    flex-basis: 214px;
    min-width: 214px;
  }

  .dynamic-app .enterprise-primary-nav .brand img {
    width: 214px;
    height: auto;
    max-width: 214px;
    max-height: 66px;
  }
}

@media (max-width: 760px) {
  .dynamic-app .enterprise-primary-nav .brand {
    flex-basis: 174px;
    min-width: 174px;
  }

  .dynamic-app .enterprise-primary-nav .brand img {
    width: 174px;
    max-width: 174px;
  }
}

@media (max-width: 1180px) {
  .dynamic-app .enterprise-primary-nav .nav-toggle {
    display: grid !important;
    grid-template-columns: 28px auto;
    grid-template-rows: repeat(3, 4px);
    column-gap: .42rem;
    align-items: center;
    min-width: 88px;
    min-height: 44px;
    margin-left: auto;
    padding: .52rem .72rem;
    border: 1px solid rgba(11, 95, 196, .26);
    border-radius: 9px;
    color: #17304d;
    background: #f3f8fd;
  }

  .dynamic-app .enterprise-primary-nav .nav-toggle span {
    grid-column: 1;
    width: 24px;
    height: 2px;
    margin: 0;
    background: #17304d;
  }

  .dynamic-app .enterprise-primary-nav .nav-toggle-label {
    grid-column: 2;
    grid-row: 1 / 4;
    align-self: center;
    font: 600 15px/1 var(--font-interface);
  }
}

/* ============================================================================
   ARRIX premium uplift — 2026-08-05 (owner: gold-standard menus + detail pages)
   Appended additively; later rules win at equal specificity.
   ========================================================================== */

/* --- Drop-down menus, Check Point manner: full panel, refined columns, featured card --- */
.dynamic-app .compact-commerce-nav .mega-panel {
  border-top: 3px solid #B0873A;
  box-shadow: 0 30px 60px rgba(6,23,47,.18);
  padding-bottom: 1.6rem;
  min-height: 0;
  animation: arrixMegaIn .18s ease-out;
}
@keyframes arrixMegaIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.dynamic-app .compact-commerce-nav .mega-label {
  color: #8a672a;
  letter-spacing: .18em;
  font-weight: 800;
  border-bottom: 2px solid rgba(176,135,58,.35);
  padding-bottom: .35rem;
  margin-bottom: .55rem;
  display: inline-block;
}
.dynamic-app .compact-commerce-nav .mega-column > a {
  position: relative;
  border-radius: 8px;
  padding: .42rem .6rem .42rem .9rem;
  transition: background .14s, color .14s, padding .14s;
}
.dynamic-app .compact-commerce-nav .mega-column > a::before {
  content: "";
  position: absolute;
  left: 0; top: 50%;
  width: 3px; height: 0;
  transform: translateY(-50%);
  border-radius: 2px;
  background: linear-gradient(180deg, #B0873A, #E8B84B);
  transition: height .16s;
}
.dynamic-app .compact-commerce-nav .mega-column > a:hover {
  background: #F5F8FC;
  padding-left: 1.05rem;
}
.dynamic-app .compact-commerce-nav .mega-column > a:hover::before { height: 68%; }
.dynamic-app .compact-commerce-nav .mega-featured {
  background: linear-gradient(160deg, #06172F, #143a63);
  border: 1px solid rgba(232,184,75,.35);
  border-radius: 14px;
  padding: 1.15rem 1.2rem;
  box-shadow: 0 18px 40px rgba(6,23,47,.28);
}
.dynamic-app .compact-commerce-nav .mega-featured .mega-label {
  color: #E8B84B;
  border-bottom-color: rgba(232,184,75,.4);
}
.dynamic-app .compact-commerce-nav .mega-featured h3 { color: #fff; line-height: 1.3; }
.dynamic-app .compact-commerce-nav .mega-featured p { color: #AFC0D2; font-size: .84rem; line-height: 1.55; }
.dynamic-app .compact-commerce-nav .nav-mega-group:hover > .nav-section-link,
.dynamic-app .compact-commerce-nav .nav-mega-group.is-open > .nav-section-link { color: #0f63d6; }
.dynamic-app .compact-commerce-nav .nav-mega-group.is-open > .nav-section-link::after,
.dynamic-app .compact-commerce-nav .nav-mega-group:hover > .nav-section-link::after {
  content: "";
  position: absolute;
  left: .5rem; right: .5rem; bottom: -14px;
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, #B0873A, #E8B84B);
}
.dynamic-app .compact-commerce-nav .nav-section-link { position: relative; }

/* --- Detail pages (products, services, solutions): premium rhythm and polish --- */
.dynamic-app h1, .dynamic-app h2 { letter-spacing: -.014em; }
.dynamic-app .section-head .eyebrow, .dynamic-app .premium-card .eyebrow {
  letter-spacing: .2em;
  font-weight: 800;
}
.dynamic-app .premium-card {
  border-radius: 15px;
  transition: box-shadow .2s, transform .2s, border-color .2s;
}
.dynamic-app .premium-card:hover {
  box-shadow: 0 14px 32px rgba(6,23,47,.10);
  transform: translateY(-2px);
  border-color: rgba(176,135,58,.4);
}
.dynamic-app .premium-card .list li,
.dynamic-app .priority-grid .list li {
  position: relative;
  padding-left: 1.35rem;
  list-style: none;
}
.dynamic-app .premium-card .list li::before,
.dynamic-app .priority-grid .list li::before {
  content: "";
  position: absolute;
  left: 0; top: .48em;
  width: .62rem; height: .34rem;
  border-left: 2.5px solid #B0873A;
  border-bottom: 2.5px solid #B0873A;
  transform: rotate(-45deg);
}
.dynamic-app .faq-card {
  border-radius: 13px;
  border-left: 3px solid rgba(176,135,58,.55);
  transition: box-shadow .18s, transform .18s;
}
.dynamic-app .faq-card:hover { box-shadow: 0 10px 26px rgba(6,23,47,.09); transform: translateY(-2px); }
.dynamic-app .btn.primary { transition: transform .15s, box-shadow .15s, background .15s; }
.dynamic-app .btn.primary:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(6,23,47,.22); }
.dynamic-app .priority-fact strong { letter-spacing: -.005em; }
.dynamic-app .priority-hero .eyebrow { color: #E8B84B; }
@media (prefers-reduced-motion: reduce) {
  .dynamic-app .compact-commerce-nav .mega-panel { animation: none; }
  .dynamic-app .premium-card, .dynamic-app .faq-card, .dynamic-app .btn.primary { transition: none; }
}

/* --- ARRIX footer, rebuilt 2026-08-05: quiet, ordered, tech-company grade --- */
.dynamic-app .arrix-footer { background: linear-gradient(180deg, #06172F 0%, #0A2038 100%); color: #9FB0C0; border-top: 3px solid #B0873A; padding: 0; display: block; }
.dynamic-app .arrix-footer .ft-wrap { max-width: 1200px; margin: 0 auto; padding: 0 clamp(1.2rem, 4vw, 2.5rem); }
.dynamic-app .arrix-footer .ft-top { display: grid; grid-template-columns: 300px 1fr; gap: clamp(1.5rem, 5vw, 4rem); padding: 3rem 0 2.4rem; }
@media (max-width: 900px) { .dynamic-app .arrix-footer .ft-top { grid-template-columns: 1fr; } }
.dynamic-app .arrix-footer .ft-brand img { max-width: 150px; height: auto; margin-bottom: .8rem; }
.dynamic-app .arrix-footer .ft-tag { color: #E8B84B; font-size: .72rem; font-weight: 700; letter-spacing: .28em; text-transform: uppercase; margin: 0 0 1rem; }
.dynamic-app .arrix-footer .ft-contact { font-style: normal; font-size: .84rem; line-height: 1.8; color: #9FB0C0; }
.dynamic-app .arrix-footer .ft-contact a { color: #D8E2EC; text-decoration: none; }
.dynamic-app .arrix-footer .ft-contact a:hover { color: #fff; }
.dynamic-app .arrix-footer .ft-socials { display: flex; gap: .55rem; margin-top: 1.1rem; }
.dynamic-app .arrix-footer .ft-social { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.18); border-radius: 9px; transition: border-color .15s, background .15s, transform .15s; }
.dynamic-app .arrix-footer .ft-social:hover { border-color: #E8B84B; background: rgba(232,184,75,.1); transform: translateY(-2px); }
.dynamic-app .arrix-footer .ft-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1.6rem 2rem; align-content: start; }
.dynamic-app .arrix-footer .ft-col h2 { color: #fff; font-size: .74rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; margin: 0 0 .9rem; padding-bottom: .55rem; border-bottom: 1px solid rgba(232,184,75,.28); }
.dynamic-app .arrix-footer .ft-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .2rem; }
.dynamic-app .arrix-footer .ft-col a { display: inline-block; color: #AFC0D2; font-size: .85rem; line-height: 1.5; padding: .22rem 0; text-decoration: none; transition: color .14s, padding-left .14s; }
.dynamic-app .arrix-footer .ft-col a:hover { color: #E8B84B; padding-left: .3rem; }
.dynamic-app .arrix-footer .ft-bottom { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; padding: 1.1rem 0 1.3rem; border-top: 1px solid rgba(255,255,255,.1); font-size: .78rem; color: #7f93a8; }
.dynamic-app .arrix-footer .ft-bottom-links { display: flex; gap: 1.2rem; align-items: center; flex-wrap: wrap; }
.dynamic-app .arrix-footer .ft-bottom-links a, .dynamic-app .arrix-footer .ft-bottom .quiet-link { color: #9FB0C0; font-size: .78rem; text-decoration: none; background: none; border: none; cursor: pointer; padding: 0; }
.dynamic-app .arrix-footer .ft-bottom-links a:hover, .dynamic-app .arrix-footer .ft-bottom .quiet-link:hover { color: #E8B84B; }

/* --- Home hero advert player: reasonably wider and longer (owner 2026-08-05) --- */
@media (min-width: 981px) {
  .dynamic-app .dynamic-hero .hero-grid { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.25fr); gap: clamp(1.4rem, 3vw, 2.6rem); align-items: center; }
  .dynamic-app .product-hero-carousel { min-height: 520px; }
  .dynamic-app .product-hero-slides, .dynamic-app .product-hero-slide { min-height: 520px; }
}
.dynamic-app .product-hero-slide .product-hero-image, .dynamic-app .product-hero-slide img { width: 100%; height: 100%; object-fit: cover; }
.dynamic-app .product-hero-caption { padding: 1.4rem 1.5rem 1.5rem; }
.dynamic-app .product-hero-caption h2 { font-size: clamp(1.25rem, 2.2vw, 1.7rem); letter-spacing: -.012em; }
.dynamic-app .product-hero-caption p { max-width: 58ch; }
.dynamic-app .product-hero-category { color: #E8B84B; font-weight: 800; letter-spacing: .2em; }
.dynamic-app .product-hero-ctas { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: .8rem; }
.dynamic-app .product-hero-ctas .btn.ghost { border-color: rgba(255,255,255,.55); color: #fff; }
.dynamic-app .product-hero-ctas .btn.ghost:hover { border-color: #E8B84B; color: #E8B84B; }
.dynamic-app .product-hero-shade { background: linear-gradient(180deg, rgba(6,23,47,0) 30%, rgba(6,23,47,.88) 78%); }

/* --- Navigation bar: premium pass (owner 2026-08-05, second round) --- */
.dynamic-app .site-header.enterprise-primary-nav { position: sticky; top: 0; z-index: 95; background: rgba(255,255,255,.96); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); box-shadow: 0 1px 0 rgba(16,45,78,.09), 0 8px 26px rgba(6,23,47,.06); }
.dynamic-app .enterprise-primary-nav .top-utility-bar { background: #06172F; }
.dynamic-app .enterprise-primary-nav .top-utility-bar a, .dynamic-app .enterprise-primary-nav .top-utility-bar .utility-label { font-size: .76rem; letter-spacing: .02em; }
.dynamic-app .enterprise-primary-nav .nav-shell { min-height: 66px; padding-top: .3rem; padding-bottom: .3rem; gap: clamp(.6rem, 1.6vw, 1.4rem); }
.dynamic-app .enterprise-primary-nav .brand img { height: 42px; width: auto; }
.dynamic-app .enterprise-primary-nav .nav-links > a,
.dynamic-app .enterprise-primary-nav .nav-section-link { font-size: .93rem; font-weight: 700; letter-spacing: .012em; color: #14273D; padding: .6rem .85rem; border-radius: 9px; position: relative; transition: color .15s, background .15s; }
.dynamic-app .enterprise-primary-nav .nav-links > a:hover,
.dynamic-app .enterprise-primary-nav .nav-section-link:hover { background: #F3F7FC; color: #06172F; }
.dynamic-app .enterprise-primary-nav .nav-links > a::after,
.dynamic-app .enterprise-primary-nav .nav-section-link::after { content: ""; position: absolute; left: .85rem; right: .85rem; bottom: .28rem; height: 2.5px; border-radius: 2px; background: linear-gradient(90deg, #B0873A, #E8B84B); transform: scaleX(0); transform-origin: left; transition: transform .18s ease-out; }
.dynamic-app .enterprise-primary-nav .nav-links > a:hover::after,
.dynamic-app .enterprise-primary-nav .nav-section-link:hover::after,
.dynamic-app .enterprise-primary-nav .nav-mega-group.is-open .nav-section-link::after,
.dynamic-app .enterprise-primary-nav .nav-links > a[aria-current]::after { transform: scaleX(1); }
.dynamic-app .enterprise-primary-nav .nav-section-toggle { opacity: .55; transition: opacity .15s, transform .15s; }
.dynamic-app .enterprise-primary-nav .nav-mega-group:hover .nav-section-toggle,
.dynamic-app .enterprise-primary-nav .nav-mega-group.is-open .nav-section-toggle { opacity: 1; }
.dynamic-app .enterprise-primary-nav .client-login { background: linear-gradient(135deg, #B0873A, #E8B84B); color: #06172F !important; font-weight: 800; letter-spacing: .02em; border: none; border-radius: 10px; padding: .62rem 1.15rem; box-shadow: 0 4px 14px rgba(176,135,58,.35); transition: transform .15s, box-shadow .15s; }
.dynamic-app .enterprise-primary-nav .client-login:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(176,135,58,.45); }
.dynamic-app .enterprise-primary-nav .nav-primary-action { border-radius: 9px; font-weight: 700; }
.dynamic-app .enterprise-primary-nav .account-access-menu > summary { border-radius: 9px; font-weight: 700; }
@media (prefers-reduced-motion: reduce) { .dynamic-app .enterprise-primary-nav .nav-links > a::after, .dynamic-app .enterprise-primary-nav .nav-section-link::after { transition: none; } }

/* ================================================================
   Footer gap fix (owner order 2026-08-06).
   The footer holds 8 panels: brand (spans 2 rows) + 6 link groups +
   Contact. In the old 4-column grid the Contact panel wrapped to a
   third row beneath the brand panel, leaving a huge empty gap.
   A 5-column grid seats everything in exactly 2 filled rows:
   row 1 - brand | Services | Solutions | Products | Industries
   row 2 - brand | Resources | Legal | Contact (spans 2 columns)
   Structure and markup unchanged; geometry only.
   ================================================================ */
.dynamic-app .enterprise-footer {
  grid-template-columns: minmax(230px, 1.3fr) repeat(4, minmax(140px, 1fr));
  align-items: start;
  padding-block: clamp(44px, 5.5vw, 68px);
}

.dynamic-app .enterprise-footer .footer-contact-panel {
  grid-column: span 2;
}

@media (max-width: 1180px) {
  .dynamic-app .enterprise-footer {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dynamic-app .enterprise-footer .footer-contact-panel {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .dynamic-app .enterprise-footer {
    grid-template-columns: 1fr;
  }

  .dynamic-app .enterprise-footer .footer-contact-panel {
    grid-column: auto;
  }
}

/* ================================================================
   Site-wide Check Point pass (owner order 2026-08-06).
   Applies to every page served through the platform layouts:
   one clean grotesque (self-hosted Inter) across the whole site,
   smaller sizes, tighter spacing, thin strokes that stay visible,
   readable light surfaces, and quiet Check Point-manner
   interactions - including the pressed effect when a button
   is clicked.
   ================================================================ */
.dynamic-app {
  --font-display: "ARRIX Inter", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: "ARRIX Inter", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.55;
  font-weight: 400;
  letter-spacing: .001em;
  background: #f7f9fb;
  color: #16273c;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Body copy: thin strokes, still visible. */
.dynamic-app :is(p, li, dd, td, figcaption, blockquote, label) {
  font-weight: 400;
}

/* Headings: one family for the whole site; weight carries the hierarchy. */
.dynamic-app :is(h1, h2, h3, h4, h5) {
  font-family: var(--font-display);
  letter-spacing: -.016em;
  line-height: 1.18;
  text-wrap: balance;
  font-synthesis: none;
  color: #0d1f35;
}

.dynamic-app h1 { font-size: clamp(1.6rem, 2.9vw, 2.25rem); font-weight: 650; }
.dynamic-app h2 { font-size: clamp(1.16rem, 2vw, 1.5rem); font-weight: 620; }
.dynamic-app h3 { font-size: 1rem; font-weight: 600; line-height: 1.3; }
.dynamic-app :is(h4, h5) { font-size: .9rem; font-weight: 600; }

/* Generic paragraph rhythm: tighter, component-specific rules still win. */
.dynamic-app p { margin-block: 0 .75em; }

/* Interface text: navigation and controls - medium weight, never heavy. */
.dynamic-app .enterprise-primary-nav .nav-section-link,
.dynamic-app .enterprise-primary-nav .nav-links > a {
  font-size: .88rem;
  font-weight: 600;
}

.dynamic-app :is(input, select, textarea, button) {
  font-family: var(--font-body);
}

/* Footer type: smaller and lighter, same structure. */
.dynamic-app .enterprise-footer :is(a, p, button) {
  font-size: .9rem;
  line-height: 1.5;
  font-weight: 400;
}

.dynamic-app .enterprise-footer a { min-height: 36px; }

.dynamic-app .enterprise-footer h2 {
  font-size: .85rem;
  font-weight: 650;
  margin-bottom: .7rem;
}

/* ---- Check Point-manner interactions: quiet hover, pressed click ---- */
.dynamic-app :is(.btn, button, .nav-primary-action, summary.btn) {
  transition: background-color .15s ease, color .15s ease,
              border-color .15s ease, box-shadow .15s ease,
              transform .12s ease;
}

.dynamic-app .btn {
  font-weight: 600;
  letter-spacing: .01em;
  border-radius: 9px;
}

.dynamic-app :is(.btn, .nav-primary-action):hover {
  transform: translateY(-1px);
}

/* The click effect: a firm, brief press - down and slightly compact. */
.dynamic-app :is(.btn, button, .nav-primary-action, summary.btn):active {
  transform: translateY(1px) scale(.985);
  box-shadow: 0 1px 3px rgba(6, 23, 47, .18);
  transition-duration: .06s;
}

/* Links: colour shift only, no decoration jumps. */
.dynamic-app main a:not(.btn) {
  transition: color .14s ease;
}

@media (prefers-reduced-motion: reduce) {
  .dynamic-app :is(.btn, button, .nav-primary-action, summary.btn),
  .dynamic-app :is(.btn, button, .nav-primary-action, summary.btn):active,
  .dynamic-app :is(.btn, .nav-primary-action):hover {
    transition: none;
    transform: none;
  }
}

/* ================================================================
   ARRIX virtual assistant (owner order 2026-08-06) — the Check Point
   manner: white card, thin strokes, quiet motion, gold accents.
   ================================================================ */
.dynamic-app .arx-launcher {
  position: fixed; right: 18px; bottom: 18px; z-index: 1200;
  display: none; align-items: center; gap: .5rem;
  padding: .55rem .95rem .55rem .55rem;
  background: #fff; color: #0d1f35;
  border: 1px solid #d8e2ec; border-radius: 999px;
  box-shadow: 0 10px 30px rgba(6, 23, 47, .18);
  font-weight: 600; font-size: .86rem; cursor: pointer;
}
.dynamic-app .arx-launcher.is-visible { display: inline-flex; }
.dynamic-app .arx-launcher img { border-radius: 50%; object-fit: cover; }
.dynamic-app .arx-launcher:hover { transform: translateY(-2px); box-shadow: 0 14px 36px rgba(6,23,47,.24); }

.dynamic-app .arx-assistant {
  position: fixed; right: 18px; bottom: 18px; z-index: 1300;
  width: min(390px, calc(100vw - 24px));
  max-height: min(640px, calc(100vh - 40px));
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid #dde6ef; border-radius: 16px;
  box-shadow: 0 24px 70px rgba(6, 23, 47, .28);
  overflow: hidden;
}
.dynamic-app .arx-assistant.is-hidden { display: none; }

.dynamic-app .arx-head {
  display: flex; align-items: center; gap: .65rem;
  padding: .8rem .95rem; border-bottom: 1px solid #e8eef5; background: #fbfcfe;
}
.dynamic-app .arx-head img { border-radius: 50%; object-fit: cover; }
.dynamic-app .arx-head strong { display: block; font-size: .95rem; color: #0d1f35; }
.dynamic-app .arx-head span { display: block; font-size: .74rem; color: #6d7f93; }
.dynamic-app .arx-close {
  margin-left: auto; border: 0; background: transparent; font-size: 1.3rem;
  color: #6d7f93; cursor: pointer; line-height: 1; padding: .2rem .45rem; border-radius: 8px;
}
.dynamic-app .arx-close:hover { background: #eef3f9; color: #0d1f35; }

.dynamic-app .arx-msgs {
  flex: 1; overflow-y: auto; padding: .9rem; display: grid; gap: .55rem; align-content: start;
  background: #f7f9fb; min-height: 180px;
}
.dynamic-app .arx-msg { display: flex; }
.dynamic-app .arx-msg.arx-visitor { justify-content: flex-end; }
.dynamic-app .arx-bubble {
  max-width: 85%; padding: .55rem .8rem; border-radius: 12px;
  font-size: .86rem; line-height: 1.5; white-space: pre-wrap; word-wrap: break-word;
  background: #fff; border: 1px solid #e2eaf2; color: #1c2b3a;
}
.dynamic-app .arx-visitor .arx-bubble { background: #0e2a4d; color: #f2f7fd; border-color: #0e2a4d; }
.dynamic-app .arx-staff .arx-bubble { background: #fdf6e7; border-color: #e8d9b0; }
.dynamic-app .arx-note { font-size: .76rem; color: #6d7f93; text-align: center; margin: .2rem 0; }
.dynamic-app .arx-typing .arx-bubble span {
  display: inline-block; width: 6px; height: 6px; margin: 0 2px; border-radius: 50%;
  background: #9fb0c0; animation: arxblink 1s infinite alternate;
}
.dynamic-app .arx-typing .arx-bubble span:nth-child(2) { animation-delay: .2s; }
.dynamic-app .arx-typing .arx-bubble span:nth-child(3) { animation-delay: .4s; }
@keyframes arxblink { to { opacity: .25; } }

.dynamic-app .arx-chips { display: flex; flex-wrap: wrap; gap: .4rem; padding: .55rem .9rem; background: #f7f9fb; }
.dynamic-app .arx-chip {
  border: 1px solid #c9d7e5; background: #fff; color: #0d2a4d;
  border-radius: 999px; padding: .32rem .75rem; font-size: .78rem; font-weight: 500; cursor: pointer;
}
.dynamic-app .arx-chip:hover { border-color: #B0873A; color: #7a5b21; }

.dynamic-app .arx-handoff { padding: .7rem .9rem; border-top: 1px solid #e8eef5; background: #fffdf7; }
.dynamic-app .arx-handoff p { margin: 0 0 .45rem; font-size: .82rem; }
.dynamic-app .arx-hand-links { display: flex; gap: .45rem; flex-wrap: wrap; margin-bottom: .5rem; }
.dynamic-app .arx-handform { display: grid; gap: .4rem; }
.dynamic-app .arx-handform input, .dynamic-app .arx-handform select {
  border: 1px solid #d3deea; border-radius: 8px; padding: .42rem .6rem; font-size: .82rem; background: #fff;
}
.dynamic-app .arx-handok { color: #1F7A4D; font-size: .82rem; margin: 0; }

.dynamic-app .arx-inputrow {
  display: flex; align-items: center; gap: .4rem;
  padding: .6rem .9rem; border-top: 1px solid #e8eef5; background: #fff;
}
.dynamic-app .arx-inputrow input {
  flex: 1; border: 1px solid #d3deea; border-radius: 999px;
  padding: .5rem .9rem; font-size: .86rem; outline: none; background: #fff;
}
.dynamic-app .arx-inputrow input:focus { border-color: #B0873A; }
.dynamic-app .arx-mic, .dynamic-app .arx-send {
  border: 0; width: 36px; height: 36px; border-radius: 50%; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; font-size: 1rem;
}
.dynamic-app .arx-mic { background: #eef3f9; color: #33475c; }
.dynamic-app .arx-mic.is-listening { background: #B0873A; color: #fff; }
.dynamic-app .arx-send { background: linear-gradient(135deg, #B0873A, #E8B84B); color: #06172F; font-weight: 700; }
.dynamic-app .arx-privacy { margin: 0; padding: .45rem .9rem .7rem; font-size: .7rem; color: #7c8da1; background: #fff; }
.dynamic-app .arx-privacy a { color: #7a5b21; text-decoration: underline; }

/* Admin live-chat transcript */
.dynamic-app .admin-chat-transcript { display: grid; gap: .6rem; max-height: 60vh; overflow-y: auto; align-content: start; }
.dynamic-app .admin-chat-line { border: 1px solid #e2eaf2; border-radius: 10px; padding: .55rem .75rem; background: #fff; }
.dynamic-app .admin-chat-line.role-visitor { border-left: 3px solid #0e2a4d; }
.dynamic-app .admin-chat-line.role-assistant { border-left: 3px solid #9fb0c0; }
.dynamic-app .admin-chat-line.role-staff { border-left: 3px solid #B0873A; background: #fffdf7; }
.dynamic-app .admin-chat-line.role-system { border-left: 3px solid #d05656; }
.dynamic-app .admin-chat-line strong { font-size: .78rem; margin-right: .5rem; }
.dynamic-app .admin-chat-line span { font-size: .7rem; color: #7c8da1; }
.dynamic-app .admin-chat-line p { margin: .25rem 0 0; font-size: .84rem; }

/* ================================================================
   Drop-down menu one-liners (owner order 2026-08-06):
   a faded, smaller, italic description under every service,
   product, and solution link in the mega menus.
   ================================================================ */
.dynamic-app .enterprise-mega-layout .mega-column > a { display: block; }
.dynamic-app .nav-link-text { display: block; }
.dynamic-app .nav-link-desc {
  display: block;
  font-size: .72rem;
  font-style: italic;
  font-weight: 400;
  color: #8395a9;
  line-height: 1.35;
  margin-top: 1px;
  letter-spacing: 0;
}
.dynamic-app .enterprise-mega-layout .mega-column > a:hover .nav-link-desc { color: #5f7288; }

/* ================================================================
   Drop-down menus copied to the Check Point anatomy (owner 2026-08-06):
   plain white panel, uppercase column titles on a hairline rule,
   thin dark links, no promotional card, no catch-all links.
   ================================================================ */
.dynamic-app .compact-commerce-nav .mega-panel.cp-menu {
  background: #fff;
  border-top: 1px solid #e3e9ef;
  border-bottom: 1px solid #e3e9ef;
  box-shadow: 0 18px 34px rgba(6, 23, 47, .10);
  padding: 2.6rem max(20px, calc((100% - 1440px) / 2)) 2.4rem;
}

.dynamic-app .compact-commerce-nav .cp-menu .mega-layout {
  gap: clamp(1.6rem, 3.4vw, 3.4rem);
  align-items: start;
}

.dynamic-app .compact-commerce-nav .cp-menu .mega-column {
  display: block;
  min-width: 0;
}

/* The title band: uppercase, bold, hairline rule across the whole column. */
.dynamic-app .compact-commerce-nav .cp-menu .mega-label {
  display: block;
  width: 100%;
  color: #0d1f35;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
  border-bottom: 1px solid #dfe6ed;
  padding-bottom: .7rem;
  margin: 0 0 1.05rem;
}

/* Links: thin, dark, generously spaced - Check Point's list rhythm. */
.dynamic-app .compact-commerce-nav .cp-menu .mega-column > a {
  display: block;
  padding: .34rem 0;
  margin: 0;
  border-radius: 0;
  background: none;
  color: #1d2b3a;
  font-size: .9rem;
  font-weight: 400;
  line-height: 1.4;
  transition: color .14s ease;
}

.dynamic-app .compact-commerce-nav .cp-menu .mega-column > a::before { content: none; }

.dynamic-app .compact-commerce-nav .cp-menu .mega-column > a:hover,
.dynamic-app .compact-commerce-nav .cp-menu .mega-column > a:focus-visible {
  background: none;
  padding-left: 0;
  color: #0f63d6;
}

.dynamic-app .compact-commerce-nav .cp-menu .nav-link-text {
  display: block;
  font-weight: 400;
}

.dynamic-app .compact-commerce-nav .cp-menu .nav-link-desc {
  display: block;
  font-size: .715rem;
  font-style: italic;
  font-weight: 400;
  color: #8a9aab;
  line-height: 1.35;
  margin-top: 1px;
}

@media (max-width: 1180px) {
  .dynamic-app .compact-commerce-nav .mega-panel.cp-menu { padding: 1.5rem 20px; }
}

/* ================================================================
   Contact US control on the utility bar (owner 2026-08-06):
   every contact channel plus the note, feedback, and review forms.
   ================================================================ */
.dynamic-app .contact-us-menu { position: relative; }

.dynamic-app .contact-us-menu > summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .34rem .95rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #B0873A, #E8B84B);
  color: #06172F;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .02em;
  cursor: pointer;
  border: 0;
}
.dynamic-app .contact-us-menu > summary::-webkit-details-marker { display: none; }
.dynamic-app .contact-us-menu > summary:hover { filter: brightness(1.04); }
.dynamic-app .contact-us-menu > summary .utility-icon svg { width: 14px; height: 14px; }

.dynamic-app .contact-us-panel {
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  z-index: 1400;
  width: min(620px, calc(100vw - 24px));
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: 1.1rem;
  padding: 1.1rem 1.2rem 1.2rem;
  background: #fff;
  border: 1px solid #dde6ef;
  border-radius: 14px;
  box-shadow: 0 26px 60px rgba(6, 23, 47, .26);
  text-align: left;
}

.dynamic-app .contact-us-panel h3 {
  margin: 0 0 .6rem;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
  color: #0d1f35;
  border-bottom: 1px solid #e6ecf3;
  padding-bottom: .5rem;
}

.dynamic-app .contact-us-panel .cu-line {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .45rem .35rem;
  border-radius: 8px;
  color: #1d2b3a;
}
.dynamic-app .contact-us-panel .cu-line:hover { background: #f5f8fc; color: #0f63d6; }
.dynamic-app .contact-us-panel .cu-line strong { display: block; font-size: .86rem; font-weight: 600; }
.dynamic-app .contact-us-panel .cu-line small { display: block; font-size: .73rem; color: #8a9aab; }
.dynamic-app .contact-us-panel .cu-line .utility-icon svg { width: 16px; height: 16px; }

.dynamic-app .contact-us-form { display: grid; gap: .4rem; align-content: start; }
.dynamic-app .contact-us-form .cu-kinds { display: flex; gap: .3rem; margin-bottom: .15rem; }
.dynamic-app .contact-us-form .cu-kinds label {
  flex: 1;
  display: block;
  text-align: center;
  border: 1px solid #d6e0ea;
  border-radius: 8px;
  padding: .3rem .2rem;
  font-size: .74rem;
  cursor: pointer;
  color: #47586b;
}
.dynamic-app .contact-us-form .cu-kinds input { position: absolute; opacity: 0; pointer-events: none; }
.dynamic-app .contact-us-form .cu-kinds label:has(input:checked) {
  border-color: #B0873A;
  background: #fffaf0;
  color: #7a5b21;
  font-weight: 600;
}
.dynamic-app .contact-us-form input,
.dynamic-app .contact-us-form select,
.dynamic-app .contact-us-form textarea {
  width: 100%;
  border: 1px solid #d6e0ea;
  border-radius: 8px;
  padding: .42rem .6rem;
  font-size: .82rem;
  background: #fff;
  font-family: inherit;
}
.dynamic-app .contact-us-form textarea { min-height: 74px; resize: vertical; }
.dynamic-app .contact-us-form .cu-rating { font-size: .74rem; color: #47586b; display: grid; gap: .2rem; }
.dynamic-app .contact-us-form .cu-note { margin: .1rem 0 0; font-size: .68rem; color: #8a9aab; line-height: 1.4; }
.dynamic-app .contact-us-form .cu-note a { color: #7a5b21; text-decoration: underline; }

@media (max-width: 760px) {
  .dynamic-app .contact-us-panel {
    position: fixed;
    left: 12px; right: 12px; top: 64px;
    width: auto;
    grid-template-columns: 1fr;
    max-height: calc(100vh - 90px);
    overflow-y: auto;
  }
}

/* CART button on the navigation bar */
.dynamic-app .enterprise-primary-nav .cart-summary {
  letter-spacing: .06em;
  font-weight: 700;
}

/* ================================================================
   Title system, aligned across the site (owner 2026-08-06):
   the small topic label above a heading now reads exactly like the
   drop-down column titles - uppercase, ruled weight, same colour -
   so a topic looks the same in the menu and on the page it opens.
   ================================================================ */
.dynamic-app .eyebrow,
.dynamic-app .mega-super,
.dynamic-app .section-head .eyebrow {
  display: inline-block;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
  color: #7a5b21;
  margin-bottom: .55rem;
}

.dynamic-app .section.dark .eyebrow,
.dynamic-app .section-head.dark .eyebrow { color: #E8B84B; }

/* Page and section headings: clear, visible, evenly spaced. */
.dynamic-app .section-head h1,
.dynamic-app .section-head h2 { margin-top: 0; margin-bottom: .5rem; }
.dynamic-app .section-head .lead { color: #4a5c70; font-size: .95rem; line-height: 1.6; margin-top: 0; }
.dynamic-app .section.dark .section-head .lead { color: #c6d5e4; }

/* Card and panel titles pick up the same rhythm. */
.dynamic-app .card > h2,
.dynamic-app .premium-card > h2 { font-size: 1.05rem; font-weight: 620; margin: 0 0 .5rem; }

/* ================================================================
   Correction (2026-08-06): the site-wide typography pass set one dark
   heading colour, which made headings on dark hero sections almost
   invisible. Headings inherit light on dark surfaces again.
   ================================================================ */
.dynamic-app .section.dark :is(h1, h2, h3, h4, h5),
.dynamic-app .dark-card :is(h1, h2, h3, h4, h5),
.dynamic-app .premium-card.dark-card :is(h1, h2, h3, h4, h5),
.dynamic-app .hero :is(h1, h2, h3),
.dynamic-app .hero-dark :is(h1, h2, h3),
.dynamic-app .product-hero :is(h1, h2, h3),
.dynamic-app .enterprise-footer :is(h1, h2, h3),
.dynamic-app .mega-featured :is(h1, h2, h3),
.dynamic-app [class*="-hero"]:not(.cat-hero-photo) :is(h1, h2, h3) {
  color: #ffffff;
}

.dynamic-app .section.dark :is(p, li, .lead),
.dynamic-app .hero :is(p, li, .lead) { color: #cbd9e8; }

/* ================================================================
   Services split into component pages (owner 2026-08-06):
   left rail + a feed-style main column, explanatory flow chart and
   statistical panel. Styling follows the dark hero already approved.
   ================================================================ */
.dynamic-app .service-layout {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: clamp(1.4rem, 3vw, 2.6rem);
  align-items: start;
}

.dynamic-app .service-rail {
  position: sticky;
  top: 92px;
  display: grid;
  gap: 2px;
  padding: .8rem;
  background: #fff;
  border: 1px solid #e2eaf2;
  border-radius: 14px;
  box-shadow: 0 12px 30px rgba(6, 23, 47, .07);
}
.dynamic-app .service-rail a {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .5rem .6rem;
  border-radius: 9px;
  color: #23374d;
  font-size: .84rem;
  line-height: 1.35;
  border-left: 3px solid transparent;
}
.dynamic-app .service-rail a:hover { background: #f5f8fc; color: #0f63d6; }
.dynamic-app .service-rail a.is-current {
  background: #f2f7fd;
  border-left-color: #B0873A;
  color: #0d1f35;
  font-weight: 600;
}
.dynamic-app .service-rail .rail-home {
  font-weight: 700;
  font-size: .74rem;
  letter-spacing: .055em;
  text-transform: uppercase;
  color: #7a5b21;
  border-bottom: 1px solid #eef2f7;
  border-radius: 9px 9px 0 0;
  margin-bottom: .25rem;
}
.dynamic-app .service-rail .rail-title { flex: 1; }
.dynamic-app .service-rail .rail-count {
  font-size: .7rem;
  color: #7c8da1;
  background: #eef3f9;
  border-radius: 999px;
  padding: .05rem .42rem;
}
.dynamic-app .service-rail .rail-cta { display: grid; gap: .35rem; margin-top: .6rem; padding-top: .6rem; border-top: 1px solid #eef2f7; }
.dynamic-app .service-rail .rail-cta a { justify-content: center; border-left: 0; }

.dynamic-app .service-main { display: grid; gap: 1.4rem; min-width: 0; }

/* ---- Explanatory flow chart ---- */
.dynamic-app .explain-flow {
  margin: 0;
  padding: 1rem 1.1rem 1.15rem;
  background: #fff;
  border: 1px solid #e2eaf2;
  border-radius: 14px;
}
.dynamic-app .explain-flow figcaption {
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
  color: #7a5b21;
  margin-bottom: .8rem;
}
.dynamic-app .flow-track {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: flow;
}
.dynamic-app .flow-node {
  flex: 1 1 150px;
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .55rem .7rem;
  background: #f7f9fb;
  border: 1px solid #e4ebf3;
  border-radius: 10px;
  position: relative;
}
.dynamic-app .flow-node + .flow-node::before {
  content: "";
  position: absolute;
  left: -.42rem; top: 50%;
  width: .34rem; height: 1px;
  background: #c4d2e0;
}
.dynamic-app .flow-index {
  flex: none;
  width: 22px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: linear-gradient(135deg, #B0873A, #E8B84B);
  color: #06172F;
  font-size: .72rem; font-weight: 700;
}
.dynamic-app .flow-label { font-size: .82rem; color: #23374d; line-height: 1.3; }

/* ---- Statistical panel ---- */
.dynamic-app .explain-stats {
  margin: 0;
  padding: 1rem 1.1rem 1.1rem;
  background: #0d2440;
  border-radius: 14px;
  color: #e8f1fb;
}
.dynamic-app .explain-stats figcaption {
  font-size: .74rem; font-weight: 700; letter-spacing: .055em;
  text-transform: uppercase; color: #E8B84B; margin-bottom: .85rem;
}
.dynamic-app .stat-row { display: grid; grid-template-columns: minmax(120px, 1.1fr) minmax(0, 2fr) 42px; gap: .6rem; align-items: center; margin-bottom: .5rem; }
.dynamic-app .stat-label { font-size: .8rem; color: #c6d8ea; }
.dynamic-app .stat-bar { height: 7px; background: rgba(255,255,255,.12); border-radius: 999px; overflow: hidden; }
.dynamic-app .stat-bar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #3B8FE0, #E8B84B); }
.dynamic-app .stat-value { font-size: .78rem; font-weight: 700; color: #fff; text-align: right; }
.dynamic-app .stat-note { margin: .6rem 0 0; font-size: .72rem; color: #92a8bf; line-height: 1.45; }

/* ---- Overview cards ---- */
.dynamic-app .service-section-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
}
.dynamic-app .service-section-card {
  background: #fff;
  border: 1px solid #e2eaf2;
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow .16s ease, transform .16s ease;
}
.dynamic-app .service-section-card:hover { box-shadow: 0 18px 40px rgba(6,23,47,.14); transform: translateY(-2px); }
.dynamic-app .service-section-card .sec-photo { width: 100%; height: 150px; object-fit: cover; display: block; }
.dynamic-app .ssc-body { padding: .9rem 1rem 1.05rem; display: grid; gap: .5rem; align-content: start; }
.dynamic-app .ssc-body h3 { font-size: .98rem; margin: 0; }
.dynamic-app .ssc-body p { margin: 0; font-size: .84rem; color: #52657a; line-height: 1.5; }
.dynamic-app .ssc-list { margin: 0; padding-left: 1rem; display: grid; gap: .15rem; }
.dynamic-app .ssc-list li { font-size: .78rem; color: #6d7f93; }
.dynamic-app .ssc-body .btn { justify-self: start; margin-top: .2rem; }

/* ---- Feed-style service cards: a technical social environment ---- */
.dynamic-app .service-feed {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1rem;
}
.dynamic-app .feed-card {
  background: #fff;
  border: 1px solid #e2eaf2;
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow .16s ease, transform .16s ease;
}
.dynamic-app .feed-card:hover { box-shadow: 0 18px 40px rgba(6,23,47,.14); transform: translateY(-2px); }
.dynamic-app .feed-head { display: flex; align-items: center; gap: .55rem; padding: .65rem .85rem; border-bottom: 1px solid #eef3f8; }
.dynamic-app .feed-avatar {
  width: 30px; height: 30px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #0d2440, #17548f);
  color: #E8B84B; font-size: .7rem; font-weight: 800; letter-spacing: .04em;
}
.dynamic-app .feed-by strong { display: block; font-size: .82rem; color: #0d1f35; }
.dynamic-app .feed-by small { display: block; font-size: .7rem; color: #8a9aab; }
.dynamic-app .feed-demand { margin-left: auto; font-size: .68rem; font-weight: 700; color: #7a5b21; background: #fdf6e7; border: 1px solid #ecdcb4; border-radius: 999px; padding: .12rem .55rem; }
.dynamic-app .feed-card .feed-photo { width: 100%; height: 168px; object-fit: cover; display: block; }
.dynamic-app .feed-body { padding: .8rem .9rem .3rem; display: grid; gap: .4rem; }
.dynamic-app .feed-body h3 { margin: 0; font-size: .95rem; }
.dynamic-app .feed-body p { margin: 0; font-size: .83rem; color: #52657a; line-height: 1.5; }
.dynamic-app .feed-mvp { font-size: .78rem !important; color: #45596e !important; }
.dynamic-app .feed-tags { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .2rem; }
.dynamic-app .feed-tag { font-size: .68rem; color: #47586b; background: #f2f6fa; border: 1px solid #e2eaf2; border-radius: 999px; padding: .1rem .5rem; }
.dynamic-app .feed-actions { display: flex; flex-wrap: wrap; gap: .35rem; padding: .7rem .9rem .85rem; margin-top: auto; }

.dynamic-app .sec-hero-media .sec-hero-photo { width: 100%; border-radius: 14px; object-fit: cover; max-height: 300px; box-shadow: 0 22px 50px rgba(0,0,0,.35); }
.dynamic-app .service-next { background: #fff; border: 1px solid #e2eaf2; border-radius: 14px; padding: 1rem 1.1rem 1.15rem; }
.dynamic-app .service-next h2 { margin: 0 0 .35rem; font-size: 1rem; }
.dynamic-app .service-next p { margin: 0 0 .6rem; font-size: .85rem; color: #52657a; }

@media (max-width: 980px) {
  .dynamic-app .service-layout { grid-template-columns: 1fr; }
  .dynamic-app .service-rail { position: static; display: flex; flex-wrap: wrap; gap: .3rem; }
  .dynamic-app .service-rail a { flex: 1 1 auto; border-left: 0; border-bottom: 2px solid transparent; }
  .dynamic-app .service-rail a.is-current { border-left: 0; border-bottom-color: #B0873A; }
  .dynamic-app .service-rail .rail-cta { flex: 1 1 100%; grid-auto-flow: column; }
}

/* ================================================================
   Social-media card shape (owner 2026-08-06): a full picture with the
   text beside it on the right. Two columns on desktop and medium
   screens; a single stacked column on phones.
   ================================================================ */
.dynamic-app .service-feed,
.dynamic-app .service-section-grid { grid-template-columns: 1fr; gap: 1rem; }

.dynamic-app .feed-card,
.dynamic-app .service-section-card {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  grid-template-areas: "media body";
  align-items: stretch;
  overflow: hidden;
}

.dynamic-app .feed-card .feed-photo,
.dynamic-app .service-section-card .sec-photo {
  grid-area: media;
  width: 100%;
  height: 100%;
  min-height: 210px;
  object-fit: cover;
  display: block;
}

.dynamic-app .feed-card .feed-head { grid-area: head; }
.dynamic-app .feed-card .feed-body { grid-area: body; }
.dynamic-app .feed-card .feed-actions { grid-area: actions; }
.dynamic-app .service-section-card .ssc-body { grid-area: body; }

.dynamic-app .feed-card {
  grid-template-areas:
    "media head"
    "media body"
    "media actions";
  grid-template-rows: auto 1fr auto;
}

.dynamic-app .feed-card .feed-head { border-bottom: 0; padding: .8rem .95rem .2rem; }
.dynamic-app .feed-card .feed-body { padding: .3rem .95rem .5rem; align-content: start; }
.dynamic-app .feed-card .feed-actions { padding: .2rem .95rem 1rem; }
.dynamic-app .service-section-card .ssc-body { padding: 1rem 1.1rem 1.15rem; }

/* Phones and small screens: one column, picture on top, text beneath. */
@media (max-width: 760px) {
  .dynamic-app .feed-card,
  .dynamic-app .service-section-card {
    grid-template-columns: 1fr;
    grid-template-areas: "media" "head" "body" "actions";
    grid-template-rows: auto;
  }
  .dynamic-app .feed-card .feed-photo,
  .dynamic-app .service-section-card .sec-photo { min-height: 0; height: 190px; }
}

/* ================================================================
   Security topic pages (owner 2026-08-06): terminology cards,
   standards chips, deliverables. Short pages, quick to scan.
   ================================================================ */
.dynamic-app .approach-heading {
  font-size: .78rem; font-weight: 700; letter-spacing: .055em;
  text-transform: uppercase; color: #7a5b21; margin: 0 0 .2rem;
}
.dynamic-app .approach-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: .7rem;
}
.dynamic-app .approach-grid .approach-heading { grid-column: 1 / -1; }
.dynamic-app .approach-card {
  background: #fff; border: 1px solid #e2eaf2; border-left: 3px solid #B0873A;
  border-radius: 10px; padding: .7rem .85rem .8rem;
}
.dynamic-app .approach-card h3 { margin: 0 0 .25rem; font-size: .88rem; font-weight: 620; color: #0d1f35; }
.dynamic-app .approach-card p { margin: 0; font-size: .81rem; line-height: 1.5; color: #52657a; }

.dynamic-app .framework-panel, .dynamic-app .deliverable-panel {
  background: #fff; border: 1px solid #e2eaf2; border-radius: 14px; padding: .95rem 1.1rem 1.05rem;
}
.dynamic-app .framework-panel h2, .dynamic-app .deliverable-panel h2 { margin: 0 0 .55rem; font-size: .95rem; }
.dynamic-app .framework-chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.dynamic-app .framework-chip {
  font-size: .74rem; color: #23374d; background: #f2f6fa;
  border: 1px solid #dde6ef; border-radius: 999px; padding: .18rem .6rem;
}
.dynamic-app .framework-note { margin: .6rem 0 0; font-size: .74rem; color: #7c8da1; line-height: 1.5; }
.dynamic-app .deliverable-list { margin: 0; padding-left: 1.1rem; display: grid; gap: .2rem; }
.dynamic-app .deliverable-list li { font-size: .83rem; color: #45596e; }

.dynamic-app .topic-grid-wrap { display: grid; gap: .55rem; }
.dynamic-app .topic-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: .6rem; }
.dynamic-app .topic-card {
  display: block; background: #fff; border: 1px solid #e2eaf2; border-radius: 12px;
  padding: .7rem .85rem .8rem; transition: box-shadow .16s ease, transform .16s ease;
}
.dynamic-app .topic-card:hover { box-shadow: 0 14px 32px rgba(6,23,47,.12); transform: translateY(-2px); }
.dynamic-app .topic-card strong { display: block; font-size: .87rem; color: #0d1f35; margin-bottom: .2rem; }
.dynamic-app .topic-card span { display: block; font-size: .78rem; color: #6d7f93; line-height: 1.45; }

/* ================================================================
   Footer condensed (owner 2026-08-06): smaller, tighter, still
   clearly legible - contrast raised as the size came down.
   ================================================================ */
.dynamic-app .enterprise-footer {
  padding-block: clamp(30px, 3.4vw, 44px);
  gap: clamp(.9rem, 2vw, 1.7rem);
}
.dynamic-app .enterprise-footer h2 {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #ffffff;
  margin: 0 0 .45rem;
  padding-bottom: .35rem;
  border-bottom: 1px solid rgba(255, 255, 255, .14);
}
.dynamic-app .enterprise-footer :is(a, p, button) {
  font-size: .775rem;
  line-height: 1.45;
  color: rgba(240, 247, 255, .88);
}
.dynamic-app .enterprise-footer a {
  min-height: 0;
  display: block;
  padding: .13rem 0;
  margin: 0;
}
.dynamic-app .enterprise-footer a:hover,
.dynamic-app .enterprise-footer a:focus-visible { color: #8fe3ff; }
.dynamic-app .enterprise-footer .footer-brand-panel p { margin: .5rem 0 .6rem; }
.dynamic-app .enterprise-footer .footer-brand-panel img { width: min(150px, 100%); }
.dynamic-app .enterprise-footer .footer-socials { gap: .4rem; margin-top: .3rem; }
.dynamic-app .enterprise-footer .privacy-settings-link { margin-top: .45rem; padding: .2rem 0; font-size: .755rem; }

/* ================================================================
   Home hero (owner 2026-08-06): the photograph becomes a right-hand
   column running the full height of the hero frame; the text keeps
   its own column on the left. Single column on phones.
   ================================================================ */
.dynamic-app .product-hero-slide.is-active {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
  grid-template-rows: 1fr;
  align-items: stretch;
  min-height: clamp(400px, 44vw, 540px);
  background: linear-gradient(160deg, #06172F, #0d2b4d);
}

.dynamic-app .product-hero-slide.is-active .product-hero-image {
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  position: static;
  border-radius: 0;
}

.dynamic-app .product-hero-slide.is-active .product-hero-caption {
  grid-column: 1;
  grid-row: 1;
  position: static;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .55rem;
  padding: clamp(1.4rem, 3vw, 2.6rem);
  background: none;
  max-width: none;
  width: auto;
}

/* The shade now only softens the seam between the two columns. */
.dynamic-app .product-hero-slide.is-active .product-hero-shade {
  grid-column: 2;
  grid-row: 1;
  position: static;
  background: linear-gradient(90deg, rgba(6,23,47,.55), rgba(6,23,47,0) 34%);
  pointer-events: none;
}

.dynamic-app .product-hero-caption h2 { color: #fff; }
.dynamic-app .product-hero-caption p { color: #cbdcee; font-size: .92rem; line-height: 1.55; }

/* Second hero action was rendering white on white. */
.dynamic-app .product-hero-ctas .btn.ghost {
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .55);
  color: #ffffff !important;
}
.dynamic-app .product-hero-ctas .btn.ghost:hover {
  background: rgba(255, 255, 255, .18);
  border-color: #fff;
}

@media (max-width: 860px) {
  .dynamic-app .product-hero-slide.is-active {
    grid-template-columns: 1fr;
    grid-template-rows: 220px auto;
    min-height: 0;
  }
  .dynamic-app .product-hero-slide.is-active .product-hero-image { grid-column: 1; grid-row: 1; }
  .dynamic-app .product-hero-slide.is-active .product-hero-caption { grid-column: 1; grid-row: 2; }
  .dynamic-app .product-hero-slide.is-active .product-hero-shade { display: none; }
}

/* ================================================================
   Three audiences on one page (owner 2026-08-06): plain words for a
   non-technical visitor, technical detail for a specialist, and a
   short glossary for someone learning the field.
   ================================================================ */
.dynamic-app .persona-set {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: .8rem;
}
.dynamic-app .persona-card {
  background: #fff;
  border: 1px solid #e2eaf2;
  border-radius: 14px;
  padding: .85rem 1rem 1rem;
}
.dynamic-app .persona-tag {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .16rem .55rem;
  border-radius: 999px;
  margin-bottom: .55rem;
}
.dynamic-app .persona-plain { border-top: 3px solid #2AA6A0; }
.dynamic-app .persona-plain .persona-tag { background: #e8f7f5; color: #146c67; }
.dynamic-app .persona-tech { border-top: 3px solid #3B6FD4; }
.dynamic-app .persona-tech .persona-tag { background: #eaf1fd; color: #1d4ea8; }
.dynamic-app .persona-learn { border-top: 3px solid #B0873A; }
.dynamic-app .persona-learn .persona-tag { background: #fdf6e7; color: #7a5b21; }

.dynamic-app .persona-card p { margin: 0; font-size: .85rem; line-height: 1.6; color: #45596e; }
.dynamic-app .persona-card ul { margin: 0; padding-left: 1.05rem; display: grid; gap: .3rem; }
.dynamic-app .persona-card li { font-size: .82rem; line-height: 1.5; color: #45596e; }
.dynamic-app .glossary { margin: 0; display: grid; gap: .45rem; }
.dynamic-app .glossary-item dt { font-size: .8rem; font-weight: 620; color: #0d1f35; }
.dynamic-app .glossary-item dd { margin: .1rem 0 0; font-size: .78rem; line-height: 1.45; color: #5b6e83; }

/* ================================================================
   Card alignment fix (owner 2026-08-06): photographs are served
   inside a <picture> wrapper. The wrapper - not the <img> - is the
   grid child, so it must carry the media placement, otherwise the
   text drifts below the picture instead of sitting beside it.
   ================================================================ */
.dynamic-app .feed-card > picture,
.dynamic-app .service-section-card > picture {
  grid-area: media;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 210px;
  overflow: hidden;
}
.dynamic-app .feed-card > picture img,
.dynamic-app .service-section-card > picture img {
  width: 100%;
  height: 100%;
  min-height: 210px;
  object-fit: cover;
  display: block;
}

/* Text column starts at the top of the card, beside the picture. */
.dynamic-app .feed-card .feed-head { align-self: start; }
.dynamic-app .feed-card .feed-body { align-self: start; }
.dynamic-app .feed-card .feed-actions { align-self: end; }
.dynamic-app .service-section-card .ssc-body { align-self: start; }

@media (max-width: 760px) {
  .dynamic-app .feed-card > picture,
  .dynamic-app .service-section-card > picture,
  .dynamic-app .feed-card > picture img,
  .dynamic-app .service-section-card > picture img { min-height: 0; height: 190px; }
}

/* What ARRIX does for you + professional boundary notes (2026-08-06) */
.dynamic-app .wedo-panel {
  background: #fff; border: 1px solid #e2eaf2; border-left: 3px solid #2AA6A0;
  border-radius: 14px; padding: .95rem 1.1rem 1.05rem;
}
.dynamic-app .wedo-panel h2 { margin: 0 0 .5rem; font-size: .95rem; }
.dynamic-app .wedo-list { margin: 0; padding-left: 1.05rem; display: grid; gap: .25rem; }
.dynamic-app .wedo-list li { font-size: .84rem; line-height: 1.5; color: #3d5164; }
.dynamic-app .wedo-buy { margin: .7rem 0 0; font-size: .78rem; color: #6d7f93; line-height: 1.5; }
.dynamic-app .wedo-buy a { color: #7a5b21; text-decoration: underline; }
.dynamic-app .boundary-note {
  margin: .75rem 0 0; padding: .55rem .7rem; font-size: .76rem; line-height: 1.5;
  color: #5b4a2a; background: #fdf8ec; border: 1px solid #eadfc2; border-radius: 8px;
}

/* ================================================================
   Home hero, corrected (owner 2026-08-06, second reading).
   The instruction was NOT to split the picture out of the advert
   card. The advert card itself - the column playing services,
   solutions and products - stretches vertically to fill the hero
   frame from top to bottom on the right of the hero column.
   This undoes the earlier two-column split and restores the card
   as it was, then stretches it.
   ================================================================ */

/* 1. Undo the split: the slide is one frame again, picture behind, caption over. */
.dynamic-app .product-hero-slide.is-active {
  display: block;
  grid-template-columns: none;
  grid-template-rows: none;
  min-height: 0;
  background: none;
}
.dynamic-app .product-hero-slide.is-active .product-hero-image,
.dynamic-app .product-hero-slide.is-active picture {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dynamic-app .product-hero-slide.is-active .product-hero-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(6, 23, 47, .10) 0%, rgba(6, 23, 47, .55) 52%, rgba(6, 23, 47, .88) 100%);
  pointer-events: none;
}
.dynamic-app .product-hero-slide.is-active .product-hero-caption {
  position: absolute;
  left: clamp(1rem, 3vw, 2rem);
  right: clamp(1rem, 3vw, 2rem);
  bottom: clamp(1.2rem, 3vw, 2rem);
  z-index: 2;
  display: block;
  max-width: 560px;
  padding: 0;
  background: none;
}

/* 2. The correction asked for: the whole advert card fills the hero
      frame, top to bottom, on the right of the hero column. */
.dynamic-app .dynamic-hero .hero-grid {
  align-items: stretch;
}
.dynamic-app .dynamic-hero .hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.dynamic-app .dynamic-hero .visual-stage,
.dynamic-app .dynamic-hero .product-hero-carousel {
  height: 100%;
  min-height: clamp(480px, 56vh, 660px);
  align-self: stretch;
}

@media (max-width: 860px) {
  .dynamic-app .dynamic-hero .hero-grid { align-items: start; }
  .dynamic-app .dynamic-hero .visual-stage,
  .dynamic-app .dynamic-hero .product-hero-carousel { min-height: 360px; }
}

/* ================================================================
   Navigation bar frozen (owner 2026-08-06): the bar stays fixed at
   the top of the window on every page and never scrolls away. Once
   the visitor scrolls past the contact strip, the bar condenses -
   the contact strip folds up, the bar tightens - so it holds the
   navigation without taking a large slice of the screen.
   ================================================================ */
.dynamic-app .site-header.enterprise-primary-nav {
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  z-index: 1050;
  transition: box-shadow .18s ease, padding .18s ease;
  will-change: transform;
}

/* Condensed state after scrolling past the contact strip. */
.dynamic-app .enterprise-primary-nav .top-utility-bar {
  transition: max-height .22s ease, opacity .18s ease, padding .22s ease;
  max-height: 90px;
  overflow: visible;
}
.dynamic-app .enterprise-primary-nav.is-condensed .top-utility-bar {
  max-height: 0;
  padding-block: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
}
.dynamic-app .enterprise-primary-nav.is-condensed {
  box-shadow: 0 1px 0 rgba(16, 45, 78, .12), 0 10px 30px rgba(6, 23, 47, .10);
  background: rgba(255, 255, 255, .985);
}
.dynamic-app .enterprise-primary-nav.is-condensed .nav-shell { padding-block: .35rem; }

/* Drop-down panels and the assistant must clear the frozen bar. */
.dynamic-app .enterprise-primary-nav .mega-panel { z-index: 1060; }
.dynamic-app .contact-us-panel { z-index: 1400; }

/* Anything else that sticks must sit below the frozen bar. */
.dynamic-app .service-rail { top: 120px; z-index: 40; }
body.nav-frozen .dynamic-app .service-rail,
.dynamic-app.nav-frozen .service-rail { top: 84px; }

/* In-page anchors land below the frozen bar rather than under it. */
.dynamic-app :target { scroll-margin-top: 130px; }
.dynamic-app [id] { scroll-margin-top: 120px; }

@media (max-width: 980px) {
  .dynamic-app .service-rail,
  .dynamic-app.nav-frozen .service-rail { top: auto; }
}

/* ================================================================
   Navigation bar truly fixed (owner 2026-08-06, follow-up).
   Sticky was still travelling with the page on some layouts - the
   body carries overflow-x, which turns it into a scroll container
   and defeats sticky. The bar is now FIXED to the window: it never
   moves, on any page, at any scroll position. The page is offset by
   the bar's measured height so nothing hides beneath it.
   ================================================================ */
.dynamic-app .site-header.enterprise-primary-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1050;
  max-height: 100vh;
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* Offset the page by the bar's full height (measured on load and resize;
   the fallback keeps the layout correct before the script runs). */
body.dynamic-app {
  padding-top: var(--arx-nav-h, 104px);
}

/* The mall and any full-bleed shells keep their own top spacing. */
.dynamic-app .ict-mall-shell-v2 { margin-top: 0; }

/* Sticky panes measure from the fixed bar. */
.dynamic-app .service-rail { top: 18px; }
.dynamic-app :target, .dynamic-app [id] { scroll-margin-top: 24px; }

@media (max-width: 980px) {
  .dynamic-app .service-rail { top: auto; }
}

/* ================================================================
   Local hero advert players (owner 2026-08-06): service areas and
   component pages carry the same playing card as the landing hero,
   stretched down the entire right side of the hero frame.
   ================================================================ */
.dynamic-app .service-hero.dynamic-hero .hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.15fr);
  gap: clamp(1.4rem, 3vw, 3rem);
  align-items: stretch;
}
.dynamic-app .service-hero.dynamic-hero .hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.dynamic-app .service-hero.dynamic-hero .visual-stage,
.dynamic-app .service-hero.dynamic-hero .product-hero-carousel {
  height: 100%;
  min-height: clamp(420px, 48vh, 580px);
  align-self: stretch;
  border-radius: 14px;
  overflow: hidden;
}
.dynamic-app .service-hero .product-hero-caption h2 { font-size: clamp(1.05rem, 1.8vw, 1.35rem); }
.dynamic-app .service-hero .product-hero-caption p { font-size: .86rem; }

@media (max-width: 900px) {
  .dynamic-app .service-hero.dynamic-hero .hero-grid { grid-template-columns: 1fr; align-items: start; }
  .dynamic-app .service-hero.dynamic-hero .visual-stage,
  .dynamic-app .service-hero.dynamic-hero .product-hero-carousel { min-height: 320px; }
}

/* ================================================================
   Continuous advert rail (owner 2026-08-06): a never-stopping loop
   across the home page. Clean cards, company shades on the imagery,
   and an explanation panel that slides up over the picture.
   ================================================================ */
.dynamic-app .advert-rail-section { padding-block: clamp(30px, 4vw, 54px); background: #f2f5f9; }
.dynamic-app .rail-head { text-align: left; margin-bottom: 1.1rem; }
.dynamic-app .rail-head h2 { margin: 0 0 .3rem; }
.dynamic-app .rail-head .lead { margin: 0; font-size: .87rem; color: #52657a; }

.dynamic-app .advert-rail {
  overflow: hidden;
  padding: .4rem 0 1rem;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
}
.dynamic-app .rail-track {
  display: flex;
  gap: 1.1rem;
  width: max-content;
  padding-inline: max(20px, calc((100% - 1440px) / 2));
  animation: arxRail 78s linear infinite;
}
.dynamic-app .advert-rail:hover .rail-track,
.dynamic-app .advert-rail:focus-within .rail-track { animation-play-state: paused; }
@keyframes arxRail { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .dynamic-app .rail-track { animation: none; }
  .dynamic-app .advert-rail { overflow-x: auto; }
}

.dynamic-app .rail-card {
  position: relative;
  flex: 0 0 272px;
  background: #fff;
  border: 1px solid #e4eaf1;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(6,23,47,.05), 0 10px 24px rgba(6,23,47,.06);
  transition: box-shadow .2s ease, transform .2s ease;
}
.dynamic-app .rail-card:hover,
.dynamic-app .rail-card:focus-within { transform: translateY(-4px); box-shadow: 0 18px 42px rgba(6,23,47,.16); }

.dynamic-app .rail-media { position: relative; height: 152px; overflow: hidden; }
.dynamic-app .rail-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Company shades over every picture, so the rail reads as one family. */
.dynamic-app .rail-tint {
  position: absolute; inset: 0;
  background: linear-gradient(155deg, rgba(6,23,47,.62), rgba(23,84,143,.34) 55%, rgba(232,184,75,.22));
  mix-blend-mode: multiply;
}
.dynamic-app .rail-eyebrow {
  position: absolute; left: .6rem; bottom: .55rem;
  font-size: .62rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  color: #E8B84B; background: rgba(6,23,47,.72);
  border: 1px solid rgba(232,184,75,.35); border-radius: 999px; padding: .16rem .5rem;
}
.dynamic-app .rail-body { padding: .7rem .8rem .85rem; }
.dynamic-app .rail-body h3 { margin: 0 0 .22rem; font-size: .86rem; line-height: 1.28; }
.dynamic-app .rail-body p { margin: 0; font-size: .77rem; line-height: 1.45; color: #5b6e83; }

/* The explanation slides up over the card. */
.dynamic-app .rail-reveal {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; gap: .4rem;
  padding: .85rem .85rem .9rem;
  background: linear-gradient(165deg, #06172F, #123a66);
  color: #e8f1fb;
  transform: translateY(101%);
  transition: transform .28s cubic-bezier(.22,.7,.3,1);
}
.dynamic-app .rail-card:hover .rail-reveal,
.dynamic-app .rail-card:focus-within .rail-reveal { transform: translateY(0); }
.dynamic-app .rail-reveal h3 { margin: 0; font-size: .84rem; color: #fff; }
.dynamic-app .rail-reveal ul { margin: 0; padding-left: .95rem; display: grid; gap: .22rem; }
.dynamic-app .rail-reveal li { font-size: .74rem; line-height: 1.42; color: #c9dbee; }
.dynamic-app .rail-cta { margin-top: auto; font-size: .76rem; font-weight: 700; color: #E8B84B; }
.dynamic-app .rail-hit { position: absolute; inset: 0; z-index: 3; }
.dynamic-app .rail-card:hover .rail-cta { text-decoration: underline; }
.dynamic-app .rail-foot { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .3rem; }
@media (prefers-reduced-motion: reduce) { .dynamic-app .rail-reveal { transition: none; } }

/* ================================================================
   Header consolidated and frozen (owner 2026-08-06): CART, Start
   Estimate and Sign In now sit on the same bar as Contact US, and
   that bar no longer folds away - the whole pane is frozen.
   ================================================================ */
.dynamic-app .enterprise-primary-nav .top-utility-bar,
.dynamic-app .enterprise-primary-nav.is-scrolled .top-utility-bar,
.dynamic-app .enterprise-primary-nav.is-condensed .top-utility-bar {
  max-height: none;
  opacity: 1;
  overflow: visible;
  pointer-events: auto;
  padding-block: .3rem;
  background: #f3f6fa;
  border-bottom: 1px solid #e4eaf1;
}
.dynamic-app .enterprise-primary-nav.is-scrolled {
  box-shadow: 0 1px 0 rgba(16,45,78,.12), 0 10px 30px rgba(6,23,47,.10);
}
.dynamic-app .top-utility-inner {
  display: flex; align-items: center; gap: .55rem;
  width: min(1440px, calc(100% - 32px)); margin: 0 auto;
}
.dynamic-app .top-utility-book { margin-left: auto; display: flex; align-items: center; gap: .4rem; }

.dynamic-app .utility-action {
  display: inline-flex; align-items: center; justify-content: center;
  padding: .3rem .8rem; border-radius: 7px;
  font-size: .765rem; font-weight: 600; letter-spacing: .012em;
  border: 1px solid transparent; cursor: pointer; white-space: nowrap;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .1s ease;
}
.dynamic-app .utility-action.primary { background: linear-gradient(135deg, #1878d4, #0f63d6); color: #fff; }
.dynamic-app .utility-action.primary:hover { filter: brightness(1.06); }
.dynamic-app .utility-action.secondary { background: #fff; border-color: #cfdbe8; color: #14273D; }
.dynamic-app .utility-action.ghost,
.dynamic-app .utility-action.quiet { background: transparent; color: #23374d; }
.dynamic-app .utility-action.ghost:hover,
.dynamic-app .utility-action.quiet:hover { color: #0f63d6; }
.dynamic-app .utility-action:active { transform: translateY(1px); }
.dynamic-app .utility-cart { position: relative; }
.dynamic-app .utility-cart > summary { list-style: none; }
.dynamic-app .utility-cart > summary::-webkit-details-marker { display: none; }
.dynamic-app .utility-cart .account-access-panel { right: 0; z-index: 1400; }
.dynamic-app .enterprise-primary-nav .nav-shell { justify-content: flex-start; gap: clamp(.6rem, 2vw, 1.6rem); }

@media (max-width: 900px) {
  .dynamic-app .top-utility-inner { flex-wrap: wrap; row-gap: .3rem; }
  .dynamic-app .top-utility-note, .dynamic-app .top-utility-socials { display: none; }
  .dynamic-app .top-utility-book { margin-left: 0; width: 100%; justify-content: flex-end; }
}

/* ================================================================
   Three columns (owner 2026-08-06): the left rail plus TWO columns
   of cards. Card length reduced so two fit comfortably.
   ================================================================ */
.dynamic-app .service-feed,
.dynamic-app .service-section-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.15rem;
}
.dynamic-app .feed-card,
.dynamic-app .service-section-card {
  grid-template-columns: 1fr;
  grid-template-areas: "media" "head" "body" "actions";
}
.dynamic-app .feed-card > picture,
.dynamic-app .service-section-card > picture,
.dynamic-app .feed-card > picture img,
.dynamic-app .service-section-card > picture img,
.dynamic-app .feed-card .feed-photo,
.dynamic-app .service-section-card .sec-photo {
  min-height: 0;
  height: 148px;
}
.dynamic-app .feed-card .feed-body p { font-size: .78rem; }
.dynamic-app .feed-card .feed-body h3, .dynamic-app .ssc-body h3 { font-size: .88rem; }
.dynamic-app .ssc-list li { font-size: .74rem; }
.dynamic-app .feed-actions .btn { font-size: .73rem; padding: .32rem .6rem; }

@media (max-width: 1240px) {
  .dynamic-app .service-feed,
  .dynamic-app .service-section-grid { grid-template-columns: 1fr; }
}

/* ================================================================
   Type a step down, thinner strokes with stronger definition
   (owner 2026-08-06).
   ================================================================ */
.dynamic-app {
  font-size: 13px;
  line-height: 1.55;
  font-weight: 400;
  color: #16283d;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}
.dynamic-app h1 { font-size: clamp(1.45rem, 2.6vw, 2rem); font-weight: 620; letter-spacing: -.018em; }
.dynamic-app h2 { font-size: clamp(1.05rem, 1.8vw, 1.34rem); font-weight: 600; letter-spacing: -.014em; }
.dynamic-app h3 { font-size: .92rem; font-weight: 600; }
.dynamic-app :is(p, li, dd, td, label) { font-weight: 400; color: #3f5468; }
.dynamic-app .lead { font-size: .9rem; }
.dynamic-app .section.dark :is(p, li, .lead) { color: #cfdcea; }

/* ================================================================
   Card separation, Check Point manner (owner 2026-08-06): a quiet
   page surface, generous gutters, a hairline edge and a lift on
   hover, so every card reads as its own object.
   ================================================================ */
.dynamic-app .section.alt { background: #f2f5f9; }
.dynamic-app :is(.card, .premium-card, .feed-card, .service-section-card, .approach-card,
                 .persona-card, .wedo-panel, .framework-panel, .deliverable-panel,
                 .topic-card, .service-next, .explain-flow, .metric-card) {
  background: #fff;
  border: 1px solid #e4eaf1;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(6, 23, 47, .05), 0 8px 22px rgba(6, 23, 47, .05);
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.dynamic-app :is(.feed-card, .service-section-card, .approach-card, .topic-card):hover {
  border-color: #cfdcea;
  box-shadow: 0 14px 34px rgba(6, 23, 47, .13);
  transform: translateY(-3px);
}
.dynamic-app .service-main { gap: 1.35rem; }
.dynamic-app .approach-grid { gap: .95rem; }
.dynamic-app .topic-grid { gap: .95rem; }
.dynamic-app .persona-set { gap: 1.05rem; }

/* ================================================================
   Left alignment across the site (owner 2026-08-06).
   ================================================================ */
.dynamic-app :is(.section-head, .wrap, .rail-head, .hero-copy, .card, .premium-card,
                 .metric-card, .approach-card, .persona-card, .topic-card) { text-align: left; }
.dynamic-app :is(.section-head, .hero-copy) > :is(h1, h2, h3, p) { margin-inline: 0; }
.dynamic-app .section-head { max-width: 78ch; }
.dynamic-app .actions.button-stack { justify-content: flex-start; }

/* ================================================================
   Navigation right-aligned (owner 2026-08-06).
   ================================================================ */
.dynamic-app .enterprise-primary-nav .nav-shell { justify-content: flex-start; }
.dynamic-app .enterprise-primary-nav .nav-links { margin-left: auto; margin-right: 0; }

/* ================================================================
   Home hero: a playing background, content filling the page.
   ================================================================ */
.dynamic-app .full-hero {
  position: relative;
  isolation: isolate;
  min-height: calc(100vh - var(--arx-nav-h, 104px));
  display: flex;
  align-items: center;
  padding-block: clamp(28px, 4vw, 56px);
  overflow: hidden;
}
.dynamic-app .full-hero > .wrap { position: relative; z-index: 2; width: min(1440px, calc(100% - 40px)); }
.dynamic-app .hero-bg { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.dynamic-app .hero-bg-frame {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: 0;
  animation: arxHeroBg 28s ease-in-out infinite;
  transform: scale(1.04);
  filter: brightness(1.06) saturate(1.08);
}
@keyframes arxHeroBg {
  0%   { opacity: 0; transform: scale(1.04); }
  6%   { opacity: .55; }
  22%  { opacity: .55; }
  30%  { opacity: 0; transform: scale(1.09); }
  100% { opacity: 0; }
}
/* Company wash: navy body, gold warmth at the edges. */
.dynamic-app .hero-bg-wash {
  position: absolute; inset: 0;
  background:
    radial-gradient(120% 80% at 78% 18%, rgba(232,184,75,.24), transparent 58%),
    linear-gradient(105deg, rgba(4,17,36,.94) 0%, rgba(6,23,47,.86) 42%, rgba(10,38,70,.66) 100%);
}
body.a11y-still .dynamic-app .hero-bg-frame,
.dynamic-app.a11y-still .hero-bg-frame { animation: none; opacity: .5; }
@media (prefers-reduced-motion: reduce) { .dynamic-app .hero-bg-frame { animation: none; opacity: .5; } }
@media (max-width: 900px) { .dynamic-app .full-hero { min-height: 0; } }

/* ================================================================
   Sliding cards: larger, further apart, floating above the page,
   with brighter imagery carrying a golden warmth.
   ================================================================ */
.dynamic-app .rail-track { gap: 2rem; }
.dynamic-app .rail-card { flex: 0 0 336px; border-radius: 16px; }
.dynamic-app .rail-media { height: 196px; }
.dynamic-app .rail-media img { filter: brightness(1.12) saturate(1.08) contrast(1.02); }
.dynamic-app .rail-tint {
  background:
    radial-gradient(90% 70% at 78% 82%, rgba(232,184,75,.42), transparent 62%),
    linear-gradient(160deg, rgba(6,23,47,.34), rgba(23,84,143,.20));
  mix-blend-mode: normal;
}
.dynamic-app .rail-body { padding: .9rem 1rem 1.05rem; }
.dynamic-app .rail-body h3 { font-size: .95rem; }
.dynamic-app .rail-body p { font-size: .82rem; }
.dynamic-app .advert-rail { padding: 1.4rem 0 2rem; }
.dynamic-app .advert-rail-section { padding-block: clamp(38px, 4.6vw, 66px); }

/* ================================================================
   Floating cards (owner 2026-08-06): every card lifted off the page
   plane by a layered shadow and a soft rim, with generous air.
   ================================================================ */
.dynamic-app :is(.card, .premium-card, .feed-card, .service-section-card, .approach-card,
                 .persona-card, .wedo-panel, .framework-panel, .deliverable-panel,
                 .topic-card, .service-next, .explain-flow, .metric-card, .rail-card,
                 .market-product-card, .marketplace-card, .product-card) {
  border: 1px solid rgba(214, 225, 236, .9);
  border-radius: 14px;
  background: #fff;
  box-shadow:
    0 1px 1px rgba(6, 23, 47, .04),
    0 4px 10px rgba(6, 23, 47, .05),
    0 18px 34px -12px rgba(6, 23, 47, .18);
}
.dynamic-app :is(.feed-card, .service-section-card, .approach-card, .topic-card,
                 .rail-card, .market-product-card, .marketplace-card, .product-card):hover {
  box-shadow:
    0 2px 2px rgba(6, 23, 47, .05),
    0 8px 18px rgba(6, 23, 47, .08),
    0 34px 60px -18px rgba(6, 23, 47, .28);
  transform: translateY(-5px);
}
.dynamic-app .section.alt, .dynamic-app .advert-rail-section { background: #eef2f7; }

/* Brighter imagery with a golden warmth across card media. */
.dynamic-app :is(.feed-photo, .sec-photo, .cat-media img, .market-product-card img,
                 .marketplace-card img, .product-card img, .sec-hero-photo) {
  filter: brightness(1.1) saturate(1.07) contrast(1.02);
}
.dynamic-app :is(.feed-card, .service-section-card, .market-product-card, .marketplace-card, .product-card) > picture,
.dynamic-app .rail-media { position: relative; }
.dynamic-app :is(.feed-card, .service-section-card) > picture::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(80% 70% at 82% 84%, rgba(232, 184, 75, .26), transparent 64%);
}

/* ================================================================
   Product cards: bigger cards, bigger pictures, more air, and an
   explanation that scrolls itself while the pointer rests on it.
   ================================================================ */
.dynamic-app :is(.market-grid, .marketplace-grid, .product-grid, .ecommerce-grid, .cards-grid) {
  gap: clamp(1.3rem, 2.4vw, 2.1rem);
}
.dynamic-app :is(.market-product-card, .marketplace-card, .product-card) { overflow: hidden; }
.dynamic-app :is(.market-product-card, .marketplace-card, .product-card) :is(img, picture img) {
  height: clamp(180px, 17vw, 240px);
  width: 100%;
  object-fit: cover;
}
.dynamic-app :is(.market-product-card, .marketplace-card, .product-card) :is(p, .market-card-body p) {
  max-height: 5.4em;
  overflow: hidden;
  position: relative;
}
.dynamic-app :is(.market-product-card, .marketplace-card, .product-card):hover :is(p, .market-card-body p),
.dynamic-app :is(.market-product-card, .marketplace-card, .product-card):focus-within :is(p, .market-card-body p) {
  animation: arxCardRead 11s linear .5s infinite alternate;
}
@keyframes arxCardRead {
  0%, 12% { transform: translateY(0); }
  88%, 100% { transform: translateY(calc(-100% + 5.4em)); }
}
body.a11y-still .dynamic-app :is(.market-product-card, .marketplace-card, .product-card) p { animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  .dynamic-app :is(.market-product-card, .marketplace-card, .product-card) p { animation: none !important; }
}

/* ================================================================
   Display settings pane, right side, auto-hiding.
   ================================================================ */
.dynamic-app .a11y-pane { position: fixed; right: 0; top: 42%; z-index: 1250; display: flex; align-items: flex-start; }
.dynamic-app .a11y-tab {
  display: flex; flex-direction: column; align-items: center; gap: .2rem;
  padding: .6rem .42rem; border: 1px solid #dbe4ee; border-right: 0;
  border-radius: 10px 0 0 10px; background: #fff; color: #23374d;
  font-size: .68rem; cursor: pointer; box-shadow: -6px 0 18px rgba(6,23,47,.10);
}
.dynamic-app .a11y-tab:hover { color: #7a5b21; }
.dynamic-app .a11y-tab-label { writing-mode: vertical-rl; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; }
.dynamic-app .a11y-panel {
  width: 210px; padding: .8rem .85rem .9rem;
  background: #fff; border: 1px solid #dbe4ee; border-right: 0; border-radius: 12px 0 0 12px;
  box-shadow: -14px 0 40px rgba(6,23,47,.20);
}
.dynamic-app .a11y-panel h2 { margin: 0 0 .5rem; font-size: .8rem; }
.dynamic-app .a11y-group-label { margin: .55rem 0 .3rem; font-size: .64rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: #7a5b21; }
.dynamic-app .a11y-row { display: flex; gap: .3rem; }
.dynamic-app .a11y-btn {
  flex: 1; padding: .32rem .4rem; font-size: .72rem; font-weight: 600;
  background: #f4f7fb; color: #23374d; border: 1px solid #dde6ef; border-radius: 7px; cursor: pointer;
}
.dynamic-app .a11y-btn.wide { width: 100%; margin-top: .28rem; text-align: left; }
.dynamic-app .a11y-btn:hover { border-color: #B0873A; color: #7a5b21; }
.dynamic-app .a11y-btn.is-on { background: #fdf6e7; border-color: #B0873A; color: #7a5b21; }
.dynamic-app .a11y-btn.clear { background: #fff; color: #96513f; border-color: #ecd3cc; }
.dynamic-app .a11y-note { margin: .55rem 0 0; font-size: .64rem; color: #8a9aab; line-height: 1.4; }

/* What the settings actually do. */
body.a11y-underline .dynamic-app a, body.a11y-underline a { text-decoration: underline !important; }
body.a11y-highlight .dynamic-app main a:not(.btn) { background: #fff4c8 !important; box-shadow: 0 0 0 2px #fff4c8; border-radius: 2px; }
body.a11y-contrast .dynamic-app { color: #05121f; }
body.a11y-contrast .dynamic-app :is(p, li, dd, td, label, .lead) { color: #182a3d; }
body.a11y-greyscale .dynamic-app :is(img, .hero-bg-frame, .rail-media) { filter: grayscale(1) !important; }
body.a11y-still .dynamic-app .rail-track { animation: none !important; }

@media (max-width: 760px) { .dynamic-app .a11y-pane { top: auto; bottom: 96px; } }

/* Commercial terms panels (owner ruling 2026-08-06) */
.dynamic-app .wedo-buy strong { color: #0d1f35; }
.dynamic-app .wedo-avail {
  margin: .5rem 0 0; padding: .45rem .6rem; font-size: .74rem; line-height: 1.5;
  color: #45596e; background: #f4f8fc; border-left: 3px solid #3B6FD4; border-radius: 0 7px 7px 0;
}
.dynamic-app .platform-panel {
  background: #fff; border: 1px solid #e4eaf1; border-left: 3px solid #3B6FD4;
  border-radius: 12px; padding: .9rem 1.05rem 1rem;
  box-shadow: 0 1px 1px rgba(6,23,47,.04), 0 4px 10px rgba(6,23,47,.05), 0 18px 34px -12px rgba(6,23,47,.16);
}
.dynamic-app .platform-panel h2 { margin: 0 0 .5rem; font-size: .95rem; }
.dynamic-app .platform-chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.dynamic-app .platform-chip {
  font-size: .76rem; font-weight: 600; color: #14324f; background: #eef4fb;
  border: 1px solid #d3e0ee; border-radius: 999px; padding: .2rem .68rem;
}
.dynamic-app .platform-chip.is-partner { background: #fdf6e7; border-color: #e6d2a6; color: #7a5b21; }
.dynamic-app .platform-note { margin: .55rem 0 0; font-size: .74rem; color: #7c8da1; line-height: 1.5; }
.dynamic-app .engagement-panel {
  background: #fffdf7; border: 1px solid #eadfc2; border-left: 3px solid #B0873A;
  border-radius: 12px; padding: .9rem 1.05rem 1rem;
}
.dynamic-app .engagement-panel h2 { margin: 0 0 .4rem; font-size: .92rem; color: #5b4a2a; }
.dynamic-app .engagement-panel p { margin: 0; font-size: .79rem; line-height: 1.6; color: #5b4a2a; }

/* ================================================================
   Assistant given a proper portrait (owner 2026-08-06), in the
   manner of the Check Point assistant card.
   ================================================================ */
.dynamic-app .arx-assistant { width: min(414px, calc(100vw - 24px)); }
.dynamic-app .arx-portrait {
  position: relative;
  height: 168px;
  overflow: hidden;
  background: #06172F;
}
.dynamic-app .arx-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; display: block; }
.dynamic-app .arx-portrait-wash {
  position: absolute; inset: 0;
  background:
    radial-gradient(80% 70% at 80% 20%, rgba(232,184,75,.28), transparent 60%),
    linear-gradient(180deg, rgba(6,23,47,.05) 40%, rgba(6,23,47,.82) 100%);
}
.dynamic-app .arx-portrait-name { position: absolute; left: .9rem; bottom: .65rem; z-index: 2; }
.dynamic-app .arx-portrait-name strong { display: block; color: #fff; font-size: 1rem; letter-spacing: -.01em; }
.dynamic-app .arx-portrait-name span { display: block; color: #dbe8f6; font-size: .74rem; }
.dynamic-app .arx-portrait .arx-close {
  position: absolute; top: .5rem; right: .5rem; z-index: 3;
  width: 28px; height: 28px; border-radius: 50%;
  background: rgba(6,23,47,.55); color: #fff; border: 1px solid rgba(255,255,255,.28);
  display: inline-flex; align-items: center; justify-content: center; font-size: 1.05rem; line-height: 1;
}
.dynamic-app .arx-portrait .arx-close:hover { background: rgba(6,23,47,.78); }

.dynamic-app .arx-launcher { padding: .48rem 1.05rem .48rem .48rem; gap: .55rem; font-size: .9rem; }
.dynamic-app .arx-launcher img { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; object-position: center 22%; }

/* ================================================================
   Social handles floating vertically on the right edge.
   ================================================================ */
.dynamic-app .social-rail {
  position: fixed;
  right: 0;
  top: 22%;
  z-index: 1240;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: .3rem .25rem;
  background: rgba(255, 255, 255, .96);
  border: 1px solid #dbe4ee;
  border-right: 0;
  border-radius: 12px 0 0 12px;
  box-shadow: -8px 0 22px rgba(6, 23, 47, .12);
  backdrop-filter: saturate(1.3) blur(6px);
}
.dynamic-app .social-rail-link {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 9px;
  color: #23374d;
  transition: background-color .15s ease, color .15s ease, transform .12s ease;
}
.dynamic-app .social-rail-link:hover { background: #f2f6fb; color: #0f63d6; transform: translateX(-2px); }
.dynamic-app .social-rail-icon svg { width: 17px; height: 17px; }
.dynamic-app .social-rail-name {
  position: absolute; right: calc(100% + 6px); top: 50%; transform: translateY(-50%) translateX(6px);
  white-space: nowrap; font-size: .7rem; font-weight: 600; letter-spacing: .02em;
  color: #fff; background: #0d2440; padding: .2rem .55rem; border-radius: 6px;
  opacity: 0; pointer-events: none; transition: opacity .15s ease, transform .15s ease;
}
.dynamic-app .social-rail-link:hover .social-rail-name,
.dynamic-app .social-rail-link:focus-visible .social-rail-name { opacity: 1; transform: translateY(-50%) translateX(0); }

/* The display tab sits below the handles so the two never overlap. */
.dynamic-app .a11y-pane { top: 56%; }

@media (max-width: 900px) {
  .dynamic-app .social-rail { top: auto; bottom: 150px; }
  .dynamic-app .a11y-pane { top: auto; bottom: 96px; }
}
@media (max-width: 560px) {
  .dynamic-app .social-rail { display: none; }
}

/* ================================================================
   Commodity cards (owner 2026-08-06): the card rests as a picture
   and a title. On hover or keyboard focus the explanation slides up
   over it, scrolling itself if the text runs long - the same motion
   as the advert rail above.
   ================================================================ */
.dynamic-app .reveal-card {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 314px;
  cursor: pointer;
}
.dynamic-app .reveal-card:focus-visible { outline: 2px solid #B0873A; outline-offset: 2px; }
.dynamic-app .reveal-card .card-media,
.dynamic-app .reveal-card > picture { height: 190px; width: 100%; }
.dynamic-app .reveal-card > picture img,
.dynamic-app .reveal-card .card-media { object-fit: cover; height: 190px; width: 100%; display: block; }
.dynamic-app .reveal-card .card-body {
  padding: .85rem 1rem 1rem;
  display: grid; gap: .4rem; align-content: start;
}
.dynamic-app .reveal-card .card-body h3 { margin: 0; font-size: .95rem; line-height: 1.3; }

.dynamic-app .reveal-card .card-reveal {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 100%;
  display: flex; flex-direction: column; gap: .5rem;
  padding: 1rem 1.05rem 1.05rem;
  background: linear-gradient(165deg, #06172F, #123a66);
  color: #e8f1fb;
  transform: translateY(100%);
  transition: transform .3s cubic-bezier(.22,.7,.3,1);
  z-index: 2;
}
.dynamic-app .reveal-card:hover .card-reveal,
.dynamic-app .reveal-card:focus .card-reveal,
.dynamic-app .reveal-card:focus-within .card-reveal { transform: translateY(0); }
.dynamic-app .reveal-card .card-reveal h3 { margin: 0; color: #fff; font-size: .95rem; }
.dynamic-app .reveal-card .card-reveal-inner { overflow: hidden; flex: 1; }
.dynamic-app .reveal-card .card-reveal p {
  margin: .35rem 0 0; font-size: .82rem; line-height: 1.55; color: #cbdcee;
}
.dynamic-app .reveal-card:hover .card-reveal-inner p {
  animation: arxRevealRead 12s linear 1.1s infinite alternate;
}
@keyframes arxRevealRead {
  0%, 10% { transform: translateY(0); }
  90%, 100% { transform: translateY(min(0px, calc(150px - 100%))); }
}
.dynamic-app .reveal-card .card-actions { margin-top: auto; display: flex; gap: .4rem; flex-wrap: wrap; }
.dynamic-app .reveal-card .card-actions .btn {
  background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.5); color: #fff !important;
  font-size: .78rem; padding: .34rem .8rem;
}
.dynamic-app .reveal-card .card-actions .btn:hover { background: rgba(255,255,255,.2); border-color: #fff; }
body.a11y-still .dynamic-app .reveal-card .card-reveal { transition: none; }
body.a11y-still .dynamic-app .reveal-card .card-reveal-inner p { animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  .dynamic-app .reveal-card .card-reveal { transition: none; }
  .dynamic-app .reveal-card .card-reveal-inner p { animation: none !important; }
}
/* Touch devices have no hover: show the explanation in place. */
@media (hover: none) {
  .dynamic-app .reveal-card { min-height: 0; }
  .dynamic-app .reveal-card .card-reveal {
    position: static; transform: none; height: auto;
    background: #fff; color: #3f5468; padding: .2rem 1rem 1rem;
  }
  .dynamic-app .reveal-card .card-reveal h3 { display: none; }
  .dynamic-app .reveal-card .card-reveal p { color: #52657a; }
  .dynamic-app .reveal-card .card-actions .btn {
    background: #fff; border-color: #cfdbe8; color: #14273D !important;
  }
}

/* Ask AI about ARRIX (owner 2026-08-06) */
.dynamic-app .ask-ai { background: #eef2f7; border-top: 1px solid #e0e7ef; padding: 1.6rem 0 1.9rem; }
.dynamic-app .ask-ai-inner { display: grid; gap: .7rem; }
.dynamic-app .ask-ai-lead { margin: 0; font-size: 1rem; color: #45596e; }
.dynamic-app .ask-ai-lead strong { color: #0d1f35; font-weight: 620; }
.dynamic-app .ask-ai-engines { display: flex; flex-wrap: wrap; gap: .5rem; }
.dynamic-app .ask-ai-engine {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .42rem .8rem .42rem .5rem;
  background: #fff; border: 1px solid #dbe4ee; border-radius: 999px;
  color: #23374d; font-size: .8rem; font-weight: 600;
  box-shadow: 0 1px 1px rgba(6,23,47,.04), 0 6px 16px -8px rgba(6,23,47,.22);
  transition: border-color .15s, color .15s, transform .12s, box-shadow .15s;
}
.dynamic-app .ask-ai-engine:hover {
  border-color: #B0873A; color: #7a5b21; transform: translateY(-2px);
  box-shadow: 0 2px 3px rgba(6,23,47,.05), 0 14px 26px -10px rgba(6,23,47,.3);
}
.dynamic-app .ask-ai-mark {
  width: 26px; height: 26px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #0d2440, #17548f);
  color: #E8B84B; font-size: .6rem; font-weight: 800; letter-spacing: .02em;
}
.dynamic-app .ask-ai-note { margin: 0; font-size: .72rem; color: #7c8da1; }

/* ================================================================
   Billing documents (owner order 2026-08-06): invoices and receipts
   that read cleanly on screen and print to a clean PDF.
   ================================================================ */
.dynamic-app .billing-doc {
  background: #fff; border: 1px solid #e0e7ef; border-radius: 14px;
  padding: clamp(1.2rem, 3vw, 2.2rem); max-width: 940px;
  box-shadow: 0 1px 2px rgba(6,23,47,.05), 0 18px 34px -12px rgba(6,23,47,.18);
}
.dynamic-app .doc-head { display: flex; justify-content: space-between; gap: 1.4rem; flex-wrap: wrap; border-bottom: 1px solid #e6ecf3; padding-bottom: 1rem; }
.dynamic-app .doc-logo { width: 132px; height: auto; display: block; margin-bottom: .6rem; filter: brightness(.2) saturate(0); }
.dynamic-app .doc-issuer { margin: 0; font-size: .78rem; line-height: 1.5; color: #52657a; }
.dynamic-app .doc-meta { text-align: right; }
.dynamic-app .doc-meta h1 { margin: 0; font-size: 1.5rem; letter-spacing: -.02em; }
.dynamic-app .doc-number { margin: .1rem 0 .5rem; font-size: .95rem; font-weight: 700; color: #7a5b21; letter-spacing: .04em; }
.dynamic-app .doc-meta p { margin: 0; font-size: .8rem; line-height: 1.6; color: #52657a; }
.dynamic-app .doc-meta span { display: inline-block; min-width: 54px; color: #8a9aab; }
.dynamic-app .doc-status { padding: .1rem .5rem; border-radius: 999px; font-size: .72rem; font-weight: 700; }
.dynamic-app .status-paid { background: #eafaf1; color: #146c47; }
.dynamic-app .status-issued, .dynamic-app .status-active, .dynamic-app .status-trialing { background: #eaf1fd; color: #1d4ea8; }
.dynamic-app .status-part_paid { background: #fdf6e7; color: #7a5b21; }
.dynamic-app .status-overdue, .dynamic-app .status-past_due { background: #fdeceb; color: #96281b; }
.dynamic-app .status-void, .dynamic-app .status-cancelled, .dynamic-app .status-draft { background: #eef2f7; color: #5b6e83; }
.dynamic-app .doc-parties { display: flex; gap: 2.4rem; flex-wrap: wrap; padding: 1rem 0; }
.dynamic-app .doc-label { display: block; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #8a9aab; margin-bottom: .3rem; }
.dynamic-app .doc-parties p { margin: 0; font-size: .84rem; line-height: 1.6; }
.dynamic-app .doc-table { width: 100%; border-collapse: collapse; margin-top: .6rem; }
.dynamic-app .doc-table th { text-align: left; font-size: .7rem; letter-spacing: .07em; text-transform: uppercase; color: #7a5b21; border-bottom: 1px solid #e6ecf3; padding: .5rem .4rem; }
.dynamic-app .doc-table td { padding: .55rem .4rem; font-size: .84rem; border-bottom: 1px solid #f0f4f8; vertical-align: top; }
.dynamic-app .doc-table td span { font-size: .76rem; color: #7c8da1; }
.dynamic-app .doc-table .num, .dynamic-app .doc-table th.num { text-align: right; font-variant-numeric: tabular-nums; }
.dynamic-app .doc-table tfoot td { border-bottom: 0; padding-top: .35rem; }
.dynamic-app .doc-total td { font-weight: 700; border-top: 1px solid #dbe4ee; }
.dynamic-app .doc-balance td { font-weight: 800; color: #0d1f35; font-size: .95rem; border-top: 2px solid #B0873A; }
.dynamic-app .doc-payments { margin-top: 1rem; }
.dynamic-app .doc-payments table { width: 100%; font-size: .8rem; }
.dynamic-app .doc-terms { margin-top: 1.2rem; padding-top: .9rem; border-top: 1px solid #eef2f7; font-size: .8rem; color: #52657a; }
.dynamic-app .doc-note { font-size: .78rem; color: #5b4a2a; background: #fffdf7; border: 1px solid #eadfc2; border-radius: 8px; padding: .5rem .7rem; }
.dynamic-app .doc-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 1.1rem; }
.dynamic-app .receipt-amount { font-size: 2rem; font-weight: 700; color: #146c47; margin: 1rem 0 .4rem; letter-spacing: -.02em; }
.dynamic-app table td.num, .dynamic-app table th.num { text-align: right; font-variant-numeric: tabular-nums; }

@media print {
  .dynamic-app .site-header, .dynamic-app .enterprise-footer, .dynamic-app .ask-ai,
  .dynamic-app .social-rail, .dynamic-app .a11y-pane, .dynamic-app .arx-launcher,
  .dynamic-app .arx-assistant, .dynamic-app .doc-actions, .dynamic-app .mobile-quick-contact { display: none !important; }
  body.dynamic-app { padding-top: 0 !important; background: #fff !important; }
  .dynamic-app .section { padding: 0 !important; background: #fff !important; }
  .dynamic-app .billing-doc { border: 0; box-shadow: none; max-width: 100%; padding: 0; }
}


/* Visually hidden, still read by assistive technology. This utility was used in
   the markup (the carousel status line) but never defined, so the status text
   rendered on screen beside the Pause button and looked wrong whenever the
   carousel advanced. */
.sr-only,
.dynamic-app .sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


/* Owner ruling 2026-08-06: the six navigation buttons all read in capitals, so
   SHOP no longer sits as the odd one out beside CART. Done as a presentation
   rule rather than by rewriting the labels, so the readable wording survives in
   the markup for screen readers, search engines and the menu data. Capitals
   need more tracking than title case or the letters crowd; the small step down
   in size below 1180px keeps six wider words on one line. */
.dynamic-app .nav-section-link,
.dynamic-app .cp-menu > li > a.nav-section-link {
  text-transform: uppercase;
  letter-spacing: 0.055em;
}
@media (max-width: 1180px) {
  .dynamic-app .nav-section-link,
  .dynamic-app .cp-menu > li > a.nav-section-link {
    font-size: 14px;
    letter-spacing: 0.04em;
    padding-left: 10px;
    padding-right: 10px;
  }
}

/* ================================================================
   Drop-down menus restored (2026-08-07).

   Symptom: on the live site none of the eight drop-downs opened -
   the six section menus, the Contact US panel and the Account
   access panel. The scripts were working: the group received
   .is-open, aria-expanded flipped to true, the panel was rendered
   at full size and full opacity. It was simply never painted.

   Cause: when the bar was made position:fixed it was also given
   "max-height: 100vh; overflow-y: auto" so that a tall menu could
   scroll inside the bar on a phone. But a box with overflow on one
   axis computes the other axis to auto as well, so the bar became a
   clipping box. Every panel is absolutely positioned and starts at
   the bar's bottom edge, which means 100% of each panel fell
   outside the bar and was clipped away.

   Fix: the internal scroll is what the phone drawer needs, so it
   stays below 1180px, the width at which the menus fold into the
   drawer and become static children of the bar. Above that width
   the panels are overlays that must escape the bar's box, so the
   clipping is lifted.

   Rule for later: a fixed navigation bar must not carry overflow
   unless every panel it owns is inside its box.
   ================================================================ */
@media (min-width: 1181px) {
  .dynamic-app .site-header.enterprise-primary-nav {
    max-height: none;
    overflow: visible;
  }
}


/* ARX-NAV-LLM-BATCH-2026-08-11 */
.top-utility-bar{background:linear-gradient(90deg,#caa43a,#a9862a);border-bottom:3px solid #0f2440}
.top-utility-bar .top-utility-note,.top-utility-bar .top-utility-note strong{color:#10233f}
.top-utility-bar .utility-link,.top-utility-bar .utility-label{color:#10233f}
.top-utility-bar .utility-action{background:#0f2440;color:#ffffff;border-radius:999px;padding:.45rem 1.15rem;font-weight:700;letter-spacing:.03em;border:1.5px solid #0f2440}
.top-utility-bar .utility-action.ghost,.top-utility-bar .cart-summary{background:transparent;color:#10233f;border:1.5px solid #10233f}
.top-utility-bar .utility-action:hover{background:#ffffff;color:#0f2440;border-color:#0f2440}
.enterprise-primary-nav .nav-links>a,.enterprise-primary-nav .nav-links .nav-group>button{font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#0f2440;padding:1rem 1.05rem;background:none;border:0}
.enterprise-primary-nav .nav-links>a:hover,.enterprise-primary-nav .nav-links .nav-group>button:hover{color:#a9862a}
.llm-search-rail{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;margin:1.6rem auto 0;padding:1.05rem 1.4rem;max-width:1200px;background:#0f2440;border:1.5px solid #b08d2e;border-radius:14px}
.llm-rail-title{color:#fff;font-weight:800;font-size:1.02rem;display:block}
.llm-rail-note{color:#cfd8e6;font-size:.85rem;display:block;margin-top:.15rem}
.llm-rail-buttons{display:flex;flex-wrap:wrap;gap:.55rem}
.llm-btn{background:#b08d2e;color:#0f2440;font-weight:800;font-size:.8rem;letter-spacing:.04em;padding:.5rem 1rem;border-radius:999px;text-decoration:none;display:inline-block}
.llm-btn:hover{background:#ffffff;color:#0f2440}
.llm-rail-compact{max-width:none;margin:1.1rem 0 0;background:rgba(15,36,64,.35);border-color:rgba(176,141,46,.65)}
.llm-utility-panel{display:flex;flex-direction:column;gap:.4rem;min-width:170px}
.llm-utility-panel .llm-btn{text-align:center}

/* ARX-LOGO-LOCKUP-2026-08-11 */
.arx-brand-lockup{display:inline-flex;flex-direction:column;align-items:stretch;text-decoration:none;line-height:1}
.enterprise-primary-nav .brand.arx-brand-lockup img{height:40px;width:auto;display:block}
.arx-brand-words{display:flex;justify-content:space-between;margin-top:3px;width:100%;font-weight:800;font-size:.5rem;letter-spacing:.06em;color:#0f2440}
.arx-brand-words b{font-weight:800}
.enterprise-primary-nav.is-scrolled .brand.arx-brand-lockup img{height:32px}

/* ARX-LOCKUP-V2-2026-08-11 */
.arx-lockup-row{display:flex;align-items:center;gap:.55rem}
.enterprise-primary-nav .brand.arx-brand-lockup img.arx-mark{height:34px;width:34px}
.arx-wordmark{font-size:1.5rem;font-weight:800;letter-spacing:.28em;margin-right:-.28em;color:#0f2440;line-height:1}
.enterprise-primary-nav.is-scrolled .brand.arx-brand-lockup img.arx-mark{height:28px}
.arx-brand-words{font-size:.52rem;letter-spacing:.04em}

/* ARX-CHECKPOINT-STYLE-2026-08-11 */
:root{--arx-navy:#0f2440;--arx-gold:#b0873a;--arx-pulse:#e0175c}
.enterprise-primary-nav .nav-links>a,.enterprise-primary-nav .nav-links .nav-group>button{text-transform:none;font-size:.95rem;font-weight:600;letter-spacing:.01em;color:#1d2a3a;padding:1.05rem .95rem;position:relative}
.enterprise-primary-nav .nav-links>a:hover,.enterprise-primary-nav .nav-links .nav-group>button:hover{color:var(--arx-pulse)}
.enterprise-primary-nav .nav-links>a::after,.enterprise-primary-nav .nav-links .nav-group>button::after{content:"";position:absolute;left:.95rem;right:.95rem;bottom:.5rem;height:3px;background:var(--arx-pulse);opacity:0;transition:opacity .15s ease}
.enterprise-primary-nav .nav-links>a:hover::after,.enterprise-primary-nav .nav-links .nav-group:hover>button::after,.enterprise-primary-nav .nav-links .nav-group>button[aria-expanded="true"]::after{opacity:1}
.mega-panel{background:rgba(255,255,255,.93)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 24px 60px rgba(15,36,64,.18);border-top:3px solid var(--arx-pulse)}
.mega-panel .mega-label{color:var(--arx-pulse);letter-spacing:.1em}
.top-utility-bar .utility-action.primary{background:var(--arx-pulse);border-color:var(--arx-pulse);color:#fff}
.llm-btn:hover{background:var(--arx-pulse);color:#fff}

/* ARX-CHECKPOINT-V2-2026-08-11 */
/* Kill the pseudo-element underline that collided with menu chevrons (the 'diamonds') */
.enterprise-primary-nav .nav-links>a::after,.enterprise-primary-nav .nav-links .nav-group>button::after{content:none!important}
/* Check Point-exact buttons: clean text, red underline only on hover/open */
.dynamic-app .enterprise-primary-nav .nav-links>a,.dynamic-app .enterprise-primary-nav .nav-links .nav-group>button{text-transform:none!important;font-size:.95rem;font-weight:600;letter-spacing:.01em;border:0;border-bottom:3px solid transparent;padding:1.05rem .95rem .8rem;background:none}
.enterprise-primary-nav .nav-links>a:hover,.enterprise-primary-nav .nav-links .nav-group:hover>button,.enterprise-primary-nav .nav-links .nav-group>button[aria-expanded="true"]{border-bottom-color:var(--arx-pulse);color:#1d2a3a}
/* Solid utility bar (replaces the gold gradient) */
.top-utility-bar,.dynamic-header .top-utility-bar{background:#0f2440!important;border-bottom:0}
.top-utility-bar .top-utility-note,.top-utility-bar .top-utility-note strong{color:#ffffff}
.top-utility-bar .utility-link,.top-utility-bar .utility-label{color:#dbe4f0}
.top-utility-bar .utility-action,.top-utility-bar .cart-summary{background:transparent;color:#ffffff;border:1.5px solid rgba(255,255,255,.5);border-radius:999px;padding:.42rem 1.05rem;font-weight:700}
.top-utility-bar .utility-action.primary{background:var(--arx-pulse);border-color:var(--arx-pulse);color:#fff}
.top-utility-bar .utility-action:hover{background:#ffffff;color:#0f2440;border-color:#ffffff}
.utility-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;color:#ffffff;border:1.5px solid rgba(255,255,255,.35);cursor:pointer}
.utility-icon-btn:hover{background:#ffffff;color:#0f2440}
.lang-menu{position:relative}.lang-menu summary{list-style:none}.lang-menu summary::-webkit-details-marker{display:none}
.lang-panel{min-width:150px}.lang-current{font-weight:700;color:#0f2440}

/* ARX-CHECKPOINT-V3-2026-08-11 */
/* Utility bar, Check Point-exact: plain white text links, ONE rectangular CTA */
.top-utility-bar .utility-action,.top-utility-bar .utility-action.ghost,.top-utility-bar .cart-summary{background:transparent;border:0;border-radius:0;color:#ffffff;padding:.35rem .55rem;font-weight:600;letter-spacing:.02em}
.top-utility-bar .utility-action:hover,.top-utility-bar .cart-summary:hover{background:transparent;color:#e8b64c;border:0}
.top-utility-bar .utility-action.primary{background:var(--arx-pulse);border-radius:3px;color:#fff;padding:.45rem 1.05rem;font-weight:700}
.top-utility-bar .utility-action.primary:hover{background:#c11049;color:#fff}
.top-utility-bar .contact-us-trigger{background:transparent!important;border:0!important;color:#ffffff!important;border-radius:0!important;padding:.35rem .55rem!important;font-weight:600}
.top-utility-bar .contact-us-trigger:hover{color:#e8b64c}
.utility-icon-btn{border:0;width:auto;height:auto;padding:.3rem .45rem;border-radius:0;color:#fff}
.utility-icon-btn:hover{background:transparent;color:#e8b64c}
/* MLL ask-cards strip below every hero */
.llm-ask-strip{background:#f2f5f9;padding:1.1rem 1.2rem;border-bottom:1px solid #e2e8f0}
.llm-ask-inner{max-width:1280px;margin:0 auto;display:flex;gap:.8rem;flex-wrap:wrap;justify-content:center}
.llm-card{display:flex;align-items:center;gap:.6rem;background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:.55rem .8rem;text-decoration:none;box-shadow:0 2px 8px rgba(15,36,64,.06);min-width:200px;flex:0 1 auto}
.llm-card:hover{border-color:var(--arx-pulse);box-shadow:0 6px 16px rgba(224,23,92,.14)}
.llm-card-mark{width:34px;height:34px;border-radius:8px;background:#0f2440;color:#fff;font-weight:800;font-size:.75rem;display:flex;align-items:center;justify-content:center;letter-spacing:.03em}
.llm-card-body{display:flex;flex-direction:column;line-height:1.25}
.llm-card-body strong{color:#13253c;font-size:.82rem}
.llm-card-body small{color:#64748b;font-size:.7rem}
.llm-card em{color:var(--arx-pulse);font-style:normal;font-weight:800;font-size:.78rem;margin-left:.2rem}
/* Thin vertical social/contact rail, right edge */
.arx-side-rail{position:fixed;right:0;top:38%;z-index:70;display:flex;flex-direction:column;box-shadow:-4px 4px 14px rgba(12,26,44,.25)}
.side-rail-item{width:44px;height:44px;background:#0f2440;color:#fff;display:flex;align-items:center;justify-content:center;border-bottom:1px solid rgba(255,255,255,.14);text-decoration:none}
.side-rail-item:hover{background:var(--arx-pulse)}
.side-rail-contact{background:#8a1538}
.side-rail-svg{width:18px;height:18px}

/* ARX-CHECKPOINT-V4-2026-08-11 */
/* Kill the oval active-pill; underline only, Check Point-exact */
.dynamic-app .enterprise-primary-nav [aria-current="page"],.dynamic-app .enterprise-primary-nav .nav-links>a[aria-current]{background:none!important;box-shadow:none!important;border-radius:0!important}
.dynamic-app .enterprise-primary-nav .nav-links>a[aria-current="page"]{border-bottom-color:var(--arx-pulse)}
.dynamic-app .enterprise-primary-nav .nav-links>a:hover,.dynamic-app .enterprise-primary-nav .nav-links .nav-group:hover>button{border-bottom-color:var(--arx-pulse);color:#1d2a3a}
/* MLL cards: full-bleed row, edge to edge like the hero */
.llm-ask-strip{padding:.9rem 12px}
.llm-ask-inner{max-width:none;justify-content:space-between;flex-wrap:nowrap}
.llm-card{flex:1 1 0;min-width:0}
.llm-card-body strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:900px){.llm-ask-inner{flex-wrap:wrap}.llm-card{flex:1 1 45%}}
/* Social placeholders: visible, dimmed until real URLs land */
.side-rail-pending{opacity:.55;cursor:default}
.side-rail-pending:hover{background:#1d3a5f;opacity:.8}
/* Sidebar mirroring the top nav */
.arx-sidebar{position:fixed;left:0;top:30%;z-index:80}
.arx-sidebar-toggle{width:40px;height:40px;background:#0f2440;border:0;border-radius:0 8px 8px 0;cursor:pointer;display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center}
.arx-sidebar-toggle span{width:16px;height:2px;background:#fff;display:block}
.arx-sidebar-panel{display:none;position:absolute;left:0;top:44px;width:280px;max-height:60vh;overflow:auto;background:#0f2440;color:#e8eef7;border-radius:0 10px 10px 0;padding:.7rem;box-shadow:6px 8px 24px rgba(12,26,44,.35)}
.arx-sidebar.is-open .arx-sidebar-panel{display:block}
.arx-sidebar-panel details{border-bottom:1px solid rgba(255,255,255,.12)}
.arx-sidebar-panel summary{cursor:pointer;padding:.5rem .3rem;font-weight:700;letter-spacing:.02em;list-style:none}
.arx-sidebar-panel summary::-webkit-details-marker{display:none}
.arx-sn-links{display:flex;flex-direction:column;padding:.2rem .3rem .6rem}
.arx-sn-links a{color:#cfd9e8;text-decoration:none;font-size:.8rem;padding:.18rem 0}
.arx-sn-links a:hover{color:#fff}
.arx-sn-links .arx-sn-all{color:var(--arx-gold);font-weight:700}
.arx-sn-col{color:var(--arx-pulse);font-size:.66rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;margin-top:.45rem}
.llm-card-svg{width:20px;height:20px}.llm-card-mark{background:#0f2440}
/* ARX-SIDE-RAIL-VISIBILITY-2026-08-12 */
.arx-side-rail{top:32%;border-left:3px solid var(--arx-gold);box-shadow:-6px 6px 20px rgba(12,26,44,.4)}
.side-rail-item{width:50px;height:50px;background:#14305a}
.side-rail-item:hover{background:var(--arx-pulse)}
.side-rail-svg{width:22px;height:22px}
.side-rail-pending{opacity:1;cursor:default}
.side-rail-pending .side-rail-svg{opacity:.95}
.side-rail-contact{background:#a11b47}


/* ============================================================
   ARX-PREMIUM-V1-2026-08-12 · owner design-polish brief:
   distinct premium varying Arrix blue as dominant signature,
   controlled red accents, checkpoint-grade card typography,
   depth (gradients/glows) + elegant enterprise motion.
   ============================================================ */
.dynamic-app{--arx-abyss:#060D24;--arx-deep:#0A1836;--arx-royal:#12266B;--arx-cobalt:#1D4FD7;--arx-azure:#3D77F2;--arx-ice:#AFC9FF;--arx-pulse-deep:#A61045;--arx-pulse-bright:#FF4D85}

/* --- below-hero Ask-AI band: deep varying blue, glass cards --- */
.dynamic-app .llm-ask-strip{position:relative;overflow:hidden;background:radial-gradient(760px 300px at 85% -40%,rgba(61,119,242,.38),transparent 65%),radial-gradient(520px 260px at 8% 130%,rgba(224,23,92,.15),transparent 60%),linear-gradient(112deg,var(--arx-abyss) 0%,var(--arx-deep) 46%,var(--arx-royal) 100%);border-top:1px solid rgba(61,119,242,.28);border-bottom:1px solid rgba(61,119,242,.34);padding:1rem 12px}
.dynamic-app .llm-ask-strip::before{content:"";position:absolute;inset:0;background-image:radial-gradient(1.6px 1.6px at 11% 28%,rgba(175,201,255,.85),transparent 55%),radial-gradient(1.2px 1.2px at 26% 70%,rgba(255,255,255,.6),transparent 55%),radial-gradient(1.8px 1.8px at 41% 22%,rgba(122,164,255,.75),transparent 55%),radial-gradient(1.1px 1.1px at 57% 64%,rgba(255,255,255,.5),transparent 55%),radial-gradient(1.7px 1.7px at 71% 30%,rgba(175,201,255,.8),transparent 55%),radial-gradient(1.2px 1.2px at 86% 68%,rgba(255,77,133,.55),transparent 55%),radial-gradient(1.5px 1.5px at 94% 24%,rgba(122,164,255,.7),transparent 55%);animation:arxTwinkle 6.5s ease-in-out infinite alternate;pointer-events:none}
.dynamic-app .llm-ask-strip::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-45%;width:36%;background:linear-gradient(100deg,transparent 0%,rgba(61,119,242,.20) 42%,rgba(175,201,255,.28) 52%,rgba(224,23,92,.12) 62%,transparent 100%);transform:skewX(-16deg);animation:arxTrail 12.5s linear infinite;pointer-events:none}
.dynamic-app .llm-ambient{position:absolute;inset:0;pointer-events:none;opacity:.55;z-index:1}
.dynamic-app .llm-ambient svg{width:100%;height:100%;display:block}
.dynamic-app .llm-ambient .arx-graph-line{fill:none;stroke:url(#arxGraphGrad);stroke-width:1.5;stroke-dasharray:640;stroke-dashoffset:640;animation:arxGraphDraw 9s linear infinite}
.dynamic-app .llm-ambient .arx-dot{fill:#AFC9FF;opacity:0;animation:arxDotFlow 5.6s linear infinite}
.dynamic-app .llm-ambient .arx-dot.d2{fill:#3D77F2;animation-delay:1.9s}
.dynamic-app .llm-ambient .arx-dot.d3{fill:#FF4D85;animation-delay:3.7s}
.dynamic-app .llm-ask-inner{position:relative;z-index:2;gap:.85rem}
.dynamic-app .llm-card{background:linear-gradient(158deg,rgba(255,255,255,.11),rgba(255,255,255,.035) 62%,rgba(61,119,242,.10));border:1px solid rgba(150,180,255,.30);border-radius:12px;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);box-shadow:0 10px 26px rgba(3,9,28,.38);transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background .24s ease}
.dynamic-app .llm-card:hover{transform:translateY(-3px);border-color:rgba(122,164,255,.75);box-shadow:0 16px 36px rgba(29,79,215,.42);background:linear-gradient(158deg,rgba(255,255,255,.15),rgba(255,255,255,.05) 62%,rgba(61,119,242,.16))}
.dynamic-app .llm-card-mark{background:linear-gradient(150deg,var(--arx-cobalt) 0%,var(--arx-royal) 78%);box-shadow:inset 0 0 0 1px rgba(175,201,255,.35),0 4px 12px rgba(6,13,36,.5)}
.dynamic-app .llm-card-body strong{color:#fff;font-weight:600}
.dynamic-app .llm-card-body small{color:var(--arx-ice)}
.dynamic-app .llm-card em{color:var(--arx-pulse-bright)}

/* --- checkpoint-grade section + card typography --- */
.dynamic-app .section-head h2{font-size:clamp(1.22rem,1.72vw,1.88rem);font-weight:700;letter-spacing:-.012em;line-height:1.18}
.dynamic-app .section-head .lead{font-size:.98rem}
.dynamic-app .eyebrow{font-size:.69rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--arx-cobalt)}
.dynamic-app .dark .eyebrow{color:var(--arx-ice)}
.dynamic-app .media-card{position:relative;overflow:hidden;border-radius:12px;border:1px solid rgba(18,38,107,.12);box-shadow:0 14px 38px rgba(9,22,58,.10)}
.dynamic-app .media-card::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--arx-cobalt) 0%,var(--arx-azure) 55%,var(--arx-pulse) 100%);opacity:0;transition:opacity .25s ease;pointer-events:none;z-index:3}
.dynamic-app .media-card:hover::after,.dynamic-app .media-card:focus-within::after,.dynamic-app .media-card:focus::after{opacity:1}
.dynamic-app .media-card:hover{border-color:rgba(29,79,215,.45);box-shadow:0 20px 48px rgba(18,44,120,.20)}
.dynamic-app .media-card .card-body h3{font-size:.99rem;font-weight:600;letter-spacing:-.006em;line-height:1.28}
.dynamic-app .media-card .card-reveal-inner h3{font-size:.99rem;font-weight:600}
.dynamic-app .media-card .card-reveal-inner p{font-size:.85rem;line-height:1.55}
.dynamic-app .media-card .badge.orange{background:rgba(29,79,215,.10);color:#16368F;font-weight:600;letter-spacing:.02em}

/* --- depth: richer section backgrounds, hero glow, blue motion --- */
.dynamic-app .section.alt{background:linear-gradient(180deg,#F8FAFF 0%,#EEF3FC 100%)}
.dynamic-app .section.dark{background:radial-gradient(1100px 520px at 84% -12%,rgba(29,79,215,.35),transparent 62%),radial-gradient(700px 380px at 6% 112%,rgba(224,23,92,.10),transparent 58%),linear-gradient(118deg,#0B1D4A 0%,var(--arx-deep) 44%,var(--arx-abyss) 100%);border-bottom:1px solid rgba(61,119,242,.22)}
.dynamic-app .hero.dynamic-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(880px 400px at 83% 16%,rgba(61,119,242,.24),transparent 62%),radial-gradient(560px 300px at 10% 88%,rgba(224,23,92,.10),transparent 58%);pointer-events:none}
.dynamic-app .motion-grid{background-image:linear-gradient(rgba(61,119,242,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(61,119,242,.12) 1px,transparent 1px)}
.dynamic-app .data-stream{background:linear-gradient(90deg,transparent,rgba(61,119,242,.95),rgba(255,77,133,.8),transparent);filter:drop-shadow(0 0 12px rgba(61,119,242,.6))}

/* --- motion, always reduced-motion safe --- */
@keyframes arxTwinkle{0%{opacity:.28}50%{opacity:.62}100%{opacity:.34}}
@keyframes arxTrail{0%{left:-45%}100%{left:118%}}
@keyframes arxGraphDraw{0%{stroke-dashoffset:640;opacity:0}8%{opacity:.85}70%{opacity:.85}100%{stroke-dashoffset:0;opacity:0}}
@keyframes arxDotFlow{0%{transform:translateX(0);opacity:0}8%{opacity:.9}86%{opacity:.9}100%{transform:translateX(1100px);opacity:0}}
@media (prefers-reduced-motion:reduce){.dynamic-app .llm-ask-strip::before,.dynamic-app .llm-ask-strip::after,.dynamic-app .llm-ambient .arx-graph-line,.dynamic-app .llm-ambient .arx-dot{animation:none}.dynamic-app .llm-ask-strip::after{display:none}.dynamic-app .llm-ambient .arx-graph-line{stroke-dashoffset:0;opacity:.55}.dynamic-app .llm-ambient .arx-dot{opacity:.45}}