/*
Theme Name: Stage & Pixel
Description: Een zelfstandig blokthema voor Stage & Pixel, met videografie, websitebeheer en eventondersteuning.
Author: Stage & Pixel
Version: 1.0.0
Requires at least: 6.6
Tested up to: 7.1
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: stagepixel
Tags: full-site-editing, block-patterns, custom-colors, custom-logo, editor-style, portfolio
*/

.sp-wrap { width:calc(100% - 64px); max-width:1160px; margin-inline:auto; }
.sp-header { border-bottom:1px solid var(--wp--preset--color--line); }
.sp-header-row { min-height:104px; gap:32px; }
.sp-brand { margin:0; font-size:26px; font-weight:650; letter-spacing:-1px; white-space:nowrap; line-height:1.1; }
.sp-brand a { text-decoration:none; }
.sp-menu { font-size:14px; }
.sp-menu .wp-block-navigation__container { gap:28px; }
.sp-menu a { text-underline-offset:6px; }
.sp-menu .wp-block-navigation__responsive-container.is-menu-open { padding:32px; background:var(--wp--preset--color--ink); color:var(--wp--preset--color--paper); }
.sp-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap:28px; }
.sp-hero { padding-block:64px 56px; }
.sp-hero-columns { gap:56px; align-items:center!important; margin-bottom:0; }
.sp-eyebrow { font-size:12px; letter-spacing:1.6px; text-transform:uppercase; color:var(--wp--preset--color--lavender); margin:0 0 24px; }
.sp-title { margin:0 0 26px; max-width:760px; font-size:clamp(2.5rem,4.2vw,4rem); font-weight:600; line-height:1.08; letter-spacing:-2px; }
.sp-description { margin:0 0 30px; font-size:16px; line-height:1.75; color:var(--wp--preset--color--muted); max-width:570px; }
.sp-actions { margin-top:0; gap:12px; }
.sp-actions .wp-block-button__link { display:inline-block; border-radius:0; padding:15px 22px; background:var(--wp--preset--color--purple); color:var(--wp--preset--color--paper); font-size:15px; font-weight:500; text-decoration:none; line-height:1.4; min-height:48px; transition:background-color .15s; }
.sp-actions .wp-block-button__link:hover { background:var(--wp--preset--color--purple-hover); }
.sp-logo-panel { min-height:320px; padding:44px 24px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:34px; background:var(--wp--preset--color--paper); color:var(--wp--preset--color--purple); }
.sp-logo-panel .wp-block-image { margin:0; width:150px; }
.sp-logo-panel img { width:100%; height:auto; display:block; }
.sp-logo-caption { font-size:13px; text-align:center; line-height:1.5; margin:0; }
.sp-services { padding-block:0 52px; }
.sp-service-columns { gap:28px; margin:0; }
.sp-service { padding-top:24px; border-top:1px solid var(--wp--preset--color--line); }
.sp-service-number { color:var(--wp--preset--color--lavender); font-size:12px; margin:0 0 18px; }
.sp-service h2 { margin:0 0 10px; font-size:21px; line-height:1.25; font-weight:600; letter-spacing:-.4px; }
.sp-service-copy { color:var(--wp--preset--color--muted); font-size:15px; line-height:1.6; margin:0; }
.sp-story { background:var(--wp--preset--color--soft); color:var(--wp--preset--color--ink); padding-block:36px; }
.sp-story-columns { gap:42px; margin:0; align-items:start!important; }
.sp-story h2 { margin:0; font-size:22px; font-weight:600; line-height:1.35; letter-spacing:-.5px; }
.sp-story p { margin:0; color:var(--wp--preset--color--muted-dark); font-size:15px; line-height:1.75; }
.sp-contact { background:var(--wp--preset--color--paper); color:var(--wp--preset--color--ink); padding-block:38px; }
.sp-contact-row { gap:30px; }
.sp-contact-question { margin:0 0 8px; font-size:18px; }
.sp-contact-address { margin:0; font-size:17px; }
.sp-contact-address a { color:var(--wp--preset--color--purple); text-underline-offset:5px; overflow-wrap:anywhere; }
.sp-contact-note { font-size:12px; color:var(--wp--preset--color--muted-dark); text-align:right; line-height:1.7; margin:0; }
.sp-inner { padding-block:64px; min-height:50vh; }
.sp-inner h1 { font-size:clamp(2rem,4vw,3rem); line-height:1.1; margin-bottom:30px; }
.sp-inner a { text-underline-offset:5px; }
.sp-post-list { margin-top:32px; }
.sp-post-list h2 { font-size:28px; margin-bottom:12px; }
.sp-post-list li { padding-block:24px; border-top:1px solid var(--wp--preset--color--line); }
.sp-home-main,.sp-home-main>div { margin-block-start:0; }
.wp-site-blocks>header,.wp-site-blocks>main,.wp-site-blocks>footer { margin-block-start:0; }

@media (max-width:900px) {
  .sp-hero-columns { gap:30px; }
  .sp-title { font-size:clamp(2.2rem,4.8vw,3rem); }
  .sp-logo-panel { min-height:275px; }
  .sp-menu .wp-block-navigation__container { gap:18px; }
}
@media (max-width:781px) {
  .sp-wrap { width:calc(100% - 40px); }
  .sp-header-row { min-height:82px; gap:18px; }
  .sp-brand { font-size:24px; }
  .sp-hero { padding-block:42px; }
  .sp-hero-columns { gap:32px; }
  .sp-hero-columns>.wp-block-column:first-child { flex-basis:100%!important; }
  .sp-hero-columns>.wp-block-column:last-child { display:none; }
  .sp-title { max-width:630px; font-size:clamp(2.3rem,6vw,3.2rem); letter-spacing:-1.3px; }
  .sp-service-columns { gap:0; }
  .sp-service { padding-block:24px; }
  .sp-services { padding-bottom:24px; }
  .sp-story-columns { gap:18px; }
  .sp-story { padding-block:30px; }
  .sp-contact { padding-block:30px; }
}
@media (max-width:599px) {
  .sp-header-row { min-height:78px; }
  .sp-title { font-size:clamp(2rem,8.4vw,2.9rem); }
  .sp-description { font-size:15px; }
  .sp-contact-row { align-items:flex-start!important; flex-direction:column; gap:20px; }
  .sp-contact-note { text-align:left; }
  .sp-menu .wp-block-navigation__responsive-container-open { min-width:44px; min-height:44px; justify-content:center; align-items:center; }
  .sp-menu .wp-block-navigation__responsive-container-close { min-width:44px; min-height:44px; display:flex; justify-content:center; align-items:center; }
}
@media (prefers-reduced-motion:reduce) { .sp-actions .wp-block-button__link { transition:none; } }