/* Regulamentos — layout editorial. CSS puro, prefixo reg- */
:root {
    --reg-mar: #072d4a;
    --reg-mar-fundo: #06172b;
    --reg-papel: #def1f4;
    --reg-papel-escuro: #cfe6ea;
    --reg-tinta: #1c2b36;
    --reg-ardosia: #4f6578;
    --reg-linha: rgba(7, 45, 74, .16);
    --reg-linha-forte: rgba(7, 45, 74, .5);
    --reg-acento: #0c7b8d;
    --reg-ferrugem: #b3433f;
    --reg-serif: Geist, Inter, system-ui, -apple-system, sans-serif;
    --reg-sans: Inter, system-ui, -apple-system, sans-serif;
}

.reg-body {
    margin: 0;
    background: var(--reg-papel);
    color: var(--reg-tinta);
    font-family: var(--reg-sans);
    font-size: 16px;
    line-height: 1.75;
    -webkit-font-smoothing: antialiased;
}

/* ── Hero ───────────────────────────────────────────── */
.reg-hero {
    background:
        linear-gradient(rgba(7, 45, 74, .82), rgba(6, 23, 43, .94)),
        url(/images/ondas2.png) center / cover no-repeat;
    background-color: var(--reg-mar-fundo);
    color: #e6f2f6;
    padding: 190px 24px 56px;
}
.reg-hero__conteudo { max-width: 1180px; margin: 0 auto; }
.reg-selo {
    display: block;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: rgba(230, 242, 246, .7);
}
.reg-hero h1 {
    max-width: 900px;
    margin: 26px 0 0;
    font-family: var(--reg-serif);
    font-size: clamp(42px, 8.5vw, 104px);
    line-height: .98;
    font-weight: 600;
    letter-spacing: -.04em;
    color: #fff;
}
.reg-hero h1 span { display: block; }
.reg-hero__rodape {
    display: flex;
    flex-wrap: wrap;
    margin-top: 56px;
    padding-top: 22px;
    border-top: 1px solid rgba(230, 242, 246, .22);
}
.reg-hero p {
    max-width: 440px;
    margin: 0;
    font-family: var(--reg-serif);
    font-size: 19px;
    line-height: 1.55;
    color: rgba(230, 242, 246, .8);
}

/* ── Contentor e índice ────────────────────────────── */
.reg-container { max-width: 1180px; margin: 0 auto; padding: 0 24px 90px; }

.reg-tabs {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
    margin: 0 0 64px;
    scroll-margin-top: 130px;
}
.reg-tab {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    min-height: 84px;
    padding: 14px 16px 16px;
    border: 1px solid var(--reg-linha-forte);
    border-radius: 6px;
    background: #fff;
    color: var(--reg-mar);
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.reg-tab__n { font-family: var(--reg-serif); font-size: 13px; font-weight: 600; letter-spacing: .1em; color: var(--reg-acento); transition: color .2s ease; }
.reg-tab:hover { border-color: var(--reg-acento); transform: translateY(-2px); box-shadow: 0 8px 18px -12px rgba(7, 45, 74, .6); }
.reg-tab:active { transform: translateY(0); }
.reg-tab:focus-visible { outline: 2px solid var(--reg-acento); outline-offset: 3px; }
.reg-tab[aria-selected="true"] { background: var(--reg-mar); border-color: var(--reg-mar); color: #fff; box-shadow: none; transform: none; }
.reg-tab[aria-selected="true"] .reg-tab__n { color: #7fd6e2; }

/* ── Painéis ───────────────────────────────────────── */
.reg-painel { animation: reg-entra .6s ease both; }
.reg-painel[hidden] { display: none; }
@keyframes reg-entra { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* Bloco assimétrico: título à esquerda, leitura à direita */
.reg-bloco {
    display: grid;
    grid-template-columns: minmax(200px, 4fr) 8fr;
    gap: 24px 64px;
    padding: 56px 0;
    border-top: 1px solid var(--reg-linha);
}
.reg-bloco:first-child { border-top: 0; padding-top: 0; }
.reg-bloco__cab { align-self: start; position: sticky; top: 120px; }
.reg-sobretitulo {
    display: block;
    margin-bottom: 14px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .26em;
    text-transform: uppercase;
    color: var(--reg-acento);
}
.reg-titulo {
    margin: 0;
    font-family: var(--reg-serif);
    font-size: clamp(26px, 3.2vw, 36px);
    line-height: 1.14;
    font-weight: 500;
    letter-spacing: -.02em;
    color: var(--reg-mar);
}
.reg-bloco__corpo { min-width: 0; }

/* Números em destaque */
.reg-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    padding: 8px 0 56px;
}
.reg-stat { padding: 4px 28px; border-left: 1px solid var(--reg-linha); }
.reg-stat:first-child { padding-left: 0; border-left: 0; }
.reg-stat strong {
    display: block;
    font-family: var(--reg-serif);
    font-size: clamp(32px, 4.4vw, 52px);
    line-height: 1;
    font-weight: 400;
    letter-spacing: -.03em;
    color: var(--reg-mar);
}
.reg-stat span {
    display: block;
    margin-top: 12px;
    max-width: 190px;
    font-size: 11px;
    line-height: 1.55;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--reg-ardosia);
}

/* Pilares: três colunas em texto corrido */
.reg-pilares { display: grid; grid-template-columns: repeat(3, 1fr); }
.reg-item { padding: 0 28px; border-left: 1px solid var(--reg-linha); }
.reg-item:first-child { padding-left: 0; border-left: 0; }
.reg-item:last-child { padding-right: 0; }
.reg-romano {
    display: block;
    margin-bottom: 18px;
    font-family: var(--reg-serif);
    font-size: 30px;
    line-height: 1;
    color: var(--reg-acento);
}
.reg-item h3,
.reg-linha h3 {
    margin: 0 0 10px;
    font-family: var(--reg-serif);
    font-size: 22px;
    line-height: 1.25;
    font-weight: 500;
    letter-spacing: -.01em;
    color: var(--reg-mar);
}
.reg-item p,
.reg-linha p { margin: 0; font-size: 15.5px; color: #3a4955; }
.reg-linha p + p { margin-top: 12px; }
.reg-item p strong,
.reg-linha p strong { font-weight: 600; color: var(--reg-tinta); }

/* Linhas: termo à esquerda, texto à direita */
.reg-ficha { border-top: 1px solid var(--reg-linha-forte); }
.reg-linha {
    display: grid;
    grid-template-columns: minmax(150px, 3fr) 7fr;
    gap: 8px 36px;
    padding: 26px 0;
    border-bottom: 1px solid var(--reg-linha);
}
.reg-linha h3 { margin: 0; font-size: 20px; }
.reg-linha--alerta h3 { color: var(--reg-ferrugem); }
.reg-linha--alerta p { color: #5b2a22; }

/* Linha do tempo */
.reg-timeline { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--reg-linha-forte); }
.reg-passo {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 8px 20px;
    padding: 22px 0;
    border-bottom: 1px solid var(--reg-linha);
}
.reg-passo__num {
    font-family: var(--reg-serif);
    font-size: 30px;
    line-height: 1.1;
    color: var(--reg-acento);
}
.reg-passo p { margin: 0; font-size: 16px; color: #3a4955; }
.reg-passo p strong { font-weight: 600; color: var(--reg-mar); }

/* Notas: destaque lateral discreto */
.reg-aviso {
    margin: 34px 0 0;
    padding: 2px 0 2px 22px;
    border-left: 1px solid var(--reg-linha-forte);
}
.reg-aviso__rotulo {
    display: block;
    margin-bottom: 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--reg-ardosia);
}
.reg-aviso p {
    margin: 0;
    max-width: 62ch;
    font-family: var(--reg-serif);
    font-size: 18px;
    line-height: 1.6;
    color: #3a4955;
}
.reg-aviso--perigo { border-left-color: var(--reg-ferrugem); }
.reg-aviso--perigo .reg-aviso__rotulo { color: var(--reg-ferrugem); }

/* Prazos */
.reg-relogio { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--reg-linha-forte); border-bottom: 1px solid var(--reg-linha); }
.reg-tempo { padding: 28px 28px 30px 0; }
.reg-tempo + .reg-tempo { padding: 28px 0 30px 28px; border-left: 1px solid var(--reg-linha); }
.reg-tempo__hora {
    display: block;
    font-family: var(--reg-serif);
    font-size: clamp(34px, 5vw, 56px);
    line-height: 1;
    font-weight: 400;
    letter-spacing: -.03em;
    color: var(--reg-mar);
}
.reg-tempo--fim .reg-tempo__hora { color: var(--reg-ferrugem); }
.reg-tempo h3 {
    margin: 16px 0 6px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--reg-ardosia);
}
.reg-tempo p { margin: 0; font-size: 15.5px; color: #3a4955; }

/* Tabela de pontuação */
.reg-tabela-wrap { overflow-x: auto; }
.reg-tabela { width: 100%; min-width: 620px; border-collapse: collapse; font-size: 15px; }
.reg-tabela th {
    padding: 0 18px 14px 0;
    border-bottom: 1px solid var(--reg-linha-forte);
    text-align: left;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--reg-ardosia);
    white-space: nowrap;
}
.reg-tabela td { padding: 22px 18px 22px 0; border-bottom: 1px solid var(--reg-linha); vertical-align: top; color: #3a4955; }
.reg-tabela td:last-child,
.reg-tabela th:last-child { padding-right: 0; }
.reg-especie { font-family: var(--reg-serif); font-size: 20px; line-height: 1.3; font-weight: 500; color: var(--reg-mar); }
.reg-pts { font-family: var(--reg-serif); font-size: 28px; line-height: 1; letter-spacing: -.02em; color: var(--reg-mar); white-space: nowrap; }
.reg-pts--nd { font-size: 18px; color: var(--reg-ardosia); }
.reg-tabela small { display: block; margin-top: 6px; font-size: 12px; color: var(--reg-ardosia); }
.reg-proibido { font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--reg-ferrugem); }

/* Calculadora */
.reg-calc {
    margin-top: 64px;
    padding: 36px 0 0;
    border-top: 1px solid var(--reg-linha-forte);
}
.reg-calc h3 { margin: 0; font-family: var(--reg-serif); font-size: 26px; line-height: 1.2; font-weight: 500; letter-spacing: -.02em; color: var(--reg-mar); }
.reg-calc__sub { margin: 6px 0 28px; font-size: 14px; color: var(--reg-ardosia); }
.reg-calc__campos { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 18px 24px; }
.reg-calc select,
.reg-calc input {
    flex: 1 1 240px;
    min-width: 0;
    padding: 10px 0;
    border: 0;
    border-bottom: 1px solid var(--reg-linha-forte);
    border-radius: 0;
    background: transparent;
    color: var(--reg-tinta);
    font: inherit;
    font-size: 15px;
    color-scheme: light;
}
.reg-calc select:focus,
.reg-calc input:focus { outline: none; border-bottom-color: var(--reg-acento); box-shadow: 0 1px 0 var(--reg-acento); }
.reg-calc input[hidden] { display: none; }
.reg-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 26px;
    border: 1px solid var(--reg-acento);
    border-radius: 6px;
    background: var(--reg-acento);
    color: #fff;
    font: inherit;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .22em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .25s ease, color .25s ease;
}
.reg-btn:hover { background: var(--reg-mar); border-color: var(--reg-mar); color: #fff; }
.reg-btn:focus-visible { outline: 2px solid var(--reg-acento); outline-offset: 3px; }
.reg-btn--fantasma { background: transparent; border-color: var(--reg-linha-forte); color: var(--reg-mar); }
.reg-btn--fantasma:hover { background: var(--reg-mar); border-color: var(--reg-mar); color: #fff; }
.reg-btn[hidden] { display: none; }
.reg-calc__erro { min-height: 22px; margin: 14px 0 0; font-size: 14px; color: var(--reg-ferrugem); }
.reg-calc__total {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-top: 10px;
    padding-top: 20px;
    border-top: 1px solid var(--reg-linha-forte);
}
.reg-calc__total span { font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--reg-ardosia); }
.reg-calc__total strong { font-family: var(--reg-serif); font-size: 64px; line-height: 1; font-weight: 400; letter-spacing: -.04em; color: var(--reg-mar); }
.reg-calc__total small { margin-left: 8px; font-family: var(--reg-serif); font-size: 20px; color: var(--reg-ardosia); }
.reg-calc__lista { list-style: none; margin: 8px 0 0; padding: 0; }
.reg-calc__lista li {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid var(--reg-linha);
    font-size: 14.5px;
}
.reg-calc__lista b { font-family: var(--reg-serif); font-size: 18px; font-weight: 500; color: var(--reg-mar); white-space: nowrap; }
.reg-calc__remover {
    margin-left: 12px;
    padding: 0;
    border: 0;
    border-bottom: 1px solid currentColor;
    background: transparent;
    color: var(--reg-ardosia);
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}
.reg-calc__remover:hover { color: var(--reg-ferrugem); }
.reg-calc__acoes { margin-top: 22px; }

/* Final da página */
.reg-fim { padding: 48px 0 0; text-align: left; border-top: 1px solid var(--reg-linha); margin-top: 24px; }
.reg-voltar {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--reg-mar);
    text-decoration: none;
    border-bottom: 1px solid var(--reg-linha-forte);
    padding-bottom: 4px;
}
.reg-voltar:hover { color: var(--reg-acento); border-bottom-color: var(--reg-acento); }

/* ── Responsivo ────────────────────────────────────── */
@media (max-width: 900px) {
    .reg-tabs { grid-template-columns: repeat(3, 1fr); }
    .reg-bloco { grid-template-columns: 1fr; gap: 28px; padding: 44px 0; }
    .reg-bloco__cab { position: static; }
    .reg-stats { grid-template-columns: 1fr 1fr; row-gap: 36px; }
    .reg-stat:nth-child(3) { padding-left: 0; border-left: 0; }
    .reg-pilares { grid-template-columns: 1fr; }
    .reg-item,
    .reg-item:first-child,
    .reg-item:last-child { padding: 26px 0; border-left: 0; border-top: 1px solid var(--reg-linha); }
    .reg-item:first-child { border-top: 1px solid var(--reg-linha-forte); }
}
@media (max-width: 600px) {
    .reg-hero { padding: 150px 20px 40px; }
    .reg-container { padding: 0 20px 70px; }
    .reg-tabs { grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 44px; }
    .reg-tab { min-height: 74px; }
    .reg-linha { grid-template-columns: 1fr; }
    .reg-passo { grid-template-columns: 46px 1fr; }
    .reg-relogio { grid-template-columns: 1fr; }
    .reg-tempo,
    .reg-tempo + .reg-tempo { padding: 24px 0; border-left: 0; }
    .reg-tempo + .reg-tempo { border-top: 1px solid var(--reg-linha); }
    .reg-calc { padding-top: 28px; }
    .reg-calc__total strong { font-size: 52px; }
}
@media (prefers-reduced-motion: reduce) {
    .reg-painel { animation: none; }
    .reg-tab, .reg-btn { transition: none; }
}
@media print {
    .reg-tabs, .reg-calc { display: none; }
    .reg-painel[hidden] { display: block; }
    .reg-bloco__cab { position: static; }
}