/*
Theme Name: Båstad 3D-print
Theme URI: https://bastad3dprint.se
Author: Båstad 3D-print AB
Author URI: https://bastad3dprint.se
Description: Modernt blocktema för Båstad 3D-print AB – 3D-utskrift, modellering och webbdesign. Marinblått och orange från loggan, Space Grotesk + Manrope, färdiga mönster för startsida och kundprojekt.
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bastad3dprint
Tags: block-patterns, full-site-editing, one-column, wide-blocks, custom-colors, editor-style
*/

/* ---------- Grund ---------- */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; } }
:where(section[id]) { scroll-margin-top: 1.5rem; }
img { height: auto; }
.wp-element-button, .wp-block-button__link { display: inline-flex; align-items: center; gap: .6rem; min-height: 52px; box-sizing: border-box; transition: transform .15s ease, background-color .15s ease; }
.wp-element-button:hover, .wp-block-button__link:hover { transform: translateY(-2px); }

/* Mörka ytor */
.b3d-on-dark .wp-block-button.is-style-outline > .wp-block-button__link { color: #fff; border-color: var(--wp--preset--color--steel); }
.b3d-on-dark .wp-block-button.is-style-outline > .wp-block-button__link:hover { border-color: var(--wp--preset--color--orange); }

/* ---------- Sidhuvud ---------- */
.b3d-header .wp-block-navigation a { text-decoration: none; }
.b3d-header .wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--orange); }
.b3d-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--ink); color: #fff; }
.b3d-header .wp-block-navigation__responsive-container-open, .b3d-header .wp-block-navigation__responsive-container-close { color: #fff; min-width: 44px; min-height: 44px; }
.b3d-header .wp-block-button__link { min-height: 44px; padding: .7rem 1.25rem; }
.b3d-brand { gap: .75rem !important; }
.b3d-logo-mark { margin: 0 !important; }
.b3d-logo-mark img { width: 40px; height: auto; display: block; }
.b3d-wordmark { margin: 0; font-family: var(--wp--preset--font-family--space-grotesk); font-weight: 700; font-size: 1.0625rem; line-height: 1; letter-spacing: .06em; }
.b3d-wordmark a { text-decoration: none; color: #fff; }
.b3d-wordmark mark { background: transparent; }

/* ---------- Överrubrik / chip ---------- */
.is-style-eyebrow { font-size: var(--wp--preset--font-size--x-small); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--orange-dark); margin: 0; }
.b3d-on-dark .is-style-eyebrow { color: var(--wp--preset--color--orange); }
.b3d-chip { display: inline-flex !important; align-items: center; gap: .6rem; border: 1px solid var(--wp--preset--color--slate); border-radius: 999px; padding: .5rem 1rem; font-size: var(--wp--preset--font-size--x-small); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--cloud); width: fit-content; }
.b3d-chip::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--wp--preset--color--orange); flex: none; }

/* ---------- Hero ---------- */
.b3d-hero-media { position: relative; }
.b3d-hero-media .wp-block-image { margin: 0; }
.b3d-hero-media .wp-block-image img { width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; border-radius: var(--wp--custom--radius--large); display: block; }
.b3d-badge { position: absolute; left: -1.5rem; bottom: 3rem; background: #fff; color: var(--wp--preset--color--ink); border-radius: 18px; padding: 1rem 1.25rem !important; box-shadow: var(--wp--preset--shadow--float); gap: .875rem !important; }
.b3d-badge .wp-block-image img { width: 44px; height: 44px; display: block; }
.b3d-badge p { margin: 0; line-height: 1.3; }
@media (max-width: 781px) { .b3d-badge { left: 1rem; bottom: 1rem; } }

/* ---------- Kort ---------- */
.is-style-card { border-radius: var(--wp--custom--radius--large); padding: clamp(1.75rem, 3vw, 2.5rem) !important; }
.is-style-card:not(.has-background) { background: #fff; border: 1px solid var(--wp--preset--color--line); }
.b3d-icon { margin: 0 !important; }
.b3d-icon img { width: 56px; height: 56px; display: block; }
.b3d-num { font-family: var(--wp--preset--font-family--space-grotesk); font-size: var(--wp--preset--font-size--small); margin: 0; }
.b3d-push-bottom { margin-top: auto !important; }

/* Etiketter */
ul.is-style-pills { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .625rem; }
ul.is-style-pills li { border: 1px solid var(--wp--preset--color--line); border-radius: 999px; padding: .45rem .875rem; font-size: var(--wp--preset--font-size--small); line-height: 1.3; margin: 0; }
.b3d-on-dark ul.is-style-pills li, .has-ink-background-color ul.is-style-pills li { border-color: var(--wp--preset--color--slate); }
ul.is-style-pills.b3d-pills-filled li { border-color: transparent; background: var(--wp--preset--color--ground-2); }

/* Pil-länk */
.is-style-arrow-link { margin: 0; font-weight: 700; }
.is-style-arrow-link a { text-decoration: none; display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; }
.is-style-arrow-link a::after { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--b3d-icon-arrow) center / contain no-repeat; mask: var(--b3d-icon-arrow) center / contain no-repeat; transition: transform .15s ease; }
.is-style-arrow-link a:hover::after { transform: translateX(4px); }
.is-style-arrow-link.is-external a::after { -webkit-mask-image: var(--b3d-icon-arrow-up-right); mask-image: var(--b3d-icon-arrow-up-right); }

/* ---------- 3D-projekt ---------- */
.b3d-tile { gap: 1rem !important; }
.b3d-tile .wp-block-image { margin: 0; border-radius: var(--wp--custom--radius--medium); overflow: hidden; }
.b3d-tile .wp-block-image img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; transition: transform .35s ease; }
.b3d-tile:hover .wp-block-image img { transform: scale(1.03); }
.b3d-tile p { margin: 0; }

/* ---------- Webbprojekt-lista ---------- */
.b3d-rows { border-top: 1px solid var(--wp--preset--color--cloud); gap: 0 !important; }
.b3d-row { position: relative; border-bottom: 1px solid var(--wp--preset--color--cloud); padding: 1.75rem 1rem !important; border-radius: 4px; transition: background-color .2s ease; margin: 0 !important; }
.b3d-row:hover { background: #fff; }
.b3d-row h3 { margin: 0; font-size: clamp(1.375rem, 2.4vw, 1.875rem); }
.b3d-row h3 a { color: inherit; text-decoration: none; }
.b3d-row h3 a::before { content: ""; position: absolute; inset: 0; }
.b3d-row p { margin: 0; }
.b3d-row .b3d-num { width: 2rem; color: var(--wp--preset--color--muted); }
.b3d-row .b3d-row-text { flex: 1 1 240px; gap: .25rem !important; }
.b3d-row-arrow { width: 48px; height: 48px; border-radius: 50%; border: 1.5px solid currentColor; flex: none; position: relative; }
.b3d-row-arrow::after { content: ""; position: absolute; inset: 14px; background: currentColor; -webkit-mask: var(--b3d-icon-arrow-up-right) center / contain no-repeat; mask: var(--b3d-icon-arrow-up-right) center / contain no-repeat; }
.b3d-row:hover .b3d-row-arrow { background: var(--wp--preset--color--ink); color: #fff; }

/* ---------- Process ---------- */
.b3d-step { border-top: 3px solid var(--wp--preset--color--navy); padding-top: 1.5rem !important; gap: .75rem !important; }
.b3d-step p, .b3d-step h3 { margin: 0; }

/* ---------- CTA ---------- */
.b3d-cta { border-radius: var(--wp--custom--radius--x-large); }
.b3d-contact-link { margin: 0; }
.b3d-contact-link a { display: flex; align-items: center; gap: .875rem; min-height: 56px; box-sizing: border-box; padding: 1.1rem 1.375rem; border-radius: 18px; background: var(--wp--preset--color--ink); color: #fff; font-weight: 700; text-decoration: none; transition: transform .15s ease; }
.b3d-contact-link a:hover { color: #fff; transform: translateY(-2px); }
.b3d-contact-link a::before { content: ""; width: 22px; height: 22px; flex: none; background: var(--wp--preset--color--orange); -webkit-mask: var(--b3d-icon-mail) center / contain no-repeat; mask: var(--b3d-icon-mail) center / contain no-repeat; }
.b3d-contact-link.is-phone a::before { -webkit-mask-image: var(--b3d-icon-phone); mask-image: var(--b3d-icon-phone); }

/* ---------- Sidfot ---------- */
.b3d-footer a { color: var(--wp--preset--color--cloud); text-decoration: none; }
.b3d-footer a:hover { color: var(--wp--preset--color--orange); }
.b3d-footer p { margin: 0; }
.b3d-footer .b3d-footer-col { gap: .75rem !important; }
.b3d-footer-bottom { border-top: 1px solid var(--wp--preset--color--navy); }

/* ---------- Kundprojekt ---------- */
.b3d-case .wp-block-column { min-width: 0; }
.b3d-browser { background: #fff; border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius--medium); overflow: hidden; box-shadow: var(--wp--preset--shadow--soft); transition: transform .3s ease, box-shadow .3s ease; gap: 0 !important; }
.b3d-case:hover .b3d-browser { transform: translateY(-6px); box-shadow: 0 36px 60px rgba(28,33,44,0.22); }
.b3d-browser-bar { display: flex; align-items: center; gap: .875rem; margin: 0 !important; padding: .875rem 1.125rem; border-bottom: 1px solid var(--wp--preset--color--line); font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); }
.b3d-browser-bar::before { content: ""; width: 45px; height: 11px; flex: none; background: radial-gradient(circle at 5.5px 50%, var(--wp--preset--color--line) 5.5px, transparent 6px), radial-gradient(circle at 22.5px 50%, var(--wp--preset--color--line) 5.5px, transparent 6px), radial-gradient(circle at 39.5px 50%, var(--wp--preset--color--line) 5.5px, transparent 6px); }
.b3d-browser-bar span, .b3d-browser-bar a { flex: 1; background: var(--wp--preset--color--ground); border-radius: 999px; padding: .375rem .875rem; color: inherit; text-decoration: none; }
.b3d-browser .wp-block-image { margin: 0; }
.b3d-browser .wp-block-image img { width: 100%; aspect-ratio: 16 / 9.4; object-fit: cover; object-position: top; display: block; }
.b3d-meta { border-top: 1px solid var(--wp--preset--color--line); padding-top: 1.25rem !important; }
.b3d-meta p { margin: 0; }
.b3d-meta .b3d-meta-label { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); }
.b3d-meta .b3d-meta-value { font-weight: 600; }
.b3d-feature { border-radius: 20px; padding: 1.75rem !important; gap: .75rem !important; }
.b3d-feature p, .b3d-feature h3 { margin: 0; }
.b3d-feature .wp-block-image img { width: 26px; height: 26px; display: block; }
.b3d-feature .wp-block-image { margin: 0; }

/* Mobil */
@media (max-width: 781px) {
	.b3d-case.is-reversed { flex-direction: column-reverse; }
}
.b3d-contact-link + .b3d-contact-link { margin-top: .75rem !important; }
@media (max-width: 600px) {
	.b3d-header-actions { gap: .75rem !important; }
	.b3d-header .wp-block-button__link { padding: .6rem 1rem; font-size: .9375rem; }
	.b3d-row-arrow { display: none; }
}