/* Accueil public Spasibapp — identité russe contemporaine. */
.landing-page {
  --h-navy:#172f4d; --h-deep:#10253e; --h-red:#bd2d3a; --h-red-dark:#97232e;
  --h-ice:#b9d5e8; --h-blue:#557a9b; --h-cream:#f5f2ea; --h-paper:#fffdf8;
  --h-ink:#172438; --h-muted:#626d79; --h-line:rgba(23,47,77,.14);
  margin:0; overflow-x:hidden; color:var(--h-ink); background:var(--h-cream);
  font-family:'IBM Plex Sans',system-ui,sans-serif;
}
.landing-page::before { height:4px; background:linear-gradient(90deg,#fff 0 33.333%,var(--h-blue) 33.333% 66.666%,var(--h-red) 66.666%); }
#landing-screen { min-height:100vh; padding:0; color:var(--h-ink); background:var(--h-cream); }
#landing-screen *,#landing-screen *::before,#landing-screen *::after { box-sizing:border-box; }
#landing-screen a { color:inherit; }
#landing-screen ::selection { color:var(--h-paper); background:var(--h-red); }
#landing-screen :focus-visible { outline:3px solid var(--h-ice); outline-offset:4px; }

/* Introduction */
.home-hero-shell {
  position:relative; isolation:isolate; overflow:hidden; width:100%;
  margin:0; color:#fff; border-radius:0;
  background:var(--h-navy);
  box-shadow:none;
}
.home-nav { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; width:min(1200px,calc(100% - 64px)); min-height:82px; margin:0 auto; border-bottom:1px solid rgba(255,255,255,.11); }
.home-brand { display:inline-flex; gap:10px; align-items:center; width:max-content; color:#fff!important; font-family:'Lora',Georgia,serif; font-size:1.35rem; font-weight:600; letter-spacing:-.025em; text-decoration:none; }
.home-brand small { margin-left:3px; padding-left:12px; color:rgba(255,255,255,.42); border-left:1px solid rgba(255,255,255,.18); font-family:'IBM Plex Mono',monospace; font-size:.55rem; font-weight:600; letter-spacing:.16em; }
.home-flag { width:24px; height:16px; flex:0 0 auto; overflow:hidden; border-radius:3px; box-shadow:0 0 0 1px rgba(255,255,255,.18); }
.home-nav-links { display:flex; gap:30px; align-items:center; }
.home-nav-links a { position:relative; color:rgba(255,255,255,.72)!important; font-size:.83rem; font-weight:500; text-decoration:none; transition:color .2s ease; }
.home-nav-links a::after { position:absolute; right:0; bottom:-8px; left:0; height:1px; content:''; background:var(--h-ice); transform:scaleX(0); transition:transform .2s ease; }
.home-nav-links a:hover { color:#fff!important; }
.home-nav-links a:hover::after { transform:scaleX(1); }
.home-login { justify-self:end; }
.home-btn { display:inline-flex; min-height:50px; gap:13px; align-items:center; justify-content:center; padding:0 22px; border:1px solid transparent; border-radius:12px; font-size:.9rem; font-weight:700; line-height:1; text-decoration:none; transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,border-color .2s ease; }
.home-btn:hover { transform:translateY(-2px); }
.home-btn span,.home-btn svg { transition:transform .2s ease; }
.home-btn:hover span,.home-btn:hover svg { transform:translateX(3px); }
.home-btn-light { min-height:43px; padding-inline:18px; color:#fff!important; border-color:rgba(255,255,255,.35); background:transparent; }
.home-btn-light:hover { border-color:#fff; background:rgba(255,255,255,.07); }
.home-btn-primary { color:#fff!important; background:var(--h-red); box-shadow:0 12px 26px rgba(5,17,30,.16); }
.home-btn-primary:hover { background:var(--h-red-dark); box-shadow:0 16px 32px rgba(5,17,30,.2); }
.home-btn-outline { color:#fff!important; border-color:rgba(255,255,255,.25); background:rgba(255,255,255,.045); }
.home-btn-outline:hover { border-color:rgba(255,255,255,.48); background:rgba(255,255,255,.09); }

.home-hero { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(470px,.92fr); gap:clamp(58px,7.5vw,118px); align-items:center; width:min(1200px,calc(100% - 64px)); min-height:625px; margin:0 auto; padding:72px 0 62px; }
.home-hero-copy { position:relative; z-index:1; max-width:660px; }
.home-hero-copy::before { position:absolute; z-index:-1; top:-72px; right:-74px; bottom:-62px; left:-100vw; content:''; border-right:1px solid rgba(23,47,77,.12); background:var(--h-cream); }
.home-eyebrow { display:flex; gap:10px; align-items:center; margin:0 0 20px; color:var(--h-red); font-family:'IBM Plex Mono',monospace; font-size:.75rem; font-weight:600; letter-spacing:.15em; text-transform:uppercase; }
.home-hero h1 { max-width:620px; margin:0; color:var(--h-ink)!important; font-family:'Lora',Georgia,serif; font-size:clamp(2.9rem,4.55vw,4rem); font-weight:500; line-height:1.04; letter-spacing:-.03em; text-wrap:balance; }
.home-hero h1 em { color:var(--h-blue); font-style:italic; font-weight:500; }
.home-lead { max-width:47ch; margin:30px 0 25px; padding-top:23px; color:var(--h-muted)!important; border-top:1px solid var(--h-line); font-size:1.05rem; line-height:1.68; }
.home-level-line { display:grid; grid-template-columns:auto minmax(20px,48px) auto minmax(20px,48px) auto; gap:12px; align-items:center; width:min(100%,480px); margin:0 0 30px; color:var(--h-blue); }
.home-level-line strong { color:var(--h-ink); font-family:'IBM Plex Mono',monospace; font-size:.75rem; font-variant-numeric:tabular-nums; letter-spacing:.08em; }
.home-level-line span { height:1px; background:var(--h-line); }
.home-level-line small { font-size:.72rem; font-weight:600; letter-spacing:.025em; text-align:center; }
.home-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
.home-actions-center { justify-content:center; }
.home-hero-copy .home-btn-outline { color:var(--h-ink)!important; border-color:rgba(23,47,77,.24); background:transparent; }
.home-hero-copy .home-btn-outline:hover { border-color:var(--h-blue); background:var(--h-paper); }
.home-account { margin:16px 0 0; color:var(--h-muted)!important; font-size:.84rem; }
.home-account a { color:var(--h-ink)!important; text-underline-offset:4px; }

.home-lesson-scene { position:relative; display:grid; min-height:425px; align-content:center; justify-items:center; }
.home-session-heading { display:flex; align-items:flex-end; justify-content:space-between; width:min(100%,478px); margin:0 0 17px; color:#fff; }
.home-session-heading>div { display:flex; gap:11px; align-items:baseline; }
.home-session-heading span { color:var(--h-ice); font-family:'PT Serif','Lora',Georgia,serif; font-size:.95rem; }
.home-session-heading strong { font-size:.76rem; font-weight:600; }
.home-session-heading small { display:inline-flex; gap:7px; align-items:center; color:rgba(255,255,255,.58); font-family:'IBM Plex Mono',monospace; font-size:.61rem; text-transform:uppercase; letter-spacing:.09em; }
.home-lesson-layout { display:grid; grid-template-columns:minmax(0,420px) 36px; gap:22px; align-items:stretch; width:min(100%,478px); }
.home-lesson-card { position:relative; z-index:2; width:100%; overflow:hidden; padding:40px 38px 36px; color:var(--h-ink); border-radius:14px; background:var(--h-paper); box-shadow:0 28px 70px rgba(5,17,30,.25); }
.home-lesson-card::before { position:absolute; top:0; right:0; left:0; height:4px; content:''; background:linear-gradient(90deg,#fff 0 33.333%,var(--h-blue) 33.333% 66.666%,var(--h-red) 66.666%); }
.home-card-heading { display:flex; justify-content:space-between; align-items:center; }
.home-card-heading b { display:grid; min-height:31px; padding:0 11px; place-items:center; color:var(--h-paper); border-radius:8px; background:var(--h-navy); font-family:'IBM Plex Sans',system-ui,sans-serif; font-size:.68rem; font-weight:600; }
.home-card-label { color:var(--h-red); font-family:'IBM Plex Mono',monospace; font-size:.69rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.home-russian { margin:28px 0 8px; color:var(--h-ink)!important; font-family:'PT Serif','Lora',Georgia,serif; font-size:1.9rem; line-height:1.22; }
.home-translation { margin:0 0 25px; color:var(--h-muted)!important; font-size:.94rem; }
.home-progress { height:7px; overflow:hidden; border-radius:99px; background:#e6e2d9; }
.home-progress span { display:block; width:64%; height:100%; border-radius:inherit; background:var(--h-red); }
.home-card-footer { display:flex; justify-content:space-between; margin-top:10px; color:var(--h-muted); font-size:.74rem; font-variant-numeric:tabular-nums; }
.home-card-footer b { color:var(--h-red); }
.home-language-mark { display:flex; align-items:center; justify-content:space-between; padding:5px 0 4px; color:rgba(255,255,255,.42); border-left:1px solid rgba(185,213,232,.28); font-family:'IBM Plex Mono',monospace; writing-mode:vertical-rl; transform:rotate(180deg); }
.home-language-mark span { color:var(--h-ice); font-size:.72rem; font-weight:600; letter-spacing:.18em; }
.home-language-mark small { font-size:.52rem; letter-spacing:.13em; }
.home-stats { display:grid; grid-template-columns:repeat(4,1fr); width:100%; margin:0 auto; padding:0 max(32px,calc((100% - 1200px)/2)); border-top:1px solid rgba(255,255,255,.12); background:var(--h-deep); }
.home-stats>div { display:grid; gap:3px; min-height:118px; align-content:center; padding:0 30px; border-left:1px solid rgba(255,255,255,.12); }
.home-stats>div:first-child { padding-left:0; border-left:0; }
.home-stats strong { color:#fff; font-family:'Lora',Georgia,serif; font-size:1.9rem; font-weight:600; font-variant-numeric:tabular-nums; }
.home-stats span { color:rgba(255,255,255,.52); font-size:.78rem; }

/* Sections et aperçu de l'espace privé */
.home-section { width:min(1200px,calc(100% - 48px)); margin:0 auto; padding:clamp(86px,10vw,136px) 0; }
.home-section-heading { max-width:820px; margin-bottom:50px; }
.home-section-heading-split { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(280px,.55fr); gap:70px; align-items:end; max-width:none; }
.home-section h2,.home-final h2 { margin:0; color:var(--h-ink); font-family:'Lora',Georgia,serif; font-size:clamp(2.2rem,4.2vw,3.8rem); font-weight:500; line-height:1.09; letter-spacing:-.04em; text-wrap:balance; }
.home-section-heading>p:last-child,.home-section-heading-split>p { max-width:62ch; margin:24px 0 0; color:var(--h-muted); font-size:1rem; line-height:1.72; }
.home-section-heading-split>p { margin:0 0 6px; }
.home-preview { position:relative; }
.home-preview-grid { display:grid; grid-template-columns:minmax(0,1.34fr) minmax(320px,.66fr); gap:26px; align-items:start; }
.home-browser-card { overflow:hidden; margin:0; border:1px solid var(--h-line); border-radius:22px; background:var(--h-paper); box-shadow:0 28px 65px rgba(23,47,77,.12); }
.home-browser-side { margin-top:84px; }
.home-browser-bar { display:flex; gap:6px; align-items:center; min-height:40px; padding:0 15px; border-bottom:1px solid var(--h-line); background:#fbf9f3; }
.home-browser-bar i { width:7px; height:7px; border-radius:50%; background:#c8d1d8; }
.home-browser-bar i:first-child { background:var(--h-rose); }
.home-browser-bar i:nth-child(2) { background:#d8c28f; }
.home-browser-bar i:nth-child(3) { background:#9db7a6; }
.home-browser-bar span { margin-left:7px; color:var(--h-muted); font-size:.7rem; font-weight:600; letter-spacing:.04em; }
.home-browser-card img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; object-position:top left; background:#ede9e0; }
.home-browser-card figcaption { display:grid; gap:4px; padding:20px 22px 23px; border-top:1px solid var(--h-line); }
.home-browser-card figcaption strong { color:var(--h-ink); font-family:'Lora',Georgia,serif; font-size:1.08rem; }
.home-browser-card figcaption span { color:var(--h-muted); font-size:.82rem; line-height:1.5; }

/* Programme */
.home-programme-wrap { position:relative; overflow:hidden; color:#fff; background:var(--h-navy); }
.home-programme { position:relative; z-index:1; }
.home-programme .home-eyebrow { color:var(--h-ice); }
.home-programme h2 { color:#fff; }
.home-programme .home-section-heading>p:last-child { color:rgba(255,255,255,.61); }
.home-module-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.home-module-card { position:relative; min-height:235px; padding:30px; overflow:hidden; border:1px solid rgba(185,213,232,.18); border-radius:12px; background:#203c5d; box-shadow:inset 0 1px 0 rgba(255,255,255,.035); transition:background-color .25s ease,border-color .25s ease,transform .25s ease; }
.home-module-card:hover { z-index:2; border-color:rgba(185,213,232,.36); background:#294968; transform:translateY(-4px); }
.home-module-number { position:absolute; top:31px; right:30px; color:rgba(255,255,255,.36); font-family:'IBM Plex Mono',monospace; font-size:.72rem; }
.home-module-icon { display:grid; width:46px; height:46px; margin-bottom:35px; place-items:center; color:var(--h-navy); border-radius:14px; background:var(--h-ice); font-family:'Lora',Georgia,serif; font-size:1rem; font-weight:700; }
.home-module-card h3 { margin:0 0 9px; color:#fff; font-family:'Lora',Georgia,serif; font-size:1.25rem; font-weight:600; }
.home-module-card p { max-width:31ch; margin:0; color:rgba(255,255,255,.58); font-size:.85rem; line-height:1.62; }

/* Méthode et appel final */
.home-method { display:grid; grid-template-columns:minmax(0,.78fr) minmax(470px,1.22fr); gap:clamp(60px,10vw,145px); align-items:start; }
.home-method-intro { position:sticky; top:50px; }
.home-method-intro>p:not(.home-eyebrow) { max-width:49ch; margin:26px 0 36px; color:var(--h-muted); line-height:1.72; }
.home-method-note { display:flex; gap:18px; align-items:center; width:fit-content; padding:17px 21px; border:1px solid var(--h-line); border-radius:16px; background:var(--h-paper); box-shadow:0 10px 30px rgba(23,47,77,.07); }
.home-method-note>span { color:var(--h-red); font-family:'Lora',Georgia,serif; font-size:1.9rem; font-weight:600; }
.home-method-note p { margin:0; color:var(--h-muted); font-size:.75rem; line-height:1.4; }
.home-method-note strong { color:var(--h-ink); }
.home-step-list { margin:0; padding:0; list-style:none; }
.home-step { display:grid; grid-template-columns:58px 1fr; gap:24px; padding:30px 0; border-top:1px solid var(--h-line); }
.home-step:last-child { border-bottom:1px solid var(--h-line); }
.home-step>span { display:grid; width:45px; height:45px; place-items:center; color:var(--h-red); border:1px solid rgba(189,45,58,.24); border-radius:50%; background:#f7dfdf; font-family:'IBM Plex Mono',monospace; font-size:.71rem; font-weight:600; }
.home-step h3 { margin:2px 0 8px; color:var(--h-ink); font-family:'Lora',Georgia,serif; font-size:1.25rem; font-weight:600; }
.home-step p { margin:0; color:var(--h-muted); font-size:.9rem; line-height:1.68; }
.home-final { position:relative; isolation:isolate; overflow:hidden; width:min(1200px,calc(100% - 48px)); margin:0 auto 38px; padding:clamp(75px,9vw,112px) 24px; color:#fff; text-align:center; border-radius:28px; background:var(--h-navy); box-shadow:0 25px 65px rgba(23,47,77,.14); }
.home-final .home-eyebrow { justify-content:center; color:var(--h-ice); }
.home-final h2 { color:#fff; }
.home-final>p:not(.home-eyebrow) { margin:24px auto 31px; color:rgba(255,255,255,.62); }
.home-footer { display:grid; grid-template-columns:1fr auto 1fr; gap:24px; align-items:center; width:min(1200px,calc(100% - 48px)); margin:0 auto; padding:24px 0 48px; color:var(--h-muted); font-size:.74rem; }
.home-brand-footer { color:var(--h-ink)!important; font-size:1.15rem; }
.home-footer p { margin:0; text-align:center; }
.home-footer>div { display:flex; gap:18px; justify-self:end; }
.home-footer>div a { color:var(--h-muted)!important; text-underline-offset:3px; }

[data-reveal] { opacity:0; transform:translateY(22px); transition:opacity .65s ease,transform .65s cubic-bezier(.2,.75,.25,1); }
[data-reveal].is-visible { opacity:1; transform:translateY(0); }

@media (max-width:1020px) {
  .home-nav { grid-template-columns:1fr auto; }
  .home-nav-links { display:none; }
  .home-hero { grid-template-columns:minmax(0,.9fr) minmax(390px,1.1fr); gap:42px; }
  .home-hero h1 { font-size:clamp(2.65rem,5vw,3.35rem); }
  .home-hero-copy::before { right:-36px; }
  .home-session-heading,.home-lesson-layout { width:100%; }
  .home-lesson-layout { grid-template-columns:minmax(0,1fr) 32px; gap:16px; }
  .home-lesson-card { padding:34px 30px 31px; }
  .home-preview-grid { grid-template-columns:1fr; }
  .home-browser-side { width:72%; margin:-22px 0 0 auto; }
  .home-method { grid-template-columns:1fr; }
  .home-method-intro { position:static; }
}
@media (max-width:860px) {
  .home-hero { grid-template-columns:1fr; gap:112px; min-height:0; padding-bottom:80px; }
  .home-hero-copy { max-width:760px; }
  .home-hero-copy::before { right:-100vw; bottom:-58px; }
  .home-lesson-scene { width:min(560px,100%); margin:10px auto 0; }
}
@media (max-width:760px) {
  .home-hero-shell { width:100%; margin-top:0; border-radius:0; }
  .home-nav { width:calc(100% - 36px); min-height:68px; }
  .home-brand { font-size:1.25rem; }
  .home-brand small { display:none; }
  .home-login { min-height:39px; padding-inline:14px; font-size:.78rem; }
  .home-hero { width:calc(100% - 36px); gap:88px; padding:54px 0 55px; }
  .home-hero-copy::before { top:-54px; right:-18px; bottom:-42px; left:-18px; }
  .home-hero h1 { font-size:clamp(2.65rem,12.5vw,3.55rem); }
  .home-lead { font-size:.99rem; }
  .home-level-line { grid-template-columns:auto 1fr auto; }
  .home-level-line small,.home-level-line span:nth-of-type(2) { display:none; }
  .home-actions { align-items:stretch; flex-direction:column; }
  .home-actions .home-btn { width:100%; }
  .home-lesson-scene { min-height:390px; }
  .home-session-heading { width:100%; }
  .home-session-heading>div { gap:8px; }
  .home-lesson-layout { grid-template-columns:1fr; width:100%; }
  .home-lesson-card { width:100%; padding:30px 24px 27px; }
  .home-language-mark { display:none; }
  .home-russian { font-size:1.65rem; }
  .home-stats { grid-template-columns:repeat(2,1fr); width:100%; padding:0 18px; }
  .home-stats>div { min-height:98px; padding:0 16px; border-top:1px solid rgba(255,255,255,.12); }
  .home-stats>div:nth-child(odd) { padding-left:0; border-left:0; }
  .home-section { width:calc(100% - 34px); padding:82px 0; }
  .home-section-heading-split { grid-template-columns:1fr; gap:24px; }
  .home-section-heading-split>p { margin:0; }
  .home-section h2,.home-final h2 { font-size:clamp(2.15rem,10vw,2.9rem); }
  .home-browser-card { border-radius:16px; }
  .home-browser-side { width:100%; margin:18px 0 0; }
  .home-module-grid { grid-template-columns:1fr; }
  .home-module-card { min-height:215px; }
  .home-step { grid-template-columns:46px 1fr; gap:15px; }
  .home-final { width:calc(100% - 16px); margin-bottom:30px; padding-inline:22px; border-radius:22px; }
  .home-footer { grid-template-columns:1fr; justify-items:center; text-align:center; }
  .home-footer>div { justify-self:center; flex-wrap:wrap; justify-content:center; }
}
@media (prefers-reduced-motion:reduce) {
  [data-reveal] { opacity:1; transform:none; transition:none; }
  .home-btn,.home-module-card { transition:none; }
}