Hub Transnacional

/* ========================= HERRERA ANDONIE - HUB STYLE ========================= */ :root{ --ha-navy:#0B1F3A; --ha-blue:#324B5D; --ha-gold:#A18F5A; --ha-text:#1F2937; --ha-muted:#6B7280; --ha-line:#E5E7EB; --ha-bg:#F7F7F5; --ha-white:#FFFFFF; --ha-radius:18px; --ha-shadow:0 12px 30px rgba(11,31,58,.08); --ha-shadow-hover:0 18px 42px rgba(11,31,58,.14); --ha-max:1200px; } /* Base */ body{ color:var(--ha-text); background:var(--ha-bg); } h1,h2,h3,h4,h5,h6{ font-family:"Playfair Display", serif; color:var(--ha-navy); letter-spacing:-0.02em; } body, p, li, a, span, input, textarea, button{ font-family:"Inter", "Open Sans", sans-serif; } /* Contenedor general */ .site, .elementor-section.elementor-section-boxed > .elementor-container{ max-width:var(--ha-max); margin-inline:auto; } /* Header / menú */ header, .elementor-location-header{ background:rgba(255,255,255,.88); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid rgba(229,231,235,.8); } .elementor-nav-menu a{ color:var(--ha-navy) !important; font-weight:500; transition:.25s ease; } .elementor-nav-menu a:hover, .elementor-nav-menu .current-menu-item > a{ color:var(--ha-blue) !important; } /* Hero */ .ha-hero, .hero, .elementor-widget-slides .swiper-slide{ position:relative; overflow:hidden; min-height:78vh; border-bottom-left-radius:28px; border-bottom-right-radius:28px; } .ha-hero::before, .hero::before{ content:""; position:absolute; inset:0; background:linear-gradient( 90deg, rgba(11,31,58,.78) 0%, rgba(11,31,58,.52) 45%, rgba(11,31,58,.24) 100% ); z-index:1; } .ha-hero .elementor-container, .hero .elementor-container{ position:relative; z-index:2; } .ha-hero h1, .hero h1{ color:#fff !important; font-size:clamp(42px, 6vw, 86px); line-height:0.95; margin-bottom:16px; max-width:10ch; } .ha-hero p, .hero p{ color:rgba(255,255,255,.92) !important; font-size:clamp(16px, 1.6vw, 20px); line-height:1.6; max-width:58ch; } /* Botones */ .elementor-button, button, .wp-element-button{ border-radius:999px !important; padding:14px 24px !important; font-weight:600; border:1px solid transparent; transition:.28s ease; box-shadow:none !important; } .elementor-button.elementor-size-sm{ padding:12px 20px !important; } .ha-btn-primary .elementor-button, .elementor-button-wrapper .elementor-button{ background:var(--ha-navy) !important; color:#fff !important; } .ha-btn-primary .elementor-button:hover, .elementor-button-wrapper .elementor-button:hover{ background:var(--ha-blue) !important; transform:translateY(-1px); } .ha-btn-outline .elementor-button{ background:transparent !important; color:var(--ha-navy) !important; border-color:rgba(11,31,58,.18) !important; } .ha-btn-outline .elementor-button:hover{ background:var(--ha-navy) !important; color:#fff !important; } /* Secciones */ section, .elementor-section{ position:relative; } .ha-section-title h2, .elementor-widget-heading.ha-section-title h2{ font-size:clamp(34px, 4vw, 56px); margin-bottom:8px; } .ha-section-kicker{ display:inline-flex; align-items:center; gap:10px; color:var(--ha-blue); font-size:13px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; } .ha-section-kicker::before{ content:""; width:38px; height:1px; background:var(--ha-gold); } /* Tarjetas / hubs / grids */ .ha-card, .elementor-post, .elementor-icon-box-wrapper, .flip-box, .elementor-flip-box, .elementor-widget-posts .elementor-post, .tpgb-card, .grid-item{ background:var(--ha-white); border:1px solid rgba(229,231,235,.9); border-radius:var(--ha-radius); box-shadow:var(--ha-shadow); transition:.32s ease; overflow:hidden; } .ha-card:hover, .elementor-post:hover, .elementor-flip-box:hover, .tpgb-card:hover, .grid-item:hover{ transform:translateY(-6px); box-shadow:var(--ha-shadow-hover); } /* Hub nav cards */ .ha-hub-card{ position:relative; padding:28px; min-height:210px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; } .ha-hub-card::after{ content:""; position:absolute; inset:auto 0 0 auto; width:90px; height:90px; background:linear-gradient(135deg, transparent 50%, var(--ha-blue) 50%); opacity:0; transition:.3s ease; } .ha-hub-card::before{ content:"››"; position:absolute; right:16px; bottom:10px; font-size:28px; color:#fff; opacity:0; z-index:2; transition:.3s ease; } .ha-hub-card:hover{ background:var(--ha-navy); } .ha-hub-card:hover *{ color:#fff !important; } .ha-hub-card:hover::after, .ha-hub-card:hover::before{ opacity:1; } /* Stats / navigation blocks */ .ha-stat{ text-align:left; padding:24px 26px; border-radius:var(--ha-radius); border:1px solid rgba(229,231,235,.9); background:#fff; box-shadow:var(--ha-shadow); transition:.28s ease; } .ha-stat:hover{ transform:translateY(-4px); box-shadow:var(--ha-shadow-hover); background:var(--ha-navy); } .ha-stat:hover *{ color:#fff !important; } .ha-stat .number{ display:block; font-family:"Playfair Display", serif; color:var(--ha-navy); font-size:clamp(34px, 4vw, 64px); line-height:1; margin-bottom:8px; } .ha-stat .label{ color:var(--ha-muted); font-size:15px; line-height:1.45; } /* About / text sections */ .ha-copy, .elementor-widget-text-editor{ color:var(--ha-text); } .ha-copy p, .elementor-widget-text-editor p{ font-size:16px; line-height:1.85; color:var(--ha-text); } .ha-copy p + p{ margin-top:20px; } /* Equipo */ .ha-team-card{ position:relative; overflow:hidden; border-radius:20px; background:#fff; border:1px solid rgba(229,231,235,.9); box-shadow:var(--ha-shadow); } .ha-team-card img{ width:100%; display:block; aspect-ratio:4/5; object-fit:cover; } .ha-team-card .content{ padding:18px 20px 22px; } .ha-team-card h3{ font-size:24px; margin:0 0 6px; } .ha-team-card .role{ color:var(--ha-muted); font-size:14px; } /* Blog cards */ .ha-blog-card, .elementor-widget-posts .elementor-post, .tpgb-card{ display:flex; flex-direction:column; } .ha-blog-card .thumb, .elementor-widget-posts .elementor-post__thumbnail, .tpgb-card img{ overflow:hidden; border-top-left-radius:18px; border-top-right-radius:18px; } .ha-blog-card img, .elementor-widget-posts .elementor-post__thumbnail img, .tpgb-card img{ width:100%; aspect-ratio:16/10; object-fit:cover; transition:.4s ease; } .ha-blog-card:hover img, .elementor-widget-posts .elementor-post:hover img, .tpgb-card:hover img{ transform:scale(1.04); } .ha-blog-card .body, .elementor-widget-posts .elementor-post__text, .tpgb-card .content{ padding:20px 22px 24px; } .ha-blog-card .meta, .elementor-post__meta-data, .tpgb-card .meta{ color:var(--ha-muted); font-size:12px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:10px; } .ha-blog-card h3, .elementor-post__title, .tpgb-card h3{ font-size:24px; line-height:1.2; margin-bottom:10px; } .ha-blog-card p, .elementor-post__excerpt p, .tpgb-card p{ color:var(--ha-muted); line-height:1.7; } /* Formularios / contacto */ input, textarea, select{ width:100%; border:1px solid rgba(31,41,55,.12) !important; border-radius:14px !important; background:#fff !important; color:var(--ha-text) !important; padding:14px 16px !important; transition:.24s ease; } input:focus, textarea:focus, select:focus{ outline:none; border-color:rgba(50,75,93,.45) !important; box-shadow:0 0 0 4px rgba(50,75,93,.08) !important; } .ha-contact-panel{ background:linear-gradient(180deg, var(--ha-navy), var(--ha-blue)); color:#fff; border-radius:24px; padding:34px; box-shadow:var(--ha-shadow); } .ha-contact-panel *{ color:#fff !important; } /* Divisores / líneas */ hr, .elementor-divider-separator{ border-color:rgba(229,231,235,.9) !important; } .ha-line{ width:90px; height:2px; background:var(--ha-gold); border-radius:999px; } /* Footer */ footer, .elementor-location-footer{ background:var(--ha-navy); color:rgba(255,255,255,.84); } footer a, .elementor-location-footer a{ color:#fff !important; } footer a:hover, .elementor-location-footer a:hover{ color:#D7C79B !important; } /* Responsive */ @media (max-width:1024px){ .ha-hero, .hero, .elementor-widget-slides .swiper-slide{ min-height:64vh; border-bottom-left-radius:22px; border-bottom-right-radius:22px; } .ha-hub-card{ min-height:180px; } } @media (max-width:767px){ .ha-hero, .hero, .elementor-widget-slides .swiper-slide{ min-height:58vh; } .ha-hero h1, .hero h1{ max-width:12ch; } .ha-hub-card, .ha-stat, .ha-contact-panel{ border-radius:18px; } }