/*
 * Primeiros Passos — Unimed Ceará (AIS)
 * Único CSS da página (além do Bootstrap). Referência: assets/template-figma-primeiros-passos.png
 * Ordem: fontes → tokens → base → botões → navbar → hero → seções → footer → responsivo
 */

/* ---------- Fontes locais ---------- */
@font-face {
    font-family: 'UnimedSans';
    src: url('../fonts/unimedsans-regular-webfont.woff2') format('woff2');
    font-weight: 300 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'UnimedSans';
    src: url('../fonts/unimedsans-bold-webfont.woff2') format('woff2'),
         url('../fonts/unimedsans-bold-webfont.woff') format('woff');
    font-weight: 600 900;
    font-style: normal;
    font-display: swap;
}

/* ---------- Tokens (Figma) ---------- */
:root {
    --pp-rosa: #E5C2C0;
    --pp-rosa-claro: #F2E1E0;
    --pp-creme: #FFF0C7;
    --pp-creme-claro: #F8F2E2;
    --pp-verde: #D3E6CE;
    --pp-verde-claro: #E8F4E5;
    --pp-azul-claro: #F8F9FF;
    --pp-marrom: #B68672;
    --pp-marrom-escuro: #AB7766;
    --pp-marrom-claro: #CD9D90;
    --pp-cinza: #777777;
    --pp-borda: rgba(0, 0, 0, .2);
    --pp-rodape: #EBE3D8;
    --pp-font: 'UnimedSans', 'Segoe UI', Arial, sans-serif;
    --pp-container: 1200px;
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body {
    margin: 0;
    font-family: var(--pp-font);
    color: var(--pp-cinza);
    background: #fff;
    overflow-x: hidden;
}
.pp-container { width: 100%; max-width: var(--pp-container); margin-inline: auto; padding-inline: 16px; }
section { position: relative; overflow: hidden; }
.pp-shape { position: absolute; pointer-events: none; }
.pp-shape + .pp-shape { margin: 0; }
section > .container { position: relative; z-index: 1; }

.pp-section-title {
    font-size: clamp(2.5rem, 1.6rem + 3.6vw, 4rem); line-height: 1.3; font-weight: 700;
    color: var(--pp-marrom); text-align: center; margin: 0 0 clamp(40px, 5vw, 64px);
}

/* ---------- Botões (CTA pill) ---------- */
.btn-pp {
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--pp-creme); color: var(--pp-marrom-escuro);
    font-weight: 700; text-transform: capitalize; text-decoration: none;
    border-radius: 70px; border: 0; cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease;
}
.btn-pp:hover { color: var(--pp-marrom-escuro); transform: translateY(-2px); box-shadow: 0 6px 16px rgba(171, 119, 102, .25); }
.btn-pp:focus-visible { outline: 3px solid var(--pp-marrom-escuro); outline-offset: 3px; }
.btn-pp--sm { padding: 16px 24px; font-size: 16px; line-height: 20px; }
.btn-pp--lg { padding: 20px 24px; min-width: 246px; height: 64px; font-size: 24px; line-height: 30px; }
.btn-pp--disabled { opacity: .7; cursor: default; }
.btn-pp--disabled:hover { transform: none; box-shadow: none; }

/* ---------- Navbar ---------- */
.pp-navbar {
    min-height: 88px; background: #fff; border-bottom: 1px solid var(--pp-borda);
    position: sticky; top: 0; z-index: 1030;
}
.pp-navbar .navbar-brand img { display: block; width: 157px; height: auto; }
.pp-navbar .navbar-nav { gap: 40px; }
.pp-navbar .nav-link {
    color: var(--pp-cinza); font-weight: 700; font-size: 16px; line-height: 21px;
    text-transform: capitalize; padding: 0;
}
.pp-navbar .nav-link:hover, .pp-navbar .nav-link:focus-visible { color: var(--pp-marrom-escuro); }

/* ---------- Hero ---------- */
.pp-hero {
    position: relative; overflow: hidden; isolation: isolate;
    min-height: min(834px, 100svh - 88px); display: flex; align-items: center;
    background: var(--pp-rosa);
}
.pp-hero::after {
    content: ''; position: absolute; inset: 0; z-index: -2;
    background: url('../assets/home-background-full.webp') right center / cover no-repeat;
}
.pp-hero > .container { position: relative; }
.pp-hero__content { max-width: 598px; padding: clamp(48px, 6vw, 72px) 0; color: #fff; }
.pp-hero__tag {
    display: flex; align-items: center; gap: 24px; margin: 0 0 22px;
    font-size: 20px; font-weight: 600; line-height: 1.2;
}
.pp-hero__tag-item { display: inline-flex; align-items: center; gap: 12px; }
.pp-dot { width: 12px; height: 13px; border-radius: 50%; background: #FAE1E0; display: inline-block; }
.pp-hero__tag-ais {
    max-width: 120px; padding-left: 24px; border-left: 4px solid #fff;
    font-size: 16px; font-weight: 700; line-height: 19px; text-transform: capitalize;
}
.pp-hero__logo { display: block; width: 368px; max-width: 100%; height: auto; margin: 0 0 22px; }
.pp-hero__title { font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.25rem); line-height: 1.17; font-weight: 700; margin: 0 0 22px; }
.pp-hero__subtitle { font-size: clamp(1.25rem, 1.1rem + .6vw, 1.5rem); line-height: 1.3; font-weight: 400; max-width: 520px; margin: 0 0 clamp(32px, 4vw, 48px); }

/* ---------- Apresentação ---------- */
.pp-apresentacao { background: var(--pp-creme); min-height: 616px; display: flex; align-items: center; padding: clamp(72px, 8vw, 96px) 0; }
.pp-apresentacao > .container { text-align: center; }
.pp-apresentacao__dot { display: block; width: 15px; height: 15px; margin: 0 auto 48px; border-radius: 50%; background: var(--pp-marrom-escuro); }
.pp-apresentacao__text {
    max-width: 1021px; margin: 0 auto;
    font-size: clamp(1.25rem, .9rem + 1.5vw, 2rem); line-height: 1.55; font-weight: 400; letter-spacing: clamp(0px, .1vw, 1px);
    color: var(--pp-marrom-escuro);
}
.pp-apresentacao__text strong { font-weight: 700; }
.pp-shape--verde-tl { top: 0; left: 0; width: 230px; height: 220px; background: var(--pp-verde); border-bottom-right-radius: 100%; }
.pp-shape--rosa-tr  { top: -90px; right: -40px; width: 300px; height: 300px; background: var(--pp-rosa); border-radius: 50%; }
.pp-shape--verde-r  { top: 210px; right: 0; width: 172px; height: 280px; background: var(--pp-verde); border-top-left-radius: 100px; }
.pp-shape--rosa-bl  { bottom: 0; left: 0; width: 105px; height: 250px; background: var(--pp-rosa); border-top-right-radius: 100%; }

/* ---------- Programação ---------- */
.pp-programacao { background: #fff; padding: clamp(72px, 8vw, 102px) 0 clamp(72px, 8vw, 112px); }
.pp-shape--azul-tr  { top: -100px; right: -90px; width: 420px; height: 420px; background: var(--pp-azul-claro); border-radius: 50%; }
.pp-shape--rosa-bl2 { bottom: 0; left: 0; width: 163px; height: 190px; background: var(--pp-rosa); border-top-right-radius: 100%; }

.pp-card { height: 100%; padding: clamp(28px, 4vw, 40px) clamp(24px, 3vw, 36px); border-radius: clamp(28px, 3vw, 40px); }
.pp-card--marrom { background: var(--pp-marrom); color: #fff; }
.pp-card--marrom .pp-card__list { color: #FAF3F2; }
.pp-card--creme { background: var(--pp-creme); color: var(--pp-marrom); }
.pp-card__date { font-size: clamp(1.5rem, 1.3rem + .6vw, 1.75rem); line-height: 36px; font-weight: 700; margin: 0 0 24px; }
.pp-card__date em { font-size: 20px; font-weight: 400; margin-left: 4px; }
.pp-card__title { font-size: 24px; line-height: 30px; font-weight: 700; margin: 0 0 24px; }
.pp-card__speaker { font-size: 22px; line-height: 26px; font-weight: 700; margin: 0 0 40px; }
.pp-card__role, .pp-card__handle { display: block; font-size: 13px; line-height: 19px; font-weight: 700; }
.pp-card__role { font-style: italic; margin-top: 4px; }
.pp-card__handle { color: inherit; text-decoration: none; font-weight: 400; opacity: .85; }
.pp-card__handle:hover { text-decoration: underline; }
.pp-card--creme .pp-card__speaker { color: var(--pp-marrom-claro); }
.pp-card__learn { font-size: 24px; line-height: 31px; font-weight: 700; margin: 0 0 12px; }
.pp-card__list { margin: 0; padding-left: 16px; font-size: 16px; line-height: 22px; font-weight: 700; }
.pp-card__list li + li { margin-top: 2px; }

/* ---------- Por que participar? ---------- */
.pp-participar { background: #fff; padding: clamp(72px, 7vw, 96px) 0 clamp(48px, 5vw, 64px); }
.pp-participar__title { font-size: clamp(2rem, 1.6rem + 1.4vw, 2.5rem); line-height: 1.3; font-weight: 700; letter-spacing: -1px; color: var(--pp-marrom); margin: 0 0 40px; }
.pp-participar__list { margin: 0 0 48px; padding-left: 24px; font-size: clamp(1.125rem, .95rem + .7vw, 1.5rem); line-height: 1.25; letter-spacing: -.5px; color: var(--pp-marrom-claro); }
.pp-participar__list li + li { margin-top: 4px; }
.pp-participar__list strong { font-weight: 700; }
.pp-participar__img { display: block; width: 100%; max-width: 471px; height: auto; margin: 0 auto; }
.pp-shape--rosa-l   { top: 0; left: 0; width: 163px; height: 205px; background: var(--pp-rosa); opacity: .5; border-bottom-right-radius: 100%; }
.pp-shape--rosa-r   { top: -80px; right: -60px; width: 300px; height: 350px; background: var(--pp-rosa-claro); border-radius: 50%; }
.pp-shape--verde-br { bottom: 0; right: 0; width: 270px; height: 290px; background: var(--pp-verde-claro); border-top-left-radius: 100%; }
.pp-shape--creme-bl { bottom: 0; left: 0; width: 100px; height: 130px; background: var(--pp-creme-claro); border-top-right-radius: 100%; }

/* ---------- FAQ ---------- */
.pp-faq { background: #fff; padding: clamp(64px, 7vw, 96px) 0 clamp(80px, 9vw, 136px); }
.pp-accordion { --bs-accordion-bg: transparent; --bs-accordion-border-color: var(--pp-borda); --bs-accordion-border-radius: 0;
    --bs-accordion-inner-border-radius: 0; --bs-accordion-btn-focus-box-shadow: none; }
.pp-accordion .accordion-item { border-width: 1px 0; border-radius: 0; background: transparent; }
.pp-accordion .accordion-item + .accordion-item { border-top: 0; }
.pp-accordion .accordion-button {
    padding: 32px 10px; background: transparent; box-shadow: none;
    font-size: 20px; line-height: 36px; font-weight: 700; color: var(--pp-cinza);
}
.pp-accordion .accordion-button:focus-visible { outline: 3px solid var(--pp-marrom-claro); outline-offset: -3px; }
.pp-accordion .accordion-button::after {
    width: 20px; height: 20px; background-size: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23CD9D90' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 8v8M8 12h8'/%3E%3C/svg%3E");
}
.pp-accordion .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23CD9D90' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M8 12h8'/%3E%3C/svg%3E");
    transform: none;
}
.pp-accordion .accordion-body { padding: 0 10px 32px; font-size: 18px; line-height: 28px; color: var(--pp-cinza); }
.pp-faq__title { font-size: clamp(2rem, 1.6rem + 1.4vw, 2.5rem); line-height: 1.3; font-weight: 700; letter-spacing: -1px; margin: 0 0 16px; }
.pp-faq__text { font-size: 20px; line-height: 36px; font-weight: 700; color: rgba(0, 0, 0, .6); opacity: .75; margin: 0; }
.pp-faq__text a { color: inherit; overflow-wrap: anywhere; }

/* ---------- Footer ---------- */
.pp-footer { background: var(--pp-rodape); min-height: 119px; display: flex; align-items: center; }
.pp-footer__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 24px; padding-bottom: 24px; }
.pp-footer__copy { max-width: 639px; margin: 0; font-size: 13px; line-height: 17px; font-style: italic; font-weight: 700; color: #585C65; }
.pp-footer__right { display: flex; align-items: center; gap: 48px; }
.pp-social { display: flex; gap: 24px; }
.pp-social a { color: var(--pp-marrom-claro); font-size: 26px; line-height: 1; }
.pp-social a:hover { color: var(--pp-marrom-escuro); }
.pp-footer__right img { display: block; height: 46px; width: auto; }

/* ---------- Animações (discretas; só com JS ativo, exceto entrada do hero) ---------- */
:root { --pp-ease: cubic-bezier(.22, .61, .36, 1); }

/* Entrada do hero: sobe e aparece em sequência */
@keyframes pp-rise { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
@keyframes pp-zoom { from { transform: scale(1.06); } to { transform: scale(1); } }
@keyframes pp-float { from { transform: translateY(0); } to { transform: translateY(12px); } }
@keyframes pp-pulse { 0% { box-shadow: 0 0 0 0 rgba(171, 119, 102, .35); } 70%, 100% { box-shadow: 0 0 0 14px rgba(171, 119, 102, 0); } }

/* Revelar ao rolar: [data-reveal] (+ left|right|zoom) e [data-delay] 1-4 */
.pp-js [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .8s var(--pp-ease), transform .8s var(--pp-ease); }
.pp-js [data-reveal="left"]  { transform: translateX(-32px); }
.pp-js [data-reveal="right"] { transform: translateX(32px); }
.pp-js [data-reveal="zoom"]  { transform: scale(.94); }
.pp-js [data-reveal].is-visible { opacity: 1; transform: none; }
[data-delay="1"] { transition-delay: .12s !important; }
[data-delay="2"] { transition-delay: .24s !important; }
[data-delay="3"] { transition-delay: .36s !important; }
[data-delay="4"] { transition-delay: .48s !important; }

/* Título de seção: traço que "desenha" ao aparecer */
.pp-section-title::after { content: ''; display: block; width: 72px; height: 4px; margin: 16px auto 0; border-radius: 4px; background: var(--pp-marrom-claro); transition: width .8s .3s var(--pp-ease); }
.pp-js .pp-section-title:not(.is-visible)::after { width: 0; }

/* Navbar: sombra ao rolar + barra de progresso */
.pp-navbar { transition: box-shadow .3s ease; }
.pp-navbar.is-scrolled { box-shadow: 0 6px 20px rgba(119, 119, 119, .12); }
.pp-navbar::after { content: ''; position: absolute; left: 0; bottom: -1px; height: 3px; width: 100%; background: var(--pp-marrom-claro); transform: scaleX(var(--pp-progress, 0)); transform-origin: left; }
.pp-navbar .nav-link { position: relative; transition: color .2s ease; }
.pp-navbar .nav-link::after { content: ''; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px; background: var(--pp-marrom-claro); transform: scaleX(0); transition: transform .3s var(--pp-ease); }
.pp-navbar .nav-link:hover::after, .pp-navbar .nav-link:focus-visible::after { transform: scaleX(1); }

/* Microinterações */
.btn-pp:active { transform: scale(.97); }
.pp-card, .pp-accordion .accordion-button { transition: transform .35s var(--pp-ease), box-shadow .35s var(--pp-ease), color .2s ease; }
.pp-accordion .accordion-button::after { transition: transform .3s var(--pp-ease); }
.pp-accordion .accordion-button:hover { color: var(--pp-marrom); }
.pp-accordion .accordion-button:not(.collapsed)::after { transform: rotate(180deg); }
.pp-participar__list li { transition: transform .3s var(--pp-ease); }
.pp-social a { display: inline-block; transition: color .2s ease, transform .3s var(--pp-ease); }
@media (hover: hover) {
    .pp-card:hover { transform: translateY(-6px); box-shadow: 0 18px 36px rgba(171, 119, 102, .22); }
    .pp-participar__list li:hover { transform: translateX(6px); }
    .pp-social a:hover { transform: translateY(-3px); }
}

@media (prefers-reduced-motion: no-preference) {
    .pp-hero::after { animation: pp-zoom 2.4s var(--pp-ease) both; }
    .pp-hero__content > * { animation: pp-rise .9s var(--pp-ease) both; }
    .pp-hero__content > :nth-child(1) { animation-delay: .10s; }
    .pp-hero__content > :nth-child(3) { animation-delay: .22s; }
    .pp-hero__content > :nth-child(4) { animation-delay: .34s; }
    .pp-hero__content > :nth-child(5) { animation-delay: .46s; }
    .pp-hero__content > :nth-child(6) { animation-delay: .58s; }
    .pp-shape { animation: pp-float 9s ease-in-out infinite alternate; }
    .pp-shape:nth-of-type(2n) { animation-duration: 11s; animation-delay: -3s; }
    .pp-shape:nth-of-type(3n) { animation-duration: 13s; animation-delay: -6s; }
    .pp-apresentacao__dot { animation: pp-pulse 2.6s ease-out infinite; }
}

/* ---------- Responsivo (tipografia e espaçamentos já são fluidos com clamp) ---------- */
@media (max-width: 1199.98px) {
    .pp-navbar .navbar-nav { gap: 24px; }
}
@media (max-width: 991.98px) {
    .pp-navbar .navbar-collapse { padding: 16px 0 24px; }
    .pp-navbar .navbar-nav { gap: 16px; margin-bottom: 16px; }
    .pp-hero::after { background-position: 65% center; }
    .pp-hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(229, 194, 192, .92) 30%, rgba(229, 194, 192, .35) 100%); }
    .pp-participar .row { text-align: center; }
    .pp-participar__list { text-align: left; display: inline-block; }
    .pp-footer__inner { flex-direction: column; text-align: center; }
    .pp-shape { scale: .7; }
}
@media (max-width: 575.98px) {
    .pp-hero__tag { flex-wrap: wrap; gap: 12px; }
    .pp-apresentacao__text { letter-spacing: 0; }
    .pp-card__title, .pp-card__learn { font-size: 1.3rem; line-height: 1.3; }
    .pp-accordion .accordion-button { font-size: 18px; padding: 24px 4px; }
    .pp-accordion .accordion-body { padding-inline: 4px; font-size: 16px; line-height: 26px; }
    .pp-footer__right { flex-direction: column; gap: 20px; }
    .btn-pp--lg { min-width: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .pp-js [data-reveal] { opacity: 1; transform: none; transition: none; }
    .btn-pp, .pp-card, .pp-navbar, .pp-navbar .nav-link::after { transition: none; }
}