/* ПРОФФ-СБ home design system — local redesign preview (homepage only). */
:root {
  --ps-ink: #0d0f12;
  --ps-graphite: #16191d;
  --ps-graphite-2: #20242a;
  --ps-paper: #f2f0eb;
  --ps-muted: #b7b8b8;
  --ps-gold: #d5a84a;
  --ps-gold-light: #f1ce7a;
  --ps-line: rgba(242, 240, 235, .16);
  --ps-container: 1240px;
  --ps-radius: 18px;
  --ps-shadow: 0 22px 55px rgba(0, 0, 0, .28);
}

/* Shared primitives: container, section head, buttons and cards. */
.ps-home { background: var(--ps-ink); color: var(--ps-paper); overflow: hidden; }
.ps-legacy { display: none; }
.ps-container { width: min(var(--ps-container), calc(100% - 48px)); margin: 0 auto; }
.ps-home .section { padding: clamp(64px, 9vw, 128px) 0; background: transparent; }
.ps-home .ps-kicker { margin: 0 0 12px; color: var(--ps-gold-light); font-size: 12px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.ps-home h1, .ps-home h2, .ps-home h3, .ps-home p { margin-top: 0; }
.ps-home h2 { max-width: 760px; margin-bottom: 18px; color: var(--ps-paper); font-size: clamp(32px, 4vw, 56px); line-height: 1.04; letter-spacing: -.035em; }
.ps-home .ps-intro { max-width: 700px; margin-bottom: 0; color: #cbcbc5; font-size: 18px; line-height: 1.55; }
.ps-home .button { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 13px 22px; border-radius: 999px; font-weight: 700; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.ps-home .button:hover { transform: translateY(-2px); }
.ps-home .button-primary { border-color: var(--ps-gold); background: var(--ps-gold); color: #15110a; }
.ps-home .button-secondary { border-color: rgba(242,240,235,.36); background: transparent; color: var(--ps-paper); }
.ps-home .button-secondary:hover { border-color: var(--ps-gold); color: var(--ps-gold-light); }
.ps-home .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Header deliberately stays compact; site.js still owns menu generation/behaviour. */
.site-header { min-height: 70px; padding: 9px clamp(18px, 4vw, 52px); gap: 18px; background: rgba(13,15,18,.97); border-bottom-color: var(--ps-line); }
.brand { display: block; width: 194px; overflow: hidden; }
.brand img { width: 194px; filter: invert(1) hue-rotate(180deg) contrast(1.08); mix-blend-mode: screen; }
.nav { gap: 18px; color: #f0efe9; font-size: 13px; font-weight: 700; }
.header-phone { color: var(--ps-gold-light); font-size: 14px; }
.header-cta { flex: 0 0 auto; min-height: 40px; padding: 9px 16px; border-color: var(--ps-gold); background: var(--ps-gold); color: #17130b; font-size: 13px; }
.header-cta:hover { border-color: var(--ps-gold-light); background: var(--ps-gold-light); color: #17130b; }
.nav a:hover, .header-phone:hover { color: var(--ps-gold); }
.menu-toggle { border-color: var(--ps-line); background: var(--ps-graphite); }
.menu-toggle span { background: var(--ps-paper); }

.ps-hero { position: relative; min-height: max(760px, calc(100vh - 70px)); display: grid; align-items: end; isolation: isolate; background: var(--ps-graphite); }
.ps-hero-media, .ps-hero-media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.ps-hero-media img { object-fit: cover; object-position: center; filter: grayscale(.25) contrast(1.04) brightness(.65); }
.ps-hero::after { position: absolute; inset: 0; z-index: -1; content: ''; background: linear-gradient(90deg, rgba(9,10,12,.94) 0%, rgba(9,10,12,.67) 48%, rgba(9,10,12,.26) 100%), linear-gradient(0deg, rgba(9,10,12,.74), transparent 55%); }
.ps-hero-inner { position: relative; z-index: 1; width: min(var(--ps-container), calc(100% - 48px)); margin: 0 auto; padding: clamp(82px, 13vw, 160px) 0 clamp(64px, 8vw, 105px); }
.ps-hero-title { max-width: 860px; margin: 0 0 22px; font-size: clamp(42px, 6vw, 82px); line-height: .98; letter-spacing: -.055em; }
.ps-hero-title span { color: var(--ps-gold-light); }
.ps-hero-copy { max-width: 640px; margin-bottom: 30px; color: #deded9; font-size: clamp(17px, 2vw, 21px); }
.ps-hero-proof { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 18px; max-width: 690px; margin: 0 0 30px; padding: 0; list-style: none; color: #f1eee6; font-size: 14px; font-weight: 700; }
.ps-hero-proof li { position: relative; padding-left: 18px; }
.ps-hero-proof li::before { position: absolute; left: 0; top: .48em; width: 7px; height: 7px; border: 1px solid var(--ps-gold-light); content: ''; transform: rotate(45deg); }
.ps-actions { display: flex; flex-wrap: wrap; gap: 12px; }

.ps-services { position: relative; background: var(--ps-graphite) !important; color: var(--ps-paper); }
.ps-services::before { position: absolute; inset: 0; content: ''; opacity: .55; background: linear-gradient(115deg, transparent 0 68%, rgba(213,168,74,.12) 68% 69%, transparent 69%); pointer-events: none; }
.ps-services .ps-container { position: relative; }
.ps-services h2 { color: var(--ps-paper); }
.ps-services .ps-intro { color: var(--ps-muted); }
.ps-services .ps-kicker { color: var(--ps-gold-light); }
.ps-service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 42px; }
.ps-card { position: relative; min-height: 270px; display: flex; align-items: end; overflow: hidden; border-radius: var(--ps-radius); background: #2a2d31; color: var(--ps-paper); box-shadow: var(--ps-shadow); }
.ps-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(.6) brightness(.54); transition: transform .35s ease, filter .35s ease; }
.ps-card:hover img { transform: scale(1.045); filter: grayscale(.35) brightness(.63); }
.ps-card::after { position: absolute; inset: 0; content: ''; background: linear-gradient(0deg, rgba(7,8,10,.94), transparent 68%); }
.ps-card-body { position: relative; z-index: 1; padding: 24px; }
.ps-card h3 { margin-bottom: 6px; font-size: 25px; line-height: 1.08; }
.ps-card p { margin-bottom: 0; color: #e2e0d8; font-size: 14px; line-height: 1.45; text-shadow: 0 1px 10px rgba(0,0,0,.44); }
.ps-service-more { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 14px; padding: 20px 24px; border: 1px solid var(--ps-line); border-radius: var(--ps-radius); color: var(--ps-paper); }
.ps-service-more a { color: var(--ps-gold-light); font-weight: 700; }

.ps-dark { position: relative; background: var(--ps-graphite) !important; }
.ps-dark::before { position: absolute; inset: 0; content: ''; background: radial-gradient(circle at 88% 16%, rgba(213,168,74,.13), transparent 30%); pointer-events: none; }
.ps-dark .ps-container { position: relative; }
.ps-dark h2 { max-width: 840px; }
.ps-trust-grid { display: grid; grid-template-columns: .92fr 1.08fr; gap: 14px; margin-top: 40px; }
.ps-proof, .ps-case { padding: clamp(24px, 4vw, 42px); border: 1px solid var(--ps-line); border-radius: var(--ps-radius); background: var(--ps-graphite-2); }
.ps-proof strong { display: block; margin-bottom: 8px; color: var(--ps-gold-light); font-size: 19px; }
.ps-proof p, .ps-case p { margin-bottom: 0; color: #c9c9c3; line-height: 1.55; }
.ps-case-list { display: grid; gap: 12px; }
.ps-case { padding: 22px; }
.ps-case strong { font-size: 17px; }
.ps-case a { display: grid; grid-template-columns: 120px 1fr; gap: 18px; align-items: center; color: var(--ps-paper); }
.ps-case img { width: 120px; height: 92px; border-radius: 9px; object-fit: cover; filter: saturate(.72) contrast(1.06); }
.ps-case a:hover { color: var(--ps-gold-light); }

.ps-workflow { background: #111316 !important; }
.ps-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-top: 40px; }
.ps-step { position: relative; padding: 24px; border-top: 2px solid var(--ps-gold); background: var(--ps-graphite-2); }
.ps-step-number { display: block; margin-bottom: 34px; color: var(--ps-gold-light); font-size: 54px; font-weight: 700; line-height: 1; letter-spacing: -.06em; }
.ps-step strong { display: block; margin-bottom: 9px; color: var(--ps-paper); font-size: 18px; }
.ps-step p { margin-bottom: 0; color: #cccac3; font-size: 14px; line-height: 1.5; }

@media (min-width: 721px) {
  .ps-services { padding: clamp(64px, 6vw, 82px) 0 !important; }
  .ps-service-grid { gap: 12px; margin-top: 28px; }
  .ps-card { min-height: 218px; }
  .ps-card-body { padding: 20px; }
  .ps-service-more { margin-top: 12px; padding: 16px 20px; }
}

.ps-final { background: var(--ps-gold) !important; color: #17130b; }
.ps-final-wrap { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 30px; }
.ps-final h2 { max-width: 740px; margin-bottom: 0; color: #17130b; }
.ps-final .ps-kicker, .ps-final p { color: #4e3c16; }
.ps-final .button-primary { border-color: #17130b; background: #17130b; color: var(--ps-paper); }

.ps-home + .footer, .site-footer { background: #0b0d10; color: #d5d4ce; }
.site-footer .footer-main { background: #0b0d10; }
.site-footer .footer-bottom { background: #07080a; border-top-color: var(--ps-line); }
.site-footer a:hover { color: var(--ps-gold-light); }
.footer-logo img { filter: none; }

/* The banner is created by unchanged site.js. These homepage-only overrides keep its legal copy and controls available while reducing visual weight. */
.cookie-banner { left: max(16px, calc((100vw - var(--ps-container)) / 2)); right: max(16px, calc((100vw - var(--ps-container)) / 2)); bottom: 16px; max-width: none; gap: 3px 16px; padding: 10px 13px; border-color: rgba(213,168,74,.38); border-radius: 12px; background: rgba(19,22,26,.96); box-shadow: 0 14px 34px rgba(0,0,0,.34); }
.cookie-banner p { color: #d1d0ca; font-size: 10px; line-height: 1.22; }
.cookie-banner p:first-child { color: #f2f0eb; font-weight: 700; }
.cookie-banner a { color: var(--ps-gold-light); }
.cookie-actions { gap: 7px; }
.cookie-actions .button { min-height: 32px; padding: 6px 10px; font-size: 11px; }
.cookie-actions .button-secondary { border-color: rgba(242,240,235,.42); color: var(--ps-paper); }

@media (max-width: 1050px) { .header-cta { display: none; } .ps-steps { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px) { .nav { gap: 12px; } .ps-service-grid { grid-template-columns: repeat(2, 1fr); } .ps-steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 720px) { .site-header { min-height: 60px; gap: 8px; padding-right: 16px; padding-left: 16px; } .brand { order: 1; width: 126px; } .brand img { width: 126px; } .header-phone { order: 2; width: auto; margin-left: auto; color: var(--ps-gold-light); font-size: 12px; letter-spacing: -.025em; } .menu-toggle { order: 3; margin-left: 0; } .site-header .nav { background: #15181c; border-color: var(--ps-line); } .ps-container, .ps-hero-inner { width: min(100% - 32px, var(--ps-container)); } .ps-hero { min-height: 684px; align-items: end; } .ps-hero-media img { object-position: 67% center; filter: grayscale(.25) contrast(1.04) brightness(.52); } .ps-hero::after { background: linear-gradient(180deg, rgba(9,10,12,.34) 0%, rgba(9,10,12,.72) 38%, rgba(9,10,12,.96) 72%), linear-gradient(90deg, rgba(9,10,12,.66), transparent 88%); } .ps-hero-inner { padding-top: 118px; padding-bottom: 160px; } .ps-hero-title { margin-bottom: 14px; font-size: clamp(37px, 11.4vw, 50px); } .ps-hero-copy { margin-bottom: 17px; font-size: 16px; line-height: 1.42; } .ps-hero-proof { grid-template-columns: 1fr; gap: 6px; margin-bottom: 18px; font-size: 12px; } .ps-actions { display: grid; grid-template-columns: 1fr; gap: 8px; } .ps-actions .button { min-height: 47px; } .ps-service-grid, .ps-trust-grid, .ps-steps, .ps-final-wrap { grid-template-columns: 1fr; } .ps-card { min-height: 230px; } .ps-card-body { padding: 22px; } .ps-card p { font-size: 14px; } .ps-case a { grid-template-columns: 90px 1fr; gap: 13px; } .ps-case img { width: 90px; height: 74px; } .ps-step img { margin-bottom: 22px; } .ps-step-support > span { margin-bottom: 22px; } .ps-final-wrap { align-items: start; } .ps-final .button { width: 100%; } .site-footer .footer-grid { gap: 28px; } .site-footer .footer-column { gap: 11px; } .site-footer .footer-bottom-row { align-items: flex-start; gap: 14px; } .site-footer .legal-links { gap: 9px 14px; } .site-footer .footer-contacts .button { width: 100%; justify-content: center; } .cookie-banner { left: 8px; right: 8px; bottom: 8px; gap: 3px; padding: 8px 10px; border-radius: 10px; } .cookie-banner p { font-size: 9px; line-height: 1.16; } .cookie-actions { display: flex; flex-wrap: wrap; gap: 5px; } .cookie-actions .button { min-height: 28px; padding: 5px 9px; font-size: 10px; } }