@font-face {
    font-family: 'RF Dewi Condensed';
    src:
        url('/wp-content/themes/oversa/static/fonts/RFDewiExpandedRegular.woff2') format('woff2'),
        url('/wp-content/themes/oversa/static/fonts/RFDewiExpandedRegular.woff') format('woff'),
        url('/wp-content/themes/oversa/static/fonts/RFDewiExpandedRegular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'RF Dewi Expanded';
    src:
        url('/wp-content/themes/oversa/static/fonts/RFDewiExpandedSemibold.woff2') format('woff2'),
        url('/wp-content/themes/oversa/static/fonts/RFDewiExpandedSemibold.woff') format('woff'),
        url('/wp-content/themes/oversa/static/fonts/RFDewiExpandedSemibold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root{
    --absolute-black: #000000;
    --black:#0d0d0d;
    --near-black:#151412;
    --cream:#f3f1ec;
    --paper:#ffffff;
    --wood:#8a6a45;
    --wood-dark:#5c4429;
    --grey-line: rgba(0, 0, 0, 0.3);
    --grey-text:#6f6b63;
    --section-gap:6.25vw;
}

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:'RF Dewi Expanded',sans-serif;
    background:var(--paper);
    color:var(--black);
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,h4,.display{
    font-family:'RF Dewi Expanded',sans-serif;
    margin:0;
    letter-spacing:-0.01em;
  }
  p {margin: 0;}
  a{color:inherit;text-decoration:none;}
  button{font-family:inherit;cursor:pointer;border:none;background:none;}
  img{display:block;max-width:100%;}

  /* ---------- layout helpers ---------- */
  .flex{display:flex;}
  .row-flex{display:flex;flex-direction:row;}
  .column-flex{display:flex;flex-direction:column;}
  .wrap{flex-wrap:wrap;}
  .center{align-items:center;}
  .start{align-items:flex-start!important;}
  .between{justify-content:space-between;}
  .container{
    width:100%;
    max-width:clamp(314px, 71.46vw, 1372px);
    margin:0 auto;
  }
  section{padding-bottom:var(--section-gap); max-width: 100%; overflow: clip;}
  .eyebrow{
    font-family:'RF Dewi Expanded',sans-serif;
    font-size: clamp(10px, 0.68vw, 13px);
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--grey-text);
  }
  .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:.7292vw .9375vw;
    background:var(--black);
    color:#fff;
    font-weight:600;
    font-size: clamp(14px, 0.9375vw, 18px);
    transition:background .25s ease, color .25s ease, transform .2s ease;
    white-space:nowrap;
  }
  .btn:hover{background:var(--wood-dark);}
  .btn.light{background:#fff;color:var(--black);}
  .btn.light:hover{background:var(--wood);color:#fff;}
  .btn.outline{background:transparent;border:1px solid rgba(255,255,255,.5);color:#fff;}

  /* ================= HEADER ================= */
  header.site-header{
    position:fixed;
    top:0;left:0;right:0;
    z-index:900;
    padding:1.3vw 0;
    background:transparent;
    transition:background .35s ease, padding .3s ease, box-shadow .3s ease;
  }
  header.site-header.solid{
    background:rgba(13,13,13,.96);
    padding:.83vw 0;
    box-shadow:0 6px 1.25vw rgba(0,0,0,.25);
  }
  header .container{align-items:center;justify-content:space-between;}
  .header-left{gap:1.04vw;color:#fff;font-size: clamp(18px, 1.25vw, 24px);letter-spacing:.1em;}
  .header-left span{cursor:pointer;}
  .header-left .divider{width:1px;height:2.08vw;background:rgba(255,255,255,.35);}
  .icon-btn{
    width:2.08vw;height:1.875vw;display:inline-flex;align-items:center;justify-content:center;
  }
  .logo{gap:10px;color:#fff;align-items:center;}
  .logo .mark{
    width:1.77vw;height:1.77vw;
    background:linear-gradient(135deg,#fff 50%,transparent 50%),linear-gradient(45deg,#fff 50%, transparent 50%);
  }
  .logo-svg{width:1.77vw;height:1.77vw;}
  .logo-text{font-family:'RF Dewi Expanded',sans-serif;font-size:.7292vw;line-height:1.25;font-weight:700;letter-spacing:.02em;}
  .header-right{gap:14px;align-items:center;position: relative;}
  .phone-icon-btn{
    width:52px;height:52px;border:1px solid rgba(255,255,255,.4);
    display:flex;align-items:center;justify-content:center;border-radius:2px;
    color:#fff;transition:border-color .25s ease, background .25s ease;
	cursor: pointer;position: relative;z-index: 2;
  }
  .phone-icon-btn:hover{background:rgba(255,255,255,.1);border-color:#fff;}
  .header-cta{
    padding:.83vw 1.35vw;border:1px solid rgba(255,255,255,.5);color:#fff;font-size: clamp(14px, 0.9375vw, 18px);font-weight:500;
    border-radius:2px;transition:background .25s ease,border-color .25s ease;
  }
  .header-cta:hover{background:#fff;color:var(--black);border-color:#fff;}
	/* Выпадающий блок — стекло + шум */
	.phone-dropdown {
	  position: absolute;
	  top: calc(100% + 12px);
	  right: 0;
	  width: 100%;
	  min-width: 260px;

	  /* Полупрозрачная тёмная подложка */
	  background: rgba(20, 20, 20, 0.45);

	  /* Размытие всего что под окном */
	  backdrop-filter: blur(16px) saturate(140%);
	  -webkit-backdrop-filter: blur(16px) saturate(140%);

	  /* Лёгкая светлая рамка для объёма стекла */
	  border: 1px solid rgba(255, 255, 255, 0.12);
	  border-radius: 12px;

	  padding: 20px;
	  box-shadow: 
		0 8px 32px rgba(0, 0, 0, 0.35),
		inset 0 1px 0 rgba(255, 255, 255, 0.08);

	  /* Шум (grain) поверх */
	  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.055'/%3E%3C/svg%3E");

	  opacity: 0;
	  visibility: hidden;
	  transform: translateY(-8px);
	  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	  z-index: 999;
	  color: #fff;
	  text-align: left;
	  box-sizing: border-box;
	}

	/* Стрелочка сверху — тоже стекло */
	.phone-dropdown::before {
	  content: '';
	  position: absolute;
	  top: -6px;
	  right: 13px;
	  width: 12px;
	  height: 12px;
	  background: rgba(20, 20, 20, 0.45);
	  backdrop-filter: blur(16px) saturate(140%);
	  -webkit-backdrop-filter: blur(16px) saturate(140%);
	  border-top: 1px solid rgba(255, 255, 255, 0.12);
	  border-left: 1px solid rgba(255, 255, 255, 0.12);
	  transform: rotate(45deg);
	  border-radius: 2px;
	}

	/* Активное состояние */
	.phone-dropdown.active {
	  opacity: 1;
	  visibility: visible;
	  transform: translateY(0);
	}

	/* Соцсети */
	.phone-dropdown__socials {
	  display: flex;
	  gap: 10px;
	  margin-bottom: 18px;
	}

	.phone-dropdown__socials a {
	  width: 34px;
	  height: 34px;
	  background: rgba(255, 255, 255, 0.9);
	  border-radius: 50%;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  color: #1a1a1a;
	  text-decoration: none;
	  transition: transform 0.2s ease, opacity 0.2s ease;
	}

	.phone-dropdown__socials a:hover {
	  transform: scale(1.1);
	  opacity: 0.85;
	}

	/* Текстовые ссылки */
	.phone-dropdown__link {
	  display: block;
	  color: #ffffff;
	  text-decoration: none;
	  font-size: 15px;
	  line-height: 1.5;
	  white-space: nowrap;
	  transition: opacity 0.2s;
	}

	.phone-dropdown__link:hover {
	  opacity: 0.75;
	}

	.phone-dropdown__link--phone {
	  font-weight: 500;
	  margin-bottom: 2px;
	}

	.phone-dropdown__link--email {
	  margin-bottom: 16px;
	  opacity: 0.9;
	}

	/* Адрес */
	.phone-dropdown__address {
	  font-size: 14px;
	  line-height: 1.5;
	  opacity: 0.65;
	}
  /* ================= HERO ================= */
  #hero{
    position:relative;
    min-height:100vh;
    padding:0 0 0 0;
    color:#fff;
    overflow:hidden;
  }
  #hero .bg{
    position:absolute;inset:0;height: calc(100vh - 4.5vw);
  }
  #hero .bg video{
    width:100%;height:100%;object-fit:cover;
  }
  #hero .bg::after{
    content:'';position:absolute;inset:0;
    background:linear-gradient(90deg,rgba(0,0,0,.72) 10%,rgba(0,0,0,.35) 55%, rgba(0,0,0,.55) 100%);
  }
  #hero .hero-inner{
    position:relative;z-index:2;
    min-height:calc(100vh - 4.5vw);
    justify-content:center;
    padding:8.33vw 0 0;
  }
  #hero .hero-main{justify-content:space-between;align-items:top;gap:2.08vw;flex-wrap:wrap;}
  #hero .hero-copy{max-width:37.083vw;}
  #hero h1{font-size:clamp(33px,3.07vw,59px);line-height:1.05;font-weight:600;}
  #hero .sub{font-size: clamp(20px, 1.35vw, 26px);font-weight: 400;margin-top:22px;color:#fff;}
  #hero p.desc{font-size: clamp(10px, .625vw, 12px);line-height:1.6;max-width:609px;margin-top:.83vw;}
  #hero .hero-copy .btn{margin-top:1.77vw;}
  #hero .stats{gap:1.77vw;min-width:16.04vw; margin-top: 1.04vw;}
  #hero .stat b{font-family:'RF Dewi Expanded',sans-serif;font-size:2.8125vw;font-weight:600;display:block;}
  #hero .stat span{font-size: clamp(10px, .625vw, 12px);display:block;margin-top:6px;line-height:1.4;}
  .marquee-wrap{
    border-top:1px solid rgba(255,255,255,.18);
    overflow:hidden;
    padding:1.04vw 0;
  }
  .marquee-track{
    display:flex;width:max-content;gap:0;color: #000000;
    animation:marquee 30s linear infinite;
  }
  .marquee-track span{
    display:inline-flex;align-items:center;
    font-family:'RF Dewi Expanded',sans-serif;font-weight:600;font-size:1.09375vw;
    letter-spacing:.03em;white-space:nowrap; padding: 0 1.04vw 0px 0px;
    text-transform:uppercase;
  }
  .marquee-track span::after{content:'•';margin-left:1.04vw;color:#000000; font-size: 30px;}
  @keyframes marquee{
    from{transform:translateX(0);}
    to{transform:translateX(-50%);}
  }

  /* ================= DIRECTIONS ================= */
  #directions{padding-top:6.25vw;}
  #directions .dir-wrap{gap:3.125vw;align-items:stretch;}
  #directions .dir-list{width: calc(100% / 12 * 6);}
  #directions h2 {
        font-size: 2.29vw;
        margin-bottom: 1.77vw;
    }
  .dir-item{
    padding:1.35vw 0;border-bottom:2px solid var(--grey-line);
    gap:.9375vw;align-items:center;cursor:pointer;
  }
  .dir-item .num{font-size:.83vw;color:var(--absolute-black);font-weight:600;}
  .dir-item .label{font-size:1.7vw;font-family:'RF Dewi Expanded',sans-serif;font-weight:400;transition: all .3s;}
  .dir-item.active .label,.dir-item:hover .label{font-weight:700;color:var(--absolute-black); text-shadow: -.5px -.5px 0 black, .5px -.5px 0 black, -.5px .5px 0 black, .5px .5px 0 black; transition: all .3s;}
  #directions .dir-image{
    width: calc(100% / 12 * 5);;position:relative;overflow:hidden;max-height:30.78vw;border-radius:2px;
  }
  #directions .dir-image img{
    width:100%;height:100%;object-fit:cover;position:absolute;inset:0;
    opacity:0;transition:opacity .5s ease;
  }
  #directions .dir-image img.show{opacity:1;}

  /* ================= PORTFOLIO ================= */
  #portfolio h2{font-size:2.29vw;margin-bottom:1.77vw;}
  .tabs{gap:.625vw;flex-wrap:wrap;margin-bottom:1.875vw;}
  .tab-btn{
    padding:14px 22px;background:#F5F5F5;font-size:.7292vw;font-weight:600;
    text-transform:uppercase;letter-spacing:.02em;border-radius:2px;transition:.2s ease;
  }
  .tab-btn.active{background:var(--absolute-black);color:#fff;}
  .tab-btn:not(.active):hover{background:#ddd8cd;}
  .portfolio-grid{display:none;}
    .portfolio-grid.active-grid{display:flex;gap:1.04vw;flex-wrap:wrap;}
  .portfolio-panel{display:none;}
  .portfolio-panel.active{display:flex;}
  .p-tile{
    position:relative;overflow:hidden;border-radius:2px;cursor:pointer;flex:1 1 280px;
    min-height:280px;
  }
  .p-tile.tall{min-height:450px;}
  .p-tile img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
  .p-tile:hover img{transform:scale(1.06);}
  .p-tile .tag{
    position:absolute;bottom:14px;left:14px;background:rgba(0,0,0,.6);color:#fff;
    font-size: clamp(10px, .625vw, 12px);padding:6px .625vw;border-radius:2px;opacity:0;transition:opacity .25s ease;
  }
  .p-tile:hover .tag{opacity:1;}
  .p-col{width: calc((100% - 3 * 1.04vw) / 4);;gap:1.04vw;}
  .portfolio-more{justify-content:center;margin-top:2.08vw;}

  /* ================= WHY WE ================= */
  #whywe h2{font-size:2.29vw;margin-bottom:50px;}

  .why-item{gap:1.04vw;margin-bottom:80px;flex-wrap:wrap;}
  .why-item:last-child{margin-bottom:0;}
  .why-media{width: calc((100% - 1.04vw) / 2); height: auto;}
  .why-media-fw {height: 100%;}
  .why-media img{width:100%; height: 100%;border-radius:2px; object-fit: none;object-position: left;}
  .why-content{width: calc((100% - 1.04vw) / 2);}
  .why-content .num{color:var(--absolute-black);font-size:13px;font-weight:600;margin-bottom:14px;}
  .why-content h3{font-size:1.875vw;line-height:1.2;margin-bottom:1.04vw; max-width: 53.125vw;}
  .why-content p{font-size:.83vw;line-height:1.65;color:var(--absolute-black);max-width:41.04vw;}
  .why-two-col{gap:1.25vw;margin-top:1.25vw;flex-wrap:wrap;}
  .why-two-col p{flex:1 1 200px;}
  .why-strip{gap:1.25vw;}
  .why-strip img{flex:1;object-fit:cover;border-radius:2px;}
  .why-title-and-count {justify-content: space-between;}
  .quarter-collage {max-width: fit-content; margin: 0 auto;}
  .why-content-text {align-items: flex-end; gap: 1.04vw;}
  .why-content-text-item {gap:1.04vw; width: calc((100% - 1.04vw) / 2);}
  .why-content-text-item img {width: 100%; height: 100%; object-fit: cover; object-position: left; max-height: 261px;}

   /* ================= WHY WE — MOBILE ONLY ================= */
   #whywe-mobile{display:none;}
   #whywe-mobile h2{font-size:28px;margin-bottom:34px;}
   .wm-block{margin-bottom:44px;}
   .wm-block:last-of-type{margin-bottom:0;}
   .wm-num{font-size:12.5px;color:var(--grey-text);font-weight:600;margin-bottom:8px;}
   .wm-block h3{font-size:20px;line-height:1.28;margin-bottom:16px;}
   .wm-block > p{font-size:14px;line-height:1.65;color:var(--grey-text);margin:0 0 18px;}
   .wm-image{margin:16px 0;border-radius:2px;overflow:hidden;}
   .wm-image img{width:100%;height:220px;object-fit:cover;display:block;}
   .wm-image.tall img{height:280px;}
 
   .wm-collage-row{gap:16px;align-items:flex-start;margin-top:16px;}
   .wm-quarter{width:120px;height:120px;position:relative;flex:0 0 auto;}
   .wm-quarter img{width:100%;height:100%;object-fit:cover;}
   .wm-collage-row p{flex:1;font-size:13.5px;line-height:1.6;color:var(--grey-text);margin:0;}
 
   .wm-split-row{gap:12px;margin-top:16px;}
   .wm-split-row img{flex:1;height:200px;object-fit:cover;border-radius:2px;}
 
   .wm-inline-row{gap:14px;align-items:flex-start;margin-top:16px;}
   .wm-inline-row p{flex:1;font-size:14px;line-height:1.6;color:var(--grey-text);margin:0;}
   .wm-inline-row img{width:128px;height:128px;object-fit:cover;border-radius:2px;flex:0 0 auto;}
 
   .wm-closing{font-size:13.5px;line-height:1.7;color:var(--grey-text);margin-top:20px;}
   .wm-closing u{cursor:pointer;color:var(--black);}

   /* ================= HOW WE ================= */
  #howwe h2{font-size:2.29vw;}
  #howwe .sub{max-width:53.125vw;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey-text);margin-top:14px;line-height:1.6;}
  .process-canvas{
    position:relative;width:100%;margin-top:3.125vw;gap: 1.04vw; row-gap: 56px;flex-wrap: wrap;
  }
  .process-canvas .process-card{
    display: flex;
    flex-direction: column;
    box-sizing:border-box;
    background:transparent; height: fit-content;
    width: calc((100% - 2 * 1.04vw) / 3);gap: 20px; 
  }
  .process-card h4{font-size:21px;line-height:1.3;}
  .process-card p{font-size:.83vw;line-height:1.55;color:var(--grey-text);margin:0;}
  .process-card-img {max-width: 40%;margin: 0 auto;}
  
  /* ================= TECH ================= */
  #tech h2{font-size:2.29vw;margin-bottom:2.08vw; max-width: 43.75vw;}
  .tech-head{justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:1.04vw;}
  .tech-grid{gap:1.25vw;margin-top:2.08vw;flex-wrap:wrap;}
  .tech-grid .t-img{flex:1 1 45%;height:32vw;overflow:hidden;border-radius:2px;}
  .tech-grid .t-img img{width:100%;height:100%;object-fit:cover;}
  .tech-caps{gap:1.25vw;margin-top:1.04vw;flex-wrap:wrap; align-items: flex-end;}
  .tech-caps > div{flex:1 1 45%;}
  .tech-caps h4{font-size:21px;text-transform:uppercase;letter-spacing:.03em;}
  .tech-caps p{font-size:.83vw;color:var(--absolute-black);line-height:1.6;margin:0;}
  .tech-cap, .tech-cap-full {gap: 1.04vw;}
  .tech-cap:nth-child(1) .t-img {
    max-height: 23vw;
  }
  .tech-full{margin-top:1.25vw;max-height:36vw;overflow:hidden;border-radius:2px; flex: 1;}
  .tech-full img{width:100%;height:100%;object-fit:cover;}
  .tech-full video{width:100%;height:100%;object-fit:cover;}
  .tech-cap-full{margin-top:1.04vw;}
  .tech-cap-full h4{font-size:21px;text-transform:uppercase;margin-bottom:10px; max-width: 23vw;}
  .tech-cap-full p{font-size:.83vw;color:var(--grey-text);line-height:1.6;margin:0; max-width: 23vw;}

  #reviews h2{font-size:1.875vw;margin:80px 0 1.77vw;}
  .review-row{
    overflow: visible;
  }
  .review-card{
    padding: 50px;
    gap: 47px;
    height: auto;
    border: 1px solid rgba(0, 0, 0, .3);
    border-bottom: none;
	      justify-content: flex-start;
  }
  .review-card .avatar{width:107px;height:107px;border-radius:50%;object-fit:cover;}
  .review-card .cert{width:100%;height:100%;object-fit:cover;max-height: 164px; max-width: 8vw;}
  .review-card p{font-size:.83vw;line-height:1.25;color:var(--absolute-black);margin:0; font-weight: 400;}
  .review-card-text {
    height: 40%;
    min-height: fit-content;
	  gap: 20px;
  }

  /* ================= PARTNERS ================= */
  #partners h2{font-size:2.08vw;margin-bottom:1.875vw;}
  .partners-grid{gap:.83vw;flex-wrap:wrap;}
  .partner-logo{width:calc((100% - 7 * .83vw) / 8);}

  /* ================= FAQ ================= */
  #faq h2{font-size:38px;margin-bottom:2.08vw;}
  .faq-wrap{gap:3.125vw;align-items:flex-start;flex-wrap:wrap;}
  .faq-list{flex:1 1 55%;}
  .faq-item{border-bottom:1px solid var(--grey-line);}
  .faq-item:first-child{border-top:1px solid var(--grey-line);}
  .faq-q{
    padding:1.35vw 0;justify-content:space-between;align-items:center;cursor:pointer;gap:1.04vw;
  }
  .faq-q span.qtext{font-size:21px;}
  .faq-q .plus{
    width:30px;height:30px;flex:0 0 auto;position:relative;
  }
  .faq-q .plus::before,.faq-q .plus::after{
    content:'';position:absolute;background:var(--black);top:50%;left:50%;transform:translate(-50%,-50%);
  }
  .faq-q .plus::before{width:.83vw;height:2px;}
  .faq-q .plus::after{width:2px;height:.83vw;transition:transform .25s ease,opacity .25s ease;}
  .faq-item.open .plus::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0;}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease;}
  .faq-a p{font-size:.83vw;line-height:1.65;color:var(--grey-text);padding:0 0 1.35vw;max-width:51.04vw;margin:0;}
  .faq-media{flex:1 1 35%;position:relative;height:30vw;}
  .faq-media img{position:absolute;width:100%;height:100%;object-fit:cover;}


  /* ================= CONTACT US ================= */
  #contactus{position:relative;color:#fff;padding:110px 0 var(--section-gap);overflow:hidden;}
  #contactus .bg{
    position:absolute;inset:0;background:url('/wp-content/uploads/2026/07/form-bg.png') center/cover;
  }
  #contactus .bg::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.55);}
  #contactus .container{position:relative;z-index:2;}
  #contactus h2{font-size:42px;margin-bottom:3.125vw;}
  .contact-form-card{
    background:#fff;color:var(--black);padding:2.29vw;max-width:35vw;border-radius:2px;margin-left:auto;
  }
  .contact-form-card h3{font-size:19px;line-height:1.4;text-transform:uppercase;margin-bottom:28px;}
  .field{
    width:100%;border:none;border-bottom:1px solid #cfcbc2;background:transparent;
    padding:.625vw 0;font-size:15px;font-family:'RF Dewi Expanded',sans-serif;margin-bottom:22px;color:var(--black);
  }
  .field::placeholder{color:#948f85;}
  .field:focus{outline:none;border-color:var(--black);}
  .contact-form-card .btn{width:100%;margin-top:6px;}

  /* ================= FOOTER ================= */
  footer{background:var(--black);color:#fff;padding:70px 0 2.08vw;}
  .footer-top{gap:3.125vw;flex-wrap:wrap;justify-content:space-between;}
  .footer-logo .logo-text{font-size:.83vw;}
  .footer-logo-info {gap: 1.04vw;}
  .footer-links{gap:22px;font-size:14.5px;color:#d8d5cd;}
  .footer-links a{transition:color .2s ease;}
  .footer-links a:hover{color:#fff; font-weight: 600;}
  .footer-contact{gap:.83vw;align-items:flex-end;}
  .footer-contact .phone{font-size:19px;font-weight:600;font-family:'RF Dewi Expanded',sans-serif;}
  .footer-contact .mail{color:#d8d5cd;}
  .socials{gap:.625vw;}
  .social-icon{
    width:2.5vw;height:2.5vw;border-radius:50%;background:#fff;color:#000;
    align-items:center;justify-content:center;
    cursor: pointer; padding: 10px;
  }
  .footer-bottom{margin-top:3.125vw;gap:1.04vw;flex-wrap:wrap;justify-content:space-between;align-items:center;border-top:1px solid rgba(255,255,255,.12);padding-top:30px;}
  .payment-icons{gap:.625vw;align-items:center;}
  .legal-links{gap:22px;font-size:13px;color:#a9a59c;}

  /* ================= MODALS ================= */
  .modal-overlay{
    position:fixed;inset:0;background:rgba(10,9,7,.72);z-index:2000;
    display:none;align-items:center;justify-content:center;padding:1.04vw;
  }
  .modal-overlay.open{display:flex;}
  .modal-box{
    background:#fff;max-width:900px;width:100%;position:relative;
    max-height:92vh;overflow:auto;
  }
  .modal-close{
    position:absolute;top:.83vw;right:.83vw;width:1.875vw;height:1.875vw;border-radius:50%;
    background:rgba(0,0,0,.06);align-items:center;justify-content:center;z-index:5;font-size: clamp(14px, 0.9375vw, 18px);
  }
  .modal-close:hover{background:rgba(0,0,0,.12);}
  .lead-modal-content{align-items:stretch;}
  .lead-modal-content .lm-img{flex:1 1 40%;min-height:33.125vw;background:url('https://picsum.photos/seed/tsborki3/800/800') center/cover;}
  .lead-modal-content .lm-form{flex:1 1 60%;padding:2.29vw;}
  .lm-form h3{font-size: clamp(20px, 1.35vw, 26px);line-height:1.2;margin-bottom:.83vw;}
  .lm-form p.desc{font-size:14.5px;color:var(--grey-text);line-height:1.6;margin-bottom:1.35vw;max-width:41.04vw;}
  .lm-form .btn{width:100%;margin-top:6px;}
  .pm-main-swiper {height: 75vh;}
  .portfolio-modal-box{max-width:1100px;background:#111;}
  .pm-slide{position:relative;}
  .pm-slide img{width:100%;height:100%;object-fit:cover;}
  .pm-caption{
    position:absolute;bottom:1.25vw;left:1.25vw;right:1.25vw;background:rgba(20,18,15,.72);
    color:#fff;padding:22px 1.35vw;max-width:51.04vw;
  }
  .pm-caption h4{font-size: clamp(14px, 0.9375vw, 18px);text-transform:uppercase;margin-bottom:10px;}
  .pm-caption p{font-size:13.5px;line-height:1.55;color:#e5e2da;margin:0;}
  .pm-nav{
    position:absolute;top:50%;transform:translateY(-50%);z-index:6;
    width:2.29vw;height:2.29vw;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;
    align-items:center;justify-content:center;font-size: clamp(14px, 0.9375vw, 18px);
  }
  .pm-nav:hover{background:rgba(255,255,255,.3);}
  .pm-prev{left:.83vw;}
  .pm-next{right:.83vw;}
  .pm-thumbs{padding:14px;gap:10px;overflow-x:auto;}
  .pm-thumbs .thumb{
    width:110px;height:78px;flex:0 0 auto;opacity:.5;cursor:pointer;overflow:hidden;transition:opacity .2s ease;
  }
  .pm-thumbs .thumb.active,.pm-thumbs .thumb:hover{opacity:1;}
  .pm-thumbs .thumb img{width:100%;height:100%;object-fit:cover;}

  /* ================= MOBILE NAV DRAWER ================= */
  .mobile-nav-overlay{
    position:fixed;inset:0;z-index:1500;display:none;
    background:rgba(12,10,8,.4);
    backdrop-filter:blur(14px) saturate(140%);
    -webkit-backdrop-filter:blur(14px) saturate(140%);
  }
  .mobile-nav-overlay.open{display:block;}
  .mobile-nav{
    position:fixed;top:0;left:0;bottom:0;
    width:min(560px,86vw);
    background:#fff;color:var(--black);z-index:1600;
    transform:translateX(-100%);
    transition:transform .45s cubic-bezier(.4,0,.2,1);
    padding:1.875vw 2.29vw 1.875vw;
    overflow-y:auto;
    box-shadow:40px 0 80px rgba(0,0,0,.25);
    justify-content: space-between;
  }
  .mobile-nav-overlay.open .mobile-nav{transform:translateX(0);}

  .mn-toggle{
    width:34px;height:22px;position:relative;
    display:flex;flex-direction:column;justify-content:space-between;
    background:none;border:none;padding:0;cursor:pointer;
    flex:0 0 auto;
  }
  .mn-toggle span{display:block;width:100%;height:2px;background:var(--black);}

  .mobile-nav nav{gap: 1.04vw;}
  .mn-top-link{
    font-family:'Unbounded',sans-serif;font-size:1.09375vw;font-weight:400;
    color:var(--black);
  }
  .mn-group{display:flex;flex-direction:column;}
  .mn-sub {gap: 6px; margin-top: 10px; margin-left: 1.875vw;}
  .mn-sub-link{
    font-size:.83vw;font-weight:400;
    color:#9b968b;transition:color .2s ease;
  }
  .mn-sub-link:hover,.mn-sub-link.active{color:var(--black);}

  .mn-bottom{gap:22px;flex:0 0 auto;}
  .mn-socials{gap:12px;}
  .mn-socials .social-icon-dark{
    width:38px;height:38px;border-radius:50%;background:var(--black);color:#fff;
    align-items:center;justify-content:center;
  }
  .mn-contact-info{gap:8px;font-size:15px;color:var(--black);}
  .mn-contact-info a{color:inherit;}
  .js-fade-up {
        opacity: 0;
        transform: translateY(-140px);
        transition:
            opacity .7s ease,
            transform .7s ease;
        will-change: opacity, transform;
    }
    
    .js-fade-up.is-visible-for-an {
        opacity: 1;
        transform: translateY(0);
    }

  /* ================= RESPONSIVE ================= */
  @media (max-width:1180px){
    #directions .dir-item .label{font-size: clamp(20px, 1.35vw, 26px);}
  }

  @media screen and (max-width:900px){
    
    :root{--section-gap:80px;}
    .btn {
        padding: 3.7vw 10.6vw;
    }

    /* header */
    .header-left .mn-label{display:none;}
    .header-left .divider{display:none;}
    .header-cta{padding:.625vw .9375vw;font-size:13px;}
    .phone-icon-btn{width:2.29vw;height:2.29vw;}
    .logo-text{font-size: clamp(10px, .625vw, 12px);}
    .logo-svg{width:28px;height:28px;}

    .header-left .icon-btn{display:none;}   /* прячем иконку корзины */
    .header-cta{display:none;}              /* прячем кнопку "Заказать расчет" */
    .header-left{order:3;}                  /* бургер уезжает направо */
    .logo{order:2; max-width: 45%;}                         /* лого остаётся по центру */
    .header-right{order:1;}                 /* телефон уезжает налево */
    .phone-icon-btn{width:40px;height:40px;}

    section h2 {
        font-size: 25px!important;
        margin-bottom: 32px!important;
    }

    /* hero */
    #hero .hero-inner{padding:50px 0;padding-bottom:11.04vw; min-height: 110vh;}
    #hero .hero-copy {max-width: 100%; display: flex; flex-direction: column; gap: 16px;}
    #hero .hero-main{gap:32px;}
    #hero .stats{gap:23px;width:100%;justify-content:space-between;}
    #hero .stat {gap: 11px;}
    #hero .stat b{font-size: 36px;}
    #hero .stat span {font-size: 16px;}
    #hero .btn, #portfolio .btn {width: 100%;}
    #hero .bg {
        height: 110vh;
    }
    .marquee-track span{font-size:13px;padding:0 14px;}

    /* directions */
    #directions{padding-top:60px;}
    #directions .dir-wrap{flex-direction:column;gap:30px;}
    #directions .dir-list {
        width: 100%;
    }
    #directions .dir-image{display: none;}
    .dir-item .label{font-size:22px;}
    .dir-item{gap: 16px;}
    #directions .dir-item .label {font-size: 16px;}
    #directions .dir-item .num {font-size: 12px;}
    .dir-item.active .label, .dir-item:hover .label {
        font-weight: 400;
        text-shadow: -.25px -.25px 0 black, .25px -.25px 0 black, -.25px .25px 0 black, .25px .25px 0 black;
    }

    /* portfolio */
    #portfolio h2, #whywe h2, #howwe h2, #tech h2, #partners h2, #faq h2, #contactus h2{font-size:30px;}
    .p-col{flex-direction:row;flex-wrap:wrap;gap:14px;width: calc((100% - 2 * 1.04vw) / 3);}
    .p-col:nth-child(4){display: none;}
    .p-tile, .p-tile.tall{min-height: 160px;height:20vw;flex:1 1 100%;}
    .tabs{gap:8px;flex-wrap:wrap;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch;}
    .tab-btn{flex:0 0 auto;padding:10px 14px;font-size: clamp(10px, .625vw, 12px);}

    /* whywe */
    #whywe{display:none;}
    #whywe-mobile{display:block;}
    .tech-full{height:260px;}
    /* howwe */
    #howwe .sub{font-size:13px;}
    .process-row{flex-direction:column;}
    .process-row.offset,.process-row.offset2{justify-content:flex-start;}
    .process-canvas {
        display: flex;
        flex-direction: column;
        gap: 16px;
        padding-bottom: 0;
    }
   .process-canvas .process-card {
        position: unset;padding: 16px;width: 100%;border: 1px solid;align-items: flex-start;
    }
	  .process-card-img {
		margin: 0;
	}
    .process-card{width:100%;}
    .process-card h4 {
        font-size: 16px;
    }
    .process-card p {
        font-size: 12px;
    }
    .p-line, .p-line-c, .p-line-v  {display: none;}

    /* tech */
    #tech h2 {
        max-width: 100%;margin-bottom: 0px!important;
    }
    #tech .container {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
    #tech .btn {order: 3;}
    .tech-head{display: contents; order: 1;}
    .tech-grid{flex-direction:column; order: 2;}
    .tech-grid .t-img{max-height: 100%!important;height: 273px;margin-bottom: 15px;}
    .tech-caps{flex-direction:column;gap:32px;}
    .tech-caps h4, .tech-caps p {
        font-size: 12px;
    }
    .tech-cap {max-width: 271px;}
    .tech-cap:nth-child(1) {align-self: flex-start;}
    .tech-cap-full {
        margin-top: 32px;
        margin-bottom: 32px;
    }
    .tech-full {
        height: 273px;
        max-height: unset;
        flex: unset;
    }
    .tech-cap-full h4, .tech-cap-full p {width: 100%; max-width: 100%; padding: 0; font-size: 12px;}
    #reviews {order: 4;}
    #reviews h2{font-size: clamp(20px, 1.35vw, 26px);margin:56px 0 32px!important;}
    .review-row{flex-direction:column;}
    .review-card {
        padding: 16px;align-items: center;
    }
    .review-card .cert {
        max-width: 100px;
    }
    .review-card p {
        font-size: 10px;
    }

    /* partners */
    .partner-logo{font-size: clamp(10px, .625vw, 12px);}

    /* faq */
    .faq-wrap{flex-direction:column-reverse;gap:16px;}
    .faq-q .qtext{font-size:15px;}
    .faq-media {
        flex: unset;
        position: unset;
        height: 100%;
    }
    .faq-media img {position: unset;}
    .faq-q {gap: 16px;}
    .faq-q span.qtext {
        font-size: 12px;
    }
    .faq-q .plus::before {
        width: 16px;
        height: 2px;
    }
    .faq-q .plus::after {
        width: 2px;
        height: 16px;
        transition: transform .25s ease, opacity .25s ease;
    }
    .faq-a p {
        font-size: 10px;
        max-width: 75vw;
    }

    /* contact */
    #contactus{padding:70px 0 var(--section-gap);}
    .contact-form-card{margin-left:0;padding:16px;max-width:100%;}
    .contact-form-card h3{font-size:16px;}

    /* footer */
    .footer-top{flex-direction:column;gap:32px;}
    .footer-logo-info {
        gap: 32px;
    }
    .footer-contact{align-items:flex-start;}
    .footer-bottom{flex-direction:column;align-items:flex-start;gap:10px;}

    /* modals */
    .lead-modal-content{flex-direction:column;}
    .lead-modal-content .lm-img{min-height:180px;}
    .lm-form{padding:28px 1.25vw;}
    .pm-main-swiper {
    height: 400px;
}
.portfolio-modal-box {
    max-width: 1100px;
    background: #111;
    width: 85%;
    margin: 0 auto;
}
    .pm-slide{height:400px;}
    .pm-caption{left:.625vw;right:.625vw;bottom:.625vw;padding:14px .83vw;        max-width: 80%;}
    .pm-caption h4{font-size:15px;}
    .pm-caption p{font-size:12.5px;}
    .pm-nav{width:1.875vw;height:1.875vw;font-size:15px;}
    .pm-thumbs .thumb{width:76px;height:76px;}
    .mn-top-link {
        font-size: 14px;
    }
    .mn-sub-link {
        font-size: 12px;
    }
    .mn-sub {margin-bottom: 10px;}
    .mobile-nav {gap: 20px;justify-content: flex-start;}
    .mobile-nav nav {
        gap: 16px;
    }
    
  }

  @media (max-width:480px){

  }