/* ==========================================================================
   CARCARTEL — main.css
   ========================================================================== */

/* ---------- Fonts (lokale webfonts) ---------- */
/* Italian Plate — brødtekst/UI */
@font-face{font-display:swap;font-family:italian;font-style:normal;font-weight:400;src:url(../fonts/italian-plate-400.woff2) format("woff2")}
/* SangBleu Sans — display-overskrifter */
@font-face{font-display:swap;font-family:sangbleusans;font-weight:100;font-style:normal;src:url(../fonts/sangbleu-100.woff2) format("woff2")}
@font-face{font-display:swap;font-family:sangbleusans;font-weight:400;font-style:normal;src:url(../fonts/sangbleu-400.woff2) format("woff2")}
@font-face{font-display:swap;font-family:sangbleusans;font-weight:500;font-style:normal;src:url(../fonts/sangbleu-500.woff2) format("woff2")}
/* F37 Judge — labels/pretitles/wordmark */
@font-face{font-display:swap;font-family:f37judge;font-weight:400;font-style:normal;src:url(../fonts/f37judge-400.woff2) format("woff2")}
@font-face{font-display:swap;font-family:f37judge;font-weight:100;font-style:normal;src:url(../fonts/f37judge-100.woff2) format("woff2")}
/* Tiempos Headline Light — serif-accenter, kort-titler, tal */
@font-face{font-family:'Tiempos Headline';src:url(../fonts/tiempos-300.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}
/* Monument Extended — wordmark (leveret af kunden) */
@font-face{font-family:'Monument Extended';src:url(../fonts/monument-extended-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --canvas:#f8f8f8;          /* off-white flade */
  --paper:#fff;
  --ink:#1a1a1a;             /* naer-sort tekst */
  --black:#0b0b0e;           /* --theme-color_black */
  --dark:#141414;            /* bg-gray-dark */
  --accent:#d2c7ae;          /* champagne/beige */
  --accent-deep:#c1b494;     /* moerk beige */
  --gray:#707070;            /* */
  --eyebrow-gray:#afafaf;    /* h6 eyebrow */
  --card-ink:#1b1d1f;        /* near-black */
  --font-body:italian,sans-serif;
  --font-display:sangbleusans,Georgia,serif;
  --font-label:f37judge,sans-serif;
  --font-serif:'Tiempos Headline',Times,serif;
}

/* ---------- Base (adapteret body + antialias) ---------- */
*,:before,:after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);font-size:1rem;font-weight:400;line-height:1.4;color:var(--ink);background:var(--dark);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font-family:inherit;background:none;border:0;cursor:pointer;color:inherit}
input{font-family:inherit}
.no-select{user-select:none;-webkit-user-select:none}

/* ---------- Layout-primitiver (verbatim entry.DAqq1F_E.css) ---------- */
.grid-default{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));row-gap:2.5rem}
.padding-default{padding-left:1.25rem;padding-right:1.25rem}
.padding-top{padding-top:2.5rem}
.padding-bottom{padding-bottom:2.5rem}
@media(min-width:768px){
  .grid-default{gap:1rem;column-gap:3.5rem}
  .padding-default{padding-left:2.5rem;padding-right:2.5rem}
  .padding-top{padding-top:5rem}
  .padding-bottom{padding-bottom:5rem}
}
.col-full{grid-column:1/-1}
@media(min-width:768px){
  .md-col-3{grid-column-end:span 3}
  .md-col-4{grid-column-end:span 4}
  .md-col-5{grid-column-end:span 5}
  .md-col-6{grid-column-end:span 6}
  .md-start-2{grid-column-start:2}
  .md-start-6{grid-column-start:6}
  .md-start-7{grid-column-start:7}
  .md-start-8{grid-column-start:8}
}

/* ---------- Typografisk skala (verbatim) ---------- */
.h1{font-size:4.375rem;line-height:1.1}
.h2{font-size:2.813rem;line-height:1.1}
.h3{font-size:2.188rem;line-height:1.1}
.h4{font-size:1.875rem;line-height:1.1}
.h5{font-size:1.563rem;line-height:1.2}
@media(min-width:768px){
  .h1{font-size:5.625rem}.h2{font-size:3.125rem}.h3{font-size:2.5rem}.h4{font-size:2.125rem}.h5{font-size:1.75rem}
}
/* sektionsoverskrift: uppercase font-light tracking-tight, fluid clamp */
.section-headline{font-family:var(--font-body);font-weight:300;text-transform:uppercase;letter-spacing:-.025em;color:#2d2d2d;font-size:clamp(2.25rem,7vw,4.75rem);line-height:1.1}
.section-headline--sm{font-size:clamp(1.9rem,3.4vw,3.1rem)}
/* eyebrow */
.eyebrow{text-transform:uppercase;font-size:1rem;margin-bottom:1rem}
/* h6 eyebrow (verbatim vaerdier, font swappet til Italian Plate) */
.eyebrow-f{color:var(--eyebrow-gray);text-transform:uppercase;font-size:14px;letter-spacing:2px;font-weight:400;margin-bottom:1rem}
/* display-overskrift til moerke sektioner (klasse-vaerdier fra text-48-56 lg:text-6_25vw + sangbleusans font-light uppercase tracking-10) */
.display-h{font-family:var(--font-body);font-weight:300;text-transform:uppercase;letter-spacing:-.02em;color:var(--accent);font-size:clamp(2.6rem,6.25vw,7rem);line-height:1.1}
/* druk pretitle */
.pretitle{font-family:var(--font-body);font-weight:400;text-transform:uppercase;letter-spacing:.16em;color:var(--accent);font-size:clamp(13px,1.1vw,17px)}

/* ==========================================================================
   KNAPPER — pill m. cirkel-ikon og flood-fill hover (verbatim, gul→champagne)
   ========================================================================== */
.button{align-items:center;border-radius:3.75rem;display:inline-flex;justify-content:space-between;overflow:hidden;padding:.5rem .5rem .5rem 1.25rem;text-decoration:none;will-change:transform,background-color,border-color,color}
.button,.button .text{backface-visibility:hidden;position:relative;transform:translateZ(0)}
.button .text{color:#f8f8f8;font-size:1rem;font-weight:500;margin-right:.9375rem;text-transform:uppercase;top:1px;z-index:2;white-space:nowrap}
.button .circle{align-items:center;display:flex;height:1.875rem;justify-content:center;min-width:1.875rem;position:relative;width:1.875rem;z-index:1;border-radius:50%}
.button .circle:before{clip-path:circle(50% at 50% 50%);content:"";height:100%;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) scale(1);transition:transform .5s ease;width:100%;z-index:-1;border-radius:50%}
.button .arrow{height:13px;width:13px;transition:transform .3s ease}
.button:hover .circle:before{transform:translate(-50%,-50%) scale(20)}
.button:hover .arrow{transform:translate(-3px)}
/* .button--black → .button--dark (accent-swap) */
.button--dark{background-color:#f8f8f8;border:none;box-shadow:inset 0 0 0 1px #000;transition:background-color .5s ease,box-shadow .2s ease}
.button--dark .text{color:#000}
.button--dark .circle,.button--dark .circle:before{background:#000;transition:background-color .5s ease,transform .5s ease}
.button--dark .arrow{fill:var(--accent)}
.button--dark:hover{background-color:#000}
.button--dark:hover .circle:before{background:#000;transform:translate(-50%,-50%) scale(20)}
.button--dark:hover .text{color:#f8f8f8}
/* .button--transparent (verbatim) — til moerke flader */
.button--transparent{background-color:transparent;border:1px solid transparent;box-shadow:inset 0 0 0 1px #fff;transition:background-color .5s ease}
.button--transparent .text{color:#f8f8f8;transition:color .3s ease}
.button--transparent .circle,.button--transparent .circle:before{background:#f8f8f8}
.button--transparent .arrow{fill:#000}
.button--transparent:hover{background-color:#f8f8f8}
.button--transparent:hover .text{color:#000}
/* lille pill-knap ("SE DETALJER" fra coverflow, verbatim utilities) */
.btn-pill{background:#fff;color:#000;padding:.75rem 1.5rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:1px solid #000;transition:background-color .3s,color .3s;text-transform:uppercase;display:inline-block;line-height:1;text-align:center}
.btn-pill:hover{background:#000;color:#fff}
.btn-pill--dark{background:#000;color:#f8f8f8;border-color:#000}
.btn-pill--dark:hover{background:#fff;color:#000}

/* ==========================================================================
   KNAP — btn--default outline-pill (verbatim, roed→champagne)
   ========================================================================== */
.btn--default{position:relative;display:inline-block;border:1px solid var(--accent);border-radius:40px;min-width:220px;padding:16px 52px;font-size:16px;line-height:16px;color:var(--accent);text-align:center;text-transform:uppercase;letter-spacing:.16em}
.btn--default span{display:block;width:100%;font-size:16px;line-height:16px;color:var(--accent);text-align:center;text-transform:uppercase;letter-spacing:.16em;transition:all .45s ease 0s}
body.no-mobile .btn--default{transition:all .5s}
body.no-mobile .btn--default span{display:block;transform:scale(1);transition:all .4s}
body.no-mobile .btn--default:hover{background-color:var(--accent);transform:scale(.8);transition-delay:0s}
body.no-mobile .btn--default:hover span{transform:scale(1.1);color:#141414;transition-delay:0s!important}

/* ==========================================================================
   ANIMATED ARROW — links med voksende pil (verbatim, roed→champagne)
   ========================================================================== */
.the-arrow{width:28px;transition:all .3s}
.the-arrow.-left{position:absolute;top:50%;left:0;width:48px}
.the-arrow.-left>.shaft,.the-arrow.-left>.shaft:after,.the-arrow.-left>.shaft:before{width:0;background-color:var(--accent-deep)}
.the-arrow.-left>.shaft:after,.the-arrow.-left>.shaft:before{transform:rotate(0)}
.the-arrow.-right{width:28px}
.the-arrow.-right>.shaft{width:28px}
.the-arrow.-right>.shaft:after,.the-arrow.-right>.shaft:before{width:5px;transition:all .5s;transition-delay:.3s}
.the-arrow.-right>.shaft:before{transform:rotate(40deg)}
.the-arrow.-right>.shaft:after{transform:rotate(-40deg)}
.the-arrow>.shaft{position:relative;will-change:transform}
.the-arrow>.shaft,.the-arrow>.shaft:after,.the-arrow>.shaft:before{background-color:var(--accent);display:block;height:1px;transition:all .2s;transition-delay:0s}
.the-arrow>.shaft:after,.the-arrow>.shaft:before{content:"";position:absolute;top:0;right:0}
.the-arrow>.shaft:before{transform-origin:top right}
.the-arrow>.shaft:after{transform-origin:bottom right}
.animated-arrow{display:inline-block;position:relative;transition:all .2s}
.animated-arrow>.main{display:flex;align-items:center;transition:all .2s;gap:1rem}
.animated-arrow>.main>.the-arrow{position:relative}
body.no-mobile .animated-arrow:hover>.the-arrow.-left>.shaft{width:28px;transition-delay:.1s;background-color:var(--accent)}
body.no-mobile .animated-arrow:hover>.the-arrow.-left>.shaft:after,
body.no-mobile .animated-arrow:hover>.the-arrow.-left>.shaft:before{width:5px;transition-delay:.1s;background-color:var(--accent)}
body.no-mobile .animated-arrow:hover>.the-arrow.-left>.shaft:before{transform:rotate(40deg)}
body.no-mobile .animated-arrow:hover>.the-arrow.-left>.shaft:after{transform:rotate(-40deg)}
body.no-mobile .animated-arrow:hover>.main{transform:translateX(40px)}
body.no-mobile .animated-arrow:hover>.main>.the-arrow.-right>.shaft{width:0;transform:translateX(200%);transition-delay:0s}
body.no-mobile .animated-arrow:hover>.main>.the-arrow.-right>.shaft:after,
body.no-mobile .animated-arrow:hover>.main>.the-arrow.-right>.shaft:before{width:0;transform:rotate(0);transition:all .1s 0s}

/* ==========================================================================
   FANCYTEXTHOVER — tekst-swipe hover (verbatim)
   ========================================================================== */
.fancytexthover{position:relative;display:inline-block}
.fancytexthover .textdefault{transition:opacity .3s ease .18s}
.fancytexthover .textwrapper{position:absolute;top:0;left:0;display:inline-block;overflow:hidden;width:0;white-space:pre;transition:width .3s ease-in-out 0s}
body.no-mobile .fancytexthover:hover .textwrapper{transition-delay:.18s;width:100%}
body.no-mobile .fancytexthover:hover .textdefault{transition-delay:0s;opacity:0}

/* ==========================================================================
   HEADER — fast transparent header + rund burger; morph fra nav--btn
   ========================================================================== */
.site-header{position:fixed;top:0;left:0;width:100%;z-index:50;padding:1.25rem 1.25rem 0;transition:transform .4s ease,opacity .3s ease,background-color .4s ease,padding .4s ease,box-shadow .4s ease}
@media(min-width:768px){.site-header{padding:2rem 2.5rem 0}}
.site-header.nav-up{transform:translateY(-110%)}
/* frosted bar (som bg-white/85 backdrop-blur) naar der er scrollet,
   saa headeren ikke flyder sammen med indholdet */
.site-header.scrolled{padding:0 1.25rem;background:rgba(20,20,20,.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(255,255,255,.06)}
@media(min-width:768px){.site-header.scrolled{padding:0 2.5rem}}
.site-header.scrolled.on-light{background:rgba(248,248,248,.88);box-shadow:0 1px 0 rgba(26,26,26,.08)}
body.menu-open .site-header.scrolled{background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.header-inner{height:5rem;display:flex;justify-content:space-between;align-items:center;position:relative;transition:height .4s ease}
.site-header.scrolled .header-inner{height:4.25rem}
.logo{display:flex;align-items:center;gap:.8rem;font-family:'Monument Extended',sans-serif;font-weight:400;font-size:.95rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;transition:color .4s ease;z-index:60;position:relative}
.logo-svg{display:block;height:30px;width:auto;flex-shrink:0}
.logo .logo-svg{color:#fff;transition:color .4s ease}
.header-right{display:flex;align-items:center;gap:1rem;z-index:60;position:relative}
/* header-cta outline-link (verbatim vaerdier, roed→champagne) */
.header-cta{display:none;letter-spacing:.2em;border:2px solid var(--accent);padding:.5rem 1rem .4rem;color:var(--accent);text-transform:uppercase;font-size:.8rem;transition:all .3s ease}
.header-cta:hover{background:var(--accent);color:#141414}
@media(min-width:768px){.header-cta{display:inline-block}}
/* pill-CTA i headeren skjules paa mobil (burgermenuen daekker navigationen) */
@media(max-width:767px){.header-right .button{display:none}}
/* burger: rund knap, to streger */
.burger{display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;height:3rem;width:3rem;border-radius:50%;background:transparent;color:#fff;transition:color .3s ease}
@media(min-width:768px){.burger{height:4rem;width:4rem}}
.burger:hover{color:var(--accent)}
.burger span{background:currentColor;height:2px;width:20px;position:absolute;top:50%;left:50%;display:block;transition:transform .6s cubic-bezier(.77,0,.175,1);transform:translate(-50%,-50%) translateY(-5px)}
.burger span:last-child{transform:translate(-50%,-50%) translateY(5px)}
body.no-mobile .burger:hover span{transform:translate(-50%,-50%) translateY(-7px)}
body.no-mobile .burger:hover span:last-child{transform:translate(-50%,-50%) translateY(7px)}
/* nav--btn.open morph → X */
.burger.open span,body.no-mobile .burger.open:hover span{transform:translate(-50%,-50%) rotate(135deg)}
.burger.open span:last-child,body.no-mobile .burger.open:hover span:last-child{transform:translate(-50%,-50%) rotate(-135deg)}
/* logo-farve-swap over lyse sektioner (data-logo-color) */
.site-header.on-light .logo,.site-header.on-light .burger{color:var(--ink)}
.site-header.on-light .logo .logo-svg{color:var(--ink)}
.site-header.on-light .header-cta{border-color:var(--ink);color:var(--ink)}
.site-header.on-light .header-cta:hover{background:var(--ink);color:#f8f8f8}
body.menu-open .site-header{transform:none}
body.menu-open .site-header .logo,body.menu-open .site-header .burger{color:#fff}
body.menu-open .site-header .header-cta,body.menu-open .site-header .header-right .button{opacity:0;pointer-events:none;transition:opacity .3s ease}

/* ==========================================================================
   MENU-OVERLAY — struktur (billeder tv., links th.) + moerk hud
   + serif-links, sibling-dim ved hover og bundlinje der stiger
   ========================================================================== */
.menu-overlay{position:fixed;inset:0;z-index:40;background:var(--dark);display:flex;pointer-events:none;clip-path:inset(0 0 100% 0);transition:clip-path .85s cubic-bezier(.77,0,.175,1)}
.menu-overlay.open{clip-path:inset(0 0 0% 0);pointer-events:auto}
/* .menu-overlay.active:after — stigende bundlinje (roed 70px → champagne 8px) */
.menu-overlay:after{content:"";position:absolute;left:0;right:0;bottom:0;height:0;background:var(--accent);transition:height .45s cubic-bezier(.77,0,.175,1) 0s}
.menu-overlay.open:after{height:8px;transition-delay:.55s}
.menu-media{display:none;position:relative;width:50%;overflow:hidden;transform:scale(1.06);transition:transform 1.2s cubic-bezier(.22,1,.36,1)}
.menu-overlay.open .menu-media{transform:scale(1)}
@media(min-width:900px){.menu-media{display:block}}
.menu-media img,.menu-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.55)}
.menu-links{flex:1;display:flex;flex-direction:column;justify-content:center;padding:0 1.5rem;transform:translateY(28px);transition:transform .85s cubic-bezier(.22,1,.36,1) .1s}
.menu-overlay.open .menu-links{transform:translateY(0)}
@media(min-width:900px){.menu-links{padding:0 5rem}}
/* primary-nav: serif-display links */
.menu-item{display:block;text-transform:uppercase;font-family:var(--font-serif);font-weight:300;font-size:clamp(2rem,4.2vw,3.4rem);padding:.55rem 0;letter-spacing:.03em;color:var(--accent);transition:opacity .4s ease}
/* soeskende daempes ved hover */
body.no-mobile .menu-links:hover .menu-item{opacity:.25}
body.no-mobile .menu-links .menu-item:hover{opacity:1}
.menu-item .wrapper{overflow:hidden;height:1.22em;display:block}
.menu-item .menu-text-reveal{display:block;position:relative;transform:translateY(112%);transition:transform .9s cubic-bezier(.22,1,.36,1) calc(var(--d,0s) + .25s)}
.menu-overlay.open .menu-item .menu-text-reveal{transform:translateY(0)}
.menu-item .textwrapper{color:#fff}
.menu-footer{margin-top:3rem;display:flex;flex-direction:column;gap:.5rem;opacity:0;transform:translateY(14px);transition:opacity .6s ease .75s,transform .6s cubic-bezier(.22,1,.36,1) .75s}
.menu-overlay.open .menu-footer{opacity:1;transform:translateY(0)}
.menu-footer a,.menu-footer span{font-size:.875rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(210,199,174,.55);transition:color .3s ease}
.menu-footer a:hover{color:var(--accent)}

/* ==========================================================================
   HERO — HeroFullMedia: kenburns-baggrund + centreret afrundet videokort
   ========================================================================== */
.hero{position:relative;width:100%;height:100vh;overflow:hidden;background:var(--black)}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-bg img{width:100%;height:120%;object-fit:cover;transform-origin:center;animation:kenburns 22s ease-in-out infinite alternate;filter:blur(14px) brightness(.5)}
@keyframes kenburns{0%{transform:scale(1)}100%{transform:scale(1.15)}}
.hero:after{content:"";position:absolute;inset:0;z-index:1;background:var(--dark);opacity:.4;pointer-events:none} /* --overlay-opacity:0.4 */
.hero-video-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:10;overflow:hidden}
.hero-video-card{position:relative;overflow:hidden;width:100%;height:100vh;border-radius:0}
@media(min-width:768px){.hero-video-card{width:auto;height:80vh;max-width:92vw;aspect-ratio:16/9;border-radius:.5rem}}
.hero-video-card video{width:100%;height:100%;object-fit:cover}
.hero-video-card:before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,.05) 45%,transparent)}
.hero-content{position:relative;z-index:30;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:0 1.5rem 5.5rem;pointer-events:none;max-width:72rem}
@media(min-width:768px){.hero-content{padding:0 4rem 6rem}}
.hero-content .pretitle{margin-bottom:1.5rem;text-shadow:0 1px 12px rgba(0,0,0,.45)}
.hero-title{font-family:var(--font-display);font-weight:100;text-transform:uppercase;letter-spacing:.06em;color:#fff;font-size:clamp(32px,5vw,96px);line-height:1.15;margin-bottom:1rem;text-shadow:0 2px 24px rgba(0,0,0,.4)}
.hero-line{display:block;overflow:hidden;padding-top:.14em;margin-top:-.14em}
.hero-sub{color:#fff;text-transform:uppercase;font-size:clamp(15px,1.4vw,19px);line-height:1.5;max-width:42rem;margin-bottom:2rem;letter-spacing:.05em;text-shadow:0 1px 12px rgba(0,0,0,.45)}
.hero-ctas{display:flex;gap:1rem;flex-wrap:wrap;pointer-events:auto}
/* Åbnings-choreografi (maske-reveals + kort-skalering, trigges af .is-loaded) */
.hero .hero-bg{opacity:0;transition:opacity 1.4s ease .05s}
.hero-video-card{opacity:0;transform:scale(1.05);transition:opacity 1.1s ease .2s,transform 1.8s cubic-bezier(.22,1,.36,1) .2s}
.hero-content .pretitle{opacity:0;transform:translateY(16px);transition:opacity .8s ease .85s,transform .8s cubic-bezier(.22,1,.36,1) .85s}
.hero-line>span{display:block;transform:translateY(112%);transition:transform 1s cubic-bezier(.22,1,.36,1) .95s}
.hero-line:nth-child(2)>span{transition-delay:1.08s}
.hero-sub{opacity:0;transform:translateY(16px);transition:opacity .8s ease 1.3s,transform .8s cubic-bezier(.22,1,.36,1) 1.3s}
.hero-ctas{opacity:0;transform:translateY(16px);transition:opacity .8s ease 1.5s,transform .8s cubic-bezier(.22,1,.36,1) 1.5s}
.hero.is-loaded .hero-bg{opacity:1}
.hero.is-loaded .hero-video-card{opacity:1;transform:scale(1)}
.hero.is-loaded .hero-content .pretitle,.hero.is-loaded .hero-sub,.hero.is-loaded .hero-ctas{opacity:1;transform:translateY(0)}
.hero.is-loaded .hero-line>span{transform:translateY(0)}

/* ==========================================================================
   Sektioner — flader
   ========================================================================== */
.section-light{background:var(--canvas);color:var(--ink)}
.section-dark{background:var(--dark);color:#fff}

/* Intro (TextMultiColsSection-moenster) */
.intro-list{display:flex;flex-direction:column;gap:2rem}
.intro-list h6{text-transform:uppercase;font-size:1rem;font-weight:500;margin-bottom:.35rem;letter-spacing:.05em}
.intro-list p{color:#4a4a4a}

/* ==========================================================================
   BIL-KORT (verbatim car-card + grid-specs + zebra-tabel + labels)
   ========================================================================== */
.cars-grid{display:grid;grid-template-columns:1fr;gap:2rem}
@media(min-width:900px){.cars-grid{grid-template-columns:repeat(2,1fr)}}
.car-card{padding:0;background:#fff;position:relative;height:100%;transform:scale(1);transition:.2s ease-in-out;box-shadow:0 4px 50px -30px rgba(0,0,0,.3);border-radius:.5rem;overflow:hidden} /* radius: rounded-lg glue */
.car-card:hover{transform:scale(1.03);box-shadow:0 4px 50px -30px #000}
.car-card>a{text-decoration:none;color:inherit;display:flex;flex-direction:column;justify-content:space-between;height:100%}
.car-card .img-wrap{position:relative;overflow:hidden}
.car-card img{width:100%;margin-bottom:1rem;aspect-ratio:1000/585;object-fit:cover}
.car-card .title-wrap{padding:.5rem 1.2rem 0;text-align:center}
.car-card h6{font-size:13px;margin-bottom:.5rem;line-height:1;color:var(--eyebrow-gray);text-transform:uppercase;letter-spacing:2px;font-weight:400}
.car-card h5{font-size:20px;margin-bottom:1.5rem;font-family:var(--font-serif);font-weight:300;text-transform:uppercase;letter-spacing:.035em;color:var(--card-ink)}
.car-card .content-wrap{padding:.5rem 1.2rem 1.2rem}
.grid-specs{display:grid;grid-template-columns:repeat(3,1fr);text-align:center;margin-bottom:1.5rem}
.grid-specs .spec h5{color:rgba(27,29,31,.6);margin-bottom:.3rem;font-size:20px;font-family:var(--font-serif);font-weight:300;letter-spacing:.035em}
.grid-specs .spec h6{font-size:12px;margin-bottom:0;color:var(--eyebrow-gray);text-transform:uppercase;letter-spacing:2px}
.grid-specs .spec.middle{border-right:1px solid rgba(27,29,31,.1);border-left:1px solid rgba(27,29,31,.1)}
.car-card table{font-size:13px;width:100%;border-collapse:collapse;margin-bottom:1.5rem}
.car-card table tr:nth-child(odd){background:#f8f8f8}
.car-card table tr:nth-child(even){background:#fff}
.car-card table td{padding:1rem .75rem .5rem 1em}
.car-card table .key,.car-card table .value{text-transform:uppercase}
.car-card table .value{text-align:right;letter-spacing:2px}
.car-card .button-group{display:flex;justify-content:space-between;gap:1rem}
.car-card .button-group .btn-pill{width:calc(50% - .5rem)}
/* new-label (verbatim, roed→dark) */
.new-label{background-color:var(--card-ink);display:inline-block;padding:5px 5px 1px;position:absolute;top:0;left:0;z-index:5}
.new-label p{color:#fff;font-size:11px;text-transform:uppercase;margin:0;font-weight:600;letter-spacing:1px}
/* Solgt-kort: afdaempet kort + diagonalt SOLGT-banner over billedet */
.car-card--sold:hover{transform:scale(1);box-shadow:0 4px 50px -30px rgba(0,0,0,.3)}
.car-card--sold .img-wrap>img{filter:grayscale(1);opacity:.65}
.car-card--sold .title-wrap h5{color:rgba(27,29,31,.45)}
.car-card--sold .content-wrap,.car-card--sold .location-badge{opacity:.55}
.car-card--sold .btn-pill{pointer-events:none;color:#9a9a9a;border-color:rgba(27,29,31,.15)}
.sold-ribbon{position:absolute;top:1.9rem;left:-3.6rem;transform:rotate(-45deg);z-index:6;background:var(--card-ink);color:#fff;padding:.5rem 4.5rem;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:3px;box-shadow:0 2px 14px rgba(0,0,0,.35)}
/* narrow-card stagger-entrance (verbatim; trigges af .in-view) */
.narrow-card{opacity:0}
.in-view .narrow-card{animation-name:fadeInUp;animation-duration:.5s;animation-fill-mode:both;animation-delay:calc(var(--i) * .1s)}
@keyframes fadeInUp{from{transform:translate3d(0,40px,0)}to{transform:translate3d(0,0,0);opacity:1}}
/* location-badge (verbatim utilities, pin-stroke gul→champagne i SVG) */
.location-badge{position:absolute;top:.75rem;right:.75rem;z-index:5;background:rgba(0,0,0,.8);backdrop-filter:blur(4px);color:#fff;padding:.35rem 1rem;border-radius:9999px;font-size:.75rem;font-weight:500;display:flex;align-items:center;gap:.5rem}
@media(min-width:768px){.location-badge{top:1.5rem;right:1.5rem;font-size:.875rem;padding:.5rem 1rem}}

/* Brand-strip: maerkelogo · lodret linje · CARCARTEL nederst tv. paa bilfotos,
   med gradient bag saa den staar skarpt paa lyse fotos */
.img-wrap::after{content:'';position:absolute;left:0;right:0;bottom:1rem;height:45%;background:linear-gradient(to top,rgba(10,10,10,.62),transparent);pointer-events:none}
.brand-strip{position:absolute;bottom:2rem;left:1.25rem;z-index:5;display:flex;align-items:center;gap:.9rem}
.brand-strip img{height:32px;width:auto;max-width:88px;margin:0;aspect-ratio:auto;object-fit:contain;opacity:.95}
.brand-strip .line{width:1px;height:2rem;background:rgba(255,255,255,.45)}
.brand-strip .name{font-family:'Monument Extended',sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#fff}
@media(min-width:768px){.brand-strip{gap:1.1rem}.brand-strip img{height:38px;max-width:110px}.brand-strip .line{height:2.4rem}.brand-strip .name{font-size:13px}}
.car-card--sold .brand-strip{opacity:.6}
.pdp-media::after{content:'';position:absolute;left:0;right:0;bottom:0;height:38%;background:linear-gradient(to top,rgba(10,10,10,.55),transparent);pointer-events:none}
.pdp-media .brand-strip{bottom:1.5rem;left:1.75rem}
.pdp-media .brand-strip img{height:38px;width:auto;max-width:110px;object-fit:contain}
/* per-logo finjustering: AMG-lockup er detaljeret (op), Audi-ringene brede (ned) */
.brand-strip img[src*="mercedes_amg"]{height:44px}
.brand-strip img[src*="audi"]{height:26px}
@media(min-width:768px){.brand-strip img[src*="mercedes_amg"]{height:52px}.brand-strip img[src*="audi"]{height:30px}}
.pdp-media .sold-ribbon{top:2.4rem;left:-3.2rem;padding:.6rem 5rem;font-size:13px}

/* Udstyrs- og serviceliste paa bilsider */
.equip-list{list-style:none;padding:0;margin:0 0 2rem;font-size:14px;color:#3a3a3a}
.equip-list li{padding:.45rem 0 .45rem 1.4rem;position:relative;border-bottom:1px solid rgba(27,29,31,.06)}
.equip-list li::before{content:'';position:absolute;left:0;top:1em;width:.45rem;height:1px;background:var(--eyebrow-gray,#707070)}
@media(min-width:768px){.equip-list--cols{columns:2;column-gap:2.5rem}.equip-list--cols li{break-inside:avoid}}

/* Galleri-overlay: "Se alle billeder" paa bilsider */
.gallery-overlay{position:fixed;inset:0;z-index:200;background:rgba(12,12,12,.97);display:none;flex-direction:column}
.gallery-overlay.open{display:flex}
.gallery-head{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;color:#fff;flex-shrink:0}
.gallery-head h4{font-family:'Monument Extended',sans-serif;font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:400;margin:0}
.gallery-close{color:#fff;font-size:2rem;line-height:1;padding:.25rem .75rem}
.gallery-scroll{overflow-y:auto;padding:.5rem 1.5rem 3rem;flex:1;-webkit-overflow-scrolling:touch}
.gallery-grid{display:grid;grid-template-columns:1fr;gap:1rem;max-width:1100px;margin:0 auto}
@media(min-width:768px){.gallery-grid{grid-template-columns:1fr 1fr}}
.gallery-grid img{width:100%;border-radius:.5rem;display:block}
body.gallery-open{overflow:hidden}
.pdp-media[data-gallery-open],.pdp-gallery .thumb[data-gallery-open]{cursor:pointer}

/* ==========================================================================
   FILTERBAR (dropdown + aktive chips; verbatim struktur, accent-swap)
   ========================================================================== */
.filter-container{background:#f8f8f8;padding:1rem 0;border-bottom:1px solid rgba(27,29,31,.08);display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
/* .custom-select — sortering uden browser-chrome */
.custom-select select{appearance:none;-webkit-appearance:none;background:transparent;border:0;font-family:inherit;font-size:14px;text-transform:uppercase;letter-spacing:1px;color:var(--card-ink);cursor:pointer;padding-right:1.4rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%231b1d1f'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right center}
.custom-select select:focus{outline:none}
.filter-container .dropdown{position:relative}
.filter-container .dropdown .toggle{background:#fff;padding:.7rem 2.6rem .6rem 1.2rem;font-size:14px;text-transform:uppercase;letter-spacing:1px;cursor:pointer;border:1px solid transparent;position:relative;user-select:none}
.filter-container .dropdown .toggle:after{content:"";position:absolute;right:1rem;top:50%;width:8px;height:8px;border-right:1px solid #1b1d1f;border-bottom:1px solid #1b1d1f;transform:translateY(-70%) rotate(45deg);transition:transform .2s}
.filter-container .dropdown.active .toggle{border-color:var(--accent-deep)}
.filter-container .dropdown.active .toggle:after{transform:translateY(-30%) rotate(225deg)}
.filter-container .choices{display:none;position:absolute;top:calc(100% + 4px);left:0;min-width:100%;background:#fff;border:1px solid var(--accent-deep);z-index:40}
.filter-container .dropdown.active .choices{display:block}
.filter-container .choices p{padding:.7rem 1.2rem .5rem;font-size:14px;text-transform:uppercase;letter-spacing:1px;cursor:pointer;white-space:nowrap;position:relative;padding-left:2.6rem}
.filter-container .choices p:before{content:"";position:absolute;left:1.1rem;top:50%;transform:translateY(-60%);width:16px;height:16px;border:1px solid var(--accent-deep)}
.filter-container .choices p.term-selected:before{background:var(--accent-deep)}
.filter-container .choices p:hover{background:#f8f8f8}
.active-filter{background:var(--card-ink);color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:1px;padding:.55rem 1rem .45rem;cursor:pointer;display:inline-flex;align-items:center;gap:.6rem}
.active-filter:after{content:"\00d7";font-size:15px;line-height:0;color:var(--accent)}
.filter-count{font-size:14px;letter-spacing:1px;text-transform:uppercase;color:#707070;margin-left:auto}
.filter-count b{color:var(--card-ink);font-weight:600}
/* ==========================================================================
   HOS CARCARTEL — slider_w_links: fullbleed slides, kaempe taeller,
   falmende headline og to-tonede nav-knapper (roed→champagne)
   · signatur-ord (SVG-maske) over billedet
   ========================================================================== */
.kollektion{position:relative;overflow:hidden;height:min(800px,85vh)} /* slide-hoejde 800px */
.kollektion-track{display:flex;height:100%;transition:transform .85s cubic-bezier(.22,1,.36,1);will-change:transform}
.kollektion-slide{position:relative;min-width:100%;height:100%}
.kollektion-slide img,.kollektion-slide video{width:100%;height:100%;object-fit:cover}
.kollektion-slide .slide-scrim{position:absolute;inset:0;background:radial-gradient(ellipse 55% 45% at 80% 12%,rgba(20,20,20,.6),transparent 70%),linear-gradient(80deg,rgba(20,20,20,.82) 0%,rgba(20,20,20,.35) 45%,rgba(20,20,20,.05) 70%)}
/* signatur-ord i champagne, let roteret, oeverst til hoejre */
.script-word{position:absolute;top:9%;right:5%;width:min(40vw,560px);background-color:var(--accent);transform:rotate(-4deg);transition:opacity .35s ease;pointer-events:none;filter:drop-shadow(0 1px 2px rgba(0,0,0,.75)) drop-shadow(0 3px 8px rgba(0,0,0,.5)) drop-shadow(0 14px 34px rgba(0,0,0,.45));z-index:5;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain;mask-repeat:no-repeat;mask-position:center;mask-size:contain}
.kollektion.fade-out .script-word{opacity:0}
/* .text-col / .indicator (verbatim vaerdier: 150px, letter-spacing 10px, total 26px) */
.kollektion-overlay{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:120px;pointer-events:none}
.kollektion-overlay .eyebrow-f{color:rgba(210,199,174,.75);margin-bottom:.5rem}
.kollektion .indicator{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}
.kollektion .indicator .idx{font-family:'Monument Extended',sans-serif;font-size:13px;letter-spacing:.25em;color:var(--accent);transition:opacity .5s}
.kollektion .indicator .idx-line{width:56px;height:1px;background:rgba(255,255,255,.35)}
.kollektion .indicator .total{font-family:'Monument Extended',sans-serif;font-size:13px;letter-spacing:.25em;color:rgba(255,255,255,.45)}
.kollektion .headline{transition:.5s all;margin-top:.5rem}
.kollektion .headline a{font-family:var(--font-body);font-weight:300;font-size:clamp(30px,4vw,58px);color:#f8f8f8;text-transform:uppercase;letter-spacing:-.02em;line-height:1.1;white-space:nowrap;pointer-events:auto;transition:color .3s ease;border-bottom:1px solid transparent}
.kollektion .headline a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.kollektion.fade-out .headline{opacity:0;transform:translateY(10%)}
.kollektion.fade-out .indicator .idx{opacity:0}
/* Nav: runde ghost-knapper nederst th. (frem/tilbage) */
.kollektion .nav-buttons{position:absolute;width:auto;bottom:1.75rem;right:1.75rem;z-index:10;display:flex;gap:.75rem}
.kollektion .swiper-btn{width:56px;height:56px;border-radius:9999px;border:1px solid rgba(255,255,255,.4);background:rgba(20,20,20,.25);backdrop-filter:blur(6px);color:#fff;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:background-color .3s ease,border-color .3s ease,color .3s ease}
.kollektion .swiper-btn:hover{background:var(--accent);border-color:var(--accent);color:#141414}
.kollektion .swiper-btn svg{width:14px;height:14px;fill:currentColor}
.kollektion .swiper-btn.swiper-prev svg{transform:rotate(180deg)}
@media(max-width:700px){
  .kollektion{height:70vh}
  .script-word{width:58vw;top:7%;right:4%}
  .kollektion-overlay{padding-bottom:100px}
  .kollektion .nav-buttons{bottom:1.25rem;right:1.25rem}
  .kollektion .swiper-btn{width:48px;height:48px}
}

/* ==========================================================================
   STATS — CountUp + kaempe Tiempos-tal (.indicator .huge 150px)
   ========================================================================== */
.stats-grid{display:grid;grid-template-columns:1fr;gap:3.5rem;text-align:center}
@media(min-width:768px){.stats-grid{grid-template-columns:repeat(3,1fr)}}
.stat .huge{font-family:var(--font-body);font-weight:300;font-size:clamp(70px,10vw,150px);line-height:1;letter-spacing:-.02em;color:var(--accent)}
.stat .stat-label{margin-top:1rem;font-family:var(--font-body);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.55)}

/* ==========================================================================
   SAELG DIN BIL — ChangeToUsFormSection: fullbleed billede + hvidt kort
   med nummerplade-inputs; sp-form underline-felter (verbatim)
   ========================================================================== */
.sell-section{position:relative;width:100%;overflow:hidden}
.sell-bg{position:absolute;inset:0}
.sell-bg img{width:100%;height:100%;object-fit:cover}
.sell-bg:after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.5)}
.sell-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr;gap:3rem;align-items:center;padding-top:6rem;padding-bottom:6rem}
@media(min-width:900px){.sell-inner{grid-template-columns:1fr 1fr;gap:4rem}}
.sell-copy .display-h{font-size:clamp(2.4rem,4.5vw,5rem)}
.sell-copy p{color:rgba(255,255,255,.85);max-width:34rem;margin-top:1.5rem;line-height:1.6;letter-spacing:.03em}
/* frosted glas (bg-white/85 backdrop-blur-idiomet) */
.sell-card{background:rgba(255,255,255,.68);-webkit-backdrop-filter:blur(22px) saturate(140%);backdrop-filter:blur(22px) saturate(140%);border:1px solid rgba(255,255,255,.45);padding:2.5rem 2rem;border-radius:.5rem;width:100%;max-width:28rem;justify-self:center;box-shadow:0 20px 60px -25px rgba(0,0,0,.5)}
@media(min-width:900px){.sell-card{justify-self:end}}
.sell-card h3{font-size:1.563rem;line-height:1.2;text-transform:uppercase;font-weight:400;margin-bottom:.75rem}
.sell-card .sub{font-size:.9rem;color:#707070;margin-bottom:2rem}
/* input.nummerplade — dansk nummerplade (ramme-greb, roed→champagne)
   + enkelt-tegn-inputs */
.plate{display:flex;align-items:stretch;width:100%;max-width:330px;height:62px;margin:0 auto 2.5rem;background:#fff;border:3px solid var(--accent-deep);border-radius:8px;overflow:hidden;box-shadow:0 12px 32px -14px rgba(0,0,0,.45)}
.plate-eu{background:#039;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:0 8px;flex-shrink:0}
.plate-eu span{color:#fff;font-size:11px;font-weight:600;letter-spacing:.05em;font-family:Arial,Helvetica,sans-serif}
.plate-cells{display:flex;align-items:center;justify-content:center;flex:1;gap:1px;padding:0 4px}
.plate-cells .plate-group-gap{width:12px;flex-shrink:0}
.plate .plate-char-input{background:transparent;border:none;width:1.55rem;height:100%;font-size:1.75rem;font-weight:700;color:#111;text-align:center;text-transform:uppercase;line-height:1;font-family:Arial,Helvetica,sans-serif;caret-color:var(--accent-deep);border-radius:0;padding:0}
.plate .plate-char-input:focus{outline:none;background:rgba(193,180,148,.14)}
.plate .plate-char-input::placeholder{color:#c9c9c9}
/* sp-form */
.sp-form{display:flex;flex-direction:column;gap:2rem}
.sp-form .form-field{position:relative;width:100%}
.sp-form .form-field:after,.sp-form .form-field:before{bottom:0;content:"";display:block;height:1px;left:0;position:absolute;width:100%}
.sp-form .form-field:after{z-index:1;background-color:rgba(0,0,0,.2)}
.sp-form .form-field:before{transform:scaleX(0);transform-origin:left;transition:transform .3s ease;z-index:2;background-color:#000}
.sp-form .form-field.is-focused:before,.sp-form .form-field.has-content:before{transform:scaleX(1)}
.sp-form .form-field input{background-color:transparent;border:0;border-radius:0;font-size:1rem;padding-bottom:1rem;position:relative;width:100%;z-index:3;color:#000}
.sp-form .form-field input:focus{outline:none}
.sp-form .form-field input::placeholder{color:rgba(0,0,0,.5);transition:opacity .3s ease}
.sp-form .form-field input:focus::placeholder{opacity:.5}
.sp-form .consent-checkbox{align-items:flex-start;display:flex;gap:.75rem}
.sp-form .consent-checkbox label{cursor:pointer;font-size:.812rem;color:#444}
.sp-form .checkbox{appearance:none;width:1.25rem;height:1.25rem;border:2px solid #000;border-radius:4px;cursor:pointer;flex-shrink:0;display:inline-block;position:relative;transition:background-color .2s ease}
.sp-form .checkbox:checked{background:#000}
.sp-form .checkbox:checked:after{content:"";position:absolute;left:5px;top:1px;width:5px;height:10px;border:solid var(--accent);border-width:0 2px 2px 0;transform:rotate(45deg)}

/* ==========================================================================
   TextWithMediaSection — medie + tekst-split
   ========================================================================== */
.media-card{aspect-ratio:16/9;width:100%;border-radius:.75rem;overflow:hidden}
.media-card video,.media-card img{width:100%;height:100%;object-fit:cover}
.text-col{display:flex;flex-direction:column;justify-content:center;gap:1.25rem}
.text-col .h5{text-transform:uppercase;font-weight:400}
.text-col p{color:#4a4a4a;line-height:1.6}

/* ==========================================================================
   FOOTER — struktur: baggrundsbillede, centreret logo, runde some-cirkler,
   scroll-til-top · champagne-hud · fixed-reveal
   ========================================================================== */
.site-footer{background:var(--dark);color:#fff;padding:5.5rem 0 2.5rem;overflow:hidden}
@media(min-width:768px){
  .site-footer{position:fixed;bottom:0;left:0;width:100%;z-index:1}
  .site-content{position:relative;z-index:2;box-shadow:0 30px 60px rgba(0,0,0,.4)}
}
/* footer.site-footer background-image + moerkt overlay */
.footer-bg{position:absolute;inset:0;pointer-events:none}
.footer-bg img,.footer-bg video{width:100%;height:100%;object-fit:cover;opacity:.25;filter:grayscale(40%)}
.footer-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(20,20,20,.55),rgba(20,20,20,.92) 75%)}
.footer-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center}
/* centreret logo oeverst */
.footer-brand{display:flex;flex-direction:column;align-items:center;gap:1.25rem;margin-bottom:3rem}
.footer-brand .logo-svg{height:56px;color:#fff}
.footer-brand .wordmark{font-family:'Monument Extended',sans-serif;font-weight:400;font-size:1rem;letter-spacing:.18em;text-transform:uppercase;color:#fff}
/* kontakt: to store serif-links */
.footer-contact-links{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:1rem 2.5rem;margin-bottom:2.5rem}
.footer-contact-links a{font-family:var(--font-serif);font-weight:300;font-size:clamp(1.4rem,2.6vw,2.2rem);color:var(--accent);letter-spacing:.04em;border-bottom:1px solid transparent;transition:color .3s ease,border-color .3s ease;padding-bottom:.15rem}
.footer-contact-links a:hover{color:#fff;border-color:var(--accent)}
.footer-meta{display:flex;flex-direction:column;gap:.5rem;margin-bottom:3rem}
.footer-meta p{font-size:.9rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.footer-meta p b{color:rgba(210,199,174,.85);font-weight:400}
/* ul.social-media — runde cirkler med 1px kant (hvid → champagne) */
.social-media{display:flex;gap:1rem;margin-bottom:3.5rem}
.social-media a{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;border:1px solid rgba(210,199,174,.45);color:var(--accent);transition:background-color .3s ease,color .3s ease,border-color .3s ease}
.social-media a svg{width:16px;height:16px;fill:currentColor}
.social-media a:hover{background:var(--accent);border-color:var(--accent);color:var(--dark)}
.footer-bottom{width:100%;display:grid;grid-template-columns:1fr auto 1fr;gap:1.25rem;align-items:center;border-top:1px solid rgba(210,199,174,.18);padding-top:2rem;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.4);text-align:left}
.footer-nav{display:flex;gap:1.75rem;justify-self:center}
.footer-bottom .scrollToTop{justify-self:end}
@media(max-width:700px){.footer-bottom{grid-template-columns:1fr;justify-items:center;text-align:center}.footer-bottom .scrollToTop{justify-self:center}}
.footer-nav a{color:rgba(255,255,255,.55);transition:color .3s ease}
.footer-nav a:hover{color:var(--accent)}
/* a.scrollToTop */
.scrollToTop{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;border:1px solid rgba(210,199,174,.45);color:var(--accent);transition:transform .3s ease,background-color .3s ease,color .3s ease}
.scrollToTop svg{transform:rotate(-90deg);width:13px;height:13px;fill:currentColor}
.scrollToTop:hover{background:var(--accent);color:var(--dark);transform:translateY(-3px)}

/* ==========================================================================
   Scroll-reveals (gsap-moenstre + appear--* genskabt i CSS)
   ========================================================================== */
.reveal-mask{overflow:hidden;display:block;padding-top:.14em;margin-top:-.14em} /* luft til Å-ring m.m. */
.reveal-mask>*{display:block;transform:translateY(110%);transition:transform .9s cubic-bezier(.22,1,.36,1)}
.in-view .reveal-mask>*,.reveal-mask.in-view>*{transform:translateY(0)}
.appear-fade{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1)}
.appear-fade.in-view,.in-view>.appear-fade{opacity:1;transform:translateY(0)}
.appear-scale{transform:scale(1.12);transition:transform 1.2s cubic-bezier(.22,1,.36,1)}
.appear-scale.in-view,.in-view .appear-scale{transform:scale(1)}
/* curtain-animation */
.curtain-wrap{position:relative;overflow:hidden}
.curtain-wrap:after{content:"";position:absolute;inset:0;background:var(--canvas);transform:translateY(0);transition:transform .9s cubic-bezier(.22,1,.36,1)}
.section-dark .curtain-wrap:after{background:var(--dark)}
.curtain-wrap.in-view:after,.in-view .curtain-wrap:after{transform:translateY(-101%)}
/* appear--btn */
.appear-btn{border-color:transparent;transform:scaleX(0);transition:all .3s ease-out .5s}
.appear-btn span{opacity:0;transform:translateY(15px)}
.appear-btn.in-view,.in-view .appear-btn{border-color:var(--accent);transform:scaleX(1);transition:all .3s ease-out 0s}
.appear-btn.in-view span,.in-view .appear-btn span{transform:translateY(0);opacity:1;transition:all .45s ease .35s}

/* diverse */
.flex-between{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap}
.mb-20{margin-bottom:5rem}
.mb-14{margin-bottom:3.5rem}
.mb-8{margin-bottom:2rem}
.mb-6{margin-bottom:1.5rem}
.mb-4{margin-bottom:1rem}
.mt-8{margin-top:2rem}
.mt-12{margin-top:3rem}
.text-center{text-align:center}

/* ==========================================================================
   SE DETALJER-sider — lys flade, grid, afrundet medie, klæbende kort
   · spec-række + zebra-tabel
   ========================================================================== */
.pdp{background:var(--canvas)}
.pdp .site-header{position:absolute}
.pdp-main{padding-top:8.5rem;padding-bottom:5rem;min-height:70vh}
.pdp-head{align-items:end;margin-bottom:2.5rem}
.pdp-media{position:relative;border-radius:.75rem;overflow:hidden;aspect-ratio:16/9;margin-bottom:1rem;background:#e2e2e2}
.pdp-media video,.pdp-media img{width:100%;height:100%;object-fit:cover}
.pdp-gallery{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:3rem}
.pdp-gallery .thumb{border-radius:.5rem;overflow:hidden;aspect-ratio:16/10}
.pdp-gallery .thumb img{width:100%;height:100%;object-fit:cover}
.pdp-body{margin-top:2rem}
.pdp-specs{display:grid;grid-template-columns:repeat(3,1fr);text-align:center;border:1px solid rgba(27,29,31,.1);border-radius:.5rem;padding:1.5rem 0;margin-bottom:2.5rem;background:#fff}
.pdp-specs .spec h5{font-family:var(--font-serif);font-weight:300;font-size:clamp(1.6rem,2.4vw,2.2rem);color:var(--card-ink);margin-bottom:.35rem}
.pdp-specs .spec h6{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--eyebrow-gray)}
.pdp-specs .spec.middle{border-left:1px solid rgba(27,29,31,.1);border-right:1px solid rgba(27,29,31,.1)}
.pdp-table{font-size:14px;width:100%;border-collapse:collapse;margin-bottom:3rem}
.pdp-table tr:nth-child(odd){background:#fff}
.pdp-table td{padding:1rem .75rem .6rem 1em}
.pdp-table .key,.pdp-table .value{text-transform:uppercase}
.pdp-table .value{text-align:right;letter-spacing:2px}
.pdp-desc h3{margin-bottom:1.25rem;text-transform:uppercase;font-weight:400}
.pdp-desc p{color:#4a4a4a;line-height:1.7;margin-bottom:1rem;max-width:60ch}
.pdp-aside-card{background:#fff;border-radius:.5rem;padding:2rem;box-shadow:0 4px 50px -30px rgba(0,0,0,.3);position:sticky;top:2.5rem;display:flex;flex-direction:column;gap:1rem}
.pdp-aside-card .price{font-family:var(--font-serif);font-weight:300;font-size:2.2rem;color:var(--card-ink);line-height:1}
.pdp-aside-card .lease{color:#707070;font-size:.9rem;letter-spacing:.05em;text-transform:uppercase}
.pdp-aside-card .divider{height:1px;background:rgba(27,29,31,.1);margin:.5rem 0}
.pdp-aside-card .btn-pill{width:100%}
.pdp-aside-card .trust{font-size:.82rem;color:#707070;line-height:1.7}
.pdp-footer{background:var(--dark);padding:2.5rem 1.5rem;display:flex;flex-direction:column;gap:1rem;align-items:center;text-align:center}
.pdp-footer span{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.4)}
.pdp-footer a{color:var(--accent);font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;transition:color .3s ease}
.pdp-footer a:hover{color:#fff}

/* ==========================================================================
   UNDERSIDER (om / kontakt / sælg / oplevelsen)
   ========================================================================== */
/* stats i 4 kolonner */
.stats-grid--4{grid-template-columns:1fr 1fr;gap:2.5rem}
@media(min-width:900px){.stats-grid--4{grid-template-columns:repeat(4,1fr)}}
/* missions-citat i SangBleu paa moerk flade */
.mission{background:var(--dark);color:#fff;text-align:center;padding:6rem 1.5rem}
.mission blockquote{font-family:var(--font-display);font-weight:100;font-size:clamp(1.35rem,2.4vw,2.15rem);line-height:1.55;letter-spacing:.04em;color:var(--accent);max-width:58rem;margin:0 auto 2.5rem}
.mission .attrib{font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.5)}
/* vaerdi-grid (intro-list-moenster i 2 kolonner) */
.values-grid{display:grid;grid-template-columns:1fr;gap:2.5rem 3.5rem}
@media(min-width:768px){.values-grid{grid-template-columns:1fr 1fr}}
.values-grid h6{text-transform:uppercase;font-size:1rem;font-weight:500;margin-bottom:.5rem;letter-spacing:.05em}
.values-grid p{color:#4a4a4a;line-height:1.6;max-width:36rem}
/* kontakt: moerk split-hero med store direkte links + rolig video th. */
.split-hero-media video{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.contact-links{display:flex;flex-direction:column;gap:.5rem;align-items:flex-start;margin:2.75rem 0 2.25rem}
.contact-links a{font-family:var(--font-body);font-weight:300;font-size:clamp(1.7rem,3vw,2.6rem);letter-spacing:-.01em;color:#f8f8f8;border-bottom:1px solid transparent;transition:color .3s ease,border-color .3s ease;padding-bottom:.15rem}
.contact-links a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.contact-meta{display:flex;flex-direction:column;gap:.5rem;font-size:.95rem;color:rgba(255,255,255,.55);letter-spacing:.02em}
.contact-meta b{color:rgba(255,255,255,.85);font-weight:500}
/* signatur-ord inline paa lys flade */
.script-inline{background-color:var(--accent-deep);height:52px;margin-bottom:1.25rem;-webkit-mask-repeat:no-repeat;-webkit-mask-position:left center;-webkit-mask-size:contain;mask-repeat:no-repeat;mask-position:left center;mask-size:contain}
/* sp-form: textarea som input-felterne */
.sp-form .form-field textarea{background-color:transparent;border:0;border-radius:0;font-size:1rem;padding-bottom:1rem;position:relative;width:100%;z-index:3;color:#000;resize:vertical;min-height:96px;font-family:inherit;line-height:1.5}
.sp-form .form-field textarea:focus{outline:none}
.sp-form .form-field textarea::placeholder{color:rgba(0,0,0,.5)}
/* saelg-siden: hero-form skal gaa under den transparente header */
.page-sell .sell-inner{padding-top:10rem}

/* ==========================================================================
   OM-SIDEN — mørk hero m. linje-reveals, fullbleed billede m. scale-in
   ========================================================================== */
/* Split-hero (50/50-komposition fra menu-overlayet, moerk tekstflade tv.) */
.split-hero{position:relative;display:grid;grid-template-columns:1fr;min-height:92vh;background:var(--dark)}
@media(min-width:900px){.split-hero{grid-template-columns:1fr 1fr}}
.split-hero-panel{position:relative;z-index:4;display:flex;flex-direction:column;justify-content:center;padding:9rem 1.5rem 4rem}
@media(min-width:900px){.split-hero-panel{padding:6rem 4rem 10rem 2.5rem}}
.split-hero-panel .display-h{font-size:clamp(2.2rem,3.6vw,3.9rem);margin-bottom:2rem}
.split-hero-panel .section-headline{font-size:clamp(2.2rem,3.6vw,3.9rem);margin-bottom:2rem;color:#f8f8f8}
.split-hero-panel p{color:rgba(255,255,255,.65);line-height:1.75;max-width:44ch;letter-spacing:.02em}
.split-hero-panel .btn--default{margin-top:2.75rem;align-self:flex-start;min-width:0;padding:14px 44px}
.split-hero-media{position:relative;overflow:hidden;min-height:46vh}
.split-hero-media img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
/* LinkBlockSection: titel over hoeje 9:12-mediekort m. curtain og hover-zoom */
.trio-grid{display:grid;grid-template-columns:1fr;gap:2.5rem}
@media(min-width:768px){.trio-grid{grid-template-columns:repeat(3,1fr);gap:2.5rem}}
.trio-card .num{font-family:var(--font-serif);font-weight:300;font-size:1.1rem;color:var(--accent-deep);margin-bottom:.4rem}
.trio-card h3{font-size:clamp(1.25rem,1.8vw,1.75rem);font-weight:500;color:#1f1f1f;margin-bottom:1rem;text-transform:none}
.trio-media{position:relative;aspect-ratio:9/12;border-radius:.5rem;overflow:hidden}
.trio-media video,.trio-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform .5s ease-in-out;will-change:transform}
.trio-card:hover .trio-media video,.trio-card:hover .trio-media img{transform:scale(1)}
.trio-card .cap{margin-top:1rem;color:#707070;font-size:.95rem;line-height:1.5}
/* stats paa lys flade */
.stats-light .huge{color:var(--card-ink)}
.stats-light .stat-label{color:#9a9a9a}
.split-hero ~ section{position:relative;z-index:4}
/* værdi-kort: kort-flade + store serif-numre */
.values-cards{display:grid;grid-template-columns:1fr;gap:1.25rem}
@media(min-width:768px){.values-cards{grid-template-columns:1fr 1fr;gap:1.5rem}}
.value-card{background:#fff;border:1px solid rgba(27,29,31,.08);border-radius:.5rem;padding:2.25rem 2rem;box-shadow:0 4px 50px -30px rgba(0,0,0,.25)}
.value-card .num{font-family:var(--font-serif);font-weight:300;font-size:clamp(2.4rem,3.5vw,3.2rem);line-height:1;color:var(--accent-deep);margin-bottom:1.25rem}
.value-card h6{text-transform:uppercase;font-size:1rem;font-weight:500;margin-bottom:.6rem;letter-spacing:.05em}
.value-card p{color:#4a4a4a;line-height:1.6}

/* ============ COOKIE-SAMTYKKE ============
   Lyst kort efter reference · canvas/ink-palette · knapper m. afskaaret hjoerne */
.cookie-pop{position:fixed;right:1.25rem;bottom:1.25rem;z-index:35;width:min(28.5rem,calc(100vw - 2.5rem));background:#fff;border-radius:2px;padding:2rem 2rem 1.75rem;box-shadow:0 14px 50px -12px rgba(0,0,0,.35);opacity:0;transform:translateY(24px);pointer-events:none;transition:opacity .6s ease,transform .6s cubic-bezier(.22,1,.36,1)}
.cookie-pop.show{opacity:1;transform:translateY(0);pointer-events:auto}
.cookie-title{font-family:var(--font-body);font-weight:700;font-size:1.9rem;line-height:1;color:var(--ink);margin-bottom:.8rem}
.cookie-text{font-size:1rem;line-height:1.5;color:var(--ink);margin-bottom:1.4rem}
.cookie-more{font-size:.85rem;line-height:1.5;color:#5c5c5c;margin:-.5rem 0 1.4rem;padding-top:.8rem;border-top:1px solid rgba(0,0,0,.12)}
.cookie-actions{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.cookie-btn{position:relative;font-family:var(--font-body);font-size:.95rem;color:var(--ink);text-align:left;background:transparent;border:1px solid var(--ink);padding:.8rem 2.4rem .75rem 1.2rem;min-width:6.5rem;cursor:pointer;transition:background-color .3s ease,color .3s ease}
/* afskaaret hjoerne: roteret firkant daekker hjoernet, venstre kant tegner diagonalen (m. lille "overshoot" som i referencen) */
.cookie-btn::after{content:"";position:absolute;right:-14px;bottom:-14px;width:27px;height:27px;background:#fff;border-left:1px solid var(--ink);transform:rotate(45deg);pointer-events:none}
.cookie-btn:hover{background:var(--ink);color:#f8f8f8}
.cookie-link{margin-left:auto;font-family:var(--font-body);font-size:.95rem;background:none;border:none;padding:0;color:var(--accent-deep);cursor:pointer;transition:color .3s ease}
.cookie-link:hover{color:var(--ink)}
@media(max-width:480px){.cookie-pop{right:.75rem;bottom:.75rem;padding:1.5rem 1.5rem 1.4rem}}
