/* === ALC Abogados · componente "hero" ===
   Reglas portadas verbatim de design/css/sections.css (líneas 5-71). NO reescribir. */

/* ===== HERO ===== */
.alc-hero { position: relative; min-height: 720px; background: var(--paper); }
.alc-hero-photo-wrap { position: absolute; top: 0; right: 0; width: 58%; height: 100%; overflow: hidden; }
.alc-hero-photo-frame { position: absolute; inset: 0; animation: alc-hero-zoom 30s ease-in-out infinite alternate; }
@keyframes alc-hero-zoom { 0% { transform: scale(1.04) translate(0,0); } 100% { transform: scale(1.10) translate(-1.5%,-1%); } }
.alc-hero-photo-wrap img { width: 100%; height: 100%; object-fit: cover; filter: brightness(0.78) contrast(1.18) saturate(1.05); }
.alc-hero-photo-tint { position: absolute; inset: 0; background: radial-gradient(ellipse 70% 50% at 70% 65%, rgba(255,200,110,0.16) 0%, transparent 60%), linear-gradient(135deg, rgba(10,28,51,0.50) 0%, rgba(10,28,51,0.18) 55%, rgba(10,28,51,0.45) 100%); mix-blend-mode: multiply; pointer-events: none; }
.alc-hero-photo-glow { position: absolute; inset: 0; background: radial-gradient(ellipse 40% 30% at 30% 80%, rgba(255,180,90,0.25) 0%, transparent 65%), radial-gradient(ellipse 30% 25% at 75% 35%, rgba(212,221,92,0.18) 0%, transparent 70%); mix-blend-mode: screen; pointer-events: none; animation: alc-hero-breath 8s ease-in-out infinite alternate; }
@keyframes alc-hero-breath { 0% { opacity: 0.7; } 100% { opacity: 1; } }
.alc-hero-sparkles { position: absolute; inset: 0; pointer-events: none; }
.alc-hero-sparkle { position: absolute; border-radius: 50%; opacity: 0; animation: alc-hero-twinkle ease-in-out infinite; }
.alc-hero-sparkle.warm { background: rgba(255,210,140,0.95); box-shadow: 0 0 6px rgba(255,200,110,0.85), 0 0 12px rgba(255,180,80,0.55), 0 0 24px rgba(255,160,60,0.30); }
.alc-hero-sparkle.cool { background: rgba(214,230,130,0.95); box-shadow: 0 0 6px rgba(212,221,92,0.85), 0 0 14px rgba(212,221,92,0.45); }
@keyframes alc-hero-twinkle { 0%,100% { opacity: 0; transform: scale(0.6); } 15% { opacity: 0.9; transform: scale(1); } 45% { opacity: 0.4; transform: scale(0.85); } 70% { opacity: 1; transform: scale(1.15); } 85% { opacity: 0.5; transform: scale(0.95); } }
.alc-hero-bloom { position: absolute; border-radius: 50%; pointer-events: none; mix-blend-mode: screen; filter: blur(40px); }
.alc-hero-bloom-1 { top: -20%; right: -10%; width: 360px; height: 360px; background: radial-gradient(circle, rgba(255,200,120,0.55) 0%, transparent 70%); animation: alc-hero-drift1 18s ease-in-out infinite alternate; }
.alc-hero-bloom-2 { bottom: 10%; left: 20%; width: 280px; height: 280px; background: radial-gradient(circle, rgba(212,221,92,0.40) 0%, transparent 70%); animation: alc-hero-drift2 22s ease-in-out infinite alternate; }
.alc-hero-bloom-3 { top: 40%; right: 30%; width: 220px; height: 220px; background: radial-gradient(circle, rgba(255,160,80,0.35) 0%, transparent 70%); animation: alc-hero-drift3 26s ease-in-out infinite alternate; }
@keyframes alc-hero-drift1 { 0% { transform: translate(0,0) scale(1); opacity: 0.6; } 100% { transform: translate(-40px,30px) scale(1.15); opacity: 1; } }
@keyframes alc-hero-drift2 { 0% { transform: translate(0,0) scale(0.9); opacity: 0.5; } 100% { transform: translate(50px,-30px) scale(1.1); opacity: 0.9; } }
@keyframes alc-hero-drift3 { 0% { transform: translate(0,0) scale(1); opacity: 0.4; } 100% { transform: translate(-30px,-40px) scale(1.2); opacity: 0.85; } }
.alc-hero-content-wrap { position: relative; z-index: 2; padding: 96px 56px 64px; max-width: 60%; }
.alc-hero-square { position: absolute; top: 60px; left: 32px; width: 320px; height: 320px; border: 4px solid var(--accent); z-index: -1; animation: alc-hero-sq-in 1.2s cubic-bezier(.16,.84,.24,1) both, alc-hero-sq-float 7s ease-in-out 1.2s infinite; }
@keyframes alc-hero-sq-in { 0% { transform: translate(-200px,-120px) rotate(-18deg) scale(0.5); opacity: 0; } 50% { opacity: 0.8; } 100% { transform: translate(0,0) rotate(0) scale(1); opacity: 1; } }
@keyframes alc-hero-sq-float { 0%,100% { transform: translate(0,0) rotate(0); } 50% { transform: translate(8px,-10px) rotate(1.5deg); } }
.alc-hero-content { background: var(--paper); padding: 48px 56px; max-width: 720px; margin-left: 56px; margin-top: 96px; box-shadow: 0 24px 64px rgba(10,28,51,0.08); }
.alc-hero-h { font-size: clamp(36px, 4.2vw, 56px); line-height: 1.08; letter-spacing: -0.022em; font-weight: 700; color: var(--ink); }
.alc-hero-deck { font-size: 16px; line-height: 1.55; color: var(--ink-2); font-weight: 400; margin-top: 20px; max-width: 52ch; }
.alc-hero-search { display: flex; align-items: stretch; margin-top: 36px; border: 1.5px solid var(--line-strong); background: var(--paper); border-radius: 4px; overflow: hidden; transition: border-color .2s; }
.alc-hero-search:focus-within { border-color: var(--ink); }
.alc-hero-search input { flex: 1; border: none; outline: none; background: transparent; font-family: inherit; font-size: 15px; padding: 16px 22px; color: var(--ink); }
.alc-hero-search input::placeholder { color: var(--ink-3); }
.alc-hero-search button { display: inline-flex; align-items: center; gap: 10px; padding: 0 28px; background: var(--ink); color: var(--paper); font-size: 15px; font-weight: 500; transition: background .15s; }
.alc-hero-search button:hover { background: var(--accent-deep); }
@media (max-width: 1200px) {
  .alc-hero-photo-wrap { width: 52%; }
  .alc-hero-content-wrap { max-width: 65%; padding: 80px 40px 56px; }
  .alc-hero-content { padding: 40px 44px; margin-left: 32px; max-width: 620px; }
  .alc-hero-square { width: 280px; height: 280px; top: 48px; left: 20px; }
}
@media (max-width: 1024px) {
  .alc-hero-photo-wrap { width: 46%; }
  .alc-hero-content-wrap { max-width: 72%; padding: 64px 32px 56px; }
  .alc-hero-content { padding: 32px 36px; margin-left: 16px; max-width: 540px; }
  .alc-hero-square { width: 240px; height: 240px; top: 36px; left: 12px; }
  .alc-hero-h { font-size: clamp(28px, 3.6vw, 44px); }
  .alc-hero-sparkle { display: none; }
}
@media (max-width: 820px) {
  .alc-hero { min-height: 0; }
  .alc-hero-photo-wrap { position: relative; width: 100%; height: clamp(260px, 50vw, 380px); }
  .alc-hero-content-wrap { max-width: 100%; padding: 32px 20px 48px; }
  .alc-hero-content { padding: 28px 24px; margin-left: 0; margin-top: 24px; max-width: 100%; box-shadow: 0 12px 32px rgba(10,28,51,0.06); }
  .alc-hero-square { width: 200px; height: 200px; top: 12px; left: -8px; border-width: 3px; }
  .alc-hero-h { font-size: clamp(26px, 5.6vw, 36px); }
  .alc-hero-bloom-2, .alc-hero-bloom-3 { display: none; }
  .alc-hero-bloom-1 { width: 240px; height: 240px; }
}
@media (max-width: 480px) {
  .alc-hero-photo-wrap { height: clamp(220px, 50vw, 280px); }
  .alc-hero-content-wrap { padding: 24px 16px 40px; }
  .alc-hero-content { padding: 24px 20px; }
  .alc-hero-square { width: 140px; height: 140px; }
  .alc-hero-search button span { display: none; }
  .alc-hero-search button { padding: 0 14px; }
}

