/* spongeafrica.co.za — внутренние страницы в приборной раскладке главной: те же точки x 20 · 198 · 561 · 731,
   служебный 10/13, Montserrat 300 капсом, листы внахлёст, счётчик 180 px. Страница прокручивается (Lenis). */
html.js.inner,html.js.inner body{height:auto;overflow:visible}
.inner body{background:var(--field)}
.chrome{position:fixed;inset:0 0 auto 0;height:0;z-index:20;color:var(--ink)}
.chrome .cube,.chrome .menu,.chrome .top,.chrome .svc--v,.chrome .burger{pointer-events:auto}
.chrome .menu{position:fixed}
.mi.is-cur{position:relative}
.mi.is-cur::before{content:"";position:absolute;left:-14px;top:50%;width:6px;height:6px;margin-top:-3px;background:var(--acc)}
.menu ul{gap:2px}

.doc{position:relative;display:grid;grid-template-columns:541px minmax(0,1fr) 34vw;column-gap:0;padding:20px var(--m) 0 0;min-height:100vh}
.doc__head{grid-column:2 / span 2;padding:250px 0 64px 20px;max-width:900px}
.crumb{display:flex;gap:8px;align-items:baseline;margin-bottom:22px}
.doc__h{font-family:Montserrat,sans-serif;font-weight:300;font-size:clamp(34px,4.4vw,72px);line-height:1;letter-spacing:.005em;text-transform:uppercase;margin:0;max-width:16ch}
.doc__sub{margin-top:26px;max-width:420px}
.txt{font-size:14px;line-height:1.45;font-weight:400}
.txt--lead{font-size:18px;line-height:1.4}
.doc__count{position:sticky;top:calc(100vh - 230px);grid-column:1;grid-row:1 / span 3;align-self:start;margin-left:198px;height:0;overflow:visible}
.doc__count .count__a{font-family:Montserrat,sans-serif;font-weight:400;font-size:180px;line-height:153px;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.doc__count .count__n{display:flex;align-items:flex-end;gap:18px;margin-top:8px}
.doc__count .count__b{padding-bottom:16px}
.doc__body{grid-column:2;padding:0 40px 0 20px;display:flex;flex-direction:column;gap:56px;max-width:560px}
.blk{display:grid;gap:14px}
.blk--text{gap:18px}
.inc{display:grid;gap:0;border-top:1px solid rgba(30,30,30,.18)}
.inc li{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid rgba(30,30,30,.18)}
.pl{display:grid;gap:0}
.pl__a{display:grid;gap:6px;padding:14px 0;border-bottom:1px solid rgba(30,30,30,.12);transition:opacity .32s ease}
.pl:hover .pl__a:not(:hover){opacity:.24}
.pl__t{font-family:Montserrat,sans-serif;font-weight:300;font-size:16px;line-height:16px;letter-spacing:.01em;text-transform:uppercase}
.pl__dash{display:block;width:12px;height:1px;background:currentColor;margin-top:4px;transition:width .5s var(--e-out)}
.pl__a:hover .pl__dash{width:48px}
.faq{display:grid;gap:34px}
.faq li{display:grid;gap:10px}
.faq__q{font-family:Montserrat,sans-serif;font-weight:300;font-size:22px;line-height:1.15;text-transform:uppercase;margin:0}

/* листы: кадр и призыв внахлёст, липнут справа */
.doc__papers{grid-column:3;grid-row:2 / span 2;position:sticky;top:120px;align-self:start;height:calc(100vh - 140px);min-height:520px}
.sheet{position:absolute;box-shadow:-2px 4px 4px 0 rgba(0,0,0,.23)}
.sheet--img{left:0;top:0;width:min(30vw,460px);aspect-ratio:4/5;margin:0;background:#D4D4D4;padding:14px 14px 48px;transform:rotate(3deg)}
.sheet--img img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.06);transition:filter .9s var(--e-out)}
.sheet--img:hover img{filter:none}
.sheet--dark{left:-6vw;top:46%;width:min(26vw,380px);background:#1A1A1A;color:#fff;padding:26px;display:grid;gap:14px;transform:rotate(-4deg);z-index:2}
.sheet__h{font-family:Montserrat,sans-serif;font-weight:300;font-size:34px;line-height:36px;text-transform:uppercase}
.doc__foot{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:8px 22px;padding:120px 0 24px 198px}

/* шторка перехода живёт и на внутренних */
.trans{transform:translateY(0)}
html.is-safe .trans{transform:translateY(100%)}

/* форма заявки (кабинет Sponge) в манере листа и колонки услуг */
.blk--form{max-width:640px}
.of{display:grid;gap:22px}
.pf-lede{font-size:18px;line-height:1.4}
.pf{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
.pf-set{grid-column:1 / -1;border:0;margin:0 0 22px;padding:0}
.pf-set legend{font-size:var(--fs);opacity:.5;padding:0;margin-bottom:10px}
.pf-fams{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.pf-fam{display:flex;justify-content:space-between;align-items:flex-end;min-height:58px;padding:10px;background:#D4D4D4;text-align:left;font-family:Montserrat,sans-serif;font-weight:300;font-size:13px;text-transform:uppercase;letter-spacing:.01em;transition:background .3s,color .3s}
.pf-fam:hover{background:#c6c6c6}
.pf-fam[aria-expanded="true"]{background:#1A1A1A;color:#fff}
.pf-count{font-family:"Wix Madefor Text",sans-serif;font-size:var(--fs);color:var(--acc)}
.pf-svc{display:flex;flex-wrap:wrap;gap:6px;padding-top:12px}
.pf-svc[hidden],.pf-done[hidden],.pf-go[hidden]{display:none}
.pf-chip input,.pf-tab input{position:absolute;opacity:0;pointer-events:none}
.pf-chip span{display:inline-block;padding:7px 11px;border:1px solid rgba(30,30,30,.35);font-size:12px;transition:background .25s,color .25s,border-color .25s}
.pf-chip input:checked+span{background:var(--acc);border-color:var(--acc);color:#fff}
.pf-chip input:focus-visible+span,.pf-tab input:focus-visible+span{outline:2px solid var(--acc);outline-offset:2px}
.pf-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.pf-tab span{display:grid;gap:6px;padding:12px;background:#E1E1E1;height:100%;cursor:pointer;transition:background .3s}
.pf-tab b{font-family:Montserrat,sans-serif;font-weight:400;font-size:17px;line-height:1.1}
.pf-tab small{font-size:var(--fs);line-height:var(--lh);opacity:.6}
.pf-tab input:checked+span{background:#1A1A1A;color:#fff}
.pf-field{display:grid;gap:6px;margin-bottom:18px;position:relative}
.pf-wide,.pf-f-password{grid-column:1 / -1}
.pf-field label{font-size:var(--fs);opacity:.5}
.pf-field input,.pf-field textarea{font:inherit;font-size:16px;font-weight:400;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--ink);padding:8px 0;border-radius:0;resize:none;outline:0;width:100%}
.pf-field input:focus,.pf-field textarea:focus{border-bottom-color:var(--acc)}
.pf-field.is-bad input{border-bottom-color:var(--acc)}
.pf-err{font-size:var(--fs);color:var(--acc);min-height:var(--lh)}
.pf-eye{position:absolute;right:0;top:22px;width:30px;height:30px}
.pf-eye::before{content:"";position:absolute;inset:10px 4px;border:1px solid var(--ink);border-radius:50%}
.pf-eye::after{content:"";position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px;background:var(--ink);border-radius:50%}
.pf-eye[aria-pressed="true"]::after{background:var(--acc)}
.pf-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.pf-alert{grid-column:1 / -1;color:var(--acc);min-height:var(--lh)}
.pf-foot{grid-column:1 / -1;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.pf-send{background:#1A1A1A;color:#fff;padding:20px 26px;font-family:Montserrat,sans-serif;font-weight:300;font-size:19px;text-transform:uppercase;letter-spacing:.01em;box-shadow:-2px 4px 4px 0 rgba(0,0,0,.23);transform:rotate(-2deg);transition:transform .4s var(--e-out),background .3s}
.pf-send:hover{transform:rotate(0);background:var(--acc)}.pf-send:disabled{opacity:.6}
.pf-note{font-size:var(--fs);opacity:.6;max-width:240px}.pf-note a{text-decoration:underline}
.pf-done{background:#1A1A1A;color:#fff;padding:28px;display:grid;gap:14px;box-shadow:-2px 4px 4px 0 rgba(0,0,0,.23);transform:rotate(-2deg);opacity:0;transition:opacity .6s}
.pf-done.is-in{opacity:1}
.pf-done-h{font-family:Montserrat,sans-serif;font-weight:300;font-size:34px;line-height:36px;text-transform:uppercase;margin:0}
.pf-done-p{font-size:14px;line-height:1.45}
.pf-go{justify-self:start;border-bottom:1px solid currentColor;padding-bottom:2px}
.nx{border-top:1px solid rgba(30,30,30,.18);padding-top:16px}
.nx-h{font-size:var(--fs);opacity:.5;margin-bottom:10px}
.nx-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.nx-steps li{display:grid;gap:6px;font-size:12px;line-height:1.4}
.nx-steps b{font-family:Montserrat,sans-serif;font-weight:400;font-size:44px;line-height:1;letter-spacing:-.04em}
.pf-mailaddr{font-family:Montserrat,sans-serif;font-weight:400;font-size:22px;border-bottom:1px solid currentColor;overflow-wrap:anywhere}

@media (max-width:1099px){
  .chrome .menu{position:absolute}
  .doc{grid-template-columns:178px minmax(0,1fr)}
  .doc__papers,.doc__count{display:none}
  .doc__head{grid-column:2;padding-left:20px}
  .doc__body{grid-column:2}
}
@media (max-width:800px){
  .chrome .menu{position:fixed}
  .chrome .menu.is-open ul{color:var(--ink)}
  .doc{display:block;padding:0 var(--m)}
  .doc__head{padding:150px 0 40px}
  .doc__count{position:static;height:auto;margin:0 0 30px}
  .doc__count .count__a{font-size:90px;line-height:76px}
  .doc__body{padding:0;max-width:none}
  .doc__papers{display:block;position:relative;top:0;height:auto;min-height:0;margin:60px 0 0;display:grid;gap:0}
  .sheet{position:relative;left:0;top:0;width:auto}
  .sheet--img{width:86%;aspect-ratio:4/3}
  .sheet--dark{width:86%;margin:-30px 0 0 auto}
  .doc__foot{padding:80px 0 calc(24px + env(safe-area-inset-bottom))}
  .pf,.pf-tabs,.nx-steps{grid-template-columns:1fr}
  .pf-fams{grid-template-columns:1fr 1fr}
}