/* PEK Civil Defence mobile final pass */
* { min-width: 0; }
html, body { max-width: 100%; overflow-x: hidden; }
img, video, iframe, svg { max-width: 100%; }
.pcd-mobile-toggle { display: none; }
.pcd-mobile-scrim,
.pcd-mobile-panel { display: none; }
@media (max-width: 1120px) {
  body { cursor: auto !important; }
  #c-dot, #c-ring, #c-trail { display: none !important; }
  #nav, nav#nav {
    height: 68px !important;
    min-height: 68px !important;
    padding: 0 18px !important;
    background: rgba(5,5,5,.94) !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  #nav.scrolled, nav#nav.scrolled { height: 64px !important; min-height: 64px !important; }
  #nav .nav-links, nav#nav .nav-links,
  #nav .nav-cta, nav#nav .nav-cta,
  #nav .nav-cta-wrap, nav#nav .nav-cta-wrap,
  #nav .nav-divider, nav#nav .nav-divider {
    display: none !important;
    visibility: hidden !important;
  }
  #nav .logo-switcher, nav#nav .logo-switcher,
  #nav .nav-logo, nav#nav .nav-logo {
    min-width: 0 !important;
    max-width: calc(100vw - 96px) !important;
    position: relative !important;
    z-index: 1601 !important;
  }
  #nav .logo-switcher-main, nav#nav .logo-switcher-main { max-width: 100% !important; }
  #nav .logo-switcher-main img,
  #nav .nav-logo img,
  nav#nav img {
    width: auto !important;
    height: 40px !important;
    max-width: min(230px, 60vw) !important;
    object-fit: contain !important;
  }
  .pcd-mobile-toggle {
    display: inline-flex !important;
    position: relative !important;
    z-index: 1701 !important;
    width: 44px !important;
    height: 44px !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)) !important;
    box-shadow: 0 10px 26px rgba(0,0,0,.22) !important;
    color: #fff !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    gap: 5px !important;
    border-radius: 0 !important;
    clip-path: polygon(0 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%) !important;
    cursor: pointer !important;
    transition: transform .22s ease, border-color .22s ease, background .22s ease !important;
  }
  .pcd-mobile-toggle:active {
    transform: scale(.97) !important;
    border-color: rgba(162,132,72,.48) !important;
    background: linear-gradient(180deg, rgba(162,132,72,.18), rgba(255,255,255,.05)) !important;
  }
  .pcd-mobile-toggle span {
    display: block !important;
    width: 18px !important;
    height: 2px !important;
    background: currentColor !important;
    transform-origin: center !important;
    transition: transform .25s ease, opacity .2s ease !important;
  }
  body.pcd-menu-open .pcd-mobile-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg) !important; }
  body.pcd-menu-open .pcd-mobile-toggle span:nth-child(2) { opacity: 0 !important; }
  body.pcd-menu-open .pcd-mobile-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg) !important; }
  .pcd-mobile-scrim {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 1450 !important;
    background: rgba(0,0,0,.74) !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity .28s ease !important;
  }
  .pcd-mobile-panel {
    display: flex !important;
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 1500 !important;
    width: min(334px, 84vw) !important;
    padding: 84px 14px 18px !important;
    background:
      radial-gradient(circle at 88% 10%, rgba(162,132,72,.16), transparent 28%),
      linear-gradient(180deg, rgba(14,14,14,.98), rgba(6,6,6,.985)) !important;
    border-left: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: -32px 0 80px rgba(0,0,0,.58) !important;
    transform: translateX(106%) !important;
    transition: transform .38s cubic-bezier(.22,1,.36,1) !important;
    flex-direction: column !important;
    gap: 12px !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  body.pcd-menu-open { overflow: hidden !important; }
  body.pcd-menu-open .pcd-mobile-scrim { opacity: 1 !important; pointer-events: auto !important; }
  body.pcd-menu-open .pcd-mobile-panel { transform: translateX(0) !important; }
  .pcd-mobile-panel-header {
    display: grid !important;
    gap: 6px !important;
    padding: 0 4px 6px !important;
  }
  .pcd-mobile-panel-kicker {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: rgba(162,132,72,.95) !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: 2.3px !important;
    text-transform: uppercase !important;
  }
  .pcd-mobile-panel-kicker::before {
    content: "" !important;
    display: block !important;
    width: 22px !important;
    height: 1px !important;
    background: currentColor !important;
    opacity: .7 !important;
  }
  .pcd-mobile-panel-title {
    display: block !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: 20px !important;
    line-height: 1.05 !important;
    font-weight: 900 !important;
    letter-spacing: .35px !important;
    text-transform: uppercase !important;
  }
  .pcd-mobile-panel-subtitle {
    display: block !important;
    color: rgba(255,255,255,.54) !important;
    font-size: 11px !important;
    line-height: 1.55 !important;
    letter-spacing: .4px !important;
  }
  .pcd-mobile-nav-list {
    display: grid !important;
    gap: 8px !important;
  }
  .pcd-mobile-link {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 44px !important;
    padding: 12px 14px !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
    color: rgba(255,255,255,.92) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 1.15px !important;
    text-transform: uppercase !important;
    clip-path: polygon(0 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%) !important;
    transition: transform .18s ease, border-color .22s ease, background .22s ease, color .22s ease !important;
  }
  .pcd-mobile-link::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 10px !important;
    bottom: 10px !important;
    width: 2px !important;
    background: rgba(162,132,72,.78) !important;
    transform: scaleY(0) !important;
    transform-origin: center !important;
    transition: transform .2s ease !important;
  }
  .pcd-mobile-link::after {
    content: "›" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    height: 22px !important;
    border-radius: 999px !important;
    background: rgba(162,132,72,.12) !important;
    border: 1px solid rgba(162,132,72,.22) !important;
    color: var(--accent, #a28448) !important;
    font-size: 14px !important;
    line-height: 1 !important;
    flex: 0 0 auto !important;
  }
  .pcd-mobile-link:hover,
  .pcd-mobile-link:active,
  .pcd-mobile-link.pcd-active {
    color: #fff !important;
    border-color: rgba(162,132,72,.32) !important;
    background: linear-gradient(180deg, rgba(162,132,72,.13), rgba(255,255,255,.03)) !important;
    transform: translateX(-1px) !important;
  }
  .pcd-mobile-link:hover::before,
  .pcd-mobile-link:active::before,
  .pcd-mobile-link.pcd-active::before { transform: scaleY(1) !important; }
  .pcd-mobile-link.pcd-active::after {
    background: rgba(162,132,72,.22) !important;
    border-color: rgba(162,132,72,.38) !important;
  }
  .pcd-mobile-cta {
    margin-top: 4px !important;
    min-height: 50px !important;
    justify-content: center !important;
    border: 1px solid rgba(162,132,72,.44) !important;
    background: linear-gradient(90deg, rgba(162,132,72,.96), rgba(186,156,90,.96)) !important;
    color: #fff !important;
    clip-path: polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.28) !important;
  }
  .pcd-mobile-cta::before { content: none !important; }
  .pcd-mobile-cta::after {
    content: "↗" !important;
    width: auto !important;
    height: auto !important;
    border: 0 !important;
    background: transparent !important;
    color: rgba(255,255,255,.94) !important;
    font-size: 15px !important;
  }
  .pcd-mobile-panel-footer {
    margin-top: auto !important;
    padding: 8px 4px 2px !important;
    color: rgba(255,255,255,.38) !important;
    font-size: 10px !important;
    line-height: 1.6 !important;
    letter-spacing: .5px !important;
    text-transform: uppercase !important;
  }
}


@media (max-width: 1120px) {
  .container,
  .reqs-inner,
  .scen-inner,
  .eng-inner,
  .comp-inner,
  .cta-content,
  .story-wrap,
  .story-hero-inner,
  .contact-shell,
  .technology-page,
  .tech-page,
  .tech-ecosystem,
  .tech-foundation,
  footer,
  #footer,
  .foot-grid {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: clamp(20px, 5vw, 34px) !important;
    padding-right: clamp(20px, 5vw, 34px) !important;
  }
  section,
  header,
  footer { max-width: 100vw !important; overflow-x: clip !important; }
  .section-head,
  .scen-head,
  .reqs-header,
  .contact-intro {
    display: block !important;
    grid-template-columns: 1fr !important;
    text-align: left !important;
  }
  .section-desc,
  .scen-head-right,
  .contact-copy {
    max-width: 100% !important;
    margin-top: 18px !important;
  }
  .products-grid,
  .product-grid,
  .portfolio-grid,
  .domain-grid,
  .cap-grid,
  #mission,
  .story-grid,
  .story-cards,
  .capability-list,
  .branch-grid,
  .contact-info-grid,
  .reqs-grid,
  .scen-grid,
  .spec-grid-full,
  .foot-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }
  .domain-layout,
  .tech-wrap,
  .eng-inner,
  .comparison-wrap,
  .compare-wrap,
  .analysis-table-wrap {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
  .product-card.featured,
  .ecosystem-parent,
  .branch-agroline,
  .branch-civil,
  .branch-it {
    grid-column: auto !important;
  }
  .ticker,
  .ticker-wrap { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; }
  .ticker { display: flex !important; gap: 0 !important; }
  .stat,
  .tick-item { flex: 0 0 auto !important; white-space: nowrap !important; }
}

@media (max-width: 760px) {
  .container,
  .reqs-inner,
  .scen-inner,
  .eng-inner,
  .comp-inner,
  .cta-content,
  .story-wrap,
  .story-hero-inner,
  .contact-shell,
  .technology-page,
  .tech-ecosystem,
  .tech-foundation,
  footer,
  #footer,
  .foot-grid {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .products-grid,
  .product-grid,
  .portfolio-grid,
  .domain-grid,
  .cap-grid,
  #mission,
  .story-grid,
  .story-cards,
  .capability-list,
  .branch-grid,
  .contact-info-grid,
  .reqs-grid,
  .scen-grid,
  .spec-grid-full,
  .foot-grid {
    grid-template-columns: 1fr !important;
  }
  .section-title,
  .s-h,
  .story-title,
  .tech-page-title,
  .contact-title,
  .offensive-coming-title {
    font-size: clamp(34px, 12vw, 54px) !important;
    line-height: .96 !important;
    letter-spacing: -1.6px !important;
  }
  .section-kicker,
  .section-eye,
  .story-kicker,
  .tech-kicker,
  .contact-kicker { letter-spacing: 2px !important; }
  #hero,
  .hero,
  .story-hero,
  .technology-hero,
  .contact-page,
  .offensive-coming-soon,
  .deminer-clean-hero {
    height: auto !important;
    min-height: auto !important;
    padding-top: 108px !important;
    padding-bottom: 72px !important;
  }
  #hero .hero-content,
  .hero-content,
  .deminer-hero-content,
  .story-hero-inner {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .hero-title,
  .hero-h1,
  .deminer-title {
    font-size: clamp(46px, 15vw, 70px) !important;
    line-height: .88 !important;
    letter-spacing: -2.2px !important;
  }
  .hero-h2,
  .hero-sub,
  .deminer-subtitle {
    font-size: clamp(20px, 7vw, 34px) !important;
    line-height: 1.08 !important;
    letter-spacing: 2.4px !important;
  }
  .hero-tagline,
  .hero-copy,
  .story-lead,
  .tech-page-copy,
  .contact-copy {
    font-size: 13px !important;
    line-height: 1.75 !important;
  }
  .hero-actions,
  .hero-cta,
  .deminer-hero-cta,
  .story-actions,
  .cta-contacts,
  .offensive-password-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    width: 100% !important;
  }
  .btn,
  .nav-btn,
  .btn-fire,
  .btn-ghost-hero,
  .deminer-btn,
  .deminer-btn-primary,
  .deminer-btn-ghost,
  .contact-submit,
  .offensive-password-button,
  .ecosystem-button {
    width: 100% !important;
    max-width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    min-height: 50px !important;
  }
  .hero-panel,
  .hero-scroll,
  .hero-scroll-wrap,
  .deminer-scroll,
  .ecosystem-connector,
  .branch-mid-line,
  .domain-stage { display: none !important; }
  .hero-bg,
  .deminer-hero-bg,
  .hero-photo {
    opacity: .52 !important;
    object-position: center !important;
    background-position: center !important;
  }
  .product-card,
  .domain-card,
  .mission-card,
  .story-card,
  .contact-info-card,
  .contact-form-panel,
  .ecosystem-card,
  .branch-card,
  .req-c,
  .scen-c,
  .pillar,
  .comp {
    width: 100% !important;
    max-width: 100% !important;
    min-height: auto !important;
  }
  .product-visual,
  .product-card:hover .product-visual,
  .product-card.featured .product-visual,
  .product-card.featured:hover .product-visual {
    height: 220px !important;
  }
  .product-visual.has-image img,
  .product-card:hover .product-visual.has-image img {
    opacity: 1 !important;
    filter: brightness(.9) contrast(1.04) saturate(1) !important;
    transform: none !important;
  }
  .tech-visual,
  .fake3d-viewer,
  .video-wrap,
  .video-frame,
  .ffrs-video-wrap,
  .ffrs-video-frame {
    width: 100% !important;
    min-height: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .video-aspect,
  .ffrs-video-aspect { aspect-ratio: 16 / 9 !important; width: 100% !important; }
  .video-aspect iframe,
  .ffrs-video-aspect iframe { width: 100% !important; height: 100% !important; }
  .eng-robot-wrap,
  .ffrs-360-viewer,
  .deminer-360-wrap,
  .deminer-360-viewer {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 260px !important;
    height: auto !important;
    margin: 18px auto 0 !important;
    transform: none !important;
  }
  .ffrs-360-frame,
  .deminer-360-frame,
  .ffrs-360-viewer img,
  .deminer-360-viewer img {
    width: 100% !important;
    height: auto !important;
    max-height: 360px !important;
    object-fit: contain !important;
  }
  .ffrs-360-visible-icon,
  .deminer-360-visible-icon {
    right: 12px !important;
    bottom: 10px !important;
    height: 32px !important;
    padding: 0 11px !important;
    font-size: 13px !important;
  }
  .req-c {
    display: flex !important;
    flex-direction: column !important;
    background: #0b0b0b !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    overflow: hidden !important;
  }
  .req-c > img {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    height: 235px !important;
    object-fit: cover !important;
    transform: none !important;
    opacity: 1 !important;
  }
  .req-over { display: none !important; }
  .req-top-line { position: relative !important; width: 100% !important; }
  .req-body {
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    padding: 20px !important;
    min-height: auto !important;
    background: linear-gradient(180deg, rgba(8,8,8,.96), rgba(4,4,4,1)) !important;
  }
  .req-h,
  .scen-h { font-size: clamp(22px, 7vw, 32px) !important; line-height: 1.05 !important; }
  .req-bullets,
  .scen-list { margin-top: 16px !important; display: grid !important; gap: 10px !important; }
  .req-bullets li,
  .scen-list li { font-size: 15px !important; line-height: 1.45 !important; }
  .scen-img-wrap { height: 230px !important; min-height: 230px !important; }
  .scen-img-wrap img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
  .scen-body { padding: 20px !important; }
  .comparison-wrap,
  .compare-wrap,
  .analysis-table-wrap,
  .comparison-table {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  table { min-width: 640px; }
  .form-row,
  .request-demo-grid,
  .demo-wide { display: block !important; grid-template-columns: 1fr !important; }
  input, textarea, select { width: 100% !important; max-width: 100% !important; font-size: 16px !important; }
  .demo-modal-box,
  .request-demo-box,
  .spec-modal-panel,
  .offensive-lock-box {
    width: calc(100vw - 34px) !important;
    max-width: calc(100vw - 34px) !important;
    max-height: calc(100svh - 34px) !important;
    overflow-y: auto !important;
    padding: 24px !important;
  }
  .foot-grid { gap: 28px !important; }
  .foot-bottom { display: flex !important; flex-direction: column !important; gap: 12px !important; text-align: left !important; }
}

@media (max-width: 430px) {
  #nav, nav#nav { padding-left: 14px !important; padding-right: 14px !important; }
  #nav .logo-switcher-main img,
  #nav .nav-logo img,
  nav#nav img { height: 34px !important; max-width: 58vw !important; }
  .pcd-mobile-toggle { width: 42px !important; height: 42px !important; }
  .container,
  .reqs-inner,
  .scen-inner,
  .eng-inner,
  .comp-inner,
  .cta-content,
  .story-wrap,
  .story-hero-inner,
  .contact-shell,
  .technology-page,
  .tech-ecosystem,
  .tech-foundation,
  footer,
  #footer { padding-left: 16px !important; padding-right: 16px !important; }
  .hero-title,
  .hero-h1,
  .deminer-title { font-size: clamp(40px, 15vw, 58px) !important; }
  .req-c > img, .scen-img-wrap { height: 210px !important; min-height: 210px !important; }
}

/* ROUND 5 MOBILE STABILITY PASS - desktop design unchanged */
@media (max-width: 1180px) {
  html { -webkit-text-size-adjust: 100%; }
  body { touch-action: manipulation; }
  body.pcd-menu-open { position: fixed !important; width: 100% !important; }

  /* Keep all large/animated/technical sections inside the viewport. */
  main, .page, .wrap, .section, .container, .media-main, .media-shell,
  .danger-slider-shell, .danger-slider, .danger-slider-track,
  .pdf-slider, .pdf-slider-track, .cad-stage, .cad-scene,
  .specs-wrapper, .specs-shell, .specifications, .system-specs,
  .platform-showcase, .showcase-wrap, .stage-wrap, .visual-wrap,
  .vanq-gallery, .vanq-grid, .lugv-gallery, .lugv-grid {
    max-width: 100vw !important;
    overflow-x: clip !important;
  }

  /* Make touch targets consistent on phone/tablet. */
  a, button, .btn, .nav-btn, .deminer-btn, .media-tab, .pcd-mobile-link,
  input[type="submit"], .contact-submit, .request-submit {
    min-height: 44px !important;
  }

  /* Mobile nav should always be above modals/media layers. */
  #nav, nav#nav { z-index: 2400 !important; }
  .pcd-mobile-toggle { z-index: 2601 !important; }
  .pcd-mobile-panel { z-index: 2550 !important; }
  .pcd-mobile-scrim { z-index: 2500 !important; }

  /* Dropdowns are desktop interactions; mobile panel replaces them. */
  .systems-dropdown, .logo-switcher-menu {
    max-width: calc(100vw - 28px) !important;
  }

  /* Prevent technical callouts and labels from forcing horizontal scroll. */
  .cad-callout, .cad-label, .hotspot-label, .diagram-label,
  .spec-label, .spec-value, .feature-label, .feature-value {
    max-width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  /* Horizontal technical content should scroll only inside its own wrapper. */
  .comparison-table, .comparison-wrap, .compare-wrap, .analysis-table-wrap,
  .spec-table, .specs-table, .data-table, .table-wrap, .table-shell {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  table {
    width: max-content !important;
    min-width: min(680px, calc(100vw - 32px)) !important;
  }

  /* Keep sliders/cards from using desktop fixed widths. */
  .danger-slide, .danger-slide.pdf-slide, .pdf-slide,
  .slide, .slider-slide, .gallery-slide {
    max-width: calc(100vw - 32px) !important;
    flex-basis: calc(100vw - 32px) !important;
  }

  .media-hero, .story-hero, .technology-hero, .contact-page,
  .offensive-coming-soon, .deminer-clean-hero, #hero, .hero {
    background-position: center !important;
  }
}

@media (max-width: 900px) {
  /* Tablet and large-phone layout normalization. */
  .media-hero, .media-head, .media-video-grid, .media-article-grid,
  .media-video-card:first-child, .media-cta,
  .contact-layout, .contact-grid, .contact-shell,
  .technology-grid, .technology-layout, .story-layout,
  .spec-layout, .system-layout, .feature-layout, .demo-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
  .media-video-card:first-child { grid-column: auto !important; }
  .media-video-card:first-child .media-video-frame {
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
  }
}

@media (max-width: 760px) {
  /* Safe-area support for phones with notches/home indicators. */
  #nav, nav#nav {
    padding-left: max(16px, env(safe-area-inset-left)) !important;
    padding-right: max(16px, env(safe-area-inset-right)) !important;
  }
  .pcd-mobile-panel {
    width: min(350px, 82vw) !important;
    padding-top: calc(84px + env(safe-area-inset-top)) !important;
    padding-bottom: calc(28px + env(safe-area-inset-bottom)) !important;
  }

  /* Hero typography: keep long titles inside the phone width. */
  h1, .hero-title, .hero-h1, .deminer-title, .media-hero h1,
  .section-title, .s-h, .story-title, .tech-page-title,
  .contact-title, .offensive-coming-title {
    max-width: 100% !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
  }

  .media-hero {
    min-height: auto !important;
    padding: 108px 20px 64px !important;
  }
  .media-hero h1 {
    max-width: 11ch !important;
    font-size: clamp(42px, 13vw, 66px) !important;
    line-height: .9 !important;
    letter-spacing: -2px !important;
  }
  .media-hero p,
  .media-head p,
  .media-video-copy p,
  .media-article-card p,
  .media-cta p {
    font-size: 13px !important;
    line-height: 1.7 !important;
  }
  .media-main { padding-left: 16px !important; padding-right: 16px !important; }
  .media-tabs { width: 100% !important; overflow-x: auto !important; }
  .media-tab { flex: 1 0 auto !important; min-width: 130px !important; }
  .media-stats { grid-template-columns: 1fr !important; }
  .media-stat { border-right: 0 !important; border-bottom: 1px solid rgba(255,255,255,.10) !important; }
  .media-cta { display: block !important; padding: 26px 20px !important; }
  .media-cta a { width: 100% !important; margin-top: 20px !important; }

  /* Forms: no iOS zoom, no two-column squeezing. */
  input, textarea, select, button {
    font-size: 16px !important;
  }
  .form-row, .form-grid, .contact-form-grid, .request-demo-grid,
  .demo-grid, .demo-wide {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  /* Cards/cards-with-media should remain readable instead of cramped. */
  .media-video-copy, .media-article-card, .product-card, .domain-card,
  .mission-card, .story-card, .ecosystem-card, .branch-card,
  .contact-info-card, .contact-form-panel, .req-c, .scen-c,
  .pillar, .comp, .cap-card, .feature-card {
    padding-left: min(22px, 6vw) !important;
    padding-right: min(22px, 6vw) !important;
  }

  /* Technical images/viewers scale down cleanly. */
  .ffrs-360-viewer, .deminer-360-viewer, .fake3d-viewer,
  .eng-robot-wrap, .product-visual, .tech-visual,
  .diagram-wrap, .image-stage, .visual-stage {
    max-width: 100% !important;
    transform: none !important;
  }
  .ffrs-360-viewer img, .deminer-360-viewer img,
  .fake3d-viewer img, .eng-robot-wrap img,
  .product-visual img, .tech-visual img,
  .diagram-wrap img, .image-stage img, .visual-stage img {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }

  /* Modals must never exceed mobile viewport. */
  .demo-modal-box, .request-demo-box, .spec-modal-panel,
  .offensive-lock-box, .modal-box, .modal-panel {
    width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
    max-height: calc(100dvh - 28px) !important;
    overflow-y: auto !important;
  }

  /* Cookie banner on mobile. */
  .pcd-cookie-banner, .cookie-banner, #cookie-banner {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    left: 12px !important;
    right: 12px !important;
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
  }
}

@media (max-width: 430px) {
  .hero-title, .hero-h1, .deminer-title, .media-hero h1,
  .section-title, .s-h, .story-title, .tech-page-title,
  .contact-title, .offensive-coming-title {
    font-size: clamp(34px, 13.5vw, 58px) !important;
    letter-spacing: -1.8px !important;
  }
  .hero-h2, .hero-sub, .deminer-subtitle {
    font-size: clamp(18px, 6.4vw, 28px) !important;
  }
  .pcd-mobile-link {
    font-size: 13px !important;
    letter-spacing: 1px !important;
  }
  .media-tab { min-width: 112px !important; font-size: 14px !important; }
  table { min-width: 600px !important; }
}


/* Round 5.1: keep only one mobile hamburger in the header. */
@media (max-width: 1120px) {
  #nav [data-pcd-hidden-duplicate-menu="true"],
  nav#nav [data-pcd-hidden-duplicate-menu="true"],
  #nav > button:not(.pcd-mobile-toggle),
  nav#nav > button:not(.pcd-mobile-toggle),
  #nav .hamburger:not(.pcd-mobile-toggle),
  #nav .hamburger-menu:not(.pcd-mobile-toggle),
  #nav .menu-toggle:not(.pcd-mobile-toggle),
  #nav .mobile-menu-toggle:not(.pcd-mobile-toggle),
  #nav .nav-toggle:not(.pcd-mobile-toggle),
  #nav .navbar-toggle:not(.pcd-mobile-toggle),
  #nav .burger:not(.pcd-mobile-toggle),
  #nav .burger-menu:not(.pcd-mobile-toggle),
  nav#nav .hamburger:not(.pcd-mobile-toggle),
  nav#nav .hamburger-menu:not(.pcd-mobile-toggle),
  nav#nav .menu-toggle:not(.pcd-mobile-toggle),
  nav#nav .mobile-menu-toggle:not(.pcd-mobile-toggle),
  nav#nav .nav-toggle:not(.pcd-mobile-toggle),
  nav#nav .navbar-toggle:not(.pcd-mobile-toggle),
  nav#nav .burger:not(.pcd-mobile-toggle),
  nav#nav .burger-menu:not(.pcd-mobile-toggle) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }
  #nav .pcd-mobile-toggle ~ .pcd-mobile-toggle,
  nav#nav .pcd-mobile-toggle ~ .pcd-mobile-toggle {
    display: none !important;
  }
}

/* Round 5.4: homepage mobile hero image visibility.
   Keep desktop unchanged. On phone, move the machine image into the lower part of the hero
   so the full image is visible and the text no longer sits directly on top of it. */
@media (max-width: 760px) {
  body.home-page-body #hero {
    min-height: 980px !important;
    padding-bottom: 24px !important;
    overflow: hidden !important;
  }

  body.home-page-body #hero .eyebrow {
    display: none !important;
  }

  body.home-page-body #hero .hero-content {
    width: min(340px, calc(100% - 40px)) !important;
    max-width: 340px !important;
    margin: 0 !important;
    padding: 104px 20px 0 !important;
    position: relative !important;
    z-index: 5 !important;
  }

  body.home-page-body #hero .hero-title {
    font-size: clamp(46px, 14vw, 64px) !important;
    line-height: .92 !important;
    letter-spacing: -2px !important;
    margin-bottom: 12px !important;
  }

  body.home-page-body #hero .hero-sub {
    max-width: 320px !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    letter-spacing: 2.4px !important;
    margin-bottom: 16px !important;
  }

  body.home-page-body #hero .hero-copy {
    max-width: 320px !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
  }

  body.home-page-body #hero .hero-actions {
    gap: 8px !important;
    align-items: stretch !important;
  }

  body.home-page-body #hero .hero-actions .btn,
  body.home-page-body #hero .hero-actions .btn.ghost {
    width: 100% !important;
    justify-content: center !important;
  }

  body.home-page-body #hero .hero-photo {
    position: absolute !important;
    inset: auto 0 0 0 !important;
    top: auto !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 52% !important;
    object-fit: contain !important;
    object-position: center bottom !important;
    transform: none !important;
    filter: brightness(.96) contrast(1.02) saturate(1.02) !important;
  }

  body.home-page-body #hero .hero-shadow {
    background:
      linear-gradient(180deg,
        rgba(5,5,5,.94) 0%,
        rgba(5,5,5,.88) 18%,
        rgba(5,5,5,.76) 34%,
        rgba(5,5,5,.38) 50%,
        rgba(5,5,5,.12) 62%,
        rgba(5,5,5,.10) 74%,
        rgba(5,5,5,.24) 86%,
        rgba(5,5,5,.58) 100%) !important,
      linear-gradient(90deg,
        rgba(5,5,5,.72) 0%,
        rgba(5,5,5,.24) 20%,
        rgba(5,5,5,.04) 50%,
        rgba(5,5,5,.24) 80%,
        rgba(5,5,5,.72) 100%) !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero {
    min-height: 920px !important;
  }

  body.home-page-body #hero .hero-photo {
    height: 48% !important;
  }

  body.home-page-body #hero .hero-content {
    width: calc(100% - 36px) !important;
    max-width: 100% !important;
    padding-top: 100px !important;
  }
}

/* Round 5.5: homepage mobile hero rebuild.
   The long paragraph is removed from the overlaid hero and a single bright image block
   showing the full machine lineup is inserted between the subtitle and the buttons. */
.hero-mobile-image { display: none; }

@media (max-width: 760px) {
  body.home-page-body #hero {
    background: #050505 !important;
    min-height: auto !important;
    height: auto !important;
    align-items: flex-start !important;
    padding-bottom: 28px !important;
  }

  body.home-page-body #hero .hero-photo,
  body.home-page-body #hero .hero-shadow,
  body.home-page-body #hero .hero-scan {
    display: none !important;
  }

  body.home-page-body #hero .hero-content {
    width: calc(100% - 40px) !important;
    max-width: 360px !important;
    margin: 0 auto !important;
    padding: 104px 0 0 !important;
  }

  body.home-page-body #hero .eyebrow,
  body.home-page-body #hero .hero-copy {
    display: none !important;
  }

  body.home-page-body #hero .hero-title {
    font-size: clamp(46px, 15vw, 64px) !important;
    line-height: .91 !important;
    letter-spacing: -2px !important;
    margin-bottom: 10px !important;
  }

  body.home-page-body #hero .hero-sub {
    max-width: 320px !important;
    font-size: 12px !important;
    line-height: 1.38 !important;
    letter-spacing: 2.4px !important;
    margin-bottom: 18px !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    display: block !important;
    width: 100% !important;
    margin: 0 0 20px !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    background:
      radial-gradient(ellipse at center, rgba(255,255,255,.08) 0%, rgba(255,255,255,0) 65%),
      linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,.01) 100%),
      #111 !important;
    overflow: hidden !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
    filter: brightness(1.16) contrast(1.04) saturate(1.02) !important;
  }

  body.home-page-body #hero .hero-actions {
    gap: 8px !important;
    align-items: stretch !important;
  }

  body.home-page-body #hero .hero-actions .btn,
  body.home-page-body #hero .hero-actions .btn.ghost {
    width: 100% !important;
    justify-content: center !important;
  }

  body.home-page-body #hero .hero-panel,
  body.home-page-body #hero .hero-scroll {
    display: none !important;
  }
}

/* Round 5.6: move mobile homepage hero higher, make image bleed to the edges,
   and soften the image edges with a vignette so there are no visible hard borders. */
@media (max-width: 760px) {
  body.home-page-body #hero {
    padding-bottom: 24px !important;
  }

  body.home-page-body #hero .hero-content {
    padding-top: 84px !important;
  }

  body.home-page-body #hero .hero-sub {
    margin-bottom: 14px !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    position: relative !important;
    width: calc(100% + 40px) !important;
    margin: 0 -20px 18px !important;
    border: 0 !important;
    background: transparent !important;
    overflow: hidden !important;
    isolation: isolate !important;
  }

  body.home-page-body #hero .hero-mobile-image::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    pointer-events: none !important;
    background:
      radial-gradient(ellipse at center, rgba(0,0,0,0) 52%, rgba(0,0,0,.12) 72%, rgba(0,0,0,.32) 100%),
      linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,0) 14%, rgba(0,0,0,0) 82%, rgba(0,0,0,.24) 100%),
      linear-gradient(90deg, rgba(0,0,0,.26) 0%, rgba(0,0,0,0) 10%, rgba(0,0,0,0) 90%, rgba(0,0,0,.26) 100%) !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    width: 100% !important;
    filter: brightness(1.16) contrast(1.05) saturate(1.03) !important;
  }

  body.home-page-body #hero .hero-actions {
    margin-top: 2px !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero .hero-content {
    width: calc(100% - 28px) !important;
    padding-top: 74px !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    width: calc(100% + 28px) !important;
    margin-left: -14px !important;
    margin-right: -14px !important;
    margin-bottom: 16px !important;
  }
}

/* Round 5.7: push the lineup image further to the edges and soften the corners/edges
   so it feels like a near full-screen image on mobile. Desktop remains unchanged. */
@media (max-width: 760px) {
  body.home-page-body #hero .hero-mobile-image {
    width: calc(100% + 64px) !important;
    margin: 0 -32px 18px !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    width: calc(100% + 64px) !important;
    max-width: none !important;
    margin-left: -32px !important;
    filter: brightness(1.16) contrast(1.05) saturate(1.03) !important;
  }

  body.home-page-body #hero .hero-mobile-image::before {
    background:
      radial-gradient(ellipse at center, rgba(0,0,0,0) 46%, rgba(0,0,0,.10) 64%, rgba(0,0,0,.28) 82%, rgba(0,0,0,.48) 100%),
      radial-gradient(circle at top left, rgba(0,0,0,.42) 0%, rgba(0,0,0,0) 30%),
      radial-gradient(circle at top right, rgba(0,0,0,.42) 0%, rgba(0,0,0,0) 30%),
      radial-gradient(circle at bottom left, rgba(0,0,0,.42) 0%, rgba(0,0,0,0) 30%),
      radial-gradient(circle at bottom right, rgba(0,0,0,.42) 0%, rgba(0,0,0,0) 30%),
      linear-gradient(180deg, rgba(0,0,0,.14) 0%, rgba(0,0,0,0) 10%, rgba(0,0,0,0) 86%, rgba(0,0,0,.18) 100%),
      linear-gradient(90deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,0) 8%, rgba(0,0,0,0) 92%, rgba(0,0,0,.18) 100%) !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero .hero-mobile-image {
    width: calc(100% + 40px) !important;
    margin-left: -20px !important;
    margin-right: -20px !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    width: calc(100% + 56px) !important;
    margin-left: -28px !important;
  }
}

/* Round 5.8: make the mobile lineup image feel full-screen and zoom it so the machines are more visible. */
@media (max-width: 760px) {
  body.home-page-body #hero .hero-mobile-image {
    width: 100vw !important;
    margin: 0 calc(50% - 50vw) 18px !important;
    min-height: 360px !important;
    height: min(96vw, 460px) !important;
    aspect-ratio: auto !important;
    border: 0 !important;
    background: #050505 !important;
    overflow: hidden !important;
    position: relative !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    object-fit: cover !important;
    object-position: center 74% !important;
    transform: scale(1.12) !important;
    filter: brightness(1.12) contrast(1.05) saturate(1.03) !important;
  }

  body.home-page-body #hero .hero-mobile-image::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    pointer-events: none !important;
    background:
      radial-gradient(ellipse at center, rgba(0,0,0,0) 50%, rgba(0,0,0,.10) 68%, rgba(0,0,0,.28) 84%, rgba(0,0,0,.52) 100%),
      radial-gradient(circle at top left, rgba(0,0,0,.40) 0%, rgba(0,0,0,0) 28%),
      radial-gradient(circle at top right, rgba(0,0,0,.40) 0%, rgba(0,0,0,0) 28%),
      radial-gradient(circle at bottom left, rgba(0,0,0,.44) 0%, rgba(0,0,0,0) 30%),
      radial-gradient(circle at bottom right, rgba(0,0,0,.44) 0%, rgba(0,0,0,0) 30%),
      linear-gradient(180deg, rgba(0,0,0,.20) 0%, rgba(0,0,0,0) 12%, rgba(0,0,0,0) 86%, rgba(0,0,0,.20) 100%),
      linear-gradient(90deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,0) 8%, rgba(0,0,0,0) 92%, rgba(0,0,0,.18) 100%) !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero .hero-mobile-image {
    min-height: 330px !important;
    height: min(98vw, 420px) !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    object-position: center 76% !important;
    transform: scale(1.15) !important;
  }
}

/* Round 5.9: use the user-provided portrait hero image on mobile only.
   Keep desktop unchanged. The image sits below the text block so text never overlays it. */
@media (max-width: 760px) {
  body.home-page-body #hero .hero-content {
    padding-top: 78px !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    width: 100vw !important;
    margin: 0 calc(50% - 50vw) 18px !important;
    min-height: 0 !important;
    height: auto !important;
    background: #050505 !important;
    border: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    isolation: isolate !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: center center !important;
    transform: none !important;
    filter: brightness(1.04) contrast(1.03) saturate(1.02) !important;
  }

  body.home-page-body #hero .hero-mobile-image::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    pointer-events: none !important;
    background:
      radial-gradient(ellipse at center, rgba(0,0,0,0) 56%, rgba(0,0,0,.10) 74%, rgba(0,0,0,.28) 90%, rgba(0,0,0,.48) 100%),
      linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,0) 12%, rgba(0,0,0,0) 88%, rgba(0,0,0,.12) 100%),
      linear-gradient(90deg, rgba(0,0,0,.12) 0%, rgba(0,0,0,0) 8%, rgba(0,0,0,0) 92%, rgba(0,0,0,.12) 100%) !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero .hero-content {
    width: calc(100% - 28px) !important;
    padding-top: 70px !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    margin-bottom: 16px !important;
  }
}

/* Round 5.11: rebuild the mobile homepage hero correctly.
   Desktop stays unchanged.
   Mobile uses the user-provided portrait image only inside the mobile hero image block,
   with the title/subtitle overlaying the dark upper area of the image while the machines remain unobstructed.
   Buttons stay below the image. */
@media (max-width: 760px) {
  body.home-page-body #hero {
    min-height: auto !important;
    height: auto !important;
    padding: 76px 0 28px !important;
    background: #050505 !important;
    overflow: hidden !important;
  }

  body.home-page-body #hero .hero-photo,
  body.home-page-body #hero .hero-shadow,
  body.home-page-body #hero .hero-scan,
  body.home-page-body #hero .hero-panel,
  body.home-page-body #hero .hero-scroll,
  body.home-page-body #hero .eyebrow,
  body.home-page-body #hero .hero-copy {
    display: none !important;
  }

  body.home-page-body #hero .hero-content {
    position: relative !important;
    width: calc(100% - 28px) !important;
    max-width: 390px !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    display: block !important;
    position: relative !important;
    width: 100vw !important;
    margin: 0 calc(50% - 50vw) 18px !important;
    min-height: 470px !important;
    height: min(125vw, 620px) !important;
    overflow: hidden !important;
    border: 0 !important;
    background: #050505 !important;
    isolation: isolate !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center 72% !important;
    transform: scale(1.14) !important;
    filter: brightness(1.06) contrast(1.04) saturate(1.02) !important;
  }

  body.home-page-body #hero .hero-mobile-image::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    pointer-events: none !important;
    background:
      linear-gradient(180deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.70) 18%, rgba(0,0,0,.34) 34%, rgba(0,0,0,.08) 47%, rgba(0,0,0,0) 56%, rgba(0,0,0,.06) 78%, rgba(0,0,0,.16) 100%),
      radial-gradient(ellipse at center, rgba(0,0,0,0) 52%, rgba(0,0,0,.08) 70%, rgba(0,0,0,.24) 86%, rgba(0,0,0,.42) 100%),
      radial-gradient(circle at top left, rgba(0,0,0,.36) 0%, rgba(0,0,0,0) 28%),
      radial-gradient(circle at top right, rgba(0,0,0,.36) 0%, rgba(0,0,0,0) 28%),
      radial-gradient(circle at bottom left, rgba(0,0,0,.24) 0%, rgba(0,0,0,0) 24%),
      radial-gradient(circle at bottom right, rgba(0,0,0,.24) 0%, rgba(0,0,0,0) 24%) !important;
  }

  body.home-page-body #hero .hero-title {
    position: absolute !important;
    top: 18px !important;
    left: 18px !important;
    right: 18px !important;
    z-index: 4 !important;
    margin: 0 !important;
    max-width: 270px !important;
    font-size: clamp(46px, 15vw, 68px) !important;
    line-height: .90 !important;
    letter-spacing: -2px !important;
  }

  body.home-page-body #hero .hero-sub {
    position: absolute !important;
    top: 190px !important;
    left: 20px !important;
    right: 20px !important;
    z-index: 4 !important;
    max-width: 290px !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    letter-spacing: 2.4px !important;
    color: rgba(245,245,245,.9) !important;
  }

  body.home-page-body #hero .hero-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin-top: 4px !important;
  }

  body.home-page-body #hero .hero-actions .btn,
  body.home-page-body #hero .hero-actions .btn.ghost {
    width: 100% !important;
    justify-content: center !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero {
    padding-top: 72px !important;
    padding-bottom: 24px !important;
  }

  body.home-page-body #hero .hero-content {
    width: calc(100% - 24px) !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    min-height: 430px !important;
    height: min(128vw, 560px) !important;
    margin-bottom: 16px !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    object-position: center 74% !important;
    transform: scale(1.17) !important;
  }

  body.home-page-body #hero .hero-title {
    top: 16px !important;
    left: 16px !important;
    right: 16px !important;
    max-width: 250px !important;
    font-size: clamp(44px, 14.5vw, 62px) !important;
  }

  body.home-page-body #hero .hero-sub {
    top: 178px !important;
    left: 18px !important;
    right: 18px !important;
    max-width: 270px !important;
  }
}

/* Round 5.12: final small mobile hero corrections.
   - Move CTA buttons higher.
   - Prevent the word "Defence" from breaking.
   Desktop remains untouched. */
@media (max-width: 760px) {
  body.home-page-body #hero .hero-title {
    max-width: 320px !important;
    letter-spacing: -1.5px !important;
  }

  body.home-page-body #hero .hero-title .word:last-child,
  body.home-page-body #hero .hero-title .word:last-child > span {
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    min-height: 425px !important;
    height: min(112vw, 520px) !important;
    margin-bottom: 10px !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    object-position: center 73% !important;
    transform: scale(1.18) !important;
  }

  body.home-page-body #hero .hero-actions {
    margin-top: -48px !important;
    position: relative !important;
    z-index: 5 !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero .hero-title {
    max-width: 300px !important;
    font-size: clamp(40px, 13.8vw, 58px) !important;
    letter-spacing: -1.25px !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    min-height: 392px !important;
    height: min(106vw, 470px) !important;
    margin-bottom: 8px !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    object-position: center 74% !important;
    transform: scale(1.2) !important;
  }

  body.home-page-body #hero .hero-actions {
    margin-top: -42px !important;
  }
}

/* Round 5.13: move only the "PEK CIVIL DEFENCE" title higher on mobile.
   Do not change the image position. Desktop remains untouched. */
@media (max-width: 760px) {
  body.home-page-body #hero .hero-title {
    top: 8px !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero .hero-title {
    top: 6px !important;
  }
}

/* Round 5.14: move only the mobile hero image lower so the title/subtitle no longer sit over the machines. */
@media (max-width: 760px) {
  body.home-page-body #hero .hero-mobile-image img {
    object-position: center 60% !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero .hero-mobile-image img {
    object-position: center 58% !important;
  }
}

/* Round 5.15: move the mobile hero subtitle below the CTA buttons.
   Desktop remains unchanged. */
@media (max-width: 760px) {
  body.home-page-body #hero .hero-content {
    display: flex !important;
    flex-direction: column !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    order: 1 !important;
  }

  body.home-page-body #hero .hero-actions {
    order: 2 !important;
  }

  body.home-page-body #hero .hero-sub {
    position: static !important;
    order: 3 !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    max-width: none !important;
    margin: 10px 2px 0 !important;
    text-align: center !important;
    font-size: 11px !important;
    line-height: 1.45 !important;
    letter-spacing: 2.6px !important;
    color: rgba(245,245,245,.82) !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero .hero-sub {
    margin-top: 8px !important;
    font-size: 10.5px !important;
    letter-spacing: 2.3px !important;
  }
}

/* Round 5.16: move the mobile subtitle a bit lower to add more spacing below the buttons. */
@media (max-width: 760px) {
  body.home-page-body #hero .hero-sub {
    margin-top: 18px !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero .hero-sub {
    margin-top: 16px !important;
  }
}

/* Round 5.17: reduce the oversized gap between the black mobile hero and the next white section. */
@media (max-width: 760px) {
  body.home-page-body #hero {
    padding-bottom: 10px !important;
  }

  body.home-page-body #hero .hero-sub {
    margin-bottom: 0 !important;
  }

  html body #products {
    margin-top: 0 !important;
    padding-top: 14px !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero {
    padding-bottom: 8px !important;
  }

  html body #products {
    padding-top: 10px !important;
  }
}

/* Round 5.18: move the mobile homepage subtitle slightly lower and visually center it
   between the bottom CTA button and the white section below. Desktop remains unchanged. */
@media (max-width: 760px) {
  body.home-page-body #hero {
    padding-bottom: 12px !important;
  }

  body.home-page-body #hero .hero-sub {
    width: 100% !important;
    max-width: 300px !important;
    margin: 22px auto 10px !important;
    text-align: center !important;
    align-self: center !important;
  }

  html body #products {
    padding-top: 0 !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero {
    padding-bottom: 12px !important;
  }

  body.home-page-body #hero .hero-sub {
    max-width: 280px !important;
    margin: 20px auto 8px !important;
  }

  html body #products {
    padding-top: 0 !important;
  }
}

/* Round 5.19: make the mobile homepage hero fill the full screen so the white section below
   does not appear at the bottom of the first view. Desktop remains unchanged. */
@media (max-width: 760px) {
  body.home-page-body #hero {
    min-height: 100svh !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero {
    min-height: 100svh !important;
  }
}

/* Round 5.20: mobile hero safety pass for multiple smartphone sizes.
   Scope: mobile only. Desktop remains untouched.
   Handles narrow phones, tall phones, short-height phones, and mobile landscape so the hero does not break. */
@media (max-width: 760px) {
  body.home-page-body #hero {
    min-height: 100svh !important;
    padding-top: clamp(68px, 8.8svh, 84px) !important;
    padding-bottom: max(14px, env(safe-area-inset-bottom)) !important;
  }

  body.home-page-body #hero .hero-content {
    min-height: calc(100svh - clamp(68px, 8.8svh, 84px) - max(14px, env(safe-area-inset-bottom))) !important;
    display: flex !important;
    flex-direction: column !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    height: clamp(392px, calc(100svh - 318px), 610px) !important;
    min-height: 0 !important;
    margin-bottom: clamp(8px, 1.5svh, 14px) !important;
    flex: 0 0 auto !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    object-position: center 60% !important;
    transform: scale(1.18) !important;
  }

  body.home-page-body #hero .hero-title {
    top: clamp(6px, 1.2svh, 14px) !important;
    max-width: min(320px, calc(100vw - 42px)) !important;
    font-size: clamp(40px, 13.7vw, 62px) !important;
    line-height: .90 !important;
  }

  body.home-page-body #hero .hero-actions {
    margin-top: clamp(-48px, -5.8svh, -30px) !important;
    gap: clamp(9px, 1.6svh, 12px) !important;
    flex: 0 0 auto !important;
  }

  body.home-page-body #hero .hero-actions .btn,
  body.home-page-body #hero .hero-actions .btn.ghost {
    min-height: clamp(48px, 6.2svh, 58px) !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }

  body.home-page-body #hero .hero-sub {
    max-width: min(300px, calc(100vw - 54px)) !important;
    margin: clamp(18px, 3.1svh, 30px) auto 0 !important;
    text-align: center !important;
    align-self: center !important;
  }

  html body #products {
    padding-top: 0 !important;
  }
}

@supports (height: 100dvh) {
  @media (max-width: 760px) {
    body.home-page-body #hero {
      min-height: 100dvh !important;
    }

    body.home-page-body #hero .hero-content {
      min-height: calc(100dvh - clamp(68px, 8.8dvh, 84px) - max(14px, env(safe-area-inset-bottom))) !important;
    }

    body.home-page-body #hero .hero-mobile-image {
      height: clamp(392px, calc(100dvh - 318px), 610px) !important;
    }
  }
}

/* Narrow Android/iPhone SE width safety. */
@media (max-width: 380px) {
  body.home-page-body #hero .hero-title {
    max-width: calc(100vw - 44px) !important;
    font-size: clamp(37px, 13.2vw, 52px) !important;
    letter-spacing: -1px !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    height: clamp(350px, calc(100svh - 300px), 500px) !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    object-position: center 58% !important;
    transform: scale(1.16) !important;
  }

  body.home-page-body #hero .hero-actions {
    margin-top: clamp(-42px, -5svh, -26px) !important;
  }

  body.home-page-body #hero .hero-actions .btn,
  body.home-page-body #hero .hero-actions .btn.ghost {
    font-size: 14px !important;
    letter-spacing: 1.25px !important;
  }

  body.home-page-body #hero .hero-sub {
    font-size: 10px !important;
    letter-spacing: 2px !important;
  }
}

/* Very narrow phones. */
@media (max-width: 340px) {
  body.home-page-body #hero .hero-title {
    font-size: clamp(34px, 12.8vw, 46px) !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    height: clamp(330px, calc(100svh - 286px), 460px) !important;
  }
}

/* Short-height phones / browser toolbar open. */
@media (max-width: 760px) and (max-height: 740px) {
  body.home-page-body #hero {
    padding-top: 66px !important;
  }

  body.home-page-body #hero .hero-content {
    min-height: calc(100svh - 80px) !important;
  }

  body.home-page-body #hero .hero-title {
    font-size: clamp(36px, 12.8vw, 54px) !important;
    top: 4px !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    height: clamp(310px, calc(100svh - 278px), 430px) !important;
  }

  body.home-page-body #hero .hero-mobile-image img {
    object-position: center 56% !important;
    transform: scale(1.14) !important;
  }

  body.home-page-body #hero .hero-actions {
    margin-top: -34px !important;
    gap: 9px !important;
  }

  body.home-page-body #hero .hero-actions .btn,
  body.home-page-body #hero .hero-actions .btn.ghost {
    min-height: 46px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  body.home-page-body #hero .hero-sub {
    margin-top: 14px !important;
    font-size: 9.8px !important;
    letter-spacing: 1.9px !important;
  }
}

/* Extra-short screens. Keep everything usable rather than forcing a broken single view. */
@media (max-width: 760px) and (max-height: 650px) {
  body.home-page-body #hero {
    min-height: auto !important;
    padding-bottom: 12px !important;
  }

  body.home-page-body #hero .hero-content {
    min-height: auto !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    height: 320px !important;
  }

  body.home-page-body #hero .hero-title {
    font-size: clamp(34px, 11.5vw, 46px) !important;
  }
}

/* Phone landscape safety. */
@media (max-width: 900px) and (max-height: 520px) and (orientation: landscape) {
  body.home-page-body #hero {
    min-height: auto !important;
    padding-top: 64px !important;
    padding-bottom: 18px !important;
  }

  body.home-page-body #hero .hero-content {
    width: min(720px, calc(100% - 32px)) !important;
    min-height: auto !important;
  }

  body.home-page-body #hero .hero-mobile-image {
    height: 72svh !important;
  }

  body.home-page-body #hero .hero-title {
    font-size: clamp(34px, 7vw, 50px) !important;
    max-width: 270px !important;
  }

  body.home-page-body #hero .hero-actions {
    margin-top: -26px !important;
  }

  body.home-page-body #hero .hero-sub {
    margin-top: 12px !important;
  }
}

/* Round 5.23: add a small mobile-only scroll cue in the free space under the hero subtitle.
   Desktop remains unchanged. */
.mobile-scroll-cue { display: none; }

@media (max-width: 760px) {
  body.home-page-body #hero .mobile-scroll-cue {
    order: 4 !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    align-self: center !important;
    margin: 15px auto 2px !important;
    color: rgba(255,255,255,.54) !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    font-size: 10px !important;
    line-height: 1 !important;
    letter-spacing: 2.4px !important;
    font-weight: 800 !important;
  }

  body.home-page-body #hero .mobile-scroll-cue i {
    display: block !important;
    width: 1px !important;
    height: 26px !important;
    background: linear-gradient(180deg, rgba(162,132,72,.95), rgba(162,132,72,0)) !important;
    position: relative !important;
  }

  body.home-page-body #hero .mobile-scroll-cue i::after {
    content: '' !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 0 !important;
    width: 8px !important;
    height: 8px !important;
    border-right: 1px solid rgba(162,132,72,.95) !important;
    border-bottom: 1px solid rgba(162,132,72,.95) !important;
    transform: translateX(-50%) rotate(45deg) !important;
  }
}

@media (max-width: 430px) {
  body.home-page-body #hero .mobile-scroll-cue {
    margin-top: 13px !important;
  }

  body.home-page-body #hero .mobile-scroll-cue i {
    height: 22px !important;
  }
}

/* Round 5.24: animate the mobile scroll cue so it clearly signals downward movement. */
@media (max-width: 760px) {
  body.home-page-body #hero .mobile-scroll-cue {
    animation: pcdMobileScrollCuePulse 1.8s ease-in-out infinite !important;
    will-change: transform, opacity !important;
  }

  body.home-page-body #hero .mobile-scroll-cue i {
    transform-origin: top center !important;
    animation: pcdMobileScrollLineDrop 1.8s ease-in-out infinite !important;
    will-change: transform, opacity !important;
  }

  body.home-page-body #hero .mobile-scroll-cue i::after {
    animation: pcdMobileScrollArrowDrop 1.8s ease-in-out infinite !important;
    will-change: transform, opacity !important;
  }
}

@keyframes pcdMobileScrollCuePulse {
  0%, 100% { opacity: .46; transform: translateY(0); }
  45% { opacity: .90; transform: translateY(4px); }
  70% { opacity: .62; transform: translateY(8px); }
}

@keyframes pcdMobileScrollLineDrop {
  0% { opacity: .35; transform: scaleY(.45); }
  35% { opacity: 1; transform: scaleY(1); }
  70% { opacity: .58; transform: scaleY(.65) translateY(6px); }
  100% { opacity: .35; transform: scaleY(.45); }
}

@keyframes pcdMobileScrollArrowDrop {
  0% { opacity: .30; transform: translateX(-50%) translateY(-3px) rotate(45deg); }
  40% { opacity: 1; transform: translateX(-50%) translateY(4px) rotate(45deg); }
  80% { opacity: .55; transform: translateX(-50%) translateY(9px) rotate(45deg); }
  100% { opacity: .30; transform: translateX(-50%) translateY(-3px) rotate(45deg); }
}


/* Round 5.31: domains cards collapse on mobile to reduce vertical scroll.
   Only the first card is shown initially; tapping it reveals the remaining cards
   with a smooth accordion animation. */
body.home-page-body #domains .pcd-domain-extra-wrap {
  display: contents !important;
}

@media (max-width: 760px) {
  body.home-page-body #domains .domain-grid.pcd-domain-collapsible {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  body.home-page-body #domains .domain-grid.pcd-domain-collapsible .domain-card {
    position: relative !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, rgba(255,255,255,1), rgba(249,249,249,1)) !important;
    border: 1px solid rgba(0,0,0,.07) !important;
    box-shadow: 0 12px 32px rgba(0,0,0,.06) !important;
  }

  body.home-page-body #domains .domain-grid.pcd-domain-collapsible .domain-card.pcd-domain-primary {
    cursor: pointer !important;
    transition: transform .22s ease, box-shadow .28s ease !important;
  }

  body.home-page-body #domains .domain-grid.pcd-domain-collapsible .domain-card.pcd-domain-primary:active {
    transform: scale(.995) !important;
  }

  body.home-page-body #domains .domain-grid.pcd-domain-collapsible .domain-card.pcd-domain-primary:hover {
    box-shadow: 0 16px 38px rgba(0,0,0,.08) !important;
  }

  body.home-page-body #domains .pcd-domain-extra-wrap {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    overflow: hidden !important;
    max-height: 0;
    opacity: 0 !important;
    transform: translateY(-6px) !important;
    margin-top: 0 !important;
    pointer-events: none !important;
    transition: max-height .5s cubic-bezier(.22,1,.36,1), opacity .32s ease, transform .32s ease, margin-top .32s ease !important;
  }

  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-extra-wrap {
    opacity: 1 !important;
    transform: translateY(0) !important;
    margin-top: 16px !important;
    pointer-events: auto !important;
  }

  body.home-page-body #domains .pcd-domain-extra-wrap .domain-card.pcd-domain-extra {
    opacity: 0 !important;
    transform: translateY(12px) !important;
    transition: opacity .34s ease, transform .34s ease !important;
  }

  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-extra-wrap .domain-card.pcd-domain-extra {
    opacity: 1 !important;
    transform: translateY(0) !important;
  }

  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-extra-wrap .domain-card.pcd-domain-extra:nth-child(1) { transition-delay: .04s !important; }
  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-extra-wrap .domain-card.pcd-domain-extra:nth-child(2) { transition-delay: .08s !important; }
  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-extra-wrap .domain-card.pcd-domain-extra:nth-child(3) { transition-delay: .12s !important; }

  body.home-page-body #domains .pcd-domain-toggle-meta {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-top: auto !important;
    padding-top: 16px !important;
    border-top: 1px solid rgba(162,132,72,.22) !important;
  }

  body.home-page-body #domains .pcd-domain-toggle-text {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    letter-spacing: 1.8px !important;
    text-transform: uppercase !important;
    font-weight: 900 !important;
    color: var(--accent, #a28448) !important;
  }

  body.home-page-body #domains .pcd-domain-toggle-text::before {
    content: '' !important;
    display: block !important;
    width: 18px !important;
    height: 1px !important;
    background: currentColor !important;
    opacity: .7 !important;
  }

  body.home-page-body #domains .pcd-domain-toggle-icon {
    position: relative !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(162,132,72,.28) !important;
    background: rgba(162,132,72,.08) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--accent, #a28448) !important;
    flex: 0 0 auto !important;
    transition: transform .28s ease, background .22s ease, border-color .22s ease !important;
  }

  body.home-page-body #domains .pcd-domain-toggle-icon::before,
  body.home-page-body #domains .pcd-domain-toggle-icon::after {
    content: '' !important;
    position: absolute !important;
    background: currentColor !important;
    border-radius: 2px !important;
    transition: transform .22s ease, opacity .22s ease !important;
  }

  body.home-page-body #domains .pcd-domain-toggle-icon::before {
    width: 10px !important;
    height: 1.8px !important;
  }

  body.home-page-body #domains .pcd-domain-toggle-icon::after {
    width: 1.8px !important;
    height: 10px !important;
  }

  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-toggle-icon {
    background: rgba(162,132,72,.14) !important;
    border-color: rgba(162,132,72,.42) !important;
    transform: rotate(180deg) !important;
  }

  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-toggle-icon::after {
    opacity: 0 !important;
    transform: scaleY(.35) !important;
  }
}

@keyframes pcdDomainCardReveal {
  0% { opacity: 0; transform: translateY(10px); }
  100% { opacity: 1; transform: translateY(0); }
}


/* Round 5.33: ensure expanded domain accordion always shows full card text on mobile. */
@media (max-width: 760px) {
  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-extra-wrap {
    max-height: 1200px !important;
  }

  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-extra-wrap .domain-card.pcd-domain-extra,
  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-extra-wrap .domain-card.pcd-domain-extra h3,
  body.home-page-body #domains .domain-grid.pcd-domain-collapsible.is-expanded .pcd-domain-extra-wrap .domain-card.pcd-domain-extra p {
    opacity: 1 !important;
    visibility: visible !important;
    max-height: none !important;
  }
}