/* Aurum Homes — fast, thumb-friendly responsive refinements */
.responsive-picture { display: contents; }

.nb-hero > .responsive-picture > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 53%;
}

.project-detail-hero > .responsive-picture > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.nb-intro-tall .responsive-picture > img,
.dale-page-visual .responsive-picture > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@supports (content-visibility: auto) {
  :is(
    .nb-intro,
    .nb-lifestyle,
    .nb-what,
    .nb-portfolio,
    .nb-factors,
    .nb-process,
    .nb-upcoming,
    .nb-why,
    .nb-faq,
    .nb-enquiry,
    .upcoming-featured-section,
    .upcoming-stage-section,
    .upcoming-collection,
    .upcoming-update-section,
    .upcoming-location-section,
    .dale-site-plan-section,
    .dale-lot-plans-section,
    .dale-bathroom-section,
    .dale-gallery-section,
    .dale-updates
  ) {
    content-visibility: auto;
    contain-intrinsic-size: auto 850px;
  }
}

@media (max-width: 760px) {
  :root { --shell: calc(100vw - 32px); }

  html {
    scroll-padding-top: 68px;
    -webkit-text-size-adjust: 100%;
  }

  body {
    padding-bottom: calc(72px + env(safe-area-inset-bottom));
    overflow-x: hidden;
  }

  .section { padding: 64px 0; }

  /* Compact header and menu: five primary choices fit without an oversized scroll. */
  .site-header.nb-site-header,
  .site-header.nb-site-header-home,
  .site-header,
  .site-header-overlay {
    height: 64px;
    background: rgba(255, 255, 255, .98);
    backdrop-filter: none;
  }

  .nb-header-inner,
  .header-inner {
    width: calc(100vw - 28px);
    height: 64px;
  }

  .nb-header-brand .brand-full { width: 88px; }
  .nb-header-brand .brand-logo { max-height: 52px; }

  .mobile-menu summary {
    width: 44px;
    height: 44px;
    touch-action: manipulation;
  }

  .mobile-menu[open] summary { top: 10px; right: 14px; }

  .mobile-menu-surface {
    padding: 12px 16px calc(28px + env(safe-area-inset-bottom));
    background: linear-gradient(150deg, #0b3b45, #062831 72%);
  }

  .mobile-menu-surface::after { display: none; }
  .mobile-menu-top { min-height: 42px; padding-right: 60px; }
  .mobile-menu-top .brand { width: 108px; }
  .mobile-menu .mobile-menu-surface nav { padding-top: 18px; }

  .mobile-menu .mobile-nav-primary > a,
  .mobile-menu .mobile-nav-primary > a[href="/upcoming-projects"] {
    grid-template-columns: 28px 1fr 20px;
    gap: 9px;
    min-height: 58px;
  }

  .mobile-menu .mobile-nav-primary > a strong,
  .mobile-menu .mobile-nav-primary > a[href="/upcoming-projects"] strong {
    font-size: clamp(27px, 7.4vw, 32px);
    line-height: 1;
  }

  .mobile-menu-projects { display: none; }

  .mobile-menu-upcoming {
    min-height: 56px;
    margin-top: 12px;
    padding: 10px 0;
  }

  .mobile-menu-contact {
    gap: 12px 18px;
    margin-top: 14px;
    padding-top: 14px;
  }

  .mobile-menu .mobile-menu-contact a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  /* Fast, safe-area-aware quick actions. */
  .nb-floating-contact { display: none; }

  .mobile-action-bar {
    right: 10px;
    bottom: calc(8px + env(safe-area-inset-bottom));
    left: 10px;
    min-height: 56px;
    background: #072f39;
    border-radius: 3px;
    backdrop-filter: none;
  }

  .mobile-action-bar a {
    min-height: 54px;
    padding: 8px 14px;
    touch-action: manipulation;
  }

  .mobile-action-bar strong { font-size: 16px; }

  /* Homepage opening: less vertical crowding and a much smaller mobile image. */
  .nb-hero {
    min-height: 610px;
    height: calc(100svh - 64px);
    max-height: 760px;
  }

  .nb-hero > .responsive-picture > img {
    object-position: 60% center;
  }

  .project-detail-hero > .responsive-picture > img { object-position: 57% center; }

  .nb-hero-inner {
    justify-content: center;
    padding: 44px 0 58px;
  }

  .nb-hero-kicker { margin-bottom: 20px; }
  .nb-hero h1 { font-size: clamp(47px, 13.8vw, 61px); line-height: .87; }
  .nb-hero h1 span:nth-child(2) { margin-left: .12em; }
  .nb-hero h1 span:nth-child(3) { margin-left: .24em; }
  .nb-hero-bottom { gap: 18px; margin-top: 26px; }
  .nb-hero-bottom p { max-width: 100%; line-height: 1.58; }
  .nb-hero-bottom .nb-solid-button { min-height: 50px; }

  /* Reduce below-fold work while keeping all original project photography. */
  .nb-intro,
  .nb-lifestyle,
  .nb-portfolio,
  .nb-factors,
  .nb-process,
  .nb-upcoming,
  .nb-faq,
  .nb-enquiry { padding-block: 70px; }

  .nb-intro-wide { width: 100%; margin-top: 40px; }
  .nb-intro-tall { min-height: 520px; }
  .nb-lifestyle-image { height: 420px; }
  .nb-mosaic { grid-template-columns: repeat(2, 1fr); }
  .nb-mosaic img { aspect-ratio: 1; }
  .nb-mosaic > span { font-size: 28vw; }
  .nb-factors-grid figure img { aspect-ratio: 1.05; }
  .nb-process-list article { min-height: 0; }
  .nb-process-list img { height: 150px; }

  /* Upcoming projects: concise cards and horizontal, swipeable detail rails. */
  .upcoming-page-hero { padding-top: 50px; }
  .upcoming-page-hero-grid { gap: 24px; }
  .upcoming-page-hero h1 { font-size: clamp(45px, 13vw, 57px); line-height: .91; }
  .upcoming-address-strip { margin-top: 38px; }
  .upcoming-address-strip a { flex-basis: 170px; min-height: 82px; }

  .upcoming-featured-section { padding: 62px 0 68px; }
  .upcoming-featured-visual,
  .upcoming-featured-visual .under-design-visual { min-height: 315px; }
  .upcoming-featured-copy { padding-top: 34px; }
  .upcoming-featured-copy h2 { font-size: 37px; }
  .upcoming-featured-copy > .upcoming-featured-lead { font-size: 14px; }
  .upcoming-featured-facts { grid-template-columns: 1fr 1fr; }
  .upcoming-featured-facts > div { min-height: 82px; padding: 15px; }

  .upcoming-featured-gallery,
  .dale-gallery-grid {
    display: flex;
    width: 100%;
    max-width: none;
    gap: 10px;
    margin: 8px 0 0;
    padding: 0 16px 10px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-padding-left: 16px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .upcoming-featured-gallery::-webkit-scrollbar,
  .dale-gallery-grid::-webkit-scrollbar,
  .upcoming-stage-grid::-webkit-scrollbar,
  .upcoming-benefit-grid::-webkit-scrollbar { display: none; }

  .upcoming-featured-gallery figure,
  .upcoming-featured-gallery .upcoming-featured-gallery-wide,
  .dale-gallery-grid figure,
  .dale-gallery-grid figure.dale-gallery-wide {
    flex: 0 0 84vw;
    height: 235px;
    min-height: 235px;
    scroll-snap-align: center;
  }

  .upcoming-stage-section { padding: 66px 0 72px; overflow: hidden; }
  .upcoming-stage-heading { gap: 18px; }
  .upcoming-stage-heading h2 { font-size: 38px; }

  .upcoming-stage-grid {
    display: flex;
    gap: 10px;
    margin: 34px -16px 0;
    padding: 0 16px 10px;
    overflow-x: auto;
    border: 0;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .upcoming-stage-grid li,
  .upcoming-stage-grid li:last-child {
    flex: 0 0 78vw;
    min-height: 238px;
    padding: 24px 22px;
    background: rgba(255, 255, 255, .74);
    border: 1px solid rgba(8,47,56,.16);
    scroll-snap-align: start;
  }

  .upcoming-stage-grid h3 { margin-top: 34px; }

  .upcoming-collection { padding-top: 66px; }
  .upcoming-collection-heading { margin-bottom: 30px; }
  .upcoming-collection-heading h2 { font-size: 38px; }
  .upcoming-card-grid { gap: 17px; }
  .upcoming-card { box-shadow: 0 10px 34px rgba(8,47,56,.07); }
  .upcoming-card-project-image { min-height: 250px; }
  .upcoming-card .under-design-visual { min-height: 240px; padding: 62px 20px 32px; }
  .upcoming-card-content { padding: 23px 19px 24px; }
  .upcoming-card h2 { font-size: 34px; }
  .upcoming-card-index { margin-top: 22px; }
  .upcoming-address { margin-top: 17px; }
  .upcoming-description { margin: 20px 0 22px; }
  .upcoming-card-facts { grid-template-columns: 1fr 1fr; margin-bottom: 24px; }
  .upcoming-card-facts > .upcoming-card-fact-wide { grid-column: 1 / -1; }
  .upcoming-card-facts > div { min-height: 72px; padding: 14px; }
  .upcoming-card-actions { gap: 12px; padding-top: 18px; }

  .upcoming-update-section { padding: 68px 0 72px; overflow: hidden; }
  .upcoming-update-grid { gap: 36px; }
  .upcoming-update-intro h2 { font-size: 39px; }

  .upcoming-benefit-grid {
    display: flex;
    gap: 10px;
    margin-right: -16px;
    padding: 0 16px 8px 0;
    overflow-x: auto;
    border: 0;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .upcoming-benefit-grid article {
    flex: 0 0 78vw;
    min-height: 220px;
    padding: 24px 22px;
    border: 1px solid var(--line);
    scroll-snap-align: start;
  }

  .upcoming-benefit-grid h3 { margin-top: 34px; }
  .upcoming-project-note { margin-top: 18px; }
  .upcoming-location-section { padding: 68px 0; }
  .upcoming-location-grid { gap: 30px; }
  .upcoming-location-grid h2 { font-size: 39px; }
  .upcoming-location-list a { min-height: 82px; }

  /* Dale Terraces detail: image-first, but no five-image vertical marathon. */
  .dale-page-hero { padding: 22px 0 48px; }
  .dale-page-grid { gap: 34px; }
  .project-back-dark { min-height: 44px; margin-bottom: 26px; }
  .dale-page-copy h1 { font-size: clamp(57px, 18vw, 74px); line-height: .8; }
  .dale-page-copy > p:not(.eyebrow) { margin-top: 24px; }
  .dale-page-actions { gap: 10px; margin-top: 27px; }
  .dale-page-actions .text-link { min-height: 44px; }
  .dale-page-visual { height: 330px; }
  .dale-page-facts { margin-top: 34px; }
  .dale-page-facts > div,
  .dale-page-facts > div + div { min-height: 78px; padding: 16px 10px 16px 0; }
  .dale-page-facts dd { font-size: 16px; }

  .dale-gallery-section { padding: 66px 0 72px; overflow: hidden; }
  .dale-gallery-heading { gap: 18px; margin-bottom: 30px; }
  .dale-gallery-heading h2 { font-size: 38px; }
  .dale-gallery-grid { padding-left: 16px; }
  .dale-updates { padding: 68px 0; }
  .dale-updates-grid { gap: 32px; }
  .dale-updates-heading h2 { font-size: 38px; }
  .dale-update-list li { padding: 22px 0 25px; }

  /* Improve tap behaviour and avoid costly hover animation on touch devices. */
  :is(a, button, summary, input, select, textarea) { touch-action: manipulation; }
  :is(.upcoming-featured-gallery, .dale-gallery-grid, .dale-lot-plan-grid, .upcoming-stage-grid, .upcoming-benefit-grid) { cursor: grab; }
}

@media (max-width: 390px) {
  .nb-hero { min-height: 570px; }
  .nb-hero h1 { font-size: 45px; }
  .mobile-action-bar span { display: none; }
  .mobile-action-bar strong { margin: 0; }
  .upcoming-featured-facts { grid-template-columns: 1fr; }
  .upcoming-featured-facts > div { min-height: 70px; }
  .upcoming-card-actions { align-items: stretch; flex-direction: column; }
}

@media (hover: none), (pointer: coarse) {
  :is(
    .nb-solid-button,
    .nb-floating-contact,
    .nb-mosaic img,
    .project-card img,
    .project-choice-image img,
    .upcoming-featured-gallery img,
    .upcoming-card-project-image img,
    .dale-lot-plan-image img,
    .dale-gallery-grid img
  ) {
    transition: none !important;
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
