:root{
  --ink:#17183B;
  --muted:#5D5F86;
  --paper:#FFFFFF;
  --mist:#F3F2FF;
  --violet:#4B2EFF;
  --violet-deep:#2C1A9E;
  --buy:#FFD43B;
  --pink:#FF3D8B;
  --mint:#12C796;
  --sky:#3FB6FF;
  --line:#E4E3F5;
  --masc:#E2F2FF; --fem:#FFE6F0; --neut:#DDF6EC; --plur:#ECE9FF;
  --display:"Unbounded","Arial Black",system-ui,sans-serif;
  --body:"Manrope","Segoe UI",system-ui,-apple-system,sans-serif;
  color-scheme:light;
  box-sizing:border-box;
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:120px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--violet-deep)}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--sky);outline-offset:3px;border-radius:6px}
.wrap{width:100%;max-width:1120px;margin:0 auto;padding:0 22px}
.narrow{max-width:860px}
h1,h2,h3{font-family:var(--display);line-height:1.1;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(26px,5.6vw,40px);font-weight:700}
h3{font-size:20px;font-weight:700}
.lead{color:var(--muted);font-size:18px;max-width:52ch;margin:12px 0 0}
.ru{font-family:var(--display);font-weight:500}
.sec{padding:72px 0}
.sec.tint{background:var(--mist)}

/* Buttons: yellow is only for buying */
.buy{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 26px;
  border:2.5px solid var(--ink);border-radius:999px;background:var(--buy);color:var(--ink);font-weight:800;font-size:17px;
  text-decoration:none;box-shadow:4px 4px 0 var(--ink);transition:transform .12s,box-shadow .12s}
.buy:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border-radius:999px;
  background:var(--violet);color:#fff;font-weight:800;text-decoration:none;border:2.5px solid var(--violet)}
.btn:hover{background:var(--violet-deep);border-color:var(--violet-deep)}
.btn.light{background:#fff;color:var(--ink);border-color:#fff}
.btn.line{background:transparent;color:var(--ink);border-color:var(--ink)}
.soon{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;font-size:14px;font-weight:800;color:var(--ink);
  background:var(--buy);border-radius:999px;padding:5px 12px}
.soon.quiet{background:var(--mist)}
.btn[aria-disabled="true"]{align-self:flex-start;background:var(--line);border-color:var(--line);color:var(--muted);cursor:not-allowed}

/* Header */
.top{position:sticky;top:0;z-index:30;background:var(--violet);color:#fff;padding-top:env(safe-area-inset-top,0px)}
.top .bar{display:flex;align-items:center;justify-content:space-between;gap:16px;height:60px}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:15px;text-decoration:none;color:#fff}
.logo b{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#fff;color:var(--violet);font-size:15px}
.top nav{display:flex;gap:4px 22px;font-weight:700;font-size:15px;overflow-x:auto;padding:0 22px 12px;margin:0 auto;max-width:1120px;scrollbar-width:none}
.top nav::-webkit-scrollbar{display:none}
.top nav a{color:#fff;text-decoration:none;opacity:.82;white-space:nowrap;padding:6px 0}
.top nav a:hover,.top nav a[aria-current="page"]{opacity:1;text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
.top .login{color:#fff;font-weight:700;font-size:14px;text-decoration:none;opacity:.85;white-space:nowrap}
.top .desk{display:none}

/* Hero */
.hero{background:var(--violet);color:#fff;padding:36px 0 96px;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;inset:auto -10% -1px -10%;height:60px;background:var(--paper);border-radius:50% 50% 0 0/100% 100% 0 0}
.hero .wrap{position:relative;z-index:1}
.hero h1{font-size:clamp(36px,9vw,68px);font-weight:800;max-width:13ch}
.hero .lead{color:rgba(255,255,255,.86);max-width:44ch}
.doors{display:grid;gap:14px;margin-top:36px}
.door{display:block;text-decoration:none;color:var(--ink);background:#fff;border-radius:24px;padding:24px 26px;border:2.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.door:hover{transform:translate(-1px,-1px)}
.door .ru{display:block;font-size:15px;color:var(--violet);margin-bottom:6px}
.door strong{display:block;font-family:var(--display);font-size:24px;line-height:1.15;margin-bottom:6px}
.door span.d{color:var(--muted)}
.door.dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.door.dark .ru{color:var(--buy)}
.door.dark span.d{color:#C9CAE6}

/* Page heading for inner pages */
.phead{background:var(--violet);color:#fff;padding:28px 0 84px;position:relative;overflow:hidden}
.phead::after{content:"";position:absolute;inset:auto -10% -1px -10%;height:50px;background:var(--paper);border-radius:50% 50% 0 0/100% 100% 0 0}
.phead .wrap{position:relative;z-index:1}
.phead h1{font-size:clamp(32px,7vw,54px);font-weight:800}
.phead .lead{color:rgba(255,255,255,.86)}
.crumbs{font-size:14px;margin-bottom:22px;color:rgba(255,255,255,.8)}
.crumbs a{color:#fff}

/* Generic grid of tiles */
.tiles{display:grid;gap:16px;margin-top:28px}
.tile{display:flex;flex-direction:column;gap:10px;background:#fff;border:2px solid var(--line);border-radius:22px;padding:24px;text-decoration:none;color:var(--ink)}
a.tile:hover{border-color:var(--violet)}
.tile h3{font-size:21px}
.tile p{margin:0;color:var(--muted)}
.tile .go{margin-top:auto;font-weight:800;color:var(--violet)}
.tile.off{background:var(--mist);border-style:dashed}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:12px;background:var(--mist);font-weight:700;font-size:15px;text-decoration:none;color:var(--ink)}
a.chip{background:var(--violet);color:#fff}
.chip small{font-weight:600;color:var(--muted);margin-left:6px}

/* Slang block */
.slangbox{margin-top:28px;background:var(--buy);border:2.5px solid var(--ink);border-radius:26px;padding:28px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}
.slangbox h3{font-size:clamp(22px,4.6vw,30px);max-width:18ch}
.slangbox p{margin:6px 0 0;font-weight:700}
.slangbox .btn{background:var(--ink);border-color:var(--ink)}

/* Products */
.plans{display:grid;gap:16px;margin-top:28px}
.plan{display:flex;flex-direction:column;gap:10px;border:2px solid var(--line);border-radius:22px;padding:26px;background:#fff}
.plan.best{border:2.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.plan .price{font-family:var(--display);font-size:30px;font-weight:700}
.plan ul{margin:0;padding-left:20px;color:var(--muted);flex-grow:1}
.plan.off{background:var(--mist);border-style:dashed}

/* About */
.about{display:flex;flex-wrap:wrap;gap:28px;align-items:center}
.about img{width:150px;height:150px;border-radius:50%;object-fit:cover;border:3px solid var(--ink)}
.about div{flex:1 1 380px}
.about p{margin:10px 0 0;color:var(--muted);max-width:60ch}

/* Grammar page */
.toc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 40px}
.toc a{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border-radius:999px;border:2px solid var(--line);text-decoration:none;color:var(--ink);font-weight:700;font-size:15px}
.toc a:hover{border-color:var(--violet)}
.casenav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px}
.casenav span,.casenav a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:12px;font-weight:700;font-size:15px;text-decoration:none}
.casenav a{background:#fff;color:var(--violet)}
.casenav span{background:rgba(255,255,255,.14);color:rgba(255,255,255,.75)}
.casenav span.on{background:#fff;color:var(--ink)}
.block{margin:0 0 64px}
.block > h2{margin-bottom:10px}
.example{font-size:19px;margin:0 0 24px}
.example .en{color:var(--muted)}
.uses{display:grid;gap:10px}
.use{display:grid;gap:4px 20px;background:var(--mist);border-radius:18px;padding:16px 20px}
.use b{font-weight:800}
.use .ru{font-size:19px}
.use .en{color:var(--muted);font-size:15px}
.legend{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px;margin:0 0 28px}
.legend span{display:inline-flex;align-items:center;gap:8px}
.legend i{width:16px;height:16px;border-radius:5px;border:1.5px solid rgba(23,24,59,.25)}
.tbl{overflow-x:auto;border:2px solid var(--line);border-radius:18px;margin:0 0 14px}
table{width:100%;min-width:600px;border-collapse:collapse;font-size:16px}
th{text-align:left;padding:12px 16px;background:#fff;font-size:13px;font-weight:800;color:var(--muted);border-bottom:2px solid var(--line)}
td{padding:11px 16px;border-top:1px solid var(--line);vertical-align:top}
td.r{color:var(--muted);font-size:14px}
td.tr{color:var(--muted)}
td em{font-style:normal;font-weight:800;color:var(--violet-deep)}
tr.g td{font-weight:800;font-size:14px;padding:9px 16px;border-top:2px solid var(--line)}
tr.m td,th.m{background:var(--masc)} tr.f td,th.f{background:var(--fem)} tr.n td{background:var(--neut)} tr.p td,th.p{background:var(--plur)}
th.m,th.f,th.p{color:var(--ink)}
h3.sub{font-family:var(--body);font-size:20px;font-weight:800;margin:28px 0 12px}
.note{background:var(--mist);border-radius:16px;padding:16px 20px;margin:0 0 12px}
.irr{display:grid;gap:6px 24px;margin-top:10px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.irr .en{color:var(--muted)}
.soonbox{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between;border:2.5px dashed var(--violet);border-radius:22px;padding:24px 26px;margin:0 0 20px}
.soonbox h3{font-size:22px;margin:8px 0 6px}
.soonbox p{margin:0;color:var(--muted);max-width:52ch}

/* Quiz */
.quiz{display:grid;gap:14px}
.q{border:2px solid var(--line);border-radius:18px;padding:18px 20px;margin:0}
.q legend{padding:0 6px;font-size:14px;font-weight:700;color:var(--muted)}
.q .qt{font-size:20px;margin:0 0 2px}
.q .qe{color:var(--muted);font-size:15px;margin:0 0 12px}
.opts{display:flex;flex-wrap:wrap;gap:10px}
.opts button{min-height:46px;padding:0 18px;border-radius:12px;border:2px solid var(--line);background:#fff;font-weight:700;font-size:17px}
.opts button:hover:not(:disabled){border-color:var(--violet)}
.opts button.right{background:#D7F7EA;border-color:var(--mint)}
.opts button.wrong{background:#FFE1EC;border-color:var(--pink)}
.opts button:disabled{cursor:default}
.q .fb{margin:10px 0 0;font-weight:700;min-height:1.2em}
.score{margin-top:16px;font-family:var(--display);font-size:22px}

/* Footer */
footer{background:var(--violet-deep);color:rgba(255,255,255,.8);font-size:14px;padding:28px 0 40px}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between}
footer a{color:#fff}
footer nav{display:flex;flex-wrap:wrap;gap:8px 18px}

/* Cookie consent (same as the rest of the site) */
.consent{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:70;max-width:520px;margin:0 auto;
  background:var(--ink);color:#fff;border-radius:20px;padding:18px 20px;display:none;gap:14px;box-shadow:0 20px 50px rgba(0,0,0,.3);font-size:14px;line-height:1.45}
.consent.show{display:grid}
.consent p{margin:0}
.consent .row{display:flex;gap:10px}
.consent button{flex:1;min-height:44px;border-radius:999px;font-weight:800;font-size:14px;border:2px solid #fff}
.consent .ok{background:#fff;color:var(--ink)}
.consent .no{background:transparent;color:#fff}

@media (min-width:760px){
  .doors{grid-template-columns:1fr 1fr}
  .tiles,.plans{grid-template-columns:repeat(3,1fr)}
  .tiles.two{grid-template-columns:1fr 1fr}
  .use{grid-template-columns:minmax(200px,1fr) 2fr;align-items:center}
}
@media (min-width:900px){
  html{scroll-padding-top:80px}
  .sec{padding:96px 0}
  .top nav{padding:0;margin:0;overflow:visible}
  .top .mob{display:none}
  .top .desk{display:flex}
  .hero{padding:64px 0 130px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media (min-width:760px){.plans.four{grid-template-columns:1fr 1fr}}
@media (min-width:1040px){.plans.four{grid-template-columns:repeat(4,1fr)}}

/* Textbook vs real flip cards (moved from /slang/) */
.flip-row{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:34px 22px 12px;margin:0 -22px;scrollbar-width:none}
.flip-row::-webkit-scrollbar{display:none}
.flip{flex:0 0 78%;max-width:300px;scroll-snap-align:center;min-height:210px;border:2px solid var(--line);border-radius:28px;background:#fff;
  padding:22px;text-align:left;display:flex;flex-direction:column;justify-content:space-between;transition:background .25s,border-color .25s}
.flip .lbl{font-size:13px;font-weight:700;color:var(--muted)}
.flip .ph{font-family:var(--display);font-weight:500;font-size:22px;line-height:1.25;margin:14px 0}
.flip .en{font-size:14px;color:var(--muted)}
.flip .hint{font-size:13px;font-weight:800;color:var(--violet)}
.flip[aria-pressed="true"]{background:var(--mint);border-color:var(--mint)}
.flip[aria-pressed="true"] .lbl,.flip[aria-pressed="true"] .en,.flip[aria-pressed="true"] .hint{color:var(--ink)}
.flip[aria-pressed="true"] .ph{font-weight:700;font-size:26px}
.swipe-note{font-size:14px;color:var(--muted);margin:8px 0 0}
@media (min-width:900px){
  .flip-row{margin:0;padding-left:0;padding-right:0;overflow:visible;flex-wrap:wrap}
  .flip{flex:1 1 30%;max-width:none}
  .swipe-note{display:none}
}

/* ===== Universal site header (same on every page) ===== */
.sh{line-height:1.5;position:sticky;top:0;z-index:40;background:#4B2EFF;color:#fff;padding-top:env(safe-area-inset-top,0px);font-family:"Manrope","Segoe UI",system-ui,-apple-system,sans-serif}
.sh-bar{box-sizing:border-box;width:100%;max-width:1120px;margin:0 auto;padding:0 22px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;column-gap:28px}
.sh-logo{order:1;height:60px;display:flex;align-items:center;gap:10px;font-family:"Unbounded","Arial Black",system-ui,sans-serif;font-weight:700;font-size:15px;color:#fff;text-decoration:none}
.sh-logo b{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#fff;color:#4B2EFF;font-size:15px}
.sh-shop{order:2;display:inline-flex;align-items:center;min-height:40px;padding:0 18px;border:2px solid #17183B;border-radius:999px;background:#FFD43B;color:#17183B;font-weight:800;font-size:15px;text-decoration:none;box-shadow:3px 3px 0 #17183B}
.sh-shop:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 #17183B}
.sh-nav{order:3;flex:1 0 100%;display:flex;gap:22px;overflow-x:auto;padding:0 0 12px;scrollbar-width:none;font-weight:700;font-size:15px}
.sh-nav::-webkit-scrollbar{display:none}
.sh-nav a{color:#fff;opacity:.85;text-decoration:none;white-space:nowrap;padding:6px 0}
.sh-nav a:hover,.sh-nav a[aria-current="page"]{opacity:1;text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:2px}
html{scroll-padding-top:112px}
@media (min-width:900px){
  .sh-nav{order:2;flex:0 1 auto;margin-left:auto;padding:0;overflow:visible;gap:26px}
  .sh-shop{order:3}
  html{scroll-padding-top:76px}
}
.about p.mission{color:var(--ink);font-weight:700;font-size:19px}
.wip{margin-top:22px;background:var(--mist);border-radius:20px;padding:20px 22px;max-width:62ch}
.wip-tag{display:inline-block;background:var(--buy);color:var(--ink);font-weight:800;font-size:13px;border-radius:999px;padding:4px 12px}
.about .wip p{color:var(--ink);margin:12px 0 0}
.about .wip p.sign{font-family:var(--display);font-weight:700;margin-top:10px}
.about p.next{margin-top:28px;color:var(--ink);font-weight:800;font-size:19px;display:flex;align-items:center;gap:10px}
.about p.next::after{content:"";width:12px;height:12px;border-right:3px solid var(--violet);border-bottom:3px solid var(--violet);transform:rotate(45deg) translateY(-3px)}
#about + #grammar{padding-top:40px}
#about .about{align-items:flex-start}
.about p.soc-intro{margin-top:28px;color:var(--ink);font-weight:800;font-size:19px}
.soc{display:grid;gap:14px;margin-top:14px;max-width:760px}
.soc-card{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--ink);background:#fff;border:2px solid var(--line);border-radius:20px;padding:20px 22px}
.soc-card:hover{border-color:var(--violet)}
.soc-ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;margin-bottom:6px}
.soc-card.tg .soc-ic{background:#2F9BE0}
.soc-card.ig .soc-ic{background:#FF3D8B}
.soc-name{font-family:var(--display);font-weight:700;font-size:19px}
.soc-h{color:var(--muted);font-weight:700;font-size:15px}
.soc-d{font-size:16px;line-height:1.5}
.soc-go{margin-top:6px;font-weight:800;color:var(--violet)}
@media (min-width:760px){.soc{grid-template-columns:1fr 1fr}}
#follow .soc{margin-top:28px;max-width:none}

/* Site map tree on the homepage */
#map{padding-top:24px}
.tree{margin-top:36px}
.root{display:table;margin:0 auto;background:var(--violet);color:#fff;font-family:var(--display);font-weight:700;font-size:16px;border-radius:999px;padding:12px 22px;position:relative}
.branches{display:grid;gap:28px;margin-top:28px;position:relative}
.br{position:relative}
.bh{display:block;text-decoration:none;color:var(--ink);background:#fff;border:2.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);border-radius:20px;padding:16px 20px;font-family:var(--display);font-weight:700;font-size:22px}
.bh .ru{display:block;font-size:14px;color:var(--violet);margin-bottom:4px}
.bh.dark{background:var(--ink);color:#fff}
.bh.dark .ru{color:var(--buy)}
.br ul{list-style:none;margin:0 0 0 22px;padding:14px 0 0 0;border-left:2.5px solid var(--line);display:grid;gap:10px}
.br li{position:relative;padding-left:22px}
.br li::before{content:"";position:absolute;left:0;top:28px;width:16px;border-top:2.5px solid var(--line)}
.leaf{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--mist);border-radius:16px;padding:12px 16px;text-decoration:none;color:var(--ink)}
a.leaf:hover{outline:2px solid var(--violet)}
.leaf.off{background:#F7F7FB;color:var(--muted)}
.ln{font-weight:800;font-size:16px}
.ls{display:block;font-weight:500;font-size:14px;color:var(--muted);margin-top:2px}
.lt{flex:none;font-size:12px;font-weight:800;border-radius:999px;padding:4px 10px;white-space:nowrap}
.lt.free{background:#D8F7EC;color:#0B6B4A}
.lt.paid{background:var(--buy);color:var(--ink)}
.lt.soon{background:#E6E6F0;color:var(--muted)}
#map p.next{margin-top:40px;font-weight:800;font-size:19px;display:flex;align-items:center;gap:10px}
#map p.next::after{content:"";width:12px;height:12px;border-right:3px solid var(--violet);border-bottom:3px solid var(--violet);transform:rotate(45deg) translateY(-3px)}
#map + #grammar{padding-top:32px}
#about + #grammar{padding-top:96px}
@media (min-width:760px){
  .branches{grid-template-columns:1fr 1fr;gap:28px}
  .root::after{content:"";position:absolute;left:50%;top:100%;height:14px;border-left:2.5px solid var(--line)}
  .branches::before{content:"";position:absolute;top:-14px;left:25%;right:25%;border-top:2.5px solid var(--line)}
  .br::before{content:"";position:absolute;top:-14px;left:50%;height:14px;border-left:2.5px solid var(--line)}
}

/* Homepage v2 */
.h2-grid{display:grid;gap:36px;align-items:center}
.h2-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:28px}
.h2-link{color:#fff;font-weight:700;text-underline-offset:5px}
.h2-photo{position:relative;justify-self:center}
.h2-photo img{width:260px;height:260px;border-radius:50%;object-fit:cover;border:4px solid #fff}
.h2-hi{position:absolute;left:-10px;top:18px;background:var(--buy);color:var(--ink);font-family:var(--display);font-weight:700;font-size:18px;padding:8px 14px;border-radius:14px 14px 14px 4px;border:2px solid var(--ink)}
.goals{display:grid;gap:16px;margin-top:28px}
.goal{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--ink);background:#fff;border:2.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);border-radius:24px;padding:26px}
.goal:hover{transform:translate(-1px,-1px)}
.g-ru{font-weight:800;font-size:14px;color:var(--violet)}
.goal h3{font-size:24px;line-height:1.15}
.goal p{margin:0;color:var(--muted)}
.goal ul{list-style:none;margin:6px 0 8px;padding:0;display:grid;gap:10px}
.goal li{display:flex;align-items:center;gap:10px;font-weight:700}
.goal li span:first-of-type{flex:1}
.goal .dash{width:18px;height:2.5px;background:var(--line);flex:none}
.goal .lt{flex:none;font-size:12px;font-weight:800;border-radius:999px;padding:4px 10px}
.goal .lt.free{background:#D8F7EC;color:#0B6B4A}
.goal .lt.soon{background:#E6E6F0;color:var(--muted)}
.g-go{margin-top:auto;font-weight:800;color:var(--violet)}
.note2{max-width:720px;margin:0 auto;background:#fff;border-radius:24px;padding:30px 32px}
.note2 p{margin:14px 0 0;font-size:18px;line-height:1.6}
.note2 .sign{font-family:var(--display);font-weight:700}
@media (min-width:760px){.goals{grid-template-columns:1fr 1fr}}
@media (min-width:900px){.h2-grid{grid-template-columns:1.3fr .7fr}.h2-photo img{width:300px;height:300px}}
.hero.h2 .lead{font-size:clamp(20px,2.3vw,25px);line-height:1.5;max-width:30em}

/* Homepage v3 */
.h3-grid{display:grid;gap:40px;align-items:center}
.h3-swap{display:grid;gap:8px;margin:24px 0 0;max-width:440px}
.h3-swap span{font-family:var(--display);font-weight:500;font-size:18px;padding:12px 16px;border-radius:14px}
.h3-swap .old{background:rgba(255,255,255,.14);color:rgba(255,255,255,.75);text-decoration:line-through;text-decoration-thickness:2px}
.h3-swap .new{background:#fff;color:var(--ink);font-weight:700}
.hero.h3 .lead{font-size:clamp(19px,2.1vw,23px);line-height:1.5;max-width:30em}
.h3-stage{position:relative;justify-self:center;width:300px;height:330px}
.h3-stage img{width:250px;height:250px;border-radius:50%;object-fit:cover;border:4px solid #fff;position:absolute;left:25px;top:30px}
.stk3{position:absolute;display:inline-flex;align-items:baseline;gap:8px;background:#fff;color:var(--muted);font-size:13px;font-weight:700;padding:9px 14px;border-radius:14px;box-shadow:0 12px 26px rgba(0,0,0,.22);white-space:nowrap}
.stk3 b{font-family:var(--display);color:var(--ink);font-size:17px}
.stk3.s1{left:-30px;top:20px;transform:rotate(-5deg)}
.stk3.s2{right:-40px;top:130px;transform:rotate(4deg)}
.stk3.s3{left:-10px;bottom:4px;transform:rotate(-2deg);background:var(--buy)}
.pv-card{position:relative;background:#fff;border:1px solid #E7E9F2;border-left:5px solid #2F4BFF;border-radius:16px;padding:14px 16px;display:grid;gap:2px}
.pv-tag{position:absolute;top:14px;right:14px;font-size:11px;font-weight:800;color:#fff;background:#2F4BFF;border-radius:999px;padding:3px 9px}
.pv-w{font-family:var(--display);font-size:24px}
.pv-w .st{color:#FF3D6E}
.pv-tr{color:#2F4BFF;font-size:14px}
.pv-m{font-weight:800}
.pv-tbl{border:1px solid #E7E9F2;border-radius:16px;overflow:hidden;background:#fff;font-size:15px}
.pv-h{padding:10px 14px;font-weight:800;font-size:13px;color:var(--muted)}
.pv-r{display:grid;grid-template-columns:1fr 1fr 1fr;padding:9px 14px;border-top:1px solid #E7E9F2}
.pv-r.m{background:var(--masc)}.pv-r.f{background:var(--fem)}.pv-r.n{background:var(--neut)}
.pv-r span:last-child{color:var(--muted)}
.pv-r em{font-style:normal;font-weight:800;color:var(--violet-deep)}
.prods{display:grid;gap:18px;margin-top:28px}
.prod{display:flex;gap:20px;align-items:stretch;background:#fff;border:2px solid var(--line);border-radius:24px;padding:18px}
.prod.best{border:2.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.pcov{flex:0 0 120px;border-radius:8px 16px 16px 8px;padding:12px;display:flex;flex-direction:column;justify-content:space-between;color:#fff;min-height:190px}
.pcov small{font-size:9px;opacity:.85}
.pcov b{font-family:var(--display);font-weight:800;font-size:24px;line-height:1}
.pcov.pack{background:#2F4BFF}.pcov.pack span{color:#FFD43B}
.pcov.course{background:var(--ink)}.pcov.course b{font-size:20px;color:var(--buy)}
.pbody{display:flex;flex-direction:column;gap:8px;min-width:0}
.pbody h3{font-size:20px}
.pbody p{margin:0;color:var(--muted);font-size:16px}
.prow{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;padding-top:8px}
.pp{font-family:var(--display);font-weight:800;font-size:26px}
.pboth{font-weight:800;font-size:15px}
.note3{display:flex;flex-wrap:wrap;gap:24px 32px;align-items:flex-start;max-width:900px}
.note3 img{width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid var(--ink)}
.note3 > div{flex:1 1 420px}
.note3 p{margin:14px 0 0;font-size:18px;line-height:1.6}
.note3 .sign{font-family:var(--display);font-weight:700}
.rv3-row{display:grid;gap:16px;margin-top:28px}
.rv3{background:var(--mist);border-radius:22px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:18px}
.rv3 p{margin:0;font-size:17px;line-height:1.55}
.ava3{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;font-family:var(--display);font-weight:700;flex:none}
.rv3 .rv-who{display:flex;align-items:center;gap:12px;font-weight:800}
.rv3 .rv-who small{display:block;font-weight:600;color:var(--muted)}
@media (max-width:480px){.prod{flex-direction:column}.pcov{flex-basis:auto;min-height:120px}}
@media (min-width:760px){.prods{grid-template-columns:1fr 1fr}.rv3-row{grid-template-columns:repeat(3,1fr)}}
@media (min-width:900px){.h3-grid{grid-template-columns:1.25fr .75fr}}

/* Homepage v4: mission + concept */
.mis{background:var(--ink);color:#fff;padding:0 0 80px;overflow:hidden}
.ticker{background:var(--buy);color:var(--ink);overflow:hidden;white-space:nowrap;margin-bottom:64px}
.tk-track{display:inline-flex;gap:0;animation:tk 38s linear infinite}
.tk-track span{font-family:var(--display);font-weight:700;font-size:22px;padding:14px 22px;position:relative}
.tk-track span::after{content:"";position:absolute;right:-4px;top:50%;width:8px;height:8px;border-radius:50%;background:var(--ink);transform:translateY(-50%)}
@keyframes tk{to{transform:translateX(-50%)}}
.mis-k{margin:0;font-weight:800;color:var(--buy);font-size:17px}
.mis-big{margin:12px 0 0;font-family:var(--display);font-weight:700;font-size:clamp(28px,4.2vw,52px);line-height:1.15;max-width:22ch}
.vals{display:grid;gap:14px;margin-top:44px}
.val{border-radius:22px;padding:24px;color:var(--ink)}
.val.v1{background:#D8F7EC}.val.v2{background:#FFE6F0}.val.v3{background:#E2F2FF}
.v-ru{display:block;font-family:var(--display);font-weight:700;font-size:26px;line-height:1.1}
.val b{display:block;margin-top:4px;font-size:15px;color:var(--muted)}
.val p{margin:10px 0 0;font-size:17px;font-weight:600}
.mis-wip{margin-top:28px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;border:2px dashed rgba(255,255,255,.35);border-radius:20px;padding:18px 22px}
.mis-wip p{margin:0;font-size:18px;color:#E6E7F5;flex:1 1 320px}
.cc{display:grid;gap:18px;margin-top:30px}
.cc-card{display:flex;flex-direction:column;gap:14px;background:#fff;border:2.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);border-radius:26px;padding:28px}
.cc-card h3{font-size:26px;line-height:1.15}
.cc-card p{margin:0;color:var(--muted);font-size:17px}
.cc-card .btn{align-self:flex-start;margin-top:auto}
.cc-card.dark{background:var(--ink);color:#fff}
.cc-card.dark p{color:#C9CAE6}
.cc-card.dark .g-ru{color:var(--buy)}
.cc-card.dark .pv-card{color:var(--ink)}
.cc-card .pv-tbl,.cc-card .pv-card{color:var(--ink)}
@media (min-width:760px){.vals{grid-template-columns:repeat(3,1fr)}.cc{grid-template-columns:1fr 1fr}}
@media (prefers-reduced-motion:reduce){.tk-track{animation:none}}
.hero.h2::after{background:var(--buy)}
#concept .lead{font-size:clamp(20px,2.3vw,25px);line-height:1.5;max-width:34em;color:var(--ink)}
#reviews.tint .rv3{background:#fff}
#follow:not(.tint) .soc-card{background:var(--mist);border-color:transparent}
.tk-track .tk-i{display:inline-flex;align-items:baseline;gap:10px;padding:14px 30px;font-family:var(--body);font-size:16px}
.tk-track .tk-i::after{right:-4px}
.tk-w{font-family:var(--display);font-weight:700;font-size:22px}
.tk-t{font-style:normal;color:#2F4BFF;font-size:15px;font-weight:600}
.tk-t b{font-weight:800}
.tk-e{font-style:normal;font-weight:700;color:var(--ink)}
.try-cta{margin-top:30px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;background:#fff;border-radius:22px;padding:22px 26px}
.try-cta p{margin:0;font-size:19px;font-weight:700;max-width:38em}
.v-tr{display:block;margin-top:6px;color:#2F4BFF;font-size:15px;font-weight:600}.v-tr b{font-weight:800}
.sh-intro{display:flex;flex-wrap:wrap;align-items:center;gap:20px 28px}
.sh-intro img{width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid var(--ink);flex:none}
.sh-intro > div{flex:1 1 420px}
.sh-intro h2{max-width:20ch}
.sh-intro .lead{font-size:clamp(18px,2vw,21px)}
.val .v-tr b{display:inline;margin:0;color:inherit;font-size:inherit;font-weight:800}

/* Mission block, option C: values as pack word cards */
.mc{background:#F4F6FB;padding:0 0 80px;overflow:hidden}
.mc .ticker{margin-bottom:64px}
.mc-head{display:grid;gap:20px 40px;align-items:start}
.mc-k{margin:0;font-size:clamp(34px,4vw,52px);line-height:1.05;max-width:none}
.mc-k small{display:block;font-family:var(--body);font-size:18px;font-weight:800;color:#2F4BFF;margin-top:8px}
.mc-big{margin:0;font-size:clamp(21px,2.3vw,27px);line-height:1.45;font-weight:700}
.mc-sub{margin:18px 0 0;color:#62657D;font-size:18px}
.mc-cards{display:grid;gap:16px;margin-top:44px}
.mc-pk{position:relative;background:#fff;border-radius:18px;border-left:5px solid #129E6E;padding:20px 22px;display:grid;gap:4px}
.mc-tag{position:absolute;top:20px;right:18px;font-size:12px;font-weight:800;color:#fff;background:#129E6E;border-radius:999px;padding:4px 10px}
.mc-wd{font-family:var(--display);font-weight:700;font-size:28px;padding-right:60px;color:#15183A}
.mc-wd .st{color:#FF3D6E}
.mc-tr{color:#2F4BFF;font-size:15px;font-weight:600}
.mc-tr b{font-weight:800}
.mc-m{font-weight:800;font-size:18px;margin-top:8px}
.mc-ex{margin-top:6px;font-size:17px}
.mc-exe{color:#62657D;font-size:15px}
.mc-why{margin-top:12px;padding-top:12px;border-top:1px solid #E7E9F2;font-size:16px;font-weight:600}
.mc-why span{color:#2F4BFF;font-weight:800}
.mc-wip{margin-top:30px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;background:#fff;border-radius:18px;padding:16px 20px}
.mc-wip p{margin:0;font-size:18px}
@media (min-width:860px){.mc-head{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.mc-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mc-wd{white-space:nowrap;font-size:clamp(22px,2vw,28px);padding-right:52px}

/* Stories hub */
.story{display:flex;flex-wrap:wrap;gap:24px 32px;text-decoration:none;color:var(--ink);background:#fff;border:2.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);border-radius:26px;padding:24px;margin-top:8px}
.story:hover{transform:translate(-1px,-1px)}
.story-cov{flex:0 0 200px;min-height:270px;border-radius:6px;background:#fff;color:#1D1B2E;border:1px solid #DEDCEC;padding:18px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 18px 36px rgba(23,20,58,.14);transform:rotate(-2deg)}
.story-cov small{align-self:flex-start;font-family:"PT Mono",ui-monospace,monospace;font-size:13px;color:#C8243B;border:2px solid #C8243B;border-radius:6px;padding:3px 8px;transform:rotate(-4deg)}
.story-cov b{font-family:"Literata",Georgia,serif;font-weight:700;font-size:30px;line-height:1.1}
.story-body{flex:1 1 360px;display:flex;flex-direction:column;gap:10px}
.story-kind{font-weight:800;font-size:14px;color:var(--violet)}
.story-body h2{font-size:clamp(28px,4vw,40px)}
.story-en{margin:0;color:var(--muted);font-weight:700}
.story-body p{margin:0;font-size:17px;line-height:1.55}
.story-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.story-tags span{background:var(--mist);border-radius:999px;padding:5px 12px;font-weight:800;font-size:13px}
.story-body .go{margin-top:auto;font-weight:800;color:var(--violet)}
.story-next{margin-top:28px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;background:var(--mist);border-radius:18px;padding:16px 20px}
.story-next p{margin:0;font-size:17px;flex:1 1 320px}
@media (max-width:480px){.story-cov{flex-basis:100%;min-height:180px}}