/*
Theme Name: Sunshine Labs Block Child
Theme URI: https://sunshinelabs.eu/
Author: Sunshine Labs Technical Geek
Description: Child theme refinement layer for the Sunshine Labs Block parent theme. Keep design polish here and keep the parent clean/stable.
Version: 1.0.5
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 7.4
Template: sunshine-labs-block
Text Domain: sunshine-labs-child
*/

/*
 * Child theme polish layer.
 * Keep this file small: the parent theme owns structure, tokens and the
 * editable block template. This child theme is for refinements only.
 */

.site-header {
  backdrop-filter: saturate(1.05) blur(3px);
}

/*
 * Final polish QA pass.
 * Keep these as block-safe refinements: no hardcoded page sections, no
 * remote dependencies, and no replacement of editable Gutenberg content.
 */

.wp-site-blocks {
  font-size: 0;
  line-height: 0;
}

.wp-site-blocks > .site-shell {
  margin-block-start: 0 !important;
  font-size: clamp(1rem, .35vw + .95rem, 1.125rem);
  line-height: 1.45;
}

.site-shell :where(section[id], [id]) {
  scroll-margin-top: 112px;
}

.site-shell > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}

.site-shell > * + * {
  margin-block-start: 0 !important;
}

.sunshine-editable-home :where(.quantity-strip, .advantage-strip, .service-grid, .faq-grid, .things-list) > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}

.quantity-strip {
  background: #ff9c00 !important;
}

.quantity {
  align-self: stretch;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .16), transparent 38%),
    #ff9c00 !important;
}

.quantity p {
  width: 100%;
  min-height: 100%;
}

.hero-actions.wp-block-buttons,
.hero .actions.wp-block-buttons {
  display: grid !important;
  align-items: stretch;
  justify-items: start;
  gap: .95rem;
}

.hero-actions .wp-block-button,
.hero .actions .wp-block-button {
  display: flex;
  margin: 0;
  width: min(100%, 25.625rem);
}

.hero-actions .wp-block-button__link,
.hero .actions .wp-block-button__link {
  width: 100%;
  min-height: 3.75rem;
  height: 100%;
}

.contact-actions.wp-block-buttons {
  display: grid !important;
  align-items: stretch;
}

.contact-actions .wp-block-button,
.contact-actions .wp-block-button__link {
  width: 100%;
}

.advantage-strip,
.service-grid,
.faq-grid {
  align-items: stretch;
}

.advantage-card,
.service-card,
.faq-item,
.start-card,
.thing-row {
  height: auto;
  overflow: visible;
}

.advantage-card,
.service-card,
.faq-item {
  display: flex;
  flex-direction: column;
}

.advantage-card > *,
.service-card > *,
.faq-item > *,
.start-card > * {
  margin-block-start: 0;
  margin-block-end: 0;
}

.advantage-card > * + *,
.service-card > * + *,
.faq-item > * + *,
.start-card > * + * {
  margin-block-start: .95rem;
}

.service-card .card-arrow {
  display: none !important;
}

.faq-grid {
  grid-auto-rows: auto;
}

.faq-item {
  min-height: 0;
}

.faq-item p {
  overflow: visible;
}

.faq-section .section-heading h2 {
  max-width: 100%;
}

.service-card,
.advantage-card,
.faq-item,
.project-card {
  transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
}

.service-card:hover,
.advantage-card:hover,
.faq-item:hover {
  transform: translateY(-2px);
}

.hero-copy h1 {
  text-wrap: balance;
}

.contact h2,
.section-heading h2 {
  text-wrap: balance;
}

@media (max-width: 720px) {
  html,
  body {
    overflow-x: clip;
  }

  .site-header {
    backdrop-filter: none;
  }

  .site-shell :where(section[id], [id]) {
    scroll-margin-top: 86px;
  }

  .section-heading,
  .section-heading > .wp-block-group,
  .section-heading h2,
  .section-heading p,
  .start-intro,
  .start-intro h2,
  .start-intro p,
  .contact,
  .contact h2,
  .contact p {
    max-width: 100%;
    min-width: 0;
  }

  .section-heading {
    width: 100%;
    overflow-wrap: anywhere;
  }

  .contact::after {
    display: none;
  }

  .contact > .wp-block-group,
  .contact-actions,
  .contact-actions .wp-block-button {
    width: auto;
    max-width: 100%;
    min-width: 0;
  }

  .hero-actions.wp-block-buttons,
  .hero .actions.wp-block-buttons {
    display: grid !important;
    gap: .85rem;
  }

  .hero-actions .wp-block-button__link,
  .hero .actions .wp-block-button__link {
    min-width: 0;
    width: 100%;
    min-height: 3.55rem;
  }
}

@media (max-width: 520px) {
  .section-heading h2,
  .start-intro h2,
  .contact h2 {
    line-height: 1;
  }

  .faq-section .section-heading h2 {
    font-size: clamp(2.65rem, 11.5vw, 3.25rem);
    line-height: 1;
    letter-spacing: -.015em;
  }
}