/* ============================================================
   Página inicial moderna — secções próprias da entrada
   (hero, acesso rápido, destaques, notícias, agenda, escolas, newsletter).
   A base partilhada (tokens, cabeçalho, rodapé, cartões) está em moderno.css.
   ============================================================ */

/* ---------- Hero ---------- */
.ini-hero { position: relative; background: var(--ini-navy); color: #fff; overflow: hidden; isolation: isolate; }
.ini-hero-fundo { position: absolute; inset: 0; background: url("../img/textura-mar.jpg") center / cover no-repeat; z-index: -2; }
.ini-hero-fundo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(1,34,85,.10) 0%, rgba(1,34,85,.25) 45%, rgba(1,34,85,.82) 70%, rgba(1,34,85,.92) 100%); }
.ini-hero-inner { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 32px; align-items: center; min-height: 520px; padding-top: 36px; padding-bottom: 96px; }
.ini-hero-barco { position: relative; justify-self: start; width: 100%; max-width: 600px; }
.ini-hero-barco picture { display: block; }
.ini-hero-barco img { display: block; width: 100%; height: auto; filter: drop-shadow(0 10px 22px rgba(1, 25, 64, .45)); }
.ini-hero-painel { max-width: 560px; }
.ini-hero .ini-etiqueta { color: var(--ini-sol); text-shadow: 0 1px 2px rgba(0,0,0,.3); }
.ini-hero h1 { color: #fff; font-size: clamp(38px, 4.6vw, 62px); text-shadow: 0 2px 18px rgba(1,34,85,.35); }
.ini-hero h1 em { font-style: normal; color: var(--ini-sol); }
.ini-hero-texto { font-size: 19px; max-width: 50ch; margin: 20px 0 30px; color: #e6eefb; text-shadow: 0 1px 10px rgba(1,34,85,.4); }
.ini-hero-acoes { display: flex; flex-wrap: wrap; gap: 14px; }
.ini-hero-onda { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: 70px; display: block; z-index: -1; }

/* hero com vídeo de fundo: o vídeo ocupa o hero e o texto fica à esquerda, sobre um véu azul-marinho */
.ini-hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 32%; display: block; }
.ini-hero.tem-video .ini-hero-fundo { background: var(--ini-navy); }
.ini-hero.tem-video .ini-hero-fundo::after { background: linear-gradient(90deg, rgba(1,34,85,.90) 0%, rgba(1,34,85,.76) 34%, rgba(1,34,85,.30) 64%, rgba(1,34,85,.10) 100%),
    linear-gradient(180deg, rgba(1,34,85,0) 62%, rgba(1,34,85,.32) 100%); }
.ini-hero.tem-video .ini-hero-inner { grid-template-columns: minmax(0, 620px); min-height: 560px; }
.ini-hero.tem-video .ini-hero-painel { max-width: 600px; }
.ini-hero-pausa { position: absolute; top: 18px; right: 18px; z-index: 3; width: 40px; height: 40px; padding: 0; border-radius: 50%; border: 1px solid rgba(255,255,255,.5);
    background: rgba(1,34,85,.5); color: #fff; display: grid; place-items: center; cursor: pointer; transition: background var(--ini-transicao); }
.ini-hero-pausa[hidden] { display: none; }
.ini-hero-pausa:hover { background: rgba(1,34,85,.78); }
.ini-hero-pausa:focus-visible { outline: 3px solid var(--ini-sol); outline-offset: 2px; }
.ini-hero-pausa svg { width: 18px; height: 18px; fill: currentColor; }
.ini-hero-pausa .i-tocar, .ini-hero-pausa.is-pausado .i-pausa { display: none; }
.ini-hero-pausa.is-pausado .i-tocar { display: inline; }
.ini-hero-onda path { fill: #fff; }
.ini-hero-barco, .ini-hero-painel { animation: ini-entrada 700ms cubic-bezier(.2,.7,.3,1) both; }
.ini-hero-painel { animation-delay: 140ms; }
@media (prefers-reduced-motion: reduce) { .ini-hero-barco, .ini-hero-painel { animation: none; } .ini-servico { transition: none !important; } }
@media (max-width: 900px) {
    .ini-hero-fundo::after { background: linear-gradient(180deg, rgba(1,34,85,.10) 0%, rgba(1,34,85,.55) 40%, rgba(1,34,85,.92) 100%); }
    .ini-hero.tem-video .ini-hero-fundo::after { background: linear-gradient(180deg, rgba(1,34,85,.30) 0%, rgba(1,34,85,.70) 42%, rgba(1,34,85,.92) 100%); }
    .ini-hero.tem-video .ini-hero-inner { min-height: 480px; align-content: end; }
    .ini-hero-inner { grid-template-columns: 1fr; gap: 10px; min-height: 0; padding-top: 24px; padding-bottom: 84px; }
    .ini-hero-barco { max-width: 520px; }
    .ini-hero h1 { font-size: clamp(34px, 8vw, 48px); }
    .ini-hero-texto { font-size: 17px; }
}

@media (max-width: 700px) {
    .ini-hero.tem-video .ini-hero-fundo { position: relative; inset: auto; height: 58vw; max-height: 360px; }
    .ini-hero.tem-video .ini-hero-fundo::after { background: linear-gradient(180deg, rgba(1,34,85,0) 50%, rgba(1,34,85,.85) 92%, var(--ini-navy) 100%); }
    .ini-hero.tem-video .ini-hero-inner { min-height: 0; padding-top: 4px; }
    .ini-hero-pausa { top: 12px; right: 12px; width: 36px; height: 36px; }
}

/* ---------- Acesso rápido (e-Serviços) ---------- */
.ini-acesso { margin-top: -46px; position: relative; z-index: 2; padding-bottom: 54px; }
.ini-servicos { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.ini-servico { background: #fff; border: 1px solid var(--ini-linha); border-radius: var(--ini-raio); padding: 18px 14px 16px; text-align: center; box-shadow: var(--ini-sombra); transition: transform var(--ini-transicao), box-shadow var(--ini-transicao), border-color var(--ini-transicao); display: flex; flex-direction: column; align-items: center; gap: 10px; color: var(--ini-navy); }
.ini-servico:hover { transform: translateY(-4px); box-shadow: var(--ini-sombra-forte); border-color: var(--ini-gelo); text-decoration: none; }
.ini-servico .icone { width: 54px; height: 54px; display: grid; place-items: center; }
.ini-servico .icone img { max-width: 54px; max-height: 54px; width: auto; height: auto; object-fit: contain; }
.ini-servico .icone .letra { width: 54px; height: 54px; border-radius: 14px; background: var(--ini-gelo); color: var(--ini-navy); display: grid; place-items: center; font-family: var(--ini-fonte-titulo); font-size: 24px; }
.ini-servico b { font-family: var(--ini-fonte-titulo); font-weight: 700; font-size: 16px; line-height: 1.15; }
.ini-servico small { color: var(--ini-texto-2); font-size: 12px; }
@media (max-width: 1023px) { .ini-servicos { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .ini-servicos { grid-template-columns: repeat(2, 1fr); gap: 10px; } .ini-acesso { margin-top: -30px; } }

/* ---------- Destaques ---------- */
.ini-destaques { display: grid; grid-template-columns: 1.35fr 1fr; gap: 22px; }
.ini-destaque-grande { min-height: 440px; display: flex; align-items: flex-end; color: #fff; background: var(--ini-navy); }
.ini-destaque-grande .fundo { position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 900ms ease; }
.ini-destaque-grande:hover .fundo { transform: scale(1.04); }
.ini-destaque-grande .fundo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(1,34,85,.05) 20%, rgba(1,34,85,.88) 100%); }
.ini-destaque-grande.is-pequena .fundo { background-size: 42% auto; background-repeat: no-repeat; background-position: center 34%; background-color: var(--ini-gelo); }
.ini-destaque-grande .texto { position: relative; padding: 32px; }
.ini-destaque-grande h3 { color: #fff; font-size: clamp(28px, 3vw, 40px); margin: 8px 0 10px; }
.ini-destaque-grande p { margin: 0; color: #dbe6f7; max-width: 56ch; }
.ini-destaques-lista { display: grid; gap: 14px; align-content: start; }
.ini-destaque-peq { display: grid; grid-template-columns: 112px 1fr; gap: 16px; align-items: center; padding: 10px 16px 10px 10px; }
.ini-destaque-peq .thumb { width: 112px; height: 92px; border-radius: var(--ini-raio-sm); background: var(--ini-gelo) url("../img/textura-mar.jpg") center / cover; overflow: hidden; }
.ini-destaque-peq .thumb img { width: 100%; height: 100%; object-fit: cover; }
.ini-destaque-peq .thumb.is-pequena { background: var(--ini-neve); }
.ini-destaque-peq .thumb.is-pequena img { object-fit: contain; padding: 8px; box-sizing: border-box; }
.ini-destaque-peq h3 { font-size: 20px; line-height: 1.1; }
.ini-destaque-peq .meta { font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--ini-ceu); font-family: var(--ini-fonte-titulo); margin-bottom: 4px; }
@media (max-width: 900px) { .ini-destaques { grid-template-columns: 1fr; } .ini-destaque-grande { min-height: 340px; } }

/* ---------- Notícias ---------- */
.ini-noticias { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.ini-noticia { display: flex; flex-direction: column; }
.ini-noticia .capa { position: relative; aspect-ratio: 16 / 10; background: var(--ini-navy) url("../img/textura-mar.jpg") center / cover; overflow: hidden; }
.ini-noticia .capa img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms ease; }
.ini-noticia:hover .capa img { transform: scale(1.05); }
.ini-noticia .capa.is-pequena img { object-fit: contain; padding: 22px; box-sizing: border-box; background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(240,246,255,.92)); }
.ini-noticia .capa .sem-imagem { position: absolute; inset: 0; display: grid; place-items: center; color: rgba(255,255,255,.85); font-family: var(--ini-fonte-titulo); font-size: 22px; letter-spacing: .1em; text-transform: uppercase; }
.ini-noticia .corpo { padding: 18px 20px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.ini-noticia h3 { font-size: 22px; line-height: 1.12; }
.ini-noticia p { margin: 0; color: var(--ini-texto-2); font-size: 15px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ini-noticia .ini-ligacao-seta { margin-top: auto; font-size: 14px; }
@media (max-width: 900px) { .ini-noticias { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .ini-noticias { grid-template-columns: 1fr; } }

/* ---------- Agenda + oferta ---------- */
.ini-duplo { display: grid; grid-template-columns: 1.15fr .85fr; gap: 28px; align-items: start; }
@media (max-width: 900px) { .ini-duplo { grid-template-columns: 1fr; } }
.ini-agenda { display: grid; gap: 12px; }
.ini-evento { display: grid; grid-template-columns: 76px 1fr; gap: 16px; align-items: center; padding: 12px 16px 12px 12px; }
.ini-evento .dia { background: var(--ini-navy); color: #fff; border-radius: var(--ini-raio-sm); text-align: center; padding: 8px 4px; font-family: var(--ini-fonte-titulo); line-height: 1; }
.ini-evento .dia b { display: block; font-size: 30px; }
.ini-evento .dia span { display: block; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; margin-top: 4px; color: var(--ini-gelo); }
.ini-evento h3 { font-size: 20px; }
.ini-evento .meta { color: var(--ini-texto-2); font-size: 14px; margin-top: 4px; }
.ini-evento .meta span + span::before { content: " · "; }
.ini-oferta { background: var(--ini-navy) url("../img/textura-mar.jpg") right center / cover; color: #fff; border-radius: var(--ini-raio); padding: 34px 32px; box-shadow: var(--ini-sombra); position: relative; overflow: hidden; }
.ini-oferta::before { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(1,34,85,.92), rgba(1,34,85,.6)); }
.ini-oferta > * { position: relative; }
.ini-oferta h2 { color: #fff; font-size: 34px; margin-bottom: 10px; }
.ini-oferta p { color: #dbe6f7; margin: 0 0 22px; }
.ini-oferta ul { list-style: none; padding: 0; margin: 0 0 22px; display: grid; gap: 8px; }
.ini-oferta li { display: flex; gap: 10px; align-items: baseline; font-size: 15px; }
.ini-oferta li::before { content: "◆"; color: var(--ini-sol); font-size: 10px; }

/* ---------- Escolas (faixa horizontal) ---------- */
.ini-faixa { position: relative; }
.ini-faixa-pista { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 6px 6px 22px; margin: 0 -6px; scrollbar-width: none; }
.ini-faixa-pista::-webkit-scrollbar { display: none; }   /* navega-se pelas setas, ao deslizar ou com o trackpad */
.ini-faixa-pista > * { scroll-snap-align: start; }
.ini-escola { padding: 22px; display: flex; flex-direction: column; gap: 8px; min-height: 170px; }
.ini-escola h3 { font-size: 22px; line-height: 1.1; }
.ini-escola p { margin: 0; color: var(--ini-texto-2); font-size: 14px; flex: 1; }
.ini-faixa-setas { display: flex; gap: 8px; }
.ini-faixa-setas button { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--ini-linha); background: #fff; color: var(--ini-navy); cursor: pointer; font-size: 18px; display: grid; place-items: center; transition: background var(--ini-transicao), color var(--ini-transicao); }
.ini-faixa-setas button:hover { background: var(--ini-navy); color: #fff; }

/* ---------- Newsletter + selos ---------- */
.ini-newsletter { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: center; }
.ini-newsletter-cartao { display: flex; gap: 18px; align-items: center; background: #fff; border-radius: var(--ini-raio); padding: 20px; box-shadow: var(--ini-sombra); }
.ini-newsletter-cartao .icone { width: 64px; height: 64px; border-radius: 16px; background: var(--ini-sol); display: grid; place-items: center; flex-shrink: 0; }
.ini-newsletter-cartao .icone svg { width: 30px; height: 30px; fill: none; stroke: var(--ini-navy); stroke-width: 2; }
.ini-newsletter-cartao h3 { font-size: 22px; }
.ini-newsletter-cartao p { margin: 2px 0 8px; color: var(--ini-texto-2); font-size: 14px; }
.ini-selos { display: flex; flex-wrap: wrap; gap: 18px 26px; align-items: center; justify-content: center; }
.ini-selos img { height: 56px; width: auto; filter: grayscale(.1); opacity: .95; }
@media (max-width: 900px) { .ini-newsletter { grid-template-columns: 1fr; } }