/* Hares Home Pilot v0.1
   Camada visual isolada para a Home.
   Nao altera motores, regras, URLs, tracking ou estrutura funcional.
   Consome tokens do Hares Design System v0.1. */

@import url("./hares-shell-v0.1.css");
@import url("./hares-page-motion-v0.1.css");

/* Header */
#navbar {
  border-bottom-color: rgba(18,115,222,.10) !important;
  box-shadow: 0 8px 30px rgba(15,23,42,.045);
}
#navbar > div > div {
  min-height: 5rem;
}
#navbar a,
#navbar button {
  -webkit-tap-highlight-color: transparent;
}
#navbar .header-whatsapp-btn {
  border: 1px solid rgba(255,255,255,.24);
  background: var(--hares-gradient-brand);
  box-shadow: 0 10px 26px rgba(18,115,222,.18);
}
#navbar .header-whatsapp-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--hares-shadow-brand);
}

/* Hero */
#home-hero {
  isolation: isolate;
  background:
    radial-gradient(circle at 12% 12%, rgba(0,191,255,.10), transparent 32rem),
    radial-gradient(circle at 88% 18%, rgba(123,47,247,.09), transparent 30rem),
    linear-gradient(180deg, var(--hares-bg) 0%, var(--hares-surface) 56%, var(--hares-bg) 100%) !important;
}
#home-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  bottom: 0;
  width: min(860px, 84vw);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(18,115,222,.22), rgba(123,47,247,.18), transparent);
}
#home-hero h1 {
  max-width: 980px;
  margin-inline: auto;
  letter-spacing: -.035em;
  text-wrap: balance;
}
#home-hero h1 .gradient-text {
  filter: saturate(1.08);
}
#home-hero h1 + p {
  max-width: 830px;
  line-height: 1.62;
  text-wrap: pretty;
}
#home-hero .gradient-bg {
  background: var(--hares-gradient-brand) !important;
  box-shadow: 0 14px 34px rgba(18,115,222,.20);
}
#home-hero .gradient-bg:hover {
  box-shadow: 0 20px 44px rgba(18,115,222,.26) !important;
}
#home-hero a[class*="border-2"] {
  background: color-mix(in srgb, var(--hares-bg) 82%, transparent);
  backdrop-filter: blur(10px);
  box-shadow: var(--hares-shadow-sm);
}
#home-hero a[class*="border-2"]:hover {
  background: var(--hares-surface-2);
  box-shadow: 0 12px 28px rgba(18,115,222,.10);
}

/* Cards institucionais */
.card-hover,
.segment-card,
.partner-card,
.professional-card {
  border-color: var(--hares-border-brand) !important;
  box-shadow: var(--hares-shadow-sm);
}
.card-hover,
.segment-card {
  border-radius: 22px;
}
.card-hover:hover,
.segment-card:hover,
.partner-card:hover,
.professional-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--hares-shadow-md) !important;
  border-color: rgba(18,115,222,.28) !important;
}
.partner-card {
  border-radius: var(--hares-radius-lg);
}
.partner-logo {
  border: 1px solid color-mix(in srgb, var(--hares-border) 70%, transparent);
  background: linear-gradient(180deg, var(--hares-bg), var(--hares-surface));
}
.professional-card {
  border-width: 1px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(123,47,247,.07), transparent 38%),
    linear-gradient(145deg, rgba(18,115,222,.045), var(--hares-bg)) !important;
}

/* Hierarquia e microinteracoes */
main section h2 {
  letter-spacing: -.025em;
  text-wrap: balance;
}
main section p {
  text-wrap: pretty;
}
main a,
main button {
  outline-offset: 4px;
}
main a:focus-visible,
main button:focus-visible,
#navbar a:focus-visible,
#navbar button:focus-visible {
  outline: 3px solid rgba(0,191,255,.42) !important;
}
.gradient-text {
  background-image: var(--hares-gradient-text) !important;
}

/* Footer */
footer {
  position: relative;
}
footer::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(0,191,255,.42), rgba(123,47,247,.34), transparent);
}
footer .hares-social-icon {
  box-shadow: 0 10px 28px rgba(0,0,0,.16);
}

/* Dark mode */
html[data-theme="dark"] #home-hero {
  background:
    radial-gradient(circle at 12% 12%, rgba(0,191,255,.12), transparent 32rem),
    radial-gradient(circle at 88% 18%, rgba(123,47,247,.13), transparent 30rem),
    linear-gradient(180deg, var(--hares-bg) 0%, var(--hares-surface) 56%, var(--hares-bg) 100%) !important;
}
html[data-theme="dark"] #home-hero a[class*="border-2"] {
  background: color-mix(in srgb, var(--hares-surface) 78%, transparent);
  border-color: rgba(56,189,248,.55) !important;
  color: #7dd3fc !important;
}
html[data-theme="dark"] .card-hover,
html[data-theme="dark"] .segment-card,
html[data-theme="dark"] .partner-card,
html[data-theme="dark"] .professional-card {
  border-color: var(--hares-border-brand) !important;
  box-shadow: var(--hares-shadow-md);
}
html[data-theme="dark"] .partner-logo {
  background: var(--hares-surface);
  border-color: var(--hares-border);
}

/* Mobile */
@media (max-width: 767px) {
  #home-hero {
    padding-top: 7.5rem !important;
    padding-bottom: 4.5rem !important;
  }
  #home-hero h1 {
    font-size: clamp(2.45rem, 12vw, 3.6rem) !important;
    line-height: 1.02 !important;
  }
  #home-hero h1 + p {
    font-size: 1.05rem !important;
    line-height: 1.6;
  }
  #home-hero a {
    width: 100%;
  }
  .card-hover:hover,
  .segment-card:hover,
  .partner-card:hover,
  .professional-card:hover {
    transform: none;
  }
}

/* Movimento reduzido */
@media (prefers-reduced-motion: reduce) {
  #navbar .header-whatsapp-btn,
  #home-hero a,
  .card-hover,
  .segment-card,
  .partner-card,
  .professional-card {
    transition: none !important;
    animation: none !important;
    transform: none !important;
  }
}
/* HARES ICON SYSTEM V1 — comparação da Home, ativada por ?iconPilot=v1 */
.hares-icon-v1-home-artwork{display:none;position:static;inset:auto;width:100%;height:100%;transform:none!important;object-fit:cover;border-radius:var(--hares-radius-md,14px);box-shadow:none}
.hares-icon-v1-home-banner[hidden]{display:none!important}
html[data-icon-pilot="v1"] .hares-icon-v1-home-banner{display:flex;justify-content:center;align-items:center;gap:1rem;flex-wrap:wrap;padding:.75rem 1rem;background:var(--hares-surface,#fff);color:var(--hares-text,#0f172a);border-bottom:1px solid var(--hares-border-brand,rgba(56,189,248,.22));font-size:.875rem}
html[data-icon-pilot="v1"] .hares-icon-v1-home-banner a{color:var(--hares-blue-600,#1273de);font-weight:700;text-decoration:underline;text-underline-offset:3px}
html[data-icon-pilot="v1"] [data-hares-icon-v1-slot]{position:relative!important;isolation:isolate;width:96px!important;height:68px!important;flex:0 0 96px!important;overflow:hidden;background:transparent!important;border-color:transparent!important;border-radius:var(--hares-radius-md,14px)!important;box-shadow:var(--hares-shadow-sm,0 8px 22px rgba(0,0,0,.18))!important}
html[data-icon-pilot="v1"] [data-hares-icon-v1-slot]>svg{display:none!important}
html[data-icon-pilot="v1"] [data-hares-icon-v1-slot]>.hares-icon-v1-home-artwork{display:block!important;position:static!important;inset:auto!important;width:100%!important;height:100%!important;max-width:100%!important;flex:none!important}
html[data-icon-pilot="v1"] [data-hares-icon-v1-slot]:hover>.hares-icon-v1-home-artwork{transform:none!important}
html[data-icon-pilot="v1"] [data-hares-icon-v1-size="center"]{margin-left:auto!important;margin-right:auto!important}
@media(max-width:767px){
 html[data-icon-pilot="v1"] [data-hares-icon-v1-size="wide"]{width:80px!important;height:57px!important;flex-basis:80px!important}
}
@media(prefers-reduced-motion:reduce){
 .hares-icon-v1-home-artwork{transition:none!important}
 html[data-icon-pilot="v1"] [data-hares-icon-v1-slot]:hover>.hares-icon-v1-home-artwork{transform:none!important}
}
