/*
Theme Name: Progivo
Theme URI: https://www.progivo.se
Author: Progivo AB
Author URI: https://www.progivo.se
Description: Blocktema för Progivo AB. Där förflyttning faktiskt sker.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: progivo
*/

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }
:where(h1, h2, h3)[id] { scroll-margin-top: 96px; }

/* ---------- Sidhuvud ---------- */
.site-header-wrap {
	position: sticky; top: 0; z-index: 50;
	background: rgba(255, 255, 255, 0.94);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid #E7E5DE;
}
.admin-bar .site-header-wrap { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header-wrap { top: 46px; } }
.site-header {
	max-width: 1180px; margin: 0 auto;
	padding: 18px 20px;
}
.logo { margin: 0; font-size: 1.6rem; line-height: 1; letter-spacing: -0.03em; font-weight: 300; }
.logo a { color: var(--wp--preset--color--dark); text-decoration: none; }
.logo strong { font-weight: 600; }
.logo::after { content: "●"; color: var(--wp--preset--color--green); font-size: 0.45em; margin-left: 3px; vertical-align: 0.35em; }
.site-header .wp-block-navigation { font-size: 0.95rem; font-weight: 500; gap: 1.75rem; }
.site-header .wp-block-navigation a { text-decoration: none; color: var(--wp--preset--color--dark); }
.site-header .wp-block-navigation a:hover { color: var(--wp--preset--color--green); }

/* ---------- Sektioner ---------- */
.band { padding-top: clamp(64px, 9vw, 120px); padding-bottom: clamp(64px, 9vw, 120px); margin: 0 !important; }
.band.cream { background: var(--wp--preset--color--cream); }
.band.dark { background: var(--wp--preset--color--dark); color: var(--wp--preset--color--cream); }
.band.dark h1, .band.dark h2, .band.dark h3 { color: #fff; }
.band.dark a:not(.wp-element-button) { color: #6FD3B0; }

.eyebrow {
	font-size: 0.8rem !important; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
	color: var(--wp--preset--color--green);
}
.lead { font-size: var(--wp--preset--font-size--large); font-weight: 300; line-height: 1.5; max-width: 40ch; }
.band.dark .lead, .band.dark .muted { color: #CFCDC5; }
.muted { color: var(--wp--preset--color--muted); }
.section-head { margin-bottom: 2.5rem !important; }
.section-head > * { max-width: 680px; }
.hero .section-head, .contact .section-head { margin-bottom: 0 !important; }

/* ---------- Hero ---------- */
.hero { padding-top: clamp(80px, 12vw, 160px); padding-bottom: clamp(80px, 12vw, 160px); position: relative; overflow: hidden; }
.hero h1 { max-width: 14ch; font-weight: 300 !important; }
.hero h1 strong { font-weight: 600; }
.hero::before {
	content: ""; position: absolute; right: -140px; top: 50%; transform: translateY(-50%);
	width: 520px; height: 520px; border-radius: 50%;
	border: 1px solid rgba(29, 158, 117, 0.35);
	box-shadow: 0 0 0 70px rgba(29, 158, 117, 0.05), 0 0 0 140px rgba(29, 158, 117, 0.03);
	pointer-events: none;
}
@media (max-width: 781px) { .hero::before { display: none; } }

/* Knappar */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent; border: 1px solid currentColor; color: inherit;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: rgba(255,255,255,0.08); }

/* ---------- Kort ---------- */
.cards { gap: 20px !important; }
.cards + .cards { margin-top: 20px !important; }
.card {
	background: #fff; border: 1px solid #E7E5DE; border-radius: 14px;
	padding: 28px !important; display: flex; flex-direction: column;
}
.band.dark .card { background: #22221E; border-color: #34342E; }
.card h3 { margin-top: 0; font-size: 1.2rem !important; }
.card p { margin-top: 0.6rem; }
.card .tag {
	font-size: 0.75rem !important; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
	color: var(--wp--preset--color--terracotta); margin: 0 0 0.75rem;
}
.band.dark .card .tag { color: #E39A7C; }

/* ---------- Metodsteg ---------- */
ol.steps {
	list-style: none; padding: 0;
	display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; counter-reset: s;
}
ol.steps li {
	counter-increment: s; background: var(--wp--preset--color--cream); border-radius: 12px;
	padding: 22px 18px; font-size: 0.95rem; line-height: 1.45; color: var(--wp--preset--color--muted);
	position: relative;
}
ol.steps li::before { content: "0" counter(s); display: block; font-size: 0.75rem; font-weight: 600; color: var(--wp--preset--color--green); margin-bottom: 10px; }
ol.steps li strong { display: block; color: var(--wp--preset--color--dark); font-weight: 600; font-size: 1.05rem; margin-bottom: 4px; }
@media (max-width: 900px) { ol.steps { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { ol.steps { grid-template-columns: 1fr; } }

ul.dynamics {
	list-style: none; padding: 0; margin-top: 2.5rem;
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
	border-top: 1px solid #E7E5DE;
}
ul.dynamics li { padding: 22px 20px 0 0; font-size: 0.95rem; color: var(--wp--preset--color--muted); }
ul.dynamics li strong { display: block; color: var(--wp--preset--color--dark); font-weight: 600; margin-bottom: 4px; }
ul.dynamics li strong::before { content: "● "; color: var(--wp--preset--color--green); font-size: 0.7em; vertical-align: 0.15em; }
@media (max-width: 900px) { ul.dynamics { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { ul.dynamics { grid-template-columns: 1fr; } }

/* ---------- Om ---------- */
.about-cols { gap: clamp(32px, 6vw, 80px) !important; }
.quote {
	font-size: var(--wp--preset--font-size--x-large) !important; font-weight: 300; line-height: 1.25; letter-spacing: -0.02em;
	border-left: 3px solid var(--wp--preset--color--green); padding-left: 24px;
}

/* ---------- Kontakt ---------- */
.contact h2 { font-weight: 300 !important; }
.contact h2 strong { font-weight: 600; }
.contact-mail { font-size: var(--wp--preset--font-size--large); }

/* ---------- Sidfot ---------- */
.site-footer {
	background: var(--wp--preset--color--dark); color: #A9A79F; font-size: 0.9rem;
	border-top: 1px solid #2C2C27; margin: 0 !important;
	padding-top: 40px; padding-bottom: 40px;
}
.site-footer .logo a { color: #fff; }
.site-footer a { color: #CFCDC5; }
.tagline-dots { letter-spacing: 0.02em; }

/* ---------- Undersidor ---------- */
.page-main { padding-top: clamp(48px, 7vw, 96px); padding-bottom: clamp(64px, 9vw, 120px); }
