/* G2 (curvature-continuous) corners.
   A circular border-radius meets the straight edge with a visible tangent
   jump in curvature (G1). A squircle eases the curvature in and out (G2),
   which is what makes Apple-style surfaces look "poured" rather than cut.
   corner-shape: squircle is progressive enhancement (Chromium 139+);
   other browsers keep the plain border-radius below as a fallback. */
:root {
  --g2-xs: 8px;
  --g2-sm: 12px;
  --g2-md: 18px;
  --g2-lg: 26px;
  --g2-shape: squircle;
  --g2-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Buttons and controls */
.btn, .lp-btn-gold, .lp-btn-outline, .lp-nav-cta, .lp-suite-cta, .hero-search-submit,
.dir-reset, .dir-view, .lp-form-submit, .float-cta, .lp-float-whatsapp {
  border-radius: var(--g2-sm); corner-shape: var(--g2-shape);
}
.dir-chip, .pim-chip, .hero-search-tabs button, .lp-toggle-group button, .listing-badge, .dir-badge, .pim-result-badge {
  border-radius: var(--g2-xs); corner-shape: var(--g2-shape);
}
.form-field input, .form-field select, .form-field textarea,
.lp-form-field input, .lp-form-field select, .lp-form-field textarea,
.hero-search-field input, .hero-search-field select,
.dir-field input, .dir-field select {
  border-radius: var(--g2-sm); corner-shape: var(--g2-shape);
}

/* Cards and panels */
.listing-card, .area-card, .journal-card, .dir-card, .floorplan-card,
.faq-item, .lp-faq-item, .related-link-card, .lp-collection-card, .lp-suite-item,
.dir-empty, .listing-empty, .lp-notice {
  border-radius: var(--g2-md); corner-shape: var(--g2-shape); overflow: hidden;
}
.enquiry-card, .hero-search, .pim-search-results, .wechat-modal-card,
.lp-register-grid > *:last-child, .lp-form {
  border-radius: var(--g2-lg); corner-shape: var(--g2-shape);
}
.pim-search-results { overflow: hidden; }

/* Imagery */
.gallery-main, .lp-quote-photo, .lp-location-photo, .lp-suite-plan-frame,
.loc-figure img, .lp-loc-figure img, .tour-frame, .lp-tour-frame, .dir-thumb,
.gallery-thumb, .gallery-thumb img, .area-image, .listing-image, .journal-image {
  border-radius: var(--g2-md); corner-shape: var(--g2-shape); overflow: hidden;
}
.area-image, .listing-image, .journal-image, .dir-thumb { border-radius: 0; }
.gallery-thumb, .gallery-thumb img { border-radius: var(--g2-xs); }
.article-featured-image {
  width: min(100% - 32px, 1200px); margin: 0 auto; border-radius: var(--g2-lg); corner-shape: var(--g2-shape);
}
.floorplan-card img { border-radius: var(--g2-sm) var(--g2-sm) 0 0; }

/* Cards that clip their own image: round the top corners only, via the card itself */
.listing-card, .area-card, .journal-card, .dir-card { background-clip: padding-box; }

/* Interactive lift that keeps the curve: transform only, no re-layout */
.listing-card, .area-card, .journal-card, .dir-card, .related-link-card {
  transition: transform 0.5s var(--g2-ease), box-shadow 0.5s var(--g2-ease), border-color 0.3s ease;
}
@media (hover: hover) {
  .listing-card:hover, .area-card:hover, .journal-card:hover, .dir-card:hover, .related-link-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 40px rgba(20, 18, 15, 0.12);
  }
}
@media (prefers-reduced-motion: reduce) {
  .listing-card, .area-card, .journal-card, .dir-card, .related-link-card { transition: none; }
  .listing-card:hover, .area-card:hover, .journal-card:hover, .dir-card:hover, .related-link-card:hover { transform: none; }
}

/* Keep the dark header and full-bleed heroes square: they touch the viewport edge */
header.site, .lp-nav, .hero, .lp-hero, footer.site, .lp-footer { border-radius: 0; }

@media (max-width: 640px) {
  :root { --g2-md: 14px; --g2-lg: 20px; }
  .article-featured-image { width: calc(100% - 24px); }
}

/* The wordmark tagline collides with the nav on mid-width screens */
@media (max-width: 1180px) {
  header.site .wordmark > span:last-child:not(.accent-dot) { display: none; }
}
