/* ООО «Море Свободы» — оливковая палитра, Montserrat + Noto Sans (свои файлы шрифтов). */
@font-face{font-family:"Montserrat";font-style:normal;font-weight:600 700;font-display:swap;src:url(../type/mont-cyr.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:600 700;font-display:swap;src:url(../type/mont-lat.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400 600;font-display:swap;src:url(../type/noto-cyr.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400 600;font-display:swap;src:url(../type/noto-lat.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --ol-950:#1b2012;--ol-900:#252b19;--ol-800:#323a22;--ol-700:#434d2c;--ol-600:#5b6640;
  --sand-300:#d8cca6;--sand-100:#efe9d8;
  --linen:#f6f4ee;--white:#fff;--hair:#ddd8c9;--coal-ink:#1c1e17;--grey:#585b4e;--warn:#9b2c1d;
  --mast-h:72px;
  --face-head:"Montserrat",system-ui,sans-serif;--face-text:"Noto Sans",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font:400 17px/1.6 var(--face-text);color:var(--coal-ink);background:var(--linen);-webkit-font-smoothing:antialiased}
body{overflow-x:clip}
body:has(dialog[open]){overflow:hidden}
img,svg{display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--ol-700);outline-offset:3px}
.lead-in :focus-visible,.photoband :focus-visible,.colophon :focus-visible,.sheet-top :focus-visible{outline-color:var(--sand-300)}
.gl{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.measure{max-width:1200px;margin:0 auto;padding:0 32px}
main section[id]{scroll-margin-top:calc(var(--mast-h) + 1px)}
h1,h2,h3{font-family:var(--face-head);font-weight:700;letter-spacing:-.01em;overflow-wrap:break-word}
h2{font-size:clamp(26px,3vw,38px);line-height:1.15;text-wrap:balance}
.overline{display:flex;align-items:center;gap:12px;font:600 13px/1 var(--face-head);letter-spacing:.14em;text-transform:uppercase;color:var(--ol-600)}
.overline::before{content:"";width:28px;height:2px;background:currentColor}
.overline+h2{margin-top:16px}
.sub{font-size:19px;color:var(--grey);max-width:60ch}

/* кнопки */
.act{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border:0;border-radius:3px;font:600 16px/1.2 var(--face-head);text-align:center;text-decoration:none;cursor:pointer;transition:background-color .2s,color .2s,transform .15s}
.act:active{transform:translateY(1px)}
.act .gl{width:20px;height:20px}
.act-olive{background:var(--ol-700);color:#fff}
.act-olive:hover{background:var(--ol-900)}
.act-sand{background:var(--sand-300);color:var(--ol-950)}
.act-sand:hover{background:#fff}
.act.is-sending{opacity:.7;cursor:progress}

/* шапка */
.mast{position:sticky;top:0;z-index:50;background:var(--white);border-bottom:1px solid var(--hair)}
.mast-row{max-width:1360px;height:var(--mast-h);display:flex;align-items:center;gap:28px}
.sign{display:flex;align-items:center;gap:12px;text-decoration:none}
.sign i{width:6px;height:38px;background:var(--ol-700)}
.sign b{display:block;font:700 19px/1.1 var(--face-head);letter-spacing:-.01em;white-space:nowrap}
.sign small{display:block;font-size:13px;color:var(--grey);line-height:1.3}
.anchors{display:flex;gap:20px;margin-left:auto}
.anchors a{font:600 14.5px/1 var(--face-head);text-decoration:none;color:var(--grey);padding:8px 0;border-bottom:2px solid transparent;white-space:nowrap;transition:color .2s,border-color .2s}
.anchors a:hover,.anchors a.is-here{color:var(--coal-ink);border-color:var(--ol-700)}
.mast-tel{text-align:right;text-decoration:none}
.mast-tel>.gl{display:none}
.mast-tel b{display:block;font:700 17px/1.1 var(--face-head);white-space:nowrap;font-variant-numeric:tabular-nums}
.mast-tel small{font-size:12.5px;color:var(--grey);white-space:nowrap}
.mast-act{min-height:44px;padding:0 18px;font-size:14.5px}
.toggle{display:none;width:44px;height:44px;border:1px solid var(--hair);border-radius:3px;background:none;color:var(--coal-ink);align-items:center;justify-content:center;cursor:pointer}
.drawer{display:none}

/* «окна» со снимками. На компьютере (мышь, ширина больше 900) все четыре снимка стоят на месте, а страница
   прокручивается поверх них — background-attachment: fixed одинаково работает во всех настольных браузерах, включая
   Opera. На телефонах снимок прокручивается вместе со страницей: на вертикальном экране неподвижный снимок пришлось бы
   резать до узкой полоски, а iPhone такой фон не поддерживает вовсе. */
.win{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(135deg,#566039,#2b3220)}
.win-img{position:absolute;inset:0;background:var(--ph-l,none) center/cover no-repeat}
.win>:not(.win-img){position:relative;z-index:1}
@media (hover:hover) and (pointer:fine) and (min-width:901px){
  .win-img{background-attachment:fixed}
  /* Первый экран: снимок покрывает правую колонку (46 % ширины, 54 % слева), и куртка попадает в окно. */
  .lead-in .lead-photo .win-img{background-size:max(46vw,177.78vh) auto;background-position:calc(54vw - (max(46vw,177.78vh) - 46vw) * .45) center}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* первый экран */
.lead-in{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);min-height:min(calc(100svh - var(--mast-h)),760px);background:var(--ol-900);color:#f3f1ea}
.lead-copy{padding:64px 56px 56px max(32px,calc((100vw - 1200px)/2 + 32px));display:flex;flex-direction:column;justify-content:center}
.lead-in .overline{color:var(--sand-300)}
.lead-in h1{margin-top:22px;font-size:clamp(32px,3.6vw,50px);line-height:1.12;text-wrap:balance}
.lead-in .sub{margin-top:20px;color:#cfd2c2;font-size:18.5px}
.checkrow{list-style:none;padding:0;margin-top:26px;display:grid;gap:12px}
.checkrow li{display:flex;gap:12px;align-items:flex-start}
.checkrow .gl{color:var(--sand-300);margin-top:2px}
.checkrow-ink .gl{color:var(--ol-700)}
.lead-acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:34px}
.lead-tel{text-decoration:none}
.lead-tel b{display:block;font:700 20px/1.1 var(--face-head);white-space:nowrap}
.lead-tel small{color:#b9bca9;font-size:13.5px}
.lead-photo .win-img{background-position:45% 50%}
.lead-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ol-900),transparent 22%)}

/* полоса фактов */
.factline{background:var(--white);border-bottom:1px solid var(--hair)}
.factline ul{list-style:none;display:grid;grid-template-columns:repeat(4,1fr)}
.factline li{display:flex;gap:14px;padding:26px 24px;border-left:1px solid var(--hair)}
.factline li:first-child{border-left:0;padding-left:0}
.factline .gl{color:var(--ol-700);width:28px;height:28px}
.factline b{display:block;font:600 15.5px/1.3 var(--face-head)}
.factline span{font-size:14.5px;color:var(--grey);line-height:1.45}

/* разделы */
.part{padding:96px 0}
.part-white{background:var(--white);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.part-sand{background:var(--sand-100)}
.part-head{max-width:720px}
.part-head .sub{margin-top:14px}
.svcs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.svc{background:var(--white);border:1px solid var(--hair);border-top:3px solid var(--ol-700);border-radius:2px;padding:28px 26px 30px}
.svc-ico{width:52px;height:52px;display:grid;place-items:center;background:var(--sand-100);color:var(--ol-700)}
.svc h3{margin-top:20px;font-size:19px;line-height:1.25}
.svc p{margin-top:10px;color:var(--grey);font-size:16px}

/* полоса с тезисом */
.photoband{color:#fff}
.photoband::after{content:"";position:absolute;inset:0;background:rgba(27,32,18,.6)}
.photoband-row{padding-top:120px;padding-bottom:120px;display:flex;align-items:flex-end;justify-content:space-between;gap:40px}
.photoband p{font:700 clamp(24px,2.7vw,36px)/1.25 var(--face-head);max-width:22ch;text-wrap:balance}

/* ситуации */
.pair{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}
.frame{position:relative;aspect-ratio:4/5;border:1px solid var(--hair);padding:12px;background:var(--white)}
.frame .win{position:absolute;inset:12px;background:linear-gradient(135deg,#9aa077,#5d6740)}
.sitlist{list-style:none;padding:0;margin-top:28px;border-top:1px solid var(--hair)}
.sitlist li{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid var(--hair)}
.sitlist .gl{color:var(--ol-700);margin-top:1px}
.aside{margin-top:24px;padding:18px 20px;background:var(--sand-100);border-left:3px solid var(--ol-700);font-size:15.5px;color:#3d4033}

/* как работаем */
.route{list-style:none;padding:0;margin-top:48px;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;counter-reset:route}
.route li{position:relative;padding-top:64px}
.route li::before{counter-increment:route;content:counter(route);position:absolute;top:0;left:0;width:46px;height:46px;display:grid;place-items:center;background:var(--ol-700);color:#fff;font:700 18px/1 var(--face-head)}
.route li::after{content:"";position:absolute;top:23px;left:58px;right:-16px;height:1px;background:var(--hair)}
.route li:last-child::after{display:none}
.route h3{font-size:18px}
.route p{margin-top:8px;color:var(--grey);font-size:15.5px}

/* о компании */
.firm-pad{padding-top:110px;padding-bottom:110px}
.card-duo{background:var(--white);display:grid;grid-template-columns:1fr 1fr;max-width:1040px}
.card-duo>div{padding:44px 44px 46px}
.card-duo p{margin-top:16px;color:var(--grey)}
.card-req{background:var(--linen);border-left:1px solid var(--hair)}
.card-req h3{font-size:17px}
.card-req dl{display:grid;grid-template-columns:auto 1fr;gap:10px 20px;margin-top:16px;font-size:15.5px}
.card-req dt{color:var(--grey)}
.card-req dd{font-weight:500;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}

/* заявка */
.pair-form{grid-template-columns:.85fr 1.15fr;align-items:start}
.pair-form .checkrow{margin-top:28px}
.pair-form .sub{margin-top:14px}
.quest{background:var(--white);border:1px solid var(--hair);border-radius:2px;box-shadow:0 18px 40px -24px rgba(27,32,18,.45)}
.quest-top{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:66px;padding:12px 28px 0}
.quest-count{font:600 13px/1 var(--face-head);letter-spacing:.12em;text-transform:uppercase;color:var(--ol-600)}
.quest-back{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 6px;border:0;background:none;font:500 15px/1 var(--face-text);color:var(--grey);cursor:pointer}
.quest-back[hidden]{display:none}
.quest-back .gl{width:20px;height:20px}
.quest-bar{height:4px;background:var(--sand-100);margin:6px 28px 0}
.quest-bar i{display:block;height:100%;width:25%;background:var(--ol-700);transition:width .35s ease}
.quest-body{padding:22px 28px 26px}
.quest-q{font:700 23px/1.25 var(--face-head)}
.quest-q:focus{outline:none}
.reply-set{display:grid;gap:10px;margin-top:18px}
.reply-btn{width:100%;min-height:56px;display:flex;align-items:center;gap:14px;padding:12px 16px;border:1px solid var(--hair);border-radius:2px;background:var(--white);font:500 16.5px/1.3 var(--face-text);color:var(--coal-ink);text-align:left;cursor:pointer;transition:border-color .2s,background-color .2s}
.reply-btn i{width:20px;height:20px;border:2px solid var(--ol-600);border-radius:50%;flex:none;transition:box-shadow .2s,background-color .2s}
.reply-btn:hover{border-color:var(--ol-700);background:#fafaf6}
.reply-btn:hover i,.reply-btn[aria-pressed=true] i{box-shadow:inset 0 0 0 4px #fff;background:var(--ol-700)}
.reply-btn[aria-pressed=true]{border-color:var(--ol-700);background:#f4f5ee}
.inrow{margin-top:16px}
.inrow label{display:block;font:600 14.5px/1.3 var(--face-head);margin-bottom:7px}
.inrow label span{font:400 14px var(--face-text);color:var(--grey)}
.inrow input,.phone-box{width:100%;min-height:52px;border:1px solid #c9c3b1;border-radius:2px;background:#fff;font:400 17px var(--face-text);color:var(--coal-ink)}
.inrow input{padding:0 14px}
.phone-box{display:flex;align-items:center}
.phone-box span{padding:0 4px 0 14px;font-weight:500}
.phone-box input{border:0;min-height:50px;padding:0 14px 0 4px;background:none}
.inrow input:focus{outline:none}
.inrow>input:focus,.phone-box:focus-within{outline:3px solid var(--ol-700);outline-offset:0;border-color:var(--ol-700)}
.field-err{display:none;margin-top:6px;font-size:14px;color:var(--warn)}
.inrow.is-wrong>input,.inrow.is-wrong .phone-box{border-color:var(--warn)}
.inrow.is-wrong .field-err,.nod.is-wrong+.field-err{display:block}
.nod{display:flex;gap:12px;margin-top:16px;font-size:14.5px;color:var(--grey);cursor:pointer}
.nod input{width:22px;height:22px;flex:none;margin-top:1px;accent-color:var(--ol-700)}
.nod.is-wrong{color:var(--warn)}
.who-calls{margin-top:16px;padding:14px 16px;background:var(--linen);border-left:3px solid var(--ol-700);font-size:14.5px;color:#3d4033}
.fine{margin-top:12px;font-size:13.5px;color:var(--grey)}
.quest-send{width:100%;margin-top:18px}
.trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.quest-fail{margin-top:16px;padding:14px 16px;border:1px solid var(--warn);background:#fbf1ee;color:var(--warn);font-size:15px}
.quest-fail a{font-weight:600;white-space:nowrap}
.quest-done>.gl{width:44px;height:44px;color:var(--ol-700);margin-bottom:14px}
.quest-done>p:not(.quest-q){margin-top:12px;color:var(--grey)}
.quest-max{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:20px;font-size:14.5px;color:var(--grey)}
.quest-seller{padding:14px 28px 18px;border-top:1px solid var(--hair);font-size:13px;line-height:1.5;color:var(--grey)}
.quest-seller b{color:var(--coal-ink);font-weight:600}
.quest-seller a{white-space:nowrap}

/* вопросы */
.askbox{max-width:860px;margin-top:40px;border-top:1px solid var(--hair)}
.askbox details{border-bottom:1px solid var(--hair)}
.askbox summary{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:64px;padding:16px 0;font:600 18px/1.35 var(--face-head);cursor:pointer;list-style:none}
.askbox summary::-webkit-details-marker{display:none}
.askbox summary::after{content:"";width:12px;height:12px;flex:none;margin-right:4px;border-right:2px solid var(--ol-700);border-bottom:2px solid var(--ol-700);transform:translateY(-3px) rotate(45deg);transition:transform .25s}
.askbox details[open] summary::after{transform:translateY(3px) rotate(225deg)}
.askbox details p{padding:0 40px 22px 0;color:var(--grey)}

/* подвал */
.colophon{background:var(--ol-950);color:#c9ccbb;padding:56px 0 40px;font-size:15px}
.base-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:40px}
.colophon b{color:#fff;font-family:var(--face-head)}
.colophon p+p{margin-top:8px}
.colophon a{color:#e8e3d0}
.base-note{grid-column:1/-1;padding-top:24px;border-top:1px solid #343b25;font-size:13.5px;color:#a3a793}

/* окно с опросом */
.sheet{width:min(560px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 24px);margin:auto;padding:0;border:0;background:transparent;overflow:visible;color:var(--coal-ink)}
.sheet::backdrop{background:rgba(20,24,13,.72)}
.sheet-box{max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;background:var(--white)}
.sheet-top{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 12px 12px 28px;background:var(--ol-900);color:#fff}
.sheet-top p{font:700 18px/1.2 var(--face-head)}
.sheet-x{width:44px;height:44px;display:grid;place-items:center;border:0;background:none;color:#fff;cursor:pointer}
.sheet .quest{border:0;box-shadow:none}

/* юридические страницы и 404 */
.paper{max-width:860px;padding-top:64px;padding-bottom:96px}
.paper h1{font-size:clamp(28px,3.4vw,40px);line-height:1.15}
.paper .stamp{margin-top:12px;color:var(--grey);font-size:15px}
.paper h2{margin-top:40px;font-size:21px;line-height:1.3}
.paper p,.paper li{margin-top:12px}
.paper ul,.paper ol{padding-left:22px}
.paper a{color:var(--ol-700)}
.paper .act{margin-top:28px}

.dock{display:none}

@media (max-width:1320px){
  .mast-act{display:none}
}
@media (max-width:1180px){
  .anchors{display:none}
  .mast-tel{margin-left:auto}
  .toggle{display:inline-flex}
  .drawer{position:absolute;top:100%;left:0;right:0;background:var(--white);border-bottom:1px solid var(--hair);box-shadow:0 12px 24px -16px rgba(0,0,0,.3)}
  .drawer.is-open{display:block}
  .drawer a{display:block;padding:14px 32px;font:600 16px/1.2 var(--face-head);text-decoration:none;border-top:1px solid var(--hair)}
}
@media (max-width:900px){
  :root{--mast-h:64px}
  .measure{padding:0 16px}
  .mast-row{gap:14px}
  .mast-act,.mast-tel small,.sign small{display:none}
  .mast-tel b{font-size:15.5px}
  .drawer a{padding:14px 16px}
  .lead-in{grid-template-columns:1fr;position:relative;min-height:0}
  .lead-copy{padding:32px 16px 36px;position:relative;z-index:1}
  .lead-in h1{margin-top:16px}
  .lead-in .sub{margin-top:16px}
  .lead-acts{margin-top:24px}
  .lead-in .checkrow{order:2;margin-top:28px}
  .lead-photo{position:absolute;inset:0}
  .lead-photo .win-img{background-position:40% 50%}
  .lead-photo::after{background:rgba(37,43,25,.78)}
  .lead-in .sub{font-size:17px}
  .win-img{background-image:var(--ph-s,none)}
  .factline ul{grid-template-columns:1fr 1fr}
  .factline li{padding:20px 12px;border-left:0;border-top:1px solid var(--hair)}
  .factline li:nth-child(-n+2){border-top:0}
  .factline li:first-child{padding-left:12px}
  .part{padding:64px 0}
  .svcs{grid-template-columns:1fr;gap:14px;margin-top:32px}
  .photoband-row{flex-direction:column;align-items:flex-start;padding-top:80px;padding-bottom:80px}
  .pair,.pair-form{grid-template-columns:1fr;gap:32px}
  .frame{aspect-ratio:3/2}
  .route{grid-template-columns:1fr;gap:22px}
  .route li{padding:0 0 0 64px}
  .route li::after{display:none}
  .firm.win{background:var(--linen)}
  .firm .win-img{bottom:auto;height:56.25vw}
  .firm-pad{padding-top:calc(56.25vw - 28px);padding-bottom:48px}
  .card-duo{grid-template-columns:1fr}
  .card-duo>div{padding:28px 20px}
  .card-req{border-left:0;border-top:1px solid var(--hair)}
  .card-req dl{grid-template-columns:1fr;gap:2px}
  .card-req dd{margin-bottom:10px}
  .quest-top,.quest-body{padding-left:18px;padding-right:18px}
  .quest-bar{margin-left:18px;margin-right:18px}
  .quest-seller{padding:14px 18px 16px}
  .quest-q{font-size:20px}
  .sheet-top{padding-left:18px}
  .askbox summary{font-size:16.5px}
  .askbox details p{padding-right:0}
  .base-grid{grid-template-columns:1fr;gap:24px}
  .colophon{padding-bottom:110px}
  .paper{padding-top:40px;padding-bottom:64px}
  .dock{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--white);border-top:1px solid var(--hair)}
  .dock .act{flex:1;min-height:50px;padding:0 12px}
  .dock .dock-call{flex:none;width:56px;padding:0;background:var(--sand-100);color:var(--ol-900)}
}
@media (max-width:600px){
  .mast-tel>span{display:none}
  .mast-tel>.gl{display:block}
  .mast-tel{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--hair);border-radius:3px;color:var(--ol-700)}
  .factline ul{grid-template-columns:1fr}
  .factline li,.factline li:first-child{padding:16px 0}
  .factline li:nth-child(2){border-top:1px solid var(--hair)}
}
@media (max-width:360px){
  .sign b{font-size:17px}
  .lead-in h1{font-size:29px}
}