:root { --blue: #075bab; --blue-dark: #063f83; --yellow: #ffd21e; }

* { box-sizing: border-box; }

body {
    min-width: 320px;
    margin: 0;
    font-family: "Nunito", "Segoe UI", sans-serif;
    background: linear-gradient(180deg, #dff5ff 0%, #f8fcff 45%, #fff8d8 100%);
}

.home {
    display: grid;
    min-height: calc(100svh - 73px);
    padding: clamp(16px, 3vw, 42px);
    place-items: center;
}

.opening { width: min(1200px, 100%); text-align: center; }

.opening__banner {
    display: block;
    width: 100%;
    height: clamp(120px, calc(100svh - 220px), 680px);
    object-fit: contain;
    object-position: var(--hero-position, center center);
    border-radius: clamp(14px, 2vw, 28px);
    box-shadow: 0 10px 32px rgba(6, 63, 131, .08);
}

.opening__button {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
    min-width: 150px;
    margin-top: clamp(20px, 3vw, 34px);
    padding: 15px 28px;
    border: 1px solid #ebcb6c;
    border-radius: 999px;
    color: var(--blue-dark);
    font-size: 1.1rem;
    font-weight: 900;
    text-decoration: none;
    background: var(--yellow);
    box-shadow: 0 5px 16px rgba(6, 63, 131, .08);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.opening__button:hover, .opening__button:focus-visible {
    transform: translateY(-3px);
    box-shadow: 0 9px 0 #d6a900, 0 13px 22px rgba(6, 63, 131, 0.2);
}

.opening__button:focus-visible { outline: 3px solid var(--blue-dark); outline-offset: 4px; }

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 560px) {
    .home { padding: 12px; }
    .opening__banner { border-radius: 12px; }
    .opening__button { min-width: 138px; padding: 13px 24px; }
}

@media (max-width: 720px) {
    .opening { --hero-position: center top; }
    .home { min-height: calc(100svh - 65px); }
}

.opening__illustration { position:relative;width:min(600px,100%);aspect-ratio:1.9;margin:auto;overflow:hidden;border-radius:24px;box-shadow:0 10px 32px #063f8314; }
.opening__illustration .opening__banner { width:100%;height:100%;object-fit:cover;object-position:50% 58%;border-radius:0;box-shadow:none; }

.home { gap:28px;align-content:start; }
.home-intro,.home-practice,.home-process { width:min(840px,100%); }
.home h2 { margin:0 0 12px;color:var(--site-ink);font-size:clamp(1.3rem,3vw,1.75rem); }
.home-intro p,.home-practice p { margin:8px 0;line-height:1.65; }
.home-concepts { display:flex;flex-wrap:wrap;gap:12px 28px;list-style:none;padding:0;margin:20px 0 0;font-weight:650; }
.home-concepts span { color:var(--site-blue);margin-right:6px; }
.home-process { border-top:1px solid var(--site-line);padding-top:24px; }
.home-process ol { display:flex;flex-wrap:wrap;gap:12px 20px;list-style:none;margin:0;padding:0; }
.home-process li:not(:last-child)::after { content:'→';margin-left:20px;color:var(--site-blue); }
@media(max-width:560px) { .home { gap:24px; }.home-process ol { display:grid;grid-template-columns:1fr 1fr; }.home-process li:nth-child(2)::after { content:''; } }

/* Marca decorativa no caderno; o arquivo e o enquadramento da imagem permanecem iguais. */
.opening__watermark { position:absolute;left:55%;top:91%;transform:translate(-50%,-50%) rotate(8deg);color:var(--blue-dark);font-size:clamp(.55rem,2.4vw,1rem);font-weight:750;letter-spacing:-.035em;white-space:nowrap;line-height:1;opacity:.32;pointer-events:none;user-select:none; }
