/* Каркас сети SVOY. НЕ ПРАВИТЬ РУКАМИ: файл собирается из src/lib/brand.ts скриптом ~/gen_brand_css.py на каждом деплое. */ :root{ /* SVOY BRAND TOKENS v1.1 — канон сети: ~/svoy-brand/svoy-brand.css База общая для всех сайтов сети (BRAND_SYSTEM.md §3), меняется только акцент. svoy.io — мастер-бренд, акцент золото. */ --paper:#F6F3EE; --surface:#FFFFFF; --surface2:#EFEAE1; --night:#1A1A1A; --night2:#141414; --ink:#1A1A1A; --ink2:#43403a; --muted:#6b655c; --ink-on-night:#EDE8DF; --gold:#C9A227; --gold-deep:#806410; --gold-soft:#F2D98A; --line:#dfd9cf; --line-gold:rgba(201,162,39,.5); --line-night:rgba(201,162,39,.18); --serif:'Fraunces',Georgia,serif; --sans:'Inter',system-ui,sans-serif; --shadow-card:0 1px 2px rgba(26,26,26,.05); --shadow-card-hover:0 18px 44px rgba(26,26,26,.12); } *{margin:0;padding:0;box-sizing:border-box} /* На в layout.tsx висит tailwind-класс bg-[#0A0A0A] text-white — он держит тёмную тему остального сайта. Класс сильнее селектора по тегу, поэтому светлую тему вешаем через body[class] (0,1,2 бьёт 0,1,0), без !important. */ html{scroll-behavior:smooth} html:root{background:var(--paper)} html body[class]{background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased} img{display:block;width:100%;height:100%;object-fit:cover} a{color:inherit;text-decoration:none} /* SKIP-LINK — «перейти к содержимому», первый элемент body (layout.tsx). До 30.08.2026 человек с клавиатуры проходил экобар, шапку и всё меню на каждой из 1 236 страниц. Видна только в фокусе (WCAG 2.4.1). */ .skiplink{position:absolute;left:-9999px;top:0;z-index:200;background:var(--night);color:#fff; padding:12px 20px;border-radius:0 0 8px 0;font-size:14px;font-family:var(--sans);font-weight:500} .skiplink:focus{left:0} /* ФОКУС С КЛАВИАТУРЫ — одно кольцо на всю сеть. До 31.08.2026 своего стиля не было вовсе: человек, идущий по сайту с клавиатуры, видел только подсветку браузера, а она на золотых кнопках и на фото почти не читается (WCAG 2.4.7). Мышью кольцо не появляется — на то и :focus-visible. */ :focus-visible{outline:2px solid var(--gold-deep);outline-offset:2px;border-radius:4px} nav .links :focus-visible,.hero :focus-visible,.final :focus-visible,footer :focus-visible,.ecobar :focus-visible,.ctile:focus-visible{outline-color:var(--gold-soft)} /* Плавающая кнопка WhatsApp не должна перекрывать подвал на узком экране. */ @media(max-width:560px){[data-wa-fab]{height:50px!important;padding:0 16px 0 13px!important;font-size:14px!important}} @media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}} .wrap{max-width:1280px;margin:0 auto;padding:0 32px} h1,h2,h3{font-family:var(--serif);font-weight:300;line-height:1.06;letter-spacing:-.01em;color:var(--ink)} em{font-style:italic;color:var(--gold-deep)} section{padding:118px 0} /* KICKER — надстрочная строка семьи: «— SVOY · ПО ВСЕМУ МИРУ». Есть на home и baby, поэтому это опознавательный знак сети, а не украшение. */ .kick{display:inline-flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.2em; text-transform:uppercase;color:var(--gold-deep);font-weight:600;font-family:var(--sans)} .kick::before{content:"";width:28px;height:1px;background:currentColor;opacity:.7} .kick.nodash::before{display:none} .eyebrow{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);font-weight:600} .ic{width:30px;height:30px;stroke:var(--gold-deep);stroke-width:1.3;fill:none;stroke-linecap:round;stroke-linejoin:round} /* BUTTONS — одна система на всю сеть: капсула, первичная залита акцентом */ .btn{display:inline-flex;align-items:center;gap:10px;padding:15px 28px;border-radius:100px;font-size:15px; font-weight:500;transition:.25s;width:fit-content;font-family:var(--sans);white-space:nowrap} .btn-primary{background:var(--gold);color:#15120B;font-weight:600} .btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(201,162,39,.4)} .btn-ghost{border:1px solid var(--line);color:var(--ink);background:transparent} .btn-ghost:hover{border-color:var(--gold-deep);color:var(--gold-deep)} .btn-dark{background:var(--night);color:#fff} .btn-dark:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(26,26,26,.28)} .btn.sm{padding:11px 22px;font-size:14px} /* поверх фото кнопка-контур становится светлой */ nav .btn-ghost,.hero .btn-ghost,.final .btn-ghost,.manifesto .btn-ghost{ border-color:rgba(255,255,255,.45);color:#fff;background:rgba(10,9,7,.28);backdrop-filter:blur(4px)} nav .btn-ghost:hover,.hero .btn-ghost:hover,.final .btn-ghost:hover,.manifesto .btn-ghost:hover{ background:rgba(255,255,255,.16);border-color:#fff;color:#fff} /* ECOSYSTEM BAR — тёмный якорь сети, одинаковый на всех сайтах SVOY */ .ecobar{background:#131211;border-bottom:1px solid var(--line-night);font-size:12.5px;letter-spacing:.05em} .ecobar .wrap{display:flex;align-items:center;justify-content:space-between;padding:10px 32px;gap:16px;flex-wrap:wrap} .ecobar .fam{display:flex;gap:20px;align-items:center;flex-wrap:wrap;color:#8d857a} .ecobar .fam a{transition:.2s}.ecobar .fam a:hover{color:var(--ink-on-night)} .ecobar .fam .here{color:var(--gold);font-weight:600;letter-spacing:.14em} .ecobar .tg{color:#8d857a}.ecobar .tg:hover{color:var(--gold)} /* NAV + ЛОГОТИП-ЛОКАП — один знак на всю сеть: кикер сверху, «SVOY» серифом. Селектор именно nav.shell, а не голый nav: до 15.08.2026 правило било по ЛЮБОМУ