/* =========================================================
   ДАРСИ — блок скачивания гайдбука. Светлая тема.
   ========================================================= */

.gd{
  --ink:#1B1418;
  --ink-2:#4A4046;
  --ink-3:#8A7F86;
  --hair:#E7DDE1;
  --tint:#FBF5F6;
  --rose:#E3A9BA;
  --rose-dark:#C07E93;

  position:relative; overflow:hidden;
  padding:clamp(56px,7vw,110px) var(--pad-x);
  background:
    radial-gradient(90% 70% at 88% 6%, #F7E6EA 0%, rgba(247,230,234,0) 58%),
    radial-gradient(80% 70% at 4% 96%, #EFEAE4 0%, rgba(239,234,228,0) 60%),
    #FAF6F4;
  color:var(--ink);
  letter-spacing:-.022em;
}
.gd__inner{
  width:100%; max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(28px,4vw,72px); align-items:center;
}

/* ---------- левая колонка ---------- */
.gd__title{
  font-family:var(--f-head); font-weight:400;
  font-size:clamp(30px, 3.6vw, 50px); line-height:1; letter-spacing:-.015em;
  margin:0 0 16px; max-width:none;   /* переносы заданы вручную через <br> */
}
.gd__sub{
  margin:0 0 clamp(22px,2.4vw,32px);
  font-size:clamp(15px,1.2vw,18px); line-height:1.45; letter-spacing:-.03em;
  color:var(--ink-2); max-width:66ch;   /* ровно две строки */
}
.gd__list{display:flex; flex-direction:column; gap:12px; margin:0 0 clamp(24px,2.6vw,36px); padding:0; list-style:none}
.gd__list li{
  position:relative; padding-left:22px;
  font-size:clamp(13.5px,1vw,15.5px); line-height:1.45; letter-spacing:-.03em; color:var(--ink-2);
}
.gd__list li::before{
  content:''; position:absolute; left:0; top:7px;
  width:10px; height:10px; background:var(--rose-dark);
}
.gd__list b{color:var(--ink); font-weight:600}

/* ---------- форма ---------- */
.gd__form{max-width:620px}
.gd__row{display:flex; gap:10px; flex-wrap:wrap}
.gd__input{
  flex:1 1 240px; min-width:0; height:56px; padding:0 18px;
  font:inherit; font-size:16px; letter-spacing:-.02em; color:var(--ink);
  background:#fff; border:1px solid var(--hair); outline:none;
  transition:border-color .2s ease;
}
.gd__input::placeholder{color:#B9AEB4}
.gd__input:focus{border-color:var(--rose-dark)}
.gd__input.is-err{border-color:#D46A6A}
.gd__btn{
  height:56px; padding:0 30px; flex:1 1 100%;
  background:var(--accent-grad); color:var(--accent-ink);
  font-family:var(--f-body); font-size:15px; font-weight:400; letter-spacing:-.03em;
  transition:background .25s ease, transform .2s ease;
}
.gd__btn:hover{background:var(--accent-grad-hi); transform:translateY(-1px)}
.gd__err{margin:8px 0 0; font-size:13px; color:#C25757}

.gd__check{display:flex; gap:10px; align-items:flex-start; margin-top:14px; cursor:pointer}
.gd__check input{position:absolute; opacity:0; width:0; height:0}
.gd__check-box{
  width:18px; height:18px; flex:0 0 auto; margin-top:1px;
  border:1px solid var(--hair); background:#fff; transition:.2s ease;
}
.gd__check input:checked + .gd__check-box{
  background:var(--rose-dark) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;
  border-color:var(--rose-dark);
}
.gd__check span:last-child{font-size:12px; line-height:1.4; color:var(--ink-3); max-width:none; white-space:nowrap}
.gd__check a{color:var(--ink-2); text-decoration:underline; text-underline-offset:2px}

.gd__done{display:flex; gap:12px; align-items:flex-start; padding:18px; background:var(--tint); border:1px solid var(--hair); max-width:620px}
.gd__done p{margin:0; font-size:15px; line-height:1.45; color:var(--ink-2)}
.gd__done b{color:var(--ink)}
.gd__done a{color:var(--rose-dark); text-decoration:underline; text-underline-offset:2px}
.gd__done-ico{width:26px; height:26px; flex:0 0 auto; color:#fff; background:var(--rose-dark); display:grid; place-items:center}
.gd__done-ico svg{width:16px; height:16px}
.gd [hidden]{display:none !important}

/* =========================================================
   МОКАП ГАЙДА
   ========================================================= */
.gd__mock{
  position:relative;
  display:grid; place-items:center;
  perspective:1400px;
  min-height:clamp(420px,38vw,580px);
  padding-bottom:42px;
}
.gd__book{
  position:relative;
  width:clamp(240px, 22vw, 330px);
  transform-style:preserve-3d;
  transform:rotateY(-11deg) rotateX(2deg);
}

.gd__page{
  position:absolute; inset:0;
  box-shadow:0 30px 60px -30px rgba(60,30,42,.55);
  transform-origin:left center;
}
.gd__page img{width:100%; height:auto; display:block}

/* листы за обложкой — «веером» */
.gd__page--b{
  transform:translate3d(30px,16px,-40px) rotate(5.5deg);
  filter:brightness(.97);
}
.gd__page--c{
  transform:translate3d(16px,8px,-20px) rotate(2.5deg);
}

.gd__cover{
  position:relative;
  box-shadow:0 40px 80px -30px rgba(60,30,42,.6), 0 2px 0 rgba(255,255,255,.5) inset;
}
.gd__cover img{width:100%; height:auto; display:block}
/* блик, пробегающий по обложке */
.gd__cover::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(105deg, rgba(255,255,255,0) 38%, rgba(255,255,255,.24) 48%, rgba(255,255,255,0) 58%);
  background-size:260% 100%; background-position:140% 0;
  animation:gdShine 7s ease-in-out infinite;
}
@keyframes gdShine{
  0%,58%{background-position:140% 0}
  84%,100%{background-position:-40% 0}
}

/* бейдж PDF */
.gd__pdf{
  position:absolute; z-index:3;
  left:50%; bottom:18px; transform:translate(-50%,50%);
  display:flex; align-items:center; gap:10px;
  padding:13px 18px 13px 14px;
  background:#fff; box-shadow:0 20px 40px -22px rgba(60,30,42,.6);
}
.gd__pdf-ico{
  width:38px; height:47px; flex:0 0 auto; position:relative;
  background:#D9463E; display:grid; place-items:end center; padding-bottom:5px;
  clip-path:polygon(0 0, 74% 0, 100% 22%, 100% 100%, 0 100%);
}
.gd__pdf-ico span{
  font-family:var(--f-body); font-size:11px; font-weight:700; color:#fff;
  letter-spacing:.04em;
}
.gd__pdf-txt{display:flex; flex-direction:column; gap:2px; line-height:1.15}
.gd__pdf-txt b{font-size:14.5px; font-weight:600; letter-spacing:-.03em}
.gd__pdf-txt span{font-size:12.5px; color:var(--ink-3); letter-spacing:-.02em}

/* =========================================================
   АДАПТИВ
   ========================================================= */
/* на узких десктопах отдаём больше ширины тексту, чтобы заголовок
   оставался в две строки */
@media (max-width:1360px){
  .gd__inner{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}
}

@media (max-width:1000px){
  .gd__inner{grid-template-columns:1fr; gap:34px}
  .gd__mock{order:-1; min-height:0; padding:6px 0 64px; place-items:center}
  .gd__book{width:clamp(210px,48vw,280px)}
  .gd__title{max-width:none}
}

@media (max-width:720px){
  .gd{padding-bottom:calc(var(--bar-h, 0px) + env(safe-area-inset-bottom))}
  .gd__check span:last-child{white-space:normal}
  .gd__row{flex-direction:column}
  .gd__input,.gd__btn{flex:0 0 auto; width:100%; height:52px}
  .gd__pdf{left:50%; transform:translate(-50%,50%); bottom:36px}
  .gd__check{min-height:44px; align-items:center}
}

@media (prefers-reduced-motion:reduce){
  .gd__cover::after{animation:none}
}