:root {
        --green: #006335;
        --yellow: #ffc600;
        --charcoal: #222;
        --white: #fff;
        --black: #111;
        --line: rgba(34, 34, 34, 0.25);
        --light-line: rgba(255, 255, 255, 0.25);
        --font: Arial, Helvetica, sans-serif;
        --header: 78px;
        --focus: #006335;
      }
      * {
        box-sizing: border-box;
      }
      html {
        scroll-behavior: smooth;
        scroll-padding-top: calc(var(--header) + 20px);
      }
      body {
        margin: 0;
        font: 17px/1.65 var(--font);
        color: var(--charcoal);
        background: var(--white);
      }
      button,
      input,
      textarea {
        font: inherit;
      }
      a {
        color: inherit;
        text-underline-offset: 4px;
      }
      button,
      a,
      input,
      textarea {
        outline-offset: 5px;
      }
      button:focus-visible,
      a:focus-visible,
      input:focus-visible,
      textarea:focus-visible {
        outline: 3px solid var(--focus);
      }
      button {
        cursor: pointer;
      }
      img {
        display: block;
        max-width: 100%;
      }
      h1,
      h2,
      h3,
      p {
        margin-top: 0;
      }
      h2 {
        font-size: 38px;
        line-height: 1.15;
        margin-bottom: 26px;
        font-weight: 700;
      }
      h3 {
        font-size: 24px;
        line-height: 1.25;
        margin-bottom: 16px;
      }
      p {
        margin-bottom: 22px;
      }
      header {
        height: var(--header);
        position: sticky;
        top: 0;
        z-index: 20;
        background: var(--green);
        color: var(--white);
        --focus: var(--yellow);
      }
      .header-inner {
        max-width: 1500px;
        padding: 0 32px;
        margin: auto;
        display: flex;
        align-items: center;
        gap: 28px;
        height: 100%;
      }
      .brand {
        flex: 0 0 154px;
      }
      .brand img {
        width: 154px;
        height: 48px;
        object-fit: contain;
      }
      .nav {
        display: flex;
        align-items: center;
        gap: 16px;
        overflow: auto;
        scrollbar-width: thin;
        flex: 1;
        white-space: nowrap;
      }
      .nav a {
        font-size: 10px;
        line-height: 1.3;
        font-weight: 700;
        text-decoration: none;
        min-height: 44px;
        display: flex;
        align-items: center;
        border-bottom: 2px solid transparent;
      }
      .nav a:hover,
      .nav a.active {
        border-color: var(--yellow);
        color: var(--yellow);
      }
      .languages {
        display: flex;
        align-items: center;
        gap: 2px;
        flex-shrink: 0;
      }
      .languages a {
        font-size: 11px;
        font-weight: bold;
        padding: 12px 8px;
        min-height: 44px;
        text-decoration: none;
      }
      .languages a[aria-current="true"] {
        color: var(--yellow);
      }
      .menu-button {
        display: none;
        width: 44px;
        height: 44px;
        background: none;
        border: 1px solid var(--light-line);
        color: var(--white);
        font-size: 25px;
      }
      .skip {
        position: fixed;
        top: -100px;
        left: 16px;
        padding: 10px 20px;
        background: var(--yellow);
        z-index: 50;
      }
      .skip:focus {
        top: 10px;
      }
      .hero {
        height: 650px;
        position: relative;
        overflow: hidden;
        color: var(--white);
        --focus: var(--yellow);
      }
      .hero-photo {
        position: absolute;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center 60%;
        z-index: -1;
        filter: brightness(0.82);
      }
      .hero-inner {
        max-width: 1180px;
        margin: auto;
        padding: 26px 32px;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        height: 100%;
      }
      .hero-title {
        text-align: right;
        width: 54%;
        max-width: 560px;
      }
      .slogan {
        font-style: italic;
        font-size: 19px;
        margin-bottom: 12px;
      }
      .hero h1 {
        font-size: 52px;
        line-height: 1.1;
        color: var(--yellow);
        margin: 0 0 18px;
      }
      .hero-logo {
        width: 460px;
        height: auto;
        margin-left: auto;
      }
      .hero-copy {
        max-width: 540px;
        text-align: right;
        margin-top: auto;
        font-size: 17px;
        line-height: 1.5;
        padding-bottom: 8px;
        text-shadow: 0 1px 4px var(--black);
      }
      .hero-copy p {
        margin-bottom: 12px;
      }
      .hero-contact {
        font-size: 19px;
      }
      .hero-contact a {
        color: var(--yellow);
        text-decoration: none;
      }
      .hero-contact a:hover {
        text-decoration: underline;
      }
      .section {
        padding: 80px 32px;
        scroll-margin-top: var(--header);
      }
      .yellow {
        background: var(--yellow);
      }
      .dark {
        background: var(--charcoal);
        color: var(--white);
        --focus: var(--yellow);
      }
      .dark h2 {
        color: var(--yellow);
      }
      .container {
        max-width: 1120px;
        margin: auto;
      }
      .split {
        display: grid;
        grid-template-columns: 0.8fr 1.2fr;
        gap: 64px;
        align-items: start;
      }
      .section-copy {
        padding-top: 6px;
      }
      .section-copy p {
        max-width: 560px;
      }
      .eyebrow {
        font-size: 13px;
        text-transform: uppercase;
        font-weight: bold;
        margin-bottom: 14px;
      }
      .cta {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        gap: 24px;
        min-height: 48px;
        padding: 10px 22px;
        border: 2px solid currentColor;
        text-decoration: none;
        font-size: 13px;
        font-weight: 700;
        margin-top: 8px;
        background: transparent;
        color: inherit;
      }
      .cta:hover {
        background: var(--charcoal);
        color: var(--yellow);
        border-color: var(--charcoal);
      }
      .dark .cta {
        color: var(--yellow);
      }
      .dark .cta:hover {
        background: var(--yellow);
        color: var(--charcoal);
        border-color: var(--yellow);
      }
      .gallery {
        min-width: 0;
      }
      .gallery-main {
        position: relative;
        background: var(--black);
      }
      .photo-open {
        padding: 0;
        border: 0;
        display: block;
        width: 100%;
        background: none;
        color: var(--white);
        position: relative;
      }
      .photo-open img {
        width: 100%;
        height: auto;
        aspect-ratio: 4/3;
        object-fit: cover;
      }
      .zoom {
        position: absolute;
        bottom: 16px;
        right: 16px;
        font-size: 26px;
        width: 44px;
        height: 44px;
        display: grid;
        place-items: center;
        background: var(--charcoal);
      }
      .gallery-bottom {
        display: flex;
        align-items: center;
        gap: 16px;
        margin-top: 14px;
        min-height: 48px;
      }
      .caption {
        flex: 1;
        font-size: 15px;
        line-height: 1.4;
      }
      .counter {
        font-size: 12px;
        opacity: 0.7;
        white-space: nowrap;
      }
      .arrow {
        width: 44px;
        height: 44px;
        flex-shrink: 0;
        border: 1px solid currentColor;
        background: none;
        color: inherit;
        font-size: 24px;
      }
      .arrow:hover {
        background: var(--green);
        color: var(--white);
        border-color: var(--green);
      }
      .thumbs {
        display: flex;
        gap: 8px;
        margin-top: 12px;
        overflow: auto;
        padding: 4px;
        scrollbar-width: thin;
      }
      .thumb {
        border: 2px solid transparent;
        padding: 0;
        background: none;
        flex: 0 0 72px;
        min-height: 50px;
        opacity: 0.65;
      }
      .thumb[aria-pressed="true"] {
        border-color: currentColor;
        opacity: 1;
      }
      .thumb img {
        width: 100%;
        height: 50px;
        object-fit: cover;
      }
      .technical img {
        width: 100%;
        height: auto;
        max-height: 420px;
        object-fit: contain;
      }
      .equipment-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 34px;
        margin-top: 36px;
      }
      .equipment-grid img {
        width: 100%;
        height: auto;
        aspect-ratio: 4/3;
        object-fit: cover;
        margin-bottom: 22px;
      }
      .equipment-grid p {
        font-size: 16px;
      }
      .wc-detail {
        margin-top: 20px;
        display: flex;
        gap: 16px;
        align-items: center;
        font-size: 14px;
      }
      .wc-detail img {
        width: 88px;
        height: 70px;
        object-fit: cover;
        margin: 0;
      }
      .rent-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        column-gap: 70px;
        row-gap: 40px;
        margin-top: 40px;
      }
      .rent-item {
        display: grid;
        grid-template-columns: 90px 1fr;
        gap: 26px;
        padding-top: 26px;
        border-top: 1px solid var(--line);
      }
      .rent-item img {
        width: 90px;
        height: 80px;
        object-fit: contain;
      }
      .rent-item p {
        font-size: 16px;
        margin: 0;
      }
      .rent-item h3 {
        font-size: 22px;
      }
      .about-layout {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 64px;
      }
      .about-photos {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
      }
      .about-photos figure {
        margin: 0;
      }
      .about-photos figure:last-child {
        grid-column: 1/-1;
      }
      .about-photos img {
        width: 100%;
        height: 180px;
        object-fit: cover;
      }
      .about-photos figure:last-child img {
        height: 230px;
      }
      .about-photos figcaption {
        font-size: 14px;
        margin-top: 8px;
      }
      .contact-layout {
        display: grid;
        grid-template-columns: 0.8fr 1.2fr;
        gap: 90px;
      }
      .contact-details {
        font-style: normal;
      }
      .contact-details dt {
        font-size: 13px;
        color: var(--yellow);
        margin-top: 24px;
      }
      .contact-details dd {
        margin: 2px 0;
        font-size: 19px;
      }
      .contact-details a {
        text-decoration: none;
      }
      .contact-details a:hover {
        text-decoration: underline;
      }
      .contact-logo {
        width: 185px;
        height: 70px;
        object-fit: contain;
        object-position: left;
        margin-bottom: 26px;
      }
      .form-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
      }
      .field {
        display: flex;
        flex-direction: column;
        margin-bottom: 20px;
      }
      .field label {
        font-size: 14px;
        margin-bottom: 7px;
      }
      .field input,
      .field textarea {
        width: 100%;
        background: var(--white);
        color: var(--charcoal);
        border: 0;
        border-radius: 0;
        padding: 12px;
        min-height: 48px;
      }
      .field textarea {
        resize: vertical;
        min-height: 150px;
      }
      .email-button {
        background: var(--yellow);
        color: var(--charcoal);
        border: 2px solid var(--yellow);
        padding: 12px 20px;
        min-height: 48px;
        font-size: 15px;
        font-weight: bold;
        text-align: left;
      }
      .email-button:hover {
        background: var(--white);
        border-color: var(--white);
      }
      .form-note,
      .form-status {
        font-size: 14px;
        line-height: 1.5;
        margin-top: 16px;
        max-width: 540px;
      }
      .form-status {
        color: var(--yellow);
      }
      .alternative {
        font-size: 14px;
      }
      footer {
        background: var(--black);
        color: var(--white);
        padding: 28px 32px;
        --focus: var(--yellow);
      }
      .footer-inner {
        max-width: 1120px;
        margin: auto;
        display: flex;
        justify-content: space-between;
        gap: 24px;
        font-size: 13px;
      }
      .footer-links {
        display: flex;
        gap: 26px;
      }
      dialog {
        border: 0;
        background: var(--charcoal);
        color: var(--white);
        padding: 24px;
        width: min(1100px, 94vw);
        max-height: 94dvh;
        --focus: var(--yellow);
      }
      dialog::backdrop {
        background: rgba(0, 0, 0, 0.88);
      }
      .lightbox-top {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 15px;
      }
      .lightbox-top strong {
        font-size: 14px;
        color: var(--yellow);
      }
      .lightbox-image {
        width: 100%;
        height: 65dvh;
        object-fit: contain;
      }
      .lightbox-footer {
        display: flex;
        gap: 18px;
        align-items: center;
        padding-top: 18px;
      }
      .lightbox-caption {
        flex: 1;
        margin: 0;
        font-size: 16px;
      }
      .lightbox-count {
        font-size: 13px;
      }
      .lb-close {
        font-size: 28px;
      }
      @media (min-width: 1500px) {
        .nav a {
          font-size: 11px;
        }
        .nav {
          gap: 20px;
        }
        .hero {
          height: 690px;
        }
      }
      @media (max-width: 1100px) {
        .header-inner {
          gap: 20px;
          padding: 0 20px;
        }
        .brand {
          flex-basis: 128px;
        }
        .brand img {
          width: 128px;
        }
        .nav {
          gap: 14px;
        }
        .hero-title {
          width: 58%;
        }
        .split {
          gap: 40px;
          grid-template-columns: 1fr 1.25fr;
        }
        .section {
          padding: 65px 26px;
        }
        .contact-layout {
          gap: 50px;
        }
      }
      @media (max-width: 800px) {
        :root {
          --header: 68px;
        }
        .header-inner {
          padding: 0 20px;
        }
        .brand {
          flex: 1;
        }
        .brand img {
          width: 140px;
        }
        .languages {
          margin-left: auto;
        }
        .menu-button {
          display: block;
        }
        .nav {
          display: none;
          position: absolute;
          top: var(--header);
          left: 0;
          right: 0;
          max-height: calc(100dvh - var(--header));
          overflow: auto;
          background: var(--green);
          padding: 12px 24px 22px;
          white-space: normal;
        }
        .nav.is-open {
          display: flex;
          flex-direction: column;
          align-items: stretch;
          gap: 0;
        }
        .nav a {
          font-size: 13px;
          min-height: 48px;
          border-bottom: 1px solid var(--light-line);
        }
        .hero {
          height: 680px;
        }
        .hero-photo {
          object-fit: cover;
          object-position: 43% center;
        }
        .hero-inner {
          padding: 28px 24px 18px;
        }
        .hero-title {
          width: 100%;
          max-width: 430px;
        }
        .hero h1 {
          font-size: 42px;
        }
        .slogan {
          font-size: 17px;
        }
        .hero-logo {
          width: 350px;
        }
        .hero-copy {
          font-size: 16px;
          max-width: 430px;
          text-shadow: 0 1px 4px var(--black);
        }
        .hero-contact {
          font-size: 17px;
        }
        .section {
          padding: 54px 24px;
        }
        h2 {
          font-size: 32px;
        }
        .split,
        .about-layout,
        .contact-layout {
          grid-template-columns: 1fr;
          gap: 32px;
        }
        .section-copy p {
          max-width: none;
        }
        .equipment-grid {
          grid-template-columns: 1fr;
          gap: 30px;
        }
        .equipment-grid article {
          display: grid;
          grid-template-columns: 1fr 1fr;
          column-gap: 24px;
          align-items: start;
        }
        .equipment-grid article > img {
          grid-row: 1/4;
          margin: 0;
        }
        .equipment-grid article h3 {
          font-size: 23px;
        }
        .equipment-grid article p {
          margin-bottom: 0;
        }
        .wc-detail {
          grid-column: 2;
        }
        .rent-grid {
          column-gap: 30px;
        }
        .rent-item {
          grid-template-columns: 65px 1fr;
          gap: 16px;
        }
        .rent-item img {
          width: 65px;
        }
        .rent-item h3 {
          font-size: 20px;
        }
        .about-photos img {
          height: 210px;
        }
        .contact-logo {
          margin-bottom: 10px;
        }
        .footer-inner {
          flex-direction: column;
          gap: 12px;
        }
      }
      @media (max-width: 480px) {
        .header-inner {
          gap: 10px;
          padding: 0 16px;
        }
        .brand img {
          width: 125px;
        }
        .languages a {
          padding: 12px 6px;
        }
        .hero {
          height: 660px;
        }
        .hero-inner {
          padding: 22px 20px 16px;
        }
        .hero-title {
          max-width: 350px;
        }
        .hero h1 {
          font-size: 36px;
        }
        .slogan {
          font-size: 15px;
        }
        .hero-logo {
          width: 300px;
        }
        .hero-photo {
          object-position: 40% center;
        }
        .hero-copy {
          font-size: 16px;
          line-height: 1.5;
        }
        .hero-contact {
          font-size: 16px;
        }
        .section {
          padding: 48px 20px;
        }
        h2 {
          font-size: 30px;
        }
        .gallery-bottom {
          gap: 10px;
        }
        .caption {
          font-size: 14px;
        }
        .counter {
          display: none;
        }
        .equipment-grid article {
          display: block;
        }
        .equipment-grid article > img {
          margin-bottom: 22px;
        }
        .equipment-grid article p {
          margin-bottom: 20px;
        }
        .rent-grid {
          grid-template-columns: 1fr;
          gap: 20px;
        }
        .rent-item {
          grid-template-columns: 80px 1fr;
          gap: 20px;
        }
        .rent-item img {
          width: 80px;
        }
        .about-photos {
          gap: 14px;
        }
        .about-photos img {
          height: 140px;
        }
        .about-photos figure:last-child img {
          height: 190px;
        }
        .form-row {
          grid-template-columns: 1fr;
          gap: 0;
        }
        .email-button {
          width: 100%;
        }
        .lightbox-image {
          height: 55dvh;
        }
        .lightbox-footer {
          gap: 10px;
        }
        .lightbox-caption {
          font-size: 14px;
        }
        dialog {
          padding: 16px;
        }
        .footer-links {
          gap: 20px;
        }
      }
      
      /* Preserve the original centered sections and visible photo collections. */
      .nav a { font-size: 14px; }
      .nav { gap: 12px; min-width: 0; }
      .header-inner { max-width: 1720px; gap: 18px; padding-inline: 24px; }
      .languages a { font-size: 14px; min-width: 44px; text-align: center; }
      .split { display: block; }
      .split .section-copy { max-width: 980px; margin: 0 auto 40px; text-align: center; }
      .split .section-copy p { max-width: 920px; margin-inline: auto; }
      .split h2 { font-size: clamp(32px, 4.4vw, 64px); }
      .gallery-main, .gallery-bottom { display: none; }
      .thumbs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; overflow: visible; padding: 0; margin-top: 0; }
      .thumb { width: 100%; opacity: 1; border: 0; color: inherit; text-align: left; }
      .thumb img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border: 6px solid var(--white); }
      .grid-caption { display: block; padding: 10px 0 0; font-size: 14px; line-height: 1.4; }
      [data-gallery="craft"] .thumbs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .technical { max-width: 1120px; margin: auto; }
      .cta { font-size: 14px; }
      @media (min-width: 801px) {
        .hero { height: clamp(820px, 68vw, 1100px); }
        .hero-photo { object-position: center 20%; }
        .hero h1 { font-size: 64px; }
      }
      @media (min-width: 801px) and (max-width: 1650px) {
        :root { --header: 112px; }
        .header-inner { display: grid; grid-template-columns: 1fr auto; gap: 0 16px; padding-top: 5px; padding-bottom: 5px; }
        .brand { grid-column: 1; grid-row: 1; }
        .languages { grid-column: 2; grid-row: 1; }
        .nav { grid-column: 1 / -1; grid-row: 2; width: 100%; }
        .nav a { font-size: 14px; min-height: 44px; }
      }
      @media (max-width: 800px) {
        .header-inner { padding-inline: 16px; gap: 12px; }
        .nav a { font-size: 14px; }
        .thumbs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
        .split .section-copy { margin-bottom: 30px; }
      }
      @media (max-width: 480px) {
        .header-inner { padding-inline: 12px; gap: 6px; }
        .brand img { width: 110px; }
        .languages a { min-width: 36px; padding-inline: 5px; }
        .thumbs, [data-gallery="craft"] .thumbs { grid-template-columns: 1fr; gap: 24px; }
        .hero h1 { font-size: 36px; }
      }

      @media (prefers-reduced-motion: reduce) {
        html {
          scroll-behavior: auto;
        }
        * {
          transition: none !important;
          animation: none !important;
        }
      }