@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Manrope:wght@400;500;600;700;800&family=Unbounded:wght@500;600;700&display=swap");

:root {
  --ink: #17242e;
  --muted: #687882;
  --page: #f3f5f1;
  --paper: #fbfcf8;
  --line: #d5deda;
  --blue: #0077b6;
  --blue-deep: #005b8e;
  --aqua: #8ee2da;
  --lime: #d6f05b;
  --mono: "IBM Plex Mono", "Courier New", monospace;
  --body: "Manrope", Arial, sans-serif;
  --display: "Unbounded", "Arial Narrow", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--page) !important; color: var(--ink) !important; font-family: var(--body) !important; }
a { color: inherit; }
.container { width: min(1180px, 100%); margin-inline: auto; padding-inline: clamp(20px, 4vw, 48px) !important; }

/* Header and home */
.site-header, header.container { position: relative !important; top: auto !important; width: 100%; background: transparent !important; backdrop-filter: none !important; border: 0 !important; padding: 22px 0 !important; }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.logo { color: var(--ink) !important; background: none !important; -webkit-text-fill-color: currentColor !important; font-family: var(--display); font-size: 1.05rem; font-weight: 700; letter-spacing: -.08em; text-decoration: none; white-space: nowrap; }
.logo span { color: var(--blue) !important; background: none !important; -webkit-text-fill-color: currentColor !important; }
nav { display: flex; align-items: center; gap: 28px; }
nav a { color: var(--muted) !important; font-size: .82rem; font-weight: 700; text-decoration: none; transition: color .2s ease; }
nav a:hover { color: var(--blue) !important; }
.btn-outline-nav { border: 1px solid var(--ink) !important; border-radius: 0 !important; color: var(--ink) !important; padding: 10px 14px !important; font-size: .75rem !important; }
.btn-outline-nav:hover { background: var(--ink) !important; color: white !important; }
.btn-outline-nav i { font-size: .7rem; margin-left: 6px; }

.hero { display: grid; grid-template-columns: 1.05fr .95fr; align-items: stretch; gap: clamp(32px, 7vw, 100px) !important; min-height: 545px; padding-block: clamp(54px, 8vw, 100px) 64px !important; }
.hero-text { align-self: center; min-width: 0 !important; }
.eyebrow { display: flex; align-items: center; gap: 9px; color: var(--muted); font: 600 .68rem/1.2 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.eyebrow span { display: inline-block; width: 20px; height: 7px; background: var(--aqua); }
.hero h1, .hero-text h1 { max-width: 680px; margin: 20px 0 22px; color: var(--ink); font: 600 clamp(2.35rem, 5vw, 4.5rem)/1.08 var(--display); letter-spacing: -.075em; }
h1 em, h2 em { color: var(--blue); font-style: normal; }
.hero-description, .hero-text p { max-width: 510px; color: var(--muted) !important; font-size: 1.05rem !important; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 32px; }
.btn-primary { display: inline-flex !important; align-items: center; gap: 18px; padding: 16px 20px !important; border: 1px solid var(--blue) !important; border-radius: 0 !important; background: var(--blue) !important; box-shadow: none !important; color: #fff !important; font: 700 .78rem/1 var(--body) !important; text-decoration: none; transition: background .2s ease, transform .2s ease !important; }
.btn-primary:hover { background: var(--blue-deep) !important; transform: translateY(-2px) !important; }
.btn-primary i { font-size: .82rem; }
.hero-note { margin: 0 !important; color: var(--muted) !important; font-size: .74rem !important; }
.hero-note i { color: var(--blue); margin-right: 5px; }
.hero-lab { position: relative; display: grid; place-items: center; min-height: 405px; overflow: hidden; border: 1px solid var(--ink); background-color: #dff3ee; background-image: linear-gradient(rgba(23,36,46,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(23,36,46,.09) 1px, transparent 1px); background-size: 22px 22px; }
.lab-label { position: absolute; top: 17px; left: 18px; color: var(--ink); font: 600 .65rem var(--mono); letter-spacing: .08em; }
.atom { position: relative; width: 235px; height: 235px; }
.atom::before, .atom::after, .atom i { position: absolute; inset: 35px 0; border: 2px solid var(--blue); border-radius: 50%; content: ""; }
.atom::before { transform: rotate(60deg); }.atom::after { transform: rotate(-60deg); }.atom i { display: block; transform: rotate(0); }
.atom b { position: absolute; top: 105px; left: 105px; width: 25px; height: 25px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 8px rgba(0,119,182,.13); }
.atom span { position: absolute; top: 12px; left: 106px; width: 14px; height: 14px; border-radius: 50%; background: var(--lime); }
.lab-formula { position: absolute; right: 20px; bottom: 20px; color: var(--ink); font: 600 1rem var(--mono); }
.lab-caption { position: absolute; left: 20px; bottom: 20px; display: grid; gap: 2px; }
.lab-caption span { color: var(--muted); font: .67rem var(--mono); text-transform: uppercase; }.lab-caption strong { font-size: .88rem; }

.proof { display: grid; grid-template-columns: .85fr 2fr; gap: 32px; padding-block: 44px !important; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.proof-intro > p:last-child { margin: 14px 0 0; font-size: 1.05rem; line-height: 1.48; }
.stats { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; }
.stat-item { padding: 0 clamp(18px, 3vw, 38px); text-align: left !important; border-left: 1px solid var(--line); }.stat-item:first-child { border-left: 0; }
.stat-item .num { color: var(--ink) !important; background: none !important; -webkit-text-fill-color: currentColor !important; font: 600 clamp(2rem, 3.6vw, 3.4rem)/1 var(--display); letter-spacing: -.08em; }.stat-item .num small { color: var(--blue); font-size: .55em; }
.stat-item .label { display: block; margin-top: 11px; color: var(--muted) !important; font-size: .73rem !important; line-height: 1.45; }

.features { padding-block: clamp(70px, 10vw, 130px) !important; }.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 38px; }.section-heading h2, .features h2 { margin: 14px 0 0; color: var(--ink); font: 600 clamp(2rem, 4vw, 3.55rem)/1.12 var(--display); letter-spacing: -.075em; }
.grid { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 0 !important; border-top: 1px solid var(--ink); }.card { position: relative; min-height: 260px; padding: 25px !important; border: 0 !important; border-right: 1px solid var(--ink) !important; border-radius: 0 !important; background: transparent !important; text-align: left !important; transition: background .2s ease !important; }.card:first-child { border-left: 1px solid var(--ink) !important; }.card:hover { border-color: var(--ink) !important; background: var(--aqua) !important; transform: none !important; }.card-index { display: block; color: var(--muted); font: .68rem var(--mono); }.card .icon { display: block; margin: 38px 0 18px; color: var(--blue); font-size: 1.7rem; }.card h3 { margin: 0 0 7px; color: var(--ink) !important; font-size: 1.05rem !important; }.card p { color: var(--muted) !important; font-size: .82rem !important; line-height: 1.6; }

.cta { display: grid; grid-template-columns: 1fr .84fr; gap: 44px; align-items: end; margin-bottom: clamp(60px, 10vw, 120px); padding: clamp(32px, 5vw, 60px) !important; background: var(--ink); color: #f3f5f1; }.cta .eyebrow { color: #a9b7b9; }.cta h2 { margin: 16px 0 0; font: 600 clamp(2rem, 3.6vw, 3.35rem)/1.15 var(--display); letter-spacing: -.075em; }.cta h2 em { color: var(--lime); }.cta-action p { margin: 0 0 26px; color: #c6d0ce !important; font-size: .9rem !important; line-height: 1.65; }.cta .btn-primary { background: var(--lime) !important; border-color: var(--lime) !important; color: var(--ink) !important; }.cta .btn-primary:hover { background: #e4f981 !important; }
footer { border-top: 1px solid var(--line) !important; background: transparent !important; color: var(--muted); }.footer-inner { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 32px; min-height: 110px; }.footer-links, footer .footer-links { display: flex; gap: 20px; margin: 0 !important; }.footer-links a, footer .footer-links a, .footer-contacts a { color: var(--muted) !important; font-size: .72rem; font-weight: 600; text-decoration: none; }.footer-links a:hover, footer .footer-links a:hover, .footer-contacts a:hover { color: var(--blue) !important; }.footer-contacts { display: flex; gap: 12px; font: .7rem var(--mono); }.footer-contacts a + a::before { margin-right: 12px; color: var(--line); content: "/"; }

/* Supporting public and account pages */
.page-wrap, .dashboard-wrap, .admin-wrap { min-height: 100vh; padding-top: clamp(64px, 10vw, 120px) !important; padding-bottom: 64px !important; }.page-wrap h1, .dashboard-header h1 { color: var(--ink); font: 600 clamp(2rem, 4vw, 3.3rem)/1.1 var(--display) !important; letter-spacing: -.075em; }.page-wrap h1 span, .dashboard-header h1 span { color: var(--blue) !important; }.content { max-width: 720px !important; color: var(--muted) !important; font-size: 1rem !important; line-height: 1.75 !important; }.content p { margin: 0 0 14px; }.content p::before { display: none; }.back-link { color: var(--blue) !important; font: 600 .75rem var(--mono); text-decoration: none; }.back-link:hover { color: var(--blue-deep) !important; }.teachers-grid, .prices-grid { gap: 16px !important; }.teacher-card, .price-card { border: 1px solid var(--line) !important; border-radius: 0 !important; background: var(--paper) !important; box-shadow: none !important; }.teacher-card { text-align: left !important; }.teacher-card .avatar { color: var(--blue) !important; }.teacher-card .title { color: var(--muted) !important; }.price-card .price { color: var(--blue) !important; font-family: var(--display); letter-spacing: -.07em; }.price-card.featured { border: 2px solid var(--blue) !important; }.price-card .btn-order { border-radius: 0 !important; background: var(--blue) !important; }.login-box, .register-box { border: 1px solid var(--ink) !important; border-radius: 0 !important; background: var(--paper) !important; box-shadow: 10px 10px 0 var(--aqua) !important; }.login-box h1, .register-box h1 { color: var(--ink) !important; background: none !important; -webkit-text-fill-color: currentColor !important; font-family: var(--display); letter-spacing: -.07em; }.login-box h1::before, .register-box h1::before { display: none; }.login-box input, .register-box input { border: 1px solid var(--line) !important; border-radius: 0 !important; background: white; font-family: var(--body); }.login-box input:focus, .register-box input:focus { border-color: var(--blue) !important; }.login-box .btn, .register-box .btn { border-radius: 0 !important; background: var(--blue) !important; }.login-box .btn::before, .register-box .btn::before { display: none; }.login-box .footer, .register-box .footer { color: var(--muted) !important; }.login-box .footer a, .register-box .footer a { color: var(--blue) !important; }

/* Authentication */
.auth-page { display: block !important; min-height: 100vh; padding: 22px; background-color: #dff3ee !important; background-image: linear-gradient(rgba(23,36,46,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(23,36,46,.09) 1px, transparent 1px) !important; background-size: 22px 22px !important; }.auth-layout { width: min(100%, 470px); margin: 0 auto; padding: clamp(32px, 10vh, 82px) 0; }.auth-logo { display: inline-block; margin-bottom: 28px; }.auth-card { max-width: none !important; width: 100% !important; padding: clamp(28px, 6vw, 44px) !important; }.auth-card h1 { margin: 15px 0 9px; font-size: clamp(1.65rem, 4vw, 2.15rem) !important; }.auth-card .sub { margin: 0 0 27px; color: var(--muted) !important; font-size: .85rem; line-height: 1.6; }.auth-card label { display: block; margin: 15px 0 7px; color: var(--ink); font-size: .72rem; font-weight: 700; }.auth-card label small { color: var(--muted); font-weight: 500; }.auth-card input { margin: 0 !important; padding: 14px 15px !important; font-size: .85rem !important; }.auth-card .btn { display: flex; align-items: center; justify-content: space-between; margin-top: 24px; padding: 16px !important; border: 1px solid var(--blue); border-radius: 0 !important; background: var(--blue) !important; color: white; font: 700 .78rem var(--body); }.auth-card .error, .auth-card .success { margin: 16px 0 0; padding: 11px; border: 1px solid currentColor; font-size: .75rem; text-align: left; }.auth-card .error { color: #b63c3c !important; background: #fff0ee; }.auth-card .success { color: #16755b !important; background: #e3f7ed; }.auth-card .footer { margin: 21px 0 0; font-size: .78rem; }.auth-card .back-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; font-size: .7rem; }

/* Editorial public pages */
.editorial-intro, .people-heading, .pricing-heading { padding-bottom: clamp(48px, 8vw, 90px); }.editorial-intro h1, .people-heading h1, .pricing-heading h1 { margin: 18px 0 22px; }.intro-copy, .people-heading > p:last-child, .pricing-heading > p:last-child { max-width: 560px; color: var(--muted); font-size: 1.04rem; line-height: 1.7; }.manifesto-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 10vw, 150px); padding-bottom: clamp(80px, 12vw, 150px) !important; border-top: 1px solid var(--ink); padding-top: 28px !important; }.manifesto-statement { font: 600 clamp(1.5rem, 3vw, 2.7rem)/1.25 var(--display); letter-spacing: -.075em; }.manifesto-copy { max-width: 470px; color: var(--muted); font-size: .95rem; line-height: 1.75; }.manifesto-copy p { margin: 0 0 18px; }.text-link { display: inline-flex; align-items: center; gap: 12px; margin-top: 14px; color: var(--blue); font: 600 .75rem var(--body); text-decoration: none; }.text-link:hover { color: var(--blue-deep); }.people-grid, .pricing-grid { margin-bottom: clamp(60px, 10vw, 120px); }.person-card { min-height: 330px; padding: 28px !important; }.person-mark { display: flex; align-items: center; justify-content: space-between; margin-bottom: 65px; color: var(--blue); font-size: 1.55rem; }.person-mark span { color: var(--muted); font: .7rem var(--mono); }.person-card .name { font: 600 1.4rem var(--display); letter-spacing: -.07em; }.person-card .title { margin-top: 8px; font-size: .82rem; line-height: 1.45; }.person-card > p { margin: 27px 0 0; color: var(--muted); font-size: .82rem; line-height: 1.6; }.pricing-grid { align-items: stretch; }.price-card { display: flex; flex-direction: column; min-height: 365px; padding: 28px !important; text-align: left !important; }.plan-label { margin: 0; color: var(--muted); font: .68rem var(--mono); letter-spacing: .08em; text-transform: uppercase; }.price-card .price { margin: 18px 0 10px; font-size: clamp(2rem, 3vw, 2.8rem); }.price-card > p:not(.plan-label) { margin: 0; color: var(--ink); font-size: .86rem; font-weight: 700; }.price-card ul { min-height: 78px; margin: 26px 0; padding: 0; list-style: none; color: var(--muted); font-size: .78rem; line-height: 1.9; }.price-card li::before { color: var(--blue); content: "— "; }.price-card .btn-order { display: inline-flex; align-items: center; justify-content: space-between; gap: 18px; width: max-content; margin-top: auto; padding: 13px 15px !important; color: #fff; font-size: .72rem; text-decoration: none; }.price-card.featured { background: #e5f6f1 !important; }.price-card.featured .btn-order { background: var(--ink) !important; }

/* Student dashboard */
.cabinet-page { background: var(--page) !important; }.cabinet-header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 22px; border-bottom: 1px solid var(--line); }.cabinet-user { display: flex; align-items: center; gap: 18px; color: var(--muted); font-size: .78rem; font-weight: 700; }.cabinet-user a { color: var(--ink); font: .7rem var(--mono); text-decoration: none; }.cabinet-user a:hover { color: var(--blue); }.dashboard-header { display: flex; justify-content: space-between; align-items: end; gap: 36px; margin: clamp(48px, 8vw, 90px) 0 36px !important; }.dashboard-header h1 { margin: 16px 0 0; }.dashboard-header h1 em { color: var(--blue); font-style: normal; }.dashboard-lead { max-width: 370px; margin: 0; color: var(--muted); font-size: .85rem; line-height: 1.65; }.stats-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 16px !important; margin-bottom: clamp(54px, 8vw, 90px) !important; }.stat-card { min-height: 176px; padding: 24px !important; text-align: left !important; }.stat-label { color: var(--muted); font: .68rem var(--mono); letter-spacing: .05em; text-transform: uppercase; }.stat-card .number { margin-top: 24px; font-size: clamp(2rem, 3vw, 2.75rem); }.stat-card p { margin: 8px 0 0; color: var(--muted); font-size: .73rem; }.cabinet-section { margin-top: 36px; }.cabinet-section-heading { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 13px; }.cabinet-section-heading h2 { margin: 0; color: var(--ink); font: 600 1.15rem var(--display); letter-spacing: -.06em; }.cabinet-section-heading span { color: var(--muted); font: .65rem var(--mono); letter-spacing: .07em; text-transform: uppercase; }.table-wrap { overflow-x: auto; }.table-wrap table { min-width: 620px; }.table-wrap th { padding: 15px 20px; font-size: .64rem; }.table-wrap td { padding: 15px 20px; color: var(--ink); font-size: .8rem; }.empty-state { min-height: 150px; display: grid; place-content: center; gap: 5px; color: var(--muted) !important; text-align: center; }.empty-state i { margin-bottom: 6px; color: var(--blue); font-size: 1.2rem; }.empty-state p { margin: 0; color: var(--ink); font-size: .85rem; font-weight: 700; }.empty-state span { font-size: .74rem; }.badge { padding: 5px 8px !important; font-size: .62rem !important; white-space: nowrap; }.badge-pending { color: #8a6200 !important; background: #fff2c6 !important; }.badge-confirmed, .badge-paid { color: #14745d !important; background: #dff5ec !important; }.badge-completed { color: #075b89 !important; background: #dff3fb !important; }.badge-cancelled { color: #a63b3b !important; background: #ffeded !important; }
.dashboard-header h1::before, .section-title::before { display: none; }.dashboard-header .user-info .name { color: var(--muted) !important; }.btn-logout { border-color: var(--ink) !important; border-radius: 0 !important; color: var(--ink) !important; }.btn-logout:hover { background: var(--ink) !important; color: white !important; }.stat-card, .table-wrap { border: 1px solid var(--line) !important; border-radius: 0 !important; background: var(--paper) !important; box-shadow: none !important; }.stat-card .number { color: var(--blue) !important; background: none !important; -webkit-text-fill-color: currentColor !important; font-family: var(--display); }.section-title { color: var(--ink); font-family: var(--display) !important; font-size: 1.2rem !important; letter-spacing: -.05em; }.table-wrap th { color: var(--muted); font-family: var(--mono); }.badge { border-radius: 0 !important; }.grade-highlight { color: var(--blue) !important; }

@media (max-width: 780px) { nav { display: none; }.hero { grid-template-columns: 1fr; min-height: auto; }.hero-lab { min-height: 330px; }.proof, .cta { grid-template-columns: 1fr; }.stats { grid-template-columns: 1fr; gap: 18px !important; }.stat-item { padding-left: 0; border-left: 0; }.section-heading { display: block; }.grid { grid-template-columns: 1fr; }.card, .card:first-child { min-height: 0; border: 0 !important; border-bottom: 1px solid var(--ink) !important; }.footer-inner { grid-template-columns: 1fr; gap: 16px; padding-block: 28px; }.footer-links, .footer-contacts { flex-wrap: wrap; }.login-box, .register-box { box-shadow: 6px 6px 0 var(--aqua) !important; }.teachers-grid, .prices-grid { grid-template-columns: 1fr !important; } }
@media (max-width: 430px) { .btn-outline-nav { padding: 9px 11px !important; }.hero h1, .hero-text h1 { font-size: 2.2rem !important; }.hero-lab { min-height: 285px; }.atom { transform: scale(.82); }.cta { padding: 28px 22px !important; } }
@media (max-width: 780px) { .manifesto-grid { grid-template-columns: 1fr; gap: 32px; }.editorial-intro, .people-heading, .pricing-heading { padding-bottom: 48px; }.person-card, .price-card { min-height: 0; }.dashboard-header { align-items: start; flex-direction: column; gap: 18px; margin-top: 48px !important; }.stats-grid { grid-template-columns: 1fr !important; }.stat-card { min-height: 0; }.cabinet-header { align-items: flex-start; flex-direction: column; gap: 14px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }