/* ==========================================================================
   WEDDINGS MINE HOSPITALITY — RESPONSIVE STYLES
   Fluid Business Layouts · Multi-Device Usability · Zero Horizontal Overflow
   ========================================================================== */

/* --------------------------------------------------------------------------
   Desktop & Tablet Landscape (Max 1199px)
   -------------------------------------------------------------------------- */
@media (max-width: 1199px) {
  :root {
    --header-height: 74px;
  }

  .container {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  /* Services 3-Col to 2-Col fallback if screen is cramped */
  .services-editorial-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
  }

  .destinations-collection-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }

  .dest-item.dest-large {
    grid-column: span 2;
    height: 420px;
  }

  .dest-item.dest-medium,
  .dest-item.dest-standard {
    grid-column: span 1;
    height: 340px;
  }

  .venues-setting-grid,
  .venues-editorial-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2.25rem 1.75rem;
  }

  .venues-guide-editorial-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2.25rem 1.75rem;
  }

  .venues-category-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.75rem 1rem;
  }

  .venue-cat-sep {
    display: none;
  }

  /* Portfolio Editorial Grid (Tablet 2-column) */
  .portfolio-masonry-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }

  .portfolio-editorial-centerpiece,
  .portfolio-card.masonry-large {
    grid-column: span 2;
    grid-row: auto;
    min-height: 460px;
  }

  .portfolio-item-supporting,
  .portfolio-item-small,
  .portfolio-item-medium-left,
  .portfolio-item-medium-right,
  .portfolio-card.masonry-portrait,
  .portfolio-card.masonry-medium {
    grid-column: span 1;
    min-height: 320px;
  }

  .portfolio-item-wide,
  .portfolio-card.masonry-wide {
    grid-column: span 2;
    min-height: 360px;
  }

  .footer-main-grid {
    grid-template-columns: 1.35fr 0.95fr 1.05fr 0.95fr 1.15fr;
    gap: 2rem;
  }
}

/* --------------------------------------------------------------------------
   Desktop Narrow / Tablet Landscape (992px to 1199px)
   -------------------------------------------------------------------------- */
@media (min-width: 992px) and (max-width: 1199px) {
  .header-container {
    grid-template-columns: 140px 1fr auto;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .header-logo {
    width: 105px;
    max-height: 52px;
  }

  .header-nav {
    gap: 16px;
  }

  .header-nav a {
    font-size: 13.5px;
  }

  .header-actions {
    gap: 0.85rem;
  }

  .header-divider {
    display: inline-block;
    height: 20px;
    margin-right: 0.15rem;
  }

  .header-whatsapp {
    font-size: 13.5px;
    gap: 6px;
  }

  .header-cta-btn {
    height: 40px;
    padding: 0 18px;
    font-size: 11px;
  }
}

/* --------------------------------------------------------------------------
   Tablet Portrait & Mobile (Max 991px)
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
  :root {
    --header-height: 68px;
  }

  .editorial-header {
    height: 68px;
  }

  .header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .brand-mark {
    flex: 0 0 auto;
  }

  .header-logo {
    width: 100px;
    max-height: 50px;
  }

  /* Hide desktop actions in header bar, show mobile elements */
  .header-actions .header-whatsapp,
  .header-actions .header-cta-btn,
  .header-actions .header-divider {
    display: none;
  }

  .mobile-toggle {
    display: flex;
  }

  .header-actions {
    gap: 0.75rem;
  }

  .mobile-header-wa {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: #25D366;
    border: 1px solid rgba(168, 132, 66, 0.25);
    border-radius: 4px;
    transition: all 0.2s ease;
  }

  .mobile-header-wa:hover {
    color: #A9823E;
    border-color: #A9823E;
  }

  .section-space-lg {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }

  .section-space-md {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  /* Full Luxury Mobile Navigation Drawer */
  .nav-container {
    display: flex;
    position: fixed;
    top: var(--header-height, 70px);
    left: 0;
    width: 100%;
    height: calc(100vh - var(--header-height, 70px));
    background-color: #F8F4EC;
    flex-direction: column;
    justify-content: space-between;
    padding: 2.25rem 2rem 2.5rem;
    border-top: 1px solid rgba(168, 132, 66, 0.25);
    box-shadow: 0 20px 40px rgba(27, 20, 16, 0.08);
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.35s ease;
    z-index: 999;
    overflow-y: auto;
  }

  .nav-container.active {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
  }

  .mobile-drawer-brand {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 1.25rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid rgba(168, 132, 66, 0.16);
    width: 100%;
  }

  .mobile-nav-logo {
    width: 110px;
    height: auto;
    max-height: 55px;
    object-fit: contain;
    display: block;
  }

  .header-nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.15rem;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .header-nav li {
    width: 100%;
  }

  .header-nav a {
    font-size: 1.15rem;
    font-family: 'Manrope', sans-serif;
    font-weight: 600;
    color: #2B2621;
    display: block;
    padding: 0.65rem 0;
    border-bottom: 1px solid rgba(168, 132, 66, 0.14);
    width: 100%;
    text-transform: none;
    letter-spacing: 0;
    text-decoration: none;
    transition: color 200ms ease;
  }

  .header-nav a::after {
    display: none;
  }

  .header-nav a:hover,
  .header-nav a.active {
    color: #A9823E;
  }

  .mobile-drawer-actions {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    width: 100%;
    padding-top: 1.5rem;
  }

  .mobile-wa-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.8rem 1.25rem;
    background: transparent;
    color: #29231E;
    border: 1px solid rgba(168, 132, 66, 0.35);
    border-radius: 3px;
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 200ms ease;
  }

  .mobile-wa-link .header-wa-icon {
    color: #25D366;
  }

  .mobile-wa-link:hover {
    color: #A77C35;
    border-color: #A77C35;
  }

  .mobile-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.88rem 1.25rem;
    background: #B58A43;
    color: #201A15;
    border-radius: 3px;
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(30, 23, 19, 0.08);
    border: 1px solid rgba(169, 130, 62, 0.45);
    text-align: center;
    transition: all 200ms ease;
  }

  .mobile-cta-btn:hover {
    background: #9E7430;
    color: #16110D;
  }

  /* Introduction (Tablet) */
  .intro-section {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .intro-editorial-spread {
    display: flex;
    flex-direction: column;
    gap: 2.25rem;
  }

  .intro-story-col {
    display: contents;
  }

  .intro-visual-col {
    display: contents;
  }

  .intro-story-header {
    order: 1;
  }

  .intro-photo-frame {
    order: 2;
    height: 420px;
  }

  .intro-supporting-note {
    order: 3;
    margin-top: 0.25rem;
  }

  .intro-trust-strip {
    order: 4;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
  }

  /* Services Showcase (Tablet) */
  .services-preview-spread {
    grid-template-columns: 1fr;
    gap: 2.25rem;
  }

  .services-preview-frame {
    height: clamp(300px, 45vw, 380px);
  }

  .services-editorial-flow {
    gap: 2.5rem;
  }

  .home-service-row,
  .home-service-row.reverse {
    grid-template-columns: 1fr;
    gap: 1.75rem;
    direction: ltr !important;
  }

  .home-service-row.reverse > * {
    direction: ltr !important;
  }

  .home-service-media {
    height: 300px;
  }

  /* Featured Weddings Hierarchy (Tablet) */
  .featured-weddings-top-tier {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .wedding-hero-card {
    min-height: 420px;
  }

  .featured-weddings-bottom-tier {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .wedding-medium-card {
    height: 280px;
  }

  /* Services 2-Col on Tablet */
  .services-editorial-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.75rem;
  }

  /* Destinations */
  .destinations-collection-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }

  .dest-item.dest-large {
    grid-column: span 2;
    height: 380px;
  }

  .dest-item.dest-medium,
  .dest-item.dest-standard {
    grid-column: span 1;
    height: 320px;
  }

  /* Venues */
  .venues-setting-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2.25rem 1.75rem;
  }

  /* Portfolio Masonry */
  .portfolio-masonry-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 230px;
    gap: 1.5rem;
  }

  /* Featured Wedding Case Study Spread */
  .case-study-main-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .case-study-media {
    min-height: 400px;
  }

  .case-study-story-box {
    padding: 0;
  }

  .case-study-specs-strip {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }

  /* Why Us Brand Split (Tablet) */
  .why-section {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .why-brand-split {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .why-brand-narrative {
    position: static;
  }

  .why-brand-statement {
    max-width: 100%;
  }

  .why-principle-content {
    grid-template-columns: 65px 1fr;
    gap: 1.25rem;
  }

  /* Planning Journey (Tablet) */
  .journey-flow {
    gap: 1.25rem;
  }

  .journey-step,
  .journey-step--1,
  .journey-step--2,
  .journey-step--3,
  .journey-step--4 {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .journey-step-media {
    flex: 0 0 240px;
    max-width: 240px;
  }

  .journey-media-frame {
    height: 130px;
  }

  /* Process Timeline */
  .process-timeline-bar {
    display: none;
  }

  .process-timeline-steps {
    grid-template-columns: repeat(2, 1fr);
    gap: 2.5rem 2rem;
  }

  .process-milestone-dot {
    display: none;
  }

  .process-timeline-step {
    padding-top: 0;
    text-align: left;
  }

  .process-step-num {
    margin-bottom: 0.5rem;
  }

  /* Hospitality Editorial Split (Tablet) */
  .hospitality-section {
    padding-top: 90px;
    padding-bottom: 90px;
  }

  .hospitality-desktop-header {
    display: none;
  }

  .hospitality-mobile-header {
    display: block;
    margin-bottom: 2.25rem;
  }

  .hospitality-editorial-grid {
    grid-template-columns: 1fr;
    gap: 3rem;
  }

  .hospitality-photo-col {
    order: 1;
  }

  .hospitality-narrative-col {
    order: 2;
    padding-top: 0;
  }

  .hospitality-gold-accent-line {
    display: none;
  }

  .hospitality-image-frame {
    height: 480px;
  }

  /* About / Founder Spread */
  .about-editorial-spread {
    grid-template-columns: 1fr;
    gap: 3.5rem;
  }

  .about-founder-portrait {
    height: 460px;
  }

  /* Blog */
  .blog-editorial-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
  }

  /* Enquiry */
  .enquiry-editorial-split {
    grid-template-columns: 1fr;
    gap: 3.5rem;
  }

  /* Pride Moments (Tablet Split/Stack) */
  .pride-split-grid {
    grid-template-columns: 1fr;
    gap: 3.5rem;
  }

  .pride-photo-frame {
    height: clamp(440px, 52vw, 560px);
  }

  .pride-top-crest {
    justify-content: flex-start;
  }

  /* Testimonials Editorial Spread (Tablet) */
  .testi-editorial-spread {
    grid-template-columns: 280px 1fr;
    grid-template-rows: auto auto;
    gap: 1.75rem;
  }

  .testi-photo-frame {
    height: 480px;
  }

  .testi-center-col {
    grid-column: 2;
    grid-row: 1;
  }

  .testi-floating-card {
    margin-left: 0;
  }

  .testi-controls-wrapper {
    grid-column: 2;
    grid-row: 2;
    margin-top: 1.25rem;
  }

  .testimonial-slider-controls {
    margin-left: 0;
  }

  .testi-decor-col {
    display: none;
  }

  /* Footer */
  .footer-main-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2.75rem 2rem;
  }

  .footer-brand-col {
    grid-column: 1 / -1;
    max-width: 520px;
  }
}

/* --------------------------------------------------------------------------
   Mobile Phones (Max 600px)
   -------------------------------------------------------------------------- */
@media (max-width: 600px) {
  :root {
    --header-height: 66px;
  }

  body {
    font-size: 1rem;
    line-height: 1.75;
  }

  p {
    font-size: 1rem;
    line-height: 1.75;
  }

  .container {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .section-space-lg {
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
  }

  .section-space-md {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }

  .section-title {
    font-size: 2.1rem;
  }

  .header-logo {
    width: 98px;
    max-width: 102px;
    height: auto;
    max-height: 48px;
  }

  /* Hero */
  .hero-editorial-art {
    min-height: 76vh;
    padding-top: calc(var(--header-height, 76px) + 1.5rem);
    padding-bottom: 3.25rem;
  }

  .hero-huge-headline {
    font-size: clamp(1.95rem, 7.2vw, 2.35rem);
    line-height: 1.15;
    letter-spacing: -0.015em;
  }

  .hero-editorial-sub {
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 1.75rem;
  }

  .hero-cta-group {
    flex-direction: column;
    align-items: stretch;
    gap: 0.85rem;
  }

  .hero-cta-group .btn {
    width: 100%;
  }

  /* Introduction (Mobile) */
  .intro-section {
    padding: 70px 24px;
  }

  .intro-editorial-spread {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
  }

  .intro-story-col {
    display: contents;
  }

  .intro-visual-col {
    display: contents;
  }

  .intro-story-header {
    order: 1;
  }

  .intro-heading {
    font-size: clamp(28px, 7.5vw, 36px);
    line-height: 1.14;
    margin-top: 0.65rem;
    margin-bottom: 1.15rem;
  }

  .intro-statement {
    font-size: 0.96rem;
    line-height: 1.65;
    padding-left: 1rem;
    max-width: 100%;
  }

  .intro-photo-frame {
    order: 2;
    height: clamp(340px, 60vw, 420px);
  }

  .intro-supporting-note {
    order: 3;
    font-size: 0.92rem;
    line-height: 1.7;
    margin-top: 0;
  }

  .intro-trust-strip {
    order: 4;
    flex-direction: column;
    gap: 1.15rem;
    margin-top: 1.25rem;
    padding-top: 1.25rem;
  }

  .intro-trust-divider {
    display: none;
  }

  /* 1. Services Editorial Grid (Mobile Single Column) */
  .services-editorial-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .service-editorial-card {
    padding-bottom: 1.5rem;
  }

  .service-editorial-media {
    height: 240px;
    margin-bottom: 1.25rem;
  }

  .service-editorial-title {
    font-size: 1.35rem;
  }

  .services-preview-frame {
    height: 240px;
  }

  .services-preview-item-header {
    flex-direction: column;
    gap: 0.2rem;
  }

  .home-service-media {
    height: 230px;
  }

  .home-service-title {
    font-size: 1.35rem;
  }

  /* 2. Destination Collection Grid (Mobile) */
  .destinations-collection-grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .dest-item.dest-large,
  .dest-item.dest-medium,
  .dest-item.dest-standard {
    grid-column: span 1;
    height: 300px;
  }

  .dest-card-title {
    font-size: 1.5rem;
  }

  /* 3. Venues Setting Grid (Mobile) */
  .venues-setting-grid,
  .venues-editorial-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .venue-card-media,
  .venue-setting-visual,
  .venue-setting-media {
    height: 260px;
  }

  .venue-card-title,
  .venue-setting-title {
    font-size: 1.4rem;
  }

  .venues-destination-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.85rem;
  }

  .venues-filter-scroll {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 0.35rem;
  }

  .venues-category-row {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .venues-guide-editorial-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  /* 4. Portfolio Filter Bar & Grid (Mobile) */
  .portfolio-filter-nav-wrap {
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 2rem;
    padding-bottom: 0.35rem;
  }

  .portfolio-filter-nav-wrap::-webkit-scrollbar {
    display: none;
  }

  .portfolio-filter-bar {
    flex-wrap: nowrap;
    justify-content: flex-start;
    padding: 0 0.5rem;
    gap: 0.5rem;
  }

  .portfolio-filter-btn {
    font-size: 0.72rem;
    padding: 0.5rem 1rem;
    white-space: nowrap;
    flex-shrink: 0;
  }

  .portfolio-masonry-grid {
    grid-template-columns: 1fr;
    gap: 1.75rem;
  }

  .portfolio-editorial-centerpiece,
  .portfolio-card.masonry-large {
    grid-column: span 1;
    min-height: 380px;
  }

  .portfolio-item-supporting,
  .portfolio-item-small,
  .portfolio-item-wide,
  .portfolio-item-medium-left,
  .portfolio-item-medium-right,
  .portfolio-card.masonry-portrait,
  .portfolio-card.masonry-wide,
  .portfolio-card.masonry-medium {
    grid-column: span 1;
    min-height: 320px;
  }

  .featured-weddings-top-tier {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .wedding-hero-card {
    min-height: 380px;
  }

  .wedding-stacked-col {
    gap: 1.5rem;
  }

  .wedding-supporting-card {
    height: 240px;
  }

  .featured-weddings-bottom-tier {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .wedding-medium-card {
    height: 260px;
  }

  .intro-pillars-bar {
    grid-template-columns: 1fr;
    gap: 2.25rem;
    margin-top: 3.5rem;
    padding-top: 2rem;
  }

  .portfolio-card.masonry-large,
  .portfolio-card.masonry-portrait,
  .portfolio-card.masonry-wide,
  .portfolio-card.masonry-medium {
    grid-column: span 1;
    grid-row: auto;
    height: 320px;
  }

  .portfolio-event-name {
    font-size: 1.25rem;
  }

  /* 5. Featured Wedding Case Study Spread */
  .case-study-media {
    min-height: 280px;
  }

  .case-study-title {
    font-size: 1.85rem;
  }

  .case-study-specs-strip {
    grid-template-columns: 1fr;
    gap: 1rem;
    padding: 1.25rem;
  }

  .case-study-gallery-strip {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .case-study-gallery-item {
    height: 220px;
  }

  /* 6. Why Couples Choose Us (Mobile Full-Width Editorial) */
  .why-section {
    padding: 48px 20px;
  }

  .why-brand-split {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .why-brand-heading {
    font-size: clamp(28px, 7.5vw, 36px);
    line-height: 1.15;
    margin-bottom: 1.15rem;
  }

  .why-brand-statement {
    font-size: 0.98rem;
    line-height: 1.68;
    margin-bottom: 1.5rem;
  }

  .why-principle-row {
    padding: 1.35rem 0;
  }

  .why-principle-content {
    grid-template-columns: 54px 1fr;
    gap: 1rem;
  }

  .why-principle-num {
    font-size: 28px;
  }

  .why-principle-title {
    font-family: var(--font-display);
    font-size: 1.25rem;
    letter-spacing: -0.01em;
  }

  .why-principle-desc {
    font-size: 0.92rem;
    line-height: 1.65;
  }

  .why-principle-divider {
    margin-top: 1.35rem;
  }

  /* 7. Planning Journey (Mobile Vertical Editorial Flow) */
  .journey-section {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }

  .journey-header {
    text-align: left;
    margin-bottom: 2.25rem;
  }

  .journey-title {
    font-size: 2.2rem;
  }

  .journey-tagline {
    font-size: 1.05rem;
  }

  .journey-subtitle {
    margin: 0;
    font-size: 0.94rem;
  }

  .journey-flow {
    gap: 2.75rem;
  }

  .journey-step,
  .journey-step--left,
  .journey-step--right,
  .journey-step--1,
  .journey-step--2,
  .journey-step--3,
  .journey-step--4 {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
      "header"
      "title"
      "media"
      "desc";
    gap: 0;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .journey-step-narrative {
    display: contents;
  }

  .journey-step-header {
    grid-area: header;
    margin-bottom: 0.35rem;
  }

  .journey-step-title {
    grid-area: title;
    font-size: 1.5rem;
    margin-bottom: 0.85rem;
    transform: none !important;
  }

  .journey-step-media {
    grid-area: media;
    flex: none;
    max-width: 100%;
    width: 100%;
    margin-bottom: 0.85rem;
  }

  .journey-media-frame {
    width: 100%;
    height: clamp(300px, 60vw, 380px);
    border-radius: 8px;
  }

  .journey-step-desc {
    grid-area: desc;
    font-size: 0.95rem;
    line-height: 1.68;
    max-width: 100%;
  }

  /* 7. Process Timeline (Mobile Vertical Stack) */
  .process-timeline-steps {
    grid-template-columns: 1fr;
    gap: 2rem;
    position: relative;
    padding-left: 2rem;
    border-left: 1px solid rgba(168, 132, 66, 0.3);
  }

  .process-timeline-step {
    padding-top: 0;
    text-align: left;
    position: relative;
  }

  .process-timeline-step::before {
    content: '';
    position: absolute;
    left: -2.35rem;
    top: 0.4rem;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--gold-primary);
    border: 2px solid var(--cream-soft);
  }

  .process-step-num,
  .step-num {
    font-family: var(--font-display);
    font-size: 2.6rem;
    font-style: normal;
    font-weight: 400;
  }

  .process-step-title,
  .step-title {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 400;
  }

  /* 8. Hospitality Editorial Split (Mobile) */
  .hospitality-section {
    padding-top: 48px;
    padding-bottom: 48px;
  }

  .hospitality-mobile-header {
    margin-bottom: 1.5rem;
  }

  .hospitality-editorial-grid {
    gap: 1.75rem;
  }

  .hospitality-image-frame {
    height: 260px;
    border-radius: 8px;
  }

  .hospitality-floating-caption {
    bottom: 1.25rem;
    left: 1.25rem;
    padding: 0.6rem 1rem;
  }

  .hospitality-floating-caption .caption-tag {
    font-size: 10px;
  }

  .hospitality-floating-caption .caption-loc {
    font-size: 9px;
  }

  .hosp-accordion-trigger {
    min-height: 52px;
    padding: 1rem 0;
  }

  .hosp-trigger-left {
    gap: 1rem;
  }

  .hosp-num {
    font-size: 1.45rem;
    min-width: 28px;
  }

  .hosp-title {
    font-size: 12.5px;
    letter-spacing: 0.08em;
  }

  .hosp-panel-inner {
    padding-left: 2.75rem;
    padding-bottom: 1.15rem;
  }

  .hosp-desc {
    font-size: 13.5px;
    line-height: 1.6;
  }

  /* 9. About Founder Spread */
  .about-editorial-spread {
    gap: 2.5rem;
  }

  .about-founder-portrait {
    height: 380px;
  }

  .about-founder-quote {
    padding: 1.25rem 1.25rem 1.25rem 1.5rem;
  }

  /* 9b. Pride Moments (Mobile Editorial Stack) */
  .pride-split-grid {
    grid-template-columns: 1fr;
    gap: 2.75rem;
  }

  .pride-editorial-heading {
    font-size: clamp(2.3rem, 8.5vw, 2.85rem);
    line-height: 1.1;
  }

  .pride-photo-frame {
    height: 360px;
    border-top-right-radius: 52px;
  }

  .pride-photo-caption {
    left: 1.25rem;
    right: 1.25rem;
    bottom: 1.25rem;
  }

  .pride-caption-text {
    font-size: 0.68rem;
    letter-spacing: 0.16em;
  }

  .pride-event-item {
    grid-template-columns: auto 1fr;
    gap: 1.1rem;
    padding: 1.35rem 0.25rem;
  }

  .pride-event-action {
    display: none;
  }

  .pride-event-num-wrap {
    gap: 0.85rem;
  }

  .pride-event-num {
    font-size: 2.15rem;
    min-width: 44px;
  }

  .pride-event-v-divider {
    height: 44px;
    margin: 0 0.15rem;
  }

  .pride-event-title {
    font-size: 1.22rem;
  }

  .pride-event-desc {
    font-size: 0.88rem;
    line-height: 1.55;
  }

  .pride-footer-bar {
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    gap: 0.5rem;
  }

  .pride-footer-line {
    display: none;
  }

  .pride-footer-text {
    white-space: normal;
    font-size: 0.68rem;
    line-height: 1.45;
  }

  /* 10. Testimonials Editorial Spread (Mobile Vertical Stack strictly in requested order) */
  .testi-editorial-spread {
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }

  .testi-visual-col {
    order: 1;
    width: 100%;
  }

  .testi-photo-frame {
    height: clamp(380px, 70vw, 440px);
    border-top-right-radius: 64px;
  }

  .testi-photo-crest {
    top: 1.25rem;
    left: 1.25rem;
  }

  .testi-photo-caption {
    bottom: 1.25rem;
    left: 1.25rem;
    right: 1.25rem;
  }

  .testi-caption-line {
    font-size: 0.7rem;
    letter-spacing: 0.18em;
  }

  .testi-center-col {
    order: 2;
    width: 100%;
  }

  .testi-floating-card {
    margin-left: 0;
    padding: 2.25rem 1.4rem;
  }

  .testi-gold-quote-icon {
    font-size: 3rem;
  }

  .testi-quote-mark-wrap {
    margin-bottom: 1.25rem;
  }

  .testi-quote-flank-line {
    width: 45px;
  }

  .testimonial-editorial-quote {
    font-size: clamp(1.25rem, 4.2vw, 1.45rem);
    line-height: 1.48;
    margin-bottom: 1.25rem;
  }

  /* Order 3: Grateful Always */
  .testi-decor-col {
    order: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding-left: 0;
    margin-top: 0.25rem;
  }

  .testi-chhatri-illus {
    display: none;
  }

  .testi-script-block {
    align-items: center;
    margin-bottom: 0.25rem;
  }

  .testi-script-line {
    font-size: 2.2rem;
  }

  .testi-script-line.indent {
    margin-left: 0;
  }

  .testi-grateful-line {
    margin: 0.5rem auto 0.75rem auto;
  }

  .testi-dedication-note {
    align-items: center;
    font-size: 0.62rem;
  }

  /* Order 4: Slider Controls */
  .testi-controls-wrapper {
    order: 4;
    width: 100%;
    margin-top: 0.25rem;
  }

  .testimonial-slider-controls {
    margin-left: 0;
  }

  /* Order 5: Trust Strip */
  .testi-bottom-strip {
    margin-top: 2.5rem;
  }

  .testi-trust-items {
    flex-direction: column;
    gap: 1rem;
  }

  .testi-trust-point {
    font-size: 0.72rem;
    letter-spacing: 0.15em;
  }

  .testi-trust-sep {
    display: none;
  }

  /* 11. Blog Cards */
  .blog-editorial-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .blog-editorial-media {
    height: 240px;
  }

  .blog-editorial-title {
    font-size: 1.35rem;
  }

  /* 12. Enquiry Luxury Panel */
  .enquiry-luxury-panel {
    padding: 2.5rem 1.25rem 2rem;
  }

  .form-grid-2 {
    grid-template-columns: 1fr;
    gap: 1.25rem;
    margin-bottom: 1.25rem;
  }

  .enquiry-form-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
  }

  .enquiry-form-actions .btn {
    width: 100%;
    justify-content: center;
  }

  .enquiry-direct-wa-btn {
    justify-content: center;
  }

  /* 13. Final CTA Banner */
  .final-cta-banner {
    min-height: 400px;
    padding: 4.5rem 1.25rem;
  }

  .final-cta-headline,
  .final-cta-title {
    font-size: 2.2rem;
    color: #ffffff !important;
  }

  .final-cta-headline em,
  .final-cta-title em {
    color: #ffffff !important;
  }

  .final-cta-sub {
    font-size: 1.05rem;
    color: rgba(255, 255, 255, 0.94);
  }

  .final-cta-actions,
  .final-cta-buttons {
    flex-direction: column;
    width: 100%;
    gap: 0.85rem;
  }

  .final-cta-actions .btn,
  .final-cta-buttons .btn {
    width: 100%;
    justify-content: center;
  }

  /* Multi-Page Elements on Mobile */
  .page-hero {
    min-height: 40vh;
    padding: calc(var(--header-height) + 2rem) 0 3rem;
  }

  .page-hero-title {
    font-size: 2.2rem;
  }

  .editorial-spread-row {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 2.5rem 0;
  }

  .editorial-spread-row.reverse {
    direction: ltr;
  }

  .editorial-spread-media {
    height: 280px;
  }

  .editorial-spread-title {
    font-size: 1.65rem;
  }

  .faq-header {
    font-size: 1.15rem;
  }

  /* Footer */
  .site-footer,
  .business-footer,
  .editorial-footer {
    padding-top: 54px;
    padding-bottom: 28px;
  }

  .footer-main-grid {
    grid-template-columns: 1fr;
    gap: 2.25rem;
    padding-bottom: 2.25rem;
  }

  .footer-brand-col {
    max-width: 100%;
  }

  .footer-bottom-row {
    flex-direction: column;
    text-align: center;
    gap: 0.65rem;
    padding-top: 1.5rem;
  }

  .footer-developer-credit {
    padding-top: 1rem;
    margin-top: 1rem;
    font-size: 0.72rem;
  }

  .floating-whatsapp-btn {
    bottom: 20px;
    right: 20px;
    padding: 10px 16px;
    font-size: 0.82rem;
  }
}

/* --------------------------------------------------------------------------
   Founder Editorial & Pride Moments Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
  .about-origins-grid {
    grid-template-columns: 1fr;
    gap: 3.5rem;
  }

  .about-origins-frame {
    height: 420px;
  }

  .founder-editorial-grid {
    grid-template-columns: 1fr;
    gap: 3.5rem;
  }

  .founder-photo-frame {
    height: 440px;
  }

  .milestones-founder-connect-inner {
    grid-template-columns: 1fr;
    gap: 1.75rem;
    text-align: center;
  }

  .m-founder-divider {
    width: 80px;
    height: 1px;
    margin: 0 auto;
    background: linear-gradient(to right, transparent, rgba(168, 132, 66, 0.5), transparent);
  }

  .m-founder-bio-col {
    align-items: center;
  }

  .pride-editorial-row {
    grid-template-columns: 80px 1fr;
    gap: 2rem;
    padding: 2.25rem 0;
  }

  /* Pillars Editorial Responsive 991px */
  .pillars-editorial-grid {
    column-gap: 3.5rem;
    row-gap: 3.5rem;
  }

  .pillar-item--offset-low {
    margin-top: 1.5rem;
  }

  .pillars-decor-motif {
    width: 160px;
    height: 160px;
    top: 1rem;
    right: 1rem;
    opacity: 0.12;
  }

  /* Weddings Page 991px Overhaul Responsive */
  .chapter-01-inset {
    position: static;
    max-width: 100%;
    margin-top: 1.5rem;
    padding: 2.2rem 1.8rem;
  }

  .chapter-02-grid,
  .chapter-03-grid,
  .chapter-04-grid,
  .chapter-05-grid,
  .chapter-06-grid {
    grid-template-columns: 1fr;
    gap: 3rem;
  }

  .chapter-02-visuals {
    grid-template-columns: 1fr;
  }

  .chapter-02-visuals .media-main {
    height: 440px;
  }

  .chapter-02-visuals .media-sub {
    display: none;
  }

  .exp-numbered-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .ceremony-tile--hero,
  .ceremony-tile--side-tall,
  .ceremony-tile--third {
    grid-column: span 12;
    height: 380px;
  }

  .journey-connecting-track {
    display: none;
  }

  .journey-stages-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
    border-left: 2px solid var(--gold-primary);
    padding-left: 1.75rem;
    margin-left: 0.5rem;
  }

  .journey-stage-top {
    margin-bottom: 0.75rem;
  }

  .lake-case-grid {
    grid-template-columns: 1fr;
    gap: 3rem;
  }

  .lake-case-media {
    height: 420px;
  }

  .founder-editorial-grid {
    grid-template-columns: 1fr;
    gap: 3rem;
  }
}

@media (max-width: 767px) {
  .about-origins-frame {
    height: 320px;
  }

  .about-origins-plaque {
    position: static;
    margin-top: 1rem;
    max-width: 100%;
  }

  .founder-photo-frame {
    height: 400px;
  }

  .founder-photo-frame::after {
    inset: 8px;
  }

  .founder-editorial-headline {
    font-size: clamp(2.4rem, 8vw, 3rem);
  }

  .founder-headline-quote {
    font-size: 1.15rem;
  }

  .founder-signature-style-line {
    width: 100%;
    justify-content: center;
  }

  .founder-personal-signature {
    padding: 1rem 1.15rem;
    margin: 1.15rem 0 1.35rem;
  }

  .milestones-founder-connect {
    padding: 2rem 1.35rem;
  }

  .m-vision-quote {
    font-size: 1.25rem;
  }

  .founder-note-section {
    padding: 4.5rem 0;
  }

  .founder-note-quote {
    font-size: clamp(1.65rem, 5.8vw, 2.2rem);
  }

  .founder-contact-subtle {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }

  .pride-editorial-row {
    grid-template-columns: 1fr;
    gap: 0.75rem;
    padding: 2rem 0;
  }

  .pride-row-num {
    font-size: 2.2rem;
  }

  .pride-vertical-container {
    padding-left: 2.75rem;
  }

  .pride-vertical-track {
    left: 13px;
  }

  .pride-timeline-node {
    left: -2.75rem;
    width: 28px;
    height: 28px;
  }

  .pride-node-dot {
    width: 8px;
    height: 8px;
  }

  .pride-entry-heading {
    font-size: 1.35rem;
  }

  /* Pillars Editorial Responsive 767px */
  .pillars-editorial-section {
    padding: 5rem 0 5.5rem;
  }

  .pillars-header-block {
    margin-bottom: 3.5rem;
  }

  .pillars-editorial-heading {
    font-size: 2.1rem;
  }

  .pillars-editorial-grid {
    grid-template-columns: 1fr;
    gap: 3.25rem;
  }

  .pillar-item--offset-low {
    margin-top: 0;
  }

  .pillar-num {
    font-size: 3rem;
  }

  .pillar-divider {
    max-width: 220px;
  }

  .pillars-decor-motif {
    display: none;
  }

  /* Weddings Page 767px Overhaul Responsive */
  .weddings-hero {
    min-height: auto;
    padding: 6.5rem 0 4.5rem;
  }

  .weddings-hero-title {
    font-size: 2.3rem;
  }

  .chapter-01-grid .chapter-media,
  .chapter-02-visuals .media-main,
  .chapter-03-grid .chapter-media,
  .chapter-04-grid .chapter-media,
  .chapter-05-grid .chapter-media,
  .chapter-06-grid .chapter-media {
    height: 320px;
  }

  .exp-numbered-row {
    grid-template-columns: 45px 1fr;
    gap: 1rem;
  }

  .exp-num {
    font-size: 1.8rem;
  }

  .ceremonies-gallery-grid {
    gap: 1.25rem;
  }

  .ceremony-tile--hero,
  .ceremony-tile--side-tall,
  .ceremony-tile--third {
    height: 300px !important;
  }

  .lake-case-media {
    height: 320px;
  }

  .lake-specs-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

/* ==========================================================================
   CONTACT PAGE RESPONSIVE
   ========================================================================== */
@media (max-width: 991px) {
  .contact-editorial-layout {
    grid-template-columns: 1fr;
    gap: 3.5rem;
  }

  .contact-studio-anchor {
    height: clamp(340px, 50vw, 440px);
  }

  .contact-journey-grid {
    grid-template-columns: 1fr;
    gap: 2.25rem;
  }

  .contact-step-item:not(:last-child)::after {
    display: none;
  }

  .contact-step-item {
    border-bottom: 1px solid rgba(168, 132, 66, 0.18);
    padding-bottom: 1.75rem;
  }

  .contact-step-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }
}

@media (max-width: 767px) {
  .contact-hero {
    min-height: auto;
    padding: 7rem 0 4.25rem;
  }

  .contact-hero-title {
    font-size: clamp(34px, 8.5vw, 48px);
  }

  .contact-hero-actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    gap: 0.85rem;
  }

  .contact-hero-cta,
  .contact-hero-wa {
    width: 100%;
    justify-content: center;
  }

  .contact-form-panel {
    padding: 2.25rem 1.35rem 2rem;
  }

  .contact-input-row {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .contact-actions-row {
    flex-direction: column;
    align-items: stretch;
    gap: 0.85rem;
  }

  .contact-btn-submit,
  .contact-btn-wa {
    width: 100%;
    flex: 1 1 100%;
    justify-content: center;
  }

  .contact-faq-header {
    font-size: 1.15rem;
    gap: 1rem;
  }

  .contact-studio-anchor {
    height: 280px;
  }
}