/* Renergi Infra: the subpages. Same style as the front page, no motion beyond a quiet fade in (Sverre 18.10.2026: «du
   trenger ikke ha animasjoner etc på disse sidene, men bare bedre design, mer oversiktlig og navigasjonsvennlig»).
   They also load forside.css, so the prices, the steps, the people and the map look the same as there. */

/* a row of text and a photo, side by side on wide screens */
.rad-2 { display: grid; gap: 2rem 4.5rem; align-items: center; }
.rad-2 figure img, .rad-2 > img { width: 100%; border-radius: var(--radius); object-fit: cover; aspect-ratio: 4 / 3; }
@media (min-width: 960px) {
  .rad-2 { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); }
  .rad-2.snudd > :first-child { order: 2; }
}
.figurtekst { margin-top: 0.7rem; font-size: 0.92rem; color: var(--tekst-dempet); }
.seksjon-natt .figurtekst, .seksjon-natt-2 .figurtekst { color: var(--tekst-lys-dempet); }

/* a few short points in boxes */
.punkter { display: grid; gap: 0.75rem; margin-top: 2rem; }
@media (min-width: 700px) { .punkter { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); } }
.punkt { position: relative; padding: 1.3rem 1.3rem 1.4rem; background: var(--hvit); border-radius: var(--radius); box-shadow: 0 0 0 1px var(--linje); overflow: hidden; }
.punkt::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--energi); }
.punkt h3 { font-size: 1.15rem; font-weight: 600; line-height: 1.3; }
.punkt p { margin-top: 0.45rem; color: var(--tekst-dempet); }
.seksjon-hvit .punkt { background: var(--kalk); }
.seksjon-natt .punkt, .seksjon-natt-2 .punkt { background: var(--natt-3); box-shadow: none; }
.seksjon-natt .punkt h3, .seksjon-natt-2 .punkt h3 { color: var(--tekst-lys); }
.seksjon-natt .punkt p, .seksjon-natt-2 .punkt p { color: var(--tekst-lys-dempet); }

/* the services, one row each */
.tj-liste { display: grid; gap: 1rem; }
.tj-rad {
  display: grid; overflow: hidden; border-radius: var(--radius); background: var(--hvit); box-shadow: 0 0 0 1px var(--linje);
  text-decoration: none; color: var(--tekst);
}
.tj-rad-bilde { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: var(--natt-2); }
.tj-rad-bilde img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s var(--mykt); }
.tj-rad:hover .tj-rad-bilde img { transform: scale(1.04); }
.tj-rad-bilde .veilys { height: 74%; top: 12%; right: 50%; transform: translateX(50%); }
.tj-rad-tekst { display: grid; gap: 0.6rem; align-content: center; padding: 1.5rem 1.6rem 1.7rem; }
.tj-rad h2 { font-size: clamp(1.5rem, 1.15rem + 1.2vw, 2.2rem); font-weight: var(--vekt-tittel); letter-spacing: var(--sporing-tittel); line-height: 1.1; }
.tj-rad p { color: var(--tekst-dempet); max-width: 34rem; }
.tj-rad .lenke-pil { justify-self: start; margin-top: 0.4rem; }
@media (min-width: 860px) {
  .tj-rad { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); min-height: 17rem; }
  .tj-rad-bilde { aspect-ratio: auto; }
}

/* the photos from the jobs */
.galleri-gruppe + .galleri-gruppe { margin-top: clamp(3rem, 2rem + 3vw, 5rem); }
.galleri-gruppe > h2 { font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.4rem); font-weight: var(--vekt-tittel); letter-spacing: var(--sporing-tittel); }
.galleri-gruppe > p { margin-top: 0.5rem; color: var(--tekst-dempet); max-width: 40rem; }
.galleri { display: grid; gap: 0.75rem; margin-top: 1.6rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); }
.galleri figure { margin: 0; }
.galleri img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--radius); }
.galleri figure.bred { grid-column: span 2; }
.galleri figure.bred img { aspect-ratio: 8 / 5; }
@media (max-width: 599px) { .galleri figure.bred { grid-column: auto; } .galleri figure.bred img { aspect-ratio: 4 / 5; } }
.galleri figcaption { margin-top: 0.55rem; font-size: 0.95rem; color: var(--tekst-dempet); }

/* small facts in a list: label and value */
.fakta-liste { display: grid; gap: 0; margin-top: 1.4rem; }
.fakta-liste > div { display: grid; grid-template-columns: minmax(8rem, 0.4fr) 1fr; gap: 1rem; padding: 0.8rem 0; border-top: 1px solid var(--linje); }
.fakta-liste dt { font-weight: 600; }
.fakta-liste dd { margin: 0; color: var(--tekst-dempet); }
@media (max-width: 479px) { .fakta-liste > div { grid-template-columns: 1fr; gap: 0.15rem; } }

/* the order form for construction power */
.bestill-rad { display: grid; gap: 2.5rem 4.5rem; }
@media (min-width: 1024px) { .bestill-rad { grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr); align-items: start; } }
/* the column beside the form stays only where all of it fits the window (at 654 px its last 105 px fell below the edge) */
@media (min-width: 1024px) and (min-height: 780px) { .bestill-info { position: sticky; top: calc(var(--meny-h) + 2rem); } }
.bestill-skjema { padding: clamp(1.4rem, 1rem + 2vw, 2.4rem); background: var(--kalk); border-radius: var(--radius); box-shadow: 0 0 0 1px var(--linje); }
/* white fields on the chalk card (they were chalk on chalk) */
.skjema.bestill-skjema .felt input, .skjema.bestill-skjema .felt select, .skjema.bestill-skjema .felt textarea,
.skjema.bestill-skjema .valg label, .skjema.bestill-skjema .samtykke, .skjema.bestill-skjema .bilder-knapp { background: var(--hvit); }

/* the 404 page */
.ikke-funnet { display: grid; gap: 1rem; }
.ikke-funnet ul { display: grid; gap: 0.5rem; margin-top: 1rem; }

/* the drawn street lamp outside the front page (still) */
.veilys-strek { fill: none; stroke: var(--strek); stroke-width: 1.3px; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; }
.veilys-ramme { position: relative; aspect-ratio: 4 / 3; border-radius: var(--radius); overflow: hidden; }
.tj-rad-bilde.tj-veilys { background: radial-gradient(80% 55% at 45% 100%, rgba(242, 184, 65, 0.16), transparent 70%), var(--natt-2); }
.tj-rad-bilde .veilys, .veilys-ramme .veilys { position: absolute; z-index: auto; }
