:root{ --bg:transparent; --card-bg:#ffffff; --text:#000; --muted:#60646b; --brand:#000; --border:#000; --soft:#f6f7f8; }
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--text);background:var(--bg)}
.site-header,.site-footer{padding:20px 16px;max-width:1100px;margin:0 auto}
.site-header h1{margin:0 0 4px;font-size:28px}
.site-header .sub{color:var(--muted);margin:0}
.container.calculator-frame{max-width:1100px;margin:16px auto;padding:16px;border:2px solid var(--border);border-radius:16px;background:var(--card-bg)}
.stepper{list-style:none;display:flex;gap:8px;padding:0;margin:0 0 16px;flex-wrap:wrap}
.stepper li{background:var(--soft);padding:8px 12px;border-radius:999px;color:var(--muted);border:1px solid #d9dadd}
.stepper li.active{color:var(--text);border-color:var(--border)}
.card{background:transparent;border:0;border-radius:16px;padding:8px 0}
.hidden{display:none}
.grid{display:grid;gap:12px}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
label{display:flex;flex-direction:column;gap:6px}
label span{font-weight:600}
input,select,textarea{background:#fff;border:1px solid #cfd2d6;color:var(--text);padding:10px;border-radius:10px}
.calculator-frame input, .calculator-frame select, .calculator-frame textarea{ color:#000 !important; }
.calculator-frame input:placeholder-shown, .calculator-frame textarea:placeholder-shown{ color:#9ca3af !important; }
small.muted{color:var(--text)}
.actions{display:flex;gap:8px;justify-content:flex-end;margin-top:12px}
.btn{border:1px solid #111;border-radius:12px;padding:10px 14px;cursor:pointer;font-weight:700;background:#fff;color:#000}
.btn.primary{background:#000;color:#fff}
.btn.ghost{background:transparent;color:#000}
.switch{display:flex;gap:8px;align-items:center}
.summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.summary-item{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:12px}
.summary-item.highlight{border-color:#cfd2d6}
.summary-item h3{margin:0 0 6px;font-size:16px}
.summary-item p{margin:0;font-size:18px}
.final{display:grid;gap:8px;margin-bottom:10px}
.final .row{display:flex;justify-content:space-between;border-bottom:1px dashed #cfd2d6;padding:6px 0}
.site-footer small{color:var(--muted)}
.model-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}

/* OVERRIDE ELEMENTOR KNAP-STYLING I BEREGNEREN */
.calculator-frame .model-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
  border-radius:14px;
  border:1px solid #cfd2d6;
  background:#ffffff !important;
  color:#000 !important;
  font-weight:700;
  cursor:pointer;
  text-align:center;
  white-space:normal !important;
  word-break:break-word;
  transition:transform .05s ease, box-shadow .1s ease, background-color .1s ease;
}
.calculator-frame .model-btn:hover{
  background:#f9fafb !important;
  box-shadow:0 2px 0 #000;
}
.calculator-frame .model-btn:active{
  transform:translateY(1px);
}
.calculator-frame .model-btn.active{
  outline:2px solid var(--border);
}

/* Kort med billede */
.model-btn.has-image{
  flex-direction:column;
  border:2px solid #000;
  border-radius:16px;
  padding:16px;
  min-height:220px;
  align-items:center;
  justify-content:flex-start;
  background:#ffffff !important;
}
.model-btn.has-image img{width:160px;height:120px;max-width:100%;object-fit:contain;display:block}
.model-btn.has-image .label{
  margin-top:8px;
  font-weight:800;
  text-align:center;
  white-space:normal;
  word-break:break-word;
}
.model-btn.has-image.active,.model-btn.has-image:hover{
  box-shadow:0 0 0 3px rgba(0,0,0,.08) inset;
  background:#f9fafb !important;
}

.model-heading{margin:0 0 8px}
.hint{color:#000;font-size:12px}
.live-section h3{margin:8px 0;font-size:14px;font-weight:600;color:#333}
.live-box{border:1px solid #cfd2d6;border-radius:12px;background:#fff;padding:10px}
.live-row{display:grid;grid-template-columns:1fr auto auto auto;gap:8px;align-items:center;padding:6px 0;border-bottom:1px dashed #e5e7eb;font-size:14px;color:#333}
.live-row:last-child{border-bottom:0}
.live-row .label{font-weight:400}
.live-row.total{font-weight:600}
.live-row .muted{opacity:.8;font-weight:400}
.qty-input{width:64px;padding:6px 8px;border-radius:8px;border:1px solid #cfd2d6}
input::placeholder, textarea::placeholder{color:#9ca3af; opacity:1}
@media (max-width:480px){ .site-header h1{font-size:22px} }
.stepper{display:none !important}
.contact-form{ display:grid; grid-template-columns:1fr; gap:16px; }
.form-card{ background:#fff; border:1px solid #e5e7eb; border-radius:16px; padding:16px; }
.contact-form input, .contact-form textarea{ border:1.5px solid #d1d5db; border-radius:12px; padding:12px 14px; font-size:16px; transition:border-color .15s ease, box-shadow .15s ease; }
.contact-form textarea{ min-height:120px; resize:vertical; }
.contact-form input:focus, .contact-form textarea:focus{ outline:none; border-color:#000; box-shadow:0 0 0 3px rgba(0,0,0,.08); }
label.required span::after{ content:" *"; color:#ef4444; font-weight:700; }
.contact-form .actions{ display:flex; justify-content:flex-end; gap:8px; }
.contact-form .btn{ padding:12px 16px; border-radius:12px; }
.row-2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width:640px){ .row-2{ grid-template-columns:1fr; } }
.addons-card{ margin-top:12px; }
.addons-card .live-row:first-child{ font-weight:700; }
.live-box .live-row > div:nth-child(2){ display:flex; align-items:center; justify-content:center; gap:8px; }

/* tal-kolonner højrejusteret */
.live-box .live-row > div:nth-child(3){
  text-align:right;
  font-variant-numeric:tabular-nums;
  min-width:90px;
}
.live-box .live-row > div:nth-child(4){
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:8px;
  text-align:right;
  font-variant-numeric:tabular-nums;
  min-width:90px;
}

.live-box .qty-input{ width:80px; max-width:100%; padding:8px 12px; border:1.5px solid #d1d5db; border-radius:999px; text-align:center; font-weight:600; }
.live-box .qty-input:focus{ outline:none; border-color:#000; box-shadow:0 0 0 3px rgba(0,0,0,.08); }
.live-box .qty-input::-webkit-outer-spin-button,.live-box .qty-input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.live-box .qty-input{ -moz-appearance:textfield; }

/* X-knap – fast kvadrat med synligt ikon */
.live-row .remove-line{
  margin-left:8px;
  border:1px solid #e5e7eb;
  background:#fff;
  border-radius:8px;
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  cursor:pointer;
  font-size:16px;
  line-height:1;
  color:#000;
}
.live-row .remove-line:hover{ background:#f9fafb; }

.addons-grid{ display:grid; grid-template-columns:1fr; gap:12px; margin-top:8px; }
.addon-item{ display:flex; align-items:center; justify-content:space-between; gap:12px; background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:12px 14px; }
.addon-item .switch{ display:flex; align-items:center; gap:8px; }
.addon-estimate{ opacity:.9; }
@media (min-width:700px){ .addons-grid{ grid-template-columns:repeat(2, 1fr); } }
/* Tilvalg én linje */
.addons-list{ display:flex; flex-direction:column; gap:10px; margin-top:8px; }
.addon-option{ display:flex; align-items:center; justify-content:space-between; padding:6px 0; border-bottom:1px dashed #e5e7eb; }
.addon-option:last-child{ border-bottom:0; }
.addon-option label{ display:flex; flex-direction:row !important; align-items:center; gap:8px; margin:0; }
.addon-option input[type="checkbox"]{ margin:0; }
.addon-option .price{ font-weight:600; white-space:nowrap; }

/* Checkbox-linje i kontaktformularen */
.form-check{ display:flex; align-items:flex-start; gap:10px; }
.form-check input[type="checkbox"]{ margin-top:4px; }
.form-check span{ font-size:14px; line-height:1.4; }
.form-check a{ color:#000; text-decoration:underline; }
  
/* Existing measurement-booking presentation. */

  .skv-booking-card{max-width:850px;margin:0 auto;padding:clamp(22px,4vw,42px);border:1px solid #d9e3dc;border-radius:24px;background:#fff;box-shadow:0 18px 55px rgba(18,92,61,.1);color:#17231d}
  .skv-booking-intro{text-align:center;margin-bottom:30px}
  .skv-booking-intro h2{margin:7px 0 8px;font-size:clamp(28px,5vw,42px);line-height:1.08;color:#125c3d}
  .skv-booking-intro p{margin:0;color:#5c6d63}
  .skv-booking-kicker{display:block;color:#18804f;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
  .skv-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
  .skv-field{display:grid;gap:7px;font-weight:700;color:#263b30}
  .skv-field-wide{grid-column:1/-1}
  .skv-field input,.skv-field textarea{width:100%;box-sizing:border-box;border:1px solid #cbd7cf;border-radius:12px;background:#fff;padding:14px 15px;font:inherit;font-weight:500;color:#17231d;outline:none;transition:border-color .15s,box-shadow .15s}
  .skv-field input:focus,.skv-field textarea:focus{border-color:#18804f;box-shadow:0 0 0 4px rgba(24,128,79,.12)}
  .skv-calendar-box{margin-top:24px;padding:22px;border-radius:18px;background:#f3f7f4;border:1px solid #d9e4dc}
  .skv-calendar-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:17px}
  .skv-calendar-heading h3{margin:4px 0 0;font-size:24px;color:#125c3d}
  .skv-duration{white-space:nowrap;border-radius:999px;background:#e1eee5;padding:7px 11px;font-size:13px;font-weight:800;color:#125c3d}
  .skv-booking-hint{margin:15px 0 8px;color:#607168}
  .skv-time-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}
  .skv-time-slot{border:1px solid #bdd0c3;border-radius:11px;background:#fff;padding:12px 8px;font:inherit;font-weight:800;color:#125c3d;cursor:pointer;transition:.15s}
  .skv-time-slot:hover{border-color:#18804f;transform:translateY(-1px)}
  .skv-time-slot.is-selected{background:#125c3d;border-color:#125c3d;color:#fff;box-shadow:0 7px 16px rgba(18,92,61,.2)}
  .skv-consent{display:flex;align-items:flex-start;gap:11px;margin-top:20px;color:#53655b;font-size:14px;line-height:1.5}
  .skv-consent input{width:20px;height:20px;flex:0 0 20px;margin-top:1px;accent-color:#125c3d}
  .skv-consent a{color:#125c3d;font-weight:700}
  .skv-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
  .skv-booking-status{min-height:24px;margin-top:15px;font-weight:700}
  .skv-booking-status.is-error{color:#a32828}
  .skv-booking-status.is-success{color:#125c3d}
  .skv-booking-actions{display:flex;justify-content:space-between;gap:12px;margin-top:15px}
  .skv-booking-actions button[disabled]{opacity:.65;cursor:wait}
  @media(max-width:640px){
    .skv-booking-card{padding:22px 16px;border-radius:18px}
    .skv-form-grid{grid-template-columns:1fr}
    .skv-field-wide{grid-column:auto}
    .skv-time-slots{grid-template-columns:repeat(2,minmax(0,1fr))}
    .skv-calendar-heading{display:block}
    .skv-duration{display:inline-block;margin-top:10px}
    .skv-booking-actions{flex-direction:column-reverse}
    .skv-booking-actions button{width:100%}
  }

#bookingFields[hidden]{display:none} #submitStatus:empty{display:none}

/* Guided calculator presentation, shared visual language with VELUX. */
:root{--text:#191d18;--muted:#687064;--border:#d8ddd3;--soft:#f3f5f0}
body{color:var(--text);line-height:1.5;background:#fff}
button,input,textarea,select{font:inherit}
.site-header,.site-footer{max-width:1120px;padding:32px 26px}
.site-header{padding-bottom:10px}.site-header h1{font-size:clamp(30px,4vw,44px);font-weight:650;letter-spacing:-.045em;line-height:1.15;margin-bottom:16px}.site-header .sub{max-width:700px;font-size:17px}
.eyebrow{font-size:11px;font-weight:750;letter-spacing:.15em;color:var(--muted);margin:0 0 16px}
.container.calculator-frame{max-width:1120px;border:0;border-radius:0;padding:0 26px 26px;margin:16px auto;scroll-margin-top:16px}
.stepper{display:flex!important;gap:24px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:18px 0;margin:0 0 20px}.stepper li{border:0;border-radius:0;background:transparent;padding:6px 0;font-size:13px}.stepper li.active{font-weight:750;color:#1b3323;box-shadow:0 2px #1b3323}
.card h2{font-size:clamp(25px,3vw,32px);font-weight:650;letter-spacing:-.03em;line-height:1.2;margin:12px 0}.card h2:focus{outline:none}.section-intro{color:var(--muted);margin:0 0 26px;max-width:700px}
.basket-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:var(--muted);min-height:24px;margin-bottom:12px}.basket-toolbar .btn{font-size:13px;padding:8px 12px}
[hidden]{display:none!important}.model-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px}.calculator-frame .model-btn{border:1px solid var(--border);border-radius:14px;padding:22px 16px;min-height:210px;font-size:17px;font-weight:650;color:var(--text)!important;box-shadow:none}.model-btn.has-image img{width:100%;height:175px;object-fit:contain;margin-bottom:16px}.model-btn.has-image .label{font-weight:650}.calculator-frame .model-btn:hover{border-color:#74846c;background:#f7f8f5!important;box-shadow:none}.calculator-frame .model-btn.active{outline:2px solid #4b6e50;outline-offset:-2px;background:#f2f5ee!important}
.btn{border:1px solid #d3d9cd;border-radius:9px;padding:13px 20px;font-weight:650;color:var(--text)}.btn.primary{background:#191d18;border-color:#191d18}.btn:hover{border-color:#4b6e50}.btn:disabled{opacity:.45;cursor:not-allowed}.actions{gap:12px;flex-wrap:wrap;margin-top:28px;padding-top:20px;border-top:1px solid var(--border)}.actions .prev{margin-right:auto}
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #488468;outline-offset:3px}
.configuration-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:36px;align-items:start}.configuration-fields .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:28px}.configuration-fields .grid-4 label:last-child{grid-column:1/-1;max-width:140px}input,select,textarea{min-width:0;width:100%;padding:13px 14px;border:1px solid #cbd2c5;border-radius:9px;font-size:16px}label span{font-size:14px;font-weight:650}.hint{font-size:12px;color:var(--muted);line-height:1.6}.element-preview{background:var(--soft);border-radius:16px;padding:24px}.element-preview img{width:100%;height:210px;object-fit:contain}.element-preview h3{font-size:17px;margin:12px 0}.element-preview .live-box{background:transparent;border:0;padding:0}.element-preview .live-row{display:flex;flex-wrap:wrap;justify-content:space-between;font-size:14px}.element-preview .live-row .label{flex-basis:100%}.element-preview .live-row.total{display:block;font-size:25px;font-weight:700}.element-preview .live-row.total .label{font-size:13px}.element-preview .live-row.total div:empty{display:none}.live-section h3.price-title{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-top:22px}
.overview-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:24px 0 12px}.overview-heading h3{margin:0;font-size:18px}.live-box{border-color:var(--border);padding:18px}.live-row{gap:14px;padding:17px 0;border-bottom:1px solid var(--border)}.live-row .label{font-weight:550}.live-row small{display:block;color:var(--muted);font-size:11px}.edit-line{display:block;border:0;padding:6px 0;background:transparent;text-decoration:underline;text-underline-offset:3px;color:#31553b;font-size:13px;cursor:pointer}.live-row .remove-line{min-width:36px;width:36px;height:36px}.live-box .qty-input{width:72px;border-radius:8px}.addons-card{padding:4px 18px;margin-top:22px}.addons-card>.live-box{border:0;padding:0}.addon-option{padding:16px 0;border-bottom:1px solid var(--border);gap:18px}.addon-option .price{font-size:14px;color:var(--muted)}input[type=checkbox]{width:20px;height:20px;flex:0 0 20px;accent-color:#31553b}.form-check{flex-direction:row}.summary-item.highlight{background:var(--soft);border:0;padding:24px;margin:12px 0 24px}.summary-item h3{font-size:13px;color:var(--muted);font-weight:500}.summary-item p{font-size:36px;font-weight:650;letter-spacing:-.04em}.contact-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:24px;border-color:var(--border)}.contact-form>.row-2,.contact-form>label:has(textarea),.contact-form>.form-check,.contact-form>#bookingFields,.contact-form>#submitStatus,.contact-form>.actions{grid-column:1/-1}.contact-form .actions{margin-top:0}.contact-form .form-check span{font-weight:400}.contact-form>label:has(#bookMeasurement){padding:18px;background:var(--soft);border-radius:10px}.site-footer{border-top:1px solid var(--border);font-size:12px;color:var(--muted)}
@media(max-width:700px){.site-header,.site-footer{padding:24px 16px}.container.calculator-frame{padding:0 16px 24px}.stepper{gap:10px;justify-content:space-between}.stepper li{font-size:11px}.model-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.calculator-frame .model-btn{padding:16px 10px;min-height:170px;font-size:15px}.model-btn.has-image img{height:130px;margin-bottom:8px}.configuration-layout{grid-template-columns:1fr;gap:8px}.element-preview{padding:20px}.element-preview img{height:170px}.contact-form{grid-template-columns:1fr;padding:18px}.contact-form>*{grid-column:1!important}.actions{justify-content:stretch}.actions .btn{flex:1}.actions .prev{flex:0 0 auto}.live-row{grid-template-columns:1fr 1fr}.live-row>.label{grid-column:1/-1}.live-box .live-row>div:nth-child(2){justify-content:flex-start}.live-box .live-row>div:nth-child(3){display:none}.live-box .live-row>div:nth-child(4){min-width:0}.addon-option{align-items:flex-start}.addon-option .price{font-size:12px}.overview-heading{align-items:flex-start}.overview-heading .btn{font-size:12px;padding:10px}.basket-toolbar{flex-wrap:wrap}.configuration-fields .grid{gap:14px}.live-row.total{font-weight:700}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
#liveSummary .live-row:not(.total)>div:nth-child(4){display:none}#lineSummary .live-row:not([data-idx]){display:flex;justify-content:space-between;flex-wrap:wrap}#lineSummary .live-row:not([data-idx])>div:empty{display:none}.addons-card h3{font-size:17px;margin:18px 0 4px}.basket-toolbar:has(#viewBasket[hidden]):has(#selectionTrail:empty){display:none}

#sideHungFields{border:0;padding:0;margin:0 0 26px;min-width:0}#sideHungFields legend{font-size:14px;font-weight:650;margin-bottom:10px}.variant-choices{display:flex;gap:10px;flex-wrap:wrap}.variant-choices button{min-width:76px;padding:12px 20px;background:#fff;border:1px solid #cbd2c5;border-radius:9px;color:#191d18;font-weight:600;cursor:pointer}.variant-choices button[aria-pressed="true"]{background:#191d18;border-color:#191d18;color:white}.variant-choices button:hover{border-color:#488468}

/* Product pictures in the order overview, using the selected series and opening. */
#lineSummary .overview-element{display:flex;align-items:center;gap:18px;min-width:0}
.overview-element-image{width:100px;height:108px;object-fit:contain;flex:0 0 100px;background:#f7f8f5;border-radius:8px;padding:8px;box-sizing:border-box}
.overview-element-copy{min-width:0;overflow-wrap:anywhere}
@media(max-width:700px){#lineSummary .overview-element{gap:12px}.overview-element-image{width:76px;height:84px;flex-basis:76px}}