/* Спільні стилі сайту: Анастасія Чапліна. Палітра: #4B3621 · #F0EEE9 · #A04000 */
:root{
  --ink:#4B3621; --cream:#F0EEE9; --terra:#A04000; --terra-l:#D17A3F;
  --card:#E8E4DA; --card-l:#F7F5F1; --line:#D3CDBE; --text:#5a4630; --text-l:#E3DDD2;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Manrope,Arial,sans-serif;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--terra)}
h1,h2,h3{font-family:Unbounded,Arial,sans-serif;margin:0}
p{margin:0}
.wrap{max-width:1344px;margin:0 auto;padding:0 48px}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--terra)}
.h2{font-family:Unbounded,Arial,sans-serif;font-weight:600;font-size:30px;line-height:1.2}
:focus-visible{outline:3px solid var(--terra);outline-offset:2px}

/* кнопки */
.btn,.btn-o{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;font-family:Unbounded,Arial,sans-serif;font-weight:600;font-size:13px;text-align:center;transition:opacity .15s}
.btn{background:var(--terra);color:var(--cream);padding:14px 26px}
.btn:hover{color:var(--cream);opacity:.9}
.btn-lg{padding:16px 28px;font-size:14px}
.btn-sm{padding:11px 22px;font-size:12px}
.btn-o{border:2px solid var(--ink);padding:12px 24px}
.btn-o:hover{color:inherit;opacity:.8}
.btn-o.lg{padding:14px 26px;font-size:14px}
.btn-o.sm{border-width:1.5px;padding:10px 20px}
.btn-o.light{border-color:var(--cream);color:var(--cream)}
.btn-o.light:hover{color:var(--cream)}

/* ГЕРОЙ */
.hero{display:flex;flex-wrap:wrap;align-items:center;gap:48px;padding-top:80px;padding-bottom:88px}
.hero-text{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.hero h1{font-weight:600;font-size:46px;line-height:1.15;text-wrap:balance}
.hero ul{margin:0;padding-left:22px;font-size:19px;max-width:580px;color:var(--text);display:flex;flex-direction:column;gap:8px}
.hand{font-family:Caveat,cursive;font-weight:600;font-size:34px;line-height:1;color:var(--terra);transform:rotate(-3deg);transform-origin:left center;display:inline-block;margin:4px 0 0 4px}
.hero-btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px}
.hero-photo{flex:1 1 340px;min-width:0;display:flex;justify-content:center}
.hero-photo img{width:100%;max-width:420px;aspect-ratio:4/5;object-fit:cover;object-position:50% 38%;border-radius:28px}

/* ХТО Я */
.band{background:var(--card);border-top:1px solid var(--line)}
.band-b{border-bottom:1px solid var(--line)}
.about{display:flex;flex-wrap:wrap;align-items:center;gap:56px;padding-top:88px;padding-bottom:88px}
.about-photo{flex:1 1 320px;min-width:0;display:flex;justify-content:center}
.about-photo img{width:100%;max-width:400px;aspect-ratio:2/3;object-fit:cover;border-radius:24px}
.about-text{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.about-text .h2{font-size:30px}
.about-text p,.about-text ul{max-width:620px;color:var(--text)}
.about-text ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.about-text b{color:var(--ink)}
.row{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}

/* ЦИФРИ */
.stats{background:var(--card-l);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stats .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}
.stat{padding:32px 28px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.stat:last-child,.stat:nth-last-child(-n+3){border-bottom:0}
.stat b{font-family:Unbounded,Arial,sans-serif;font-size:44px;font-weight:800;color:var(--terra);line-height:1}
.stat span{font-size:15px;color:var(--text)}

/* СЕКЦІЇ */
.sec{padding-top:96px;padding-bottom:96px}
.sec-t{padding-bottom:0}
.sec-head{display:flex;flex-direction:column;gap:10px;margin-bottom:32px}
.sec-head p{max-width:640px;color:var(--text)}
.head-row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:32px}
.link-u{font-weight:700;border-bottom:2px solid var(--terra)}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.tile{display:flex;flex-direction:column;gap:14px;padding:32px;border-radius:24px;background:var(--card);border:1px solid var(--line)}
.tile.dark{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.tile.dark:hover{color:var(--cream)}
.tile .ey{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--terra)}
.tile.dark .ey{color:var(--terra-l)}
.tile .tt{font-family:Unbounded,Arial,sans-serif;font-size:22px;font-weight:600;line-height:1.25}
.tile .tx{color:var(--text)}
.tile.dark .tx{color:var(--text-l)}
.tile .go{margin-top:auto;font-weight:700}
a.tile:hover{color:inherit}

/* ГОТОВІ СИСТЕМИ: картка продукту */
.prod{display:flex;flex-wrap:wrap;border-radius:28px;overflow:hidden;color:var(--cream)}
.prod-cover{flex:0 0 260px;background:var(--cream);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:32px 20px}
.prod-cover svg{width:84px;height:84px}
.prod-cover .n1{font-family:Unbounded,Arial,sans-serif;font-weight:800;font-size:32px;line-height:1;color:var(--ink)}
.prod-cover .n2{font-family:Unbounded,Arial,sans-serif;font-weight:800;font-size:22px;line-height:1;color:var(--terra)}
.prod-body{background:var(--ink);flex:1 1 480px;min-width:0;display:flex;flex-direction:column;gap:16px;padding:44px;align-items:flex-start}
.prod-body h3{font-weight:600;font-size:26px;line-height:1.25}
.prod-body p{color:var(--text-l)}
.price{display:flex;align-items:baseline;gap:14px}
.price b{font-family:Unbounded,Arial,sans-serif;font-size:32px;font-weight:600}
.price s{color:#bdb2a2}

/* ПЛАШКИ КОНСУЛЬТАЦІЙ */
.card{display:flex;flex-direction:column;gap:12px;padding:32px;border-radius:24px;background:var(--cream);border:1px solid var(--line)}
.card h3{font-weight:600;font-size:19px;line-height:1.3}
.card p{color:var(--text)}
.card .pr{margin-top:auto;font-family:Unbounded,Arial,sans-serif;font-weight:600;color:var(--terra)}

/* КОРИСНІ МАТЕРІАЛИ */
.free{display:flex;flex-direction:column;gap:12px;padding:28px;border-radius:20px;background:var(--card);border:1px solid var(--line);color:var(--text);font-size:15px}
.free .ey{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--terra)}
.free h3{font-weight:600;font-size:18px;line-height:1.3;color:var(--ink)}
.free .btn{align-self:flex-start;margin-top:auto}
.free p{margin-bottom:8px}

/* ВІДГУКИ */
.rate{display:flex;align-items:baseline;gap:10px}
.rate b{font-family:Unbounded,Arial,sans-serif;font-size:28px;font-weight:800;color:var(--terra)}
.rate span{color:var(--text);font-size:15px}
.cols{columns:3 300px;column-gap:24px}
.rev{break-inside:avoid;margin:0 0 24px;padding:28px;border-radius:24px;background:var(--cream);border:1px solid var(--line);display:flex;flex-direction:column;gap:14px}
.rev .st{color:var(--terra);letter-spacing:3px}
.rev blockquote{margin:0;color:var(--text)}
.rev figcaption{margin-top:auto;font-weight:700}

/* FAQ */
.faq{max-width:880px;margin:0 auto;padding:96px 48px}
.faq-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:20px 0}
.faq summary{display:flex;justify-content:space-between;gap:16px;font-weight:700;font-size:18px;list-style:none;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary span{color:var(--terra);transition:transform .2s;flex:none}
.faq details[open] summary span{transform:rotate(45deg)}
.faq details p{margin:12px 0 0;color:var(--text)}
.faq a{color:var(--terra);text-decoration:underline}

/* ПІДТРИМКА */
.support{padding-bottom:80px}
.support-in{display:flex;flex-wrap:wrap;max-width:920px;margin:0 auto;border-radius:24px;overflow:hidden;background:var(--card-l);border:1px solid var(--line)}
.support-img{flex:1 1 280px;min-width:0;min-height:260px;position:relative;background:#CFC8BA}
.support-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 52%}
.support-t{flex:1.4 1 320px;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:20px;padding:36px 40px;align-items:flex-start}
.support-t p{font-family:Unbounded,Arial,sans-serif;font-size:19px;font-weight:600;line-height:1.4;text-wrap:balance}

/* КОНСУЛЬТАЦІЇ */
.page-head{padding-top:80px;padding-bottom:40px;display:flex;flex-direction:column;gap:16px}
.page-head h1{font-weight:600;font-size:22px;line-height:1.35}
.svc{display:flex;flex-direction:column;gap:14px;padding:32px;border-radius:24px;background:var(--card-l);border:1px solid var(--line)}
.svc .badge{align-self:flex-start;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--terra);background:#EADFD3;padding:5px 10px;border-radius:6px}
.svc h2{font-weight:800;font-size:24px;line-height:1.2}
.svc p{color:var(--text)}
.svc p b{color:var(--ink)}
.svc .meta{margin-top:auto;padding-top:12px;display:flex;align-items:baseline;gap:14px}
.svc .meta span{font-size:14px;color:var(--text)}
.svc .meta strong{font-family:Unbounded,Arial,sans-serif;font-size:20px;font-weight:800;color:var(--terra)}
.svc .btn{align-self:flex-start}
.hint{margin-top:24px;padding:22px 28px;border-radius:20px;background:var(--card-l);border:1px solid var(--line)}
.steps{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
.steps li{display:flex;flex-direction:column;gap:8px}
.steps li i{font-style:normal;font-family:Unbounded,Arial,sans-serif;font-size:28px;font-weight:800;color:var(--terra)}
.steps li span{color:var(--text);font-size:15px}

/* адаптив */
@media(max-width:760px){
  .wrap,.faq{padding-left:20px;padding-right:20px}
  .hero{padding-top:44px;padding-bottom:56px;gap:32px}
  .hero h1{font-size:32px}
  .hero ul{font-size:17px}
  .about{padding-top:56px;padding-bottom:56px;gap:32px}
  .sec,.faq{padding-top:64px;padding-bottom:64px}
  .h2{font-size:26px}
  .prod-body{padding:28px 22px}
  .prod-cover{flex-basis:100%}
  .support-t{padding:28px 22px}
  .stat{padding:24px 8px}
  .stat:nth-last-child(-n+3){border-bottom:1px solid var(--line)}
  .stat:last-child{border-bottom:0}
  .page-head{padding-top:48px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
