/* Fase COM·02 — site público (Views/Shared/_PublicLayout.cshtml e views de
   Modules/Comercial). Independente de wwwroot/css/site.css (shell
   autenticado) — mesma paleta de marca, arquivo próprio para não crescer o
   CSS do shell interno com regras que ele nunca usa. */

:root {
  --pub-azul-escuro:  #071F45;
  --pub-azul:         #2454E6;
  --pub-azul-vivo:    #3674FF;
  --pub-azul-claro:   #A8C7FF;
  --pub-ciano:        #22D3EE;
  --pub-violeta:      #7C6CF2;
  --pub-teal:         #16C995;
  --pub-teal-escuro:  #0BA77A;
  --pub-cinza-texto:  #536178;
  --pub-cinza-claro:  #9CA3AF;
  --pub-borda:        #E3E9F2;
  --pub-gelo:         #F4F7FC;
  --pub-sombra:       0 20px 60px rgba(7, 31, 69, .10);
}

.public-site {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: #1F2937;
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

.public-site a { text-decoration: none; }

/* ── Header ─────────────────────────────────────────────────────────── */

.public-header {
  border-bottom: 1px solid rgba(227, 233, 242, .8);
  position: sticky;
  top: 0;
  background: rgba(255, 255, 255, .88);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  z-index: 1040;
  box-shadow: 0 4px 24px rgba(7, 31, 69, .035);
}

.public-brand {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  font-weight: 800;
  font-size: 1.25rem;
  color: var(--pub-azul-escuro);
}
.public-brand em { color: var(--pub-teal); font-style: normal; }
.public-brand img { border-radius: .65rem; }

.public-nav-toggle {
  border: 1px solid var(--pub-borda);
  border-radius: 0.5rem;
  background: #fff;
  font-size: 1.25rem;
  padding: 0.25rem 0.6rem;
}

.public-nav {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}
.public-nav a {
  color: var(--pub-cinza-texto);
  font-weight: 600;
  font-size: .94rem;
  transition: color .2s ease;
}
.public-nav a:hover { color: var(--pub-azul); }
.public-nav-entrar {
  color: var(--pub-azul) !important;
  font-weight: 600 !important;
}
.public-nav-cta {
  background: linear-gradient(135deg, var(--pub-azul), var(--pub-azul-vivo));
  border-color: transparent;
  color: #fff !important;
  font-weight: 600;
  padding: 0.5rem 1.1rem;
  border-radius: 0.7rem;
  box-shadow: 0 8px 24px rgba(36, 84, 230, .22);
}
.public-nav-cta:hover { background: linear-gradient(135deg, #1944c9, var(--pub-azul)); border-color: transparent; transform: translateY(-1px); }

@media (max-width: 991.98px) {
  .public-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border-bottom: 1px solid var(--pub-borda);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 0.5rem 1rem 1rem;
    display: none;
  }
  .public-nav.show { display: flex; }
  .public-nav a { padding: 0.6rem 0; border-bottom: 1px solid var(--pub-borda); }
  .public-nav a:last-child { border-bottom: none; }
  .public-nav-cta { text-align: center; margin-top: 0.5rem; }
}

/* ── Hero / seções genéricas ────────────────────────────────────────── */

.public-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 72% 18%, rgba(34, 211, 238, .16), transparent 25%),
    linear-gradient(128deg, #071F45 0%, #123D87 52%, #2759DC 100%);
  color: #fff;
  padding: 5.25rem 0;
}
.public-home-hero { min-height: 610px; display: flex; align-items: center; }
.public-hero h1 { font-weight: 800; font-size: clamp(2.35rem, 4.7vw, 4.3rem); letter-spacing: -.045em; line-height: 1.04; margin: 1.1rem 0 1.35rem; }
.public-hero h1 span { color: #78E6F2; }
.public-hero p.lead { color: #DCE8FF; font-size: clamp(1.05rem, 1.6vw, 1.23rem); line-height: 1.7; max-width: 640px; }
.public-eyebrow, .section-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.public-eyebrow { color: #BFF8F2; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: .48rem .78rem; }
.section-eyebrow { color: var(--pub-azul); margin-bottom: .65rem; }
.hero-orb { position: absolute; border-radius: 50%; filter: blur(2px); pointer-events: none; }
.hero-orb-one { width: 360px; height: 360px; right: -100px; top: -170px; background: rgba(124,108,242,.22); }
.hero-orb-two { width: 260px; height: 260px; left: 38%; bottom: -190px; background: rgba(22,201,149,.14); }
.public-hero .btn-cta {
  background: linear-gradient(135deg, #20D7A0, var(--pub-teal));
  border-color: transparent;
  color: #052D2B;
  font-weight: 800;
  padding: 0.85rem 1.55rem;
  border-radius: 0.75rem;
  box-shadow: 0 14px 32px rgba(11,167,122,.25);
}
.public-hero .btn-cta:hover, .conversion-panel .btn-cta:hover { background: #22E0A7; border-color: transparent; color: #052D2B; transform: translateY(-2px); }
.hero-actions { display: flex; align-items: center; gap: 1.4rem; margin-top: 1.75rem; flex-wrap: wrap; }
.hero-secondary-link { color: #fff; font-weight: 700; }
.hero-secondary-link:hover { color: #BFF8F2; }
.hero-trust { display: flex; gap: 1.2rem; flex-wrap: wrap; margin-top: 1.7rem; color: #C8D8F3; font-size: .82rem; font-weight: 600; }
.hero-trust i { color: #4DE1B4; margin-right: .3rem; }

.product-preview { position: relative; max-width: 545px; margin-left: auto; border: 1px solid rgba(255,255,255,.2); border-radius: 1.25rem; padding: .65rem; background: rgba(255,255,255,.1); box-shadow: 0 32px 80px rgba(0,0,0,.28); transform: perspective(1000px) rotateY(-3deg) rotateX(1deg); backdrop-filter: blur(10px); }
.preview-topbar { height: 38px; display: flex; align-items: center; gap: .4rem; padding: 0 .5rem; }
.preview-topbar > span { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.4); }
.preview-topbar small { margin-left: auto; color: #DBEAFE; font-weight: 700; }
.preview-body { display: grid; grid-template-columns: 1.3fr 1fr; gap: .75rem; background: #F8FAFD; border-radius: .85rem; padding: 1rem; color: var(--pub-azul-escuro); }
.preview-kpi { min-height: 112px; background: #fff; border: 1px solid var(--pub-borda); border-radius: .8rem; padding: .9rem; display: flex; flex-direction: column; position: relative; }
.preview-kpi i { color: var(--pub-azul); font-size: 1.15rem; position: absolute; right: .8rem; top: .7rem; }
.preview-kpi small { color: var(--pub-cinza-texto); margin-bottom: .5rem; }
.preview-kpi strong { font-size: 1.4rem; }
.preview-kpi em { color: var(--pub-teal-escuro); font-style: normal; font-weight: 800; font-size: .76rem; margin-top: auto; }
.preview-chart { grid-column: 1 / 3; height: 115px; border-radius: .8rem; background: linear-gradient(180deg,#EEF4FF,#fff); display: flex; align-items: end; gap: 6%; padding: 1rem 1.3rem 0; }
.preview-chart span { flex: 1; min-width: 8px; border-radius: 5px 5px 0 0; background: linear-gradient(180deg,var(--pub-ciano),var(--pub-azul)); }
.preview-list { grid-column: 1 / 3; background: #fff; border: 1px solid var(--pub-borda); border-radius: .8rem; padding: .9rem; display: grid; gap: .6rem; }
.preview-list b { font-size: .78rem; }
.preview-list span { color: #34445E; font-size: .72rem; }
.preview-list span i { display: inline-flex; align-items:center; justify-content:center; width: 20px; height: 20px; border-radius: 6px; background:#E8FBF5; color:var(--pub-teal-escuro); margin-right:.4rem; }
.preview-list span small { float: right; color: var(--pub-cinza-claro); }

.public-section { padding: 5rem 0; }
.public-section-alt { background: var(--pub-gelo); }
.public-section h2 { font-weight: 800; color: var(--pub-azul-escuro); font-size: clamp(1.7rem, 3vw, 2.55rem); letter-spacing: -.035em; }
.public-section .lead { color: var(--pub-cinza-texto); }

.public-feature-card {
  border: 1px solid var(--pub-borda);
  border-radius: 1.15rem;
  padding: 1.75rem;
  height: 100%;
  background: #fff;
  box-shadow: 0 8px 30px rgba(7,31,69,.035);
  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}
.public-feature-card:hover { box-shadow: var(--pub-sombra); border-color: #C9D7ED; transform: translateY(-5px); }
.public-feature-card .ico {
  width: 3rem; height: 3rem;
  border-radius: 0.9rem;
  background: rgba(30, 64, 175, .1);
  color: var(--pub-azul);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
  margin-bottom: 1rem;
}
.public-feature-card h3 { font-size: 1.05rem; font-weight: 700; color: var(--pub-azul-escuro); }
.public-feature-card p { color: var(--pub-cinza-texto); font-size: 0.95rem; line-height: 1.65; margin-bottom: 0; }
.feature-violet .ico { color: var(--pub-violeta); background: rgba(124,108,242,.11); }
.feature-green .ico { color: var(--pub-teal-escuro); background: rgba(22,201,149,.11); }
.public-text-link { color: var(--pub-azul); font-weight: 800; }
.public-text-link i { transition: transform .2s ease; display: inline-block; margin-left: .3rem; }
.public-text-link:hover i { transform: translateX(4px); }
.conversion-panel { overflow: hidden; position: relative; padding: clamp(2.5rem,5vw,4.5rem); border-radius: 1.5rem; background: linear-gradient(125deg,#071F45,#1546A2); color:#fff; box-shadow: var(--pub-sombra); }
.conversion-panel::after { content:""; position:absolute; width:260px; height:260px; border-radius:50%; right:-100px; top:-130px; background:rgba(34,211,238,.16); }
.conversion-panel h2 { color:#fff; position:relative; }
.conversion-panel .lead { color:#DCE8FF; position:relative; }
.conversion-panel .btn-cta { position:relative; background:var(--pub-teal); border-color:transparent; color:#052D2B; font-weight:800; border-radius:.75rem; }
.public-soft-badge { background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); color:#BFF8F2; }
.landing-visual { width: 320px; margin-left:auto; padding:1.25rem; border-radius:1.25rem; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.08); backdrop-filter:blur(8px); display:grid; gap:.75rem; transform:rotate(2deg); }
.landing-visual > div { height:150px; display:flex; align-items:center; justify-content:center; border-radius:.85rem; background:linear-gradient(145deg,rgba(34,211,238,.22),rgba(124,108,242,.22)); }
.landing-visual > div i { font-size:4.5rem; color:#BFF8F2; }
.landing-visual span { background:#fff; color:var(--pub-azul-escuro); border-radius:.7rem; padding:.7rem .85rem; font-weight:700; font-size:.78rem; }
.landing-visual span i { color:var(--pub-teal-escuro); margin-right:.35rem; }

/* ── Planos ─────────────────────────────────────────────────────────── */

.plan-card {
  border: 1px solid var(--pub-borda);
  border-radius: 1.25rem;
  padding: 2rem;
  height: 100%;
  background: #fff;
  display: flex;
  flex-direction: column;
  position: relative;
  box-shadow: 0 10px 35px rgba(7,31,69,.055);
  transition: transform .25s ease, box-shadow .25s ease;
}
.plan-card:hover { transform:translateY(-5px); box-shadow:var(--pub-sombra); }
.plan-card-featured { border:2px solid var(--pub-azul); box-shadow:0 18px 55px rgba(36,84,230,.14); }
.plan-highlight { position:absolute; top:0; right:1.25rem; transform:translateY(-50%); padding:.38rem .7rem; border-radius:999px; background:linear-gradient(135deg,var(--pub-violeta),var(--pub-azul)); color:#fff; font-size:.7rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.plan-icon { width:48px; height:48px; display:flex; align-items:center; justify-content:center; border-radius:.9rem; background:#EDF3FF; color:var(--pub-azul); font-size:1.3rem; margin-bottom:1.25rem; }
.plan-card-featured .plan-icon { background:linear-gradient(135deg,var(--pub-azul),var(--pub-violeta)); color:#fff; }
.plan-card h3 { font-weight: 800; color: var(--pub-azul-escuro); font-size:1.35rem; letter-spacing:-.025em; }
.plan-description { color:var(--pub-cinza-texto); font-size:.9rem; line-height:1.55; min-height:5.6em; text-transform:none; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; }
.plan-card .plan-price { font-size: 2rem; font-weight: 800; color: var(--pub-azul); margin: 0.5rem 0; }
.plan-card .plan-consult { font-size:1.35rem; color:var(--pub-azul-escuro); }
.plan-card .plan-price small { font-size: 0.95rem; font-weight: 500; color: var(--pub-cinza-texto); }
.plan-divider { height:1px; background:var(--pub-borda); margin:1.25rem 0; }
.plan-includes { color:var(--pub-azul-escuro); font-size:.84rem; }
.plan-card ul { list-style: none; padding: 0; margin: .8rem 0 1.5rem; flex: 1; }
.plan-card ul li { padding: 0.38rem 0; color: var(--pub-cinza-texto); font-size: 0.88rem; display:flex; gap:.55rem; line-height:1.4; }
.plan-card ul li i { color: var(--pub-teal); flex:none; }
.plan-card .btn { margin-top: auto; }
.plan-card .btn-primary { background:linear-gradient(135deg,var(--pub-azul),var(--pub-azul-vivo)); border:0; padding:.7rem; font-weight:700; border-radius:.7rem; }
.plan-card .btn-outline-primary { border-color:#B9CBF7; color:var(--pub-azul); padding:.7rem; font-weight:700; border-radius:.7rem; }
.product-card { max-width:420px; }
.product-description { min-height:0; -webkit-line-clamp:5; }

.plan-empty-state {
  border: 1px dashed var(--pub-borda);
  border-radius: 1rem;
  padding: 2.5rem;
  text-align: center;
  color: var(--pub-cinza-texto);
}

/* ── Formulário de contratação ─────────────────────────────────────── */

.contratacao-card {
  border: 1px solid var(--pub-borda);
  border-radius: 1rem;
  padding: 2rem;
  background: #fff;
  max-width: 640px;
}
.contratacao-resumo {
  background: var(--pub-gelo);
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
}
.contratacao-resumo .valor { font-size: 1.5rem; font-weight: 800; color: var(--pub-azul-escuro); }

.confirmacao-card {
  border: 1px solid var(--pub-borda);
  border-radius: 1rem;
  padding: 2.5rem;
  background: #fff;
  max-width: 560px;
  text-align: center;
}
.confirmacao-card .bi-check-circle-fill { font-size: 3rem; color: var(--pub-teal); }
.confirmacao-card .numero-publico { font-family: monospace; font-size: 1.1rem; font-weight: 700; color: var(--pub-azul-escuro); }

/* ── Footer ─────────────────────────────────────────────────────────── */

.public-footer {
  border-top: 1px solid var(--pub-borda);
  background: var(--pub-gelo);
}
.public-footer-brand span { display:flex; flex-direction:column; }
.public-footer-brand small { font-size:.72rem; font-weight:500; color:var(--pub-cinza-claro); }
.public-footer-brand {
  display: flex; align-items: center; gap: 0.5rem;
  color: var(--pub-cinza-texto);
  font-weight: 600;
}
.public-footer-links { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.public-footer-links a { color: var(--pub-cinza-texto); font-size: 0.92rem; }
.public-footer-links a:hover { color: var(--pub-azul); }

@media (max-width: 767.98px) {
  .public-hero { padding: 3.75rem 0; }
  .public-home-hero { min-height:auto; }
  .public-hero h1 { font-size:clamp(2.2rem,11vw,3.2rem); }
  .product-preview { margin-top:1rem; transform:none; }
  .preview-body { grid-template-columns:1fr 1fr; padding:.65rem; }
  .hero-actions { align-items:flex-start; flex-direction:column; }
  .hero-trust { flex-direction:column; gap:.55rem; }
  .public-section { padding:3.5rem 0; }
  .conversion-panel { border-radius:1rem; }
  .plan-card { padding:1.5rem; }
  .public-footer .d-flex { text-align: center; }
  .public-footer-links { justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; }
}

.public-site :focus-visible { outline:3px solid rgba(34,211,238,.65); outline-offset:3px; }
