/* fixes.css v1 (2026-10-13). Подключается ПОСЛЕ style.css и перекрывает накопившиеся слои.
   Охват: шапка, бургер-меню, первый экран, блок «Обо мне», реакция кнопок.
   Откат: убрать из index.html строки подключения fixes.css и fixes.js. */

:root{--fx-ink:#243947;--fx-cream:#F0E6D8;--fx-sand:#D8C2A6;--fx-sand-2:#EAD9C0}
html body{max-width:100%;overflow-x:clip}

/* ---------- ШАПКА ---------- */
html body .topbar{
  position:absolute!important;top:0!important;left:0!important;right:0!important;
  z-index:60!important;margin:0!important;padding:0!important;
  background:linear-gradient(180deg,rgba(36,57,71,.72),rgba(36,57,71,.56))!important;
  border:0!important;border-bottom:1px solid rgba(240,230,216,.22)!important;box-shadow:none!important;outline:0!important;
  backdrop-filter:blur(18px) saturate(1.2)!important;-webkit-backdrop-filter:blur(18px) saturate(1.2)!important}
html body .topbar::before,html body .topbar::after{content:none!important;display:none!important}
html body .topbar .wrap.nav,html body .topbar .nav{
  display:flex!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;
  max-width:none!important;margin:0 auto!important;width:100%!important;
  background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html body .topbar .brand{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:3px!important;
  min-width:0!important;width:auto!important;flex:0 1 auto!important;text-decoration:none!important;line-height:1.1!important}
html body .topbar .brand strong{display:block!important;font-size:clamp(1.3rem,5.2vw,1.55rem)!important;line-height:1.05!important;
  color:var(--fx-cream)!important;white-space:nowrap!important}
html body .topbar .brand em{display:block!important;font-size:clamp(.58rem,2.4vw,.7rem)!important;line-height:1.2!important;
  letter-spacing:.07em!important;text-transform:uppercase!important;font-style:normal!important;
  color:rgba(243,234,220,.84)!important;white-space:normal!important}
html body .topbar .brand-project{display:none!important}

@media (min-width:1025px){
  html body .topbar .wrap.nav,html body .topbar .nav{min-height:66px!important;padding:9px clamp(24px,4vw,56px)!important}
  html body .topbar .navlinks{display:flex!important;flex:1 1 auto!important;justify-content:center!important;align-items:center!important;gap:6px!important}
  html body .topbar .burger,html body .topbar .mobile-menu,html body.menu-open .topbar .mobile-menu{display:none!important}
}
@media (max-width:1024px){
  html body .topbar .wrap.nav,html body .topbar .nav{
    min-height:66px!important;padding:9px 16px!important}
  html body .topbar .navlinks,html body .topbar .navbtn{display:none!important}
  html body .topbar .burger{display:inline-flex!important;flex-direction:column;align-items:center;justify-content:center;gap:5px;
    flex:0 0 auto!important;width:46px;height:46px;min-width:46px;margin-left:auto!important;padding:0;border-radius:14px;
    border:1px solid rgba(243,234,220,.38)!important;background:rgba(243,234,220,.10)!important;cursor:pointer;position:relative;z-index:61}
  html body .topbar .burger span{display:block!important;width:20px;height:2px;border-radius:2px;background:var(--fx-cream)!important;
    transition:transform .22s ease,opacity .18s ease}
  html body.menu-open .topbar .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  html body.menu-open .topbar .burger span:nth-child(2){opacity:0}
  html body.menu-open .topbar .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  html body .topbar .mobile-menu{display:none!important}
  html body.menu-open .topbar .mobile-menu{display:flex!important;flex-direction:column;gap:2px;
    position:absolute!important;top:calc(100% + 8px)!important;left:14px!important;right:14px!important;
    width:auto!important;max-width:460px;margin:0 0 0 auto!important;padding:10px!important;border-radius:18px;
    background:rgba(36,57,71,.97)!important;border:1px solid rgba(240,230,216,.20)!important;
    box-shadow:0 24px 50px rgba(6,14,20,.45)!important;backdrop-filter:none!important;
    max-height:calc(100svh - 110px);overflow:auto;z-index:62}
  html body .topbar .mobile-menu a{display:block!important;padding:14px!important;border-radius:12px;font-size:1.02rem!important;
    color:var(--fx-cream)!important;text-decoration:none!important;border:0!important}
  html body .topbar .mobile-menu a:hover,html body .topbar .mobile-menu a:active{background:rgba(243,234,220,.10)!important}
  html body .topbar .mobile-menu .btn{width:100%;margin-top:8px;min-height:50px}
}

/* ---------- ПЕРВЫЙ ЭКРАН ---------- */
html body .hero.hero-photo{
  position:relative!important;overflow:hidden!important;
  min-height:max(100svh,min(60vw,1150px))!important;height:auto!important;
  display:flex!important;align-items:center!important;padding:0!important;
  background:
    linear-gradient(90deg,rgba(36,57,71,.84) 0%,rgba(44,67,82,.68) 18%,rgba(51,78,95,.42) 38%,rgba(51,78,95,.16) 56%,rgba(51,78,95,.04) 66%,rgba(51,78,95,0) 74%),
    url('../img/photos/hero-current-v53.png') 90% 45% / cover no-repeat,
    #334E5F!important;
}
html body .hero.hero-photo .hero-wrap{
  width:min(calc(100% - 40px),1240px)!important;max-width:none!important;min-height:0!important;
  margin:0 auto!important;padding:128px 0 64px!important;display:block!important;align-items:initial!important}
html body .hero.hero-photo .hero-copy.hero-text-only{
  max-width:640px!important;width:100%!important;margin:0!important;padding:0!important;
  background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;backdrop-filter:none!important}
html body .hero.hero-photo .hero-copy.hero-text-only h1{
  max-width:15em!important;margin:0 0 22px!important;
  font-size:clamp(2.1rem,3.5vw,3.7rem)!important;line-height:1.06!important;letter-spacing:-.025em!important;
  color:var(--fx-cream)!important;text-wrap:balance;text-shadow:0 2px 22px rgba(8,16,22,.35)}
html body .hero.hero-photo .hero-copy.hero-text-only h1 .h1-accent{color:var(--fx-sand)!important}
html body .hero.hero-photo .hero-copy.hero-text-only .lead{
  max-width:34em!important;margin:0!important;font-size:clamp(1rem,1.25vw,1.18rem)!important;line-height:1.55!important;
  color:rgba(243,234,220,.92)!important;text-shadow:0 1px 14px rgba(8,16,22,.35)}
html body .hero.hero-photo .hero-methods{
  position:relative;margin:20px 0 0!important;padding-top:16px;max-width:34em;
  font-size:.78rem!important;line-height:1.6;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  color:var(--fx-sand)!important;opacity:.95}
html body .hero.hero-photo .hero-methods::before{content:"";position:absolute;top:0;left:0;width:44px;height:1px;background:rgba(216,194,166,.7)}

html body .hero.hero-photo .btnrow{display:flex!important;flex-wrap:wrap!important;gap:14px!important;margin:32px 0 0!important}
html body .hero.hero-photo .btnrow .btn{
  min-height:54px!important;min-width:0!important;width:auto!important;padding:0 28px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  border-radius:999px!important;font-weight:700!important;font-size:.98rem!important;cursor:pointer;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease!important}
html body .hero.hero-photo .btnrow .btn.btn-primary.hero-cta{
  background:var(--fx-sand)!important;color:#243947!important;border:1px solid var(--fx-sand)!important;box-shadow:0 10px 26px rgba(6,14,20,.28)!important}
html body .hero.hero-photo .btnrow .btn.btn-primary.hero-cta:hover{
  background:var(--fx-sand-2)!important;border-color:var(--fx-sand-2)!important;color:#15262f!important;transform:translateY(-2px);box-shadow:0 16px 32px rgba(6,14,20,.36)!important}
html body .hero.hero-photo .btnrow .btn.btn-primary.hero-cta:active{background:#CDB794!important;transform:translateY(0);box-shadow:none!important}
html body .hero.hero-photo .btnrow .btn.outline.hero-cta{
  background:rgba(243,234,220,.08)!important;color:var(--fx-cream)!important;border:1px solid rgba(243,234,220,.62)!important;box-shadow:none!important}
html body .hero.hero-photo .btnrow .btn.outline.hero-cta:hover{
  background:rgba(243,234,220,.20)!important;border-color:var(--fx-cream)!important;color:#fff!important;transform:translateY(-2px);box-shadow:0 12px 26px rgba(6,14,20,.28)!important}
html body .hero.hero-photo .btnrow .btn.outline.hero-cta:active{background:rgba(243,234,220,.12)!important;transform:translateY(0);box-shadow:none!important}

@media (max-width:820px){
  html body .hero.hero-photo{display:block!important;min-height:max(660px,100svh)!important;
    background:
      linear-gradient(90deg,rgba(36,57,71,.90) 0%,rgba(38,60,75,.88) 20%,rgba(42,64,80,.82) 34%,rgba(44,67,82,.70) 46%,rgba(46,71,87,.54) 56%,rgba(49,75,92,.38) 65%,rgba(51,78,95,.24) 74%,rgba(51,78,95,.12) 83%,rgba(51,78,95,.04) 92%,rgba(51,78,95,0) 100%),
      url('../img/photos/hero-current-v53.png') 63% 0 / cover no-repeat,
      #334E5F!important}
  html body .hero.hero-photo .hero-wrap{padding:126px 0 34px!important;min-height:max(660px,100svh)!important;box-sizing:border-box}
  html body .hero.hero-photo .hero-copy.hero-text-only{display:flex!important;flex-direction:column!important;
    max-width:none!important;min-height:calc(max(660px,100svh) - 160px)!important}
  html body .hero.hero-photo .hero-copy.hero-text-only h1,
  html body .hero.hero-photo .hero-copy.hero-text-only .lead,
  html body .hero.hero-photo .hero-methods{max-width:min(63%,430px)!important}
  html body .hero.hero-photo .hero-copy.hero-text-only h1{margin-bottom:16px!important;font-size:clamp(1.55rem,6.9vw,2.2rem)!important;line-height:1.1!important}
  html body .hero.hero-photo .hero-copy.hero-text-only .lead{font-size:.92rem!important;line-height:1.45!important;margin-top:auto!important;padding-top:24px}
  html body .hero.hero-photo .hero-methods{margin-top:18px!important;padding-top:14px;font-size:.68rem!important;letter-spacing:.09em}
  html body .hero.hero-photo .btnrow{flex-direction:column!important;align-items:flex-start!important;gap:10px!important;margin:0!important;padding-top:26px;width:min(58%,236px)}
  html body .hero.hero-photo .btnrow .btn{width:100%!important;min-height:50px!important;padding:0 18px!important;font-size:.94rem!important}
}

/* ---------- «ОБО МНЕ» ---------- */
html body .about-section{
  position:relative!important;overflow:hidden!important;min-height:min(78svh,700px)!important;
  display:flex!important;align-items:center!important;padding:72px 0!important;
  background:
    linear-gradient(90deg,rgba(36,57,71,.90) 0%,rgba(44,67,82,.76) 30%,rgba(51,78,95,.34) 52%,rgba(51,78,95,0) 72%),
    url('../img/photos/about-current-v52.png') 70% center / cover no-repeat,
    #334E5F!important}
html body .about-section .about-wrap{width:min(calc(100% - 40px),1240px)!important;max-width:none!important;min-height:0!important;margin:0 auto!important;display:block!important}
html body .about-section .about-panel,html body .about-section .about-panel.about-text-only{
  max-width:560px!important;margin:0!important;padding:0!important;background:none!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html body .about-section .about-panel .kicker{color:var(--fx-sand)!important}
html body .about-section .about-panel h2{color:var(--fx-cream)!important;font-size:clamp(2rem,3.4vw,3rem)!important;margin-bottom:16px!important}
html body .about-section .about-panel p{color:rgba(243,234,220,.92)!important;font-size:1.02rem!important;line-height:1.62!important;text-shadow:0 1px 14px rgba(8,16,22,.3)}
@media (max-width:820px){
  html body .about-section{display:block!important;min-height:620px!important;padding:104px 0 40px!important;
    background:
      linear-gradient(90deg,rgba(36,57,71,.90) 0%,rgba(38,60,75,.88) 20%,rgba(42,64,80,.82) 34%,rgba(44,67,82,.70) 46%,rgba(46,71,87,.54) 56%,rgba(49,75,92,.38) 65%,rgba(51,78,95,.24) 74%,rgba(51,78,95,.12) 83%,rgba(51,78,95,.04) 92%,rgba(51,78,95,0) 100%),
      url('../img/photos/about-current-v52.png') 66% 50% / cover no-repeat,
      #334E5F!important}
  html body .about-section .about-panel,html body .about-section .about-panel.about-text-only{max-width:min(62%,430px)!important}
  html body .about-section .about-panel h2{font-size:clamp(1.65rem,7vw,2.1rem)!important;line-height:1.1!important}
  html body .about-section .about-panel p{font-size:.95rem!important;line-height:1.5!important}
}

/* ---------- РЕАКЦИЯ КНОПОК (весь сайт) ---------- */
html body .btn,html body .navbtn{transition:transform .2s ease,box-shadow .2s ease,filter .2s ease,background-color .2s ease,border-color .2s ease!important}
html body .btn:hover,html body .navbtn:hover{transform:translateY(-2px);filter:brightness(1.07);box-shadow:0 10px 24px rgba(20,36,46,.22)}
html body .btn:active,html body .navbtn:active{transform:translateY(0);filter:brightness(.97);box-shadow:none}
html body .btn:focus-visible,html body .navbtn:focus-visible,html body .burger:focus-visible{outline:3px solid rgba(216,194,166,.8);outline-offset:3px}
@media (prefers-reduced-motion:reduce){html body .btn,html body .navbtn,html body .burger span{transition:none!important}html body .btn:hover{transform:none}}

/* picker-z */
.format-detail-modal{z-index:9300!important}
.request-modal{z-index:9400!important}
