/* Ak Karkyra / White Crane — shared design system
   Palette: near-black ink on warm cream paper, terracotta as the single warm accent, blue for links/CTAs */
:root{
  --ink:#14181c;
  --ink-soft:#3d454e;
  --paper:#fbfaf7;
  --paper-2:#f1f2ee;
  --paper-3:#eceef1;
  --jade:#26418f;         /* primary link/CTA accent (was jade green, now blue) */
  --jade-deep:#14181c;    /* headings inside feature bands now read as ink, not a colour */
  --jade-pale:#eceef1;
  --cream-band:#fbfaf7;   /* all bands are paper-toned now — no dark stripes anywhere */
  --jade-band:#f1f2ee;
  --bronze:#cf4526;       /* terracotta — eyebrows, dividers, numbering */
  --line:#dcdfe4;
  --muted:#7b838c;
  --white:#ffffff;
  --display:'Playfair Display', Georgia, serif;
  --body:'Manrope', -apple-system, 'Segoe UI', sans-serif;
  --maxw:1180px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--body);background:var(--paper);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
ul,ol{margin:0;padding:0;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;}

/* language toggling: RU is the base language, shown by default */
[data-lang="en"]{display:none;}
html.lang-en [data-lang="en"]{display:block;}
html.lang-en span[data-lang="en"],
html.lang-en a[data-lang="en"]{display:inline;}
html.lang-en [data-lang="ru"]{display:none;}

h1,h2,h3,h4{font-family:var(--display);margin:0;font-weight:600;color:var(--ink);letter-spacing:-.01em;}
h1{font-size:clamp(34px,5vw,58px);line-height:1.06;}
h2{font-size:clamp(26px,3.4vw,38px);line-height:1.14;}
h3{font-size:20px;line-height:1.3;}
h4{font-size:16px;}
p{margin:0;}
.eyebrow{font-family:var(--body);font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--bronze);}
.lead{color:var(--muted);font-size:17px;max-width:640px;}

.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--body);font-weight:700;font-size:14px;padding:14px 28px;border-radius:2px;border:1.5px solid transparent;transition:transform .15s ease,background .15s ease,border-color .15s ease;}
.btn:hover{transform:translateY(-2px);}
.btn-jade{background:var(--jade);color:var(--white);}
.btn-jade:hover{background:var(--jade-deep);}
.btn-outline{border-color:var(--ink);color:var(--ink);}
.btn-outline:hover{background:var(--ink);color:var(--paper);}
.btn-outline.on-dark{border-color:rgba(255,255,255,.5);color:#fff;}
.btn-outline.on-dark:hover{background:#fff;color:var(--ink);}

section{position:relative;}
.section{padding:44px 0;}
.section-tight{padding:56px 0;}
.section-dark{background:var(--ink);color:var(--paper);}
.section-dark h1,.section-dark h2,.section-dark h3{color:#fff;}
.section-dark .lead{color:#b9c4bc;}
.section-jade{background:var(--jade-deep);color:var(--paper);}
.section-jade h1,.section-jade h2,.section-jade h3{color:#fff;}
.section-jade .lead{color:#c7d6cd;}
.divider{width:56px;height:2px;background:var(--bronze);margin:18px 0;}
.divider.center{margin-left:auto;margin-right:auto;}

/* header */
header#site-header{position:sticky;top:0;z-index:60;background:rgba(251,250,247,.92);backdrop-filter:blur(10px);border-bottom:1px solid transparent;transition:border-color .2s ease,box-shadow .2s ease;}
header#site-header.scrolled{border-color:var(--line);box-shadow:0 6px 24px rgba(20,24,28,.06);}
header#site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 32px;}
.brandmark{display:flex;align-items:center;gap:12px;}
.brandmark svg{width:38px;height:38px;flex:0 0 auto;color:var(--jade);}
.brandmark img.brand-logo{width:38px;height:38px;flex:0 0 auto;object-fit:contain;mix-blend-mode:multiply;}
.brandmark .btxt{font-family:var(--display);line-height:1.15;}
.brandmark .btxt b{display:block;font-size:15px;font-weight:600;}
.brandmark .btxt span{display:block;font-size:11px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;}
nav.primary-nav{display:flex;align-items:center;gap:30px;}
nav.primary-nav a{font-size:14.5px;font-weight:600;padding:6px 0;border-bottom:2px solid transparent;transition:border-color .15s,color .15s;}
nav.primary-nav a:hover,nav.primary-nav a.active{border-color:var(--bronze);}
.header-actions{display:flex;align-items:center;gap:14px;}
.lang-toggle{display:flex;border:1.5px solid var(--ink);border-radius:999px;overflow:hidden;font-family:var(--body);font-weight:700;font-size:12.5px;}
.lang-toggle button{padding:6px 13px;background:none;border:none;color:var(--ink);letter-spacing:.03em;}
.lang-toggle button.active{background:var(--ink);color:var(--paper);}
.hamburger{display:none;background:none;border:none;width:28px;height:20px;position:relative;flex:0 0 auto;}
.hamburger span{position:absolute;left:0;right:0;height:2px;background:var(--ink);transition:all .25s ease;}
.hamburger span:nth-child(1){top:0;} .hamburger span:nth-child(2){top:9px;} .hamburger span:nth-child(3){top:18px;}
.hamburger.open span:nth-child(1){transform:translateY(9px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:translateY(-9px) rotate(-45deg);}
#mobile-nav{position:fixed;inset:0;background:var(--ink);z-index:150;transform:translateX(100%);transition:transform .3s ease;overflow-y:auto;padding:96px 28px 40px;}
#mobile-nav.open{transform:translateX(0);}
#mobile-nav a{display:block;color:#fff;font-family:var(--display);font-weight:600;font-size:19px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.12);}
#mobile-nav .lang-toggle{margin-top:22px;border-color:rgba(255,255,255,.5);}
#mobile-nav .lang-toggle button{color:#fff;}
#mobile-nav .lang-toggle button.active{background:#fff;color:var(--ink);}

/* footer */
footer{background:var(--ink);color:#b9c4bc;padding:60px 0 26px;font-size:14px;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:28px;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.12);}
.footer-grid h4{color:#fff;font-size:13px;letter-spacing:.06em;text-transform:uppercase;font-family:var(--body);margin-bottom:14px;}
.footer-grid ul{display:flex;flex-direction:column;gap:9px;list-style:none;}
.footer-grid a:hover{color:#fff;}
.footer-bottom{padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12.5px;color:#7c8c81;}

/* cards */
.card-grid{display:grid;gap:24px;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
.pillar-card{background:var(--white);border:1px solid var(--line);padding:32px 28px;}
.pillar-card .num{font-family:var(--display);font-size:13px;color:var(--bronze);font-weight:600;}
.pillar-card h3{margin:14px 0 10px;}
.pillar-card p{color:var(--muted);font-size:14.5px;}
.link-arrow{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13.5px;color:var(--jade);margin-top:16px;}
.link-arrow svg{width:14px;height:14px;transition:transform .15s;}
.link-arrow:hover svg{transform:translateX(3px);}

/* timeline */
.timeline{position:relative;padding-left:34px;border-left:2px solid var(--line);display:flex;flex-direction:column;gap:40px;}
.tl-item{position:relative;}
.tl-item::before{content:"";position:absolute;left:-41px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--jade);border:3px solid var(--paper);box-shadow:0 0 0 2px var(--jade);}
.tl-year{font-family:var(--display);font-weight:600;color:var(--bronze);font-size:15px;margin-bottom:6px;}
.tl-item h3{margin-bottom:10px;}
.tl-item p{color:var(--muted);font-size:15px;max-width:720px;}
.tl-item p + p{margin-top:10px;}

/* tables */
.table-wrap{overflow-x:auto;border:1px solid var(--line);}
table.data-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:560px;}
table.data-table th{background:var(--paper-2);text-align:left;font-family:var(--body);font-weight:700;font-size:12.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);padding:12px 16px;border-bottom:1px solid var(--line);white-space:nowrap;}
table.data-table td{padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--ink-soft);}
table.data-table td:first-child{color:var(--muted);width:44px;}
table.data-table tr:last-child td{border-bottom:none;}
table.data-table tr:hover td{background:var(--paper-2);}
table.data-table td b{color:var(--ink);font-weight:700;}

/* level / program blocks */
.level-block{border-top:2px solid var(--ink);padding-top:26px;margin-top:48px;}
.level-block:first-of-type{margin-top:0;}
.level-head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:10px;margin-bottom:18px;}
.level-tag{font-family:var(--body);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--bronze);}
.level-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 32px;margin-bottom:18px;}
.level-list li{list-style:none;position:relative;padding-left:20px;font-size:15px;color:var(--ink-soft);}
.level-list li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;background:var(--jade);}
.level-note{color:var(--muted);font-size:14.5px;background:var(--paper-2);padding:16px 20px;border-left:2px solid var(--bronze);}

.principle-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 32px;}
.principle-list li{list-style:none;position:relative;padding-left:26px;font-size:15px;color:var(--ink-soft);}
.principle-list li::before{content:"";position:absolute;left:0;top:2px;width:16px;height:16px;border:1.5px solid var(--jade);border-radius:50%;}

.quote-block{border-left:3px solid var(--bronze);padding-left:24px;font-family:var(--display);font-style:italic;font-size:20px;line-height:1.5;color:var(--jade);}

/* stat row */
.stat-row{display:flex;gap:48px;flex-wrap:wrap;}
.stat{}
.stat b{display:block;font-family:var(--display);font-size:36px;font-weight:600;}
.stat span{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;}
.section-dark .stat span,.section-jade .stat span{color:#a9bcb1;}

/* directions grid on students page */
.region-grid{display:flex;flex-wrap:wrap;gap:10px;}
.region-chip{background:var(--paper-2);border:1px solid var(--line);padding:8px 16px;font-size:13.5px;font-weight:600;}

.crumb{font-size:13px;color:var(--muted);margin-bottom:18px;}
.crumb a:hover{color:var(--jade);text-decoration:underline;}

/* ==========================================================================
   Светлая тема — «Белый Журавль» (Playfair Display + Manrope, крем/терракота/синий).
   Все полосы (hero, feature-блоки, футер) теперь на кремовой бумаге вместо
   тёмного ink. Overrides с !important, потому что исходная разметка частично
   несёт цвет инлайном (style="color:#fff") на тех же элементах.
   ========================================================================== */

/* home hero (тёмный ink → крем) */
.home-hero{background:var(--cream-band) !important;color:var(--ink) !important;}
.home-hero h1{color:var(--jade-deep) !important;}
.home-hero .eyebrow{color:var(--bronze) !important;}
.home-hero .lead{color:var(--muted) !important;}
.home-hero .stat b{color:var(--jade-deep) !important;}
.home-hero .stat span{color:var(--muted) !important;}
.home-hero .stat-row{border-top-color:var(--line) !important;}
.home-hero .mark{color:rgba(38,65,143,.14) !important;}
.home-hero img.mark{mix-blend-mode:multiply;filter:drop-shadow(0 18px 36px rgba(20,24,28,.12));}
.home-hero .btn-outline.on-dark{border-color:var(--ink) !important;color:var(--ink) !important;}
.home-hero .btn-outline.on-dark:hover{background:var(--ink) !important;color:var(--paper) !important;}

/* feature-полосы (deep jade → мягкий нефрит) */
.section-jade{background:var(--jade-band) !important;color:var(--ink) !important;}
.section-jade h1,.section-jade h2,.section-jade h3{color:var(--jade-deep) !important;}
.section-jade .lead{color:var(--muted) !important;}
.section-jade .eyebrow{color:var(--bronze) !important;}

/* тёмные полосы (ink → крем) */
.section-dark{background:var(--cream-band) !important;color:var(--ink) !important;}
.section-dark h1,.section-dark h2,.section-dark h3{color:var(--jade-deep) !important;}
.section-dark .lead{color:var(--muted) !important;}
.section-dark .eyebrow{color:var(--bronze) !important;}

/* карточки внутри переверстанных полос */
.section-jade .pillar-card,.section-dark .pillar-card{background:var(--white) !important;border-color:var(--line) !important;}
.section-jade .pillar-card .num,.section-dark .pillar-card .num{color:var(--bronze) !important;}
.section-jade .pillar-card h3,.section-dark .pillar-card h3{color:var(--ink) !important;}
.section-jade .pillar-card p,.section-dark .pillar-card p{color:var(--muted) !important;}

/* мелочи внутри полос: ссылки-стрелки, чипы, подписи статистики */
.section-jade .link-arrow,.section-dark .link-arrow{color:var(--jade-deep) !important;}
.section-jade .stat span,.section-dark .stat span{color:var(--muted) !important;}
.section-dark .region-chip{background:var(--white) !important;border-color:var(--line) !important;color:var(--ink-soft) !important;}

/* footer (тёмный ink → светлый крем с верхней линией) */
footer{background:var(--paper-2) !important;color:var(--muted) !important;border-top:1px solid var(--line);}
footer .footer-grid{border-bottom-color:var(--line) !important;}
footer .footer-grid h4{color:var(--ink) !important;}
footer .footer-grid a:hover{color:var(--jade-deep) !important;}
footer .brandmark svg{color:var(--jade) !important;}
footer .brandmark .btxt b{color:var(--ink) !important;}
footer .brandmark .btxt span,footer p,footer .footer-bottom{color:var(--muted) !important;}

@media (max-width:980px){
  nav.primary-nav,.header-actions .lang-toggle{display:none;}
  .hamburger{display:block;}
  .grid-3{grid-template-columns:1fr;}
  .grid-2{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .level-list,.principle-list{grid-template-columns:1fr;}
  .stat-row{gap:28px;justify-content:center;}
  .eyebrow,.page-hero h1,.home-hero h1,.section h2{text-align:center;}
  .path-strip{justify-content:center;}
  .region-grid{justify-content:center;}
}
@media (max-width:640px){
  .wrap{padding:0 20px;}
  header#site-header .wrap{padding:14px 20px;}
  .section{padding:30px 0;}
  .footer-grid{grid-template-columns:1fr;}
  .timeline{padding-left:26px;}
  .tl-item::before{left:-33px;}
}