@font-face {
  font-family: Manrope;
  src: url("/fonts/Manrope.ttf") format("truetype");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}
:root {
  --graphite: #25282d;
  --accent: #2c6554;
  --accent-hover: #204d40;
  --paper: #fdfdfc;
  --ink: #25282d;
  --muted: #656a72;
  --line: #e0e2e5;
  --soft: #f3f4f5;
  --white: #fff;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 110px;
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Manrope, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
a {
  color: inherit;
  text-decoration: none;
}
button,
input,
select {
  font: inherit;
}
button,
a,
input,
select {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
}
img {
  display: block;
  max-width: 100%;
  height: auto;
}
h1,
h2,
h3,
p {
  margin: 0;
}
h1,
h2,
h3 {
  line-height: 1.2;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 5px;
}
button:disabled {
  opacity: 0.55;
  cursor: default;
}
::selection {
  background: #dbe9e3;
  color: var(--ink);
}
.container {
  width: min(1280px, calc(100% - 96px));
  margin-inline: auto;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: fixed;
  top: 10px;
  left: 16px;
  background: var(--graphite);
  color: white;
  padding: 12px 24px;
  z-index: 100;
  opacity: 0;
  pointer-events: none;
}
.skip-link:focus {
  opacity: 1;
  pointer-events: auto;
}
.topbar {
  background: #f1f2f3;
  color: var(--muted);
  font-size: 10px;
  letter-spacing: 0.3px;
}
.topbar-inner {
  height: 33px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.topbar b {
  padding: 0 11px;
  color: #92969d;
}
.site-header {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  position: relative;
  z-index: 20;
}
.header-inner {
  height: 96px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font-size: 23px;
  letter-spacing: -1px;
  line-height: 1.05;
  font-weight: 800;
  flex-shrink: 0;
}
.brand-light {
  font-weight: 500;
}
.brand small {
  font-size: 8px;
  font-weight: 500;
  display: block;
  letter-spacing: 2.1px;
  margin-top: 8px;
}
.brand-mark {
  display: flex;
  position: relative;
  width: 43px;
  height: 44px;
  align-items: center;
  justify-content: center;
  font-size: 23px;
  font-weight: 650;
  letter-spacing: -1.8px;
  border: 1.7px solid var(--accent);
  border-radius: 11px;
  color: var(--accent);
}
.brand-mark > span {
  font-size: 13px;
  position: absolute;
  background: var(--paper);
  top: -4px;
  right: -5px;
  line-height: 1;
}
.main-nav {
  display: flex;
  align-items: center;
  gap: 28px;
  font-size: 12px;
  font-weight: 650;
}
.main-nav a {
  padding: 9px 0;
  position: relative;
  white-space: nowrap;
}
.main-nav a:after {
  content: "";
  position: absolute;
  bottom: 1px;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--accent);
  transition: width 0.2s;
}
.main-nav a:hover:after,
.main-nav a[aria-current]:after {
  width: 100%;
}
.header-cta {
  display: flex;
  align-items: center;
  gap: 11px;
  white-space: nowrap;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 11px 15px;
  font-size: 11px;
  font-weight: 700;
}
.header-cta:hover {
  background: var(--soft);
}
svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
}
.header-cta svg,
.search-form svg {
  width: 19px;
  height: 19px;
  flex-shrink: 0;
}
.menu-toggle {
  display: none;
}
.hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 38px;
  padding-block: 45px 38px;
}
.hero-copy {
  padding: 29px 0 12px;
}
.eyebrow {
  font-size: 9px;
  font-weight: 750;
  letter-spacing: 1.9px;
  display: flex;
  align-items: center;
  gap: 9px;
  line-height: 1.6;
  color: var(--muted);
}
.status-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 100%;
  background: var(--accent);
  flex-shrink: 0;
}
.hero h1 {
  font-size: clamp(48px, 4.75vw, 69px);
  font-weight: 600;
  letter-spacing: -3.6px;
  line-height: 1.075;
  margin-top: 23px;
  color: var(--ink);
}
.hero h1 span {
  color: #707680;
}
.hero-description {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.85;
  margin-top: 23px;
}
.hero-actions {
  display: flex;
  gap: 10px;
  margin-top: 27px;
  flex-wrap: wrap;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 25px;
  border-radius: 7px;
  padding: 15px 23px;
  line-height: 1.5;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid transparent;
  min-height: 49px;
  transition:
    background 0.2s,
    transform 0.2s;
}
.button span {
  font-size: 19px;
  line-height: 1;
  font-weight: 400;
}
.button:hover {
  transform: translateY(-2px);
}
.button-primary {
  color: #fff;
  background: var(--accent);
}
.button-primary:hover {
  background: var(--accent-hover);
}
.button-outline {
  border-color: #d1d4d8;
  color: var(--graphite);
  background: transparent;
}
.button-outline:hover {
  background: var(--soft);
}
.button-light {
  color: var(--ink);
  background: var(--white);
}
.button-light:hover {
  background: #e9eaec;
}
.hero-footnote {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 10px;
  line-height: 1.6;
  color: #6e6f71;
  margin-top: 26px;
}
.round-check {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 100%;
  color: var(--accent);
  font-size: 13px;
  flex-shrink: 0;
}
.hero-visual {
  background: radial-gradient(ellipse at 70% 24%, #fff 0%, #f0f1f3 52%, #e9eaed 100%);
  border-radius: 14px;
  min-height: 526px;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.visual-label,
.visual-number,
.visual-bottom {
  position: absolute;
  z-index: 2;
  font-size: 8px;
  letter-spacing: 1.7px;
  color: #6f7072;
  font-weight: 600;
}
.visual-label {
  top: 27px;
  left: 28px;
}
.visual-number {
  top: 27px;
  right: 25px;
}
.visual-bottom {
  bottom: 22px;
  right: 25px;
  font-size: 7px;
}
.visual-orbit {
  position: absolute;
  width: 440px;
  height: 440px;
  border: 1px solid #d6d7d9;
  border-radius: 50%;
  top: 45px;
  left: 90px;
  z-index: -1;
}
.orbit-two {
  width: 350px;
  height: 350px;
  top: 90px;
  left: 135px;
}
.hero-device {
  position: absolute;
  width: 107%;
  height: 100%;
  object-fit: contain;
  max-width: none;
  top: -20px;
  left: 1%;
}
.visual-caption {
  position: absolute;
  left: 24px;
  bottom: 32px;
  display: flex;
  gap: 13px;
  align-items: center;
  background: #ffffffed;
  padding: 15px 19px;
  border: 1px solid #fff;
  border-radius: 8px;
  box-shadow: 0 9px 30px #25282d12;
}
.visual-cross {
  font-size: 29px;
  color: var(--accent);
}
.visual-caption strong {
  font-size: 11px;
  font-weight: 650;
  line-height: 1.5;
  display: block;
}
.visual-caption div > span {
  display: block;
  font-size: 8px;
  margin-top: 6px;
  color: #848587;
}
.benefits {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding-block: 25px;
  gap: 20px;
}
.benefits > div {
  display: flex;
  gap: 13px;
  align-items: center;
  padding-left: 24px;
  border-left: 1px solid var(--line);
}
.benefits > div:first-child {
  border: 0;
  padding-left: 0;
}
.benefit-icon {
  font-size: 26px;
  font-weight: 400;
  line-height: 1;
  color: #68696b;
  min-width: 25px;
}
.benefits p {
  font-size: 10px;
}
.benefits strong,
.benefits p span {
  display: block;
}
.benefits strong {
  font-weight: 700;
  color: #434446;
}
.benefits p span {
  margin-top: 4px;
  color: #6e6f71;
  font-size: 9px;
}
.section {
  padding-block: 59px 0;
}
.section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 25px;
  margin-bottom: 25px;
}
.section-heading h2,
.quick-search h2 {
  font-size: 29px;
  font-weight: 600;
  letter-spacing: -1px;
  margin-top: 9px;
}
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 23px;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 700;
  color: var(--graphite);
}
.text-link span {
  font-size: 18px;
  line-height: 1;
}
.text-link:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.device-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 13px;
}
.device-card {
  background: #f5f5f6;
  border: 1px solid #e9eaec;
  border-radius: 9px;
  padding: 12px 17px 17px;
  transition:
    background 0.2s,
    transform 0.2s;
}
.device-card:hover {
  background: #edeef0;
  transform: translateY(-4px);
}
.device-card img {
  width: 100%;
  height: 127px;
  object-fit: contain;
  mix-blend-mode: normal;
  margin: 0 auto 10px;
}
.device-card > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.device-card h3 {
  font-size: 13px;
  font-weight: 650;
  letter-spacing: -0.3px;
}
.device-card div > span {
  font-size: 17px;
  color: #8c8d8f;
}
.quick-search {
  display: grid;
  grid-template-columns: 1fr 1.45fr;
  align-items: center;
  gap: 30px;
  margin-top: 32px;
  padding: 24px 30px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--white);
}
.quick-search .eyebrow {
  font-size: 8px;
}
.quick-search h2 {
  font-size: 21px;
  letter-spacing: -0.5px;
  margin-top: 4px;
}
.search-form {
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid #dcdddf;
  border-radius: 7px;
  padding: 6px 7px 6px 17px;
  background: white;
}
.search-form input {
  border: 0;
  min-width: 0;
  flex: 1;
  outline: 0;
  padding: 10px 0;
  font-size: 11px;
  color: var(--graphite);
  background: transparent;
}
.search-form:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px #2c655421;
}
.search-form input:focus-visible {
  outline: 0;
}
.search-form input::placeholder {
  color: #959698;
}
.search-form svg {
  color: #8d8e90;
}
.search-form button {
  border: 0;
  border-radius: 5px;
  background: var(--graphite);
  color: #fff;
  width: 40px;
  height: 39px;
  flex-shrink: 0;
  font-size: 23px;
}
.product-grid {
  display: grid;
  gap: 20px;
}
.featured-grid {
  grid-template-columns: repeat(4, 1fr);
}
.product-card {
  min-width: 0;
}
.product-image {
  display: block;
  position: relative;
  background: #f2f3f4;
  border: 1px solid #e8eaec;
  border-radius: 9px;
  overflow: hidden;
}
.product-image img {
  width: 100%;
  aspect-ratio: 1.28;
  object-fit: contain;
  padding: 24px 14px 15px;
  mix-blend-mode: normal;
  transition: transform 0.3s;
}
.product-image:hover img {
  transform: scale(1.06);
}
.product-tag {
  position: absolute;
  left: 13px;
  top: 13px;
  background: #fff;
  color: #565d67;
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 8px;
  font-weight: 650;
  z-index: 1;
  border: 1px solid #e1e3e6;
}
.product-image-arrow {
  position: absolute;
  bottom: 12px;
  right: 12px;
  background: #fafbfd;
  border: 1px solid #e7e8ea;
  border-radius: 100%;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  color: #666769;
  font-size: 16px;
}
.product-info {
  padding-top: 13px;
}
.product-meta {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 8px;
  color: #6e6f71;
}
.product-meta span:last-child {
  font-size: 7px;
  white-space: nowrap;
}
.product-info h3 {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  margin-top: 7px;
  min-height: 36px;
}
.product-info h3 a:hover {
  color: var(--accent);
}
.product-quality {
  color: #6e6f71;
  font-size: 9px;
  margin-top: 5px;
}
.product-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
}
.product-bottom strong {
  font-size: 20px;
  letter-spacing: -0.6px;
  font-weight: 650;
  white-space: nowrap;
}
.product-bottom strong span {
  font-size: 16px;
  font-weight: 500;
}
.stock {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 8px;
  color: var(--accent);
}
.stock i {
  width: 4px;
  height: 4px;
  background: var(--accent);
  border-radius: 50%;
  flex-shrink: 0;
}
.stock.out {
  color: #8c8d8f;
}
.stock.out i {
  background: #aeafb1;
}
.product-details {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 11px;
  border-top: 1px solid var(--line);
  padding-top: 10px;
  font-size: 9px;
  color: #68696b;
}
.product-details:hover {
  color: #333436;
}
.product-details span {
  font-size: 16px;
}
.demo-caption {
  font-size: 10px;
  color: #6e6f71;
  line-height: 1.7;
  margin-top: 20px;
}
.service-banner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  background: var(--graphite);
  color: #f9fafb;
  margin-top: 59px;
  border-radius: 12px;
  overflow: hidden;
  min-height: 395px;
}
.service-art {
  position: relative;
  background: #e9eaed;
}
.service-art img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  max-height: 425px;
}
.service-art-label {
  position: absolute;
  bottom: 22px;
  left: 27px;
  font-size: 7px;
  letter-spacing: 2px;
  color: var(--muted);
}
.service-copy {
  padding: 47px 39px 45px 22px;
}
.service-copy .eyebrow {
  color: #c3c7ce;
  font-size: 8px;
  letter-spacing: 1.5px;
}
.service-copy .status-dot {
  background: #9bb5a8;
}
.service-copy h2 {
  font-size: 43px;
  font-weight: 500;
  letter-spacing: -1.5px;
  line-height: 1.15;
  margin: 18px 0;
}
.service-copy > p:not(.eyebrow) {
  color: #c6cad1;
  font-size: 11px;
  max-width: 335px;
  line-height: 1.9;
}
.service-chips {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin: 22px 0 26px;
}
.service-chips span {
  font-size: 8px;
  padding: 4px 9px;
  border: 1px solid #53575e;
  border-radius: 4px;
  color: #d7dae0;
}
.service-copy .button {
  min-height: 44px;
  padding: 11px 19px;
}
.business-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding-bottom: 56px;
}
.business-banner h2 {
  font-size: 29px;
  line-height: 1.35;
  letter-spacing: -1px;
  font-weight: 500;
  margin-top: 14px;
}
.business-banner p:last-child {
  color: var(--muted);
  font-size: 12px;
  margin-top: 15px;
}
.site-footer {
  border-top: 1px solid var(--line);
  background: #f3f4f5;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.35fr 0.85fr 1fr 1.15fr;
  gap: 35px;
  padding-block: 46px 37px;
}
.footer-brand {
  font-size: 21px;
}
.footer-brand .brand-mark {
  background: #f3f4f5;
  width: 37px;
  height: 38px;
  font-size: 20px;
}
.footer-brand .brand-mark > span {
  background: #f3f4f5;
}
.footer-grid > div:first-child p {
  font-size: 12px;
  color: #6e6f71;
  line-height: 1.8;
  margin-top: 17px;
}
.footer-grid h2 {
  font-size: 11px;
  font-weight: 750;
  margin: 4px 0 16px;
}
.footer-grid > div:not(:first-child):not(:last-child) > a {
  display: block;
  font-size: 10px;
  margin-top: 8px;
  color: #6e6f71;
}
.footer-grid > div > a:hover {
  color: var(--accent);
}
.mini-label {
  font-size: 8px;
  letter-spacing: 1.4px;
  font-weight: 700;
  color: #898a8c;
}
.footer-note p {
  font-size: 17px;
  line-height: 1.5;
  letter-spacing: -0.4px;
  margin: 14px 0;
}
.footer-note .text-link {
  font-size: 9px;
}
.footer-bottom {
  border-top: 1px solid #dfe0e2;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding-top: 18px;
  color: #6e6f71;
  font-size: 9px;
}
.trademark-note {
  font-size: 8px;
  color: #6e6f71;
  padding: 12px 0 24px;
}
.page-content {
  padding-bottom: 70px;
}
.breadcrumbs {
  display: flex;
  align-items: center;
  gap: 13px;
  margin: 29px 0 35px;
  font-size: 10px;
  color: #6e6f71;
  flex-wrap: wrap;
}
.breadcrumbs a:hover {
  color: var(--graphite);
}
.breadcrumbs span:nth-child(even) {
  color: #bfc0c2;
}
.page-heading {
  margin-bottom: 35px;
}
.page-heading h1 {
  font-size: 49px;
  font-weight: 550;
  letter-spacing: -2px;
  line-height: 1.15;
  margin-top: 14px;
  max-width: 870px;
}
.heading-dot {
  color: var(--accent);
}
.page-heading > p:last-child {
  font-size: 13px;
  color: #6e6f71;
  max-width: 650px;
  margin-top: 20px;
  line-height: 1.9;
}
.category-tabs {
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
  margin: 25px 0 30px;
}
.category-tabs a {
  display: block;
  padding: 11px 19px;
  font-size: 11px;
  border: 1px solid #dedfe1;
  border-radius: 6px;
  transition: background 0.2s;
}
.category-tabs a:hover {
  background: #ebecee;
}
.category-tabs a.active {
  background: var(--graphite);
  color: #fff;
  border-color: var(--graphite);
}
.catalog-layout {
  display: grid;
  grid-template-columns: 223px 1fr;
  gap: 34px;
  align-items: start;
}
.catalog-sidebar {
  background: #f5f5f6;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 22px 20px;
}
.filter-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 23px;
  gap: 10px;
}
.filter-heading h2 {
  font-size: 13px;
  font-weight: 700;
}
.filter-heading a {
  font-size: 9px;
  color: #7c7d7f;
  text-decoration: underline;
}
.catalog-sidebar > label {
  display: block;
  font-size: 10px;
  font-weight: 650;
  margin: 17px 0 7px;
}
.catalog-sidebar select {
  width: 100%;
  border: 1px solid #d9dadc;
  border-radius: 5px;
  background: #fafbfd;
  padding: 11px 9px;
  font-size: 10px;
  color: #515254;
}
.catalog-sidebar .checkbox-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  font-weight: 500;
  margin: 22px 0;
}
.checkbox-label input {
  margin: 0;
  accent-color: var(--graphite);
  width: 15px;
  height: 15px;
}
.filter-apply {
  width: 100%;
  padding: 12px 10px;
  gap: 15px;
  font-size: 10px;
  min-height: 42px;
}
.filter-help {
  border-top: 1px solid #e0e1e3;
  margin-top: 27px;
  padding-top: 25px;
}
.filter-help > span {
  font-size: 28px;
  color: #969799;
}
.filter-help h3 {
  font-size: 13px;
  font-weight: 650;
  margin-top: 9px;
}
.filter-help p {
  font-size: 10px;
  color: #6e6f71;
  margin: 9px 0 18px;
  line-height: 1.8;
}
.filter-help .text-link {
  font-size: 9px;
}
.catalog-main {
  min-width: 0;
}
.catalog-search {
  margin-bottom: 20px;
}
.results-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  margin-bottom: 23px;
}
.results-toolbar > p {
  font-size: 12px;
  font-weight: 650;
}
.results-toolbar > p > span {
  background: #e9eaec;
  padding: 2px 6px;
  font-size: 9px;
  border-radius: 4px;
  margin-left: 7px;
}
.results-toolbar > div {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  color: #6e6f71;
}
.results-toolbar select {
  border: 0;
  color: #535456;
  background: transparent;
  max-width: 170px;
  font-size: 10px;
  padding: 5px;
}
.sort-apply {
  background: #eff0f2;
  border: 1px solid #dfe0e2;
  border-radius: 3px;
  font-size: 8px;
  padding: 3px 5px;
  color: var(--graphite);
}
.catalog-products {
  grid-template-columns: repeat(3, 1fr);
  gap: 27px 20px;
}
.catalog-products .product-bottom strong {
  font-size: 18px;
}
.catalog-products .product-image img {
  aspect-ratio: 1.22;
}
.pagination {
  display: flex;
  gap: 7px;
  margin-top: 35px;
}
.pagination a {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid #dbdcde;
  border-radius: 5px;
  font-size: 11px;
}
.pagination a.active {
  background: var(--graphite);
  color: #fff;
}
.empty-state {
  background: #f2f3f5;
  padding: 60px 20px;
  text-align: center;
  border-radius: 9px;
}
.empty-state > span {
  font-size: 48px;
  line-height: 1;
  color: #8e8f91;
}
.empty-state h2 {
  font-size: 24px;
  margin-top: 15px;
  font-weight: 500;
  letter-spacing: -0.5px;
}
.empty-state p {
  font-size: 12px;
  color: #6e6f71;
  margin: 14px 0 25px;
}
.product-detail {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start;
}
.detail-visual {
  position: relative;
  border-radius: 12px;
  background: #f2f3f4;
  border: 1px solid var(--line);
  min-height: 435px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.detail-visual img {
  width: 100%;
  padding: 45px 30px;
  mix-blend-mode: normal;
}
.detail-visual-note {
  position: absolute;
  bottom: 19px;
  color: #6e6f71;
  font-size: 9px;
  left: 24px;
}
.detail-copy {
  padding-top: 12px;
}
.detail-copy h1 {
  font-size: 35px;
  font-weight: 550;
  letter-spacing: -1.5px;
  line-height: 1.3;
  margin: 15px 0;
}
.detail-quality {
  color: #6e6f71;
  font-size: 12px;
  margin-bottom: 12px;
}
.detail-copy .stock {
  font-size: 10px;
}
.detail-price {
  font-size: 35px;
  line-height: 1.4;
  letter-spacing: -1px;
  margin: 21px 0;
  font-weight: 650;
}
.detail-price > span {
  font-size: 26px;
  font-weight: 500;
}
.detail-price small {
  display: block;
  font-size: 9px;
  letter-spacing: 0;
  font-weight: 400;
  color: #6e6f71;
}
.detail-copy > p:not(.eyebrow):not(.detail-quality) {
  font-size: 11px;
  color: #6e6f71;
  line-height: 1.9;
}
.detail-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 24px;
}
.detail-actions .button {
  padding: 12px 17px;
  font-size: 10px;
  gap: 18px;
}
.copy-status {
  min-height: 26px;
  padding-top: 5px;
}
.detail-specs {
  max-width: 690px;
  margin-top: 55px;
}
.detail-specs h2 {
  font-size: 25px;
  letter-spacing: -0.7px;
  font-weight: 550;
}
.detail-specs dl {
  margin-top: 25px;
}
.detail-specs dl > div {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 15px 0;
  border-bottom: 1px solid #e3e4e6;
  font-size: 12px;
}
.detail-specs dt {
  color: #6e6f71;
}
.detail-specs dd {
  margin: 0;
  text-align: right;
}
.repair-hero {
  display: grid;
  grid-template-columns: 1fr 0.9fr;
  align-items: center;
  gap: 30px;
}
.repair-hero h1 {
  font-size: 58px;
  font-weight: 550;
  letter-spacing: -2.4px;
  line-height: 1.12;
  margin-top: 20px;
}
.repair-hero h1 span {
  color: #707680;
}
.repair-hero p:not(.eyebrow) {
  font-size: 12px;
  color: #6e6f71;
  line-height: 1.9;
  margin: 24px 0;
}
.repair-hero > img {
  border-radius: 13px;
  background: #e9eaed;
  width: 100%;
  max-height: 390px;
  object-fit: contain;
}
.repair-options {
  padding-top: 60px;
}
.repair-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 25px;
}
.repair-card {
  background: #f5f5f6;
  border: 1px solid var(--line);
  padding: 25px;
  border-radius: 9px;
  display: flex;
  flex-direction: column;
}
.repair-card h3 {
  font-size: 18px;
  letter-spacing: -0.4px;
  font-weight: 600;
  margin: 13px 0;
}
.repair-card > p {
  font-size: 11px;
  color: #6e6f71;
  line-height: 1.8;
  margin-bottom: 23px;
  flex: 1;
}
.repair-card > div {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.repair-card strong {
  font-size: 18px;
  letter-spacing: -0.5px;
  white-space: nowrap;
}
.repair-card div > span {
  font-size: 8px;
  color: #6e6f71;
  text-align: right;
}
.repair-card .text-link {
  font-size: 10px;
  border-top: 1px solid #e0e1e3;
  padding-top: 15px;
  justify-content: space-between;
}
.repair-process {
  padding-top: 60px;
}
.repair-process h2 {
  font-size: 30px;
  letter-spacing: -1px;
  font-weight: 550;
  margin-top: 10px;
}
.repair-process ol {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 35px;
  margin-top: 30px;
}
.repair-process li {
  border-top: 1px solid #dddee0;
  padding-top: 15px;
}
.repair-process li > span {
  font-size: 12px;
  color: #a4a5a7;
}
.repair-process h3 {
  font-size: 15px;
  font-weight: 600;
  margin: 15px 0 10px;
}
.repair-process li > p {
  font-size: 11px;
  color: #6e6f71;
  line-height: 1.8;
}
.selection-notice {
  margin-top: 35px;
  background: #eef0f3;
  padding: 15px 23px;
  border-radius: 6px;
  font-size: 11px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.selection-notice a {
  font-weight: 650;
}
.info-page {
  min-height: 70vh;
}
.info-page .page-heading {
  margin-top: 45px;
}
.info-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin: 40px 0;
}
.info-card {
  border-top: 1px solid #dfe0e2;
  padding-top: 24px;
}
.info-number {
  color: #a3a4a6;
  font-size: 13px;
}
.info-card h2 {
  font-size: 21px;
  font-weight: 600;
  letter-spacing: -0.7px;
  margin: 22px 0 18px;
}
.info-card p {
  font-size: 12px;
  line-height: 1.9;
  color: #6e6f71;
}
.info-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 40px;
}
.error-page {
  padding-block: 110px;
  min-height: 60vh;
}
.error-page h1 {
  font-size: 48px;
  letter-spacing: -2px;
  font-weight: 550;
  margin-top: 20px;
}
.error-page > p:not(.eyebrow) {
  font-size: 14px;
  color: #6e6f71;
  margin: 20px 0 30px;
}
@media (min-width: 1550px) {
  .hero h1 {
    font-size: 73px;
  }
  .hero-visual {
    min-height: 555px;
  }
  .hero-copy {
    padding-top: 37px;
  }
  .hero-description {
    font-size: 15px;
  }
  .hero-actions {
    margin-top: 30px;
  }
}
@media (max-width: 1150px) {
  .container {
    width: calc(100% - 64px);
  }
  .main-nav {
    gap: 18px;
    font-size: 11px;
  }
  .header-inner {
    gap: 20px;
  }
  .header-cta {
    padding: 10px;
    font-size: 10px;
  }
  .hero {
    gap: 25px;
  }
  .hero h1 {
    font-size: 54px;
    letter-spacing: -2.8px;
  }
  .hero-visual {
    min-height: 500px;
  }
  .hero-copy {
    padding-top: 22px;
  }
  .hero-actions .button {
    padding-inline: 17px;
    gap: 17px;
  }
  .benefits > div {
    padding-left: 14px;
    gap: 9px;
  }
  .benefits strong {
    font-size: 9px;
  }
  .benefits p span {
    font-size: 8px;
  }
  .device-card {
    padding: 10px 12px 14px;
  }
  .device-card img {
    height: 110px;
  }
  .device-card h3 {
    font-size: 11px;
  }
  .catalog-layout {
    grid-template-columns: 205px 1fr;
    gap: 23px;
  }
  .catalog-products {
    gap: 24px 14px;
  }
  .catalog-products .product-bottom {
    align-items: flex-start;
    gap: 4px;
    flex-direction: column;
  }
  .catalog-products .product-info h3 {
    font-size: 11px;
  }
  .service-copy {
    padding-left: 15px;
    padding-right: 24px;
  }
  .service-copy h2 {
    font-size: 39px;
  }
  .product-detail {
    gap: 40px;
  }
  .detail-copy h1 {
    font-size: 30px;
  }
}
@media (max-width: 1000px) {
  .header-inner {
    height: 83px;
  }
  .main-nav {
    display: none;
    position: absolute;
    top: 83px;
    left: 0;
    right: 0;
    background: var(--paper);
    border-bottom: 1px solid #e0e1e3;
    padding: 22px 32px;
    box-shadow: 0 15px 20px #33343610;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .main-nav.is-open {
    display: flex;
  }
  .menu-toggle {
    display: flex;
    flex-direction: column;
    gap: 6px;
    order: 3;
    background: transparent;
    border: 1px solid var(--line);
    width: 39px;
    height: 39px;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    flex-shrink: 0;
  }
  .menu-toggle span {
    height: 1px;
    width: 17px;
    background: var(--graphite);
    transition: transform 0.2s;
  }
  .menu-toggle[aria-expanded="true"] span:first-child {
    transform: translateY(3.5px) rotate(45deg);
  }
  .menu-toggle[aria-expanded="true"] span:last-child {
    transform: translateY(-3.5px) rotate(-45deg);
  }
  .header-cta {
    margin-left: auto;
  }
  .hero {
    gap: 20px;
  }
  .hero h1 {
    font-size: 48px;
    letter-spacing: -2.5px;
  }
  .hero-description {
    font-size: 12px;
  }
  .hero .eyebrow {
    font-size: 7px;
    letter-spacing: 1.3px;
  }
  .hero-actions .button {
    padding: 12px 15px;
    font-size: 9px;
    min-height: 44px;
    gap: 10px;
  }
  .hero-visual {
    min-height: 459px;
  }
  .visual-orbit {
    left: 20px;
  }
  .orbit-two {
    left: 65px;
  }
  .visual-caption {
    left: 17px;
    bottom: 35px;
    padding: 12px;
    gap: 9px;
  }
  .visual-caption strong {
    font-size: 9px;
  }
  .visual-label {
    left: 19px;
    font-size: 6px;
  }
  .visual-number {
    font-size: 6px;
    right: 18px;
  }
  .benefits {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 20px;
  }
  .benefits > div {
    padding-left: 0;
    border: 0;
  }
  .benefits > div:nth-child(even) {
    border-left: 1px solid var(--line);
    padding-left: 25px;
  }
  .benefits strong {
    font-size: 11px;
  }
  .benefits p span {
    font-size: 10px;
  }
  .device-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
  }
  .device-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
  }
  .device-card img {
    width: 75px;
    height: 85px;
    margin: 0;
  }
  .device-card > div {
    flex: 1;
    gap: 6px;
  }
  .device-card h3 {
    font-size: 11px;
  }
  .featured-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 28px 20px;
  }
  .product-info h3 {
    font-size: 14px;
    min-height: 0;
  }
  .product-bottom strong {
    font-size: 23px;
  }
  .product-image img {
    aspect-ratio: 1.4;
  }
  .product-meta {
    font-size: 9px;
  }
  .product-quality {
    font-size: 10px;
  }
  .stock {
    font-size: 9px;
  }
  .product-details {
    font-size: 10px;
  }
  .service-banner {
    gap: 12px;
    min-height: 365px;
  }
  .service-copy {
    padding: 35px 20px 35px 10px;
  }
  .service-copy .eyebrow {
    font-size: 6px;
  }
  .service-copy h2 {
    font-size: 34px;
  }
  .service-copy > p:not(.eyebrow) {
    font-size: 10px;
  }
  .service-chips {
    gap: 5px;
  }
  .service-chips span {
    font-size: 7px;
  }
  .footer-grid {
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 25px;
  }
  .footer-note {
    grid-column: 1/-1;
    border-top: 1px solid #e0e1e3;
    padding-top: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
  }
  .footer-note p {
    font-size: 13px;
    margin: 0;
  }
  .footer-note .mini-label {
    font-size: 7px;
    max-width: 120px;
  }
  .catalog-layout {
    grid-template-columns: 195px 1fr;
    gap: 23px;
  }
  .catalog-sidebar {
    padding: 20px 15px;
  }
  .catalog-products {
    grid-template-columns: repeat(2, 1fr);
  }
  .page-heading h1 {
    font-size: 43px;
  }
  .repair-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .repair-hero h1 {
    font-size: 47px;
  }
  .repair-hero > img {
    min-height: 320px;
  }
  .repair-card h3 {
    font-size: 18px;
  }
  .info-card h2 {
    font-size: 19px;
  }
  .product-detail {
    gap: 30px;
  }
  .detail-visual {
    min-height: 390px;
  }
  .detail-visual img {
    padding: 35px 12px;
  }
  .detail-copy h1 {
    font-size: 26px;
  }
  .detail-copy .eyebrow {
    font-size: 7px;
  }
}
@media (max-width: 700px) {
  html {
    scroll-padding-top: 25px;
  }
  .container {
    width: calc(100% - 36px);
  }
  .topbar-inner {
    height: 29px;
    font-size: 8px;
  }
  .topbar-inner > span:last-child {
    display: none;
  }
  .header-inner {
    height: 77px;
    gap: 13px;
  }
  .brand {
    font-size: 21px;
    gap: 9px;
  }
  .brand small {
    font-size: 6px;
    letter-spacing: 1.9px;
    margin-top: 6px;
  }
  .brand-mark {
    width: 37px;
    height: 38px;
    font-size: 21px;
    border-radius: 9px;
  }
  .header-cta {
    font-size: 0;
    gap: 0;
    width: 37px;
    height: 37px;
    justify-content: center;
    padding: 0;
    border: 0;
  }
  .header-cta svg {
    width: 20px;
    height: 20px;
  }
  .menu-toggle {
    width: 37px;
    height: 37px;
  }
  .main-nav {
    top: 77px;
    padding: 16px 22px 23px;
    font-size: 13px;
  }
  .hero {
    display: flex;
    flex-direction: column;
    gap: 25px;
    padding-block: 30px;
  }
  .hero-copy {
    padding: 0 3px;
  }
  .hero .eyebrow {
    font-size: 8px;
    letter-spacing: 1.4px;
  }
  .hero h1 {
    font-size: clamp(42px, 10.9vw, 67px);
    line-height: 1.06;
    margin-top: 22px;
    letter-spacing: -2.7px;
  }
  .hero-description {
    font-size: 13px;
    margin-top: 23px;
  }
  .hero-actions {
    gap: 8px;
    margin-top: 24px;
  }
  .hero-actions .button {
    font-size: 10px;
    padding: 13px 16px;
    gap: 13px;
    min-height: 47px;
  }
  .hero-footnote {
    font-size: 9px;
    margin-top: 22px;
  }
  .hero-visual {
    min-height: 390px;
  }
  .hero-device {
    width: 100%;
    height: 108%;
    left: 3%;
    top: -36px;
  }
  .visual-label {
    top: 20px;
    left: 21px;
    font-size: 7px;
  }
  .visual-number {
    top: 20px;
    right: 20px;
    font-size: 7px;
  }
  .visual-orbit {
    width: 320px;
    height: 320px;
    top: 32px;
    left: calc(50% - 160px);
  }
  .orbit-two {
    width: 250px;
    height: 250px;
    top: 67px;
    left: calc(50% - 125px);
  }
  .visual-caption {
    bottom: 29px;
    left: 17px;
    padding: 11px 14px;
  }
  .visual-caption strong {
    font-size: 10px;
  }
  .visual-bottom {
    bottom: 12px;
    font-size: 6px;
  }
  .benefits {
    padding-block: 21px;
    gap: 23px 15px;
  }
  .benefits > div {
    gap: 10px;
  }
  .benefits > div:nth-child(even) {
    padding-left: 14px;
  }
  .benefit-icon {
    font-size: 23px;
    min-width: 20px;
  }
  .benefits strong {
    font-size: 9px;
  }
  .benefits p span {
    font-size: 8px;
  }
  .section {
    padding-top: 39px;
  }
  .section-heading {
    gap: 15px;
    align-items: flex-start;
    margin-bottom: 20px;
  }
  .section-heading .eyebrow {
    font-size: 7px;
    letter-spacing: 1.3px;
    max-width: 245px;
  }
  .section-heading h2 {
    font-size: 25px;
    letter-spacing: -0.9px;
    max-width: 290px;
  }
  .section-heading .text-link {
    font-size: 9px;
    gap: 8px;
    margin-top: 24px;
  }
  .section-heading .text-link span {
    font-size: 15px;
  }
  .device-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }
  .device-card {
    display: block;
    padding: 8px 9px 12px;
  }
  .device-card img {
    width: 100%;
    height: 85px;
  }
  .device-card h3 {
    font-size: 10px;
    letter-spacing: -0.3px;
  }
  .device-card > div > span {
    font-size: 13px;
  }
  .quick-search {
    grid-template-columns: 1fr;
    gap: 17px;
    padding: 21px;
    margin-top: 22px;
  }
  .quick-search h2 {
    font-size: 22px;
  }
  .search-form {
    padding-left: 12px;
    gap: 10px;
  }
  .search-form input {
    font-size: 10px;
  }
  .quick-search .search-form {
    margin-inline: -7px;
  }
  .featured-grid {
    gap: 25px 12px;
  }
  .product-image img {
    padding: 20px 5px 10px;
    aspect-ratio: 1.05;
  }
  .product-tag {
    font-size: 6px;
    left: 8px;
    top: 8px;
    padding: 3px 6px;
  }
  .product-image-arrow {
    width: 23px;
    height: 23px;
    font-size: 13px;
    bottom: 9px;
    right: 8px;
  }
  .product-meta {
    font-size: 7px;
    gap: 3px;
    flex-wrap: wrap;
  }
  .product-meta span:last-child {
    font-size: 6px;
  }
  .product-info {
    padding-top: 10px;
  }
  .product-info h3 {
    font-size: 11px;
    line-height: 1.55;
    min-height: 34px;
    margin-top: 5px;
  }
  .product-quality {
    font-size: 8px;
    margin-top: 4px;
    min-height: 25px;
  }
  .product-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    margin-top: 8px;
  }
  .product-bottom strong {
    font-size: 20px;
  }
  .product-bottom strong span {
    font-size: 15px;
  }
  .stock {
    font-size: 8px;
  }
  .product-details {
    font-size: 8px;
    margin-top: 9px;
    padding-top: 9px;
  }
  .demo-caption {
    font-size: 9px;
    margin-top: 17px;
  }
  .service-banner {
    grid-template-columns: 1fr;
    margin-top: 39px;
    gap: 0;
  }
  .service-art {
    max-height: 260px;
  }
  .service-art img {
    height: 260px;
  }
  .service-art-label {
    bottom: 18px;
    left: 20px;
    font-size: 6px;
  }
  .service-copy {
    padding: 30px 25px;
  }
  .service-copy .eyebrow {
    font-size: 7px;
  }
  .service-copy h2 {
    font-size: 39px;
    letter-spacing: -1.3px;
    margin-block: 15px;
  }
  .service-copy > p:not(.eyebrow) {
    font-size: 12px;
    max-width: 100%;
  }
  .service-chips span {
    font-size: 8px;
  }
  .service-copy .button {
    padding: 13px 20px;
    font-size: 10px;
  }
  .business-banner {
    align-items: flex-start;
    flex-direction: column;
    gap: 24px;
    padding-block: 39px;
  }
  .business-banner .eyebrow {
    font-size: 7px;
    letter-spacing: 1.4px;
  }
  .business-banner h2 {
    font-size: 26px;
    line-height: 1.3;
    letter-spacing: -0.8px;
    margin-top: 12px;
  }
  .business-banner p:last-child {
    font-size: 11px;
  }
  .business-banner .button {
    font-size: 10px;
    padding: 12px 20px;
    min-height: 44px;
  }
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    padding: 30px 0;
  }
  .footer-grid > div:first-child {
    grid-column: 1/-1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
  }
  .footer-grid > div:first-child p {
    font-size: 9px;
    margin: 0;
    line-height: 1.7;
  }
  .footer-brand {
    font-size: 20px;
  }
  .footer-grid h2 {
    font-size: 12px;
    margin-bottom: 15px;
  }
  .footer-grid > div:not(:first-child):not(:last-child) > a {
    font-size: 11px;
    margin-top: 11px;
  }
  .footer-note {
    flex-wrap: wrap;
    gap: 15px;
    padding-top: 25px;
  }
  .footer-note .mini-label {
    font-size: 6px;
    max-width: 100px;
  }
  .footer-note .text-link {
    font-size: 8px;
    gap: 12px;
  }
  .footer-note p {
    font-size: 12px;
  }
  .footer-bottom {
    flex-direction: column;
    gap: 10px;
    font-size: 8px;
  }
  .trademark-note {
    font-size: 7px;
    line-height: 1.8;
    padding-bottom: 24px;
  }
  .breadcrumbs {
    margin: 24px 0 27px;
    font-size: 9px;
    gap: 10px;
  }
  .page-heading h1 {
    font-size: 37px;
    letter-spacing: -1.5px;
    margin-top: 12px;
  }
  .page-heading .eyebrow {
    font-size: 8px;
  }
  .page-heading > p:last-child {
    font-size: 12px;
    margin-top: 17px;
  }
  .category-tabs {
    gap: 7px;
    margin: 22px 0;
  }
  .category-tabs a {
    font-size: 10px;
    padding: 9px 13px;
  }
  .catalog-layout {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .catalog-sidebar {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px 12px;
    padding: 18px;
  }
  .filter-heading {
    grid-column: 1/-1;
    margin-bottom: 5px;
  }
  .catalog-sidebar > label {
    grid-column: 1/-1;
    margin: 8px 0 0;
  }
  .catalog-sidebar > select {
    grid-column: 1/-1;
    font-size: 12px;
    min-height: 42px;
  }
  .catalog-sidebar .checkbox-label {
    margin: 12px 0;
    font-size: 11px;
  }
  .filter-apply {
    grid-column: 1/-1;
    min-height: 44px;
    font-size: 11px;
  }
  .filter-help {
    display: none;
  }
  .catalog-search {
    margin-bottom: 17px;
  }
  .catalog-search input {
    font-size: 12px;
  }
  .results-toolbar {
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 19px;
  }
  .results-toolbar > p {
    font-size: 11px;
  }
  .results-toolbar > div {
    font-size: 9px;
  }
  .results-toolbar select {
    max-width: 145px;
    font-size: 9px;
  }
  .catalog-products {
    gap: 26px 12px;
  }
  .catalog-products .product-image img {
    aspect-ratio: 1.1;
  }
  .catalog-products .product-bottom strong {
    font-size: 20px;
  }
  .catalog-products .product-info h3 {
    font-size: 11px;
  }
  .catalog-products .product-bottom {
    gap: 6px;
  }
  .page-content {
    padding-bottom: 40px;
  }
  .product-detail {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .detail-visual {
    min-height: 310px;
  }
  .detail-visual img {
    max-height: 320px;
    padding: 25px 40px;
  }
  .detail-copy {
    padding-top: 0;
  }
  .detail-copy h1 {
    font-size: 32px;
    letter-spacing: -1.2px;
  }
  .detail-copy .eyebrow {
    font-size: 8px;
  }
  .detail-quality {
    font-size: 12px;
  }
  .detail-copy > p:not(.eyebrow):not(.detail-quality) {
    font-size: 12px;
  }
  .detail-actions {
    gap: 8px;
  }
  .detail-actions .button {
    font-size: 10px;
    padding: 13px 17px;
    gap: 13px;
  }
  .detail-specs {
    margin-top: 35px;
  }
  .detail-specs dl > div {
    font-size: 11px;
    gap: 16px;
  }
  .repair-hero {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .repair-hero h1 {
    font-size: 48px;
    letter-spacing: -2px;
    margin-top: 15px;
  }
  .repair-hero p:not(.eyebrow) {
    font-size: 12px;
    margin: 21px 0;
  }
  .repair-hero .eyebrow {
    font-size: 8px;
  }
  .repair-hero > img {
    min-height: 0;
    max-height: 300px;
  }
  .repair-options {
    padding-top: 35px;
  }
  .repair-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .repair-card {
    padding: 23px;
  }
  .repair-card h3 {
    font-size: 20px;
  }
  .repair-card > p {
    font-size: 12px;
    margin-bottom: 18px;
  }
  .repair-card strong {
    font-size: 20px;
  }
  .repair-card div > span {
    font-size: 10px;
  }
  .repair-card .text-link {
    font-size: 11px;
  }
  .repair-process {
    padding-top: 40px;
  }
  .repair-process ol {
    grid-template-columns: 1fr;
    gap: 23px;
  }
  .repair-process h3 {
    font-size: 18px;
  }
  .repair-process li > p {
    font-size: 12px;
  }
  .repair-process .eyebrow {
    font-size: 8px;
  }
  .selection-notice {
    font-size: 10px;
    padding: 15px 18px;
    gap: 9px;
  }
  .info-page .page-heading {
    margin-top: 30px;
  }
  .info-grid {
    grid-template-columns: 1fr;
    gap: 27px;
    margin-top: 30px;
  }
  .info-card {
    padding-top: 19px;
  }
  .info-card h2 {
    font-size: 24px;
    margin: 15px 0;
  }
  .info-card p {
    font-size: 13px;
  }
  .info-actions {
    margin-top: 27px;
  }
  .info-actions .button {
    font-size: 10px;
    gap: 15px;
    padding: 13px 16px;
  }
  .error-page {
    padding-block: 80px;
  }
  .error-page h1 {
    font-size: 38px;
    letter-spacing: -1.5px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *:before,
  *:after {
    transition: none !important;
    animation: none !important;
  }
}

/* Live assortment: neutral navigation and readable long supplier names. */
.part-shortcuts { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 28px; }
.part-shortcuts a { padding:9px 14px; border:1px solid #dfe2e5; border-radius:24px; font-size:13px; background:#fff; color:#4b525a; }
.part-shortcuts a:hover,.part-shortcuts a.active { background:#252a2e; border-color:#252a2e; color:#fff; }
.catalog-update { color:#737982; font-size:12px; line-height:1.7; margin-top:18px; }
.illustration-label { position:absolute; bottom:12px; left:16px; color:#7a8087; font-size:10px; letter-spacing:.04em; }
.product-info h3 { min-height:4.5em; }
.product-meta span { overflow-wrap:anywhere; }
.product-meta span:last-child { max-width:42%; }
.pagination { flex-wrap:wrap; align-items:center; }
@media(max-width:600px) { .part-shortcuts { gap:6px; flex-wrap:nowrap; overflow-x:auto; padding-bottom:8px; } .part-shortcuts a { padding:8px 11px; font-size:12px; white-space:nowrap; } }

/* Model → part folder → products. Keep the folder surface neutral. */
.model-folders-heading { margin: 8px 0 24px; }
.model-folders-heading h2 { font-size: clamp(23px, 2.3vw, 31px); font-weight: 500; letter-spacing: -.035em; margin: 0 0 8px; }
.model-folders-heading p { color: #737982; font-size: 14px; margin: 0; }
.folders-back { display: inline-block; margin-bottom: 20px; font-size: 13px; color: #616770; }
.folders-back:hover { color: #252a2e; text-decoration: underline; }
.part-folders { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.part-folder { position: relative; display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 24px; min-height: 175px; border: 1px solid #e1e3e6; border-radius: 12px; background: #f7f7f8; transition: background .18s, border-color .18s; }
.part-folder:hover { background: #fff; border-color: #8e949b; }
.part-folder:focus-visible { outline: 2px solid #2f6556; outline-offset: 4px; }
.folder-icon { width: 46px; height: 40px; margin-bottom: 22px; stroke: #737982; stroke-width: 1.5; fill: #e9ebed; }
.folder-name { font-size: 16px; font-weight: 500; line-height: 1.35; padding-right: 14px; overflow-wrap: anywhere; }
.folder-count { margin-top: 8px; color: #737982; font-size: 12px; }
.folder-arrow { position: absolute; right: 20px; top: 24px; color: #878d95; font-size: 21px; }
@media (max-width: 1150px) { .part-folders { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .part-folders { gap: 10px; } .part-folder { padding: 18px 14px; min-height: 162px; } .folder-name { font-size: 14px; } .folder-arrow { right: 13px; top: 17px; } .model-folders-heading { margin-top: 4px; } }

/* Cart and checkout: the same quiet graphite palette as the catalog. */
.cart-link { display:flex; gap:8px; align-items:center; font-size:13px; white-space:nowrap; }
.cart-link span { background:#f0f1f2; border-radius:20px; padding:3px 8px; }
.cart-notice { padding-block:16px; font-size:14px; }
.cart-notice a { margin-left:15px; text-decoration:underline; }
.cart-add-button { width:100%; margin-top:16px; min-height:42px; padding:10px 16px; }
button:disabled { opacity:.5; cursor:not-allowed; }
.commerce-grid { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:40px; align-items:start; }
.cart-row { display:flex; gap:20px; align-items:start; padding:24px 0; border-bottom:1px solid #e1e3e6; }
.cart-row:first-child { padding-top:0; }
.cart-row img { background:#f3f4f5; border-radius:12px; object-fit:contain; flex-shrink:0; }
.cart-row-copy { flex:1; min-width:0; }
.cart-row h2 { font-size:16px; line-height:1.5; margin:0 0 8px; }
.cart-row-copy p { font-size:12px; color:#707680; margin:0 0 14px; }
.cart-row-price { text-align:right; white-space:nowrap; }
.cart-row-price small { display:block; font-size:11px; color:#707680; margin-top:6px; }
.cart-controls { display:flex; gap:16px; flex-wrap:wrap; align-items:end; }
.cart-controls form { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.cart-controls label { width:100%; font-size:11px; }
.cart-controls input { width:64px; padding:9px; border:1px solid #d9dcdf; border-radius:6px; background:white; }
.small-button, .remove-button { padding:10px; font:inherit; font-size:12px; cursor:pointer; border:1px solid #d9dcdf; border-radius:6px; background:white; }
.remove-button { border:0; color:#72757a; text-decoration:underline; }
.order-summary { border:1px solid #e1e3e6; background:#f7f7f8; border-radius:14px; padding:28px; }
.order-summary h2 { font-size:20px; display:flex; justify-content:space-between; gap:20px; }
.order-summary p, .order-summary small { font-size:13px; color:#72757a; line-height:1.7; }
.order-summary .button { display:flex; margin:20px 0; width:100%; }
.order-summary .text-link { display:block; margin:18px 0; font-size:13px; }
.order-summary > small { display:block; }
.summary-line { display:flex; gap:18px; justify-content:space-between; padding:16px 0; border-bottom:1px solid #e1e3e6; font-size:12px; line-height:1.6; }
.summary-line strong { white-space:nowrap; }
.summary-line small { display:block; }
.summary-total { padding-top:15px; }
.checkout-form { max-width:620px; }
.checkout-form > label:not(.consent) { display:block; margin:20px 0 8px; font-size:14px; font-weight:600; }
.checkout-form > input:not([type=hidden]), .checkout-form textarea { width:100%; padding:15px; border:1px solid #d9dcdf; border-radius:8px; background:white; font:inherit; font-size:16px; }
.checkout-form textarea { resize:vertical; }
.optional { color:#7b8088; font-weight:400; margin-left:8px; font-size:12px; }
.checkout-note { font-size:12px; color:#707680; line-height:1.7; margin:20px 0; }
.consent { display:flex; gap:12px; align-items:start; font-size:13px; line-height:1.6; margin:22px 0; }
.consent input { margin-top:4px; flex-shrink:0; width:18px; height:18px; }
.field-error, .cart-row-copy .field-error { color:#9d352b; font-size:13px; line-height:1.6; }
.validation-summary-valid { display:none; }
.field-error ul { padding-left:18px; }
.receipt-card { max-width:760px; margin:auto; padding:50px; background:#f7f7f8; border:1px solid #e1e3e6; border-radius:18px; }
.receipt-card h1 { font-size:42px; line-height:1.2; }
.receipt-card > p { line-height:1.7; }
.receipt-number { font-size:19px; font-weight:650; }
@media(max-width:1000px) { .commerce-grid { grid-template-columns:minmax(0,1fr) 290px; gap:24px; } .cart-row img { width:64px; height:70px; } .cart-row { gap:12px; flex-wrap:wrap; } .cart-row-price { width:100%; } .header-cta { display:none; } }
@media(max-width:700px) { .commerce-grid { grid-template-columns:1fr; } .checkout-form { max-width:none; } .commerce-page .page-heading h1 { font-size:36px; } .order-summary { padding:22px; } .receipt-card { padding:26px; } .receipt-card h1 { font-size:32px; } .cart-link { margin-left:auto; } }

.receiving-methods { border:0; padding:0; margin:30px 0 0; min-width:0; }
.receiving-methods legend { font-size:18px; font-weight:600; margin-bottom:15px; }
.receiving-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.receiving-option { display:flex; gap:12px; align-items:start; border:1px solid #d9dcdf; border-radius:10px; padding:16px; cursor:pointer; font-size:15px; }
.receiving-option:has(input:checked) { border-color:#30383d; background:#f2f3f4; }
.receiving-option input { margin:3px 0 0; width:18px; height:18px; flex-shrink:0; accent-color:#30383d; }
.receiving-option small { display:block; font-size:11px; color:#707680; margin-top:6px; line-height:1.5; }
.delivery-fields label { display:block; margin:20px 0 8px; font-size:14px; font-weight:600; }
.delivery-fields input { width:100%; padding:15px; border:1px solid #d9dcdf; border-radius:8px; font:inherit; font-size:16px; }
.summary-total { flex-wrap:wrap; }
.receipt-fulfillment { overflow-wrap:anywhere; }
@media(max-width:700px) { .checkout-grid .order-summary { order:-1; } .receiving-option { padding:12px; gap:8px; } }

/* Store contact details remain visible on small screens. */
.topbar-contact { display:flex; align-items:center; gap:22px; }
.topbar-contact a { font-size:12px; font-weight:600; color:#373d43; white-space:nowrap; padding:8px 0; }
.topbar-contact span { white-space:nowrap; font-size:11px; }
.site-footer .footer-phone { display:block; font-size:15px; font-weight:600; color:#373d43; margin-top:14px; }
.site-footer .footer-hours { font-size:12px; margin-top:6px; }
.info-contact-link { display:inline-block; padding:8px 0; }
@media(max-width:700px) {
  .topbar-inner { height:auto; min-height:36px; }
  .topbar-inner .topbar-motto { display:none; }
  .topbar-contact { width:100%; justify-content:space-between; gap:8px; }
  .topbar-contact span { font-size:10px; }
  .footer-grid > div:first-child { display:block; }
  .footer-grid > div:first-child > p { margin-top:12px; }
  .footer-grid > div:first-child > .footer-hours { margin-top:6px; font-size:12px; }
}

/* Real part photographs use their natural colors and fit without cropping. */
.product-image.has-photo, .detail-visual.has-photo { background:#fff; }
.product-image.has-photo > img, .detail-visual.has-photo > img { object-fit:contain; filter:none; transform:none; }
.detail-gallery { min-width:0; }
.product-thumbnails { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.product-thumbnails a { display:flex; width:74px; height:74px; border:1px solid var(--line); border-radius:8px; padding:5px; background:#fff; }
.product-thumbnails a[aria-current="true"] { border:2px solid var(--accent); padding:4px; }
.product-thumbnails img { width:100%; height:100%; object-fit:contain; }

/* Repair booking reuses checkout fields, with a quiet service-centre sidebar. */
.repair-booking-form select { width:100%; padding:15px; border:1px solid #d9dcdf; border-radius:8px; background:white; font:inherit; font-size:16px; }
.repair-booking-form .repair-contact-heading { margin-top:38px; }
.repair-field-hint { font-size:12px; color:#707680; margin:8px 0; line-height:1.6; }
.repair-booking-grid { align-items:start; }
.repair-booking-aside { background:#f4f5f6; }
.repair-booking-aside h2 { font-size:30px; letter-spacing:-1px; line-height:1.25; }
.repair-booking-steps { padding-left:22px; margin:30px 0; }
.repair-booking-steps li { padding-left:8px; margin:22px 0; }
.repair-booking-steps strong,.repair-booking-steps span { display:block; }
.repair-booking-steps span { margin-top:6px; font-size:14px; line-height:1.7; color:#707680; }
.repair-visit { border-top:1px solid #d9dcdf; padding-top:24px; }
.repair-visit h3 { font-size:18px; }.repair-visit p { font-size:14px; }.repair-visit a { font-weight:600; }
.repair-selected-part { background:#f4f5f6; border-radius:10px; padding:18px; margin-top:22px; overflow-wrap:anywhere; }
.repair-selected-part small,.repair-selected-part span { font-size:12px; color:#707680; }.repair-selected-part p { font-size:14px; margin:8px 0; }
.repair-problem-summary { white-space:pre-wrap; overflow-wrap:anywhere; }
.repair-booking-form .button { width:100%; }
@media(max-width:700px) { .repair-booking-aside { margin-top:18px; }.repair-booking-aside h2 { font-size:26px; } }

.catalog-search-help { margin:10px 0 22px; font-size:12px; line-height:1.7; color:#707680; }
.catalog-search-summary { display:flex; justify-content:space-between; align-items:baseline; gap:14px; flex-wrap:wrap; margin:0 0 22px; font-size:14px; overflow-wrap:anywhere; }
.catalog-search-summary a { flex-shrink:0; color:#596269; text-decoration:underline; text-underline-offset:3px; }

/* Full-size product photos; native dialog keeps keyboard focus inside. */
.photo-open { position:absolute; bottom:18px; right:18px; padding:12px 16px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font-size:13px; }
.photo-viewer-open { overflow:hidden; }
.photo-viewer { width:min(1200px, calc(100vw - 24px)); height:calc(100dvh - 24px); max-width:none; max-height:none; padding:22px; border:1px solid var(--line); border-radius:16px; background:#fff; color:#25282b; }
.photo-viewer::backdrop { background:rgba(20,24,27,.72); }
.photo-viewer[open] { display:grid; grid-template-rows:auto minmax(0,1fr) auto auto; gap:14px; }
.photo-viewer-header { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.photo-viewer-header h2 { font-size:18px; line-height:1.5; margin:0; overflow-wrap:anywhere; }
.photo-viewer-header button { flex-shrink:0; }
.photo-viewer-stage { min-height:0; display:flex; align-items:center; justify-content:center; overflow:auto; }
.photo-viewer-stage img { width:100%; height:100%; object-fit:contain; }
.photo-viewer-controls { display:flex; align-items:center; justify-content:center; gap:18px; }
.photo-viewer-controls [hidden], .photo-viewer-stage [hidden], .photo-viewer-error[hidden] { display:none; }
.photo-viewer-error { color:#85412c; text-align:center; }
@media (max-width:600px) {
 .photo-viewer { padding:14px; }
 .photo-viewer-header { align-items:flex-start; gap:10px; }
 .photo-viewer-header h2 { font-size:14px; }
 .photo-viewer-header .button { min-height:44px; padding:10px; font-size:12px; }
 .photo-viewer-controls { gap:12px; flex-wrap:wrap; }
 .photo-viewer-controls .button { min-width:44px; padding:10px; }
 .photo-viewer-controls .text-link { font-size:13px; }
}
.photo-viewer-stage { touch-action: pan-y pinch-zoom; }

.product-card { position:relative; }
.favorite-button { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; flex-shrink:0; padding:0; border:1px solid var(--line); border-radius:50%; background:#fff; color:#666; font:28px/1 Arial,sans-serif; cursor:pointer; }
.product-card > .favorite-button { position:absolute; right:12px; top:12px; z-index:2; }
.favorite-button[aria-pressed="true"] { color:var(--accent); border-color:var(--accent); }
.favorite-button[hidden], [data-favorites-page] [hidden], .favorites-notice[hidden] { display:none; }
.favorites-notice { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); z-index:20; max-width:calc(100vw - 32px); width:max-content; padding:14px 20px; border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:0 5px 24px #0002; }
.favorites-page > p { max-width:760px; }
[data-favorites-page] { margin-top:32px; }
.favorite-unavailable { padding:24px; border:1px solid var(--line); border-radius:12px; }
.favorite-unavailable h2 { font-size:20px; }

.favorites-page h1 { font-size:clamp(32px,5vw,49px); line-height:1.15; letter-spacing:-1.5px; margin:14px 0 22px; font-weight:550; }
.favorites-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:800px) { .favorites-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:480px) { .favorites-grid { grid-template-columns:minmax(0,1fr); } }

.recently-viewed { padding-top:32px; padding-bottom:60px; border-top:1px solid var(--line); }
.recently-viewed[hidden] { display:none; }
.recently-viewed-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.recently-viewed-heading h2 { font-size:28px; line-height:1.3; letter-spacing:-.7px; }
.recently-viewed-grid { display:grid; grid-auto-flow:column; grid-auto-columns:280px; grid-template-columns:none; gap:20px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; padding:8px 2px 18px; }
.recently-viewed-grid > article { scroll-snap-align:start; }
@media (max-width:600px) {
 .recently-viewed-heading { align-items:flex-start; flex-direction:column; gap:10px; }
 .recently-viewed-heading h2 { font-size:24px; }
 .recently-viewed-grid { grid-auto-columns:calc(85vw - 32px); }
}

.detail-purchase { margin:24px 0 20px; }
.detail-purchase > label { display:block; font-size:13px; margin-bottom:10px; }
.detail-purchase-controls { display:flex; align-items:stretch; gap:12px; flex-wrap:wrap; }
.quantity-picker { display:flex; border:1px solid var(--line); border-radius:8px; overflow:hidden; background:#fff; }
.quantity-picker button { width:44px; min-height:48px; border:0; background:#fff; font-size:23px; cursor:pointer; color:var(--graphite); }
.quantity-picker button:disabled { opacity:.35; cursor:default; }
.quantity-picker input { width:64px; min-width:0; text-align:center; border:0; border-inline:1px solid var(--line); border-radius:0; background:#fff; font:inherit; appearance:textfield; -moz-appearance:textfield; }
.quantity-picker input::-webkit-inner-spin-button, .quantity-picker input::-webkit-outer-spin-button { appearance:none; margin:0; }
.quantity-picker input:focus-visible { outline:2px solid var(--accent); outline-offset:-3px; }

.related-products { border-top:1px solid var(--line); padding-top:32px; padding-bottom:60px; }
.related-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:28px; }
.related-heading h2 { font-size:28px; line-height:1.3; letter-spacing:-.6px; }
.related-heading .text-link { flex-shrink:0; }
.related-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:800px) { .related-heading { flex-direction:column; align-items:flex-start; } .related-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:480px) { .related-grid { grid-template-columns:minmax(0,1fr); } .related-heading h2 { font-size:24px; } }

/* The entire product photo opens the viewer, including touch and keyboard activation. */
.photo-open { inset:0; padding:0; background:transparent; border:0; border-radius:inherit; cursor:zoom-in; }
.photo-open span { position:absolute; bottom:18px; right:18px; padding:10px 14px; background:#fff; border:1px solid var(--line); border-radius:8px; pointer-events:none; }
.photo-open:focus-visible { outline:3px solid var(--accent); outline-offset:-4px; }
.photo-viewer-stage { overflow:hidden; touch-action:none; }
.photo-viewer-stage img { flex-shrink:0; transform-origin:center; user-select:none; -webkit-user-select:none; }
.photo-viewer-controls { flex-wrap:wrap; gap:10px; }
.photo-viewer-controls .button { min-width:44px; }

.search-suggest-wrap { position:relative; }
.search-suggestions { position:absolute; top:100%; left:0; right:0; z-index:12; border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:0 12px 30px #18252218; max-height:65dvh; overflow:auto; }
.search-suggestions[hidden] { display:none; }
.search-suggestions p { padding:12px 16px; margin:0; color:#656b72; font-size:13px; }
.search-suggestions ul { list-style:none; padding:0; margin:0; }
.search-suggestions li a { display:flex; align-items:center; gap:12px; padding:12px 16px; border-top:1px solid var(--line); color:var(--ink); }
.search-suggestions li a:hover, .search-suggestions li a:focus-visible { background:#f1f3f4; outline:2px solid var(--accent); outline-offset:-2px; }
.search-suggestions img { object-fit:contain; flex-shrink:0; border-radius:6px; }
.search-suggestions strong { display:block; font-size:14px; line-height:1.4; overflow-wrap:anywhere; }
.search-suggestions small { display:block; font-size:11px; color:#707680; margin-top:5px; }
.suggest-price { margin-left:auto; white-space:nowrap; font-size:14px; }
.suggest-all { display:block; width:100%; padding:16px; background:#f4f5f6; border:0; border-top:1px solid var(--line); color:var(--ink); font:inherit; cursor:pointer; }
.suggest-all[hidden] { display:none; }
@media(max-width:600px) { .search-suggestions li a { gap:8px; padding:12px 10px; flex-wrap:wrap; } .search-suggestions li a > span:not(.suggest-price) { flex:1; min-width:120px; } .suggest-price { margin-left:64px; } }

.share-url { display:block; width:100%; max-width:100%; padding:12px; border:1px solid #d6d9dc; border-radius:8px; margin:12px 0; }

.visit-grid { display:grid; grid-template-columns:2fr 1fr; gap:24px; margin:32px 0 48px; }
.visit-address,.visit-hours { padding:32px; border:1px solid var(--line); border-radius:16px; }
.visit-hours { background:#f3f4f5; }
.visit-pavilion { font-size:24px; font-weight:600; }
.visit-grid p { line-height:1.65; }
.visit-steps { margin-bottom:48px; }
.visit-steps ol { list-style:none; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.visit-steps li { display:flex; gap:16px; border-top:1px solid var(--line); padding-top:24px; }
.visit-steps li > span { color:var(--accent); font-size:24px; }
.visit-steps h3 { margin-top:0; }.visit-steps p { line-height:1.6; }
@media(max-width:760px) { .visit-grid,.visit-steps ol { grid-template-columns:1fr; }.visit-address,.visit-hours {padding:24px;} .visit-pavilion {font-size:21px;} }

.visit-photo-guide { margin:40px 0 48px; }
.visit-photo-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; padding:0; list-style:none; }
.visit-photo-grid figure { margin:0; }
.visit-photo-grid a { display:block; border-radius:12px; overflow:hidden; }
.visit-photo-grid a:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
.visit-photo-grid img { display:block; width:100%; height:auto; aspect-ratio:3/4; object-fit:contain; background:#f3f4f5; }
.visit-photo-grid figcaption { padding:20px 0; }
.visit-photo-grid h3 { margin:10px 0; font-size:20px; }
.visit-photo-grid p { line-height:1.6; }
@media(max-width:1000px) { .visit-photo-grid {grid-template-columns:repeat(2,minmax(0,1fr));} }
@media(max-width:600px) { .visit-photo-grid {grid-template-columns:1fr;} }
