/* Hlíf umsjón – stílar teknir beint af upprunalegu síðunni (Tailwind v4 build), hreinsaðir. */
@layer properties, theme, base, components, utilities;

@layer properties {
  *, ::before, ::after, ::backdrop {
    --tw-space-y-reverse: 0; --tw-space-x-reverse: 0; --tw-border-style: solid;
    --tw-leading: initial; --tw-font-weight: initial; --tw-tracking: initial;
    --tw-shadow: 0 0 #0000; --tw-shadow-color: initial; --tw-inset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000; --tw-inset-ring-shadow: 0 0 #0000; --tw-ring-offset-shadow: 0 0 #0000;
    --tw-duration: initial; --tw-ease: initial;
  }
}

@layer theme {
  :root, :host {
    --font-sans: "Inter", "Helvetica Neue", system-ui, -apple-system, sans-serif;
    --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
    --color-white: #fff;
    --spacing: .25rem;
    --container-xs: 20rem; --container-xl: 36rem; --container-2xl: 42rem; --container-3xl: 48rem; --container-5xl: 64rem;
    --text-xs: .75rem; --text-xs--line-height: calc(1 / .75);
    --text-sm: .875rem; --text-sm--line-height: calc(1.25 / .875);
    --text-base: 1rem; --text-base--line-height: 1.5;
    --text-lg: 1.125rem; --text-lg--line-height: calc(1.75 / 1.125);
    --font-weight-medium: 500; --font-weight-semibold: 600;
    --tracking-tight: -.025em; --leading-relaxed: 1.625;
    --default-transition-duration: .15s; --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: "Inter", "Helvetica Neue", system-ui, -apple-system, sans-serif;
    --color-background: var(--background); --color-foreground: var(--foreground); --color-surface: var(--surface);
    --color-card: var(--card); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground);
    --color-primary-hover: var(--primary-hover); --color-muted-foreground: var(--muted-foreground);
    --color-destructive: var(--destructive); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring);
    --font-display: "Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif;
    --shadow-soft: 0 1px 2px oklch(20% .02 80/.04), 0 8px 24px oklch(20% .02 80/.05);
  }
}

@layer base {
  *, ::after, ::before, ::backdrop { box-sizing: border-box; border: 0 solid; margin: 0; padding: 0; }
  html, :host { text-size-adjust: 100%; -webkit-text-size-adjust: 100%; tab-size: 4; line-height: 1.5; font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif); -webkit-tap-highlight-color: transparent; }
  h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
  a { color: inherit; text-decoration: inherit; }
  ol, ul, menu { list-style: none; }
  img, svg, video, canvas, audio, iframe, embed, object { vertical-align: middle; display: block; }
  img, video { max-width: 100%; height: auto; }
  button, input, select, optgroup, textarea { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: transparent; border-radius: 0; }
  ::placeholder { opacity: 1; color: color-mix(in oklab, currentcolor 50%, transparent); }
  textarea { resize: vertical; }
  button, input:where([type="button"], [type="reset"], [type="submit"]) { appearance: button; }
  [hidden]:where(:not([hidden="until-found"])) { display: none !important; }
  * { border-color: var(--color-border); }
  html { scroll-behavior: smooth; }
  body { background-color: var(--color-background); color: var(--color-foreground); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; text-rendering: optimizelegibility; font-size: 1rem; line-height: 1.6; }
  h1, h2, h3, h4 { font-family: var(--font-display); color: var(--color-foreground); letter-spacing: -0.005em; }
  .h-display { font-family: var(--font-display); letter-spacing: -0.01em; font-size: clamp(2.5rem, 5.2vw, 3.75rem); font-weight: 600; line-height: 1.08; }
  .h-section { font-family: var(--font-display); letter-spacing: -0.005em; font-size: clamp(1.875rem, 3.6vw, 2.5rem); font-weight: 600; line-height: 1.15; }
  .h-card { font-family: var(--font-display); font-size: 1.375rem; font-weight: 600; line-height: 1.25; }
  .text-lead { color: var(--color-muted-foreground); font-size: 1.125rem; line-height: 1.65; }
  .eyebrow { font-family: var(--font-sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-muted-foreground); font-size: 0.75rem; font-weight: 500; }
  .eyebrow-star { align-items: center; gap: 0.625rem; display: inline-flex; }
  .eyebrow-star::before { content: ""; width: 12px; height: 12px; color: var(--color-primary); background-color: currentcolor; flex-shrink: 0; display: inline-block; -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'><line x1='16' y1='6' x2='16' y2='26'/><line x1='6' y1='16' x2='26' y2='16'/><line x1='9' y1='9' x2='23' y2='23'/><line x1='23' y1='9' x2='9' y2='23'/></svg>") 50% center / contain no-repeat; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'><line x1='16' y1='6' x2='16' y2='26'/><line x1='6' y1='16' x2='26' y2='16'/><line x1='9' y1='9' x2='23' y2='23'/><line x1='23' y1='9' x2='9' y2='23'/></svg>") 50% center / contain no-repeat; }
}

@layer components {
  .container-page { max-width: 72rem; margin-inline: auto; padding-inline: 1.25rem; }
  .container-narrow { max-width: 48rem; margin-inline: auto; padding-inline: 1.25rem; }
  .section { padding-block: 4.5rem; }
  @media (min-width: 640px) {
    .container-page, .container-narrow { padding-inline: 2rem; }
    .section { padding-block: 6rem; }
  }
  .section-divider { border-bottom: 1px solid var(--color-border); }
  .section-surface { background-color: var(--color-surface); background-color: color-mix(in oklab, var(--color-surface) 70%, transparent); }
  .section-header { max-width: 36rem; margin-bottom: 3rem; }
  .btn { height: 3rem; font-family: var(--font-sans); white-space: nowrap; border-radius: 9999px; justify-content: center; align-items: center; gap: 0.5rem; padding-inline: 1.75rem; font-size: 0.9375rem; font-weight: 600; line-height: 1; transition: background-color 0.2s, color 0.2s, border-color 0.2s, transform 0.12s; display: inline-flex; cursor: pointer; }
  .btn:active { transform: scale(0.98); }
  .btn:focus-visible { outline: 2px solid var(--color-ring); outline-offset: 2px; }
  .btn-primary { background-color: var(--color-primary); color: var(--color-primary-foreground); box-shadow: var(--shadow-soft); }
  .btn-primary:hover { background-color: var(--color-primary-hover); }
  .btn-secondary { color: var(--color-foreground); border: 1px solid var(--color-border); background-color: transparent; }
  .btn-secondary:hover { background-color: var(--color-surface); border-color: color-mix(in oklab, var(--color-foreground) 30%, var(--color-border)); }
  .card-surface { background-color: var(--color-card); border: 1px solid var(--color-border); border-radius: 0.75rem; padding: 1.75rem; }
  @media (min-width: 640px) { .card-surface { padding: 2rem; } }
  .field-label { color: var(--color-foreground); margin-bottom: 0.5rem; font-size: 0.875rem; font-weight: 500; display: block; }
  .field-input { border: 1px solid var(--color-input); background-color: var(--color-background); width: 100%; color: var(--color-foreground); border-radius: 0.625rem; padding: 0.875rem 1rem; font-size: 1rem; transition: border-color 0.15s, box-shadow 0.15s; }
  .field-input::placeholder { color: color-mix(in oklab, var(--color-muted-foreground) 80%, transparent); }
  .field-input:focus { border-color: var(--color-ring); box-shadow: 0 0 0 3px color-mix(in oklab, var(--color-ring) 18%, transparent); outline: none; }
  .field-input[aria-invalid="true"] { border-color: var(--color-destructive); }
  .field-input-unit { padding-right: 3rem; }
  .field-unit { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); color: var(--color-muted-foreground); font-size: 1rem; pointer-events: none; }
  .chip { border: 1px solid var(--color-border); background-color: var(--color-background); color: var(--color-muted-foreground); cursor: pointer; border-radius: 9999px; justify-content: center; align-items: center; padding: 0.625rem 1.125rem; font-size: 0.875rem; font-weight: 500; transition: border-color 0.15s, background-color 0.15s, color 0.15s; display: inline-flex; }
  .chip:hover { border-color: color-mix(in oklab, var(--color-foreground) 25%, var(--color-border)); color: var(--color-foreground); }
  .chip:has(input:focus-visible), .chip:focus-visible { outline: 2px solid var(--color-ring); outline-offset: 2px; }
  .chip[data-active="true"] { border-color: var(--color-primary); background-color: color-mix(in oklab, var(--color-primary) 7%, var(--color-background)); color: var(--color-foreground); }
}

@layer utilities {
  .sr-only { clip-path: inset(50%); white-space: nowrap; border-width: 0; width: 1px; height: 1px; margin: -1px; padding: 0; position: absolute; overflow: hidden; }
  .relative { position: relative; }
  .sticky { position: sticky; }
  .top-0 { top: 0; }
  .z-40 { z-index: 40; }
  .mx-auto { margin-inline: auto; }
  .mt-1 { margin-top: calc(var(--spacing) * 1); }
  .mt-1\.5 { margin-top: calc(var(--spacing) * 1.5); }
  .mt-2 { margin-top: calc(var(--spacing) * 2); }
  .mt-3 { margin-top: calc(var(--spacing) * 3); }
  .mt-4 { margin-top: calc(var(--spacing) * 4); }
  .mt-6 { margin-top: calc(var(--spacing) * 6); }
  .mt-8 { margin-top: calc(var(--spacing) * 8); }
  .mt-9 { margin-top: calc(var(--spacing) * 9); }
  .mt-12 { margin-top: calc(var(--spacing) * 12); }
  .mb-5 { margin-bottom: calc(var(--spacing) * 5); }
  .block { display: block; }
  .flex { display: flex; }
  .grid { display: grid; }
  .hidden { display: none; }
  .inline-block { display: inline-block; }
  .inline-flex { display: inline-flex; }
  .aspect-\[4\/3\] { aspect-ratio: 4 / 3; }
  .\!h-10 { height: calc(var(--spacing) * 10) !important; }
  .h-1\.5 { height: calc(var(--spacing) * 1.5); }
  .h-4 { height: calc(var(--spacing) * 4); }
  .h-8 { height: calc(var(--spacing) * 8); }
  .h-11 { height: calc(var(--spacing) * 11); }
  .h-12 { height: calc(var(--spacing) * 12); }
  .h-16 { height: calc(var(--spacing) * 16); }
  .h-full { height: 100%; }
  .min-h-screen { min-height: 100vh; }
  .w-1\.5 { width: calc(var(--spacing) * 1.5); }
  .w-4 { width: calc(var(--spacing) * 4); }
  .w-8 { width: calc(var(--spacing) * 8); }
  .w-11 { width: calc(var(--spacing) * 11); }
  .w-12 { width: calc(var(--spacing) * 12); }
  .w-24 { width: calc(var(--spacing) * 24); }
  .w-fit { width: fit-content; }
  .w-full { width: 100%; }
  .max-w-2xl { max-width: var(--container-2xl); }
  .max-w-3xl { max-width: var(--container-3xl); }
  .max-w-xl { max-width: var(--container-xl); }
  .max-w-xs { max-width: var(--container-xs); }
  .flex-1 { flex: 1 1 0%; }
  .shrink-0 { flex-shrink: 0; }
  .resize-y { resize: vertical; }
  .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flex-col { flex-direction: column; }
  .flex-wrap { flex-wrap: wrap; }
  .items-center { align-items: center; }
  .items-stretch { align-items: stretch; }
  .justify-between { justify-content: space-between; }
  .justify-center { justify-content: center; }
  .gap-2 { gap: calc(var(--spacing) * 2); }
  .gap-3 { gap: calc(var(--spacing) * 3); }
  .gap-4 { gap: calc(var(--spacing) * 4); }
  .gap-5 { gap: calc(var(--spacing) * 5); }
  .gap-6 { gap: calc(var(--spacing) * 6); }
  .gap-8 { gap: calc(var(--spacing) * 8); }
  .gap-10 { gap: calc(var(--spacing) * 10); }
  .gap-12 { gap: calc(var(--spacing) * 12); }
  :where(.space-y-1\.5 > :not(:last-child)) { margin-block-end: calc(var(--spacing) * 1.5); }
  :where(.space-y-5 > :not(:last-child)) { margin-block-end: calc(var(--spacing) * 5); }
  :where(.space-y-7 > :not(:last-child)) { margin-block-end: calc(var(--spacing) * 7); }
  .overflow-hidden { overflow: hidden; }
  .\!rounded-lg { border-radius: var(--radius) !important; }
  .rounded-full { border-radius: 9999px; }
  .rounded-xl { border-radius: calc(var(--radius) + 4px); }
  .border { border-style: var(--tw-border-style); border-width: 1px; }
  .border-t { border-top-style: var(--tw-border-style); border-top-width: 1px; }
  .border-b { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; }
  .border-border { border-color: var(--border); }
  .border-border\/60 { border-color: color-mix(in oklab, var(--border) 60%, transparent); }
  .border-primary { border-color: var(--primary); }
  .bg-accent { background-color: var(--accent); }
  .bg-background { background-color: var(--background); }
  .bg-card { background-color: var(--card); }
  .bg-primary { background-color: var(--primary); }
  .bg-primary\/70 { background-color: color-mix(in oklab, var(--primary) 70%, transparent); }
  .bg-surface { background-color: var(--surface); }
  .bg-surface\/60 { background-color: color-mix(in oklab, var(--surface) 60%, transparent); }
  .bg-white { background-color: var(--color-white); }
  .object-cover { object-fit: cover; }
  .p-7 { padding: calc(var(--spacing) * 7); }
  .\!px-3 { padding-inline: calc(var(--spacing) * 3) !important; }
  .\!px-5 { padding-inline: calc(var(--spacing) * 5) !important; }
  .px-3 { padding-inline: calc(var(--spacing) * 3); }
  .px-6 { padding-inline: calc(var(--spacing) * 6); }
  .\!py-3 { padding-block: calc(var(--spacing) * 3) !important; }
  .py-2 { padding-block: calc(var(--spacing) * 2); }
  .py-5 { padding-block: calc(var(--spacing) * 5); }
  .py-14 { padding-block: calc(var(--spacing) * 14); }
  .pt-0 { padding-top: 0; }
  .pb-5 { padding-bottom: calc(var(--spacing) * 5); }
  .\!text-center { text-align: center !important; }
  .text-center { text-align: center; }
  .text-left { text-align: left; }
  .text-right { text-align: right; }
  .font-sans { font-family: Inter, "Helvetica Neue", system-ui, -apple-system, sans-serif; }
  .font-serif { font-family: var(--font-serif); }
  .\!text-sm { font-size: var(--text-sm) !important; line-height: var(--tw-leading, var(--text-sm--line-height)) !important; }
  .text-base { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); }
  .text-lg { font-size: var(--text-lg); line-height: var(--tw-leading, var(--text-lg--line-height)); }
  .text-sm { font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); }
  .text-xs { font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); }
  .leading-none { --tw-leading: 1; line-height: 1; }
  .leading-relaxed { --tw-leading: var(--leading-relaxed); line-height: var(--leading-relaxed); }
  .font-medium { font-weight: var(--font-weight-medium); }
  .font-semibold { font-weight: var(--font-weight-semibold); }
  .tracking-tight { letter-spacing: var(--tracking-tight); }
  .text-destructive { color: var(--destructive); }
  .text-foreground { color: var(--foreground); }
  .text-muted-foreground { color: var(--muted-foreground); }
  .text-primary { color: var(--primary); }
  .text-primary-foreground { color: var(--primary-foreground); }
  .uppercase { text-transform: uppercase; }
  .transition-all { transition-property: all; transition-timing-function: var(--default-transition-timing-function); transition-duration: var(--default-transition-duration); }
  .transition-colors { transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke; transition-timing-function: var(--default-transition-timing-function); transition-duration: var(--default-transition-duration); }
  .transition-transform { transition-property: transform, translate, scale, rotate; transition-timing-function: var(--default-transition-timing-function); transition-duration: var(--default-transition-duration); }
  .duration-200 { transition-duration: 0.2s; }
  .last\:border-b-0:last-child { border-bottom-width: 0; }
  .disabled\:opacity-60:disabled { opacity: 0.6; }
  @media (hover: hover) {
    .hover\:border-foreground\/30:hover { border-color: color-mix(in oklab, var(--foreground) 30%, transparent); }
    .hover\:text-foreground:hover { color: var(--foreground); }
  }
  /* FAQ-harmonikka */
  .accordion-trigger[aria-expanded="true"] > svg { rotate: 180deg; }
  .accordion-content { overflow: hidden; transition: height 0.2s ease-out; }
  @media (min-width: 40rem) {
    .sm\:block { display: block; }
    .sm\:flex { display: flex; }
    .sm\:hidden { display: none; }
    .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .sm\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .sm\:flex-row { flex-direction: row; }
    .sm\:items-center { align-items: center; }
    .sm\:justify-between { justify-content: space-between; }
    .sm\:justify-center { justify-content: center; }
    .sm\:gap-4 { gap: calc(var(--spacing) * 4); }
    .sm\:gap-8 { gap: calc(var(--spacing) * 8); }
    .sm\:p-8 { padding: calc(var(--spacing) * 8); }
    .sm\:px-8 { padding-inline: calc(var(--spacing) * 8); }
    .sm\:text-\[1\.0625rem\] { font-size: 1.0625rem; }
  }
  @media (min-width: 48rem) {
    .md\:flex { display: flex; }
    .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }
  @media (min-width: 64rem) {
    .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lg\:grid-cols-\[1\.05fr_1fr\] { grid-template-columns: 1.05fr 1fr; }
    .lg\:gap-16 { gap: calc(var(--spacing) * 16); }
  }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .accordion-content, .btn, .chip { transition: none; }
  }
}

:root {
  --radius: .75rem;
  --background: oklch(98.5% .006 85); --foreground: oklch(26% .012 80);
  --surface: oklch(95.5% .014 80); --card: oklch(100% 0 0);
  --primary: oklch(46% .04 195); --primary-foreground: oklch(98.5% .006 85); --primary-hover: oklch(40% .045 195);
  --muted-foreground: oklch(50% .014 80);
  --accent: oklch(90% .022 195);
  --destructive: oklch(55% .16 27);
  --border: oklch(90.5% .008 80); --input: oklch(90.5% .008 80); --ring: oklch(46% .04 195);
}