/*
Theme Name:   Hello Elementor Child — MedicalCorp Academia
Theme URI:    https://academia.medicalcorp.pt
Description:  Tema filho do Hello Elementor com o cabeçalho, o rodapé e a página inicial da MedicalCorp Academia (Proposta C).
Author:       MedicalCorp
Template:     hello-elementor
Version:      1.1.3
Text Domain:  hello-elementor-child
*/

/* ==========================================================================
   Tokens — copiados de src/styles/globals.mc-css do repositório medicalcorp
   ========================================================================== */
:root {
  --ink: #17191d;
  --ink-soft: #1e2126;
  --ivory: #f5f3ee;
  --paper: #fbfaf6;
  --gold: #c79a13;
  --line: hsl(220 8% 84%);

  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Inter", system-ui, -apple-system, sans-serif;

  --header-h: 80px;
  --gutter: 20px;
  --max: 1440px;
}
@media (min-width: 640px)  { :root { --gutter: 32px; } }
@media (min-width: 1024px) { :root { --gutter: 48px; --header-h: 88px; } }

/* ==========================================================================
   Base
   ========================================================================== */
html { scroll-behavior: smooth; }
.mc, .mc *, .mc *::before, .mc *::after { box-sizing: border-box; }
.mc { font-family: var(--font-body); color: var(--ink); line-height: 1.5; font-feature-settings: "kern" 1, "liga" 1; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.mc *, .mc *::before, .mc *::after { border-color: var(--line); }
:where(.mc) :is(img, svg) { display: block; max-width: 100%; }
:where(.mc) a, :where(.mc) a:hover, :where(.mc) a:active, :where(.mc) a:focus { color: inherit; text-decoration: none; background-color: transparent; }
:where(.mc) :is(h1, h2, h3, p, ul, ol, figure) { margin: 0; padding: 0; }
:where(.mc) :is(ul, ol) { list-style: none; }
.mc ::selection { background: var(--gold); color: var(--ink); }
.mc :focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.mc-on-light :focus-visible { outline-color: var(--ink); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .mc * { transition: none !important; } }

.mc-skip { color: var(--ink); position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--gold); color: var(--ink); padding: 12px 18px; font-size: 13px; }
.mc-skip:focus { top: 12px; }

.mc-wrap { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: var(--gutter); }
.mc section[id] { scroll-margin-top: var(--header-h); }

/* Marca de secção: filete dourado + rótulo (igual ao SectionLabel do site) */
.mc-label { display: flex; align-items: center; gap: 16px; font-size: 11px; text-transform: uppercase; letter-spacing: .3em; color: rgb(23 25 29 / .45); }
.mc-label::before { content: ""; width: 32px; height: 1px; background: rgb(199 154 19 / .6); }
.mc-label--light { color: rgb(245 243 238 / .55); }

/* Botões */
.mc-btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; padding: 16px 24px; font-size: 12px; text-transform: uppercase; letter-spacing: .18em; line-height: 1.2; transition: background-color .2s, color .2s, border-color .2s; }
.mc-btn svg { width: 16px; height: 16px; transition: transform .2s; }
.mc-btn:hover svg { transform: translateX(4px); }
.mc-btn--gold { background: var(--gold); color: var(--ink); }
.mc-btn--gold:hover { color: var(--ink); background: var(--ivory); }
.mc-btn--line { justify-content: center; border: 1px solid rgb(245 243 238 / .25); color: var(--ivory); }
.mc-btn--line:hover { border-color: var(--gold); color: var(--gold); }
.mc-btn--ink { background: var(--ink); color: var(--ivory); }
.mc-btn--ink:hover { background: var(--gold); color: var(--ink); }
.mc-btn--outline-ink { justify-content: center; border: 1px solid rgb(23 25 29 / .25); color: var(--ink); }
.mc-btn--outline-ink:hover { color: var(--ink); border-color: var(--gold); background: var(--gold); }

/* Ligação de texto com sublinhado dourado (igual ao «Pedir informações» do site) */
.mc-link { color: var(--ink); display: inline-flex; align-items: center; gap: 12px; padding-bottom: 4px; border-bottom: 1px solid var(--gold); font-size: 11px; text-transform: uppercase; letter-spacing: .18em; transition: color .2s; }
.mc-link svg { width: 16px; height: 16px; transition: transform .2s; }
.mc-link:hover { color: var(--gold); }
.mc-link:hover svg { transform: translateX(4px); }

/* ==========================================================================
   Cabeçalho — fundo branco, logótipo à esquerda, menu ao centro, ações à direita
   ========================================================================== */
.mc-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid rgb(23 25 29 / .05); }
.mc-header__bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: var(--header-h); }
.mc-brand { display: flex; align-items: center; gap: 16px; flex-shrink: 0; }
.mc-brand img { height: 48px; width: auto; }
.mc-brand__name { color: var(--ink); padding-left: 16px; border-left: 1px solid rgb(199 154 19 / .6); font-family: var(--font-display); font-size: 22px; letter-spacing: -.01em; line-height: 1; }
.mc-nav { display: none; }
.mc-nav a { font-size: 13px; color: rgb(23 25 29 / .7); transition: color .2s; }
.mc-nav a:hover { color: var(--gold); }
.mc-header__actions { display: none; align-items: center; gap: 24px; }
.mc-header__actions .mc-btn { padding: 12px 20px; font-size: 11px; }
.mc-signin { font-size: 13px; color: rgb(23 25 29 / .7); transition: color .2s; }
.mc-signin:hover { color: var(--gold); }

.mc-menu-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid rgb(23 25 29 / .15); background: none; color: var(--ink); cursor: pointer; }
.mc-menu-btn svg { width: 20px; height: 20px; }
.mc-menu-btn .mc-i-close { display: none; }
.mc-menu-btn[aria-expanded="true"] .mc-i-open { display: none; }
.mc-menu-btn[aria-expanded="true"] .mc-i-close { display: block; }

.mc-drawer { display: none; position: fixed; inset: var(--header-h) 0 0 0; z-index: 49; background: #fff; padding: 32px var(--gutter); overflow-y: auto; }
.mc-drawer.is-open { display: block; }
.mc-drawer ul { border-top: 1px solid rgb(23 25 29 / .1); }
.mc-drawer li { border-bottom: 1px solid rgb(23 25 29 / .1); }
.mc-drawer li a { color: var(--ink); display: block; padding: 18px 0; font-family: var(--font-display); font-size: 26px; }
.mc-drawer .mc-btn { margin-top: 32px; width: 100%; }
.mc-drawer .mc-signin { display: block; margin-top: 20px; text-align: center; font-size: 14px; }

@media (min-width: 1200px) {
  .mc-nav { display: flex; gap: 36px; }
  .mc-header__actions { display: flex; }
  .mc-menu-btn, .mc-drawer { display: none !important; }
}

/* ==========================================================================
   Hero — o momento memorável: título grande sobre tinta, fotografia de prática
   e o triângulo dourado dos Labs a ligar as duas.
   ========================================================================== */
.mc-hero { position: relative; overflow: hidden; background: var(--ink); color: var(--ivory); }
.mc-hero__grid { display: grid; gap: 48px; padding-block: 64px 72px; align-items: center; }
.mc-hero__copy { position: relative; z-index: 1; }
.mc-hero__logo { width: 88px; height: auto; }
.mc-hero h1 { margin-top: 40px; max-width: 17ch; font-family: var(--font-display); font-weight: 400; font-size: 2.6rem; line-height: 1.02; letter-spacing: -.02em; }
.mc-hero h1 span { display: block; color: rgb(245 243 238 / .45); }
.mc-hero__text { margin-top: 28px; max-width: 34rem; font-size: 15px; line-height: 1.7; color: rgb(245 243 238 / .68); }
.mc-hero__cta { margin-top: 40px; display: flex; flex-direction: column; gap: 12px; }
.mc-hero__alt { margin-top: 28px; font-size: 13px; color: rgb(245 243 238 / .5); }
.mc-hero__alt a { margin-left: 6px; color: rgb(245 243 238 / .85); border-bottom: 1px solid rgb(199 154 19 / .6); transition: color .2s; }
.mc-hero__alt a:hover { color: var(--gold); }

.mc-hero__media { position: relative; z-index: 1; }
.mc-hero__photo { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: var(--ink-soft); }
.mc-hero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.mc-hero__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgb(23 25 29 / .78), rgb(23 25 29 / .05) 55%, transparent); }
.mc-hero__caption { position: absolute; z-index: 1; left: 24px; right: 24px; bottom: 24px; padding-left: 16px; border-left: 2px solid var(--gold); font-size: 11px; line-height: 1.6; text-transform: uppercase; letter-spacing: .18em; color: rgb(245 243 238 / .85); }
.mc-hero__tri { position: absolute; z-index: 0; width: min(560px, 92vw); left: -14%; bottom: -8%; opacity: .5; pointer-events: none; }

@media (min-width: 640px)  { .mc-hero h1 { font-size: 3.75rem; } .mc-hero__cta { flex-direction: row; } .mc-hero__logo { width: 112px; } }
@media (min-width: 1024px) {
  .mc-hero__grid { grid-template-columns: repeat(12, 1fr); gap: 64px; padding-block: 96px 112px; }
  .mc-hero__copy { grid-column: span 7; }
  .mc-hero__media { grid-column: 8 / span 5; }
  .mc-hero h1 { font-size: 4.4rem; }
  .mc-hero__text { max-width: 38rem; font-size: 16px; }
  .mc-hero__photo { aspect-ratio: 4 / 5; }
  .mc-hero__tri { left: auto; right: 22%; bottom: -14%; }
}

/* ==========================================================================
   Formações — cartões em branco sobre ivory, como a lista de ações formativas do site
   ========================================================================== */
.mc-courses { padding: 80px var(--gutter); background: var(--ivory); }
@media (min-width: 1024px) { .mc-courses { padding-block: 128px; } }
.mc-courses__head { display: flex; flex-direction: column; gap: 28px; }
.mc-courses h2, .mc-labs h2, .mc-join h2 { margin-top: 28px; font-family: var(--font-display); font-weight: 400; font-size: 2.25rem; line-height: 1.06; letter-spacing: -.02em; }
@media (min-width: 640px)  { .mc-courses h2, .mc-labs h2, .mc-join h2 { font-size: 3rem; } }
.mc-courses h2 span { color: rgb(23 25 29 / .45); }
.mc-courses__intro { max-width: 28rem; font-size: 15px; line-height: 1.7; color: rgb(23 25 29 / .65); }
@media (min-width: 1024px) { .mc-courses__head { flex-direction: row; align-items: flex-end; justify-content: space-between; } }

.mc-courses__note { margin-top: 56px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 20px; border-bottom: 1px solid rgb(23 25 29 / .1); }
.mc-courses__note p { font-size: 13px; color: rgb(23 25 29 / .55); }
.mc-chip { padding: 6px 12px; border: 1px solid rgb(23 25 29 / .15); font-size: 10px; text-transform: uppercase; letter-spacing: .2em; color: rgb(23 25 29 / .5); }

.mc-cards { margin-top: 32px; display: grid; gap: 20px; }
@media (min-width: 640px)  { .mc-cards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .mc-cards { grid-template-columns: repeat(3, 1fr); } }
.mc-card { display: flex; flex-direction: column; border: 1px solid rgb(23 25 29 / .1); background: #fff; padding: 28px; transition: border-color .25s; }
.mc-card:hover { border-color: rgb(199 154 19 / .5); }
.mc-card__area { align-self: flex-start; padding: 4px 12px; border: 1px solid rgb(199 154 19 / .4); font-size: 10px; text-transform: uppercase; letter-spacing: .2em; color: var(--gold); }
.mc-card h3 { margin-top: 24px; font-family: var(--font-display); font-weight: 400; font-size: 1.5rem; line-height: 1.2; }
.mc-card p { margin-top: 12px; font-size: 14px; line-height: 1.7; color: rgb(23 25 29 / .6); }
.mc-card__foot { margin-top: auto; padding-top: 28px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.mc-card__foot > div { margin-top: 0; width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 16px; border-top: 1px solid rgb(23 25 29 / .1); }
.mc-card__status { font-size: 11px; color: rgb(23 25 29 / .45); }

/* ==========================================================================
   Laboratórios — cartões escuros com faixa ivory para o logótipo (igual ao LabCard)
   ========================================================================== */
.mc-labs { padding: 80px var(--gutter); background: var(--ink); color: var(--ivory); }
@media (min-width: 1024px) { .mc-labs { padding-block: 128px; } }
.mc-labs__head { display: flex; flex-direction: column; gap: 24px; }
.mc-labs__intro { max-width: 28rem; font-size: 15px; line-height: 1.7; color: rgb(245 243 238 / .6); }
@media (min-width: 1024px) { .mc-labs__head { flex-direction: row; align-items: flex-end; justify-content: space-between; } }
.mc-labs__grid { margin-top: 56px; display: grid; gap: 24px; }
@media (min-width: 1024px) { .mc-labs__grid { grid-template-columns: repeat(2, 1fr); gap: 32px; } }
.mc-lab { display: flex; flex-direction: column; border: 1px solid rgb(245 243 238 / .1); background: var(--ink-soft); }
.mc-lab__logo { display: flex; align-items: center; justify-content: center; padding: 24px 32px; background: var(--ivory); border-bottom: 1px solid rgb(199 154 19 / .3); }
.mc-lab__logo img { height: 48px; width: auto; max-width: 100%; object-fit: contain; }
.mc-lab__area { display: flex; align-items: center; gap: 12px; padding: 28px 24px 0; font-size: 9px; text-transform: uppercase; letter-spacing: .28em; color: rgb(199 154 19 / .85); }
.mc-lab__area::after { content: ""; flex: 1; height: 1px; background: rgb(199 154 19 / .25); }
.mc-lab__photo { position: relative; margin-top: 28px; aspect-ratio: 16 / 10; overflow: hidden; }
.mc-lab__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; transition: transform .9s cubic-bezier(.22, 1, .36, 1); }
.mc-lab:hover .mc-lab__photo img { transform: scale(1.03); }
.mc-lab__tag { position: absolute; left: 12px; bottom: 12px; padding: 6px 12px; background: rgb(23 25 29 / .8); font-size: 9px; text-transform: uppercase; letter-spacing: .18em; color: rgb(245 243 238 / .7); }
.mc-lab__body { padding: 32px 24px 36px; }
.mc-lab__body h3 { font-family: var(--font-display); font-weight: 400; font-size: 1.75rem; line-height: 1.15; }
.mc-lab__body p { margin-top: 16px; font-size: 14px; line-height: 1.7; color: rgb(245 243 238 / .6); }
.mc-lab__body ul { margin-top: 24px; padding-top: 20px; border-top: 1px solid rgb(245 243 238 / .1); }
.mc-lab__body li { padding-block: 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .16em; color: rgb(245 243 238 / .4); }
@media (min-width: 640px) { .mc-lab__area { padding-inline: 32px; } .mc-lab__body { padding-inline: 32px; } }

/* ==========================================================================
   Inscrição — dois caminhos claros, com as ligações que já existem no WordPress
   ========================================================================== */
.mc-join { padding: 80px var(--gutter); background: var(--paper); }
@media (min-width: 1024px) { .mc-join { padding-block: 128px; } }
.mc-join__layout { display: grid; gap: 48px; }
.mc-join__intro p { margin-top: 24px; max-width: 24rem; font-size: 15px; line-height: 1.7; color: rgb(23 25 29 / .65); }
.mc-join__grid { display: grid; gap: 20px; }
@media (min-width: 1024px) {
  .mc-join__layout { grid-template-columns: repeat(12, 1fr); gap: 64px; align-items: start; }
  .mc-join__intro { grid-column: span 5; }
  .mc-join__grid { grid-column: span 7; grid-template-columns: repeat(2, 1fr); gap: 24px; }
}
.mc-path { display: flex; flex-direction: column; align-items: flex-start; border: 1px solid rgb(23 25 29 / .1); background: #fff; padding: 32px; transition: border-color .25s; }
.mc-path:hover { border-color: rgb(199 154 19 / .5); }
.mc-path h3 { font-family: var(--font-display); font-weight: 400; font-size: 1.75rem; line-height: 1.15; }
.mc-path p { margin-top: 12px; max-width: 26rem; font-size: 14px; line-height: 1.7; color: rgb(23 25 29 / .6); }
.mc-path .mc-btn { margin-top: auto; }
.mc-path p { margin-bottom: 32px; }
.mc-join__login { margin-top: 32px; font-size: 14px; color: rgb(23 25 29 / .6); }
.mc-join__login a { margin-left: 6px; color: var(--ink); border-bottom: 1px solid var(--gold); transition: color .2s; }
.mc-join__login a:hover { color: var(--gold); }

/* ==========================================================================
   Rodapé — réplica do Footer.mc-tsx do site (fundo tinta, logótipo negativo, 3 colunas)
   ========================================================================== */
.mc-footer { background: var(--ink); color: var(--ivory); padding: 64px var(--gutter) 40px; }
@media (min-width: 1024px) { .mc-footer { padding-top: 80px; } }
.mc-footer__grid { display: grid; gap: 48px; padding-bottom: 48px; border-bottom: 1px solid rgb(245 243 238 / .1); }
@media (min-width: 1024px) { .mc-footer__grid { grid-template-columns: repeat(12, 1fr); } .mc-footer__brand { grid-column: span 5; } .mc-footer__nav { grid-column: span 3; } .mc-footer__legal { grid-column: span 4; } }
.mc-footer__brand img { height: 80px; width: auto; }
.mc-footer__tag { margin-top: 24px; max-width: 24rem; font-size: 14px; line-height: 1.7; color: rgb(245 243 238 / .5); }
.mc-social { margin-top: 28px; display: flex; gap: 12px; }
.mc-social a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid rgb(245 243 238 / .15); color: rgb(245 243 238 / .65); transition: color .2s, border-color .2s; }
.mc-social a:hover { border-color: var(--gold); color: var(--gold); }
.mc-social svg { width: 16px; height: 16px; }
.mc-footer h2 { font-size: 10px; font-weight: 400; text-transform: uppercase; letter-spacing: .24em; color: rgb(245 243 238 / .35); }
.mc-footer__list { margin-top: 20px; display: grid; gap: 12px; }
.mc-footer__list a { font-size: 13px; color: rgb(245 243 238 / .65); transition: color .2s; }
.mc-footer__list a:hover { color: var(--gold); }
.mc-footer__list li { display: flex; align-items: baseline; gap: 12px; }
.mc-footer__list span { font-size: 13px; color: rgb(245 243 238 / .5); }
.mc-footer__list em { font-style: normal; font-size: 9px; text-transform: uppercase; letter-spacing: .16em; color: rgb(245 243 238 / .25); }
.mc-footer__copy { padding-top: 28px; font-size: 10px; text-transform: uppercase; letter-spacing: .18em; line-height: 1.8; color: rgb(245 243 238 / .3); }

/* ==========================================================================
   Compatibilidade com o Hello Elementor (estilos de botão/ligação do tema pai) e barra de admin
   ========================================================================== */
.mc .mc-menu-btn, .mc .mc-menu-btn:hover, .mc .mc-menu-btn:focus { background: none; color: var(--ink); border: 1px solid rgb(23 25 29 / .15); border-radius: 0; padding: 0; }
.mc-link, .mc-link:hover { background: none; }
/* Dashboard do Tutor LMS: diz-lhe a altura do nosso cabeçalho (variável oficial do Tutor). */
body .tutor-dashboard-layout, body .tutor-dashboard-isolated-page-wrapper { --tutor-site-header-offset: calc(var(--header-h) + 1px); --tutor-site-header-overlay-offset: 0px; }
.admin-bar .mc-header { top: 32px; }
.admin-bar .mc-drawer { top: calc(var(--header-h) + 32px); }
@media (max-width: 782px) { .admin-bar .mc-header { top: 46px; } .admin-bar .mc-drawer { top: calc(var(--header-h) + 46px); } }
