/* Original layout, with compact proportions for desktop-height viewports.
   No fixed section heights, clipping, forced scroll snapping or hidden content.
   Expanded details and photo attachments may increase the natural height. */
@media (min-width: 761px) {
  :root {
    --screen-gap: clamp(14px, 2vh, 22px);
    --screen-pad: clamp(18px, 2.6vh, 28px);
    --screen-text: clamp(15px, 1.85vh, 17px);
    --screen-title: clamp(30px, 3.9vh, 40px);
  }
  html { scroll-padding-top: 64px; }
  .section.screen-section {
    padding-top: var(--screen-pad);
    padding-bottom: var(--screen-pad);
    scroll-margin-top: 16px;
    font-size: var(--screen-text);
    line-height: 1.5;
  }
  .screen-section h2 { font-size: var(--screen-title); line-height: 1.15; }
  .screen-section h2 + p { margin-top: 14px; }
  .screen-section .section-label { margin-bottom: 13px; font-size: 13px; gap: 12px; }
  .screen-section .section-number { font-size: 19px; }
  .screen-section .button { min-height: 43px; padding: 10px 18px; font-size: 14px; }
  .screen-section .text-link { font-size: 14px; padding: 6px 0; }
  .screen-section summary { min-height: 42px; padding-top: 11px; padding-bottom: 11px; }
  .screen-section summary::after { top: 10px; }

  /* 01: preserve the complete photograph and both approved report/legal cards. */
  .screen-section.ac { grid-template-columns: 1.25fr .85fr; gap: var(--screen-gap) 36px; }
  .screen-section .ac-copy > p:not(.eyebrow) { margin-top: 14px; font-size: var(--screen-text); line-height: 1.5; }
  .screen-section .ac-scope { margin: 14px 0 7px; gap: 6px; }
  .screen-section .ac-scope li { font-size: 14px; line-height: 1.5; }
  .screen-section .ac-visual { width: 100%; max-width: clamp(290px, 43vh, 410px); justify-self: center; }
  .screen-section .ac-visual figure img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; }
  .screen-section .ac-visual figure figcaption { font-size: 9px; padding: 4px 0 5px; }
  .screen-section .connection { padding: 10px 13px; gap: 10px; }
  .screen-section .connection strong { font-size: 13px; line-height: 1.4; }
  .screen-section .connection p { font-size: 12px; line-height: 1.45; margin-top: 3px; }
  .screen-section .ac-duo { gap: 20px; }
  .screen-section .ac-duo > div { padding: 18px 24px; }
  .screen-section .ac-duo .eyebrow { font-size: 11px; margin-bottom: 10px; }
  .screen-section .ac-duo h3 { font-size: clamp(22px, 3vh, 28px); line-height: 1.18; }
  .screen-section .ac-duo h3 em { font-size: clamp(25px, 3.4vh, 32px); }
  .screen-section .ac-duo > div > p:not(.eyebrow) { font-size: 14px; line-height: 1.5; margin-top: 13px; }
  .screen-section .ac-duo > div > p.report-note { font-size: 13px; margin-top: 8px; }

  /* 02: photo, description, actions and XRF all remain in the same block. */
  .screen-section.stock-block { padding: var(--screen-pad) 30px; gap: 16px 34px; margin-top: 12px; margin-bottom: 16px; }
  .screen-section .stock-main-photo { height: clamp(235px, 39vh, 360px); }
  .screen-section .stock-main-copy > p:not(.eyebrow) { margin-top: 14px; }
  .screen-section .stock-types { gap: 7px 18px; margin: 16px 0 10px; }
  .screen-section .stock-types span { font-size: 14px; }
  .screen-section .stock-actions { margin-top: 12px; gap: 17px; }
  .screen-section .stock-xrf-card { padding-top: 13px; gap: 19px; }
  .screen-section .stock-xrf-photo { width: 62px; }
  .screen-section .stock-xrf-photo img { width: 62px; height: 56px; }
  .screen-section .stock-xrf-photo figcaption { font-size: 8px; }
  .screen-section .stock-xrf-card h3 { font-size: 22px; }
  .screen-section .stock-xrf-card p { font-size: 14px; margin-top: 3px; }

  /* 03: three real photographs, visible in full, with their red sold labels. */
  .screen-section .section-heading { margin-bottom: 19px; gap: 36px; }
  .screen-section .section-heading > div + div { max-width: 470px; }
  .screen-section .section-heading > div + div > p { font-size: var(--screen-text); }
  .screen-section .section-heading .button { margin-top: 13px; }
  .screen-section .machine-grid { gap: 19px; }
  .screen-section .machine-photo { height: clamp(165px, 28vh, 280px); aspect-ratio: auto; }
  .screen-section .machine-photo img { object-fit: contain; }
  .screen-section .machine-card figcaption { padding: 11px 16px; }
  .screen-section .machine-card h3 { font-size: 18px; margin-top: 2px; }
  .screen-section .machine-card figcaption > span { font-size: 10px; }
  .screen-section .gallery-footer { margin-top: 12px; }

  /* 04–05: equal joined pickup images; full service copy and controls. */
  .screen-section.collection { gap: 34px; }
  .screen-section .collection-summary > p:not(.eyebrow) { margin-top: 14px; }
  .screen-section .pickup-pair { max-width: min(660px, 79vh); }
  .screen-section .pickup-frequency { margin: 15px 0 14px; gap: 9px; }
  .screen-section .pickup-frequency legend { font-size: 13px; margin-bottom: 8px; }
  .screen-section .pickup-frequency span { font-size: 14px; padding: 7px 16px; }
  .screen-section .service-detail { margin-top: 13px; }
  .screen-section.relocation-card { padding: var(--screen-pad) 30px; gap: 30px; margin-bottom: 20px; }
  .screen-section .relocation-photo { height: clamp(180px, 29vh, 260px); }
  .screen-section .service-copy h2 { font-size: var(--screen-title); }
  .screen-section .service-copy > p:not(.eyebrow) { margin-top: 14px; font-size: var(--screen-text); }
  .screen-section .service-copy .text-link { margin-top: 8px; }

  /* 06: retain the original animated wheel, bird, leaves and pause control. */
  .screen-section.im-sustainability { padding: var(--screen-pad) 32px; }
  .screen-section .sustainability-lead { gap: 36px; }
  .screen-section .sustainability-intro { margin-top: 14px; font-size: var(--screen-text); }
  .screen-section .environmental-details { margin-top: 16px; }
  .screen-section .circular-diagram { width: clamp(280px, 36vh, 350px); height: auto; margin-bottom: 25px; }

  /* 07: desktop rows stay in two columns, without removing any form fields. */
  .screen-section.contact { padding: var(--screen-pad) 30px; gap: 38px; margin-top: 24px; }
  .screen-section .contact-copy > p:not(.eyebrow) { margin-top: 13px; font-size: var(--screen-text); }
  .screen-section .contact-copy .email { font-size: 19px; margin-top: 17px; }
  .screen-section .contact-copy .phone { font-size: 25px; margin: 3px 0 14px; }
  .screen-section .contact-copy .contact-location { font-size: 12px !important; line-height: 1.5; }
  .screen-section .contact-copy .small-note { font-size: 11px !important; line-height: 1.5; }
  .screen-section .whatsapp-qr-disclosure { margin-top: 13px; }
  .screen-section .contact-audience { margin-bottom: 14px; }
  .screen-section .contact-audience button { min-height: 40px; padding: 8px 12px; font-size: 12px; }
  .screen-section .form-row { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 14px; }
  .screen-section form label { font-size: 12px; margin-bottom: 10px; }
  .screen-section input, .screen-section select, .screen-section textarea { font-size: 14px; min-height: 39px; margin-top: 4px; padding: 8px 10px; }
  .screen-section textarea { line-height: 1.45; }
  .screen-section .upload-line { padding: 4px 0; gap: 12px; }
  .screen-section .upload-line p { font-size: 11px; line-height: 1.45; }
  .screen-section .photo-button { min-height: 38px; padding: 8px 13px; font-size: 12px; }
  .screen-section .privacy-note { margin: 10px 0; font-size: 11px; line-height: 1.5; }
  .screen-section .form-note { margin-top: 7px; font-size: 11px; line-height: 1.5; }
  .screen-section #form-status:empty, .screen-section #photo-status:empty { margin: 0; }

  /* 08 and selected main views use the same compact margins. */
  .screen-section.partners .partner-card { height: 84px; padding: 12px; }
  .screen-section.partners .partner-card img { height: 58px; }
  .focused-view .section.screen-section { padding-top: var(--screen-pad); padding-bottom: var(--screen-pad); }
  .focused-view .screen-section.stock-block,
  .focused-view .screen-section.im-sustainability,
  .focused-view .screen-section.contact { margin-top: 16px; margin-bottom: 20px; padding-left: 30px; padding-right: 30px; }
}

/* Short laptop windows: compact spacing first, maintain readable text. */
@media (min-width: 761px) and (max-height: 740px) {
  .screen-section.ac { gap: 14px 28px; }
  .screen-section .ac-visual { max-width: 290px; }
  .screen-section .ac-copy h2 { font-size: 29px; }
  .screen-section .ac-copy > p:not(.eyebrow) { margin-top: 11px; }
  .screen-section .ac-scope { margin-top: 11px; gap: 4px; }
  .screen-section .ac-duo > div { padding: 15px 21px; }
  .screen-section .ac-duo h3 { font-size: 21px; }
  .screen-section .ac-duo h3 em { font-size: 24px; }
  .screen-section .ac-duo > div > p:not(.eyebrow) { margin-top: 10px; }
  .screen-section .ac-duo .eyebrow { margin-bottom: 8px; }
}

/* Laptop windows and desktop zoom: use the available height, even below
   1000 CSS pixels wide. Keep every service and form field available. */
@media (min-width: 761px) and (max-height: 680px) {
  :root { --screen-pad: 12px; --screen-gap: 12px; --screen-text: 14px; --screen-title: 27px; }
  .screen-section .section-label { margin-bottom: 9px; font-size: 12px; }
  .screen-section .section-number { font-size: 18px; }
  .screen-section .button { min-height: 38px; padding: 8px 14px; font-size: 13px; }
  .screen-section .text-link { font-size: 13px; padding: 5px 0; }
  .screen-section summary { min-height: 36px; padding-top: 8px; padding-bottom: 8px; }
  .screen-section summary::after { top: 7px; }
  .screen-section.ac { gap: 12px 24px; }
  .screen-section .ac-copy h2 { font-size: 26px; }
  .screen-section .ac-copy > p:not(.eyebrow) { margin-top: 10px; }
  .screen-section .ac-scope { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 12px 0 7px; }
  .screen-section .ac-scope li { font-size: 13px; line-height: 1.4; padding-left: 9px; }
  .screen-section .ac-visual { max-width: 240px; }
  .screen-section .connection { padding: 8px 10px; gap: 8px; }
  .screen-section .connection strong { font-size: 12px; }
  .screen-section .connection p { font-size: 11px; }
  .screen-section .ac-duo { gap: 16px; }
  .screen-section .ac-duo > div { padding: 13px 18px; }
  .screen-section .ac-duo h3 { font-size: 20px; }
  .screen-section .ac-duo h3 em { font-size: 22px; }
  .screen-section .ac-duo > div > p:not(.eyebrow) { font-size: 13px; line-height: 1.4; margin-top: 9px; }
  .screen-section .ac-duo > div > p.report-note { font-size: 12px; margin-top: 6px; }
  .screen-section .ac-duo .eyebrow { font-size: 10px; margin-bottom: 7px; }
  .screen-section.stock-block { gap: 12px 25px; }
  .screen-section .stock-main-photo { height: clamp(200px,37vh,250px); }
  .screen-section .stock-types { margin: 12px 0 8px; gap: 5px 14px; }
  .screen-section .stock-types span { font-size: 13px; }
  .screen-section .stock-actions { margin-top: 9px; gap: 12px; }
  .screen-section .stock-xrf-card { padding-top: 10px; }
  .screen-section .stock-xrf-card h3 { font-size: 20px; }
  .screen-section .section-heading { margin-bottom: 13px; gap: 24px; }
  .screen-section .machine-photo { height: clamp(140px,25vh,170px); }
  .screen-section .machine-card figcaption { padding: 8px 13px; }
  .screen-section .machine-card h3 { font-size: 16px; }
  .screen-section .gallery-footer { margin-top: 8px; }
  .screen-section.contact { gap: 24px; }
  .screen-section .contact-audience { margin-bottom: 9px; }
  .screen-section .contact-audience button { min-height: 35px; padding: 7px 10px; }
  .screen-section .form-row { gap: 12px; }
  .screen-section form label { margin-bottom: 7px; }
  .screen-section input, .screen-section select, .screen-section textarea { min-height: 35px; padding: 6px 9px; margin-top: 3px; }
  .screen-section textarea { height: 67px; }
  .screen-section .privacy-note { margin: 7px 0; }
  .screen-section .photo-button { min-height: 35px; }
  .screen-section .contact-copy .email { margin-top: 12px; }
  .screen-section .contact-copy .phone { margin-bottom: 10px; }
  .screen-section .contact-copy > p:not(.eyebrow) { margin-top: 10px; }
  .screen-section .whatsapp-qr-disclosure { margin-top: 9px; }
  .hero { min-height: 0; }
  .hero-copy { padding: 24px 28px; }
  .hero h1 { font-size: clamp(30px,3vw,39px); }
  .hero-intro { margin-top: 16px; font-size: 17px; }
  .hero-description { margin-top: 12px; font-size: 14px; }
  .hero .actions { margin-top: 18px; gap: 12px; }
  .hero .button { min-height: 40px; padding: 10px 15px; font-size: 13px; }
  .hero .text-link { font-size: 13px; }
  .hero-location { margin-top: 18px; }
  .hero-photo { min-height: 0; }
  .trust-strip { padding: 14px 0; font-size: 12px; }
}

@media (min-width: 761px) and (max-height: 580px) {
  .screen-section .ac-visual figure img { height: 130px; aspect-ratio: auto; object-fit: contain; }
  .hero-copy { padding-top: 20px; padding-bottom: 20px; }
  .hero .eyebrow { margin-bottom: 12px; }
  .hero-intro { margin-top: 12px; }
  .hero-description { margin-top: 10px; }
  .hero-location { margin-top: 12px; }
}
