/* ============================================================
   BRANDKIT SYSTEM — "Ледяная кафедра"
   Light cold-blue presentation system.
   One accent carries the system: --blue-700.
   ============================================================ */

/* ============ Tokens ============ */
:root{
  --ice-50:#f2f6fa;      /* page canvas */
  --ice-100:#e3ecf4;     /* section bands */
  --ice-200:#d3e2ef;     /* deep band / chip hover */
  --card:#fafcfe;
  --chip:#dcebf7;

  --ink-900:#0e1826;
  --ink-700:#32455c;
  --ink-500:#5b7189;
  --ink-300:#a3b6c9;

  --blue-700:#17548f;    /* the one accent */
  --blue-500:#3d7ab8;
  --steel-500:#6d87a0;

  --line:rgba(14,32,54,0.14);
  --line-strong:rgba(14,32,54,0.26);
  --shadow-soft:none;
  --shadow-lift:0 2px 10px rgba(14,32,54,0.07);

  --display:'Literata', 'Georgia', serif;
  --body:'Inter', 'PT Sans', sans-serif;
  --mono:'Inter', 'PT Sans', sans-serif;

  --wrap:1180px;
  --radius-lg:3px;
  --radius-md:3px;
  --radius-sm:3px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}

body{
  margin:0;
  background:var(--ice-50);
  color:var(--ink-900);
  font-family:var(--body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

a{color:inherit; text-decoration:none;}
a:focus-visible{outline:2px solid var(--blue-500); outline-offset:3px;}
h1,h2,h3{font-family:var(--display); font-weight:600; margin:0; letter-spacing:-0.01em;}
p{margin:0;}
::selection{background:var(--blue-700); color:#fff;}

/* ============ Reveal on scroll ============ */
.reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity 0.7s cubic-bezier(.19,1,.22,1), transform 0.7s cubic-bezier(.19,1,.22,1);
}
.reveal.is-visible{opacity:1; transform:translateY(0);}

/* ============ Nav ============ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px clamp(20px,5vw,64px);
  font-family:var(--mono); font-size:13.5px; font-weight:500; letter-spacing:0.01em;
  background:linear-gradient(to bottom, rgba(242,246,250,0.92), transparent);
  backdrop-filter:blur(2px);
  transform:translateY(-100%);
  transition:transform 0.5s cubic-bezier(.19,1,.22,1), background 0.4s ease, box-shadow 0.4s ease;
}
.nav.is-shown{transform:translateY(0);}
.nav.is-solid{background:rgba(242,246,250,0.95); backdrop-filter:blur(10px); box-shadow:0 1px 0 var(--line);}
.nav__mark{color:var(--blue-700); font-weight:700; letter-spacing:0.04em;}
.nav__links{display:flex; gap:clamp(12px,2vw,28px);}
.nav__links a{color:var(--ink-500); position:relative; padding-bottom:2px;}
.nav__links a:hover{color:var(--ink-900);}
.nav__links a::after{
  content:''; position:absolute; left:0; right:0; bottom:-2px; height:1px;
  background:var(--blue-700); transform:scaleX(0); transform-origin:left;
  transition:transform 0.3s ease;
}
.nav__links a:hover::after{transform:scaleX(1);}

.nav__toggle{
  display:none;
  position:relative; width:44px; height:44px; margin:-10px -8px -10px 0;
  background:none; border:none; cursor:pointer; padding:0;
}
.nav__toggle span{
  position:absolute; left:11px; right:11px; height:2px;
  background:var(--ink-700);
  transition:transform 0.35s cubic-bezier(.19,1,.22,1), opacity 0.25s ease, top 0.35s cubic-bezier(.19,1,.22,1);
}
.nav__toggle span:nth-child(1){ top:15px; }
.nav__toggle span:nth-child(2){ top:21px; }
.nav__toggle span:nth-child(3){ top:27px; }
.nav.is-open .nav__toggle span:nth-child(1){ top:21px; transform:rotate(45deg); }
.nav.is-open .nav__toggle span:nth-child(2){ opacity:0; }
.nav.is-open .nav__toggle span:nth-child(3){ top:21px; transform:rotate(-45deg); }
.nav__toggle:focus-visible{ outline:2px solid var(--blue-500); outline-offset:2px; border-radius:var(--radius-sm); }

@media (max-width:720px){
  .nav{ transform:translateY(0); }
  .nav__toggle{ display:block; }
  .nav__links{
    position:absolute; top:100%; right:12px; left:auto;
    flex-direction:column; gap:0; min-width:220px;
    background:var(--card); border:1px solid var(--line);
    border-radius:var(--radius-md); box-shadow:var(--shadow-lift);
    padding:6px; margin-top:-6px;
    opacity:0; transform:translateY(-8px); pointer-events:none; visibility:hidden;
    transition:opacity 0.3s ease, transform 0.3s cubic-bezier(.19,1,.22,1), visibility 0.3s;
  }
  .nav.is-open .nav__links{
    opacity:1; transform:translateY(0); pointer-events:auto; visibility:visible;
  }
  .nav__links a{
    padding:12px 14px; border-radius:var(--radius-sm); color:var(--ink-700);
  }
  .nav__links a::after{ display:none; }
  .nav__links a:hover{ background:var(--ice-100); color:var(--ink-900); }
}

/* ============ Hero — light ice board ============ */
.hero{
  position:relative;
  min-height:100svh;
  display:flex; align-items:center;
  padding:clamp(88px,12vw,120px) clamp(20px,6vw,64px) clamp(48px,8vw,72px);
  overflow:hidden;
  background:
    linear-gradient(170deg, #eaf1f8 0%, var(--ice-50) 45%, #e6eef6 100%);
  border-bottom:1px solid var(--line);
}
/* blueprint grid — quiet construction detail */
.hero::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(23,84,143,0.045) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(23,84,143,0.045) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 90% 80% at 30% 40%, #000 30%, transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 90% 80% at 30% 40%, #000 30%, transparent 75%);
}
.hero__wave{
  position:absolute; inset:0; width:100%; height:100%;
  opacity:0.55;
}
.hero__wave path{
  fill:none; stroke:var(--blue-500); stroke-width:1.2; opacity:0.35;
  stroke-dasharray:6000;
  stroke-dashoffset:6000;
  animation:draw-hero 3.2s cubic-bezier(.19,1,.22,1) 0.2s forwards;
}
@keyframes draw-hero{ to{ stroke-dashoffset:0; } }
.hero__inner{position:relative; z-index:2; max-width:780px;}
.hero__inner::before{
  content:''; display:block; width:56px; height:3px;
  background:var(--blue-700); margin-bottom:28px;
}
.eyebrow{
  font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:0.1em;
  color:var(--ink-500); text-transform:uppercase; margin:0 0 24px;
  max-width:560px;
}
.hero__name{
  font-size:clamp(42px, 7.5vw, 82px);
  line-height:1.05;
  color:var(--ink-900);
  margin-bottom:22px;
  font-weight:600;
}
.hero__role{
  font-family:var(--mono); font-size:15px; font-weight:600; color:var(--blue-700);
  margin-bottom:26px; letter-spacing:0.02em;
}
.hero__lede{
  font-size:clamp(16px,2vw,18px); color:var(--ink-700);
  max-width:620px; line-height:1.75;
}
.hero__scroll{
  display:inline-flex; align-items:center; gap:10px;
  margin-top:clamp(24px,4vw,36px); font-family:var(--mono); font-size:12px;
  font-weight:600; color:var(--ink-500); letter-spacing:0.12em; text-transform:uppercase;
  padding:12px 0; min-height:44px;
}
.hero__scroll svg{animation:bob 2s ease-in-out infinite;}
@keyframes bob{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(6px);} }

/* ============ Sections shared ============ */
.section{
  position:relative;
  max-width:var(--wrap);
  margin:0 auto;
  padding:clamp(64px,9vw,104px) clamp(20px,6vw,64px);
}
.section__head{ margin-bottom:clamp(32px,5vw,52px); max-width:680px; }
.section__head h2{ font-size:clamp(28px,3.8vw,40px); margin-top:14px; color:var(--ink-900); font-weight:600; }
.section__note{ margin-top:14px; color:var(--ink-500); font-size:15px; max-width:520px; }
.tag-mono{
  font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--blue-700);
  display:inline-block; padding-bottom:6px;
  border-bottom:1px solid var(--line-strong);
}

/* ============ About ============ */
.about__grid{ display:grid; grid-template-columns:1.2fr 1fr; gap:clamp(32px,5vw,56px); }
.about__text p{ color:var(--ink-700); margin-bottom:18px; font-size:16px; }
.about__text .about__lead{ font-size:19.5px; color:var(--ink-900); font-family:var(--display); font-style:italic; font-weight:500; line-height:1.55; margin-bottom:26px; }
.about__text em{ color:var(--blue-700); font-style:normal; }

.stats{ display:grid; grid-template-columns:1fr 1fr; gap:12px; align-content:start; }
.stat{
  background:var(--card); padding:26px 22px; border-radius:var(--radius-md);
  border:1px solid var(--line); box-shadow:var(--shadow-soft);
  transition:border-color 0.3s ease, box-shadow 0.3s ease;
}
.stat:hover{ border-color:var(--blue-500); box-shadow:var(--shadow-lift); }
.stat--link{ position:relative; cursor:pointer; display:block; }
.stat--link::after{
  content:'↗'; position:absolute; top:12px; right:14px;
  font-family:var(--mono); font-size:13px; color:var(--ink-500);
  transition:color 0.3s ease, transform 0.3s ease;
}
.stat--link:hover::after{ color:var(--blue-700); transform:translate(2px,-2px); }
.stat--link:focus-visible{ outline:2px solid var(--blue-500); outline-offset:2px; }
.stat__num{ display:block; font-family:var(--display); font-size:clamp(26px,3vw,34px); color:var(--blue-700); font-weight:700; }
.stat__label{ display:block; margin-top:8px; font-size:12.5px; color:var(--ink-500); line-height:1.45; }

@media (max-width:860px){ .about__grid{ grid-template-columns:1fr; } }

/* ============ Path / Timeline (pinned) ============ */
.path-pin{ position:relative; height:calc(100svh + var(--n, 6) * 33vh); }
.path-sticky{
  position:sticky; top:0; height:100svh;
  display:flex; align-items:center; overflow:hidden;
}
.path-sticky .section{ width:100%; padding-top:0; padding-bottom:0; }
.path-pin--static{ height:auto; }
.path-pin--static .path-sticky{ position:static; height:auto; display:block; overflow:visible; }
.path-pin--static .path-sticky .section{ padding-top:clamp(64px,9vw,104px); padding-bottom:clamp(64px,9vw,104px); }
@media (prefers-reduced-motion: reduce){
  .path-pin{ height:auto; }
  .path-sticky{ position:static; height:auto; display:block; }
  .path-sticky .section{ padding-top:clamp(64px,9vw,104px); padding-bottom:clamp(64px,9vw,104px); }
}

.timeline{ position:relative; padding-top:20px; min-height:420px; }
.timeline__svg path{
  fill:none; stroke:var(--steel-500); stroke-width:2;
  stroke-dasharray:3200; stroke-dashoffset:3200;
  transition:stroke-dashoffset 0.1s linear;
}
.timeline__svg--h{
  position:absolute; left:0; right:0; top:50%; width:100%; height:420px;
  transform:translateY(-50%);
  z-index:0; opacity:0.35; pointer-events:none;
}
.timeline__svg--v{ display:none; }
.timeline__list{
  position:relative; z-index:1;
  list-style:none; margin:0; padding:40px 0 0;
  display:grid; grid-template-columns:repeat(var(--n, 6), minmax(0, 1fr)); gap:18px;
}
.timeline__item{
  display:flex; flex-direction:column; gap:10px;
  padding-top:24px; position:relative;
}
.timeline__item::before{
  content:''; position:absolute; top:0; left:0; width:9px; height:9px;
  border-radius:50%; background:var(--blue-700);
  box-shadow:0 0 0 4px var(--ice-50), 0 0 0 5px var(--line-strong);
}
.timeline__year{ font-family:var(--mono); color:var(--blue-700); font-size:14px; font-weight:700; letter-spacing:0.02em; }
.timeline__item p{ color:var(--ink-500); font-size:13.5px; line-height:1.55; }

@media (max-width:900px){
  .timeline__svg--h{ display:none; }
  .timeline__svg--v{
    display:block;
    position:absolute; inset:0; width:100%; height:100%;
    z-index:0; opacity:0.25; pointer-events:none;
  }
  .timeline__list{ grid-template-columns:1fr; padding-top:12px; gap:14px; }
  .timeline__item{ padding-left:22px; padding-top:0; gap:4px; }
  .timeline__item::before{ top:5px; left:-4.5px; box-shadow:0 0 0 4px var(--ice-50); }
  .timeline__item p{ font-size:12.5px; line-height:1.45; }
  .timeline__year{ font-size:13px; }

  .path-sticky .section__head{ margin-bottom:18px; }
  .path-sticky .section__head h2{ font-size:24px; margin-top:8px; }
  .path-sticky .section__note{ font-size:13px; margin-top:8px; }
}

/* ============ Interests ============ */
.interests{ background:var(--ice-100); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.interests__inner{ max-width:var(--wrap); margin:0 auto; padding:clamp(64px,9vw,104px) clamp(20px,6vw,64px); }

.interests__grid{
  display:grid; grid-template-columns:1.1fr 0.9fr;
  gap:clamp(32px,5vw,64px); align-items:start;
  margin-bottom:clamp(48px,7vw,72px);
}
.interests__text h2{
  font-size:clamp(25px,3.2vw,36px); line-height:1.25; color:var(--ink-900);
  margin:14px 0 18px;
}
.interests__text p{ color:var(--ink-700); font-size:15.5px; line-height:1.7; max-width:520px; }

.interests__tags{ display:flex; flex-wrap:wrap; gap:8px; align-content:start; padding-top:6px; }
.interests__tags span{
  font-family:var(--mono); font-size:12.5px; font-weight:500; color:var(--ink-700);
  background:var(--chip);
  border:1px solid transparent; border-radius:var(--radius-sm); padding:8px 14px;
  transition:border-color 0.3s ease, color 0.3s ease, background 0.3s ease;
}
.interests__tags span:hover{ border-color:var(--blue-500); color:var(--blue-700); background:var(--card); }

.courses__head{ display:inline-block; margin-bottom:22px; }
.courses{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.course{
  background:var(--card); padding:26px 22px; border-radius:var(--radius-md);
  border:1px solid var(--line); box-shadow:var(--shadow-soft);
  transition:border-color 0.3s ease, box-shadow 0.3s ease;
}
.course:hover{ border-color:var(--blue-500); box-shadow:var(--shadow-lift); }
.course__num{
  display:block; margin-bottom:12px;
  font-family:var(--mono); font-size:12px; font-weight:700;
  color:var(--blue-500); letter-spacing:0.08em;
}
.course__num::before{ content:'0'; }
.course h3{ font-size:17px; margin:0 0 10px; color:var(--ink-900); }
.course p{ font-size:13.5px; color:var(--ink-500); line-height:1.55; }
@media (max-width:900px){
  .interests__grid{ grid-template-columns:1fr; }
  .courses{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){ .courses{ grid-template-columns:1fr; } }

/* ============ News ============ */
.feed{ display:flex; flex-direction:column; }
.feed__item{
  display:grid; grid-template-columns:100px 1fr; gap:32px;
  padding:28px 4px; background:transparent;
  border-top:1px solid var(--line);
}
.feed__item:last-child{ border-bottom:1px solid var(--line); }
.feed__date{ font-family:var(--mono); color:var(--blue-700); font-size:14.5px; font-weight:700; padding-top:4px; }
.feed__item h3{ font-size:19px; color:var(--ink-900); margin-bottom:10px; line-height:1.4; }
.feed__item p{ color:var(--ink-500); font-size:14.5px; line-height:1.6; }
.feed__item em{ color:var(--ink-500); font-style:italic; }
@media (max-width:600px){ .feed__item{ grid-template-columns:1fr; gap:8px; } }

/* ============ Achievements ============ */
.awards{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.award{
  background:var(--card); padding:30px 26px; border-radius:var(--radius-md);
  border:1px solid var(--line); border-left:3px solid var(--blue-700);
  box-shadow:var(--shadow-soft);
  transition:border-color 0.3s ease, box-shadow 0.3s ease;
}
.award:hover{ border-color:var(--blue-500); border-left-color:var(--blue-700); box-shadow:var(--shadow-lift); }
.award h3{ font-size:16.5px; color:var(--ink-900); margin-bottom:12px; line-height:1.35; font-weight:600; }
.award p{ font-size:13.5px; color:var(--ink-500); line-height:1.55; }
@media (max-width:860px){ .awards{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .awards{ grid-template-columns:1fr; } }

/* ============ Materials ============ */
.materials__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.material{
  position:relative; display:flex; flex-direction:column;
  background:var(--card); padding:32px 28px 0; border-radius:var(--radius-md);
  border:1px solid var(--line); box-shadow:var(--shadow-soft);
  transition:border-color 0.3s ease, box-shadow 0.3s ease;
}
.material:hover{ border-color:var(--blue-500); box-shadow:var(--shadow-lift); }
.material:has(.material__open:focus-visible){ outline:2px solid var(--blue-500); outline-offset:2px; }
.material h3{ font-size:19px; color:var(--ink-900); margin-bottom:12px; }
.material p{ font-size:14.5px; color:var(--ink-500); line-height:1.6; margin-bottom:18px; }
.material__meta{ font-family:var(--mono); font-size:12px; font-weight:600; color:var(--ink-500); letter-spacing:0.1em; text-transform:uppercase; }
.material__open{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  width:100%; min-height:56px; margin-top:auto; padding:18px 0 20px;
  border:none; border-top:1px solid var(--line); background:none;
  font:600 13.5px/1.3 var(--body); color:var(--blue-700); text-align:left; cursor:pointer;
}
.material__meta + .material__open, .material p + .material__open{ margin-top:22px; }
.material__open::after{ content:''; position:absolute; inset:0; }
.material__open:focus-visible{ outline:none; }
.material__open svg{ flex:none; transition:transform 0.3s ease; }
.material:hover .material__open svg{ transform:translateX(3px); }
.material__count{ font-weight:500; color:var(--ink-500); }
@media (max-width:700px){ .materials__grid{ grid-template-columns:1fr; } }

/* ============ Materials dialog ============ */
html:has(.modal[open]){ overflow:hidden; }
.modal{
  width:min(560px, calc(100vw - 32px)); max-height:min(82vh, 720px);
  padding:0; border:1px solid var(--line); border-radius:var(--radius-md);
  background:var(--card); color:var(--ink-900);
  box-shadow:0 30px 70px -24px rgba(14,32,54,0.4);
}
.modal::backdrop{ background:rgba(14,24,38,0.45); backdrop-filter:blur(3px); }
.modal[open]{ animation:modal-in 0.3s cubic-bezier(.19,1,.22,1); }
.modal[open]::backdrop{ animation:backdrop-in 0.3s ease; }
@keyframes modal-in{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
@keyframes backdrop-in{ from{ opacity:0; } to{ opacity:1; } }

.modal__inner{ display:flex; flex-direction:column; max-height:inherit; padding:18px 28px 28px; }
.modal__top{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 -10px 10px; min-height:44px; }
.modal__back, .modal__close{
  display:inline-flex; align-items:center; gap:8px; min-height:44px;
  border:none; background:none; color:var(--ink-500); cursor:pointer;
  font:600 13px var(--body); border-radius:var(--radius-sm);
  transition:color 0.2s ease, background 0.2s ease;
}
.modal__back{ padding:0 10px; }
.modal__back[hidden]{ display:none; }
.modal__close{ width:44px; justify-content:center; margin-left:auto; }
.modal__back:hover, .modal__close:hover{ color:var(--ink-900); background:var(--ice-100); }
.modal__back:focus-visible, .modal__close:focus-visible{ outline:2px solid var(--blue-500); outline-offset:1px; }

.modal__eyebrow{ align-self:flex-start; margin:0 0 12px; }
.modal__title{ font-size:clamp(22px,3vw,26px); line-height:1.25; color:var(--ink-900); }
.modal__hint{ margin-top:8px; color:var(--ink-500); font-size:14px; }
.modal__list{
  list-style:none; margin:22px 0 0; padding:0;
  display:flex; flex-direction:column; gap:8px;
  overflow-y:auto; overscroll-behavior:contain;
}

.choice, .file{
  display:flex; align-items:center; gap:14px; width:100%; min-height:60px;
  padding:14px 16px; border:1px solid var(--line); border-radius:var(--radius-sm);
  background:var(--ice-50); color:var(--ink-900); text-align:left; cursor:pointer;
  transition:border-color 0.2s ease, background 0.2s ease;
}
.choice:hover, .file:hover{ border-color:var(--blue-500); background:var(--card); }
.choice:focus-visible, .file:focus-visible{ outline:2px solid var(--blue-500); outline-offset:1px; }
.choice svg, .file svg{ flex:none; color:var(--blue-700); margin-left:auto; transition:transform 0.2s ease; }
.choice:hover svg{ transform:translateX(2px); }
.file:hover svg{ transform:translateY(2px); }

.choice__text, .file__text{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.choice__title{ font:600 15.5px/1.3 var(--body); }
.choice__meta, .file__meta{ font-size:12.5px; color:var(--ink-500); }
.file__name{ font:600 15px/1.35 var(--body); overflow-wrap:anywhere; }
.file__ext{
  flex:none; min-width:52px; padding:7px 6px; text-align:center;
  font:700 11px var(--mono); letter-spacing:0.06em; color:var(--blue-700);
  background:var(--chip); border-radius:var(--radius-sm);
}
.modal__empty{
  padding:28px 18px; text-align:center; font-size:14.5px; color:var(--ink-500);
  border:1px dashed var(--line-strong); border-radius:var(--radius-sm);
}

@media (max-width:560px){
  .modal{
    width:100vw; max-width:100vw; max-height:88svh;
    margin:auto 0 0; border-radius:10px 10px 0 0; border-bottom:none;
  }
  .modal[open]{ animation-name:sheet-in; }
  @keyframes sheet-in{ from{ transform:translateY(100%); } to{ transform:none; } }
  .modal__inner{ padding:12px 20px calc(24px + env(safe-area-inset-bottom)); }
}

/* ============ Footer ============ */
.footer{
  border-top:1px solid var(--line);
  background:var(--ice-100);
  padding:clamp(48px,7vw,72px) clamp(20px,6vw,64px) 36px;
}
.footer__grid{
  max-width:var(--wrap); margin:0 auto;
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:32px;
  padding-bottom:40px;
}
.footer__name{ font-family:var(--display); font-size:21px; color:var(--ink-900); margin-bottom:10px; font-weight:600; }
.footer__role{ color:var(--ink-500); font-size:13.5px; line-height:1.6; }
.footer .tag-mono{ margin-bottom:14px; }
.footer p{ margin-bottom:6px; font-size:14.5px; color:var(--ink-700); }
.footer a{ display:inline-block; padding:11px 0; margin:-11px 0; }
.footer a:hover{ color:var(--blue-700); }
.footer__bottom{
  max-width:var(--wrap); margin:0 auto; padding-top:24px;
  border-top:1px solid var(--line);
  font-family:var(--mono); font-size:12px; color:var(--ink-500);
}
@media (max-width:700px){ .footer__grid{ grid-template-columns:1fr; gap:28px; } }