/* /skolotajiem jaunajā dizainā „Pakāpienu sala”: divi ceļi (MI kurss, skolotāju katalogs) no viena nolaukuma.
   Lieto sala/diag_base.html (sala.css, iso.css, sala-parbaude.css). Viss tikai zem .sk-lapa, lai neietekmētu citas lapas. */

/* Platāka lapa nekā pārbaudes ceļam (tur 760px). */
.sp-wrap:has(.sk-lapa) { max-width: 1160px; }
main.sp-main.sk-lapa { max-width: none; width: 100%; }

.sk-lapa { --sk-gap: clamp(2.5rem, 1.5rem + 4vw, 5.5rem); }
.sk-lapa > section { margin-top: var(--sk-gap); scroll-margin-top: 6.5rem; }
.sk-lapa > section:first-child { margin-top: 0; }
.sk-lapa h4 { font-family: var(--f-display); font-weight: 700; font-size: 1.1rem; line-height: 1.15; }

/* ---------- Vārti: teksts + izometriskā sala ar divām terasēm */
.sk-varti { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(1.5rem, 1rem + 2vw, 3rem); align-items: center; }
.sk-varti h1 { font-size: clamp(2.4rem, 1.4rem + 4vw, 4.6rem); max-width: 12ch; }
.sk-lead { font-size: var(--t-m); line-height: 1.45; max-width: 36ch; }

/* Īsumā: grāmatvedības rinda ar rokrakstu (kā sākumlapas .ledger). */
.sj-atbildes { margin-top: calc(var(--u) * 3); border-top: 2px solid var(--c-fg); }
.sj-atbildes h2 { font-family: var(--f-hand); font-weight: 600; font-size: 1.6rem; letter-spacing: 0; line-height: 1; margin: .7rem 0 .2rem; rotate: -1.5deg; width: max-content; }
.sj-atbildes dl > div { display: grid; grid-template-columns: 8.5rem 1fr; gap: .8rem; padding: .6rem 0; border-bottom: 1px solid var(--c-line); align-items: baseline; font-size: var(--t-s); line-height: 1.45; }
.sj-atbildes dt { font-weight: 800; }
.sj-atbildes dd { margin: 0; }

.sk-varti__sala { position: relative; margin: 0; }
.sk-iso { width: 100%; height: auto; overflow: visible; }
.sk-iso polygon { stroke: #30233D; stroke-width: 1.6; stroke-linejoin: round; }
.sk-iso__nol .f-top { fill: #FFFDE9; } .sk-iso__nol .f-left { fill: #C6B9EC; } .sk-iso__nol .f-right { fill: #9C8AD6; }
.sk-iso__solis .f-top { fill: #FFFDE9; } .sk-iso__solis .f-left { fill: #C6B9EC; } .sk-iso__solis .f-right { fill: #9C8AD6; }
.sk-iso__terase--kurss .f-top { fill: #FFD9CB; } .sk-iso__terase--kurss .f-left { fill: #FF683B; } .sk-iso__terase--kurss .f-right { fill: #E0532A; }
.sk-iso__terase--katalogs .f-top { fill: #FDF196; } .sk-iso__terase--katalogs .f-left { fill: #C6B9EC; } .sk-iso__terase--katalogs .f-right { fill: #9C8AD6; }
.sk-iso__gr--coral .f-top { fill: #FF683B; } .sk-iso__gr--coral .f-left { fill: #E0532A; } .sk-iso__gr--coral .f-right { fill: #C9461F; }
.sk-iso__gr--cream .f-top { fill: #FFFDE9; } .sk-iso__gr--cream .f-left { fill: #EFEAD0; } .sk-iso__gr--cream .f-right { fill: #DDD7BB; }
.sk-iso__gr--lav .f-top { fill: #C6B9EC; } .sk-iso__gr--lav .f-left { fill: #9C8AD6; } .sk-iso__gr--lav .f-right { fill: #7E6BC0; }
.sk-iso__karogs line { stroke: #30233D; stroke-width: 3; stroke-linecap: round; }
.sk-iso__karogs polygon { fill: #FF683B; }
.sk-iso__nos { font-family: var(--f-hand); font-weight: 600; font-size: 26px; fill: #30233D; }

/* Kustība: kluči „uzkāpj” kā kāpnes — nolaukums, tad pakāpieni, tad terases un karogs. */
@media (prefers-reduced-motion: no-preference) {
  .motion .sk-iso > g { animation: sk-kapj .65s cubic-bezier(.34,1.56,.64,1) both; animation-delay: calc(var(--i, 0) * 110ms + 120ms); }
  .motion .sk-iso__gr, .motion .sk-iso__karogs { animation-delay: 720ms; }
  .motion .sk-iso__berns { animation: sk-kapj .55s cubic-bezier(.34,1.56,.64,1) 900ms both; }
  .motion .sk-iso__nos { animation: sk-paradas .5s ease 1s both; }
  .sk-cels { transition: translate .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s cubic-bezier(.34,1.56,.64,1); }
  .sk-cels:hover { translate: 0 -4px; box-shadow: 0 11px 0 var(--c-edge); }
}
@keyframes sk-kapj { from { opacity: 0; translate: 0 26px; } }
@keyframes sk-paradas { from { opacity: 0; } }

/* ---------- Divi ceļi: divas kartes, katra uz savas terases */
.sk-celi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, .6rem + 1.6vw, 2rem); align-items: start; }
.sk-cels { position: relative; background: var(--c-card); border: 2px solid var(--c-edge); border-radius: 22px; box-shadow: 0 7px 0 var(--c-edge); padding: clamp(1.2rem, .9rem + 1.4vw, 2rem); display: grid; gap: .9rem; align-content: start; }
.sk-cels--kurss { border-top: 10px solid var(--coral); }
.sk-cels--katalogs { border-top: 10px solid var(--sun); margin-top: 2.2rem; }
.sk-cels h3 { font-size: clamp(1.45rem, 1.2rem + 1vw, 2rem); line-height: 1.02; letter-spacing: -0.02em; }
.sk-cels__nr { font-size: 1.45rem; rotate: -2deg; width: max-content; margin-bottom: -.4rem; }
.sk-fakti { border-top: 2px solid var(--c-fg); }
.sk-fakti > div { display: grid; grid-template-columns: 6rem 1fr; gap: .7rem; padding: .55rem 0; border-bottom: 1px solid var(--c-line); font-size: var(--t-s); line-height: 1.4; }
.sk-fakti dt { font-weight: 800; }
.sk-fakti dd { margin: 0; }
.sk-datums { font-weight: 700; background: linear-gradient(var(--sun), var(--sun)) 0 88% / 100% .42em no-repeat; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.sk-soli { list-style: none; padding: 0; display: grid; gap: .55rem; counter-reset: sk; }
.sk-soli li { counter-increment: sk; position: relative; min-height: 2.2rem; padding: .3rem 0 0 2.8rem; font-size: var(--t-s); line-height: 1.45; }
.sk-soli li::before { content: counter(sk); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 2rem; height: 2rem; font: 800 1rem/1 var(--f-display); background: var(--lavender-2); color: var(--violet); border: 2px solid var(--c-edge); border-radius: 8px; box-shadow: 0 3px 0 var(--c-edge); }
.sk-soli li:nth-child(2)::before { background: var(--lavender); }
.sk-soli li:nth-child(3)::before { background: var(--sun); }
.sk-cels__bez { font-size: var(--t-s); line-height: 1.45; padding: .7rem .9rem; border: 2px dashed var(--c-edge); border-radius: 12px; }
.sk-cels__piezime { font-size: var(--t-xs); color: var(--c-muted); line-height: 1.45; }
.sk-darbibas { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.2rem; margin-top: .3rem; }
.sk-darbibas .ulink { min-height: 44px; display: inline-flex; align-items: center; }

/* ---------- Pieteikums katalogam */
.sk-katalogs { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.2rem, .8rem + 2vw, 3rem); align-items: start; background: var(--lavender-2); color: var(--violet); border: 2px solid var(--c-edge); border-radius: 28px; box-shadow: 0 7px 0 var(--c-edge); padding: clamp(1.2rem, .8rem + 2.4vw, 3rem); }
.sk-katalogs:focus { outline: none; }
.sk-katalogs__ievads p:not(.kicker):not(.hand) { margin-top: 1rem; line-height: 1.5; }
.sk-katalogs .kicker { margin-bottom: 1rem; }
.sk-lapa .sk-katalogs__piezime { margin-top: 1.4rem; rotate: -2deg; width: max-content; max-width: 100%; }
.sk-katalogs__forma { background: var(--cream); border: 2px solid var(--c-edge); border-radius: 20px; padding: clamp(1rem, .8rem + 1vw, 1.6rem); }
main.sp-main .sk-forma label { display: block; font-weight: 700; font-size: var(--t-s); margin: 1rem 0 .35rem; }
main.sp-main .sk-forma label:first-child { margin-top: 0; }
main.sp-main .sk-forma input, main.sp-main .sk-forma textarea {
  width: 100%; font: 400 1rem/1.4 var(--f-body); min-height: 48px; padding: .7rem .85rem;
  background: #fff; color: var(--violet); border: 2px solid var(--c-edge); border-radius: 12px; box-shadow: inset 0 3px 0 rgba(48,35,61,.06);
}
main.sp-main .sk-forma textarea { min-height: 96px; resize: vertical; }
main.sp-main .sk-forma input:focus-visible, main.sp-main .sk-forma textarea:focus-visible { outline: 3px solid var(--coral); outline-offset: 2px; }
.sk-forma .fine { margin: 1rem 0; }
.sk-forma .btn { width: 100%; }
.sj-ok { margin-bottom: 1.2rem; padding: 1rem 1.1rem; background: var(--sun); color: var(--violet); border: 2px solid var(--c-edge); border-radius: 14px; box-shadow: 0 4px 0 var(--c-edge); }
.sj-ok b { font-family: var(--f-display); font-size: 1.25rem; }
.sj-ok p { margin-top: .35rem; line-height: 1.45; }

/* ---------- Jau strādā ar savu klasi? (otrais plāns) */
.sk-klase { border-top: 2px solid var(--c-fg); padding-top: clamp(1.5rem, 1rem + 2vw, 3rem); display: grid; gap: clamp(1.5rem, 1rem + 2vw, 2.5rem); }
.sk-klase__ievads { display: grid; gap: .8rem; max-width: 62ch; }
.sk-klase__ievads p { line-height: 1.5; }
.sk-ka-sakt { display: grid; gap: 1rem; }
.sk-ka-sakt h3, .sk-dabu h3 { font-size: clamp(1.3rem, 1.1rem + .8vw, 1.7rem); }
.sk-lapa .teacher-steps { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; align-items: end; }
.sk-lapa .teacher-steps li { --k: 0; background: var(--c-card); border: 2px solid var(--c-edge); border-radius: var(--radius); box-shadow: 0 calc(5px + var(--k) * 5px) 0 var(--c-edge); padding: 1rem; margin-bottom: calc(var(--k) * 5px); display: grid; gap: .4rem; }
.sk-lapa .teacher-steps li:nth-child(2) { --k: 1; }
.sk-lapa .teacher-steps li:nth-child(3) { --k: 2; background: var(--sun); color: var(--violet); }
.sk-lapa .teacher-steps p { font-size: var(--t-s); line-height: 1.45; }
.sk-prieksskats { margin: .5rem 0 0; max-width: 820px; }
.sk-prieksskats img { width: 100%; border: 2px solid var(--c-edge); border-radius: 18px; box-shadow: 0 6px 0 var(--c-edge); }
.sk-prieksskats figcaption { margin-top: .8rem; font-size: var(--t-xs); color: var(--c-muted); }

/* Redzamības bloks (components/redzamiba.html) sala valodā. */
.sk-lapa .ll-redz { display: grid; gap: .8rem; }
.sk-lapa .ll-redz h2 { font-size: clamp(1.4rem, 1.1rem + 1.2vw, 2rem); }
.sk-lapa .ll-redz-ne { color: #B5401C; }
.sk-lapa .ll-redz-ievads { max-width: 62ch; line-height: 1.5; }
.sk-lapa .ll-redz-kol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.sk-lapa .ll-redz-k { border: 2px solid var(--c-edge); border-radius: 18px; padding: 1rem 1.1rem; box-shadow: 0 5px 0 var(--c-edge); }
.sk-lapa .ll-redz-ja { background: var(--lavender-2); color: var(--violet); }
.sk-lapa .ll-redz-nav { background: var(--c-card); border-style: dashed; }
.sk-lapa .ll-redz-k h3 { font-size: 1.15rem; display: flex; align-items: center; gap: .5rem; }
.sk-lapa .ll-redz-zime { display: inline-grid; place-items: center; width: 1.7rem; height: 1.7rem; border: 2px solid var(--c-edge); border-radius: 8px; font-size: .95rem; }
.sk-lapa .ll-redz-ja .ll-redz-zime { background: var(--sun); }
.sk-lapa .ll-redz-k ul { margin: .7rem 0 0; padding-left: 1.1rem; display: grid; gap: .45rem; font-size: var(--t-s); line-height: 1.45; }
.sk-lapa .ll-redz-piezime { font-size: var(--t-xs); color: var(--c-muted); }

.sk-dabu ul { list-style: none; padding: 0; margin-top: 1rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 1.6rem; }
.sk-dabu li { border-left: 4px solid var(--sun); padding-left: 1rem; font-size: var(--t-s); line-height: 1.5; }

/* ---------- Telefons (390px) */
@media (max-width: 767px) {
  .sk-varti { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .sk-varti__sala { order: -1; margin: 0 -.5rem; }
  .sk-varti h1 { font-size: clamp(2.3rem, 1.6rem + 4vw, 3rem); }
  .sk-lead { font-size: 1.1rem; }
  .sj-atbildes dl > div { grid-template-columns: 1fr; gap: .1rem; }
  .sk-celi { grid-template-columns: minmax(0, 1fr); }
  .sk-cels--katalogs { margin-top: 0; }
  .sk-fakti > div { grid-template-columns: 1fr; gap: .1rem; }
  .sk-darbibas .btn { width: 100%; }
  .sk-katalogs { grid-template-columns: minmax(0, 1fr); border-radius: 22px; padding: 1.1rem; }
  .sk-katalogs__forma { padding: 1rem; }
  .sk-lapa .teacher-steps { grid-template-columns: minmax(0, 1fr); }
  .sk-lapa .teacher-steps li { margin: 0 calc((2 - var(--k)) * 1.2rem) calc(var(--k) * 5px) 0; }
  .sk-lapa .ll-redz-kol, .sk-dabu ul { grid-template-columns: minmax(0, 1fr); }
}