/* GOLOMAZOV — общие стили.
   У каждой страницы свой «мир»: класс на <body> переопределяет токены цвета.
   Сетка: центральная колонка 1240px, крупные скругления, мягкие тени. */
@view-transition { navigation: auto; }

:root{
  --f-display:"Unbounded","Trebuchet MS",system-ui,sans-serif;
  --f-body:"Onest","Segoe UI",system-ui,-apple-system,sans-serif;

  /* главная */
  --bg:#F7F8FC; --fg:#171A26; --muted:#5E6577; --card:#FFFFFF; --line:#E6E8F0;
  --accent:#FF7A2F; --accent-ink:#FFFFFF; --accent-text:#E0601A; --accent-2:#4F7BFF;
  --shadow:0 1px 2px rgb(23 26 38 / .04),0 12px 32px -12px rgb(23 26 38 / .14);
  --radius:28px; --radius-s:16px;

  /* цвета направлений (используются на главной и в меню) */
  --c-hotels:#F2A93B; --c-clinics:#12A39E; --c-smart:#4F7BFF; --c-dev:#7357FF; --c-install:#FFC21A;
  color-scheme:light;
}
body.p-hotels{--bg:#0F1B2E;--fg:#F6F1E7;--muted:#AEB8C8;--card:#16263F;--line:#24375A;--accent:#F2B84B;--accent-ink:#1A1405;--accent-text:#F6C66A;--accent-2:#7CC4FF;--shadow:0 20px 50px -20px rgb(0 0 0 / .6);color-scheme:dark}
body.p-clinics{--bg:#F2F9F8;--fg:#10302E;--muted:#55716F;--card:#FFFFFF;--line:#D8ECEA;--accent:#0EA5A0;--accent-ink:#FFFFFF;--accent-text:#0A8682;--accent-2:#FF6F7D}
body.p-smart{--bg:#EEF3FF;--fg:#151C38;--muted:#566089;--card:#FFFFFF;--line:#DCE4FA;--accent:#4F7BFF;--accent-ink:#FFFFFF;--accent-text:#3560E8;--accent-2:#FFB547}
body.p-dev{--bg:#F5F2FF;--fg:#1D1645;--muted:#655F8E;--card:#FFFFFF;--line:#E4DDFF;--accent:#6E4CFF;--accent-ink:#FFFFFF;--accent-text:#5A37F0;--accent-2:#FF7B5C}
body.p-install{--bg:#F5F4F0;--fg:#1E2125;--muted:#62666D;--card:#FFFFFF;--line:#E4E2DA;--accent:#FFC21A;--accent-ink:#1E2125;--accent-text:#A87800;--accent-2:#2F6BFF}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--bg);color:var(--fg);font:400 1.0625rem/1.6 var(--f-body);overflow-x:clip;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:90;background:var(--bg)}
img,svg,canvas{max-width:100%}
a{color:inherit}
::selection{background:var(--accent);color:var(--accent-ink)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:8px}
.wrap{max-width:1240px;margin-inline:auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:600;line-height:1.08;letter-spacing:-.02em;margin:0;text-wrap:balance}
h1{font-size:clamp(2.3rem,1.3rem + 4.3vw,5.2rem)}
h2{font-size:clamp(1.8rem,1.25rem + 2.3vw,3.3rem)}
h3{font-size:clamp(1.12rem,1rem + .55vw,1.45rem);line-height:1.2}
p{margin:0}
.lead{font-size:clamp(1.1rem,1rem + .45vw,1.32rem);color:var(--muted);max-width:56ch;line-height:1.55}
.muted{color:var(--muted)}
.kicker{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:.88rem;color:var(--accent-text);background:color-mix(in oklab,var(--accent) 15%,transparent);padding:7px 14px;border-radius:999px;width:fit-content}
.kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent)}

/* ---------- кнопки ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 24px;border-radius:999px;background:var(--accent);color:var(--accent-ink);font:600 1rem var(--f-body);text-decoration:none;border:0;cursor:pointer;white-space:nowrap;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s;box-shadow:0 10px 24px -10px color-mix(in oklab,var(--accent) 80%,transparent)}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 30px -12px color-mix(in oklab,var(--accent) 90%,transparent)}
.btn:active{transform:translateY(0) scale(.98)}
.btn.soft{background:var(--card);color:var(--fg);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn.soft:hover{box-shadow:inset 0 0 0 1.5px var(--accent)}
.btn .ar{transition:transform .25s}
.btn:hover .ar{transform:translateX(4px)}
.btns{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- шапка ---------- */
.nav{position:fixed;top:calc(env(safe-area-inset-top,0px) + 12px);left:0;right:0;z-index:80;pointer-events:none}
.nav-in{pointer-events:auto;max-width:1240px;margin-inline:auto;margin-left:max(12px,env(safe-area-inset-left,0px));margin-right:max(12px,env(safe-area-inset-right,0px));display:flex;align-items:center;gap:16px;padding:8px 8px 8px 20px;border-radius:999px;background:color-mix(in oklab,var(--card) 82%,transparent);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);box-shadow:var(--shadow);border:1px solid color-mix(in oklab,var(--line) 70%,transparent)}
@media (min-width:1264px){.nav-in{margin-inline:auto}}
.logo{display:flex;align-items:center;gap:10px;font:700 1.05rem var(--f-display);letter-spacing:-.01em;text-decoration:none;white-space:nowrap}
.logo-mark{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:conic-gradient(from 200deg,var(--c-hotels),var(--c-install),var(--c-clinics),var(--c-smart),var(--c-dev),var(--c-hotels));color:#fff;font-size:.95rem;box-shadow:inset 0 0 0 2px rgb(255 255 255 / .35)}
.nav-links{display:flex;gap:4px;margin-left:auto}
.nav-links a{position:relative;padding:9px 14px;border-radius:999px;text-decoration:none;font-weight:500;font-size:.95rem;color:var(--muted);white-space:nowrap;transition:color .2s,background .2s}
.nav-links a:hover{color:var(--fg);background:color-mix(in oklab,var(--fg) 6%,transparent)}
.nav-links a[aria-current="page"]{color:var(--fg);background:color-mix(in oklab,var(--accent) 18%,transparent)}
.nav-links a i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:8px;vertical-align:1px}
.nav-cta{padding:11px 20px}
.burger{display:none;width:44px;height:44px;border-radius:50%;border:0;background:color-mix(in oklab,var(--fg) 7%,transparent);cursor:pointer;position:relative;color:var(--fg)}
.burger span{position:absolute;left:13px;right:13px;height:2px;background:currentColor;border-radius:2px;transition:transform .3s,top .3s}
.burger span:first-child{top:17px}.burger span:last-child{top:25px}
.burger[aria-expanded="true"] span:first-child{top:21px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{top:21px;transform:rotate(-45deg)}
@media (max-width:1020px){
  .burger{display:block}
  .nav-cta{margin-left:auto}
  .nav-links{position:absolute;top:calc(100% + 8px);left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));flex-direction:column;gap:2px;padding:10px;border-radius:24px;background:var(--card);box-shadow:var(--shadow);border:1px solid var(--line);opacity:0;transform:translateY(-8px) scale(.98);pointer-events:none;transition:opacity .25s,transform .25s;margin:0}
  .nav-links.open{opacity:1;transform:none;pointer-events:auto}
  .nav-links a{padding:14px 16px;font-size:1.05rem}
}
@media (max-width:420px){.nav-cta{display:none}.burger{margin-left:auto}}

/* ---------- секции ---------- */
.sec{padding-block:clamp(64px,9vw,128px)}
.sec-head{display:grid;gap:16px;margin-bottom:clamp(32px,5vw,56px);max-width:780px}
.grid{display:grid;gap:18px}
.g-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:960px){.g-3,.g-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.g-2,.g-3,.g-4{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(22px,2.4vw,32px);display:grid;gap:12px;align-content:start;min-width:0;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.card p{color:var(--muted)}
.ico{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:color-mix(in oklab,var(--accent) 16%,var(--card));color:var(--accent-text);margin-bottom:6px}
.ico svg{width:26px;height:26px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:8px 14px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-size:.92rem;font-weight:500}

/* ---------- шаги ---------- */
.steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;counter-reset:s}
.steps li{list-style:none;position:relative;padding-top:64px;display:grid;gap:8px;align-content:start}
.steps li::before{counter-increment:s;content:counter(s);position:absolute;top:0;left:0;width:48px;height:48px;border-radius:16px;display:grid;place-items:center;font:600 1.1rem var(--f-display);background:var(--accent);color:var(--accent-ink)}
.steps li:not(:last-child)::after{content:"";position:absolute;top:24px;left:60px;right:-6px;height:2px;background:repeating-linear-gradient(90deg,var(--line) 0 8px,transparent 8px 14px)}
.steps p{color:var(--muted);font-size:.97rem}
.steps{padding:0;margin:0}
@media (max-width:960px){.steps{grid-template-columns:1fr 1fr}.steps li::after{display:none}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}

/* ---------- вопросы ---------- */
.faq{display:grid;gap:12px;max-width:860px}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-s);padding:4px 22px;transition:border-color .2s}
.faq details[open]{border-color:var(--accent)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:16px 0;font-weight:600;font-size:1.05rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:color-mix(in oklab,var(--accent) 16%,transparent);color:var(--accent-text);font-size:1.3rem;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 18px;color:var(--muted);max-width:70ch}

/* ---------- сцены, управляемые прокруткой ---------- */
.scene{position:relative;height:var(--len,500vh)}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.scene-dots{position:absolute;right:max(20px,env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%);display:grid;gap:10px;z-index:5}
.scene-dots i{width:10px;height:10px;border-radius:50%;background:color-mix(in oklab,var(--fg) 20%,transparent);transition:background .3s,transform .3s}
.scene-dots i.on{background:var(--accent);transform:scale(1.35)}
.chapter{transition:opacity .25s,transform .35s cubic-bezier(.2,.8,.2,1)}
.chapter:not(.on){opacity:0;transform:translateY(24px);pointer-events:none}
.scroll-hint{display:inline-flex;align-items:center;gap:10px;font-size:.9rem;color:var(--muted)}
.scroll-hint i{width:22px;height:34px;border-radius:12px;border:2px solid currentColor;position:relative}
.scroll-hint i::after{content:"";position:absolute;left:50%;top:6px;width:4px;height:7px;margin-left:-2px;border-radius:2px;background:currentColor;animation:wheel 1.6s infinite}
@keyframes wheel{0%{opacity:0;transform:translateY(-3px)}40%{opacity:1}100%{opacity:0;transform:translateY(9px)}}

/* ---------- появление ---------- */
@supports (animation-timeline:view()){
  .rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
  @keyframes rv{from{opacity:0;transform:translateY(36px) scale(.98)}to{opacity:1;transform:none}}
}

/* ---------- контакты ---------- */
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,5vw,72px);align-items:start}
.contact-card{background:var(--accent);color:var(--accent-ink);border-radius:var(--radius);padding:clamp(26px,3.4vw,44px);display:grid;gap:20px;position:relative;overflow:hidden}
.contact-card::after{content:"";position:absolute;width:320px;height:320px;right:-120px;bottom:-140px;border-radius:50%;background:rgb(255 255 255 / .16)}
.contact-card h2{color:inherit}
.contact-card p{opacity:.85;max-width:40ch}
.cline{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;position:relative;z-index:1}
.cline strong{font:600 clamp(1.05rem,1rem + .4vw,1.3rem) var(--f-display);user-select:all}
.copy{font:600 .82rem var(--f-body);background:rgb(255 255 255 / .22);color:inherit;border:0;border-radius:999px;padding:7px 12px;cursor:pointer}
.copy:hover{background:rgb(255 255 255 / .34)}
body.p-install .copy,body.p-hotels .copy{background:rgb(0 0 0 / .1)}
form.lead-form{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(22px,3vw,40px);display:grid;gap:18px;box-shadow:var(--shadow)}
.field{display:grid;gap:7px}
.field label,.field legend{font-weight:600;font-size:.92rem}
.field input,.field textarea,.field select{font:inherit;color:var(--fg);background:var(--bg);border:1.5px solid var(--line);border-radius:14px;padding:14px 16px;width:100%;transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in oklab,var(--accent) 22%,transparent)}
fieldset{border:0;margin:0;padding:0}
.pick{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px;position:relative}
.pick input{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;pointer-events:none}
.pick label{padding:10px 16px;border-radius:999px;border:1.5px solid var(--line);cursor:pointer;font-weight:500;font-size:.94rem;transition:all .2s;background:var(--bg)}
.pick label:hover{border-color:var(--accent)}
.pick input:checked + label{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.pick input:focus-visible + label{outline:3px solid var(--accent);outline-offset:2px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-foot{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.form-note{font-size:.86rem;color:var(--muted);max-width:36ch}
.form-note.err{color:#D2453B}
.form-ok{display:none;padding:16px 18px;border-radius:14px;background:color-mix(in oklab,var(--accent) 14%,var(--card));font-size:.95rem}
form.sent .form-ok{display:block}
@media (max-width:900px){.contact{grid-template-columns:1fr}}
@media (max-width:560px){.two{grid-template-columns:1fr}}

/* ---------- подвал ---------- */
.foot{border-top:1px solid var(--line);padding-block:56px 40px;margin-top:clamp(40px,6vw,80px)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr;gap:32px}
.foot h4{font:600 .82rem var(--f-body);text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:14px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.foot a{text-decoration:none;color:var(--fg)}
.foot a:hover{color:var(--accent-text)}
.foot .req{font-size:.9rem;color:var(--muted);display:grid;gap:4px}
.foot .req b{color:var(--fg);font-weight:500;user-select:all}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:40px;padding-top:24px;border-top:1px solid var(--line);font-size:.88rem;color:var(--muted)}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot-grid{grid-template-columns:1fr}}

/* ---------- переходы между страницами ---------- */
::view-transition-old(root){animation:.35s ease both vt-out}
::view-transition-new(root){animation:.5s cubic-bezier(.2,.8,.2,1) both vt-in}
@keyframes vt-out{to{opacity:0;transform:scale(.985)}}
@keyframes vt-in{from{opacity:0;transform:translateY(16px)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}

/* заголовки в карточках сцен */
.chapter h2,.bcard h2{font-size:clamp(1.5rem,1.15rem + 1.3vw,2.3rem)}

/* контакты-ссылки, ловушка для спама, ссылка на карточку */
.cl{font:600 clamp(1.05rem,1rem + .4vw,1.3rem) var(--f-display);text-decoration:none;color:inherit}
.cl:hover{text-decoration:underline;text-underline-offset:4px}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.req-link{margin-top:6px;color:var(--accent-text)!important;font-weight:600}
.form-ok.err{background:color-mix(in oklab,#E5484D 12%,var(--card))}

/* клиенты: лента логотипов и карточки проектов */
.cl-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.cl-logo{display:grid;place-items:center;aspect-ratio:2/1;max-width:100%;border-radius:22px;background:var(--bg);border:1px solid var(--line);padding:6px;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.cl-logo:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.cl-logo svg{width:100%;height:100%}
@media (max-width:900px){.cl-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.cl-logo:last-child{grid-column:1/-1;aspect-ratio:4/1}}
.cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.case{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:grid;grid-template-rows:auto 1fr;scroll-margin-top:100px;transition:box-shadow .3s}
.case:target{box-shadow:0 0 0 3px var(--accent)}
.case-logo{background:var(--bg);display:grid;place-items:center;aspect-ratio:2/1;max-width:100%;padding:12px;border-bottom:1px solid var(--line)}
.case-logo svg{width:min(100%,420px);height:auto}
.case-body{padding:clamp(20px,2.6vw,30px);display:grid;gap:10px;align-content:start}
.case-type{font-size:.85rem;font-weight:600;color:var(--accent-text)}
.case h2{font-size:clamp(1.3rem,1.1rem + .8vw,1.8rem)}
.case-work{margin:0;padding:0;list-style:none;display:grid;gap:6px;color:var(--muted)}
.case-work li{display:flex;gap:8px}
.case-work li::before{content:"✓";color:var(--accent);font-weight:700}
.case-link{font-weight:600;text-decoration:none;color:var(--fg);margin-top:4px}
.case-link:hover{color:var(--accent-text)}
@media (max-width:760px){.cases{grid-template-columns:1fr}}
