/* Hallmark · Dose skin for the older Tailwind pages (sector, city, product, hotel, contact, quote, guide, legal) · theme: dose (by request, blue ground, the logo blue as its one signal) · genre: modern-minimal
 * Loaded after tailwind.css, site-polish.css, tokens.css and chrome.css; restyles the shared Tailwind template without touching content, links or SEO.
 * The template sets colours inline and site-polish uses !important, so this layer answers with !important where it must. Tokens only, from css/tokens.css. */

/* ── ground: grained warm paper; the template's flat section fills step aside ── */
html body { background: var(--grain), var(--color-paper) !important; color: var(--color-ink); }
html body main section:is(.bg-background, .bg-white, [style*="#f8f9ff"], [style*="#F8F9FF"]) { background: transparent !important; }

/* ── type: Schibsted Grotesk 700 for every head, sentence case, no tracked capitals ── */
html body main :is(h1, .font-headline-xl, .font-headline-lg, .font-headline-md, .text-headline-xl, .text-headline-lg, .text-headline-md) { font-family: var(--font-display) !important; font-weight: 700 !important; letter-spacing: var(--tracking-display) !important; }
html body main h1 { line-height: 1.02 !important; }
html body main h2:is(.text-headline-lg, .font-headline-lg) { line-height: 1.05 !important; }
html body main :is([style*="text-transform:uppercase"], [style*="text-transform: uppercase"], .uppercase, .badge-text) { text-transform: none !important; letter-spacing: 0 !important; }
html body main [class*="tracking-"] { letter-spacing: 0 !important; }

/* ── the first section: the blue ground with window light, like the homepage hero ── */
html body main:not(.max-w-3xl) > section:first-child { position: relative; isolation: isolate; overflow: clip; background: var(--color-accent) !important; color: var(--color-blue-ink); }
html body main:not(.max-w-3xl) > section:first-child::before { content: ""; position: absolute; inset: -10% -6%; z-index: -1; pointer-events: none; opacity: 0.11; filter: blur(26px); -webkit-mask-image: none; mask-image: none;
  background: linear-gradient(var(--light), var(--light)) 6% 4% / 13% 40% no-repeat, linear-gradient(var(--light), var(--light)) 21% 4% / 13% 40% no-repeat,
    linear-gradient(var(--light), var(--light)) 6% 52% / 13% 40% no-repeat, linear-gradient(var(--light), var(--light)) 21% 52% / 13% 40% no-repeat;
  transform: skewX(-18deg) translateX(-3%); animation: dose-light 90s var(--ease-in-out) infinite alternate; }
html body main:not(.max-w-3xl) > section:first-child::after { content: none; }
@keyframes dose-light { to { transform: skewX(-18deg) translateX(9%); } }
@media (prefers-reduced-motion: reduce) { html body main:not(.max-w-3xl) > section:first-child::before { animation: none; } }
html body main:not(.max-w-3xl) > section:first-child :is(p, li, .text-on-surface-variant, .text-zinc-500, .text-zinc-600):not(.bg-white *, form *, .demo-card *, .shadow-lg *) { color: var(--color-blue-muted) !important; }
html body main:not(.max-w-3xl) > section:first-child :is(h1, h2, h3, .text-on-background, .font-bold, .font-semibold, strong):not(.bg-white *, form *, .demo-card *, .shadow-lg *) { color: var(--color-blue-ink) !important; }
html body main:not(.max-w-3xl) > section:first-child > div > a:not(.btn-primary), html body main:not(.max-w-3xl) > section:first-child a[style*="uppercase"] { color: var(--color-blue-muted) !important; }
html body main:not(.max-w-3xl) > section:first-child .feature-row > div:first-child { background: color-mix(in oklab, var(--glint) 16%, transparent) !important; }
html body main:not(.max-w-3xl) > section:first-child .feature-row .material-symbols-outlined { color: var(--color-blue-ink) !important; }
html body main:not(.max-w-3xl) > section:first-child .badge-text.rounded-full { background: color-mix(in oklab, var(--glint) 14%, transparent) !important; color: var(--color-blue-ink) !important; box-shadow: inset 0 1px 0 color-mix(in oklab, var(--glint) 30%, transparent) !important; }
html body main:not(.max-w-3xl) > section:first-child :is(.shadow-2xl, .v35-lift) { border-radius: var(--radius-card) !important; box-shadow: 0 0 0 1px var(--color-blue-deep), 0 30px 60px -30px var(--org-drop-2) !important; }
html body main:not(.max-w-3xl) > section:first-child :focus-visible { outline-color: var(--color-blue-focus) !important; }

/* ── plastic bands: the inner sections alternate pale tints over the paper ── */
html body main:not(.max-w-3xl) > section:nth-child(2n):not(:last-child) { --t: var(--p-fri); background: linear-gradient(color-mix(in oklab, var(--glint) 32%, transparent), transparent 14rem), color-mix(in oklab, var(--t) 62%, transparent) !important; box-shadow: inset 0 1.5px 0 var(--glint), inset 0 -24px 36px -28px color-mix(in oklab, var(--t) 45%, var(--color-ink)); padding-top: var(--section-gap-s) !important; }
html body main:not(.max-w-3xl) > section:nth-child(4n):not(:last-child) { --t: var(--p-sat); }

/* ── paper slips: cards and questions are grained white labels on the plastic ── */
html body main :is(.rounded-2xl.bg-white, .rounded-3xl.bg-white, .faq-item, .bg-white.border, .bg-white.shadow-lg, .bg-white.shadow-sm) { background: var(--grain), linear-gradient(var(--glint), var(--color-paper)) !important; border-color: transparent !important; border-radius: var(--radius-card) !important; box-shadow: var(--shadow-lift) !important; transform: none !important; }
html body main .rounded-3xl.bg-white { border-radius: calc(var(--radius-card) + 6px) !important; }

/* ── the ink band: the closing call to action ── */
html body main :is([style*="#0c1521"], [style*="#0C1521"], .bg-zinc-900, .bg-black:not(a):not(button)) { background: var(--color-night) !important; border-radius: calc(var(--radius-card) + 10px) !important; color: var(--color-night-ink); }

/* ── controls: moulded plastic ── */
html body main :is(a.bg-primary, button.bg-primary, a.bg-black, button.bg-black, button[type="submit"]:not(.bg-white)) { background: linear-gradient(var(--color-accent), var(--color-accent-2)) !important; color: var(--color-accent-ink) !important; border: 0 !important; border-radius: var(--radius-input) !important; box-shadow: inset 0 1px 0 color-mix(in oklab, var(--glint) 30%, transparent), 0 0 0 1px var(--color-accent-2), 0 3px 0 var(--color-blue-deep), 0 8px 16px -8px var(--org-drop-2) !important; transform: none !important; transition: transform var(--dur-micro) var(--ease-out), box-shadow var(--dur-micro) var(--ease-out), filter var(--dur-short) var(--ease-out) !important; }
html body main :is(a.bg-primary, button.bg-primary, a.bg-black, button.bg-black, button[type="submit"]:not(.bg-white)):hover { filter: brightness(1.08); }
html body main :is(a.bg-primary, button.bg-primary, a.bg-black, button.bg-black, button[type="submit"]:not(.bg-white)):active { transform: translateY(3px) !important; box-shadow: 0 0 0 1px var(--color-accent-2), 0 0 0 var(--color-blue-deep) !important; }
/* white plastic on the blue ground and on the ink band */
html body main:not(.max-w-3xl) > section:first-child :is(a.bg-primary, a.bg-black), html body main a.btn-primary.bg-white { background: linear-gradient(var(--glint), var(--color-paper)) !important; color: var(--color-accent-2) !important; border: 0 !important; border-radius: var(--radius-input) !important; box-shadow: inset 0 -2px 0 color-mix(in oklab, var(--color-accent-soft) 60%, transparent), 0 0 0 1px var(--color-blue-deep), 0 3px 0 var(--color-blue-deep), 0 10px 20px -10px var(--org-drop-2) !important; transform: none !important; }
html body main:not(.max-w-3xl) > section:first-child :is(a.bg-primary, a.bg-black):active, html body main a.btn-primary.bg-white:active { transform: translateY(3px) !important; box-shadow: 0 0 0 1px var(--color-blue-deep), 0 0 0 var(--color-blue-deep) !important; }
/* WhatsApp: clear plastic, the icon keeps WhatsApp green on paper */
html body main a[href*="wa.me"]:is([style*="#25D366"], [style*="#25d366"]) { background: linear-gradient(color-mix(in oklab, var(--glint) 70%, transparent), color-mix(in oklab, var(--color-paper-2) 70%, transparent)) !important; color: var(--color-ink) !important; border-radius: var(--radius-input) !important; box-shadow: inset 0 1px 0 var(--glint), 0 0 0 1px var(--color-rule), 0 3px 0 var(--color-rule) !important; transform: none !important; }
html body main a[href*="wa.me"]:is([style*="#25D366"], [style*="#25d366"]) svg { color: var(--color-ok); fill: currentColor; }
html body main a[href*="wa.me"]:is([style*="#25D366"], [style*="#25d366"]):active { transform: translateY(3px) !important; box-shadow: 0 0 0 1px var(--color-rule), 0 0 0 var(--color-rule) !important; }
html body main:not(.max-w-3xl) > section:first-child a[href*="wa.me"]:is([style*="#25D366"], [style*="#25d366"]),
html body main :is([style*="#0c1521"], .bg-zinc-900) :is(a[href*="wa.me"][style*="#25D366"], a.btn-secondary) { background: color-mix(in oklab, var(--glint) 10%, transparent) !important; color: var(--color-blue-ink) !important; border: 0 !important; border-radius: var(--radius-input) !important; box-shadow: inset 0 1px 0 color-mix(in oklab, var(--glint) 30%, transparent), 0 0 0 1px var(--color-blue-rule), 0 3px 0 var(--color-blue-deep) !important; }
html body main:not(.max-w-3xl) > section:first-child a[href*="wa.me"][style*="#25D366"] svg, html body main [style*="#0c1521"] a[href*="wa.me"] svg { color: var(--color-blue-ink); }
/* links as keys, choices as keys, fields at 10px */
html body main a.rounded-full.border.bg-white { background: linear-gradient(var(--glint), var(--color-paper)) !important; border-color: transparent !important; border-radius: var(--radius-input) !important; box-shadow: 0 0 0 1px var(--color-rule), 0 3px 0 var(--color-rule); transition: transform var(--dur-micro) var(--ease-out), box-shadow var(--dur-micro) var(--ease-out); }
html body main a.rounded-full.border.bg-white:hover { box-shadow: 0 0 0 1px color-mix(in oklab, var(--color-accent) 55%, var(--color-rule)), 0 3px 0 color-mix(in oklab, var(--color-accent) 40%, var(--color-rule)); }
html body main a.rounded-full.border.bg-white:active { transform: translateY(3px); box-shadow: 0 0 0 1px var(--color-rule), 0 0 0 var(--color-rule); }
html body main .demo-option { background: linear-gradient(var(--glint), var(--color-paper)) !important; border: 0 !important; border-radius: var(--radius-input) !important; box-shadow: 0 0 0 1px var(--color-rule), 0 3px 0 var(--color-rule); color: var(--color-ink) !important; transition: transform var(--dur-micro) var(--ease-out), box-shadow var(--dur-micro) var(--ease-out) !important; }
html body main .demo-option:hover { box-shadow: 0 0 0 1px color-mix(in oklab, var(--color-accent) 55%, var(--color-rule)), 0 3px 0 color-mix(in oklab, var(--color-accent) 40%, var(--color-rule)); }
html body main .demo-option:active { transform: translateY(3px); box-shadow: 0 0 0 1px var(--color-rule), 0 0 0 var(--color-rule); }
html body main .demo-option:is(.selected, .is-selected, [aria-pressed="true"]) { background: linear-gradient(var(--glint), var(--color-accent-soft)) !important; color: var(--color-accent-2) !important; box-shadow: 0 0 0 1px color-mix(in oklab, var(--color-accent) 45%, transparent), 0 3px 0 color-mix(in oklab, var(--color-accent) 45%, transparent); }
html body main :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), textarea, select) { border: 1px solid var(--color-muted) !important; border-radius: var(--radius-input) !important; background: var(--glint) !important; color: var(--color-ink) !important; }
html body main :is(input, textarea, select):focus-visible { outline: 2px solid var(--color-focus) !important; outline-offset: 1px; }

/* ── small parts: tags, ticks, icon tiles ── */
html body main .badge-text.rounded-full { background: var(--color-accent-soft) !important; color: var(--color-accent-2) !important; border: 0 !important; box-shadow: none !important; font-weight: 500 !important; }
html body main .badge-text.rounded-full::before { content: none !important; }
html body main :is(.feature-row > div:first-child, [style*="rgba(28,100,142,0.1"], [style*="rgba(28, 100, 142, 0.1"]) { background: var(--color-accent-soft) !important; }
html body main .text-secondary { color: var(--color-accent) !important; }
html body main:not(.max-w-3xl) > section:first-child .text-secondary:not(.bg-white *, form *, .demo-card *, .shadow-lg *) { color: var(--color-blue-ink) !important; }
html body main :is(.rounded-2xl.bg-white, .rounded-3xl.bg-white, .faq-item) .text-secondary { color: var(--color-accent) !important; }

/* ── legal pages: plain grained paper, Dose heads, hairlines ── */
html body main.max-w-3xl h1 { font-family: var(--font-display) !important; font-weight: 700 !important; letter-spacing: var(--tracking-display) !important; color: var(--color-ink) !important; }
html body main.max-w-3xl h2 { font-family: var(--font-display) !important; font-weight: 700 !important; letter-spacing: -0.01em !important; color: var(--color-ink) !important; border-color: var(--color-rule) !important; }
html body main.max-w-3xl a { color: var(--color-accent); }

/* ── fixes per template ── */
/* heads on the ink band (site-polish forced them dark) */
html body main :is([style*="#0c1521"], [style*="#0C1521"], .bg-zinc-900) :is(h1, h2, h3) { color: var(--color-night-ink) !important; }
/* quote page: the step card is a paper slip, not a spinning gradient border */
html body main .demo-card { background: var(--grain), linear-gradient(var(--glint), var(--color-paper)) !important; border: 0 !important; border-radius: calc(var(--radius-card) + 6px) !important; animation: none !important; box-shadow: 0 0 0 1px var(--color-blue-deep), var(--shadow-lift) !important; color: var(--color-ink); }
html body main .demo-card :is(h2, h3) { color: var(--color-ink) !important; }
html body main .demo-card #demo-progress { background: var(--color-accent) !important; }
/* the free-of-charge badge: clear plastic on the blue */
html body main:not(.max-w-3xl) > section:first-child [style*="rgba(16,185,129"] { background: color-mix(in oklab, var(--glint) 12%, transparent) !important; border-color: var(--color-blue-rule) !important; }
html body main:not(.max-w-3xl) > section:first-child [style*="rgba(16,185,129"] * { color: var(--color-blue-ink) !important; }
/* a section that carries only bottom padding gets air above it once the band before it has an edge */
html body main:not(.max-w-3xl) > section:not(:first-child).pb-section-gap:not([class*="pt-"]):not([class*="py-"]) { padding-top: var(--space-2xl) !important; }