/* Trapp & Färg – kompletterande stilar (tokens kommer från theme.json) */

:root {
	--tf-radius: 4px;
	--tf-shadow: 0 1px 2px rgba(28, 30, 35, .06), 0 8px 24px rgba(28, 30, 35, .06);
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 3px;
}

.screen-reader-text:focus { clip: auto !important; clip-path: none; height: auto; width: auto; z-index: 100000; }

/* ---------- Sidhuvud ---------- */
.tf-header { position: sticky; top: 0; z-index: 50; transition: box-shadow .2s ease; }
.admin-bar .tf-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .tf-header { top: 0; } }
.tf-header.is-scrolled { box-shadow: 0 1px 0 var(--wp--preset--color--line), 0 6px 20px rgba(28,30,35,.06); }

.tf-logo { gap: 0 !important; line-height: 1; }
.tf-logo .wp-block-site-title { margin: 0; }
.tf-logo__tag {
	margin: .3rem 0 0 !important;
	font-size: .6875rem;
	letter-spacing: .22em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	text-align: center;
}
.tf-logo__tag a { color: inherit; text-decoration: none; }

.tf-header .wp-block-navigation__responsive-container.is-menu-open { padding: 1.5rem; }
.tf-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 1.1rem; font-size: 1.25rem; }

.tf-call-mobile { display: none !important; }
@media (max-width: 600px) {
	.tf-call-mobile { display: inline-flex !important; }
	.tf-header .tf-header-cta { display: none !important; }
	.tf-header .wp-block-site-title { font-size: 1.3rem !important; }
}
.tf-call-mobile a.wp-block-button__link {
	padding: .6rem .8rem !important;
	background: transparent !important;
	color: var(--wp--preset--color--primary) !important;
	border-color: var(--wp--preset--color--line) !important;
}

/* ---------- Knappar ---------- */
.wp-block-button__link { transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .15s ease; }
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--contrast);
	border: 1px solid currentColor;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--surface);
	border-color: var(--wp--preset--color--contrast);
}
.wp-block-button.is-style-arrow > .wp-block-button__link::after,
.is-style-arrow-link a::after {
	content: "";
	display: inline-block;
	width: 1em; height: .75em;
	margin-left: .55em;
	vertical-align: -0.05em;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3E%3Cpath d='M0 6h14M9 1l5 5-5 5' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3E%3Cpath d='M0 6h14M9 1l5 5-5 5' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform .15s ease;
}
.wp-block-button.is-style-arrow > .wp-block-button__link:hover::after,
.is-style-arrow-link a:hover::after { transform: translateX(3px); }

/* Pil-länk ("Läs mer →", "Se alla tjänster →") */
.is-style-arrow-link { font-size: var(--wp--preset--font-size--small); font-weight: 600; }
.is-style-arrow-link a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
	padding-bottom: 2px;
}
.is-style-arrow-link a:hover { color: var(--wp--preset--color--primary); }

/* Överrubrik */
.is-style-eyebrow {
	font-size: var(--wp--preset--font-size--x-small) !important;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary);
}

/* ---------- Hero ---------- */
.tf-hero .wp-block-cover__background { background: linear-gradient(90deg, rgba(247,245,240,.97) 0%, rgba(247,245,240,.9) 34%, rgba(247,245,240,.35) 58%, rgba(247,245,240,0) 72%) !important; opacity: 1 !important; }
@media (max-width: 781px) {
	.tf-hero .wp-block-cover__background { background: linear-gradient(180deg, rgba(247,245,240,.94) 0%, rgba(247,245,240,.88) 60%, rgba(247,245,240,.55) 100%) !important; }
}
.tf-trust { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; padding: 0; list-style: none; font-size: var(--wp--preset--font-size--small); font-weight: 500; }
.tf-trust li { display: inline-flex; align-items: center; gap: .45rem; }
.tf-trust li::before {
	content: ""; width: 1.05rem; height: 1.05rem; flex: none;
	background: var(--wp--preset--color--primary);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10.5 4 4 8-9' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10.5 4 4 8-9' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- Ikonrader (USP / process) ---------- */
.tf-icon { margin: 0 0 .5rem !important; }
.tf-icon img { width: 34px !important; height: 34px !important; }
.wp-block-column.is-style-divider { position: relative; }
@media (min-width: 782px) {
	.wp-block-columns > .wp-block-column.is-style-divider + .wp-block-column.is-style-divider { border-left: 1px solid var(--wp--preset--color--line); padding-left: clamp(1rem, 3vw, 2.5rem); }
}
.tf-steps .wp-block-column { display: flex; gap: 1rem; align-items: flex-start; }
.tf-steps .tf-icon { flex: none; }

/* ---------- Kort (tjänster) ---------- */
.is-style-card { background: var(--wp--preset--color--surface); border-radius: var(--tf-radius); overflow: hidden; height: 100%; }
.tf-card-grid .wp-block-image { margin-bottom: .9rem !important; overflow: hidden; }
.tf-card-grid .wp-block-image img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; transition: transform .4s ease; }
.tf-card-grid .wp-block-column:hover .wp-block-image img { transform: scale(1.03); }
.tf-card-grid h3 { margin: 0 0 .35rem !important; }
.tf-card-grid p:not(.is-style-arrow-link) { color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--small); line-height: 1.5; margin: 0 0 .9rem; }

/* ---------- Projekt (query loop) ---------- */
.tf-projects .wp-block-post-featured-image { margin-bottom: .75rem; overflow: hidden; }
.tf-projects .wp-block-post-featured-image img { aspect-ratio: 2 / 1; object-fit: cover; transition: transform .4s ease; }
.tf-projects li:hover .wp-block-post-featured-image img { transform: scale(1.03); }
.tf-projects .wp-block-post-title { font-family: var(--wp--preset--font-family--body); font-size: var(--wp--preset--font-size--medium); font-weight: 600; letter-spacing: 0; }
.tf-projects .wp-block-post-title a { text-decoration: none; color: inherit; }

/* ---------- Om oss ---------- */
.tf-about .wp-block-media-text__media img { aspect-ratio: 2 / 1; object-fit: cover; }

/* ---------- Områden ---------- */
.tf-areas { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 !important; padding: 0 !important; list-style: none; }
.tf-areas li {
	display: inline-flex; align-items: center; gap: .4rem;
	padding: .5rem .9rem; border: 1px solid var(--wp--preset--color--line);
	border-radius: 999px; background: var(--wp--preset--color--surface);
	font-size: var(--wp--preset--font-size--small); font-weight: 500;
}
.tf-areas li::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--wp--preset--color--primary); }

/* ---------- Bocklista ---------- */
.is-style-checks { list-style: none; padding-left: 0 !important; }
.is-style-checks li { position: relative; padding-left: 1.8rem; margin-bottom: .55rem; }
.is-style-checks li::before {
	content: ""; position: absolute; left: 0; top: .3em; width: 1.1rem; height: 1.1rem;
	background: var(--wp--preset--color--primary);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10.5 4 4 8-9' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10.5 4 4 8-9' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- FAQ ---------- */
.wp-block-details summary { cursor: pointer; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; font-weight: 400; font-size: 1.4rem; line-height: 1; color: var(--wp--preset--color--primary); transition: transform .2s ease; }
.wp-block-details[open] summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { color: var(--wp--preset--color--muted); }

/* ---------- Sidfot ---------- */
.tf-footer a { color: inherit; text-decoration: none; }
.tf-footer a:hover { text-decoration: underline; color: var(--wp--preset--color--primary); }
.tf-footer h2 { font-family: var(--wp--preset--font-family--body); font-size: var(--wp--preset--font-size--small); font-weight: 700; letter-spacing: 0; margin-bottom: .6rem; }
.tf-contact-list { list-style: none; padding: 0 !important; margin: 0; font-size: var(--wp--preset--font-size--small); }
.tf-contact-list li { display: flex; gap: .55rem; align-items: center; margin-bottom: .4rem; }
.tf-contact-list li img { width: 18px; height: 18px; }
.tf-footer .wp-block-social-links .wp-social-link { color: var(--wp--preset--color--primary); }

/* ---------- Övrigt ---------- */
.tf-section-head { align-items: flex-end !important; }
.wp-block-post-content > .alignfull:first-child { margin-top: 0; }
main.wp-block-group { margin-top: 0; }

/* Hero: innehållet ska linjera med sidhuvudets bredd */
.tf-hero .wp-block-cover__inner-container { width: 100% !important; }
.tf-hero.wp-block-cover { padding-left: var(--wp--style--root--padding-left, clamp(1rem, 4vw, 2.5rem)) !important; padding-right: var(--wp--style--root--padding-right, clamp(1rem, 4vw, 2.5rem)) !important; }
/* Sociala ikoner utan textetikett */
.tf-footer .wp-social-link .wp-block-social-link-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.tf-footer .wp-block-social-links { font-size: 24px; }
/* Bilder i kolumner fyller kolumnen */
.wp-block-column > .wp-block-image img, .wp-block-media-text__media img { width: 100%; height: auto; }