/* ════════════════════════════════════════════════════════════════
   GKK.LABS · дизайн система „ЧЕМПИОН 2.0" (от GKK Coaching)
   Vanilla CSS · без framework · конвертирано от Claude Design
   Водещ цвят: синьо #2F6BFF · акцент: оранжево #FF6A00 (eyebrow)
   ════════════════════════════════════════════════════════════════ */

:root {
  /* Повърхности */
  --bg:        #0B0908;   /* основен фон */
  --bg-2:      #0E0C0A;   /* лента марки */
  --bg-3:      #080706;   /* footer */
  --surface:   #15110C;   /* карти */
  --surface-2: #1F1A12;   /* чипове / активен toggle */

  /* Линии */
  --border:      #2A2218;
  --line-strong: #3A3329;

  /* Текст */
  --text:   #F5F1E8;
  --text-2: #E4DED4;  /* hero подзаглавие */
  --dim:    #9A9186;
  --faint:  #857D71;

  /* Акценти */
  --accent:       #2F6BFF;  /* водещ — бутони, активни състояния */
  --accent-hover: #1E57E6;
  --orange:       #FF6A00;  /* eyebrow етикети (тъмен фон) */
  --orange-2:     #A54000;  /* eyebrow в светла секция (затъмнено за WCAG AA върху --sand) */
  --win:          #27B383;  /* резултатни метрики */
  --ink:          #16130F;  /* тъмен текст върху цветно/светло */

  /* Светла секция „Цени" */
  --sand:    #E9E2D4;
  --sand-2:  #DCD3C2;
  --ink-2:   #1C1812;
  --ink-dim: #4A443B;
  --ink-faint:#6B6356;
  --ink-label:#7A7263; /* затъмнено за WCAG AA върху бял фон (pcard-label) */

  /* Шрифтове */
  --display: 'Oswald', sans-serif;
  --mono:    'JetBrains Mono', monospace;
  --body:    'Inter', system-ui, -apple-system, sans-serif;

  /* Размер */
  --maxw: 1200px;
  --pad:  2.5rem;
}

/* ── Reset ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
/* Котвите да не се крият под фиксираното меню (вкл. на телефон) */
section[id], header[id] { scroll-margin-top:80px; }
body {
  background:var(--bg); color:var(--text);
  font-family:var(--body); line-height:1.7;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img { display:block; max-width:100%; }
picture { display:contents; } /* <picture> обвивка не променя layout-а на img */
a { color:inherit; text-decoration:none; }
button { font-family:inherit; }
::selection { background:var(--accent); color:var(--ink); }

/* Видим фокус за клавиатурна навигация (WCAG) */
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; border-radius:3px; }
.btn:focus-visible, .nav-cta:focus-visible, .dur-btn:focus-visible { outline-offset:4px; }

/* Skip-link за клавиатура/скрийн рийдър */
.skip-link { position:absolute; left:-9999px; top:0; z-index:1000; background:var(--accent); color:#fff; padding:0.7rem 1.1rem; border-radius:0 0 8px 0; font-family:var(--mono); font-size:0.85rem; }
.skip-link:focus { left:0; }

/* ── Keyframes ── */
@keyframes gkkMarquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes gkkSpin    { to{transform:rotate(360deg)} }
@keyframes gkkBounce  { 0%,100%{transform:translateY(0)} 50%{transform:translateY(8px)} }

/* ── Общи ── */
.container { max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }

.eyebrow {
  display:inline-flex; align-items:center; gap:0.6rem;
  font-family:var(--mono); font-size:0.76rem; font-weight:700;
  letter-spacing:0.16em; text-transform:uppercase;
  color:var(--orange); margin-bottom:1.2rem;
}
.eyebrow::before { content:""; width:8px; height:8px; background:currentColor; display:inline-block; }

.section { padding:6.5rem 0; }
.section--line { border-top:1px solid var(--border); }

.h2 {
  font-family:var(--display); font-weight:700; line-height:1;
  letter-spacing:-0.01em; text-transform:uppercase; color:var(--text);
}

/* Бутони */
.btn {
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-weight:700; letter-spacing:0.06em;
  text-transform:uppercase; cursor:pointer; border-radius:10px;
  border:1.5px solid transparent; transition:background .2s, transform .18s ease, border-color .2s, color .2s;
}
.btn--blue { background:var(--accent); color:#fff; border-color:var(--accent); }
.btn--blue:hover { background:var(--accent-hover); }
.btn--lg { font-size:0.86rem; padding:1.15rem 2.6rem; }
.btn--lift:hover { transform:translateY(-2px); }

/* Лек баунс на hero CTA при първоначално зареждане (еднократно) */
.btn--bounce { animation:ctaBounce 1.4s ease 0.7s 1 both; }
@keyframes ctaBounce {
  0%   { transform:translateY(0); }
  15%  { transform:translateY(-9px); }
  30%  { transform:translateY(0); }
  45%  { transform:translateY(-5px); }
  60%  { transform:translateY(0); }
  78%  { transform:translateY(-2px); }
  100% { transform:translateY(0); }
}
@media (prefers-reduced-motion:reduce) { .btn--bounce { animation:none; } }
.btn--block { width:100%; padding:1rem; border-radius:8px; font-size:0.82rem; }

.btn--ghost-white {
  background:rgba(255,255,255,0.06); color:#fff;
  border-color:rgba(255,255,255,0.55);
}
.btn--ghost-white:hover { background:#fff; color:var(--ink); border-color:#fff; }

.btn--ghost-blue {
  background:transparent; color:var(--ink-2); border-color:#C9BFAD; border-radius:8px;
  width:100%; padding:1rem; font-size:0.82rem;
}
.btn--ghost-blue:hover { border-color:var(--accent); color:var(--accent-hover); }

/* ════════ NAV ════════ */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem var(--pad);
  background:rgba(11,9,8,0.82);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid var(--border);
}
.logo { display:flex; flex-direction:column; gap:5px; line-height:1; }
.logo-name {
  font-family:var(--display); font-weight:700; font-size:1.5rem;
  letter-spacing:0.06em; text-transform:uppercase; color:var(--text); line-height:0.92;
}
.logo-name .dot { color:var(--orange); }
.logo-tag {
  font-family:var(--mono); font-size:0.56rem; font-weight:500;
  letter-spacing:0.34em; text-transform:uppercase; color:var(--faint);
}
.nav-right { display:flex; align-items:center; gap:2.6rem; }
.nav-links { display:flex; align-items:center; gap:2.4rem; }
.nav-links a {
  font-family:var(--body); font-size:0.86rem; font-weight:700;
  letter-spacing:0.05em; text-transform:uppercase; color:#fff;
  transition:color .25s ease; white-space:nowrap;
}
.nav-links:hover a { color:rgba(245,241,232,0.30); }
.nav-links a:hover { color:#fff; }
.nav-cta {
  font-family:var(--mono); font-size:0.72rem; font-weight:700;
  letter-spacing:0.06em; text-transform:uppercase; padding:0.65rem 1.4rem;
  border-radius:6px; background:var(--accent); color:#fff; transition:background .2s;
}
.nav-cta:hover { background:var(--accent-hover); }

/* Анимирана линия, която обикаля CTA бутона + лек ореол (акцент) */
@property --cta-orbit { syntax:"<angle>"; inherits:false; initial-value:0deg; }
.nav-cta, .btn--orbit { position:relative; }
.nav-cta::before, .btn--orbit::before {
  content:""; position:absolute; inset:0; border-radius:inherit;
  padding:2.5px;                     /* дебелина на обикалящата линия */
  background:conic-gradient(from var(--cta-orbit),
    rgba(255,255,255,0.30) 0deg,
    rgba(255,255,255,0.30) 170deg,
    rgba(150,190,255,0.95) 280deg,
    #ffffff 340deg,
    #ffffff 352deg,
    rgba(255,255,255,0.30) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  filter:drop-shadow(0 0 6px rgba(140,180,255,0.85));
  pointer-events:none;
  animation:ctaOrbit 3s linear infinite;
}
@keyframes ctaOrbit { to { --cta-orbit:360deg; } }
@media (prefers-reduced-motion:reduce) { .nav-cta::before, .btn--orbit::before { animation:none; } }

.hamburger {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:0.4rem;
}
.hamburger span { display:block; width:26px; height:2px; background:var(--text); }

.mob-menu {
  position:fixed; top:60px; left:0; right:0; z-index:199;
  background:rgba(11,9,8,0.98); border-bottom:1px solid var(--border);
  flex-direction:column; padding:1rem 1.5rem 1.6rem;
  display:none;
}
.mob-menu.open { display:flex; }
.mob-menu a {
  font-family:var(--body); padding:0.9rem 0; font-size:0.85rem; font-weight:700;
  letter-spacing:0.05em; text-transform:uppercase; color:var(--text);
  border-bottom:1px solid var(--border);
}
.mob-menu .mob-cta {
  margin-top:1rem; background:var(--accent); color:#fff; text-align:center;
  border-radius:8px; font-family:var(--mono); font-weight:700; padding:1rem; border-bottom:none;
}

/* ════════ METHOD ════════ */
.method-top { display:grid; grid-template-columns:1.15fr 0.85fr; gap:3rem; align-items:center; margin-bottom:3.5rem; }
.method-head { max-width:560px; }
.method-head h2 { font-size:clamp(2.2rem,5.5vw,4.2rem); line-height:0.95; letter-spacing:-0.005em; }
.method-head p { color:var(--dim); margin-top:1.2rem; font-size:1.02rem; }
.method-media { position:relative; }
.method-media::after { content:""; position:absolute; inset:0; pointer-events:none; box-shadow:inset 0 0 55px 30px var(--bg); }
.method-img { width:100%; aspect-ratio:4/5; object-fit:cover; display:block; filter:grayscale(1) contrast(1.04); }
.method-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:2.4rem 2rem; }
.mcard { border-top:2px solid var(--accent); padding-top:1.6rem; }
.mcard-num { display:block; font-family:var(--display); font-weight:700; font-size:2.6rem; line-height:1; color:var(--accent); opacity:0.55; margin-bottom:0.8rem; }
.mcard h3 { font-family:var(--mono); font-size:1rem; font-weight:700; letter-spacing:0.02em; text-transform:uppercase; color:var(--text); margin-bottom:0.7rem; }
.mcard p { font-size:0.9rem; line-height:1.7; color:var(--dim); }

/* „Как работим заедно" — 3-стъпков процес */
.process-head { margin-bottom:3.2rem; }
.process-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2.4rem 2rem; position:relative; }
/* Timeline: избледняваща линия с триъгълни стрелки 01→02→03, кръгчетата „прекъсват" линията отгоре.
   Линията свършва в три намаляващи точки след 03 — процесът продължава отвъд тази стъпка. */
.process-grid .mcard { border-top:none; }
.process-grid .mcard-num {
  position:relative; z-index:3; opacity:1;
  display:flex; align-items:center; justify-content:center;
  width:60px; height:60px; border-radius:50%;
  background:var(--bg); border:2px solid var(--accent);
  color:var(--text); font-size:1.4rem; margin-bottom:1.2rem;
}
.process-grid::before {
  content:""; position:absolute; z-index:1;
  top:calc(1.6rem + 30px); left:30px; right:70px;
  height:2px;
  background:linear-gradient(to right, var(--accent) 0%, var(--accent) 82%, transparent 100%);
  opacity:0.45;
}
.proc-arrow {
  position:absolute; z-index:2; top:calc(1.6rem + 30px);
  width:0; height:0;
  border-top:6px solid transparent; border-bottom:6px solid transparent;
  border-left:9px solid var(--accent);
  opacity:0.8;
  transform:translate(-50%,-50%);
}
/* Точна средна точка между кръгчетата (те са в началото на колоната, не центрирани,
   затова простото 33%/66% не съвпада — формулата смята реалния геометричен център) */
.proc-arrow-1 { left:calc(16.67% + 35px); }
.proc-arrow-2 { left:calc(50% + 46px); }
.proc-infinity {
  position:absolute; z-index:2; top:calc(1.6rem + 30px); right:30px;
  display:flex; align-items:center; gap:5px;
  transform:translateY(-50%);
}
.proc-infinity span { display:block; border-radius:50%; background:var(--accent); }
.proc-infinity span:nth-child(1) { width:6px; height:6px; opacity:0.65; }
.proc-infinity span:nth-child(2) { width:4.5px; height:4.5px; opacity:0.4; }
.proc-infinity span:nth-child(3) { width:3px; height:3px; opacity:0.22; }
@media (max-width:1000px) { .process-grid::before, .proc-arrow, .proc-infinity { display:none; } }

/* ════════ PRICING (светла секция) ════════ */
.pricing { padding:6.5rem 0; background:var(--sand); color:var(--ink-2); }
.pricing-head { display:flex; justify-content:space-between; align-items:flex-end; gap:2rem; flex-wrap:wrap; margin-bottom:2.6rem; }
.pricing-head .col { max-width:640px; }
.pricing-head .eyebrow { color:var(--orange-2); }
.pricing-head h2 { font-family:var(--display); font-weight:700; font-size:clamp(2.6rem,6.5vw,5.4rem); line-height:0.95; text-transform:uppercase; color:var(--ink-2); }
.pricing-head p { color:var(--ink-dim); margin-top:1rem; font-size:1rem; max-width:560px; }

.price-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; align-items:stretch; }
.pcard { background:#fff; border:1px solid #D8CFBE; border-radius:12px; padding:2.4rem 1.8rem 2rem; display:flex; flex-direction:column; gap:1.3rem; position:relative; }
.pcard--feat { border:2.5px solid var(--accent); box-shadow:0 16px 44px rgba(47,107,255,0.18); }
.pcard-badge {
  position:absolute; top:-13px; left:50%; transform:translateX(-50%);
  background:var(--accent); color:var(--ink); font-family:var(--mono);
  font-size:0.62rem; font-weight:700; letter-spacing:0.12em;
  padding:0.35rem 0.9rem; border-radius:20px; white-space:nowrap;
}
.pcard-label { font-family:var(--mono); font-size:0.74rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-label); }
/* Едро заглавие на картата (Консултация / Мъже / Жени) — ясна идентичност от пръв поглед */
.pcard-title { font-family:var(--display); font-weight:700; font-size:2.2rem; line-height:0.95; text-transform:uppercase; color:var(--ink-2); margin-top:-0.65rem; }
.pcard-desc { font-size:0.86rem; color:var(--ink-faint); line-height:1.5; margin-top:-0.6rem; }
.pcard-rows { display:flex; flex-direction:column; gap:0.6rem; }
.pcard-row { display:flex; justify-content:space-between; align-items:baseline; font-family:var(--mono); }
.pcard-row--line { padding-bottom:0.6rem; border-bottom:1px solid #ECE5D7; }
.pcard-row .dur { font-size:0.84rem; color:var(--ink-faint); }
.pcard-row .amt { font-size:1.3rem; font-weight:700; color:var(--ink-2); }
/* Карти: фина сянка в покой + нежно повдигане при hover */
.pcard { transition:transform .25s ease, box-shadow .25s ease; }
.pcard:not(.pcard--feat) { box-shadow:0 2px 12px rgba(22,19,15,0.05); }
.pcard:hover { transform:translateY(-4px); }
.pcard:not(.pcard--feat):hover { box-shadow:0 16px 40px rgba(22,19,15,0.12); }
@media (max-width:760px) {
  .pcard { padding:1.9rem 1.4rem 1.7rem; gap:1.05rem; }
  .pcard-title { font-size:2rem; }
}
.pcard-list { list-style:none; display:flex; flex-direction:column; gap:0.6rem; flex:1; }
.pcard-list li { font-size:0.88rem; color:var(--ink-dim); padding-left:1.3rem; position:relative; line-height:1.5; }
.pcard-list li::before { content:"→"; position:absolute; left:0; color:var(--accent-hover); font-weight:700; }
.pcard .btn--blue { margin-top:auto; }
.pcard .btn--ghost-blue { margin-top:auto; }

/* ════════ FAQ ════════ */
.faq { max-width:1000px; }
.faq-head { text-align:center; margin-bottom:3rem; }
.faq-head h2 { font-family:var(--display); font-weight:700; font-size:clamp(3rem,9vw,7rem); line-height:0.9; letter-spacing:-0.01em; text-transform:uppercase; color:var(--text); }
.faq-head p { color:var(--dim); margin:1.4rem auto 0; font-size:1.05rem; max-width:560px; line-height:1.7; }
.faq-head p a { color:var(--accent); }
.faq-item { border-bottom:1px solid var(--border); }
.faq-q {
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
  background:none; border:none; cursor:pointer; text-align:left; padding:1.7rem 0;
}
.faq-q span:first-child {
  font-family:var(--display); font-weight:700; font-size:clamp(1.15rem,2.6vw,1.8rem);
  text-transform:uppercase; letter-spacing:0.01em; line-height:1.15; color:var(--text); transition:color .2s;
}
.faq-item.open .faq-q span:first-child { color:var(--accent); }
.faq-plus {
  flex:none; width:40px; height:40px; border-radius:10px; border:1.5px solid var(--border);
  display:flex; align-items:center; justify-content:center; color:var(--accent);
  font-size:1.5rem; line-height:1; transition:transform .25s ease;
}
.faq-item.open .faq-plus { transform:rotate(45deg); }
.faq-panel { max-height:0; opacity:0; overflow:hidden; transition:max-height .3s ease, opacity .3s ease; }
.faq-item.open .faq-panel { max-height:700px; opacity:1; }
.faq-panel p { color:var(--dim); font-size:1.02rem; line-height:1.75; padding-bottom:1.7rem; max-width:780px; }

/* ════════ BOOKING ════════ */
.booking-head { text-align:center; max-width:680px; margin:0 auto 1.6rem; }
.booking-head h2 { font-family:var(--display); font-weight:700; font-size:clamp(2.2rem,5vw,3.8rem); line-height:0.95; text-transform:uppercase; color:var(--text); }
.booking-head p { color:var(--dim); margin-top:1rem; font-size:1rem; }
.dur-toggle { display:flex; justify-content:center; gap:0.75rem; margin-bottom:2.2rem; flex-wrap:wrap; }
.dur-btn {
  font-family:var(--mono); font-size:0.82rem; font-weight:600; letter-spacing:0.04em;
  padding:0.85rem 1.6rem; border-radius:10px; cursor:pointer; transition:all .18s;
  border:1.5px solid var(--border); background:var(--surface); color:var(--dim);
}
.dur-btn .price { color:var(--accent); font-weight:700; }
.dur-btn.is-active { border-color:var(--accent); background:var(--surface-2); color:var(--text); }
.cal-shell {
  width:100%; min-height:560px; border:1px solid var(--border); border-radius:12px;
  overflow:hidden; background:var(--surface);
}
.cal-pane { width:100%; min-height:560px; overflow:auto; }
.cal-pane[hidden] { display:none; }
.cal-fallback { padding:3rem 2rem; text-align:center; }
.cal-fallback p { color:var(--dim); margin-bottom:1.5rem; }
.cal-fallback .mono { font-family:var(--mono); color:var(--faint); }
.booking-note { margin-top:1.5rem; text-align:center; font-family:var(--mono); font-size:0.8rem; color:var(--faint); }

/* ════════ FINAL CTA ════════ */
.final { padding:6rem 0; border-top:1px solid var(--border); text-align:center; position:relative; overflow:hidden; }
.final-watermark {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family:var(--display); font-weight:700; font-size:22vw;
  color:transparent; -webkit-text-stroke:1px #161009; pointer-events:none; user-select:none;
}
.final-inner { position:relative; z-index:1; }
.final h2 { font-family:var(--display); font-weight:700; font-size:clamp(2.4rem,6vw,5rem); line-height:0.95; text-transform:uppercase; color:var(--text); margin-bottom:1.4rem; }
.final p { color:var(--dim); max-width:540px; margin:0 auto 2.2rem; font-size:1.05rem; }

/* ════════ Мобилен sticky CTA ════════ */
.sticky-cta {
  position:fixed; left:1rem; right:1rem; bottom:1rem; z-index:150;
  display:flex; align-items:center; justify-content:center;
  background:rgba(47,107,255,0.16); color:#fff;
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border:1.5px solid var(--accent);
  font-family:var(--mono); font-weight:700; font-size:0.86rem;
  letter-spacing:0.06em; text-transform:uppercase;
  padding:1rem; border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,0.45);
  opacity:0; transform:translateY(130%); pointer-events:none;
  transition:opacity .3s ease, transform .3s ease;
}
.sticky-cta.show { opacity:1; transform:none; pointer-events:auto; }
@media (min-width:1001px) { .sticky-cta { display:none; } }
@media (prefers-reduced-motion:reduce) { .sticky-cta { transition:none; } }


/* ════════ FOOTER ════════ */
.footer { background:var(--bg-3); border-top:1px solid var(--border); padding:4rem 0 2.5rem; }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:2.5rem; margin-bottom:3rem; }
.footer-brand .logo-name { font-size:1.4rem; }
.footer-brand p { font-size:0.9rem; line-height:1.7; color:var(--dim); max-width:320px; margin-top:1rem; }
.socials { display:flex; gap:0.8rem; margin-top:1.4rem; }
.socials a {
  width:38px; height:38px; border-radius:8px; border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center; color:var(--dim); transition:all .2s;
}
.socials a:hover { border-color:var(--accent); color:var(--accent); }
.footer-col h4 { font-family:var(--mono); font-size:0.72rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--faint); margin-bottom:1.2rem; }
.footer-col a, .footer-col p { display:block; font-size:0.9rem; color:var(--dim); margin-bottom:0.6rem; transition:color .2s; }
.footer-col a:hover { color:var(--accent); }
.footer-bottom { border-top:1px solid var(--border); padding-top:1.5rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; font-size:0.8rem; color:var(--faint); }
.footer-bottom a { color:var(--faint); }
.footer-bottom a:hover { color:var(--accent); }

/* ════════ Reveal анимация ════════ */
.rv { opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
.rv.show { opacity:1; transform:none; }
.rv.d1 { transition-delay:.04s; } .rv.d2 { transition-delay:.08s; }
.rv.d3 { transition-delay:.12s; } .rv.d4 { transition-delay:.16s; }
@media (prefers-reduced-motion: reduce) {
  .rv { opacity:1; transform:none; transition:none; }
  .marquee-track, .hero-scroll, .pcard-badge-spin svg { animation:none; }
  .pcard, .pcard:hover { transform:none; transition:none; }
  html, .tr-track { scroll-behavior:auto; }
}

/* ════════ Вторични страници (thank-you / privacy / terms) ════════ */
.page { max-width:760px; margin:0 auto; padding:9rem var(--pad) 5rem; }
.page h1 { font-family:var(--display); font-weight:700; text-transform:uppercase; line-height:0.95; font-size:clamp(2.4rem,6vw,4rem); color:var(--text); margin-bottom:1.2rem; }
.page h2 { font-family:var(--display); font-weight:600; text-transform:uppercase; font-size:1.4rem; color:var(--text); margin:2rem 0 0.8rem; }
.page p, .page li { color:var(--dim); margin-bottom:0.8rem; }
.page ul { padding-left:1.3rem; margin-bottom:1rem; }
.page a { color:var(--accent); }
.article figure.post-hero.is-full img { max-width:560px; }
.thanks { min-height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:6rem var(--pad); }
.thanks-inner { max-width:560px; }
.thanks-icon {
  width:72px; height:72px; margin:0 auto 1.6rem; border-radius:50%;
  background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center;
  font-size:2rem; font-weight:700;
}
.thanks h1 { font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:clamp(2.4rem,7vw,4.4rem); line-height:0.95; color:var(--text); margin-bottom:1.2rem; }
.thanks p { color:var(--dim); margin-bottom:1rem; }
.steps-list { list-style:none; text-align:left; max-width:420px; margin:2rem auto; display:flex; flex-direction:column; gap:0.8rem; }
.steps-list li { color:var(--dim); padding-left:1.6rem; position:relative; }
.steps-list li::before { content:"→"; position:absolute; left:0; color:var(--accent); font-weight:700; }

/* ════════════════════════════════════════════════════════════════
   GKK.LABS (index.html) · сайтове, които продават
   ════════════════════════════════════════════════════════════════ */
.logo-name .dot--blue { color:var(--accent); }
.web-hero { position:relative; padding:10rem 0 6rem; overflow:hidden; border-bottom:1px solid var(--border); }
.web-hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size:56px 56px; opacity:0.35; mask-image:radial-gradient(ellipse at 50% 30%, #000 20%, transparent 70%); -webkit-mask-image:radial-gradient(ellipse at 50% 30%, #000 20%, transparent 70%); }
.web-hero::after { content:""; position:absolute; width:620px; height:620px; right:-160px; top:-120px; background:radial-gradient(circle, rgba(47,107,255,0.22), transparent 65%); pointer-events:none; }
.web-hero .container { position:relative; z-index:1; }
.web-hero h1 { font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:clamp(2.8rem,7.5vw,6.2rem); line-height:0.92; color:var(--text); max-width:15ch; margin:1.2rem 0 1.6rem; }
.web-hero h1 em { font-style:normal; color:var(--accent); }
.web-hero-sub { color:var(--dim); font-size:1.15rem; line-height:1.7; max-width:600px; margin:0 0 2.4rem; }
.web-hero-sub b { color:var(--text); font-weight:600; }
.web-hero-actions { display:flex; flex-wrap:wrap; gap:1rem; }
.web-hero-meta { margin-top:2.2rem; font-family:var(--mono); font-size:0.74rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--faint); }

.web-sell { display:grid; grid-template-columns:repeat(2,1fr); gap:1.4rem; margin-top:2.6rem; }
.web-sell-card { background:var(--surface); border:1px solid var(--border); border-top:2px solid var(--accent); border-radius:12px; padding:1.9rem 1.8rem; }
.web-sell-num { font-family:var(--mono); font-size:0.72rem; letter-spacing:0.12em; color:var(--accent); }
.web-sell-card h3 { font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:1.7rem; color:var(--text); margin:0.5rem 0 0.7rem; }
.web-sell-card > p { color:var(--dim); line-height:1.65; margin:0 0 1.2rem; }
.web-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:0.6rem; }
.web-list li { position:relative; padding-left:1.6rem; color:var(--text); line-height:1.5; font-size:0.95rem; }
.web-list li::before { content:"›"; position:absolute; left:0; top:-0.05rem; color:var(--accent); font-family:var(--mono); font-weight:700; font-size:1.1rem; }

.web-problems { display:grid; grid-template-columns:repeat(2,1fr); gap:1.2rem; margin-top:2.6rem; }
.web-problem { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:1.5rem 1.6rem; }
.web-problem h3 { font-family:var(--display); font-weight:600; text-transform:uppercase; font-size:1.25rem; color:var(--text); margin:0 0 0.5rem; }
.web-problem p { color:var(--dim); margin:0; line-height:1.6; }
.web-problem .x { font-family:var(--mono); color:var(--orange); margin-right:0.4rem; }

.web-funnel { list-style:none; padding:0; margin:2.8rem 0 0; display:grid; grid-template-columns:repeat(5,1fr); gap:0.8rem; counter-reset:fn; }
.web-funnel li { position:relative; background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:1.4rem 1.1rem; text-align:center; counter-increment:fn; }
.web-funnel li::before { content:"0" counter(fn); display:block; font-family:var(--mono); font-size:0.7rem; color:var(--accent); letter-spacing:0.1em; margin-bottom:0.6rem; }
.web-funnel li:not(:last-child)::after { content:"→"; position:absolute; right:-0.75rem; top:50%; transform:translateY(-50%); color:var(--accent); font-weight:700; z-index:1; }
.web-funnel b { display:block; font-family:var(--display); font-weight:600; text-transform:uppercase; font-size:1.05rem; color:var(--text); }
.web-funnel span { display:block; color:var(--dim); font-size:0.85rem; margin-top:0.4rem; line-height:1.45; }
.web-funnel li.is-money { border-color:var(--accent); background:linear-gradient(180deg, rgba(47,107,255,0.14), var(--surface)); }
.web-note { margin-top:1.6rem; font-family:var(--mono); font-size:0.8rem; color:var(--faint); }
.web-note b { color:var(--text); }

.web-projects { display:grid; grid-template-columns:repeat(2,1fr); gap:1.6rem; margin-top:2.8rem; }
.web-project { background:var(--surface); border:1px solid var(--border); border-radius:14px; overflow:hidden; display:flex; flex-direction:column; transition:border-color .2s ease, transform .2s ease; }
a.web-project:hover { border-color:var(--accent); transform:translateY(-3px); }
.web-project--wide { grid-column:1 / -1; }
.web-project--wide .web-shot .mob { width:12%; }
.web-shot { position:relative; aspect-ratio:16 / 10; background:var(--bg); border-bottom:1px solid var(--border); overflow:hidden; }
.web-shot .desk { width:100%; height:100%; object-fit:cover; object-position:top; display:block; }
.web-shot .mob { position:absolute; right:4%; bottom:6%; width:20%; height:auto; aspect-ratio:390 / 844; object-fit:cover; object-position:top; border:3px solid #1d1a16; border-radius:14px; box-shadow:0 12px 30px rgba(0,0,0,0.55); }
.web-project-body { padding:1.6rem 1.6rem 1.5rem; display:flex; flex-direction:column; gap:0.45rem; }
.web-project-top { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.web-project h3 { font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:1.45rem; color:var(--text); margin:0; }
.web-domain { font-family:var(--mono); font-size:0.78rem; color:var(--accent); }
.web-project p { color:var(--dim); margin:0; line-height:1.6; font-size:0.95rem; }
.web-tag { font-family:var(--mono); font-size:0.66rem; letter-spacing:0.12em; text-transform:uppercase; padding:0.3rem 0.6rem; border-radius:6px; background:var(--accent); color:var(--ink); font-weight:700; }
.web-tag--soon { background:var(--surface-2); color:var(--dim); border:1px solid var(--border); }

.web-support { margin-top:1.6rem; background:#fff; border:1px solid #D8CFBE; border-radius:12px; padding:1.4rem 1.8rem; display:flex; align-items:center; justify-content:space-between; gap:1.2rem; flex-wrap:wrap; color:var(--ink-2); }
.web-support b { font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:1.2rem; }
.web-support span { color:var(--ink-dim); font-size:0.95rem; }
.web-support .amt { font-family:var(--display); font-weight:700; font-size:1.8rem; color:var(--ink-2); white-space:nowrap; }
.web-payback { margin-top:1.2rem; color:var(--ink-dim); font-size:0.95rem; text-align:center; }
.web-payback b { color:var(--ink-2); }
.pcard .web-price { font-family:var(--display); font-weight:700; font-size:2.6rem; line-height:1; color:var(--ink-2); }
.pcard .web-time { font-family:var(--mono); font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-dim); }

.web-about { display:grid; grid-template-columns:1.2fr 0.8fr; gap:3rem; align-items:center; }
.web-about p { color:var(--dim); line-height:1.75; font-size:1.02rem; }
.web-about p strong { color:var(--text); }
.web-stats { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.web-stat { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:1.3rem; }
.web-stat b { display:block; font-family:var(--display); font-weight:700; font-size:2.2rem; color:var(--text); line-height:1; }
.web-stat span { display:block; color:var(--dim); font-size:0.85rem; margin-top:0.4rem; }

/* ════════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════════ */
@media (max-width:1000px) {
  :root { --pad:1.5rem; }
  .nav-right { display:none; }
  /* Подстраниците на телефон: като началната, логото + ☰ (subnav.js); „Запази консултация“ е в менюто */
  .web-funnel { grid-template-columns:1fr; gap:1.2rem; }
  .web-funnel li:not(:last-child)::after { content:"↓"; right:50%; top:auto; bottom:-1.15rem; transform:translateX(50%); }
  .web-projects { grid-template-columns:1fr; }
  .web-about { grid-template-columns:1fr; }
  .hamburger { display:flex; }
  .about-grid { grid-template-columns:1fr; }
  .price-grid { grid-template-columns:1fr; }
  .method-top { grid-template-columns:1fr; gap:2rem; }
  .method-head { max-width:none; }
  .method-grid { grid-template-columns:1fr 1fr; }
  .process-grid { grid-template-columns:1fr; }
  .lm { grid-template-columns:1fr; gap:2rem; }
  .pcard-badge-spin { display:none; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
/* статистики: 4 плочки остават на един ред и на мобилно (само по-дребен шрифт/паддинг) */
@media (max-width:760px) {
  .stat { padding:1.3rem 0.5rem; }
  .stat-num { font-size:clamp(1.6rem,7vw,2.4rem); }
  .stat-label { font-size:0.56rem; letter-spacing:0.07em; margin-top:0.4rem; }
}
@media (max-width:600px) {
  .section { padding:4.5rem 0; }
  .method-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; }
  .pricing-head { flex-direction:column; align-items:flex-start; }
  .marquee-track { font-size:1.5rem; }
  .web-hero { padding:7.5rem 0 4.5rem; }
  .web-problems { grid-template-columns:1fr; }
  .web-sell { grid-template-columns:1fr; }
  .web-shot .mob { width:24%; border-width:2px; border-radius:10px; }
}