/* MKT-METHOD-01 — apresentação cinematográfica isolada da prévia do método. */
.method-cinematic,
.student-entry.method-entry {
    --method-bg: #0f1115;
    --method-ink: #edf7f3;
    --method-muted: #b6c8c7;
    --method-accent: #72e1d3;
    --method-panel: #172429;
    --method-line: rgba(237, 247, 243, .18);
    --method-hover: #172429;
    --method-selected: #123e35;
    --method-on-selected: #edf7f3;
    color: var(--method-ink);
    color-scheme: dark;
}

.method-cinematic[data-resolved-theme="light"],
.student-entry.method-entry[data-resolved-theme="light"] {
    --method-bg: #bccac1;
    --method-ink: #14242a;
    --method-muted: #354d46;
    --method-accent: #07564e;
    --method-panel: #d4dfd8;
    --method-line: rgba(20, 36, 42, .22);
    --method-hover: #b8cbc0;
    --method-selected: #123e35;
    --method-on-selected: #edf7f3;
    color-scheme: light;
}

.method-cinematic,
.student-entry.method-entry {
    background: var(--method-bg);
    color: var(--method-ink);
}

.method-cinematic .student-theme,
.student-entry.method-entry .student-theme {
    color: var(--method-ink);
}

.method-cinematic .student-theme button,
.student-entry.method-entry .student-theme button {
    min-height: 44px;
    color: var(--method-ink);
    border-color: var(--method-line);
    background: var(--method-panel);
}

.method-cinematic .student-theme button[aria-pressed="true"],
.student-entry.method-entry .student-theme button[aria-pressed="true"] {
    color: var(--method-on-selected);
    background: var(--method-selected);
}

.method-cinematic .osf-brand,
.student-entry.method-entry .osf-brand,
.method-cinematic .student-entry__brand,
.student-entry.method-entry .student-entry__brand {
    color: var(--method-ink);
}

.method-cinematic .osf-brand a,
.student-entry.method-entry .osf-brand a,
.method-cinematic .student-entry__brand a,
.student-entry.method-entry .student-entry__brand a {
    color: inherit;
}

.method-cinematic :is(.osf-action, a.osf-action),
.student-entry.method-entry :is(.osf-action, a.osf-action) {
    min-height: 44px;
}

.method-cinematic .method-layout,
.student-entry.method-entry .method-layout {
    display: grid;
    width: min(1320px, calc(100% - clamp(2rem, 7vw, 7rem)));
    margin: 0 auto;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: center;
}

.method-cinematic .method-hero,
.student-entry.method-entry .method-hero {
    display: grid;
    min-height: 650px;
}

.method-cinematic .method-intro,
.student-entry.method-entry .method-intro {
    min-width: 0;
    padding: 2rem 0;
}

.method-cinematic .method-eyebrow,
.student-entry.method-entry .method-eyebrow,
.method-cinematic .method-sheet__kicker,
.student-entry.method-entry .method-sheet__kicker {
    color: var(--method-accent);
}

.method-cinematic .method-intro h1,
.student-entry.method-entry .method-intro h1 {
    max-width: 10ch;
    margin: 1rem 0 1.15rem;
    color: var(--method-ink);
    font-family: Inter, system-ui, sans-serif;
    font-size: clamp(48px, 6vw, 84px);
    font-weight: 300;
    letter-spacing: -.075em;
    line-height: .98;
}

.method-cinematic .method-intro h1 .osf-hero-accent,
.student-entry.method-entry .method-intro h1 .osf-hero-accent {
    color: var(--method-accent);
}

.method-cinematic .method-intro__lead,
.student-entry.method-entry .method-intro__lead {
    max-width: 34rem;
    margin: 0;
    color: var(--method-muted);
    font-size: clamp(1rem, 1.25vw, 1.125rem);
    line-height: 1.6;
}

.method-cinematic .method-intro__note,
.student-entry.method-entry .method-intro__note {
    max-width: 32rem;
    margin: 1rem 0 0;
    border-color: var(--method-accent);
    color: var(--method-muted);
    font-size: .93rem;
    line-height: 1.6;
}

.method-cinematic .method-intro__actions,
.student-entry.method-entry .method-intro__actions {
    display: flex;
    margin-top: 1.5rem;
    align-items: center;
    flex-wrap: wrap;
    gap: .75rem 1.25rem;
}

.method-cinematic .method-intro__actions .osf-action,
.student-entry.method-entry .method-intro__actions .osf-action {
    min-height: 44px;
}

.method-cinematic .method-sheet__back,
.student-entry.method-entry .method-sheet__back {
    display: inline-flex;
    min-height: 44px;
    margin: 0;
    padding: 0 .25rem;
    align-items: center;
    color: var(--method-accent);
    font-size: .88rem;
    font-weight: 750;
    text-decoration: none;
}

.method-cinematic .method-portrait,
.student-entry.method-entry .method-portrait {
    min-width: 0;
    margin: 0;
}

.method-cinematic .method-portrait picture,
.student-entry.method-entry .method-portrait picture {
    display: block;
    height: 500px;
    overflow: hidden;
    background: var(--method-panel);
}

.method-cinematic .method-portrait img,
.student-entry.method-entry .method-portrait img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

.method-cinematic .method-portrait figcaption,
.student-entry.method-entry .method-portrait figcaption {
    margin-top: .7rem;
    color: var(--method-muted);
    font-size: .75rem;
    line-height: 1.45;
}

.method-cinematic .method-sheet,
.student-entry.method-entry .method-sheet {
    width: min(1320px, calc(100% - clamp(2rem, 7vw, 7rem)));
    min-width: 0;
    margin: 0 auto;
    padding: clamp(2rem, 4vw, 3.5rem) 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.method-cinematic .method-sheet__header h2,
.student-entry.method-entry .method-sheet__header h2 {
    max-width: 20ch;
    margin: .8rem 0 .75rem;
    color: var(--method-ink);
    font-size: clamp(2.2rem, 4.5vw, 4rem);
    font-weight: 300;
    letter-spacing: -.065em;
    line-height: 1.02;
}

.method-cinematic .method-sheet__header > p:not(.method-sheet__kicker),
.student-entry.method-entry .method-sheet__header > p:not(.method-sheet__kicker) {
    max-width: 42rem;
    color: var(--method-muted);
    font-size: 1rem;
    line-height: 1.6;
}

.method-cinematic .method-steps,
.student-entry.method-entry .method-steps {
    display: grid;
    margin: 2rem 0 0;
    padding: 0;
    border: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    list-style: none;
}

.method-cinematic .method-steps > li,
.student-entry.method-entry .method-steps > li {
    display: block;
    min-width: 0;
    padding: 24px;
    border: 1px solid var(--method-line);
    border-radius: 12px;
    background: var(--method-panel);
}

.method-cinematic .method-step__number,
.student-entry.method-entry .method-step__number {
    display: block;
    margin-bottom: 1rem;
    color: var(--method-accent);
    font-size: 2rem;
    font-weight: 350;
    letter-spacing: -.05em;
    line-height: 1;
}

.method-cinematic .method-steps h3,
.student-entry.method-entry .method-steps h3 {
    margin: 0;
    color: var(--method-ink);
    font-size: 1.18rem;
    line-height: 1.3;
}

.method-cinematic .method-steps p,
.student-entry.method-entry .method-steps p {
    margin: .6rem 0 0;
    color: var(--method-muted);
    font-size: .92rem;
    line-height: 1.6;
}

.method-cinematic .method-steps details {
    margin-top: 1rem;
    border-top: 1px solid var(--method-line);
}

.method-cinematic .method-steps details summary,
.student-entry.method-entry .method-steps details summary {
    display: flex;
    min-height: 44px;
    padding: .6rem 0;
    align-items: center;
    color: var(--method-accent);
    cursor: pointer;
    font-size: .88rem;
    font-weight: 750;
    line-height: 1.4;
}

.method-cinematic .method-steps details[open],
.student-entry.method-entry .method-steps details[open] {
    border-color: var(--method-accent);
}

.method-cinematic .method-steps details > p,
.student-entry.method-entry .method-steps details > p {
    padding-bottom: .25rem;
}

@media (prefers-reduced-motion: no-preference) {
    .method-cinematic .method-steps details[open] > p,
    .student-entry.method-entry .method-steps details[open] > p {
        animation: method-cinematic-detail-in 300ms ease-out both;
    }
}

@keyframes method-cinematic-detail-in {
    from { transform: translateY(6px); }
    to { transform: translateY(0); }
}

.method-cinematic .method-sheet__clarity,
.student-entry.method-entry .method-sheet__clarity {
    display: grid;
    margin-top: 1.5rem;
    padding: 1.25rem 1.5rem;
    border: 1px solid var(--method-line);
    border-left: 3px solid var(--method-accent);
    background: var(--method-panel);
    gap: .45rem;
}

.method-cinematic .method-sheet__clarity span,
.student-entry.method-entry .method-sheet__clarity span {
    color: var(--method-accent);
}

.method-cinematic .method-sheet__clarity strong,
.student-entry.method-entry .method-sheet__clarity strong {
    color: var(--method-ink);
    font-size: 1rem;
    line-height: 1.5;
}

.method-cinematic .method-sheet__clarity p,
.student-entry.method-entry .method-sheet__clarity p {
    margin: 0;
    color: var(--method-muted);
    font-size: .9rem;
    line-height: 1.55;
}

.method-cinematic .method-principles,
.student-entry.method-entry .method-principles {
    width: min(1320px, calc(100% - clamp(2rem, 7vw, 7rem)));
    margin: 0 auto;
    padding: 3.5rem 0 4rem;
    border-top: 1px solid var(--method-line);
}

.method-cinematic .method-principles h2,
.student-entry.method-entry .method-principles h2 {
    max-width: 20ch;
    margin: .75rem 0 0;
    color: var(--method-ink);
    font-size: clamp(2.1rem, 4vw, 3.8rem);
    font-weight: 300;
    letter-spacing: -.065em;
    line-height: 1.03;
}

.method-cinematic .method-principles__grid,
.student-entry.method-entry .method-principles__grid {
    display: grid;
    margin-top: 2rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.method-cinematic .method-principles article,
.student-entry.method-entry .method-principles article {
    min-width: 0;
    padding: 1.25rem;
    border: 1px solid var(--method-line);
    border-radius: 12px;
    background: var(--method-panel);
}

.method-cinematic .method-principles article > span,
.student-entry.method-entry .method-principles article > span {
    color: var(--method-accent);
}

.method-cinematic .method-principles h3,
.student-entry.method-entry .method-principles h3 {
    margin: .8rem 0 .45rem;
    color: var(--method-ink);
    font-size: 1.08rem;
}

.method-cinematic .method-principles p,
.student-entry.method-entry .method-principles p {
    max-width: 34rem;
    margin: 0;
    color: var(--method-muted);
    font-size: .9rem;
    line-height: 1.6;
}

.method-cinematic .method-invitation,
.student-entry.method-entry .method-invitation {
    display: grid;
    width: min(1320px, calc(100% - clamp(2rem, 7vw, 7rem)));
    margin: 0 auto;
    padding: 2rem 0 3.5rem;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.5rem 2rem;
}

.method-cinematic .method-invitation .osf-availability-note,
.student-entry.method-entry .method-invitation .osf-availability-note {
    margin: 0;
    color: var(--method-muted);
}

.method-cinematic .method-invitation .osf-action,
.student-entry.method-entry .method-invitation .osf-action {
    min-height: 44px;
}

.method-cinematic .method-footer,
.student-entry.method-entry .method-footer {
    display: flex;
    width: min(1320px, calc(100% - clamp(2rem, 7vw, 7rem)));
    margin: 0 auto;
    padding: 1rem 0 2rem;
    border-top: 1px solid var(--method-line);
    color: var(--method-muted);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .12em;
    justify-content: space-between;
}

.method-cinematic .method-footer a,
.student-entry.method-entry .method-footer a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    color: inherit;
}

.method-cinematic :focus-visible,
.student-entry.method-entry :focus-visible {
    outline: 3px solid var(--method-accent);
    outline-offset: 4px;
}

@media (max-width: 980px) {
    .method-cinematic .method-layout,
    .student-entry.method-entry .method-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
    }

    .method-cinematic .method-intro,
    .student-entry.method-entry .method-intro {
        padding: 2rem 0 0;
    }

    .method-cinematic .method-portrait,
    .student-entry.method-entry .method-portrait {
        grid-row: 2;
    }

    .method-cinematic .method-portrait picture,
    .student-entry.method-entry .method-portrait picture {
        width: 100%;
        max-width: 100%;
        height: 260px;
    }

    .method-cinematic .method-sheet,
    .student-entry.method-entry .method-sheet {
        padding: 2.5rem 0;
    }

    .method-cinematic .method-steps,
    .student-entry.method-entry .method-steps {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .method-cinematic .method-layout,
    .method-cinematic .method-sheet,
    .method-cinematic .method-principles,
    .method-cinematic .method-invitation,
    .method-cinematic .method-footer,
    .student-entry.method-entry .method-layout,
    .student-entry.method-entry .method-sheet,
    .student-entry.method-entry .method-principles,
    .student-entry.method-entry .method-invitation,
    .student-entry.method-entry .method-footer {
        width: calc(100% - 2rem);
    }

    .method-cinematic .method-intro h1,
    .student-entry.method-entry .method-intro h1 {
        font-size: clamp(48px, 13vw, 66px);
    }

    .method-cinematic .method-steps > li,
    .student-entry.method-entry .method-steps > li {
        padding: 1.25rem;
    }

    .method-cinematic .method-principles__grid,
    .student-entry.method-entry .method-principles__grid,
    .method-cinematic .method-invitation,
    .student-entry.method-entry .method-invitation {
        grid-template-columns: minmax(0, 1fr);
    }

    .method-cinematic .method-invitation .osf-action,
    .student-entry.method-entry .method-invitation .osf-action {
        width: 100%;
    }

    .method-cinematic .method-footer,
    .student-entry.method-entry .method-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: .25rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .method-cinematic *,
    .method-cinematic *::before,
    .method-cinematic *::after,
    .student-entry.method-entry *,
    .student-entry.method-entry *::before,
    .student-entry.method-entry *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}

.method-cinematic .student-brand { color: var(--method-ink); }
.method-cinematic :is(.student-brand__promise,.student-stage) { color: var(--method-muted); }
.method-cinematic .student-stage__number { color: var(--method-accent); }
.method-cinematic .student-theme { background: var(--method-hover); border-color: var(--method-line); }
.method-cinematic .student-theme button { min-width:44px; height:44px; }
.method-cinematic .osf-action--primary { background:var(--method-selected); color:var(--method-on-selected); border-color:var(--method-selected); }
.method-cinematic .method-cycle { color:var(--method-accent); font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; margin-top:1.5rem; }
.method-cinematic .osf-availability-note { background:transparent; border-color:var(--method-accent); }
.method-cinematic .osf-availability-note p { color:var(--method-muted); }
.method-cinematic .osf-availability-note__label { color:var(--method-accent); }
.method-cinematic .method-steps summary { justify-content:space-between; gap:.75rem; }
.method-cinematic .method-steps summary::after { content:'+'; font-size:1.4rem; }
.method-cinematic .method-steps details[open] summary::after { content:'−'; }
.method-cinematic .method-steps details[open] summary { color:var(--method-ink); }
.method-cinematic #method-journey { scroll-margin-top:1.5rem; }
@media(max-width:980px) { .method-cinematic .method-hero { min-height:0; } .method-cinematic .method-principles__grid { grid-template-columns:minmax(0,1fr); } }
@media(prefers-color-scheme:light) { .method-cinematic:not([data-resolved-theme]) { --method-bg:#bccac1; --method-ink:#14242a; --method-muted:#354d46; --method-accent:#07564e; --method-panel:#d4dfd8; --method-line:rgba(20,36,42,.22); --method-hover:#b8cbc0; color-scheme:light; } }

/* Cena aprovada com dois participantes: preservar o enquadramento completo. */
.method-cinematic .method-portrait picture {
    height: auto;
    aspect-ratio: 3 / 2;
}
.method-cinematic .method-portrait img {
    height: auto;
    aspect-ratio: 3 / 2;
    object-fit: contain;
}