/*
 * CRATER typography system
 * Display: Playfair Display, reserved for the most important headings.
 * Interface and reading: Montserrat with restrained 400–600 weights.
 */
:root {
    --cr-type-display: "Playfair Display", Georgia, serif;
    --cr-type-body: Montserrat, "Segoe UI", Arial, sans-serif;
    --cr-ui-gold: #e7b541;
    --cr-ui-gold-light: #f4cf78;
    --cr-ui-ink: #0c0a07;
    --cr-ui-panel: #11100d;
    --cr-ui-cream: #f5f0e6;
}

body {
    font-family: var(--cr-type-body) !important;
    font-weight: 400;
    line-height: 1.65;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body :is(input, select, textarea, button) {
    font-family: var(--cr-type-body) !important;
}

/* The serif is the ceremonial voice: page and major section titles only. */
body #page #content :is(h1, .entry-title),
body #page #content h2:not(.woocommerce-loop-product__title):not(.wc-block-components-product-name),
body #page #content .cr-unified-title,
body #page #content .cr-personalization-title {
    font-family: var(--cr-type-display) !important;
    font-weight: 600 !important;
    letter-spacing: -.012em !important;
    text-wrap: balance;
}

body #page #content :is(h1, .entry-title) {
    font-size: clamp(38px, 4.4vw, 62px) !important;
    line-height: 1.04 !important;
}

body #page #content h2:not(.woocommerce-loop-product__title):not(.wc-block-components-product-name) {
    font-size: clamp(29px, 3.1vw, 44px) !important;
    line-height: 1.12 !important;
}

/* Utility headings should stay crisp and quiet. */
body #page #content :is(h3, h4, h5, h6),
body #page footer :is(h2, h3, h4, h5, h6),
body #page .site-footer :is(h2, h3, h4, h5, h6) {
    font-family: var(--cr-type-body) !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    line-height: 1.35 !important;
}

body #page #content :is(p, li, dd, dt) {
    font-weight: 400;
}

body #page #content :is(label, legend, th, strong, b) {
    font-weight: 600;
}

/* Navigation, buttons and form controls share one readable interface voice. */
body #page :is(.main-header-menu, .site-header, .site-footer, footer) a,
body #page #content :is(button, .button, .wp-element-button, .elementor-button, input[type="submit"], input[type="button"]),
body #page #content :is(input, select, textarea) {
    font-family: var(--cr-type-body) !important;
    letter-spacing: 0 !important;
}

body #page :is(.main-header-menu, .site-header) a {
    font-weight: 500 !important;
}

body #page #content :is(button, .button, .wp-element-button, .elementor-button, input[type="submit"], input[type="button"]) {
    font-weight: 600 !important;
}

/* Product cards: one system on archives, category pages and related products. */
body.woocommerce ul.products li.product .woocommerce-loop-product__title,
body.woocommerce-page ul.products li.product .woocommerce-loop-product__title,
body #page #content ul.products li.product .woocommerce-loop-product__title,
body #page #content .related.products ul.products li.product .woocommerce-loop-product__title,
body #page #content .upsells.products ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--cr-type-body) !important;
    font-size: clamp(17px, 1.35vw, 21px) !important;
    font-weight: 600 !important;
    line-height: 1.38 !important;
    letter-spacing: -.006em !important;
    text-wrap: pretty;
}

body.woocommerce ul.products li.product .price,
body.woocommerce-page ul.products li.product .price,
body #page #content ul.products li.product .price,
body #page #content ul.products li.product .price :is(.amount, bdi),
body.single-product #page #content .summary .price,
body.single-product #page #content .summary .price :is(.amount, bdi),
body #page #content :is(.wc-block-grid__product-price, .wc-block-components-product-price) {
    font-family: var(--cr-type-body) !important;
    font-weight: 600 !important;
    letter-spacing: -.012em !important;
    font-variant-numeric: tabular-nums;
}

/* Archive and related-product calls to action use one visual language. */
body #page #content ul.products li.product :is(a.button, .button),
body #page #content .related.products ul.products li.product :is(a.button, .button),
body #page #content .upsells.products ul.products li.product :is(a.button, .button) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 54px !important;
    padding: 12px 18px !important;
    border: 1px solid #e0ad37 !important;
    border-radius: 11px !important;
    background: linear-gradient(135deg, #f5ce72 0%, #e4ae39 100%) !important;
    color: #17130d !important;
    font-family: var(--cr-type-body) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

body #page #content ul.products li.product :is(a.button, .button):hover,
body #page #content ul.products li.product :is(a.button, .button):focus-visible {
    border-color: #f2ce78 !important;
    background: linear-gradient(135deg, #f8d888 0%, #ecbb4b 100%) !important;
    color: #0c0a07 !important;
    transform: translateY(-1px);
}

/* Generated category copy fills only empty descriptions. */
body #page #content .term-description {
    max-width: 920px;
    margin: 16px 0 34px;
    color: var(--cr-type-muted, #c9c3b9);
    font-family: var(--cr-type-body) !important;
    font-size: clamp(15px, 1.2vw, 17px);
    line-height: 1.75;
}

body #page #content .term-description p:last-child {
    margin-bottom: 0;
}

body.single-product #page #content .summary .product_title {
    font-family: var(--cr-type-display) !important;
    font-size: clamp(38px, 4vw, 54px) !important;
    font-weight: 600 !important;
    line-height: 1.05 !important;
    letter-spacing: -.014em !important;
}

body.single-product #page #content .summary :is(.woocommerce-product-details__short-description, p) {
    font-size: clamp(15px, 1.15vw, 17px);
    font-weight: 400 !important;
    line-height: 1.7;
}

body.single-product #page #content :is(.product_meta, .woocommerce-breadcrumb) {
    font-size: 13px;
    font-weight: 400 !important;
    line-height: 1.6;
}

/* Every personalization module follows the same restrained hierarchy. */
body.single-product #page #content form.cr-unified-personalization {
    font-family: var(--cr-type-body) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
}

body.single-product #page #content form.cr-unified-personalization :is(.cr-unified-title, .cr-personalization-title, .cr-catalog-options > h3, .crm-config > h3) {
    font-family: var(--cr-type-display) !important;
    font-size: clamp(25px, 2.6vw, 32px) !important;
    font-weight: 600 !important;
    line-height: 1.12 !important;
    letter-spacing: -.01em !important;
}

body.single-product #page #content form.cr-unified-personalization :is(label, th, .cr-option-card > strong) {
    font-weight: 600 !important;
}

body.single-product #page #content form.cr-unified-personalization :is(select, input, textarea) {
    font-size: 15px !important;
    font-weight: 400 !important;
}

body.single-product #page #content form.cr-unified-personalization :is(.single_add_to_cart_button, button, .button) {
    font-weight: 600 !important;
}

body.single-product #page #content form.cr-unified-personalization :is(.cr-options-total, .crm-unit) {
    font-weight: 600 !important;
}

/* Offer filters are functional UI, except their single section title. */
body #page #content .cr-offer-filter-intro h2 {
    font-family: var(--cr-type-display) !important;
    font-size: clamp(30px, 3.2vw, 44px) !important;
    font-weight: 600 !important;
    line-height: 1.08 !important;
    letter-spacing: -.01em !important;
}

body #page #content .cr-offer-filter-intro span,
body #page #content .cr-filter-field label,
body #page #content .cr-offer-filters :is(button, a) {
    font-weight: 600 !important;
}

/* The template library keeps its editorial hero, while cards remain practical. */
body.page-template #page .ctl-hero h1,
body #page #content .ctl-hero h1 {
    font-family: var(--cr-type-display) !important;
    font-size: clamp(42px, 5.3vw, 72px) !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: -.018em !important;
}

body #page #content .ctl-library .ctl-card .ctl-card-body h2,
body #page #content :is(.ctl-dialog-copy h2, .ctl-empty strong) {
    font-family: var(--cr-type-body) !important;
    font-size: 19px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
}

body #page #content :is(.ctl-preview-button, .ctl-download, .ctl-more, #ctl-reset) {
    font-family: var(--cr-type-body) !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

/* Checkout and cart prioritise legibility over display styling. */
body.woocommerce-cart #page #content :is(.cart_totals h2, table th),
body.woocommerce-checkout #page #content :is(h3, table th, .wc-block-components-title) {
    font-family: var(--cr-type-body) !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

/* Pagination and WooCommerce notices belong to the same dark-gold interface. */
body.woocommerce #page #content nav.woocommerce-pagination ul.page-numbers,
body.woocommerce-page #page #content nav.woocommerce-pagination ul.page-numbers {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 !important;
    border: 0 !important;
}

body.woocommerce #page #content nav.woocommerce-pagination ul.page-numbers > li,
body.woocommerce-page #page #content nav.woocommerce-pagination ul.page-numbers > li {
    margin: 0 !important;
    border: 0 !important;
}

body.woocommerce #page #content nav.woocommerce-pagination .page-numbers li > :is(a, span),
body.woocommerce-page #page #content nav.woocommerce-pagination .page-numbers li > :is(a, span) {
    box-sizing: border-box;
    display: grid !important;
    place-items: center;
    min-width: 52px;
    min-height: 52px;
    padding: 8px 13px !important;
    border: 1px solid rgba(231, 181, 65, .62) !important;
    border-radius: 9px;
    background: #0b0a08 !important;
    color: var(--cr-ui-gold-light) !important;
    font-family: var(--cr-type-body) !important;
    font-size: 16px;
    font-weight: 500;
    line-height: 1 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

body.woocommerce #page #content nav.woocommerce-pagination .page-numbers li > span.current,
body.woocommerce-page #page #content nav.woocommerce-pagination .page-numbers li > span.current {
    border-color: var(--cr-ui-gold) !important;
    background: linear-gradient(135deg, #f4cd72, #dfa936) !important;
    color: var(--cr-ui-ink) !important;
    font-weight: 600;
}

body.woocommerce #page #content nav.woocommerce-pagination .page-numbers li > a:hover,
body.woocommerce #page #content nav.woocommerce-pagination .page-numbers li > a:focus-visible,
body.woocommerce-page #page #content nav.woocommerce-pagination .page-numbers li > a:hover,
body.woocommerce-page #page #content nav.woocommerce-pagination .page-numbers li > a:focus-visible {
    border-color: var(--cr-ui-gold-light) !important;
    background: #211a0d !important;
    color: #ffe4a2 !important;
    transform: translateY(-1px);
    outline: 2px solid transparent;
}

body #page #content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error),
body #page #content .wc-block-components-notice-banner {
    border: 1px solid rgba(231, 181, 65, .58) !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #15120d, var(--cr-ui-panel) 72%) !important;
    color: var(--cr-ui-cream) !important;
    box-shadow: 0 16px 38px rgba(0, 0, 0, .2) !important;
}

body #page #content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::before,
body #page #content .wc-block-components-notice-banner > svg {
    color: var(--cr-ui-gold-light) !important;
    fill: var(--cr-ui-gold-light) !important;
}

body #page #content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a.button, a.wc-forward),
body #page #content .wc-block-components-notice-banner :is(a.button, a.wc-forward) {
    border: 1px solid var(--cr-ui-gold) !important;
    border-radius: 9px !important;
    background: linear-gradient(135deg, #f4cd72, #dfa936) !important;
    color: var(--cr-ui-ink) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

body #page #content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a.button, a.wc-forward):hover,
body #page #content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a.button, a.wc-forward):focus-visible,
body #page #content .wc-block-components-notice-banner :is(a.button, a.wc-forward):hover,
body #page #content .wc-block-components-notice-banner :is(a.button, a.wc-forward):focus-visible {
    border-color: var(--cr-ui-gold-light) !important;
    background: linear-gradient(135deg, #f8d888, #e9b746) !important;
    color: var(--cr-ui-ink) !important;
    transform: translateY(-1px);
}

body #page #content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) a:not(.button):not(.wc-forward),
body #page #content .wc-block-components-notice-banner a:not(.button):not(.wc-forward) {
    color: var(--cr-ui-gold-light) !important;
    text-decoration-color: rgba(244, 207, 120, .55) !important;
    text-underline-offset: 3px;
}

body #page #content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) a:not(.button):not(.wc-forward):hover,
body #page #content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) a:not(.button):not(.wc-forward):focus-visible,
body #page #content .wc-block-components-notice-banner a:not(.button):not(.wc-forward):hover,
body #page #content .wc-block-components-notice-banner a:not(.button):not(.wc-forward):focus-visible {
    color: #ffe4a2 !important;
    text-decoration-color: currentColor !important;
}

@media (max-width: 700px) {
    body #page #content :is(h1, .entry-title) {
        font-size: clamp(34px, 10vw, 46px) !important;
        line-height: 1.06 !important;
    }

    body.single-product #page #content .summary .product_title {
        font-size: clamp(34px, 9.5vw, 44px) !important;
    }

    body #page #content h2:not(.woocommerce-loop-product__title):not(.wc-block-components-product-name) {
        font-size: clamp(27px, 8vw, 36px) !important;
    }
}

/*
 * Astra's desktop cart icon is deliberately reused beside the mobile menu.
 * Keep the icon clickable, but never expose its desktop hover panel on touch
 * layouts. When collapsed, that panel otherwise becomes a two-border line
 * running through the logo and controls.
 */
@media (max-width: 921px) {
    body #ast-desktop-header .ast-site-header-cart-data {
        display: none !important;
        visibility: hidden !important;
        width: 0 !important;
        height: 0 !important;
        border: 0 !important;
        box-shadow: none !important;
        pointer-events: none !important;
    }
}

/*
 * Kontakt: Elementor pozostawia mobilnemu kontenerowi mapy wysokość ok. 58 px,
 * mimo że osadzona mapa ma 450 px. Utrzymujemy pełny, czytelny kadr tylko na
 * stronie kontaktowej i tylko w układzie telefonu.
 */
@media (max-width: 767px) {
    body.page-id-16 #mapa > .elementor-element-81a03b2 {
        height: clamp(320px, 88vw, 380px) !important;
        min-height: 320px !important;
        overflow: hidden !important;
    }

    body.page-id-16 #mapa .elementor-element-723f4b1 {
        width: 100% !important;
        height: 100% !important;
        min-height: 320px !important;
    }

    body.page-id-16 #mapa iframe {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 320px !important;
    }
}
