/* ============================================================
   pages.css — секції сторінок у брутальній компоновці
   ============================================================ */

/* ========= HERO (кольоровий блок + чорна рамка) ========= */
.hero{background:var(--fire);border-bottom:var(--bord-2)}
.hero__grid{
  display:grid;grid-template-columns:1.15fr 0.85fr;
}
.hero__main{
  padding:clamp(28px,5vw,64px) clamp(18px,4vw,56px);
  border-right:var(--bord-2);
}
.hero__title{
  color:var(--ink);
  font-size:clamp(2.7rem,9.5vw,7.2rem);
  font-weight:900;line-height:0.9;text-transform:uppercase;letter-spacing:-0.02em;
}
.hero__title em{
  font-style:normal;background:var(--ink);color:var(--yellow);
  padding:0 .12em;display:inline-block;
}
.hero__sub{
  margin-top:22px;max-width:46ch;font-size:1.08rem;font-weight:600;color:var(--ink);
}
.hero__meta{
  display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;
}
.hero__media{
  position:relative;background:var(--ink);
  display:flex;align-items:stretch;
}
.hero__media img{width:100%;height:100%;object-fit:cover;filter:contrast(1.05)}
.hero__price{
  position:absolute;left:0;bottom:0;
  background:var(--yellow);border-top:var(--bord);border-right:var(--bord);
  padding:14px 18px;
}
.hero__price b{font-family:"Space Mono",monospace;font-size:1.7rem;display:block;line-height:1}
.hero__price span{font-family:"Space Mono",monospace;font-size:0.7rem;letter-spacing:0.1em}

/* ========= СТРІЧКА-ФАКТИ (офсетна) ========= */
.facts{
  display:grid;grid-template-columns:repeat(4,1fr);
  border-bottom:var(--bord-2);
}
.fact{
  padding:26px 20px;border-left:var(--line) solid var(--ink);
}
.fact:first-child{border-left:0}
.fact:nth-child(odd){background:var(--paper-2)}
.fact .bignum{color:var(--fire)}
.fact p{font-family:"Space Mono",monospace;font-size:0.78rem;text-transform:uppercase;
  letter-spacing:0.06em;font-weight:700;margin-top:6px}

/* ========= СЕКЦІЯ-ШАПКА ========= */
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:34px}
.shead__t{max-width:22ch}

/* ========= ПОСЛУГИ: блоки РІЗНОГО розміру (офсетна сітка) ========= */
.svc-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:0;
  border-top:var(--bord);border-left:var(--bord);
}
.svc{
  border-right:var(--bord);border-bottom:var(--bord);
  padding:26px;display:flex;flex-direction:column;min-height:200px;
  background:var(--white);transition:background .12s,transform .12s;
  grid-column:span 2;
}
.svc:hover{background:var(--paper-2)}
.svc--wide{grid-column:span 3}
.svc--tall{grid-column:span 3}
.svc--fire{background:var(--fire);color:var(--ink)}
.svc--fire:hover{background:var(--fire)}
.svc--ink{background:var(--ink);color:var(--paper)}
.svc--ink:hover{background:var(--ink)}
.svc--ink .svc__num{color:var(--yellow)}
.svc__num{font-family:"Space Mono",monospace;font-weight:700;font-size:0.85rem;color:var(--fire)}
.svc__title{margin-top:14px;font-size:clamp(1.2rem,2.4vw,1.7rem)}
.svc__desc{margin-top:auto;padding-top:14px;font-size:0.95rem;font-weight:500}
.svc__price{
  margin-top:14px;font-family:"Space Mono",monospace;font-weight:700;
  border-top:var(--line) solid currentColor;padding-top:12px;font-size:1.05rem;
}

/* ========= ПРАЙС-ТАБЛИЦЯ (брутальна) ========= */
.price-table{width:100%;border-collapse:collapse;border:var(--bord-2);background:var(--white)}
.price-table caption{
  text-align:left;font-family:"Space Mono",monospace;font-weight:700;
  text-transform:uppercase;letter-spacing:0.06em;padding:14px 16px;
  background:var(--ink);color:var(--yellow);
}
.price-table th,.price-table td{
  border:var(--line) solid var(--ink);padding:14px 16px;text-align:left;font-size:0.98rem;
}
.price-table thead th{background:var(--yellow);font-family:"Space Mono",monospace;
  text-transform:uppercase;font-size:0.78rem;letter-spacing:0.06em}
.price-table tbody tr:nth-child(even){background:var(--paper-2)}
.price-table td:last-child{font-family:"Space Mono",monospace;font-weight:700;white-space:nowrap}

/* ========= КРОКИ (горизонтальна стрічка, НЕ нумеровані картки) ========= */
.flow{display:grid;grid-template-columns:repeat(4,1fr);border:var(--bord-2)}
.flow__cell{padding:24px;border-left:var(--line) solid var(--ink)}
.flow__cell:first-child{border-left:0}
.flow__cell:nth-child(even){background:var(--ink);color:var(--paper)}
.flow__cell:nth-child(even) .flow__k{color:var(--yellow)}
.flow__k{font-family:"Space Mono",monospace;font-size:0.74rem;letter-spacing:0.1em;color:var(--fire);font-weight:700}
.flow__cell h4{margin-top:10px;font-size:1.2rem}
.flow__cell p{margin-top:8px;font-size:0.9rem;font-weight:500}

/* ========= ГАЛЕРЕЯ РОБІТ ========= */
.gal{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.gal figure{position:relative;border:var(--bord);background:var(--ink);overflow:hidden}
.gal img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.gal figcaption{
  position:absolute;left:0;bottom:0;background:var(--yellow);
  border-top:var(--line) solid var(--ink);border-right:var(--line) solid var(--ink);
  padding:7px 12px;font-family:"Space Mono",monospace;font-weight:700;
  font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;
}
.g-7{grid-column:span 7}
.g-5{grid-column:span 5}
.g-4{grid-column:span 4}
.g-8{grid-column:span 8}
.g-6{grid-column:span 6}

/* ========= СПЛІТ "ПРО НАС" ========= */
.split{display:grid;grid-template-columns:1fr 1fr;border:var(--bord-2)}
.split__media{border-right:var(--bord-2);background:var(--ink)}
.split__media img{width:100%;height:100%;object-fit:cover;min-height:320px}
.split__body{padding:clamp(24px,4vw,48px)}
.split__body p{margin-top:14px;font-weight:500}

/* ========= CTA-БАНЕР ========= */
.cta{background:var(--ink);color:var(--paper);border-block:var(--bord-2)}
.cta__in{display:grid;grid-template-columns:1.4fr 0.6fr;align-items:center;gap:30px}
.cta h2{color:var(--yellow);font-size:clamp(2rem,6vw,4rem)}
.cta p{margin-top:14px;font-weight:500;max-width:48ch}

/* ========= КОНТАКТИ ========= */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;border:var(--bord-2)}
.contact-info{padding:clamp(22px,4vw,40px)}
.contact-info dl{margin-top:10px}
.contact-info dt{font-family:"Space Mono",monospace;font-size:0.72rem;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--fire);font-weight:700;margin-top:18px}
.contact-info dd{font-size:1.15rem;font-weight:700;margin-top:4px}
.contact-info dd a:hover{color:var(--fire)}
.map{border-left:var(--bord-2);min-height:380px}
.map iframe{width:100%;height:100%;min-height:380px;border:0;display:block;filter:grayscale(1) contrast(1.1)}

/* ========= КОНТЕНТ-СТОРІНКИ (політики) ========= */
.doc{max-width:820px}
.doc h2{margin-top:34px;font-size:1.5rem}
.doc h3{margin-top:24px;font-size:1.15rem}
.doc p,.doc li{margin-top:12px;font-weight:500;font-size:1rem}
.doc ul{margin-top:8px;padding-left:0}
.doc li{padding-left:26px;position:relative}
.doc li::before{content:"■";position:absolute;left:0;top:0;color:var(--fire)}
.doc a{color:var(--fire);text-decoration:underline}

/* ========= ХЛІБНІ КРИХТИ ========= */
.crumbs{font-family:"Space Mono",monospace;font-size:0.74rem;letter-spacing:0.06em;
  text-transform:uppercase;padding-block:14px;border-bottom:var(--bord)}
.crumbs a:hover{color:var(--fire)}
.crumbs span{color:var(--fire)}

/* ============================================================
   АДАПТИВ
   ============================================================ */
@media (max-width:1100px){
  .footer__grid{grid-template-columns:1fr 1fr}
  .footer__cell:nth-child(3){border-left:0;border-top:var(--line) solid #2a2a2a;grid-column:1/-1}
}

@media (max-width:900px){
  :root{--bord-2:5px solid var(--ink)}
  .hero__grid{grid-template-columns:1fr}
  .hero__main{border-right:0;border-bottom:var(--bord-2)}
  .hero__media{min-height:300px}
  .facts{grid-template-columns:repeat(2,1fr)}
  .fact:nth-child(3){border-left:0}
  .fact:nth-child(3),.fact:nth-child(4){border-top:var(--line) solid var(--ink)}
  .svc-grid{grid-template-columns:1fr 1fr}
  .svc,.svc--wide,.svc--tall{grid-column:span 1}
  .flow{grid-template-columns:1fr 1fr}
  .flow__cell:nth-child(3){border-left:0}
  .flow__cell:nth-child(3),.flow__cell:nth-child(4){border-top:var(--line) solid var(--ink)}
  .split{grid-template-columns:1fr}
  .split__media{border-right:0;border-bottom:var(--bord-2)}
  .cta__in{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .map{border-left:0;border-top:var(--bord-2)}
  .gal{grid-template-columns:repeat(2,1fr)}
  .g-7,.g-5,.g-4,.g-8,.g-6{grid-column:span 1}
}

@media (max-width:680px){
  body{padding-bottom:60px}  /* місце під callbar */
  .nav{
    position:absolute;top:100%;left:0;right:0;
    flex-direction:column;background:var(--paper);
    border-bottom:var(--bord-2);
    max-height:0;overflow:hidden;transition:max-height .25s ease;
  }
  .nav.is-open{max-height:80vh}
  .nav__list{flex-direction:column}
  .nav__link{
    border-left:0;border-top:var(--bord);padding:16px 18px;justify-content:space-between;
  }
  .burger{display:block}
  .callbar{display:grid}
  .cookie{bottom:64px}
  .topbar__row{justify-content:center;font-size:0.66rem;gap:10px}
  .topbar__row .t-hide{display:none}
}

@media (max-width:430px){
  .facts{grid-template-columns:1fr}
  .fact{border-left:0!important;border-top:var(--line) solid var(--ink)}
  .fact:first-child{border-top:0}
  .svc-grid{grid-template-columns:1fr}
  .flow{grid-template-columns:1fr}
  .flow__cell{border-left:0!important;border-top:var(--line) solid var(--ink)}
  .flow__cell:first-child{border-top:0}
  .gal{grid-template-columns:1fr}
}