(or whichever size the user picked). Change the class at runtime to rescale. Usage:

…

========================================================================== */ /* ---------- Fonts ---------- */ @font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('./fonts/Inter.ttf') format('truetype-variations'); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 100 900; font-display: swap; src: url('./fonts/Inter-Italic.ttf') format('truetype-variations'); } :root { /* ====================================================================== ESTALDO SEMANTISKE TOKENS (brugt af sektion-styles nedenfor) ====================================================================== */ --es-brand: #47243C; /* signatur-aubergine */ --es-ink: #2E2A24; /* primær tekst */ --es-muted: #57524A; /* sekundær tekst */ --es-line: #E7DFD1; /* border */ --es-paper: #FAF7F1; /* baggrund */ --es-card: #FFFEFB; /* kort-baggrund */ --es-cta: #067A47; /* CTA-grøn */ --es-cta-hover: #05612F; /* CTA-grøn hover */ /* ====================================================================== RAW PALETTE (Untitled UI scales, full set) ====================================================================== */ /* Base */ --palette-base-white: #FFFFFF; --palette-base-black: #000000; /* Brand — Untitled UI default purple */ --palette-brand-25: #FCFAFF; --palette-brand-50: #F9F5FF; --palette-brand-100: #F4EBFF; --palette-brand-200: #E9D7FE; --palette-brand-300: #D6BBFB; --palette-brand-400: #B692F6; --palette-brand-500: #9E77ED; --palette-brand-600: #7F56D9; /* Brand solid */ --palette-brand-700: #6941C6; /* Brand hover */ --palette-brand-800: #53389E; --palette-brand-900: #42307D; --palette-brand-950: #2C1C5F; /* Gray — light mode */ --palette-gray-25: #FCFCFD; --palette-gray-50: #F9FAFB; --palette-gray-100: #F2F4F7; --palette-gray-200: #EAECF0; --palette-gray-300: #D0D5DD; --palette-gray-400: #98A2B3; --palette-gray-500: #667085; --palette-gray-600: #475467; --palette-gray-700: #344054; --palette-gray-800: #182230; --palette-gray-900: #101828; --palette-gray-950: #0C111D; /* Error */ --palette-error-25: #FFFBFA; --palette-error-50: #FEF3F2; --palette-error-100: #FEE4E2; --palette-error-200: #FECDCA; --palette-error-300: #FDA29B; --palette-error-400: #F97066; --palette-error-500: #F04438; --palette-error-600: #D92D20; --palette-error-700: #B42318; --palette-error-800: #912018; --palette-error-900: #7A271A; --palette-error-950: #55160C; /* Warning */ --palette-warning-25: #FFFCF5; --palette-warning-50: #FFFAEB; --palette-warning-100: #FEF0C7; --palette-warning-200: #FEDF89; --palette-warning-300: #FEC84B; --palette-warning-400: #FDB022; --palette-warning-500: #F79009; --palette-warning-600: #DC6803; --palette-warning-700: #B54708; --palette-warning-800: #93370D; --palette-warning-900: #7A2E0E; --palette-warning-950: #4E1D09; /* Success */ --palette-success-25: #F6FEF9; --palette-success-50: #ECFDF3; --palette-success-100: #DCFAE6; --palette-success-200: #ABEFC6; --palette-success-300: #75E0A7; --palette-success-400: #47CD89; --palette-success-500: #17B26A; --palette-success-600: #079455; --palette-success-700: #067647; --palette-success-800: #085D3A; --palette-success-900: #074D31; --palette-success-950: #053321; /* Info / Blue Light */ --palette-blue-light-25: #F5FBFF; --palette-blue-light-50: #F0F9FF; --palette-blue-light-100: #E0F2FE; --palette-blue-light-200: #B9E6FE; --palette-blue-light-300: #7CD4FD; --palette-blue-light-400: #36BFFA; --palette-blue-light-500: #0BA5EC; --palette-blue-light-600: #0086C9; --palette-blue-light-700: #026AA2; --palette-blue-light-800: #065986; --palette-blue-light-900: #0B4A6F; --palette-blue-light-950: #062C41; /* Gray — dark mode */ --palette-gray-dm-25: #FAFAFA; --palette-gray-dm-50: #F5F5F6; --palette-gray-dm-100: #F0F1F1; --palette-gray-dm-200: #ECECED; --palette-gray-dm-300: #CECFD2; --palette-gray-dm-400: #94969C; --palette-gray-dm-500: #85888E; --palette-gray-dm-600: #61646C; --palette-gray-dm-700: #333741; --palette-gray-dm-800: #1F242F; --palette-gray-dm-900: #161B26; --palette-gray-dm-950: #0C111D; /* Gray tones (for data viz / calendars) */ --palette-gray-blue-50: #F8F9FC; --palette-gray-blue-500: #4E5BA6; --palette-gray-blue-600: #3E4784; --palette-gray-blue-700: #363F72; --palette-gray-cool-50: #F9F9FB; --palette-gray-cool-500: #5D6B98; --palette-gray-cool-600: #4A5578; --palette-gray-cool-700: #404968; --palette-gray-modern-50: #F8FAFC; --palette-gray-modern-500: #697586; --palette-gray-modern-600: #4B5565; --palette-gray-modern-700: #364152; --palette-gray-warm-50: #FAFAF9; --palette-gray-warm-500: #79716B; --palette-gray-warm-600: #57534E; --palette-gray-warm-700: #44403C; /* Extended palette (calendar/event colors + accents) */ --palette-teal-50: #F0FDF9; --palette-teal-500: #15B79E; --palette-teal-600: #0E9384; --palette-teal-700: #107569; --palette-cyan-50: #ECFDFF; --palette-cyan-500: #06AED4; --palette-cyan-600: #088AB2; --palette-cyan-700: #0E7090; --palette-blue-50: #EFF8FF; --palette-blue-500: #2E90FA; --palette-blue-600: #1570EF; --palette-blue-700: #175CD3; --palette-blue-dark-50: #EFF4FF; --palette-blue-dark-500: #2970FF; --palette-blue-dark-600: #155EEF; --palette-blue-dark-700: #004EEB; --palette-indigo-50: #EEF4FF; --palette-indigo-500: #6172F3; --palette-indigo-600: #444CE7; --palette-indigo-700: #3538CD; --palette-violet-50: #F5F3FF; --palette-violet-500: #875BF7; --palette-violet-600: #7839EE; --palette-violet-700: #6927DA; --palette-purple-25: #FAFAFF; --palette-purple-50: #F4F3FF; --palette-purple-100: #EBE9FE; --palette-purple-200: #D9D6FE; --palette-purple-300: #BDB4FE; --palette-purple-400: #9B8AFB; --palette-purple-500: #7A5AF8; --palette-purple-600: #6938EF; --palette-purple-700: #5925DC; --palette-fuchsia-50: #FDF4FF; --palette-fuchsia-500: #D444F1; --palette-fuchsia-600: #BA24D5; --palette-fuchsia-700: #9F1AB1; --palette-pink-50: #FDF2FA; --palette-pink-500: #EE46BC; --palette-pink-600: #DD2590; --palette-pink-700: #C11574; --palette-rose-50: #FFF1F3; --palette-rose-500: #F63D68; --palette-rose-600: #E31B54; --palette-rose-700: #C01048; --palette-orange-dark-50: #FFF4ED; --palette-orange-dark-500: #FF4405; --palette-orange-dark-600: #E62E05; --palette-orange-dark-700: #BC1B06; --palette-orange-50: #FEF6EE; --palette-orange-500: #EF6820; --palette-orange-600: #E04F16; --palette-orange-700: #B93815; --palette-yellow-50: #FEFBE8; --palette-yellow-500: #EAAA08; --palette-yellow-600: #CA8504; --palette-yellow-700: #A15C07; /* Decorative: Estaldo logomark deep purple (not part of brand ramp) */ --palette-estaldo-mark: #421B4B; /* ====================================================================== SEMANTIC TOKENS (light mode; matches the compiled --color-* namespace) ====================================================================== */ /* Text */ --color-text-primary: var(--palette-gray-900); --color-text-primary-on-brand: var(--palette-base-white); --color-text-secondary: var(--palette-gray-700); --color-text-secondary-hover: var(--palette-gray-800); --color-text-tertiary: var(--palette-gray-600); --color-text-tertiary-hover: var(--palette-gray-700); --color-text-quaternary: var(--palette-gray-500); --color-text-white: var(--palette-base-white); --color-text-disabled: var(--palette-gray-500); --color-text-placeholder: var(--palette-gray-500); --color-text-brand-primary: var(--palette-brand-900); --color-text-brand-secondary: var(--palette-brand-700); --color-text-brand-tertiary: var(--palette-brand-600); --color-text-error: var(--palette-error-600); --color-text-success: var(--palette-success-600); --color-text-warning: var(--palette-warning-600); --color-text-info: var(--palette-blue-light-600); /* Border */ --color-border-primary: var(--palette-gray-300); --color-border-secondary: var(--palette-gray-200); --color-border-tertiary: var(--palette-gray-100); --color-border-disabled: var(--palette-gray-300); --color-border-brand: var(--palette-brand-300); --color-border-brand-solid: var(--palette-brand-600); --color-border-error: var(--palette-error-300); --color-border-error-solid: var(--palette-error-600); --color-border-success: var(--palette-success-300); --color-border-warning: var(--palette-warning-300); --color-border-info: var(--palette-blue-light-300); /* Background */ --color-background-primary: var(--palette-base-white); --color-background-primary-alt: var(--palette-base-white); --color-background-primary-hover: var(--palette-gray-50); --color-background-secondary: var(--palette-gray-50); --color-background-secondary-alt: var(--palette-gray-50); --color-background-secondary-hover: var(--palette-gray-100); --color-background-tertiary: var(--palette-gray-100); --color-background-quaternary: var(--palette-gray-200); --color-background-active: var(--palette-gray-100); --color-background-disabled: var(--palette-gray-100); --color-background-brand-primary: var(--palette-brand-50); --color-background-brand-secondary: var(--palette-brand-100); --color-background-brand-solid: var(--palette-brand-600); --color-background-brand-solid-hover: var(--palette-brand-700); --color-background-brand-section: var(--palette-brand-800); --color-background-error-primary: var(--palette-error-50); --color-background-error-solid: var(--palette-error-600); --color-background-success-primary: var(--palette-success-50); --color-background-warning-primary: var(--palette-warning-50); --color-background-info-primary: var(--palette-blue-light-50); /* Foreground (icons) */ --color-foreground-primary: var(--palette-gray-900); --color-foreground-secondary: var(--palette-gray-700); --color-foreground-tertiary: var(--palette-gray-600); --color-foreground-quaternary: var(--palette-gray-500); --color-foreground-quinary: var(--palette-gray-400); --color-foreground-disabled: var(--palette-gray-400); --color-foreground-white: var(--palette-base-white); --color-foreground-brand: var(--palette-brand-600); --color-foreground-error: var(--palette-error-600); --color-foreground-success: var(--palette-success-600); --color-foreground-warning: var(--palette-warning-600); /* ====================================================================== TYPOGRAPHY BASE ====================================================================== */ --font-family: 'Inter', ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; --font-family-mono: 'Inconsolata', 'JetBrains Mono', 'Fira Code', Consolas, monospace; --font-weight-regular: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; /* ====================================================================== RADII — static part (radius scale from the foundation) ui-radius-sm / md are OVERRIDDEN by the displaysize-* class. ====================================================================== */ --radius-none: 0; --radius-xs: 2px; --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-xl: 10px; --radius-2xl: 12px; --radius-3xl: 16px; --radius-4xl: 20px; --radius-full: 9999px; /* ====================================================================== SHADOWS — cool blue ====================================================================== */ --shadow-xs: 0 1px 2px 0 rgba(16, 24, 40, 0.05); --shadow-sm: 0 1px 2px 0 rgba(16, 24, 40, 0.06), 0 1px 3px 0 rgba(16, 24, 40, 0.10); --shadow-md: 0 2px 4px -2px rgba(16, 24, 40, 0.06), 0 4px 8px -2px rgba(16, 24, 40, 0.10); --shadow-lg: 0 4px 6px -2px rgba(16, 24, 40, 0.03), 0 12px 16px -4px rgba(16, 24, 40, 0.08); --shadow-xl: 0 8px 8px -4px rgba(16, 24, 40, 0.03), 0 20px 24px -4px rgba(16, 24, 40, 0.08); --shadow-2xl: 0 24px 48px -12px rgba(16, 24, 40, 0.18); --shadow-3xl: 0 32px 64px -12px rgba(16, 24, 40, 0.14); --ring-brand: 0 0 0 4px rgba(158, 119, 237, 0.24); --ring-error: 0 0 0 4px rgba(240, 68, 56, 0.24); --ring-gray: 0 0 0 4px rgba(152, 162, 179, 0.14); /* ====================================================================== DEFAULTS (displaysize--md values — so a plain page still works) These are overridden by any ancestor .displaysize--* class. ====================================================================== */ --ui-spacing-3xs: 4px; --ui-spacing-2xs: 6px; --ui-spacing-xs: 8px; --ui-spacing-sm: 12px; --ui-spacing-md: 16px; --ui-spacing-lg: 20px; --ui-spacing-xl: 24px; --ui-spacing-2xl: 32px; --ui-spacing-3xl: 40px; --ui-radius-sm: 6px; --ui-radius-md: 8px; --text-2xs-size: 8px; --text-2xs-line-height: 14px; --text-2xs-letter-spacing: 0.02em; --text-xs-size: 10px; --text-xs-line-height: 16px; --text-xs-letter-spacing: 0.02em; --text-sm-size: 12px; --text-sm-line-height: 18px; --text-sm-letter-spacing: normal; --text-md-size: 14px; --text-md-line-height: 20px; --text-md-letter-spacing: normal; --text-lg-size: 16px; --text-lg-line-height: 24px; --text-lg-letter-spacing: normal; --text-xl-size: 18px; --text-xl-line-height: 28px; --text-xl-letter-spacing: normal; --heading-xs-size: 24px; --heading-xs-line-height: 32px; --heading-xs-letter-spacing: normal; --heading-sm-size: 30px; --heading-sm-line-height: 38px; --heading-sm-letter-spacing: normal; --heading-md-size: 36px; --heading-md-line-height: 44px; --heading-md-letter-spacing: -0.02em; --heading-lg-size: 48px; --heading-lg-line-height: 60px; --heading-lg-letter-spacing: -0.02em; --heading-xl-size: 60px; --heading-xl-line-height: 72px; --heading-xl-letter-spacing: -0.02em; --heading-2xl-size: 72px; --heading-2xl-line-height: 90px; --heading-2xl-letter-spacing: -0.02em; } /* ========================================================================== TYPOGRAPHY HELPERS ========================================================================== */ html, body { font-family: var(--font-family); color: var(--color-text-primary); background-color: var(--color-background-primary); -webkit-font-smoothing: antialiased; } .text-2xs { font-size: var(--text-2xs-size); line-height: var(--text-2xs-line-height); letter-spacing: var(--text-2xs-letter-spacing); } .text-xs { font-size: var(--text-xs-size); line-height: var(--text-xs-line-height); letter-spacing: var(--text-xs-letter-spacing); } .text-sm { font-size: var(--text-sm-size); line-height: var(--text-sm-line-height); letter-spacing: var(--text-sm-letter-spacing); } .text-md { font-size: var(--text-md-size); line-height: var(--text-md-line-height); letter-spacing: var(--text-md-letter-spacing); } .text-lg { font-size: var(--text-lg-size); line-height: var(--text-lg-line-height); letter-spacing: var(--text-lg-letter-spacing); } .text-xl { font-size: var(--text-xl-size); line-height: var(--text-xl-line-height); letter-spacing: var(--text-xl-letter-spacing); } .heading-xs { font-size: var(--heading-xs-size); line-height: var(--heading-xs-line-height); letter-spacing: var(--heading-xs-letter-spacing); font-weight: 600; } .heading-sm { font-size: var(--heading-sm-size); line-height: var(--heading-sm-line-height); letter-spacing: var(--heading-sm-letter-spacing); font-weight: 600; } .heading-md { font-size: var(--heading-md-size); line-height: var(--heading-md-line-height); letter-spacing: var(--heading-md-letter-spacing); font-weight: 600; } .heading-lg { font-size: var(--heading-lg-size); line-height: var(--heading-lg-line-height); letter-spacing: var(--heading-lg-letter-spacing); font-weight: 600; } .heading-xl { font-size: var(--heading-xl-size); line-height: var(--heading-xl-line-height); letter-spacing: var(--heading-xl-letter-spacing); font-weight: 700; } .heading-2xl { font-size: var(--heading-2xl-size); line-height: var(--heading-2xl-line-height); letter-spacing: var(--heading-2xl-letter-spacing); font-weight: 700; } /* ========================================================================== BACK-COMPAT ALIASES — so preview cards written before the correction keep working. Prefer --palette-* and --color-* going forward. ========================================================================== */ :root { --brand-25: var(--palette-brand-25); --brand-50: var(--palette-brand-50); --brand-100: var(--palette-brand-100); --brand-200: var(--palette-brand-200); --brand-300: var(--palette-brand-300); --brand-400: var(--palette-brand-400); --brand-500: var(--palette-brand-500); --brand-600: var(--palette-brand-600); --brand-700: var(--palette-brand-700); --brand-800: var(--palette-brand-800); --brand-900: var(--palette-brand-900); --brand-950: var(--palette-brand-950); --gray-25: var(--palette-gray-25); --gray-50: var(--palette-gray-50); --gray-100: var(--palette-gray-100); --gray-200: var(--palette-gray-200); --gray-300: var(--palette-gray-300); --gray-400: var(--palette-gray-400); --gray-500: var(--palette-gray-500); --gray-600: var(--palette-gray-600); --gray-700: var(--palette-gray-700); --gray-800: var(--palette-gray-800); --gray-900: var(--palette-gray-900); --gray-950: var(--palette-gray-950); --error-50: var(--palette-error-50); --error-100: var(--palette-error-100); --error-200: var(--palette-error-200); --error-300: var(--palette-error-300); --error-400: var(--palette-error-400); --error-500: var(--palette-error-500); --error-600: var(--palette-error-600); --error-700: var(--palette-error-700); --success-50: var(--palette-success-50); --success-100: var(--palette-success-100); --success-200: var(--palette-success-200); --success-300: var(--palette-success-300); --success-400: var(--palette-success-400); --success-500: var(--palette-success-500); --success-600: var(--palette-success-600); --success-700: var(--palette-success-700); --warning-50: var(--palette-warning-50); --warning-100: var(--palette-warning-100); --warning-200: var(--palette-warning-200); --warning-300: var(--palette-warning-300); --warning-400: var(--palette-warning-400); --warning-500: var(--palette-warning-500); --warning-600: var(--palette-warning-600); --warning-700: var(--palette-warning-700); --info-50: var(--palette-blue-light-50); --info-100: var(--palette-blue-light-100); --info-200: var(--palette-blue-light-200); --info-300: var(--palette-blue-light-300); --info-400: var(--palette-blue-light-400); --info-500: var(--palette-blue-light-500); --info-600: var(--palette-blue-light-600); --info-700: var(--palette-blue-light-700); /* Back-compat semantic aliases */ --bg-primary: var(--color-background-primary); --bg-secondary: var(--color-background-secondary); --bg-tertiary: var(--color-background-tertiary); --bg-brand-solid: var(--color-background-brand-solid); --text-primary: var(--color-text-primary); --text-secondary: var(--color-text-secondary); --text-tertiary: var(--color-text-tertiary); --text-quaternary: var(--color-text-quaternary); --text-white: var(--color-text-white); --text-placeholder: var(--color-text-placeholder); --text-disabled: var(--color-text-disabled); --border-primary: var(--color-border-primary); --border-secondary: var(--color-border-secondary); --border-disabled: var(--color-border-disabled); } /* 2. Side-styles */ html,body{margin:0;padding:0;background:var(--es-paper);} *{box-sizing:border-box;} .es-mobile,.es-mobile *{-webkit-text-size-adjust:100%;text-size-adjust:100%;} image-slot{display:block;} a{color:var(--es-brand);text-decoration:none;} a:hover{color:var(--es-ink);} /* lidt mere vægt på brødteksten så den ikke virker spinkel (semibold-afsnit påvirkes ikke) */ .es-site p{font-weight:460;} .es-nav-link{color:#5A544B;font-size:14px;font-weight:600;letter-spacing:-0.005em;transition:color .2s ease;} .es-nav-link:hover{color:var(--es-ink);} .es-spread{scroll-margin-top:92px;margin:20px 0;} input.es-addr{outline:none;} input.es-addr:focus{border-color:var(--es-brand);box-shadow:0 0 0 4px rgba(143,90,160,0.22);} .es-cta{transition:background .2s ease;} .es-cta:hover{background:var(--es-cta-hover);} .es-testivid:hover .es-testivid-play span{transform:scale(1.08);} @keyframes es-spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}} /* 3. Sektion-styles */ .es-pris-card{background:var(--es-card);border:1px solid var(--es-line);border-radius:18px;padding:30px 34px 28px;box-shadow:0 26px 60px -34px rgba(60,50,40,.5);max-width:114mm;width:100%;margin:0 auto;} .es-pris-grid{display:grid;grid-template-columns:1fr;column-gap:26px;border-top:1px solid #DBD3C4;margin-top:16px;}.es-pris-opt{display:flex;align-items:center;gap:13px;width:100%;background:none;border:0;border-bottom:1px solid var(--es-line);padding:13px 2px;cursor:pointer;font-family:var(--font-family);text-align:left;}.es-pris-opt .ic{width:24px;height:24px;flex:0 0 auto;color:var(--es-muted);display:flex;align-items:center;justify-content:center;}.es-pris-opt .nm{flex:1;min-width:0;font-size:20px;font-weight:700;letter-spacing:-0.01em;color:var(--es-ink);transition:color .2s;}.es-pris-opt .ar{width:30px;height:30px;border-radius:50%;border:1px solid #C9BEA4;display:flex;align-items:center;justify-content:center;flex:0 0 auto;color:var(--es-brand);transition:background .2s,border-color .2s,color .2s;}.es-pris-opt .ar>svg{width:15px;height:15px;}.es-pris-opt:hover .ar{background:var(--es-brand);border-color:var(--es-brand);color:#fff;}.es-pris-opt:hover .nm{color:var(--es-brand);}.es-pris-change{background:none;border:0;color:var(--es-muted);font-size:13.5px;font-weight:600;cursor:pointer;font-family:var(--font-family);margin-top:10px;display:inline-flex;align-items:center;gap:6px;align-self:flex-start;}.es-pris-change:hover{color:var(--es-ink);}.es-pris-result{animation:es-pris-in .35s ease;}@keyframes es-pris-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} .es-tflip{perspective:900px;}.es-tflip-in{position:relative;width:100%;height:100%;transition:transform .55s cubic-bezier(.4,0,.2,1);transform-style:preserve-3d;}.es-tflip:hover .es-tflip-in,.es-tflip:focus-within .es-tflip-in{transform:rotateY(180deg);}.es-tflip-front,.es-tflip-back{position:absolute;inset:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:10px;overflow:hidden;}.es-tflip-front{background:#EFE9DD;border:1px solid #E2DACB;color:var(--es-ink);display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:9px;padding:13px 14px;box-shadow:0 8px 22px -18px rgba(60,50,40,.5);transition:border-color .2s,box-shadow .2s;}.es-tflip:hover .es-tflip-front{border-color:#C9BEA4;}.es-tflip-fhd{display:flex;flex-direction:column;align-items:flex-start;gap:9px;}.es-tflip-ic{width:9.5mm;height:9.5mm;border-radius:9px;background:var(--es-card);border:1px solid #E2DACB;display:flex;align-items:center;justify-content:center;flex:0 0 auto;color:var(--es-brand);}.es-tflip-ic svg{width:5mm;height:5mm;}.es-tflip-title{font-size:15px;font-weight:700;line-height:1.16;letter-spacing:-0.01em;}.es-tflip-more{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--es-brand);}.es-tflip:hover .es-tflip-more{gap:8px;}.es-tflip-more>svg{transition:transform .2s;}.es-tflip:hover .es-tflip-more>svg{transform:translateX(2px);}.es-tflip-back{background:var(--es-card);border:1px solid var(--es-line);padding:7px 10px;display:flex;flex-direction:column;transform:rotateY(180deg);}.es-tflip--accent .es-tflip-front{background:#EFE9F3;border-color:#DCD0E4;}.es-tflip--accent:hover .es-tflip-front{border-color:#C3B0CE;}.es-tflip--accent .es-tflip-ic{background:#F7F3FA;border-color:#DCD0E4;}.es-tflip--gray .es-tflip-front{background:#EAE9E6;border-color:#DEDCD7;}.es-tflip--gray:hover .es-tflip-front{border-color:#C7C4BD;}.es-tflip--gray .es-tflip-ic{background:#FCFCFB;border-color:#DEDCD7;} .anim-faq .es-faq-item{border-top:1px solid var(--es-line);}.anim-faq .es-faq-item:last-child{border-bottom:1px solid var(--es-line);}.es-faq-q{width:100%;text-align:left;background:none;border:0;cursor:pointer;font-family:var(--font-family);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;font-size:16px;font-weight:700;color:var(--es-ink);letter-spacing:-0.005em;}.es-faq-q>svg{width:19px;height:19px;flex:0 0 auto;color:var(--es-brand);transition:transform .35s cubic-bezier(.4,0,.2,1);}.es-faq-item.open .es-faq-q>svg{transform:rotate(180deg);}.es-faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s cubic-bezier(.4,0,.2,1);}.es-faq-item.open .es-faq-a{grid-template-rows:1fr;}.es-faq-a>.es-faq-a-inner{overflow:hidden;}.es-faq-a-inner>div{font-size:14px;line-height:1.5;color:var(--es-muted);padding-bottom:12px;} /* --- focus states (was style-focus attrs) --- */ .es-site input:focus, .es-site textarea:focus{outline:none;} .es-hero-form input.es-addr:focus{border-color:var(--es-brand);box-shadow:0 0 0 4px rgba(143,90,160,0.22);} .nima-face form input:focus{border-color:#fff !important;background:rgba(255,255,255,0.16) !important;} .es-formmsg{display:none;} .es-form-done .es-formmsg{display:flex;} .es-form-done .es-formwrap{display:none;} /* baked font (Open Sans body, Inter overskrifter) */ .es-site{font-family:'Open Sans', var(--font-family), sans-serif;} .es-site h1,.es-site h2,.es-site h3,.es-site h4,.es-site h5,.es-site h6,.es-site .es-inter{font-family:'Inter', var(--font-family), sans-serif;} /* hero vurderings-kort — fokus-elementer (pill-tab + live-status) */ .es-hero-tab{position:absolute;top:-13px;left:26px;display:inline-flex;align-items:center;gap:6px;background:var(--es-brand);color:#fff;font-weight:700;font-size:11px;letter-spacing:.05em;text-transform:uppercase;padding:6px 13px;border-radius:999px;box-shadow:0 8px 18px -8px rgba(71,36,60,.6);} .es-hero-live{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--es-muted);margin-top:4px;max-width:100%;white-space:nowrap;overflow:hidden;} .es-hero-live-txt{overflow:hidden;text-overflow:ellipsis;transition:opacity .4s ease;} .es-hero-livedot{width:9px;height:9px;border-radius:50%;background:var(--es-cta);box-shadow:0 0 0 0 rgba(6,122,71,.5);animation:es-livepulse 2s ease-out infinite;flex:0 0 auto;} @keyframes es-livepulse{0%{box-shadow:0 0 0 0 rgba(6,122,71,.5)}70%{box-shadow:0 0 0 7px rgba(6,122,71,0)}100%{box-shadow:0 0 0 0 rgba(6,122,71,0)}} /* subtil puls på pris-valg pile */ @keyframes es-ar-pulse{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}} .es-pris-opt .ar svg{animation:es-ar-pulse 1.8s ease-in-out infinite;will-change:transform;} .es-pris-opt .ar svg:nth-child(1){animation-delay:0s} .es-pris-opt:hover .ar svg{animation-play-state:paused;transform:translateX(2px)} .es-pris-grid .es-pris-opt:nth-child(2) .ar svg{animation-delay:.25s} .es-pris-grid .es-pris-opt:nth-child(3) .ar svg{animation-delay:.5s} .es-pris-grid .es-pris-opt:nth-child(4) .ar svg{animation-delay:.75s} .es-pris-grid .es-pris-opt:nth-child(5) .ar svg{animation-delay:1s} .es-pris-grid .es-pris-opt:nth-child(6) .ar svg{animation-delay:1.25s} /* ====================================================================== SEKTION-STYLES (flyttet fra inline