/** Shopify CDN: Minification failed Line 6526:1439 Expected "}" to go with "{" **/ /* ================================================= CONCEPT ZERO — GLOBAL DESIGN SYSTEM LAYER Single source of truth for type, color, pills, buttons and spacing. GUARDRAILS (do not violate): - No global table / thead / th / td rules - No bare `a` element rules - Never target .tb-* (Bak tallene page is protected) ================================================= */ :root { /* Brand color */ --cz-lime: #BDD14B; --cz-peach: #FFA683; --cz-off-white: #F2F2F2; --cz-sky: #45A2FF; --cz-red: #F23C3B; --cz-ink: #000000; /* Type families */ --cz-sans: "ABCRepro", system-ui, sans-serif; --cz-mono: "ABCReproMono", monospace; /* Type scale */ --cz-fs-display: clamp(2.8rem, 5vw, 4.8rem); --cz-fs-h2: clamp(1.75rem, 3.5vw, 2.8rem); --cz-fs-lead: 24px; --cz-fs-body-lg: 20px; --cz-fs-body: 16px; --cz-fs-compact: 14px; --cz-fs-small: 13px; --cz-fs-label: 10px; --cz-lh-tight: 1.02; --cz-lh-heading: 1.05; --cz-lh-body: 1.72; --cz-ls-tight: -0.03em; --cz-ls-heading: -0.02em; --cz-ls-label: 0.14em; --cz-ls-btn: 0.06em; /* Pills — ONE definition for the whole system */ --cz-pill-border-width: 2px; --cz-pill-radius: 100px; --cz-pill-padding: 6px 16px; --cz-pill-fs: 10px; --cz-pill-ls: 0.1em; /* Spacing scale */ --cz-space-xs: 8px; --cz-space-sm: 16px; --cz-space-md: 24px; --cz-space-lg: 40px; --cz-space-xl: 64px; --cz-space-2xl: 100px; /* Containers */ --cz-measure-body: 62ch; --cz-measure-heading: 22ch; /* Motion */ --cz-ease: cubic-bezier(0.22, 1, 0.36, 1); --cz-dur: 200ms; } /* ================================================= Base Typography ================================================= */ body, p, li, input, textarea, select, button, .nav, .header__menu-item, .drawer__menu-item, .link, .rte, .rte p, .rte li { font-family: var(--cz-sans); font-size: var(--cz-fs-body); line-height: var(--cz-lh-body); font-weight: 400; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } /* ================================================= Default Headings ================================================= */ h1, h2, h3, h4, h5, h6, .section__heading, .product__title, .card__heading, .collection__title { font-family: var(--cz-sans); font-weight: 400; letter-spacing: var(--cz-ls-heading); line-height: var(--cz-lh-heading); margin-bottom: 0.5em; text-transform: none; } /* ================================================= Rich Text / Manifesto Headings ================================================= */ .rich-text__heading { font-family: var(--cz-sans); font-weight: 400; letter-spacing: var(--cz-ls-tight); text-transform: none; line-height: 1.06; max-width: 16ch; margin: 0 auto 0.75em auto; text-align: center; } .rich-text__text, .rte, .rte p, .rte li { font-size: var(--cz-fs-body); line-height: var(--cz-lh-body); color: var(--cz-ink); } .rich-text__text { max-width: 26rem; margin-left: auto; margin-right: auto; } /* ================================================= Hero / Banner / Slideshow — headings ================================================= */ .hero__title, .hero__title.heading-x-large, .hero__title.heading-large, .hero__title.heading-medium, .banner__heading, .slideshow__heading, .slideshow__heading.heading-x-large, .slideshow__heading.heading-large { font-family: var(--cz-sans) !important; font-weight: 400 !important; letter-spacing: var(--cz-ls-tight) !important; text-transform: none !important; line-height: var(--cz-lh-tight) !important; max-width: var(--cz-measure-heading); overflow-wrap: normal !important; word-break: normal !important; hyphens: none !important; display: block; } /* Batch 8A — CZ display size is a FALLBACK only. :where() = zero specificity, so any Broadcast heading-* class wins and Theme Editor size control stays functional. */ :where(.hero__title, .banner__heading, .slideshow__heading, .rich-text__heading):not([class*="heading-"]) { font-size: var(--cz-fs-display); } /* ================================================= Hero / Banner / Slideshow — undertekst ================================================= */ .hero__text, .hero__text p, .banner__text, .banner__text p, .slideshow__text, .slideshow__text p, [data-section-type="slideshow"] .rte p, [data-section-type="slideshow"] p { font-family: var(--cz-sans) !important; font-size: var(--cz-fs-body-lg) !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: -0.01em !important; line-height: 1.5 !important; color: var(--cz-ink) !important; margin-top: 1.25rem; max-width: 38ch; } /* ================================================= Small Mono Labels / Eyebrows / Metadata ================================================= */ .mono-label, .section-label, .eyebrow, .overline, .badge, .subheading, .section__subheading, .caption, .kicker, .block-label, .hero__subheading { font-family: var(--cz-mono) !important; font-size: var(--cz-fs-label) !important; font-weight: 500 !important; font-style: normal !important; letter-spacing: var(--cz-ls-label) !important; text-transform: uppercase !important; line-height: 1.2 !important; margin-bottom: 1rem !important; display: block !important; color: var(--cz-ink) !important; } /* ================================================= Buttons — capsule shape comes from the theme's own btn_border_style setting; do not override radius. ================================================= */ .btn, .button, [type="submit"], .shopify-payment-button__button, button.shopify-payment-button__button--unbranded { font-family: var(--cz-sans); font-size: 14px; font-weight: 500; letter-spacing: var(--cz-ls-btn); text-transform: uppercase; transition: background-color var(--cz-dur) var(--cz-ease), color var(--cz-dur) var(--cz-ease); } /* ================================================= Navigation ================================================= */ .header__menu-item, .drawer__menu-item, .list-menu__item, .menu-drawer__menu-item { font-family: var(--cz-sans); font-size: 12px; font-weight: 500; letter-spacing: 0.04em; text-transform: uppercase; } /* ================================================= Product Page ================================================= */ .product__title, .product__info-container h1 { font-family: var(--cz-sans); font-weight: 400; letter-spacing: var(--cz-ls-heading); line-height: var(--cz-lh-heading); } .price, .price-item, .product__price, .price--large, .price dd, .price .price-item { font-family: var(--cz-sans); font-weight: 500; letter-spacing: 0; line-height: 1.2; } .variant-picker__legend, .product-form__input legend, .product-form__quantity-label, .quantity__label { font-family: var(--cz-mono); font-size: var(--cz-fs-label); font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(0, 0, 0, 0.6); } .product__description, .product__description p, .product__description li, .accordion__content, .accordion__content p, .accordion__content li { font-family: var(--cz-sans); font-size: var(--cz-fs-compact); line-height: var(--cz-lh-body); font-weight: 400; } /* ============================================ Batch 156 — Mobil-cleanup (typografi-audit). Verifisert emitted-struktur: FAQ- og produkt-accordions bruker alle .accordion__body.rte > .accordion__content (direkte, evt. via /.faq-list-wrappere) med selve teksten i

/

  • . En eldre, generell mobilregel "[id^=shopify-section] .rte p" (16px, @media max-width:749px) har hoyere spesifisitet enn Batch 155 sin .accordion__content p/li-regel og vinner pa mobil, sa accordion-tekst blir 16px i stedet for kompakt 14px. Footer-quicklinks er urort (de er a/li uten .rte-wrapper, ikke .accordion__content p). Denne regelen er bevisst mer spesifikk (.accordion__body.rte .accordion__content ...) enn den eldre regelen, sa den vinner uten !important og uten a røre den eldre regelen. */ @media only screen and (max-width: 749px) { .accordion__body.rte .accordion__content p, .accordion__body.rte .accordion__content li { font-size: var(--cz-fs-compact); } } /* ================================================= Product Cards / Collection Cards ================================================= */ .card__heading, .card-information__text, .collection-card__title { font-family: var(--cz-sans); font-weight: 400; letter-spacing: -0.01em; line-height: 1.15; } .card-information .price, .card-information__wrapper .price { font-family: var(--cz-sans); font-weight: 500; } /* ================================================= Loox / Reviews ================================================= */ .loox-rating, .loox-rating span, .loox-rating-content, .loox-rating-label { font-family: var(--cz-mono) !important; font-size: var(--cz-fs-label) !important; font-weight: 500 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; } .loox-rating .loox-icon { color: var(--cz-ink); } .loox-rating { background: transparent; border: none; padding: 0; } .loox-rating span { margin-left: 6px; } /* ================================================= Announcement / Utility Text ================================================= */ .announcement-bar, .announcement-bar__message, .utility-bar, .top-bar { font-family: var(--cz-mono); font-size: var(--cz-fs-label); font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; } /* ================================================= Footer ================================================= */ .site-footer, .site-footer p, .site-footer li, .site-footer a, .footer__content, .footer-block__details-content { font-family: var(--cz-sans); font-size: var(--cz-fs-small); line-height: 1.65; font-weight: 400; } /* Footer-overskriftene rendres som , ikke som h2/h3. Klasse verifisert i sections/footer.liquid:128, 154, 188, 211. Newsletter-blokken bruker

    , samme klasse. */ /* Kolonneoverskriftene er stemme, ikke etikett — derfor sans i setningsform. Mono er forbeholdt lenkene under, så hierarkiet bæres av grad og familie, ikke av versaler. Batch 78. */ .footer__block__title, .site-footer h2, .site-footer h3 { font-family: var(--cz-sans) !important; font-size: 16px !important; font-weight: 500 !important; letter-spacing: normal !important; text-transform: none !important; line-height: 1.3 !important; margin-bottom: 20px !important; } @media only screen and (max-width: 749px) { .footer__block__title, .site-footer h2, .site-footer h3 { font-size: 15px !important; margin-bottom: 16px !important; } } /* ================================================= Forms / Inputs ================================================= */ input, textarea, select { font-family: var(--cz-sans); font-size: var(--cz-fs-body); font-weight: 400; line-height: 1.5; } label, .form__label, .field__label { font-family: var(--cz-mono); font-size: var(--cz-fs-label); font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; } /* ================================================= Responsive heading max-width ================================================= */ @media screen and (min-width: 750px) { .hero__title, .banner__heading, .slideshow__heading, .section__heading, .product__title, .rich-text__heading { max-width: var(--cz-measure-heading); } } /* ================================================= Disable automatic CAPS in headings — global ================================================= */ h1, h2, h3, h4, h5, h6, .heading, [class*="heading"], [class*="title"], .rich-text__heading, .section__heading, .hero__title, .banner__heading, .slideshow__heading, .product__title, .card__heading { text-transform: none !important; } /* ================================================= Section labels ================================================= */ .section-label, .section__subheading { font-family: var(--cz-mono) !important; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.4; } /* ================================================= PILL — one definition, applied everywhere ================================================= */ .grid__description p, .grid__heading-holder .grid__description p, .column__description, .column__subheading, .section-blocks .subheading, .multicolumn-list__item .subheading, .grid__item .subheading, .hero__description.body-x-small .cz-pill__tag { display: inline-flex !important; align-items: center !important; font-family: var(--cz-mono) !important; font-size: var(--cz-pill-fs) !important; font-weight: 500 !important; letter-spacing: var(--cz-pill-ls) !important; text-transform: uppercase !important; border: var(--cz-pill-border-width) solid currentColor !important; border-radius: var(--cz-pill-radius) !important; padding: var(--cz-pill-padding) !important; line-height: 1 !important; background: transparent !important; color: inherit !important; } .grid__description, .grid__description p, .grid__heading-holder .grid__description, .column__description, .column__subheading, .section-blocks .subheading, .multicolumn-list__item .subheading, .grid__item .subheading { margin: 0 0 20px 0 !important; } /* Hero pill row — container turns the

    into a flex row */ .hero__description.body-x-small { display: flex !important; flex-wrap: wrap; gap: var(--cz-space-xs); align-items: center; font-family: inherit !important; font-size: inherit !important; text-transform: none !important; letter-spacing: normal !important; opacity: 1 !important; margin-top: 20px !important; max-width: none !important; } .hero__description.body-x-small .cz-pill__tag { font-size: 11px !important; padding: 7px 16px !important; opacity: 0.85; white-space: nowrap; } /* ================================================= Multicolumn card headings ================================================= */.multicolumn-card__info h1, .multicolumn-card__info h2, .multicolumn-card__info h3, .multicolumn-card__info h4, .multicolumn-card__info h5, .multicolumn-card__info h6 { font-size: 1.1rem !important; line-height: 1.15 !important; } /* ================================================= Step number — numbered circle in multicolumn text blocks. Renders only when the optional step_number setting is filled in. ================================================= */ .cz-step-number { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: var(--cz-space-sm); border: var(--cz-pill-border-width) solid currentColor; border-radius: var(--cz-pill-radius); font-family: var(--cz-mono); font-size: 16px; font-weight: 500; line-height: 1; color: inherit; } /* ================================================= Batch 7 — hero subhead measure (scoped, additive) ================================================= */ [data-section-type="slideshow"] .hero__description { max-width: 34ch; } /* ================================================= Batch 9 — Brand premise body measure (scoped) ================================================= */ [id$="__cz_brand_premise"] .hero__rte { max-width: var(--cz-measure-body); } /* ================================================= Batch 21 — Method: nummerert liste + lime. Klasser verifisert i snippets/multicolumn.liquid: .grid__heading (141), .grid__description (154), .grid-item (431), .column__content, .cz-step-number, .column__text (rte), .column__heading (455). Manifestet er siste blokk; stegene er alle andre. ================================================= */ /* Bakgrunnen ligger IKKE her. Seksjonen peker på fargeskjemaet lime (scheme-6) i Theme Editor, slik at fargen kan byttes uten kode. Batch 67. Ikke gjeninnfør en background-regel her. */ /* Pillen rendres etter H2 i markupen — løft den til eyebrow. */ [id^="shopify-section"][id$="__cz_method_preview"] .grid__heading-holder { display: flex; flex-direction: column; } [id^="shopify-section"][id$="__cz_method_preview"] .grid__description { order: -1; } [id^="shopify-section"][id$="__cz_method_preview"] .grid__heading { max-width: 24ch; } /* Stegene: 100% brede blokker som leser som nummererte linjer. Sirkelbehandlingen slås av her — tallet blir en mono-etikett. */ [id^="shopify-section"][id$="__cz_method_preview"] .grid-item .column__content { display: grid; grid-template-columns: 40px 1fr; gap: 16px; align-items: baseline; } [id^="shopify-section"][id$="__cz_method_preview"] .grid-item .cz-step-number { display: block; width: auto; height: auto; border: 0; border-radius: 0; margin: 0; text-align: left; font-size: 13px; letter-spacing: 0.08em; color: var(--cz-ink); } [id^="shopify-section"][id$="__cz_method_preview"] .grid-item .column__text p { margin: 0; font-size: 24px; line-height: 1.3; color: var(--cz-ink); max-width: 44ch; } /* Vertikal rytme. Broadcast gir hver .grid-item var(--gap) = 32px topp og bunn (columns.css:21), altså 64px mellom linjene. */ @media only screen and (min-width: 750px) { [id^="shopify-section"][id$="__cz_method_preview"] .grid__heading { margin-bottom: 12px; } [id^="shopify-section"][id$="__cz_method_preview"] .grid__heading-holder { margin-bottom: 0; } [id^="shopify-section"][id$="__cz_method_preview"] .grid-item { padding-top: 10px; padding-bottom: 10px; } /* Mer luft under H2 enn mellom stegene, så lista leser som én blokk under overskriften i stedet for omvendt. */ [id^="shopify-section"][id$="__cz_method_preview"] .grid-item:nth-child(2) { padding-top: 40px; } } /* ================================================= Batch 15 — Shared left edge for the Impact run. Sections moved onto .wrapper; narrative body copy keeps a readable measure. Headings already constrained by --cz-measure-heading. ================================================= */ [id$="__cz_impact_narrative"] .hero__rte, [id$="__cz_impact_sources"] .hero__rte { max-width: var(--cz-measure-body); } /* ================================================= Batch 15b — Impact measure fix. .hero__content__wrapper is a flex row (theme.css:8435), so .hero__content shrink-to-fits and starves the max-width on .hero__rte. Let it fill the wrapper. ================================================= */ [id$="__cz_impact_narrative"] .hero__content, [id$="__cz_impact_sources"] .hero__content { width: 100%; } /* ================================================= Batch 22 — Klaviyo-embed (form UaqwPg) på peach-flate. Klaviyos markup bruker genererte klasser (go310894487, cajnrz) og en høyspesifisitets-reset (kl-private-reset-css-*) som endres per build. Derfor KUN element-selektorer her — de overlever at Klaviyo bygger skjemaet på nytt. Bredde og padding settes i Klaviyo, ikke her. ================================================= */ [id$="__cz_newsletter_klaviyo"] input, [id$="__cz_newsletter_klaviyo"] button, [id$="__cz_newsletter_klaviyo"] h1, [id$="__cz_newsletter_klaviyo"] h2, [id$="__cz_newsletter_klaviyo"] h3, [id$="__cz_newsletter_klaviyo"] p, [id$="__cz_newsletter_klaviyo"] span { font-family: var(--cz-sans) !important; } /* Ink er CZ-typefargen, også på peach. */ [id$="__cz_newsletter_klaviyo"] h1, [id$="__cz_newsletter_klaviyo"] h2, [id$="__cz_newsletter_klaviyo"] h3, [id$="__cz_newsletter_klaviyo"] p, [id$="__cz_newsletter_klaviyo"] span { color: var(--cz-ink) !important; } /* Feltene som kapsler med inkkant, ikke hvite bokser. */ #cz-klaviyo input[type="text"], #cz-klaviyo input[type="email"] { border-radius: 999px !important; border: 1.5px solid rgba(0, 0, 0, 0.5) !important; background: transparent !important; color: var(--cz-ink) !important; font-size: 16px !important; padding: 14px 22px !important; } [id$="__cz_newsletter_klaviyo"] input::placeholder { color: rgba(0, 0, 0, 0.55) !important; opacity: 1 !important; } /* CZ-knapper er kapsler; invertert par er svart fyll, hvit type. */ #cz-klaviyo button { background: var(--cz-ink) !important; color: #fff !important; border: 0 !important; border-radius: 999px !important; font-family: var(--cz-mono) !important; font-size: 13px !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; } /* Sentrerte rich-text-seksjoner: CZ-lagets måltak på .hero__title og .hero__rte mangler margin auto, så boksen legger seg til venstre mens teksten sentreres inni. Verifisert i section-rich-text.liquid:70 og :100. */ [id$="__cz_next_category_text"] .hero__title, [id$="__cz_next_category_text"] .hero__rte { margin-left: auto !important; margin-right: auto !important; } /* ================================================= Batch 25 — Felles venstrekant. Heroens tekst lå på ~57px fordi seksjonen er wrapper--full (bildet skal gå full-bleed). Gir tekstcontaineren samme mål som .wrapper (theme.css:3591, --content-max), så heroen deler venstrekant med Method, Impact og Trust. Bildet er .hero__image og berøres ikke. Klasse verifisert i section-slideshow.liquid:195. ================================================= */ @media only screen and (min-width: 750px) { [data-section-type="slideshow"] .hero__content__wrapper { max-width: var(--content-max); margin-left: auto; margin-right: auto; } } /* ================================================= Batch 26 — Impact: tallene som fakta. Systemet gir mono til «fact / label / system», og tallene sto i sans på samme størrelse som seksjonsoverskriften. Klasser verifisert i snippets/multicolumn.liquid:455 (.column__heading) og :463 (.column__text). ================================================= */ /* ================================================= Batch 27 — Announcement som fact strip. Systemet gir mono til «fact / label / system». Klasse verifisert i sections/section-announcement.liquid. ================================================= */ .announcement__text, .announcement__text p, .announcement__content, .announcement__content strong { font-family: var(--cz-mono) !important; font-weight: 400 !important; font-size: 12px !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; } /* ================================================= Batch 34 — Butikketiketten er en mono-etikett, ikke en pille. Piller er kategorimerker; «I 2380 butikker» er en faktaopplysning og hører i mono, som systemet gir til fakta og etiketter. ================================================= */ /* ================================================= Batch 47 — Butikkrekken, siste runde. To feil rettet. 1) Selektoren traff ikke. [data-slide="cz_kiwi"] er avhengig av at blokk-ID-ene i det installerte temaet er de samme som i templaten. Er en logoblokk noen gang lagt til eller flyttet i Theme Editor, får den en generert ID og regelen bommer stille. :nth-child er immun mot det — rekkefølgen er block_order: kiwi, rema, meny, coop, bunnpris, oda. 2) Rekken var for bred. --content-max er 1100px under 1400px viewport (theme.css:3518), og forrige runde var 1158px pluss luft. Derfor falt oda ned på egen linje. Denne er 715px logo + 5 × 56px luft = 995px, som får plass også på 1100px. Klasser verifisert i sections/section-press-logos.liquid. ================================================= */ [id^="shopify-section"][id$="__section-press-logos"] .logos__slider { flex-wrap: wrap !important; justify-content: flex-start !important; align-items: center !important; gap: 34px 56px !important; } [id^="shopify-section"][id$="__section-press-logos"] .logos__slider__outer { max-width: none !important; overflow: visible !important; } [id^="shopify-section"][id$="__section-press-logos"] .logos__logo { width: max-content !important; padding: 0 !important; opacity: 1 !important; } /* MENY er en bue i en heldekkende badge, ikke et ordmerke på grunnlinje. Sentrert på boksen havner buens tyngdepunkt under de fem andre; noen piksler heving retter det optisk. */ [id^="shopify-section"][id$="__section-press-logos"] .logos__slider .logos__slide:nth-child(3) .logos__img { transform: translateY(-3px); } /* Rekken deler venstrekant med Method, Impact og butikketiketten. .logos__wrapper er , verifisert i section-press-logos.liquid:133. */ [id^="shopify-section"][id$="__section-press-logos"] .logos__wrapper { max-width: var(--content-max) !important; margin-left: auto !important; margin-right: auto !important; padding-left: var(--outer) !important; padding-right: var(--outer) !important; } /* ================================================= Batch 50 — Peach-overskriften låst til to linjer. Ønsket komposisjon: De fleste hverdagsprodukter vi bruker ble designet på 70-tallet Feltet er `text`, ikke `richtext`, så
    finnes ikke — bruddet må komme av bredden. Seksjonen står på wrapper--narrow, som er for smal og gir tre linjer med «tallet» alene. max-width settes i em på overskriften selv, ikke i px, slik at den følger typestørrelsen om heading-ladderen endres senere. 15em rommer linje 1 (37 tegn) og stopper før «ble», som dermed starter linje 2. Klasser verifisert i sections/section-rich-text.liquid: 44 (.hero__content__wrapper bærer section.settings.width), 70 (.hero__title), 100 (.hero__rte). ================================================= */ @media only screen and (min-width: 750px) { [data-section-id$="cz_brand_premise"] .hero__content__wrapper { max-width: 900px !important; } [data-section-id$="cz_brand_premise"] .hero__title { max-width: 15em !important; text-wrap: normal !important; } /* Brødteksten beholder lesbar linjelengde selv om containeren er utvidet for overskriftens skyld. */ [data-section-id$="cz_brand_premise"] .hero__rte { max-width: 62ch !important; } } /* ================================================= Batch 52 — Overbevisningsseksjonen, displaybehandling. Valgt i Claude Design som variant 1D/1B: setningen som blokk, ikke som midtstilt motto. Venstrestilt, fire linjer, negativ kniping — den leser som ett felt. Sluttlinja «Det er vår jobb, ikke din.» står nede til høyre i Repro, brutt på kommaet, som setningens konsekvens framfor en ny påstand. Sky er valgt for å skille manifestet fra Method over og Impact under. Systemet setter sky til sparsom bruk, så dette er en utprøving som avgjøres i den avsluttende fargegjennomgangen — ikke en låst beslutning. heading_font_size er schema-bundet (select), så displaystørrelsen settes her i stedet. Klasser verifisert i section-rich-text.liquid: 44, 70, 100. ================================================= */ /* Bakgrunnen ligger IKKE her. Seksjonen peker på fargeskjemaet sky (scheme-9) i Theme Editor. Batch 67. */ [data-section-id$="cz_belief"] .hero__title { max-width: 17ch !important; line-height: 0.98 !important; letter-spacing: -0.035em !important; } [data-section-id$="cz_belief"] .hero__rte { align-self: flex-end !important; margin-left: auto !important; text-align: right !important; } [data-section-id$="cz_belief"] .hero__rte p { margin: 40px 0 0 !important; font-size: 24px !important; line-height: 1.35 !important; letter-spacing: -0.01em !important; color: var(--cz-ink) !important; } @media only screen and (min-width: 750px) { [data-section-id$="cz_belief"] .hero__title { font-size: clamp(42px, 5.2vw, 76px) !important; } } /* ================================================= Batch 54 — «Dette kan vi dokumentere» midtstilles. Samme feil som cz_next_category_text hadde: CZ-lagets måltak på .hero__title mangler margin auto, så boksen legger seg til venstre selv om teksten inni er sentrert. Overskriften havnet dermed venstre av senter mens undertekst og merker sto midtstilt. ================================================= */ [id$="__cz_trust_text"] .hero__title, [id$="__cz_trust_text"] .hero__rte { margin-left: auto !important; margin-right: auto !important; } /* ================================================= Batch 55 — Impact-tallene som én komposisjon. Egen custom-code-seksjon fordi tallene teller opp ved scroll; det krever JS som ingen Broadcast-seksjon har. Erstatter section-multicolumn (tallene) og knappen i kilde-seksjonen. To hårfine linjer binder tall, metodenote og CTA til én informasjonsblokk. CTA-en er nedtonet tekstlenke i samme rad som metoden, ikke kapselknapp — den hører til dataene, ikke til seksjonen. Alt mot token-laget, ingen hardkodede verdier. Markupen er egen, så klassene her er verifiserbare per definisjon — de skrives i seksjonens code-felt. ================================================= */ #cz-impact-numbers { border-top: 1.5px solid var(--cz-ink); } #cz-impact-numbers .cz-num-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--cz-space-md); padding: var(--cz-space-md) 0 calc(var(--cz-space-md) + 2px); } #cz-impact-numbers .cz-num { display: flex; flex-direction: column; gap: 14px; } #cz-impact-numbers .cz-num__val { font-family: var(--cz-mono); font-size: clamp(34px, 3.8vw, 54px); font-weight: 500; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: var(--cz-ink); } #cz-impact-numbers .cz-num__label { font-family: var(--cz-mono); font-size: var(--cz-fs-label); font-weight: 500; letter-spacing: var(--cz-ls-label); text-transform: uppercase; line-height: 1.4; color: var(--cz-ink); } #cz-impact-numbers .cz-num-foot { border-top: 1.5px solid var(--cz-ink); padding-top: 18px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--cz-space-xs); } #cz-impact-numbers .cz-num-foot__method, #cz-impact-numbers .cz-num-foot__cta { font-family: var(--cz-mono); font-size: var(--cz-fs-label); font-weight: 500; letter-spacing: var(--cz-ls-label); text-transform: uppercase; line-height: 1.4; } #cz-impact-numbers .cz-num-foot__method { color: var(--cz-ink); } #cz-impact-numbers .cz-num-foot__cta { color: var(--cz-ink); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1.5px; transition: color var(--cz-dur) var(--cz-ease); } #cz-impact-numbers .cz-num-foot__cta:hover { color: #1A1A1A; } @media only screen and (max-width: 749px) { #cz-impact-numbers .cz-num-row { grid-template-columns: 1fr; gap: var(--cz-space-sm); } } /* ================================================= Batch 56 — Method: ledelinje foran stegene. «Samme spørsmål, hver gang.» er flyttet ut av pillen — en pille er en merkelapp, ikke en frase — og ligger nå som første blokk i seksjonen. Den har ingen step_number, så nummerkolonnen droppes og den settes i brødtekst­grad framfor stegenes 24px. Pillen sier «VÅR METODE». ================================================= */ [id^="shopify-section"][id$="__cz_method_preview"] .grid-item:first-child .column__content { grid-template-columns: 1fr !important; gap: 0 !important; } [id^="shopify-section"][id$="__cz_method_preview"] .grid-item:first-child .column__text p { font-size: var(--cz-fs-body-lg) !important; line-height: 1.5 !important; max-width: 40ch !important; } /* ================================================= Batch 57 — FINN DIN BUTIKK som nedtonet tekstlenke under butikkrekken. Retail-veien er sannsynligvis den største, men den skal ikke rope høyere enn kjøpsknappene — derfor btn--text i mono-etikettgrad, understreket, på samme venstrekant som rekken. ================================================= */ [id$="__cz_retail_link"] .btn { padding-left: 0 !important; padding-right: 0 !important; font-family: var(--cz-mono) !important; font-size: var(--cz-fs-label) !important; font-weight: 500 !important; letter-spacing: var(--cz-ls-label) !important; text-transform: uppercase !important; text-decoration: underline !important; text-underline-offset: 4px !important; text-decoration-thickness: 1.5px !important; color: var(--cz-ink) !important; } /* ================================================= Batch 60 — Ink er all type. Designsystemet gir --cz-ink én rolle: «all type, all icon strokes, all pill outlines». Gråtonene er definert som diagramfyll og lever bare inne i datailllustrasjoner. Etter denne batchen finnes ingen grå type på forsiden. Fire steder er endret: brødteksten (var #4a4a47), hero-underteksten (var dempet med opacity 0.75, som over foto ga samme resultat), Method-numeralene 01–05 (var rgba(0,0,0,0.62)) og metodenoten under Impact-tallene (var #3d3d3d). Hierarkiet i alle fire bæres nå av grad og skriftfamilie framfor av farge — mono i etikettgrad mot sans i 24px leser som underordnet uten at fargen må hjelpe. Ingen andre endringer i denne batchen, slik at hele siden kan vurderes på nytt mot dette ene grepet. ================================================= */ /* ================================================= Batch 61 — Method: rytme, og logorekken strammet. Ledelinja «Samme spørsmål, hver gang.» sto like langt fra overskriften som fra stegene og hørte dermed til ingen av dem. Den bindes nå til overskriften og får et klart brudd ned til lista. Stegene lå ~95px fra hverandre fordi .multicolumn .grid-item arver padding: var(--gap) (columns.css:21) i tillegg til CZ-lagets egne 10px. Fem linjer med den avstanden leser som fem påstander, ikke som én liste. Paddingen nulles og rytmen settes eksplisitt. Logorekken er samtidig krympet til ~833px, nærmere etikettens mål, så etikett, rekke og lenke leser som ett felt framfor tre løse elementer. BUNNPRIS er tonet ned fra 183 til 150, EXTRA og oda er løftet. ================================================= */ @media only screen and (min-width: 750px) { [id^="shopify-section"][id$="__cz_method_preview"] .grid-item { padding-top: 0 !important; padding-bottom: 0 !important; } /* Ledelinja hører til overskriften. */ [id^="shopify-section"][id$="__cz_method_preview"] .grid-item:first-child { padding-top: 4px !important; } /* Bruddet ned til lista. */ [id^="shopify-section"][id$="__cz_method_preview"] .grid-item:nth-child(2) { padding-top: 72px !important; } /* Rytmen mellom stegene. 34px var 1,4 × tekstgraden, og med ett kort linjeskift per steg leste de fortsatt som fem separate påstander. 18px binder dem til én liste. */ [id^="shopify-section"][id$="__cz_method_preview"] .grid-item:nth-child(n + 3) { padding-top: 18px !important; } } /* ================================================= Batch 62 — Mono-etikettene er ink. Den globale etikettregelen (.badge, .subheading, .section__subheading, .caption, .kicker, .block-label, .hero__subheading) dempet alle etiketter til rgba(0,0,0,0.55). Batch 60 tok brødteksten, ikke denne — derfor sto «TØYVASK-ARK, SÅ LANGT» fortsatt grå. To seksjonsspesifikke lapper for samme årsak er fjernet (cz_next_category_text og cz_retail_text). Etikettene skiller seg nå fra brødteksten på grad, familie og versaler, ikke på farge. ================================================= */ /* ================================================= Batch 63 — De to gjenværende luftproblemene. 1) Plastavsnittet og «TØYVASK-ARK, SÅ LANGT» hadde 40 + 88 = 128px mellom seg, og leste som to seksjoner. De er ett beat: narrativet er premisset, ledeteksten er svaret. Nå 72px, satt fra én side. 2) I sky-seksjonen sto sluttlinja 48px under overskriften men 88px over seksjonsslutten — nærmere kanten enn setningen den hører til. Avstandene er byttet: 88px opp til overskriften gir setningen luft, 104px bunnpadding holder den innenfor sitt eget felt. ================================================= */ /* ================================================= VÅR METODE — /pages/metode Malen er templates/page.metode.json: fem section-custom-code og én section-rich-text (CTA-en, som beholder temaets knappebehandling og disabled- flagget på dusjsåpe-knappen). Alt som bærer layout ligger i custom-code fordi Broadcasts blokk-schema gir én innstilling per blokk. Rekkefølgebaserte selektorer (nth-of-type, first-child) ble prøvd og feilet tre ganger — de brekker så snart en blokk flyttes. Her eier markupen hierarkiet. custom-code laster ingen egen stilfil, så ingenting her trenger !important. Alle verdier er --cz-*-tokens. Hver seksjon har sin egen indre wrapper med id fordi section-custom-code legger bredde og fargeskjema på samme element. ================================================= */ #cz-m-hero, #cz-m-steps, #cz-m-zero, #cz-m-register, #cz-m-close { max-width: var(--content-max); margin: 0 auto; padding: 0 var(--gutter); font-family: var(--cz-sans); color: var(--cz-ink); } /* Overskrifter. Samme trinn som resten av temaet. */ #cz-m-hero h1 { margin: var(--cz-space-lg) 0 0; font-size: var(--cz-fs-display); line-height: var(--cz-lh-tight); letter-spacing: var(--cz-ls-tight); font-weight: 400; max-width: var(--cz-measure-heading); text-wrap: pretty; } #cz-m-steps h2, #cz-m-zero h2, #cz-m-register h2 { margin: 0; font-size: var(--cz-fs-h2); line-height: var(--cz-lh-heading); letter-spacing: var(--cz-ls-heading); font-weight: 400; max-width: var(--cz-measure-heading); text-wrap: pretty; } /* Brødtekst er 20px på denne siden. --cz-fs-body er 14px, satt for tettere seksjoner; her er avsnittene lange. */ #cz-m-hero p, #cz-m-steps p, #cz-m-zero p, #cz-m-register p, #cz-m-close p { margin: 0; font-size: var(--cz-fs-body-lg); line-height: 1.6; max-width: var(--cz-measure-body); } #cz-m-hero .cz-m-lede { margin-top: var(--cz-space-md); max-width: 46ch; text-wrap: pretty; } /* Piller. Eyebrow og Zero-ordene er samme primitiv, og bruker pille-tokenene — ikke designsystemets 1080px-skala, som er satt for sosiale flater. */ #cz-m-hero .cz-m-eyebrow, #cz-m-hero .cz-m-pillrow span { display: inline-flex; align-items: center; font-family: var(--cz-mono); font-size: var(--cz-pill-fs); font-weight: 500; letter-spacing: var(--cz-pill-ls); text-transform: uppercase; line-height: 1; color: var(--cz-ink); background: transparent; border: var(--cz-pill-border-width) solid var(--cz-ink); border-radius: var(--cz-pill-radius); padding: 9px 15px; } #cz-m-hero .cz-m-pillrow { display: flex; flex-wrap: wrap; gap: 12px; margin-top: var(--cz-space-xl); } /* Stegene. Tallet er en etikett i en fast gutter, så ledesetningene får felles venstrekant. Ingen hårstrek mellom stegene — tallene gjør den jobben. */ #cz-m-steps ol { list-style: none; margin: var(--cz-space-xl) 0 0; padding: 0; display: flex; flex-direction: column; gap: 44px; } #cz-m-steps li { display: grid; grid-template-columns: 44px 1fr; gap: var(--cz-space-md); align-items: baseline; } #cz-m-steps .cz-m-num { font-family: var(--cz-mono); font-size: var(--cz-fs-label); font-weight: 500; letter-spacing: var(--cz-ls-label); } #cz-m-steps .cz-m-lead { font-size: 24px; line-height: 1.24; letter-spacing: -0.01em; margin-bottom: var(--cz-space-xs); max-width: 34ch; } #cz-m-steps li p + p { max-width: 58ch; } /* Zero-tabellen og registeret deler radoppsett, men ikke strekvekt: Zero er en tabell (1.5px), registeret er et register (1px). */ #cz-m-zero .cz-m-intro, #cz-m-register .cz-m-intro { margin-top: var(--cz-space-md); text-wrap: pretty; } #cz-m-zero .cz-m-rows, #cz-m-register .cz-m-rows { display: flex; flex-direction: column; margin-top: var(--cz-space-xl); } #cz-m-zero .cz-m-rows > div { display: grid; grid-template-columns: 26ch 1fr; gap: var(--cz-space-lg); align-items: baseline; padding: 26px 0; border-top: 1.5px solid var(--cz-ink); } #cz-m-zero .cz-m-rows > div:last-child { border-bottom: 1.5px solid var(--cz-ink); } /* Nøkkelordene er påstander, ikke etiketter — derfor sans. */ #cz-m-zero .cz-m-key { line-height: 1.3; max-width: none; } #cz-m-register .cz-m-rows > div { display: grid; grid-template-columns: 1fr auto; gap: var(--cz-space-lg); align-items: baseline; padding: 22px 0; border-top: 1px solid var(--cz-ink); } #cz-m-register .cz-m-rows > div:last-child { border-bottom: 1px solid var(--cz-ink); } #cz-m-register .cz-m-cat { line-height: 1.3; max-width: none; } #cz-m-register .cz-m-catbody { margin-top: 10px; max-width: 52ch; } /* Status. Rader uten dato står tomme — tomrommet er informasjonen, ikke en manglende verdi. */ #cz-m-register .cz-m-rows span { font-family: var(--cz-mono); font-size: var(--cz-fs-label); font-weight: 500; letter-spacing: var(--cz-ls-label); text-transform: uppercase; text-align: right; white-space: nowrap; } #cz-m-register .cz-m-figure { margin-top: var(--cz-space-lg); max-width: 52ch; } /* Metode- og datolinja står rett under tallet den kvalifiserer. Etikett, ikke påstand. */ #cz-m-register .cz-m-stamp { margin-top: var(--cz-space-md); font-family: var(--cz-mono); font-size: var(--cz-fs-label); font-weight: 500; letter-spacing: var(--cz-ls-label); text-transform: uppercase; line-height: 1.6; } /* Ærlighetspunktet. Coda, hårstrek, så underdriven. */ #cz-m-close .cz-m-coda { font-size: 24px; line-height: 1.24; letter-spacing: -0.01em; max-width: 40ch; } #cz-m-close .cz-m-honesty { margin-top: var(--cz-space-2xl); padding-top: 36px; border-top: 1px solid var(--cz-ink); display: flex; flex-direction: column; gap: var(--cz-space-sm); } #cz-m-close .cz-m-honesty-lead { font-size: 24px; line-height: 1.24; letter-spacing: -0.01em; max-width: 30ch; } #cz-m-close .cz-m-honesty p + p { max-width: 52ch; } /* CTA-en er en Broadcast-seksjon, så den laster sin egen stilfil etter denne. Derfor !important. Klasser verifisert i blocks/heading.liquid:10 og blocks/text.liquid:2. */ [id$="__cz_m_cta"] .hero__description { font-size: var(--cz-fs-body-lg) !important; line-height: 1.6 !important; max-width: 52ch; } @media only screen and (max-width: 749px) { #cz-m-hero .cz-m-pillrow { gap: 8px; margin-top: var(--cz-space-lg); } #cz-m-steps ol { gap: var(--cz-space-lg); } #cz-m-steps li { grid-template-columns: 1fr; gap: var(--cz-space-xs); } #cz-m-zero .cz-m-rows > div, #cz-m-register .cz-m-rows > div { grid-template-columns: 1fr; gap: var(--cz-space-xs); } #cz-m-register .cz-m-rows span { text-align: left; } #cz-m-close .cz-m-honesty { margin-top: var(--cz-space-xl); } } /* ================================================= OM OSS — /pages/om_oss Malen er templates/page.about.json. Sju Broadcast- seksjoner: seks section-rich-text og én section-double (India-bildet, som trenger Theme Editors bildevelger). Ingen custom-code — all tekst er redigerbar for Mari. Hierarki settes med text_font_size, ikke med rekkefølge: body-x-large er ledelinja, body-large er brødteksten. Klassen kommer fra blokkens egen innstilling, så ingenting brekker om en blokk flyttes. rich-text og double laster egne stilfiler i body, altså etter denne fila. Derfor !important. Klasser verifisert i blocks/heading.liquid:10, blocks/text.liquid:2 og blocks/subheading.liquid:3. ================================================= */ /* Ledelinjene. Kort utsagn, så utdyping under — samme mønster som ærlighetspunktet på metode-siden. */ /* Fagfolk-blokken er en coda på Teamet, ikke en ny seksjon. Hårstreken sier det. */ [id$="__cz_om_hero"] .hero__title { font-size: var(--cz-fs-display) !important; line-height: var(--cz-lh-tight) !important; letter-spacing: var(--cz-ls-tight) !important; max-width: var(--cz-measure-heading); text-wrap: pretty; } [id$="__cz_om_metoden"] .hero__title, [id$="__cz_om_ansvar"] .hero__title, [id$="__cz_om_avslutning"] .hero__title, [id$="__cz_om_starten"] .hero__title { font-size: var(--cz-fs-h2) !important; line-height: var(--cz-lh-heading) !important; letter-spacing: var(--cz-ls-heading) !important; max-width: var(--cz-measure-heading); text-wrap: pretty; } /* Eyebrow-en er en pille, ikke løs mono-tekst. Samme pille-tokens som metode-siden, så de to leser likt. */ [id$="__cz_om_hero"] .hero__subheading { display: inline-flex !important; align-items: center !important; width: auto !important; font-family: var(--cz-mono) !important; font-size: var(--cz-pill-fs) !important; font-weight: 500 !important; letter-spacing: var(--cz-pill-ls) !important; text-transform: uppercase !important; line-height: 1 !important; color: var(--cz-ink) !important; background: transparent !important; border: var(--cz-pill-border-width) solid var(--cz-ink) !important; border-radius: var(--cz-pill-radius) !important; padding: 9px 15px !important; } /* ================================================= KNAPPER — fylt variant Broadcasts .btn--solid setter tekstfargen til seksjonens bakgrunn, så en svart knapp på peach får peach tekst. Lav kontrast, og fargen skifter med fargeskjemaet. Hvit tekst holder seg lesbar på alle fem CZ-flatene. Klasser verifisert i snippets/button.liquid:46. Knappen laster sin egen stilfil i body, altså etter denne fila. Derfor !important. ================================================= */ .btn.btn--solid, .btn.btn--solid:visited { color: #FFFFFF !important; } /* Hover inverterer i Broadcast: fyllet forsvinner og teksten blir ink. Da skal den ikke være hvit. */ .btn.btn--solid:hover, .btn.btn--solid:focus { color: var(--cz-ink) !important; } /* ================================================= Batch 77 — avgrenset design- og stabilitetsrunde. ================================================= */ /* Method på mobil. Rytmen fra Batch 61 lå bare i min-width: 750px, så under den arvet hvert steg .multicolumn .grid-item padding: var(--gap) (columns.css:21) og lista falt fra hverandre. */ @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__cz_method_preview"] .grid-item { padding-top: 0 !important; padding-bottom: 0 !important; } [id^="shopify-section"][id$="__cz_method_preview"] .grid-item:nth-child(2) { padding-top: 40px !important; } [id^="shopify-section"][id$="__cz_method_preview"] .grid-item:nth-child(n + 3) { padding-top: 16px !important; } [id^="shopify-section"][id$="__cz_method_preview"] .grid-item .column__content { grid-template-columns: 34px 1fr; gap: 12px; } [id^="shopify-section"][id$="__cz_method_preview"] .grid-item .column__text p { font-size: 19px; line-height: 1.32; } } /* Sluttlinja i sky-seksjonen står til høyre på desktop som del av todelingen. På smale bredder gir høyrestilling ingen komposisjon, bare ujevn venstrekant. */ @media only screen and (max-width: 749px) { [data-section-id$="cz_belief"] .hero__rte { align-self: flex-start !important; margin-left: 0 !important; text-align: left !important; } [data-section-id$="cz_belief"] .hero__rte p { margin-top: 28px !important; font-size: 20px !important; } } /* Dokumentasjonsmerkene. Tre spor på desktop, ett på mobil — aldri 2 + 1, som satte B Corp alene på ny rad. */ #cz-trust-marks { max-width: var(--content-max); margin: 0 auto; padding: 0 var(--gutter); display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 32px; justify-items: center; } #cz-trust-marks .cz-mark { display: flex; flex-direction: column; align-items: center; gap: 20px; } #cz-trust-marks .cz-mark__img { height: 104px; display: flex; align-items: flex-end; } #cz-trust-marks .cz-mark__img img { width: auto; display: block; } #cz-trust-marks .cz-mark__label { font-family: var(--cz-mono); font-size: var(--cz-fs-label); font-weight: 500; letter-spacing: var(--cz-ls-label); text-transform: uppercase; line-height: 1.2; text-align: center; color: var(--cz-ink); } @media only screen and (max-width: 749px) { #cz-trust-marks { grid-template-columns: 1fr; gap: 44px; } } /* Footermenyen. Lenkene sto på 13px med for tett radavstand. */ .site-footer .footer__quicklinks li a, .site-footer .footer__quicklinks li { font-family: var(--cz-mono); font-size: 14px; line-height: 1.5; letter-spacing: 0.01em; } .site-footer .footer__quicklinks { display: flex; flex-direction: column; gap: 12px; } .site-footer .footer__quicklinks li { margin: 0; } /* Betalingsikonene er ulike formater — Klarna er en bred badge, Vipps og MobilePay er kvadratiske merker. Felles høyde gjør Klarna optisk dominerende; felles boks gjør rekken jevn. */ .footer-payments-inner img { max-height: 30px; width: auto; object-fit: contain; } /* Batch 79 — merkene skiller selskaps- fra produktsertifisering. Kvalifikatoren er en underlinje til etiketten, ikke en ny etikett. */ #cz-trust-marks .cz-mark__label em { display: block; margin-top: 6px; font-style: normal; font-family: var(--cz-sans); font-size: 12px; font-weight: 400; letter-spacing: normal; text-transform: none; } /* ================================================= Batch 80 — etter visuell QA på sideutkast 79. ================================================= */ /* Logorekken ble beskåret i kantene. Årsaken var at CSS-en satte både bredde og høyde på .logos__img, mens Liquid regner boksen ut fra logoens eget sideforhold — avviket klippet bildet. Etter at bare høyden settes kan ingenting beskjæres, men rekken må også få lov til å flyte ut av sliderens egne overflow-regler. */ [id^="shopify-section"][id$="__section-press-logos"] .logos, [id^="shopify-section"][id$="__section-press-logos"] .logos__wrapper, [id^="shopify-section"][id$="__section-press-logos"] .logos__slider, [id^="shopify-section"][id$="__section-press-logos"] .logos__slide { overflow: visible !important; } [id^="shopify-section"][id$="__section-press-logos"] .logos__slide { flex: 0 0 auto !important; min-width: 0 !important; margin: 0 !important; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section-press-logos"] .logos__slider { gap: 26px 36px !important; } } /* Loox legger en flytende fane og et anmeldelseskort over siden. Riktig sted å slå dem av er Loox' egne visningsinnstillinger — dette er en sikring, ikke løsningen. Innebygde stjerner og widgets i sideflyten berøres ikke. */ @media only screen and (max-width: 749px) { [class*="loox"][class*="floating"], [class*="loox"][class*="sticky"], [class*="loox"][class*="tab"], [id*="loox"][id*="tab"], [id*="loox"][id*="popup"], [id*="Loox"][id*="Tab"] { display: none !important; } } /* ═══════════════════════════════════════════════════════ Batch 84 — tøyvask-arksiden, desktop. Alt er scopet til Shopifys seksjonswrapper, som er den eneste kroken som finnes for alle seksjonstyper. Ingen regel her kan nå andre maler. Fargene følger innholdsrollen: fersken til avgrensningen, lime til dokumentasjonen, himmelblå til spørsmålene. ═══════════════════════════════════════════════════════ */ /* ── Flater ── */ [id^="shopify-section"][id$="__main"], [id^="shopify-section"][id$="__cz_variant"], [id^="shopify-section"][id$="__cz_hva_er"], [id^="shopify-section"][id$="__cz_ugc"], [id^="shopify-section"][id$="__cz_ingredienser"], [id^="shopify-section"][id$="__cz_profiler"], [id^="shopify-section"][id$="__cz_dokumentasjon"] { background-color: #FFFFFF !important; } [id^="shopify-section"][id$="__cz_tillit"], [id^="shopify-section"][id$="__cz_slik_bruker"], [id^="shopify-section"][id$="__cz_dosering"], [id^="shopify-section"][id$="__cz_loox_intro"], [id^="shopify-section"][id$="__cz_loox"], [id^="shopify-section"][id$="__cz_loox_cta"], [id^="shopify-section"][id$="__cz_sammenligning"], [id^="shopify-section"][id$="__cz_butikk_tekst"], [id^="shopify-section"][id$="__cz_butikklogoer"], [id^="shopify-section"][id$="__cz_avslutning"] { background-color: var(--cz-off-white, #F2F2F2) !important; } [id^="shopify-section"][id$="__cz_aerlig"] { background-color: var(--cz-peach, #FFA683) !important; } [id^="shopify-section"][id$="__cz_tallene_intro"], [id^="shopify-section"][id$="__cz_tallene_bak"] { background-color: var(--cz-lime, #BDD14B) !important; } [id^="shopify-section"][id$="__cz_faq"], [id^="shopify-section"][id$="__cz_faq_cta"] { background-color: var(--cz-sky, #45A2FF) !important; } /* Flatene bærer designet. Ingen kort skal kaste skygge. */ [id^="shopify-section"][id$="__main"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_variant"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_hva_er"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_ugc"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_ingredienser"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_profiler"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_dokumentasjon"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_tillit"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_slik_bruker"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_dosering"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_loox_intro"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_loox"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_loox_cta"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_sammenligning"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_butikk_tekst"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_butikklogoer"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_avslutning"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_tallene_intro"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_tallene_bak"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_faq"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_faq_cta"] .card, .column, .multicolumn-card, .accordion, .grid-item, [id^="shopify-section"][id$="__cz_aerlig"] .card, .column, .multicolumn-card, .accordion, .grid-item { box-shadow: none !important; } /* ── Piller. Én utforming, brukt overalt: mono i versaler, 2 px kontur, kapsel, bredde etter innhold. ── */ [id^="shopify-section"][id$="__main"] .subheading, [id^="shopify-section"][id$="__cz_variant"] .subheading, [id^="shopify-section"][id$="__cz_hva_er"] .subheading, [id^="shopify-section"][id$="__cz_ugc"] .subheading, [id^="shopify-section"][id$="__cz_ingredienser"] .subheading, [id^="shopify-section"][id$="__cz_profiler"] .subheading, [id^="shopify-section"][id$="__cz_dokumentasjon"] .subheading, [id^="shopify-section"][id$="__cz_tillit"] .subheading, [id^="shopify-section"][id$="__cz_slik_bruker"] .subheading, [id^="shopify-section"][id$="__cz_dosering"] .subheading, [id^="shopify-section"][id$="__cz_loox_intro"] .subheading, [id^="shopify-section"][id$="__cz_loox"] .subheading, [id^="shopify-section"][id$="__cz_loox_cta"] .subheading, [id^="shopify-section"][id$="__cz_sammenligning"] .subheading, [id^="shopify-section"][id$="__cz_butikk_tekst"] .subheading, [id^="shopify-section"][id$="__cz_butikklogoer"] .subheading, [id^="shopify-section"][id$="__cz_avslutning"] .subheading, [id^="shopify-section"][id$="__cz_tallene_intro"] .subheading, [id^="shopify-section"][id$="__cz_tallene_bak"] .subheading, [id^="shopify-section"][id$="__cz_faq"] .subheading, [id^="shopify-section"][id$="__cz_faq_cta"] .subheading, [id^="shopify-section"][id$="__cz_aerlig"] .subheading, [id^="shopify-section"][id$="__main"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_variant"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_hva_er"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_ugc"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_ingredienser"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_profiler"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_dokumentasjon"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_tillit"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_slik_bruker"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_dosering"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_loox_intro"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_loox"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_loox_cta"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_sammenligning"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_butikk_tekst"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_butikklogoer"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_avslutning"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_tallene_intro"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_tallene_bak"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_faq"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_faq_cta"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_aerlig"] .rich-text__subheading, [id^="shopify-section"][id$="__main"] .column__subheading, [id^="shopify-section"][id$="__cz_variant"] .column__subheading, [id^="shopify-section"][id$="__cz_hva_er"] .column__subheading, [id^="shopify-section"][id$="__cz_ugc"] .column__subheading, [id^="shopify-section"][id$="__cz_ingredienser"] .column__subheading, [id^="shopify-section"][id$="__cz_profiler"] .column__subheading, [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__subheading, [id^="shopify-section"][id$="__cz_tillit"] .column__subheading, [id^="shopify-section"][id$="__cz_slik_bruker"] .column__subheading, [id^="shopify-section"][id$="__cz_dosering"] .column__subheading, [id^="shopify-section"][id$="__cz_loox_intro"] .column__subheading, [id^="shopify-section"][id$="__cz_loox"] .column__subheading, [id^="shopify-section"][id$="__cz_loox_cta"] .column__subheading, [id^="shopify-section"][id$="__cz_sammenligning"] .column__subheading, [id^="shopify-section"][id$="__cz_butikk_tekst"] .column__subheading, [id^="shopify-section"][id$="__cz_butikklogoer"] .column__subheading, [id^="shopify-section"][id$="__cz_avslutning"] .column__subheading, [id^="shopify-section"][id$="__cz_tallene_intro"] .column__subheading, [id^="shopify-section"][id$="__cz_tallene_bak"] .column__subheading, [id^="shopify-section"][id$="__cz_faq"] .column__subheading, [id^="shopify-section"][id$="__cz_faq_cta"] .column__subheading, [id^="shopify-section"][id$="__cz_aerlig"] .column__subheading { display: inline-block !important; width: auto !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; color: var(--cz-ink, #000) !important; padding: 9px 18px !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; background: transparent !important; } /* ── Typografi. Sans bærer stemmen, mono bærer etikettene. ── */ [id^="shopify-section"][id$="__main"] h2, [id^="shopify-section"][id$="__cz_variant"] h2, [id^="shopify-section"][id$="__cz_hva_er"] h2, [id^="shopify-section"][id$="__cz_ugc"] h2, [id^="shopify-section"][id$="__cz_ingredienser"] h2, [id^="shopify-section"][id$="__cz_profiler"] h2, [id^="shopify-section"][id$="__cz_dokumentasjon"] h2, [id^="shopify-section"][id$="__cz_tillit"] h2, [id^="shopify-section"][id$="__cz_slik_bruker"] h2, [id^="shopify-section"][id$="__cz_dosering"] h2, [id^="shopify-section"][id$="__cz_loox_intro"] h2, [id^="shopify-section"][id$="__cz_loox"] h2, [id^="shopify-section"][id$="__cz_loox_cta"] h2, [id^="shopify-section"][id$="__cz_sammenligning"] h2, [id^="shopify-section"][id$="__cz_butikk_tekst"] h2, [id^="shopify-section"][id$="__cz_butikklogoer"] h2, [id^="shopify-section"][id$="__cz_avslutning"] h2, [id^="shopify-section"][id$="__cz_tallene_intro"] h2, [id^="shopify-section"][id$="__cz_tallene_bak"] h2, [id^="shopify-section"][id$="__cz_faq"] h2, [id^="shopify-section"][id$="__cz_faq_cta"] h2, [id^="shopify-section"][id$="__cz_aerlig"] h2 { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: clamp(34px, 3.4vw, 46px) !important; line-height: 1.06 !important; letter-spacing: -0.025em !important; text-transform: none !important; max-width: 22ch !important; } [id^="shopify-section"][id$="__main"] h3, [id^="shopify-section"][id$="__cz_variant"] h3, [id^="shopify-section"][id$="__cz_hva_er"] h3, [id^="shopify-section"][id$="__cz_ugc"] h3, [id^="shopify-section"][id$="__cz_ingredienser"] h3, [id^="shopify-section"][id$="__cz_profiler"] h3, [id^="shopify-section"][id$="__cz_dokumentasjon"] h3, [id^="shopify-section"][id$="__cz_tillit"] h3, [id^="shopify-section"][id$="__cz_slik_bruker"] h3, [id^="shopify-section"][id$="__cz_dosering"] h3, [id^="shopify-section"][id$="__cz_loox_intro"] h3, [id^="shopify-section"][id$="__cz_loox"] h3, [id^="shopify-section"][id$="__cz_loox_cta"] h3, [id^="shopify-section"][id$="__cz_sammenligning"] h3, [id^="shopify-section"][id$="__cz_butikk_tekst"] h3, [id^="shopify-section"][id$="__cz_butikklogoer"] h3, [id^="shopify-section"][id$="__cz_avslutning"] h3, [id^="shopify-section"][id$="__cz_tallene_intro"] h3, [id^="shopify-section"][id$="__cz_tallene_bak"] h3, [id^="shopify-section"][id$="__cz_faq"] h3, [id^="shopify-section"][id$="__cz_faq_cta"] h3, [id^="shopify-section"][id$="__cz_aerlig"] h3 { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: 26px !important; line-height: 1.16 !important; letter-spacing: -0.015em !important; text-transform: none !important; } [id^="shopify-section"][id$="__main"] .rte p, [id^="shopify-section"][id$="__cz_variant"] .rte p, [id^="shopify-section"][id$="__cz_hva_er"] .rte p, [id^="shopify-section"][id$="__cz_ugc"] .rte p, [id^="shopify-section"][id$="__cz_ingredienser"] .rte p, [id^="shopify-section"][id$="__cz_profiler"] .rte p, [id^="shopify-section"][id$="__cz_dokumentasjon"] .rte p, [id^="shopify-section"][id$="__cz_tillit"] .rte p, [id^="shopify-section"][id$="__cz_slik_bruker"] .rte p, [id^="shopify-section"][id$="__cz_dosering"] .rte p, [id^="shopify-section"][id$="__cz_loox_intro"] .rte p, [id^="shopify-section"][id$="__cz_loox"] .rte p, [id^="shopify-section"][id$="__cz_loox_cta"] .rte p, [id^="shopify-section"][id$="__cz_sammenligning"] .rte p, [id^="shopify-section"][id$="__cz_butikk_tekst"] .rte p, [id^="shopify-section"][id$="__cz_butikklogoer"] .rte p, [id^="shopify-section"][id$="__cz_avslutning"] .rte p, [id^="shopify-section"][id$="__cz_tallene_intro"] .rte p, [id^="shopify-section"][id$="__cz_tallene_bak"] .rte p, [id^="shopify-section"][id$="__cz_faq"] .rte p, [id^="shopify-section"][id$="__cz_faq_cta"] .rte p, [id^="shopify-section"][id$="__cz_aerlig"] .rte p, [id^="shopify-section"][id$="__main"] .column__text p, [id^="shopify-section"][id$="__cz_variant"] .column__text p, [id^="shopify-section"][id$="__cz_hva_er"] .column__text p, [id^="shopify-section"][id$="__cz_ugc"] .column__text p, [id^="shopify-section"][id$="__cz_ingredienser"] .column__text p, [id^="shopify-section"][id$="__cz_profiler"] .column__text p, [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__text p, [id^="shopify-section"][id$="__cz_tillit"] .column__text p, [id^="shopify-section"][id$="__cz_slik_bruker"] .column__text p, [id^="shopify-section"][id$="__cz_dosering"] .column__text p, [id^="shopify-section"][id$="__cz_loox_intro"] .column__text p, [id^="shopify-section"][id$="__cz_loox"] .column__text p, [id^="shopify-section"][id$="__cz_loox_cta"] .column__text p, [id^="shopify-section"][id$="__cz_sammenligning"] .column__text p, [id^="shopify-section"][id$="__cz_butikk_tekst"] .column__text p, [id^="shopify-section"][id$="__cz_butikklogoer"] .column__text p, [id^="shopify-section"][id$="__cz_avslutning"] .column__text p, [id^="shopify-section"][id$="__cz_tallene_intro"] .column__text p, [id^="shopify-section"][id$="__cz_tallene_bak"] .column__text p, [id^="shopify-section"][id$="__cz_faq"] .column__text p, [id^="shopify-section"][id$="__cz_faq_cta"] .column__text p, [id^="shopify-section"][id$="__cz_aerlig"] .column__text p, [id^="shopify-section"][id$="__main"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_variant"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_hva_er"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_ugc"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_ingredienser"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_profiler"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_dokumentasjon"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_tillit"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_slik_bruker"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_dosering"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_loox_intro"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_loox"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_loox_cta"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_sammenligning"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_butikk_tekst"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_butikklogoer"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_avslutning"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_tallene_intro"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_tallene_bak"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_faq"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_faq_cta"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_aerlig"] .multicolumn-card__info p { font-family: var(--cz-sans) !important; font-weight: 400 !important; font-size: 18px !important; line-height: 1.55 !important; max-width: 62ch !important; } /* ── Knapper. Kapsel, mono i versaler, minst 48 px høy. ── */ [id^="shopify-section"][id$="__main"] .btn, [id^="shopify-section"][id$="__cz_variant"] .btn, [id^="shopify-section"][id$="__cz_hva_er"] .btn, [id^="shopify-section"][id$="__cz_ugc"] .btn, [id^="shopify-section"][id$="__cz_ingredienser"] .btn, [id^="shopify-section"][id$="__cz_profiler"] .btn, [id^="shopify-section"][id$="__cz_dokumentasjon"] .btn, [id^="shopify-section"][id$="__cz_tillit"] .btn, [id^="shopify-section"][id$="__cz_slik_bruker"] .btn, [id^="shopify-section"][id$="__cz_dosering"] .btn, [id^="shopify-section"][id$="__cz_loox_intro"] .btn, [id^="shopify-section"][id$="__cz_loox"] .btn, [id^="shopify-section"][id$="__cz_loox_cta"] .btn, [id^="shopify-section"][id$="__cz_sammenligning"] .btn, [id^="shopify-section"][id$="__cz_butikk_tekst"] .btn, [id^="shopify-section"][id$="__cz_butikklogoer"] .btn, [id^="shopify-section"][id$="__cz_avslutning"] .btn, [id^="shopify-section"][id$="__cz_tallene_intro"] .btn, [id^="shopify-section"][id$="__cz_tallene_bak"] .btn, [id^="shopify-section"][id$="__cz_faq"] .btn, [id^="shopify-section"][id$="__cz_faq_cta"] .btn, [id^="shopify-section"][id$="__cz_aerlig"] .btn { font-family: var(--cz-mono) !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; border-radius: 300px !important; border: 2px solid var(--cz-ink, #000) !important; padding: 17px 30px !important; min-height: 48px !important; transition: background-color 160ms cubic-bezier(0.22, 1, 0.36, 1), color 160ms cubic-bezier(0.22, 1, 0.36, 1), transform 120ms cubic-bezier(0.22, 1, 0.36, 1) !important; } [id^="shopify-section"][id$="__main"] .btn--solid, [id^="shopify-section"][id$="__cz_variant"] .btn--solid, [id^="shopify-section"][id$="__cz_hva_er"] .btn--solid, [id^="shopify-section"][id$="__cz_ugc"] .btn--solid, [id^="shopify-section"][id$="__cz_ingredienser"] .btn--solid, [id^="shopify-section"][id$="__cz_profiler"] .btn--solid, [id^="shopify-section"][id$="__cz_dokumentasjon"] .btn--solid, [id^="shopify-section"][id$="__cz_tillit"] .btn--solid, [id^="shopify-section"][id$="__cz_slik_bruker"] .btn--solid, [id^="shopify-section"][id$="__cz_dosering"] .btn--solid, [id^="shopify-section"][id$="__cz_loox_intro"] .btn--solid, [id^="shopify-section"][id$="__cz_loox"] .btn--solid, [id^="shopify-section"][id$="__cz_loox_cta"] .btn--solid, [id^="shopify-section"][id$="__cz_sammenligning"] .btn--solid, [id^="shopify-section"][id$="__cz_butikk_tekst"] .btn--solid, [id^="shopify-section"][id$="__cz_butikklogoer"] .btn--solid, [id^="shopify-section"][id$="__cz_avslutning"] .btn--solid, [id^="shopify-section"][id$="__cz_tallene_intro"] .btn--solid, [id^="shopify-section"][id$="__cz_tallene_bak"] .btn--solid, [id^="shopify-section"][id$="__cz_faq"] .btn--solid, [id^="shopify-section"][id$="__cz_faq_cta"] .btn--solid, [id^="shopify-section"][id$="__cz_aerlig"] .btn--solid, [id^="shopify-section"][id$="__main"] .btn--black, [id^="shopify-section"][id$="__cz_variant"] .btn--black, [id^="shopify-section"][id$="__cz_hva_er"] .btn--black, [id^="shopify-section"][id$="__cz_ugc"] .btn--black, [id^="shopify-section"][id$="__cz_ingredienser"] .btn--black, [id^="shopify-section"][id$="__cz_profiler"] .btn--black, [id^="shopify-section"][id$="__cz_dokumentasjon"] .btn--black, [id^="shopify-section"][id$="__cz_tillit"] .btn--black, [id^="shopify-section"][id$="__cz_slik_bruker"] .btn--black, [id^="shopify-section"][id$="__cz_dosering"] .btn--black, [id^="shopify-section"][id$="__cz_loox_intro"] .btn--black, [id^="shopify-section"][id$="__cz_loox"] .btn--black, [id^="shopify-section"][id$="__cz_loox_cta"] .btn--black, [id^="shopify-section"][id$="__cz_sammenligning"] .btn--black, [id^="shopify-section"][id$="__cz_butikk_tekst"] .btn--black, [id^="shopify-section"][id$="__cz_butikklogoer"] .btn--black, [id^="shopify-section"][id$="__cz_avslutning"] .btn--black, [id^="shopify-section"][id$="__cz_tallene_intro"] .btn--black, [id^="shopify-section"][id$="__cz_tallene_bak"] .btn--black, [id^="shopify-section"][id$="__cz_faq"] .btn--black, [id^="shopify-section"][id$="__cz_faq_cta"] .btn--black, [id^="shopify-section"][id$="__cz_aerlig"] .btn--black { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__main"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_variant"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_hva_er"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_ugc"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_ingredienser"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_profiler"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_dokumentasjon"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_tillit"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_slik_bruker"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_dosering"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_loox_intro"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_loox"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_loox_cta"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_sammenligning"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_butikk_tekst"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_butikklogoer"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_avslutning"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_tallene_intro"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_tallene_bak"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_faq"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_faq_cta"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_aerlig"] .btn--solid:hover, [id^="shopify-section"][id$="__main"] .btn--black:hover, [id^="shopify-section"][id$="__cz_variant"] .btn--black:hover, [id^="shopify-section"][id$="__cz_hva_er"] .btn--black:hover, [id^="shopify-section"][id$="__cz_ugc"] .btn--black:hover, [id^="shopify-section"][id$="__cz_ingredienser"] .btn--black:hover, [id^="shopify-section"][id$="__cz_profiler"] .btn--black:hover, [id^="shopify-section"][id$="__cz_dokumentasjon"] .btn--black:hover, [id^="shopify-section"][id$="__cz_tillit"] .btn--black:hover, [id^="shopify-section"][id$="__cz_slik_bruker"] .btn--black:hover, [id^="shopify-section"][id$="__cz_dosering"] .btn--black:hover, [id^="shopify-section"][id$="__cz_loox_intro"] .btn--black:hover, [id^="shopify-section"][id$="__cz_loox"] .btn--black:hover, [id^="shopify-section"][id$="__cz_loox_cta"] .btn--black:hover, [id^="shopify-section"][id$="__cz_sammenligning"] .btn--black:hover, [id^="shopify-section"][id$="__cz_butikk_tekst"] .btn--black:hover, [id^="shopify-section"][id$="__cz_butikklogoer"] .btn--black:hover, [id^="shopify-section"][id$="__cz_avslutning"] .btn--black:hover, [id^="shopify-section"][id$="__cz_tallene_intro"] .btn--black:hover, [id^="shopify-section"][id$="__cz_tallene_bak"] .btn--black:hover, [id^="shopify-section"][id$="__cz_faq"] .btn--black:hover, [id^="shopify-section"][id$="__cz_faq_cta"] .btn--black:hover, [id^="shopify-section"][id$="__cz_aerlig"] .btn--black:hover { background: #1A1A1A !important; border-color: #1A1A1A !important; } [id^="shopify-section"][id$="__main"] .btn--outline, [id^="shopify-section"][id$="__cz_variant"] .btn--outline, [id^="shopify-section"][id$="__cz_hva_er"] .btn--outline, [id^="shopify-section"][id$="__cz_ugc"] .btn--outline, [id^="shopify-section"][id$="__cz_ingredienser"] .btn--outline, [id^="shopify-section"][id$="__cz_profiler"] .btn--outline, [id^="shopify-section"][id$="__cz_dokumentasjon"] .btn--outline, [id^="shopify-section"][id$="__cz_tillit"] .btn--outline, [id^="shopify-section"][id$="__cz_slik_bruker"] .btn--outline, [id^="shopify-section"][id$="__cz_dosering"] .btn--outline, [id^="shopify-section"][id$="__cz_loox_intro"] .btn--outline, [id^="shopify-section"][id$="__cz_loox"] .btn--outline, [id^="shopify-section"][id$="__cz_loox_cta"] .btn--outline, [id^="shopify-section"][id$="__cz_sammenligning"] .btn--outline, [id^="shopify-section"][id$="__cz_butikk_tekst"] .btn--outline, [id^="shopify-section"][id$="__cz_butikklogoer"] .btn--outline, [id^="shopify-section"][id$="__cz_avslutning"] .btn--outline, [id^="shopify-section"][id$="__cz_tallene_intro"] .btn--outline, [id^="shopify-section"][id$="__cz_tallene_bak"] .btn--outline, [id^="shopify-section"][id$="__cz_faq"] .btn--outline, [id^="shopify-section"][id$="__cz_faq_cta"] .btn--outline, [id^="shopify-section"][id$="__cz_aerlig"] .btn--outline { background: transparent !important; color: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__main"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_variant"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_hva_er"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_ugc"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_ingredienser"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_profiler"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_dokumentasjon"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_tillit"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_slik_bruker"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_dosering"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_loox_intro"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_loox"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_loox_cta"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_sammenligning"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_butikk_tekst"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_butikklogoer"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_avslutning"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_tallene_intro"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_tallene_bak"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_faq"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_faq_cta"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_aerlig"] .btn--outline:hover { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__main"] .btn:active, [id^="shopify-section"][id$="__cz_variant"] .btn:active, [id^="shopify-section"][id$="__cz_hva_er"] .btn:active, [id^="shopify-section"][id$="__cz_ugc"] .btn:active, [id^="shopify-section"][id$="__cz_ingredienser"] .btn:active, [id^="shopify-section"][id$="__cz_profiler"] .btn:active, [id^="shopify-section"][id$="__cz_dokumentasjon"] .btn:active, [id^="shopify-section"][id$="__cz_tillit"] .btn:active, [id^="shopify-section"][id$="__cz_slik_bruker"] .btn:active, [id^="shopify-section"][id$="__cz_dosering"] .btn:active, [id^="shopify-section"][id$="__cz_loox_intro"] .btn:active, [id^="shopify-section"][id$="__cz_loox"] .btn:active, [id^="shopify-section"][id$="__cz_loox_cta"] .btn:active, [id^="shopify-section"][id$="__cz_sammenligning"] .btn:active, [id^="shopify-section"][id$="__cz_butikk_tekst"] .btn:active, [id^="shopify-section"][id$="__cz_butikklogoer"] .btn:active, [id^="shopify-section"][id$="__cz_avslutning"] .btn:active, [id^="shopify-section"][id$="__cz_tallene_intro"] .btn:active, [id^="shopify-section"][id$="__cz_tallene_bak"] .btn:active, [id^="shopify-section"][id$="__cz_faq"] .btn:active, [id^="shopify-section"][id$="__cz_faq_cta"] .btn:active, [id^="shopify-section"][id$="__cz_aerlig"] .btn:active { transform: translateY(2px) !important; } /* Tekstlenker er lenker. De skal ikke konkurrere med kjøpet. */ [id^="shopify-section"][id$="__main"] .btn--text, [id^="shopify-section"][id$="__cz_variant"] .btn--text, [id^="shopify-section"][id$="__cz_hva_er"] .btn--text, [id^="shopify-section"][id$="__cz_ugc"] .btn--text, [id^="shopify-section"][id$="__cz_ingredienser"] .btn--text, [id^="shopify-section"][id$="__cz_profiler"] .btn--text, [id^="shopify-section"][id$="__cz_dokumentasjon"] .btn--text, [id^="shopify-section"][id$="__cz_tillit"] .btn--text, [id^="shopify-section"][id$="__cz_slik_bruker"] .btn--text, [id^="shopify-section"][id$="__cz_dosering"] .btn--text, [id^="shopify-section"][id$="__cz_loox_intro"] .btn--text, [id^="shopify-section"][id$="__cz_loox"] .btn--text, [id^="shopify-section"][id$="__cz_loox_cta"] .btn--text, [id^="shopify-section"][id$="__cz_sammenligning"] .btn--text, [id^="shopify-section"][id$="__cz_butikk_tekst"] .btn--text, [id^="shopify-section"][id$="__cz_butikklogoer"] .btn--text, [id^="shopify-section"][id$="__cz_avslutning"] .btn--text, [id^="shopify-section"][id$="__cz_tallene_intro"] .btn--text, [id^="shopify-section"][id$="__cz_tallene_bak"] .btn--text, [id^="shopify-section"][id$="__cz_faq"] .btn--text, [id^="shopify-section"][id$="__cz_faq_cta"] .btn--text, [id^="shopify-section"][id$="__cz_aerlig"] .btn--text { border: 0 !important; border-radius: 0 !important; padding: 4px 0 !important; min-height: 0 !important; background: transparent !important; color: var(--cz-ink, #000) !important; text-decoration: underline !important; text-underline-offset: 5px !important; } [id^="shopify-section"][id$="__main"] .btn--text:hover, [id^="shopify-section"][id$="__cz_variant"] .btn--text:hover, [id^="shopify-section"][id$="__cz_hva_er"] .btn--text:hover, [id^="shopify-section"][id$="__cz_ugc"] .btn--text:hover, [id^="shopify-section"][id$="__cz_ingredienser"] .btn--text:hover, [id^="shopify-section"][id$="__cz_profiler"] .btn--text:hover, [id^="shopify-section"][id$="__cz_dokumentasjon"] .btn--text:hover, [id^="shopify-section"][id$="__cz_tillit"] .btn--text:hover, [id^="shopify-section"][id$="__cz_slik_bruker"] .btn--text:hover, [id^="shopify-section"][id$="__cz_dosering"] .btn--text:hover, [id^="shopify-section"][id$="__cz_loox_intro"] .btn--text:hover, [id^="shopify-section"][id$="__cz_loox"] .btn--text:hover, [id^="shopify-section"][id$="__cz_loox_cta"] .btn--text:hover, [id^="shopify-section"][id$="__cz_sammenligning"] .btn--text:hover, [id^="shopify-section"][id$="__cz_butikk_tekst"] .btn--text:hover, [id^="shopify-section"][id$="__cz_butikklogoer"] .btn--text:hover, [id^="shopify-section"][id$="__cz_avslutning"] .btn--text:hover, [id^="shopify-section"][id$="__cz_tallene_intro"] .btn--text:hover, [id^="shopify-section"][id$="__cz_tallene_bak"] .btn--text:hover, [id^="shopify-section"][id$="__cz_faq"] .btn--text:hover, [id^="shopify-section"][id$="__cz_faq_cta"] .btn--text:hover, [id^="shopify-section"][id$="__cz_aerlig"] .btn--text:hover { color: #1A1A1A !important; background: transparent !important; } /* ── Kjøpsheroen. Produktnavnet er sidens H1 og beholder den rollen; salgslinjen under er den visuelle bæreren. Etiketten og faktalinjen er mono, fordi de er data. ── */ [id^="shopify-section"][id$="__main"] .product__title, [id^="shopify-section"][id$="__main"] .product__title h1 { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: 18px !important; line-height: 1.3 !important; letter-spacing: 0 !important; margin: 0 !important; } [id^="shopify-section"][id$="__main"] .product-block--text h2, [id^="shopify-section"][id$="__main"] .product-block--text h3, [id^="shopify-section"][id$="__main"] .product-block--text h4 { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: clamp(40px, 4.2vw, 60px) !important; line-height: 1.01 !important; letter-spacing: -0.03em !important; max-width: 14ch !important; text-transform: none !important; } [id^="shopify-section"][id$="__main"] .product__price, [id^="shopify-section"][id$="__main"] .price { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: 24px !important; } [id^="shopify-section"][id$="__main"] .rte p { max-width: 46ch !important; } /* ── Tillitsraden. Tre piller, ikke tre kolonneoverskrifter. ── */ [id^="shopify-section"][id$="__cz_tillit"] .column__title, [id^="shopify-section"][id$="__cz_tillit"] .multicolumn-card__info h3, [id^="shopify-section"][id$="__cz_tillit"] .column h3 { display: inline-block !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; padding: 12px 22px !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; margin: 0 !important; max-width: none !important; } /* ── Brukstrinnene. Illustrasjonene står på limeplate, slik de er tegnet i kildematerialet. Trinnummeret kommer fra en teller, så rekkefølgen aldri kan bli feil. ── */ [id^="shopify-section"][id$="__cz_slik_bruker"] .grid { counter-reset: cz-steg; } [id^="shopify-section"][id$="__cz_slik_bruker"] .column__image, [id^="shopify-section"][id$="__cz_slik_bruker"] .column__image-wrapper { background: var(--cz-lime, #BDD14B) !important; border-radius: 0 !important; padding: 30px !important; } [id^="shopify-section"][id$="__cz_slik_bruker"] .column__title::before { counter-increment: cz-steg; content: counter(cz-steg); display: block; font-family: var(--cz-mono); font-size: 13px; font-weight: 500; letter-spacing: 0.025em; line-height: 1; margin-bottom: 14px; } [id^="shopify-section"][id$="__cz_slik_bruker"] .column__title { margin-top: 24px !important; } /* ── Dosering og faktalinjer. Mono, fordi de er system, ikke stemme. ── */ [id^="shopify-section"][id$="__cz_dosering"] .rte p, [id^="shopify-section"][id$="__cz_tallene_bak"] .cz-num__label { font-family: var(--cz-mono) !important; font-size: 14px !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; } /* ── UGC. Overskrift og videoer skal lese som ett kapittel. ── */ [id^="shopify-section"][id$="__cz_ugc"] .social-videos__title, [id^="shopify-section"][id$="__cz_ugc"] h2 { margin-bottom: 14px !important; } [id^="shopify-section"][id$="__cz_ugc"] .social-videos__text { margin-bottom: 36px !important; } /* ── Tallene bak. Tre tall med lik vekt; verdien størst, etiketten minst. ── */ [id^="shopify-section"][id$="__cz_tallene_bak"] .cz-num__val { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: clamp(40px, 4.4vw, 60px) !important; letter-spacing: -0.03em !important; line-height: 1 !important; } /* ── FAQ. Store trykkflater, synlig fokus, sorte hårstreker. ── */ [id^="shopify-section"][id$="__cz_faq"] .accordion__title, [id^="shopify-section"][id$="__cz_faq"] .accordion button { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: 20px !important; line-height: 1.25 !important; letter-spacing: -0.01em !important; text-transform: none !important; padding-top: 20px !important; padding-bottom: 20px !important; } [id^="shopify-section"][id$="__cz_faq"] .accordion, [id^="shopify-section"][id$="__cz_faq"] .accordion__item { border-color: var(--cz-ink, #000) !important; background: transparent !important; } [id^="shopify-section"][id$="__cz_faq"] .accordion button:focus-visible { outline: 2px solid var(--cz-ink, #000) !important; outline-offset: 3px !important; } /* ── Dokumentasjonsmerkene. Nivåetiketten er mono, ikke kursiv brødtekst. Lik optisk høyde uansett filformat. ── */ [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__text em, [id^="shopify-section"][id$="__cz_dokumentasjon"] .multicolumn-card__info em { display: block; font-style: normal; font-family: var(--cz-mono); font-size: 11px; font-weight: 500; letter-spacing: 0.025em; text-transform: uppercase; margin-bottom: 8px; } /* FJERNET 2026-09-07 - motstridende bildehoyde-regel, arsak til at bildene i Dokumentasjon ikke vises normalt. Original bevart under, se rapport: [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image img, [id^="shopify-section"][id$="__cz_dokumentasjon"] .multicolumn-card img { width: auto !important; height: 72px !important; max-width: 100% !important; object-fit: contain !important; margin: 0 auto !important; } */ /* ── Butikklogoene. Bare høyden settes; bredden følger logoen, ellers beskjæres de. ── */ [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__img img { width: auto !important; height: 100% !important; max-width: none !important; object-fit: contain !important; } [id^="shopify-section"][id$="__cz_butikklogoer"] .logos, [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__wrapper, [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__slider, [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__slide { overflow: visible !important; } [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__slide { flex: 0 0 auto !important; min-width: 0 !important; margin: 0 !important; } @media only screen and (max-width: 1024px) { [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__slider { gap: 28px 40px !important; } [id^="shopify-section"][id$="__cz_slik_bruker"] .column__image, [id^="shopify-section"][id$="__cz_slik_bruker"] .column__image-wrapper { padding: 24px !important; } } /* ── Pillene på seksjonene som ikke har egen subheading-blokk. Shopify tar maks 25 seksjoner per mal, så de seks separate pill-seksjonene måtte vike. Etiketten ligger derfor i CSS og kan ikke redigeres i Theme Editor — det er prisen for å holde seg under grensen. ── */ [id^="shopify-section"][id$="__cz_slik_bruker"] .grid__heading-holder::before, [id^="shopify-section"][id$="__cz_ugc"] .grid__heading-holder::before, [id^="shopify-section"][id$="__cz_ingredienser"] .grid__heading-holder::before, [id^="shopify-section"][id$="__cz_profiler"] .grid__heading-holder::before, [id^="shopify-section"][id$="__cz_dokumentasjon"] .grid__heading-holder::before { display: inline-block; width: auto; font-family: var(--cz-mono); font-size: 12px; font-weight: 500; letter-spacing: 0.025em; text-transform: uppercase; line-height: 1; color: var(--cz-ink, #000); padding: 9px 18px; border: 2px solid var(--cz-ink, #000); border-radius: 999px; margin-bottom: 24px; } [id^="shopify-section"][id$="__cz_slik_bruker"] .grid__heading-holder::before { content: "TRE STEG"; } [id^="shopify-section"][id$="__cz_ugc"] .grid__heading-holder::before { content: "I BRUK"; } [id^="shopify-section"][id$="__cz_ingredienser"] .grid__heading-holder::before { content: "GODT Å VITE"; } [id^="shopify-section"][id$="__cz_profiler"] .grid__heading-holder::before { content: "I HVERDAGEN"; } [id^="shopify-section"][id$="__cz_dokumentasjon"] .grid__heading-holder::before { content: "DOKUMENTASJON"; } /* ── FAQ-introen arver flate og typografi fra FAQ-seksjonen. ── */ [id^="shopify-section"][id$="__cz_faq_intro"] { background-color: var(--cz-sky, #45A2FF) !important; } [id^="shopify-section"][id$="__cz_faq_intro"] .subheading, [id^="shopify-section"][id$="__cz_faq_intro"] .rich-text__subheading { display: inline-block !important; width: auto !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; color: var(--cz-ink, #000) !important; padding: 9px 18px !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; background: transparent !important; } [id^="shopify-section"][id$="__cz_faq_intro"] h2 { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: clamp(34px, 3.4vw, 46px) !important; line-height: 1.06 !important; letter-spacing: -0.025em !important; max-width: 22ch !important; } /* ═══════════════════════════════════════════════════════ Batch 90 — Tallene bak-broen på tøyvask-arksiden. Batch 89 fulgte ikke med i Shopify-importen; cz-fonts.css sto igjen på Batch 84-versjonen. De tre andre nye seksjonene var likevel stylet, fordi Batch 84 bruker de samme seksjonsnavnene i produktmalen og suffiksmatch ikke skiller mellom maler. Bare denne seksjonen manglet regler. ═══════════════════════════════════════════════════════ */ [id^="shopify-section"][id$="__cz_tallene_bro"] { background-color: #FFFFFF !important; } [id^="shopify-section"][id$="__cz_tallene_bro"] .subheading, [id^="shopify-section"][id$="__cz_tallene_bro"] .rich-text__subheading { display: inline-block !important; width: auto !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; color: var(--cz-ink, #000) !important; padding: 9px 18px !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; background: transparent !important; } [id^="shopify-section"][id$="__cz_tallene_bro"] h2 { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: clamp(32px, 3.2vw, 44px) !important; line-height: 1.06 !important; letter-spacing: -0.025em !important; text-transform: none !important; max-width: 22ch !important; } [id^="shopify-section"][id$="__cz_tallene_bro"] .rte p { font-family: var(--cz-sans) !important; font-weight: 400 !important; font-size: 18px !important; line-height: 1.55 !important; max-width: 62ch !important; } [id^="shopify-section"][id$="__cz_tallene_bro"] .btn { font-family: var(--cz-mono) !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; border-radius: 300px !important; border: 2px solid var(--cz-ink, #000) !important; padding: 17px 30px !important; min-height: 48px !important; background: transparent !important; color: var(--cz-ink, #000) !important; transition: background-color 160ms cubic-bezier(0.22, 1, 0.36, 1), color 160ms cubic-bezier(0.22, 1, 0.36, 1), transform 120ms cubic-bezier(0.22, 1, 0.36, 1) !important; } [id^="shopify-section"][id$="__cz_tallene_bro"] .btn:hover { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__cz_tallene_bro"] .btn:active { transform: translateY(2px) !important; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__cz_tallene_bro"] h2 { font-size: clamp(26px, 7.5vw, 34px) !important; } [id^="shopify-section"][id$="__cz_tallene_bro"] .rte p { font-size: 17px !important; } } /* ═══════════════════════════════════════════════════════ Batch 91 — de to nye seksjonene på produktsidene. product.sval-lin og product.parfymefri deler seksjonsnavn, så én regel dekker begge. Suffiksmatch er malagnostisk — her er det tilsiktet, siden sidene skal se like ut. ═══════════════════════════════════════════════════════ */ [id^="shopify-section"][id$="__cz_annen_variant"] { background-color: var(--cz-off-white, #F2F2F2) !important; } [id^="shopify-section"][id$="__cz_fordypning"] { background-color: #FFFFFF !important; } [id^="shopify-section"][id$="__cz_annen_variant"] .subheading, [id^="shopify-section"][id$="__cz_fordypning"] .subheading { display: inline-block !important; width: auto !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; color: var(--cz-ink, #000) !important; padding: 9px 18px !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; background: transparent !important; } [id^="shopify-section"][id$="__cz_annen_variant"] h2, [id^="shopify-section"][id$="__cz_fordypning"] h2 { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: clamp(32px, 3.2vw, 44px) !important; line-height: 1.06 !important; letter-spacing: -0.025em !important; text-transform: none !important; max-width: 22ch !important; } [id^="shopify-section"][id$="__cz_annen_variant"] h3, [id^="shopify-section"][id$="__cz_fordypning"] h3 { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: 22px !important; line-height: 1.18 !important; letter-spacing: -0.015em !important; text-transform: none !important; } [id^="shopify-section"][id$="__cz_annen_variant"] .rte p, [id^="shopify-section"][id$="__cz_fordypning"] .rte p, [id^="shopify-section"][id$="__cz_annen_variant"] .column__text p, [id^="shopify-section"][id$="__cz_fordypning"] .column__text p, [id^="shopify-section"][id$="__cz_annen_variant"] .multicolumn-card__info p, [id^="shopify-section"][id$="__cz_fordypning"] .multicolumn-card__info p { font-family: var(--cz-sans) !important; font-weight: 400 !important; font-size: 18px !important; line-height: 1.55 !important; max-width: 62ch !important; } [id^="shopify-section"][id$="__cz_annen_variant"] .btn, [id^="shopify-section"][id$="__cz_fordypning"] .btn { font-family: var(--cz-mono) !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; border-radius: 300px !important; border: 2px solid var(--cz-ink, #000) !important; padding: 17px 30px !important; min-height: 48px !important; transition: background-color 160ms cubic-bezier(0.22, 1, 0.36, 1), color 160ms cubic-bezier(0.22, 1, 0.36, 1), transform 120ms cubic-bezier(0.22, 1, 0.36, 1) !important; } [id^="shopify-section"][id$="__cz_annen_variant"] .btn--outline, [id^="shopify-section"][id$="__cz_fordypning"] .btn--outline { background: transparent !important; color: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__cz_annen_variant"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_fordypning"] .btn--outline:hover { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__cz_annen_variant"] .btn:active, [id^="shopify-section"][id$="__cz_fordypning"] .btn:active { transform: translateY(2px) !important; } /* Fordypningskortene er tekstlenker, ikke piller — de skal ikke konkurrere med kjøpsknappen lenger oppe. */ [id^="shopify-section"][id$="__cz_fordypning"] .btn--text { border: 0 !important; border-radius: 0 !important; padding: 4px 0 !important; min-height: 0 !important; background: transparent !important; text-decoration: underline !important; text-underline-offset: 5px !important; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__cz_annen_variant"] h2, [id^="shopify-section"][id$="__cz_fordypning"] h2 { font-size: clamp(26px, 7.5vw, 34px) !important; } [id^="shopify-section"][id$="__cz_annen_variant"] .rte p, [id^="shopify-section"][id$="__cz_fordypning"] .rte p { font-size: 17px !important; } } /* ═══════════════════════════════════════════════════════ Batch 92 — butikklogoene, rettet. Liquid rendrer .logos__img med inline width OG height, beregnet fra logoens eget sideforhold. Batch 80 overstyrte høyden og satte bredden til auto — da mistet boksen sitt forhold og raden kollapset. Her skaleres Liquids egen boks i stedet, med transform-origin så baselinjen holder. ═══════════════════════════════════════════════════════ */ [id^="shopify-section"][id$="__section-press-logos"] .logos__img { transform-origin: center center; } [id^="shopify-section"][id$="__section-press-logos"] .logos__img img { width: 100% !important; height: 100% !important; object-fit: contain !important; } [id^="shopify-section"][id$="__section-press-logos"] .logos, [id^="shopify-section"][id$="__section-press-logos"] .logos__wrapper, [id^="shopify-section"][id$="__section-press-logos"] .logos__slider, [id^="shopify-section"][id$="__section-press-logos"] .logos__slide { overflow: visible !important; } [id^="shopify-section"][id$="__section-press-logos"] .logos__slide { flex: 0 0 auto !important; min-width: 0 !important; margin: 0 !important; } /* Optisk utjevning. Logoene har ulik visuell tyngde ved samme pikselbredde; skalering korrigerer uten å røre sideforholdet. */ [id^="shopify-section"][id$="__section-press-logos"] .logos__slide:nth-child(2) .logos__img { transform: scale(0.88); } [id^="shopify-section"][id$="__section-press-logos"] .logos__slide:nth-child(4) .logos__img { transform: scale(1.08); } [id^="shopify-section"][id$="__section-press-logos"] .logos__slide:nth-child(6) .logos__img { transform: scale(0.94); } @media only screen and (max-width: 1024px) { [id^="shopify-section"][id$="__section-press-logos"] .logos__slider { gap: 28px 40px !important; } } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section-press-logos"] .logos__slider { gap: 24px 32px !important; } } /* ═══════════════════════════════════════════════════════ Batch 93 — designsystemet på forsiden. Forsiden sto på Batch 80 og hadde fargemapping og logofiks, men ikke pillene og kapselknappene som produktsidene fikk i 83 og 91. Her lukkes det gapet. Scopet per seksjon framfor globalt: de globale .subheading- og .btn-reglene treffer også juridiske sider vi ikke har gjennomgått. ═══════════════════════════════════════════════════════ */ /* ── Pillen. Den globale regelen gir mono i versaler, men rendrer som en blokk. Systemets pille er en kapsel med 2 px kontur og bredde etter innhold. ── */ [id^="shopify-section"][id$="__cz_brand_premise"] .subheading, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .subheading, [id^="shopify-section"][id$="__cz_retail_text"] .subheading, [id^="shopify-section"][id$="__cz_retail_link"] .subheading, [id^="shopify-section"][id$="__section_double_eb37N3"] .subheading, [id^="shopify-section"][id$="__cz_method_preview"] .subheading, [id^="shopify-section"][id$="__cz_impact_narrative"] .subheading, [id^="shopify-section"][id$="__cz_impact_lead"] .subheading, [id^="shopify-section"][id$="__cz_impact_bridge"] .subheading, [id^="shopify-section"][id$="__cz_belief"] .subheading, [id^="shopify-section"][id$="__cz_trust_text"] .subheading, [id^="shopify-section"][id$="__cz_alex"] .subheading, [id^="shopify-section"][id$="__cz_next_category_text"] .subheading, [id^="shopify-section"][id$="__cz_brand_premise"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_retail_text"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_retail_link"] .rich-text__subheading, [id^="shopify-section"][id$="__section_double_eb37N3"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_method_preview"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_impact_narrative"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_impact_lead"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_impact_bridge"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_belief"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_trust_text"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_alex"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_next_category_text"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_brand_premise"] .section__subheading, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .section__subheading, [id^="shopify-section"][id$="__cz_retail_text"] .section__subheading, [id^="shopify-section"][id$="__cz_retail_link"] .section__subheading, [id^="shopify-section"][id$="__section_double_eb37N3"] .section__subheading, [id^="shopify-section"][id$="__cz_method_preview"] .section__subheading, [id^="shopify-section"][id$="__cz_impact_narrative"] .section__subheading, [id^="shopify-section"][id$="__cz_impact_lead"] .section__subheading, [id^="shopify-section"][id$="__cz_impact_bridge"] .section__subheading, [id^="shopify-section"][id$="__cz_belief"] .section__subheading, [id^="shopify-section"][id$="__cz_trust_text"] .section__subheading, [id^="shopify-section"][id$="__cz_alex"] .section__subheading, [id^="shopify-section"][id$="__cz_next_category_text"] .section__subheading, [id^="shopify-section"][id$="__cz_brand_premise"] .hero__subheading, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .hero__subheading, [id^="shopify-section"][id$="__cz_retail_text"] .hero__subheading, [id^="shopify-section"][id$="__cz_retail_link"] .hero__subheading, [id^="shopify-section"][id$="__section_double_eb37N3"] .hero__subheading, [id^="shopify-section"][id$="__cz_method_preview"] .hero__subheading, [id^="shopify-section"][id$="__cz_impact_narrative"] .hero__subheading, [id^="shopify-section"][id$="__cz_impact_lead"] .hero__subheading, [id^="shopify-section"][id$="__cz_impact_bridge"] .hero__subheading, [id^="shopify-section"][id$="__cz_belief"] .hero__subheading, [id^="shopify-section"][id$="__cz_trust_text"] .hero__subheading, [id^="shopify-section"][id$="__cz_alex"] .hero__subheading, [id^="shopify-section"][id$="__cz_next_category_text"] .hero__subheading { display: inline-block !important; width: auto !important; font-size: 12px !important; line-height: 1 !important; padding: 9px 18px !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; background: transparent !important; margin-bottom: 24px !important; } /* ── Knappene. Mono, ikke sans — mono bærer etikettene i systemet, og knappetekst er en etikett. ── */ [id^="shopify-section"][id$="__cz_brand_premise"] .btn, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .btn, [id^="shopify-section"][id$="__cz_retail_text"] .btn, [id^="shopify-section"][id$="__cz_retail_link"] .btn, [id^="shopify-section"][id$="__section_double_eb37N3"] .btn, [id^="shopify-section"][id$="__cz_method_preview"] .btn, [id^="shopify-section"][id$="__cz_impact_narrative"] .btn, [id^="shopify-section"][id$="__cz_impact_lead"] .btn, [id^="shopify-section"][id$="__cz_impact_bridge"] .btn, [id^="shopify-section"][id$="__cz_belief"] .btn, [id^="shopify-section"][id$="__cz_trust_text"] .btn, [id^="shopify-section"][id$="__cz_alex"] .btn, [id^="shopify-section"][id$="__cz_next_category_text"] .btn { font-family: var(--cz-mono) !important; font-size: 14px !important; letter-spacing: 0.025em !important; line-height: 1 !important; border-radius: 300px !important; border: 2px solid var(--cz-ink, #000) !important; padding: 17px 30px !important; min-height: 48px !important; transition: background-color 160ms cubic-bezier(0.22, 1, 0.36, 1), color 160ms cubic-bezier(0.22, 1, 0.36, 1), transform 120ms cubic-bezier(0.22, 1, 0.36, 1) !important; } [id^="shopify-section"][id$="__cz_brand_premise"] .btn--outline, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .btn--outline, [id^="shopify-section"][id$="__cz_retail_text"] .btn--outline, [id^="shopify-section"][id$="__cz_retail_link"] .btn--outline, [id^="shopify-section"][id$="__section_double_eb37N3"] .btn--outline, [id^="shopify-section"][id$="__cz_method_preview"] .btn--outline, [id^="shopify-section"][id$="__cz_impact_narrative"] .btn--outline, [id^="shopify-section"][id$="__cz_impact_lead"] .btn--outline, [id^="shopify-section"][id$="__cz_impact_bridge"] .btn--outline, [id^="shopify-section"][id$="__cz_belief"] .btn--outline, [id^="shopify-section"][id$="__cz_trust_text"] .btn--outline, [id^="shopify-section"][id$="__cz_alex"] .btn--outline, [id^="shopify-section"][id$="__cz_next_category_text"] .btn--outline { background: transparent !important; color: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__cz_brand_premise"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_retail_text"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_retail_link"] .btn--outline:hover, [id^="shopify-section"][id$="__section_double_eb37N3"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_method_preview"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_impact_narrative"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_impact_lead"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_impact_bridge"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_belief"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_trust_text"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_alex"] .btn--outline:hover, [id^="shopify-section"][id$="__cz_next_category_text"] .btn--outline:hover { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__cz_brand_premise"] .btn--solid, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .btn--solid, [id^="shopify-section"][id$="__cz_retail_text"] .btn--solid, [id^="shopify-section"][id$="__cz_retail_link"] .btn--solid, [id^="shopify-section"][id$="__section_double_eb37N3"] .btn--solid, [id^="shopify-section"][id$="__cz_method_preview"] .btn--solid, [id^="shopify-section"][id$="__cz_impact_narrative"] .btn--solid, [id^="shopify-section"][id$="__cz_impact_lead"] .btn--solid, [id^="shopify-section"][id$="__cz_impact_bridge"] .btn--solid, [id^="shopify-section"][id$="__cz_belief"] .btn--solid, [id^="shopify-section"][id$="__cz_trust_text"] .btn--solid, [id^="shopify-section"][id$="__cz_alex"] .btn--solid, [id^="shopify-section"][id$="__cz_next_category_text"] .btn--solid { background: var(--cz-ink, #000) !important; border-color: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__cz_brand_premise"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_retail_text"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_retail_link"] .btn--solid:hover, [id^="shopify-section"][id$="__section_double_eb37N3"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_method_preview"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_impact_narrative"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_impact_lead"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_impact_bridge"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_belief"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_trust_text"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_alex"] .btn--solid:hover, [id^="shopify-section"][id$="__cz_next_category_text"] .btn--solid:hover { background: #1A1A1A !important; border-color: #1A1A1A !important; color: #FFFFFF !important; } /* Tekstlenker er lenker, ikke piller — de skal ikke konkurrere med de faktiske knappene. */ [id^="shopify-section"][id$="__cz_brand_premise"] .btn--text, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .btn--text, [id^="shopify-section"][id$="__cz_retail_text"] .btn--text, [id^="shopify-section"][id$="__cz_retail_link"] .btn--text, [id^="shopify-section"][id$="__section_double_eb37N3"] .btn--text, [id^="shopify-section"][id$="__cz_method_preview"] .btn--text, [id^="shopify-section"][id$="__cz_impact_narrative"] .btn--text, [id^="shopify-section"][id$="__cz_impact_lead"] .btn--text, [id^="shopify-section"][id$="__cz_impact_bridge"] .btn--text, [id^="shopify-section"][id$="__cz_belief"] .btn--text, [id^="shopify-section"][id$="__cz_trust_text"] .btn--text, [id^="shopify-section"][id$="__cz_alex"] .btn--text, [id^="shopify-section"][id$="__cz_next_category_text"] .btn--text { border: 0 !important; border-radius: 0 !important; padding: 4px 0 !important; min-height: 0 !important; background: transparent !important; color: var(--cz-ink, #000) !important; text-decoration: underline !important; text-underline-offset: 5px !important; } [id^="shopify-section"][id$="__cz_brand_premise"] .btn:active, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .btn:active, [id^="shopify-section"][id$="__cz_retail_text"] .btn:active, [id^="shopify-section"][id$="__cz_retail_link"] .btn:active, [id^="shopify-section"][id$="__section_double_eb37N3"] .btn:active, [id^="shopify-section"][id$="__cz_method_preview"] .btn:active, [id^="shopify-section"][id$="__cz_impact_narrative"] .btn:active, [id^="shopify-section"][id$="__cz_impact_lead"] .btn:active, [id^="shopify-section"][id$="__cz_impact_bridge"] .btn:active, [id^="shopify-section"][id$="__cz_belief"] .btn:active, [id^="shopify-section"][id$="__cz_trust_text"] .btn:active, [id^="shopify-section"][id$="__cz_alex"] .btn:active, [id^="shopify-section"][id$="__cz_next_category_text"] .btn:active { transform: translateY(2px) !important; } /* ── Linjelengde. Seksjonene uten egen custom_css får samme mål som de andre: overskrift 22ch, brødtekst 60ch. ── */ [id^="shopify-section"][id$="__cz_brand_premise"] h2, [id^="shopify-section"][id$="__cz_retail_text"] h2, [id^="shopify-section"][id$="__cz_retail_link"] h2, [id^="shopify-section"][id$="__cz_method_preview"] h2, [id^="shopify-section"][id$="__cz_impact_narrative"] h2, [id^="shopify-section"][id$="__cz_impact_lead"] h2, [id^="shopify-section"][id$="__cz_impact_bridge"] h2, [id^="shopify-section"][id$="__cz_belief"] h2, [id^="shopify-section"][id$="__cz_trust_text"] h2, [id^="shopify-section"][id$="__cz_next_category_text"] h2, [id^="shopify-section"][id$="__cz_brand_premise"] .section__heading, [id^="shopify-section"][id$="__cz_retail_text"] .section__heading, [id^="shopify-section"][id$="__cz_retail_link"] .section__heading, [id^="shopify-section"][id$="__cz_method_preview"] .section__heading, [id^="shopify-section"][id$="__cz_impact_narrative"] .section__heading, [id^="shopify-section"][id$="__cz_impact_lead"] .section__heading, [id^="shopify-section"][id$="__cz_impact_bridge"] .section__heading, [id^="shopify-section"][id$="__cz_belief"] .section__heading, [id^="shopify-section"][id$="__cz_trust_text"] .section__heading, [id^="shopify-section"][id$="__cz_next_category_text"] .section__heading { max-width: 22ch !important; } [id^="shopify-section"][id$="__cz_brand_premise"] .rte p, [id^="shopify-section"][id$="__cz_retail_text"] .rte p, [id^="shopify-section"][id$="__cz_retail_link"] .rte p, [id^="shopify-section"][id$="__cz_method_preview"] .rte p, [id^="shopify-section"][id$="__cz_impact_narrative"] .rte p, [id^="shopify-section"][id$="__cz_impact_lead"] .rte p, [id^="shopify-section"][id$="__cz_impact_bridge"] .rte p, [id^="shopify-section"][id$="__cz_belief"] .rte p, [id^="shopify-section"][id$="__cz_trust_text"] .rte p, [id^="shopify-section"][id$="__cz_next_category_text"] .rte p, [id^="shopify-section"][id$="__cz_brand_premise"] .rich-text__text, [id^="shopify-section"][id$="__cz_retail_text"] .rich-text__text, [id^="shopify-section"][id$="__cz_retail_link"] .rich-text__text, [id^="shopify-section"][id$="__cz_method_preview"] .rich-text__text, [id^="shopify-section"][id$="__cz_impact_narrative"] .rich-text__text, [id^="shopify-section"][id$="__cz_impact_lead"] .rich-text__text, [id^="shopify-section"][id$="__cz_impact_bridge"] .rich-text__text, [id^="shopify-section"][id$="__cz_belief"] .rich-text__text, [id^="shopify-section"][id$="__cz_trust_text"] .rich-text__text, [id^="shopify-section"][id$="__cz_next_category_text"] .rich-text__text { max-width: 60ch !important; } /* Sitatflaten står alene og tåler bredere mål. */ [id^="shopify-section"][id$="__cz_belief"] h2, [id^="shopify-section"][id$="__cz_belief"] .section__heading { max-width: 26ch !important; } /* Impact-kapittelet er tre seksjoner som leses som ett. Uten dette får de dobbel luft mellom seg. */ [id^="shopify-section"][id$="__cz_impact_lead"] { padding-bottom: 0 !important; } [id^="shopify-section"][id$="__cz_impact_bridge"] { padding-top: 0 !important; } /* ═══════════════════════════════════════════════════════ Batch 94 — pilleform og logorad, etter visuell kontroll. ═══════════════════════════════════════════════════════ */ /* Pillen lå som flex-barn og ble strukket til full bredde. inline-block hjelper ikke der — et flex-barn strekkes av align-items: stretch uansett display. fit-content og align-self er det som faktisk krymper boksen. */ [id^="shopify-section"][id$="__cz_brand_premise"] .subheading, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .subheading, [id^="shopify-section"][id$="__cz_retail_text"] .subheading, [id^="shopify-section"][id$="__cz_retail_link"] .subheading, [id^="shopify-section"][id$="__section_double_eb37N3"] .subheading, [id^="shopify-section"][id$="__cz_method_preview"] .subheading, [id^="shopify-section"][id$="__cz_impact_narrative"] .subheading, [id^="shopify-section"][id$="__cz_impact_lead"] .subheading, [id^="shopify-section"][id$="__cz_impact_bridge"] .subheading, [id^="shopify-section"][id$="__cz_belief"] .subheading, [id^="shopify-section"][id$="__cz_trust_text"] .subheading, [id^="shopify-section"][id$="__cz_alex"] .subheading, [id^="shopify-section"][id$="__cz_next_category_text"] .subheading, [id^="shopify-section"][id$="__cz_brand_premise"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_retail_text"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_retail_link"] .rich-text__subheading, [id^="shopify-section"][id$="__section_double_eb37N3"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_method_preview"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_impact_narrative"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_impact_lead"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_impact_bridge"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_belief"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_trust_text"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_alex"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_next_category_text"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_brand_premise"] .section__subheading, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .section__subheading, [id^="shopify-section"][id$="__cz_retail_text"] .section__subheading, [id^="shopify-section"][id$="__cz_retail_link"] .section__subheading, [id^="shopify-section"][id$="__section_double_eb37N3"] .section__subheading, [id^="shopify-section"][id$="__cz_method_preview"] .section__subheading, [id^="shopify-section"][id$="__cz_impact_narrative"] .section__subheading, [id^="shopify-section"][id$="__cz_impact_lead"] .section__subheading, [id^="shopify-section"][id$="__cz_impact_bridge"] .section__subheading, [id^="shopify-section"][id$="__cz_belief"] .section__subheading, [id^="shopify-section"][id$="__cz_trust_text"] .section__subheading, [id^="shopify-section"][id$="__cz_alex"] .section__subheading, [id^="shopify-section"][id$="__cz_next_category_text"] .section__subheading, [id^="shopify-section"][id$="__cz_brand_premise"] .hero__subheading, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .hero__subheading, [id^="shopify-section"][id$="__cz_retail_text"] .hero__subheading, [id^="shopify-section"][id$="__cz_retail_link"] .hero__subheading, [id^="shopify-section"][id$="__section_double_eb37N3"] .hero__subheading, [id^="shopify-section"][id$="__cz_method_preview"] .hero__subheading, [id^="shopify-section"][id$="__cz_impact_narrative"] .hero__subheading, [id^="shopify-section"][id$="__cz_impact_lead"] .hero__subheading, [id^="shopify-section"][id$="__cz_impact_bridge"] .hero__subheading, [id^="shopify-section"][id$="__cz_belief"] .hero__subheading, [id^="shopify-section"][id$="__cz_trust_text"] .hero__subheading, [id^="shopify-section"][id$="__cz_alex"] .hero__subheading, [id^="shopify-section"][id$="__cz_next_category_text"] .hero__subheading, [id^="shopify-section"][id$="__cz_brand_premise"] .section-label, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .section-label, [id^="shopify-section"][id$="__cz_retail_text"] .section-label, [id^="shopify-section"][id$="__cz_retail_link"] .section-label, [id^="shopify-section"][id$="__section_double_eb37N3"] .section-label, [id^="shopify-section"][id$="__cz_method_preview"] .section-label, [id^="shopify-section"][id$="__cz_impact_narrative"] .section-label, [id^="shopify-section"][id$="__cz_impact_lead"] .section-label, [id^="shopify-section"][id$="__cz_impact_bridge"] .section-label, [id^="shopify-section"][id$="__cz_belief"] .section-label, [id^="shopify-section"][id$="__cz_trust_text"] .section-label, [id^="shopify-section"][id$="__cz_alex"] .section-label, [id^="shopify-section"][id$="__cz_next_category_text"] .section-label { display: inline-block !important; width: fit-content !important; max-width: fit-content !important; align-self: flex-start !important; flex: 0 0 auto !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; padding: 9px 18px !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; background: transparent !important; color: var(--cz-ink, #000) !important; margin: 0 0 24px 0 !important; } /* Sentrerte seksjoner skal ha pillen sentrert, ikke venstrestilt. */ [id^="shopify-section"][id$="__cz_brand_premise"] .text-center .subheading, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .text-center .subheading, [id^="shopify-section"][id$="__cz_retail_text"] .text-center .subheading, [id^="shopify-section"][id$="__cz_retail_link"] .text-center .subheading, [id^="shopify-section"][id$="__section_double_eb37N3"] .text-center .subheading, [id^="shopify-section"][id$="__cz_method_preview"] .text-center .subheading, [id^="shopify-section"][id$="__cz_impact_narrative"] .text-center .subheading, [id^="shopify-section"][id$="__cz_impact_lead"] .text-center .subheading, [id^="shopify-section"][id$="__cz_impact_bridge"] .text-center .subheading, [id^="shopify-section"][id$="__cz_belief"] .text-center .subheading, [id^="shopify-section"][id$="__cz_trust_text"] .text-center .subheading, [id^="shopify-section"][id$="__cz_alex"] .text-center .subheading, [id^="shopify-section"][id$="__cz_next_category_text"] .text-center .subheading, [id^="shopify-section"][id$="__cz_brand_premise"] .text-center .section-label, [id^="shopify-section"][id$="__cz_toyvask_chapter"] .text-center .section-label, [id^="shopify-section"][id$="__cz_retail_text"] .text-center .section-label, [id^="shopify-section"][id$="__cz_retail_link"] .text-center .section-label, [id^="shopify-section"][id$="__section_double_eb37N3"] .text-center .section-label, [id^="shopify-section"][id$="__cz_method_preview"] .text-center .section-label, [id^="shopify-section"][id$="__cz_impact_narrative"] .text-center .section-label, [id^="shopify-section"][id$="__cz_impact_lead"] .text-center .section-label, [id^="shopify-section"][id$="__cz_impact_bridge"] .text-center .section-label, [id^="shopify-section"][id$="__cz_belief"] .text-center .section-label, [id^="shopify-section"][id$="__cz_trust_text"] .text-center .section-label, [id^="shopify-section"][id$="__cz_alex"] .text-center .section-label, [id^="shopify-section"][id$="__cz_next_category_text"] .text-center .section-label { align-self: center !important; margin-left: auto !important; margin-right: auto !important; } /* ── Logoraden. Seks logoer brakk til to linjer med Oda alene. Grid med seks like kolonner holder dem på én rad og gir jevn optisk avstand uten å røre sideforholdene. ── */ [id^="shopify-section"][id$="__section-press-logos"] .logos__slider { display: grid !important; grid-template-columns: repeat(6, 1fr) !important; align-items: center !important; justify-items: center !important; gap: 0 32px !important; } @media only screen and (max-width: 989px) { [id^="shopify-section"][id$="__section-press-logos"] .logos__slider { grid-template-columns: repeat(3, 1fr) !important; gap: 32px 24px !important; } } @media only screen and (max-width: 599px) { [id^="shopify-section"][id$="__section-press-logos"] .logos__slider { grid-template-columns: repeat(2, 1fr) !important; gap: 28px 20px !important; } } /* ═══════════════════════════════════════════════════════ Batch 95 — designsystemet på resten av /pages/ark. Batch 89 og 90 dekket bare de fire nye seksjonene. De tretten øvrige rendret med Broadcast-standard: firkantede knapper, sans der mono hører hjemme, og limefylt primærknapp fra temaets --COLOR-ACCENT. ═══════════════════════════════════════════════════════ */ /* ── Knapper. Kapsel, mono i versaler, 2 px sort kontur. Dekker både Broadcast-knapper og de dedikerte seksjonenes egne knappeklasser. ── */ [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .btn, [id^="shopify-section"][id$="__section_double_iQXKYw"] .btn, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .btn, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .btn, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .btn, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .btn, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .btn, [id^="shopify-section"][id$="__section_double_d4Rdam"] .btn, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .btn, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .btn, [id^="shopify-section"][id$="__contact_form_jxTya4"] .btn, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .btn, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__btn, [id^="shopify-section"][id$="__section_double_iQXKYw"] .cz-hero__btn, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .cz-hero__btn, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .cz-hero__btn, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .cz-hero__btn, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .cz-hero__btn, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .cz-hero__btn, [id^="shopify-section"][id$="__section_double_d4Rdam"] .cz-hero__btn, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-hero__btn, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-hero__btn, [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-hero__btn, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .cz-hero__btn, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .cz-hero__btn, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__section_double_iQXKYw"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__section_double_d4Rdam"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__section_double_iQXKYw"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__section_double_d4Rdam"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-kp__btn, [id^="shopify-section"][id$="__section_double_iQXKYw"] .cz-kp__btn, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .cz-kp__btn, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .cz-kp__btn, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .cz-kp__btn, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .cz-kp__btn, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .cz-kp__btn, [id^="shopify-section"][id$="__section_double_d4Rdam"] .cz-kp__btn, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-kp__btn, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-kp__btn, [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__btn, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .cz-kp__btn, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .cz-kp__btn { font-family: var(--cz-mono) !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; border-radius: 300px !important; border: 2px solid var(--cz-ink, #000) !important; padding: 17px 30px !important; min-height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; transition: background-color 160ms cubic-bezier(0.22, 1, 0.36, 1), color 160ms cubic-bezier(0.22, 1, 0.36, 1), transform 120ms cubic-bezier(0.22, 1, 0.36, 1) !important; } /* Primærknappen er sort, ikke lime. Lime er en bakgrunnsflate i systemet — som knappefyll kolliderer den med de sorte knappene lenger nede på samme side. */ [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__btn, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__cta-btn, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__cta-btn, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .btn--solid, [id^="shopify-section"][id$="__section_double_iQXKYw"] .btn--solid, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .btn--solid, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .btn--solid, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .btn--solid, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .btn--solid, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .btn--solid, [id^="shopify-section"][id$="__section_double_d4Rdam"] .btn--solid, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .btn--solid, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .btn--solid, [id^="shopify-section"][id$="__contact_form_jxTya4"] .btn--solid, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .btn--solid, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn--solid { background: var(--cz-ink, #000) !important; border-color: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__btn:hover, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__cta-btn:hover, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__cta-btn:hover, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .btn--solid:hover, [id^="shopify-section"][id$="__section_double_iQXKYw"] .btn--solid:hover, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .btn--solid:hover, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .btn--solid:hover, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .btn--solid:hover, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .btn--solid:hover, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .btn--solid:hover, [id^="shopify-section"][id$="__section_double_d4Rdam"] .btn--solid:hover, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .btn--solid:hover, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .btn--solid:hover, [id^="shopify-section"][id$="__contact_form_jxTya4"] .btn--solid:hover, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .btn--solid:hover, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn--solid:hover { background: #1A1A1A !important; border-color: #1A1A1A !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__btn--secondary, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .btn--outline, [id^="shopify-section"][id$="__section_double_iQXKYw"] .btn--outline, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .btn--outline, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .btn--outline, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .btn--outline, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .btn--outline, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .btn--outline, [id^="shopify-section"][id$="__section_double_d4Rdam"] .btn--outline, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .btn--outline, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .btn--outline, [id^="shopify-section"][id$="__contact_form_jxTya4"] .btn--outline, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .btn--outline, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn--outline { background: transparent !important; border-color: var(--cz-ink, #000) !important; color: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__btn--secondary:hover, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .btn--outline:hover, [id^="shopify-section"][id$="__section_double_iQXKYw"] .btn--outline:hover, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .btn--outline:hover, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .btn--outline:hover, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .btn--outline:hover, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .btn--outline:hover, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .btn--outline:hover, [id^="shopify-section"][id$="__section_double_d4Rdam"] .btn--outline:hover, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .btn--outline:hover, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .btn--outline:hover, [id^="shopify-section"][id$="__contact_form_jxTya4"] .btn--outline:hover, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .btn--outline:hover, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn--outline:hover { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .btn:active, [id^="shopify-section"][id$="__section_double_iQXKYw"] .btn:active, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .btn:active, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .btn:active, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .btn:active, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .btn:active, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .btn:active, [id^="shopify-section"][id$="__section_double_d4Rdam"] .btn:active, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .btn:active, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .btn:active, [id^="shopify-section"][id$="__contact_form_jxTya4"] .btn:active, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .btn:active, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn:active, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__btn:active { transform: translateY(2px) !important; } /* Tekstlenker forblir lenker. */ [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .btn--text, [id^="shopify-section"][id$="__section_double_iQXKYw"] .btn--text, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .btn--text, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .btn--text, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .btn--text, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .btn--text, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .btn--text, [id^="shopify-section"][id$="__section_double_d4Rdam"] .btn--text, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .btn--text, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .btn--text, [id^="shopify-section"][id$="__contact_form_jxTya4"] .btn--text, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .btn--text, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn--text { border: 0 !important; border-radius: 0 !important; padding: 4px 0 !important; min-height: 0 !important; background: transparent !important; color: var(--cz-ink, #000) !important; text-decoration: underline !important; text-underline-offset: 5px !important; } /* ── Pillene. fit-content og align-self, ellers strekkes de av flex-forelderen. Samme feil som forsiden hadde. ── */ [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .subheading, [id^="shopify-section"][id$="__section_double_iQXKYw"] .subheading, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .subheading, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .subheading, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .subheading, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .subheading, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .subheading, [id^="shopify-section"][id$="__section_double_d4Rdam"] .subheading, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .subheading, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .subheading, [id^="shopify-section"][id$="__contact_form_jxTya4"] .subheading, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .subheading, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .subheading, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .section-label, [id^="shopify-section"][id$="__section_double_iQXKYw"] .section-label, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .section-label, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .section-label, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .section-label, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .section-label, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .section-label, [id^="shopify-section"][id$="__section_double_d4Rdam"] .section-label, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .section-label, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .section-label, [id^="shopify-section"][id$="__contact_form_jxTya4"] .section-label, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .section-label, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .section-label, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .rich-text__subheading, [id^="shopify-section"][id$="__section_double_iQXKYw"] .rich-text__subheading, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .rich-text__subheading, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .rich-text__subheading, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .rich-text__subheading, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .rich-text__subheading, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .rich-text__subheading, [id^="shopify-section"][id$="__section_double_d4Rdam"] .rich-text__subheading, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .rich-text__subheading, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .rich-text__subheading, [id^="shopify-section"][id$="__contact_form_jxTya4"] .rich-text__subheading, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .rich-text__subheading, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .rich-text__subheading, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .hero__subheading, [id^="shopify-section"][id$="__section_double_iQXKYw"] .hero__subheading, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .hero__subheading, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .hero__subheading, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .hero__subheading, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .hero__subheading, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .hero__subheading, [id^="shopify-section"][id$="__section_double_d4Rdam"] .hero__subheading, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .hero__subheading, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .hero__subheading, [id^="shopify-section"][id$="__contact_form_jxTya4"] .hero__subheading, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .hero__subheading, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .hero__subheading, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__tag, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__tag, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__tag, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-kp__label, [id^="shopify-section"][id$="__section_double_iQXKYw"] .cz-kp__label, [id^="shopify-section"][id$="__concept_zero_pill_label_fKwH9k"] .cz-kp__label, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .cz-kp__label, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .cz-kp__label, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .cz-kp__label, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .cz-kp__label, [id^="shopify-section"][id$="__section_double_d4Rdam"] .cz-kp__label, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-kp__label, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-kp__label, [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__label, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .cz-kp__label, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .cz-kp__label { display: inline-block !important; width: fit-content !important; max-width: fit-content !important; align-self: flex-start !important; flex: 0 0 auto !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; padding: 9px 18px !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; background: transparent !important; color: var(--cz-ink, #000) !important; margin: 0 0 24px 0 !important; } /* Kortetikettene inne i rutenettene er ikke piller — de er småtekst over korttittelen. Ellers får siden piller overalt. */ [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__card-label, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__card-label { border: 0 !important; border-radius: 0 !important; padding: 0 !important; font-size: 11px !important; margin-bottom: 10px !important; } /* ── Rutenettene. Tre kort skal fylle raden; fire kolonner etterlot en tom grå celle. ── */ [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__grid { grid-template-columns: repeat(3, 1fr) !important; } [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__grid { grid-template-columns: repeat(2, 1fr) !important; } @media only screen and (max-width: 989px) { [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__grid, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__grid { grid-template-columns: 1fr !important; } } /* ═══════════════════════════════════════════════════════ Batch 96 — etter andre visuelle kontroll av /pages/ark. ═══════════════════════════════════════════════════════ */ /* Knappen heter .cz-ing__btn, ikke .cz-ing__cta-btn. Batch 95 traff derfor ikke, og «Se ingrediensene» sto igjen firkantet. */ [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__btn { font-family: var(--cz-mono) !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; border-radius: 300px !important; border: 2px solid var(--cz-ink, #000) !important; background: var(--cz-ink, #000) !important; color: #FFFFFF !important; padding: 17px 30px !important; min-height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__btn:hover { background: #1A1A1A !important; border-color: #1A1A1A !important; } [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__btn:active { transform: translateY(2px) !important; } /* Ingredienslisten rendres uansett om den har innhold. Med tomme felter ble den en hvit boks på 36 px padding midt på siden. Skjul den når den ikke har noen piller. */ [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__list-wrap:not(:has(.cz-ing__pill)) { display: none !important; } /* ── Luft. Seksjonene har 100 px topp og bunn hver, som gir 200 px mellom to naboer. Designspesifikasjonen sier 88–104 px for en hel overgang, ikke per seksjon. ── */ [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof { padding-top: 88px !important; padding-bottom: 88px !important; } /* ── Loox. Sitatet fylte nesten en hel skjermhøyde og ble sidens visuelle sentrum. Widgeten er sosialt bevis, ikke en overskrift. ── */ [id^="shopify-section"][id$="__1773867031da886b0c"] .loox-reviews-default .loox-review-text, [id^="shopify-section"][id$="__1773867031da886b0c"] [class*="loox"] [class*="review-text"], [id^="shopify-section"][id$="__1773867031da886b0c"] blockquote { font-size: 22px !important; line-height: 1.35 !important; max-width: 46ch !important; margin-left: auto !important; margin-right: auto !important; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof { padding-top: 64px !important; padding-bottom: 64px !important; } [id^="shopify-section"][id$="__1773867031da886b0c"] blockquote { font-size: 19px !important; } } /* ═══════════════════════════════════════════════════════ Batch 97 — sitat, FAQ og ingrediensrutenettet. ═══════════════════════════════════════════════════════ */ /* FAQ-lenken var et skarpt rektangel. Egen klasse, derfor utenfor Batch 95. */ [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .cz-faq__link { font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; border-radius: 999px !important; border: 2px solid var(--cz-ink, #000) !important; background: var(--cz-ink, #000) !important; color: #FFFFFF !important; padding: 17px 30px !important; min-height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: fit-content !important; } [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] .cz-faq__link:hover { background: #1A1A1A !important; border-color: #1A1A1A !important; } /* Sitatet skal stå sentrert som én blokk. Avsenderen er småtekst under, ikke en etikett. */ [id^="shopify-section"][id$="__section_double_aq7Ahw"] .hero__content, [id^="shopify-section"][id$="__section_double_aq7Ahw"] .section__content { align-items: center !important; text-align: center !important; } [id^="shopify-section"][id$="__section_double_aq7Ahw"] h3 { max-width: 24ch !important; margin-left: auto !important; margin-right: auto !important; } [id^="shopify-section"][id$="__section_double_aq7Ahw"] .rte p { font-family: var(--cz-mono) !important; font-size: 12px !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; margin-left: auto !important; margin-right: auto !important; } /* Ingredienskortene lå i to kolonner med stor luft mellom. To korte kort ved siden av hverandre, med hårstrek som skille i stedet for tomrom. */ @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__card + .cz-ing__card { padding-left: 0 !important; border-left: 0 !important; } } /* Batch 97b — kortetikettene i profilseksjonen gjentok pilleteksten tre ganger. Nummeret er nok som markør. */ [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__card-label { display: none !important; } [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__num { margin-bottom: 20px !important; } /* ═══════════════════════════════════════════════════════ Batch 98 — «Det du lurer på» i to spalter (variant 1a). Overskriften holder venstre spalte, kortene stables til høyre med hårstrek mellom. Seksjonen har lite innhold; to spalter fyller flaten uten å love mer enn den har. ═══════════════════════════════════════════════════════ */ [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__inner { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 56px !important; align-items: start !important; } [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__top { grid-column: 1 !important; } [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__title { max-width: 14ch !important; } [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__grid { grid-column: 2 !important; grid-template-columns: 1fr !important; gap: 0 !important; border-top: 1px solid var(--cz-ink, #000) !important; margin: 0 !important; } [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__card { padding: 26px 0 !important; border-bottom: 1px solid var(--cz-ink, #000) !important; background: transparent !important; } /* Nummereringen antydet en rekkefølge som ikke finnes — dette er to innganger, ikke to steg. */ [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__num { display: block !important; margin-bottom: 14px !important; } /* Uten fottekst skal knappen stå til venstre, ikke skyves ut mot høyre kant av en tom rad. */ [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__footer { justify-content: flex-start !important; border-top: 0 !important; margin-top: 0 !important; } [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__footer { grid-column: 2 !important; padding-top: 26px !important; } @media only screen and (max-width: 989px) { [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__inner { grid-template-columns: 1fr !important; gap: 32px !important; } [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__top, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__grid, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__footer { grid-column: 1 !important; } [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__title { max-width: 20ch !important; } } /* Batch 99 — variantveiledningen er nå tre avsnitt, ikke én linje. Feltet trengte lesbar bredde og luft mellom avsnitt. */ [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__cta-text { max-width: 54ch !important; } [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__cta-text p { margin: 0 0 10px !important; font-size: 15px !important; line-height: 1.55 !important; } [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__cta-text p:last-child { margin-bottom: 0 !important; } [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__cta { align-items: flex-start !important; gap: 24px !important; } /* Batch 100 — tomme piller rendres som nakne kapsler. :empty fanger dem uten å røre de utfylte. */ [id^="shopify-section"] .cz-faq__tag:empty, [id^="shopify-section"] .cz-prof__tag:empty, [id^="shopify-section"] .cz-ing__tag:empty, [id^="shopify-section"] .cz-hero__tag:empty { display: none !important; } /* ═══════════════════════════════════════════════════════ Batch 101 — fargekartet for /pages/ark. Nitten seksjoner hadde ni ulike fargeoppsett, tre av dem UUID-schemas ingen kunne lese. Her settes flaten per seksjon etter funksjon: blått forklarer, fersken nyanserer, lime dokumenterer, hvit og off-white bærer produkt og proof, sort avslutter. Fem fargehendelser: blå på 2, fersken på 7, blå på 9, lime på 12, sort på 16. Schemaene i Theme Editor er urørt — de gjelder fortsatt andre maler. ═══════════════════════════════════════════════════════ */ /* hero — produkt og kjøp */ [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"], [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] > .section-padding, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] > section, [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] > div { background-color: #FFFFFF !important; } /* Hva er vaskeark — læring */ [id^="shopify-section"][id$="__section_rich_text_xfCQKg"], [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] > .section-padding, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] > section, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] > div { background-color: var(--cz-sky, #45A2FF) !important; } /* velg variant — produkt */ [id^="shopify-section"][id$="__section_double_iQXKYw"], [id^="shopify-section"][id$="__section_double_iQXKYw"] > .section-padding, [id^="shopify-section"][id$="__section_double_iQXKYw"] > section, [id^="shopify-section"][id$="__section_double_iQXKYw"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* kundesitat — proof */ [id^="shopify-section"][id$="__section_double_aq7Ahw"], [id^="shopify-section"][id$="__section_double_aq7Ahw"] > .section-padding, [id^="shopify-section"][id$="__section_double_aq7Ahw"] > section, [id^="shopify-section"][id$="__section_double_aq7Ahw"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* slik bruker du — limeplater beholdes på ikonene */ [id^="shopify-section"][id$="__section_columns_xGj9P6"], [id^="shopify-section"][id$="__section_columns_xGj9P6"] > .section-padding, [id^="shopify-section"][id$="__section_columns_xGj9P6"] > section, [id^="shopify-section"][id$="__section_columns_xGj9P6"] > div { background-color: #FFFFFF !important; } /* UGC — bevis på bruk, ikke impact */ [id^="shopify-section"][id$="__section_social_videos_NFxWRc"], [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] > .section-padding, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] > section, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* ærlig talt — nyansering */ [id^="shopify-section"][id$="__section_double_d4Rdam"], [id^="shopify-section"][id$="__section_double_d4Rdam"] > .section-padding, [id^="shopify-section"][id$="__section_double_d4Rdam"] > section, [id^="shopify-section"][id$="__section_double_d4Rdam"] > div { background-color: var(--cz-peach, #FFA683) !important; } /* Loox — proof */ [id^="shopify-section"][id$="__1773867031da886b0c"], [id^="shopify-section"][id$="__1773867031da886b0c"] > .section-padding, [id^="shopify-section"][id$="__1773867031da886b0c"] > section, [id^="shopify-section"][id$="__1773867031da886b0c"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* sensitiv hud — læring */ [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"], [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] > .section-padding, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] > section, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] > div { background-color: var(--cz-sky, #45A2FF) !important; } /* passer det for meg — relevans, lav flate før beslutningen */ [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"], [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] > .section-padding, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] > section, [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* sammenligning */ [id^="shopify-section"][id$="__contact_form_jxTya4"], [id^="shopify-section"][id$="__contact_form_jxTya4"] > .section-padding, [id^="shopify-section"][id$="__contact_form_jxTya4"] > section, [id^="shopify-section"][id$="__contact_form_jxTya4"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* tallene — impact og dokumentasjon */ [id^="shopify-section"][id$="__cz_tallene_bro"], [id^="shopify-section"][id$="__cz_tallene_bro"] > .section-padding, [id^="shopify-section"][id$="__cz_tallene_bro"] > section, [id^="shopify-section"][id$="__cz_tallene_bro"] > div { background-color: var(--cz-lime, #BDD14B) !important; } /* FAQ — fordypning */ [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"], [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] > .section-padding, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] > section, [id^="shopify-section"][id$="__concept_zero_faq_side_eNmLcH"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* tre merker — nøytral flate for tredjepart */ [id^="shopify-section"][id$="__cz_dokumentasjon"], [id^="shopify-section"][id$="__cz_dokumentasjon"] > .section-padding, [id^="shopify-section"][id$="__cz_dokumentasjon"] > section, [id^="shopify-section"][id$="__cz_dokumentasjon"] > div { background-color: #FFFFFF !important; } /* butikk — ett kapittel med logoene */ [id^="shopify-section"][id$="__cz_butikk_tekst"], [id^="shopify-section"][id$="__cz_butikk_tekst"] > .section-padding, [id^="shopify-section"][id$="__cz_butikk_tekst"] > section, [id^="shopify-section"][id$="__cz_butikk_tekst"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* avslutning — sterk sluttflate */ [id^="shopify-section"][id$="__section_rich_text_nxJnRg"], [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] > .section-padding, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] > section, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] > div { background-color: var(--cz-ink, #000000) !important; } /* butikklogoer — samme flate som teksten over. Seksjonen heter cz_butikklogoer; Batch 101 scopet feil og lot temaets eget limescheme stå. */ [id^="shopify-section"][id$="__cz_butikklogoer"], [id^="shopify-section"][id$="__cz_butikklogoer"] > .section-padding, [id^="shopify-section"][id$="__cz_butikklogoer"] > section, [id^="shopify-section"][id$="__cz_butikklogoer"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* ── Avslutningen står på sort. Alt som var sort må inverteres, ellers forsvinner det i flaten. ── */ [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] h1, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] h2, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] h3, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] p, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .rte, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .rte * { color: #FFFFFF !important; } [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .subheading, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .rich-text__subheading { color: #FFFFFF !important; border-color: #FFFFFF !important; } [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn { background: #FFFFFF !important; border-color: #FFFFFF !important; color: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn:hover { background: var(--cz-off-white, #F2F2F2) !important; border-color: var(--cz-off-white, #F2F2F2) !important; color: var(--cz-ink, #000) !important; } /* Den andre knappen skal ikke ha samme tyngde som den første. */ [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn--outline, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn:last-of-type { background: transparent !important; border-color: #FFFFFF !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn--outline:hover, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .btn:last-of-type:hover { background: #FFFFFF !important; color: var(--cz-ink, #000) !important; } /* ── Sammenligningen: platen bak CONCEPT ZERO var lime, som gjorde fargen til et vinnersignal. Sort er systemets egen uthevingsfarge. ── */ [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__col--new .cz-kp__col-head { background: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__col--new .cz-kp__col-name { color: #FFFFFF !important; } [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__col--new .cz-kp__col-sub { color: #D9D9D9 !important; } /* Kolonnekroppen sto på en limetint. Den skal være hvit, så uthevingen ligger i hodet og hårstrekene — ikke i flaten. */ [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__col--new { background: #FFFFFF !important; } [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__col--new .cz-kp__item:hover { background: var(--cz-off-white, #F2F2F2) !important; } /* ── Dividerne. Fargeskiftet skiller allerede; linje, farge og luft samtidig er ett virkemiddel for mye. ── */ [id^="shopify-section"][id$="__section-divider"], [id^="shopify-section"][id$="__section_divider"] { display: none !important; } /* ── Blåflatene: pillene og hårstrekene er sorte i systemet, og holder kontrast mot himmelblå. Knappene beholder sort fyll — det er den sterkeste kontrasten mot blått. ── */ [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .btn--text, [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing__btn { color: var(--cz-ink, #000) !important; } /* Batch 102 — «Hvorfor vaskeark?» er nå tre rader uten statrad, fri-for-piller eller knapper. Tomme containere ut. */ [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__stats:not(:has(.cz-kp__stat-value:not(:empty))), [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__fri:not(:has(.cz-kp__pill:not(:empty))), [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__actions:not(:has(a)) { display: none !important; } [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__item { padding-top: 26px !important; padding-bottom: 26px !important; } /* Avslutningslinjen er seksjonens konklusjon, ikke en CTA-innledning. Den skal ha vekt og luft over seg. */ [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__cta-text { font-size: 19px !important; line-height: 1.45 !important; max-width: 44ch !important; margin-top: 8px !important; } /* ── Batch 103 — midtpartiet komprimert fra tre stopp til to: relevans på off-white, variantvalget på himmelblått. Relevansseksjonen har mistet fotsonen; den rendres fortsatt, så den tomme flaten må skjules. ── */ [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof__cta:not(:has(a)):not(:has(p:not(:empty))) { display: none !important; } [id^="shopify-section"][id$="__concept_zero_profiler_J9NmG6"] .cz-prof { padding-bottom: 72px !important; } /* Valget er et beslutningsøyeblikk og tåler mer luft enn teaseren den erstatter. */ [id^="shopify-section"][id$="__concept_zero_ingredienser_tVnxtJ"] .cz-ing { padding-top: 104px !important; padding-bottom: 104px !important; } /* Batch 104 — luft i «Hva er vaskeark?». Seksjonen sto med 42 px topp fra da den lå lenger ned på siden; nå ligger den rett under heroen og skal ha samme luft over som under. */ [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .rte p { margin: 0 0 14px !important; line-height: 1.55 !important; } [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .rte p:last-child { margin-bottom: 0 !important; } [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .rte p:empty { display: none !important; } /* ═══════════════════════════════════════════════════════ Batch 105 — dokumentasjonsrekken. Bildefeltene er tomme, og Broadcast fyller da hele kolonnebredden med en plassholder — 700 px kvadrater for tre små merker. Boksen kappes her, så rekken holder skala også når Mari har lagt inn de faktiske filene. ═══════════════════════════════════════════════════════ */ /* FJERNET 2026-09-07 - motstridende bilderamme-bredde, arsak til at bildene i Dokumentasjon ikke vises normalt. Original bevart under, se rapport: [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image, [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image-wrapper, [id^="shopify-section"][id$="__cz_dokumentasjon"] .multicolumn-card__image-wrapper { width: 100% !important; max-width: 132px !important; margin: 0 auto 22px !important; } */ /* FJERNET 2026-09-07 - motstridende bildehoyde-regel, arsak til at bildene i Dokumentasjon ikke vises normalt. Original bevart under, se rapport: [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image img, [id^="shopify-section"][id$="__cz_dokumentasjon"] .multicolumn-card img, [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image svg { width: auto !important; max-width: 100% !important; height: 88px !important; object-fit: contain !important; margin: 0 auto !important; display: block !important; } */ /* Plassholderen tegnes som en flate med fast sideforhold — den må ha samme høyde som et ekte merke. */ /* FJERNET 2026-09-07 - motstridende hoyde-begrensning pa plassholder/bilde-wrapper, arsak til at bildene i Dokumentasjon ikke vises normalt. Original bevart under, se rapport: [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image [class*="placeholder"], [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image .lazy-image, [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image > div { height: 88px !important; padding-bottom: 0 !important; min-height: 0 !important; } */ /* Merketitlene kjørte som seksjonsoverskrifter. De er korttitler — H3-grad, ikke H2. */ [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__title, [id^="shopify-section"][id$="__cz_dokumentasjon"] h3 { font-size: 19px !important; line-height: 1.2 !important; margin: 0 0 10px !important; } /* Nivået — PRODUKTET / SELSKAPET — er en etikett i mono, ikke en tekstlinje. Den sto i to ulike grader. */ [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__text p:first-child, [id^="shopify-section"][id$="__cz_dokumentasjon"] .rte p:first-child { font-family: var(--cz-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; color: #494949 !important; margin: 0 0 10px !important; } [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__text p:not(:first-child), [id^="shopify-section"][id$="__cz_dokumentasjon"] .rte p:not(:first-child) { font-size: 14px !important; line-height: 1.55 !important; margin: 0 !important; } [id^="shopify-section"][id$="__cz_dokumentasjon"] .column { max-width: 300px !important; margin: 0 auto !important; } /* ═══════════════════════════════════════════════════════ Batch 106 — JRC-faktablokken på metodesiden. Erstatter «46 millioner plastflasker», som var ett tall uten skala. Her bærer 8 kg flaten, 14 kg gir perspektiv, og 250 flasker gjør mengden fysisk. Forbehold og kilde står i blokken — tallet skal tåle å bli sjekket. ═══════════════════════════════════════════════════════ */ #cz-m-register .cz-m-fact { margin-top: var(--cz-space-xl); padding-top: 40px; border-top: 1.5px solid var(--cz-ink); max-width: 62ch; } #cz-m-register .cz-m-fact-kicker { font-family: var(--cz-mono); font-size: var(--cz-fs-label); font-weight: 500; letter-spacing: var(--cz-ls-label); text-transform: uppercase; margin: 0 0 20px !important; max-width: none !important; } /* Tallet er sidens eneste display-grad. Mono, fordi det er en måling — ikke en påstand. */ #cz-m-register .cz-m-fact-value { font-family: var(--cz-mono); font-size: 104px; font-weight: 500; line-height: 0.86; letter-spacing: -0.04em; text-transform: uppercase; margin: 0 !important; max-width: none !important; } #cz-m-register .cz-m-fact-unit { font-size: 24px !important; line-height: 1.25 !important; letter-spacing: -0.01em; margin: 16px 0 28px !important; max-width: 30ch !important; } #cz-m-register .cz-m-fact-body { margin: 0 0 14px !important; } #cz-m-register .cz-m-fact-note { font-size: var(--cz-fs-compact) !important; line-height: 1.5 !important; color: #494949; margin: 26px 0 14px !important; max-width: 58ch !important; } #cz-m-register .cz-m-fact .cz-m-stamp { margin-top: 0; } @media only screen and (max-width: 749px) { #cz-m-register .cz-m-fact-value { font-size: 68px; } #cz-m-register .cz-m-fact-unit { font-size: 20px !important; } #cz-m-register .cz-m-fact { padding-top: 32px; } } /* Batch 107 — broen mellom datapunktet og kategoriene. Den skal lese som en konklusjon på tallet over, ikke som en ny overskrift — derfor sans i mellomgrad, ikke H2. */ #cz-m-register .cz-m-bridge { font-size: 26px !important; line-height: 1.25 !important; letter-spacing: -0.015em; margin: 56px 0 0 !important; max-width: 30ch !important; } /* Avslutningen er nå ett spørsmål og tre delspørsmål i stedet for tre disclaimere. Delspørsmålene bærer mer vekt enn brødtekst, innrømmelsen mindre. */ #cz-m-close .cz-m-honesty-lead { font-size: 24px !important; line-height: 1.3 !important; letter-spacing: -0.01em; margin: var(--cz-space-md) 0 0 !important; max-width: 42ch !important; } #cz-m-close .cz-m-honesty { margin-top: var(--cz-space-md) !important; max-width: 44ch !important; } @media only screen and (max-width: 749px) { #cz-m-register .cz-m-bridge { font-size: 22px !important; margin-top: 44px !important; } #cz-m-close .cz-m-honesty-lead { font-size: 20px !important; } } /* ═══════════════════════════════════════════════════════ Batch 108 — pillene på Om oss. Broadcast legger underoverskriften i en flex-kolonne, så kapselen strekkes til full bredde. fit-content og align-self holder den til innholdet — samme feil som forsiden hadde. ═══════════════════════════════════════════════════════ */ [id^="shopify-section"][id$="__cz_om_hero"] .subheading, [id^="shopify-section"][id$="__cz_om_hero"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_hero"] .column__subheading, [id^="shopify-section"][id$="__cz_om_starten"] .subheading, [id^="shopify-section"][id$="__cz_om_starten"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_starten"] .column__subheading, [id^="shopify-section"][id$="__cz_om_teamet"] .subheading, [id^="shopify-section"][id$="__cz_om_teamet"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_teamet"] .column__subheading, [id^="shopify-section"][id$="__cz_om_fagfolk"] .subheading, [id^="shopify-section"][id$="__cz_om_fagfolk"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_fagfolk"] .column__subheading, [id^="shopify-section"][id$="__cz_om_metoden"] .subheading, [id^="shopify-section"][id$="__cz_om_metoden"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_metoden"] .column__subheading, [id^="shopify-section"][id$="__cz_om_ansvar"] .subheading, [id^="shopify-section"][id$="__cz_om_ansvar"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_ansvar"] .column__subheading, [id^="shopify-section"][id$="__cz_om_avslutning"] .subheading, [id^="shopify-section"][id$="__cz_om_avslutning"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_avslutning"] .column__subheading { display: inline-block !important; width: fit-content !important; max-width: fit-content !important; align-self: flex-start !important; flex: 0 0 auto !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; color: var(--cz-ink, #000) !important; background: transparent !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; padding: 9px 18px !important; margin: 0 0 24px 0 !important; } /* ═══════════════════════════════════════════════════════ Batch 109 — nedre del av /pages/ark ryddet. Rytmen lander nå lime → off-white → hvit → off-white → sort. Dokumentasjonen er strammet til et trust-signal, butikk fikk luft tilbake, og finalen viser de to variantene som likeverdige valg. ═══════════════════════════════════════════════════════ */ /* Dokumentasjonen skal lese som én rad, ikke tre kort. Overskriften ned fra seksjonsgrad. */ [id^="shopify-section"][id$="__cz_dokumentasjon"] .grid__heading, [id^="shopify-section"][id$="__cz_dokumentasjon"] h2 { font-size: 30px !important; line-height: 1.1 !important; margin-bottom: 40px !important; } /* FJERNET 2026-09-07 - motstridende bilderamme/hoyde-begrensning, arsak til at bildene i Dokumentasjon ikke vises normalt. Original bevart under, se rapport: [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image, [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image-wrapper, [id^="shopify-section"][id$="__cz_dokumentasjon"] .multicolumn-card__image-wrapper { max-width: 96px !important; margin: 0 auto 16px !important; } [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image img, [id^="shopify-section"][id$="__cz_dokumentasjon"] .multicolumn-card img, [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image svg { height: 60px !important; } [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image [class*="placeholder"], [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image .lazy-image, [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image > div { height: 60px !important; } */ [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__title, [id^="shopify-section"][id$="__cz_dokumentasjon"] h3 { font-size: 16px !important; margin: 0 0 8px !important; } [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__text p:not(:first-child), [id^="shopify-section"][id$="__cz_dokumentasjon"] .rte p:not(:first-child) { font-size: 13px !important; line-height: 1.5 !important; } [id^="shopify-section"][id$="__cz_dokumentasjon"] .column { max-width: 260px !important; } /* Butikkseksjonen får luft tilbake — den er sidens siste støttebevis før finalen. */ [id^="shopify-section"][id$="__cz_butikk_tekst"] .index-rte { padding-top: 96px !important; } /* ── Finalen på sort. Variantlinjene skal lese som to likeverdige valg, og butikklenken ligge et nivå under. ── */ [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .rte p strong { font-weight: 500 !important; } [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .rte p { font-size: 18px !important; line-height: 1.9 !important; } /* Butikklenken er tekst, ikke knapp — og den skal ikke konkurrere med de to variantknappene over. */ [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] [class*="block-text"]:last-child .rte p, [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .rich-text__text:last-of-type p { font-size: 14px !important; line-height: 1.5 !important; margin-top: 8px !important; } [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .rte a { color: #FFFFFF !important; text-decoration: underline !important; text-underline-offset: 5px !important; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__cz_dokumentasjon"] .grid__heading, [id^="shopify-section"][id$="__cz_dokumentasjon"] h2 { font-size: 24px !important; margin-bottom: 32px !important; } [id^="shopify-section"][id$="__cz_butikk_tekst"] .index-rte { padding-top: 72px !important; } } /* ═══════════════════════════════════════════════════════ Batch 110 — logoraden og dokumentasjonsrekken. ═══════════════════════════════════════════════════════ */ /* Raden ble rendret som en slider med fire synlige plasser. Seks logoer får plass på én linje; de skal bare bryte, ikke skyves ut av en track. */ [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__slider, [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__wrapper { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: center !important; gap: 32px 56px !important; transform: none !important; width: auto !important; min-width: 0 !important; } [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__slider > * { transform: none !important; } /* Slidersporet har egen bredde og forskyvning når det er aktivt — begge må nulles, ellers henger logoene utenfor. */ [id^="shopify-section"][id$="__cz_butikklogoer"] [class*="flickity"], [id^="shopify-section"][id$="__cz_butikklogoer"] .flickity-viewport, [id^="shopify-section"][id$="__cz_butikklogoer"] .flickity-slider { position: static !important; height: auto !important; transform: none !important; left: 0 !important; } [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__slide { position: static !important; left: 0 !important; } /* ── Dokumentasjonen: logoene har ulikt sideforhold, så bunnkanten deres lå på tre ulike høyder og titlene startet ujevnt. Fast høyde med sentrert innhold gir felles grunnlinje. ── */ /* FJERNET 2026-09-07 - motstridende bilderamme-bredde/hoyde, arsak til at bildene i Dokumentasjon ikke vises normalt. Original bevart under, se rapport: [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image, [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image-wrapper, [id^="shopify-section"][id$="__cz_dokumentasjon"] .multicolumn-card__image-wrapper { height: 72px !important; max-width: 160px !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 auto 20px !important; } */ /* FJERNET 2026-09-07 - motstridende bildehoyde-regel, arsak til at bildene i Dokumentasjon ikke vises normalt. Original bevart under, se rapport: [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image img, [id^="shopify-section"][id$="__cz_dokumentasjon"] .multicolumn-card img { height: auto !important; max-height: 56px !important; width: auto !important; max-width: 100% !important; object-fit: contain !important; } */ /* LAGT TIL 2026-09-07 - Dermatest og B Corp ble beskaret av temaets faste object-fit: cover nar blokkens sideforhold ikke matcher bildefilens format. Ingen egen innstilling for a vise hele bildet finnes pa blokken. Reverseres ved a fjerne denne regelen: */ [id^="shopify-section"][id$="__cz_dokumentasjon"] .column__image img { object-fit: contain; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__slider, [id^="shopify-section"][id$="__cz_butikklogoer"] .logos__wrapper { gap: 24px 36px !important; } } /* Batch 111 — metodesiden: seks steg og ny avslutning. Lenkeraden nederst er to sidestilte veier videre, ikke knapper — de skal ikke konkurrere med hverandre. */ #cz-m-close .cz-m-links { display: flex !important; flex-wrap: wrap; gap: 12px 40px; margin-top: var(--cz-space-lg) !important; max-width: none !important; } #cz-m-close .cz-m-links a { font-family: var(--cz-mono); font-size: 12px; font-weight: 500; letter-spacing: 0.025em; text-transform: uppercase; color: var(--cz-ink); text-decoration: underline; text-underline-offset: 5px; } #cz-m-close .cz-m-links a:hover { color: #1A1A1A; } /* ═══════════════════════════════════════════════════════ Batch 112 — designsystemet på /pages/sensitiv-hud. Siden hadde aldri fått det: FAQ sto på lime, som er impact-fargen, og ingredienssseksjonen på #f5f4f0, som ikke er en merkevarefarge. Ett fargeøyeblikk — himmelblått på seksjonen som forklarer hva du bør se etter. Resten veksler hvit og off-white. ═══════════════════════════════════════════════════════ */ /* hero — produkt og kontekst */ [id^="shopify-section"][id$="__section-custom-content"], [id^="shopify-section"][id$="__section-custom-content"] > .section-padding, [id^="shopify-section"][id$="__section-custom-content"] > section, [id^="shopify-section"][id$="__section-custom-content"] > div { background-color: #FFFFFF !important; } /* hva du bør se etter — sidens læringsøyeblikk */ [id^="shopify-section"][id$="__section-columns"], [id^="shopify-section"][id$="__section-columns"] > .section-padding, [id^="shopify-section"][id$="__section-columns"] > section, [id^="shopify-section"][id$="__section-columns"] > div { background-color: var(--cz-sky, #45A2FF) !important; } /* to spørsmål — praktisk */ [id^="shopify-section"][id$="__section-double-0"], [id^="shopify-section"][id$="__section-double-0"] > .section-padding, [id^="shopify-section"][id$="__section-double-0"] > section, [id^="shopify-section"][id$="__section-double-0"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* parfymefri — produktet */ [id^="shopify-section"][id$="__section_rich_text_6yhz9H"], [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] > .section-padding, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] > section, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] > div { background-color: #FFFFFF !important; } /* ingredienser */ [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"], [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] > .section-padding, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] > section, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* hva ekspertene sier — proof */ [id^="shopify-section"][id$="__section_custom_code_fPzDFV"], [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] > .section-padding, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] > section, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] > div { background-color: #FFFFFF !important; } /* sertifiseringer */ [id^="shopify-section"][id$="__section_custom_code_gnJE39"], [id^="shopify-section"][id$="__section_custom_code_gnJE39"] > .section-padding, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] > section, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] > div { background-color: #FFFFFF !important; } /* FAQ — fordypning */ [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"], [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] > .section-padding, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] > section, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } /* ── Pillene. Samme flex-strekk som forsiden og Om oss hadde. ── */ [id^="shopify-section"][id$="__section-custom-content"] .subheading, [id^="shopify-section"][id$="__section-columns"] .subheading, [id^="shopify-section"][id$="__section-double-0"] .subheading, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] .subheading, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .subheading, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] .subheading, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] .subheading, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] .subheading, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] .subheading, [id^="shopify-section"][id$="__section-custom-content"] .rich-text__subheading, [id^="shopify-section"][id$="__section-columns"] .rich-text__subheading, [id^="shopify-section"][id$="__section-double-0"] .rich-text__subheading, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] .rich-text__subheading, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .rich-text__subheading, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] .rich-text__subheading, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] .rich-text__subheading, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] .rich-text__subheading, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] .rich-text__subheading, [id^="shopify-section"][id$="__section-custom-content"] .column__subheading, [id^="shopify-section"][id$="__section-columns"] .column__subheading, [id^="shopify-section"][id$="__section-double-0"] .column__subheading, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] .column__subheading, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .column__subheading, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] .column__subheading, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] .column__subheading, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] .column__subheading, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] .column__subheading, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .cz-ing__tag, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] .cz-faq__tag, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] .cz-pill { display: inline-block !important; width: fit-content !important; max-width: fit-content !important; align-self: flex-start !important; flex: 0 0 auto !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; color: var(--cz-ink, #000) !important; background: transparent !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; padding: 9px 18px !important; margin: 0 0 24px 0 !important; } /* ── Knapper: kapsel, mono i versaler, sort kontur. ── */ [id^="shopify-section"][id$="__section-custom-content"] .btn, [id^="shopify-section"][id$="__section-columns"] .btn, [id^="shopify-section"][id$="__section-double-0"] .btn, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] .btn, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .btn, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] .btn, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] .btn, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] .btn, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] .btn, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .cz-ing__btn { font-family: var(--cz-mono) !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; border-radius: 300px !important; border: 2px solid var(--cz-ink, #000) !important; padding: 17px 30px !important; min-height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } [id^="shopify-section"][id$="__section-custom-content"] .btn--solid, [id^="shopify-section"][id$="__section-columns"] .btn--solid, [id^="shopify-section"][id$="__section-double-0"] .btn--solid, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] .btn--solid, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .btn--solid, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] .btn--solid, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] .btn--solid, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] .btn--solid, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] .btn--solid, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .cz-ing__btn { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__section-custom-content"] .btn--solid:hover, [id^="shopify-section"][id$="__section-columns"] .btn--solid:hover, [id^="shopify-section"][id$="__section-double-0"] .btn--solid:hover, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] .btn--solid:hover, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .btn--solid:hover, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] .btn--solid:hover, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] .btn--solid:hover, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] .btn--solid:hover, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] .btn--solid:hover, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .cz-ing__btn:hover { background: #1A1A1A !important; border-color: #1A1A1A !important; } [id^="shopify-section"][id$="__section-custom-content"] .btn--outline, [id^="shopify-section"][id$="__section-columns"] .btn--outline, [id^="shopify-section"][id$="__section-double-0"] .btn--outline, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] .btn--outline, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .btn--outline, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] .btn--outline, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] .btn--outline, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] .btn--outline, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] .btn--outline { background: transparent !important; color: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__section-custom-content"] .btn--outline:hover, [id^="shopify-section"][id$="__section-columns"] .btn--outline:hover, [id^="shopify-section"][id$="__section-double-0"] .btn--outline:hover, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] .btn--outline:hover, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .btn--outline:hover, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] .btn--outline:hover, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] .btn--outline:hover, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] .btn--outline:hover, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] .btn--outline:hover { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__section-custom-content"] .btn--text, [id^="shopify-section"][id$="__section-columns"] .btn--text, [id^="shopify-section"][id$="__section-double-0"] .btn--text, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] .btn--text, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] .btn--text, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] .btn--text, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] .btn--text, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] .btn--text, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] .btn--text { border: 0 !important; border-radius: 0 !important; padding: 4px 0 !important; min-height: 0 !important; background: transparent !important; text-decoration: underline !important; text-underline-offset: 5px !important; } /* ── Overskrifter: sans, tett, aldri versaler. ── */ [id^="shopify-section"][id$="__section-custom-content"] h1, [id^="shopify-section"][id$="__section-columns"] h1, [id^="shopify-section"][id$="__section-double-0"] h1, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] h1, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] h1, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] h1, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] h1, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] h1, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] h1, [id^="shopify-section"][id$="__section-custom-content"] h2, [id^="shopify-section"][id$="__section-columns"] h2, [id^="shopify-section"][id$="__section-double-0"] h2, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] h2, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] h2, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] h2, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] h2, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] h2, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] h2, [id^="shopify-section"][id$="__section-custom-content"] h3, [id^="shopify-section"][id$="__section-columns"] h3, [id^="shopify-section"][id$="__section-double-0"] h3, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] h3, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] h3, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] h3, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] h3, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] h3, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] h3 { font-family: var(--cz-sans) !important; letter-spacing: -0.02em !important; text-transform: none !important; } [id^="shopify-section"][id$="__section-custom-content"] h2, [id^="shopify-section"][id$="__section-columns"] h2, [id^="shopify-section"][id$="__section-double-0"] h2, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] h2, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] h2, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] h2, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] h2, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] h2, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] h2 { line-height: 1.06 !important; } [id^="shopify-section"][id$="__section-custom-content"] h3, [id^="shopify-section"][id$="__section-columns"] h3, [id^="shopify-section"][id$="__section-double-0"] h3, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] h3, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] h3, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] h3, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] h3, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] h3, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] h3 { font-size: 19px !important; line-height: 1.25 !important; } /* Ingen kort, ingen skygger — flaten er siden. */ [id^="shopify-section"][id$="__section-custom-content"] *, [id^="shopify-section"][id$="__section-columns"] *, [id^="shopify-section"][id$="__section-double-0"] *, [id^="shopify-section"][id$="__section_rich_text_6yhz9H"] *, [id^="shopify-section"][id$="__concept_zero_ingredienser_3eGwBX"] *, [id^="shopify-section"][id$="__section_custom_code_fPzDFV"] *, [id^="shopify-section"][id$="__concept_zero_pill_label_X3UERb"] *, [id^="shopify-section"][id$="__section_custom_code_gnJE39"] *, [id^="shopify-section"][id$="__concept_zero_faq_side_VpgETw"] * { box-shadow: none !important; } /* ═══════════════════════════════════════════════════════ Batch 113 — mobilsikring, 375 og 320 px. Statisk gjennomgang: de fleste rutenettene har mobilbrudd, men tre manglet. Dette er sikring i kode — visuell QA på faktisk rendering gjenstår. ═══════════════════════════════════════════════════════ */ @media only screen and (max-width: 749px) { /* Dokumentasjonsmerkene sto på tre spor uten mobilbrudd. Broadcast har layout_mobile, men CSS-en overstyrer den. */ [id^="shopify-section"][id$="__cz_dokumentasjon"] .column { grid-template-columns: 1fr !important; } /* Tabellradene i «Hvorfor vaskeark?» er 1fr 1fr. På 375 px blir hver kolonne under 160 px. Stables i stedet. */ [id^="shopify-section"][id$="__contact_form_jxTya4"] .cz-kp__item { grid-template-columns: 1fr !important; } /* Metodesidens Zero-tabell har 26ch venstrespalte — bredere enn hele skjermen på 320 px. */ #cz-m-zero .cz-m-rows > div { grid-template-columns: 1fr !important; gap: 6px; } } @media only screen and (max-width: 380px) { /* JRC-tallet er 68px på mobil. På 320 px overflyter «8 KG» ikke, men enheten under gjør det. */ #cz-m-register .cz-m-fact-value { font-size: 56px; } #cz-m-register .cz-m-fact-unit { font-size: 18px !important; } /* Knappene har 30px sidepadding. To knapper side om side sprenger 320 px — de skal stable. */ [id^="shopify-section"][id$="__main"] .btn, [id^="shopify-section"][id$="__cz_variant"] .btn, [id^="shopify-section"][id$="__cz_avslutning"] .btn { width: 100% !important; padding-left: 20px !important; padding-right: 20px !important; } /* Pillene har 18px sidepadding og 12px mono. De lengste («KLAR TIL Å PRØVE?») brekker på 320 px. */ [id^="shopify-section"][id$="__cz_avslutning"] .subheading, [id^="shopify-section"][id$="__cz_aerlig"] .subheading { font-size: 11px !important; padding: 8px 14px !important; } } /* ═══════════════════════════════════════════════════════ Batch 114 — etter visuell kontroll på 375 px. ═══════════════════════════════════════════════════════ */ @media only screen and (max-width: 749px) { /* Faktastripen sto på tre spor. «Fra 2,07» brakk over to linjer, radene fikk ulik høyde, og hårstrekene havnet på forskjellige nivåer. Tre tall stables i stedet. */ [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__facts { grid-template-columns: 1fr !important; gap: 0 !important; } [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__fact { display: flex !important; align-items: baseline !important; gap: 14px !important; padding: 18px 0 !important; border-top: 1px solid var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__fact:last-child { border-bottom: 1px solid var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__fact-num { font-size: 30px !important; white-space: nowrap !important; line-height: 1 !important; } [id^="shopify-section"][id$="__concept_zero_hero2_Dykdq8"] .cz-hero__fact-label { margin: 0 !important; line-height: 1.3 !important; } /* Den blå seksjonen var sentrert mens hele resten av siden er venstrestilt. Sentrert brødtekst på smal skjerm gir ujevn venstrekant og er tyngre å lese. */ [id^="shopify-section"][id$="__section_rich_text_xfCQKg"], [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .rte, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] h2, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] p { text-align: left !important; } [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] h2 { font-size: 34px !important; } /* Trinnkortene: nummeret hadde 40+ px luft ned til tittelen, mens tittelen selv brakk på to linjer. Strammere. */ [id^="shopify-section"][id$="__section_columns_xGj9P6"] .column__number, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .cz-step__num { margin-bottom: 18px !important; } [id^="shopify-section"][id$="__section_columns_xGj9P6"] .column__title { font-size: 20px !important; margin-bottom: 10px !important; } } /* Batch 115 — UGC-raden tar fire skjermhøyder på mobil når videoene ligger én per rad. To per rad, og tettere luft mellom overskrift og rad. */ @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] { padding-top: 64px !important; padding-bottom: 64px !important; } [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .social-videos__heading, [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .rte { text-align: left !important; } } /* Batch 116 — luft på mobil. De harmoniserte desktopverdiene (96 standard, 112 stor, 40 kompakt) er for mye på 375 px. Broadcast skalerer ikke padding automatisk. */ @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section_rich_text_xfCQKg"], [id^="shopify-section"][id$="__cz_tallene_bro"], [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] { padding-top: 72px !important; padding-bottom: 72px !important; } [id^="shopify-section"][id$="__section_double_iQXKYw"], [id^="shopify-section"][id$="__section_social_videos_NFxWRc"], [id^="shopify-section"][id$="__section_double_d4Rdam"], [id^="shopify-section"][id$="__cz_dokumentasjon"] { padding-top: 64px !important; padding-bottom: 64px !important; } [id^="shopify-section"][id$="__section_columns_xGj9P6"] { padding-top: 64px !important; } [id^="shopify-section"][id$="__cz_butikk_tekst"] { padding-top: 64px !important; } [id^="shopify-section"][id$="__cz_butikklogoer"] { padding-bottom: 64px !important; } [id^="shopify-section"][id$="__section_divider_gALjJP"] { padding-top: 28px !important; padding-bottom: 28px !important; } } /* Batch 117 — samme mobilskalering på forsiden som Batch 116 ga tøyvask-arksiden. 112 → 72, 96 → 64, 40 → 28. */ @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__cz_brand_premise"], [id^="shopify-section"][id$="__cz_belief"] { padding-top: 72px !important; padding-bottom: 72px !important; } [id^="shopify-section"][id$="__cz_impact_narrative"] { padding-top: 72px !important; } [id^="shopify-section"][id$="__cz_toyvask_chapter"], [id^="shopify-section"][id$="__section_double_eb37N3"], [id^="shopify-section"][id$="__cz_method_preview"], [id^="shopify-section"][id$="__cz_alex"] { padding-top: 64px !important; padding-bottom: 64px !important; } [id^="shopify-section"][id$="__cz_retail_text"], [id^="shopify-section"][id$="__cz_trust_text"], [id^="shopify-section"][id$="__cz_next_category_text"] { padding-top: 64px !important; } [id^="shopify-section"][id$="__cz_retail_link"], [id^="shopify-section"][id$="__cz_trust_marks"], [id^="shopify-section"][id$="__cz_newsletter_klaviyo"] { padding-bottom: 64px !important; } [id^="shopify-section"][id$="__cz_impact_bridge"] { padding-bottom: 64px !important; } } /* ═══════════════════════════════════════════════════════ Batch 118 — heroen på mobil. Teksten lå helt inntil høyre kant: slideshow-seksjonen setter bare venstre innrykk på mobil, så overskriften brakk mot skjermkanten uten marg. Symmetrisk innrykk, og tekstbredden begrenses så linjebruddene blir styrt. ═══════════════════════════════════════════════════════ */ @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section-slideshow-nested"] .slideshow__slide-content, [id^="shopify-section"][id$="__section-slideshow-nested"] .hero__content, [id^="shopify-section"][id$="__section-slideshow-nested"] .hero__content-inner, [id^="shopify-section"][id$="__section-slideshow-nested"] .slide__content { padding-left: 24px !important; padding-right: 24px !important; box-sizing: border-box !important; } [id^="shopify-section"][id$="__section-slideshow-nested"] h1, [id^="shopify-section"][id$="__section-slideshow-nested"] h2 { max-width: 18ch !important; font-size: 32px !important; line-height: 1.04 !important; letter-spacing: -0.02em !important; } [id^="shopify-section"][id$="__section-slideshow-nested"] p { max-width: 30ch !important; font-size: 15px !important; line-height: 1.5 !important; } /* Knappene sto side om side og fylte bredden helt ut. Stables, med full bredde hver. */ [id^="shopify-section"][id$="__section-slideshow-nested"] .hero__buttons, [id^="shopify-section"][id$="__section-slideshow-nested"] .slide__buttons { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; } [id^="shopify-section"][id$="__section-slideshow-nested"] .btn { width: 100% !important; max-width: 260px !important; } /* Ferskenseksjonen: brødteksten var 13–14 px mot en 26 px overskrift. For stort sprang — brødtekst skal være 16. */ } /* Batch 119 — Om oss: de to avsnittsoverskriftene sto i samme grad som brødteksten under. De skal bære avsnittet. */ @media only screen and (max-width: 749px) { } /* ═══════════════════════════════════════════════════════ Batch 121 — designsystemet på /pages/slik-funker-det. Malen het page.lookbook og hadde aldri fått en CSS-batch. Tre pilleseksjoner er slått inn i innholdsseksjonene, så pillene styles nå som subheading. Fargene følger rollene: himmelblå på forklaringen, fersken på flekkavgrensningen. ═══════════════════════════════════════════════════════ */ [id^="shopify-section"][id$="__section-double"] { background-color: #FFFFFF !important; } [id^="shopify-section"][id$="__section_rich_text_kxNfzp"], [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] > .section-padding, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] > div { background-color: var(--cz-sky, #45A2FF) !important; } [id^="shopify-section"][id$="__section-double-0"] { background-color: var(--cz-off-white, #F2F2F2) !important; } [id^="shopify-section"][id$="__section-double-2"] { background-color: var(--cz-peach, #FFA683) !important; } [id^="shopify-section"][id$="__section-collection"] { background-color: #FFFFFF !important; } /* Pillene: fit-content, ellers strekker flex dem til full bredde. */ [id^="shopify-section"][id$="__section-double"] .subheading, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] .subheading, [id^="shopify-section"][id$="__section-double-0"] .subheading, [id^="shopify-section"][id$="__section-double-2"] .subheading, [id^="shopify-section"][id$="__section-collection"] .subheading, [id^="shopify-section"][id$="__section-double"] .rich-text__subheading, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] .rich-text__subheading, [id^="shopify-section"][id$="__section-double-0"] .rich-text__subheading, [id^="shopify-section"][id$="__section-double-2"] .rich-text__subheading, [id^="shopify-section"][id$="__section-collection"] .rich-text__subheading { display: inline-block !important; width: fit-content !important; max-width: fit-content !important; align-self: flex-start !important; flex: 0 0 auto !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; color: var(--cz-ink, #000) !important; background: transparent !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; padding: 9px 18px !important; margin: 0 0 24px 0 !important; } [id^="shopify-section"][id$="__section-double"] h2, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] h2, [id^="shopify-section"][id$="__section-double-0"] h2, [id^="shopify-section"][id$="__section-double-2"] h2, [id^="shopify-section"][id$="__section-collection"] h2 { font-family: var(--cz-sans) !important; font-weight: 400 !important; letter-spacing: -0.03em !important; line-height: 1.02 !important; text-transform: none !important; } [id^="shopify-section"][id$="__section-double"] .btn, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] .btn, [id^="shopify-section"][id$="__section-double-0"] .btn, [id^="shopify-section"][id$="__section-double-2"] .btn, [id^="shopify-section"][id$="__section-collection"] .btn { font-family: var(--cz-mono) !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; border-radius: 300px !important; border: 2px solid var(--cz-ink, #000) !important; padding: 17px 30px !important; min-height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } [id^="shopify-section"][id$="__section-double"] .btn--solid, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] .btn--solid, [id^="shopify-section"][id$="__section-double-0"] .btn--solid, [id^="shopify-section"][id$="__section-double-2"] .btn--solid, [id^="shopify-section"][id$="__section-collection"] .btn--solid { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__section-double"] .btn--solid:hover, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] .btn--solid:hover, [id^="shopify-section"][id$="__section-double-0"] .btn--solid:hover, [id^="shopify-section"][id$="__section-double-2"] .btn--solid:hover, [id^="shopify-section"][id$="__section-collection"] .btn--solid:hover { background: #1A1A1A !important; border-color: #1A1A1A !important; } [id^="shopify-section"][id$="__section-double"] .btn--outline, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] .btn--outline, [id^="shopify-section"][id$="__section-double-0"] .btn--outline, [id^="shopify-section"][id$="__section-double-2"] .btn--outline, [id^="shopify-section"][id$="__section-collection"] .btn--outline { background: transparent !important; color: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__section-double"] .btn--outline:hover, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] .btn--outline:hover, [id^="shopify-section"][id$="__section-double-0"] .btn--outline:hover, [id^="shopify-section"][id$="__section-double-2"] .btn--outline:hover, [id^="shopify-section"][id$="__section-collection"] .btn--outline:hover { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__section-double"] .btn--text, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] .btn--text, [id^="shopify-section"][id$="__section-double-0"] .btn--text, [id^="shopify-section"][id$="__section-double-2"] .btn--text, [id^="shopify-section"][id$="__section-collection"] .btn--text { border: 0 !important; border-radius: 0 !important; padding: 4px 0 !important; min-height: 0 !important; background: transparent !important; text-decoration: underline !important; text-underline-offset: 5px !important; } [id^="shopify-section"][id$="__section-double"] *, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] *, [id^="shopify-section"][id$="__section-double-0"] *, [id^="shopify-section"][id$="__section-double-2"] *, [id^="shopify-section"][id$="__section-collection"] * { box-shadow: none !important; } /* Doseringen er systeminformasjon — mono på tallene. */ [id^="shopify-section"][id$="__section-double-0"] .rte p { font-size: 16px !important; line-height: 1.6 !important; margin: 0 0 10px !important; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section-double"], [id^="shopify-section"][id$="__section-double-0"], [id^="shopify-section"][id$="__section-collection"] { padding-top: 64px !important; padding-bottom: 64px !important; } [id^="shopify-section"][id$="__section_rich_text_kxNfzp"], [id^="shopify-section"][id$="__section-double-2"] { padding-top: 72px !important; padding-bottom: 72px !important; } [id^="shopify-section"][id$="__section-double"] .btn--solid, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] .btn--solid, [id^="shopify-section"][id$="__section-double-0"] .btn--solid, [id^="shopify-section"][id$="__section-double-2"] .btn--solid, [id^="shopify-section"][id$="__section-collection"] .btn--solid, [id^="shopify-section"][id$="__section-double"] .btn--outline, [id^="shopify-section"][id$="__section_rich_text_kxNfzp"] .btn--outline, [id^="shopify-section"][id$="__section-double-0"] .btn--outline, [id^="shopify-section"][id$="__section-double-2"] .btn--outline, [id^="shopify-section"][id$="__section-collection"] .btn--outline { width: 100% !important; } } /* ═══════════════════════════════════════════════════════ Batch 122 — 375 px, andre gjennomgang. ═══════════════════════════════════════════════════════ */ @media only screen and (max-width: 749px) { /* Trinnkortene arvet desktopens trespaltebredde, så teksten lå i en kolonne på rundt 20 tegn og brakk «Legg arket i / trommelen». Full bredde når de er stablet. */ [id^="shopify-section"][id$="__section_columns_xGj9P6"] .column, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .column__content, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .column__text { width: 100% !important; max-width: none !important; } [id^="shopify-section"][id$="__section_columns_xGj9P6"] .column__text p, [id^="shopify-section"][id$="__section_columns_xGj9P6"] .column__title { max-width: 34ch !important; } /* Variantknappene sto side om side på 375 px og fikk under 150 px hver. Stables med full bredde. */ [id^="shopify-section"][id$="__section_double_iQXKYw"] .btn { width: 100% !important; max-width: none !important; } [id^="shopify-section"][id$="__section_double_iQXKYw"] .section-blocks--buttons, [id^="shopify-section"][id$="__section_double_iQXKYw"] [class*="buttons"] { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 10px !important; } /* Den blå seksjonen lå på wrapper--narrow, som gir smalere innrykk enn resten av siden — teksten kom for nær kanten. */ [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] .wrapper, [id^="shopify-section"][id$="__section_rich_text_xfCQKg"] > div { padding-left: 24px !important; padding-right: 24px !important; box-sizing: border-box !important; } } /* ═══════════════════════════════════════════════════════ Batch 123 — de tre mobilfeilene gjelder alle sider. section-double finnes på seks maler, wrapper--narrow på fjorten, section-columns på to. Å rette per seksjons-ID ville bety førti nesten identiske regler. Reglene scopes derfor til Shopifys seksjonswrapper — de kan ikke nå header, footer eller handlekurv, bare seksjonsinnhold. ═══════════════════════════════════════════════════════ */ @media only screen and (max-width: 749px) { /* wrapper--narrow gir smalere sideinnrykk enn resten av temaet, så teksten kom for nær skjermkanten. */ [id^="shopify-section"] .wrapper--narrow { padding-left: 24px !important; padding-right: 24px !important; box-sizing: border-box !important; } /* To knapper side om side får under 150 px hver på 375 px. Stables med full bredde. Tekstlenker berøres ikke. */ [id^="shopify-section"] .section-blocks--buttons, [id^="shopify-section"] .block--buttons { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 10px !important; } [id^="shopify-section"] .btn--solid, [id^="shopify-section"] .btn--outline, [id^="shopify-section"] .btn--black { width: 100% !important; max-width: none !important; } /* Kolonner arver desktopbredden når de stables, så brødteksten havner i en kolonne på rundt 20 tegn. */ [id^="shopify-section"] .column, [id^="shopify-section"] .column__content { width: 100% !important; max-width: none !important; } [id^="shopify-section"] .column__text p, [id^="shopify-section"] .column__title { max-width: 34ch !important; } } /* ═══════════════════════════════════════════════════════ Batch 124 — Om oss-pillen, andre forsøk. Batch 108 satte align-self: flex-start, men Broadcast legger blokkene i et grid — der heter egenskapen justify-self, og flex-varianten ignoreres. Pillen ble derfor strukket til full sporbredde. Begge settes nå, pluss en bredere klasseliste i tilfelle wrapperen bærer kanten. ═══════════════════════════════════════════════════════ */ [id^="shopify-section"][id$="__cz_om_hero"] .subheading, [id^="shopify-section"][id$="__cz_om_hero"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_hero"] .block--subheading > *, [id^="shopify-section"][id$="__cz_om_hero"] [class*="subheading"], [id^="shopify-section"][id$="__cz_om_starten"] .subheading, [id^="shopify-section"][id$="__cz_om_starten"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_starten"] .block--subheading > *, [id^="shopify-section"][id$="__cz_om_starten"] [class*="subheading"], [id^="shopify-section"][id$="__cz_om_teamet"] .subheading, [id^="shopify-section"][id$="__cz_om_teamet"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_teamet"] .block--subheading > *, [id^="shopify-section"][id$="__cz_om_teamet"] [class*="subheading"], [id^="shopify-section"][id$="__cz_om_fagfolk"] .subheading, [id^="shopify-section"][id$="__cz_om_fagfolk"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_fagfolk"] .block--subheading > *, [id^="shopify-section"][id$="__cz_om_fagfolk"] [class*="subheading"], [id^="shopify-section"][id$="__cz_om_metoden"] .subheading, [id^="shopify-section"][id$="__cz_om_metoden"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_metoden"] .block--subheading > *, [id^="shopify-section"][id$="__cz_om_metoden"] [class*="subheading"], [id^="shopify-section"][id$="__cz_om_ansvar"] .subheading, [id^="shopify-section"][id$="__cz_om_ansvar"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_ansvar"] .block--subheading > *, [id^="shopify-section"][id$="__cz_om_ansvar"] [class*="subheading"], [id^="shopify-section"][id$="__cz_om_avslutning"] .subheading, [id^="shopify-section"][id$="__cz_om_avslutning"] .rich-text__subheading, [id^="shopify-section"][id$="__cz_om_avslutning"] .block--subheading > *, [id^="shopify-section"][id$="__cz_om_avslutning"] [class*="subheading"] { display: inline-block !important; width: fit-content !important; max-width: fit-content !important; justify-self: start !important; align-self: start !important; flex: 0 0 auto !important; box-sizing: border-box !important; } /* ═══════════════════════════════════════════════════════ Batch 125 — metodesiden på mobil. ═══════════════════════════════════════════════════════ */ /* «8 KG» sto med et gap mellom tallet og enheten: mono i display-grad arver etikettsperringen på 0.025em, som blir synlig som et hull ved 68 px. Negativ sperring lukker det. */ #cz-m-register .cz-m-fact-value { letter-spacing: -0.05em !important; word-spacing: -0.12em !important; } @media only screen and (max-width: 749px) { /* Metodenoten var 14 px i grå på lime — under lesbar kontrast, og for liten til å bli lest. */ #cz-m-register .cz-m-fact-note, #cz-m-register .cz-m-stamp { font-size: 13px !important; line-height: 1.55 !important; color: #494949 !important; } /* Batch 156 — mobil-cleanup: fact-note skal folge kompakt-tokenet (14px) pa mobil, ikke Batch 125 sin delte 13px-regel over (som ogsa gjelder .cz-m-stamp — den er bevisst urort). */ #cz-m-register .cz-m-fact-note { font-size: var(--cz-fs-compact) !important; } /* Zero-pillene lå fem på rad og brakk i to ujevne linjer. Tettere sperring og mindre grad gir tre og to. */ #cz-m-hero .cz-m-pillrow { gap: 8px !important; } #cz-m-hero .cz-m-pillrow > * { font-size: 10px !important; padding: 7px 12px !important; letter-spacing: 0.02em !important; } /* Registerradene: etiketten sto rett under tittelen uten luft, så «Klesvask» og «LIVE NÅ» klistret seg sammen. */ #cz-m-register .cz-m-rows > div { padding-top: 20px !important; padding-bottom: 20px !important; } #cz-m-register .cz-m-key { margin-bottom: 6px !important; } /* Brødtekst på metodesiden er 20 px på desktop. På 375 px gir det for få tegn per linje. */ } /* Batch 126 — metodeheroens H1 har clamp med 2,8rem som gulv, altså 44,8 px. På en tolv ords overskrift blir det fire–fem linjer på 375 px og seks på 320. Gulvet senkes der. */ @media only screen and (max-width: 749px) { #cz-m-hero h1 { font-size: 34px !important; line-height: 1.06 !important; } } @media only screen and (max-width: 380px) { #cz-m-hero h1 { font-size: 30px !important; } } /* Batch 127 — UGC-merkelappene. Batch 115 satte to videoer per rad for å korte ned scrollen, men pilleteksten var uendret. Med halv videobredde brakk «Så enkelt er det.» på to linjer og kapselen ble dobbelt så høy som den skal. */ @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .social-video__text { font-size: 11px !important; padding: 8px 12px !important; } } /* ═══════════════════════════════════════════════════════ Batch 128 — kanonisk mobillag for designprimitivene. Erstatter seks per-seksjon-regler som gjentok de samme verdiene. Verdiene er hentet fra det som faktisk rendret i godkjent design, ikke valgt på nytt: pille 11 px (var 11 under 380, arvet 12 ellers) H1 32 px (slideshow-heroen) H2 30 px (tre seksjonsgrupper sa 30) H3 20 px (trinnkorttitlene) brødtekst 16 px (fire steder sa 16) Unntak som står igjen med egne regler, fordi de har en grunn: clamp(26,7.5vw,34) på tallene-bro, annen-variant og fordypning (lange overskrifter i smale flater), 34 px på den blå seksjonen og metodeheroen (H1-nivå), 19 px på Om oss- avsnittsoverskriftene (halvfet, ikke brødtekst), 13 px på metodenoten, 10 px på metodesidens pillerad (fem på rad), 68/56 px på JRC-tallet, 11 px på UGC-merkelappene. ═══════════════════════════════════════════════════════ */ @media only screen and (max-width: 749px) { [id^="shopify-section"] .subheading, [id^="shopify-section"] .rich-text__subheading, [id^="shopify-section"] .column__subheading { font-size: 11px; padding: 8px 15px; letter-spacing: 0.025em; } [id^="shopify-section"] h1 { font-size: 32px; line-height: 1.04; } [id^="shopify-section"] h2 { font-size: 30px; line-height: 1.06; } [id^="shopify-section"] h3 { font-size: 20px; line-height: 1.25; } [id^="shopify-section"] .rte p, [id^="shopify-section"] .column__text p { font-size: 16px; line-height: 1.55; } /* Unntak: seksjonens desktopregel setter 18px !important utenfor media query og vinner ellers over det kanoniske laget. Måtte gjeninnføres etter forsøk på fjerning. */ [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .rte p { font-size: 16px !important; } } /* Batch 129 — UGC-merkelappen. Riktig klasse er .social-video__text; Batch 127 gjettet på .social-videos__badge og traff ingenting. Lappen brakk på to linjer og rant utenfor videokanten, og teksten var høyrestilt. Gjelder alle bredder — en merkelapp skal aldri brekke. */ [id^="shopify-section"][id$="__section_social_videos_NFxWRc"] .social-video__text { white-space: nowrap !important; text-align: center !important; max-width: calc(100% - 16px) !important; overflow: hidden !important; text-overflow: ellipsis !important; } /* Batch 130 — finn-din-butikk sto på 134/90 px padding og fulgte ingen skala. Nå 96/96 som standard, med mobilverdier. */ @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section_rich_text_yn4qD9"] { padding-top: 64px !important; padding-bottom: 56px !important; } [id^="shopify-section"][id$="__section_press_logos_9rXzXe"] { padding-top: 40px !important; padding-bottom: 64px !important; } } /* ═══════════════════════════════════════════════════════ Batch 131 — designsystemet på /pages/contact. Malen hadde aldri fått en CSS-batch. Pilleseksjonen er slått inn i innholdsseksjonen, så pillen styles nå som subheading. Flatene veksler hvit og off-white; siden er kort og trenger ingen fargehendelse. ═══════════════════════════════════════════════════════ */ [id^="shopify-section"][id$="__section_rich_text_TK3jj4"], [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] > .section-padding, [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] > div, #cz-kontaktskjema { background-color: var(--cz-off-white, #F2F2F2) !important; } [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"], [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] > .section-padding, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] > div { background-color: var(--cz-off-white, #F2F2F2) !important; } [id^="shopify-section"][id$="__section_blog_63PanA"] { background-color: var(--cz-off-white, #F2F2F2) !important; } [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] .subheading, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] .subheading, [id^="shopify-section"][id$="__section_blog_63PanA"] .subheading, [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] .rich-text__subheading, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] .rich-text__subheading, [id^="shopify-section"][id$="__section_blog_63PanA"] .rich-text__subheading { display: inline-block !important; width: fit-content !important; max-width: fit-content !important; align-self: flex-start !important; justify-self: start !important; flex: 0 0 auto !important; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; color: var(--cz-ink, #000) !important; background: transparent !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 999px !important; padding: 9px 18px !important; margin: 0 0 24px 0 !important; } [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] h2, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] h2, [id^="shopify-section"][id$="__section_blog_63PanA"] h2, [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] h3, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] h3, [id^="shopify-section"][id$="__section_blog_63PanA"] h3 { font-family: var(--cz-sans) !important; font-weight: 400 !important; letter-spacing: -0.03em !important; line-height: 1.02 !important; text-transform: none !important; } [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] .btn, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] .btn, [id^="shopify-section"][id$="__section_blog_63PanA"] .btn { font-family: var(--cz-mono) !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; border-radius: 300px !important; border: 2px solid var(--cz-ink, #000) !important; padding: 17px 30px !important; min-height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] .btn--solid, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] .btn--solid, [id^="shopify-section"][id$="__section_blog_63PanA"] .btn--solid { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] .btn--solid:hover, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] .btn--solid:hover, [id^="shopify-section"][id$="__section_blog_63PanA"] .btn--solid:hover { background: #1A1A1A !important; border-color: #1A1A1A !important; } [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] .btn--outline, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] .btn--outline, [id^="shopify-section"][id$="__section_blog_63PanA"] .btn--outline { background: transparent !important; color: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] .btn--outline:hover, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] .btn--outline:hover, [id^="shopify-section"][id$="__section_blog_63PanA"] .btn--outline:hover { background: var(--cz-ink, #000) !important; color: #FFFFFF !important; } [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] .btn--text, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] .btn--text, [id^="shopify-section"][id$="__section_blog_63PanA"] .btn--text { border: 0 !important; border-radius: 0 !important; padding: 4px 0 !important; min-height: 0 !important; background: transparent !important; text-decoration: underline !important; text-underline-offset: 5px !important; } [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] *, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] *, [id^="shopify-section"][id$="__section_blog_63PanA"] * { box-shadow: none !important; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section_rich_text_TK3jj4"], [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"], [id^="shopify-section"][id$="__section_blog_63PanA"] { padding-top: 64px !important; padding-bottom: 64px !important; } [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] .btn--solid, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] .btn--solid, [id^="shopify-section"][id$="__section_blog_63PanA"] .btn--solid, [id^="shopify-section"][id$="__section_rich_text_TK3jj4"] .btn--outline, [id^="shopify-section"][id$="__section_rich_text_columns_eKerwQ"] .btn--outline, [id^="shopify-section"][id$="__section_blog_63PanA"] .btn--outline { width: 100% !important; } } /* ═══════════════════════════════════════════════════════ Batch 132 — kontaktskjemaet. main-page rendrer Shopifys eget skjema; det har aldri fått designsystemet. Feltene er rette hjørner og sort hårstrek, som kortene ellers. Knappen er kapsel, som alle andre knapper. ═══════════════════════════════════════════════════════ */ #cz-kontaktskjema .contact-form, #cz-kontaktskjema form { max-width: 46rem; } #cz-kontaktskjema label { display: block !important; font-family: var(--cz-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; margin-bottom: 8px !important; color: var(--cz-ink, #000) !important; } #cz-kontaktskjema input[type="text"], #cz-kontaktskjema input[type="email"], #cz-kontaktskjema input[type="tel"], #cz-kontaktskjema textarea { font-family: var(--cz-sans) !important; font-size: 16px !important; line-height: 1.5 !important; color: var(--cz-ink, #000) !important; background: #FFFFFF !important; border: 1px solid var(--cz-ink, #000) !important; border-radius: 0 !important; box-shadow: none !important; padding: 14px 16px !important; width: 100% !important; margin-bottom: 22px !important; transition: border-color 160ms cubic-bezier(0.22, 1, 0.36, 1) !important; } #cz-kontaktskjema input:focus, #cz-kontaktskjema textarea:focus { outline: none !important; border-width: 2px !important; padding: 13px 15px !important; } #cz-kontaktskjema textarea { min-height: 140px !important; resize: vertical !important; } #cz-kontaktskjema button[type="submit"], #cz-kontaktskjema input[type="submit"], #cz-kontaktskjema .btn { font-family: var(--cz-mono) !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; line-height: 1 !important; background: var(--cz-ink, #000) !important; color: #FFFFFF !important; border: 2px solid var(--cz-ink, #000) !important; border-radius: 300px !important; padding: 17px 30px !important; min-height: 48px !important; box-shadow: none !important; cursor: pointer !important; transition: background-color 160ms cubic-bezier(0.22, 1, 0.36, 1) !important; } #cz-kontaktskjema button[type="submit"]:hover, #cz-kontaktskjema input[type="submit"]:hover, #cz-kontaktskjema .btn:hover { background: #1A1A1A !important; border-color: #1A1A1A !important; } #cz-kontaktskjema button[type="submit"]:active, #cz-kontaktskjema .btn:active { transform: translateY(2px) !important; } @media only screen and (max-width: 749px) { #cz-kontaktskjema { padding-bottom: 64px !important; } #cz-kontaktskjema button[type="submit"], #cz-kontaktskjema input[type="submit"], #cz-kontaktskjema .btn { width: 100% !important; } } /* ═══════════════════════════════════════════════════════ Batch 133 — FAQ-siden. Fargen var lime, som i systemet er posisjoneringsfargen («En annen vei er mulig»). En FAQ er spørsmål, og spørsmålsfargen er himmelblå — samme som FAQ-utdraget på tøyvask-arksiden, så de to leser likt. section-sidebar hadde ingen CSS fra oss; typografien kom fra temaets basetrinn. Spørsmålene får nå et definert trinn, og kategorilenkene mister kulene. ═══════════════════════════════════════════════════════ */ [id^="shopify-section"][id$="__section-rich-text"], [id^="shopify-section"][id$="__section-rich-text"] > .section-padding, [id^="shopify-section"][id$="__section-rich-text"] > div { background-color: var(--cz-sky, #45A2FF) !important; } [id^="shopify-section"][id$="__section-sidebar"] { background-color: #FFFFFF !important; } /* Kategorilenkene: etiketter, ikke punktliste. */ [id^="shopify-section"][id$="__section-sidebar"] .widget__links { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; flex-direction: column !important; gap: 12px !important; } [id^="shopify-section"][id$="__section-sidebar"] .widget__links li { list-style: none !important; } [id^="shopify-section"][id$="__section-sidebar"] .widget__links li::marker { content: none !important; } [id^="shopify-section"][id$="__section-sidebar"] .widget__link { font-family: var(--cz-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; color: var(--cz-ink, #000) !important; text-decoration: none !important; } [id^="shopify-section"][id$="__section-sidebar"] .widget__link:hover { text-decoration: underline !important; text-underline-offset: 4px !important; } /* Kategoriheaderne står i mono med små bokstaver; systemet bruker mono i versaler for etiketter. */ [id^="shopify-section"][id$="__section-sidebar"] .section-sidebar__title { font-family: var(--cz-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; color: var(--cz-ink, #000) !important; } /* Spørsmålene er sidens innhold, ikke brødtekst. */ [id^="shopify-section"][id$="__section-sidebar"] .accordion__title { font-family: var(--cz-sans) !important; font-weight: 500 !important; font-size: 18px !important; letter-spacing: -0.01em !important; line-height: 1.3 !important; text-transform: none !important; min-height: 48px !important; display: flex !important; align-items: center !important; gap: 20px !important; } [id^="shopify-section"][id$="__section-sidebar"] .accordion, [id^="shopify-section"][id$="__section-sidebar"] .accordion__item { border-color: var(--cz-ink, #000) !important; } [id^="shopify-section"][id$="__section-sidebar"] .accordion__body, [id^="shopify-section"][id$="__section-sidebar"] .accordion__content { font-size: 16px !important; line-height: 1.6 !important; } /* Ikonraden nederst er generisk og sier ingenting en FAQ-leser trenger. Skjult til den er erstattet. */ [id^="shopify-section"][id$="__section-text-row"] { display: none !important; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section-rich-text"] { padding-top: 64px !important; padding-bottom: 64px !important; } [id^="shopify-section"][id$="__section-sidebar"] { padding-top: 48px !important; padding-bottom: 64px !important; } /* Kategorilenkene dupliserer headerne som kommer rett etter. På mobil er det raskere å skrolle enn å hoppe. */ [id^="shopify-section"][id$="__section-sidebar"] .section-sidebar__aside { display: none !important; } [id^="shopify-section"][id$="__section-sidebar"] .accordion__title { font-size: 17px !important; padding-right: 4px !important; } } /* ═══════════════════════════════════════════════════════ Batch 134 — kontaktskjemaet fikk egen seksjon. main-page rendrer bare sidetittel og page.content, ikke noe skjema — derfor sto det «Kontakt» og deretter tomrom. Broadcast har ingen skjemaseksjon, og contact-form.liquid inneholder sammenligningsseksjonen. Dedikert Liquid er eneste vei; Batch 132-selektorene er flyttet hit. ═══════════════════════════════════════════════════════ */ #cz-kontaktskjema .cz-kf__inner { max-width: var(--content-max, 1300px); margin: 0 auto; padding: 0 var(--gutter, 48px); } #cz-kontaktskjema .cz-kf__title { font-family: var(--cz-sans); font-weight: 400; letter-spacing: -0.03em; line-height: 1.02; margin: 0 0 32px; } #cz-kontaktskjema .cz-kf__ok, #cz-kontaktskjema .cz-kf__error { font-family: var(--cz-sans); font-size: 16px; line-height: 1.6; max-width: 46rem; margin: 0; padding: 18px 20px; border: 1px solid var(--cz-ink, #000); } #cz-kontaktskjema .cz-kf__error { background: #FFA683; } @media only screen and (max-width: 749px) { #cz-kontaktskjema .cz-kf__inner { padding: 0 24px; } } /* ═══════════════════════════════════════════════════════ Batch 135 — pilleformen som global primitiv. Formen (kapsel, 2 px kontur, mono, versaler) er identisk i Batch 108, 121 og 131, kopiert per side. FAQ-siden manglet kopien, og «Ofte spurt» rendret som ren småtekst. Formen hører til primitiven; graden ligger i det kanoniske mobillaget. De eldre kopiene er identiske og lar stå. ═══════════════════════════════════════════════════════ */ [id^="shopify-section"] .subheading:not(.accordion__title), [id^="shopify-section"] .rich-text__subheading, [id^="shopify-section"] .column__subheading { display: inline-block; width: fit-content; max-width: fit-content; align-self: flex-start; justify-self: start; flex: 0 0 auto; font-family: var(--cz-mono); font-size: 12px; font-weight: 500; letter-spacing: 0.025em; text-transform: uppercase; line-height: 1; color: var(--cz-ink, #000); background: transparent; border: 2px solid var(--cz-ink, #000); border-radius: 999px; padding: 9px 18px; margin: 0 0 24px 0; } /* Batch 136 — FAQ-introen fikk samme venstrekant som spørsmålene, og pillen er fjernet: den gjentok overskriften. */ @media only screen and (min-width: 990px) { [id^="shopify-section"][id$="__section-rich-text"] .rich-text__wrapper, [id^="shopify-section"][id$="__section-rich-text"] .wrapper > * { margin-left: 0 !important; max-width: 46rem !important; } [id^="shopify-section"][id$="__section-rich-text"] .wrapper { display: grid !important; grid-template-columns: minmax(0, 25%) minmax(0, 1fr) !important; } [id^="shopify-section"][id$="__section-rich-text"] .wrapper > *:first-child { grid-column: 2 !important; } } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section-rich-text"] { padding-top: 56px !important; padding-bottom: 56px !important; } } /* ═══════════════════════════════════════════════════════ Batch 137 — kontaktskjemaet, layout og mobil. Skjemaet lå i full wrapper-bredde: feltene ble 1200 px brede på desktop, som er ubrukelig for et navnefelt. Skjemaet er en kolonne, ikke en flate. ═══════════════════════════════════════════════════════ */ #cz-kontaktskjema .cz-kf__form { display: flex; flex-direction: column; max-width: 34rem; } /* Navn og e-post hører sammen og er begge korte. */ @media only screen and (min-width: 750px) { #cz-kontaktskjema .cz-kf__form { display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; max-width: 40rem; } #cz-kontaktskjema label[for="cz-kf-body"], #cz-kontaktskjema textarea, #cz-kontaktskjema button[type="submit"], #cz-kontaktskjema .cz-kf__ok, #cz-kontaktskjema .cz-kf__error { grid-column: 1 / -1; } #cz-kontaktskjema button[type="submit"] { justify-self: start; } } /* Trykkflate: 16 px tekst hindrer at iOS zoomer inn ved fokus. */ @media only screen and (max-width: 749px) { #cz-kontaktskjema input, #cz-kontaktskjema textarea { font-size: 16px !important; } #cz-kontaktskjema label { margin-top: 4px !important; } } /* Batch 138 — hårstrek med mono-etikett over skjemaet. Samme grep som i sammenligningstabellen og ingredienslisten: linjen markerer hvor handlingen begynner. */ #cz-kontaktskjema .cz-kf__eyebrow { font-family: var(--cz-mono); font-size: 11px; font-weight: 500; letter-spacing: 0.025em; text-transform: uppercase; color: var(--cz-ink, #000); border-top: 1px solid var(--cz-ink, #000); padding-top: 18px; margin: 0 0 28px; max-width: 40rem; } @media only screen and (max-width: 749px) { #cz-kontaktskjema .cz-kf__eyebrow { margin-bottom: 22px; max-width: none; } } /* Batch 139 — ingen CSS-endring. Markøren dokumenterer at tre maler er hentet tilbake etter at de falt ut ved import: templates/page.json, templates/page.slik-funker-det.json, templates/page.fakta-utregning.json. Kilden er cz-90. page.json er standardmalen for sider, og /pages/slik-funker-det kjører på den. */ /* Batch 140 — page.personvern.json: NXT AS-avsnittet fjernet. Avsnittet var dessuten avkuttet midt i setningen ("Våre samarbeidskontrakter med disse levera") i temafila selv, ikke bare i gjengivelsen. Ingen CSS-endring. */ /* ================================================= Batch 141 — FAQ-introen (/pages/faq) Seksjonen het "section-rich-text", et navn fire maler delte. Den er omdøpt til cz_faq_intro i page.faq.json så disse reglene bare treffer FAQ-siden. Endrer tre ting: flaten var nesten dobbelt så høy som innholdet, brødteksten gikk over 90 tegn, og avsnittene lå i

    . ================================================= */ [id^="shopify-section"][id$="__cz_faq_intro"] .rich-text { padding-bottom: 48px !important; } [id^="shopify-section"][id$="__cz_faq_intro"] .rich-text__heading { max-width: 20ch; margin-left: 0; margin-right: 0; text-align: left; font-size: clamp(2.2rem, 4.5vw, 3.4rem); letter-spacing: -0.03em; line-height: 1.03; } [id^="shopify-section"][id$="__cz_faq_intro"] .rich-text__text, [id^="shopify-section"][id$="__cz_faq_intro"] .rich-text__text p, [id^="shopify-section"][id$="__cz_faq_intro"] .rte p { max-width: 58ch; margin-left: 0; margin-right: 0; text-align: left; } /* Avsnittene er lagt inn som
    i Theme Editor. Nullstill dem til brødtekst i stedet for å redigere innholdet — teksten skal stå som den er. */ [id^="shopify-section"][id$="__cz_faq_intro"] .rich-text__text h5 { font-family: var(--cz-sans); font-size: 16px; font-weight: 400; line-height: 1.65; letter-spacing: 0; margin: 0 0 14px 0; max-width: 58ch; } /* Mono-etiketten: legg til en Subheading-blokk øverst i seksjonen i Theme Editor, teksten SPØRSMÅL. Da rendrer den som pille, slik utkastene viser. */ [id^="shopify-section"][id$="__cz_faq_intro"] .subheading, [id^="shopify-section"][id$="__cz_faq_intro"] .section__subheading { display: inline-flex !important; align-items: center; font-family: var(--cz-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.025em !important; text-transform: uppercase !important; border: 2px solid currentColor !important; border-radius: 100px !important; padding: 9px 18px !important; line-height: 1 !important; background: transparent !important; color: inherit !important; margin: 0 0 24px 0 !important; opacity: 1 !important; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__cz_faq_intro"] .rich-text { padding-bottom: 32px !important; } } /* ================================================= Batch 142 — jussidene: retur, personvern, kjøpsbetingelser Utkastene (7a/7b/7c) integrert som typografi og struktur, ikke som ny markup. Teksten i Custom code-seksjonene er urørt — den er juridisk og skal stå ordrett. Tre distinkte seksjonsnavn, ett per mal, så ingen av reglene lekker mellom sidene: section_custom_code_XbLhVf → page.retur section_custom_code_DGDaEK → page.personvern section_custom_code_4wpAgj → page.kjopsbetingelser ================================================= */ [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] .shopify-section > *, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] .shopify-section > *, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] .shopify-section > * { box-sizing: border-box; } /* Linjelengde og rytme */ [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] p, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] p, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] p { font-family: var(--cz-sans); font-size: 16px; line-height: 1.65; max-width: 64ch; margin: 0 0 16px 0; text-wrap: pretty; } /* H1 i utkastenes grad */ [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] h1, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] h1, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] h1 { font-family: var(--cz-sans); font-weight: 400; font-size: clamp(1.9rem, 5vw, 2.6rem); letter-spacing: -0.03em; line-height: 1.04; max-width: 20ch; margin: 0 0 28px 0; } /* Bolkeoverskriftene blir mono-etiketter med hårstrek over — samme grep som i utkastene. Gjelder h2/h3/h4 i disse seksjonene. */ [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] h2, [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] h3, [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] h4, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] h2, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] h3, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] h4 { font-family: var(--cz-mono); font-size: 12px; font-weight: 500; letter-spacing: 0.025em; text-transform: uppercase; line-height: 1.2; border-top: 1px solid rgba(0,0,0,0.14); padding-top: 24px; margin: 40px 0 14px 0; max-width: 64ch; } /* Nummererte lister i mono, uten kulepunktinnrykk */ [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] ol, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] ol, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] ol { list-style: none; counter-reset: cz-jur; padding: 0; margin: 0 0 24px 0; max-width: 64ch; } [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] ol > li, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] ol > li, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] ol > li { counter-increment: cz-jur; display: grid; grid-template-columns: 34px 1fr; gap: 16px; align-items: baseline; padding: 18px 0; border-top: 1px solid rgba(0,0,0,0.14); font-family: var(--cz-sans); font-size: 16px; line-height: 1.6; } [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] ol > li:last-child, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] ol > li:last-child, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] ol > li:last-child { border-bottom: 1px solid rgba(0,0,0,0.14); } [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] ol > li::before, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] ol > li::before, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] ol > li::before { content: counter(cz-jur, decimal-leading-zero); font-family: var(--cz-mono); font-size: 12px; font-weight: 500; letter-spacing: 0.025em; } /* Punktlister følger samme brødtekst */ [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] ul li, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] ul li, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] ul li { font-family: var(--cz-sans); font-size: 16px; line-height: 1.65; max-width: 62ch; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] h2, [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] h3, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] h2, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] h3, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] h2, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] h3 { margin-top: 32px; padding-top: 20px; } [id^="shopify-section"][id$="__section_custom_code_XbLhVf"] ol > li, [id^="shopify-section"][id$="__section_custom_code_DGDaEK"] ol > li, [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] ol > li { grid-template-columns: 28px 1fr; gap: 12px; } } /* Batch 143 — kjøpsbetingelsene har egne nummererte overskrifter (

    01 …>) og skal ikke ha mono-etikettene fra Batch 142. De får i stedet utkastets behandling: hårstrek over, sans i overskriftsgrad, nummeret i mono til venstre. */ [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] .betingelser h2 { font-family: var(--cz-sans); font-size: clamp(1.15rem, 2.4vw, 1.375rem); font-weight: 400; letter-spacing: -0.02em; line-height: 1.15; text-transform: none; border-top: 1px solid rgba(0,0,0,0.14); padding-top: 26px; margin: 40px 0 12px 0; gap: 16px; } [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] .betingelser h2 .num { font-family: var(--cz-mono); font-size: 12px; font-weight: 500; letter-spacing: 0.025em; opacity: 1; min-width: 34px; } @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] .betingelser h2 { margin-top: 30px; padding-top: 20px; gap: 12px; } [id^="shopify-section"][id$="__section_custom_code_4wpAgj"] .betingelser h2 .num { min-width: 26px; } } /* Batch 144 — ferskenflaten på mobil. section_double_d4Rdam (Flekker) hadde mobile_height: screen-height-one-half--mobile, som gir bildehalvdelen en fast halvskjermsboks. Bildet fyller den ikke, og seksjonens ferskenbakgrunn sto igjen som tomme flater. Satt til image-height--mobile i både templates/page.json og templates/page.slik-funker-det.json — de to malene er identiske, og /pages/slik-funker-det kjører på page.json. Ingen CSS-endring. */ /* ================================================= Batch 145 — ferskenflaten på /pages/slik-funker-det (mobil) Siden kjører på page.lookbook.json, ikke page.json. Flekker-seksjonen er section-double-2, som Batch 5055-regelen maler fersken med vilje. Problemet er dekningen på mobil: seksjonen har 112 px padding topp og bunn og mobile_height screen-height-one-half--mobile, så bildeboksen får en fast halvskjerm. Bildet (Toyvask-ark_produkt_info_5.png, ikon på limeplate) fyller den ikke, og ferskenfargen står igjen som tomme bånd over og under. Navnet section-double-2 finnes bare i page.lookbook.json — ingen lekkasje. ================================================= */ @media only screen and (max-width: 749px) { [id^="shopify-section"][id$="__section-double-2"] .section-padding, [id^="shopify-section"][id$="__section-double-2"] > .section-padding { padding-top: 40px !important; padding-bottom: 40px !important; } /* La bildet bestemme høyden i stedet for halvskjermsboksen */ [id^="shopify-section"][id$="__section-double-2"] [class*="screen-height"], [id^="shopify-section"][id$="__section-double-2"] [class*="--mobile"] { height: auto !important; min-height: 0 !important; } [id^="shopify-section"][id$="__section-double-2"] img { height: auto !important; width: 100% !important; object-fit: contain !important; display: block; } } /* ================================================= Batch 147 — kanonisk sammenslåing, 17. august 2026 Grunnlag: eksport av temaet «sideutkast-master» (markør sto på 145). Master er nyere overalt der malene skiller seg; cz-143 bidro kun med tre maler som falt ut ved import. Størrelsesforskjellene i index.json (11 KB) og page.toyvask-ark.json (10,7 KB) var JSON-formatering, ikke innhold — seksjoner, rekkefølge og innstillinger var identiske. Innhold i denne batchen: 1. Butikklenker samlet på /finn-din-butikk. To treff: index.json → cz_retail_link, page.toyvask-ark.json → hero. Merk: avpubliseringspunktet for /pages/butikk står dermed ved lag. 2. Temperatur, kanonisk «fra 30 °C» (beslutning 3b, 14. august). Sju treff i fem maler: collection.json ×2 «Alle tekstiler · 30–90°C» product.json ×1 «Temperatur: 30–100 °C» product.parfymefri.json ×1 «Temperatur: 30–100 °C» page.sensitiv-hud.json ×2 «fra 30°C til 90°C» page.story.json ×1 «fra 30°C til 90°C» Ikke rørt: page.toyvask-ark-erfaringer.json sier «ned til 30°C» om oppløsning i kaldtvann — en annen påstand enn vasketemperatur. index.json, page.faq.json og page.toyvask-ark.json sto allerede rett. 3. Tre maler gjenopprettet fra cz-143 etter tredje gangs tap ved import: page.json, page.fakta-utregning.json (beskyttet, aldri godkjent slettet) og page.slik-funker-det.json. Den siste er tilordnet null sider — /pages/slik-funker-det kjører på page.lookbook.json — men gjenopprettes etter beslutning. Master hadde allerede, og er beholdt: mode:comparison på contact_form_jxTya4, SPØRSMÅL-blokken i cz_faq_intro, «Ja.» fjernet fra temperatursvaret i FAQ, og wrapper--narrow på fire seksjoner i page.metode.json. ================================================= */ /* Batch 148 — revisjon av /pages/butikk. Sju gjenværende referanser i tre maler, alle i de tre som ble gjenopprettet i Batch 147: page.json ×2 — contact_form_jxTya4 (btn_secondary_url), section_rich_text_nxJnRg (button_url). Begge aktive. page.json er standardmalen, så enhver side uten tildelt mal rendrer dem. page.slik-funker-det.json ×2 — samme to seksjoner. Malen er tilordnet null sider, så de rendrer ikke i dag. page.fakta-utregning.json ×3 — hardkodet i Liquid-blokken 1777380855789c5769 (aktiv), section_rich_text_nxJnRg (aktiv), og contact_form_jxTya4 (seksjonen er deaktivert, rendrer ikke). Alle sju er lagt om til /finn-din-butikk, også de tre som ikke rendrer i dag — de ville blitt aktive ved tildeling eller reaktivering, og en gjenopprettet mal skal ikke bære med seg legacy-lenker. Ingen andre filer rørt. Ingen treff i sections/, snippets/, layout/ eller blocks/. /pages/butikk kan avpubliseres. */ /* ================================================= Batch 149 — navigasjonsfonten. Bekreftet død selektor. Regelen fra Batch 3 traff .header__menu-item, .drawer__menu-item, .list-menu__item og .menu-drawer__menu-item. Ingen av de fire klassene finnes i Broadcast. Temaet bruker .navlink, .navtext, .header__menu, .drawer__main-menu og .mobile-menu__title. Navigasjonen har derfor aldri fått merkevarefonten, verken på desktop eller mobil — den arver systemfonten fra temaets egen CSS. Samme feiltype som CSS-scopingen: selektoren så riktig ut, men matchet ingenting. Klassenavnene er lest ut av sections/header.liquid og sections/mobile-menu.liquid i denne eksporten. ================================================= */ /* Batch 150 — tomrommet mellom produktseksjonen og butikklogoene. cz_toyvask_chapter hadde 96 px bunn og cz_retail_text 96 px topp, altså 192 px sammenhengende luft før «Allerede i 2 380 butikker». Målt til ~350 px i nettleser fordi section-double legger til egen bildehøyde. Satt til 48 px hver, i templates/index.json. Ingen CSS-endring. */ /* Batch 151 — optisk tyngde i navigasjonen. ABC Repro finnes bare i Regular og Medium i temaet; 700 ville gitt syntetisk fet, som blir uskarp. Økt til 13 px og 0,08 em sperring i stedet. Ber om ABCRepro-Bold.woff2 fra Dinamo hvis lisensen dekker det — da settes navigasjonen på ekte bold. */ /* Batch 152 — navigasjonsregelen fra Batch 149 og 151 er fjernet igjen. Beslutning 17. august: hovedmenyen beholder systemfonten i vekt 700, som kommer fra temainnstillingen type_nav_font = "system_ui_n7". ABC Repro finnes bare i Regular og Medium i temaet, så merkevarefonten kan ikke gi samme tyngde uten syntetisk fet. Vekten ble prioritert over fonten. Regelen fra Batch 3 (.header__menu-item m.fl.) var uansett død — de fire klassene finnes ikke i Broadcast. Navigasjonen har derfor aldri hatt ABC Repro, og ser nå ut som den alltid har gjort. Gjenåpnes hvis ABCRepro-Bold.woff2 skaffes fra Dinamo: da settes .navlink, .navtext, .drawer__main-menu og .mobile-menu__title på den. */ /* ================================================= Batch 153, steg 1 — brødtekstens linjelengde. section-rich-text.liquid rendrer tekstblokker som
    . Klassen har ingen max-width og arver .wrapper → --content-max: 1100px, altså rundt 110 tegn ved 18 px. Tokenet --cz-measure-body (62ch) fantes allerede og var ment å gjelde her, men reglene pekte på .hero__description, som ikke finnes i denne seksjonstypen. Treffer 13 tekstblokker i sju maler: index, page.about, page.metode, page.butikk, page.fakta-utregning, page.json, page.slik-funker-det. Ønsket effekt i alle sju. ================================================= */ .hero__rte.body-large { max-width: var(--cz-measure-body); } /* ============================================ Batch 155 — Typografi-system: normal body 14->16px, ny --cz-fs-compact (14px) og --cz-fs-lead (24px) lagt til. Disse to reglene er de verifiserte trygge selektorene fra body-large-mekanisme-revisjonen: treffer kun faktisk rendret .hero__rte/.column__text/.grid__text-struktur. ALDRI bar .body-large, siden .drawer__main-menu.body-large (mobilmeny) da ville blitt truffet utilsiktet. OBS (rettelse under implementering): column__text/grid__text trenger ogsa en eksplisitt " p"-selektor (samme arsak som hero__rte) - teksten star ofte i et ustylet

    -barn, og grunnregelen/.rte p (16px) traff da direkte pa barnet og vant over containerens font-size. Lagt til under. ============================================ */ .hero__rte.body-large, .hero__rte.body-large p, .column__text.body-large, .column__text.body-large p, .grid__text.body-large, .grid__text.body-large p { font-size: var(--cz-fs-body-lg); } .hero__rte.body-small, .hero__rte.body-small p, .column__text.body-small, .column__text.body-small p, .grid__text.body-small, .grid__text.body-small p { font-size: var(--cz-fs-compact); } /* Batch 153, steg 2 og 3 — Om oss. Steg 2: «Vi var én. Nå er vi to.» og «Fagfolkene henter vi inn.» var text-blokker med body-x-large (20 px) og manuell , altså syntetisk fet brødtekst 2 px over brødteksten selv. Nå heading-blokker med heading_tag h3 og heading_font_size heading-small i page.about.json. Ekte overskriftssemantikk, vekt fra stigen, ingen falsk bold. Steg 3: 5 døde regelblokker fjernet fra cz_om_-seksjonene. De pekte på .hero__description og .rte p strong. section-rich-text.liquid rendrer .hero__rte og har ingen .rte-wrapper, så ingen av dem har noen gang virket. De er ikke skrevet om til .hero__rte — å aktivere femten regler samtidig gjør det umulig å se hva som forårsaker hva. Sett siden rendret først, så tar vi det som faktisk mangler. Ikke rørt: --cz-fs-display og --cz-fs-h2 er globale. */ /* ================================================= Batch 154 — Om oss: redaksjonell tekstgrad Stigen på siden var H1 76,8 → H2 44,8 → lead 20 → brødtekst 18. Et stort hopp, så nesten ingenting. Batch 153 ga leadene riktig semantikk, men heading-small computes til 20 px: heading_small finnes ikke i settings_data.json, så schema-standarden (20) gjelder. Samme grad som body-x-large var. Ingen visuell endring. Nå: H1 76,8 → H2 44,8 → lead 24 → brødtekst 20. Scopet til page.about.json alene. Globale tokens er ikke rørt — --cz-fs-body-lg leses, ikke endres. Vanlig brødtekst ellers på nettstedet står fortsatt på .body-large = 18 px. 62ch-måltallet fra Batch 153 gjelder uendret; her settes bare graden. Linjehøyden er bevisst ikke overstyrt på brødteksten — den vurderes etter at siden er sett rendret, på desktop og mobil. ================================================= */ [id^="shopify-section"][id$="__cz_om_hero"] .hero__rte.body-large, [id^="shopify-section"][id$="__cz_om_starten"] .hero__rte.body-large, [id^="shopify-section"][id$="__cz_om_teamet"] .hero__rte.body-large, [id^="shopify-section"][id$="__cz_om_fagfolk"] .hero__rte.body-large, [id^="shopify-section"][id$="__cz_om_metoden"] .hero__rte.body-large, [id^="shopify-section"][id$="__cz_om_ansvar"] .hero__rte.body-large, [id^="shopify-section"][id$="__cz_om_avslutning"] .hero__rte.body-large { font-size: var(--cz-fs-body-lg) !important; } [id^="shopify-section"][id$="__cz_om_teamet"] .hero__title.heading-small, [id^="shopify-section"][id$="__cz_om_fagfolk"] .hero__title.heading-small { font-size: 24px !important; line-height: 1.24 !important; letter-spacing: -0.01em !important; max-width: 30ch; } /* ================================================= Batch 155 — retting av Batch 154. 154 satte font-size på containeren .hero__rte. Avsnittet arver den ikke: aller først i denne fila står grunnregelen body, p, li, … { font-size: var(--cz-fs-body); } → 14px som treffer

    direkte og vinner over enhver containerverdi. Det betyr også at .body-large aldri har virket i section-rich-text — klassen sitter på div-en, ikke på avsnittet. All brødtekst i disse seksjonene har stått på 14 px hele tiden, ikke 18. Regelen treffer nå avsnittene. Linjehøyden er bevisst ikke rørt; den arver --cz-lh-body (1.72) og vurderes etter at siden er sett rendret. 62ch-regelen fra Batch 153 står på containeren og virker som den skal — bredden begrenser avsnittet uansett. ================================================= */ [id^="shopify-section"][id$="__cz_om_hero"] .hero__rte.body-large p, [id^="shopify-section"][id$="__cz_om_starten"] .hero__rte.body-large p, [id^="shopify-section"][id$="__cz_om_teamet"] .hero__rte.body-large p, [id^="shopify-section"][id$="__cz_om_fagfolk"] .hero__rte.body-large p, [id^="shopify-section"][id$="__cz_om_metoden"] .hero__rte.body-large p, [id^="shopify-section"][id$="__cz_om_ansvar"] .hero__rte.body-large p, [id^="shopify-section"][id$="__cz_om_avslutning"] .hero__rte.body-large p { font-size: var(--cz-fs-body-lg) !important; } /* ============================================================ Batch 157 - Homepage UX cleanup (3 godkjente endringer fra audit) ============================================================ */ /* 1. cz_toyvask_chapter sin CTA "SE TOYVASK-ARK" er deaktivert via templates/index.json (block "b" satt disabled:true) - ikke CSS. Hero sin egen "Se toyvask-ark" og section_double_eb37N3 sin "Velg din variant" er upavirket. */ /* 2. "En smartere klesvask?" (section_double_eb37N3) - fjerner den ekstra venstremargen pa .brick__block__text i denne seksjonen. Kilde til den delte regelen: custom-content.css (urort). */ [id^="shopify-section"][id$="__section_double_eb37N3"] .brick__block__text { margin-left: 0; } /* 3. "Var metode"-pillen i cz_method_preview er en uklassifisert

    og matcher derfor .grid__description p (--cz-pill-fs, 10px, se linje 502-509 - denne regelen bruker !important). Ma derfor ogsa bruke !important for a vinne, selv om denne selectoren har hoyere specificity (ID-scoping + child-combinator). Matcher IKKE mega-regelen for .subheading/.rich-text__subheading/ .section__subheading/.hero__subheading (linje ~2811), siden

    er uklassifisert. */ [id^="shopify-section"][id$="__cz_method_preview"] .grid__description > p { font-size: 12px !important; } /* Batch 158C — synlighet: "Eller finn oss i butikk" i mørk CTA-seksjon, 18. august 2026. Lenken arvet --link (svart) fra fargeskjemaet, mens seksjonens bakgrunn er overstyrt til --cz-ink (svart) lenger opp i denne filen. Resultat: svart tekst på svart bunn. Fikser kun denne lenken i denne seksjonen — ingen andre lenker/knapper, ingen destinasjon, ingen bakgrunn, ingen globale lenkestiler er endret. */ [id^="shopify-section"][id$="__section_rich_text_nxJnRg"] .hero__rte a[href="/pages/finn-din-butikk"] { color: #ffffff; --main-color: #ffffff; --hover-color: rgba(255, 255, 255, 0.7); } /* ================================================= Batch 159 — Navigasjonens font-size, desktop. Kun font-size endres. font-family og font-weight er bevisst urørt — se Batch 152 (17. august): hovedmenyen beholder systemfonten i vekt 700 (temainnstillingen type_nav_font = "system_ui_n7"), siden ABC Repro kun finnes i Regular og Medium og ville gitt syntetisk fet skrift ved 700. Selektorene er temaets egne fire klasser, samme sett Batch 149 identifiserte i sections/header.liquid og sections/mobile-menu.liquid: .navlink, .header__menu, .drawer__main-menu, .mobile-menu__title. Scopet til samme desktop-brytpunkt filen ellers bruker (min-width: 750px) — ingen endring på mobil. ================================================= */ @media only screen and (min-width: 750px) { .navlink, .header__menu, .drawer__main-menu, .mobile-menu__title { font-size: 16px; } /* Batch 160 -- Nyhetsbrev: samle rich text + Klaviyo-skjema visuelt (2026-09-15). Seksjoner: cz_next_category_text (rich text) + cz_newsletter_klaviyo (Klaviyo-embed). Gir begge deler samme sentrerte, smale innholdsramme (utgangspunkt: skjemaets nåværende bredde 440px), justerer venstrekant til å matche skjemafeltene, og reduserer avstanden mellom tekst og skjema. Kun disse to seksjonene. */ [id$="__cz_next_category_text"] .hero__content__wrapper { max-width: 440px !important; } [id$="__cz_next_category_text"] .hero__content { max-width: none !important; padding-left: 41px !important; padding-right: 41px !important; } [id$="__cz_next_category_text"] .hero__content > *:last-child { --block-padding-bottom: 0 !important; padding-bottom: 0 !important; margin-bottom: 0 !important; } [id$="__cz_next_category_text"] .hero__content > *:last-child > *:last-child { margin-bottom: 0 !important; } [id$="__cz_newsletter_klaviyo"] [id^="CustomCode--"] { --PT: 28px !important; } @media only screen and (max-width: 749px) { [id$="__cz_next_category_text"] .hero__content__wrapper { max-width: 100% !important; } [id$="__cz_next_category_text"] .hero__content { padding-left: 22px !important; padding-right: 22px !important; box-sizing: border-box !important; } [id$="__cz_newsletter_klaviyo"] #cz-klaviyo { max-width: 100% !important; padding-left: 22px !important; padding-right: 22px !important; box-sizing: border-box !important; } }