/* Токены сверены с брендбуком МПО ПАО «НК «Роснефть» (brand/Брендбук_3.pdf):
     чёрный #1D1D1B, золото #B79436, серые #A8A8A7 / #E3E3E3,
     градиент #FFE90E → #FECA02 → #F9AF15, шрифт Europe. */
  @font-face{font-family:'Europe';src:url('../fonts/Europe-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap;}
  @font-face{font-family:'Europe';src:url('../fonts/Europe-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap;}
  @font-face{font-family:'Europe';src:url('../fonts/Europe-Italic.ttf') format('truetype');font-weight:400;font-style:italic;font-display:swap;}
  @font-face{font-family:'Europe';src:url('../fonts/Europe-BoldItalic.ttf') format('truetype');font-weight:700;font-style:italic;font-display:swap;}

  :root{
    --night:#1d1d1b;
    --night-2:#262624;
    --night-3:#2f2f2c;
    --aurora:#b79436;
    --aurora-tint:#f5efdd;
    --flare:#f9af15;
    --flare-2:#feca02;
    --flare-3:#ffe90e;
    --flare-tint:#fef6dc;
    --frost:#ffffff;
    --frost-2:#f4f3f1;
    --ink:#1d1d1b;
    --muted:#77726a;
    --line:#e3e3e3;
    --line-dark:rgba(255,255,255,.16);
    --shadow:0 1px 2px rgba(10,10,8,.08), 0 18px 38px -20px rgba(10,10,8,.35);
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --frost:#161613;
      --frost-2:#201f1c;
      --ink:#f2efe6;
      --muted:#b6b0a2;
      --line:#38362f;
      --night:#0e0e0c;
      --night-2:#161513;
      --night-3:#1c1b18;
      --aurora-tint:#2a2415;
      --flare-tint:#2a2410;
      --shadow:0 1px 2px rgba(0,0,0,.5), 0 18px 40px -18px rgba(0,0,0,.7);
    }
  }
  :root[data-theme="dark"]{
    --frost:#161613; --frost-2:#201f1c; --ink:#f2efe6; --muted:#b6b0a2; --line:#38362f;
    --night:#0e0e0c; --night-2:#161513; --night-3:#1c1b18; --aurora-tint:#2a2415; --flare-tint:#2a2410;
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 18px 40px -18px rgba(0,0,0,.7);
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth; overflow-x:hidden;}
  body{margin:0;background:var(--frost);color:var(--ink);font-family:'Europe',system-ui,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased; overflow-x:hidden;}
  /* Ямальский орнамент — еле заметная подложка всей страницы. Слой
     зафиксирован во вьюпорте и уходит под контент (z-index:-1), сверху
     прикрыт градиентной маской, чтобы в середине экрана, где текст,
     узор почти пропадал. Золотой тон читается и на светлой, и на тёмной теме. */
  body::before{
    content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
    background:url("../images/ornament/yamal-ornament.svg") repeat;
    background-size:200px auto;
    opacity:.05;
    -webkit-mask-image:linear-gradient(180deg, #000 0%, transparent 45%, transparent 55%, #000 100%);
    mask-image:linear-gradient(180deg, #000 0%, transparent 45%, transparent 55%, #000 100%);
  }
  h1,h2,h3,h4{font-family:'Europe',system-ui,sans-serif;font-weight:700;margin:0;color:inherit;text-wrap:balance;}
  p{margin:0;max-width:62ch;}
  a{color:inherit;text-decoration:none;}
  button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;}
  ul{margin:0;padding:0;list-style:none;}
  img,svg{display:block;}
  :focus-visible{outline:2px solid var(--flare);outline-offset:2px;}
  .mono{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-variant-numeric:tabular-nums;}
  .shell{max-width:1180px;margin:0 auto;padding:0 32px;}
  @media (max-width:720px){.shell{padding:0 18px;}}

  /* ---------- utility bar ---------- */
  .utility{background:var(--night);color:#d6d2c8;font-size:12.5px;}
  .utility .row{display:flex;align-items:center;justify-content:space-between;height:38px;gap:20px;}
  .utility .left,.utility .right{display:flex;align-items:center;gap:20px;}
  .utility a{display:flex;align-items:center;gap:6px;opacity:.92;}
  .utility a:hover{color:#fff;}
  .utility svg{width:13px;height:13px;flex:none;opacity:.85;}
  .utility .divider{width:1px;height:14px;background:var(--line-dark);}
  @media (max-width:860px){.utility .left span.addr{display:none;}}

  /* ---------- main nav ---------- */
  header.mainnav{
    background:var(--night-2);border-bottom:1px solid var(--line-dark);
    position:sticky;top:0;z-index:40;
    transform:translateY(0); transition:transform .28s cubic-bezier(.4,0,.2,1), box-shadow .28s ease;
  }
  header.mainnav.nav-hidden{transform:translateY(-100%);}
  @media (prefers-reduced-motion: reduce){header.mainnav{transition:none;}}
  .nav-row{display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px;}
  .brand{display:flex;align-items:center;gap:16px;color:#f6f3ea;}
  .brand .mark{width:48px;height:48px;border-radius:50%;flex:none;background:#fff;padding:2px;}
  .brand .mark img{width:100%;height:100%;object-fit:contain;display:block;border-radius:50%;}
  .brand .word{line-height:1.15;}
  .brand .word b{display:block;font-family:'Europe';font-weight:700;font-size:14px;letter-spacing:.01em;text-transform:uppercase;white-space:nowrap;}
  .brand .word span{display:block;font-size:11px;color:#b8ad8f;font-family:ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.02em;}

  /* «Нефтегазстройпрофсоюз России» — одно длинное неразрывное слово,
     на узких экранах оно упирается в кнопку и вываливает хедер за
     пределы экрана. На совсем узких экранах убираем подпись и сжимаем
     кнопку/бургер, чтобы шапка гарантированно помещалась. */
  @media (max-width:420px){
    .brand .word span{display:none;}
    .nav-row{gap:10px;}
    .navcta{gap:8px;}
    .navcta .btn-flare{padding:9px 13px; font-size:12px;}
  }

  nav.primary{display:flex;align-items:center;gap:2px;flex:1;justify-content:center;}
  .navitem{position:relative;}
  .navlink{
    display:flex;align-items:center;gap:5px;
    padding:14px 11px;
    font-size:14px;font-weight:600;color:#e7ece9;
    border-radius:8px;
    white-space:nowrap;
  }
  .navlink svg{width:10px;height:10px;transition:transform .15s ease;opacity:.75;}
  .navitem:hover .navlink, .navitem.open .navlink{background:rgba(255,255,255,.07);color:#fff;}
  .navitem.open .navlink svg{transform:rotate(180deg);}

  .navcta{display:flex;align-items:center;gap:12px;flex:none;}
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    font-size:13.5px;font-weight:700;
    padding:11px 18px;border-radius:100px;
    white-space:nowrap;
  }
  .btn-flare{background:var(--flare);color:#241905;}
  .btn-flare:hover{background:var(--flare-2);}
  .btn-ghost{border:1px solid rgba(255,255,255,.28);color:#f3efe2;}
  .btn-ghost:hover{border-color:#fff;}
  .burger{display:none;width:38px;height:38px;border-radius:8px;align-items:center;justify-content:center;color:#f3efe2;}
  .burger svg{width:20px;height:20px;}

  /* ---------- mega menu ---------- */
  .mega{
    position:absolute; top:calc(100% + 1px); left:50%; transform:translateX(-50%);
    width:640px; max-width:90vw;
    background:var(--frost); color:var(--ink);
    border:1px solid var(--line); border-radius:14px;
    box-shadow:0 24px 60px -20px rgba(6,12,14,.45);
    padding:22px; display:none;
    grid-template-columns:1fr 1fr 1.1fr; gap:6px 22px;
  }
  .navitem.open .mega{display:grid;}
  .mega-col .label{
    font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase;
    color:var(--muted); margin-bottom:10px; display:block;
  }
  .mega-col a{
    display:block; padding:7px 8px; margin:0 -8px; border-radius:7px;
    font-size:14px; font-weight:500; color:var(--ink);
  }
  .mega-col a:hover{background:var(--frost-2); color:var(--night);}
  .mega.mega-simple{width:280px; grid-template-columns:1fr; padding:14px;}
  .mega.mega-two-col{width:440px; grid-template-columns:1fr 1fr;}
  .mega-simple .mega-col a{display:flex; align-items:center; gap:10px;}
  .org-logo{width:22px; height:22px; object-fit:contain; border-radius:5px; flex:none; background:#fff; border:1px solid var(--line);}

  /* mobile nav */
  .mobile-panel{display:none;}
  @media (max-width:980px){
    nav.primary{display:none;}
    .navcta .btn-ghost{display:none;}
    .burger{display:flex;}
    .mega{position:static; transform:none; width:auto; max-width:none; box-shadow:none; grid-template-columns:1fr; margin-top:8px;}
    .mobile-panel{
      display:block; background:var(--night-2); border-top:1px solid var(--line-dark);
      max-height:0; overflow:hidden; transition:max-height .25s ease;
    }
    .mobile-panel.open{max-height:1400px;}
    .mobile-panel .shell{padding:18px 18px 26px;}
    .m-navitem{border-bottom:1px solid var(--line-dark);}
    .m-navlink{
      width:100%; display:flex; justify-content:space-between; align-items:center;
      padding:14px 4px; color:#f3efe2; font-weight:600; font-size:15px;
      white-space:nowrap;
    }
    .m-navlink svg{width:11px;height:11px;transition:transform .15s ease;}
    .m-navitem.open .m-navlink svg{transform:rotate(180deg);}
    .m-sub{display:none; padding:0 4px 14px; display:none;}
    .m-navitem.open .m-sub{display:block;}
    .m-sub a{display:flex; align-items:center; gap:10px; padding:8px 0; color:#cfe0da; font-size:14px;}
    .m-cta{margin-top:16px; display:flex; flex-direction:column; gap:10px;}
    .m-cta .btn{justify-content:center;}
  }

  /* ---------- hero ---------- */
  /* Фон — фирменное фото (сотрудница на промысле + резервуары «Роснефть»),
     переведённое в жёлто-чёрный дуотон и положенное едва заметным прозрачным
     слоем под шапкой; тёмный градиент поверх (уже не сплошной, а rgba) даёт
     фото проступить, не мешая читать заголовок. */
  .hero{
    position:relative; overflow:hidden;
    background:
      radial-gradient(720px 420px at 82% -10%, rgba(183,148,54,.22), transparent 60%),
      radial-gradient(900px 560px at 8% 115%, rgba(249,175,21,.10), transparent 62%),
      radial-gradient(480px 480px at 60% 40%, rgba(183,148,54,.05), transparent 70%),
      linear-gradient(155deg, rgba(29,29,27,.93) 0%, rgba(47,47,44,.90) 60%, rgba(51,41,26,.90) 130%),
      url('../images/bg/hero-duotone.jpg') left 40%/cover no-repeat;
    color:#f3efe2;
  }
  .hero-grid{
    display:grid; grid-template-columns:1.15fr .85fr; gap:48px; align-items:stretch;
    padding:54px 0 46px;
  }
  @media (max-width:920px){.hero-grid{grid-template-columns:1fr; padding:48px 0 40px;}}
  .eyebrow{
    display:inline-flex; align-items:center; gap:9px;
    font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:12px; letter-spacing:.09em; text-transform:uppercase;
    color:#e3cf8f; margin-bottom:20px;
  }
  .eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--flare);}
  .hero h1{font-size:clamp(32px,4.4vw,50px); font-weight:700; line-height:1.08; color:#faf7ec;}
  .hero .lede{margin-top:20px; font-size:17px; color:#d8d4c8; max-width:52ch;}
  .hero-actions{display:flex; gap:14px; margin-top:30px; flex-wrap:wrap;}
  .hero-actions .btn{padding:13px 24px; font-size:14.5px;}

  .hero-card{
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.14);
    border-radius:16px; padding:26px; backdrop-filter:blur(6px);
    display:flex; flex-direction:column;
  }
  .hero-card .go{
    margin-top:auto; padding-top:18px; font-size:13px; font-weight:700; color:var(--flare-2);
    display:flex; align-items:center; gap:6px;
  }
  .hero-card .since{
    margin-top:14px; display:inline-block; align-self:flex-start;
    font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px;
    background:rgba(255,255,255,.08); color:#e3cf8f; padding:4px 10px; border-radius:100px;
  }
  .hero-card .reach{
    margin-top:18px; padding-top:16px; border-top:1px solid rgba(255,255,255,.14);
    display:flex; flex-direction:column; gap:9px;
  }
  .hero-card .reach .label{
    font-size:10.5px; color:#9c9484; text-transform:uppercase; letter-spacing:.04em;
    font-family:ui-monospace,'SF Mono',Menlo,monospace;
  }
  .hero-card .reach a{display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:#f3efe2;}
  .hero-card .reach a:hover{color:var(--flare-2);}
  .hero-card .reach a svg{width:15px;height:15px;color:var(--flare-2); flex:none;}
  .hero-card .chief{display:flex; gap:14px; align-items:center;}
  .avatar{
    width:56px;height:56px;border-radius:50%; flex:none;
    background:linear-gradient(150deg,var(--flare),#a86416);
    display:flex;align-items:center;justify-content:center;
    font-family:'Europe'; font-weight:800; color:#241905; font-size:19px;
    overflow:hidden;
  }
  .avatar img{width:100%;height:100%;object-fit:cover;display:block;}
  .hero-card .chief b{display:block;font-size:15px;color:#faf7ec;}
  .hero-card .chief span{display:block;font-size:12.5px;color:#b8ad8f;margin-top:2px;}
  .hero-card .quote{
    margin-top:16px; font-size:13.5px; color:#e6e1d3; line-height:1.55;
    border-left:2px solid var(--flare); padding-left:14px;
  }
  .hero-card .quote .ph{
    display:inline-block; margin-top:8px; font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:10.5px;
    color:var(--flare-2); letter-spacing:.03em;
  }

  /* ---------- stat band ---------- */
  .statband{background:var(--night-3); border-top:1px solid var(--line-dark);}
  .stat-row{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-dark);}
  @media (max-width:720px){.stat-row{grid-template-columns:repeat(2,1fr);}}
  .stat{background:var(--night-3); padding:24px 8px; text-align:center;}
  .stat .n{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-weight:600; font-size:26px; color:var(--flare-2);}
  .stat .l{font-size:12.5px; color:#c4beac; margin-top:6px; max-width:20ch; margin-inline:auto;}

  /* ---------- section shell ---------- */
  section.block{padding:52px 0; position:relative;}
  section.block::before{
    content:""; position:absolute; top:0; left:0; right:0; height:1px;
    background:linear-gradient(90deg,transparent,var(--line) 20%,var(--line) 80%,transparent);
  }
  section.block.no-seam::before{display:none;}

  /* Секция с лёгкой серой подложкой — мягкий переход, а не жёсткая граница
     белое/серое (в духе фирменных материалов ТЭК: градиент-затухание по
     краям вместо обрезанного прямоугольника). */
  .section-tint{
    padding-top:48px; padding-bottom:48px;
    background:linear-gradient(180deg, var(--frost) 0%, var(--frost-2) 14%, var(--frost-2) 86%, var(--frost) 100%);
  }
  .section-tint::before{display:none;}

  /* Секция-приглашение: серый фон как в шапке + фирменная волна из брендбука
     (стр. 07), перекрашенная в корпоративную серо-бело-коричневую палитру
     (чёрный #1D1D1B, золото-бронза #B79436, серый #A8A8A7/#E3E3E3 — те же
     токены, что на слайде «Основные цвета») и положенная под форму на 50%
     непрозрачности — узнаваемый рисунок волны, но без жёлтого. */
  .section-invite{
    overflow:hidden;
    background:linear-gradient(180deg, var(--night-2) 0%, var(--night-3) 100%);
  }
  .section-invite::before{
    content:""; position:absolute; left:-8%; right:-8%; bottom:0; height:55%;
    background:radial-gradient(60% 100% at 50% 100%, rgba(183,148,54,.30), rgba(183,148,54,.10) 48%, transparent 74%);
    filter:blur(34px); pointer-events:none; z-index:0;
  }
  .section-invite::after{
    content:""; position:absolute; left:0; right:0; top:0; bottom:0;
    background:url("../images/bg/waves-strip-grey.jpg") center 72%/cover no-repeat;
    opacity:.5;
    -webkit-mask-image:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.6) 14%, #000 30%);
    mask-image:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.6) 14%, #000 30%);
    pointer-events:none; z-index:0;
  }
  .section-invite .shell{position:relative; z-index:1;}
  .section-invite .head{color:#f3efe2;}
  .section-invite .head h2{color:#faf7ec;}
  .section-invite .head p{color:#cfc9ba;}

  /* Обратная связь — за формой фирменный бланк (брендбук, стр. 16): слева,
     эмблемой МПО «Роснефть» в просвет рядом с панелью, правый край растворяется. */
  .section-feedback{overflow:hidden;}
  .section-feedback::after{
    content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
    background:url("../images/bg/blank-mockup.jpg") left center/contain no-repeat;
    opacity:.22;
    -webkit-mask-image:linear-gradient(90deg, #000 0 42%, transparent 78%);
    mask-image:linear-gradient(90deg, #000 0 42%, transparent 78%);
  }
  .section-feedback .shell{position:relative; z-index:1;}

  /* ---------- анкета вступления ---------- */
  .invite-form{
    margin:34px auto 0; max-width:760px;
    background:rgba(29,29,27,.72); border:1px solid rgba(255,255,255,.16); border-radius:16px;
    padding:30px 32px; backdrop-filter:blur(8px);
  }
  .invite-form .grid{display:grid; grid-template-columns:1fr 1fr; gap:18px 20px;}
  @media (max-width:640px){.invite-form .grid{grid-template-columns:1fr;}}
  .invite-form .field.full{grid-column:1 / -1;}
  .invite-form label{
    display:block; font-size:12.5px; color:#cfc9ba; margin-bottom:7px;
    font-family:ui-monospace,'SF Mono',Menlo,monospace; letter-spacing:.02em;
  }
  .invite-form label .req{color:var(--flare-2);}
  .invite-form input, .invite-form select{
    width:100%; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.2);
    border-radius:8px; padding:11px 13px; font:inherit; font-size:14.5px; color:#f3efe2;
  }
  .invite-form input::placeholder{color:#8f8a7c;}
  .invite-form select{appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23cfc9ba' stroke-width='1.6' d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 13px center;}
  .invite-form input:focus, .invite-form select:focus{outline:none; border-color:var(--flare); background:rgba(255,255,255,.11);}
  .invite-form .consent{margin-top:20px; font-size:12.5px; color:#9c9484; line-height:1.5; max-width:56ch;}
  .invite-form .submit-row{margin-top:18px; display:flex; align-items:center; gap:16px; flex-wrap:wrap;}

  /* ---------- форма обратной связи — тёмная панель + форма, в духе
     остальных «карточек-разворотов» сайта (новости, афиша) ---------- */
  .feedback-panel{
    display:grid; grid-template-columns:.85fr 1.15fr;
    max-width:900px; margin:0 auto;
    border-radius:20px; overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow);
  }
  @media (max-width:820px){.feedback-panel{grid-template-columns:1fr;}}

  .feedback-side{
    position:relative; overflow:hidden;
    background:
      radial-gradient(420px 260px at 15% 110%, rgba(183,148,54,.20), transparent 60%),
      linear-gradient(165deg, var(--night) 0%, var(--night-3) 55%, #33291a 140%);
    color:#f3efe2; padding:36px; display:flex; flex-direction:column; justify-content:space-between; gap:28px;
  }
  .feedback-side .tag{
    font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase;
    color:var(--flare-2);
  }
  .feedback-side h3{font-size:22px; font-weight:700; color:#faf7ec; margin-top:10px; line-height:1.25;}
  .feedback-side p{margin-top:12px; font-size:14px; color:#cfc9ba; max-width:34ch;}
  .feedback-side-contacts{display:grid; gap:12px;}
  .feedback-side-contacts a{display:flex; align-items:center; gap:10px; font-size:13.5px; font-weight:600; color:#f3efe2;}
  .feedback-side-contacts a:hover{color:var(--flare-2);}
  .feedback-side-contacts a svg{width:16px;height:16px;color:var(--flare-2); flex:none;}

  .feedback-form{background:#fff; padding:34px 36px;}
  .feedback-form .grid{display:grid; grid-template-columns:1fr 1fr; gap:18px 20px;}
  @media (max-width:640px){.feedback-form .grid{grid-template-columns:1fr;}}
  .feedback-form .field.full{grid-column:1 / -1;}
  .feedback-form label{
    display:block; font-size:12.5px; color:var(--muted); margin-bottom:7px;
    font-family:ui-monospace,'SF Mono',Menlo,monospace; letter-spacing:.02em;
  }
  .feedback-form label .req{color:var(--flare);}
  .feedback-form input, .feedback-form select, .feedback-form textarea{
    width:100%; background:var(--frost-2); border:1px solid var(--line);
    border-radius:8px; padding:11px 13px; font:inherit; font-size:14.5px; color:var(--ink);
    transition:border-color .15s ease, background .15s ease;
  }
  .feedback-form textarea{resize:vertical; min-height:104px;}
  .feedback-form select{
    appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%236f6a5b' stroke-width='1.6' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 13px center;
  }
  .feedback-form input::placeholder, .feedback-form textarea::placeholder{color:#a39c8a;}
  .feedback-form input:focus, .feedback-form select:focus, .feedback-form textarea:focus{outline:none; border-color:var(--flare); background:#fff;}
  .feedback-form .consent{margin-top:16px; font-size:12px; color:var(--muted); max-width:56ch;}
  .feedback-form .submit-row{margin-top:16px;}
  .feedback-form .submit-row .btn{width:100%; justify-content:center;}
  @media (min-width:481px){.feedback-form .submit-row .btn{width:auto;}}

  /* Едва заметный золотой блик сверху — перекликается с бликом в герое,
     чтобы светлые и тёмные секции читались как единая система, а не
     нарезка случайных прямоугольников. */
  .section-glow{background:radial-gradient(900px 420px at 85% -12%, rgba(183,148,54,.07), transparent 60%);}
  .section-glow::after{
    content:""; position:absolute; inset:0; z-index:-1;
    background:url('../images/about-bg.webp') center/cover no-repeat;
    opacity:.09; pointer-events:none;
  }

  .head{max-width:640px; margin-bottom:28px;}
  .head-center{margin-left:auto; margin-right:auto; text-align:center;}
  .kicker{
    font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:12px; letter-spacing:.09em; text-transform:uppercase;
    color:var(--aurora); display:block; margin-bottom:10px;
  }
  .head h2{font-size:29px; font-weight:700;}
  .head p{margin-top:12px; color:var(--muted); font-size:15.5px;}

  /* ---------- about / leadership ---------- */
  .about-grid{display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:start;}
  @media (max-width:860px){.about-grid{grid-template-columns:1fr;}}
  .fact-list{display:grid; gap:14px; margin-top:26px;}
  .fact{display:flex; gap:14px; padding:14px 0; border-top:1px solid var(--line);}
  .fact:first-child{border-top:none; padding-top:0;}
  .fact .y{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-weight:600; color:var(--night-2); font-size:13.5px; width:64px; flex:none;}
  .fact .t{font-size:14.5px; color:var(--ink);}

  .emblem-row{
    display:flex; align-items:center; gap:22px;
    margin-top:30px; padding-top:26px; border-top:1px solid var(--line);
  }
  .emblem-row .emblem{width:96px;height:96px;border-radius:50%;flex:none;}
  .emblem-row .group-badge{
    background:#fff; border:1px solid var(--line); border-radius:10px;
    padding:10px 14px; display:flex; align-items:center;
  }
  .emblem-row .group-badge img{width:110px;height:auto;display:block;}

  .lead-card{
    background:#fff; border:1px solid var(--line); border-radius:16px; padding:28px;
    box-shadow:var(--shadow); display:flex; flex-direction:column;
  }
  .lead-card .reach{
    margin-top:22px; padding-top:20px; border-top:1px solid var(--line);
    display:flex; flex-direction:column; gap:10px;
  }
  .lead-card .reach .label{font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; font-family:ui-monospace,'SF Mono',Menlo,monospace;}
  .lead-card .reach a{
    display:flex; align-items:center; gap:9px; font-size:13.5px; font-weight:600; color:var(--ink);
  }
  .lead-card .reach a:hover{color:var(--flare);}
  .lead-card .reach a svg{width:16px;height:16px;color:var(--aurora); flex:none;}
  @media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .lead-card{background:var(--frost-2);}}
  :root[data-theme="dark"] .lead-card{background:var(--frost-2);}
  .lead-card .top{display:flex; gap:16px; align-items:center;}
  .lead-card .avatar{width:64px;height:64px;font-size:22px;}
  .lead-card .top b{display:block;font-size:17px;}
  .lead-card .top span{display:block;font-size:13px;color:var(--muted);margin-top:3px;}
  .lead-card .since{
    margin-top:6px; display:inline-block; font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px;
    background:var(--aurora-tint); color:#1c6b5e; padding:3px 9px; border-radius:100px;
  }
  .lead-card .quote{margin-top:18px; font-size:14.5px; color:var(--ink); line-height:1.6; font-style:italic;}
  .lead-card .quote .ph{display:block;margin-top:10px;font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:11px;color:var(--muted);font-style:normal;}

  /* ---------- advantages ---------- */
  .cards{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:8px;}
  @media (max-width:920px){.cards{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:560px){.cards{grid-template-columns:1fr;}}
  .card{
    background:#fff; border:1px solid var(--line); border-radius:14px; padding:22px;
  }
  :root[data-theme="dark"] .card, @media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .card{background:var(--frost-2);}}
  .card .icon{width:40px;height:40px;margin-bottom:16px;}
  .card .icon img{width:40px;height:40px;object-fit:contain;}
  .card h3{font-size:15.5px;font-weight:700;}
  .card p{font-size:13.5px;color:var(--muted);margin-top:8px;}

  /* ---------- news ---------- */
  .news-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:20px;}
  @media (max-width:860px){.news-grid{grid-template-columns:1fr;}}
  .news-card{border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#fff;}
  :root[data-theme="dark"] .news-card, @media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .news-card{background:var(--frost-2);}}
  .news-card .ph-img{
    height:150px; background:linear-gradient(135deg,var(--night-3),var(--night)); position:relative;
  }
  .news-card .ph-img::after{
    content:"пример изображения"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:10.5px; color:rgba(255,255,255,.5); letter-spacing:.04em;
  }
  .news-card .body{padding:18px;}
  .news-card .cat{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:10.5px; color:var(--aurora); text-transform:uppercase; letter-spacing:.05em;}
  .news-card h4{font-size:15px; font-weight:700; margin-top:8px; line-height:1.35;}
  .news-card .date{font-size:12px; color:var(--muted); margin-top:10px;}

  /* ---------- новости — свайп-карусель ---------- */
  .news-nav{display:flex; gap:8px; flex:none;}
  .news-nav button{
    width:38px;height:38px;border-radius:50%; flex:none;
    border:1px solid var(--line); color:var(--ink);
    display:flex; align-items:center; justify-content:center;
  }
  .news-nav button:hover{border-color:var(--flare); color:var(--flare);}
  .news-nav button svg{width:16px;height:16px;}

  .news-scroll{
    display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x mandatory;
    padding:2px 2px 14px; margin:0 -2px;
    scrollbar-width:thin; scrollbar-color:var(--line) transparent;
  }
  .news-scroll::-webkit-scrollbar{height:7px;}
  .news-scroll::-webkit-scrollbar-track{background:transparent;}
  .news-scroll::-webkit-scrollbar-thumb{background:var(--line); border-radius:10px;}

  .news-feature{
    flex:0 0 auto; width:min(560px,88vw); scroll-snap-align:start;
    display:flex; flex-direction:column;
    border:1px solid var(--line); border-radius:16px; overflow:hidden;
    background:#fff; box-shadow:var(--shadow);
  }
  .news-feature .cover{aspect-ratio:16/10; overflow:hidden; background:var(--night); flex:none;}
  .news-feature .cover img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;}
  .news-feature .body{padding:26px;}
  .news-feature .cat{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px; color:var(--aurora); text-transform:uppercase; letter-spacing:.05em;}
  .news-feature h3{font-size:19px; font-weight:700; margin-top:10px; line-height:1.28;}
  .news-feature .date{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11.5px; color:var(--muted); margin-top:10px;}
  .news-feature p.text{margin-top:14px; font-size:14px; color:var(--ink); line-height:1.6;}
  .news-gallery{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:18px;}
  .news-gallery.g5{grid-template-columns:repeat(5,1fr);}
  .news-gallery img{width:100%; aspect-ratio:1; object-fit:cover; border-radius:8px; display:block;}

  /* ---------- афиша / анонс мероприятия ---------- */
  .event-card{
    display:grid; grid-template-columns:1fr 1.3fr; gap:0;
    border-radius:16px; overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow);
  }
  @media (max-width:860px){.event-card{grid-template-columns:1fr;}}
  .event-card .art{
    position:relative; aspect-ratio:1;
    background:linear-gradient(155deg,var(--flare-3) 0%,var(--flare-2) 45%,var(--flare) 100%);
    display:flex; flex-direction:column; justify-content:space-between; padding:26px;
  }
  .event-card .art img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
  .event-card .art .art-tag{
    align-self:flex-start; background:var(--night); color:#f3efe2;
    font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase;
    padding:6px 12px; border-radius:100px; position:relative; z-index:1;
  }
  .event-card .art h4{
    position:relative; z-index:1; color:#22160a; font-size:26px; line-height:1.12;
    text-shadow:0 1px 0 rgba(255,255,255,.25);
  }
  .event-card .body{padding:30px; display:flex; flex-direction:column;}
  .event-card .cat{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px; color:var(--aurora); text-transform:uppercase; letter-spacing:.05em;}
  .event-card h3{font-size:21px; font-weight:700; margin-top:10px; line-height:1.28;}
  .event-card p.lead{margin-top:12px; font-size:14.5px; color:var(--muted); line-height:1.6;}
  .event-card .facts{list-style:none; margin:18px 0 0; padding:0; display:grid; gap:9px;}
  .event-card .facts li{display:flex; gap:10px; font-size:14px; color:var(--ink); align-items:flex-start;}
  .event-card .facts li svg{width:17px;height:17px;flex:none;margin-top:2px;color:var(--aurora);}
  .event-card .where{
    margin-top:20px; padding-top:18px; border-top:1px solid var(--line);
    display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  }
  .event-card .where .loc{display:flex; align-items:center; gap:8px; font-size:14px; font-weight:600;}
  .event-card .where .loc svg{width:16px;height:16px;color:var(--flare);}
  .event-card .members-only{
    font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px; color:var(--muted);
    background:var(--frost-2); padding:5px 10px; border-radius:100px;
  }

  /* ---------- афиша: список + календарь рядом ---------- */
  /* Ряд «Афиши»: слева — лента анонсов (свайпается, по 2 видно), справа —
     календарь. Календарь в ленту не входит и не скроллится — стоит
     статично третьим блоком, вровень по высоте. */
  .afisha-row{display:flex; gap:20px; align-items:stretch;}
  @media (max-width:760px){.afisha-row{flex-direction:column;}}

  /* flex:0 0 auto — блок не растягивается на свободное место во flex-строке
     (afisha-row), иначе лента с фиксированной шириной повисает в середине
     и стрелки-«шарики» (привязанные к краю блока) съезжают несимметрично:
     левая ложится на карточку, а правая улетает в пустоту у календаря.
     Боковые паддинги — выделенные «карманы» для стрелок за пределами самих
     карточек, симметричные с обеих сторон. */
  .events-list-wrap{position:relative; flex:0 0 auto; min-width:0; padding:0 46px;}
  .scroll-hint{
    /* центр — по высоте квадратной картинки постера (min(360px,84vw) ширина
       карточки, картинка 1:1 — половина и есть её вертикальный центр),
       а не по всей карточке, иначе стрелка ложится поверх заголовка текста. */
    position:absolute; top:min(180px, 42vw); right:3px; transform:translateY(-50%); z-index:2;
    width:40px;height:40px;border-radius:50%; flex:none;
    background:#fff; border:1px solid var(--line); box-shadow:var(--shadow);
    display:flex; align-items:center; justify-content:center; color:var(--ink);
    animation:hintNudge 1.8s ease-in-out infinite;
  }
  .scroll-hint:hover{background:var(--frost-2); border-color:var(--flare); color:var(--flare);}
  .scroll-hint svg{width:18px;height:18px;}
  .scroll-hint.left{right:auto; left:3px; animation-name:hintNudgeLeft;}
  @keyframes hintNudge{0%,100%{transform:translateY(-50%) translateX(0);} 50%{transform:translateY(-50%) translateX(4px);}}
  @keyframes hintNudgeLeft{0%,100%{transform:translateY(-50%) translateX(0);} 50%{transform:translateY(-50%) translateX(-4px);}}
  @media (prefers-reduced-motion: reduce){.scroll-hint{animation:none;}}
  @media (max-width:760px){.scroll-hint{display:none;}}

  /* Ровно 2 карточки анонса в ленте — ширина считается по ним, третья не
     торчит краем; лишнее (3+ анонсы) листается свайпом/стрелкой внутри
     этой же ширины. */
  .events-list{
    flex:0 1 auto; min-width:0;
    width:calc(360px * 2 + 20px);
    max-width:100%;
    display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x mandatory; align-items:stretch;
    padding:2px 2px 14px; margin:0 -2px;
    scrollbar-width:thin; scrollbar-color:var(--line) transparent;
  }
  .events-list::-webkit-scrollbar{height:7px;}
  .events-list::-webkit-scrollbar-track{background:transparent;}
  .events-list::-webkit-scrollbar-thumb{background:var(--line); border-radius:10px;}
  .events-list .event-card{
    flex:0 0 auto; width:min(360px, 84vw); scroll-snap-align:start;
    grid-template-columns:1fr;
  }

  /* Календарь — занимает всю оставшуюся третью область, вровень по высоте
     с лентой анонсов (не торчит обрезком карточки). */
  .event-calendar{
    flex:1 1 260px; min-width:260px; max-width:420px;
    display:flex; flex-direction:column;
    background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px;
    box-shadow:var(--shadow);
  }
  @media (max-width:760px){.event-calendar{flex:0 0 auto; width:100%; max-width:none;}}
  .cal-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;}
  .cal-title{font-weight:700; font-size:15px;}
  .cal-nav{width:32px;height:32px;border-radius:50%; border:1px solid var(--line); flex:none; display:flex; align-items:center; justify-content:center; color:var(--ink);}
  .cal-nav:hover{border-color:var(--flare); color:var(--flare);}
  .cal-nav svg{width:14px;height:14px;}
  .cal-weekdays{display:grid; grid-template-columns:repeat(7,1fr); text-align:center; font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:10.5px; letter-spacing:.02em; color:var(--muted); text-transform:uppercase; margin-bottom:10px;}
  .cal-grid{display:grid; grid-template-columns:repeat(7,1fr); row-gap:14px; column-gap:5px; touch-action:pan-y;}
  .cal-day{
    position:relative; aspect-ratio:.82; display:flex; align-items:center; justify-content:center;
    font-size:17px; font-weight:500; border-radius:9px; color:var(--ink);
  }
  .cal-day.blank{visibility:hidden;}
  .cal-day.today{background:var(--frost-2); font-weight:700;}
  .cal-day.has-event{cursor:pointer; font-weight:700; background:var(--flare-tint); color:#7a5306;}
  .cal-day.has-event:hover{background:var(--flare-2); color:#241905;}
  .cal-day .dot{position:absolute; bottom:3px; width:5px;height:5px;border-radius:50%; background:var(--flare);}
  .cal-day .hicon{position:absolute; top:-2px; right:-1px; width:14px;height:14px; color:var(--aurora);}
  .cal-day .hicon svg{width:100%;height:100%;display:block;}

  .cal-holidays{margin-top:18px; padding-top:14px; border-top:1px solid var(--line); display:grid; gap:9px;}
  .cal-holidays:empty{display:none;}
  .cal-holidays .h-row{display:flex; align-items:flex-start; gap:9px; font-size:12px; color:var(--ink); line-height:1.4;}
  .cal-holidays .h-row svg{width:15px;height:15px;color:var(--aurora); flex:none; margin-top:1px;}
  .cal-holidays .h-row b{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-weight:600; color:var(--muted); margin-right:2px;}
  .cal-holidays .h-row .h-dot{width:8px;height:8px;border-radius:50%; background:var(--flare); flex:none; margin-top:4px;}
  .cal-holidays .h-row.is-event{cursor:pointer; margin:-4px -6px; padding:4px 6px; border-radius:8px;}
  .cal-holidays .h-row.is-event:hover{background:var(--flare-tint);}

  .cal-legend{display:flex; gap:16px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line); font-size:11px; color:var(--muted); flex-wrap:wrap;}
  .cal-legend .dot{display:inline-block; width:7px;height:7px;border-radius:50%; background:var(--flare); margin-right:6px;}
  .cal-legend .dot.holiday{background:var(--aurora);}

  /* ---------- модалка «Контакты» — карточка председателя поверх блюра ---------- */
  .contact-modal{
    position:fixed; inset:0; z-index:200;
    display:flex; align-items:center; justify-content:center; padding:24px;
    background:rgba(10,10,8,.45); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
    opacity:0; pointer-events:none; transition:opacity .25s ease;
  }
  .contact-modal.open{opacity:1; pointer-events:auto;}
  .contact-modal-card{
    position:relative; width:min(460px, 100%);
    background:var(--night-2); color:#f3efe2;
    border:1px solid rgba(255,255,255,.14); border-radius:20px; padding:32px;
    box-shadow:0 30px 70px -20px rgba(0,0,0,.6);
    transform:scale(.94) translateY(8px); transition:transform .28s cubic-bezier(.2,.8,.2,1);
  }
  .contact-modal.open .contact-modal-card{transform:scale(1) translateY(0);}
  @media (prefers-reduced-motion: reduce){.contact-modal, .contact-modal-card{transition:none;}}
  .contact-modal-close{
    position:absolute; top:16px; right:16px; width:34px;height:34px;border-radius:50%;
    border:1px solid rgba(255,255,255,.18); color:#f3efe2;
    display:flex; align-items:center; justify-content:center;
  }
  .contact-modal-close:hover{border-color:var(--flare); color:var(--flare-2);}
  .contact-modal-close svg{width:16px;height:16px;}
  .contact-modal-card .chief{display:flex; gap:16px; align-items:center;}
  .contact-modal-card .avatar{width:72px;height:72px;font-size:24px;}
  .contact-modal-card .chief b{display:block;font-size:18px;color:#faf7ec;}
  .contact-modal-card .chief span{display:block;font-size:13px;color:#b8ad8f;margin-top:3px;}
  .contact-modal-card .since{margin-top:16px;}
  .contact-modal-card .quote{
    margin-top:18px; font-size:14px; color:#e6e1d3; line-height:1.55;
    border-left:2px solid var(--flare); padding-left:14px;
  }
  .contact-modal-card .reach{margin-top:20px; padding-top:18px;}
  .contact-modal-card .reach a{font-size:14px;}
  .contact-modal-card-links, .contact-modal-card .contact-modal-links{
    margin-top:18px; padding-top:16px; border-top:1px solid rgba(255,255,255,.14);
    display:flex; flex-direction:column; gap:10px;
  }
  .contact-modal-card .contact-modal-links .go{
    font-size:13.5px; font-weight:700; color:var(--flare-2);
    display:flex; align-items:center; gap:6px;
  }
  .contact-modal-card .contact-modal-links .go:hover{color:#fff;}

  /* Карточка, выбранная кликом по дате/строке в календаре, — держит
     золотисто-оранжевую градиентную рамку, пока не выберут другую (не
     разовая вспышка, а постоянная отметка «вот эта»). */
  .event-card.selected{
    border:3px solid transparent; border-radius:16px;
    background-image:
      linear-gradient(#fff,#fff),
      linear-gradient(135deg, var(--flare-3), var(--flare-2) 55%, var(--flare));
    background-origin:border-box; background-clip:padding-box, border-box;
    animation:selectPulse .6s ease;
  }
  @media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .event-card.selected{background-image:linear-gradient(var(--frost-2),var(--frost-2)), linear-gradient(135deg, var(--flare-3), var(--flare-2) 55%, var(--flare));}}
  :root[data-theme="dark"] .event-card.selected{background-image:linear-gradient(var(--frost-2),var(--frost-2)), linear-gradient(135deg, var(--flare-3), var(--flare-2) 55%, var(--flare));}
  @keyframes selectPulse{0%{box-shadow:0 0 0 6px rgba(226,150,47,.35);} 100%{box-shadow:var(--shadow);}}
  @media (prefers-reduced-motion: reduce){.event-card.selected{animation:none;}}

  /* ---------- footer ---------- */
  footer.site{background:var(--night); color:#d6d2c8; border-top:1px solid rgba(183,148,54,.35);}
  .foot-top{padding:56px 0 40px; display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:32px;}
  @media (max-width:820px){.foot-top{grid-template-columns:1fr 1fr; row-gap:32px;}}
  .foot-brand .brand{margin-bottom:14px;}
  .foot-brand p{font-size:13.5px; color:#b6b0a2; max-width:34ch;}
  .foot-col .label{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:#9c9484; margin-bottom:14px; display:block;}
  .foot-col ul{display:grid; gap:9px;}
  .foot-col a{font-size:13.5px; color:#ddd8cb;}
  .foot-col a:hover{color:#fff;}
  .foot-contact{font-size:13.5px; color:#ddd8cb; display:flex; gap:10px; margin-bottom:10px;}
  .foot-contact svg{width:15px;height:15px;flex:none;margin-top:2px;opacity:.8;}
  .foot-bottom{border-top:1px solid var(--line-dark); padding:20px 0; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:12.5px; color:#9c9484;}

  /* ---------- внутренняя шапка страницы (Документы, Контакты и т.п.) ---------- */
  .page-hero{
    padding:52px 0 40px; color:#f3efe2;
    background:
      radial-gradient(640px 320px at 85% -20%, rgba(183,148,54,.16), transparent 60%),
      linear-gradient(200deg, var(--night) 0%, var(--night-3) 60%, #33291a 140%);
  }
  .page-hero .crumb{
    font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:12px; color:#9c9484;
    margin-bottom:14px; display:flex; gap:8px; align-items:center;
  }
  .page-hero .crumb a{color:#cfc9ba;}
  .page-hero .crumb a:hover{color:#fff;}
  .page-hero h1{font-size:clamp(28px,4vw,38px); color:#faf7ec; font-weight:700;}
  .page-hero p{margin-top:12px; color:#cfc9ba; max-width:62ch; font-size:15px;}

  /* ---------- документы ---------- */
  .doc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
  @media (max-width:920px){.doc-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:640px){.doc-grid{grid-template-columns:1fr;}}
  .doc-card{
    background:#fff; border:1px solid var(--line); border-radius:14px; padding:22px;
    display:flex; flex-direction:column; gap:12px;
  }
  .doc-card .icon{width:40px;height:40px; color:var(--aurora);}
  .doc-card .icon svg{width:100%;height:100%;}
  .doc-card h3{font-size:15.5px; font-weight:700;}
  .doc-card p{font-size:13.5px; color:var(--muted); flex:1;}
  .doc-card .status{
    margin-top:auto; padding-top:12px; border-top:1px solid var(--line);
    font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px; color:var(--muted);
    display:flex; align-items:center; gap:6px;
  }
  .doc-card .status.ready{color:var(--aurora);}

  /* ---------- контакты ---------- */
  .contact-grid{display:grid; grid-template-columns:1.1fr 1fr; gap:32px;}
  @media (max-width:860px){.contact-grid{grid-template-columns:1fr;}}
  .contact-list{display:grid; gap:14px;}
  .contact-row{
    display:flex; align-items:flex-start; gap:16px;
    background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px 20px;
  }
  .contact-row .icon{
    width:42px;height:42px; border-radius:10px; flex:none;
    background:var(--flare-tint); color:var(--flare);
    display:flex; align-items:center; justify-content:center;
  }
  .contact-row .icon svg{width:20px;height:20px;}
  .contact-row .label{font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; font-family:ui-monospace,'SF Mono',Menlo,monospace;}
  .contact-row .value{font-size:16px; font-weight:600; margin-top:3px;}
  .contact-row .value a{color:inherit;}
  .contact-row .value a:hover{color:var(--flare);}
  .contact-row .note{font-size:13px; color:var(--muted); margin-top:3px;}
  .contact-map{
    border-radius:14px; overflow:hidden; border:1px solid var(--line);
    background:var(--frost-2); min-height:320px;
    display:flex; align-items:center; justify-content:center; text-align:center; padding:30px;
  }
  .contact-map .placeholder{color:var(--muted); font-size:13.5px; max-width:32ch;}
  .contact-map .placeholder b{display:block; color:var(--ink); font-size:14.5px; margin-bottom:6px;}
section[id], .hero[id] { scroll-margin-top: 96px; }