/*
Theme Name: Brite kasinot
Version: 202611051355
*/
@font-face{font-family:'Sora';font-weight:400;font-style:normal;font-display:swap;src:url(assets/fonts/sora-400.woff2) format('woff2')}
@font-face{font-family:'Sora';font-weight:600;font-style:normal;font-display:swap;src:url(assets/fonts/sora-600.woff2) format('woff2')}
@font-face{font-family:'Sora';font-weight:700;font-style:normal;font-display:swap;src:url(assets/fonts/sora-700.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-weight:400;font-style:normal;font-display:swap;src:url(assets/fonts/nunito-sans-400.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-weight:700;font-style:normal;font-display:swap;src:url(assets/fonts/nunito-sans-700.woff2) format('woff2')}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-size:18px;line-height:1.65;overflow-wrap:break-word}
img,svg{max-width:100%}
h1,h2,h3{line-height:1.15;margin:0}
ul{padding-left:1.25em}
a{color:inherit}
.ohita{position:absolute;left:-999px;top:0;padding:.6em 1em;background:#fff;color:#000;z-index:9}
.ohita:focus{left:8px;top:8px}
:focus-visible{outline:3px solid currentColor;outline-offset:2px}
.ylin nav ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.2em 1.1em}
.logo{display:inline-flex;align-items:center;gap:.5em;text-decoration:none;font-weight:700}
.taulu{overflow-x:auto;margin:1.5em 0}
table{border-collapse:collapse;width:100%;min-width:480px;font-size:.92em}
caption{text-align:left;font-weight:600;padding-bottom:.5em}
th,td{text-align:left;vertical-align:top;padding:.55em .7em}
summary{cursor:pointer;font-weight:600}
details{padding:.7em 0}
details p:last-child{margin-bottom:0}
.tekija{display:flex;gap:.7em;align-items:center;font-size:.86em;margin:0}
.ini{flex:0 0 2.4em;height:2.4em;border-radius:50%;display:grid;place-items:center;font-weight:700}
.lahteet ul{font-size:.88em}
.lahteet span{opacity:.75}
.lisaa ul{list-style:none;padding:0}
.ei-loydy{padding:4em 1.2em;text-align:center}
.alin{font-size:.86em}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
:root{--syva:#07373f;--teal:#0b4f58;--turkoosi:#1fa8a0;--turkoosi2:#8be6dc;--vesi:#eef8f6;--viiva:#cfe6e2;--muste:#0c2f35;--harmaa:#4d686c;--lampo:#ffa25f;--lampotumma:#a8460c;--aalto:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='10'%3E%3Cpath d='M0 5Q30 1 60 5T120 5' fill='none' stroke='%238fd6cf' stroke-width='1.5'/%3E%3C/svg%3E")}
html{scroll-behavior:smooth}
body{background:#fff;color:var(--muste);font-family:'Nunito Sans',system-ui,sans-serif;font-size:18px;line-height:1.65}
h1,h2,h3,.logo,summary,.nappi,.nappi-hiljainen,.kivi,.tuomio,dt,.tulos strong,.silta text,.linkkikortti b{font-family:Sora,system-ui,sans-serif}
h1{font-size:clamp(2.05rem,4.6vw,3.5rem);font-weight:700;letter-spacing:-.025em;line-height:1.1}
h2{font-size:clamp(1.55rem,3vw,2.2rem);font-weight:700;letter-spacing:-.02em;line-height:1.18;margin-bottom:.7em}
h2.seuraava{font-size:1.3rem;margin-top:2em;margin-bottom:.4em}
h3{font-size:1.1rem;font-weight:600}
a{color:var(--teal);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--lampotumma)}
:focus-visible{outline:3px solid var(--lampotumma);outline-offset:2px}
.ylin :focus-visible,.hero :focus-visible{outline-color:var(--lampo)}

/* header */
.ylin{background:var(--syva);color:#fff;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0 1.6em;padding:.5em max(16px,calc(50% - 600px))}
.ylin a{color:#fff;text-decoration:none}
.logo{min-height:44px;font-weight:600;font-size:1rem}
.merkki{display:inline-block;width:28px;height:14px;font-size:0;border:3px solid var(--lampo);border-bottom:0;border-radius:28px 28px 0 0}
.ylin nav a{display:flex;align-items:center;min-height:44px;font-size:.92rem;border-bottom:2px solid transparent}
.ylin nav a:hover{color:var(--turkoosi2)}

/* hero */
.hero{background:var(--syva);color:#fff;padding-top:clamp(28px,4vw,52px);overflow:hidden}
.hero-teksti{max-width:900px;margin:0 auto;padding:0 16px;text-align:center}
.ingressi{font-size:clamp(1.08rem,1.7vw,1.28rem);line-height:1.5;margin:.8em auto 0;max-width:36em;color:#d9f0ec}
.silta{display:block;width:100%;height:auto;margin-top:6px}
.silta-pieni{display:none}
.ranta{fill:#052a30}
.aaltoviiva{fill:none;stroke:var(--turkoosi2);stroke-width:1.5;opacity:.45;animation:virta 16s linear infinite}
.aaltoviiva.hidas{opacity:.25;animation-duration:26s}
@keyframes virta{to{transform:translateX(var(--p))}}
.kaari{fill:none;stroke:var(--turkoosi2);stroke-linecap:round}
.ripustin{fill:none;stroke:var(--turkoosi2);stroke-width:1.5;opacity:.55}
.kansi{fill:none;stroke:#fff;stroke-linecap:round}
.polku{fill:none;stroke:var(--lampo);stroke-linecap:round}
.kaarinimi rect{fill:var(--turkoosi2)}
.kaarinimi text{fill:var(--syva);font-weight:700}
.rantanimi{fill:#fff;font-weight:600}
[data-piste] circle{fill:var(--syva);stroke:#fff;stroke-width:2}
[data-piste] text{fill:#fff;font-weight:600}
[data-piste].ohi circle{stroke:var(--lampo)}
.merkki-silta circle{fill:var(--lampo);stroke:#fff;stroke-width:2.5}
.merkki-silta rect{fill:var(--lampo)}
.merkki-silta text{fill:var(--syva);font-weight:700}

/* step panel */
.laituri{position:relative;max-width:1080px;margin:-34px auto 0;padding:clamp(20px,3vw,32px) clamp(16px,3vw,40px) 30px;background:#fff;border-radius:32px 32px 0 0}
.ohjain{display:none;gap:14px 24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.js .ohjain{display:flex}
.suunta{display:flex;background:var(--vesi);border-radius:99px;padding:4px}
.suunta button{font:600 .92rem Sora,sans-serif;color:var(--muste);min-height:44px;padding:0 1.05em;border:0;background:none;border-radius:99px;cursor:pointer}
.suunta button[aria-pressed=true]{background:var(--syva);color:#fff}
.vaiheet{display:flex;gap:4px;flex:1 1 auto;justify-content:center}
.vaiheet button{display:flex;align-items:center;gap:.4em;min-height:44px;min-width:44px;padding:0 .35em;border:0;background:none;color:var(--harmaa);cursor:pointer;font:400 .86rem 'Nunito Sans',sans-serif;border-radius:99px}
.vaiheet .nro{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1.5px solid var(--viiva);font:600 .8rem Sora,sans-serif}
.vaiheet button:not([aria-current]) .nimi{display:none}
.vaiheet [aria-current] {color:var(--muste);font-weight:700}
.vaiheet [aria-current] .nro{background:var(--lampo);border-color:var(--lampo);color:var(--syva)}
.askel-napit{display:flex;gap:8px;align-items:center}
.nappi{font-weight:600;font-size:1rem;color:var(--syva);background:var(--lampo);border:0;border-radius:99px;min-height:50px;padding:0 1.5em;cursor:pointer;min-width:11em;transition:background .15s}
.nappi:hover{background:#ffb47f}
.nappi-hiljainen{font-weight:600;font-size:.88rem;color:var(--muste);background:none;border:0;min-height:44px;padding:0 .7em;cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.nappi-hiljainen:disabled{opacity:.35;cursor:default}
.reitti-nimi{font-size:1rem;font-weight:600;color:var(--harmaa);letter-spacing:0;margin:1.3em 0 0}
.js .reitti-nimi{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.pysakit{list-style:none;padding:0;margin:.8em 0 0}
.pysakit>li+li{margin-top:1.6em}
.js .pysakit>li+li{margin-top:0}
.pysakit h3{font-size:clamp(1.25rem,2.2vw,1.6rem);font-weight:700;letter-spacing:-.015em;margin:.3em 0 .7em}
.kolmikko{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 28px}
.kolmikko li{padding-top:.6em;background:var(--aalto) top left/120px 10px repeat-x;font-size:1rem;line-height:1.5;min-height:6.4em}
.kolmikko b{display:block;font:600 .8rem Sora,sans-serif;color:var(--lampotumma);margin:.35em 0 .15em}
[hidden]{display:none!important}

/* notice */
.ilmoitus{max-width:760px;margin:30px auto 0;padding:22px 26px;background:var(--vesi);border-radius:28px;font-size:.94rem;line-height:1.55}
.laituri+.ilmoitus{margin-top:6px}
.ilm-otsikko{font:700 1.02rem Sora,sans-serif;margin:0 0 .5em}
.ilm-luvut{list-style:none;padding:0;margin:0 0 .7em;display:flex;flex-wrap:wrap;gap:.1em 1.4em;font-size:.9rem;color:var(--harmaa)}
.ilm-luvut b{color:var(--muste);font-family:Sora,sans-serif}
.ilmoitus p:last-child{margin:0}
main>.ilmoitus{width:calc(100% - 32px)}

/* in-page links */
.pikalinkit{display:flex;flex-wrap:wrap;justify-content:center;gap:0 1.3em;max-width:900px;margin:22px auto 0;padding:0 16px;font-size:.92rem}
.pikalinkit a{display:inline-flex;align-items:center;min-height:44px}

/* sections */
.osio{max-width:760px;margin:0 auto;padding:clamp(44px,6vw,72px) 16px 0;scroll-margin-top:8px}
.osio.leveä{max-width:1040px}
.osio p{margin:0 0 1em}
.suuri{font-size:clamp(1.15rem,1.9vw,1.36rem);line-height:1.5;letter-spacing:-.005em}
.johdanto{color:var(--harmaa);margin-top:-.4em!important}
.pienet{font-size:.84rem;color:var(--harmaa)}
.kaksi-saraketta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 40px;margin:1.6em 0}
.kaksi-saraketta dt,.vertailu dt,.yhtiokortti dt{font-weight:600;font-size:.84rem;color:var(--lampotumma)}
.kaksi-saraketta dt{padding-top:.8em;background:var(--aalto) top left/120px 10px repeat-x;margin-bottom:.4em}
.kaksi-saraketta dd{margin:0 0 .35em}

/* tap-to-open list */
.kivet{display:grid;gap:8px;margin-top:1.4em}
.js .kivet{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:8px 44px;align-items:start}
.kivi{grid-column:1;display:block;width:100%;text-align:left;font-weight:600;font-size:.98rem;line-height:1.3;color:var(--muste);background:#fff;border:1.5px solid var(--viiva);border-radius:99px;padding:.8em 1.3em;min-height:52px;cursor:pointer;transition:border-color .15s,background .15s}
.kivi:hover{border-color:var(--turkoosi)}
.kivi[aria-expanded=true]{background:var(--syva);border-color:var(--syva);color:#fff}
.vastaus{padding:.4em 0 1em}
.js .vastaus{grid-column:2;grid-row:1/span 6;padding:0 0 0 0}
.vastaus p:last-child{margin-bottom:0}
.vastaus b{font-family:Sora,sans-serif;font-weight:600;font-size:.92rem}
.tuomio{font-weight:700;font-size:clamp(1.3rem,2.4vw,1.75rem);letter-spacing:-.015em;line-height:1.2;margin:0 0 .55em!important}
.tuomio.ei{color:var(--lampotumma)}.tuomio.on{color:#0a6f69}.tuomio.osin{color:var(--teal)}

/* statement */
.tiliote-rivi{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px 48px;margin-top:1.4em;align-items:start}
.tiliote{border:1.5px solid var(--viiva);border-radius:28px;padding:22px 26px 14px}
.tiliote-otsikko{font:600 .84rem Sora,sans-serif;color:var(--harmaa);margin:0 0 .5em!important}
.rivi{display:grid;grid-template-columns:3em minmax(0,1fr) auto;gap:.6em;align-items:center;padding:.55em 0;border-top:1px solid var(--viiva);font-size:.96rem;font-variant-numeric:tabular-nums}
.pv{color:var(--harmaa)}.summa{text-align:right}
.merkinta{font:600 .9rem 'Nunito Sans',sans-serif;letter-spacing:.02em;color:var(--muste);background:none;border:0;border-bottom:2px dotted var(--turkoosi);border-radius:0;min-height:44px;padding:0 .3em;cursor:pointer}
.merkinta[aria-pressed=true]{background:var(--lampo);color:var(--syva);border-bottom-color:var(--lampo);border-radius:8px}
.tiliote .pienet{margin:.5em 0 .3em!important}
.selitteet>div{padding:.7em 0 .7em 16px;border-left:3px solid var(--viiva);margin-bottom:.8em;transition:border-color .15s}
.selitteet>div.nyt{border-left-color:var(--lampo)}
.selitteet h3{margin-bottom:.3em}
.selitteet p{margin:0;font-size:1rem}

/* waterline list */
.vesilinja{list-style:none;padding:0;margin:1.2em 0 0}
.vesilinja li{padding:.9em 0 .9em 0;background:var(--aalto) top left/120px 10px repeat-x}
.vesilinja b{font-family:Sora,sans-serif;font-weight:600;font-size:.98rem}

/* numbered steps */
.askeleet{list-style:none;counter-reset:a;padding:0;margin:1.2em 0 1.4em}
.askeleet li{counter-increment:a;position:relative;padding:.5em 0 .5em 3.2em;min-height:2.8em}
.askeleet li::before{content:counter(a);position:absolute;left:0;top:.4em;width:2.1em;height:2.1em;border-radius:50%;background:var(--vesi);display:grid;place-items:center;font:600 .92rem Sora,sans-serif;color:var(--teal)}

/* sub hero */
.sivuhero{background:var(--syva);color:#fff;text-align:center;padding:clamp(30px,4.5vw,56px) 16px clamp(34px,5vw,60px)}
.pikkukaari{display:block;width:min(300px,62%);height:auto;margin:0 auto 18px;fill:none;stroke:var(--turkoosi2);stroke-width:4;stroke-linecap:round}
.pikkukaari path+path{stroke:var(--lampo)}
.sivuhero+.ilmoitus{margin-top:32px}

/* company card */
.yhtiokortti{margin:0}
.yhtiokortti>div{display:grid;grid-template-columns:minmax(0,13em) minmax(0,1fr);gap:.2em 1em;padding:.7em 0;border-top:1px solid var(--viiva)}
.yhtiokortti>div:first-child{border-top:0}
.yhtiokortti dd{margin:0;font-weight:700}
.yhtiokortti dt{align-self:center}
.fakta{margin-top:1.8em}

/* block calculator */
.kesto{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:10px}
.kesto legend{padding:0;margin-bottom:.6em;color:var(--harmaa)}
.kesto label{cursor:pointer}
.kesto input{position:absolute;opacity:0;width:1px;height:1px}
.kesto span{display:grid;place-items:center;min-height:52px;min-width:5.6em;padding:0 1.2em;border:1.5px solid var(--viiva);border-radius:99px;font:600 1.02rem Sora,sans-serif;transition:background .15s}
.kesto label:hover span{border-color:var(--turkoosi)}
.kesto input:checked+span{background:var(--syva);border-color:var(--syva);color:#fff}
.kesto input:focus-visible+span{outline:3px solid var(--lampotumma);outline-offset:2px}
.tulos{margin:1.5em 0 .7em}
.tulos-rivi{margin:0 0 .9em!important}
.tulos strong{display:block;font-size:clamp(2.4rem,7vw,3.8rem);font-weight:700;letter-spacing:-.03em;line-height:1.1;margin-bottom:.15em}
.tulos span{color:var(--harmaa)}
.mitta{height:6px;background:var(--vesi);border-radius:99px;overflow:hidden}
.mitta span{display:block;height:100%;width:0;background:var(--lampo);border-radius:99px;transition:width .35s}

/* comparison */
.vertailu{margin:1.2em 0 0}
.vertailu>div{padding:.9em 0 .9em;background:var(--aalto) top left/120px 10px repeat-x}
.vertailu dd{margin:.15em 0 0}

/* faq */
.ukk details{border-top:1px solid var(--viiva);padding:0}
.fakta details{border-top:1px solid var(--viiva);padding:0}
.ukk details:last-of-type,.fakta details:last-of-type{border-bottom:1px solid var(--viiva)}
summary{font-weight:600;font-size:1rem;line-height:1.35;padding:.85em 2em .85em 0;min-height:44px;list-style:none;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:.2em;top:.7em;font-size:1.25em;line-height:1;color:var(--teal)}
details[open]>summary::after{content:"\2013"}
details p{margin:0 0 1em!important}

/* ending */
.jatka{padding-bottom:clamp(44px,6vw,72px)}
.linkkikortit{display:grid;gap:0}
.linkkikortti{display:block;padding:.8em 0;border-top:1px solid var(--viiva);text-decoration:none;color:var(--muste)}
.linkkikortti:last-child{border-bottom:1px solid var(--viiva)}
.linkkikortti b{display:block;font-weight:600}
.linkkikortti span{font-size:.94rem;color:var(--harmaa)}
.linkkikortti:hover b{color:var(--lampotumma)}
.tekija{margin-top:1.8em!important;color:var(--harmaa)}
.ini{background:var(--vesi);color:var(--teal);font-size:.85em}
.lahteet{margin-top:1.2em;padding:0}
.lahteet summary{font-size:.92rem}
.lahteet ul{padding-left:1.1em;line-height:1.5}
.lahteet li{margin-bottom:.4em;overflow-wrap:anywhere}

/* footer */
.alin{background:var(--syva);color:#d9f0ec;padding:32px max(16px,calc(50% - 600px));margin-top:clamp(30px,5vw,60px)}
.alin p{margin:.3em 0}
.alin a{color:#fff}
.alin a{display:inline-flex;align-items:center;min-height:44px}
.ei-loydy h1{margin-bottom:.4em}

@media (max-width:820px){
  .js .kivet{grid-template-columns:minmax(0,1fr)}
  .kivi{grid-column:1}
  .js .vastaus{grid-column:1;grid-row:auto;padding:.7em 0 1.1em}
  .kivi{border-radius:26px}
  .tiliote-rivi{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  body{font-size:17px}
  .ylin{padding:.3em 16px}
  .ylin nav{width:100%}
  .ylin nav ul{justify-content:space-between;gap:0 .4em}
  .ylin nav a{font-size:.84rem}
  .silta-iso{display:none}.silta-pieni{display:block}
  .laituri{margin-top:-18px;border-radius:24px 24px 0 0}
  .ohjain{gap:10px}
  .suunta{width:100%}.suunta button{flex:1;min-height:44px}
  .vaiheet{justify-content:space-between;order:2;width:100%}
  .vaiheet .nimi{display:none}
  .askel-napit{order:3;width:100%}
  .nappi{flex:1;min-width:0}
  .kolmikko{grid-template-columns:minmax(0,1fr);gap:.2em}
  .kolmikko li{min-height:0;padding-bottom:.5em}
  .kaksi-saraketta{grid-template-columns:minmax(0,1fr);gap:14px}
  .yhtiokortti>div{grid-template-columns:minmax(0,1fr)}
  .ilmoitus{padding:18px 20px;border-radius:22px}
  .pikalinkit{justify-content:flex-start;gap:0 1em}
  .tiliote{padding:16px 16px 10px;border-radius:22px}
  .rivi{grid-template-columns:2.6em minmax(0,1fr) auto;gap:.4em}
  .merkinta{font-size:.84rem;padding:0 .15em}
}
