/* The reference uses a 1920px canvas and a 1400px content area.
   Viewport units keep those proportions when browser zoom changes the CSS viewport. */
@media (min-width: 1001px) {
  :root { --header-height: clamp(64px, 4.17vw, 80px); }
  .section-shell { width: min(1400px, 73vw); }
  .section-title { font-size: min(54px, 2.8125vw); }

  .site-header { height: var(--header-height); padding-inline: clamp(35px, 2.6vw, 50px); }
  .site-logo img { width: clamp(160px, 10.57vw, 203px); }
  .primary-nav {
    flex: 0 1 min(1120px, 58.3vw);
    max-width: min(1120px, 58.3vw);
    margin-left: clamp(30px, 4.95vw, 95px);
    gap: clamp(9px, 1vw, 20px);
  }
  .nav-link { font-size: clamp(14px, .99vw, 18px); line-height: var(--header-height); }
  .nav-link::after { bottom: 28%; }
  .language-toggle { margin-left: clamp(20px, 6.8vw, 130px); font-size: clamp(14px, .94vw, 18px); }

  /* Four explicit rows prevent the product art from covering its statistics. */
  .products-inner {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    row-gap: clamp(12px, 2.5vh, 28px);
    height: 100vh;
    height: 100svh;
    padding-block: clamp(50px, 12.5vh, 135px) clamp(25px, 7.4vh, 80px);
  }
  .product-tabs { margin-top: 0; gap: clamp(10px, 1.7vw, 33px); min-width: 0; }
  .product-tab { min-width: 0; font-size: clamp(13px, 1.04vw, 20px); }
  .product-showcase {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 0;
    height: auto;
    margin-top: 0;
    padding-top: clamp(16px, 5vh, 55px);
  }
  .product-visual {
    width: min(840px, 44vw);
    height: 100%;
    max-width: calc(100% - 110px);
    max-height: 100%;
    object-fit: contain;
  }
  .product-arrow { top: 50%; transform: translateY(-50%); }
  .product-specs {
    position: static;
    transform: none;
    justify-self: center;
    width: min(880px, 65vw);
  }
  .product-specs p { font-size: clamp(14px, 1.09vw, 21px); }

  .case-card { grid-template-rows: minmax(0, 1fr); min-height: 0; }
  .case-card > img { min-height: 0; }
  .case-copy { height: 100%; min-height: 0; overflow: hidden; }
  .case-copy > div { margin-top: auto; }
  .case-copy > img { mix-blend-mode: multiply; }
  .case-copy h3 { font-size: clamp(15px, 1.15vw, 22px); }
  .case-copy p { margin-bottom: 0; font-size: clamp(11px, .73vw, 14px); }

  .update-row { gap: min(100px, 5.2vw); }
  .update-two { gap: min(69px, 3.6vw); }
  .update-copy h3 { font-size: min(35px, 1.82vw); margin-bottom: clamp(12px, 3.5vh, 38px); }
  .update-copy p { font-size: min(17px, .89vw); line-height: 1.65; }

  .why-grid { width: min(1243px, 65vw); column-gap: min(98px, 5.1vw); }
  .why-item { grid-template-columns: min(41px, 2.14vw) minmax(0, 1fr); gap: min(37px, 2vw); padding-inline: min(39px, 2vw); }
  .why-item img { width: min(41px, 2.14vw); height: min(41px, 2.14vw); }
  .why-item h3 { font-size: min(25px, 1.3vw); }
  .why-item p { font-size: min(16px, .83vw); }

  .global-subtitle, .showroom-button { font-size: min(31px, 1.61vw); }
  .country-grid { gap: clamp(12px, 1.35vw, 26px) min(84px, 4.3vw); }
  .country-grid span { font-size: min(22px, 1.15vw); }

  .site-footer { min-height: min(538px, 28vw); }
  .footer-inner {
    width: min(1496px, 78vw);
    min-height: min(456px, 23.75vw);
    padding-top: min(103px, 5.36vw);
    gap: min(30px, 1.56vw);
  }
  .footer-links { flex: 1; grid-template-columns: 1fr 1.3fr 1fr 1fr 1fr; gap: min(50px, 2.6vw); }
  .footer-column h2 { font-size: min(21px, 1.1vw); }
  .footer-column a { font-size: min(17px, .89vw); }
  .footer-social { gap: min(17px, .89vw); transform: none; }
  .footer-social a { width: min(48px, 2.5vw); height: min(48px, 2.5vw); }
  .footer-watermark { width: min(287px, 15vw); height: auto; }
  .footer-bottom { height: min(82px, 4.27vw); font-size: min(16px, .83vw); }
}

/* A short laptop viewport keeps the full-screen sections compact. */
@media (min-width: 1001px) and (max-height: 820px) {
  .products-inner { padding-top: clamp(35px, 9vh, 74px); padding-bottom: clamp(18px, 4vh, 33px); }
  .product-showcase { padding-top: clamp(12px, 3vh, 25px); }
  .cases-inner { padding-top: 6vh; }
  .cases .case-grid { margin-top: 6vh; }
  .case-card { height: min(27vh, 290px); }
  .case-controls { margin-top: 8vh; }
  .updates-inner { padding-top: 6vh; }
  .update-row { margin-top: 6vh; }
  .update-two { margin-top: 6vh; }
  .update-copy p { line-height: 1.48; }
  .global-inner { padding-top: 9vh; }
  .country-grid { margin-top: 6vh; }
}

@media (min-width: 1001px) and (max-width: 1280px) {
  .product-tabs { overflow-x: auto; justify-content: flex-start; padding-bottom: 6px; }
  .product-tab { flex: 0 0 auto; min-width: 165px; }
  .updates-inner { height: auto; min-height: 100svh; padding-bottom: 6vh; }
}

/* Tablet and phone layouts use the full available width instead of the desktop canvas. */
@media (max-width: 1000px) {
  .section-shell { width: calc(100% - 48px); }
  .section-title { font-size: clamp(30px, 5vw, 44px); }

  .hero h1.sr-only, .film h2.sr-only {
    position: absolute;
    clip: auto;
    width: auto;
    height: auto;
    overflow: visible;
    white-space: normal;
    margin: 0;
  }
  .hero h1.sr-only {
    top: 20%; left: 0; max-width: 58%;
    color: #050505; font-size: clamp(26px, 4vw, 38px);
    line-height: 1.18; letter-spacing: .025em;
    text-shadow: 0 1px 12px #fffa;
  }
  .film h2.sr-only {
    top: 46%; left: 0; color: white;
    font-size: clamp(28px, 4vw, 40px); font-weight: 400;
  }

  .product-showcase { margin-top: 3vh; }
  .product-specs { padding-top: 2vh; }
  .case-card { height: min(220px, 24vh); grid-template-rows: minmax(0, 1fr); }
  .case-card > img, .case-copy { min-height: 0; }
  .case-copy { height: 100%; overflow: hidden; }
  .case-copy > div { margin-top: auto; }
  .case-copy > img { mix-blend-mode: multiply; }
  .case-copy p { margin-bottom: 0; }
  .update-copy p { line-height: 1.55; }
}

@media (max-width: 650px) {
  .section-shell { width: calc(100% - 40px); }
  .hero h1.sr-only { top: 18%; max-width: 72%; font-size: clamp(23px, 6vw, 30px); }
  .film h2.sr-only { top: 46%; font-size: 30px; }

  .products-inner { padding-top: 7vh; padding-bottom: 7vh; }
  .product-tabs { margin-top: 3vh; }
  .product-showcase { height: min(42vh, 350px); margin-top: 1vh; }
  .product-visual { max-height: 100%; }
  .product-specs { padding-top: 1vh; }

  .cases-inner { padding-top: 6vh; padding-bottom: 5vh; }
  .cases .case-grid { margin-top: 4vh; }
  .case-card { height: clamp(112px, 17vh, 150px); min-height: 0; }
  .case-copy { padding: 8px 10px; }
  .case-copy h3 { font-size: clamp(13px, 3.6vw, 16px); }
  .case-copy p { font-size: 10px; line-height: 1.18; }
  .case-dash { margin: 3px 0; }
  .case-controls { margin-top: 3vh; }

  .updates-inner { padding-top: 6vh; padding-bottom: 6vh; }
  .update-row, .update-two { margin-top: 4vh; gap: 12px; }
  .update-row > img, .update-two > img { height: min(19vh, 170px); }
  .update-copy h3 { margin-bottom: 7px; }

  .why-inner { padding-top: 6vh; padding-bottom: 6vh; }
  .why-grid { margin-top: 4vh; gap: 6px; }
  .why-item { min-height: 64px; }

  .global-inner { padding-top: 8vh; padding-bottom: 6vh; }
  .country-grid { margin-top: 5vh; }
}