
/* Layout: long single page in full-width bands on a 1160px grid. Hero is an exploded isometric building; the UK cleaning colour code (red/blue/green/yellow) is the only accent language. */
:root{
  --bg:#f3f6f7; --surface:#ffffff; --ink:#0f1f29; --muted:#52646f; --line:#d6dfe3;
  --accent:#0d5c86; --accent-ink:#ffffff; --band:#0f1f29; --band-ink:#e9f0f3; --band-muted:#9db1bd;
  --red:#d2453b; --blue:#2a6fc4; --green:#2f9356; --yellow:#e7ae16;
  --slab:#ffffff; --slab-edge:#c9d4da; --furn:#eef2f4; --chair:#3a4b56; --wall:#dfe7eb;
  --ok:#2f8a4c; --err:#b3261e;
  --display:"Familjen Grotesk","Helvetica Neue",Arial,sans-serif;
  --body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --r:6px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0c151b; --surface:#131f27; --ink:#e6eef2; --muted:#98abb7; --line:#26363f;
  --accent:#62b6e2; --accent-ink:#05131b; --band:#071d27; --band-ink:#e6eef2; --band-muted:#8ea7b4;
  --red:#e8635a; --blue:#5a97e6; --green:#4fb575; --yellow:#efc03c;
  --slab:#1d2c35; --slab-edge:#0f1a20; --furn:#2c3d47; --chair:#90a6b2; --wall:#24353f;
  --ok:#5fbf7d; --err:#ff8a80; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0c151b; --surface:#131f27; --ink:#e6eef2; --muted:#98abb7; --line:#26363f;
  --accent:#62b6e2; --accent-ink:#05131b; --band:#071d27; --band-ink:#e6eef2; --band-muted:#8ea7b4;
  --red:#e8635a; --blue:#5a97e6; --green:#4fb575; --yellow:#efc03c;
  --slab:#1d2c35; --slab-edge:#0f1a20; --furn:#2c3d47; --chair:#90a6b2; --wall:#24353f;
  --ok:#5fbf7d; --err:#ff8a80; color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--surface)}
a{color:var(--accent)}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.wrap{max-width:1160px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--display);line-height:1.08;text-wrap:balance;margin:0}
h2{font-size:clamp(1.85rem,3.3vw,2.6rem);letter-spacing:-.015em}
h3{font-size:1.18rem}
p{margin:0}
.eyebrow{font-family:var(--mono);font-size:.76rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.lede{color:var(--muted);max-width:62ch;font-size:1.06rem}
section{padding-block:clamp(60px,8vw,104px)}
.sec-head{display:grid;gap:12px;margin-bottom:40px}

/* isometric drawing classes */
.slab-t{fill:var(--slab)} .slab-l{fill:color-mix(in srgb,var(--slab-edge) 80%,var(--slab))} .slab-r{fill:var(--slab-edge)}
.wall-t{fill:var(--wall)} .wall-l{fill:color-mix(in srgb,var(--wall) 88%,#000)} .wall-r{fill:color-mix(in srgb,var(--wall) 78%,#000)}
.wall-t,.wall-l,.wall-r{fill-opacity:.7}
.furn-t{fill:var(--furn)} .furn-l{fill:color-mix(in srgb,var(--furn) 86%,#000)} .furn-r{fill:color-mix(in srgb,var(--furn) 72%,#000)}
.chair-t{fill:var(--chair)} .chair-l{fill:color-mix(in srgb,var(--chair) 80%,#000)} .chair-r{fill:color-mix(in srgb,var(--chair) 65%,#000)}
.screen-t,.screen-l,.screen-r{fill:var(--chair)}
.red-t{fill:var(--red)} .red-l{fill:color-mix(in srgb,var(--red) 80%,#000)} .red-r{fill:color-mix(in srgb,var(--red) 64%,#000)}
.blue-t{fill:var(--blue)} .blue-l{fill:color-mix(in srgb,var(--blue) 80%,#000)} .blue-r{fill:color-mix(in srgb,var(--blue) 64%,#000)}
.green-t{fill:var(--green)} .green-l{fill:color-mix(in srgb,var(--green) 80%,#000)} .green-r{fill:color-mix(in srgb,var(--green) 64%,#000)}
.yellow-t{fill:var(--yellow)} .yellow-l{fill:color-mix(in srgb,var(--yellow) 82%,#000)} .yellow-r{fill:color-mix(in srgb,var(--yellow) 66%,#000)}
.redlite-t,.redlite-l,.redlite-r{fill:color-mix(in srgb,var(--red) 35%,var(--furn))}
.yellowlite-t,.yellowlite-l,.yellowlite-r{fill:color-mix(in srgb,var(--yellow) 45%,var(--furn))}
.red-floor{fill:color-mix(in srgb,var(--red) 15%,var(--slab))}
.blue-floor{fill:color-mix(in srgb,var(--blue) 13%,var(--slab))}
.green-floor{fill:color-mix(in srgb,var(--green) 15%,var(--slab))}
.yellow-floor{fill:color-mix(in srgb,var(--yellow) 20%,var(--slab))}
.leader{stroke:var(--muted);stroke-width:1;stroke-dasharray:2 3}
.leader-dot{fill:var(--ink)}
.lbl-a{font:600 12px var(--mono);fill:var(--ink);letter-spacing:.06em;text-transform:uppercase}
.lbl-b{font:400 11.5px var(--body);fill:var(--muted)}
.lvl{transition:transform .5s ease}
@media (prefers-reduced-motion:no-preference){
  .hero-art .lvl{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
  .hero-art .lvl:nth-of-type(2){animation-delay:.12s} .hero-art .lvl:nth-of-type(3){animation-delay:.24s}
}
@keyframes rise{from{transform:translateY(14px)}to{transform:none}}

/* header */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:13px}
.wm-sub{font-weight:500;color:var(--muted)}
footer .wm-sub{color:var(--band-muted)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-family:var(--display);font-weight:700;font-size:1.3rem;letter-spacing:-.01em}
.mark{display:grid;grid-template-columns:repeat(2,9px);gap:3px;transform:rotate(45deg)}
.mark i{width:9px;height:9px;border-radius:2px;display:block}
.nav ul{display:flex;gap:24px;list-style:none;margin:0;padding:0}
.nav ul a{color:var(--ink);text-decoration:none;font-weight:500;font-size:.95rem}
.nav ul a:hover{color:var(--accent)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:var(--r);padding:12px 20px;font:600 .98rem var(--body);cursor:pointer;text-decoration:none;background:var(--accent);color:var(--accent-ink)}
.btn:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn[disabled]{opacity:.6;cursor:progress}
@media (max-width:860px){.nav ul{display:none}}

/* hero */
.hero{padding-block:clamp(40px,6vw,72px) clamp(40px,5vw,64px);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(24px,4vw,56px);align-items:center}
.hero-copy{min-width:0}
.hero h1{font-size:clamp(2.5rem,5.4vw,4.4rem);letter-spacing:-.025em;margin:16px 0 20px}
.hero h1 .hl{background:linear-gradient(transparent 64%,color-mix(in srgb,var(--yellow) 50%,transparent) 64%)}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px;padding-top:24px;border-top:1px solid var(--line);max-width:560px}
.facts b{display:block;font-family:var(--display);font-size:1.02rem}
.facts span{color:var(--muted);font-size:.86rem;line-height:1.4;display:block;margin-top:2px}
.hero-art{width:100%;max-width:100%;height:auto;max-height:600px;display:block}
.art-wrap{position:relative;min-width:0}
.legend{margin-top:12px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 16px;display:grid;grid-template-columns:repeat(4,auto);justify-content:space-between;gap:8px 16px;font-size:.82rem}
.legend div{display:flex;align-items:center;gap:8px}
.sw{width:12px;height:12px;border-radius:3px;flex:none}
@media (max-width:920px){.hero-grid{grid-template-columns:1fr}.hero-art{max-height:460px;margin-inline:auto}}
@media (max-width:640px){.legend{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.facts{grid-template-columns:1fr}}

/* estimator */
.estimator-sec{background:var(--surface);border-block:1px solid var(--line)}
.est-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,64px);align-items:start}
.est{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:clamp(20px,3vw,28px);display:grid;gap:20px}
.field{display:grid;gap:6px;min-width:0}
.field label,.lbl{font-weight:600;font-size:.9rem}
.field small{color:var(--muted);font-size:.8rem}
input,select,textarea{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;width:100%;min-width:0}
textarea{min-height:120px;resize:vertical}
input[type=range]{padding:0;accent-color:var(--accent);background:transparent;border:0}
.row{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.val{font-family:var(--mono);font-variant-numeric:tabular-nums}
.seg{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.seg button{font:500 .86rem var(--body);padding:10px 4px;border-radius:var(--r);border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.result{border-top:1px dashed var(--line);padding-top:16px;display:grid;gap:4px}
.price{font-family:var(--display);font-size:2.6rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.015em}
.price span{font-size:1rem;color:var(--muted);font-weight:500}
.fine{font-size:.8rem;color:var(--muted)}
.breakdown{font-family:var(--mono);font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}
.how{display:grid;gap:18px}
.how dl{display:grid;gap:14px;margin:8px 0 0}
.how dt{font-weight:600}
.how dd{margin:2px 0 0;color:var(--muted)}
@media (max-width:860px){.est-grid{grid-template-columns:1fr}}
@media (max-width:420px){.seg{grid-template-columns:repeat(2,1fr)}}

/* services */
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.svc{background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;min-width:0}
.svc-art{background:color-mix(in srgb,var(--c) 9%,var(--bg));border-bottom:4px solid var(--c);padding:16px 12px 8px;display:grid;place-items:center;height:170px}
.mini-art{width:100%;height:100%;max-width:100%}
.svc-body{padding:20px;display:grid;gap:10px;align-content:start}
.svc .tag{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--c);font-weight:500;filter:brightness(.85)}
.svc p{color:var(--muted);font-size:.94rem}
.svc ul{margin:0;padding-left:18px;color:var(--muted);font-size:.9rem;display:grid;gap:3px}
.periodic{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:28px}
.periodic div{background:var(--surface);padding:20px;display:grid;gap:6px}
.periodic p{color:var(--muted);font-size:.92rem}
@media (max-width:1000px){.svc-grid{grid-template-columns:repeat(2,1fr)}.periodic{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.svc-grid,.periodic{grid-template-columns:1fr}}

/* process */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.step{display:grid;gap:10px;align-content:start;border-top:2px solid var(--ink);padding-top:16px}
.step .n{font-family:var(--mono);font-size:.8rem;color:var(--muted)}
.step p{color:var(--muted);font-size:.95rem}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

/* sectors band */
.band{background:var(--band);color:var(--band-ink)}
.band .eyebrow,.band .lede{color:var(--band-muted)}
.sectors{display:grid;grid-template-columns:repeat(3,1fr);gap:30px 44px}
.sector{display:grid;gap:6px;border-left:2px solid color-mix(in srgb,var(--band-ink) 22%,transparent);padding-left:16px}
.sector p{color:var(--band-muted);font-size:.95rem}
@media (max-width:820px){.sectors{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.sectors{grid-template-columns:1fr}}

/* coverage */
.regions{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.region{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px 20px;display:grid;gap:10px;align-content:start}
.region h3{font-size:1.05rem;display:flex;justify-content:space-between;gap:8px}
.region h3 small{font-family:var(--mono);font-size:.72rem;color:var(--muted);font-weight:400;letter-spacing:.05em}
.cities{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.cities li{font-size:.85rem;border:1px solid var(--line);border-radius:999px;padding:3px 10px;background:var(--bg)}
@media (max-width:900px){.regions{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.regions{grid-template-columns:1fr}}

/* standards table */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:.93rem}
th,td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:var(--mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:500}
tr:last-child td{border-bottom:0}
.dot{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:8px;vertical-align:middle}

/* contact */
.contact-sec{background:var(--surface);border-top:1px solid var(--line)}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,64px);align-items:start}
.contact-aside{display:grid;gap:20px}
.contact-aside dl{display:grid;gap:14px;margin:0}
.contact-aside dt{font-family:var(--mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.contact-aside dd{margin:2px 0 0}
form{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:clamp(20px,3vw,32px);display:grid;gap:18px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.err-msg{color:var(--err);font-size:.82rem}
[aria-invalid="true"]{border-color:var(--err)}
.status{border-radius:var(--r);padding:14px 16px;font-size:.95rem}
.status.ok{background:color-mix(in srgb,var(--ok) 14%,transparent);border:1px solid color-mix(in srgb,var(--ok) 45%,transparent)}
.status.warn{background:color-mix(in srgb,var(--yellow) 16%,transparent);border:1px solid color-mix(in srgb,var(--yellow) 50%,transparent)}
.status.bad{background:color-mix(in srgb,var(--err) 12%,transparent);border:1px solid color-mix(in srgb,var(--err) 45%,transparent)}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}}
@media (max-width:560px){.two{grid-template-columns:1fr}}

/* faq */
.faq{border-top:1px solid var(--line);max-width:840px}
details{border-bottom:1px solid var(--line);padding-block:18px}
summary{cursor:pointer;font-family:var(--display);font-weight:600;font-size:1.1rem;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--mono);color:var(--muted)}
details[open] summary::after{content:"\2212"}
details p{color:var(--muted);margin-top:10px;max-width:68ch}

/* inbox */
.inbox{background:var(--bg);border-top:1px solid var(--line)}
.inbox-list{display:grid;gap:12px}
.enq{border:1px solid var(--line);border-radius:12px;padding:16px 18px;display:grid;gap:8px;background:var(--surface)}
.enq-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px}
.pill{font-family:var(--mono);font-size:.72rem;padding:3px 10px;border-radius:999px;border:1px solid var(--line)}
.enq p{color:var(--muted);font-size:.93rem;overflow-wrap:anywhere}
.empty{color:var(--muted);border:1px dashed var(--line);border-radius:12px;padding:22px}

footer{background:var(--band);color:var(--band-muted);padding-block:48px 40px;font-size:.88rem}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
.foot h3{font-size:.95rem;color:var(--band-ink);margin-bottom:10px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.foot a{color:var(--band-muted);text-decoration:none}
.foot a:hover{color:var(--band-ink)}
.legal{border-top:1px solid color-mix(in srgb,var(--band-ink) 15%,transparent);margin-top:36px;padding-top:20px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:.8rem}
footer .brand{color:var(--band-ink)}
@media (max-width:760px){.foot{grid-template-columns:1fr}}

.crumbs{font-size:.84rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 18px;padding:0}
.crumbs li+li::before{content:"/";margin-right:6px;color:var(--line)}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--accent)}
.page-hero{padding-block:clamp(36px,5vw,64px);border-bottom:1px solid var(--line);background:var(--surface)}
.page-hero .ph-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(24px,4vw,56px);align-items:center}
.page-hero h1{font-size:clamp(2.1rem,4.4vw,3.4rem);letter-spacing:-.02em;margin:12px 0 16px}
.page-hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.ph-art{min-width:0}.ph-art svg{width:100%;height:auto;max-height:300px;display:block}
@media (max-width:860px){.page-hero .ph-grid{grid-template-columns:1fr}.ph-art{max-width:420px}}
.cols{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(28px,5vw,64px);align-items:start}
.cols>*{min-width:0}
@media (max-width:900px){.cols{grid-template-columns:1fr}}
.prose{max-width:70ch;display:grid;gap:16px}
.prose h2{font-size:clamp(1.4rem,2.4vw,1.8rem);margin-top:18px}
.prose h3{margin-top:8px}
.prose p,.prose li{color:color-mix(in srgb,var(--ink) 85%,var(--muted))}
.prose ul{margin:0;padding-left:20px;display:grid;gap:6px}
.prose .tbl-wrap{margin-block:4px}
.prose ul.chips,.prose ul.checks{display:flex;flex-wrap:wrap;padding-left:0}
.prose ul.checks{display:grid}
.checks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.checks li{display:flex;gap:10px;align-items:flex-start}
.checks li::before{content:"";flex:none;width:18px;height:18px;margin-top:3px;border-radius:4px;background:color-mix(in srgb,var(--c,var(--blue)) 18%,transparent);border:2px solid var(--c,var(--blue))}
.aside-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:22px;display:grid;gap:12px;position:sticky;top:calc(env(safe-area-inset-top,0px) + 84px)}
.aside-card h2{font-size:1.25rem}
.aside-card p{color:var(--muted);font-size:.95rem}
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card-grid.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:960px){.card-grid,.card-grid.four{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.card-grid,.card-grid.four{grid-template-columns:1fr}}
.link-card{display:grid;gap:8px;align-content:start;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:20px;text-decoration:none;color:var(--ink);transition:border-color .2s,transform .2s}
.link-card:hover{border-color:var(--accent);transform:translateY(-2px)}
.link-card p{color:var(--muted);font-size:.93rem}
.link-card .more{color:var(--accent);font-weight:600;font-size:.9rem}
.link-card .tag{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cta-band{background:var(--band);color:var(--band-ink)}
.cta-band .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}
.cta-band p{color:var(--band-muted)}
.cta-band h2{font-size:clamp(1.5rem,2.6vw,2rem)}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.chips li a,.chips li span{display:inline-block;font-size:.88rem;border:1px solid var(--line);border-radius:999px;padding:5px 12px;background:var(--surface);color:var(--ink);text-decoration:none}
.chips li a:hover{border-color:var(--accent);color:var(--accent)}
.cities li a{color:var(--ink);text-decoration:none}.cities li a:hover{color:var(--accent)}
.region h3 a{color:var(--ink);text-decoration:none}.region h3 a:hover{color:var(--accent)}
.svc h3 a,.periodic h3 a{color:var(--ink);text-decoration:none}.svc h3 a:hover,.periodic h3 a:hover{color:var(--accent)}
.updated{font-size:.84rem;color:var(--muted)}
.facts-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px}
.facts-row div{border-top:2px solid var(--ink);padding-top:12px}
.facts-row dt{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.facts-row dd{margin:4px 0 0;font-weight:500}
@media (max-width:640px){.facts-row{grid-template-columns:1fr}}
section.tight{padding-block:clamp(40px,6vw,72px)}

.foot4{grid-template-columns:1.4fr 1fr 1fr 1fr}@media (max-width:900px){.foot4{grid-template-columns:1fr 1fr}}@media (max-width:520px){.foot4{grid-template-columns:1fr}}

.topic-block+.topic-block{margin-top:44px}
.topic-block h2{font-size:1.4rem;margin-bottom:16px;display:flex;align-items:baseline;gap:10px}
.topic-block h2 small{font-family:var(--mono);font-size:.74rem;color:var(--muted);font-weight:400}
.post-meta{font-family:var(--mono);font-size:.76rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.post-list{display:grid;gap:0;border-top:1px solid var(--line)}
.post-item{display:grid;grid-template-columns:160px 1fr;gap:20px;padding-block:22px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.post-item:hover h3{color:var(--accent)}
.post-item p{color:var(--muted);margin-top:6px}
@media (max-width:640px){.post-item{grid-template-columns:1fr;gap:6px}}
.gloss{display:grid;gap:0;border-top:1px solid var(--line);max-width:860px}
.gloss div{display:grid;grid-template-columns:220px 1fr;gap:20px;padding-block:14px;border-bottom:1px solid var(--line);scroll-margin-top:90px}
.gloss dt{font-family:var(--display);font-weight:600}
.gloss dd{margin:0;color:var(--muted)}
@media (max-width:640px){.gloss div{grid-template-columns:1fr;gap:4px}}
.az{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px}
.az a{font-family:var(--mono);font-size:.85rem;padding:4px 9px;border:1px solid var(--line);border-radius:6px;text-decoration:none;color:var(--ink);background:var(--surface)}
.az a:hover{border-color:var(--accent);color:var(--accent)}
