/*
Unofix portefølje: felles design med blog.unofix.no.
Variabler, fonter, knapper, topp og bunn er hentet fra blogg-temaet (blog-unofix/style.css),
slik at de to nettstedene ser ut som ett. Bootstrap 5.3 lastes fra CDN med fast versjon.
*/

/* ===== Fonter (selvhostet, woff2) ===== */
@font-face{font-family:Sora;font-style:normal;font-weight:600 700;font-display:swap;src:url(../fonts/sora-600-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Ubuntu;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ubuntu-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Ubuntu;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ubuntu-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Ubuntu;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/ubuntu-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Ubuntu;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/ubuntu-700-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ===== Variabler (samme som bloggen; kontrast mot hvit bunn: tekst 15:1, dempet 7,5:1, lenke/knapp 6:1) ===== */
:root{
	--nr-tekst:#142033;
	--nr-dempet:#4a5668;
	--nr-merke:#1557d6;
	--nr-merke-mork:#0f43a8;
	--nr-aksent:#1a63f5;
	--nr-merke-lys:#e8f0ff;
	--nr-kant:#dbe4f3;
	--nr-ui-kant:#6b7a90;
	--nr-flate:#f3f7fe;
	--nr-fokus:#1557d6;
	--nr-skygge:0 .25rem 1.5rem rgba(21,87,214,.09);
	--nr-skygge-stor:0 .75rem 2.5rem rgba(21,87,214,.16);
	--nr-radius:1.25rem;
	--nr-overskrift:Sora,Ubuntu,system-ui,-apple-system,"Segoe UI",sans-serif;
	--bs-body-font-family:Ubuntu,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
	--bs-body-font-size:1.0625rem;
	--bs-body-line-height:1.65;
	--bs-body-color:var(--nr-tekst);
	--bs-body-color-rgb:20,32,51;
	--bs-link-color:var(--nr-merke);
	--bs-link-color-rgb:21,87,214;
	--bs-link-hover-color:var(--nr-merke-mork);
	--bs-link-hover-color-rgb:15,67,168;
	--bs-heading-color:var(--nr-tekst);
	--bs-border-color:var(--nr-kant);
	--space-lg:4rem;
}

/* ===== Grunn og typografi ===== */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{min-height:100vh;overflow-x:clip;background:#fff linear-gradient(180deg,#eaf2ff 0,#f6f9ff 520px,#fff 980px) no-repeat}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.nr-logo{font-family:var(--nr-overskrift);font-weight:600;line-height:1.2;letter-spacing:-.01em}
h1,.h1{font-size:clamp(1.9rem,1.3rem + 2.6vw,3.25rem);font-weight:700;line-height:1.12;letter-spacing:-.02em}
h2,.h2{font-size:clamp(1.4rem,1.2rem + .9vw,1.9rem)}
h3{font-size:1.25rem}
.lead{font-size:1.15rem;font-weight:400;color:var(--nr-dempet)}
p:last-child{margin-bottom:0}
a{text-underline-offset:.15em}
img{max-width:100%;height:auto}
:focus-visible{outline:3px solid var(--nr-fokus);outline-offset:2px;border-radius:2px}
.skip-link{position:absolute;left:.5rem;top:-4rem;z-index:1100;padding:.75rem 1rem;background:var(--nr-merke);color:#fff;border-radius:.5rem}
.skip-link:focus{top:.5rem;color:#fff}
main:focus{outline:none}
.nr-merkelapp{display:inline-flex;align-items:center;gap:.5rem;margin:0 0 1rem;padding:.2rem .6rem .2rem .55rem;border-left:3px solid var(--nr-merke);background:var(--nr-merke-lys);color:var(--nr-merke-mork);font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.container-narrow{max-width:960px}

/* ===== Knapper ===== */
.btn{border-radius:2rem;font-weight:700}
.btn-primary{--bs-btn-bg:var(--nr-merke);--bs-btn-border-color:var(--nr-merke);--bs-btn-hover-bg:var(--nr-merke-mork);--bs-btn-hover-border-color:var(--nr-merke-mork);--bs-btn-active-bg:var(--nr-merke-mork);--bs-btn-active-border-color:var(--nr-merke-mork);box-shadow:0 .4rem 1rem rgba(21,87,214,.28)}
.btn-outline-primary{--bs-btn-color:var(--nr-merke);--bs-btn-border-color:var(--nr-merke);--bs-btn-hover-bg:var(--nr-merke);--bs-btn-hover-border-color:var(--nr-merke);--bs-btn-active-bg:var(--nr-merke-mork);--bs-btn-active-border-color:var(--nr-merke-mork);background:#fff}
.btn-lg{--bs-btn-padding-x:1.5rem;--bs-btn-padding-y:.7rem;--bs-btn-font-size:1rem}

/* ===== Topp ===== */
.nr-header{background:rgba(255,255,255,.92);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--nr-kant);z-index:1030}
.nr-logo{display:inline-flex;align-items:center;gap:.6rem;font-size:1.3rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--nr-tekst);text-decoration:none}
.nr-logo:hover{color:var(--nr-merke)}
.nr-logo-merke{color:var(--nr-merke);flex:none}
.nr-toggler{border:1px solid var(--nr-ui-kant);border-radius:.75rem;padding:.5rem .7rem}
.nr-toggler:focus{box-shadow:none}
.nr-menu{display:flex;flex-direction:column;gap:0;margin:.75rem 0;padding:0;list-style:none}
.nr-menu a{display:block;padding:.7rem 0;border-bottom:1px solid var(--nr-kant);color:var(--nr-tekst);font-size:1.05rem;text-decoration:none}
.nr-menu a:hover,.nr-menu a[aria-current]{color:var(--nr-merke);font-weight:700}
.nr-header-handlinger{display:flex;flex-direction:row;gap:.5rem;padding-bottom:.75rem}
.nr-sprak{display:inline-flex;align-items:center;justify-content:center;min-width:2.75rem;height:2.5rem;padding:0 .6rem;border:1px solid var(--nr-kant);border-radius:2rem;background:var(--nr-flate)}
.nr-sprak:hover{background:var(--nr-merke-lys);border-color:var(--nr-merke)}
.nr-sprak[aria-current]{border-color:var(--nr-merke);background:#fff;box-shadow:0 0 0 1px var(--nr-merke)}
.nr-sprak img{display:block;width:1.65rem;height:auto;border-radius:.15rem}
@media (min-width:992px){
	.nr-menu{flex-direction:row;align-items:center;gap:.15rem 1.75rem;margin:0 0 0 auto}
	.nr-menu a{padding:.5rem 0;border:0;font-size:.97rem}
	.nr-menu a:hover,.nr-menu a[aria-current]{text-decoration:underline;text-decoration-thickness:2px}
	.nr-header-handlinger{align-items:center;padding:0;margin-left:1.75rem}
}

/* ===== Seksjoner (rekkefølgen styrer utseendet) ===== */
main > section{padding:var(--space-lg) 0}

/* 1: hero */
main > section:nth-of-type(1){padding:1.75rem 0 2.5rem}
main > section:nth-of-type(1) h1{margin:0 0 1.1rem}
main > section:nth-of-type(1) .lead{max-width:34rem;margin-bottom:1.75rem!important}
@media (min-width:992px){main > section:nth-of-type(1){padding:1.5rem 0 3.5rem}}
.nr-aksent{color:var(--nr-aksent)}
.nr-hero-bilde{position:relative;max-width:34rem;margin:.5rem auto 0;padding:0}
.nr-hero-ramme{position:relative;aspect-ratio:1/1;overflow:hidden;border-radius:50%;background:#cfe0ff;box-shadow:var(--nr-skygge-stor),inset 0 0 0 .4rem rgba(255,255,255,.55)}
.nr-hero-ramme img{display:block;width:100%;height:100%;object-fit:cover;object-position:58% 38%}
.nr-hero-ramme img.nr-hero-tegnet{object-position:50% 15%;mix-blend-mode:multiply}
.nr-hero-ramme::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(21,87,214,.12));pointer-events:none}
.nr-hero-bilde::before{content:"";position:absolute;inset:-3% -1% 1% -2%;border:1.5px solid rgba(21,87,214,.3);border-radius:50%;transform:rotate(-14deg);pointer-events:none}
@media (min-width:992px){.nr-hero-bilde{margin:0 0 0 auto}}

/* 2: "Mer enn bare en nettside" */
main > section:nth-of-type(2){padding-bottom:8.5rem;background:linear-gradient(135deg,var(--nr-merke) 0,var(--nr-merke-mork) 100%);color:#fff}
main > section:nth-of-type(2) h2{color:#fff}
main > section:nth-of-type(2) .lead{color:rgba(255,255,255,.92)}

/* 3: tre kort som overlapper den blå seksjonen */
main > section:nth-of-type(3){margin-top:-9rem;padding-top:0}

/* 4: prosjekter */
main > section:nth-of-type(4) header h2{margin-bottom:.5rem}
main > section:nth-of-type(4) .text-muted{color:var(--nr-dempet)!important}

/* 5: kontakt */
main > section:nth-of-type(5){background:#fff}
main > section:nth-of-type(5) .text-muted{color:var(--nr-dempet)!important}

/* ===== Kort ===== */
.card-clean{border:0;border-radius:var(--nr-radius);padding:1.75rem;background:#fff;box-shadow:var(--nr-skygge);transition:box-shadow .2s,transform .2s}
.card-clean:hover{box-shadow:var(--nr-skygge-stor);transform:translateY(-.15rem)}
.card-clean h3{margin-bottom:.75rem}
.feature-icon{display:inline-block;margin-bottom:1rem;font-size:2rem;color:var(--nr-merke)}
.project .card-img-top{margin-bottom:.5rem}
.project .card-body{padding:1rem 0}
.project .card-footer{padding:0}
.project .card-text{text-align:left}

/* ===== Skjema ===== */
.form-control{border:1px solid var(--nr-ui-kant);border-radius:1rem;background:var(--nr-flate)}
.form-control:focus{background:#fff;border-color:var(--nr-merke);box-shadow:0 0 0 .2rem rgba(21,87,214,.18)}
.form-lg .form-label{margin-bottom:.5rem;font-size:1rem;font-weight:700}
.form-lg .form-control{padding:.75rem 1.1rem;font-size:1.05rem}

/* ===== Bunn ===== */
.nr-footer{background:#fff;border-top:1px solid var(--nr-kant);padding:2.5rem 0 1.5rem;font-size:.95rem}
.nr-footer .nr-logo{margin-bottom:.75rem;font-size:1.15rem}
.nr-footer ul{list-style:none;margin:0;padding:0}
.nr-footer li a{display:inline-block;padding:.35rem 0}
.nr-kopirett{color:var(--nr-dempet);border-top:1px solid var(--nr-kant);margin:1.75rem 0 0;padding-top:1rem;font-size:.875rem}