:root{
  --biomim-blue:#0D4F91;
  --clinic-white:#FFFFFF;
  --clinic-gray:#F7F9FC;
  --light-blue:#F0F7FF;
  --tech-black:#0D0D0D;
}

/* Layout containers (shadcn-like spacing) */
.section{ padding-block: 2.25rem; }
@media (min-width: 640px){ .section{ padding-block: 3.5rem; } }
@media (min-width: 1024px){ .section{ padding-block: 5.5rem; } }
.wrap{ max-width: 80rem; margin-inline:auto; padding-inline:8vw; }
@media (min-width: 640px){ .wrap{ padding-inline:2rem; } }
@media (min-width: 1024px){ .wrap{ padding-inline:2.5rem; } }
/* extra vertical rhythm between stacked sections */
.section + .section{ margin-top: 0; }

/* Buttons */
.btn-primary{
  @apply inline-flex items-center justify-center px-5 py-3 rounded-lg text-white bg-[color:var(--biomim-blue)] hover:brightness-110 hover:shadow-lg transition transform hover:-translate-y-0.5;
}
.btn-secondary{
  @apply inline-flex items-center justify-center px-5 py-3 rounded-lg border border-slate-200 text-slate-800 hover:bg-slate-50 transition;
}
.btn-outline{
  @apply inline-flex items-center justify-center px-5 py-3 rounded-lg border border-white text-white hover:bg-white hover:text-[color:var(--biomim-blue)] transition;
}
.cta-solid{
  @apply inline-flex items-center justify-center rounded-full text-white font-medium px-7 py-4; 
  background: var(--biomim-blue);
  box-shadow: 0 10px 30px rgba(13,79,145,.35), inset 0 -2px 0 rgba(0,0,0,.08);
}
.cta-outline{
  @apply inline-flex items-center justify-center rounded-full font-medium px-7 py-4 bg-white text-biomimBlue border-2; 
  border-color: var(--biomim-blue);
}
.cta-solid:focus-visible, .cta-outline:focus-visible{ outline: 2px solid rgba(13,79,145,.6); outline-offset: 2px; }
.btn-pill{
  @apply inline-flex items-center justify-center px-7 py-4 rounded-full text-white bg-[color:var(--biomim-blue)] shadow-lg transition;
  box-shadow: 0 10px 30px rgba(13,79,145,.35), inset 0 -2px 0 rgba(0,0,0,.08);
  border: 3px solid rgba(255,255,255,.35);
}
.btn-pill{
  @apply inline-flex items-center justify-center px-7 py-4 rounded-full text-white bg-[color:var(--biomim-blue)] shadow-lg transition;
  box-shadow: 0 10px 30px rgba(13,79,145,.35), inset 0 -2px 0 rgba(0,0,0,.08);
  border: 3px solid rgba(255,255,255,.35);
}
.btn-instagram{
  background: radial-gradient(92.2% 100% at 0% 0%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  @apply text-white px-5 py-3 rounded-lg shadow-lg hover:shadow-xl transition;
}
.btn-link{ @apply inline-flex items-center text-biomimBlue hover:underline; }
.btn-whatsapp{ @apply inline-flex items-center justify-center px-5 py-3 rounded-lg text-white bg-green-500 hover:bg-green-600 transition; }

/* Header shrink */
#siteHeader.shrink .h-20{ height: 5rem; }
#siteHeader{ box-shadow: 0 1px 0 rgba(15,23,42,0.06); }

/* Cards */
.card-mini{ @apply bg-white rounded-xl p-4 shadow-smooth; }
.card-hover{ @apply bg-white rounded-2xl overflow-hidden shadow-smooth hover:shadow-xl transition; }
.card-image{ @apply w-full h-48 object-cover; }

/* VIP cards */
.vip-card{ @apply relative overflow-hidden rounded-2xl cursor-pointer shadow-smooth hover:shadow-xl transition; }
.vip-image{ @apply w-full h-56 sm:h-64 object-cover transform transition duration-500; }
.vip-card:hover .vip-image{ transform: scale(1.06); }
.vip-overlay{ @apply absolute inset-0 flex flex-col justify-end bg-gradient-to-t from-black/70 via-black/20 to-transparent text-white p-5; position: relative; }
.vip-card::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, transparent 0%, transparent 40%, rgba(255,255,255,0.25) 50%, transparent 60%, transparent 100%); transform: translateX(-100%); transition: transform .8s; }
.vip-card:hover::after{ transform: translateX(100%); }
.vip-title{ @apply font-poppins text-lg font-semibold; }
.vip-text{ @apply text-white/90 text-sm mt-1; }
.vip-footer{ @apply text-xs opacity-80 mt-3; }

/* Animations: fade-up */
[data-animate="fade-up"]{ opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
[data-animate="fade-up"].in-view{ opacity: 1; transform: translateY(0); }

/* Modal */
#cursoModal{ display: none; }
#cursoModal.show{ display: flex; }
.modal-scale-in{ transform: scale(.96); opacity: 0; transition: transform .25s ease, opacity .25s ease; }
#cursoModal.show .modal-scale-in{ transform: scale(1); opacity: 1; }

/* Parallax mild */
[data-parallax]{ will-change: transform; }

/* Floating CTA */
.fixed-cta{ display:none; }

/* Icon links */
.icon-link{ @apply inline-flex items-center justify-center h-10 w-10 rounded-full bg-white/5 hover:bg-white/10 transition; }
.card{ @apply bg-white rounded-2xl shadow-smooth border border-slate-100; }
.card-body{ @apply p-6; }
.muted{ @apply text-slate-600; }
.heading{ @apply font-poppins text-2xl sm:text-3xl font-semibold; }

/* Utilities fallbacks for older browsers if Tailwind fails to load */
.font-poppins{ font-family: 'Poppins', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.font-lato{ font-family: 'Lato', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }

/* Design: grid background like reference */
.bg-grid{
  background-image:
    linear-gradient(rgba(15,23,42,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,42,0.06) 1px, transparent 1px);
  background-size: 120px 120px, 120px 120px;
  background-position: center;
}

.bg-cta{
  background: radial-gradient(120% 120% at 50% 0%, #0d4f91 0%, #0a3d74 45%, #0a2d59 100%);
  position: relative;
}
.bg-cta::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.35; mix-blend:screen;
  background-image:
    linear-gradient(rgba(255,255,255,0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px);
  background-size: 120px 120px, 120px 120px;
}

/* Title highlight */
.highlight-blue{ color: var(--biomim-blue); }

/* Feature rows (like lined boxes) */
.feature-row{
  @apply flex items-start gap-4 p-4 rounded-2xl border border-slate-200 bg-white/70;
}
.feature-row + .feature-row{ margin-top: 14px; }
.icon-badge{ @apply h-11 w-11 rounded-2xl flex items-center justify-center bg-[color:var(--light-blue)] text-biomimBlue; box-shadow: 0 6px 20px rgba(13,79,145,.15); }

/* Feature cards (2x2 with alternated blue) */
.feature-card{ @apply rounded-2xl p-6 shadow-smooth bg-white; }
.feature-card.is-blue{ background: #cfeeff; border: 1px solid #b8e2ff; }
.feature-title{ @apply font-poppins font-medium text-lg; }
.feature-text{ @apply text-slate-700 mt-2; }

/* Avatars */
.avatar-dot{ height: 36px; width: 36px; border-radius: 9999px; display:inline-block; border: 2px solid #fff; box-shadow:0 2px 8px rgba(0,0,0,.1); background: linear-gradient(135deg,#b0c4de,#7aa7e9); }
.avatar-img{ height:36px; width:36px; border-radius:9999px; border:2px solid #fff; object-fit:cover; box-shadow:0 2px 8px rgba(0,0,0,.1); background:#e5e7eb; display:inline-block; }
.avatar-stack{ display:inline-flex; flex-wrap: nowrap; }
.avatar-stack .avatar-dot, .avatar-stack .avatar-img{ margin-left: -10px; }

/* Hero figure position: avoid overlapping the fixed header on mobile */
.hero-figure{ margin-top: 0; }
@media (min-width: 640px){ .hero-figure{ margin-top: -16px; } }
@media (min-width: 1024px){ .hero-figure{ margin-top: -24px; } }

/* Chips (rounded circles with blue stroke and light fill) */
.chips{ display:flex; flex-wrap:wrap; gap:.5rem; }
.chip-blue{ display:inline-flex; align-items:center; justify-content:center; color: var(--biomim-blue); background: rgba(13,79,145,.06); border:1.5px solid var(--biomim-blue); border-radius:9999px; padding:.375rem .75rem; font-weight:600; font-size:.85rem; }

/* --- Premium clean: remove shadows from CTAs and icons, lighten icon tiles --- */
.cta-solid, .btn-primary, .cta-outline{ box-shadow: none !important; }
.cta-solid:hover, .btn-primary:hover{ transform: none; filter: none; }
.icon-badge{ background: rgba(13,79,145,.06) !important; border:1px solid rgba(13,79,145,.25) !important; box-shadow: none !important; color: var(--biomim-blue) !important; }

/* ------------------------------
   Refined shadcn-like components
   ------------------------------ */

:root{
  --radius: 14px;
  --ring: 0 0 0 2px rgba(0,118,255,.6);
  --shadow-smooth: 0 10px 30px rgba(0,0,0,.08);
}

/* Base button */
.btn,
.cta-solid,
.cta-outline,
.btn-primary,
.btn-secondary,
.btn-outline{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.875rem 1.25rem; border-radius: var(--radius);
  font-weight:600; font-size: 0.95rem; line-height:1;
  transition: all .2s ease; white-space: nowrap; text-decoration:none;
  border: 1px solid transparent; user-select:none;
}
.btn:focus-visible,
.cta-solid:focus-visible,
.cta-outline:focus-visible,
.btn-primary:focus-visible,
.btn-secondary:focus-visible,
.btn-outline:focus-visible{ outline: none; box-shadow: var(--ring); }

/* Solid (primary) */
.cta-solid, .btn-primary{
  color:#fff; background: var(--biomim-blue);
  box-shadow: 0 12px 28px rgba(13,79,145,.28), inset 0 -2px 0 rgba(0,0,0,.08);
}
.cta-solid:hover, .btn-primary:hover{ filter: brightness(1.05); transform: translateY(-1px); }
.cta-solid:active, .btn-primary:active{ transform: translateY(0); filter: brightness(.98); }

/* Outline (secondary) */
.cta-outline, .btn-outline{
  background:#fff; color: var(--biomim-blue); border-color: var(--biomim-blue);
}
.cta-outline:hover, .btn-outline:hover{ background: rgba(0,118,255,.06); }
.cta-outline:active, .btn-outline:active{ background: rgba(0,118,255,.1); }

/* Sizes */
.btn-sm{ padding:.6rem .9rem; font-size:.9rem; border-radius:12px; }

/* Secondary neutral */
.btn-secondary{ background:#fff; color:#0f172a; border-color:#e5e7eb; }
.btn-secondary:hover{ background:#f8fafc; }

/* Link-like CTA */
.btn-link{ color: var(--biomim-blue); font-weight:600; text-underline-offset:3px; }
.btn-link:hover{ text-decoration: underline; }

/* Footer CTA: disable hover effects */
#cta-final .cta-outline{ transition: none; }
#cta-final .cta-outline:hover, #cta-final .cta-outline:active{ background: #fff; }

/* Better text balance to avoid awkward line breaks */
.text-balance{ text-wrap: balance; }

/* Instagram gradient */
.btn-instagram{ color:#fff; padding:.875rem 1.25rem; border-radius: var(--radius);
  background: radial-gradient(92.2% 100% at 0% 0%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  box-shadow: var(--shadow-smooth);
}
.btn-instagram:hover{ filter: brightness(1.05); transform: translateY(-1px); }

/* WhatsApp fixed button (kept) */
.btn-whatsapp{ color:#fff; background:#25D366; padding:.75rem 1rem; border-radius: var(--radius); }

/* Cards */
.card-mini{ background:#fff; border:1px solid #e5e7eb; border-radius: 16px; padding:16px; box-shadow: var(--shadow-smooth); }
.card-hover{ background:#fff; border:1px solid #e5e7eb; border-radius: 16px; overflow:hidden; box-shadow: var(--shadow-smooth); transition: transform .25s ease, box-shadow .25s ease; }
.card-hover:hover{ transform: translateY(-3px); box-shadow: 0 18px 40px rgba(0,0,0,.12); }
.card-image{ width:100%; height:12rem; object-fit:cover; }

/* VIP cards */
/* older VIP card styling kept only for legacy; current VIP uses .card */

/* Feature list and cards */
.feature-row{ display:flex; align-items:flex-start; gap:18px; padding:18px; border-radius:18px; border:1px solid #e5e7eb; background:#fff; }
.feature-row + .feature-row{ margin-top: 16px; }
.icon-badge{ height:44px; width:44px; border-radius:14px; display:flex; align-items:center; justify-content:center; background: var(--light-blue); color: var(--biomim-blue); box-shadow: 0 6px 20px rgba(0,118,255,.12); }
.feature-card{ border-radius:16px; padding:24px; background:#fff; border:1px solid #e5e7eb; box-shadow: var(--shadow-smooth); }
.feature-card.is-blue{ background:#dff1ff; border-color:#c9e7ff; }
.feature-title{ font-family:'Poppins', ui-sans-serif, system-ui; font-weight:600; font-size:1.125rem; }
.feature-text{ color:#334155; margin-top:.25rem; }

/* Remove feature-row borders specifically in Cursos VIP area to evitar linhas visíveis */
#cursos-vip .feature-row{ border:0; background:#fff; box-shadow: var(--shadow-smooth); }

/* Remove top borders that appear as lines before details title */
#detalhes-cursos .card{ border:0; box-shadow: var(--shadow-smooth); }

/* Simple helpers */
.card{ background:#fff; border:1px solid #e5e7eb; border-radius:16px; box-shadow: var(--shadow-smooth); }
.card-body{ padding:24px; }
.muted{ color:#475569; }
.heading{ font-family:'Poppins', ui-sans-serif, system-ui; font-weight:600; font-size:clamp(1.5rem, 2vw + 1rem, 2rem); }

/* ==============================
   Unified container style
   ============================== */
:root{ --card-border: #e2e9f3; --card-shadow: 0 12px 30px rgba(2,32,71,.06); }
.card, .card-mini, .card-hover, .feature-row, .feature-card{ background:#fff !important; border:1px solid var(--card-border) !important; border-radius:18px !important; box-shadow: var(--card-shadow) !important; }
.feature-card.is-blue{ background:#fff !important; border-color: var(--card-border) !important; }
.icon-badge{ background: linear-gradient(180deg, rgba(13,79,145,.10) 0%, rgba(10,61,116,.06) 100%) !important; color: var(--biomim-blue) !important; }

/* FAQ */
.faq{ max-width: 56rem; margin: 0 auto; }
.faq-item{ border:1px solid #e5e7eb; border-radius:16px; background:#fff; box-shadow: var(--shadow-smooth); overflow:hidden; }
.faq-item + .faq-item{ margin-top: 12px; }
.faq-item summary{ list-style:none; cursor:pointer; padding:18px 20px; display:flex; align-items:center; gap:12px; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item[open] summary{ background:#f8fafc; }
.faq-item .faq-content{ padding: 0 20px 18px 52px; color:#475569; }
.chev{ transition: transform .2s ease; }
details[open] .chev{ transform: rotate(180deg); }
/* Force FAQ icons to brand blue */
.faq-item summary i[data-lucide]{ color: var(--biomim-blue) !important; }