/* Nordvik demo — values from "Demo Hjemmeside.dc.html" */
:root { --bg: #f6f5f1; --ink: #0e1a14; --green: #0f3d2e; --lime: #d4f36b; --muted: #5f6b64; --line: #e3e1da; --serif: 'Instrument Serif', serif; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: 'Geist', sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--ink); text-decoration: none; }
a:hover { color: var(--green); }
em { font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--green); }
.pg { background: var(--bg); min-height: 100vh; overflow-x: clip; }
.img { width: 100%; height: 100%; }

.hd { max-width: 1240px; margin: 0 auto; padding: 22px 32px; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.logo { font-size: 22px; font-weight: 700; letter-spacing: -0.03em; display: flex; align-items: center; gap: 8px; }
.logo__mark { width: 22px; height: 22px; border-radius: 50%; background: var(--green); display: flex; align-items: center; justify-content: center; }
.logo__mark i { width: 8px; height: 8px; border-radius: 50%; background: var(--lime); display: block; }
.menu { display: flex; gap: 6px; align-items: center; font-size: 15px; font-weight: 500; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 5px; }
.menu a { padding: 9px 16px; border-radius: 999px; }
.menu a:hover { background: #f0efe9; }
.book { background: var(--ink); color: #fff; padding: 13px 22px; border-radius: 999px; font-size: 15px; font-weight: 600; }
.book:hover { background: var(--green); color: #fff; }

.hero { max-width: 1240px; margin: 0 auto; padding: 36px 32px 80px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: 56px; align-items: center; }
.hero__copy { display: flex; flex-direction: column; gap: 28px; }
.pill { align-self: flex-start; display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--line); padding: 7px 14px 7px 8px; border-radius: 999px; font-size: 14px; font-weight: 500; }
.pill span { background: var(--lime); border-radius: 999px; padding: 3px 9px; font-size: 12px; font-weight: 700; }
.hero h1 { font-weight: 600; font-size: clamp(60px, 7.4vw, 108px); line-height: 0.95; letter-spacing: -0.055em; margin: 0; }
.hero h1 em { letter-spacing: -0.03em; }
.hero__copy > p { font-size: 20px; line-height: 1.55; color: var(--muted); margin: 0; max-width: 480px; text-wrap: pretty; }
.hero__ctas { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.cta { background: var(--green); color: #fff; padding: 18px 28px; border-radius: 999px; font-weight: 600; font-size: 16px; display: flex; align-items: center; gap: 10px; }
.cta:hover { background: var(--ink); color: #fff; }
.cta span { width: 24px; height: 24px; border-radius: 50%; background: var(--lime); color: var(--ink); display: flex; align-items: center; justify-content: center; font-size: 13px; }
.call { padding: 18px 20px; font-weight: 600; font-size: 16px; }
.proof { display: flex; align-items: center; gap: 14px; padding-top: 6px; }
.faces { display: flex; }
.faces i { width: 40px; height: 40px; border-radius: 50%; border: 3px solid var(--bg); display: block; margin-left: -12px; font-style: normal; }
.faces i:nth-child(1) { background: #c9d8cf; margin-left: 0; }
.faces i:nth-child(2) { background: #e8d7c3; }
.faces i:nth-child(3) { background: var(--lime); }
.faces i:nth-child(4) { background: var(--green); color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.proof__txt { display: flex; flex-direction: column; font-size: 14px; line-height: 1.35; }
.proof__txt span { color: var(--muted); }
.hero__art { position: relative; }
.img--hero { height: 620px; border-radius: 32px; overflow: hidden; background: #dfe5df; }
.badge { position: absolute; left: -36px; bottom: 48px; background: #fff; border-radius: 22px; padding: 18px 20px; display: flex; gap: 14px; align-items: center; box-shadow: 0 30px 60px -25px rgba(14,26,20,0.35); }
.badge__ic { width: 46px; height: 46px; border-radius: 14px; background: var(--lime); display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; }
.badge div { display: flex; flex-direction: column; gap: 2px; }
.badge div span { font-size: 13px; color: var(--muted); }
.badge b { font-size: 20px; letter-spacing: -0.02em; }
.open { position: absolute; right: 24px; top: 24px; background: var(--ink); color: #fff; border-radius: 999px; padding: 10px 16px; font-size: 13px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.open i { width: 8px; height: 8px; border-radius: 50%; background: var(--lime); display: block; }

.logos { max-width: 1240px; margin: 0 auto; padding: 0 32px 90px; }
.logos__row { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 26px 0; display: flex; justify-content: space-between; align-items: center; gap: 28px; flex-wrap: wrap; }
.logos__row span { font-size: 22px; font-weight: 700; letter-spacing: -0.04em; color: #9aa39d; }
.logos__row .serif { font-family: var(--serif); }
.logos__row .logos__lbl { font-size: 14px; color: var(--muted); font-weight: 400; letter-spacing: 0; }

.services { max-width: 1240px; margin: 0 auto; padding: 20px 32px 100px; }
.services__head { display: flex; justify-content: space-between; align-items: end; gap: 24px; flex-wrap: wrap; margin-bottom: 40px; }
.services__head h2 { font-weight: 600; font-size: clamp(44px, 5vw, 72px); letter-spacing: -0.05em; line-height: 0.98; margin: 0; max-width: 640px; }
.services__head a { font-weight: 600; font-size: 16px; border-bottom: 1.5px solid var(--ink); padding-bottom: 3px; }
.services__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 16px; }
.svc-main { background: var(--green); color: #fff; border-radius: 28px; padding: 32px; display: flex; flex-direction: column; gap: 18px; min-height: 460px; position: relative; overflow: hidden; }
.svc-main__n { font-size: 14px; color: var(--lime); font-weight: 600; }
.svc-main h3 { margin: 0; font-size: 34px; font-weight: 600; letter-spacing: -0.035em; line-height: 1.05; }
.svc-main p { margin: 0; font-size: 16px; line-height: 1.55; color: #b9cbc1; max-width: 340px; }
.img--svc { flex: 1; border-radius: 18px; overflow: hidden; min-height: 160px; background: #185240; }
.svc-side { display: grid; grid-template-rows: 1fr 1fr; gap: 16px; }
.svc { border: 1px solid var(--line); border-radius: 28px; padding: 30px; display: flex; flex-direction: column; gap: 12px; justify-content: space-between; }
.svc__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.svc__top span { font-size: 14px; color: var(--muted); font-weight: 600; }
.svc__top i { width: 44px; height: 44px; border-radius: 50%; background: var(--ink); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 16px; font-style: normal; }
.svc__txt { display: flex; flex-direction: column; gap: 8px; }
.svc h3 { margin: 0; font-size: 28px; font-weight: 600; letter-spacing: -0.035em; line-height: 1.05; }
.svc p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--muted); }

.about { background: var(--ink); color: #fff; }
.about__in { max-width: 1240px; margin: 0 auto; padding: 100px 32px; }
.about h2 { font-weight: 600; font-size: clamp(40px, 4.6vw, 66px); letter-spacing: -0.05em; line-height: 1; margin: 0 0 56px; max-width: 860px; }
.about h2 em { color: var(--lime); }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.stats div { border-top: 1px solid #2a3a31; padding-top: 22px; display: flex; flex-direction: column; gap: 6px; }
.stats b { font-size: clamp(48px, 5vw, 72px); font-weight: 600; letter-spacing: -0.05em; line-height: 1; }
.stats span { font-size: 15px; color: #9fb0a6; }

.process { max-width: 1240px; margin: 0 auto; padding: 100px 32px; }
.process__head { display: flex; flex-direction: column; gap: 14px; margin-bottom: 44px; }
.process__head span { font-size: 14px; font-weight: 600; color: var(--green); }
.process__head h2 { font-weight: 600; font-size: clamp(44px, 5vw, 72px); letter-spacing: -0.05em; line-height: 0.98; margin: 0; }
.process__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 16px; }
.pstep { background: #fff; border: 1px solid var(--line); border-radius: 28px; padding: 30px; display: flex; flex-direction: column; gap: 40px; }
.pstep > i { width: 52px; height: 52px; border-radius: 16px; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; font-style: normal; }
.pstep > div { display: flex; flex-direction: column; gap: 8px; }
.pstep h3 { margin: 0; font-size: 26px; font-weight: 600; letter-spacing: -0.03em; }
.pstep p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--muted); }

.quote-sec { max-width: 1240px; margin: 0 auto; padding: 0 32px 100px; }
.quote { background: #fff; border: 1px solid var(--line); border-radius: 32px; padding: clamp(28px, 4vw, 56px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 48px; align-items: center; }
.img--quote { aspect-ratio: 4/5; height: auto; border-radius: 22px; overflow: hidden; background: #e5e8e3; }
.quote__txt { display: flex; flex-direction: column; gap: 26px; }
.quote__stars { font-size: 18px; color: var(--green); letter-spacing: 3px; }
.quote__txt p { margin: 0; font-family: var(--serif); font-size: clamp(30px, 3.4vw, 48px); line-height: 1.12; letter-spacing: -0.01em; }
.quote__txt div { display: flex; flex-direction: column; }
.quote__txt b { font-size: 16px; }
.quote__txt div span { font-size: 14px; color: var(--muted); }

.contact-sec { max-width: 1240px; margin: 0 auto; padding: 0 32px 90px; }
.contact { background: var(--green); color: #fff; border-radius: 36px; padding: clamp(32px, 5vw, 72px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 56px; position: relative; overflow: hidden; }
.contact__blob { position: absolute; right: -120px; top: -120px; width: 360px; height: 360px; border-radius: 50%; background: var(--lime); opacity: 0.12; display: block; }
.contact__info { display: flex; flex-direction: column; gap: 18px; position: relative; }
.contact h2 { font-weight: 600; font-size: clamp(46px, 5.4vw, 78px); letter-spacing: -0.055em; line-height: 0.95; margin: 0; }
.contact h2 em { color: var(--lime); }
.contact__info p { margin: 0; font-size: 18px; line-height: 1.55; color: #b9cbc1; max-width: 400px; }
.contact__links { display: flex; flex-direction: column; gap: 4px; font-size: 17px; margin-top: auto; padding-top: 24px; }
.contact__links a { color: #fff; }
.form { display: flex; flex-direction: column; gap: 12px; position: relative; }
.form input, .form textarea { padding: 18px 20px; border-radius: 16px; border: 1px solid #2b5c4b; background: #134a38; color: #fff; font-family: inherit; font-size: 16px; outline: none; }
.form input:focus, .form textarea:focus { border-color: var(--lime); }
.form textarea { resize: vertical; }
.form button { border: none; cursor: pointer; background: var(--lime); color: var(--ink); padding: 18px 30px; border-radius: 999px; font-family: inherit; font-weight: 700; font-size: 16px; }
.thanks { display: flex; flex-direction: column; justify-content: center; gap: 10px; position: relative; }
.thanks[hidden] { display: none; }
.thanks em { font-size: 56px; line-height: 1; color: var(--lime); }
.thanks p { margin: 0; font-size: 18px; color: #b9cbc1; }

.ft { max-width: 1240px; margin: 0 auto; padding: 0 32px 48px; display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; font-size: 14px; color: var(--muted); }
.ft b { color: var(--ink); font-size: 18px; letter-spacing: -0.03em; }