/* Korttelivirta: mobile-first poster system, isolated from the Sivuhuolto site. */
body.kv-body { margin: 0; background: #efede5; }
.kv { --kv-ink:#181b1a; --kv-lime:#d9ff36; --kv-paper:#efede5; --kv-orange:#ff7049; color:var(--kv-ink); background:var(--kv-paper); font: 500 16px/1.45 Arial, Helvetica, sans-serif; overflow:clip; }
.kv *, .kv *::before, .kv *::after { box-sizing:border-box; }
.kv a { color:inherit; }
.kv :focus-visible { outline:3px solid var(--kv-orange); outline-offset:4px; }
.kv h1, .kv h2, .kv h3 { margin-top:0; color:inherit; text-wrap:initial; font-family:'Arial Black',Arial,Helvetica,sans-serif; font-weight:900; letter-spacing:.012em; line-height:1.08; }
.kv h2 { line-height:1.15; }
.kv h3 { line-height:1.2; }
.kv__skip { position:absolute; top:-100px; left:1rem; z-index:30; padding:.6rem 1rem; background:#fff; }
.kv__skip:focus { top:1rem; }
.kv__concept { display:flex; justify-content:space-between; gap:1rem; padding:.6rem 1rem; color:#fff; background:var(--kv-ink); font:700 .6rem/1.2 'Courier New',monospace; letter-spacing:.06em; }
.kv__concept a { text-decoration:none; border-bottom:1px solid currentColor; white-space:nowrap; }
.kv__header { display:flex; align-items:center; justify-content:space-between; gap:.8rem; min-height:78px; padding:.8rem 1rem; border-bottom:3px solid var(--kv-ink); }
.kv__logo { display:flex; align-items:center; gap:.45rem; flex:none; text-decoration:none; font:900 1.15rem/1 'Arial Black',Arial,sans-serif; letter-spacing:0; }
.kv__logo-mark { display:grid; place-items:center; width:2.15rem; height:2.15rem; background:var(--kv-ink); color:var(--kv-lime); font:900 1.65rem/1 Arial,sans-serif; }
.kv__logo-dot { color:var(--kv-orange); }
.kv__nav { display:flex; align-items:center; gap:.4rem; font:800 .63rem/1 Arial,sans-serif; letter-spacing:.02em; }
.kv__nav a { text-decoration:none; padding:.7rem .4rem; }
.kv__nav a:not(.kv__nav-cta) { display:none; }
.kv__nav a:hover { text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px; }
.kv__nav .kv__nav-cta { padding:.8rem .72rem; border:2px solid var(--kv-ink); background:var(--kv-lime); box-shadow:3px 3px 0 var(--kv-ink); white-space:nowrap; transition:transform .15s,box-shadow .15s; }
.kv__nav .kv__nav-cta:hover { transform:translate(2px,2px); box-shadow:1px 1px 0 var(--kv-ink); text-decoration:none; }
.kv__hero { background:var(--kv-lime); }
.kv__hero-copy { padding:2.5rem 1rem 3rem; }
.kv__eyebrow, .kv__hero-note, .kv__section-index, .kv__card-no, .kv__service-card a, .kv__summary-tag, .kv__summary-foot, .kv__footer { font:700 .68rem/1.25 'Courier New',monospace; letter-spacing:.045em; }
.kv__eyebrow { display:flex; align-items:center; flex-wrap:wrap; gap:.3rem; max-width:480px; margin:0 0 2.8rem; }
.kv__eyebrow>span:last-child { opacity:.65; }
.kv__status-dot { display:inline-block; width:.55rem; height:.55rem; margin-right:.3rem; border-radius:50%; background:var(--kv-ink); }
.kv__hero h1 { font-size:clamp(2.7rem,13.2vw,6rem); margin:0 0 2.3rem; line-height:1.07; white-space:nowrap; }
.kv__hero h1>span { display:inline-block; position:relative; }
.kv__bolt { position:absolute; top:-.1em; right:-.3em; color:var(--kv-orange); font:900 .55em/1 Arial,sans-serif; transform:rotate(13deg); }
.kv__hero-period { color:var(--kv-orange); }
.kv__hero-lead { max-width:27rem; font-size:clamp(1.05rem,4vw,1.25rem); font-weight:700; line-height:1.35; margin-bottom:2rem; }
.kv__button { display:inline-flex; justify-content:space-between; align-items:center; gap:2rem; min-height:3.5rem; padding:.95rem 1.1rem; border:2px solid var(--kv-ink); box-shadow:5px 5px 0 var(--kv-ink); text-decoration:none; font:900 .8rem/1.1 Arial,sans-serif; transition:transform .16s,box-shadow .16s; }
.kv__button:hover { transform:translate(3px,3px); box-shadow:2px 2px 0 var(--kv-ink); }
.kv__button--dark { background:var(--kv-ink); color:var(--kv-lime) !important; box-shadow:5px 5px 0 #8caa1f; }
.kv__button--dark:hover { box-shadow:2px 2px 0 #8caa1f; }
.kv__hero-note { margin:2rem 0 0; opacity:.7; }
.kv__hero-art { position:relative; height:330px; overflow:hidden; border-top:3px solid var(--kv-ink); background:var(--kv-orange); }
.kv__art-grid { position:absolute; inset:0; opacity:.35; background-image:linear-gradient(to right,#181b1a 1px,transparent 1px),linear-gradient(to bottom,#181b1a 1px,transparent 1px); background-size:32px 32px; }
.kv__art-circle { position:absolute; left:-13%; top:-52%; width:105vw; height:105vw; max-width:650px; max-height:650px; border:3px solid var(--kv-ink); border-radius:50%; background:var(--kv-lime); display:grid; place-items:center; transform:rotate(-19deg); box-shadow:10px 10px 0 var(--kv-ink); }
.kv__art-circle span { font:900 clamp(6rem,33vw,15rem)/.65 Impact,'Arial Black',sans-serif; letter-spacing:-.08em; text-align:center; }
.kv__art-plug { position:absolute; z-index:1; right:6%; bottom:-13%; width:43%; height:78%; border:4px solid var(--kv-ink); border-radius:44% 44% 0 0; background:var(--kv-paper); transform:rotate(17deg); box-shadow:11px 11px 0 var(--kv-ink); }
.kv__art-plug-face { position:absolute; top:26%; left:12%; right:12%; text-align:center; font:900 clamp(2rem,10vw,5rem)/1 Arial,sans-serif; white-space:nowrap; }
.kv__art-plug-line { position:absolute; left:49%; bottom:-22%; width:4px; height:33%; background:var(--kv-ink); }
.kv__art-label, .kv__art-index { position:absolute; z-index:2; padding:.45rem .55rem; color:#fff; background:var(--kv-ink); font:700 .62rem 'Courier New',monospace; }
.kv__art-label { left:1rem; bottom:1rem; transform:rotate(-5deg); }
.kv__art-index { right:1rem; top:1rem; }
.kv__interlude { display:flex; justify-content:space-between; align-items:center; gap:1rem; min-height:104px; padding:2rem 1rem; background:var(--kv-paper); font:700 .68rem/1.3 'Courier New',monospace; letter-spacing:.06em; }
.kv__ticker { overflow:hidden; border-top:3px solid var(--kv-ink); border-bottom:3px solid var(--kv-ink); background:var(--kv-ink); color:var(--kv-lime); }
.kv__ticker-track { display:flex; width:max-content; animation:kv-ticker 28s linear infinite; }
.kv__ticker:hover .kv__ticker-track { animation-play-state:paused; }
.kv__ticker-track span { flex:none; padding:.75rem 0; white-space:nowrap; font:900 clamp(1.1rem,3vw,1.8rem)/1.2 'Arial Black',Arial,sans-serif; letter-spacing:.04em; }
@keyframes kv-ticker { to { transform:translateX(-50%); } }
.kv__services, .kv__picker, .kv__contact { padding:4.5rem 1rem; }
.kv__section-index { display:block; margin-bottom:1.6rem; }
.kv__section-head h2, .kv__picker h2, .kv__contact h2 { font-size:clamp(2.4rem,10vw,5.4rem); margin:0 0 1.5rem; }
.kv__section-head h2 span, .kv__picker h2 span { color:var(--kv-orange); }
.kv__section-head p { max-width:28rem; font-weight:650; }
.kv__service-grid { display:grid; gap:1.2rem; padding:1rem .35rem .4rem; }
.kv__service-card { position:relative; display:flex; flex-direction:column; min-height:290px; padding:1.15rem; border:3px solid var(--kv-ink); box-shadow:7px 7px 0 var(--kv-ink); transition:transform .2s,box-shadow .2s; }
.kv__service-card:hover { transform:translate(3px,3px) rotate(0deg); box-shadow:4px 4px 0 var(--kv-ink); }
.kv__service-card--one { background:var(--kv-lime); transform:rotate(-1deg); }
.kv__service-card--two { background:#f3f0e8; transform:rotate(1deg); }
.kv__service-card--three { background:var(--kv-orange); transform:rotate(-1.3deg); }
.kv__card-icon { position:absolute; top:.9rem; right:1.1rem; font:900 3.6rem/1 Arial,sans-serif; }
.kv__service-card h3 { font-size:clamp(2rem,7vw,3.3rem); margin:3rem 0 1rem; overflow-wrap:anywhere; }
.kv__service-card p { max-width:16rem; font-weight:650; margin:0 0 1.7rem; }
.kv__service-card a { display:inline-block; width:fit-content; margin-top:auto; border-bottom:2px solid currentColor; padding-bottom:.2rem; text-decoration:none; }
.kv__service-card a:hover { background:var(--kv-ink); color:#fff; }
.kv__picker { background:var(--kv-ink); color:#fff; }
.kv__picker-intro p { max-width:26rem; margin-bottom:2rem; }
.kv__picker h2 span { color:var(--kv-lime); }
.kv__picker-panel { border:3px solid #fff; }
.kv__picker-controls { display:grid; }
.kv__picker-controls button { display:grid; grid-template-columns:auto 1fr auto; gap:1rem; align-items:center; width:100%; padding:1rem; border:0; border-bottom:2px solid #fff; background:var(--kv-ink); color:#fff; text-align:left; cursor:pointer; font:900 1rem/1.1 Arial,sans-serif; transition:background .15s,color .15s; }
.kv__picker-controls button:last-child { border-bottom:0; }
.kv__picker-controls button span { font:700 .7rem 'Courier New',monospace; }
.kv__picker-controls button b { font-size:1.3rem; }
.kv__picker-controls button:hover, .kv__picker-controls button.is-selected { background:var(--kv-lime); color:var(--kv-ink); }
.kv__picker-controls button:focus-visible { outline-offset:-5px; }
.kv__summary { position:relative; min-height:390px; padding:1.3rem; border-top:3px solid #fff; background:var(--kv-lime); color:var(--kv-ink); }
.kv__summary-symbol { position:absolute; top:2rem; right:1rem; font:900 5.5rem/1 Arial,sans-serif; }
.kv__summary h3 { position:relative; max-width:18rem; margin:6rem 0 1.5rem; font-size:clamp(1.75rem,7vw,3.4rem); overflow-wrap:anywhere; }
.kv__summary h3 { white-space:pre-line; }
.kv__summary p { max-width:26rem; font-weight:650; }
.kv__summary--changed h3, .kv__summary--changed p { animation:kv-summary-in .26s ease-out both; }
@keyframes kv-summary-in { from { opacity:.35; transform:translateY(7px); } to { opacity:1; transform:none; } }
.kv__summary-foot { display:block; margin-top:2rem; padding-top:1rem; border-top:2px solid var(--kv-ink); }
.kv__statement { position:relative; padding:4rem 1rem; border-bottom:3px solid var(--kv-ink); background:var(--kv-orange); font:900 clamp(1.8rem,7vw,5.5rem)/1.12 'Arial Black',Arial,sans-serif; letter-spacing:.005em; }
.kv__statement span:first-child, .kv__statement strong { display:block; }
.kv__statement strong { color:var(--kv-paper); -webkit-text-stroke:2px var(--kv-ink); }
.kv__statement-cross { position:absolute; right:1rem; bottom:.5rem; font:900 5rem Arial,sans-serif; transform:rotate(-15deg); }
.kv__contact { background:var(--kv-paper); }
.kv__contact h2 span { color:var(--kv-orange); }
.kv__contact p { max-width:33rem; font-weight:650; line-height:1.55; margin-bottom:2rem; }
.kv__button--lime { background:var(--kv-lime); }
.kv__footer { display:grid; gap:1.5rem; padding:2rem 1rem; background:var(--kv-ink); color:#fff; }
.kv__footer .kv__logo { width:fit-content; }
.kv__footer .kv__logo-mark { background:var(--kv-lime); color:var(--kv-ink); }
.kv__footer p { margin:0; }
.kv__footer>a:last-child { width:fit-content; text-underline-offset:4px; }
@media (min-width:700px) {
  .kv__concept, .kv__header { padding-inline:clamp(1.5rem,4vw,5rem); }
  .kv__header { min-height:100px; }
  .kv__nav { gap:clamp(.5rem,2vw,2rem); font-size:.75rem; }
  .kv__nav a:not(.kv__nav-cta) { display:inline-block; }
  .kv__logo { font-size:1.45rem; }
  .kv__logo-mark { width:2.8rem; height:2.8rem; font-size:2rem; }
  .kv__hero { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); min-height:650px; }
  .kv__hero-copy { display:flex; flex-direction:column; align-items:flex-start; padding:clamp(3rem,5vw,6rem); }
  .kv__hero h1 { font-size:clamp(3.5rem,6.2vw,6.5rem); margin:auto 0 2rem; }
  .kv__interlude { min-height:148px; padding-inline:clamp(1.5rem,5vw,6rem); }
  .kv__hero-note { margin-top:1.5rem; }
  .kv__hero-art { height:auto; min-height:650px; border-top:0; border-left:3px solid var(--kv-ink); }
  .kv__art-circle { width:70vw; height:70vw; left:-36%; top:0; }
  .kv__art-plug { width:45%; height:55%; right:5%; bottom:-8%; }
  .kv__art-plug-face { font-size:clamp(3rem,8vw,6rem); }
  .kv__services, .kv__picker, .kv__contact { padding:clamp(5rem,8vw,9rem) clamp(1.5rem,5vw,6rem); }
  .kv__section-head { display:grid; grid-template-columns:1fr 1.5fr .8fr; gap:2rem; align-items:end; margin-bottom:3.5rem; }
  .kv__section-head h2 { margin-bottom:0; }
  .kv__service-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.4rem; }
  .kv__service-card { min-height:370px; }
  .kv__service-card--two { margin-top:2rem; }
  .kv__service-card--three { margin-top:-.7rem; }
  .kv__picker { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:clamp(2rem,6vw,7rem); }
  .kv__picker h2 { font-size:clamp(2.4rem,3.8vw,4.2rem); }
  .kv__picker-intro { align-self:start; }
  .kv__picker-panel { align-self:start; }
  .kv__summary { min-height:440px; }
  .kv__statement { padding:5rem clamp(1.5rem,5vw,6rem); }
  .kv__contact { display:grid; grid-template-columns:1fr 2fr; gap:3rem; }
  .kv__contact h2 { font-size:clamp(2.4rem,5.5vw,5.4rem); }
  .kv__footer { grid-template-columns:1fr 1fr auto; align-items:end; padding:3rem clamp(1.5rem,5vw,6rem); }
}
@media (min-width:1100px) {
  .kv__picker-panel { display:grid; grid-template-columns:.8fr 1.2fr; }
  .kv__picker-controls button { padding:1.5rem; }
  .kv__picker-controls button:not(:last-child) { border-bottom:2px solid #fff; }
  .kv__summary { border-top:0; border-left:3px solid #fff; }
}
@media (max-width:370px) {
  .kv__hero h1 { font-size:13vw; }
  .kv__eyebrow { font-size:.59rem; }
  .kv__concept { font-size:.53rem; }
  .kv__section-head h2, .kv__picker h2, .kv__contact h2 { font-size:9.2vw; }
}
@media (prefers-reduced-motion:reduce) {
  .kv *, .kv *::before, .kv *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
