/*
Theme Name: Paradise Community Homes Custom
Theme URI: https://paradisecommunityhomes.org/
Author: Custom theme conversion
Description: Custom WordPress theme converted from the PCH static HTML site proof. Includes static page templates, local assets, clean internal WordPress links, and easy-to-find edit markers.
Version: 1.3.6
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: Proprietary
Text Domain: pch-custom
*/

/* EDIT MARKER: MOBILE LAYOUT STABILIZATION PASS START
   Version 1.0.8: Prevents decorative image/card layers from stacking on top of each other on phones.
   Desktop styling remains controlled by the page templates. */
@media (max-width: 900px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .site-shell,
  main,
  section,
  .section-inner {
    width: 100%;
    max-width: 100%;
  }

  section {
    clear: both;
  }

  .hero,
  .mission-grid,
  .home-card,
  .cta-card,
  .application-shell,
  .contact-grid,
  .builder-grid,
  .homebuyer-grid,
  .future-grid,
  .story-grid,
  .process-grid,
  .split-section {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .hero-visual,
  .photo-stack,
  .image-collage,
  .visual-stack,
  .image-stack {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    overflow: visible !important;
    transform: none !important;
  }

  .photo-main,
  .photo-secondary,
  .apply-photo-main,
  .future-photo-main,
  .home-photo-main,
  .builder-photo-main,
  .contact-photo-main,
  .looking-photo-main,
  .collage-img,
  .collage-img.one,
  .collage-img.two,
  .image-card,
  .hero-image,
  .visual-card {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    height: clamp(230px, 58vw, 380px) !important;
    border-radius: 26px !important;
    transform: none !important;
    overflow: hidden !important;
  }

  .photo-secondary,
  .collage-img.two {
    height: clamp(190px, 48vw, 320px) !important;
  }

  .floating-card,
  .floating-badge,
  .floating-progress,
  .status-card,
  .hero-card,
  .info-badge,
  .availability-card,
  .project-card,
  .quick-card {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    transform: none !important;
    animation: none !important;
    border-radius: 24px !important;
    z-index: 1 !important;
  }

  .home-card {
    overflow: hidden !important;
    border-radius: 30px !important;
  }

  .home-gallery {
    min-height: 340px !important;
    height: auto !important;
    border-radius: 0 !important;
  }

  .home-info {
    padding: 28px 22px !important;
  }

  .gallery-pills {
    left: 16px !important;
    right: 16px !important;
    top: 16px !important;
    gap: 8px !important;
  }

  .pill {
    font-size: 11px !important;
    padding: 8px 10px !important;
  }

  .home-gallery-caption {
    left: 20px !important;
    right: 20px !important;
    bottom: 20px !important;
  }

  .home-gallery-caption strong {
    font-size: clamp(26px, 8vw, 34px) !important;
  }

  .mission-card,
  .intro-card,
  .eligibility-card,
  .form-card,
  .resource-card,
  .contact-card,
  .story-card,
  .future-card,
  .builder-card,
  .homebuyer-card,
  .submit-card,
  .stat-card,
  .mini-stat,
  .spec {
    overflow: visible !important;
  }

  .progress-section,
  .resources {
    background-attachment: scroll !important;
  }

  .reveal,
  .reveal.is-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

@media (max-width: 680px) {
  .nav-wrap {
    padding: 8px 10px !important;
  }

  .hero {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  section {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .section-heading,
  .section-heading.center {
    text-align: left !important;
    margin-bottom: 22px !important;
  }

  .lead,
  .hero-copy,
  p {
    overflow-wrap: break-word;
  }

  .hero-actions,
  .btn-row,
  .card-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    width: 100% !important;
  }

  .btn,
  .hero-actions .btn,
  .btn-row .btn,
  .card-actions .btn,
  .cta-card .btn,
  .submit-card .btn {
    width: 100% !important;
    min-height: 48px;
    padding-left: 14px !important;
    padding-right: 14px !important;
    white-space: normal !important;
    text-align: center !important;
  }

  .spec-grid,
  .stat-grid,
  .progress-grid,
  .partner-grid,
  .resource-grid,
  .field-grid,
  .choice-grid,
  .cards-grid,
  .home-grid,
  .future-list,
  .footer-links {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .home-gallery {
    min-height: 315px !important;
  }

  .home-info,
  .mission-card,
  .intro-card,
  .eligibility-card,
  .form-card,
  .resource-card,
  .contact-card,
  .story-card,
  .future-card,
  .builder-card,
  .homebuyer-card,
  .submit-card {
    padding: 24px 22px !important;
    border-radius: 26px !important;
  }

  .floating-card,
  .floating-badge,
  .floating-progress,
  .status-card,
  .hero-card,
  .info-badge,
  .availability-card,
  .project-card,
  .quick-card {
    padding: 20px !important;
  }
}
/* EDIT MARKER: MOBILE LAYOUT STABILIZATION PASS END */


/* EDIT MARKER: DESKTOP HEADER CONTAINER FIT PASS START
   Version 1.0.9: Keeps the Apply Now button inside the rounded desktop header container without changing page content. */
@media (min-width: 1041px) {
  .nav {
    width: min(100%, calc(100vw - 72px)) !important;
    max-width: 1320px !important;
    padding-left: clamp(14px, 1.35vw, 24px) !important;
    padding-right: clamp(14px, 1.35vw, 24px) !important;
    gap: clamp(14px, 1.4vw, 24px) !important;
  }

  .brand-logo {
    width: clamp(150px, 12vw, 210px) !important;
  }

  .nav-menu {
    min-width: 0 !important;
    gap: clamp(10px, 1.05vw, 20px) !important;
    font-size: clamp(12px, .84vw, 14px) !important;
    letter-spacing: .075em !important;
  }

  .nav-menu .btn {
    flex: 0 0 auto !important;
    padding-left: clamp(15px, 1.3vw, 20px) !important;
    padding-right: clamp(15px, 1.3vw, 20px) !important;
  }
}
/* EDIT MARKER: DESKTOP HEADER CONTAINER FIT PASS END */


/* EDIT MARKER: COMMUNITY NAVIGATION + NEW PAGE SUPPORT START
   Version 1.2.0: Adds a compact Explore dropdown so FAQ and Community Updates are easy to find
   without overcrowding the existing desktop header. */
.nav-dropdown {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.nav-dropdown-toggle {
  appearance: none;
  border: 0;
  background: transparent;
  color: rgba(22, 35, 30, .78);
  padding: 8px 0;
  font: inherit;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  cursor: pointer;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  position: relative;
}

.nav-dropdown-toggle::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 3px;
  width: 0;
  height: 2px;
  border-radius: 99px;
  background: #53a36b;
  transition: width .3s cubic-bezier(.2,.8,.2,1);
}

.nav-dropdown:hover .nav-dropdown-toggle::after,
.nav-dropdown:focus-within .nav-dropdown-toggle::after,
.nav-dropdown-toggle.active::after {
  width: 100%;
}

.nav-dropdown-caret {
  font-size: .82em;
  line-height: 1;
  transition: transform .2s ease;
}

.nav-dropdown:hover .nav-dropdown-caret,
.nav-dropdown:focus-within .nav-dropdown-caret {
  transform: rotate(180deg);
}

.nav-dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  min-width: 210px;
  padding: 10px;
  border-radius: 18px;
  border: 1px solid rgba(17,45,37,.1);
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 48px rgba(17,45,37,.17);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -6px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
  z-index: 80;
}

.nav-dropdown-menu::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -12px;
  height: 12px;
}

.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

.nav-menu .nav-dropdown-menu a,
.nav-menu .nav-dropdown-menu a:not(.btn) {
  display: block;
  padding: 11px 12px;
  border-radius: 12px;
  text-transform: none;
  letter-spacing: 0;
  font-size: 14px;
  line-height: 1.25;
  color: #173a30;
}

.nav-menu .nav-dropdown-menu a::after,
.nav-menu .nav-dropdown-menu a:not(.btn)::after {
  display: none;
}

.nav-menu .nav-dropdown-menu a:hover,
.nav-menu .nav-dropdown-menu a:focus,
.nav-menu .nav-dropdown-menu a.active {
  background: #eef5eb;
  color: #112d25;
  outline: none;
}

@media (max-width: 1040px) {
  .nav-dropdown { display: none !important; }
}
/* EDIT MARKER: COMMUNITY NAVIGATION + NEW PAGE SUPPORT END */
