/* ДЕКОРГРАНИТ · Главная v1.4
   Приоритет: композиция первого экрана из согласованного прототипа v27.
   Полноэкранное оригинальное фото, поверх него H1, 3 функции и 2 кнопки.
   Корректировки: адаптивность, градиенты, доступность, UX. */

/* Фирменная лёгкая типографика прототипа; нет внешней загрузки шрифтов. */
body{font-family:"Century Gothic","Trebuchet MS","Segoe UI",Arial,sans-serif}

/* Шапка поверх фотографии, но при прокрутке непрозрачная. */
.dg-header{
  position:sticky;top:0;z-index:70;margin-bottom:-88px;
  background:linear-gradient(180deg,rgba(2,29,22,.94) 0%,rgba(4,28,22,.71) 54%,rgba(3,30,23,.12) 100%);
  border-bottom:1px solid rgba(232,201,132,.14);box-shadow:none;
  transition:background .28s ease,box-shadow .28s ease;
}
.dg-header.is-scrolled{
  background:linear-gradient(110deg,#073b2b 0%,#062a20 62%,#031f17 100%);
  box-shadow:0 9px 24px rgba(0,16,10,.23);border-bottom-color:rgba(232,201,132,.35);
}
.dg-header::after{opacity:.43}
.dg-header-inner{gap:20px}
.dg-nav{gap:20px}
.dg-nav>a{color:#f5f1e7;font-size:11.5px;letter-spacing:.012em}
.dg-nav>a:hover{color:#f4d393}
.dg-header-phone small{color:#e5d9bc}
.dg-header-phone strong{color:#fff}

/* Первый экран: фотография на всю ширину и высоту видимой области. */
.dg-hero.dg-hero-fullbleed{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:max(785px,calc(100svh - 37px));
  color:#fff;background:#071b15;
}
.dg-hero.dg-hero-fullbleed::before{
  content:"";position:absolute;inset:0;z-index:1;opacity:1;
  background:
    linear-gradient(90deg,rgba(0,17,11,.93) 0%,rgba(0,23,15,.80) 22%,rgba(0,23,15,.59) 39%,rgba(0,22,17,.15) 72%,rgba(0,22,17,.03) 100%),
    linear-gradient(180deg,rgba(2,20,14,.45) 0%,transparent 26%,transparent 67%,rgba(0,18,12,.78) 100%);
  pointer-events:none;
}
.dg-hero.dg-hero-fullbleed::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 60% 75% at 2% 55%,rgba(5,38,23,.32),transparent 85%);
}
.dg-fullbleed-photo{
  display:block;position:absolute;inset:0;z-index:0;width:100%;height:100%;
  object-fit:cover;object-position:center center;filter:saturate(.97) contrast(1.02);
}
.dg-fullbleed-inner{
  position:relative;z-index:3;min-height:inherit;
  display:flex;flex-direction:column;justify-content:center;
  padding-top:148px;padding-bottom:55px;
}
.dg-fullbleed-content{position:relative;max-width:570px}
.dg-hero-eyebrow{
  margin-bottom:18px;max-width:555px;
  color:#dfb96b;font-size:13px;font-weight:700;letter-spacing:.18em;line-height:1.5;
  text-transform:uppercase;text-shadow:0 1px 8px #01170e7a;
}
.dg-hero-eyebrow span{padding-inline:5px;color:#edcc88}
.dg-hero-fullbleed h1{
  margin:0;max-width:580px;font-family:"Poiret One","Inter Display","Segoe UI Light","Century Gothic","Trebuchet MS",Arial,sans-serif;
  font-size:clamp(53px,5.1vw,75px);font-weight:200;letter-spacing:-.049em;line-height:1.025;
  text-transform:uppercase;color:#fff;text-shadow:0 3px 22px rgba(0,16,12,.24);
}
.dg-hero-fullbleed h1 span{display:block}
.dg-fullbleed-lead{
  margin-top:19px;max-width:490px;font-size:15px;line-height:1.64;
  color:#f4f5ef;text-shadow:0 2px 12px #001e12bd;
}
.dg-hero-services{display:grid;gap:5px;max-width:443px;margin-top:20px}
.dg-hero-service{
  display:grid;grid-template-columns:45px minmax(0,1fr) 15px;gap:11px;align-items:center;
  min-height:57px;padding:5px 10px 5px 4px;color:#fff;
  background:linear-gradient(95deg,rgba(2,30,19,.64),rgba(2,28,21,.17) 94%);
  border-left:2px solid transparent;border-image:linear-gradient(#efda9b,#b78a3f) 1;
  transition:background .2s ease,transform .2s ease,border-color .2s ease;
}
.dg-hero-service:hover,.dg-hero-service:focus-visible{
  color:#fff;transform:translateX(3px);
  background:linear-gradient(100deg,rgba(6,51,33,.95),rgba(5,44,32,.7) 90%);
}
.dg-service-icon{
  display:flex;align-items:center;justify-content:center;width:42px;height:45px;
  background:linear-gradient(135deg,rgba(12,64,42,.77),rgba(1,25,18,.82));
  border:1px solid rgba(216,179,105,.25);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13);
}
.dg-service-icon svg{width:32px;height:32px;stroke:#eac77e;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.dg-service-text strong{display:block;color:#fff;font-size:13px;font-weight:750;line-height:1.3}
.dg-service-text small{display:block;margin-top:3px;font-size:11px;color:#e2e8db;line-height:1.38}
.dg-service-more{font-size:16px;color:#e1c083;opacity:.86;transition:transform .2s}
.dg-hero-service:hover .dg-service-more{transform:translate(3px,-3px)}
.dg-fullbleed-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px;max-width:610px}
.dg-fullbleed-actions .dg-btn{border-radius:2px;min-height:58px;gap:14px;padding-inline:21px;font-size:12.5px}
.dg-fullbleed-actions .dg-btn-gold{
  background:linear-gradient(120deg,#f4dfa7 0%,#edce84 24%,#d5aa57 73%,#b68332 100%);
  box-shadow:inset 0 1px 0 rgba(255,253,230,.75),inset 0 -2px 0 rgba(111,67,24,.23),0 12px 30px rgba(0,20,12,.36);
}
.dg-btn-prototype-secondary{
  color:#fff!important;border-color:#d9ac61;
  background:linear-gradient(118deg,#185c40 0%,#0a4432 30%,#073b2b 72%,#04261d 100%);
  box-shadow:inset 0 1px 0 rgba(191,239,191,.25),inset 0 -2px 0 rgba(0,15,7,.26),0 12px 27px rgba(0,18,10,.32);
}
.dg-btn-prototype-secondary:hover{
  border-color:#f0d491;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 14px 32px rgba(0,16,10,.48);
}
.dg-fullbleed-photo-credit{
  position:absolute;right:0;bottom:42px;display:flex;align-items:center;gap:12px;
  color:#f1ddb5;font-size:9px;font-weight:700;letter-spacing:.16em;white-space:nowrap;
  text-shadow:0 2px 12px rgba(0,15,10,.85)
}
.dg-fullbleed-credit-line{display:inline-block;width:35px;height:1px;background:linear-gradient(90deg,#efcd91,#ad8741)}
.dg-hero-fullbleed .dg-hero-bottom-line{
  position:absolute;bottom:0;left:0;right:0;z-index:4;height:3px;
  background:linear-gradient(90deg,#7f5b22 0%,#f1d69d 24%,#ae7f34 48%,#214d37 100%);
}

/* Под первым экраном — дословно восстановленный из прототипа набор преимуществ. */
.dg-value-strip{background:linear-gradient(180deg,#fff 0%,#f5f8f2 100%)}
.dg-value-grid>div{min-height:104px}
.dg-value-star{color:#b2873d}

/* Проектирование в прототипе показано сразу после первого экрана. */
.dg-design-prototype{
  position:relative;overflow:hidden;background:linear-gradient(120deg,#fff 0%,#fff 46%,#f1f6f0 100%);
  padding-block:88px;
}
.dg-design-prototype::before{
  content:"";position:absolute;width:380px;height:380px;border-radius:50%;right:-190px;top:-100px;
  background:radial-gradient(circle,rgba(225,191,113,.16),transparent 72%);pointer-events:none;
}
.dg-design-prototype-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:65px;align-items:center}
.dg-design-prototype-copy h2{
  max-width:465px;font-size:clamp(36px,3.9vw,54px);line-height:1.12;letter-spacing:-.037em;
}
.dg-design-prototype-copy h2 em{color:#96723b}
.dg-design-prototype-copy>p{color:#66746b;font-size:14px;line-height:1.86;margin:21px 0 23px;max-width:490px}
.dg-design-prototype-benefits{display:grid;gap:10px;margin-bottom:26px}
.dg-design-prototype-benefits span{
  padding-left:15px;border-left:2px solid #c6a05c;font-size:12px;color:#244333;
}
.dg-design-prototype-visual{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:13px;min-width:0}
.dg-design-prototype-visual::before{
  content:"";position:absolute;inset:-10px -10px 22px 16px;border:1px solid #d3b86b60;pointer-events:none;
}
.dg-design-prototype-visual figure{
  margin:0;min-width:0;z-index:1;display:flex;flex-direction:column;
  border:1px solid rgba(200,172,110,.43);background:#fff;
  box-shadow:0 14px 33px rgba(1,38,23,.11);
}
.dg-design-prototype-visual img{display:block;width:100%;height:300px;object-fit:cover;min-width:0}
.dg-design-prototype-visual figure:first-child img{object-fit:contain;background:#fff}
.dg-design-prototype-visual figcaption{
  min-height:42px;display:flex;align-items:center;padding:9px 14px;
  background:linear-gradient(105deg,#164a35 0%,#073b2b 62%,#05291f 100%);
  color:#edd19a;font-size:10px;font-weight:700;letter-spacing:.08em;
}

/* Все шесть направлений из прототипа, в заданном заказчиком порядке. */
.dg-service-grid.dg-six-directions{grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.dg-six-directions>.dg-service-card{height:336px;grid-column:auto;border-radius:3px}
.dg-six-directions .dg-service-content{left:22px;right:18px;bottom:19px}
.dg-six-directions .dg-service-content h3{font-size:clamp(22px,2.1vw,28px);line-height:1.16}
.dg-six-directions .dg-service-content p{font-size:11.5px}

@media(min-width:1680px){
  .dg-hero.dg-hero-fullbleed{min-height:max(855px,calc(100svh - 37px))}
  .dg-fullbleed-inner{padding-top:162px;padding-bottom:65px}
  .dg-fullbleed-content{max-width:605px}
  .dg-hero-fullbleed h1{font-size:79px}
  .dg-fullbleed-photo-credit{right:0;bottom:45px}
}
@media(max-width:1250px){
  .dg-nav{gap:13px}
  .dg-nav>a{font-size:11px}
  .dg-fullbleed-inner{padding-top:144px}
  .dg-design-prototype-grid{gap:36px}
}
@media(max-width:1020px){
  .dg-header{margin-bottom:-74px}
  .dg-header.is-scrolled{background:#062b20}
  .dg-hero.dg-hero-fullbleed{min-height:max(785px,calc(100svh - 37px))}
  .dg-fullbleed-inner{padding-top:140px}
  .dg-hero-fullbleed h1{font-size:clamp(50px,6.5vw,70px)}
  .dg-fullbleed-photo-credit{right:0}
  .dg-design-prototype-grid{grid-template-columns:1fr 1.15fr;gap:23px}
  .dg-design-prototype-visual img{height:245px}
}
@media(max-width:780px){
  .dg-header{margin-bottom:-74px}
  .dg-hero.dg-hero-fullbleed{min-height:max(850px,calc(100svh - 31px))}
  .dg-hero.dg-hero-fullbleed::before{
    background:
      linear-gradient(180deg,rgba(0,24,15,.82) 0%,rgba(0,25,17,.56) 34%,rgba(0,26,16,.24) 51%,rgba(0,18,12,.89) 100%),
      linear-gradient(90deg,rgba(0,17,12,.47),transparent 80%);
  }
  .dg-fullbleed-photo{object-position:52% center}
  .dg-fullbleed-inner{padding-top:141px;padding-bottom:41px;justify-content:flex-start}
  .dg-fullbleed-content{max-width:650px;width:100%}
  .dg-fullbleed-lead{max-width:540px}
  .dg-hero-services{max-width:none;margin-top:85px;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .dg-hero-service{display:flex;flex-direction:column;align-items:flex-start;gap:7px;padding:10px 10px 12px;min-height:130px;background:linear-gradient(160deg,rgba(2,36,24,.86),rgba(2,31,22,.56))}
  .dg-service-icon{width:39px;height:39px;flex:0 0 auto}
  .dg-service-icon svg{height:30px;width:30px}
  .dg-service-text strong{font-size:12px}
  .dg-service-text small{font-size:10.5px}
  .dg-service-more{display:none}
  .dg-fullbleed-actions{margin-top:15px;gap:9px}
  .dg-fullbleed-photo-credit{display:none}
  .dg-design-prototype-grid{grid-template-columns:1fr;gap:32px}
  .dg-design-prototype-copy h2{max-width:610px}
  .dg-design-prototype-visual img{height:305px}
  .dg-service-grid.dg-six-directions{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .dg-six-directions>.dg-service-card{height:315px}
}
@media(max-width:540px){
  .dg-header{margin-bottom:-68px}
  .dg-header .dg-header-inner{height:68px}
  .dg-hero.dg-hero-fullbleed{min-height:950px}
  .dg-fullbleed-inner{padding-top:141px;padding-bottom:46px}
  .dg-hero-eyebrow{font-size:10px;letter-spacing:.1em;line-height:1.7;margin-bottom:17px;max-width:310px}
  .dg-hero-fullbleed h1{font-size:clamp(38px,10.1vw,51px);letter-spacing:-.055em;line-height:1.03;max-width:100%}
  .dg-fullbleed-lead{font-size:13px;line-height:1.62;margin-top:17px;max-width:420px}
  .dg-hero-services{gap:7px;margin-top:116px}
  .dg-hero-service{min-height:141px;padding:10px 7px 8px;gap:9px;border-left-width:1px}
  .dg-service-icon{width:34px;height:34px}
  .dg-service-icon svg{width:26px;height:26px}
  .dg-service-text strong{font-size:11px;line-height:1.3}
  .dg-service-text small{font-size:9.5px;line-height:1.35;margin-top:5px}
  .dg-fullbleed-actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:15px;max-width:none}
  .dg-fullbleed-actions .dg-btn{min-height:54px;width:100%;justify-content:space-between;white-space:normal;line-height:1.32;font-size:12px;padding:12px 17px}
  .dg-design-prototype{padding-block:64px}
  .dg-design-prototype-visual{gap:9px}
  .dg-design-prototype-visual img{height:200px}
  .dg-design-prototype-visual figcaption{min-height:35px;font-size:9px;padding:6px 8px}
  .dg-service-grid.dg-six-directions{grid-template-columns:1fr;gap:12px}
  .dg-six-directions>.dg-service-card{height:315px}
  .dg-six-directions .dg-service-content h3{font-size:25px}
}
@media(max-width:370px){
  .dg-hero.dg-hero-fullbleed{min-height:970px}
  .dg-hero-fullbleed h1{font-size:clamp(35px,10vw,39px)}
  .dg-fullbleed-inner{padding-top:133px}
  .dg-hero-services{margin-top:113px;gap:5px}
  .dg-hero-service{padding:8px 5px;min-height:145px}
  .dg-service-text strong{font-size:10px}
  .dg-service-text small{font-size:9px}
}
@media(prefers-reduced-motion:reduce){
  .dg-hero-service{transition:none}
}

/* Защита от распирания CSS Grid при медленной загрузке фотографий. */
.dg-approach-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.dg-approach-photo,.dg-approach-copy{min-width:0}
.dg-approach-photo img{max-width:100%}
@media(max-width:780px){.dg-approach-grid{grid-template-columns:minmax(0,1fr)}}