/* ============================================================
   Template F — story-scroll
   Раскладка: текстовый hero во всю ширину → чередование
   «двухколоночный текстовый разворот ↔ полноширинная лента тайлов».
   Все классы несут префикс postal7 (подставляется вместе с HTML).
   ============================================================ */

:root{
  --bg:#f2ebdd;
  --bg2:#ded5c5;
  --acc:#b74435;
  --acc2:#24527a;
  --tx:#25282d;
  --mu:#6f7479;
  --head:"Archivo Black",Georgia,"Times New Roman",serif;
  --body:"Atkinson Hyperlegible",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --pad:clamp(18px,4vw,56px);
  --wrap:1180px;
  --tap:44px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--tx);
  font-family:var(--body);font-size:17px;line-height:1.65;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:var(--acc2);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{font-family:var(--head);font-weight:700;line-height:1.14;margin:0 0 .5em}
p{margin:0 0 1em}

.postal7skip{
  position:absolute;left:-9999px;top:0;z-index:99;
  background:var(--acc);color:var(--bg);padding:12px 20px;min-height:var(--tap)
}
.postal7skip:focus{left:0}

/* ---------- шапка ---------- */
.postal7bar{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding:12px var(--pad);
  background:var(--bg2);
  border-bottom:1px solid color-mix(in srgb,var(--mu) 28%,transparent);
  position:sticky;top:0;z-index:20;
}
.postal7mark{display:flex;align-items:center;gap:10px;color:var(--tx);min-height:var(--tap)}
.postal7mark:hover{text-decoration:none}
.postal7mark__svg{width:34px;height:34px;flex:none}
.postal7mark__t{font-family:var(--head);font-size:19px;line-height:1.1;display:block}
.postal7mark__sub{display:block;font-family:var(--body);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mu)}
.postal7nav{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.postal7nav a{
  display:flex;align-items:center;min-height:var(--tap);padding:0 14px;
  color:var(--mu);font-size:15px;border-radius:3px;
}
.postal7nav a:hover{color:var(--tx);background:color-mix(in srgb,var(--acc) 16%,transparent);text-decoration:none}

/* ---------- CTA ---------- */
.postal7cta{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:var(--tap);padding:12px 26px;
  background:var(--acc);color:var(--bg);
  font-weight:600;font-size:16px;letter-spacing:.01em;
  border-radius:2px;border:1px solid var(--acc);
}
.postal7cta:hover{filter:brightness(1.1);text-decoration:none}
.postal7cta--mini{padding:10px 18px;font-size:15px}
.postal7cta--line{background:transparent;color:var(--tx);border-color:color-mix(in srgb,var(--mu) 55%,transparent)}
.postal7cta--big{padding:16px 40px;font-size:18px}
.postal7link{
  display:inline-flex;align-items:center;min-height:var(--tap);
  color:var(--acc2);border-bottom:1px solid color-mix(in srgb,var(--acc2) 45%,transparent);
}
.postal7link:hover{text-decoration:none;color:var(--acc)}

.postal7over{
  font-family:var(--body);font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--acc2);margin:0 0 14px;
}
.postal7row{display:flex;gap:14px;flex-wrap:wrap;margin:26px 0 34px}

/* ---------- 01 · HERO: текстовый, во всю ширину ---------- */
.postal7hero{
  padding:clamp(44px,8vw,104px) var(--pad) clamp(34px,5vw,62px);
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--acc) 12%,transparent) 0%,transparent 62%),
    var(--bg);
  border-bottom:1px solid color-mix(in srgb,var(--mu) 22%,transparent);
}
.postal7hero__in{max-width:var(--wrap);margin:0 auto}
.postal7hero h1{
  font-size:clamp(30px,5.1vw,60px);
  max-width:22ch;margin-bottom:.42em;
}
.postal7lead{font-size:clamp(17px,1.5vw,20px);color:var(--mu);max-width:78ch}
.postal7kpi{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(5,1fr);
  border-top:2px solid var(--acc);
}
.postal7kpi li{
  padding:18px 16px 18px 0;font-size:14px;color:var(--mu);
  border-right:1px solid color-mix(in srgb,var(--mu) 25%,transparent);
  padding-left:16px;
}
.postal7kpi li:first-child{padding-left:0}
.postal7kpi li:last-child{border-right:0}
.postal7kpi span{
  display:block;font-family:var(--head);font-size:clamp(22px,2.6vw,32px);
  color:var(--tx);line-height:1.1;margin-bottom:4px;
}

/* ---------- текстовый разворот: слева заголовок, справа абзацы ---------- */
.postal7spread,
.postal7steps,
.postal7access,
.postal7author{padding:clamp(38px,6vw,84px) var(--pad)}
.postal7spread__in,
.postal7steps__in,
.postal7access__in,
.postal7author__in{max-width:var(--wrap);margin:0 auto}
.postal7spread__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:clamp(24px,4vw,66px)}
.postal7spread--wide .postal7spread__in{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.postal7spread__l h2,
.postal7steps__in h2,
.postal7access__in h2{font-size:clamp(24px,2.9vw,36px)}
.postal7spread__l{position:sticky;top:86px;align-self:start}
.postal7thesis{
  color:var(--acc2);font-size:16px;line-height:1.5;
  padding-left:16px;border-left:3px solid var(--acc);margin-top:18px;
}
.postal7spread__r p{color:var(--mu)}
.postal7spread__r p:first-child{color:var(--tx)}

.postal7quote{margin:26px 0 0;padding:20px 22px;background:var(--bg2);border-left:3px solid var(--acc2)}
.postal7quote blockquote{margin:0}
.postal7quote p{margin:0 0 10px;color:var(--tx)}
.postal7quote figcaption{font-size:13px;color:var(--mu)}

/* ---------- полноширинная лента тайлов ---------- */
.postal7rail{
  padding:clamp(34px,5vw,66px) 0;
  background:var(--bg2);
  border-top:1px solid color-mix(in srgb,var(--mu) 22%,transparent);
  border-bottom:1px solid color-mix(in srgb,var(--mu) 22%,transparent);
}
.postal7rail__cap{max-width:var(--wrap);margin:0 auto clamp(20px,3vw,34px);padding:0 var(--pad)}
.postal7rail__cap h2{font-size:clamp(22px,2.6vw,32px);max-width:26ch}
.postal7rail__cap p{color:var(--mu);max-width:88ch;margin:0}
.postal7rail__row{
  display:grid;grid-template-columns:repeat(4,1fr);gap:2px;
  width:100%;                    /* full-bleed: без внешних отступов */
}
.postal7tile{background:var(--bg);display:flex;flex-direction:column}
.postal7tile img{
  width:100%;height:auto;
  aspect-ratio:1/1;object-fit:cover;
  background:color-mix(in srgb,var(--mu) 18%,transparent);
}
.postal7tile__b{padding:16px 18px 20px;flex:1}
.postal7tile__b h3{font-size:18px;margin-bottom:.35em}
.postal7tile__b p{margin:0;font-size:14px;color:var(--mu)}

/* ---------- лояльность: вертикальные ступени с левой линейкой ---------- */
.postal7steps__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:clamp(24px,4vw,66px)}
.postal7ladder{list-style:none;margin:0;padding:0 0 0 26px;border-left:2px solid color-mix(in srgb,var(--mu) 35%,transparent);counter-reset:st}
.postal7ladder li{position:relative;padding:0 0 26px}
.postal7ladder li::before{
  counter-increment:st;content:counter(st);
  position:absolute;left:-39px;top:0;
  width:26px;height:26px;border-radius:50%;
  background:var(--acc);color:var(--bg);
  font-family:var(--head);font-size:14px;line-height:26px;text-align:center;
}
.postal7ladder h3{font-size:19px;margin-bottom:.3em}
.postal7ladder p{margin:0;color:var(--mu);font-size:16px}

/* ---------- касса: таблица ---------- */
.postal7tw{overflow-x:auto;margin:0 0 22px;-webkit-overflow-scrolling:touch}
.postal7tbl{width:100%;min-width:640px;border-collapse:collapse;font-size:15px}
.postal7tbl caption{text-align:left;font-size:13px;color:var(--mu);padding:0 0 10px}
.postal7tbl th,.postal7tbl td{padding:12px 14px;text-align:left;border-bottom:1px solid color-mix(in srgb,var(--mu) 25%,transparent)}
.postal7tbl thead th{
  font-family:var(--body);font-weight:600;font-size:12px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--acc2);
  border-bottom:2px solid var(--acc);
}
.postal7tbl tbody th{font-family:var(--head);font-weight:700;color:var(--tx)}
.postal7tbl td{color:var(--mu)}

/* ---------- доступ: 6 H3 ---------- */
.postal7access__g{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.4vw,30px);margin-top:clamp(22px,3vw,34px)}
.postal7access__g article{padding:20px 22px;background:var(--bg2);border-top:2px solid var(--acc2)}
.postal7access__g h3{font-size:18px}
.postal7access__g p{margin:0;color:var(--mu);font-size:15px}
.postal7access__in>.postal7spread__l{position:static;max-width:70ch}

/* ---------- FAQ: одна колонка, крупные summary ---------- */
.postal7faq{padding:clamp(38px,6vw,84px) var(--pad);background:var(--bg2)}
.postal7faq__in{max-width:860px;margin:0 auto}
.postal7faq h2{font-size:clamp(24px,2.9vw,36px);margin-bottom:.8em}
.postal7q{border-bottom:1px solid color-mix(in srgb,var(--mu) 28%,transparent)}
.postal7q summary{
  display:flex;align-items:center;gap:14px;
  min-height:56px;padding:14px 0;cursor:pointer;
  font-family:var(--head);font-size:clamp(18px,2vw,22px);line-height:1.25;
  list-style:none;
}
.postal7q summary::-webkit-details-marker{display:none}
.postal7q summary::before{
  content:"+";flex:none;width:28px;height:28px;border:1px solid var(--acc);
  color:var(--acc);font-family:var(--body);font-size:18px;line-height:26px;text-align:center;
}
.postal7q[open] summary::before{content:"–"}
.postal7q p{margin:0 0 18px;padding-left:42px;color:var(--mu)}

/* ---------- пред-подвальная полоса ---------- */
.postal7band{
  padding:clamp(34px,5vw,68px) var(--pad);text-align:center;
  background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--acc) 16%,transparent));
}
.postal7band__t{font-family:var(--head);font-size:clamp(22px,3vw,34px);line-height:1.2;margin:0 0 .4em}
.postal7band p{color:var(--mu);max-width:70ch;margin-left:auto;margin-right:auto}

/* ---------- author note ---------- */
.postal7author{border-top:1px solid color-mix(in srgb,var(--mu) 22%,transparent)}
.postal7author__in{max-width:900px}
.postal7author h2{font-size:clamp(21px,2.3vw,28px)}
.postal7author p{color:var(--mu);font-size:15px}

/* ---------- подвал ---------- */
.postal7foot{padding:clamp(30px,4vw,54px) var(--pad);background:var(--bg2);border-top:2px solid var(--acc)}
.postal7foot__grid{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.postal7foot__t{font-family:var(--head);font-size:16px;color:var(--tx);margin-bottom:.4em}
.postal7foot p{font-size:14px;color:var(--mu)}
.postal7foot__c{max-width:var(--wrap);margin:26px auto 0;font-size:13px;color:var(--mu)}

/* ---------- мобильная раскладка ---------- */
@media (max-width:1000px){
  .postal7kpi{grid-template-columns:repeat(3,1fr)}
  .postal7kpi li{border-right:0;padding-left:0}
  .postal7rail__row{grid-template-columns:repeat(2,1fr)}
  .postal7foot__grid{grid-template-columns:1fr}
}
@media (max-width:620px){
  body{font-size:16px}
  /* одна колонка везде: развороты схлопываются, лента становится вертикальной */
  .postal7spread__in,
  .postal7spread--wide .postal7spread__in,
  .postal7steps__in,
  .postal7access__g,
  .postal7kpi,
  .postal7rail__row{grid-template-columns:1fr}
  .postal7spread__l{position:static}
  .postal7tile img{aspect-ratio:2/1}   /* лента разворачивается в горизонтальные баннеры */
  .postal7nav{width:100%;margin-left:0}
  .postal7nav a{flex:1 1 auto;justify-content:center}
  .postal7cta,.postal7cta--big{width:100%}
  .postal7row{flex-direction:column}
  .postal7q p{padding-left:0}
  .postal7hero h1{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

.seo-intents{max-width:1180px;margin:24px auto;padding:16px 20px;color:var(--muted,inherit);font-size:.78rem;line-height:1.8}.seo-intents p{margin:0}@media(max-width:620px){.seo-intents{padding:14px}}
