/* Чух те – писмо на хартия. Bitter (заглавия), Nunito Sans (текст), Bad Script (ръкопис: подпис, бележки) */
:root{
  --kafe:#96612c;
  --kafe-tumno:#5f3d1c;
  --tirkiz:#59c0c0;
  --mastilo-cta:#2273c3;
  --papir:#faf7f5;
  --plik:#f3ebe2;
  --mastilo:#2d241b;
  --list:#fffdf8;
  --redove:rgba(89,192,192,.26);
  --okrajna:#d0806a;
  --lenta:rgba(232,214,170,.82);
  --sjanka:0 14px 30px rgba(45,36,27,.18);
  --ruka:"Bad Script","Segoe Script",cursive;
  --zaglavie:"Bitter",Georgia,serif;
  --tekst:"Nunito Sans","Trebuchet MS",sans-serif;
  --razkasano-dolu:polygon(0 0,100% 0,100% calc(100% - 4px),97.06% calc(100% - 7px),94.12% calc(100% - 3px),91.18% calc(100% - 5px),88.24% calc(100% - 9px),85.29% calc(100% - 3px),82.35% calc(100% - 5px),79.41% calc(100% - 2px),76.47% calc(100% - 9px),73.53% calc(100% - 5px),70.59% 100%,67.65% calc(100% - 7px),64.71% 100%,61.76% calc(100% - 2px),58.82% 100%,55.88% calc(100% - 7px),52.94% calc(100% - 3px),50% 100%,47.06% calc(100% - 2px),44.12% calc(100% - 3px),41.18% calc(100% - 7px),38.24% calc(100% - 3px),35.29% calc(100% - 2px),32.35% calc(100% - 2px),29.41% calc(100% - 3px),26.47% 100%,23.53% calc(100% - 7px),20.59% 100%,17.65% calc(100% - 4px),14.71% calc(100% - 3px),11.76% calc(100% - 3px),8.82% 100%,5.88% calc(100% - 2px),2.94% calc(100% - 5px),0 calc(100% - 4px));
  --razkasano-gore:polygon(0 8px,2.94% 8px,5.88% 8px,8.82% 7px,11.76% 5px,14.71% 8px,17.65% 5px,20.59% 3px,23.53% 8px,26.47% 9px,29.41% 5px,32.35% 3px,35.29% 0,38.24% 2px,41.18% 8px,44.12% 5px,47.06% 0,50% 3px,52.94% 0,55.88% 0,58.82% 7px,61.76% 7px,64.71% 0,67.65% 8px,70.59% 4px,73.53% 8px,76.47% 7px,79.41% 7px,82.35% 9px,85.29% 8px,88.24% 0,91.18% 3px,94.12% 8px,97.06% 9px,100% 2px,100% 100%,0 100%);
}
html{font-feature-settings:"locl" 0;-webkit-text-size-adjust:100%}
body,h1,h2,h3,p,li,a,.btn,button,input,textarea,summary,.modal,.sticky-cta{font-feature-settings:"locl" 0}
*,*::before,*::after{box-sizing:border-box}
body{
  margin:0;min-height:100vh;display:flex;flex-direction:column;
  background-color:var(--papir);
  --lista:96px;
  background-image:linear-gradient(to top,var(--kafe-tumno) var(--lista),transparent var(--lista)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='z'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .37 0 0 0 0 .24 0 0 0 0 .11 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23z)'/%3E%3C/svg%3E");
  color:var(--mastilo);font-family:var(--tekst);font-size:18px;line-height:1.65;
  padding-bottom:var(--lista);
}
main{flex:1}
img{max-width:100%;height:auto;display:block}
a{color:var(--kafe-tumno)}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--mastilo-cta);outline-offset:3px}
h1,h2,h3{font-family:var(--zaglavie);line-height:1.18;margin:0 0 .5em;color:var(--kafe-tumno)}
p{margin:0 0 1em}

/* ---------- горна лента ---------- */
.vrah{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1120px;width:100%;margin:0 auto;padding:14px 20px}
.marka{font-family:var(--ruka);font-size:38px;line-height:1;color:var(--kafe-tumno);text-decoration:none;transform:rotate(-3deg);display:inline-block}
.marka small{display:block;font-family:var(--tekst);font-size:14px;color:var(--kafe);transform:rotate(3deg);margin-top:6px;letter-spacing:.01em}

/* ---------- бутони ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;font-family:var(--tekst);font-weight:800;border:0;cursor:pointer;line-height:1.25}
.btn-cta{background:var(--mastilo-cta);color:#fff;border-radius:6px 14px 8px 12px;box-shadow:0 4px 0 #17507f;min-height:60px;padding:14px 26px;font-size:19px}
.btn-cta:hover{background:#1b63aa}
.btn-cta:active{transform:translateY(2px);box-shadow:0 2px 0 #17507f}
.vrah .btn-cta{min-height:50px;font-size:17px;padding:10px 20px}
.btn-glaven{min-height:84px;min-width:340px;font-size:23px;padding:18px 34px}

/* ---------- хартия ---------- */
.list{position:relative;background:var(--list);filter:drop-shadow(0 12px 22px rgba(45,36,27,.16))}
.list-redove{background-image:linear-gradient(90deg,transparent 58px,var(--okrajna) 58px,var(--okrajna) 60px,transparent 60px),repeating-linear-gradient(180deg,transparent 0,transparent 33px,var(--redove) 33px,var(--redove) 34px);background-color:var(--list)}
.lenta{position:absolute;width:118px;height:30px;background:var(--lenta);box-shadow:0 1px 2px rgba(0,0,0,.08);z-index:3}

/* ---------- писмото в началото ---------- */
.nachalo{padding:22px 20px 76px}
.nachalo-ram{position:relative;max-width:1060px;margin:0 auto}
.pismo{clip-path:var(--razkasano-dolu);max-width:800px;padding:48px 64px 64px 92px;line-height:34px}
.pismo > *{max-width:580px}
.pismo > .data{max-width:none}
.pismo .data{font-family:var(--ruka);font-size:22px;text-align:right;margin:0 0 10px;color:var(--kafe)}
.pismo .obrashtenie{font-family:var(--ruka);font-size:31px;margin:0 0 12px;color:var(--kafe-tumno)}
.pismo h1{font-size:46px;font-weight:700;line-height:1.12;margin:0 0 22px;max-width:15ch}
.pismo .uvod{font-size:20px;line-height:34px;margin:0 0 30px;max-width:560px}
.pismo .dejstvie{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px}
.pismo .dejstvie small{font-size:16px;color:#5a4a3a;line-height:1.4}
.pismo .kratak-podpis{font-family:var(--ruka);font-size:28px;margin:30px 0 0;color:var(--kafe-tumno);text-align:right}
.polaroid{background:#fff;padding:14px 14px 0;box-shadow:var(--sjanka);margin:0}
.polaroid figcaption{font-family:var(--ruka);font-size:21px;line-height:1.35;color:var(--mastilo);padding:12px 4px 16px;text-align:center}
.nachalo .polaroid{position:absolute;top:190px;right:0;width:350px;transform:rotate(3deg);z-index:2}
.nachalo .polaroid .lenta{top:-14px;left:50%;margin-left:-59px;transform:rotate(-4deg)}

/* ---------- плътна лента: сцените ---------- */
.scenite{background:var(--kafe-tumno);color:#f6ede2;padding:72px 20px 84px;position:relative}
.scenite::before{content:"";position:absolute;left:0;right:0;top:-1px;height:12px;background:var(--papir);clip-path:var(--razkasano-dolu)}
.vatre{max-width:1060px;margin:0 auto}
.scenite h2{color:#fff6ea;font-size:38px;max-width:20ch;margin-bottom:12px}
.scenite .podzaglavie{font-size:19px;max-width:52ch;color:#ead9c4;margin-bottom:44px}
.red{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:30px;align-items:start;margin-bottom:38px}
.izrezka{position:relative;padding:30px 34px 28px;color:var(--mastilo);background:var(--list);clip-path:var(--razkasano-gore)}
.red:nth-child(odd) .izrezka-obvivka{transform:rotate(-.8deg)}
.red:nth-child(even) .izrezka-obvivka{transform:rotate(.7deg)}
.izrezka-obvivka{position:relative;filter:drop-shadow(0 10px 18px rgba(0,0,0,.28))}
.izrezka-obvivka .lenta{top:-8px;left:28px;transform:rotate(-6deg);width:96px}
.izrezka h3{font-size:24px;margin:6px 0 10px}
.izrezka p{margin:0}
.belezhka{font-family:var(--ruka);font-size:25px;line-height:1.35;color:#a6e6e2;padding-top:22px;position:relative}
.belezhka::before{content:"";display:block;width:54px;height:2px;background:#a6e6e2;margin-bottom:10px;transform:rotate(-8deg)}
.red .polaroid{transform:rotate(-2.5deg);margin-top:22px;padding:10px 10px 0}
.red .polaroid figcaption{font-size:20px}

/* ---------- въздушна секция: изрезка от вестник ---------- */
.vestnik{padding:86px 20px 80px}
.vestnik .vatre{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:56px;align-items:center}
.vestnik h2{font-size:34px;max-width:16ch}
.vestnik .pismo-prodalzhenie{font-size:19px;max-width:50ch}
.vestnik-izrezka{position:relative;background:#f1ece2;padding:30px 30px 26px;transform:rotate(1deg);filter:drop-shadow(0 10px 18px rgba(45,36,27,.18));clip-path:var(--razkasano-gore)}
.vestnik-izrezka .lenta{top:2px;right:24px;transform:rotate(8deg);width:90px}
.vestnik-izrezka blockquote{margin:0 0 18px;font-family:var(--zaglavie);font-size:19px;line-height:1.55;column-count:1}
.vestnik-izrezka blockquote + blockquote{border-top:1px dashed #b9a88f;padding-top:16px}
.vestnik-izrezka cite{display:block;font-family:var(--tekst);font-style:normal;font-size:15px;color:#5a4a3a;margin-top:8px}

/* ---------- плътна лента: прилагам връзка ---------- */
.prilozhenie{background:var(--tirkiz);padding:80px 20px 88px;position:relative}
.plik{max-width:860px;margin:0 auto;position:relative;background:var(--list);padding:46px 56px 50px;filter:drop-shadow(0 16px 26px rgba(20,60,60,.25));clip-path:var(--razkasano-dolu)}
.kabarche{position:absolute;top:-18px;right:64px;width:26px;height:74px;border:4px solid #8c99a3;border-radius:14px;z-index:4;transform:rotate(-8deg)}
.prilozhenie-ram{position:relative;max-width:860px;margin:0 auto}
.plik h2{font-size:36px}
.plik .uvod{font-size:20px;max-width:54ch}
.plik ul{list-style:none;padding:0;margin:0 0 30px}
.plik li{padding:6px 0 6px 34px;position:relative;font-size:18px}
.plik li::before{content:"";position:absolute;left:4px;top:15px;width:16px;height:9px;border-left:3px solid var(--kafe);border-bottom:3px solid var(--kafe);transform:rotate(-45deg)}
.plik .zabelezhka{font-size:16px;color:#5a4a3a;margin-top:16px}

/* ---------- въпроси ---------- */
.vaprosi{padding:86px 20px 78px}
.vaprosi .vatre{max-width:820px}
.vaprosi h2{font-size:34px}
.vaprosi .podzaglavie{font-size:19px;margin-bottom:28px}
.vapros{border-bottom:2px dotted #cdb79a;padding:6px 0}
.vapros summary{list-style:none;cursor:pointer;font-family:var(--zaglavie);font-weight:600;font-size:21px;color:var(--kafe-tumno);padding:14px 40px 14px 0;position:relative}
.vapros summary::-webkit-details-marker{display:none}
.vapros summary::after{content:"+";position:absolute;right:6px;top:8px;font-family:var(--ruka);font-size:30px;color:var(--kafe)}
.vapros[open] summary::after{content:"–"}
.vapros p{margin:0 0 16px;max-width:62ch}

/* ---------- край на писмото ---------- */
.kraj{background:var(--plik);padding:84px 20px 90px;border-top:10px solid var(--kafe)}
.kraj .vatre{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr);gap:48px;align-items:start}
.posleden-list{padding:46px 52px 56px 88px;clip-path:var(--razkasano-dolu);line-height:34px}
.posleden-list h2{font-size:34px;line-height:1.2}
.posleden-list p{font-size:19px;line-height:34px}
.podpis{margin-top:26px}
.podpis .s-obich{font-family:var(--ruka);font-size:26px;margin:0;color:var(--kafe-tumno)}
.podpis .ime{font-family:var(--ruka);font-size:54px;line-height:1.1;margin:0 0 18px 40px;color:var(--kafe-tumno);transform:rotate(-4deg);display:inline-block}
.podpis .ps{font-family:var(--ruka);font-size:23px;line-height:1.5;color:#2c5f86;margin:0}
.kraj-desno{display:flex;flex-direction:column;gap:46px}
.pps{position:relative;padding:34px 30px 22px;transform:rotate(1.2deg);clip-path:var(--razkasano-gore)}
.pps .lenta{top:4px;left:40%;transform:rotate(-3deg)}
.pps > p{font-family:var(--ruka);font-size:22px;color:var(--kafe);margin-bottom:6px}
.pps figure{margin:0 0 14px;padding-left:18px;border-left:3px solid var(--tirkiz)}
.pps blockquote{margin:0;font-size:18px;line-height:1.5;font-style:italic}
.pps figcaption{font-size:15px;color:#5a4a3a;line-height:1.4}
.kraj .polaroid{transform:rotate(-3deg);margin-top:20px;position:relative}
.kraj .polaroid .lenta{top:-14px;right:30px;transform:rotate(7deg)}
.kraj .dejstvie{margin-top:26px}

/* ---------- долу ---------- */
.podnozhie{background:var(--kafe-tumno);color:#e9dccb;padding:30px 20px 34px;font-size:15px}
.podnozhie .vatre{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 28px;align-items:center}
.podnozhie nav{display:flex;flex-wrap:wrap;gap:6px 20px}
.podnozhie a{color:#f6ede2;font-size:15px}
.podnozhie .marka-podnozhie{font-family:var(--ruka);font-size:26px;color:#fff6ea}
.podnozhie p{margin:0;font-size:14px;max-width:60ch}

/* ---------- подстраници ---------- */
.stranica{max-width:860px;margin:30px auto 60px;padding:0 20px;width:100%}
.stranica .list{padding:44px 52px 54px;clip-path:var(--razkasano-dolu)}
.stranica .list-redove{background-image:none}
.stranica h1{font-size:40px}
.stranica h2{font-size:24px;margin-top:1.4em}
.stranica .vavedenie{font-size:20px;color:#4a3b2c}
.stranica ul{padding-left:22px}
.forma label{display:block;font-weight:700;margin:16px 0 6px}
.forma input,.forma textarea{width:100%;font:inherit;font-size:18px;padding:12px 14px;border:2px solid #cdb79a;border-radius:4px;background:#fff;color:var(--mastilo)}
.forma textarea{min-height:150px;resize:vertical}
.forma .btn-cta{margin-top:22px;border:0}
.stranica .obrashtenie{font-family:var(--ruka);font-size:28px;color:var(--kafe-tumno);margin:0 0 6px}
.stranica .kratak-podpis{font-family:var(--ruka);font-size:28px;color:var(--kafe-tumno);text-align:right;margin-top:26px}
#kontaktDakujeme{font-family:var(--ruka);font-size:26px;color:var(--kafe-tumno);margin-top:20px}

/* ---------- popup и лента (текстовете идват от js/script.js) ---------- */
.modal-overlay{position:fixed;inset:0;background:rgba(36,26,16,.82);display:none;align-items:center;justify-content:center;padding:16px;z-index:1000}
.modal-overlay.show{display:flex}
.modal{position:relative;width:640px;max-width:100%;max-height:calc(100vh - 32px);overflow:auto;background:var(--list);padding:46px 42px 40px;text-align:center;transform:rotate(-1deg);box-shadow:0 30px 60px rgba(0,0,0,.45);background-image:repeating-linear-gradient(180deg,transparent 0,transparent 33px,var(--redove) 33px,var(--redove) 34px)}
.modal::before{content:"";position:absolute;top:-12px;left:50%;margin-left:-70px;width:140px;height:30px;background:var(--lenta);transform:rotate(3deg)}
.modal .close{position:absolute;top:10px;right:12px;width:48px;height:48px;border:2px solid var(--kafe-tumno);background:#fff;color:var(--kafe-tumno);font-size:30px;line-height:1;border-radius:50%;cursor:pointer}
.modal .badge{display:inline-block;background:var(--kafe);color:#fff;font-weight:800;font-size:17px;padding:6px 16px;border-radius:3px;transform:rotate(-2deg)}
.modal h3{font-size:46px;color:var(--kafe-tumno);margin:18px 0 6px}
.modal > p{font-size:22px;font-weight:700;margin:0 0 14px}
.modal .offer{margin:0 auto 22px;max-width:440px;text-align:left;border-left:3px solid var(--tirkiz);padding:4px 0 4px 18px}
.modal .offer p{margin:4px 0;font-size:18px}
.modal .btn{white-space:normal;width:100%}
.modal .btn-cta-xl{min-height:84px;font-size:23px;padding:16px 22px}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:900;display:flex;align-items:center;justify-content:center;gap:18px;padding:12px 16px;background:var(--kafe-tumno);color:#fff6ea;box-shadow:0 -6px 18px rgba(0,0,0,.18)}
.sticky-cta > span{font-weight:700;font-size:18px}
.sticky-cta .btn{flex:0 0 auto;min-height:60px;font-size:18px;padding:10px 22px}

@media (min-width:1001px){
  .red .polaroid{margin-bottom:-70px}
  .red:last-child .belezhka{padding-top:100px}
}
@media (max-width:1000px){
  .nachalo .polaroid{position:relative;top:auto;right:auto;width:min(380px,88%);margin:-30px 0 0 auto}
  .pismo{max-width:none}
  .pismo > *{max-width:none}
  .red{grid-template-columns:1fr;gap:6px}
  .belezhka{padding-top:6px}
  .red .polaroid{max-width:400px;margin:16px auto 0}
  .vestnik .vatre,.kraj .vatre{grid-template-columns:1fr;gap:34px}
  .kraj .polaroid{max-width:420px;margin:0 auto}
  .kraj-desno{gap:34px}
}
@media (max-width:640px){
  body{font-size:17.5px;--lista:128px}
  .vrah{padding:10px 16px}
  .marka{font-size:31px}
  .marka small{font-size:14px}
  .vrah .btn-cta{min-height:48px;font-size:16px;padding:8px 14px}
  .nachalo{padding:8px 12px 56px}
  .pismo{padding:22px 18px 40px 38px;line-height:30px;background-image:linear-gradient(90deg,transparent 24px,var(--okrajna) 24px,var(--okrajna) 26px,transparent 26px),repeating-linear-gradient(180deg,transparent 0,transparent 29px,var(--redove) 29px,var(--redove) 30px)}
  .pismo .data{font-size:18px;margin-bottom:0}
  .pismo .obrashtenie{font-size:25px;margin-bottom:6px}
  .pismo h1{font-size:31px;margin-bottom:12px}
  .pismo .uvod{font-size:18px;line-height:30px;margin-bottom:18px}
  .btn-glaven{min-width:0;width:100%;font-size:21px;min-height:72px;padding:14px 18px}
  .pismo .kratak-podpis{font-size:24px;margin-top:16px}
  .nachalo .polaroid{width:86%;margin:-18px auto 0;transform:rotate(2.5deg)}
  .scenite,.prilozhenie,.kraj{padding:58px 14px 64px}
  .vestnik,.vaprosi{padding:60px 16px 56px}
  .scenite h2,.plik h2{font-size:29px}
  .vestnik h2,.vaprosi h2,.posleden-list h2{font-size:28px}
  .izrezka{padding:26px 20px 22px}
  .plik{padding:40px 22px 40px}
  .plik h2{padding-right:46px}
  .kabarche{right:16px}
  .posleden-list{padding:32px 20px 40px 36px;background-image:linear-gradient(90deg,transparent 22px,var(--okrajna) 22px,var(--okrajna) 24px,transparent 24px),repeating-linear-gradient(180deg,transparent 0,transparent 33px,var(--redove) 33px,var(--redove) 34px)}
  .podpis .ime{font-size:44px;margin-left:16px}
  .vapros summary{font-size:19px}
  .stranica{margin-top:12px;padding:0 12px}
  .stranica .list{padding:30px 20px 40px}
  .stranica h1{font-size:31px}
  .modal{padding:44px 20px 26px}
  .modal h3{font-size:34px}
  .modal .btn-cta-xl{font-size:20px;min-height:72px}
  .sticky-cta{gap:10px;padding:10px 12px}
  .sticky-cta > span{font-size:15px;line-height:1.3}
  .sticky-cta .btn{font-size:16px;padding:8px 14px;min-height:52px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
