/*
Theme Name: Phone-Care
Theme URI: https://phone-care.dk
Author: Phone-Care ApS
Description: Skraeddersyet tema til Phone-Care ApS - telefonreparation i City2. Moerk baggrund med teal brand-accent (#14C4A8).
Version: 1.0
License: All rights reserved
Text Domain: phone-care
*/

  /* ---------- SELVHOSTEDE FONTE ----------
     Hentet lokalt, saa sitet ikke kalder fonts.googleapis.com /
     fonts.gstatic.com. Google modtager dermed ikke besoegendes IP (GDPR). */
  @font-face{font-family:'Space Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/space-grotesk-400.woff2) format('woff2')}
  @font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/space-grotesk-500.woff2) format('woff2')}
  @font-face{font-family:'Space Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/space-grotesk-600.woff2) format('woff2')}
  @font-face{font-family:'Space Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/space-grotesk-700.woff2) format('woff2')}
  @font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/manrope-400.woff2) format('woff2')}
  @font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/manrope-500.woff2) format('woff2')}
  @font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/manrope-600.woff2) format('woff2')}
  @font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/manrope-700.woff2) format('woff2')}
  @font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/manrope-800.woff2) format('woff2')}
  @font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/space-mono-400.woff2) format('woff2')}
  @font-face{font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/space-mono-700.woff2) format('woff2')}
  @font-face{font-family:'DM Sans';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/dm-sans-800.woff2) format('woff2')}

  :root{
    --bg:#0A1019;
    --bg-2:#0D1420;
    --panel:#111A28;
    --line:#20303F;
    --line-2:#2C3F50;
    --ink:#EAF2F1;
    --ink-dim:#9DB0B2;
    --ink-faint:#647883;
    --lime:#14C4A8;      /* brand teal. Variabelnavn bevaret for at minimere ændringer */
    --lime-deep:#0FA891;
    --warn:#FF6B4A;
    --radius:16px;
    --maxw:1240px;
    --ease:cubic-bezier(.16,1,.3,1);
    --ease-press:cubic-bezier(.34,1.56,.64,1);
    --font-display:'Space Grotesk',sans-serif;
    --font-body:'Manrope',sans-serif;
    --font-mono:'Space Mono',monospace;
  }

  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth;background:var(--bg);overscroll-behavior-y:none}
  /* indholdssider (fx privatlivspolitik) */
  .pc-page{color:var(--ink-dim);font-size:16px;line-height:1.7}
  .pc-page h1{font-size:clamp(30px,4.4vw,46px);color:var(--ink);margin-bottom:24px}
  .pc-page h2{font-family:var(--font-display);font-size:22px;color:var(--ink);margin:30px 0 10px}
  .pc-page p{margin-bottom:14px}
  .pc-page a{color:var(--lime);text-decoration:underline}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:var(--font-body);
    font-size:17px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  ::selection{background:var(--lime);color:#0B0E11}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}
  h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.02;letter-spacing:-.02em}

  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
  .mono{font-family:var(--font-mono);letter-spacing:.02em}
  .tag{
    font-family:var(--font-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;
    color:var(--lime);display:inline-flex;align-items:center;gap:9px;
  }
  .tag::before{content:"";width:7px;height:7px;background:var(--lime);border-radius:50%;box-shadow:0 0 0 4px rgba(20,196,168,.15)}

  /* grain overlay */
  body::before{
    content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.035;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  /* ---------- TICKER BAR ---------- */
  .ticker{
    background:var(--lime);color:#0B0E11;overflow:hidden;white-space:nowrap;
    border-bottom:1px solid #0d8f7c;position:relative;
  }
  .ticker__track{display:inline-flex;gap:0;animation:marquee 28s linear infinite;will-change:transform}
  .ticker span{font-family:var(--font-mono);font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:9px 26px;display:inline-flex;align-items:center;gap:26px}
  .ticker span::after{content:"◆";font-size:8px;opacity:.55}
  @keyframes marquee{to{transform:translateX(-50%)}}

  /* ---------- NAV ---------- */
  header.nav{position:sticky;top:0;z-index:900;background:rgba(10,16,25,.72);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .3s var(--ease),background .3s var(--ease)}
  header.nav.scrolled{border-bottom-color:var(--line);background:rgba(10,16,25,.9)}
  .nav__row{display:flex;align-items:center;justify-content:space-between;height:74px;gap:24px}
  .logo{display:flex;align-items:center;gap:11px}
  .logo__mark{width:34px;height:34px;flex:none}
  .wm{font-family:'DM Sans',sans-serif;font-weight:800;font-size:23px;letter-spacing:-.03em;display:inline-flex;transform:skewX(-7deg);line-height:1}
  .wm b{color:var(--lime);font-weight:800}
  .wm span{color:var(--ink);font-weight:800}
  .nav__links{display:flex;gap:34px;align-items:center}
  .nav__links a{font-size:14.5px;color:var(--ink-dim);font-weight:500;transition:color .2s var(--ease);position:relative}
  .nav__links a:hover{color:var(--ink)}
  .nav__links a::after{content:"";position:absolute;left:0;bottom:-6px;height:2px;width:0;background:var(--lime);transition:width .25s var(--ease)}
  .nav__links a:hover::after{width:100%}
  .nav__cta{display:flex;align-items:center;gap:14px}

  .btn{
    display:inline-flex;align-items:center;gap:10px;font-family:var(--font-body);font-weight:700;
    font-size:15px;padding:13px 22px;border-radius:11px;cursor:pointer;border:1px solid transparent;
    transition:transform .18s var(--ease),background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease);white-space:nowrap;
  }
  .btn:active{transform:scale(.97)}
  .tier:active,.review:active,.pl__row:active{transform:scale(.995)}
  .btn--lime{background:var(--lime);color:#0B0E11}
  .btn--lime:hover{background:#1FE3C4}
  .btn--ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
  .btn--ghost:hover{border-color:var(--lime);color:var(--lime)}
  .btn--big{padding:17px 30px;font-size:16px;border-radius:13px}
  .btn svg{width:17px;height:17px}

  .nav__burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
  .nav__burger span{width:24px;height:2px;background:var(--ink);transition:.25s var(--ease)}

  /* ---------- HERO ---------- */
  .hero{position:relative;padding:78px 0 90px;overflow:hidden}
  .hero__glow{position:absolute;top:-180px;right:-120px;width:640px;height:640px;
    background:radial-gradient(circle,rgba(20,196,168,.14),transparent 62%);pointer-events:none;filter:blur(6px)}
  .hero__grid-lines{position:absolute;inset:0;pointer-events:none;opacity:.5;
    background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
    background-size:64px 64px;mask-image:radial-gradient(circle at 70% 25%,#000,transparent 72%);
    -webkit-mask-image:radial-gradient(circle at 70% 25%,#000,transparent 72%)}
  .hero__inner{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}

  .hero h1{font-size:clamp(44px,6.4vw,88px);font-weight:700;line-height:.96;margin:22px 0 24px}
  .hero h1 .out{color:transparent;-webkit-text-stroke:1.4px var(--ink-faint)}
  .hero h1 em{font-style:normal;color:var(--lime);position:relative;display:inline-block}
  .hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:12px;background:rgba(20,196,168,.16);z-index:-1;transform:skewX(-8deg)}
  .hero p.lead{font-size:19px;color:var(--ink-dim);max-width:46ch;margin-bottom:34px}
  .hero__cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
  .hero__phone{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-mono);font-weight:700;font-size:15px;color:var(--ink);padding-left:6px}
  .hero__phone svg{width:16px;height:16px;color:var(--lime)}

  .reveal{opacity:0;transform:translateY(24px);animation:rise .8s var(--ease) forwards}
  .reveal.d1{animation-delay:.05s}.reveal.d2{animation-delay:.15s}.reveal.d3{animation-delay:.25s}.reveal.d4{animation-delay:.35s}.reveal.d5{animation-delay:.45s}
  @keyframes rise{to{opacity:1;transform:none}}

  /* device visual */
  .device{position:relative;justify-self:center;width:262px;aspect-ratio:9/19;border-radius:38px;
    background:linear-gradient(160deg,#1a2129,#0d1116);border:1px solid var(--line-2);
    box-shadow:0 40px 90px -30px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.05);
    padding:11px;transform:rotate(4deg);transition:transform .6s var(--ease)}
  .device:hover{transform:rotate(0deg)}
  .device__screen{width:100%;height:100%;border-radius:28px;background:radial-gradient(120% 90% at 50% 0%,#141b22,#0a0d11);
    overflow:hidden;position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:26px 20px}
  .device__notch{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:78px;height:20px;background:#05070a;border-radius:12px}
  .device__status{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:10px;color:var(--ink-faint);margin-top:6px}
  .device__pulse{align-self:center;text-align:center}
  .device__ring{width:96px;height:96px;border-radius:50%;border:2px solid var(--line-2);position:relative;margin:0 auto 16px;display:grid;place-items:center}
  .device__ring::before{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid transparent;border-top-color:var(--lime);animation:spin 1.6s linear infinite}
  @keyframes spin{to{transform:rotate(360deg)}}
  .device__ring svg{width:38px;height:38px;color:var(--lime)}
  .device__pulse .lbl{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:var(--lime);text-transform:uppercase}
  .device__pulse .sub{font-size:12px;color:var(--ink-faint);margin-top:4px}
  .device__bar{height:5px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:4px}
  .device__bar i{display:block;height:100%;width:38%;background:var(--lime);border-radius:3px;animation:fill 3s var(--ease) infinite alternate}
  @keyframes fill{from{width:24%}to{width:82%}}
  .device__foot{font-family:var(--font-mono);font-size:10px;color:var(--ink-faint);display:flex;justify-content:space-between}

  /* stat strip */
  .trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg-2)}
  .trust__row{display:grid;grid-template-columns:repeat(4,1fr)}
  .trust__cell{padding:30px 28px;border-right:1px solid var(--line)}
  .trust__cell:last-child{border-right:0}
  .trust__cell .num{font-family:var(--font-display);font-size:34px;font-weight:700;letter-spacing:-.03em;color:var(--ink)}
  .trust__cell .num small{color:var(--lime);font-size:.7em}
  .trust__cell .desc{font-size:13.5px;color:var(--ink-dim);margin-top:2px}

  /* ---------- SECTION SHELL ---------- */
  section{position:relative}
  .sec{padding:92px 0}
  .sec__head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:52px}
  .sec__head h2{font-size:clamp(30px,4vw,50px);font-weight:600;max-width:16ch}
  .sec__head p{color:var(--ink-dim);max-width:38ch;font-size:16px}
  .idx{font-family:var(--font-mono);font-size:12px;color:var(--ink-faint);letter-spacing:.1em}

  /* ---------- SERVICES ---------- */
  .svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
  .svc{background:var(--panel);padding:34px 30px 30px;position:relative;transition:background .3s var(--ease);min-height:230px;display:flex;flex-direction:column}
  .svc:hover{background:#161d24}
  .svc__ico{width:46px;height:46px;border-radius:12px;background:rgba(20,196,168,.08);border:1px solid rgba(20,196,168,.22);display:grid;place-items:center;color:var(--lime);margin-bottom:20px;transition:transform .3s var(--ease)}
  .svc:hover .svc__ico{transform:translateY(-4px)}
  .svc__ico svg{width:23px;height:23px}
  .svc h3{font-size:20px;margin-bottom:8px;font-weight:600}
  .svc p{font-size:14.5px;color:var(--ink-dim);flex:1}
  .svc__price{margin-top:18px;font-family:var(--font-mono);font-size:13px;color:var(--ink-faint);display:flex;justify-content:space-between;align-items:center;padding-top:16px;border-top:1px dashed var(--line-2)}
  .svc__price b{color:var(--lime);font-size:15px}
  .svc__num{position:absolute;top:22px;right:24px;font-family:var(--font-mono);font-size:12px;color:var(--ink-faint)}

  /* ---------- PROCESS ---------- */
  .process{background:var(--bg-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;counter-reset:step}
  .step{position:relative;padding-top:30px;border-top:2px solid var(--line-2)}
  .step::before{counter-increment:step;content:"0" counter(step);font-family:var(--font-mono);font-size:13px;color:var(--lime);position:absolute;top:-12px;left:0;background:var(--bg-2);padding-right:10px}
  .step h4{font-size:19px;margin-bottom:8px}
  .step p{font-size:14.5px;color:var(--ink-dim)}
  .step.active{border-top-color:var(--lime)}

  /* ---------- PRICING ---------- */
  .pl__pick{display:flex;flex-direction:column;gap:10px;margin-bottom:30px;max-width:420px}
  .pl__pick label{font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint)}
  .pl__pick select{appearance:none;-webkit-appearance:none;background-color:var(--panel);border:1px solid var(--line-2);border-radius:12px;padding:15px 46px 15px 18px;color:var(--ink);font-family:var(--font-display);font-size:17px;font-weight:600;cursor:pointer;transition:border-color .2s var(--ease);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314C4A8' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 16px center;background-size:18px}
  .pl__pick select:hover,.pl__pick select:focus{border-color:var(--lime);outline:none}

  .pl__grp{margin-bottom:34px}
  .pl__grp:last-child{margin-bottom:0}
  .pl__gt{font-family:var(--font-display);font-size:20px;font-weight:600;margin:0 0 16px;display:flex;align-items:center;gap:12px}
  .pl__gt::after{content:"";flex:1;height:1px;background:var(--line)}

  .tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
  .tier{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);padding:20px 22px;transition:border-color .2s var(--ease),background .2s var(--ease)}
  .tier:hover{border-color:var(--line-2);background:#161d24}
  .tier__top{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:10px}
  .tier__n{font-family:var(--font-display);font-size:15.5px;font-weight:600;color:var(--ink)}
  .tier__p{font-family:var(--font-mono);font-size:17px;font-weight:700;color:var(--lime);white-space:nowrap}
  .tier__d{font-size:13.5px;line-height:1.6;color:var(--ink-dim);margin:0}

  .pl__rows{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel)}
  .pl__row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 22px;border-bottom:1px solid var(--line);transition:background .2s var(--ease);font-size:15px}
  .pl__row:last-child{border-bottom:0}
  .pl__row:hover{background:#161d24}
  .pl__rp{font-family:var(--font-mono);font-size:15px;color:var(--lime);white-space:nowrap}

  .price-note{font-size:13px;color:var(--ink-faint);margin-top:26px;line-height:1.65;max-width:70ch}

  /* ---------- OPENING / CITY2 ---------- */
  .city{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
  .city__info{padding:52px 48px;background:var(--panel)}
  .city__info h2{font-size:clamp(28px,3.4vw,42px);margin:18px 0 18px}
  .city__info p{color:var(--ink-dim);margin-bottom:26px;max-width:40ch}
  .city__list{list-style:none;display:flex;flex-direction:column;gap:16px;margin-bottom:32px}
  .city__list li{display:flex;gap:14px;align-items:flex-start;font-size:15px}
  .city__list svg{width:20px;height:20px;color:var(--lime);flex:none;margin-top:2px}
  .city__list b{display:block;font-family:var(--font-display);font-size:15px}
  .city__list span{color:var(--ink-dim);font-size:14px}
  .city__map{background:
    linear-gradient(rgba(10,16,25,.4),rgba(10,16,25,.75)),
    repeating-linear-gradient(0deg,#151b22,#151b22 1px,transparent 1px,transparent 40px),
    repeating-linear-gradient(90deg,#151b22,#151b22 1px,transparent 1px,transparent 40px),
    #0e1318;
    position:relative;min-height:420px;display:grid;place-items:center}
  .city__pin{text-align:center}
  .city__pin .dot{width:22px;height:22px;border-radius:50%;background:var(--lime);margin:0 auto 14px;position:relative;box-shadow:0 0 0 8px rgba(20,196,168,.15)}
  .city__pin .dot::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid var(--lime);animation:ping 2s var(--ease) infinite;opacity:0}
  @keyframes ping{0%{transform:scale(.7);opacity:.8}100%{transform:scale(2.4);opacity:0}}
  .city__pin b{font-family:var(--font-display);font-size:22px;display:block}
  .city__pin span{font-family:var(--font-mono);font-size:12px;color:var(--ink-dim);letter-spacing:.1em}

  /* ---------- REVIEWS ---------- */
  .reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .review{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:30px 28px;display:flex;flex-direction:column;gap:16px}
  .review p{font-size:15.5px;color:var(--ink);line-height:1.55}
  .promise{gap:14px}
  .promise__ic{width:40px;height:40px;border-radius:11px;background:rgba(20,196,168,.12);border:1px solid rgba(20,196,168,.3);display:grid;place-items:center;color:var(--lime)}
  .promise__ic svg{width:20px;height:20px}
  .promise__t{font-family:var(--font-display);font-size:17px;font-weight:600;color:var(--ink);line-height:1.3}
  .promise p{font-size:14.5px;color:var(--ink-dim);line-height:1.6}

  /* ---------- FAQ ---------- */
  .faq{max-width:840px;margin:0 auto}
  .faq__item{border-bottom:1px solid var(--line)}
  .faq__q{width:100%;text-align:left;background:none;border:0;color:var(--ink);cursor:pointer;
    padding:26px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;font-family:var(--font-display);font-size:19px;font-weight:500}
  .faq__q:hover{color:var(--lime)}
  .faq__ico{flex:none;width:26px;height:26px;border:1px solid var(--line-2);border-radius:50%;display:grid;place-items:center;transition:.3s var(--ease);position:relative}
  .faq__ico::before,.faq__ico::after{content:"";position:absolute;background:var(--lime);border-radius:2px}
  .faq__ico::before{width:11px;height:2px}.faq__ico::after{width:2px;height:11px;transition:transform .3s var(--ease)}
  .faq__item.open .faq__ico{background:var(--lime);border-color:var(--lime)}
  .faq__item.open .faq__ico::before,.faq__item.open .faq__ico::after{background:#0B0E11}
  .faq__item.open .faq__ico::after{transform:scaleY(0)}
  .faq__a{max-height:0;overflow:hidden;transition:max-height .38s var(--ease)}
  .faq__a p{padding-bottom:26px;color:var(--ink-dim);font-size:16px;max-width:70ch}

  /* ---------- CTA ---------- */
  .cta{position:relative;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--panel);padding:64px 56px;text-align:center}
  .cta__glow{position:absolute;bottom:-200px;left:50%;transform:translateX(-50%);width:700px;height:400px;background:radial-gradient(circle,rgba(20,196,168,.13),transparent 65%);pointer-events:none}
  .cta h2{position:relative;font-size:clamp(30px,4.4vw,54px);margin-bottom:18px}
  .cta p{position:relative;color:var(--ink-dim);max-width:44ch;margin:0 auto 34px;font-size:18px}
  .cta__row{position:relative;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

  /* ---------- FOOTER ---------- */
  footer{border-top:1px solid var(--line);background:var(--bg-2);padding:64px 0 34px;margin-top:0}
  .foot__top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px;padding-bottom:48px;border-bottom:1px solid var(--line)}
  .foot__brand p{color:var(--ink-dim);font-size:14.5px;max-width:34ch;margin-top:16px}
  .foot__col h5{font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:18px}
  .foot__col a,.foot__col p{display:block;color:var(--ink-dim);font-size:14.5px;margin-bottom:11px;transition:color .2s var(--ease)}
  .foot__col a:hover{color:var(--lime)}
  .foot__bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:28px;flex-wrap:wrap}
  .foot__bottom p{font-family:var(--font-mono);font-size:12.5px;color:var(--ink-faint)}

  /* ---------- ACCESSORIES ---------- */
  .acc{background:var(--bg-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .acc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
  .acc-card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:40px 38px 34px;overflow:hidden;transition:border-color .3s var(--ease),transform .3s var(--ease)}
  .acc-card:hover{border-color:var(--line-2);transform:translateY(-4px)}
  .acc-card::after{content:"";position:absolute;top:-60px;right:-60px;width:180px;height:180px;background:radial-gradient(circle,rgba(20,196,168,.10),transparent 70%);opacity:0;transition:opacity .3s var(--ease)}
  .acc-card:hover::after{opacity:1}
  .acc-card .aico{width:58px;height:58px;border-radius:15px;background:rgba(20,196,168,.07);border:1px solid rgba(20,196,168,.2);display:grid;place-items:center;color:var(--lime);margin-bottom:24px}
  .acc-card .aico svg{width:29px;height:29px}
  .acc-card h3{font-size:24px;margin-bottom:10px;font-weight:600}
  .acc-card p{font-size:15px;color:var(--ink-dim);margin-bottom:20px;max-width:42ch}
  .acc-card .feat{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:24px}
  .acc-card .feat li{font-size:14.5px;color:var(--ink);display:flex;gap:11px;align-items:flex-start}
  .acc-card .feat li svg{width:17px;height:17px;color:var(--lime);flex:none;margin-top:3px}
  .acc-card .from{font-family:var(--font-mono);font-size:14px;color:var(--lime);padding-top:20px;border-top:1px dashed var(--line-2);display:block}
  .acc-note{display:flex;align-items:center;gap:14px;margin-top:32px;padding:20px 26px;border:1px dashed var(--line-2);border-radius:var(--radius);background:var(--panel)}
  .acc-note svg{width:22px;height:22px;color:var(--lime);flex:none}
  .acc-note p{font-size:14.5px;color:var(--ink-dim);margin:0}
  .acc-note b{color:var(--ink);font-family:var(--font-display)}

  /* ---------- NEDTÆLLING ---------- */
  .cd{display:flex;gap:10px;margin:20px 0 26px;max-width:420px}
  .cd__item{flex:1;background:var(--bg-2);border:1px solid var(--line-2);border-radius:12px;padding:14px 6px;text-align:center;position:relative;overflow:hidden}
  .cd__item::after{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,rgba(20,196,168,.5),transparent)}
  .cd__item b{display:block;font-family:var(--font-display);font-size:31px;font-weight:700;color:var(--lime);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
  .cd__item span{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin-top:7px;display:block}
  .cd--done{font-family:var(--font-display);font-size:22px;font-weight:600;color:var(--lime);margin:20px 0 26px}

  /* ---------- VENTELISTE ---------- */
  .wl{margin-bottom:30px}
  .wl__perk{font-size:15px;color:var(--ink-dim);margin-bottom:16px;max-width:44ch}
  .wl__perk b{color:var(--lime);font-family:var(--font-display);font-weight:600}
  .wl__row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
  .wl__row .book__field.full{grid-column:1/-1}
  .wl__notice{border-radius:11px;padding:13px 16px;margin-bottom:14px;font-size:14.5px;border:1px solid}
  .wl__notice--ok{background:rgba(20,196,168,.1);border-color:var(--lime);color:var(--ink)}
  .wl__notice--err{background:rgba(255,107,74,.12);border-color:var(--warn);color:var(--ink)}
  .wl__code{font-family:var(--font-mono);font-weight:700;color:var(--lime)}
  .wl label.wl__check{display:block;position:relative;padding-left:29px;font-family:var(--font-body);font-size:13.5px;font-weight:400;letter-spacing:normal;text-transform:none;color:var(--ink-dim);line-height:1.55;cursor:pointer}
  .wl .wl__check input{position:absolute;left:0;top:2px;width:18px;min-width:18px;height:18px;margin:0;padding:0;border-radius:4px;background:var(--bg-2);accent-color:var(--lime)}
  .wl .wl__check a{color:var(--lime);text-decoration:underline}
  .wl label[for="pc_cap"]{font-family:var(--font-body);font-size:13.5px;font-weight:600;letter-spacing:normal;text-transform:none;color:var(--ink)}
  .wl #pc_cap{max-width:110px;text-align:center;letter-spacing:.1em}
  .wl__check a{color:var(--lime);text-decoration:underline}

  /* ---------- BOOKING ---------- */
  .book__wrap{max-width:780px;margin:0 auto;position:relative}
  .book__notice{border-radius:12px;padding:16px 20px;margin-bottom:24px;font-size:15.5px;border:1px solid}
  .book__notice--ok{background:rgba(20,196,168,.1);border-color:var(--lime);color:var(--ink)}
  .book__notice--err{background:rgba(255,107,74,.12);border-color:var(--warn);color:var(--ink)}
  .book__form{display:grid;grid-template-columns:1fr 1fr;gap:18px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:36px}
  .book__field{display:flex;flex-direction:column;gap:8px}
  .book__field.full{grid-column:1/-1}
  .book__field label{font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim)}
  .book__field input,.book__field select,.book__field textarea{background:var(--bg-2);border:1px solid var(--line-2);border-radius:10px;padding:13px 15px;color:var(--ink);font-family:var(--font-body);font-size:15px;transition:border-color .2s var(--ease);width:100%}
  .book__field input:focus,.book__field select:focus,.book__field textarea:focus{outline:none;border-color:var(--lime)}
  .book__field textarea{resize:vertical;min-height:96px}
  .book__submit{grid-column:1/-1;margin-top:4px}
  .book__submit .btn{width:100%;justify-content:center}
  .pc-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}

  /* ---------- VI REPARERER OGSÅ ---------- */
  .also{margin-top:46px}
  .also__label{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:22px;display:flex;align-items:center;gap:16px}
  .also__label::after{content:"";flex:1;height:1px;background:var(--line)}
  .dev-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
  .dev{display:flex;align-items:center;gap:13px;padding:17px 20px;background:var(--panel);border:1px solid var(--line);border-radius:13px;transition:border-color .25s var(--ease),transform .25s var(--ease)}
  .dev:hover{border-color:var(--line-2);transform:translateY(-3px)}
  .dev svg{width:23px;height:23px;color:var(--lime);flex:none}
  .dev b{font-family:var(--font-display);font-size:15px;font-weight:600}
  .also__extra{margin-top:24px;font-size:15.5px;color:var(--ink-dim);max-width:64ch}
  .also__extra b{color:var(--ink);font-family:var(--font-display);font-weight:600}

  /* ---------- RESPONSIVE ---------- */
  @media(max-width:960px){
    .hero__inner{grid-template-columns:1fr;gap:44px}
    .device{transform:rotate(0);order:-1}
    .trust__row{grid-template-columns:1fr 1fr}
    .trust__cell:nth-child(2){border-right:0}
    .trust__cell{border-bottom:1px solid var(--line)}
    .svc-grid{grid-template-columns:1fr 1fr}
    .dev-grid{grid-template-columns:repeat(3,1fr)}
    .acc-grid{grid-template-columns:1fr 1fr}
    .steps{grid-template-columns:1fr 1fr;gap:34px}
    .city{grid-template-columns:1fr}
    .city__map{min-height:300px;order:-1}
    .reviews{grid-template-columns:1fr}
    .foot__top{grid-template-columns:1fr 1fr}
  }
  @media(max-width:640px){
    .nav__links{display:none}
    .nav__cta .btn--ghost{display:none}
    .nav__burger{display:flex}
    .pl__pick{max-width:none}
    .tiers{grid-template-columns:1fr}
    .pl__row{padding:14px 16px}
    .tier{padding:17px 18px}
    .svc-grid{grid-template-columns:1fr}
    .book__form{grid-template-columns:1fr;padding:26px}
    .dev-grid{grid-template-columns:1fr 1fr}
    .acc-grid{grid-template-columns:1fr;gap:16px}
    .acc-card{padding:30px 24px 26px}
    .steps{grid-template-columns:1fr}
    .sec{padding:66px 0}
    .sec__head{flex-direction:column;align-items:flex-start}
    .city__info,.cta{padding:40px 26px}
    .foot__top{grid-template-columns:1fr}
    .trust__cell .num{font-size:28px}
  }

  /* mobile menu */
  .mmenu{position:fixed;inset:0;z-index:950;background:rgba(10,16,25,.97);backdrop-filter:blur(10px);display:none;flex-direction:column;padding:100px 32px 40px;gap:6px}
  .mmenu.open{display:flex}
  .mmenu a{font-family:var(--font-display);font-size:30px;font-weight:600;padding:14px 0;border-bottom:1px solid var(--line);color:var(--ink)}
  .mmenu a:last-of-type{border-bottom:0}
  .mmenu .btn{margin-top:24px;justify-content:center}
  .mmenu__close{position:absolute;top:26px;right:24px;background:none;border:0;color:var(--ink);font-size:34px;cursor:pointer;line-height:1}


  /* ---------- POLERING: materiale og bevaegelse ---------- */
  /* Langsomt drivende omgivelseslys - giver hero'en liv uden en eneste byte JS */
  @keyframes pc-drift{
    0%,100%{transform:translate3d(0,0,0) scale(1)}
    50%{transform:translate3d(3%,-2%,0) scale(1.06)}
  }
  .hero__glow{animation:pc-drift 18s ease-in-out infinite;will-change:transform}

  /* Kort loefter sig ganske lidt og faar teal kant - taktilt uden at hoppe */
  .tier,.review{will-change:transform}
  .tier:hover,.review:hover{transform:translateY(-3px);border-color:rgba(20,196,168,.34)}
  .pl__pick select:hover{transform:translateY(-1px)}

  /* Trin-vis indtoning: elementer kommer 45 ms efter hinanden, ikke alle paa en gang */
  .reveal.in>*:nth-child(1){transition-delay:0ms}
  .reveal.in>*:nth-child(2){transition-delay:45ms}
  .reveal.in>*:nth-child(3){transition-delay:90ms}
  .reveal.in>*:nth-child(4){transition-delay:135ms}
  .reveal.in>*:nth-child(5){transition-delay:180ms}
  .reveal.in>*:nth-child(6){transition-delay:225ms}

  /* Fokus-ring der matcher brandet (tilgaengelighed, ikke pynt) */
  a:focus-visible,button:focus-visible,select:focus-visible,
  input:focus-visible,textarea:focus-visible{
    outline:2px solid var(--lime);outline-offset:3px;border-radius:6px}

  @media(prefers-reduced-motion:reduce){
    *{animation:none!important;transition:none!important;transition-delay:0ms!important}
    .tier:hover,.review:hover,.pl__pick select:hover{transform:none}
    .reveal{opacity:1;transform:none}
  }


  /* ================================================================
     V3 - HELSIDE-LOEFT
     Alt herunder er ren CSS. Ingen nye filer, ingen tredjepartskald.
     ================================================================ */

  /* --- Ankre landede under den klaebende nav. Nu goer de ikke. --- */
  [id]{scroll-margin-top:92px}

  /* --- Spring-til-indhold (tastaturbrugere) --- */
  .skip{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--lime);color:#0B0E11;
    font-family:var(--font-body);font-weight:700;font-size:15px;padding:12px 20px;border-radius:0 0 12px 0}
  .skip:focus{left:0}

  /* --- Laesefremskridt: scroll-drevet, nul JS.
         Firefox uden scroll-timeline faar bare ingen bjaelke. --- */
  .prog{position:absolute;left:0;right:0;bottom:-1px;height:2px;pointer-events:none;overflow:hidden}
  .prog i{display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:0 50%;
    background:linear-gradient(90deg,var(--lime-deep),var(--lime));box-shadow:0 0 14px rgba(20,196,168,.55)}
  @supports (animation-timeline:scroll()){
    .prog i{animation:pc-prog linear both;animation-timeline:scroll(root block)}
  }
  @keyframes pc-prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}

  /* --- Ticker: pauseknap (WCAG 2.2.2 - bevaegelse skal kunne stoppes) --- */
  .ticker{position:relative}
  .ticker.paused .ticker__track{animation-play-state:paused}
  .ticker__pause{position:absolute;right:0;top:0;bottom:0;width:38px;z-index:2;cursor:pointer;
    background:linear-gradient(90deg,rgba(20,196,168,0),var(--lime) 45%);border:0;padding:0}
  .ticker__pause::before{content:"";display:block;width:9px;height:11px;margin:0 auto;
    border-left:3px solid #0B0E11;border-right:3px solid #0B0E11}
  .ticker.paused .ticker__pause::before{width:0;height:0;border:6px solid transparent;border-left:10px solid #0B0E11;border-right:0}
  .ticker__pause:focus-visible{outline:2px solid #0B0E11;outline-offset:-4px}

  /* --- Nav: aktivt afsnit markeres, mens man scroller --- */
  .nav__links a.is-active{color:var(--ink)}
  .nav__links a.is-active::after{width:100%}

  /* --- Sektionsnummer faar en teal haarstreg. Rytme, ikke pynt. --- */
  .idx{display:inline-flex;align-items:center;gap:14px}
  .idx::after{content:"";width:86px;height:1px;background:linear-gradient(90deg,var(--lime),transparent)}

  /* --- Lyskegle under markoeren.
         Lagt i background-image, ikke et pseudoelement, saa den aldrig
         kan lande oven paa teksten. --- */
  @media (hover:hover) and (pointer:fine){
    .svc:hover,.tier:hover,.acc-card:hover,.dev:hover,.review:hover{
      background-image:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(20,196,168,.11),transparent 70%)}
  }

  /* --- Primaerknap: et enkelt lysstroeg ved hover --- */
  .btn--lime{position:relative;overflow:hidden}
  .btn--lime>*{position:relative;z-index:1}
  .btn--lime::after{content:"";position:absolute;top:0;left:-60%;width:38%;height:100%;opacity:0;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg)}
  .btn--lime:hover::after{animation:pc-sheen .75s var(--ease) forwards}
  @keyframes pc-sheen{from{left:-60%;opacity:1}to{left:120%;opacity:1}}

  /* --- Hero-telefonen faar en langsom scanning hen over skaermen --- */
  .device__screen::after{content:"";position:absolute;left:0;right:0;top:-140px;height:140px;pointer-events:none;
    background:linear-gradient(180deg,transparent,rgba(20,196,168,.10),transparent);
    animation:pc-scan 5s cubic-bezier(.5,0,.5,1) infinite}
  @keyframes pc-scan{0%{transform:translateY(0)}100%{transform:translateY(760px)}}

  /* --- Mobil handlingsbjaelke: Ring / Book altid indenfor raekkevidde.
         Paa mobil er nav'ens telefonknap skjult, saa uden den her har en
         besoegende paa telefon ingen synlig vej til at ringe. --- */
  .mbar{position:fixed;left:0;right:0;bottom:0;z-index:880;display:none;gap:10px;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    background:rgba(10,16,25,.88);backdrop-filter:blur(14px);border-top:1px solid var(--line);
    transform:translateY(120%);transition:transform .45s var(--ease)}
  .mbar.show{transform:none}
  .mbar .btn{flex:1;justify-content:center;padding:14px 16px}
  @media(max-width:640px){
    .mbar{display:flex}
    footer{padding-bottom:104px}
  }

  @media(prefers-reduced-motion:reduce){
    .prog i{transform:scaleX(0)}
    .mbar{transition:none}
  }