/* ============================================================================
   ALL TEAM — АКВАРЕЛЬНАЯ ТЕМА  (assets/watercolor-theme.css)
   Подключается ПОСЛЕ style.css и site-polish.css — переопределяет палитру
   через CSS-переменные и добавляет акварельные текстуры. Вёрстку не трогает.
   ============================================================================ */
@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400;1,9..144,500&family=Nunito+Sans:ital,opsz,wght@0,6..12,300;0,6..12,400;0,6..12,600;0,6..12,700&display=swap");

/* ---------- 1. ПАЛИТРА: переопределяем обе системы переменных ---------- */
:root{
  /* новые акварельные токены */
  --wc-paper:#FBF7EE;      --wc-paper-2:#F2F8F4;
  --wc-ink:#233F3B;        --wc-ink-soft:#52706B;
  --wc-teal:#0FB5AE;       --wc-teal-deep:#0B7C77;  --wc-teal-dark:#08514E;
  --wc-aqua:#8FD9D1;       --wc-blush:#E6A79E;      --wc-ochre:#E7C48C;
  --wc-bleed:url("watercolor.svg#bleed");

  /* --- legacy (style.css) --- */
  --primary-color:#0FB5AE;
  --secondary-color:#8FD9D1;
  --text-color:#233F3B;
  --light-bg:#F2F8F4;
  --dark:#1A2B28;
  --light-text:#6A827D;
  --border-color:rgba(11,124,119,.24);

  /* --- front (site-polish.css) --- */
  --front-bg:#FBF7EE;
  --front-bg-soft:#F2F8F4;
  --front-primary:#0FB5AE;
  --front-primary-deep:#0B7C77;
  --front-primary-dark:#08514E;
  --front-secondary:#8FD9D1;
  --front-text:#233F3B;
  --front-text-soft:#52706B;
  --front-muted:#7C8F8B;
  --front-glass:rgba(255,252,246,.70);
  --front-glass-strong:rgba(255,253,248,.92);
  --front-line:rgba(11,124,119,.16);
  --front-line-strong:rgba(11,124,119,.30);
  --front-shadow-soft:0 16px 40px rgba(11,90,86,.12);
  --front-shadow-card:0 22px 50px -30px rgba(11,124,119,.42);
  --front-button-radius:26px 24px 28px 26px;   /* органичный «мазок» */
  --front-focus:0 0 0 3px rgba(143,217,209,.42), 0 0 0 6px rgba(15,181,174,.14);
  --front-font:"Nunito Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}

/* ---------- 2. БУМАГА + ЗЕРНО ---------- */
body{
  background:
    radial-gradient(120% 90% at 15% -5%, #FDFBF4 0%, transparent 55%),
    radial-gradient(120% 90% at 100% 0%, #F3F8F4 0%, transparent 50%),
    var(--wc-paper) !important;
  color:var(--wc-ink);
}
html::after{                       /* зерно бумаги поверх всего */
  content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.4'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;opacity:.05;
}

/* ---------- 3. ТИПОГРАФИКА: заголовки — Fraunces ---------- */
h1,h2,h3,
.hero-title,.section-title,.cta-title,.hero-education-title,
.team-description-title,.section-header h2,.footer-logo,.navbar-brand{
  font-family:"Fraunces",Georgia,serif !important;
  font-weight:400;letter-spacing:-.01em;
}
.hero-title{font-weight:500}
.hero-title em,.cta-quote em{font-style:italic;color:var(--wc-teal-deep)}

/* ---------- 4. МОКРЫЙ МАЗОК-ПОДЧЁРКИВАНИЕ у заголовков секций ---------- */
.section-title,.section-header h2{position:relative}
.section-title::after,.section-header h2::after{
  content:"";display:block;width:120px;height:14px;margin-top:12px;
  background:var(--wc-teal);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='14'%3E%3Cpath d='M2 8 C 24 3,46 12,70 6 S 110 4,118 7' fill='none' stroke='black' stroke-width='6' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='14'%3E%3Cpath d='M2 8 C 24 3,46 12,70 6 S 110 4,118 7' fill='none' stroke='black' stroke-width='6' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat;
  opacity:.85;
}
.section-header{text-align:center}
.section-header h2::after{margin-left:auto;margin-right:auto}

/* ---------- 5. КНОПКИ: акварельная «пилюля» с пигментной тенью ---------- */
.btn,.btn-primary,.cta-button,.hero-button,.navbar-button,
.form-submit,.reviews-button,.btn-leave-request{
  border-radius:var(--front-button-radius) !important;
  box-shadow:0 14px 26px -14px rgba(11,124,119,.7) !important;
  transition:transform .22s ease,box-shadow .22s ease,background .22s ease !important;
}
.btn-primary,.cta-button,.hero-button,.navbar-button,.form-submit,.btn-leave-request{
  background:linear-gradient(135deg,var(--wc-teal-deep),var(--wc-teal)) !important;
  border:none !important;color:#fff !important;
}
.btn:hover,.btn-primary:hover,.cta-button:hover,.hero-button:hover,
.navbar-button:hover,.form-submit:hover,.reviews-button:hover,.btn-leave-request:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 20px 34px -14px rgba(11,124,119,.85) !important;
}
.btn-outline,.btn-telegram{
  border-radius:var(--front-button-radius) !important;
  border:1.5px solid var(--wc-teal) !important;color:var(--wc-teal-deep) !important;
  background:rgba(143,217,209,.14) !important;
}

/* ---------- 6. КАРТОЧКИ: тёплая бумага, органичный край, размыв ---------- */
.service-card,.hero-education-card,.review-slide{
  background:var(--front-glass) !important;
  border:1px solid var(--front-line) !important;
  border-radius:26px 30px 24px 32px !important;
  box-shadow:var(--front-shadow-card) !important;
  position:relative;overflow:hidden;
  transition:transform .28s ease,box-shadow .28s ease !important;
}
.service-card:hover,.hero-education-card:hover,.review-slide:hover{
  transform:translateY(-6px) !important;
  box-shadow:0 30px 56px -30px rgba(11,124,119,.5) !important;
}
/* пигментный размыв в углу (::after — ::before уже заняты) */
.service-card::after,.hero-education-card::after{
  content:"";position:absolute;width:150px;height:150px;border-radius:50%;
  top:-58px;right:-46px;background:var(--wc-aqua);
  filter:var(--wc-bleed) blur(5px);mix-blend-mode:multiply;opacity:.28;
  transition:opacity .3s,transform .4s;pointer-events:none;z-index:0;
}
.service-card:hover::after,.hero-education-card:hover::after{opacity:.46;transform:scale(1.14)}
.service-card>*,.hero-education-card>*{position:relative;z-index:1}
.hero-education-icon{filter:var(--wc-bleed)}

/* ---------- 7. HERO: пигментные размывы за контентом + рамка фото ---------- */
.hero-section{position:relative;overflow:clip}
.hero-section::before,.hero-section::after{
  content:"";position:absolute;border-radius:50%;pointer-events:none;z-index:0;
  filter:var(--wc-bleed) blur(8px);mix-blend-mode:multiply;
  animation:wcBreathe 18s ease-in-out infinite;
}
.hero-section::before{width:520px;height:520px;background:var(--wc-aqua);opacity:.42;top:-140px;left:-120px}
.hero-section::after{width:420px;height:420px;background:var(--wc-blush);opacity:.34;top:20px;right:-130px;animation-delay:-5s}
.hero-content,.hero-image,.hero-education{position:relative;z-index:1}
@keyframes wcBreathe{0%,100%{transform:scale(1) translateY(0)}50%{transform:scale(1.06) translateY(-8px)}}

.hero-photo{
  border-radius:47% 53% 48% 52% / 52% 47% 53% 48% !important;
  border:5px solid var(--wc-paper) !important;
  box-shadow:0 26px 54px -26px rgba(11,124,119,.55),0 0 0 1px var(--front-line) !important;
}

/* ---------- 8. СЕКЦИИ: чередование бумаги ---------- */
.about-section{background:transparent !important}
.pricing-section,.reviews-section{background:var(--wc-paper-2) !important}

/* ---------- 9. CTA: глубокий бирюзовый размыв ---------- */
.cta-section{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,var(--wc-teal-deep),var(--wc-teal) 70%,#12938d) !important;
  border-radius:36px !important;
}
.cta-section::before,.cta-section::after{
  content:"";position:absolute;border-radius:50%;filter:var(--wc-bleed) blur(10px);
  mix-blend-mode:screen;opacity:.45;pointer-events:none;
}
.cta-section::before{width:360px;height:360px;background:var(--wc-aqua);top:-130px;left:-60px}
.cta-section::after{width:300px;height:300px;background:#bff3ee;bottom:-120px;right:-40px}
.cta-content{position:relative;z-index:1}
.cta-title,.cta-quote{color:#fff !important}
.cta-quote{font-family:"Fraunces",serif !important;font-style:italic}
.cta-section .cta-button{background:var(--wc-paper) !important;color:var(--wc-teal-deep) !important}

/* ---------- 10. NAVBAR: тёплое стекло + мокрое подчёркивание ссылок ---------- */
.navbar{
  background:linear-gradient(var(--wc-paper),rgba(251,247,238,.72)) !important;
  backdrop-filter:blur(10px);border-bottom:1px solid var(--front-line) !important;
}
.nav-link{position:relative}
.nav-link::after{
  content:"";position:absolute;left:0;right:100%;bottom:-3px;height:2px;
  background:var(--wc-teal);transition:right .25s ease;
}
.nav-link:hover::after,.nav-link.active::after{right:0}

/* ---------- 11. ФОРМЫ (анкета) ---------- */
.form-input,.form-textarea,.form-select{
  background:var(--front-glass-strong) !important;
  border:1.5px solid var(--front-line) !important;
  border-radius:16px 18px 15px 19px !important;
  transition:border-color .2s,box-shadow .2s !important;
}
.form-input:focus,.form-textarea:focus,.form-select:focus{
  border-color:var(--wc-teal) !important;box-shadow:var(--front-focus) !important;outline:none;
}
.form-label-required::after{color:var(--wc-blush) !important}
.form-radio-group label,.form-radio{border-radius:18px !important}

/* ---------- 12. FOOTER: глубокие чернила ---------- */
.footer{background:var(--wc-ink) !important;color:rgba(255,255,255,.82) !important}
.footer a,.footer-link{color:rgba(255,255,255,.8) !important}
.footer-link:hover{color:#fff !important}

/* ---------- 13. ССЫЛКИ в тексте ---------- */
.about-section a,.privacy-content a,.oferta-content a,article a{
  color:var(--wc-teal-deep);text-decoration-color:var(--wc-aqua);
}

/* ---------- 14. Доступность / motion ---------- */
@media (prefers-reduced-motion:reduce){
  .hero-section::before,.hero-section::after{animation:none !important}
}
:focus-visible{outline:2px solid var(--wc-teal-deep);outline-offset:2px}
