/* Bjergklar – hjemmeside. Farver og skrift som i appen (lyst tema). */
:root{
  --bg:#F6F4EF; --bg2:#EDEAE2; --text:#1C221E; --text2:#5F665F; --text3:#8E948D; --line:#DEDAD0;
  --green:#2F4A3C; --onGreen:#fff; --foot:#2F4A3C; --footText:#E9EFE5;
  --hero:url(../billeder/landskab.jpg); --icon:url(../billeder/ikon.png);
  --shade:linear-gradient(90deg,rgba(246,244,239,.94) 0%,rgba(246,244,239,.75) 40%,rgba(246,244,239,0) 70%),linear-gradient(180deg,rgba(246,244,239,0) 70%,var(--bg) 100%);
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--text);font:18px/1.6 -apple-system,system-ui,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
.serif,h1,h2{font-family:ui-serif,"New York","Iowan Old Style",Georgia,serif;font-weight:600;letter-spacing:-.01em}
a{color:var(--green)}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}

/* topbar */
nav.top{display:flex;align-items:center;justify-content:space-between;padding:22px 0;position:relative;z-index:2}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}
.brand i{width:40px;height:40px;border-radius:10px;background:var(--icon) center/cover;box-shadow:0 2px 8px #0002}
.brand b{letter-spacing:.3em;font-size:14px;font-weight:600}
nav.top .links{display:flex;gap:22px;font-size:15px;background:rgba(251,250,247,.82);backdrop-filter:blur(8px);padding:8px 18px;border-radius:999px;box-shadow:0 1px 6px #0000000f}
nav.top .links a{color:var(--text);text-decoration:none;opacity:.8}
nav.top .links a.cur{opacity:1;border-bottom:2px solid var(--green);padding-bottom:2px}

/* hero */
.hero{position:relative;background:var(--hero) center 45%/cover no-repeat;min-height:720px}
.hero::after{content:"";position:absolute;inset:0;background:var(--shade)}
.hero>.wrap{position:relative;z-index:1}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:40px;padding:30px 0 80px}
.eyebrow{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--text2);font-weight:600;margin:0 0 14px}
.hero h1{font-size:clamp(46px,7vw,84px);line-height:1;margin:0 0 22px}
.hero p.lead{font-size:21px;color:var(--text);margin:0 0 32px;max-width:26em}
.btn{display:inline-block;background:var(--green);color:var(--onGreen);font-weight:600;font-size:17px;padding:14px 28px;border-radius:999px;text-decoration:none}
.small{font-size:14px;color:var(--text3);margin-top:14px}

/* phone */
.phone{width:100%;max-width:290px;margin:0 auto;border-radius:46px;padding:9px;background:#0b0b0c;box-shadow:0 30px 60px -20px #0006,0 0 0 1px #ffffff14 inset}
.phone .scr{border-radius:38px;overflow:hidden;aspect-ratio:1170/2532;background:#000}
.phone img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}

/* statement */
.statement{text-align:center;padding:100px 0 60px}
.statement h2{font-size:clamp(32px,4.4vw,50px);line-height:1.12;margin:0 auto 22px;max-width:15em}
.statement p{max-width:34em;margin:0 auto;color:var(--text2);font-size:19px}

/* feature rows */
.row{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:70px 0;border-top:1px solid var(--line)}
.row.flip .txt{order:2}
.row h2{font-size:clamp(30px,3.6vw,42px);line-height:1.1;margin:0 0 16px}
.row p{color:var(--text2);margin:0 0 18px}
.row ul{list-style:none;padding:0;margin:0}
.row li{padding:9px 0 9px 28px;position:relative;border-top:1px solid var(--line);font-size:16px}
.row li::before{content:"";position:absolute;left:4px;top:18px;width:9px;height:9px;border-radius:50%;background:var(--green)}

/* more list */
.more{background:var(--bg2);padding:90px 0}
.more h2{font-size:clamp(30px,3.6vw,42px);margin:0 0 36px;text-align:center}
.mgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 48px}
.mgrid div{border-top:1px solid var(--line);padding:20px 0 26px}
.mgrid h3{margin:0 0 4px;font-size:18px}
.mgrid p{margin:0;color:var(--text2);font-size:16px;line-height:1.45}

/* bo */
.bo{display:grid;grid-template-columns:1fr 1fr;min-height:560px}
.bo .img{background:url(../billeder/bo-bjerg.jpg) center 35%/cover}
.bo .txt{padding:80px 64px;display:flex;flex-direction:column;justify-content:center}
.bo h2{font-size:clamp(32px,3.8vw,46px);margin:0 0 18px}
.bo p{color:var(--text2);margin:0 0 14px;max-width:28em}
.ph-unused{background:var(--line);color:var(--text2);padding:1px 6px;border-radius:5px;font-size:.88em}

/* privacy band */
.privband{text-align:center;padding:90px 0}
.privband h2{font-size:clamp(28px,3.4vw,40px);margin:0 0 12px}
.privband p{color:var(--text2);margin:0 0 6px}

/* footer */
footer{background:var(--foot);color:var(--footText);padding:56px 0 46px;font-size:15px}
.fgrid{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;align-items:flex-start}
footer .brand{color:var(--footText)}
footer a{color:var(--footText);text-decoration:none;opacity:.85}
footer .cols{display:flex;gap:56px;flex-wrap:wrap}
footer .cols div{display:flex;flex-direction:column;gap:8px}
footer .cols b{font-size:12px;letter-spacing:.18em;text-transform:uppercase;opacity:.6;font-weight:600;margin-bottom:4px}
footer .copy{margin-top:40px;opacity:.55;font-size:13px}

/* subpages */
.subhero{position:relative;background:var(--hero) center 45%/cover;padding-bottom:70px}
.subhero::after{content:"";position:absolute;inset:0;background:var(--shade)}
.subhero>.wrap{position:relative;z-index:1}
.subhero h1{font-size:clamp(40px,6vw,64px);margin:50px 0 12px;line-height:1.05}
.subhero p{font-size:20px;color:var(--text2);margin:0;max-width:30em}
.article{max-width:720px;margin:0 auto;padding:60px 24px 90px}
.article h2{font-size:28px;margin:46px 0 10px}
.article h2:first-child{margin-top:0}
.article h3{font-size:19px;margin:30px 0 6px}
.article p{color:var(--text2);margin:0 0 10px}
.contact{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:30px 0;margin-bottom:10px}
.contact .mail{font-family:ui-serif,"New York",Georgia,serif;font-size:30px;font-weight:600;color:var(--text);text-decoration:none;display:inline-block;margin:6px 0 8px}
.faq details{border-top:1px solid var(--line);padding:18px 0}
.faq summary{cursor:pointer;font-weight:600;list-style:none;font-size:18px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";float:right;color:var(--text3);font-weight:400}
.faq details[open] summary::after{content:"–"}
.faq p{margin:10px 0 0}
.upd{color:var(--text3)!important;font-size:15px;margin-top:40px!important}


/* trust */
.trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#FBFAF7}
.tgrid{display:grid;grid-template-columns:repeat(3,1fr)}
.tgrid div{padding:26px 24px;text-align:center;border-left:1px solid var(--line)}
.tgrid div:first-child{border-left:0}
.tgrid b{display:block;font-family:ui-serif,"New York",Georgia,serif;font-size:21px;font-weight:600}
.tgrid span{color:var(--text2);font-size:15px}
/* steps */
.steps{padding:30px 0 90px}
h2.center{text-align:center;font-size:clamp(30px,3.6vw,42px);margin:0 0 44px}
.sgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px}
.num{font-family:ui-serif,"New York",Georgia,serif;font-size:56px;line-height:1;color:var(--green);opacity:.85;display:block;margin-bottom:12px}
.sgrid h3{margin:0 0 6px;font-size:19px}
.sgrid p{margin:0;color:var(--text2);font-size:16px;line-height:1.5}
/* topo */
.more{background:var(--bg2) url(../billeder/topo.jpg) center/700px auto repeat}
.more .mgrid div{border-top-color:#D3CEC2}
/* cta */
.cta{position:relative;background:var(--hero) center 60%/cover;text-align:center;padding:130px 0}
.cta::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(246,244,239,.55),rgba(246,244,239,.75))}
.cta .wrap{position:relative}
.cta h2{font-size:clamp(36px,5vw,60px);line-height:1.05;margin:0 0 16px}
.cta p{color:var(--text);margin:0 auto 30px;max-width:30em}
@media (max-width:820px){.tgrid,.sgrid{grid-template-columns:1fr}.tgrid div{border-left:0;border-top:1px solid var(--line);padding:18px}.tgrid div:first-child{border-top:0}.sgrid{gap:30px}.cta{padding:90px 0}}

@media (max-width:820px){
  .hero{min-height:0}
  .hero-grid,.row,.bo{grid-template-columns:1fr}
  .hero-grid{padding:20px 0 60px;gap:46px}
  .row{gap:36px;padding:56px 0}
  .row.flip .txt{order:0}
  .mgrid{grid-template-columns:1fr}
  .bo .img{min-height:380px}
  .bo .txt{padding:50px 24px}
  .brand b{display:none}
  nav.top .links{gap:16px}
  :root{--shade:linear-gradient(180deg,rgba(246,244,239,.55),rgba(246,244,239,.8) 60%,var(--bg))}