/* NotreDame Saúde Planos — CSS único do tema. Visual baseado no site oficial (marinho, azul-claro, bege, Figtree). */

@font-face { font-family: "Figtree"; font-style: normal; font-weight: 400 800; font-display: swap; src: url(../fonts/figtree-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 400 800; font-display: swap; src: url(../fonts/figtree-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
	--marinho: #001453;
	--marinho-2: #0b1d63;
	--azul: #162a59;
	--azul-vivo: #0435ac;
	--claro: #88b9d7;
	--claro-2: #a9cde3;
	--bege: #eeede3;
	--bege-borda: #e0e0cd;
	--areia: #f7f4ed;
	--texto: #1b2236;
	--texto-2: #4b5368;
	--branco: #fff;
	--raio: 16px;
	--raio-p: 8px;
	--largura: 1080px;
	--sombra: 0 8px 28px rgba(0, 20, 83, .10);
	font-size: 100%;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; font-family: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif; font-size: 1.0625rem; line-height: 1.6; color: var(--texto); background: var(--branco); }
img, svg { display: block; max-width: 100%; height: auto; }
a { color: var(--azul-vivo); text-underline-offset: 3px; }
a:hover { color: var(--marinho); }
h1, h2, h3 { color: var(--marinho); line-height: 1.18; margin: 0 0 .5em; font-weight: 700; letter-spacing: -.01em; }
h1 { font-size: clamp(1.95rem, 4vw, 2.85rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.1rem); }
h3 { font-size: 1.2rem; }
p { margin: 0 0 1em; }
ul[role="list"] { list-style: none; margin: 0; padding: 0; }
:focus-visible { outline: 3px solid var(--claro); outline-offset: 2px; }

/* Botões */
[data-botao], button[type="submit"] {
	display: inline-flex; align-items: center; gap: .4em; justify-content: center;
	background: var(--claro); color: var(--marinho); font: inherit; font-weight: 700; font-size: .98rem;
	padding: .8em 1.4em; border: 0; border-radius: var(--raio-p); text-decoration: none; cursor: pointer;
	transition: background .2s;
}
[data-botao]:hover, button[type="submit"]:hover { background: var(--claro-2); color: var(--marinho); }
button[disabled] { opacity: .6; cursor: wait; }

/* Pular para o conteúdo */
body > a[href="#conteudo"] { position: absolute; left: -9999px; top: 0; z-index: 100; background: var(--branco); padding: .6em 1em; }
body > a[href="#conteudo"]:focus { left: 1rem; top: 1rem; }

/* ===== Cabeçalho ===== */
#topo {
	position: sticky; top: 0; z-index: 50; background: var(--marinho); color: var(--branco);
	display: flex; align-items: center; gap: 2rem; padding: .9rem max(1rem, calc((100% - var(--largura)) / 2)); min-height: 92px;
	border-bottom: 1px solid rgba(136, 185, 215, .35); box-shadow: 0 6px 22px rgba(0, 6, 28, .55);
}
#topo > a:first-child { flex: none; }
#topo > a:first-child img { width: 200px; height: auto; }
@media (max-width: 520px) { #topo > a:first-child img { width: 170px; } }
#topo > nav:not(#menu-movel) { flex: 1; }
#topo nav ul { display: flex; gap: 1.6rem; align-items: center; }
#topo nav a, #topo nav summary { color: var(--branco); text-decoration: none; font-weight: 600; font-size: .95rem; cursor: pointer; }
#topo nav a:hover, #topo nav summary:hover, #topo nav a[aria-current] { color: var(--claro); }
#topo nav details { position: relative; }
#topo nav summary { list-style: none; display: flex; align-items: center; gap: .35em; }
#topo nav summary::-webkit-details-marker { display: none; }
#topo nav summary::after { content: ""; width: .45em; height: .45em; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg) translateY(-2px); }
#topo nav details ul { position: absolute; top: calc(100% + 1rem); left: -1rem; flex-direction: column; align-items: stretch; gap: 0; min-width: 230px; background: var(--branco); border-radius: var(--raio-p); box-shadow: var(--sombra); padding: .5rem; }
#topo nav details ul a { display: block; color: var(--marinho); padding: .55rem .75rem; border-radius: 6px; }
#topo nav details ul a:hover { background: var(--areia); color: var(--marinho); }
#topo > [data-botao] { flex: none; padding: .6em 1.1em; }
#topo > button { display: none; background: none; border: 0; color: var(--branco); padding: .4rem; cursor: pointer; margin-left: auto; }
#topo > button svg { width: 28px; height: 28px; }
#topo > button[aria-expanded="false"] svg:last-child, #topo > button[aria-expanded="true"] svg:first-child { display: none; }
#menu-movel { display: none; }

@media (max-width: 900px) {
	#topo { gap: 1rem; }
	#topo > nav:not(#menu-movel), #topo > [data-botao] { display: none; }
	#topo > button { display: block; }
	body[data-menu-aberto] #menu-movel { display: block; position: fixed; inset: 92px 0 0; background: var(--marinho); padding: 1.5rem 1rem; overflow-y: auto; }
	#menu-movel ul { flex-direction: column; align-items: stretch !important; gap: 0 !important; }
	#menu-movel li { border-bottom: 1px solid rgba(255, 255, 255, .12); }
	#menu-movel a, #menu-movel summary { display: flex; padding: 1rem 0; font-size: 1.05rem !important; }
	#menu-movel details ul { position: static !important; background: none !important; box-shadow: none !important; padding: 0 0 .5rem 1rem !important; }
	#menu-movel details ul a { color: var(--branco) !important; padding: .6rem 0 !important; }
	#menu-movel details li { border: 0; }
	#menu-movel > [data-botao] { display: flex; margin-top: 1.5rem; color: var(--marinho); }
	body[data-menu-aberto] { overflow: hidden; }
}

/* ===== Seções da home ===== */
main > section { padding: 4.5rem max(1rem, calc((100% - var(--largura)) / 2)); }
main h2 span, main h1 span { color: var(--azul-vivo); }

/* Topo / hero */
#inicio { position: relative; padding-top: 7rem; padding-bottom: 7rem; min-height: 640px; display: flex; align-items: center; background: var(--marinho); overflow: hidden; isolation: isolate; }
#inicio > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 75% center; z-index: -2; }
#inicio::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #001453 0%, #001453 25%, rgba(0, 20, 83, .93) 42%, rgba(0, 20, 83, .78) 58%, rgba(0, 20, 83, .5) 76%, rgba(0, 20, 83, .25) 100%); }
#inicio > div { max-width: 640px; color: var(--branco); }
#inicio h1 { color: var(--branco); text-shadow: 0 2px 16px rgba(0, 10, 40, .55); }
#inicio p { text-shadow: 0 1px 8px rgba(0, 10, 40, .5); }
#inicio h1 span { display: block; color: var(--claro); }
#inicio p { font-size: 1.12rem; max-width: 540px; }
#inicio p:last-child { display: flex; flex-wrap: wrap; gap: 1rem 1.6rem; align-items: center; margin: 1.8rem 0 0; }
#inicio p:last-child > a:not([data-botao]) { color: var(--branco); font-weight: 700; text-decoration: none; }
#inicio p:last-child > a:not([data-botao]):hover { text-decoration: underline; }

/* Rotina: foto + cards bege */
#rotina { display: grid; grid-template-columns: 1fr 1.25fr; gap: 3rem; align-items: center; }
#rotina > img { border-radius: var(--raio); width: 100%; aspect-ratio: 681 / 646; object-fit: cover; }
#rotina h2 span { display: block; }
#rotina > div > p { color: var(--texto-2); }
#rotina ul { display: grid; gap: 1rem; margin-top: 1.5rem; }
#rotina article { background: var(--bege); border: 1px solid var(--bege-borda); border-radius: var(--raio-p); padding: 1.1rem 1.3rem 1rem 3.6rem; position: relative; }
#rotina article > svg { position: absolute; left: 1.2rem; top: 1.15rem; color: var(--marinho); background: var(--bege-borda); border-radius: 4px; padding: 3px; width: 26px; height: 26px; }
#rotina article h3 { font-size: 1.05rem; margin-bottom: .3em; }
#rotina article p { font-size: .93rem; color: var(--texto-2); margin-bottom: .6em; }
#rotina article footer a, #linhas h3 a, #central a, #noticias footer a { display: inline-flex; align-items: center; gap: .25em; font-weight: 700; text-decoration: none; color: var(--marinho); }
#rotina article footer a svg, #linhas h3 a svg, #central a svg, #noticias footer a svg { width: 16px; height: 16px; }

/* Linhas: faixa marinho com 3 cards */
#linhas { background: var(--marinho); color: var(--branco); }
#linhas header h2 { color: var(--branco); }
#linhas header h2 span { color: var(--claro); }
#linhas header p { color: #d6ddef; max-width: 680px; }
#linhas ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; margin-top: 2rem; }
#linhas article { background: var(--branco); color: var(--texto); border-radius: var(--raio); overflow: hidden; height: 100%; padding-bottom: 1.2rem; }
#linhas article img { width: 100%; aspect-ratio: 16 / 7; object-fit: cover; }
#linhas article > p:first-of-type { margin: 1.1rem 1.3rem .2rem; font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--azul-vivo); }
#linhas article h3 { margin: 0 1.3rem .4rem; }
#linhas article > p:last-child { margin: 0 1.3rem; font-size: .93rem; color: var(--texto-2); }

/* Frase */
#frase { text-align: center; padding-top: 4rem; padding-bottom: 4rem; }
#frase p { font-size: clamp(1.25rem, 2.4vw, 1.6rem); font-weight: 700; color: var(--texto); margin: 0; }
#frase span { color: var(--azul-vivo); }

/* Central: banner marinho + foto */
#central { display: grid; grid-template-columns: 1fr 1fr; padding-top: 0; padding-bottom: 0; background: linear-gradient(var(--branco) 0 50%, var(--areia) 50% 100%); }
#central > div { background: var(--marinho); color: var(--branco); padding: 3rem 3rem 3rem 3.5rem; border-radius: var(--raio) 0 0 var(--raio); display: flex; flex-direction: column; justify-content: center; }
#central h2 { color: var(--branco); }
#central h2 span { color: var(--claro); display: block; }
#central p { color: #d6ddef; max-width: 420px; }
#central a { color: var(--claro); }
#central a:hover { color: var(--branco); }
#central > img { width: 100%; height: 100%; object-fit: cover; object-position: 70% center; border-radius: 0 var(--raio) var(--raio) 0; min-height: 300px; }

/* Cotação: foto + benefícios + formulário */
#cotacao { background: var(--areia); display: grid; grid-template-columns: 1.1fr 1fr; gap: 3rem; align-items: start; }
#cotacao > div > img { border-radius: var(--raio); width: 100%; aspect-ratio: 531 / 300; object-fit: cover; margin-bottom: 1.8rem; }
#cotacao h2 { font-size: clamp(1.4rem, 2.4vw, 1.8rem); }
#cotacao ul li { display: flex; gap: .6rem; margin-bottom: .7rem; color: var(--texto-2); }
#cotacao ul li svg { flex: none; color: var(--azul-vivo); margin-top: .2em; }

/* Formulário */
[data-cotacao] { background: var(--branco); border-radius: var(--raio); padding: 2rem; box-shadow: var(--sombra); }
[data-cotacao] form > p:first-child { font-size: 1.3rem; color: var(--marinho); margin-bottom: .3em; line-height: 1.25; }
[data-cotacao] form > p:nth-child(2) { color: var(--texto-2); font-size: .95rem; }
[data-cotacao] label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: .3em; color: var(--marinho); }
[data-cotacao] input, [data-cotacao] select { width: 100%; font: inherit; font-size: 1rem; padding: .75em .9em; border: 1px solid #c9cfdc; border-radius: var(--raio-p); background: var(--branco); color: var(--texto); }
[data-cotacao] input:focus, [data-cotacao] select:focus { border-color: var(--azul-vivo); outline: 2px solid rgba(4, 53, 172, .2); }
[data-cotacao] button[type="submit"] { width: 100%; background: var(--marinho); color: var(--branco); padding: .95em; font-size: 1.02rem; }
[data-cotacao] button[type="submit"]:hover { background: var(--azul-vivo); color: var(--branco); }
[data-cotacao] [role="alert"] { color: #b3261e; font-weight: 600; margin: .8em 0 0; }
[data-cotacao] small { display: block; color: var(--texto-2); font-size: .8rem; margin-top: 1em; line-height: 1.4; }
[data-cotacao] [role="status"] { text-align: center; padding: 1rem 0; }
[data-cotacao] [role="status"] strong { font-size: 1.3rem; color: var(--marinho); }
[data-cotacao] [role="status"] a { display: inline-flex; margin-top: .5rem; background: #1f8f4e; color: var(--branco); font-weight: 700; padding: .8em 1.4em; border-radius: var(--raio-p); text-decoration: none; }

/* Perguntas */
#perguntas { max-width: 860px; margin: 0 auto; padding-left: 1rem; padding-right: 1rem; }
#perguntas h2 { text-align: center; margin-bottom: 1.4em; }
details:not(#topo details) { border-bottom: 1px solid var(--bege-borda); }
details:not(#topo details) summary { cursor: pointer; list-style: none; padding: 1.15rem 2.5rem 1.15rem 0; font-weight: 700; color: var(--marinho); position: relative; font-size: 1.05rem; }
details:not(#topo details) summary::-webkit-details-marker { display: none; }
details:not(#topo details) summary::after { content: "+"; position: absolute; right: .3rem; top: 50%; transform: translateY(-50%); font-size: 1.5rem; font-weight: 400; color: var(--azul-vivo); }
details[open]:not(#topo details) summary::after { content: "−"; }
details:not(#topo details) > p, details:not(#topo details) > div { color: var(--texto-2); padding-bottom: 1rem; margin: 0; }

/* Notícias / cards de posts */
#noticias, #lista { background: var(--marinho); }
#noticias h2, #lista h1 { color: var(--branco); }
#noticias h2 span { color: var(--claro); }
#noticias ul, #lista ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; margin-top: 1.6rem; }
#noticias article, #lista article { background: var(--bege); border-radius: var(--raio); padding: 1.4rem; height: 100%; display: flex; flex-direction: column; }
#noticias article img, #lista article img { border-radius: var(--raio-p); margin-bottom: 1rem; aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
#noticias time, #lista time { font-size: .8rem; color: var(--texto-2); }
#noticias article h3, #lista article h3 { font-size: 1.05rem; }
#noticias article h3 a, #lista article h3 a { color: var(--marinho); text-decoration: none; }
#noticias article > p:nth-of-type(2), #lista article > p:nth-of-type(2) { font-size: .9rem; color: var(--texto-2); flex: 1; }
#lista nav[aria-label="Você está em"] a, #lista nav[aria-label="Você está em"] li { color: #c6d0ea; }
#lista > p { color: var(--branco); }
#lista .navigation { margin-top: 2rem; color: var(--branco); }
#lista .navigation a, #lista .navigation span { color: var(--branco); margin-right: .8rem; }

#mais { max-width: 860px; margin: 0 auto; }

/* ===== Páginas e posts ===== */
#pagina > header { background: var(--marinho); color: var(--branco); padding: 3rem max(1rem, calc((100% - 860px) / 2)) 2.6rem; }
#pagina > header h1 { color: var(--branco); font-size: clamp(1.9rem, 4vw, 2.7rem); }
#pagina > header > p { color: #d6ddef; font-size: 1.1rem; max-width: 720px; margin: 0; }
#pagina > header small { color: #c6d0ea; }
nav[aria-label="Você está em"] ol { list-style: none; margin: 0 0 1rem; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; font-size: .85rem; }
nav[aria-label="Você está em"] li { color: #c6d0ea; }
nav[aria-label="Você está em"] li + li::before { content: "›"; margin-right: .4rem; }
nav[aria-label="Você está em"] a { color: #c6d0ea; text-decoration: none; }
nav[aria-label="Você está em"] a:hover { color: var(--branco); }
#pagina > figure { max-width: 860px; margin: 2rem auto 0; padding: 0 1rem; }
#pagina > figure img { border-radius: var(--raio); width: 100%; }
#pagina > div { max-width: 860px; margin: 0 auto; padding: 2.5rem 1rem 3.5rem; }
#pagina > div > * + h2 { margin-top: 1.8em; }
#pagina > div h3 { margin-top: 1.4em; }
#pagina > div ul:not([role]), #pagina > div ol { padding-left: 1.3em; }
#pagina > div li { margin-bottom: .4em; }
#pagina > div img { border-radius: var(--raio); }
#pagina > aside { max-width: 620px; margin: 0 auto 4rem; padding: 0 1rem; }
#pagina table, .wp-block-table table { width: 100%; border-collapse: collapse; font-size: .95rem; margin: 1.5em 0; }
#pagina th, #pagina td { padding: .8em .9em; border-bottom: 1px solid var(--bege-borda); text-align: left; vertical-align: top; }
#pagina thead th { background: var(--marinho); color: var(--branco); }
#pagina tbody tr:nth-child(even) { background: var(--areia); }
.wp-block-table { overflow-x: auto; margin: 0; }
#pagina blockquote { margin: 1.5em 0; padding: 1.2em 1.4em; background: var(--bege); border-left: 4px solid var(--marinho); border-radius: 0 var(--raio-p) var(--raio-p) 0; }
#pagina blockquote p:last-child { margin: 0; }
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 1rem; margin: 1.5em 0; }
.wp-block-button__link { display: inline-flex; background: var(--claro); color: var(--marinho); font-weight: 700; padding: .8em 1.4em; border-radius: var(--raio-p); text-decoration: none; }
.wp-block-button__link:hover { background: var(--claro-2); color: var(--marinho); }

/* Cards de plano dentro das páginas (bloco de colunas) */
#pagina .wp-block-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1.2rem; margin: 1.8em 0; }
#pagina .wp-block-column { background: var(--bege); border: 1px solid var(--bege-borda); border-radius: var(--raio); padding: 1.4rem; }
#pagina .wp-block-column h3 { margin-top: 0; }
#pagina .wp-block-column ul { padding-left: 1.1em; font-size: .95rem; }

/* ===== Rodapé ===== */
body > footer { background: var(--marinho); color: var(--branco); padding: 0 max(1rem, calc((100% - var(--largura)) / 2)) 2rem; }
#rodape-chamada { background: var(--marinho-2); border-radius: var(--raio); padding: 2.4rem; display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.1fr; gap: 2rem; }
body > footer { padding-top: 3rem; }
#rodape-chamada h2 { color: var(--branco); font-size: 1.45rem; }
#rodape-chamada p { color: #d6ddef; font-size: .95rem; }
#rodape-chamada nav p, #rodape-chamada address p { color: var(--branco); font-weight: 700; margin-bottom: .8em; font-size: 1rem; }
#rodape-chamada nav li { margin-bottom: .5em; }
#rodape-chamada nav a { color: #d6ddef; text-decoration: none; font-size: .93rem; }
#rodape-chamada nav a:hover { color: var(--branco); }
#rodape-chamada address { font-style: normal; }
#rodape-chamada address a { display: inline-flex; gap: .5em; align-items: center; color: var(--branco); font-weight: 700; text-decoration: none; }
#rodape-base { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2rem; padding-top: 2.5rem; }
#rodape-base > a { grid-column: 2; grid-row: 1; }
#rodape-base > p { grid-column: 1; grid-row: 1; font-size: .78rem; color: #b9c3de; margin: 0; max-width: 360px; }
#rodape-base > p + p { grid-column: 3; justify-self: end; }
#rodape-base a { color: #d6ddef; }

#whatsapp-flutuante { position: fixed; right: 1.2rem; bottom: 1.2rem; z-index: 40; width: 58px; height: 58px; border-radius: 50%; background: #1f8f4e; color: var(--branco); display: grid; place-items: center; box-shadow: 0 6px 20px rgba(0, 0, 0, .25); }
#whatsapp-flutuante svg { width: 30px; height: 30px; }
#whatsapp-flutuante:hover { background: #18773f; color: var(--branco); }

/* ===== Responsivo ===== */
@media (max-width: 900px) {
	main > section { padding-top: 3.2rem; padding-bottom: 3.2rem; }
	#inicio { min-height: 620px; align-items: flex-end; padding-bottom: 3.5rem; }
	#inicio > img { object-position: 78% center; }
	#inicio::before { background: linear-gradient(0deg, #001453 0%, #001453 35%, rgba(0, 20, 83, .9) 55%, rgba(0, 20, 83, .65) 78%, rgba(0, 20, 83, .35) 100%); }
	#rotina, #cotacao { grid-template-columns: 1fr; gap: 2rem; }
	#linhas ul, #noticias ul, #lista ul { grid-template-columns: 1fr; }
	#central { grid-template-columns: 1fr; background: var(--areia); padding-top: 3rem; }
	#central > div { border-radius: var(--raio) var(--raio) 0 0; padding: 2rem 1.5rem; }
	#central > img { border-radius: 0 0 var(--raio) var(--raio); min-height: 200px; }
	[data-cotacao] { padding: 1.5rem; }
	#rodape-chamada { grid-template-columns: 1fr 1fr; padding: 1.8rem 1.4rem; }
	#rodape-chamada > div { grid-column: 1 / -1; }
	#rodape-base { grid-template-columns: 1fr; text-align: center; justify-items: center; gap: 1rem; }
	#rodape-base > a, #rodape-base > p, #rodape-base > p + p { grid-column: 1; grid-row: auto; justify-self: center; }
	#rodape-base > a { order: -1; }
	#whatsapp-flutuante { width: 52px; height: 52px; right: 1rem; bottom: 1rem; }
}
@media (max-width: 520px) {
	#rodape-chamada { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }