/*
Theme Name: Energia SEO Clone
Theme URI: https://energia-seo-master.lovable.app/
Author: Energia SEO Custom Theme
Description: A custom WordPress theme matching exactly the Lovable Energia SEO design.
Version: 1.0.0
Text Domain: energia-seo
*/

@font-face {
    font-family: 'CameraPlainVariable';
    src: url('https://cdn.gpteng.co/mcp-widgets/v1/fonts/CameraPlainVariable.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* Dropdown Menu CSS Fix - Standard fallback for dynamic walker menus */
.menu-item-has-children {
    position: relative;
}

.menu-item-has-children.group > ul {
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 50;
    display: none !important;
    min-width: 200px;
    background-color: hsl(var(--background, 0 0% 100%));
    border: 1px solid hsl(var(--border, 214.3 31.8% 91.4%));
    border-radius: 0.375rem;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    padding: 0.5rem 0;
    margin-top: 0.25rem;
}

.menu-item-has-children.group:hover > ul {
    display: block !important;
}

/* =========================================================================
   Lovable Sidebar Elementor Form Styles
   Usage: Add CSS Classes -> "lovable-sidebar-form" to the Elementor Widget
   ========================================================================= */

.lovable-sidebar-form .elementor-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Force all form fields and buttons to take full width regardless of Elementor settings */
.lovable-sidebar-form .elementor-field-group,
.lovable-sidebar-form .elementor-column {
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: 100% !important;
}

.lovable-sidebar-form .elementor-field-label {
    font-size: 0.875rem !important; /* text-sm */
    font-weight: 500 !important; /* font-medium */
    color: hsl(20, 14.3%, 4.1%) !important; /* foreground */
    margin-bottom: 0.5rem !important;
    display: block !important;
}

.lovable-sidebar-form .elementor-field-textual,
.lovable-sidebar-form .elementor-select-wrapper select {
    display: flex !important;
    height: 2.5rem !important; /* h-10 */
    width: 100% !important;
    border-radius: 0.375rem !important; /* rounded-md */
    border: 1px solid hsl(20, 5.9%, 90%) !important; /* border-input */
    background-color: hsl(44, 33%, 97.5%) !important; /* bg-background */
    padding: 0.5rem 0.75rem !important; /* px-3 py-2 */
    font-size: 0.875rem !important; /* text-sm */
    color: hsl(20, 14.3%, 4.1%) !important; /* foreground */
    transition: box-shadow 0.2s, border-color 0.2s !important;
    box-shadow: none !important;
}

.lovable-sidebar-form .elementor-field-textual::placeholder {
    color: hsl(25, 5.3%, 44.7%) !important; /* text-muted-foreground */
}

/* Focus States */
.lovable-sidebar-form .elementor-field-textual:focus,
.lovable-sidebar-form .elementor-select-wrapper select:focus {
    outline: none !important;
    border-color: hsl(150, 51.5%, 38.6%) !important; /* border-primary */
    box-shadow: 0 0 0 2px hsl(44, 33%, 97.5%), 0 0 0 4px hsl(150, 51.5%, 38.6%) !important;
}

/* Form Buttons (Siguiente, Submit) */
.lovable-sidebar-form .elementor-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    border-radius: 0.375rem !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    height: 2.75rem !important;
    padding: 0 2rem !important;
    background-color: hsl(150, 51.5%, 38.6%) !important; /* bg-primary */
    color: hsl(210, 40%, 98%) !important; /* text-primary-foreground */
    border: none !important;
    width: 100% !important;
    transition: background-color 0.2s, opacity 0.2s !important;
}

.lovable-sidebar-form .elementor-button:hover {
    opacity: 0.9 !important;
}

/* Multi-step Form Indicators */
.lovable-sidebar-form .e-form__indicators {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 2rem !important;
    gap: 0 !important;
    flex-wrap: nowrap !important;
}

.lovable-sidebar-form .e-form__indicator,
.lovable-sidebar-form .e-form__indicators__indicator,
.lovable-sidebar-form div.elementor-step-indicator,
.lovable-sidebar-form .elementor-step-wrapper,
.lovable-sidebar-form .elementor-step-item,
.lovable-sidebar-form .elementor-step {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    padding: 0 !important;
    margin: 0 !important;
    flex: initial !important;
    width: auto !important;
}

/* Step Number Badge */
.lovable-sidebar-form .e-form__indicator__icon,
.lovable-sidebar-form .e-form__indicator__shape,
.lovable-sidebar-form .e-form__indicators__indicator__icon,
.lovable-sidebar-form .e-form__indicators__indicator__shape,
.lovable-sidebar-form .elementor-step-icon,
.lovable-sidebar-form div.elementor-step-number {
    display: flex !important;
    height: 1.75rem !important;
    width: 1.75rem !important;
    min-width: 1.75rem !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 9999px !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    background-color: hsl(60, 4.8%, 95.9%) !important; /* bg-muted */
    color: hsl(25, 5.3%, 44.7%) !important; /* text-muted-foreground */
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* Ensure the number inside the shape also behaves well */
.lovable-sidebar-form .e-form__indicator__number,
.lovable-sidebar-form .e-form__indicators__indicator__number,
.lovable-sidebar-form .elementor-step-number span {
    font-size: inherit !important;
    color: inherit !important;
}

/* Inactive Text */
.lovable-sidebar-form .e-form__indicator__label,
.lovable-sidebar-form .e-form__indicators__indicator__label,
.lovable-sidebar-form .elementor-step-title {
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    color: hsl(25, 5.3%, 44.7%) !important;
    white-space: nowrap !important;
    margin: 0 !important;
    line-height: 1 !important;
}

/* Active / Completed Texts and Badges */
.lovable-sidebar-form .e-form__indicator--state-active .e-form__indicator__icon,
.lovable-sidebar-form .e-form__indicator--state-active .e-form__indicator__shape,
.lovable-sidebar-form .e-form__indicators__indicator--state-active .e-form__indicators__indicator__icon,
.lovable-sidebar-form .e-form__indicators__indicator--state-active .e-form__indicators__indicator__shape,
.lovable-sidebar-form .elementor-step-active .elementor-step-icon,
.lovable-sidebar-form .elementor-step-active div.elementor-step-number,
.lovable-sidebar-form .e-form__indicator--state-completed .e-form__indicator__icon,
.lovable-sidebar-form .e-form__indicator--state-completed .e-form__indicator__shape,
.lovable-sidebar-form .e-form__indicators__indicator--state-completed .e-form__indicators__indicator__icon,
.lovable-sidebar-form .e-form__indicators__indicator--state-completed .e-form__indicators__indicator__shape,
.lovable-sidebar-form .elementor-step-completed .elementor-step-icon,
.lovable-sidebar-form .elementor-step-completed div.elementor-step-number {
    background-color: hsl(150, 51.5%, 38.6%) !important;
    color: hsl(210, 40%, 98%) !important;
    border-color: hsl(150, 51.5%, 38.6%) !important;
}

.lovable-sidebar-form .e-form__indicator--state-active .e-form__indicator__label,
.lovable-sidebar-form .e-form__indicators__indicator--state-active .e-form__indicators__indicator__label,
.lovable-sidebar-form .elementor-step-active .elementor-step-title,
.lovable-sidebar-form .e-form__indicator--state-completed .e-form__indicator__label,
.lovable-sidebar-form .e-form__indicators__indicator--state-completed .e-form__indicators__indicator__label,
.lovable-sidebar-form .elementor-step-completed .elementor-step-title {
    color: hsl(20, 14.3%, 4.1%) !important;
}

/* Separator Line between steps */
.lovable-sidebar-form .e-form__indicators__separator,
.lovable-sidebar-form .e-form__indicator__separator,
.lovable-sidebar-form .elementor-step-divider {
    flex: 1 !important;
    height: 0.125rem !important; /* 2px */
    border-radius: 0.25rem !important;
    background-color: hsl(60, 4.8%, 95.9%) !important;
    margin: 0 0.5rem !important;
    min-width: 2rem !important;
    display: block !important;
}

/* Previous / Next Button Layout */
.lovable-sidebar-form .e-form__buttons {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
    width: 100% !important;
    margin-top: 1rem !important;
}

/* Button Wrapper (Forces side-by-side flex layout) */
.lovable-sidebar-form .e-form__buttons,
.lovable-sidebar-form .elementor-field-type-submit {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
    width: 100% !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
}

/* Force flex rules on whatever Elementor uses to wrap the buttons */
.lovable-sidebar-form .e-form__buttons > *,
.lovable-sidebar-form .elementor-field-type-submit > * {
    display: flex !important;
}
.lovable-sidebar-form .e-form__buttons > *:last-child,
.lovable-sidebar-form .elementor-field-type-submit > *:last-child {
    flex: 1 1 auto !important;
    width: 100% !important;
}
.lovable-sidebar-form .e-form__buttons > *:first-child:not(:last-child),
.lovable-sidebar-form .elementor-field-type-submit > *:first-child:not(:last-child) {
    flex: 0 0 3rem !important;
    width: 3rem !important;
}

/* Previous Button (<) */
.lovable-sidebar-form button[class*="previous"],
.lovable-sidebar-form .elementor-button[class*="previous"],
.lovable-sidebar-form .elementor-field-type-submit button.elementor-button:nth-child(1):nth-last-child(2) {
    width: 100% !important;
    min-width: 3rem !important;
    max-width: 3rem !important;
    height: 2.75rem !important;
    padding: 0 !important;
    background-color: transparent !important;
    border: 1px solid hsl(20, 5.9%, 90%) !important;
    color: transparent !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 0.375rem !important;
}

/* Hide user text/span inside Previous Button */
.lovable-sidebar-form button[class*="previous"] *,
.lovable-sidebar-form .elementor-button[class*="previous"] *,
.lovable-sidebar-form .elementor-field-type-submit button.elementor-button:nth-child(1):nth-last-child(2) * {
    display: none !important;
}

/* Base64 Encoded SVG Chevron Icon for Previous Button */
.lovable-sidebar-form button[class*="previous"]::before,
.lovable-sidebar-form .elementor-button[class*="previous"]::before,
.lovable-sidebar-form .elementor-field-type-submit button.elementor-button:nth-child(1):nth-last-child(2)::before {
    content: "" !important;
    display: block !important;
    width: 1.25rem !important;
    height: 1.25rem !important;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiMwYzBhMDkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJtMTUgMTgtNi02IDYtNiIvPjwvc3ZnPg==') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.lovable-sidebar-form button[class*="previous"]:hover,
.lovable-sidebar-form .elementor-button[class*="previous"]:hover {
    background-color: hsl(60, 4.8%, 95.9%) !important;
}

/* Ensure next/submit button element takes 100% of its wrapper */
.lovable-sidebar-form button[class*="next"],
.lovable-sidebar-form button[class*="submit"],
.lovable-sidebar-form .elementor-button[class*="next"],
.lovable-sidebar-form .elementor-button[class*="submit"],
.lovable-sidebar-form .elementor-field-type-submit button.elementor-button:last-child {
    flex: 1 1 auto !important;
    width: 100% !important;
}
.lovable-sidebar-form .elementor-field-type-html {
    display: flex !important;
    align-items: center !important;
    text-align: center !important;
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: hsl(150, 51.5%, 38.6%) !important; /* primary text */
    margin: 1.5rem 0 !important;
    white-space: nowrap !important;
}

.lovable-sidebar-form .elementor-field-type-html::before,
.lovable-sidebar-form .elementor-field-type-html::after {
    content: "" !important;
    flex: 1 !important;
    border-bottom: 2px solid hsl(20, 5.9%, 90%) !important;
    margin: 0 0.75rem !important;
}

.lovable-sidebar-form .elementor-field-type-html * {
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    text-transform: inherit !important;
    letter-spacing: inherit !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* =========================================================================
   Simulador de Ahorro Energético (TuCAE)
   ========================================================================= */

.energia-seo-simulador-section {
    padding: 3rem 1rem;
    background-color: hsl(0, 0%, 100%);
    color: hsl(20, 14.3%, 4.1%);
    font-family: 'CameraPlainVariable', sans-serif;
}

.energia-seo-simulador-container {
    max-width: 56rem;
    margin: 0 auto;
}

/* Header */
.energia-seo-simulador-header {
    text-align: center;
    margin-bottom: 3rem;
}

.energia-seo-simulador-icon-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem;
    background-color: rgba(45, 138, 97, 0.1); /* Primary color with opacity */
    border-radius: 0.75rem;
    margin-bottom: 1.5rem;
    color: hsl(150, 51.5%, 38.6%); /* Primary */
}

.energia-seo-simulador-svg {
    width: 2rem;
    height: 2rem;
}

.energia-seo-simulador-title {
    font-size: 1.875rem; /* text-3xl */
    line-height: 2.25rem;
    font-weight: 700;
    color: hsl(20, 14.3%, 4.1%);
    margin: 0 0 1rem 0;
}

@media (min-width: 768px) {
    .energia-seo-simulador-title {
        font-size: 2.25rem; /* md:text-4xl */
        line-height: 2.5rem;
    }
}

.energia-seo-simulador-desc {
    font-size: 1.125rem; /* text-lg */
    color: hsl(25, 5.3%, 44.7%); /* muted-foreground */
    max-width: 42rem;
    margin: 0 auto;
}

/* Card */
.energia-seo-simulador-card {
    max-width: 48rem;
    margin: 0 auto;
    background-color: hsl(0, 0%, 100%);
    border-radius: 0.75rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    border: 1px solid hsl(20, 5.9%, 90%); /* border */
    padding: 1.5rem;
}

@media (min-width: 768px) {
    .energia-seo-simulador-card {
        padding: 2rem;
    }
}

.energia-seo-simulador-card-title {
    font-size: 1.25rem; /* text-xl */
    font-weight: 600;
    margin: 0 0 1.5rem 0;
    color: hsl(20, 14.3%, 4.1%);
}

/* Form */
.energia-seo-simulador-form {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.energia-seo-simulador-field-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.energia-seo-simulador-label {
    font-size: 0.875rem; /* text-sm */
    font-weight: 500;
    line-height: 1;
    color: hsl(20, 14.3%, 4.1%);
}

.energia-seo-simulador-input {
    display: flex;
    height: 2.5rem; /* h-10 */
    width: 100%;
    border-radius: 0.375rem;
    border: 1px solid hsl(20, 5.9%, 90%); /* border-input */
    background-color: hsl(0, 0%, 100%);
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    color: hsl(20, 14.3%, 4.1%);
    font-family: inherit;
    transition: background-color 0.2s, border-color 0.2s, box-shadow 0.2s;
    appearance: none; /* Basic styling to allow uniform select dropdowns */
}

/* Fix for select arrow on webkit/firefox */
.energia-seo-simulador-select-wrap {
    position: relative;
    width: 100%;
}

.energia-seo-simulador-select-arrow {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    width: 1rem;
    height: 1rem;
    opacity: 0.5;
    color: hsl(20, 14.3%, 4.1%);
}

.energia-seo-simulador-input:focus {
    outline: none;
    border-color: hsl(150, 51.5%, 38.6%);
    box-shadow: 0 0 0 2px hsl(0, 0%, 100%), 0 0 0 4px hsl(150, 51.5%, 38.6%);
}

.energia-seo-simulador-input::placeholder {
    color: hsl(25, 5.3%, 44.7%);
}

.energia-seo-simulador-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    border-radius: 0.375rem;
    font-size: 0.875rem; /* text-sm but looks bigger maybe? text-base usually for 11 */
    font-weight: 500;
    transition: background-color 0.2s;
    height: 2.75rem; /* h-11 */
    padding: 0 2rem;
    width: 100%;
    background-color: hsl(150, 51.5%, 38.6%); /* bg-primary */
    color: hsl(210, 40%, 98%); /* text-primary-foreground */
    border: none;
    cursor: pointer;
    font-family: inherit;
}

.energia-seo-simulador-btn:hover {
    background-color: hsla(150, 51.5%, 38.6%, 0.9); /* bg-primary/90 */
}

/* Results */
.energia-seo-simulador-results {
    margin-top: 2rem;
    padding: 1.5rem;
    background-color: rgba(244, 244, 245, 0.3); /* muted/30 */
    border-radius: 0.5rem; /* rounded-lg */
}

.energia-seo-simulador-results-title {
    text-align: center;
    font-weight: 500;
    color: hsl(25, 5.3%, 44.7%); /* text-muted-foreground */
    margin: 0 0 1.5rem 0;
    font-size: 1rem;
}

.energia-seo-simulador-results-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 768px) {
    .energia-seo-simulador-results-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.energia-seo-simulador-result-item {
    text-align: center;
}

.energia-seo-simulador-result-value {
    font-size: 1.875rem; /* text-3xl */
    line-height: 2.25rem;
    font-weight: 700;
    color: hsl(150, 51.5%, 38.6%); /* text-primary */
    margin-bottom: 0.25rem;
}

.energia-seo-simulador-result-label {
    font-size: 0.875rem; /* text-sm */
    color: hsl(25, 5.3%, 44.7%); /* text-muted-foreground */
}

/* Result Colors */
.energia-seo-simulador-result-value.val-green {
    color: hsl(150, 51.5%, 38.6%); /* #2D8A61 */
}

.energia-seo-simulador-result-value.val-orange {
    color: hsl(45, 93%, 47%); /* #EAB308 */
}

.energia-seo-simulador-result-value.val-blue {
    color: hsl(217, 91%, 60%); /* #3B82F6 */
}

/* Results Note */
.energia-seo-simulador-results-note {
    font-size: 0.75rem;
    color: hsl(25, 5.3%, 44.7%);
    text-align: center;
    margin-top: 1.5rem;
    line-height: 1.25rem;
}

/* Footer Contact Area */
.energia-seo-simulador-footer-contact {
    margin-top: 2rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.energia-seo-simulador-footer-text {
    font-size: 0.875rem;
    color: hsl(25, 5.3%, 44.7%);
    margin: 0;
}

.energia-seo-simulador-footer-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    white-space: nowrap;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    transition: background-color 0.2s, color 0.2s;
    height: 2.25rem; /* h-9 */
    padding: 0 1rem;
    background-color: transparent;
    border: 1px solid hsl(20, 5.9%, 90%); /* border-input */
    color: hsl(20, 14.3%, 4.1%); /* foreground */
    text-decoration: none;
}

.energia-seo-simulador-footer-btn:hover {
    background-color: hsl(60, 4.8%, 95.9%); /* accent */
    color: hsl(20, 14.3%, 4.1%); /* accent-foreground */
}

/* =========================================================================
   Edificios Page Elementor Widget
   ========================================================================= */

.energia-seo-edificios-page-widget {
    font-family: 'CameraPlainVariable', sans-serif;
    color: hsl(20, 14.3%, 4.1%);
}

/* Hero Section */
.energia-seo-edificios-hero {
    background-color: hsl(150, 51.5%, 38.6%); /* bg-primary */
    padding-top: 8rem; /* pt-32 */
    padding-bottom: 6rem; /* pb-24 */
    color: #ffffff;
}

.energia-seo-edificios-hero-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
    text-align: center;
}



.energia-seo-edificios-hero-badge {
    display: inline-block;
    padding: 0.375rem 1rem; /* px-4 py-1.5 */
    border-radius: 9999px;
    background-color: rgba(255, 255, 255, 0.1); /* bg-white/10 */
    border: 1px solid rgba(255, 255, 255, 0.2); /* border-white/20 */
    font-size: 0.875rem; /* text-sm */
    font-weight: 500;
    margin-bottom: 1.5rem; /* mb-6 */
    /* animate-fade-up could be simulated here, but static is fine for widget styling */
}

.energia-seo-edificios-hero-title {
    font-size: 2.25rem; /* text-4xl */
    line-height: 2.5rem;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 1.5rem; /* mb-6 */
    color: #ffffff;
}

@media (min-width: 768px) {
    .energia-seo-edificios-hero-title {
        font-size: 3rem; /* md:text-5xl */
        line-height: 1;
    }
}

@media (min-width: 1024px) {
    .energia-seo-edificios-hero-title {
        font-size: 3.75rem; /* lg:text-6xl */
        line-height: 1;
    }
}

.energia-seo-edificios-hero-desc {
    font-size: 1.125rem; /* text-lg */
    line-height: 1.75rem;
    color: rgba(255, 255, 255, 0.8); /* text-white/80 */
    max-width: 48rem; /* max-w-3xl */
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .energia-seo-edificios-hero-desc {
        font-size: 1.25rem; /* md:text-xl */
        line-height: 1.75rem;
    }
}

/* Cards Section */
.energia-seo-edificios-cards-section {
    padding-top: 5rem; /* py-20 */
    padding-bottom: 5rem;
    background-color: hsl(210, 40%, 98%); /* bg-slate-50 */
}

.energia-seo-edificios-cards-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}



.energia-seo-edificios-cards-grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 2rem; /* gap-8 */
}

@media (min-width: 768px) {
    .energia-seo-edificios-cards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
    .energia-seo-edificios-cards-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.energia-seo-edificios-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
    height: 100%;
}

.energia-seo-edificios-card {
    background-color: #ffffff;
    border-radius: 0.75rem; /* rounded-xl */
    padding: 2rem; /* p-8 */
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); /* shadow-sm */
    border: 1px solid hsl(214.3, 31.8%, 91.4%); /* border-slate-100 */
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: all 0.3s ease;
}

.energia-seo-edificios-card-link:hover .energia-seo-edificios-card {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* hover:shadow-md */
    transform: translateY(-0.25rem); /* hover:-translate-y-1 */
}

.energia-seo-edificios-card-icon-wrap {
    width: 3rem; /* w-12 */
    height: 3rem; /* h-12 */
    border-radius: 0.5rem; /* rounded-lg */
    background-color: rgba(45, 138, 97, 0.1); /* bg-primary/10 */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem; /* mb-6 */
    color: hsl(150, 51.5%, 38.6%); /* text-primary */
    transition: background-color 0.3s, color 0.3s;
}

.energia-seo-edificios-card-icon-wrap svg,
.energia-seo-edificios-card-icon-wrap i {
    width: 1.5rem;
    height: 1.5rem;
    font-size: 1.5rem;
    display: block;
}

.energia-seo-edificios-card-link:hover .energia-seo-edificios-card-icon-wrap {
    background-color: hsl(150, 51.5%, 38.6%); /* group-hover:bg-primary */
    color: #ffffff; /* group-hover:text-white */
}

/* Fix CSS Arrow to match SVG strictly */
.energia-seo-edificios-card-action svg,
.energia-seo-edificios-card-action i {
    width: 1.25rem;
    height: 1.25rem;
    stroke-width: 2;
}

.energia-seo-edificios-card-title {
    font-size: 1.375rem; /* slightly smaller, e.g. text-xl/2xl */
    line-height: 1.75rem;
    font-weight: 600; /* match the semibold look */
    margin-top: 0;
    margin-bottom: 0.75rem; /* mb-3 */
    color: hsl(20, 14.3%, 4.1%); /* dark slate/black as in screenshot */
    transition: color 0.3s ease;
}

.energia-seo-edificios-card-link:hover .energia-seo-edificios-card-title {
    color: hsl(150, 51.5%, 38.6%); /* title turns green on hover */
}

.energia-seo-edificios-card-desc {
    font-size: 0.9375rem; /* 15px */
    color: hsl(215.4, 16.3%, 46.9%); /* text-slate-600 */
    margin-top: 0;
    margin-bottom: 1.5rem; /* mb-6 */
    flex-grow: 1;
    line-height: 1.625;
}

.energia-seo-edificios-card-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem; /* gap-2 */
    margin-bottom: 1.5rem; /* mb-6 */
}

.energia-seo-edificios-card-badge {
    padding: 0.25rem 0.5rem; /* tighter padding */
    border-radius: 9999px; /* rounded-full */
    font-size: 0.75rem; /* text-xs */
    font-weight: 600; /* font-semibold */
}

.energia-seo-edificios-card-badge.badge-amber {
    background-color: hsl(45, 93%, 47%); /* vibrant amber to match screenshot */
    color: #ffffff; /* white text */
}

.energia-seo-edificios-card-badge.badge-slate {
    background-color: transparent;
    border: 1px solid hsl(214.3, 31.8%, 91.4%); /* light border */
    color: hsl(215.4, 16.3%, 46.9%); /* text-slate-600 */
}

.energia-seo-edificios-card-action {
    display: flex;
    align-items: center;
    color: hsl(150, 51.5%, 38.6%); /* text-primary */
    font-weight: 600;
    font-size: 0.9375rem; /* matching the size to look balanced */
    gap: 0.375rem; /* default gap */
    transition: gap 0.3s ease;
}

.energia-seo-edificios-card-link:hover .energia-seo-edificios-card-action {
    gap: 0.625rem; /* group-hover:gap, arrow slides right */
}

/* ==========================================================================
   Subvenciones Page Widget Styles
   ========================================================================== */

.energia-seo-subvenciones-cards-list > :not([hidden]) ~ :not([hidden]) {
    margin-top: 1.5rem;
}

.energia-seo-subvenciones-card {
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.energia-seo-subvenciones-card-link:hover .energia-seo-subvenciones-card {
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    transform: translateY(-0.125rem);
}

.energia-seo-subvenciones-hero-title,
.energia-seo-subvenciones-card-title {
    font-family: inherit; /* Inherit display font from theme */
}