/* =========================
   THICCCBOI (self-host, WOFF2)
   ========================= */
@font-face{font-family:"THICCCBOI";src:url("/fonts/thicccboi-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"THICCCBOI";src:url("/fonts/thicccboi-medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"THICCCBOI";src:url("/fonts/thicccboi-bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"THICCCBOI";src:url("/fonts/thicccboi-extrabold.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}

/* =========================
   Vars & Base
   ========================= */
:root{
  --font-base:"THICCCBOI",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol",sans-serif;

  /* Shared texture */
  --texture-url:url("/assets/img/asfalt-dark.webp");
  --texture-size:320px 320px;

  /* Layout */
  --ax-nav-h:64px;
  --ax-max-w:1200px;
  --ax-max-w-xl:1440px;

  /* Colors */
  --ax-link:#111;
  --ax-link-hover:#ffcb02;

  /* Offcanvas */
  --ax-panel-bg:#fff;
  --ax-backdrop:rgba(0,0,0,.35);

  /* HERO */
  --hero-bg:#1d212c;
  --hero-fg:#fff;
  --hero-fg-soft:#cfd3da;
  --hero-accent:var(--ax-link-hover,#ffcb02);

  /* Modal */
  --modal-bg:#151821;
  --modal-fg:#fff;
  --modal-fg-soft:#cfd3da;
}

html,body{margin:0;padding:0;font-family:var(--font-base);font-weight:400;font-synthesis-weight:0;font-synthesis-style:0}
h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.2}
a{color:var(--ax-link);text-decoration:none;text-underline-offset:.2em;text-decoration-thickness:.06em}
a:hover{color:var(--ax-link-hover)}
*,*::before,*::after{box-sizing:border-box}
img,svg,video,picture{display:block;max-width:100%;height:auto}

/* =========================
   Header / Nav
   ========================= */
.ax-nav,.ax-hdr,.ax-panel{overflow:visible!important}
.ax-nav[data-ax]{position:relative;z-index:7000}

.ax-hdr{
  padding:max(0px,env(safe-area-inset-top)) 16px 0;
  height:calc(var(--ax-nav-h) + max(0px,env(safe-area-inset-top)));
  display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"brand phone burger";
  align-items:center;column-gap:16px
}
.ax-brand{grid-area:brand;font-weight:800;font-size:22px;color:#111;white-space:nowrap}
.ax-phone{grid-area:phone;justify-self:center;font-size:16px;font-weight:800;color:#111;white-space:nowrap}
.ax-phone:hover{color:var(--ax-link-hover)}
.ax-burger{grid-area:burger;justify-self:end;appearance:none;border:0;background:transparent;width:40px;height:40px;display:grid;place-items:center;cursor:pointer}
.ax-burger svg{width:22px;height:22px}

/* Offcanvas */
.ax-backdrop{position:fixed;inset:0;height:100svh;background:var(--ax-backdrop);opacity:0;pointer-events:none;z-index:6500;transition:opacity .25s ease}
.ax-panel{position:fixed;left:0;top:0;height:100svh;width:min(86vw,420px);background:var(--ax-panel-bg);transform:translate3d(-100%,0,0);z-index:6600;display:flex;flex-direction:column;overflow:auto;-webkit-overflow-scrolling:touch;transition:transform .3s ease}
.ax-panel-h{padding:max(0px,env(safe-area-inset-top)) 8px 0 16px;height:calc(var(--ax-nav-h) + max(0px,env(safe-area-inset-top)));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(0,0,0,.06)}
.ax-close{appearance:none;border:0;background:transparent;width:40px;height:40px;display:grid;place-items:center;cursor:pointer}
.ax-close svg{width:22px;height:22px}

/* Menu list */
.ax-links{padding:16px;display:flex;flex-direction:column;gap:10px;margin:0}
.ax-links li{list-style:none;text-transform:uppercase}
.ax-links>li>a,.ax-dropdown-btn{
  display:inline-flex;align-items:center;gap:6px;line-height:1;vertical-align:middle;font:inherit;
  padding:12px 10px;border-radius:10px;color:var(--ax-link);font-size:16px;font-weight:700;background:transparent;border:0;text-align:left;width:100%;cursor:pointer;text-transform:uppercase
}
.ax-links>li>a:hover,.ax-dropdown-btn:hover{color:var(--ax-link-hover);background:rgba(0,0,0,.04)}
.ax-caret{display:inline-flex;width:12px;height:12px;margin-left:6px;vertical-align:middle;line-height:0;transition:transform .18s ease;transform-origin:50% 50%}
.ax-caret svg{width:12px;height:12px;display:block}
.ax-dropdown{overflow:hidden;max-height:0;opacity:0;transition:max-height .3s ease,opacity .25s ease,transform .18s ease}
.ax-dropdown a{display:block;font-size:16px;font-weight:500;padding:10px 12px;border-radius:8px;text-transform:none}
.ax-dropdown a:hover{background:rgba(0,0,0,.06);color:var(--ax-link)}
.ax-dropdown.open{max-height:500px;opacity:1}

.ax-open .ax-panel{transform:translate3d(0,0,0)}
.ax-open .ax-backdrop{opacity:1;pointer-events:auto}
.ax-open .ax-burger{opacity:0;visibility:hidden;pointer-events:none}
.ax-links a:focus-visible,.ax-dropdown-btn:focus-visible,.ax-close:focus-visible,.ax-burger:focus-visible{outline:2px solid var(--ax-link-hover);outline-offset:2px}

/* Desktop nav */
@media (min-width:768px){
  .ax-hdr{grid-template-columns:auto 1fr auto;grid-template-areas:"brand menu phone";max-width:var(--ax-max-w);margin:0 auto;width:100%}
  .ax-phone{justify-self:end}
  .ax-burger,.ax-backdrop,.ax-panel-h{display:none!important}
  .ax-panel{grid-area:menu;position:static;transform:none;height:auto;width:auto;flex-direction:row;align-items:center;overflow:visible;justify-content:center;padding:0}
  .ax-links{padding:0;flex-direction:row;gap:24px;justify-content:center;align-items:center}
  .ax-links>li{position:relative}
  .ax-dropdown{
    position:absolute;left:50%;top:100%;transform:translate(-50%,0);
    background:#fff;border-radius:10px;padding:8px;overflow:hidden;opacity:0;pointer-events:none;white-space:nowrap;max-height:none;box-shadow:0 4px 12px rgba(0,0,0,.12)
  }
  .ax-dropdown a{padding:8px 16px;font-size:15px}
  .ax-links>li>a,.ax-dropdown-btn{width:auto}
  .ax-links>li:hover>.ax-dropdown,.ax-links>li:focus-within>.ax-dropdown{opacity:1;pointer-events:auto}
}

/* XL container */
@media (min-width:1600px){.ax-hdr{max-width:var(--ax-max-w-xl)}}

/* Reduce motion */
@media (prefers-reduced-motion:reduce){.ax-panel,.ax-backdrop,.ax-dropdown,.ax-caret{transition:none!important}}

/* =========================
   Container helper
   ========================= */
.ax-container{max-width:var(--ax-max-w);margin:0 auto;padding: 0px 10px;}
@media (min-width:1600px){.ax-container{max-width:var(--ax-max-w-xl)}}

/* =========================
   Buttons (shared)
   ========================= */
.ax-btn{
  --btn-h:48px;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  height:var(--btn-h);padding:0 22px;border-radius:14px;
  font-weight:800;line-height:1;text-decoration:none;border:1.5px solid transparent;
  transform:translateZ(0);transition:transform .15s ease,box-shadow .15s ease,filter .15s ease,background-color .15s ease,border-color .15s ease;
  cursor:pointer;
}
.ax-btn:focus-visible{outline:2px solid #fff;outline-offset:2px;box-shadow:0 0 0 3px rgba(255,255,255,.25)}
.ax-btn-primary{color:#111!important;background:linear-gradient(180deg,color-mix(in oklab,var(--ax-link-hover) 85%,#fff 15%),var(--ax-link-hover));border-color:color-mix(in oklab,var(--ax-link-hover) 85%,#000 15%);box-shadow:0 10px 24px color-mix(in oklab,var(--ax-link-hover) 25%, #000 0%)}
.ax-btn-primary:hover{transform:translateY(-1px);filter:brightness(1.02);box-shadow:0 14px 28px color-mix(in oklab,var(--ax-link-hover) 32%, #000 0%)}
.ax-btn-primary:active{transform:translateY(0);filter:brightness(.98)}
.ax-btn-ghost{color:#fff;background:transparent;border-color:rgba(255,255,255,.55);box-shadow:inset 0 -1px 0 rgba(255,255,255,.08)}
.ax-btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.7);transform:translateY(-1px)}
.ax-btn-ghost:active{transform:translateY(0)}
.ax-btn .ax-ico{line-height:0;display:inline-flex}
.ax-btn .ax-ico svg{width:18px;height:18px;display:block}

/* =========================
   HERO
   ========================= */
.ax-hero{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--hero-bg);padding-block:48px
}
@media (min-width:768px){.ax-hero{padding-block:72px}}
@media (min-width:1024px){
  .ax-hero{min-height:calc(85svh - (var(--ax-nav-h) + max(0px,env(safe-area-inset-top))));padding:0}
}
.ax-hero::before{
  content:"";position:absolute;inset:-1px;z-index:0;pointer-events:none;
  background-image:var(--texture-url);background-repeat:repeat;
  background-size:var(--texture-size);background-position:0 0;opacity:1;transform:translateZ(0)
}

/* сетка */
.ax-hero-inner{position:relative;z-index:1;display:grid;gap:20px;align-items:center;grid-template-areas:"media" "content"}
.ax-hero-media{grid-area:media;display:flex;justify-content:center;align-items:flex-end}
.ax-hero-content{grid-area:content;max-width:720px}
@media (min-width:1024px){
  .ax-hero-inner{grid-template-columns:1.05fr .95fr;grid-template-areas:"content media";gap:32px;min-height:inherit}
  .ax-hero-media{align-self:stretch;justify-content:flex-end;align-items:flex-end}
}

/* изображение */
.ax-hero-person{
  width:min(600px,94vw);max-width:94vw;height:auto;object-fit:contain;margin-inline:auto;margin-bottom:0;
  filter:drop-shadow(0 0 0 #fff) drop-shadow(0 0 1px #fff) drop-shadow(0 0 2px #fff) drop-shadow(0 10px 24px rgba(0,0,0,.35));
}
@media (min-width:1024px){.ax-hero-person{width:min(700px,40vw);max-width:40vw}}

/* типографика */
.ax-eyebrow{margin:0 0 12px;font-weight:700;font-size:14px;letter-spacing:.08em;color:var(--hero-accent);text-transform:uppercase}
.ax-hero-title{margin:0 0 14px;color:var(--hero-fg);font-weight:700;font-size:clamp(28px,4.5vw,48px);line-height:1.12;letter-spacing:.01em;text-wrap:balance}
.ax-hero-lead{margin:0 0 24px;color:var(--hero-fg-soft);font-size:clamp(15px,2vw,18px);line-height:1.1;max-width:60ch}
.ax-hero-actions{display:flex;gap:12px;flex-wrap:wrap}

/* mobile: карточка на ногах */
@media (max-width:767.98px){
  .ax-hero{padding-bottom:max(28px,env(safe-area-inset-bottom))}
  .ax-hero-media{position:relative;z-index:1}
  .ax-hero-content{
    position:relative;z-index:2;margin-top:-100px;
    background:rgba(6,8,12,.72);backdrop-filter:blur(6px) saturate(115%);-webkit-backdrop-filter:blur(6px) saturate(115%);
    border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:clamp(16px,5vw,24px);
    box-shadow:0 12px 24px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.04) inset;
  }
  .ax-hero-title{font-size:clamp(24px,7vw,32px)}
  .ax-hero-lead{font-size:clamp(14px,4.2vw,16px)}
  .ax-btn{--btn-h:46px;padding:0 18px}
}
@media (prefers-reduced-motion:reduce){.ax-btn{transition:none}}

/* =========================
   Modal (booking)
   ========================= */
.ax-modal{
  width:min(640px,calc(100vw - 24px));
  padding:0;border:0;background:transparent;color:var(--modal-fg);border-radius:16px;
}
.ax-modal::backdrop{background:rgba(0,0,0,.55);backdrop-filter:blur(2px)}
.ax-modal[open]{animation:axModalIn .18s ease}
@keyframes axModalIn{from{transform:translateY(8px) scale(.98);opacity:0}to{transform:none;opacity:1}}

.ax-modal-card{
  display:flex;flex-direction:column;max-height:min(88dvh,88vh);overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02)),var(--modal-bg);
  border:1px solid rgba(255,255,255,.08);border-radius:18px;box-shadow:0 24px 60px rgba(0,0,0,.45);
}
.ax-modal-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.06)}
.ax-modal-head h3{margin:0;font-size:20px;font-weight:800}
.ax-modal-close{appearance:none;border:0;background:transparent;color:#fff;font-size:28px;line-height:1;width:36px;height:36px;cursor:pointer;border-radius:8px}
.ax-modal-close:hover{background:rgba(255,255,255,.08)}

.ax-modal-body{
  flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  display:grid;gap:14px;padding:18px;grid-template-columns:1fr
}
@media (min-width:520px){.ax-modal-body{grid-template-columns:1fr 1fr}.ax-field--full{grid-column:1/-1}}

.ax-field{display:grid;gap:6px}
.ax-field label{font-size:13px;font-weight:700;letter-spacing:.02em;color:var(--modal-fg-soft)}
.ax-field input,.ax-field textarea{width:100%;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#1c2130;color:#fff;padding:12px 14px;outline:none}
.ax-field textarea{resize:vertical}
.ax-field input:focus,.ax-field textarea:focus{border-color:var(--ax-link-hover);box-shadow:0 0 0 3px color-mix(in oklab,var(--ax-link-hover) 28%, transparent)}

.ax-modal-foot{
  position:sticky;bottom:0;display:flex;gap:10px;justify-content:flex-end;
  padding:16px 18px;border-top:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.08))
}
.ax-modal-foot .ax-btn{--btn-h:46px;padding:0 18px}
.ax-modal,.ax-modal *{color:#fff}
.ax-field input::placeholder,.ax-field textarea::placeholder{color:rgba(255,255,255,.75)}
body.modal-open{overflow:hidden}

/* iOS Safari: не зумить инпуты */
@supports (-webkit-touch-callout:none){
  .ax-modal input,.ax-modal textarea,.ax-modal select,.ax-modal .ax-btn{font-size:16px!important}
}

/* =========================
   Services (white + texture)
   ========================= */
.ax-services{
  position:relative;isolation:isolate;overflow:hidden;
  color:#111;background:#fff;padding:clamp(28px,6vw,72px) 0;
}
.ax-services::before{
  content:"";position:absolute;inset:-1px 0 0 -1px;width:calc(100% + 2px);height:calc(100% + 1px);
  z-index:0;pointer-events:none;background-image:var(--texture-url);background-repeat:repeat;
  background-size:var(--texture-size);background-position:0 0;opacity:1;transform:translateZ(0)
}
.ax-services>.ax-container{position:relative;z-index:1}
.ax-s-head{margin-bottom:clamp(16px,4vw,28px)}
.ax-s-title{margin:6px 0 0;font-size:clamp(22px,6.2vw,34px);color:#111}

/* grid: 2 on mobile, 4 on desktop */
.ax-s-grid{
  list-style:none;margin:0;padding:0;display:grid;gap:12px;
  grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch
}
@media (min-width:1024px){.ax-s-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}}

/* card */
.ax-s-card{
  background:#fff;border:1px solid #e8ebf0;border-radius:18px;overflow:hidden;
  box-shadow:0 10px 28px rgba(16,24,40,.06);
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
  display:grid;grid-template-rows:auto 1fr;height:100%
}
.ax-s-card:hover{transform:translateY(-2px);border-color:#dfe5ef;box-shadow:0 14px 36px rgba(16,24,40,.10)}

/* media */
.ax-s-media{
  margin:0;background:#fff;border-bottom:2px solid #D7DEE8;aspect-ratio:4/3;
  display:block;border-top-left-radius:inherit;border-top-right-radius:inherit;overflow:hidden
}
.ax-s-media img{width:100%;height:100%;object-fit:contain;display:block}

/* body */
.ax-s-body{display:grid;grid-template-rows:auto auto 1fr auto;gap:8px;padding:14px;min-height:0}
.ax-s-name{font-weight:800;font-size:clamp(14px,3.8vw,18px);color:#111;text-decoration:none}
.ax-s-name:hover{color:var(--ax-link-hover)}
.ax-s-txt{margin:0;color:#333;font-size:clamp(12px,3.4vw,14px);line-height:1.5}

/* actions */
.ax-s-actions{align-self:end;display:grid;gap:10px;margin-top:0}
.ax-s-actions .ax-btn{width:100%;--btn-h:30px;padding:0 16px;border-radius:12px;font-size:.95rem}
@media (min-width:1024px){
  .ax-s-actions{grid-auto-flow:column;grid-auto-columns:1fr}
  .ax-s-actions .ax-btn{--btn-h:38px;padding:0 14px;width:auto}
}
.ax-btn-more{color:#0f172a;background:#f6f8fc;border:1.5px solid #e5e9f2;box-shadow:inset 0 -1px 0 rgba(255,255,255,.6);display:none}
.ax-btn-more:hover{background:#eef2f8;border-color:#d7deea;transform:translateY(-1px)}

/* iOS tweaks */
@supports (-webkit-touch-callout:none){
  .ax-s-actions .ax-btn{font-size:16px}
  .ax-s-media{min-height:120px}
}

/* =========================
   Brands (textured gray)
   ========================= */
.ax-brands{
  position:relative;isolation:isolate;overflow:hidden;background:#242933;color:#fff;
  padding:clamp(28px,6vw,72px) 0
}
.ax-brands::before{
  content:"";position:absolute;inset:-1px;z-index:0;pointer-events:none;
  background-image:var(--texture-url);background-repeat:repeat;
  background-size:var(--texture-size);background-position:0 0;opacity:1;transform:translateZ(0)
}
.ax-brands>.ax-container{position:relative;z-index:1}

/* Header */
.ax-b-head{margin-bottom:clamp(16px,4vw,28px)}
.ax-b-eyebrow{margin:0 0 8px;color:var(--ax-link-hover);font-weight:800;letter-spacing:.08em;font-size:13px;text-transform:uppercase}
.ax-b-title{margin:0 0 8px;font-weight:800;line-height:1.15;font-size:clamp(22px,5.6vw,36px)}
.ax-b-lead{margin:0;color:#cfd3da;font-size:clamp(14px,4.2vw,16px);max-width:70ch}

/* Grid */
.ax-b-grid{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media (min-width:768px){.ax-b-grid{gap:12px;grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:1024px){.ax-b-grid{gap:16px;grid-template-columns:repeat(6,minmax(0,1fr))}}

/* Logo card */
.ax-b-card{
  background:#fff;border:1px solid #e8ebf0;border-radius:14px;
  display:grid;place-items:center;aspect-ratio:16/9;padding:10px;
  transition:transform .15s ease,box-shadow .15s ease;box-shadow:0 8px 22px rgba(0,0,0,.06)
}
.ax-b-card img{width:100%;height:100%;object-fit:contain}
.ax-b-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.12)}
.ax-b-cta{margin-top:clamp(16px,4vw,24px);display:flex;justify-content:center}







/* ===== Recent Work / Carousel (scroll-snap, infinite) — FULL CSS ===== */

/* ——— Section + readable header ——— */
.ax-jobs.ax-services{position:relative; isolation:isolate; background:#fff; color:#0f172a; padding:clamp(28px,6vw,72px) 0}
.ax-jobs.ax-services::before{
  content:""; position:absolute; inset:-1px; z-index:0; pointer-events:none;
  background-image:var(--texture-url, none); background-repeat:repeat;
  background-size:var(--texture-size, 320px 320px);
}
.ax-jobs>.ax-container{position:relative; z-index:1}

.ax-jobs .ax-b-eyebrow{margin:0 0 8px; color:#e7b500; font-weight:800; letter-spacing:.08em; font-size:13px; text-transform:uppercase; text-shadow:0 1px 0 #fff}
.ax-jobs .ax-s-title{margin:6px 0 0; font-weight:800; line-height:1.15; font-size:clamp(22px,5.6vw,34px); color:#0b1220; text-shadow:0 1px 0 #fff; text-wrap:balance}
.ax-jobs .ax-b-lead{margin:0; color:#334155; line-height:1.55; letter-spacing:.005em; max-width:70ch; text-shadow:0 1px 0 rgba(255,255,255,.85)}
@media (max-width:480px){ .ax-jobs .ax-b-lead{ color:#1f2937 } }
@media (prefers-contrast: more){ .ax-jobs .ax-b-lead{ color:#111; text-shadow:none } .ax-jobs .ax-s-title{ color:#000; text-shadow:none } }

/* ——— Card ——— */
.ax-s-card{background:#fff; border:1px solid #e5e9f0; border-radius:18px; overflow:hidden; box-shadow:0 10px 24px rgba(16,24,40,.08); display:grid; grid-template-rows:auto 1fr}
.ax-s-media{display:block; aspect-ratio:4/3; border-bottom:2px solid #D7DEE8; background:#e2e8f0}
.ax-s-media img{width:100%; height:100%; object-fit:cover; display:block}
.ax-s-body{display:grid; grid-template-rows:auto auto 1fr auto; gap:8px; padding:14px}
.ax-s-name{font-weight:800; color:#0f172a; text-decoration:none}
.ax-s-name:hover{color:#111}
.ax-card-date{color:#475569; font-size:14px}
.ax-s-txt{color:#334155; font-size:14px; margin:0}
.ax-s-actions{margin-top:6px}

/* Quiet “More” button only for this section */
.ax-jobs .ax-btn{
  --btn-h:38px; display:inline-flex; align-items:center; justify-content:center;
  height:var(--btn-h); padding:0 18px; border-radius:12px;
  border:1.5px solid #e5e9f2; background:#f6f8fc; color:#334155; font-weight:700;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.6); text-decoration:none;
}
.ax-jobs .ax-btn:hover{ background:#eef2f8; border-color:#d7deea }
.ax-jobs .ax-btn:active{ background:#e9eef6 }
.ax-jobs .ax-btn:focus-visible{ outline:2px solid var(--ax-link-hover, #ffcb02); outline-offset:2px }

/* ——— Carousel (scroll-snap) ——— */
.ax-caro{position:relative; isolation:isolate; margin-top:12px}

/* viewport: native scrolling, hide scrollbar & corner artifact */
.axc-viewport{
  --gap:12px; --per-view:1;
  overflow-x:auto; overflow-y:hidden !important;
  display:block; scroll-snap-type:x mandatory; scroll-behavior:auto;
  -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; contain:paint;
  -ms-overflow-style:none; scrollbar-width:none; scrollbar-color:transparent transparent;
  padding-bottom:16px; margin-bottom:-16px;            /* mask scrollbar corner */
}
.axc-viewport::-webkit-scrollbar{ width:0; height:0 }
.axc-viewport::-webkit-scrollbar-thumb{ background:transparent }
.axc-viewport::-webkit-scrollbar-corner{ background:transparent }
@media (max-width:420px){ .axc-viewport{ padding-bottom:18px; margin-bottom:-18px } }
@media (min-width:1024px){ .axc-viewport{ --per-view:2 } }

.axc-track{display:flex; gap:var(--gap); list-style:none; margin:0; padding:0}
.axc-slide{
  flex:0 0 calc((100% - (var(--gap) * (var(--per-view) - 1))) / var(--per-view));
  scroll-snap-align:start; scroll-snap-stop:always;
}

/* Arrows */
.axc-btn{
  --axc-size:44px; --axc-icon:18px;
  position:absolute; top:50%;
  inline-size:var(--axc-size); block-size:var(--axc-size);
  border-radius:999px; z-index:3;
  background:#fff; border:1px solid #e5e9f2; box-shadow:0 8px 20px rgba(16,24,40,.12);
  display:grid; place-items:center; color:#0f172a; padding:0; font-size:0; line-height:0;
  translate:0 -50%; cursor:pointer; user-select:none;
}
.axc-btn::before{
  content:""; inline-size:var(--axc-icon); block-size:var(--axc-icon); background:currentColor;
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 5l6 7-6 7" fill="none" stroke="black" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
          mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 5l6 7-6 7" fill="none" stroke="black" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg>') center/contain no-repeat;
}
.axc-prev{ left:8px } .axc-next{ right:8px }
.axc-prev::before{ transform:scaleX(-1) }
.axc-btn:focus-visible{ outline:2px solid var(--ax-link-hover, #ffcb02); outline-offset:2px }
@media (hover:hover){ .axc-btn:hover{ filter:brightness(1.02); box-shadow:0 10px 24px rgba(16,24,40,.16) } .axc-btn:active{ filter:brightness(.98) } }

/* Dots */
.axc-dots{list-style:none; margin:14px 0 0; padding:0; display:flex; gap:10px; justify-content:center; align-items:center}
.axc-dots button{width:9px; height:9px; border-radius:999px; border:1px solid #94a3b8; background:#e2e8f0; opacity:.9; display:block; padding:0; appearance:none; cursor:pointer}
.axc-dots button.is-active{background:#111; border-color:#111; opacity:1; transform:scale(1.15)}













/* ===== FAQ (dark + texture like HERO) ===== */
.ax-faq{
  position:relative; isolation:isolate; overflow:hidden;
  background:var(--hero-bg); color:var(--hero-fg);
  padding:clamp(28px,6vw,72px) 0;
}
.ax-faq::before{
  content:""; position:absolute; inset:-1px; z-index:0; pointer-events:none;
  background-image:var(--texture-url); background-repeat:repeat;
  background-size:var(--texture-size); background-position:0 0; opacity:1; transform:translateZ(0);
}
.ax-faq > .ax-container{ position:relative; z-index:1 }

/* Head */
.ax-faq-head{ margin-bottom:clamp(16px,4vw,28px) }
.ax-faq .ax-eyebrow{ margin:0 0 10px; color:var(--hero-accent); font-weight:800; letter-spacing:.08em; font-size:13px; text-transform:uppercase }
.ax-faq-title{ margin:0 0 10px; font-weight:800; line-height:1.15; font-size:clamp(22px,5.6vw,36px); color:var(--hero-fg); text-wrap:balance }
.ax-faq-lead{ margin:0; color:var(--hero-fg-soft); font-size:clamp(14px,4.2vw,16px); max-width:70ch; line-height:1.55; letter-spacing:.005em }

/* ===== Two independent columns ===== */
.ax-qa-columns{ display:grid; gap:14px; grid-template-columns:1fr; margin-top:14px }
.ax-qa-col{ display:flex; flex-direction:column; gap:14px }
@media (min-width:1024px){
  .ax-qa-columns{ grid-template-columns:1fr 1fr } /* две независимые колонки */
}

/* Item */
.ax-qa{
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px; overflow:hidden;
  box-shadow:0 14px 36px rgba(0,0,0,.18), 0 0 0 1px rgba(255,255,255,.03) inset;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
@media (hover:hover){ .ax-qa:hover{ transform:translateY(-1px); box-shadow:0 18px 44px rgba(0,0,0,.22) } }

/* Question row */
.ax-qa-q{
  list-style:none; display:flex; align-items:center; justify-content:space-between; gap:12px;
  cursor:pointer; padding:14px 16px; line-height:1.25; user-select:none;
  color:#fff; font-weight:800; font-size:clamp(14px,3.8vw,18px);
}
.ax-qa-q::-webkit-details-marker{ display:none }
.ax-qa-q:focus-visible{ outline:2px solid var(--hero-accent); outline-offset:2px; border-radius:10px }

/* Plus icon */
.ax-qa-ico{ inline-size:18px; block-size:18px; position:relative; flex-shrink:0; opacity:.95 }
.ax-qa-ico::before,
.ax-qa-ico::after{
  content:""; position:absolute; inset:0; margin:auto; background:#fff; border-radius:2px;
  transition:transform .18s ease, opacity .18s ease;
}
.ax-qa-ico::before{ inline-size:18px; block-size:2px }  /* — */
.ax-qa-ico::after{  inline-size:2px;  block-size:18px } /* | */

/* Answer (animated height) */
.ax-qa-a{
  padding:0 16px;
  color:var(--hero-fg-soft); font-size:clamp(13px,3.6vw,15px); line-height:1.55; opacity:.98;
  overflow:hidden; height:auto; will-change:height;
}
.ax-qa-a > *{ margin:8px 0 0 }
.ax-qa-a > *:first-child{ margin-top:14px }
.ax-qa-a > *:last-child{ margin-bottom:14px }

/* Open state */
.ax-qa[open] .ax-qa-ico::after{ transform:scaleY(0); opacity:0 }
.ax-qa[open]{ border-color:rgba(255,255,255,.18) }

/* Motion prefs */
@media (prefers-reduced-motion:reduce){
  .ax-qa, .ax-qa-ico::before, .ax-qa-ico::after{ transition:none !important }
}

/* ===== FAQ CTA bar ===== */
.ax-faq-cta{
  margin-top:clamp(24px,6vw,48px);
  padding:18px 16px;
  border-top:1px solid rgba(255,255,255,.1);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:14px; text-align:center;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.02));
  border-radius:14px;
  box-shadow:0 8px 24px rgba(0,0,0,.2) inset;
}
.ax-faq-cta-text{ margin:0; font-size:clamp(14px,3.6vw,16px); font-weight:700; color:var(--hero-fg) }
.ax-faq-cta .ax-btn{ --btn-h:44px; padding:0 20px }













/* ===== Service Areas (white + texture) ===== */
.ax-areas.ax-services{
  position:relative; isolation:isolate; overflow:hidden;
  background:#fff; color:#111;
  padding:clamp(28px,6vw,72px) 0;
}
.ax-areas.ax-services::before{
  content:""; position:absolute; inset:-1px; z-index:0; pointer-events:none;
  background-image:var(--texture-url); background-repeat:repeat;
  background-size:var(--texture-size); background-position:0 0; opacity:1; transform:translateZ(0);
}
.ax-areas>.ax-container{ position:relative; z-index:1 }

/* Head */
.ax-a-head{ margin-bottom:clamp(16px,4vw,28px) }
.ax-a-title{ margin:6px 0 0; font-weight:800; font-size:clamp(22px,6vw,34px); color:#111; line-height:1.15; text-wrap:balance }
.ax-a-lead{ margin:8px 0 0; color:#333; font-size:clamp(14px,4vw,16px); max-width:70ch }

/* Grid */
.ax-a-list{
  list-style:none; margin:0; padding:0;
  display:grid; gap:12px;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media (min-width:768px){ .ax-a-list{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px } }
@media (min-width:1024px){ .ax-a-list{ grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px } }

/* Card link */
.ax-a-item{ display:flex }
.ax-a-item a{
  flex:1; display:flex; align-items:center; justify-content:center; text-align:center;
  background:#fff; border:1px solid #e8ebf0; border-radius:18px; padding:14px;
  font-weight:800; font-size:clamp(14px,3.8vw,18px); color:#111; text-decoration:none;
  box-shadow:0 10px 24px rgba(16,24,40,.06);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, color .16s ease;
}
.ax-a-item a:hover{
  color:var(--ax-link-hover);
  transform:translateY(-2px);
  border-color:#dfe5ef;
  box-shadow:0 14px 36px rgba(16,24,40,.10);
}

/* CTA buttons */
.ax-a-cta{ margin-top:clamp(16px,4vw,24px); display:flex; gap:10px; flex-wrap:wrap; justify-content:center }
.ax-btn-more{ color:#0f172a; background:#f6f8fc; border:1.5px solid #e5e9f2; box-shadow:inset 0 -1px 0 rgba(255,255,255,.6) }
.ax-btn-more:hover{ background:#eef2f8; border-color:#d7deea; transform:translateY(-1px) }

/* iOS читаемость */
@supports (-webkit-touch-callout:none){
  .ax-a-item a{ font-size:16px }
}






































/* ===== Order block (dark like HERO + texture) ===== */
.ax-heroish{
  position:relative; isolation:isolate; overflow:hidden;
  background:var(--hero-bg); color:var(--hero-fg);
  padding:clamp(32px,6vw,80px) 0;
}
.ax-heroish::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:var(--texture-url); background-repeat:repeat;
  background-size:var(--texture-size); background-position:0 0; opacity:1; transform:translateZ(0);
}
.ax-order > .ax-container{ position:relative; z-index:1; }

.ax-order-inner{
  display:grid; gap:20px; align-items:center;
  grid-template-areas: "media" "card";
}
.ax-order-media{ grid-area:media; display:flex; justify-content:center; align-items:flex-end; }
.ax-order-img{
  width:min(720px,94vw); max-width:94vw; height:auto; object-fit:contain;
  filter:drop-shadow(0 10px 26px rgba(0,0,0,.45));
    /* новые стили для красоты */
  border-radius:18px;                    /* скруглённые углы */
  overflow:hidden;
  box-shadow:0 14px 32px rgba(0,0,0,.45); /* мягкая тень */
}

.ax-order-card{
  grid-area:card; max-width:560px; margin-inline:auto;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03)), rgba(12,16,24,.65);
  backdrop-filter:blur(6px) saturate(115%); -webkit-backdrop-filter:blur(6px) saturate(115%);
  border:1px solid rgba(255,255,255,.12); border-radius:18px;
  box-shadow:0 16px 38px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.04) inset;
  padding:clamp(16px,4.6vw,24px);
}
.ax-order-head{ margin:0 0 10px; }
.ax-order-title{ margin:6px 0 0; font-weight:800; color:#fff; font-size:clamp(22px,5.8vw,34px); line-height:1.15; text-wrap:balance; }

.ax-order-form{ display:grid; gap:12px; }
.ax-order-form .ax-field label{ color:var(--hero-fg-soft); }
.ax-order-form .ax-field input{
  width:100%; border-radius:12px; border:1px solid rgba(255,255,255,.14);
  background:#1c2130; color:#fff; padding:12px 14px; outline:none;
}
.ax-order-form .ax-field input::placeholder{ color:rgba(255,255,255,.75) }
.ax-order-form .ax-field input:focus{
  border-color:var(--ax-link-hover);
  box-shadow:0 0 0 3px color-mix(in oklab, var(--ax-link-hover) 28%, transparent);
}
.ax-order .ax-btn{ --btn-h:46px; padding:0 20px; }

/* Mobile: let the card overlap the image a bit */
@media (max-width:767.98px){
  .ax-order-card{
    position:relative; z-index:2;
    margin-top:-72px;                 /* аккуратный «наезд» */
  }
  .ax-order-media{ position:relative; z-index:1; }
  .ax-heroish{ padding-bottom:max(36px, calc(env(safe-area-inset-bottom) + 16px)); }
}

/* Desktop: side-by-side, subtle overlap via translate */
@media (min-width:1024px){
  .ax-order-inner{
    grid-template-columns:1.05fr .95fr;
    grid-template-areas: "media card";
    gap:32px; min-height:inherit;
  }
  .ax-order-media{ justify-content:flex-start; }
  .ax-order-img{ width:min(760px,44vw); max-width:44vw; 
      
  }
  .ax-order-card{ margin-inline:0; transform:translateY(12px); }
}

/* Accessibility and perf niceties */
.ax-order{ content-visibility:auto; contain-intrinsic-size: 800px; }
.ax-order .ax-btn:focus-visible{ outline:2px solid var(--hero-accent); outline-offset:2px; }

.ax-eyebrow{
  margin:0 0 12px;
  font-weight:700;
  font-size:14px;
  letter-spacing:.08em;
  color:var(--hero-accent);
  text-transform:uppercase;
  position:relative;
  padding-left:1.4em; /* отступ под слеши */
}

.ax-eyebrow::before{
  content:"//";
  position:absolute;
  left:0;
  top:0;
  color:var(--hero-accent);
}













/* ===== Footer (dark + texture like HERO) ===== */
.ax-footer{
  position:relative; isolation:isolate; overflow:hidden;
  background:var(--hero-bg); color:var(--hero-fg);
  padding:clamp(28px,6vw,48px) 0 0;
  content-visibility:auto; contain-intrinsic-size:900px;
}
.ax-footer::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:var(--texture-url); background-repeat:repeat;
  background-size:var(--texture-size); background-position:0 0; opacity:1; transform:translateZ(0);
}
.ax-footer>.ax-container{ position:relative; z-index:1 }

/* Grid */
.ax-footer-grid{
  display:grid; gap:18px;
  grid-template-columns:1fr;
  padding:clamp(8px,2.2vw,16px) 0;
}
@media (min-width:768px){
  .ax-footer-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (min-width:1024px){
  .ax-footer-grid{ grid-template-columns:2fr 1fr 1fr 1.4fr; gap:24px }
}

/* Мобильный аккордеон (компактные отступы) */
.ax-f-section{ margin-bottom:8px }
.ax-f-head{
  all:unset;
  display:flex; justify-content:space-between; align-items:center;
  width:100%; cursor:pointer; padding:6px 0;
  font-weight:800; font-size:14px; text-transform:uppercase; color:#fff;
}
.ax-f-head span:first-child{ color:var(--ax-link-hover) }
.ax-f-ico{ inline-size:14px; block-size:14px; position:relative; flex-shrink:0 }
.ax-f-ico::before,
.ax-f-ico::after{
  content:""; position:absolute; inset:0; margin:auto; background:#fff; border-radius:1px;
  transition:transform .2s ease;
}
.ax-f-ico::before{ inline-size:14px; block-size:2px } /* — */
.ax-f-ico::after{  inline-size:2px;  block-size:14px } /* | */
.ax-f-head[aria-expanded="true"] .ax-f-ico::after{ transform:scaleY(0) }

.ax-f-list{
  list-style:none; margin:0; padding:0;
  max-height:0; overflow:hidden; transition:max-height .25s ease;
}
.ax-f-list li a{
  display:block; padding:6px 0;
  color:#cfd3da; font-size:15px; text-decoration:none;
}
.ax-f-list li a:hover{ color:var(--ax-link-hover) }

/* Десктоп: всё раскрыто, аккордеон off */
@media (min-width:768px){
  .ax-f-head{ cursor:default }
  .ax-f-ico{ display:none }
  .ax-f-list{ max-height:none !important }
}

/* Контакты + соцсети */
.ax-f-contact{ margin-top:10px; font-style:normal; display:grid; gap:6px }
.ax-f-phone,.ax-f-mail{ color:#fff; font-weight:800; text-decoration:none }
.ax-f-phone:hover,.ax-f-mail:hover{ color:var(--ax-link-hover) }
.ax-f-hours{ margin:6px 0 0; color:var(--hero-fg-soft); font-size:14px }

.ax-f-social{ list-style:none; display:flex; gap:10px; margin:12px 0 0; padding:0 }
.ax-soc{
  inline-size:36px; block-size:36px; border-radius:10px;
  display:inline-block; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.06);
  position:relative; color:#fff;
}
.ax-soc::before{
  content:""; position:absolute; inset:0; margin:auto; inline-size:18px; block-size:18px; background:currentColor;
}
.ax-soc:hover{ background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.22) }
/* SVG masks */
.ax-soc--fb::before{
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="black" d="M13 10h3V7h-3c-1.7 0-3 1.3-3 3v2H8v3h2v6h3v-6h2.6l.4-3H13v-2c0-.6.4-1 1-1z"/></svg>') center/contain no-repeat;
          mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="black" d="M13 10h3V7h-3c-1.7 0-3 1.3-3 3v2H8v3h2v6h3v-6h2.6l.4-3H13v-2c0-.6.4-1 1-1z"/></svg>') center/contain no-repeat;
}
.ax-soc--ig::before{
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="black" d="M7 2h10a5 5 0 015 5v10a5 5 0 01-5 5H7a5 5 0 01-5-5V7a5 5 0 015-5zm5 5a5 5 0 100 10 5 5 0 000-10zm6-1a1 1 0 100 2 1 1 0 000-2z"/></svg>') center/contain no-repeat;
          mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="black" d="M7 2h10a5 5 0 015 5v10a5 5 0 01-5 5H7a5 5 0 01-5-5V7a5 5 0 015-5zm5 5a5 5 0 100 10 5 5 0 000-10zm6-1a1 1 0 100 2 1 1 0 000-2z"/></svg>') center/contain no-repeat;
}
.ax-soc--tt::before{
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="black" d="M14 2c1 2 2 3 4 3v4c-1 0-2-.3-3-.8v6.3A6.5 6.5 0 018 21c-2.9 0-5-1.7-5-4.3 0-2.4 2-3.9 4.7-4.1.5 0 1.1 0 1.7.1V9.1C10 9 9.6 9 9.2 9 5.5 9 3 11 3 14.2 3 18 6 20 10 20c3.6 0 6-2 6-5.6V6.1c-.8-.4-1.6-1-2-2.1V2z"/></svg>') center/contain no-repeat;
          mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="black" d="M14 2c1 2 2 3 4 3v4c-1 0-2-.3-3-.8v6.3A6.5 6.5 0 018 21c-2.9 0-5-1.7-5-4.3 0-2.4 2-3.9 4.7-4.1.5 0 1.1 0 1.7.1V9.1C10 9 9.6 9 9.2 9 5.5 9 3 11 3 14.2 3 18 6 20 10 20c3.6 0 6-2 6-5.6V6.1c-.8-.4-1.6-1-2-2.1V2z"/></svg>') center/contain no-repeat;
}
.ax-soc--yt::before{
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="black" d="M23 7s0-3-3-3H4C1 4 1 7 1 7v6s0 3 3 3h16c3 0 3-3 3-3V7zM9.8 8.7l6 3.3-6 3.3V8.7z"/></svg>') center/contain no-repeat;
          mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="black" d="M23 7s0-3-3-3H4C1 4 1 7 1 7v6s0 3 3 3h16c3 0 3-3 3-3V7zM9.8 8.7l6 3.3-6 3.3V8.7z"/></svg>') center/contain no-repeat;
}

/* Нижняя строка — одна линия */
.ax-footer-bottom{
  border-top:1px solid rgba(255,255,255,.10);
  margin-top:clamp(12px,3vw,20px);
  padding:12px 0;
}
.ax-f-line{
  list-style:none; margin:0; padding:0;
  display:flex; justify-content:space-between; align-items:center;
  gap:20px; flex-wrap:wrap;
  font-size:14px; color:var(--hero-fg-soft);
}
.ax-f-copy{ white-space:nowrap }
.ax-f-badges{ text-align:center; flex:1 }
.ax-f-links{ display:flex; gap:14px; white-space:nowrap }
.ax-f-links a{ color:var(--hero-fg-soft); text-decoration:none }
.ax-f-links a:hover{ color:var(--ax-link-hover) }

@media (max-width:767.98px){
  .ax-f-line{ flex-direction:column; gap:8px; text-align:center }
  .ax-f-badges{ flex:none }
}



.n-message {
    display: none;
}