/* ============================================================
   aquanovoch.ru — корпоративный сайт компании «АКВАТОРИЯ»
   Подключается ПОСЛЕ общего /css/aquatoria.css и только здесь.
   Общий CSS пяти сайтов не трогаем.
   ============================================================ */

:root {
    --navy: #0a2540;
    --navy-2: #0f3460;
    --ice: #eef6fc;
    --aqua: #19b5d4;
    --co-radius: 20px;
}

body.co { background: #fff; }
.co h1, .co h2, .co h3 { letter-spacing: -0.02em; }

/* ---------- навигация: светлая, спокойная ---------- */
.co nav.site-nav {
    background: rgba(255,255,255,0.96); border-bottom: 1px solid var(--line);
    backdrop-filter: saturate(180%) blur(10px);
}
.co nav.site-nav a { color: var(--ink-soft); font-weight: 600; }
.co nav.site-nav a:hover, .co nav.site-nav a.is-active { color: var(--accent); text-decoration: none; }
.co nav.site-nav a.is-active { box-shadow: inset 0 -2px 0 var(--accent); }

/* ---------- общие элементы ---------- */
.co-wrap { max-width: var(--maxw); margin: 0 auto; }
.co-eyebrow {
    display: inline-flex; align-items: center; gap: 10px;
    font-size: 0.78rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
    color: var(--accent); margin-bottom: 14px;
}
.co-eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; border-radius: 2px; }
.co-h2 { font-size: 2.3rem; font-weight: 800; line-height: 1.15; color: var(--ink); margin-bottom: 16px; }
.co-lead { font-size: 1.12rem; color: var(--ink-soft); max-width: 680px; }
.co-head { margin-bottom: 44px; }
.co-head.center { text-align: center; }
.co-head.center .co-lead { margin: 0 auto; }
.co-head.center .co-eyebrow::after { content: ""; width: 28px; height: 2px; background: currentColor; border-radius: 2px; }
.co-ice { background: var(--ice); }
.co-btn {
    display: inline-flex; align-items: center; gap: 10px; padding: 15px 28px;
    border-radius: 14px; font-weight: 700; font-size: 1rem; text-decoration: none;
    transition: transform .18s, box-shadow .18s, background .18s, color .18s;
}
.co-btn:hover { transform: translateY(-2px); }
.co-btn-light { background: #fff; color: var(--navy); box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.co-btn-ghost { color: #fff; border: 1.5px solid rgba(255,255,255,.45); }
.co-btn-ghost:hover { background: rgba(255,255,255,.1); }
.co-btn-blue { background: var(--accent); color: #fff; box-shadow: 0 10px 26px rgba(var(--accent-rgb), .3); }
.co-btn-blue:hover { background: var(--accent-dark); }
.co-link { color: var(--accent); font-weight: 700; text-decoration: none; }
.co-link:hover { text-decoration: underline; text-underline-offset: 4px; }

/* ---------- заглушка под фото ---------- */
.photo-slot {
    position: relative; margin: 0; overflow: hidden; border-radius: var(--co-radius);
    aspect-ratio: 4 / 3; color: #3a6f96;
    background:
        radial-gradient(120% 80% at 0% 0%, rgba(255,255,255,.9) 0%, transparent 55%),
        radial-gradient(90% 70% at 100% 100%, rgba(25,181,212,.18) 0%, transparent 60%),
        linear-gradient(160deg, #e3f1fb 0%, #cfe6f6 100%);
    display: flex; align-items: center; justify-content: center; text-align: center;
}
.photo-slot::before {
    content: ""; position: absolute; inset: 0; opacity: .55;
    background:
        repeating-radial-gradient(circle at 30% 120%, transparent 0 22px, rgba(255,255,255,.55) 23px 24px);
}
.photo-slot .ps-in { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 18px; }
.photo-slot svg { width: 44px; height: 44px; opacity: .75; }
.photo-slot .ps-t { font-weight: 700; font-size: .95rem; color: #24577d; max-width: 260px; line-height: 1.35; }
.photo-slot .ps-s { font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; opacity: .7; }
.photo-slot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ---------- HERO ---------- */
.co-hero {
    position: relative; overflow: hidden; color: #fff; padding: 88px 5% 120px;
    background:
        radial-gradient(900px 420px at 85% 10%, rgba(25,181,212,.35) 0%, transparent 60%),
        radial-gradient(700px 500px at 0% 100%, rgba(0,119,204,.55) 0%, transparent 60%),
        linear-gradient(150deg, var(--navy) 0%, var(--navy-2) 55%, #0b4f8a 100%);
}
.co-hero::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 70px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 70' preserveAspectRatio='none'%3E%3Cpath d='M0 38c160 26 320 32 480 16S800 2 960 6s320 40 480 38v26H0z' fill='%23ffffff'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat;
}
.co-hero-grid {
    position: relative; z-index: 1; max-width: var(--maxw); margin: 0 auto;
    display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items: center;
}
.co-hero .co-eyebrow { color: #8fd8ee; }
.co-hero h1 { font-size: 3.05rem; line-height: 1.08; font-weight: 800; margin-bottom: 22px; color: #fff; }
.co-hero h1 span { color: #8fd8ee; }
.co-hero .co-lead { color: rgba(255,255,255,.86); font-size: 1.16rem; margin-bottom: 32px; }
.co-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.co-hero-note { margin-top: 22px; font-size: .92rem; color: rgba(255,255,255,.7); }
.co-hero-note a { color: #fff; font-weight: 700; text-decoration: none; }
.co-hero-media { position: relative; }
.co-hero-media .photo-slot { aspect-ratio: 4 / 5; box-shadow: 0 30px 80px rgba(0,0,0,.35); }
.co-hero-badge {
    position: absolute; left: -28px; bottom: 36px; background: #fff; color: var(--ink);
    border-radius: 16px; padding: 14px 18px; display: flex; align-items: center; gap: 12px;
    box-shadow: 0 18px 40px rgba(0,0,0,.22);
}
.co-hero-badge img { width: 44px; height: 44px; }
.co-hero-badge b { display: block; font-size: 1.15rem; line-height: 1.1; }
.co-hero-badge span { font-size: .8rem; color: var(--gray); }

/* ---------- цифры ---------- */
.co-stats-wrap { padding: 0 5%; margin-top: -64px; position: relative; z-index: 2; }
.co-stats {
    max-width: var(--maxw); margin: 0 auto; background: #fff; border-radius: var(--co-radius);
    box-shadow: 0 24px 60px rgba(10,37,64,.12); border: 1px solid var(--line);
    display: grid; grid-template-columns: repeat(6, 1fr);
}
.co-stat { padding: 26px 14px; text-align: center; border-right: 1px solid var(--line); }
.co-stat:last-child { border-right: none; }
.co-stat b { display: block; font-size: 2rem; font-weight: 800; color: var(--accent); line-height: 1.1; letter-spacing: -.02em; }
.co-stat span { display: block; margin-top: 6px; font-size: .84rem; color: var(--gray); line-height: 1.35; }

/* ---------- о компании ---------- */
.co-about { display: grid; grid-template-columns: .95fr 1.05fr; gap: 64px; align-items: center; max-width: var(--maxw); margin: 0 auto; }
.co-about-media { position: relative; }
.co-about-media .photo-slot { aspect-ratio: 5 / 6; }
.co-about-media .photo-slot.small {
    position: absolute; right: -26px; bottom: -30px; width: 46%; aspect-ratio: 1;
    border: 6px solid #fff; box-shadow: 0 18px 40px rgba(10,37,64,.16);
}
.co-about-media .photo-slot.small .ps-t { font-size: .8rem; }
.co-about-media .photo-slot.small svg { width: 30px; height: 30px; }
.co-about p { color: var(--ink-soft); font-size: 1.06rem; margin-bottom: 16px; }
.co-motto {
    margin-top: 26px; padding: 22px 26px; border-left: 4px solid var(--accent);
    background: var(--ice); border-radius: 0 16px 16px 0;
    font-size: 1.18rem; font-weight: 700; color: var(--navy); line-height: 1.45;
}
.co-motto small { display: block; margin-top: 6px; font-size: .84rem; font-weight: 500; color: var(--gray); }

/* ---------- принципы ---------- */
.co-values { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; max-width: var(--maxw); margin: 0 auto; }
.co-value {
    background: #fff; border: 1px solid var(--line); border-radius: var(--co-radius); padding: 28px 24px;
    transition: transform .2s, box-shadow .2s;
}
.co-value:hover { transform: translateY(-4px); box-shadow: 0 18px 44px rgba(10,37,64,.10); }
.co-ic {
    width: 54px; height: 54px; border-radius: 15px; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--accent) 0%, var(--aqua) 100%); color: #fff; margin-bottom: 18px;
    box-shadow: 0 10px 22px rgba(var(--accent-rgb), .28);
}
.co-ic svg { width: 26px; height: 26px; }
.co-value h3 { font-size: 1.14rem; margin-bottom: 8px; color: var(--ink); }
.co-value p { color: var(--gray); font-size: .95rem; line-height: 1.6; }

/* ---------- как мы работаем ---------- */
.co-steps { list-style: none; display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; max-width: var(--maxw); margin: 0 auto; position: relative; counter-reset: step; }
.co-steps::before {
    content: ""; position: absolute; left: 10%; right: 10%; top: 30px; height: 2px;
    background: linear-gradient(90deg, var(--accent), var(--aqua)); opacity: .35;
}
.co-step { position: relative; text-align: center; counter-increment: step; }
.co-step .num {
    width: 60px; height: 60px; margin: 0 auto 18px; border-radius: 50%; background: #fff;
    border: 2px solid var(--accent); color: var(--accent); font-weight: 800; font-size: 1.2rem;
    display: flex; align-items: center; justify-content: center; position: relative; z-index: 1;
    box-shadow: 0 0 0 8px var(--ice);
}
.co-step h3 { font-size: 1.04rem; margin-bottom: 8px; color: var(--ink); }
.co-step p { color: var(--gray); font-size: .92rem; line-height: 1.55; }

/* ---------- качество (тёмная секция) ---------- */
.co-quality {
    color: #fff; padding: 90px 5%;
    background:
        radial-gradient(800px 400px at 100% 0%, rgba(25,181,212,.25) 0%, transparent 60%),
        linear-gradient(160deg, var(--navy) 0%, #0d3a66 100%);
}
.co-quality .co-eyebrow { color: #8fd8ee; }
.co-quality .co-h2 { color: #fff; }
.co-quality .co-lead { color: rgba(255,255,255,.82); }
.co-q-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; max-width: var(--maxw); margin: 0 auto; align-items: start; }
.co-q-list { list-style: none; margin-top: 28px; display: grid; gap: 14px; }
.co-q-list li {
    display: flex; gap: 14px; align-items: flex-start; padding: 18px 20px; border-radius: 16px;
    background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
}
.co-q-list li svg { width: 24px; height: 24px; flex: 0 0 24px; color: #8fd8ee; margin-top: 2px; }
.co-q-list b { display: block; margin-bottom: 2px; }
.co-q-list span { color: rgba(255,255,255,.75); font-size: .95rem; }
.co-tare { background: #fff; color: var(--ink); border-radius: var(--co-radius); padding: 30px 28px; box-shadow: 0 30px 70px rgba(0,0,0,.25); }
.co-tare h3 { font-size: 1.3rem; margin-bottom: 6px; }
.co-tare > p { color: var(--gray); font-size: .95rem; margin-bottom: 18px; }
.co-tare-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.co-tare-item { background: var(--ice); border-radius: 14px; padding: 16px; }
.co-tare-item b { display: block; color: var(--accent-dark); margin-bottom: 4px; font-size: .98rem; }
.co-tare-item span { color: var(--ink-soft); font-size: .88rem; line-height: 1.5; display: block; }
.co-tare .co-tare-foot { margin-top: 16px; font-size: .86rem; color: var(--gray); }

/* ---------- бренды и вода ---------- */
.co-brands { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; max-width: var(--maxw); margin: 0 auto; }
.co-brand {
    position: relative; overflow: hidden; border-radius: var(--co-radius); text-decoration: none; color: #fff;
    background: linear-gradient(160deg, var(--b1) 0%, var(--b2) 100%);
    display: grid; grid-template-columns: 1fr 120px; align-items: end; min-height: 300px; padding: 28px 18px 0 26px;
    transition: transform .2s, box-shadow .2s;
}
.co-brand:hover { transform: translateY(-5px); box-shadow: 0 24px 50px rgba(10,37,64,.22); }
.co-brand .tag { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; opacity: .8; font-weight: 700; }
.co-brand h3 { font-size: 1.7rem; margin: 6px 0 10px; color: #fff; }
.co-brand p { font-size: .93rem; opacity: .9; line-height: 1.55; margin-bottom: 20px; }
.co-brand .go { display: inline-block; font-weight: 700; font-size: .9rem; padding-bottom: 26px; }
.co-brand .txt { align-self: start; }
.co-brand img {
    width: 120px; height: auto; align-self: end; border-radius: 14px 14px 0 0;
    -webkit-mask-image: linear-gradient(180deg, #000 82%, transparent 100%);
            mask-image: linear-gradient(180deg, #000 82%, transparent 100%);
}
.co-partners-title { max-width: var(--maxw); margin: 48px auto 18px; font-weight: 700; color: var(--ink); font-size: 1.1rem; }
.co-partners { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; max-width: var(--maxw); margin: 0 auto; }
.co-partner {
    display: flex; align-items: center; gap: 16px; padding: 14px 18px 14px 14px; background: #fff;
    border: 1px solid var(--line); border-radius: 18px; text-decoration: none; color: inherit;
    transition: box-shadow .2s, transform .2s;
}
.co-partner:hover { box-shadow: 0 14px 34px rgba(10,37,64,.10); transform: translateY(-3px); }
.co-partner img { width: 64px; height: 98px; object-fit: cover; border-radius: 12px; flex: 0 0 64px; }
.co-partner h4 { font-size: 1.02rem; color: var(--ink); margin-bottom: 3px; }
.co-partner p { font-size: .86rem; color: var(--gray); line-height: 1.45; }
.co-brands-foot { max-width: var(--maxw); margin: 30px auto 0; text-align: center; color: var(--ink-soft); }

/* ---------- команда ---------- */
.co-team-group { max-width: var(--maxw); margin: 0 auto 34px; }
.co-team-group h3 {
    font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gray);
    margin-bottom: 14px; font-weight: 700;
}
.co-team { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.co-person { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 18px; display: flex; align-items: center; gap: 14px; }
.co-ava {
    width: 64px; height: 64px; flex: 0 0 64px; border-radius: 50%; overflow: hidden; position: relative;
    display: flex; align-items: center; justify-content: center; font-weight: 800; color: #fff; font-size: 1.15rem;
    background: linear-gradient(135deg, var(--accent) 0%, var(--aqua) 100%);
}
.co-ava img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.co-person b { display: block; color: var(--ink); line-height: 1.3; }
.co-person span { font-size: .88rem; color: var(--gray); line-height: 1.35; display: block; margin-top: 2px; }
.co-team-lead .co-person { padding: 22px; }
.co-team-lead .co-ava { width: 84px; height: 84px; flex-basis: 84px; font-size: 1.5rem; }
.co-team-lead .co-team { grid-template-columns: repeat(2, 1fr); }

/* ---------- партнёрам ---------- */
.co-b2b { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; max-width: var(--maxw); margin: 0 auto; }
.co-b2b-card { border-radius: var(--co-radius); padding: 34px 32px; background: #fff; border: 1px solid var(--line); }
.co-b2b-card.dark { background: linear-gradient(150deg, var(--navy) 0%, var(--navy-2) 100%); color: #fff; border: none; }
.co-b2b-card h3 { font-size: 1.45rem; margin: 6px 0 12px; }
.co-b2b-card.dark h3 { color: #fff; }
.co-b2b-card p { color: var(--ink-soft); margin-bottom: 18px; }
.co-b2b-card.dark p { color: rgba(255,255,255,.8); }
.co-b2b-card ul { list-style: none; margin-bottom: 22px; display: grid; gap: 8px; }
.co-b2b-card li { padding-left: 26px; position: relative; color: var(--ink-soft); }
.co-b2b-card.dark li { color: rgba(255,255,255,.88); }
.co-b2b-card li::before { content: ""; position: absolute; left: 0; top: .55em; width: 12px; height: 12px; border-radius: 50%; background: var(--aqua); }
.co-b2b-phone { font-size: 1.5rem; font-weight: 800; text-decoration: none; color: var(--accent); }
.co-b2b-card.dark .co-b2b-phone { color: #fff; }

/* ---------- где нас найти ---------- */
.co-places { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; max-width: var(--maxw); margin: 0 auto 26px; }
.co-place { background: #fff; border: 1px solid var(--line); border-radius: var(--co-radius); overflow: hidden; }
.co-place .photo-slot { border-radius: 0; aspect-ratio: 16 / 9; }
.co-place-body { padding: 22px 24px 24px; }
.co-place-body h3 { font-size: 1.25rem; color: var(--ink); margin-bottom: 4px; }
.co-place-body p { color: var(--gray); margin-bottom: 12px; }
.co-chips { display: flex; flex-wrap: wrap; gap: 12px; max-width: var(--maxw); margin: 0 auto; justify-content: center; }
.co-chip {
    display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px; border-radius: 999px;
    background: #fff; border: 1px solid var(--line); text-decoration: none; color: var(--ink); font-weight: 600;
    transition: box-shadow .2s, transform .2s;
}
.co-chip:hover { box-shadow: 0 10px 26px rgba(10,37,64,.10); transform: translateY(-2px); }
.co-chip svg, .co-chip img { width: 22px; height: 22px; border-radius: 6px; flex: 0 0 22px; }
.co-chip small { color: var(--gray); font-weight: 500; }

/* ---------- отзыв + заказ ---------- */
.co-review {
    max-width: var(--maxw); margin: 0 auto; border-radius: var(--co-radius); padding: 28px 32px;
    background: linear-gradient(120deg, #fff7e6 0%, #fff 70%); border: 1px solid #f5e1b5;
    display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
}
.co-review h3 { font-size: 1.25rem; color: var(--ink); margin-bottom: 4px; }
.co-review p { color: var(--ink-soft); }
.co-review .co-btn { background: #f5a623; color: #fff; box-shadow: 0 10px 24px rgba(245,166,35,.3); }

/* ---------- появление при прокрутке (только при работающем JS) ---------- */
.js .reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
.js .reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .js .reveal { opacity: 1; transform: none; transition: none; } }

/* ---------- адаптив ---------- */
@media (max-width: 1080px) {
    .co-stats { grid-template-columns: repeat(3, 1fr); }
    .co-stat:nth-child(3) { border-right: none; }
    .co-stat:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
    .co-values { grid-template-columns: repeat(2, 1fr); }
    .co-team { grid-template-columns: repeat(3, 1fr); }
    .co-brands, .co-partners { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
    .co-hero { padding: 56px 5% 110px; }
    .co-hero-grid, .co-about, .co-q-grid, .co-b2b, .co-places { grid-template-columns: 1fr; gap: 40px; }
    .co-hero h1 { font-size: 2.3rem; }
    .co-hero-media { max-width: 440px; margin: 0 auto; width: 100%; }
    .co-hero-media .photo-slot { aspect-ratio: 4 / 3; }
    .co-hero-badge { left: 12px; bottom: -20px; }
    .co-about-media { max-width: 520px; margin: 0 auto 30px; width: 100%; }
    .co-about-media .photo-slot { aspect-ratio: 4 / 3; }
    .co-about-media .photo-slot.small { right: -8px; width: 40%; }
    .co-steps { grid-template-columns: 1fr; gap: 0; max-width: 560px; }
    .co-steps::before { left: 29px; right: auto; top: 20px; bottom: 20px; width: 2px; height: auto; background: linear-gradient(180deg, var(--accent), var(--aqua)); }
    .co-step { display: grid; grid-template-columns: 60px 1fr; gap: 4px 18px; text-align: left; padding-bottom: 24px; }
    .co-step .num { margin: 0; grid-row: span 2; }
    .co-step h3 { margin: 6px 0 4px; }
}
@media (max-width: 760px) {
    .co-h2 { font-size: 1.75rem; }
    .co-head { margin-bottom: 30px; }
    .co-stats-wrap { margin-top: -56px; }
    .co-stats { grid-template-columns: 1fr 1fr; }
    .co-stat { border-right: 1px solid var(--line) !important; border-bottom: 1px solid var(--line); padding: 18px 10px; }
    .co-stat:nth-child(2n) { border-right: none !important; }
    .co-stat:nth-last-child(-n+2) { border-bottom: none; }
    .co-stat b { font-size: 1.6rem; }
    .co-values, .co-brands, .co-partners, .co-team, .co-team-lead .co-team, .co-tare-grid { grid-template-columns: 1fr; }
    .co-brand { min-height: 240px; grid-template-columns: 1fr 100px; }
    .co-brand img { width: 100px; }
    .co-quality { padding: 60px 5%; }
    .co-b2b-card { padding: 26px 22px; }
    .co-review { padding: 24px 22px; }
    .co-chip { width: 100%; justify-content: flex-start; }
}
@media (max-width: 420px) {
    .co-hero h1 { font-size: 1.95rem; }
    .co-hero-actions .co-btn { width: 100%; justify-content: center; }
}

/* ---------- телефон: компактная шапка, меню точно под ней, одна плавающая кнопка ---------- */
@media (max-width: 768px) {
    .co header.site-header { flex-wrap: nowrap; padding: 10px 4%; }
    .co .brand-logo { gap: 9px; }
    .co .brand-logo .mark { width: 42px; height: 42px; }
    .co .brand-logo .name { font-size: 1.02rem; letter-spacing: 1px; }
    .co .brand-logo .name .sub { font-size: .52rem; letter-spacing: .8px; }
    .co .header-contacts .phone { font-size: .92rem; white-space: nowrap; }
    .co .floats .f-tg, .co .floats .f-max { display: none; }
    .co .floats a { width: 52px; height: 52px; }
}
.co-chips { gap: 10px; }
.co-chip { padding: 11px 16px; }