/* =====================================================================
   UUSI ULKOASU – Masjid Sunnah Helsinki / Suomen moskeijat -pohja
   Mobiili ensin. Värit tulevat moskeijan teemasta (_layouts/uusi.html).
   ===================================================================== */

/* ---------- 1. Värit ja mitat ---------- */
:root {
  --paa: #3f2717;
  --paa-tumma: #2b1a0e;
  --kulta: #debb86;
  --kulta-vaalea: #faf1df;
  --tausta: #faf9f5;
  --pinta: #ffffff;
  --raja: #ebe3da;
  --hieno: #796456;
  --teksti: var(--paa-tumma);
  /* Kultainen teksti vaalealla pohjalla: tummennettu, jotta kontrasti riittää (≥ 4.5:1) */
  --kulta-teksti: color-mix(in srgb, var(--kulta) 45%, var(--paa));
  --kulta-heikko: color-mix(in srgb, var(--kulta) 30%, var(--pinta));
  --varjo-1: 0 1px 2px rgb(43 26 14 / .05), 0 8px 24px -12px rgb(43 26 14 / .16);
  --varjo-2: 0 2px 6px rgb(43 26 14 / .06), 0 28px 56px -24px rgb(43 26 14 / .35);
  --r-s: 12px;
  --r-m: 18px;
  --r-l: 26px;
  --fo: var(--fontti-otsikot, "Sora", system-ui, sans-serif);
  --ft: var(--fontti-teksti, "Manrope", system-ui, sans-serif);
  --kehys: 1160px;
  --yla: 64px;
  color-scheme: light;
}
@media (min-width: 1024px) { :root { --yla: 76px; } }

/* ---------- 2. Perusta ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--yla) + 16px); }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
body {
  margin: 0; background: var(--tausta); color: var(--teksti);
  font: 400 16px/1.65 var(--ft); -webkit-font-smoothing: antialiased; overflow-x: clip;
}
html[lang="ar"] body { font-size: 17px; line-height: 1.85; }
img, svg { max-width: 100%; }
img { height: auto; display: block; }
a { color: inherit; }
p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
h1, h2, h3 { margin: 0; font-family: var(--fo); font-weight: 700; color: var(--paa); line-height: 1.15; letter-spacing: -.02em; text-wrap: balance; }
html[lang="ar"] :is(h1, h2, h3) { letter-spacing: 0; line-height: 1.4; }
h2 { font-size: clamp(22px, 4.2vw, 30px); }
h3 { font-size: 18px; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--kulta); outline-offset: 2px; border-radius: var(--kulma, 6px); }

/* Kielet: sivulla on tekstit kaikilla kielillä, näytetään valittu */
html[lang="fi"] [data-l]:not([data-l="fi"]),
html[lang="en"] [data-l]:not([data-l="en"]),
html[lang="ar"] [data-l]:not([data-l="ar"]),
html[lang="so"] [data-l]:not([data-l="so"]) { display: none !important; }

.u-nakymaton { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.u-ohita { position: absolute; inset-inline-start: 12px; top: -60px; z-index: 100; padding: 10px 16px; border-radius: var(--kulma, 10px); background: var(--paa); color: #fff; }
.u-ohita:focus { top: 12px; }
.u-kehys { width: min(100% - 32px, var(--kehys)); margin-inline: auto; }
@media (min-width: 768px) { .u-kehys { width: min(100% - 64px, var(--kehys)); } }
.u-hieno { color: var(--hieno); font-size: 15px; }
html[dir="rtl"] .u-flip { display: inline-block; transform: scaleX(-1); }

/* Islamilainen tähtikuvio (väri teemasta, maskina) */
.u-kuvio {
  position: absolute; inset: 0; pointer-events: none; background: var(--kulta); opacity: .12;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23000' stroke-width='1'%3E%3Cpath d='M28 6l6.4 15.6L50 28l-15.6 6.4L28 50l-6.4-15.6L6 28l15.6-6.4z'/%3E%3Cpath d='M12.4 12.4h31.2v31.2H12.4z'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 56px 56px repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23000' stroke-width='1'%3E%3Cpath d='M28 6l6.4 15.6L50 28l-15.6 6.4L28 50l-6.4-15.6L6 28l15.6-6.4z'/%3E%3Cpath d='M12.4 12.4h31.2v31.2H12.4z'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 56px 56px repeat;
}

/* ---------- 3. Napit ja linkit ---------- */
.u-nappi {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 12px 22px; border-radius: var(--kulma, 999px); border: 1.5px solid transparent;
  font: 700 15px/1.2 var(--ft); text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: transform .15s, background-color .15s, border-color .15s, box-shadow .15s;
}
.u-nappi:active { transform: translateY(1px); }
.u-nappi svg { flex: none; }
.u-nappi--kulta { background: var(--kulta); color: var(--paa-tumma); box-shadow: 0 8px 20px -10px color-mix(in srgb, var(--kulta) 80%, var(--paa)); }
.u-nappi--kulta:hover { background: color-mix(in srgb, var(--kulta) 88%, var(--paa)); }
.u-nappi--tumma { background: var(--paa); color: #fff; }
.u-nappi--tumma:hover { background: var(--paa-tumma); }
.u-nappi--reuna { background: var(--pinta); color: var(--paa); border-color: var(--raja); }
.u-nappi--reuna:hover { border-color: var(--kulta); background: var(--kulta-vaalea); }
.u-nappi--haamu { background: transparent; color: #fff; border-color: rgb(255 255 255 / .35); }
.u-nappi--haamu:hover { background: rgb(255 255 255 / .08); border-color: rgb(255 255 255 / .7); }
.u-nappi--wa { background: #25d366; color: #063d1f; }
.u-nappi--wa:hover { background: #1fbd5a; }
.u-nappi--pieni { min-height: 40px; padding: 8px 16px; font-size: 14px; }
.u-nappi--levea { width: 100%; }
.u-napit { display: flex; flex-wrap: wrap; gap: 10px; }
.u-napit--pino { flex-direction: column; }
.u-napit--pino .u-nappi { width: 100%; }
.u-linkki { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 700; color: var(--kulta-teksti); text-decoration: none; }
.u-linkki:hover { text-decoration: underline; text-underline-offset: 4px; }

.u-eyebrow { display: inline-flex; align-items: center; gap: 10px; font: 700 13px/1.2 var(--ft); letter-spacing: .14em; text-transform: uppercase; color: var(--kulta-teksti); }
.u-eyebrow::before { content: ""; width: 7px; height: 7px; flex: none; background: currentColor; transform: rotate(45deg); }
.u-eyebrow--vaalea { color: var(--kulta); }
html[lang="ar"] .u-eyebrow { letter-spacing: 0; font-size: 14px; }

.u-ikoni { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: var(--kulma, 14px); background: var(--kulta-vaalea); color: var(--kulta-teksti); }
.u-ikoni--pieni { width: 40px; height: 40px; border-radius: var(--kulma, 12px); }
.u-ikoni--iso { width: 64px; height: 64px; border-radius: var(--kulma, 20px); }

.u-kortti { background: var(--pinta); border: 1px solid var(--raja); border-radius: var(--r-l); box-shadow: var(--varjo-1); }

/* ---------- 4. Yläpalkki ---------- */
.u-yla {
  position: sticky; top: 0; z-index: 50;
  background: color-mix(in srgb, var(--pinta) 92%, transparent);
  -webkit-backdrop-filter: saturate(1.5) blur(14px); backdrop-filter: saturate(1.5) blur(14px);
  border-bottom: 1px solid transparent; transition: border-color .2s, box-shadow .2s;
}
.u-yla--varjo { border-bottom-color: var(--raja); box-shadow: 0 10px 24px -20px rgb(43 26 14 / var(--yla-varjo, .5)); }
.u-yla__sisalto { display: flex; align-items: center; gap: 10px; height: var(--yla); }
.u-logo { display: flex; flex: none; margin-inline-end: auto; }
.u-logo img { width: auto; height: 42px; }
@media (min-width: 1024px) { .u-logo img { height: 52px; } }
.u-nav { display: none; }
@media (min-width: 1024px) {
  .u-nav { display: flex; gap: 2px; margin-inline-end: 6px; }
  .u-nav a { padding: 10px 13px; border-radius: var(--kulma, 999px); font: 600 15px/1 var(--ft); color: var(--paa); text-decoration: none; }
  .u-nav a:hover { background: var(--kulta-vaalea); }
  .u-nav a[aria-current="page"] { background: var(--kulta-vaalea); box-shadow: inset 0 -2px 0 var(--kulta); }
}
.u-yla__lahjoita { display: none !important; }
@media (min-width: 1024px) { .u-yla__lahjoita { display: inline-flex !important; } }

.u-kieli { position: relative; }
.u-kieli__nappi {
  display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 14px;
  border-radius: var(--kulma, 999px); border: 1px solid var(--raja); background: var(--pinta); color: var(--paa);
  font: 700 14px/1 var(--ft); cursor: pointer;
}
.u-kieli__nappi:hover { border-color: var(--kulta); }
.u-kieli__lista {
  position: absolute; inset-inline-end: 0; top: calc(100% + 8px); z-index: 60; min-width: 190px; padding: 6px;
  background: var(--pinta); border: 1px solid var(--raja); border-radius: var(--r-m); box-shadow: var(--varjo-2);
}
.u-kieli__lista button {
  display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; min-height: 46px; padding: 0 14px;
  border: 0; border-radius: var(--kulma, 12px); background: none; color: var(--paa); font: 600 15px/1 var(--ft); text-align: start; cursor: pointer;
}
.u-kieli__lista button[lang="ar"] { font-family: system-ui, "Segoe UI", Tahoma, sans-serif; font-size: 16px; }
.u-kieli__lista button:hover { background: var(--kulta-vaalea); }
.u-kieli__lista button[aria-checked="true"]::after { content: "✓"; color: var(--kulta-teksti); font-weight: 800; }

.u-valikkonappi { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--kulma, 12px); border: 1px solid var(--raja); background: var(--pinta); color: var(--paa); cursor: pointer; }
.u-valikkonappi__kiinni, .u-valikkonappi[aria-expanded="true"] .u-valikkonappi__auki { display: none; }
.u-valikkonappi[aria-expanded="true"] .u-valikkonappi__kiinni { display: block; }
@media (min-width: 1024px) { .u-valikkonappi, .u-mobiilivalikko { display: none !important; } }
.u-mobiilivalikko { max-height: calc(100dvh - var(--yla)); overflow-y: auto; border-top: 1px solid var(--raja); background: var(--pinta); padding: 4px 0 20px; box-shadow: 0 24px 40px -24px rgb(43 26 14 / .4); }
.u-mv-linkki { display: flex; align-items: center; justify-content: space-between; min-height: 56px; border-bottom: 1px solid var(--raja); font: 600 17px/1.2 var(--fo); color: var(--paa); text-decoration: none; }
.u-mv-linkki[aria-current="page"] { color: var(--kulta-teksti); }
.u-mv-linkki .u-nuoli { font-size: 24px; color: var(--hieno); }
html[dir="rtl"] .u-mv-linkki .u-nuoli { transform: scaleX(-1); }
.u-mv-napit { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 18px; }
.u-mv-napit .u-nappi--kulta { grid-column: 1 / -1; }

/* ---------- 5. Etusivun alkuosa ---------- */
.u-hero { position: relative; isolation: isolate; color: #fff; padding: 28px 0 0; }
.u-hero__tausta { position: absolute; inset: 0; z-index: -1; overflow: hidden; background: var(--paa-tumma); }
.u-hero__tausta::after { content: ""; position: absolute; width: 90vmax; height: 90vmax; inset-inline-end: -40vmax; top: -50vmax; background: radial-gradient(closest-side, color-mix(in srgb, var(--kulta) 30%, transparent), transparent); }
.u-hero__kaari { position: absolute; width: 230px; height: 345px; inset-inline-end: -110px; top: -30px; color: var(--kulta); opacity: .14; }
.u-hero__sisalto { display: grid; gap: 24px; }
.u-hero__sisalto > * { min-width: 0; }
.u-hero h1 { color: #fff; font-size: clamp(30px, 7.6vw, 56px); margin: 14px 0 12px; }
.u-hero__esittely { color: rgb(255 255 255 / .8); font-size: clamp(16px, 2vw, 19px); max-width: 34em; }
.u-hero__napit { display: none; gap: 12px; flex-wrap: wrap; margin-top: 30px; }
.u-hero__rukous { position: relative; margin-bottom: -64px; }
.u-osio--hero-jalkeen { padding-top: 104px !important; }
@media (min-width: 1024px) {
  .u-hero { padding: 64px 0 72px; }
  .u-hero__sisalto { grid-template-columns: 1.05fr .95fr; align-items: center; gap: 64px; }
  .u-hero__napit { display: flex; }
  .u-hero__rukous { margin-bottom: 0; }
  .u-hero__kaari { width: 560px; height: 840px; inset-inline-end: 6%; top: -40px; opacity: .2; }
  .u-osio--hero-jalkeen { padding-top: 72px !important; }
}

/* ---------- 6. Rukousajat (päivä) ---------- */
.rk { overflow: hidden; background: var(--pinta); color: var(--teksti); border-radius: var(--r-l); box-shadow: var(--varjo-2); }
.rk__seuraava {
  display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 2px 16px; padding: 18px 20px 16px;
  background: linear-gradient(135deg, var(--kulta-vaalea), color-mix(in srgb, var(--kulta-vaalea) 40%, var(--pinta)));
}
.rk__eyebrow { grid-column: 1 / -1; font: 700 13px/1.2 var(--ft); letter-spacing: .12em; text-transform: uppercase; color: var(--kulta-teksti); }
html[lang="ar"] .rk__eyebrow { letter-spacing: 0; font-size: 14px; }
.rk__nimi { font: 700 28px/1.15 var(--fo); color: var(--paa); margin-top: 6px; }
.rk__klo { font: 600 16px/1 var(--ft); color: var(--hieno); white-space: nowrap; }
.rk__laskuri { text-align: end; }
.rk__aika { display: block; font: 700 26px/1 var(--fo); font-variant-numeric: tabular-nums; letter-spacing: .02em; color: var(--paa); }
.rk__laskuri small { display: block; margin-top: 4px; font-size: 13px; color: var(--hieno); }
.rk__palkki { grid-column: 1 / -1; height: 6px; margin-top: 14px; border-radius: var(--kulma, 999px); overflow: hidden; background: color-mix(in srgb, var(--kulta) 28%, var(--pinta)); }
.rk__palkki span { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--kulta), color-mix(in srgb, var(--kulta) 55%, var(--paa))); transition: width .8s ease; }
html[dir="rtl"] .rk__palkki span { background: linear-gradient(-90deg, var(--kulta), color-mix(in srgb, var(--kulta) 55%, var(--paa))); }
.rk__taulu { width: 100%; border-collapse: collapse; table-layout: fixed; font-variant-numeric: tabular-nums; }
.rk__taulu thead th:nth-child(2), .rk__taulu thead th:nth-child(3) { width: 82px; }
@media (min-width: 420px) { .rk__taulu thead th:nth-child(2), .rk__taulu thead th:nth-child(3) { width: 96px; } }
.rk__taulu thead th { padding-block: 14px 8px; padding-inline: 4px 16px; font: 700 13px/1 var(--ft); letter-spacing: .06em; text-transform: uppercase; color: var(--hieno); text-align: end; }
.rk__taulu thead th:first-child { padding-inline-start: 16px; text-align: start; text-transform: none; letter-spacing: 0; font-weight: 600; }
html[lang="ar"] .rk__taulu thead th { letter-spacing: 0; }
.rk__taulu tbody tr { border-top: 1px solid var(--raja); }
.rk__taulu tbody th { padding-block: 12px; padding-inline: 12px 8px; text-align: start; overflow-wrap: anywhere; font: 700 16px/1.2 var(--ft); color: var(--paa); border-inline-start: 4px solid transparent; }
.rk__taulu td { padding-block: 12px; padding-inline: 4px 16px; text-align: end; font: 700 18px/1 var(--fo); color: var(--paa); }
.rk__taulu td + td { font: 500 15px/1 var(--ft); color: var(--hieno); }
.rk__ar { display: inline-block; margin-inline-start: 8px; font: 500 14px/1 "Geeza Pro", "Noto Naskh Arabic", "Segoe UI", Tahoma, sans-serif; color: var(--hieno); }
html[lang="ar"] .rk__ar { display: none; }
.rk__rivi--muu th, .rk__rivi--muu td { color: var(--hieno) !important; font-weight: 500 !important; }
.rk__rivi--muu td { font-size: 16px !important; }
.rk__rivi--seuraava { background: var(--kulta-vaalea); }
.rk__rivi--seuraava th { border-inline-start-color: var(--kulta); }
.rk__ala { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; min-height: 52px; padding: 4px 20px 6px; border-top: 1px solid var(--raja); font-size: 14px; color: var(--hieno); }

/* ---------- 7. Kuukauden rukousajat ---------- */
.kk { overflow: hidden; background: var(--pinta); border: 1px solid var(--raja); border-radius: var(--r-l); box-shadow: var(--varjo-1); }
.kk__yla { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px; border-bottom: 1px solid var(--raja); }
.kk__nimi { font-size: 18px; text-align: center; }
.kk__nimi::first-letter { text-transform: uppercase; }
.kk__siirto { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--raja); background: var(--pinta); color: var(--paa); cursor: pointer; }
.kk__siirto:hover { border-color: var(--kulta); background: var(--kulta-vaalea); }
.kk__kaari { overflow-x: auto; }
.kk__taulu { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: 14px; }
.kk__taulu th, .kk__taulu td { padding: 9px 4px; text-align: center; white-space: nowrap; }
.kk__taulu thead th { position: sticky; top: 0; background: var(--pinta); font: 700 12.5px/1.2 var(--ft); color: var(--hieno); border-bottom: 1px solid var(--raja); }
.kk__taulu tbody th { padding-inline-start: 14px; text-align: start; font-weight: 600; color: var(--paa); }
.kk__taulu tbody th small { display: inline-block; min-width: 2.2em; color: var(--hieno); font-weight: 500; }
.kk__taulu tbody tr:nth-child(even) { background: color-mix(in srgb, var(--tausta) 70%, var(--pinta)); }
.kk__taulu td:last-child { padding-inline-end: 14px; }
.kk__taulu .kk__nousu { color: var(--hieno); }
.kk__taulu tr.kk__pe th small { color: var(--kulta-teksti); font-weight: 800; }
.kk__taulu tr.kk__tanaan { background: var(--kulta-vaalea) !important; box-shadow: inset 4px 0 0 var(--kulta); font-weight: 800; }
html[dir="rtl"] .kk__taulu tr.kk__tanaan { box-shadow: inset -4px 0 0 var(--kulta); }
@media (max-width: 370px) { .kk__taulu { font-size: 13px; } .kk__taulu th, .kk__taulu td { padding-inline: 2px; } }
.kk__ala { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px; padding: 12px 16px; border-top: 1px solid var(--raja); }

/* ---------- 8. Osiot ---------- */
.u-osio { padding-block: 56px 0; }
@media (min-width: 1024px) { .u-osio { padding-top: 88px; } }
.u-osio__yla { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-bottom: 20px; }
.u-proosa { color: color-mix(in srgb, var(--teksti) 85%, var(--hieno)); }
.u-proosa :where(p, ul, ol, h3, blockquote) + :where(p, ul, ol, h3, blockquote) { margin-top: 1em; }
.u-proosa--iso { font-size: 17px; }
.u-proosa h3 { margin-top: 1.6em; }
.u-proosa ul li { position: relative; padding-inline-start: 28px; }
.u-proosa ul li + li { margin-top: 8px; }
.u-proosa ul li::before { content: ""; position: absolute; inset-inline-start: 4px; top: .62em; width: 8px; height: 8px; background: var(--kulta); transform: rotate(45deg); }

/* Toimintamme */
.u-toiminta { display: grid; gap: 12px; }
.u-toiminta__kohta { display: flex; align-items: center; gap: 14px; height: 100%; padding: 16px; background: var(--pinta); border: 1px solid var(--raja); border-radius: var(--r-m); text-decoration: none; transition: border-color .15s, box-shadow .15s, transform .15s; }
.u-toiminta__kohta:hover { border-color: var(--kulta); box-shadow: var(--varjo-1); transform: translateY(-2px); }
.u-toiminta__teksti { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.u-toiminta__teksti strong { font: 700 16px/1.3 var(--fo); color: var(--paa); }
.u-toiminta__teksti > span { font-size: 14.5px; line-height: 1.45; color: var(--hieno); }
.u-toiminta__nuoli { color: var(--kulta-teksti); font-weight: 800; }
@media (min-width: 720px) { .u-toiminta { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1080px) {
  .u-toiminta { grid-template-columns: repeat(4, 1fr); gap: 16px; }
  .u-toiminta__kohta { flex-direction: column; align-items: flex-start; padding: 24px; }
  .u-toiminta__nuoli { margin-top: auto; }
}

/* Nosto (lasten opetus) */
.u-nosto { position: relative; display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 14px 16px; margin-top: 40px; padding: 24px; border-radius: var(--r-l); background: var(--kulta-vaalea); border: 1px solid color-mix(in srgb, var(--kulta) 45%, transparent); }
.u-nosto__ikoni { display: grid; place-items: center; width: 56px; height: 56px; border-radius: var(--kulma, 18px); background: var(--pinta); color: var(--kulta-teksti); box-shadow: var(--varjo-1); }
.u-nosto h2 { font-size: clamp(21px, 3.6vw, 26px); margin: 8px 0 6px; }
.u-nosto p:not(.u-eyebrow) { color: var(--hieno); }
.u-nosto .u-nappi { grid-column: 1 / -1; justify-self: start; }
.u-nosto__ikoni { width: 48px; height: 48px; border-radius: var(--kulma, 14px); }
@media (min-width: 820px) { .u-nosto { grid-template-columns: auto 1fr auto; align-items: center; gap: 24px; padding: 28px 32px; } .u-nosto .u-nappi { grid-column: auto; } .u-nosto__ikoni { width: 56px; height: 56px; border-radius: var(--kulma, 18px); } }

/* Meistä (etusivu) */
.u-meista { display: grid; gap: 28px; }
.u-meista__teksti h2 { margin-bottom: 14px; }
.u-meista__teksti .u-linkki { margin-top: 8px; }
.u-meista__kielet { align-self: start; padding: 22px; border-radius: var(--r-l); background: var(--pinta); border: 1px solid var(--raja); }
.u-sirut { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.u-sirut li { padding: 8px 14px; border-radius: var(--kulma, 999px); background: var(--kulta-vaalea); color: var(--paa); font-weight: 700; font-size: 14px; }
@media (min-width: 900px) { .u-meista { grid-template-columns: 1.6fr 1fr; gap: 56px; align-items: center; } }

/* Tapahtumat */
.u-tapahtumat { display: grid; gap: 10px; }
.u-tapahtuma a { display: flex; align-items: center; gap: 16px; padding: 14px; background: var(--pinta); border: 1px solid var(--raja); border-radius: var(--r-m); text-decoration: none; }
.u-tapahtuma a:hover { border-color: var(--kulta); }
.u-tapahtuma__pvm { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 60px; height: 60px; flex: none; border-radius: var(--kulma, 14px); background: var(--paa); color: #fff; line-height: 1; }
.u-tapahtuma__pvm b { font: 700 22px/1 var(--fo); }
.u-tapahtuma__pvm small { font-size: 12.5px; opacity: .8; margin-top: 4px; }
.u-tapahtuma__tiedot { display: flex; flex-direction: column; gap: 4px; }
.u-tapahtuma__tiedot strong { font: 700 16px/1.3 var(--fo); color: var(--paa); }
.u-tapahtuma__tiedot small { color: var(--hieno); font-size: 14px; }
.u-tyhja { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 36px 24px; text-align: center; border: 1.5px dashed var(--raja); border-radius: var(--r-l); background: var(--pinta); color: var(--hieno); }

/* Instagram */
.u-ig__profiili { display: flex; align-items: center; gap: 12px; min-width: 0; }
.u-ig__profiili h2 { font-size: clamp(20px, 3.6vw, 26px); }
.u-ig__profiili small { color: var(--hieno); font-size: 14px; }
.u-ig__logo { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: var(--kulma, 14px); color: #fff; background: linear-gradient(45deg, #f09433, #dc2743 55%, #bc1888); }
.u-ig__ruudukko { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; border-radius: var(--r-m); overflow: hidden; }
/* Puhelimessa vain täydet rivit: 4–5 julkaisua → näytetään 3 */
@media (max-width: 899px) { .u-ig__ruudukko li:first-child:nth-last-child(-n+5) ~ li:nth-child(n+4) { display: none; } }
@media (min-width: 900px) { .u-ig__ruudukko { grid-template-columns: repeat(6, 1fr); gap: 10px; border-radius: 0; overflow: visible; } }
.u-ig__ruutu { position: relative; display: block; width: 100%; aspect-ratio: 1; padding: 0; border: 0; background: var(--kulta-vaalea); cursor: pointer; overflow: hidden; }
@media (min-width: 900px) { .u-ig__ruutu { border-radius: var(--r-s); } }
.u-ig__ruutu img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.u-ig__ruutu:hover img { transform: scale(1.05); }
.u-ig__merkki { position: absolute; top: 6px; inset-inline-end: 6px; display: grid; color: #fff; filter: drop-shadow(0 1px 2px rgb(0 0 0 / .6)); }

.u-ikkuna { width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; }
.u-ikkuna::backdrop { background: rgb(20 12 6 / .86); }
.u-ikkuna[open] { display: flex; align-items: center; justify-content: center; }
.u-ikkuna__sisalto { position: relative; display: flex; flex-direction: column; width: min(100%, 520px); max-height: 100%; overflow: hidden; background: var(--pinta); }
@media (min-width: 560px) { .u-ikkuna__sisalto { max-height: 92vh; border-radius: var(--r-l); } }
.u-ikkuna__kuva { position: relative; flex: none; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #000; touch-action: pan-y; }
.u-ikkuna__kuva img { width: 100%; max-height: min(52vh, 560px); max-height: min(52dvh, 560px); object-fit: contain; }
.u-ikkuna__video { position: absolute; inset: 0; margin: auto; display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: rgb(0 0 0 / .45); color: #fff; pointer-events: none; }
.u-ikkuna__nuoli { position: absolute; top: 50%; translate: 0 -50%; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgb(255 255 255 / .9); color: #111; cursor: pointer; box-shadow: 0 2px 10px rgb(0 0 0 / .3); }
.u-ikkuna__nuoli--ed { inset-inline-start: 10px; }
.u-ikkuna__nuoli--seur { inset-inline-end: 10px; }
.u-ikkuna__nuoli[disabled] { display: none; }
.u-ikkuna__sulje { position: absolute; top: 10px; inset-inline-end: 10px; z-index: 2; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgb(0 0 0 / .55); color: #fff; cursor: pointer; }
.u-ikkuna__teksti { flex: 1 1 auto; min-height: 60px; overflow-y: auto; padding: 16px 20px 4px; }
.u-ikkuna__kuvaus { margin-top: 6px; white-space: pre-line; overflow-wrap: anywhere; font-size: 15px; }
.u-ikkuna__linkki { margin: 12px 20px calc(16px + env(safe-area-inset-bottom)); }
html.u-lukittu { overflow: hidden; }

/* Lahjoitus */
.u-lahjoitus { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; align-items: center; gap: 14px; margin-top: 56px; padding: 40px 24px; border-radius: var(--r-l); background: var(--paa-tumma); color: rgb(255 255 255 / .82); text-align: center; }
.u-lahjoitus .u-kuvio { z-index: -1; opacity: .1; }
.u-lahjoitus h2 { color: #fff; }
.u-lahjoitus p { max-width: 36em; }
.u-lahjoitus__lupa { font-size: 13px; color: rgb(255 255 255 / .7); }
.u-lahjoitustiedot .u-pieni { font-size: 14px; color: var(--hieno, #6b6458); margin: 0; }
.u-lahjoitus__ikoni { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: color-mix(in srgb, var(--kulta) 18%, transparent); color: var(--kulta); border: 1px solid color-mix(in srgb, var(--kulta) 40%, transparent); }
@media (min-width: 1024px) { .u-lahjoitus { margin-top: 88px; padding: 56px; } }

/* Vierailu / yhteystiedot */
.u-vierailu { display: grid; overflow: hidden; background: var(--pinta); border: 1px solid var(--raja); border-radius: var(--r-l); box-shadow: var(--varjo-1); }
.u-vierailu__tiedot { display: flex; flex-direction: column; gap: 20px; padding: 24px; }
.u-yhteys { display: grid; gap: 14px; }
.u-yhteys li { display: flex; align-items: center; gap: 14px; }
.u-yhteys li > span:last-child { display: flex; flex-direction: column; min-width: 0; font-weight: 600; color: var(--paa); overflow-wrap: anywhere; }
.u-yhteys small { font-weight: 500; font-size: 13px; color: var(--hieno); }
.u-yhteys a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.u-yhteys a:hover { text-decoration: underline; }
.u-vierailu__kartta { min-height: 260px; background: var(--kulta-vaalea); }
.u-vierailu__kartta iframe { display: block; width: 100%; height: 100%; min-height: 260px; border: 0; }
@media (min-width: 900px) {
  .u-vierailu { grid-template-columns: 1fr 1.2fr; }
  .u-vierailu__tiedot { padding: 36px; justify-content: center; }
}

/* ---------- 9. Alasivut ---------- */
.u-sivuhero { position: relative; isolation: isolate; overflow: hidden; padding: 40px 0 48px; background: var(--paa-tumma); color: rgb(255 255 255 / .8); }
.u-sivuhero .u-kuvio { z-index: -1; }
.u-sivuhero h1 { color: #fff; font-size: clamp(30px, 6vw, 48px); margin-top: 10px; }
.u-sivuhero .u-eyebrow + h1 { margin-top: 12px; }
.u-sivuhero__johdanto { margin-top: 12px; max-width: 42em; font-size: clamp(16px, 2vw, 18px); }
@media (min-width: 1024px) { .u-sivuhero { padding: 64px 0 72px; } }
.u-sivu { padding: 28px 0 0; }
@media (min-width: 1024px) { .u-sivu { padding-top: 48px; } }
.u-sivu--kapea { max-width: 760px; }
.u-sivu.u-kehys.u-sivu--kapea { width: min(100% - 32px, 760px); }
.u-artikkeli { padding: 24px; }
@media (min-width: 768px) { .u-artikkeli { padding: 40px 48px; } }
.u-artikkeli__kielet { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--raja); }

.u-rukoussivu { display: grid; gap: 20px; align-items: start; }
.u-rukoussivu__tanaan { display: grid; gap: 14px; }
@media (min-width: 1024px) { .u-rukoussivu { grid-template-columns: .9fr 1.1fr; gap: 28px; } .u-rukoussivu__tanaan { position: sticky; top: calc(var(--yla) + 20px); } }
.u-juma { display: flex; align-items: center; gap: 14px; padding: 16px 20px; }
.u-juma > span:nth-child(2) { display: flex; flex-direction: column; flex: 1; }
.u-juma small { color: var(--hieno); }
.u-juma b { font: 700 24px/1 var(--fo); color: var(--paa); }

.u-missio { display: grid; gap: 14px; }
@media (min-width: 800px) { .u-missio { grid-template-columns: repeat(3, 1fr); gap: 18px; } }
.u-missio li { padding: 24px; }
.u-missio__nro { display: block; margin-bottom: 14px; font: 700 34px/1 var(--fo); color: var(--kulta); }
.u-missio h3 { margin-bottom: 8px; }
.u-missio p { color: var(--hieno); }
.u-galleria { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); }
.u-galleria img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-s); }

.u-palvelut { display: grid; gap: 14px; }
@media (min-width: 640px) { .u-palvelut { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .u-palvelut { grid-template-columns: repeat(3, 1fr); gap: 18px; } }
.u-palvelu { display: flex; flex-direction: column; gap: 10px; padding: 24px; }
.u-palvelu h2 { font-size: 19px; margin-top: 6px; }
.u-palvelu p { color: var(--hieno); }

.u-kaksi { display: grid; gap: 20px; align-items: start; }
@media (min-width: 1024px) { .u-kaksi { grid-template-columns: 1.6fr 1fr; gap: 28px; } .u-kaksi > aside { position: sticky; top: calc(var(--yla) + 20px); } }
.u-sivupalkki { display: flex; flex-direction: column; gap: 12px; padding: 24px; }
.u-sivupalkki h2 { font-size: 22px; }

.u-lahjoitustiedot { display: flex; flex-direction: column; align-items: center; gap: 18px; padding: 32px 24px; text-align: center; }
.u-lahjoitustiedot dl { display: grid; gap: 12px; width: 100%; text-align: start; }
.u-lahjoitustiedot dl > div { display: grid; gap: 4px; padding: 12px 16px; border-radius: var(--r-s); background: var(--tausta); }
.u-lahjoitustiedot dt { font-size: 13px; color: var(--hieno); }
.u-lahjoitustiedot dd { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.u-lahjoitustiedot code { font: 700 17px/1.3 var(--fo); color: var(--paa); }
.u-lahjoitustiedot .u-napit { justify-content: center; }
.u-nappi.on-kopioitu::after { content: " ✓"; }

/* ---------- 10. Lomakkeet ---------- */
.u-lomake { display: flex; flex-direction: column; gap: 18px; padding: 24px; }
@media (min-width: 768px) { .u-lomake { padding: 32px; } }
.u-lomake h2 { font-size: 24px; }
.u-lomake fieldset { display: grid; gap: 14px; margin: 0; padding: 0; border: 0; }
.u-lomake fieldset + fieldset { padding-top: 18px; border-top: 1px solid var(--raja); }
.u-lomake legend { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; padding: 0; font: 700 17px/1.2 var(--fo); color: var(--paa); }
.u-lomake__nro { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--kulta-vaalea); color: var(--kulta-teksti); font: 800 14px/1 var(--ft); }
.u-kentat { display: grid; gap: 14px; }
@media (min-width: 560px) { .u-kentat { grid-template-columns: 1fr 1fr; } .u-kentat:has(.u-kentta--kapea) { grid-template-columns: 1fr 120px; } }
.u-kentta { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.u-kentta > span { font-size: 14px; font-weight: 700; color: var(--paa); }
.u-lomake :is(input:not([type="radio"]):not([type="checkbox"]), textarea) {
  width: 100%; min-height: 50px; padding: 12px 14px; border: 1.5px solid var(--raja); border-radius: var(--r-s);
  background: var(--tausta); color: var(--teksti); font: 500 16px/1.4 var(--ft); transition: border-color .15s, background .15s;
}
.u-lomake textarea { resize: vertical; }
.u-lomake :is(input, textarea):focus { outline: none; border-color: var(--kulta); background: var(--pinta); box-shadow: 0 0 0 4px color-mix(in srgb, var(--kulta) 25%, transparent); }
.u-lomake.on-tarkistettu :invalid { border-color: #c0392b; }
.u-valinnat { display: flex; flex-wrap: wrap; gap: 8px; }
.u-valinta { position: relative; }
.u-valinta input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.u-valinta > span { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 16px; border: 1.5px solid var(--raja); border-radius: var(--kulma, 999px); background: var(--pinta); font-weight: 600; font-size: 15px; color: var(--paa); }
.u-valinta > input:checked + span { border-color: var(--paa); background: var(--paa); color: #fff; }
.u-valinta > input:focus-visible + span { outline: 3px solid var(--kulta); outline-offset: 2px; }
.u-hyvaksy { display: flex; align-items: flex-start; gap: 12px; font-size: 14.5px; color: var(--hieno); }
.u-hyvaksy input { width: 22px; height: 22px; flex: none; margin: 2px 0 0; accent-color: var(--paa); }
.u-lomake__viesti { margin: 0; padding: 12px 14px; border-radius: var(--r-s); font-weight: 600; font-size: 15px; }
.u-lomake__viesti--virhe { background: #fdecea; color: #8e2b20; }
.u-lomake__viesti--ok { background: var(--kulta-vaalea); color: var(--paa); }
.u-lomake__huom { font-size: 13.5px; }

/* ---------- 11. Alapalkki ---------- */
.u-ala { position: relative; isolation: isolate; overflow: hidden; margin-top: 72px; padding: 48px 0 calc(24px + env(safe-area-inset-bottom)); background: var(--paa-tumma); color: rgb(255 255 255 / .78); }
@media (min-width: 1024px) { .u-ala { margin-top: 104px; padding-top: 64px; } }
.u-ala .u-kuvio { z-index: -1; opacity: .07; }
.u-ala a { color: #fff; text-decoration: none; }
.u-ala a:hover { text-decoration: underline; text-underline-offset: 3px; }
.u-ala h2 { margin-bottom: 14px; color: #fff; font-size: 16px; letter-spacing: 0; }
.u-ala__ruudukko { display: grid; gap: 36px; }
@media (min-width: 760px) { .u-ala__ruudukko { grid-template-columns: 1.4fr 1fr 1.3fr; gap: 48px; } }
.u-ala__logo { width: auto; height: 64px; }
.u-ala__motto { margin-top: 14px; max-width: 22em; }
.u-ala__somet { display: flex; gap: 10px; margin-top: 18px; }
.u-ala__somet a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgb(255 255 255 / .2); color: var(--kulta); }
.u-ala__somet a:hover { background: rgb(255 255 255 / .08); text-decoration: none; }
.u-ala__linkit ul { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 16px; }
@media (min-width: 760px) { .u-ala__linkit ul { grid-template-columns: 1fr; } }
.u-ala__linkit a { display: inline-flex; min-height: 44px; align-items: center; }
.u-ala__yhteys ul { display: grid; gap: 12px; }
.u-ala__yhteys li { display: flex; gap: 12px; align-items: center; }
.u-ala__yhteys a, .u-ala__pohja a { display: inline-flex; align-items: center; min-height: 44px; }
.u-ala__yhteys svg { flex: none; color: var(--kulta); }
.u-ala__pohja { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; margin-top: 40px; padding-top: 20px; border-top: 1px solid rgb(255 255 255 / .12); font-size: 14px; }

/* ---------- 12. Pikanapit ---------- */
.u-pikanapit { position: fixed; z-index: 40; inset-inline-end: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; align-items: center; gap: 10px; }
.u-pikanapit { transition: opacity .25s, transform .25s; }
.u-pikanapit.on-piilossa, .u-pikanapit.on-peitossa, .u-pikanapit.on-alas { opacity: 0; transform: translateY(16px); pointer-events: none; }
body.on-valikko .u-pikanapit { display: none; }
.u-pikanappi { display: grid; place-items: center; border-radius: 50%; text-decoration: none; box-shadow: 0 10px 24px -8px rgb(0 0 0 / .45); transition: transform .15s; }
.u-pikanappi:hover { transform: scale(1.06); }
.u-pikanappi--wa { width: 58px; height: 58px; background: #25d366; color: #fff; }
.u-pikanappi--puh { width: 46px; height: 46px; background: var(--pinta); color: var(--paa); border: 1px solid var(--raja); }


/* ---------- Etusivun aloitusnäyttö: vaalea tausta, tähtikuvio, keskitetty ---------- */
.u-alku {
  text-align: center; border-bottom: 1px solid var(--raja);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23c49a5a' stroke-opacity='.14' stroke-width='1'%3E%3Cpath d='M48 10l11 27 27 11-27 11-11 27-11-27-27-11 27-11z'/%3E%3Cpath d='M21 21h54v54H21z'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(ellipse at 50% 0%, color-mix(in srgb, var(--kulta) 32%, transparent), transparent 60%),
    #fbfaf6;
}
.u-alku__sisalto { display: flex; flex-direction: column; align-items: center; padding-block: 44px 52px; }
.u-alku__tunniste {
  display: inline-flex; align-items: center; gap: 10px; margin: 0 0 22px; padding: 8px 18px;
  border: 1px solid color-mix(in srgb, var(--kulta) 60%, transparent); border-radius: var(--kulma, 999px); background: var(--pinta);
  font: 700 13px/1.2 var(--ft); letter-spacing: .18em; text-transform: uppercase; color: var(--paa);
}
.u-alku__tunniste span { color: var(--kulta); font-size: 11px; }
html[lang="ar"] .u-alku__tunniste { letter-spacing: 0; font-size: 14px; }
.u-alku h1 { margin: 0 auto; max-width: 14em; font-size: clamp(32px, 8.4vw, 58px); color: var(--paa); text-wrap: balance; }
.u-alku__esittely { margin: 14px auto 0; max-width: 34em; font-size: clamp(16px, 2.4vw, 19px); color: var(--hieno); text-wrap: balance; }
.u-alku__aikataulu { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin-top: 6px; font-weight: 700; color: var(--kulta-teksti); text-decoration: underline; text-decoration-color: var(--kulta); text-decoration-thickness: 2px; text-underline-offset: 6px; }

.u-alku__napit { display: grid; gap: 12px; width: min(100%, 360px); margin-top: 18px; }
.u-alku__napit .u-nappi { width: 100%; white-space: normal; }
@media (min-width: 640px) { .u-alku__napit { display: flex; width: auto; justify-content: center; } .u-alku__napit .u-nappi { width: auto; } }
@media (min-width: 1024px) { .u-alku__sisalto { padding-block: 80px 88px; } }
.u-nappi--iso { min-height: 54px; padding: 14px 26px; font-size: 16px; }
.u-alku__aikataulu .u-flip { display: inline-block; text-decoration: none; }
.u-alku__aikataulu { display: inline-block; line-height: 44px; }


/* Aloitusnäyttö puhelimella tiiviimmin */
@media (max-width: 767px) {
  .u-alku__sisalto { padding-block: 28px 36px; }
  .u-alku__tunniste { margin-bottom: 16px; }
  .u-alku h1 { font-size: clamp(28px, 7.6vw, 40px); }
  .u-alku__esittely { margin-top: 10px; font-size: 16px; }
  .u-alku__napit { margin-top: 18px; }
}

/* ---------- Aloitusnäytön tausta kuten masjidsunna.lovable.app ----------
   Valkoinen, ylhäällä hyvin vaalea kerma ja pieni kultainen hehku,
   haalea kahdeksansakarainen tähti- ja kahdeksankulmiokuvio (oma piirros, Masjidbox-näytön tyyliin). Ei kaarta. */
.u-alku {
  background:
    url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2772%27 height=%2772%27 viewBox=%270 0 72 72%27%3E%3Cpath d=%27M36.0 0.0L46.6 10.5L61.5 10.5L61.5 25.4L72.0 36.0L61.5 46.6L61.5 61.5L46.6 61.5L36.0 72.0L25.4 61.5L10.5 61.5L10.5 46.6L0.0 36.0L10.5 25.4L10.5 10.5L25.4 10.5ZM49.9 41.7L41.7 49.9L30.3 49.9L22.1 41.7L22.1 30.3L30.3 22.1L41.7 22.1L49.9 30.3ZM11.1 4.6L4.6 11.1L-4.6 11.1L-11.1 4.6L-11.1 -4.6L-4.6 -11.1L4.6 -11.1L11.1 -4.6ZM83.1 4.6L76.6 11.1L67.4 11.1L60.9 4.6L60.9 -4.6L67.4 -11.1L76.6 -11.1L83.1 -4.6ZM11.1 76.6L4.6 83.1L-4.6 83.1L-11.1 76.6L-11.1 67.4L-4.6 60.9L4.6 60.9L11.1 67.4ZM83.1 76.6L76.6 83.1L67.4 83.1L60.9 76.6L60.9 67.4L67.4 60.9L76.6 60.9L83.1 67.4Z%27 fill=%27none%27 stroke=%27%23B8893F%27 stroke-opacity=%270.13%27 stroke-width=%271%27/%3E%3C/svg%3E"),
    radial-gradient(70% 60% at 50% 0%, rgb(222 187 134 / .28), transparent 70%),
    linear-gradient(#faf8f3, #ffffff);
  border-bottom: 0;
}
.u-alku::before { content: none; }


/* ---------- Oletusvärit (kuten masjidsunna.lovable.app); moskeijan teema korvaa ne ---------- */
:root {
  --paa: oklch(30% .045 55); --paa-tumma: oklch(24% .04 55); --teksti: oklch(30% .045 55);
  --kulta: oklch(81% .08 78); --kulta-vaalea: oklch(96% .025 82); --kulta-teksti: oklch(48% .07 70);
  --tausta: oklch(100% 0 0); --pinta: oklch(100% 0 0); --kerma: oklch(98.1% .005 85);
  --raja: oklch(92% .015 70); --hieno: oklch(52% .035 55);
}

/* ---------- Seuraava rukous: ulkoasu kuten aiempi kortti (kermainen yläosa, palkki,
   valkoinen alaosa), mutta rukouksen nimi ja kellonaika isoimpina ---------- */
.u-seur {
  width: min(100%, 440px); margin-top: 26px; overflow: hidden; text-align: start;
  background: var(--pinta); border-radius: var(--kulma, 24px);
  box-shadow: 0 0 0 1px var(--raja), 0 18px 40px -22px oklch(30% .045 55 / .35);
}
.u-seur p { margin: 0; }
.u-seur__yla { padding: 18px 22px 18px; background: linear-gradient(135deg, var(--kulta-vaalea), color-mix(in srgb, var(--kulta-vaalea) 35%, var(--pinta))); }
.u-seur__otsikko { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font: 700 12.5px/1.3 var(--ft); letter-spacing: .12em; text-transform: uppercase; color: var(--kulta-teksti); }
html[lang="ar"] .u-seur__otsikko { letter-spacing: 0; font-size: 14px; }
.u-seur__huomenna { padding: 2px 8px; border-radius: var(--kulma, 999px); background: var(--pinta); font-size: 11.5px; letter-spacing: .04em; }
.u-seur__huomenna[hidden] { display: none; }
.u-seur__rivi { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: 6px; }
.u-seur__paa { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 10px; min-width: 0; color: var(--paa); }
.u-seur__nimi { font: 800 30px/1.1 var(--fo); }
.u-seur__klo { font: 800 30px/1.1 var(--fo); font-variant-numeric: tabular-nums; }
.u-seur__jaljella { display: grid; justify-items: end; flex: none; text-align: end; position: relative; }
.u-seur__jaljella b { font: 700 18px/1.1 var(--fo); font-variant-numeric: tabular-nums; color: var(--paa); }
.u-seur__jaljella small { font-size: 12.5px; color: var(--hieno); }
.u-seur__jaljella small { position: absolute; top: 100%; inset-inline-end: 0; white-space: nowrap; }
.u-seur__iqamah[hidden] + .u-seur__palkki { margin-top: 30px; }
.u-seur__iqamah { margin-top: 4px !important; font-size: 14px; color: var(--hieno); }
.u-seur__iqamah b { font-weight: 700; color: var(--paa); }
.u-seur__iqamah[hidden] { display: none; }
.u-seur__palkki { height: 6px; margin-top: 14px; border-radius: var(--kulma, 999px); overflow: hidden; background: color-mix(in srgb, var(--kulta) 25%, var(--pinta)); }
.u-seur__palkki span { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--kulta), color-mix(in srgb, var(--kulta) 55%, var(--paa))); transition: width .8s ease; }
html[dir="rtl"] .u-seur__palkki span { background: linear-gradient(-90deg, var(--kulta), color-mix(in srgb, var(--kulta) 55%, var(--paa))); }
.u-seur__linkki { display: flex; justify-content: center; align-items: center; gap: 6px; min-height: 52px; font-weight: 700; color: var(--paa); text-decoration: none; transition: background-color .15s; }
.u-seur__linkki:hover { background: var(--kerma); }
@media (max-width: 359px) { .u-seur__yla { padding-inline: 16px; } .u-seur__nimi, .u-seur__klo { font-size: 25px; } .u-seur__jaljella b { font-size: 16px; } }

/* Aloitusnäyttö puhelimella vielä tiiviimmin, jotta WhatsApp-nappi mahtuu napin alle */
@media (max-width: 767px) {
  .u-alku__sisalto { padding-block: 20px 28px; }
  .u-alku__tunniste { margin-bottom: 12px; }
  .u-alku__esittely { margin-top: 8px; }
  .u-seur { margin-top: 18px; }
  .u-seur__yla { padding-block: 14px 14px; }
  .u-seur__palkki { margin-top: 12px; }
  .u-seur__linkki { min-height: 46px; }
  .u-alku__napit { margin-top: 14px; gap: 10px; }
  .u-alku__napit .u-nappi { min-height: 50px; padding-block: 12px; }
}

/* ---------- Alasivut samaan ilmeeseen kuin etusivu ---------- */
/* Otsikkoalue: sama vaalea tausta kuin etusivulla (Lovable), tumma teksti, ei isoja tähtiä */
.u-sivuhero {
  color: var(--hieno);
  background:
    url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2772%27 height=%2772%27 viewBox=%270 0 72 72%27%3E%3Cpath d=%27M36.0 0.0L46.6 10.5L61.5 10.5L61.5 25.4L72.0 36.0L61.5 46.6L61.5 61.5L46.6 61.5L36.0 72.0L25.4 61.5L10.5 61.5L10.5 46.6L0.0 36.0L10.5 25.4L10.5 10.5L25.4 10.5ZM49.9 41.7L41.7 49.9L30.3 49.9L22.1 41.7L22.1 30.3L30.3 22.1L41.7 22.1L49.9 30.3ZM11.1 4.6L4.6 11.1L-4.6 11.1L-11.1 4.6L-11.1 -4.6L-4.6 -11.1L4.6 -11.1L11.1 -4.6ZM83.1 4.6L76.6 11.1L67.4 11.1L60.9 4.6L60.9 -4.6L67.4 -11.1L76.6 -11.1L83.1 -4.6ZM11.1 76.6L4.6 83.1L-4.6 83.1L-11.1 76.6L-11.1 67.4L-4.6 60.9L4.6 60.9L11.1 67.4ZM83.1 76.6L76.6 83.1L67.4 83.1L60.9 76.6L60.9 67.4L67.4 60.9L76.6 60.9L83.1 67.4Z%27 fill=%27none%27 stroke=%27%23B8893F%27 stroke-opacity=%270.13%27 stroke-width=%271%27/%3E%3C/svg%3E"),
    radial-gradient(70% 60% at 50% 0%, rgb(222 187 134 / .28), transparent 70%),
    linear-gradient(#faf8f3, #ffffff);
}
.u-sivuhero .u-kuvio { display: none; }
.u-sivuhero h1 { color: var(--paa); }
.u-sivuhero .u-eyebrow--vaalea { color: var(--kulta-teksti); }

/* Alapalkki kuten Lovablessa: tasainen tumma ruskea ilman kuviota */
.u-ala { background: var(--paa); }
.u-ala .u-kuvio { display: none; }

/* Rukousaikasivu: sama Seuraava rukous -kortti kuin etusivulla, taulukko sen alla */
.u-rukoussivu__tanaan .u-seur { width: 100%; margin-top: 0; }
.u-rukoussivu__tanaan .rk { margin-top: 16px; }
.u-rukoussivu__tanaan .rk__seuraava { display: none; }


:root { --kuvio-oletus: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2753.113%27 height=%2753.113%27 viewBox=%270 0 53.113 53.113%27%3E%3Cpath d=%27M-87.45 -87.45L-98.45 -114.00M-87.45 -87.45L-114.00 -98.45M-106.23 -79.67L-95.23 -106.23M-106.23 -79.67L-117.23 -106.23M-125.00 -87.45L-98.45 -98.45M-125.00 -87.45L-114.00 -114.00M-132.78 -106.23L-106.23 -95.23M-132.78 -106.23L-106.23 -117.23M-125.00 -125.00L-114.00 -98.45M-125.00 -125.00L-98.45 -114.00M-106.23 -132.78L-117.23 -106.23M-106.23 -132.78L-95.23 -106.23M-87.45 -125.00L-114.00 -114.00M-87.45 -125.00L-98.45 -98.45M-79.67 -106.23L-106.23 -117.23M-79.67 -106.23L-106.23 -95.23M-79.67 -90.67L-76.45 -82.89M-76.45 -82.89L-68.67 -79.67M-68.67 -79.67L-76.45 -76.45M-76.45 -76.45L-79.67 -68.67M-79.67 -68.67L-82.89 -76.45M-82.89 -76.45L-90.67 -79.67M-90.67 -79.67L-82.89 -82.89M-82.89 -82.89L-79.67 -90.67M-87.45 -34.33L-98.45 -60.89M-87.45 -34.33L-114.00 -45.33M-106.23 -26.56L-95.23 -53.11M-106.23 -26.56L-117.23 -53.11M-125.00 -34.33L-98.45 -45.33M-125.00 -34.33L-114.00 -60.89M-132.78 -53.11L-106.23 -42.11M-132.78 -53.11L-106.23 -64.11M-125.00 -71.89L-114.00 -45.33M-125.00 -71.89L-98.45 -60.89M-106.23 -79.67L-117.23 -53.11M-106.23 -79.67L-95.23 -53.11M-87.45 -71.89L-114.00 -60.89M-87.45 -71.89L-98.45 -45.33M-79.67 -53.11L-106.23 -64.11M-79.67 -53.11L-106.23 -42.11M-79.67 -37.56L-76.45 -29.78M-76.45 -29.78L-68.67 -26.56M-68.67 -26.56L-76.45 -23.33M-76.45 -23.33L-79.67 -15.56M-79.67 -15.56L-82.89 -23.33M-82.89 -23.33L-90.67 -26.56M-90.67 -26.56L-82.89 -29.78M-82.89 -29.78L-79.67 -37.56M-87.45 18.78L-98.45 -7.78M-87.45 18.78L-114.00 7.78M-106.23 26.56L-95.23 0.00M-106.23 26.56L-117.23 0.00M-125.00 18.78L-98.45 7.78M-125.00 18.78L-114.00 -7.78M-132.78 0.00L-106.23 11.00M-132.78 0.00L-106.23 -11.00M-125.00 -18.78L-114.00 7.78M-125.00 -18.78L-98.45 -7.78M-106.23 -26.56L-117.23 -0.00M-106.23 -26.56L-95.23 -0.00M-87.45 -18.78L-114.00 -7.78M-87.45 -18.78L-98.45 7.78M-79.67 -0.00L-106.23 -11.00M-79.67 -0.00L-106.23 11.00M-79.67 15.56L-76.45 23.33M-76.45 23.33L-68.67 26.56M-68.67 26.56L-76.45 29.78M-76.45 29.78L-79.67 37.56M-79.67 37.56L-82.89 29.78M-82.89 29.78L-90.67 26.56M-90.67 26.56L-82.89 23.33M-82.89 23.33L-79.67 15.56M-87.45 71.89L-98.45 45.33M-87.45 71.89L-114.00 60.89M-106.23 79.67L-95.23 53.11M-106.23 79.67L-117.23 53.11M-125.00 71.89L-98.45 60.89M-125.00 71.89L-114.00 45.33M-132.78 53.11L-106.23 64.11M-132.78 53.11L-106.23 42.11M-125.00 34.33L-114.00 60.89M-125.00 34.33L-98.45 45.33M-106.23 26.56L-117.23 53.11M-106.23 26.56L-95.23 53.11M-87.45 34.33L-114.00 45.33M-87.45 34.33L-98.45 60.89M-79.67 53.11L-106.23 42.11M-79.67 53.11L-106.23 64.11M-79.67 68.67L-76.45 76.45M-76.45 76.45L-68.67 79.67M-68.67 79.67L-76.45 82.89M-76.45 82.89L-79.67 90.67M-79.67 90.67L-82.89 82.89M-82.89 82.89L-90.67 79.67M-90.67 79.67L-82.89 76.45M-82.89 76.45L-79.67 68.67M-87.45 125.00L-98.45 98.45M-87.45 125.00L-114.00 114.00M-106.23 132.78L-95.23 106.23M-106.23 132.78L-117.23 106.23M-125.00 125.00L-98.45 114.00M-125.00 125.00L-114.00 98.45M-132.78 106.23L-106.23 117.23M-132.78 106.23L-106.23 95.23M-125.00 87.45L-114.00 114.00M-125.00 87.45L-98.45 98.45M-106.23 79.67L-117.23 106.23M-106.23 79.67L-95.23 106.23M-87.45 87.45L-114.00 98.45M-87.45 87.45L-98.45 114.00M-79.67 106.23L-106.23 95.23M-79.67 106.23L-106.23 117.23M-79.67 121.78L-76.45 129.56M-76.45 129.56L-68.67 132.78M-68.67 132.78L-76.45 136.00M-76.45 136.00L-79.67 143.78M-79.67 143.78L-82.89 136.00M-82.89 136.00L-90.67 132.78M-90.67 132.78L-82.89 129.56M-82.89 129.56L-79.67 121.78M-87.45 178.12L-98.45 151.56M-87.45 178.12L-114.00 167.12M-106.23 185.89L-95.23 159.34M-106.23 185.89L-117.23 159.34M-125.00 178.12L-98.45 167.12M-125.00 178.12L-114.00 151.56M-132.78 159.34L-106.23 170.34M-132.78 159.34L-106.23 148.34M-125.00 140.56L-114.00 167.12M-125.00 140.56L-98.45 151.56M-106.23 132.78L-117.23 159.34M-106.23 132.78L-95.23 159.34M-87.45 140.56L-114.00 151.56M-87.45 140.56L-98.45 167.12M-79.67 159.34L-106.23 148.34M-79.67 159.34L-106.23 170.34M-79.67 174.89L-76.45 182.67M-76.45 182.67L-68.67 185.89M-68.67 185.89L-76.45 189.12M-76.45 189.12L-79.67 196.89M-79.67 196.89L-82.89 189.12M-82.89 189.12L-90.67 185.89M-90.67 185.89L-82.89 182.67M-82.89 182.67L-79.67 174.89M-34.33 -87.45L-45.33 -114.00M-34.33 -87.45L-60.89 -98.45M-53.11 -79.67L-42.11 -106.23M-53.11 -79.67L-64.11 -106.23M-71.89 -87.45L-45.33 -98.45M-71.89 -87.45L-60.89 -114.00M-79.67 -106.23L-53.11 -95.23M-79.67 -106.23L-53.11 -117.23M-71.89 -125.00L-60.89 -98.45M-71.89 -125.00L-45.33 -114.00M-53.11 -132.78L-64.11 -106.23M-53.11 -132.78L-42.11 -106.23M-34.33 -125.00L-60.89 -114.00M-34.33 -125.00L-45.33 -98.45M-26.56 -106.23L-53.11 -117.23M-26.56 -106.23L-53.11 -95.23M-26.56 -90.67L-23.33 -82.89M-23.33 -82.89L-15.56 -79.67M-15.56 -79.67L-23.33 -76.45M-23.33 -76.45L-26.56 -68.67M-26.56 -68.67L-29.78 -76.45M-29.78 -76.45L-37.56 -79.67M-37.56 -79.67L-29.78 -82.89M-29.78 -82.89L-26.56 -90.67M-34.33 -34.33L-45.33 -60.89M-34.33 -34.33L-60.89 -45.33M-53.11 -26.56L-42.11 -53.11M-53.11 -26.56L-64.11 -53.11M-71.89 -34.33L-45.33 -45.33M-71.89 -34.33L-60.89 -60.89M-79.67 -53.11L-53.11 -42.11M-79.67 -53.11L-53.11 -64.11M-71.89 -71.89L-60.89 -45.33M-71.89 -71.89L-45.33 -60.89M-53.11 -79.67L-64.11 -53.11M-53.11 -79.67L-42.11 -53.11M-34.33 -71.89L-60.89 -60.89M-34.33 -71.89L-45.33 -45.33M-26.56 -53.11L-53.11 -64.11M-26.56 -53.11L-53.11 -42.11M-26.56 -37.56L-23.33 -29.78M-23.33 -29.78L-15.56 -26.56M-15.56 -26.56L-23.33 -23.33M-23.33 -23.33L-26.56 -15.56M-26.56 -15.56L-29.78 -23.33M-29.78 -23.33L-37.56 -26.56M-37.56 -26.56L-29.78 -29.78M-29.78 -29.78L-26.56 -37.56M-34.33 18.78L-45.33 -7.78M-34.33 18.78L-60.89 7.78M-53.11 26.56L-42.11 0.00M-53.11 26.56L-64.11 0.00M-71.89 18.78L-45.33 7.78M-71.89 18.78L-60.89 -7.78M-79.67 0.00L-53.11 11.00M-79.67 0.00L-53.11 -11.00M-71.89 -18.78L-60.89 7.78M-71.89 -18.78L-45.33 -7.78M-53.11 -26.56L-64.11 -0.00M-53.11 -26.56L-42.11 -0.00M-34.33 -18.78L-60.89 -7.78M-34.33 -18.78L-45.33 7.78M-26.56 -0.00L-53.11 -11.00M-26.56 -0.00L-53.11 11.00M-26.56 15.56L-23.33 23.33M-23.33 23.33L-15.56 26.56M-15.56 26.56L-23.33 29.78M-23.33 29.78L-26.56 37.56M-26.56 37.56L-29.78 29.78M-29.78 29.78L-37.56 26.56M-37.56 26.56L-29.78 23.33M-29.78 23.33L-26.56 15.56M-34.33 71.89L-45.33 45.33M-34.33 71.89L-60.89 60.89M-53.11 79.67L-42.11 53.11M-53.11 79.67L-64.11 53.11M-71.89 71.89L-45.33 60.89M-71.89 71.89L-60.89 45.33M-79.67 53.11L-53.11 64.11M-79.67 53.11L-53.11 42.11M-71.89 34.33L-60.89 60.89M-71.89 34.33L-45.33 45.33M-53.11 26.56L-64.11 53.11M-53.11 26.56L-42.11 53.11M-34.33 34.33L-60.89 45.33M-34.33 34.33L-45.33 60.89M-26.56 53.11L-53.11 42.11M-26.56 53.11L-53.11 64.11M-26.56 68.67L-23.33 76.45M-23.33 76.45L-15.56 79.67M-15.56 79.67L-23.33 82.89M-23.33 82.89L-26.56 90.67M-26.56 90.67L-29.78 82.89M-29.78 82.89L-37.56 79.67M-37.56 79.67L-29.78 76.45M-29.78 76.45L-26.56 68.67M-34.33 125.00L-45.33 98.45M-34.33 125.00L-60.89 114.00M-53.11 132.78L-42.11 106.23M-53.11 132.78L-64.11 106.23M-71.89 125.00L-45.33 114.00M-71.89 125.00L-60.89 98.45M-79.67 106.23L-53.11 117.23M-79.67 106.23L-53.11 95.23M-71.89 87.45L-60.89 114.00M-71.89 87.45L-45.33 98.45M-53.11 79.67L-64.11 106.23M-53.11 79.67L-42.11 106.23M-34.33 87.45L-60.89 98.45M-34.33 87.45L-45.33 114.00M-26.56 106.23L-53.11 95.23M-26.56 106.23L-53.11 117.23M-26.56 121.78L-23.33 129.56M-23.33 129.56L-15.56 132.78M-15.56 132.78L-23.33 136.00M-23.33 136.00L-26.56 143.78M-26.56 143.78L-29.78 136.00M-29.78 136.00L-37.56 132.78M-37.56 132.78L-29.78 129.56M-29.78 129.56L-26.56 121.78M-34.33 178.12L-45.33 151.56M-34.33 178.12L-60.89 167.12M-53.11 185.89L-42.11 159.34M-53.11 185.89L-64.11 159.34M-71.89 178.12L-45.33 167.12M-71.89 178.12L-60.89 151.56M-79.67 159.34L-53.11 170.34M-79.67 159.34L-53.11 148.34M-71.89 140.56L-60.89 167.12M-71.89 140.56L-45.33 151.56M-53.11 132.78L-64.11 159.34M-53.11 132.78L-42.11 159.34M-34.33 140.56L-60.89 151.56M-34.33 140.56L-45.33 167.12M-26.56 159.34L-53.11 148.34M-26.56 159.34L-53.11 170.34M-26.56 174.89L-23.33 182.67M-23.33 182.67L-15.56 185.89M-15.56 185.89L-23.33 189.12M-23.33 189.12L-26.56 196.89M-26.56 196.89L-29.78 189.12M-29.78 189.12L-37.56 185.89M-37.56 185.89L-29.78 182.67M-29.78 182.67L-26.56 174.89M18.78 -87.45L7.78 -114.00M18.78 -87.45L-7.78 -98.45M0.00 -79.67L11.00 -106.23M0.00 -79.67L-11.00 -106.23M-18.78 -87.45L7.78 -98.45M-18.78 -87.45L-7.78 -114.00M-26.56 -106.23L-0.00 -95.23M-26.56 -106.23L-0.00 -117.23M-18.78 -125.00L-7.78 -98.45M-18.78 -125.00L7.78 -114.00M-0.00 -132.78L-11.00 -106.23M-0.00 -132.78L11.00 -106.23M18.78 -125.00L-7.78 -114.00M18.78 -125.00L7.78 -98.45M26.56 -106.23L0.00 -117.23M26.56 -106.23L0.00 -95.23M26.56 -90.67L29.78 -82.89M29.78 -82.89L37.56 -79.67M37.56 -79.67L29.78 -76.45M29.78 -76.45L26.56 -68.67M26.56 -68.67L23.33 -76.45M23.33 -76.45L15.56 -79.67M15.56 -79.67L23.33 -82.89M23.33 -82.89L26.56 -90.67M18.78 -34.33L7.78 -60.89M18.78 -34.33L-7.78 -45.33M0.00 -26.56L11.00 -53.11M0.00 -26.56L-11.00 -53.11M-18.78 -34.33L7.78 -45.33M-18.78 -34.33L-7.78 -60.89M-26.56 -53.11L-0.00 -42.11M-26.56 -53.11L-0.00 -64.11M-18.78 -71.89L-7.78 -45.33M-18.78 -71.89L7.78 -60.89M-0.00 -79.67L-11.00 -53.11M-0.00 -79.67L11.00 -53.11M18.78 -71.89L-7.78 -60.89M18.78 -71.89L7.78 -45.33M26.56 -53.11L0.00 -64.11M26.56 -53.11L0.00 -42.11M26.56 -37.56L29.78 -29.78M29.78 -29.78L37.56 -26.56M37.56 -26.56L29.78 -23.33M29.78 -23.33L26.56 -15.56M26.56 -15.56L23.33 -23.33M23.33 -23.33L15.56 -26.56M15.56 -26.56L23.33 -29.78M23.33 -29.78L26.56 -37.56M18.78 18.78L7.78 -7.78M18.78 18.78L-7.78 7.78M0.00 26.56L11.00 0.00M0.00 26.56L-11.00 0.00M-18.78 18.78L7.78 7.78M-18.78 18.78L-7.78 -7.78M-26.56 0.00L-0.00 11.00M-26.56 0.00L-0.00 -11.00M-18.78 -18.78L-7.78 7.78M-18.78 -18.78L7.78 -7.78M-0.00 -26.56L-11.00 -0.00M-0.00 -26.56L11.00 -0.00M18.78 -18.78L-7.78 -7.78M18.78 -18.78L7.78 7.78M26.56 -0.00L0.00 -11.00M26.56 -0.00L0.00 11.00M26.56 15.56L29.78 23.33M29.78 23.33L37.56 26.56M37.56 26.56L29.78 29.78M29.78 29.78L26.56 37.56M26.56 37.56L23.33 29.78M23.33 29.78L15.56 26.56M15.56 26.56L23.33 23.33M23.33 23.33L26.56 15.56M18.78 71.89L7.78 45.33M18.78 71.89L-7.78 60.89M0.00 79.67L11.00 53.11M0.00 79.67L-11.00 53.11M-18.78 71.89L7.78 60.89M-18.78 71.89L-7.78 45.33M-26.56 53.11L-0.00 64.11M-26.56 53.11L-0.00 42.11M-18.78 34.33L-7.78 60.89M-18.78 34.33L7.78 45.33M-0.00 26.56L-11.00 53.11M-0.00 26.56L11.00 53.11M18.78 34.33L-7.78 45.33M18.78 34.33L7.78 60.89M26.56 53.11L0.00 42.11M26.56 53.11L0.00 64.11M26.56 68.67L29.78 76.45M29.78 76.45L37.56 79.67M37.56 79.67L29.78 82.89M29.78 82.89L26.56 90.67M26.56 90.67L23.33 82.89M23.33 82.89L15.56 79.67M15.56 79.67L23.33 76.45M23.33 76.45L26.56 68.67M18.78 125.00L7.78 98.45M18.78 125.00L-7.78 114.00M0.00 132.78L11.00 106.23M0.00 132.78L-11.00 106.23M-18.78 125.00L7.78 114.00M-18.78 125.00L-7.78 98.45M-26.56 106.23L-0.00 117.23M-26.56 106.23L-0.00 95.23M-18.78 87.45L-7.78 114.00M-18.78 87.45L7.78 98.45M-0.00 79.67L-11.00 106.23M-0.00 79.67L11.00 106.23M18.78 87.45L-7.78 98.45M18.78 87.45L7.78 114.00M26.56 106.23L0.00 95.23M26.56 106.23L0.00 117.23M26.56 121.78L29.78 129.56M29.78 129.56L37.56 132.78M37.56 132.78L29.78 136.00M29.78 136.00L26.56 143.78M26.56 143.78L23.33 136.00M23.33 136.00L15.56 132.78M15.56 132.78L23.33 129.56M23.33 129.56L26.56 121.78M18.78 178.12L7.78 151.56M18.78 178.12L-7.78 167.12M0.00 185.89L11.00 159.34M0.00 185.89L-11.00 159.34M-18.78 178.12L7.78 167.12M-18.78 178.12L-7.78 151.56M-26.56 159.34L-0.00 170.34M-26.56 159.34L-0.00 148.34M-18.78 140.56L-7.78 167.12M-18.78 140.56L7.78 151.56M-0.00 132.78L-11.00 159.34M-0.00 132.78L11.00 159.34M18.78 140.56L-7.78 151.56M18.78 140.56L7.78 167.12M26.56 159.34L0.00 148.34M26.56 159.34L0.00 170.34M26.56 174.89L29.78 182.67M29.78 182.67L37.56 185.89M37.56 185.89L29.78 189.12M29.78 189.12L26.56 196.89M26.56 196.89L23.33 189.12M23.33 189.12L15.56 185.89M15.56 185.89L23.33 182.67M23.33 182.67L26.56 174.89M71.89 -87.45L60.89 -114.00M71.89 -87.45L45.33 -98.45M53.11 -79.67L64.11 -106.23M53.11 -79.67L42.11 -106.23M34.33 -87.45L60.89 -98.45M34.33 -87.45L45.33 -114.00M26.56 -106.23L53.11 -95.23M26.56 -106.23L53.11 -117.23M34.33 -125.00L45.33 -98.45M34.33 -125.00L60.89 -114.00M53.11 -132.78L42.11 -106.23M53.11 -132.78L64.11 -106.23M71.89 -125.00L45.33 -114.00M71.89 -125.00L60.89 -98.45M79.67 -106.23L53.11 -117.23M79.67 -106.23L53.11 -95.23M79.67 -90.67L82.89 -82.89M82.89 -82.89L90.67 -79.67M90.67 -79.67L82.89 -76.45M82.89 -76.45L79.67 -68.67M79.67 -68.67L76.45 -76.45M76.45 -76.45L68.67 -79.67M68.67 -79.67L76.45 -82.89M76.45 -82.89L79.67 -90.67M71.89 -34.33L60.89 -60.89M71.89 -34.33L45.33 -45.33M53.11 -26.56L64.11 -53.11M53.11 -26.56L42.11 -53.11M34.33 -34.33L60.89 -45.33M34.33 -34.33L45.33 -60.89M26.56 -53.11L53.11 -42.11M26.56 -53.11L53.11 -64.11M34.33 -71.89L45.33 -45.33M34.33 -71.89L60.89 -60.89M53.11 -79.67L42.11 -53.11M53.11 -79.67L64.11 -53.11M71.89 -71.89L45.33 -60.89M71.89 -71.89L60.89 -45.33M79.67 -53.11L53.11 -64.11M79.67 -53.11L53.11 -42.11M79.67 -37.56L82.89 -29.78M82.89 -29.78L90.67 -26.56M90.67 -26.56L82.89 -23.33M82.89 -23.33L79.67 -15.56M79.67 -15.56L76.45 -23.33M76.45 -23.33L68.67 -26.56M68.67 -26.56L76.45 -29.78M76.45 -29.78L79.67 -37.56M71.89 18.78L60.89 -7.78M71.89 18.78L45.33 7.78M53.11 26.56L64.11 0.00M53.11 26.56L42.11 0.00M34.33 18.78L60.89 7.78M34.33 18.78L45.33 -7.78M26.56 0.00L53.11 11.00M26.56 0.00L53.11 -11.00M34.33 -18.78L45.33 7.78M34.33 -18.78L60.89 -7.78M53.11 -26.56L42.11 -0.00M53.11 -26.56L64.11 -0.00M71.89 -18.78L45.33 -7.78M71.89 -18.78L60.89 7.78M79.67 -0.00L53.11 -11.00M79.67 -0.00L53.11 11.00M79.67 15.56L82.89 23.33M82.89 23.33L90.67 26.56M90.67 26.56L82.89 29.78M82.89 29.78L79.67 37.56M79.67 37.56L76.45 29.78M76.45 29.78L68.67 26.56M68.67 26.56L76.45 23.33M76.45 23.33L79.67 15.56M71.89 71.89L60.89 45.33M71.89 71.89L45.33 60.89M53.11 79.67L64.11 53.11M53.11 79.67L42.11 53.11M34.33 71.89L60.89 60.89M34.33 71.89L45.33 45.33M26.56 53.11L53.11 64.11M26.56 53.11L53.11 42.11M34.33 34.33L45.33 60.89M34.33 34.33L60.89 45.33M53.11 26.56L42.11 53.11M53.11 26.56L64.11 53.11M71.89 34.33L45.33 45.33M71.89 34.33L60.89 60.89M79.67 53.11L53.11 42.11M79.67 53.11L53.11 64.11M79.67 68.67L82.89 76.45M82.89 76.45L90.67 79.67M90.67 79.67L82.89 82.89M82.89 82.89L79.67 90.67M79.67 90.67L76.45 82.89M76.45 82.89L68.67 79.67M68.67 79.67L76.45 76.45M76.45 76.45L79.67 68.67M71.89 125.00L60.89 98.45M71.89 125.00L45.33 114.00M53.11 132.78L64.11 106.23M53.11 132.78L42.11 106.23M34.33 125.00L60.89 114.00M34.33 125.00L45.33 98.45M26.56 106.23L53.11 117.23M26.56 106.23L53.11 95.23M34.33 87.45L45.33 114.00M34.33 87.45L60.89 98.45M53.11 79.67L42.11 106.23M53.11 79.67L64.11 106.23M71.89 87.45L45.33 98.45M71.89 87.45L60.89 114.00M79.67 106.23L53.11 95.23M79.67 106.23L53.11 117.23M79.67 121.78L82.89 129.56M82.89 129.56L90.67 132.78M90.67 132.78L82.89 136.00M82.89 136.00L79.67 143.78M79.67 143.78L76.45 136.00M76.45 136.00L68.67 132.78M68.67 132.78L76.45 129.56M76.45 129.56L79.67 121.78M71.89 178.12L60.89 151.56M71.89 178.12L45.33 167.12M53.11 185.89L64.11 159.34M53.11 185.89L42.11 159.34M34.33 178.12L60.89 167.12M34.33 178.12L45.33 151.56M26.56 159.34L53.11 170.34M26.56 159.34L53.11 148.34M34.33 140.56L45.33 167.12M34.33 140.56L60.89 151.56M53.11 132.78L42.11 159.34M53.11 132.78L64.11 159.34M71.89 140.56L45.33 151.56M71.89 140.56L60.89 167.12M79.67 159.34L53.11 148.34M79.67 159.34L53.11 170.34M79.67 174.89L82.89 182.67M82.89 182.67L90.67 185.89M90.67 185.89L82.89 189.12M82.89 189.12L79.67 196.89M79.67 196.89L76.45 189.12M76.45 189.12L68.67 185.89M68.67 185.89L76.45 182.67M76.45 182.67L79.67 174.89M125.00 -87.45L114.00 -114.00M125.00 -87.45L98.45 -98.45M106.23 -79.67L117.23 -106.23M106.23 -79.67L95.23 -106.23M87.45 -87.45L114.00 -98.45M87.45 -87.45L98.45 -114.00M79.67 -106.23L106.23 -95.23M79.67 -106.23L106.23 -117.23M87.45 -125.00L98.45 -98.45M87.45 -125.00L114.00 -114.00M106.23 -132.78L95.23 -106.23M106.23 -132.78L117.23 -106.23M125.00 -125.00L98.45 -114.00M125.00 -125.00L114.00 -98.45M132.78 -106.23L106.23 -117.23M132.78 -106.23L106.23 -95.23M132.78 -90.67L136.00 -82.89M136.00 -82.89L143.78 -79.67M143.78 -79.67L136.00 -76.45M136.00 -76.45L132.78 -68.67M132.78 -68.67L129.56 -76.45M129.56 -76.45L121.78 -79.67M121.78 -79.67L129.56 -82.89M129.56 -82.89L132.78 -90.67M125.00 -34.33L114.00 -60.89M125.00 -34.33L98.45 -45.33M106.23 -26.56L117.23 -53.11M106.23 -26.56L95.23 -53.11M87.45 -34.33L114.00 -45.33M87.45 -34.33L98.45 -60.89M79.67 -53.11L106.23 -42.11M79.67 -53.11L106.23 -64.11M87.45 -71.89L98.45 -45.33M87.45 -71.89L114.00 -60.89M106.23 -79.67L95.23 -53.11M106.23 -79.67L117.23 -53.11M125.00 -71.89L98.45 -60.89M125.00 -71.89L114.00 -45.33M132.78 -53.11L106.23 -64.11M132.78 -53.11L106.23 -42.11M132.78 -37.56L136.00 -29.78M136.00 -29.78L143.78 -26.56M143.78 -26.56L136.00 -23.33M136.00 -23.33L132.78 -15.56M132.78 -15.56L129.56 -23.33M129.56 -23.33L121.78 -26.56M121.78 -26.56L129.56 -29.78M129.56 -29.78L132.78 -37.56M125.00 18.78L114.00 -7.78M125.00 18.78L98.45 7.78M106.23 26.56L117.23 0.00M106.23 26.56L95.23 0.00M87.45 18.78L114.00 7.78M87.45 18.78L98.45 -7.78M79.67 0.00L106.23 11.00M79.67 0.00L106.23 -11.00M87.45 -18.78L98.45 7.78M87.45 -18.78L114.00 -7.78M106.23 -26.56L95.23 -0.00M106.23 -26.56L117.23 -0.00M125.00 -18.78L98.45 -7.78M125.00 -18.78L114.00 7.78M132.78 -0.00L106.23 -11.00M132.78 -0.00L106.23 11.00M132.78 15.56L136.00 23.33M136.00 23.33L143.78 26.56M143.78 26.56L136.00 29.78M136.00 29.78L132.78 37.56M132.78 37.56L129.56 29.78M129.56 29.78L121.78 26.56M121.78 26.56L129.56 23.33M129.56 23.33L132.78 15.56M125.00 71.89L114.00 45.33M125.00 71.89L98.45 60.89M106.23 79.67L117.23 53.11M106.23 79.67L95.23 53.11M87.45 71.89L114.00 60.89M87.45 71.89L98.45 45.33M79.67 53.11L106.23 64.11M79.67 53.11L106.23 42.11M87.45 34.33L98.45 60.89M87.45 34.33L114.00 45.33M106.23 26.56L95.23 53.11M106.23 26.56L117.23 53.11M125.00 34.33L98.45 45.33M125.00 34.33L114.00 60.89M132.78 53.11L106.23 42.11M132.78 53.11L106.23 64.11M132.78 68.67L136.00 76.45M136.00 76.45L143.78 79.67M143.78 79.67L136.00 82.89M136.00 82.89L132.78 90.67M132.78 90.67L129.56 82.89M129.56 82.89L121.78 79.67M121.78 79.67L129.56 76.45M129.56 76.45L132.78 68.67M125.00 125.00L114.00 98.45M125.00 125.00L98.45 114.00M106.23 132.78L117.23 106.23M106.23 132.78L95.23 106.23M87.45 125.00L114.00 114.00M87.45 125.00L98.45 98.45M79.67 106.23L106.23 117.23M79.67 106.23L106.23 95.23M87.45 87.45L98.45 114.00M87.45 87.45L114.00 98.45M106.23 79.67L95.23 106.23M106.23 79.67L117.23 106.23M125.00 87.45L98.45 98.45M125.00 87.45L114.00 114.00M132.78 106.23L106.23 95.23M132.78 106.23L106.23 117.23M132.78 121.78L136.00 129.56M136.00 129.56L143.78 132.78M143.78 132.78L136.00 136.00M136.00 136.00L132.78 143.78M132.78 143.78L129.56 136.00M129.56 136.00L121.78 132.78M121.78 132.78L129.56 129.56M129.56 129.56L132.78 121.78M125.00 178.12L114.00 151.56M125.00 178.12L98.45 167.12M106.23 185.89L117.23 159.34M106.23 185.89L95.23 159.34M87.45 178.12L114.00 167.12M87.45 178.12L98.45 151.56M79.67 159.34L106.23 170.34M79.67 159.34L106.23 148.34M87.45 140.56L98.45 167.12M87.45 140.56L114.00 151.56M106.23 132.78L95.23 159.34M106.23 132.78L117.23 159.34M125.00 140.56L98.45 151.56M125.00 140.56L114.00 167.12M132.78 159.34L106.23 148.34M132.78 159.34L106.23 170.34M132.78 174.89L136.00 182.67M136.00 182.67L143.78 185.89M143.78 185.89L136.00 189.12M136.00 189.12L132.78 196.89M132.78 196.89L129.56 189.12M129.56 189.12L121.78 185.89M121.78 185.89L129.56 182.67M129.56 182.67L132.78 174.89M178.12 -87.45L167.12 -114.00M178.12 -87.45L151.56 -98.45M159.34 -79.67L170.34 -106.23M159.34 -79.67L148.34 -106.23M140.56 -87.45L167.12 -98.45M140.56 -87.45L151.56 -114.00M132.78 -106.23L159.34 -95.23M132.78 -106.23L159.34 -117.23M140.56 -125.00L151.56 -98.45M140.56 -125.00L167.12 -114.00M159.34 -132.78L148.34 -106.23M159.34 -132.78L170.34 -106.23M178.12 -125.00L151.56 -114.00M178.12 -125.00L167.12 -98.45M185.89 -106.23L159.34 -117.23M185.89 -106.23L159.34 -95.23M185.89 -90.67L189.12 -82.89M189.12 -82.89L196.89 -79.67M196.89 -79.67L189.12 -76.45M189.12 -76.45L185.89 -68.67M185.89 -68.67L182.67 -76.45M182.67 -76.45L174.89 -79.67M174.89 -79.67L182.67 -82.89M182.67 -82.89L185.89 -90.67M178.12 -34.33L167.12 -60.89M178.12 -34.33L151.56 -45.33M159.34 -26.56L170.34 -53.11M159.34 -26.56L148.34 -53.11M140.56 -34.33L167.12 -45.33M140.56 -34.33L151.56 -60.89M132.78 -53.11L159.34 -42.11M132.78 -53.11L159.34 -64.11M140.56 -71.89L151.56 -45.33M140.56 -71.89L167.12 -60.89M159.34 -79.67L148.34 -53.11M159.34 -79.67L170.34 -53.11M178.12 -71.89L151.56 -60.89M178.12 -71.89L167.12 -45.33M185.89 -53.11L159.34 -64.11M185.89 -53.11L159.34 -42.11M185.89 -37.56L189.12 -29.78M189.12 -29.78L196.89 -26.56M196.89 -26.56L189.12 -23.33M189.12 -23.33L185.89 -15.56M185.89 -15.56L182.67 -23.33M182.67 -23.33L174.89 -26.56M174.89 -26.56L182.67 -29.78M182.67 -29.78L185.89 -37.56M178.12 18.78L167.12 -7.78M178.12 18.78L151.56 7.78M159.34 26.56L170.34 0.00M159.34 26.56L148.34 0.00M140.56 18.78L167.12 7.78M140.56 18.78L151.56 -7.78M132.78 0.00L159.34 11.00M132.78 0.00L159.34 -11.00M140.56 -18.78L151.56 7.78M140.56 -18.78L167.12 -7.78M159.34 -26.56L148.34 -0.00M159.34 -26.56L170.34 -0.00M178.12 -18.78L151.56 -7.78M178.12 -18.78L167.12 7.78M185.89 -0.00L159.34 -11.00M185.89 -0.00L159.34 11.00M185.89 15.56L189.12 23.33M189.12 23.33L196.89 26.56M196.89 26.56L189.12 29.78M189.12 29.78L185.89 37.56M185.89 37.56L182.67 29.78M182.67 29.78L174.89 26.56M174.89 26.56L182.67 23.33M182.67 23.33L185.89 15.56M178.12 71.89L167.12 45.33M178.12 71.89L151.56 60.89M159.34 79.67L170.34 53.11M159.34 79.67L148.34 53.11M140.56 71.89L167.12 60.89M140.56 71.89L151.56 45.33M132.78 53.11L159.34 64.11M132.78 53.11L159.34 42.11M140.56 34.33L151.56 60.89M140.56 34.33L167.12 45.33M159.34 26.56L148.34 53.11M159.34 26.56L170.34 53.11M178.12 34.33L151.56 45.33M178.12 34.33L167.12 60.89M185.89 53.11L159.34 42.11M185.89 53.11L159.34 64.11M185.89 68.67L189.12 76.45M189.12 76.45L196.89 79.67M196.89 79.67L189.12 82.89M189.12 82.89L185.89 90.67M185.89 90.67L182.67 82.89M182.67 82.89L174.89 79.67M174.89 79.67L182.67 76.45M182.67 76.45L185.89 68.67M178.12 125.00L167.12 98.45M178.12 125.00L151.56 114.00M159.34 132.78L170.34 106.23M159.34 132.78L148.34 106.23M140.56 125.00L167.12 114.00M140.56 125.00L151.56 98.45M132.78 106.23L159.34 117.23M132.78 106.23L159.34 95.23M140.56 87.45L151.56 114.00M140.56 87.45L167.12 98.45M159.34 79.67L148.34 106.23M159.34 79.67L170.34 106.23M178.12 87.45L151.56 98.45M178.12 87.45L167.12 114.00M185.89 106.23L159.34 95.23M185.89 106.23L159.34 117.23M185.89 121.78L189.12 129.56M189.12 129.56L196.89 132.78M196.89 132.78L189.12 136.00M189.12 136.00L185.89 143.78M185.89 143.78L182.67 136.00M182.67 136.00L174.89 132.78M174.89 132.78L182.67 129.56M182.67 129.56L185.89 121.78M178.12 178.12L167.12 151.56M178.12 178.12L151.56 167.12M159.34 185.89L170.34 159.34M159.34 185.89L148.34 159.34M140.56 178.12L167.12 167.12M140.56 178.12L151.56 151.56M132.78 159.34L159.34 170.34M132.78 159.34L159.34 148.34M140.56 140.56L151.56 167.12M140.56 140.56L167.12 151.56M159.34 132.78L148.34 159.34M159.34 132.78L170.34 159.34M178.12 140.56L151.56 151.56M178.12 140.56L167.12 167.12M185.89 159.34L159.34 148.34M185.89 159.34L159.34 170.34M185.89 174.89L189.12 182.67M189.12 182.67L196.89 185.89M196.89 185.89L189.12 189.12M189.12 189.12L185.89 196.89M185.89 196.89L182.67 189.12M182.67 189.12L174.89 185.89M174.89 185.89L182.67 182.67M182.67 182.67L185.89 174.89%27 fill=%27none%27 stroke=%27%23000%27 stroke-width=%271.4%27 stroke-linecap=%27round%27/%3E%3C/svg%3E"); }
/* ---------- Taustakuvio (Masjidbox-tyylinen ruusuke) moskeijan korostusvärillä ----------
   Vaalea pohja + hehku + kuvio seuraavat teemaa (--kulta, --kulta-vaalea). */
.u-alku, .u-sivuhero {
  position: relative; isolation: isolate;
  background:
    radial-gradient(70% 60% at 50% 0%, color-mix(in srgb, var(--kulta) 28%, transparent), transparent 70%),
    linear-gradient(color-mix(in srgb, var(--kulta-vaalea) 40%, #fff), #fff);
}
.u-alku::after, .u-sivuhero::after, .u-nosto::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: var(--kulta); opacity: .16;
  -webkit-mask: var(--kuvio-yla, var(--kuvio-oletus)) center top / auto repeat; mask: var(--kuvio-yla, var(--kuvio-oletus)) center top / auto repeat;
}
.u-nosto { isolation: isolate; overflow: hidden; background: var(--kulta-vaalea); }

/* Sama ruusukekuvio muihin kuviollisiin kohtiin (lahjoitus, alapalkki, lasten opetus) */
.u-kuvio { -webkit-mask: var(--kuvio-oletus) center top / auto repeat; mask: var(--kuvio-oletus) center top / auto repeat; background: var(--kulta); }
.u-lahjoitus .u-kuvio { opacity: .1; }
.u-ala .u-kuvio { display: block; opacity: .05; }
/* Kuvagalleria: puhelimella kaksi saraketta */
.u-galleria { grid-template-columns: repeat(auto-fill, minmax(min(46%, 220px), 1fr)); }
.u-galleria a { display: block; overflow: hidden; border-radius: var(--r-s); }
@media (max-width: 699px) { .u-galleria a:last-child:nth-child(odd) { grid-column: 1 / -1; } .u-galleria a:last-child:nth-child(odd) img { aspect-ratio: 2 / 1; } }
.u-galleria img { transition: transform .3s; }
.u-galleria a:hover img { transform: scale(1.03); }

/* Moskeija ilman logoa: nimi tekstinä */
.u-logo__nimi { text-decoration: none; display: flex; align-items: center; min-height: 44px; max-width: 14em; font: 800 17px/1.15 var(--fo); color: var(--paa); }
.u-ala__nimi { margin: 0; font: 800 20px/1.2 var(--fo); color: #fff; }
.u-logo { text-decoration: none; }
.u-artikkeli__kielet:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
/* Seuraava rukous: nimi ja aika aina samalla rivillä (myös "Maghrib 16:12") */
.u-seur__paa { flex-wrap: nowrap; white-space: nowrap; }
.u-seur__nimi, .u-seur__klo { font-size: clamp(22px, 7vw, 30px); }
.u-ala__somet { flex-wrap: wrap; row-gap: 10px; }

/* ---------- YouTube ja Telegram ---------- */
.u-yt__logo { background: #ff0033; color: #fff; }
.u-tg__logo { background: #27a7e7; color: #fff; }
.u-yt__ruudukko { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
@media (max-width: 699px) { .u-yt__ruudukko li:nth-child(n+5) { display: none; } }
@media (min-width: 900px) { .u-yt__ruudukko { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 20px; } }
.u-yt__video { display: grid; gap: 6px; width: 100%; padding: 0; border: 0; background: none; text-align: start; color: inherit; font: inherit; cursor: pointer; }
.u-yt__kuva { position: relative; display: block; overflow: hidden; border-radius: var(--r-s); aspect-ratio: 16 / 9; background: var(--kulta-vaalea); }
.u-yt__kuva img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.u-yt__video:hover .u-yt__kuva img { transform: scale(1.03); }
.u-yt__toista { position: absolute; inset: 0; margin: auto; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgb(0 0 0 / .6); color: #fff; }
.u-yt__otsikko { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font: 700 14.5px/1.3 var(--ft); color: var(--paa); }
.u-yt__pvm { font-size: 13px; color: var(--hieno); }
.u-ikkuna--video .u-ikkuna__sisalto { width: min(960px, 100%); background: #000; }
.u-yt__soitin { aspect-ratio: 16 / 9; width: 100%; }
.u-yt__soitin iframe { width: 100%; height: 100%; border: 0; display: block; }

.u-tg__lista { list-style: none; margin: 0; padding: 0 0 6px; display: grid; grid-auto-flow: column; grid-auto-columns: min(82%, 300px); gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.u-tg__lista li { scroll-snap-align: start; }
@media (min-width: 900px) { .u-tg__lista { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; } }
.u-tg__julkaisu { display: flex; flex-direction: column; height: 100%; overflow: hidden; background: var(--pinta); border: 1px solid var(--raja); border-radius: var(--r-m); color: inherit; text-decoration: none; transition: border-color .15s, transform .15s; }
.u-tg__julkaisu:hover { border-color: var(--kulta); transform: translateY(-2px); }
.u-tg__julkaisu img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.u-tg__teksti { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; margin: 12px 14px 0; font-size: 14.5px; line-height: 1.45; color: var(--teksti); }
.u-tg__ala { display: flex; justify-content: space-between; gap: 8px; margin-top: auto; padding: 12px 14px; font-size: 13px; color: var(--hieno); }
.u-tg__ala span { font-weight: 700; color: var(--kulta-teksti); }

/* ---------- Seuraa meitä (somet välilehdillä) ---------- */
.u-somet__valilehdet { display: flex; gap: 6px; margin-bottom: 16px; padding: 4px; border-radius: var(--kulma, 999px); background: var(--kulta-vaalea); overflow-x: auto; scrollbar-width: none; }
.u-somet__valilehdet::-webkit-scrollbar { display: none; }
.u-somet__valilehdet [role="tab"] {
  flex: 1 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 8px 16px;
  border: 0; border-radius: var(--kulma, 999px); background: transparent; color: var(--hieno); font: 700 15px/1 var(--ft); cursor: pointer; transition: background-color .15s, color .15s;
}
.u-somet__valilehdet [role="tab"][aria-selected="true"] { background: var(--pinta); color: var(--paa); box-shadow: 0 1px 3px rgb(0 0 0 / .1); }
.u-somet__valilehdet [role="tab"]:hover { color: var(--paa); }
.u-somet__paneeli[hidden] { display: none; }
.u-somepaneeli__nappi { display: flex; width: fit-content; margin: 16px auto 0; }
.u-somet__muut { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 14px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--raja); color: var(--hieno); font-size: 15px; }
.u-somet__linkit { display: flex; flex-wrap: wrap; gap: 8px; }
.u-somet__linkit a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--raja); background: var(--pinta); color: var(--paa); transition: border-color .15s, background-color .15s; }
.u-somet__linkit a:hover { border-color: var(--kulta); background: var(--kulta-vaalea); }
@media (max-width: 599px) { .u-somet__valilehdet [role="tab"] { padding-inline: 10px; font-size: 14px; } }

/* ---------- Etusivun yläosan tausta: kuvio (oletus), oma kuva tai pääväri (alku.tausta) ---------- */
.u-alku--kuva { background: linear-gradient(180deg, rgb(0 0 0 / .42), rgb(0 0 0 / .66)), var(--alku-kuva) center / cover no-repeat; }
.u-alku--vari { background: radial-gradient(70% 60% at 50% 0%, color-mix(in srgb, var(--kulta) 32%, transparent), transparent 70%), var(--paa); }
.u-alku--kuva::after { content: none; }
.u-alku--vari::after { opacity: .14; }
:is(.u-alku--kuva, .u-alku--vari) h1 { color: #fff; }
.u-alku--kuva h1, .u-alku--kuva .u-alku__esittely { text-shadow: 0 1px 12px rgb(0 0 0 / .35); }
:is(.u-alku--kuva, .u-alku--vari) .u-alku__esittely { color: rgb(255 255 255 / .88); }
:is(.u-alku--kuva, .u-alku--vari) .u-alku__tunniste { background: rgb(255 255 255 / .12); border-color: rgb(255 255 255 / .38); color: #fff; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
:is(.u-alku--kuva, .u-alku--vari) .u-alku__tunniste span[data-l] { color: #fff; }
:is(.u-alku--kuva, .u-alku--vari) .u-alku__napit .u-nappi--reuna { background: rgb(255 255 255 / .1); color: #fff; border-color: rgb(255 255 255 / .5); }
:is(.u-alku--kuva, .u-alku--vari) .u-alku__napit .u-nappi--reuna:hover { background: rgb(255 255 255 / .2); }

/* ---------- Omat sivut (_sivut/): teksti ja linkkikortit (kirjat, lähteet …) ---------- */
.u-omasivu { display: grid; gap: 20px; }
.u-omasivu__kuva { width: 100%; max-height: 420px; object-fit: cover; border-radius: var(--r-m); }
.u-linkit { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
@media (min-width: 768px) { .u-linkit { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.u-linkkikortti { display: flex; align-items: center; gap: 14px; height: 100%; padding: 16px 18px; color: inherit; text-decoration: none; transition: border-color .2s, transform .2s; }
.u-linkkikortti:hover { border-color: var(--kulta); transform: translateY(-1px); }
.u-linkkikortti__teksti { display: grid; gap: 2px; flex: 1; min-width: 0; }
.u-linkkikortti__teksti strong { font-family: var(--fo); color: var(--paa); }
.u-linkkikortti__teksti small { color: var(--hieno); font-size: 14px; }
.u-linkkikortti__nuoli { color: var(--kulta-teksti); flex: none; }

/* ---------- Artikkelit ---------- */
.u-artikkelit__haku { display: grid; gap: 14px; margin-bottom: 22px; }
.u-hakukentta { display: flex; align-items: center; gap: 10px; padding: 0 16px; min-height: 52px; background: var(--pinta); border: 1px solid var(--raja); border-radius: var(--kulma, 999px); color: var(--hieno); box-shadow: var(--varjo-1); }
.u-hakukentta:focus-within { border-color: var(--kulta); outline: 2px solid color-mix(in srgb, var(--kulta) 40%, transparent); outline-offset: 1px; }
.u-hakukentta input { flex: 1; min-width: 0; border: 0; background: none; font: inherit; font-size: 16px; color: var(--teksti); padding: 12px 0; outline: none; }
/* Aiheet riveinä: kaikki näkyvät kerralla, ei sivuttaisvetoa */
.u-aiheet { display: flex; flex-wrap: wrap; gap: 6px; }
@media (max-width: 599px) { .u-aihe { min-height: 36px; padding: 6px 12px; font-size: 14px; } }
.u-aihe small { margin-inline-start: 4px; font-weight: 500; opacity: .65; }
.u-aihe { flex: none; min-height: 40px; padding: 8px 14px; border: 1px solid var(--raja); border-radius: var(--kulma, 999px); background: var(--pinta); color: var(--paa); font: 600 14px/1.2 var(--ft); cursor: pointer; white-space: nowrap; }
.u-aihe[aria-pressed="true"] { background: var(--paa); border-color: var(--paa); color: #fff; }
.u-artikkelilista { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
@media (min-width: 768px) { .u-artikkelilista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .u-artikkelilista:not(.u-artikkelilista--pieni) { grid-template-columns: repeat(3, minmax(0, 1fr)); } .u-artikkelilista--pieni { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.u-artikkelikortti[hidden] { display: none; }
.u-artikkelikortti > a { display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 18px 20px; color: inherit; text-decoration: none; transition: border-color .2s, transform .2s; }
.u-artikkelikortti > a:hover { border-color: var(--kulta); transform: translateY(-2px); }
.u-artikkelikortti__yla { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--hieno); }
.u-artikkelikortti__aihe { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--kulta-teksti); font-weight: 700; }
.u-artikkelikortti strong { font: 700 clamp(17px, 2.2vw, 19px)/1.3 var(--fo); color: var(--paa); }
.u-artikkelikortti__kuvaus { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; color: var(--hieno); font-size: 15px; line-height: 1.55; }
.u-artikkelikortti__ala { display: flex; justify-content: space-between; margin-top: auto; padding-top: 6px; font-size: 13px; font-weight: 600; color: var(--kulta-teksti); }
.u-artikkelit__lisaa { display: flex; justify-content: center; margin-top: 22px; }
.u-artikkelit__lisaa .u-nappi[hidden] { display: none; }
.u-artikkelihero h1 { max-width: 22em; font-size: clamp(28px, 6vw, 46px); }
.u-artikkeli__kieli:empty { display: none; }
.u-artikkeli__kieli { margin: 0 0 12px; font-size: 14px; color: var(--hieno); }
.u-artikkeli__kuva { width: 100%; border-radius: var(--r-m); margin-bottom: 18px; }
.u-artikkeli--pitka .u-proosa { font-size: 17px; line-height: 1.75; }
.u-artikkeli--pitka .u-proosa p[dir="auto"]:lang(fi) { text-align: start; }
.u-artikkeli--pitka .u-proosa a { color: var(--kulta-teksti); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.u-lahdemerkinta { display: flex; gap: 14px; align-items: flex-start; margin-top: 16px; padding: 18px 20px; background: var(--kulta-vaalea); }
.u-lahdemerkinta p { margin: 0 0 6px; }
.u-lahdemerkinta__pieni { font-size: 13px; color: var(--hieno); }
.u-osio--tiivis { padding-block: 32px 0; }
/* Arabiankieliset kappaleet artikkeleissa (Koraanin jakeet): Amiri tukee Koraanin merkkejä */
.u-artikkeli--pitka .u-proosa [lang="ar"] { font-family: "Amiri", "IBM Plex Sans Arabic", serif; font-size: 1.3em; line-height: 2.1; text-align: right; color: var(--paa); }
.u-artikkeli__kieli [data-l="fi"] { display: none; }
/* Työpöydän valikko: ei rivitystä; kapeammalla näytöllä tiiviimmin */
.u-nav a { white-space: nowrap; }
@media (min-width: 1024px) and (max-width: 1279px) {
  .u-nav a { padding: 10px 8px; font-size: 14px; }
  .u-yla__lahjoita { padding-inline: 14px; }
}

/* Luonnos: palkki ylhäällä, kunnes moskeija hyväksyy sivun (luonnos: false) */
.u-luonnos { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 8px 16px; background: #fff4d6; border-bottom: 1px solid #f0d58a; color: #6b4e00; font: 600 14px/1.35 var(--ft); text-align: center; }
.u-luonnos svg { flex: none; }

/* Rukousaikasivu: Seuraava rukous ja päivän taulukko yhtenä korttina */
.u-rukouskortti { overflow: hidden; border-radius: var(--kulma, 24px); background: var(--pinta); box-shadow: 0 0 0 1px var(--raja), 0 18px 40px -22px oklch(30% .045 55 / .35); }
.u-rukouskortti .u-seur { width: 100%; margin: 0; border-radius: 0; box-shadow: none; }
.u-rukouskortti .rk { margin-top: 0 !important; border-radius: 0; box-shadow: none; }

/* ---------- Esikatselu (/esikatselu/): värit ja tausta kokeiltavaksi ---------- */
.u-esik { display: grid; gap: 24px; align-items: start; }
@media (min-width: 1000px) { .u-esik { grid-template-columns: minmax(0, 1fr) 400px; } .u-esik__puhelin { position: sticky; top: calc(var(--yla) + 16px); } }
.u-esik h2 { margin: 0 0 10px; font-size: 20px; }
.u-esik__valinnat { display: grid; gap: 14px; }
.u-esik__varit { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin-bottom: 10px; }
.u-esik__vari, .u-esik__tausta { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 8px 12px; border: 2px solid var(--raja); border-radius: var(--kulma, 14px); background: var(--pinta); font: 600 14px/1.25 var(--ft); color: var(--paa); text-align: start; cursor: pointer; }
.u-esik__vari[aria-pressed="true"], .u-esik__tausta[aria-pressed="true"] { border-color: var(--paa); box-shadow: 0 0 0 3px var(--kulta-vaalea); }
.u-esik__nayte { flex: none; width: 34px; height: 34px; border-radius: 50%; background: conic-gradient(var(--a) 0 50%, var(--b) 50% 80%, var(--c) 80% 100%); box-shadow: inset 0 0 0 1px rgb(0 0 0 / .08); }
.u-esik__taustat { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.u-esik__tausta { flex-direction: column; align-items: flex-start; gap: 2px; }
.u-esik__tausta small { font-weight: 500; color: var(--hieno); font-size: 12.5px; }
.u-esik__tausta:disabled { opacity: .5; cursor: not-allowed; }
.u-esik__ohje { padding: 14px 18px; border-radius: var(--kulma, 16px); background: var(--kulta-vaalea); font-size: 15px; }
.u-esik__ohje p, .u-esik__ohje ol { margin: 0; } .u-esik__ohje ol { padding-inline-start: 20px; margin-top: 6px; }
.u-esik__puhelin { justify-self: center; width: min(100%, 400px); padding: 10px; border-radius: var(--kulma, 34px); background: #1b1b1b; box-shadow: var(--varjo-2); }
.u-esik__puhelin iframe { display: block; width: 100%; height: min(78vh, 760px); border: 0; border-radius: var(--kulma, 26px); background: #fff; }
@media (max-width: 599px) { .u-esik__taustat { grid-template-columns: 1fr; } }
.u-esik__nayte--nyt { background: conic-gradient(var(--paa) 0 50%, var(--kulta) 50% 80%, var(--kulta-vaalea) 80% 100%); }

/* ---------------- Etusivun omat osiot (hallintapaneeli → Etusivun osiot) ---------------- */
.u-tekstiosio { display: grid; gap: 28px; align-items: center; }
.u-tekstiosio__teksti h2 { margin-bottom: 14px; }
.u-tekstiosio__teksti .u-napit { margin-top: 20px; }
.u-tekstiosio__kuva { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-l); box-shadow: var(--varjo-1); }
@media (min-width: 860px) {
  .u-tekstiosio--kuva { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 48px; }
  .u-tekstiosio--vasen .u-tekstiosio__kuva { order: -1; }
}
.u-tekstiosio--vaalea, .u-tekstiosio--vari { padding: clamp(24px, 5vw, 48px); border-radius: var(--r-l); }
.u-tekstiosio--vaalea { background: var(--kulta-vaalea); }
.u-tekstiosio--vari { background: var(--paa); color: #fff; }
.u-tekstiosio--vari h2 { color: #fff; }
.u-tekstiosio--vari .u-proosa { color: rgb(255 255 255 / .86); }
.u-tekstiosio--vari .u-proosa a { color: var(--kulta); }

.u-ilmoitusosio { display: flex; gap: 16px; align-items: flex-start; padding: clamp(20px, 4vw, 32px); border-radius: var(--r-l); background: var(--kulta-vaalea); border: 1.5px solid color-mix(in srgb, var(--kulta) 55%, transparent); }
.u-ilmoitusosio .u-ikoni { flex: none; }
.u-ilmoitusosio h2 { font-size: clamp(20px, 3.2vw, 26px); margin-bottom: 8px; }
.u-ilmoitusosio--tarkea { background: var(--paa); border-color: var(--paa); color: #fff; }
.u-ilmoitusosio--tarkea h2 { color: #fff; }
.u-ilmoitusosio--tarkea .u-proosa { color: rgb(255 255 255 / .88); }
.u-ilmoitusosio--tarkea .u-linkki { color: var(--kulta); }

.u-video { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--r-l); background: #000; box-shadow: var(--varjo-1); }
.u-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.u-video__teksti { margin-top: 16px; }

.u-ukk { display: grid; gap: 10px; }
.u-ukk details { padding: 0; overflow: hidden; }
.u-ukk summary { display: flex; justify-content: space-between; gap: 12px; align-items: center; min-height: 56px; padding: 14px 20px; font-weight: 700; color: var(--teksti); cursor: pointer; list-style: none; }
.u-ukk summary::-webkit-details-marker { display: none; }
.u-ukk summary::after { content: "+"; flex: none; font-size: 22px; line-height: 1; color: var(--kulta-teksti); transition: transform .2s; }
.u-ukk details[open] summary::after { transform: rotate(45deg); }
.u-ukk .u-proosa { padding: 0 20px 18px; }

/* Koko sivuston ilmoituspalkki */
.u-ilmoituspalkki { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 10px; padding: 10px 16px; background: var(--kulta); color: var(--paa-tumma); font-weight: 700; font-size: 14.5px; text-align: center; }
.u-ilmoituspalkki a { color: inherit; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.u-ilmoituspalkki svg { flex: none; }

/* ---------- Kuviot alueittain: teema.kuvio_yla / kuvio_ala / kuvio_nosto (_data/kuviot.yml).
   Sivupohja asettaa muuttujat --kuvio-yla, --kuvio-ala ja --kuvio-nosto; oletuksena ruusuke. ---------- */
.u-nosto::after, .u-lahjoitus .u-kuvio { -webkit-mask-image: var(--kuvio-nosto, var(--kuvio-oletus)); mask-image: var(--kuvio-nosto, var(--kuvio-oletus)); }
.u-ala .u-kuvio { -webkit-mask-image: var(--kuvio-ala, var(--kuvio-oletus)); mask-image: var(--kuvio-ala, var(--kuvio-oletus)); }
.u-lomake__tapa .u-valinta span { display: inline-flex; align-items: center; gap: 6px; }

/* Upotukset napautuksesta (kartta, video) */
.u-upotus { display: grid; place-content: center; justify-items: center; gap: 6px; width: 100%; height: 100%; min-height: 260px; padding: 20px; border: 0; background: var(--kulta-vaalea); color: var(--paa); font: inherit; text-align: center; cursor: pointer; }
.u-upotus:hover .u-upotus__ikoni, .u-upotus:focus-visible .u-upotus__ikoni { transform: scale(1.06); }
.u-upotus__ikoni { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--paa); color: #fff; transition: transform .2s; }
.u-upotus strong { font-size: 16px; }
.u-upotus small { color: var(--hieno); font-size: 13px; }
.u-upotus--video { aspect-ratio: 16 / 9; min-height: 0; background: var(--paa-tumma); color: #fff; border-radius: inherit; }
.u-upotus--video small { color: rgb(255 255 255 / .7); }
.u-upotus--video .u-upotus__ikoni { background: #fff; color: var(--paa-tumma); width: 64px; height: 64px; }
.u-video .u-upotus { position: absolute; inset: 0; aspect-ratio: auto; }
.u-tietosuoja h2 { margin: 1.6em 0 .5em; font-size: 1.25rem; }

/* ---------- Ramadan ---------- */
.u-ramadan { margin: 28px 0; padding: 24px; background: var(--pinta); border: 1px solid var(--raja); border-radius: var(--r-l); box-shadow: var(--varjo-1); scroll-margin-top: calc(var(--yla) + 16px); }
.u-ramadan__yla { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.u-ramadan__yla > div { flex: 1; min-width: 200px; }
.u-ramadan__yla h2 { margin: 0; font: 700 clamp(22px, 3vw, 28px)/1.15 var(--fo); }
.u-ramadan__kuu { color: var(--kulta-teksti); background: var(--kulta-vaalea); width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; flex: none; }
.u-ramadan__tila { margin: 4px 0 0; color: var(--hieno); }
.u-ramadan__tila b { color: var(--teksti); }
.u-ramadan__tanaan { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin: 18px 0 4px; }
.u-ramadan__tanaan > div { background: var(--kulta-vaalea); border-radius: var(--r-m); padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; }
.u-ramadan__tanaan small { color: var(--hieno); font-weight: 600; }
.u-ramadan__tanaan b { font: 700 28px/1.1 var(--fo); font-variant-numeric: tabular-nums; }
.u-ramadan__tiedot { display: grid; gap: 8px; margin: 18px 0 0; }
.u-ramadan__tiedot > div { display: flex; gap: 12px; flex-wrap: wrap; padding: 10px 0; border-top: 1px solid var(--raja); }
.u-ramadan__tiedot dt { font-weight: 700; min-width: 150px; }
.u-ramadan__tiedot dd { margin: 0; flex: 1; min-width: 180px; }
.u-ramadan__teksti { margin-top: 12px; }
.u-ramadan__otsikko { margin: 22px 0 10px; font: 700 18px/1.3 var(--fo); }
.u-ramadan__taulu td, .u-ramadan__taulu th { font-variant-numeric: tabular-nums; }
.u-rm-lyhyt { display: inline-flex; align-items: center; gap: 10px; text-align: start; line-height: 1.4; margin-top: 12px; padding: 10px 16px; border-radius: var(--kulma, 999px); background: var(--kulta-vaalea); color: var(--paa-tumma); text-decoration: none; font-weight: 600; max-width: 100%; }
.u-rm-lyhyt b { font-variant-numeric: tabular-nums; white-space: nowrap; }
.u-rm-lyhyt > span[data-rm-tila] { flex: 1 1 auto; min-width: 0; }
.u-rm-lyhyt > .u-ikoni, .u-rm-lyhyt > .u-flip { flex: none; }
.u-rm-lyhyt:hover { background: color-mix(in srgb, var(--kulta-vaalea) 80%, var(--kulta)); }
@media (max-width: 560px) { .u-ramadan { padding: 18px 16px; } .u-ramadan__tanaan b { font-size: 24px; } }
@media print {
  html.u-tulosta-ramadan body > *:not(main), html.u-tulosta-ramadan main > *:not(.u-kehys), html.u-tulosta-ramadan .u-sivu > *:not(#ramadan), html.u-tulosta-ramadan .u-ramadan__tulosta, html.u-tulosta-ramadan .u-sivuhero { display: none !important; }
  html.u-tulosta-ramadan .u-ramadan { border: 0; box-shadow: none; margin: 0; padding: 0; }
  html.u-tulosta-ramadan .kk__kaari { overflow: visible; max-height: none; }
}

/* ---------- Kalenteritilaus ---------- */
.u-kalenteri { margin: 28px 0; padding: 22px; display: grid; gap: 16px; }
.u-kalenteri__yla { display: flex; gap: 14px; align-items: flex-start; }
.u-kalenteri__yla .u-ikoni { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--kulta-vaalea); color: var(--kulta-teksti); flex: none; }
.u-kalenteri h2 { margin: 0 0 4px; font: 700 20px/1.25 var(--fo); }
.u-kalenteri__yla p { margin: 0; color: var(--hieno); }
.u-kalenteri__valinnat { border: 0; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 8px; }
.u-kalenteri__valinta { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1.5px solid var(--raja); border-radius: var(--r-s); cursor: pointer; font-weight: 600; min-height: 48px; }
.u-kalenteri__valinta:has(input:checked) { border-color: var(--kulta); background: var(--kulta-vaalea); }
.u-kalenteri__valinta input { width: 20px; height: 20px; accent-color: var(--paa); flex: none; margin: 0; }
.u-kalenteri .u-nappi { white-space: normal; text-align: center; }
.u-kalenteri .u-pois { opacity: .45; }
.u-kalenteri__viesti { margin: 0; padding: 10px 14px; border-radius: var(--r-s); background: var(--kulta-vaalea); font-weight: 600; }
.u-kalenteri > .u-hieno { margin: 0; }
@media (max-width: 560px) { .u-kalenteri { padding: 18px 16px; } .u-kalenteri .u-napit .u-nappi { width: 100%; } }

/* ---------- Etusivun Ramadan-banneri ---------- */
.u-rmb { position: relative; overflow: hidden; color: #fff; padding: clamp(36px, 6vw, 72px) 0;
  background:
    radial-gradient(1.5px 1.5px at 12% 22%, rgb(255 255 255 / .8), transparent 60%),
    radial-gradient(1px 1px at 28% 68%, rgb(255 255 255 / .6), transparent 60%),
    radial-gradient(1.5px 1.5px at 46% 14%, rgb(255 255 255 / .7), transparent 60%),
    radial-gradient(1px 1px at 63% 78%, rgb(255 255 255 / .5), transparent 60%),
    radial-gradient(1.5px 1.5px at 74% 36%, rgb(255 255 255 / .7), transparent 60%),
    radial-gradient(1px 1px at 90% 62%, rgb(255 255 255 / .6), transparent 60%),
    radial-gradient(circle at 82% 18%, color-mix(in srgb, var(--kulta) 32%, transparent), transparent 42%),
    linear-gradient(160deg, color-mix(in srgb, var(--paa-tumma) 70%, #000) 0%, var(--paa-tumma) 55%, var(--paa) 100%); }
.u-rmb__kuu { position: absolute; width: clamp(150px, 22vw, 280px); height: auto; right: 3%; top: 18px; fill: var(--kulta); opacity: .13; transform: rotate(-12deg); pointer-events: none; }
.u-rmb__sisus { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.u-rmb__tunniste { margin: 0 0 10px; color: var(--kulta); font-weight: 700; letter-spacing: .04em; font-size: 15px; }
.u-rmb__tunniste [lang="ar"] { font-family: "Amiri", serif; font-size: 22px; letter-spacing: 0; }
.u-rmb .u-rmb__otsikko { margin: 0; font: 800 clamp(30px, 5vw, 52px)/1.08 var(--fo); letter-spacing: -.01em; color: #fff; }
.u-rmb__otsikko > span { display: block; }
.u-rmb__pv { display: block; margin-top: 6px; font-size: .55em; font-weight: 700; color: rgb(255 255 255 / .85); }
.u-rmb__kulta { color: var(--kulta); }
.u-rmb__lisa { margin: 12px 0 0; color: rgb(255 255 255 / .78); max-width: 46ch; }
.u-rmb__napit { margin-top: 24px; }
.u-rmb__paneeli { display: grid; gap: 12px; }
.u-rmb__ajat { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.u-rmb__aika, .u-rmb__laskuri { border-radius: var(--r-l); padding: 18px 20px; background: rgb(255 255 255 / .08); border: 1px solid rgb(255 255 255 / .14); backdrop-filter: blur(4px); }
.u-rmb__aika small, .u-rmb__laskuri small { display: block; color: rgb(255 255 255 / .75); font-weight: 600; font-size: 14px; }
.u-rmb__aika b { display: block; margin-top: 4px; font: 800 clamp(34px, 5vw, 48px)/1 var(--fo); font-variant-numeric: tabular-nums; color: #fff; }
.u-rmb__aika--seuraava { background: color-mix(in srgb, var(--kulta) 22%, transparent); border-color: color-mix(in srgb, var(--kulta) 70%, transparent); box-shadow: 0 0 0 1px color-mix(in srgb, var(--kulta) 40%, transparent), 0 18px 40px -20px var(--kulta); }
.u-rmb__aika--seuraava b { color: var(--kulta); }
.u-rmb__laskuri p { margin: 6px 0 0; display: flex; align-items: baseline; gap: 10px; }
.u-rmb__laskuri p b { font: 800 clamp(44px, 7vw, 72px)/1 var(--fo); font-variant-numeric: tabular-nums; color: var(--kulta); }
.u-rmb__laskuri p span { font-weight: 700; font-size: 18px; color: rgb(255 255 255 / .85); }
.u-rmb__laskuri--pieni p b { font-size: clamp(30px, 4.5vw, 40px); color: #fff; }
.u-rmb__tarawih { margin: 0; color: rgb(255 255 255 / .8); font-weight: 600; }
.u-rmb__tarawih b { color: #fff; }
@media (max-width: 820px) { .u-rmb__sisus { grid-template-columns: 1fr; } .u-rmb__kuu { right: -20px; top: 12px; width: 150px; } }
@media (prefers-reduced-motion: no-preference) { .u-rmb__aika--seuraava { animation: u-rmb-hehku 3s ease-in-out infinite; } }
@keyframes u-rmb-hehku { 50% { box-shadow: 0 0 0 1px color-mix(in srgb, var(--kulta) 60%, transparent), 0 18px 48px -14px var(--kulta); } }
/* Hero-rivi Ramadanin aikana: kultainen */
.u-rm-lyhyt { background: color-mix(in srgb, var(--kulta) 30%, var(--pinta)); border: 1px solid color-mix(in srgb, var(--kulta) 60%, transparent); }
.u-rmb__eid small + small { margin-top: 6px; }
.u-rmb__eid-ar { margin: 0; font: 700 clamp(44px, 6vw, 64px)/1.2 "Amiri", serif; color: var(--kulta); text-align: center; }

/* Rukousaikojen lähde (Masjidboxin ehto: maininta ja Ilmoita virheestä -linkki aikojen yhteydessä) */
.u-rukouslahde { margin: 8px 0 0; font-size: 13px; color: var(--hieno); }
.u-rukouslahde a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.u-seur__lahde { padding: 0 20px 10px; margin: 0; }
.u-rmb__lahde { color: rgb(255 255 255 / .65); margin: 2px 0 0; }