/**
 * HW Builder Grid - Frontend Styles
 *
 * @package HW_Builder_Grid
 */

/* ==========================================================================
   CSS Custom Properties
   ========================================================================== */

:root {
    --dbg-primary: #3D6B4D;
    --dbg-primary-dark: #2d5039;
    --dbg-accent: #E8924B;
    --dbg-text: #333333;
    --dbg-text-light: #666666;
    --dbg-border: #e0e0e0;
    --dbg-bg: #ffffff;
    --dbg-bg-light: #f8f8f8;
    --dbg-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    --dbg-shadow-hover: 0 4px 16px rgba(0, 0, 0, 0.15);
    --dbg-radius: 8px;
    --dbg-transition: 0.3s ease;
}

/* ==========================================================================
   Builder Grid
   ========================================================================== */

#dbg-builder-grid,
.dbg-builder-grid {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 16px;
    padding: 20px 0;
    justify-content: center;
    align-items: flex-start;
    max-width: 1500px;
    margin: 0 auto;
}

/* Override WordPress block layout constraints */
#dbg-builder-grid > * {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    margin-block-start: 0;
    margin-block-end: 0;
}

/* Responsive: full-width cards on small screens */
@media (max-width: 768px) {
    #dbg-builder-grid .dbg-builder-card,
    .dbg-builder-card {
        width: 320px;
        height: 234px;
        max-width: 320px;
    }
}

@media (max-width: 480px) {
    #dbg-builder-grid .dbg-builder-card,
    .dbg-builder-card {
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
        aspect-ratio: 350 / 260;
    }
}

/* ==========================================================================
   Builder Card - Valencia-style layout
   ========================================================================== */

#dbg-builder-grid .dbg-builder-card,
.dbg-builder-card {
    position: relative;
    display: grid;
    grid-template-rows: 80% 20%;
    width: 350px;
    height: 260px;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border-radius: var(--dbg-radius);
    cursor: pointer;
    flex-shrink: 0;
    max-width: 350px;
}

/* Background Image - full bleed, visible */
.dbg-card-bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* Light semi-transparent overlay for readability */
.dbg-card-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, var(--dbg-card-overlay-opacity, 0.55));
    z-index: 1;
    transition: opacity 0.4s ease;
}

/* Normal State Content - floats over image, grid row 1 */
.dbg-card-inner {
    position: relative;
    z-index: 2;
    grid-row: 1;
    display: flex;
    flex-direction: column;
}

.dbg-card-normal {
    transition: opacity 0.35s ease;
}

.dbg-card-contain {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 100%;
    padding: 12px 16px;
    gap: 2px;
}

/* Logo on card */
.dbg-card-logo {
    max-width: 141px;
    max-height: 98px;
    min-width: 80px;
    min-height: 40px;
    width: auto;
    height: auto;
    object-fit: contain;
    margin-bottom: 6px;
}

.dbg-card-logo-dark {
    display: block;
}

.dbg-card-logo-light {
    display: none;
}

.dbg-card-logo-text {
    font-size: 20px;
    font-weight: 700;
    color: var(--dbg-primary);
    margin-bottom: 6px;
}

/* Card text - matched to Valencia styles, !important to override theme */
.dbg-card-title,
h3.dbg-card-title,
.dbg-builder-card h3.dbg-card-title {
    font-size: 22px !important;
    font-weight: 400 !important;
    color: var(--dbg-primary) !important;
    margin: 0 0 2px !important;
    padding: 0 !important;
    line-height: 1.2 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    border: none !important;
    text-transform: capitalize !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}

.dbg-card-price,
h4.dbg-card-price,
.dbg-builder-card h4.dbg-card-price {
    font-size: 19px !important;
    font-weight: 400 !important;
    color: var(--dbg-primary) !important;
    margin: 0 0 4px !important;
    padding: 0 !important;
    line-height: 1.2 !important;
    display: block !important;
    border: none !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}

.dbg-card-sqft,
h5.dbg-card-sqft,
.dbg-builder-card h5.dbg-card-sqft {
    font-size: 16px !important;
    font-weight: 400 !important;
    font-style: italic !important;
    color: var(--dbg-primary) !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
    display: block !important;
    border: none !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}

/* Button bar at bottom - matched to Valencia .awcBtn, grid row 2 */
.dbg-card-button,
.dbg-builder-card .dbg-card-button {
    grid-row: 2;
    position: relative;
    z-index: 3;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(245, 131, 62, 1) !important;
    color: #faf8c2 !important;
    border: none !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0 !important;
    cursor: pointer;
    transition: background-color 0.3s ease, opacity 0.35s ease;
    padding: 0 !important;
    margin: 0 !important;
}

.dbg-card-button:hover {
    background-color: var(--dbg-primary) !important;
}

.dbg-btn-arrow {
    font-size: 28px;
    line-height: 1;
    margin-left: 2px;
}

/* White arrow - matches Valencia .awcGxArrowWhite */
.dbg-card-arrow-white {
    display: block;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateX(40px) translateY(-50%);
    height: 30px;
    width: auto;
    opacity: 0;
    transition: opacity 0.4s ease, transform 0.4s ease;
    z-index: 4;
    pointer-events: none;
}

/* ==========================================================================
   Card Hover Effect - Valencia style
   ========================================================================== */

/* Hover content - hidden by default, centered */
.dbg-card-hover-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
    padding: 20px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.35s ease;
}

.dbg-card-hover-label {
    color: var(--accent-color, var(--dbg-accent));
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 2px;
    transform: translateY(20px);
    opacity: 0;
    transition: transform 0.4s ease 0.05s, opacity 0.3s ease 0.05s;
}

.dbg-card-hover-logo-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transform: translateY(-15px);
    opacity: 0;
    transition: transform 0.4s ease 0.1s, opacity 0.3s ease 0.1s;
}

.dbg-card-hover-logo-img {
    max-width: 141px;
    max-height: 98px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.dbg-card-hover-logo-text {
    color: #ffffff;
    font-size: 22px;
    font-weight: 700;
}

.dbg-card-hover-chevron {
    flex-shrink: 0;
    transform: translateX(20px);
    opacity: 0;
    transition: transform 0.4s ease 0.2s, opacity 0.3s ease 0.2s;
}

/* --- Hover state triggers --- */

/* Darken overlay */
.dbg-builder-card:hover .dbg-card-overlay {
    background: rgba(0, 0, 0, 0.65);
}

/* Fade out normal content */
.dbg-builder-card:hover .dbg-card-normal {
    opacity: 0;
}

/* Fade out button bar */
.dbg-builder-card:hover .dbg-card-button {
    opacity: 0;
}

/* Show hover content */
.dbg-builder-card:hover .dbg-card-hover-content {
    opacity: 1;
}

.dbg-builder-card:hover .dbg-card-hover-label {
    transform: translateY(0);
    opacity: 1;
}

.dbg-builder-card:hover .dbg-card-hover-logo-row {
    transform: translateY(0);
    opacity: 1;
}

.dbg-builder-card:hover .dbg-card-hover-chevron {
    transform: translateX(0);
    opacity: 1;
}

/* Show white arrow */
.dbg-builder-card:hover .dbg-card-arrow-white {
    opacity: 1;
    transform: translateX(0) translateY(-50%);
}

/* ==========================================================================
   Modal
   ========================================================================== */

.dbg-modal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 999999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    box-sizing: border-box !important;
    margin: 0 !important;
}

.dbg-modal[aria-hidden="false"] {
    opacity: 1;
    visibility: visible;
}

/* Modal responsive adjustments */
@media (max-width: 768px) {
    .dbg-modal {
        padding: 12px !important;
    }
    
    .dbg-modal-container {
        max-height: 95vh;
    }
}

@media (max-width: 480px) {
    .dbg-modal {
        padding: 8px !important;
    }
    
    .dbg-modal-container {
        max-height: 98vh;
        border-radius: 6px;
    }
}

.dbg-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
}

.dbg-modal-container {
    position: relative !important;
    z-index: 1;
    width: 100%;
    max-width: 1100px !important;
    max-height: 90vh;
    background: var(--dbg-bg);
    border-radius: var(--dbg-radius);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    transform: translateY(20px);
    transition: transform 0.3s ease;
    font-family: inherit;
    margin: 0 !important;
    left: auto !important;
    right: auto !important;
}

/* Ensure all popup text inherits the theme font */
.dbg-builder-detail,
.dbg-builder-detail * {
    font-family: inherit;
}

.dbg-modal[aria-hidden="false"] .dbg-modal-container {
    transform: translateY(0);
}

.dbg-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 10;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.9);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    transition: background var(--dbg-transition), transform var(--dbg-transition);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.dbg-modal-close:hover {
    background: #ffffff;
    transform: scale(1.1);
}

.dbg-modal-close svg {
    width: 20px;
    height: 20px;
    color: var(--dbg-text);
}

/* Close button responsive adjustments */
@media (max-width: 480px) {
    .dbg-modal-close {
        top: 10px;
        right: 10px;
        width: 36px;
        height: 36px;
    }
    
    .dbg-modal-close svg {
        width: 18px;
        height: 18px;
    }
}

.dbg-modal-content {
    max-height: 90vh;
    overflow-y: auto;
}

/* Loading state */
.dbg-modal-content.dbg-loading {
    min-height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dbg-modal-content.dbg-loading::after {
    content: '';
    width: 40px;
    height: 40px;
    border: 3px solid var(--dbg-border);
    border-top-color: var(--dbg-accent);
    border-radius: 50%;
    animation: dbg-spin 0.8s linear infinite;
}

@keyframes dbg-spin {
    to {
        transform: rotate(360deg);
    }
}

/* ==========================================================================
   Builder Detail
   ========================================================================== */

.dbg-builder-detail {
    background: var(--dbg-bg);
}

.dbg-detail-header {
    display: grid;
    grid-template-columns: 38% 62%;
    gap: 0;
    min-height: 420px;
}

@media (max-width: 768px) {
    .dbg-detail-header {
        grid-template-columns: 1fr;
        min-height: auto;
    }
    
    .dbg-detail-info {
        padding: 24px 20px;
        order: 2;
    }
    
    .dbg-detail-hero {
        min-height: 250px;
        order: 1;
    }
    
    .dbg-detail-tagline {
        font-size: 16px;
        padding: 12px 16px;
    }
}

@media (max-width: 480px) {
    .dbg-detail-info {
        padding: 20px 16px;
    }
    
    .dbg-detail-hero {
        min-height: 200px;
    }
    
    .dbg-detail-tagline {
        font-size: 14px;
        padding: 10px 12px;
    }
    
    .dbg-detail-logo img {
        max-width: 160px;
        max-height: 70px;
    }
    
    .dbg-detail-price {
        font-size: 18px;
    }
    
    .dbg-detail-lot-size {
        font-size: 16px;
        margin-bottom: 16px;
    }
    
    .dbg-detail-specs li {
        font-size: 14px;
        padding: 6px 0;
    }
}

.dbg-detail-info {
    padding: 36px 32px;
    background: var(--dbg-bg);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.dbg-detail-logo {
    margin-bottom: 16px;
    text-align: center;
}

.dbg-detail-logo img {
    max-width: 200px;
    max-height: 90px;
    min-width: 200px;   /* force small logos up to 200px wide */
    min-height: 60px;
    width: auto;
    height: auto;
    object-fit: contain;
    margin: 0 auto;
    display: block;
}

.dbg-detail-title {
    font-size: 26px;
    font-weight: 700;
    color: var(--dbg-text);
    margin: 0 0 12px 0;
    text-align: center;
}

.dbg-detail-price {
    font-size: 22px;
    font-weight: 400;
    color: var(--dbg-text);
    margin-bottom: 2px;
    font-family: inherit;
    line-height: 1.3;
    text-align: center;
}

.dbg-detail-lot-size {
    font-size: 18px;
    font-weight: 600;
    color: var(--dbg-text);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 24px;
    line-height: 1.3;
    text-align: center;
}

.dbg-detail-specs {
    list-style: none;
    margin: 0;
    padding: 0;
}

.dbg-detail-specs li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--dbg-border);
    font-size: 16px;
    font-weight: 500;
    color: var(--dbg-primary);
}

.dbg-detail-specs li:last-child {
    border-bottom: none;
}

.dbg-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}

.dbg-icon svg {
    width: 24px;
    height: 24px;
    color: var(--dbg-primary);
    stroke-width: 2.2;
}

/* Hero Image */
.dbg-detail-hero {
    position: relative;
    min-height: 300px;
    overflow: hidden;
}

.dbg-detail-hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

/* When hero contains only an image (not slideshow/video), make it fill */
.dbg-media-type-image {
    display: flex;
}

.dbg-media-type-image img {
    position: relative;
    min-height: 100%;
}

.dbg-detail-tagline {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px 24px;
    background: rgba(0, 0, 0, 0.85);
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    z-index: 10;
}

/* ==========================================================================
   Slideshow
   ========================================================================== */

.dbg-slideshow {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 300px;
    overflow: hidden;
}

.dbg-slideshow-track {
    position: relative;
    width: 100%;
    height: 100%;
}

.dbg-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease;
}

.dbg-slide.active {
    opacity: 1;
}

.dbg-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dbg-slideshow-prev,
.dbg-slideshow-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.7);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    font-size: 20px;
    color: var(--dbg-text);
    transition: background 0.2s, transform 0.2s;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

.dbg-slideshow-prev {
    left: 12px;
}

.dbg-slideshow-next {
    right: 12px;
}

.dbg-slideshow-prev:hover,
.dbg-slideshow-next:hover {
    background: rgba(255, 255, 255, 0.95);
    transform: translateY(-50%) scale(1.05);
}

.dbg-slideshow-dots {
    position: absolute;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    display: flex;
    gap: 6px;
}

/* Push dots up if tagline is present */
.dbg-detail-hero:has(.dbg-detail-tagline) .dbg-slideshow-dots {
    bottom: 56px;
}

.dbg-media-type-image .dbg-slideshow-dots,
.dbg-detail-hero:not(:has(.dbg-detail-tagline)) .dbg-slideshow-dots {
    bottom: 16px;
}

.dbg-dot {
    width: 8px;
    height: 8px;
    background: rgba(255, 255, 255, 0.5);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    padding: 0;
    transition: background 0.2s, transform 0.2s;
}

.dbg-dot:hover,
.dbg-dot.active {
    background: #ffffff;
    transform: scale(1.3);
}

/* Slideshow responsive adjustments */
@media (max-width: 768px) {
    .dbg-slideshow {
        min-height: 250px;
    }
    
    .dbg-slideshow-prev,
    .dbg-slideshow-next {
        width: 36px;
        height: 36px;
        font-size: 18px;
    }
    
    .dbg-slideshow-prev {
        left: 8px;
    }
    
    .dbg-slideshow-next {
        right: 8px;
    }
}

@media (max-width: 480px) {
    .dbg-slideshow {
        min-height: 200px;
    }
    
    .dbg-slideshow-prev,
    .dbg-slideshow-next {
        width: 32px;
        height: 32px;
        font-size: 16px;
    }
    
    .dbg-slideshow-prev {
        left: 6px;
    }
    
    .dbg-slideshow-next {
        right: 6px;
    }
    
    .dbg-dot {
        width: 6px;
        height: 6px;
    }
}

/* ==========================================================================
   Video
   ========================================================================== */

.dbg-video-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 300px;
    background: #000;
}

.dbg-video-wrapper video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.dbg-video-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.9);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    transition: background 0.2s, transform 0.2s;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.dbg-video-play-btn:hover {
    background: #ffffff;
    transform: translate(-50%, -50%) scale(1.1);
}

.dbg-video-play-btn svg {
    width: 36px;
    height: 36px;
    color: var(--dbg-primary);
    margin-left: 4px; /* Visual centering for play icon */
}

.dbg-video-wrapper.playing .dbg-video-play-btn {
    opacity: 0;
    pointer-events: none;
}

/* Video responsive adjustments */
@media (max-width: 768px) {
    .dbg-video-wrapper {
        min-height: 250px;
    }
    
    .dbg-video-play-btn {
        width: 60px;
        height: 60px;
    }
    
    .dbg-video-play-btn svg {
        width: 28px;
        height: 28px;
    }
}

@media (max-width: 480px) {
    .dbg-video-wrapper {
        min-height: 200px;
    }
    
    .dbg-video-play-btn {
        width: 50px;
        height: 50px;
    }
    
    .dbg-video-play-btn svg {
        width: 24px;
        height: 24px;
    }
}

/* ==========================================================================
   Embed (YouTube/Vimeo)
   ========================================================================== */

.dbg-embed-wrapper {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    background: #000;
}

.dbg-embed-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* ==========================================================================
   Matterport 3D Tour
   ========================================================================== */

.dbg-matterport-wrapper {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    background: #000;
}

.dbg-matterport-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* ==========================================================================
   CTA Buttons
   ========================================================================== */

.dbg-detail-ctas {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 20px 24px;
    background: var(--dbg-bg);
    justify-content: center;
}

.dbg-cta-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: var(--accent-color, var(--dbg-accent));
    color: #ffffff;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-radius: 50px;
    transition: background var(--dbg-transition), transform var(--dbg-transition);
    white-space: nowrap;
}

.dbg-cta-button:hover {
    background: var(--dbg-primary);
    color: #ffffff;
    transform: translateY(-2px);
}

.dbg-cta-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.dbg-cta-icon svg {
    width: 16px;
    height: 16px;
}

/* Directions button now matches all other CTAs - solid filled */
.dbg-cta-directions {
    background: var(--accent-color, var(--dbg-accent));
    color: #ffffff;
    border: none;
}

.dbg-cta-directions:hover {
    background: var(--dbg-primary);
    color: #ffffff;
}

@media (max-width: 768px) {
    .dbg-detail-ctas {
        flex-direction: column;
        padding: 16px 20px;
    }
    
    .dbg-cta-button {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 480px) {
    .dbg-detail-ctas {
        padding: 12px 16px;
        gap: 8px;
    }
    
    .dbg-cta-button {
        padding: 10px 16px;
        font-size: 11px;
    }
    
    .dbg-cta-icon svg {
        width: 14px;
        height: 14px;
    }
}

/* ==========================================================================
   Footer Branding
   ========================================================================== */

.dbg-builder-detail-footer {
    padding: 30px;
    background: var(--dbg-primary);
    text-align: center;
}

.dbg-builder-detail-footer img {
    max-width: 200px;
    height: auto;
}

.dbg-builder-detail-footer p {
    color: rgba(255, 255, 255, 0.8);
    font-size: 12px;
    margin: 12px 0 0 0;
}

/* ==========================================================================
   No Results
   ========================================================================== */

.dbg-no-builders {
    text-align: center;
    padding: 40px;
    color: var(--dbg-text-light);
    font-size: 16px;
}

.dbg-error {
    text-align: center;
    padding: 20px;
    color: #d32f2f;
    background: #ffebee;
    border-radius: var(--dbg-radius);
}

/* ==========================================================================
   Accessibility
   ========================================================================== */

.dbg-card-button:focus,
.dbg-cta-button:focus,
.dbg-modal-close:focus {
    outline: 3px solid var(--dbg-accent);
    outline-offset: 2px;
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
    .dbg-builder-card,
    .dbg-card-overlay,
    .dbg-card-normal,
    .dbg-card-button,
    .dbg-card-button svg,
    .dbg-card-arrow-white,
    .dbg-card-hover-content,
    .dbg-card-hover-label,
    .dbg-card-hover-logo-row,
    .dbg-card-hover-chevron,
    .dbg-cta-button,
    .dbg-modal,
    .dbg-modal-container,
    .dbg-modal-close {
        transition: none;
    }
    
    .dbg-modal-content.dbg-loading::after {
        animation: none;
    }
}

/* High contrast mode */
@media (prefers-contrast: high) {
    .dbg-builder-card {
        border: 2px solid var(--dbg-text);
    }
    
    .dbg-card-button,
    .dbg-cta-button {
        border: 2px solid currentColor;
    }
}

/* ==========================================================================
   CARD STYLE: Legacy
   Image-forward card with price band overlay + info section below image.
   Usage: [builder_grid card_style="legacy"]
   ========================================================================== */

.dbg-style-legacy .dbg-builder-card,
/* ==========================================================================
   CARD STYLE: Legacy
   Matches Legacy by Hillwood reference:
   - Full-width 16:9 house photo
   - Solid #1E3033 band: two-line price left, white logo right
   - Left-aligned info section below (14px / #1E3033)
   - Rust (#9C4122) EXPLORE button, no border-radius
   ========================================================================== */

/* Override base .dbg-builder-card (specificity 0,1,0) with double-class (0,2,0)
   Fixed at exactly 278x370px — overflow hidden clips cleanly, button sits at bottom via flex */
.dbg-builder-card.dbg-card-legacy {
    display: flex !important;
    flex-direction: column !important;
    width: 278px !important;
    max-width: 278px !important;
    height: 370px !important;
    overflow: hidden !important;
    border-radius: 0 !important;
    grid-template-rows: unset !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
    background: #ECEFE7 !important;
}

.dbg-card-legacy {
    display: flex;
    flex-direction: column;
    width: 278px;
    max-width: 278px;
    height: 370px;
    border-radius: 0;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    background: #ECEFE7;
    flex-shrink: 0;
    grid-template-rows: unset;
    transition: box-shadow 0.3s ease;
}

.dbg-card-legacy:hover {
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

/* Override Valencia base rule that fades out .dbg-card-button on hover */
.dbg-builder-card.dbg-card-legacy:hover .dbg-card-button {
    opacity: 1 !important;
    background-color: #9C4122 !important;
    color: #BE9D5B !important;
}

/* ---- House photo ---- */
/* 278px wide at 570:336 ratio = ~164px tall */
.dbg-card-legacy .dbg-legacy-image-wrap {
    position: relative;
    width: 100%;
    height: 254px;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 0 !important;
}

.dbg-card-legacy .dbg-legacy-house-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.dbg-card-legacy:hover .dbg-legacy-house-img {
    transform: scale(1.04);
}

.dbg-card-legacy .dbg-legacy-image-placeholder {
    width: 100%;
    height: 100%;
    background: #ecf1f1;
}

/* ---- Price + logo band — uses per-builder accent color ---- */
.dbg-card-legacy .dbg-legacy-price-band {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 13px;
    background: var(--accent-color, #426C70);
    gap: 8px;
}

/* Price block: two stacked lines */
.dbg-card-legacy .dbg-legacy-band-price {
    display: flex;
    flex-direction: column;
    line-height: 90%;
}

.dbg-card-legacy .dbg-legacy-price-from {
    display: block;
    font-size: 11px;
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.dbg-card-legacy .dbg-legacy-price-amount {
    display: block;
    font-size: 22px;
    font-weight: 700;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    line-height: 1;
    margin-top: 2px;
}

/* White logo on right side of band */
.dbg-card-legacy .dbg-legacy-band-logo {
    max-width: 90px;
    max-height: 38px;
    min-width: 50px;
    width: auto;
    height: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);
    flex-shrink: 0;
}

.dbg-card-legacy .dbg-legacy-band-name {
    font-size: 12px;
    color: #ffffff;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ---- Info section below image ---- */
/* No flex:1 — content sits naturally, margin-top:auto on btn-wrap pushes button to bottom */
.dbg-card-legacy .dbg-legacy-info {
    padding: 10px 13px 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
}

/* Builder name + lot size on one line */
.dbg-card-legacy .dbg-legacy-builder-name,
.dbg-card-legacy p.dbg-legacy-builder-name {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #1E3033 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
    text-align: center !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    border: none !important;
}

.dbg-card-legacy .dbg-legacy-sqft {
    font-size: 13px;
    font-weight: 400;
    color: #1E3033;
    line-height: 1.3;
    text-align: center;
}

.dbg-card-legacy .dbg-legacy-address {
    font-size: 13px;
    font-weight: 400;
    color: #1E3033;
    text-align: center;
    margin: 0;
    padding: 0;
    line-height: 1.3;
}

.dbg-card-legacy .dbg-legacy-phone {
    font-size: 13px;
    font-weight: 400;
    color: #1E3033;
    text-align: center;
    margin: 0;
    padding: 0;
    line-height: 1.3;
}

.dbg-card-legacy .dbg-legacy-phone a {
    color: #1E3033;
    text-decoration: none;
}

.dbg-card-legacy .dbg-legacy-phone a:hover {
    color: #9C4122;
}

/* ---- EXPLORE button with concave notch effect ---- */
/* margin-top:auto pushes button to bottom of the fixed 370px card.
   ::before and ::after create white circular notches on left/right edges,
   replicating the decorative vector style from the reference site. */
.dbg-card-legacy .dbg-legacy-btn-wrap {
    padding: 10px 13px 14px;
    display: flex;
    justify-content: center;
    flex-shrink: 0;
    margin-top: auto;
    background: #ECEFE7;    /* ensures vectors at z-index:-1 appear on correct bg */
    overflow: visible;      /* lets 11px vector notches extend outside button */
    position: relative;     /* establishes stacking context for z-index:-1 */
}

.dbg-card-legacy .dbg-card-button {
    grid-row: unset;
    position: relative;
    z-index: 1;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;          /* auto-width so vectors sit on white space outside */
    margin: 0 10px !important;
    padding: 6px 14px !important;
    background-color: #9C4122 !important;
    background-image: none !important;
    color: #FAF8EE !important;
    border: none !important;
    border-radius: 0 !important;
    font-size: 11.4716px !important;
    font-weight: 700 !important;
    line-height: 15px !important;
    text-align: center !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    cursor: pointer;
    transition: background-color 0.2s ease;
    height: auto !important;
    overflow: visible !important;
}

/* Left concave vector notch — matches Legacy by Hillwood reference button style */
.dbg-card-legacy .dbg-card-button::before {
    content: '';
    position: absolute;
    left: -11px;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1;
    background-repeat: no-repeat;
    background-size: cover;
    width: 11px;
    height: 28.33px;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAABzCAYAAADezoFFAAAWX0lEQVR4nM2c+XMcV3LnP5mvju4GGg2AACleIkXw0vCQRMnS3IfGa4835rDXa/+NG/uLf9rwbKxjJtbe8a5jbWkOzQx1UCJ1URQBgiAa3V3Hy/QPVQ2AkDxjD0iBL6KiuquB7vetzJf5zeOVcKBDQbR56SDUqpAm0MthMZKvT+jeixhkW6R17K0of/XXf/z8n+ShH//mf/zDTT1YALuHPfTOIYIFR5rP3FEny3M6IoKKpwL6BAFohgmlgxlUESaNaJorAjrbY1GRANBK6wCHWDMNf/hyhIlC6rg7RiMBEAgL/d6cOImYi4MdrASc7cnLziWPQtFKoNgGAGTO/NLcoK8WZ3APT4gKGUKjDkCDRKCCzQgVRMAITpYL80tz/YXEbCDmGc3/Hexo7rx95qIL5lijZmKkwkwnsLAw010IbrOCpQrpgQMAU4VUdt9MmR7N5JWouXOoC4dn03QxdfoiDfYnAABM16JCur0YpiCIiJEGp/vcucUXfFLMp8IsQA2jJwTAdKjttUi4kcEgg8HhwdyhUJdLat5RVQyqAwcwtfnbi3jPh+JogM5i4Nlj84NjWtcDifUs8GQA2D0EdNu0tpJIoZ/C7KkjnQtzWbaUOYniRK/94P0ANBanlcL2tRZAcPIAeQK9s8dPLEtZHMpFSFSo65qD9wPbC3XXaCc/VZ0U+ksZl44uHZqz8XghlYZZRLz0QHnwEoBWd0h3m9PpawE9f/r0oBuSPrV1goN4RFWJ/qQAaHnOFAQ0pE4gZDBYeWrhbFaWT3dF0uhO5RCCqNhBkzkAaQSQoLlCamiBRo24EeHaM3OvzjO51q/DueCOhZQYZFxNijyF2YOXgEESEpku5DTJzaKTBDSF2WeWB+cP5WEljSXUkRIjim6peJpC/2Al4DRWyMVqfATgcUyATlbRP7XIK0cX55e6KnPlqMYlggou1EKIAAevQq7U7h5ER6qIxTrrpxxJKw5dO/P0lR4cjWWZu1eEoBAUVyndsDZuOMihSEvHojiVRBcIVqFnF8O3zy0vX0yr8phXkwARCWDuWMRcw7j5hgMeDoQkAYlgkX7OkQ4svbBy5uxMrM53heVUnZA0DqOuKmKMiGp0oT5wAIgQvQYMcSSPHL6wqN87tTB3IZTjY8HLXMQJrVOQ2glo6iHZKmHjgD2xQQCsJkmQjrMsNfm3rr1wJovF8Qyfr2OFWU1ASFFSUdIkCajUE+feYwegn8NWRHb4g2gEIBTMLwdeePH47I+WOtnplHoRqYOqIeq4GVI7KQnUpJXFkuQLYKPuDxN8Edk+cPDa6AQGPTg655x9+dzZy9W91ZU8yGwawJo/Q10RV8SnzKMZj92Mfh6A7degaqS5szwDJ54/deirh7L0mUyS47EYkeXSxPQouOItGBdzxTrqZF/oGhAR3H37UEgzGKTO3HNHuj+4evrU2erB+vG5To5bTVUVqDcAoghRlFoVE0o18ixy6AsDsHfyQONxYbAceP7li+fPd70+OZuG3nhrg5lOh1jXNOxTiapUGpgEJlF0KzVb7MDSFwJgt9rsHgrpDJz45vNPf3VG5GhmcbmbBepYgkfyJCWYot7c/TIoVdA1E4rEmO3C4QMzoyEEcmVw+dT8i+eOHz8q5WQpU0/KckSeZ0wmE3LNthdvA4C1InC3UjYSo5/D4iMAkNCkyXn4aE7aUIWdI0DegaUZ4qmBcPYbl790xTbWV5bnZxfGk61tVRMRqqraHR6jThacrmIdF+oIk31aIUVIaTJoFagxzYZLY75T0MpczFHyNCDVqN+Fw0tw9Udff+7bs+WDV7pqK5PRRpJ2MswNohE0w8SpBUSMEJ0QpR9qOVeEcHsr5a1NuLlvM+rbaUH7TJbZoFJRwxXB8Go06MBCD47+4JVn/2w5xMvdulxJvUqiNAmJne9QTIyojoiT1IK6oY7WSjeKDgu4tz8A0t75afrbmkDcIRpUjlrEgYhQaQeWenD0jy8f/4vlTC73g50KVdzXHPbvyHRn8in0BdTBIlog2qQQqJmBY7mz8M3zR3506djStTC6/0zisqD/hoX6d//8vgG0izZAZ+rijWQEAaRZEN3AQsc5/MKR/K9ePH3slc5k87nDvXQh1wpx+93f/9gBGA2ngdjc+WRYIxWi4JFglmc1Sxf6/MWrVy+9nI8fXB0k9KwYonibivvDx/5UyNlO7UcoIlpM0wwQCW75Ilx5Svja9//o2jf6xeRaP0v6Xo2pRYhVTRI+mxL94gDQZNAcrNH31h+0d34GTpzI+cYPvnz1O/NUV3OqfjWekOcJhIQo1T7v/yMAoJJZ9Nb+5xnUE0Jl+QJcOiJ8+S+//sL3ZuPkUojVQhDD84xKoDZBNAeLBwlAie6EkBOpYDIiOPkMnDga+Op//dYLfzIbJ5c6Vh4PWlOpgATcAhDayXtbrTwQAA0I8xqsZDZwLIsceqbD93748pU/fSrlso/LI6oVZQBTGYNUwSVPa8mDK6ZxX2r0ewFMucnvmD5qVS+HhU7kyJefHvzlV84/83K++eBanmQLJtZyecYmuqWu4u55cEMsogJxH65gXxIIWJ5gvRk4kcHg2vHun3/twumXetXW5bleWJBYAuANkavEVNS9G7AcytZa7c+R/V4A/9bdFxECnuXOYgeWvvOloz+8eGT+pU7x4NJ8pgtWloQ0pY5gJDFEyYE8EPPEakQj4uAS2I87+oMlICKk5nML8KXvf/ncfz7aSy/3KS8u9fOFydY6tTtGIEpAPYRgGoIbIhVIxLVowl3v/sGTB0im7t+3XdJOuq+9DtNyvzRlnwR6wawzAyf+y7efe3XRi+cWE1kJZb00vL9BmgVClhDdMALaVNrBY+MmBFxah7c/K0qyXVCAltAHlAQltDwy4lQgRlBCGunnsHD1ZPan37j07POHYnylV9u5UFW5IGjaawKSKIhAaLmOtfmf5l3ArQOAuOxrGSRJQhojNW30H0IGnlC1NlpVCHhIYSGJzM7DxZfOzf6nK2dOnpn38mI3lmczt12quCM93V4+hj80yUcXySZFzbAJugUHaitBa8iBIFgxQSP5LJw+lfBn333hwleeObz4jE8eHLVqMpPowaboE0hwN4TQeEQ10Lbi6RCMbA5Wvnpy8a+/efHCV+ZidcXvrQ86iWAumPieu/sFA1C0YcQS28k3H4SSrOccOz/g+y+tnLm8Mph/YbYaPzsT6FdeEbdK5g4N2Cy29uWI9g0gwXoAFTZ2b3B0nSMrC3z3VH/26tcvXngxnYxWZimOJrHsbG5NGPRn6cz3uLN6l3Rmf2Zw3wA61EcBcicqJIOMp59ZTF55/ujRr5xbWrzSHW+dns0DZV1QSknoB9arB9gEZhbmiFX1+37j8QLowdG2bSU90eelK6dPnj331OLF5eDX8mJ8WOsxRVXjiaICtUPW6+KicasoyNBwkEWGJMJkZXn26gtnzq6cnO9dnInlhbTaetqrcmDBmhyDOViNI6hBLCtiSCsNKR5j2HdUsh8Al6+e7j81N1cuzPa6HdFBVselJNrAqanqAtXG9eR5Ri/tUFTO5nhMFZ1ut9tEwntbxr5IAP/31zdfP74g9fDw4eWzg4XlY1n+1FySz2YufTclJGBEJkXF1taQJEnpdmboiHaqokL3ySb3DWAi3L95z//f3dU7H7+d3rl37eSh+OzRo8PD3c6FVNLFjc37dHsZaaeDuFHXNVZXJB5IkH1FU48EAIB3qCrho1tb/M/Vd9d+/ca7a995+fSRV7/09InTCwsnnpoUw2RUTqqQBtdUsliWc0mb/i7jXprwRQOIYBMYCxOUSTSKCJPJzTurb3xw59lvvXTl7KGZ7FiWpd3JeHMxoU7nOx0yM0bDLTTLD272QNLxfoheWxTcqCk1bpTYxrrzm27k8Dv/9KsTXzt76IdfOXf2pUFvbiBbGwMfFVRE3Jqm1IOslydOlTheSstGCdrqdcUYPjVj/PfvrP3392+tDb956ZRdeGrZqslwxauCfr9HVY5xIlEEQ3FpKonqu5tad9TMtsE2Z93nGkoKmRRtw5EKal4rzU+nIE6dsDmM9fs3Kv5m9ee33njlzOTVa2dOXR7kycn7w3sXe3Gc5CmUWYdSQ5MXjQSi54kZAXBxohixDeBdNGKhFghqJPtLqyhNbtOwgOWCmkNtqLsbsXZi0CFuVhujf3r3DqvrD7aeO3Pm0+eePirJMF6qyg0mZUUMiqtCnDamK+5NIKPeRGLbAZi0F/Y5ku0mu12KLHjiWNW+AZxKGDmwAW9fXx8Pqzff/G5RDtNnTw5IhZMU9RzRSN16aZoSvaaoC4IqihAsJcQmYR2FELUOn9v09x8GsGsIimK5ocUUFVmAugagDoxQilHF7beH9Y9v/+rWb9bLQ6vnn1o+f3KwuCLjrRM+HnYJJRoUV29UxhURJRgEb/Ve2rQ2YZ8AWgkouuubTIW2fBQjUzVDYNP5MECvhlEB93765tr7m4V8J1mZHS1nXSeMV6piFJJMSbOcuortz2jDpdrAPmtrN4bgsp+0iifs5jJNcG/TZI3h3oT+GERwh1oZNS15TQP26zdX/3G8NZGrpw7HM4d60iU5afW4E8sKbTXTpFGfRmuM0P5krftLTCS02w8Mq5peTXs4Ye807XjT1233SXQrxq63u5LMP/Dyxi/uDtcflFsPCk5unj8yf3VGwrl6+GDQacEbELW5AYlDiNNOLfaXlWhOgu+A2G48jVC0uZVdQ1vroUhIKKLf70jXt3w8envDf1xef38kQesLh+aTPJ85T133pK27urQFHX+EWYmHNq/s+TA4eYTiMzL2BrRFRxEmbhuuSjQrbg75afzlzTqeO9n5o3On2brz4bODXpYX401CCGRJhtTKcDhmMBjgccJ+6HgDwFuL49st7dtqFJx8pzFbbQpSULxVjak1MWxUwPqdMb/8xQd3BuPxmG9cOR/W7nywMuh2evVkggSYVCXzy4e5f/8+SWe/yd09ydvP6+cP0GlftuTHcay26TYpATwhaIdo8cEW1Udvrpd/d3d99c7M/Ozk3PLieLy1ca2fdZLJ1oT+4BB3hxtkvRy3cp8APm8Djn/epgSNzXvD0ELwBKxquII1sD3gBK9gzagqg+p//ctN5MVTydWnlgeb9++tzM0OkgfDTUyoSSRaRb6fFZEwrdNOrUG7wJqSKcV0i5Q0WaOq+ayeJoS3Va8BVtGoEm4SNkQid43X/s8bt+Zzst4zCwvV2MuTUWTQ7aZJWW0l+T6ZrAbIt3dO7AbSqmZjnaimoX3Equkmte3GjulOBHG8XfHuSulho4bR7TH/8nf//PbP3ru/9fqmy3u9+bnReGuDrsr+C90BOttV9l2NFjs7TRsTG6GKWOVtRpGWtKoT1EldDNdIQ3has+UKYebeCG5/5Pzkb///9Z+su725Ntpcy9XIrdx3oVt3vWj0fe/3ya4LsucMeNMRGX1KbbzZfjHVrFEsiwJdHcHtVef1n772xq82LLmezh0phvW0PmYENxJruhO3e5C2p2OYRgRD3BAnMaE0qJIKNh+e8WfbZn7XdRds97aRFqE5sQEahGhWkbA+LOGtdf6299btGC5dvjOYyS+F8pMr/SBJXgWqwkGEkHeIWlNZJGoskJg3/ZZOZoHS0lmTMCoDa4l/rhf5PXq5e720Z3HaHXk6NQBVw1KaP44RXNkojHtv3X7wi5nux8WL507EmZAu1VQnUzNyzYiSUkwKKq3QjtLwMsOlpX5NtLddVXoswWzb5twAjdaSwcbaiiBD58Nf37h5592Pb38a084ndZKPKwlEEZIsNAbBKpIgKCRtMRcn2Y6BxJvy2KNpt9l5GaZrSSFtVEuB0FAVwTxQ1jDagLdeu37j1t1RfWMi2QelpozqmtprsjzQSRW1mu1Y3ZOmrtb+oDhJMHqPRgJ72MBUldr1CVW9/VkReeBKVcHwk5J/fv2d969/vFn9pu7M3iiDMpqMwEoSdbwqW9VXnICRYO0CD+69xB/THpqdHUmqIbQN0JoQsozK2Robq1GbgOiXHxU/vnFn4/pIkpvpbP9eJU5RF6g4gjVLyBWTBsTUTiikgf158YdG6+ge4q0Cwdt+joZkGS5YE83JWgXDMdz5zYd333j3ztrNSZLeopMXUaadvbIjXE9ic/cbbqBunQCdxyABeyjIdZygaeMwooEokiaU7ltjuGOB8SdjXv/1rY9u3C/rD2Pe+bhUqNwws7bxtdn40xDNVgLeMIhHA2CXf2hoh9FYOFMFNYuNGk3/3KxJuQg2jrJawPqba6N/+Pm7N98uk+S25Z0Hte8kwXTX97tM99ibtqq6z4nvmfz0/NDmzu2/3/NzqpiEGGFSwsZr76797IONzbfHmrw/ISBJ/vD/iKmLY0LdPr4hPnIVijBpGgCtbYptHFHjye0zoAFClo8LuLcJN//xjbffKPP+9ULzT2vNMJmaTcunLcEu5lOVeqQApoz1YQmYKpZv50mnAKZHCIzKalLDyALjG+v85J0769e90/9wXDP2NmhUDGnjqSk7fjT7yKYT2UXDmycSPLxHWLG8oe6mjSQMDKYFNu1kwweRWyO4/fc/f+e1YUxuxrTzidE0WQixrWgbiBNFh493R7fshKft2zD1DzvU3bC61DQNjIuyqoUROeO7BW/89tYHH+XdwdCR1gsaTdLVcYhTNrpvADvt9TsT3xsUTUc7+dDGIFMzmHY6mSIKacqo5n4Fw+s3bt9eG26tuWjZ/K8h2xIw8XYhPzoJ+J7zzltrdTbutUxT3rS5uWUkO+F5CRt3I6//9v2PbpWS33bPEE+aniOp8ebBKskj2QS0+9knD4HYZW2mICJMpsc0LN0OTStrSrYOJhT34fr/fvfT/7YV5l7fqrvv95I56nFF1IgnsU6bhMxjKLLvmfyuy7b3AHbUrGnjmuamYqGsjuHTdz6593boLtweTyJBEyQETCxaXadf2Cag3zk+E8I2Rw2jGkZv3Xh3XLhvDMsKT5JmE51JqMsqJDwqOr2PIdJ2Wm1faA5rKiybH2yNf/Hh6t018s5aFQJV3IkWH4sn/o+ONnrTvRdpylHFBFZ/e+vmJzbTfb9OwqiKhoqEJEkO/skeAireNB42S8EfMr3Thf/evdEvHtTx4zpJPzUkqiSepunji4n/sLEnfdNIYFLCxn24fnP17gelJp8ioVKX1N2fgCd77BrTusRuCUShKGC9gHvvra6+V+D3DS3Mmp6NJ0gC+tk8TmuKK9gsYP2tD8c/H5p/JCFUtPwIDnhP/V7C91DybHrWxGoYjeHO3Y3NdTQbeURQiQe+iOHzQLB99wXFJaGtiK7f/OTO3aCpmRkSQvUEPJaBlrU+7JQBAuTNwz2apVoJD27fHd92kcrRCpW6guHBAvicZPF0Z1SbcUhpt6vUyua9Ie8XZV2JqJvK+Al6xpZimO02Kk1eScK0p9uEWMLG/fsPTEQwvH5CVGjPFFr9b5NWTcpfZSqYam113d3Ea7dS9ICt0O7xcD2uoRE2fdKfyrRRYPLpqLwx0fQDcy2DkD0BD4dhu1tGGwNfIFA495QYwAlRcCdEKN4bFj97vr/wocViFIzeEwCg7cPYPZqWBItuFrBcrW1OhLhZywdrkwqLVY6jBw/g3zHcm6XsYGVtxebmJkJNDaN/BesnjjLQUHHqAAAAAElFTkSuQmCC');
    pointer-events: none;
}

/* Right concave vector notch */
.dbg-card-legacy .dbg-card-button::after {
    content: '';
    position: absolute;
    right: -10px;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1;
    background-repeat: no-repeat;
    background-size: cover;
    width: 11px;
    height: 28.33px;
    background-image: url('data:image/png;base64,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');
    pointer-events: none;
}

.dbg-card-legacy .dbg-card-button:hover {
    background-color: #9C4122 !important; /* background never changes */
    color: #BE9D5B !important;
}

/* ---- Responsive ---- */
/* 220px wide — image scales from 254px proportionally, card height 310px */
@media (max-width: 768px) {
    .dbg-builder-card.dbg-card-legacy,
    .dbg-card-legacy {
        width: 220px !important;
        max-width: 220px !important;
        height: 310px !important;
    }
    .dbg-card-legacy .dbg-legacy-image-wrap {
        height: 195px;
    }
    .dbg-card-legacy .dbg-legacy-price-amount {
        font-size: 18px;
    }
    .dbg-card-legacy .dbg-legacy-band-logo {
        max-width: 70px;
        max-height: 28px;
    }
}

/* Full width on mobile — auto height so nothing clips */
@media (max-width: 480px) {
    .dbg-builder-card.dbg-card-legacy,
    .dbg-card-legacy {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 360px !important;
    }
    .dbg-card-legacy .dbg-legacy-image-wrap {
        height: 56vw;
        max-height: 240px;
    }
    /* Hide notch pseudo-elements on full-width mobile to avoid overflow */
    .dbg-card-legacy .dbg-card-button::before,
    .dbg-card-legacy .dbg-card-button::after {
        display: none;
    }
}

/* ==========================================================================
   CARD STYLE: Wolf Ranch
   Image with optional promo badge ribbon, clean info section, dark button.
   Usage: [builder_grid card_style="wolf-ranch"]
   ========================================================================== */

.dbg-style-wolf-ranch .dbg-builder-card,
.dbg-card-wolf-ranch {
    display: flex;
    flex-direction: column;
    width: 340px;
    max-width: 340px;
    height: auto;
    border-radius: var(--dbg-radius);
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    background: #ffffff;
    flex-shrink: 0;
    /* Reset Valencia grid layout */
    grid-template-rows: unset;
}

/* Image wrapper */
.dbg-card-wolf-ranch .dbg-wolf-image-wrap {
    position: relative;
    width: 100%;
    height: 200px;
    overflow: hidden;
    flex-shrink: 0;
}

.dbg-card-wolf-ranch .dbg-wolf-house-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.dbg-card-wolf-ranch:hover .dbg-wolf-house-img {
    transform: scale(1.03);
}

.dbg-card-wolf-ranch .dbg-wolf-image-placeholder {
    width: 100%;
    height: 100%;
    background: var(--dbg-bg-light);
}

/* Promo badge ribbon */
.dbg-card-wolf-ranch .dbg-wolf-promo-badge {
    position: absolute;
    top: 14px;
    left: 0;
    z-index: 3;
    padding: 6px 14px 6px 12px;
    background: var(--accent-color, var(--dbg-accent));
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    line-height: 1.2;
    border-radius: 0 3px 3px 0;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.25);
    max-width: 85%;
}

/* Info section */
.dbg-card-wolf-ranch .dbg-wolf-info {
    padding: 14px 16px 10px;
    text-align: center;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.dbg-card-wolf-ranch .dbg-wolf-builder-name,
.dbg-card-wolf-ranch h3.dbg-wolf-builder-name {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: var(--dbg-text) !important;
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: 1px !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
    border: none !important;
}

.dbg-card-wolf-ranch .dbg-wolf-price {
    font-size: 13px;
    font-weight: 600;
    color: var(--dbg-text);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
    padding: 0;
}

.dbg-card-wolf-ranch .dbg-wolf-sqft {
    font-size: 12px;
    color: var(--dbg-text-light);
    margin: 0;
    padding: 0;
}

.dbg-card-wolf-ranch .dbg-wolf-location {
    font-size: 11px;
    color: var(--dbg-text-light);
    font-style: italic;
    margin: 2px 0 0;
    padding: 0;
    text-transform: none;
}

/* Button — dark teal / primary color */
.dbg-card-wolf-ranch .dbg-wolf-button.dbg-card-button {
    grid-row: unset;
    position: relative;
    z-index: 3;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;
    width: 100% !important;
    padding: 12px 0 !important;
    background-color: var(--dbg-primary) !important;
    color: #ffffff !important;
    border: none !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    cursor: pointer;
    transition: background-color 0.3s ease;
    height: auto !important;
    margin-top: auto;
}

.dbg-card-wolf-ranch .dbg-wolf-button.dbg-card-button:hover {
    background-color: var(--dbg-primary-dark) !important;
}

.dbg-card-wolf-ranch .dbg-wolf-btn-plus {
    font-size: 18px;
    line-height: 1;
    font-weight: 300;
}

/* Wolf Ranch responsive */
@media (max-width: 768px) {
    .dbg-style-wolf-ranch .dbg-builder-card,
    .dbg-card-wolf-ranch {
        width: 280px;
        max-width: 280px;
    }

    .dbg-card-wolf-ranch .dbg-wolf-image-wrap {
        height: 170px;
    }
}

@media (max-width: 480px) {
    .dbg-style-wolf-ranch .dbg-builder-card,
    .dbg-card-wolf-ranch {
        width: 100% !important;
        max-width: 100% !important;
    }

    .dbg-card-wolf-ranch .dbg-wolf-image-wrap {
        height: 200px;
    }
}


/* ==========================================================================
   CARD STYLE: Treeline
   Minimal photo grid — large image, plain builder name below, no button UI.
   Usage: [builder_grid card_style="treeline"]
   ========================================================================== */

.dbg-style-treeline .dbg-builder-card,
.dbg-card-treeline {
    display: flex;
    flex-direction: column;
    width: 340px;
    max-width: 340px;
    height: auto;
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
    cursor: pointer;
    background: transparent;
    flex-shrink: 0;
    /* Reset Valencia grid layout */
    grid-template-rows: unset;
}

/* Image wrapper */
.dbg-card-treeline .dbg-treeline-image-wrap {
    position: relative;
    width: 100%;
    height: 220px;
    overflow: hidden;
}

.dbg-card-treeline .dbg-treeline-house-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.45s ease;
}

.dbg-card-treeline:hover .dbg-treeline-house-img {
    transform: scale(1.04);
}

.dbg-card-treeline .dbg-treeline-image-placeholder {
    width: 100%;
    height: 100%;
    background: var(--dbg-bg-light);
}

/* Subtle hover overlay — just a slight darken */
.dbg-card-treeline .dbg-treeline-hover-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0);
    transition: background 0.35s ease;
    pointer-events: none;
}

.dbg-card-treeline:hover .dbg-treeline-hover-overlay {
    background: rgba(0, 0, 0, 0.15);
}

/* Info section */
.dbg-card-treeline .dbg-treeline-info {
    padding: 14px 4px 10px;
    text-align: center;
}

.dbg-card-treeline .dbg-treeline-builder-name,
.dbg-card-treeline h3.dbg-treeline-builder-name {
    font-size: 18px !important;
    font-weight: 400 !important;
    color: var(--dbg-text) !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-align: center !important;
    border: none !important;
}

.dbg-card-treeline .dbg-treeline-price {
    font-size: 14px;
    color: var(--dbg-text-light);
    margin: 4px 0 0;
    padding: 0;
}

/* Treeline responsive */
@media (max-width: 768px) {
    .dbg-style-treeline .dbg-builder-card,
    .dbg-card-treeline {
        width: 280px;
        max-width: 280px;
    }

    .dbg-card-treeline .dbg-treeline-image-wrap {
        height: 185px;
    }
}

@media (max-width: 480px) {
    .dbg-style-treeline .dbg-builder-card,
    .dbg-card-treeline {
        width: 100% !important;
        max-width: 100% !important;
    }

    .dbg-card-treeline .dbg-treeline-image-wrap {
        height: 210px;
    }
}