/*
Theme Name: Saló Guttié
Theme URI: https://guttie.therootsons.es/
Description: Child theme for Saló Guttié, built on GeneratePress. Includes the salon colour palette, light editorial styling and base utilities for GenerateBlocks layouts.
Author: The Rootsons
Author URI: https://therootsons.com/
Template: generatepress
Version: 1.0.0
Text Domain: salo-guttie
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

:root {
  --sg-bg: #F6F3EC;
  --sg-bg-alt: #ECE4DA;
  --sg-accent: #B9A590;
  --sg-muted: #574C3F;
  --sg-text: #36302A;
  --sg-white: #FFFFFF;
  --sg-border: rgba(54, 48, 42, 0.14);
  --sg-radius-sm: 10px;
  --sg-radius-md: 18px;
  --sg-radius-lg: 28px;
  --sg-shadow-soft: 0 18px 48px rgba(54, 48, 42, 0.08);
}

body {
  background: var(--sg-bg);
  color: var(--sg-text);
}

body,
button,
input,
select,
textarea {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.site-title {
  color: var(--sg-text);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 500;
  letter-spacing: -0.025em;
}

p {
  color: var(--sg-muted);
}

a {
  color: var(--sg-text);
}

a:hover,
a:focus {
  color: var(--sg-muted);
}

.site-header,
.main-navigation,
.inside-header {
  background: var(--sg-bg);
}

.main-navigation .main-nav ul li a,
.menu-toggle,
.mobile-menu-control-wrapper .menu-toggle {
  color: var(--sg-text);
}

.main-navigation .main-nav ul li[class*="current-menu-"] > a,
.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li:focus > a {
  color: var(--sg-muted);
}

.button,
.wp-block-button__link,
.gb-button,
input[type="submit"] {
  border-radius: 999px;
  background: var(--sg-text);
  color: var(--sg-bg) !important;
  border: 1px solid var(--sg-text);
  transition: transform 180ms ease, background 180ms ease, color 180ms ease, border-color 180ms ease;
}

.button:hover,
.wp-block-button__link:hover,
.gb-button:hover,
input[type="submit"]:hover {
  background: var(--sg-muted);
  border-color: var(--sg-muted);
  transform: translateY(-1px);
}

.sg-button-secondary .gb-button,
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--sg-text) !important;
  border-color: var(--sg-accent);
}

.sg-button-secondary .gb-button:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--sg-bg-alt);
  color: var(--sg-text) !important;
}

.sg-section {
  background: var(--sg-bg);
}

.sg-section-alt {
  background: var(--sg-bg-alt);
}

.sg-card {
  background: rgba(255, 255, 255, 0.42);
  border: 1px solid var(--sg-border);
  border-radius: var(--sg-radius-md);
  box-shadow: var(--sg-shadow-soft);
}

.sg-card-flat {
  background: var(--sg-bg-alt);
  border: 1px solid var(--sg-border);
  border-radius: var(--sg-radius-md);
}

.sg-eyebrow {
  color: var(--sg-muted);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.sg-google-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 0.85rem;
  border: 1px solid var(--sg-border);
  border-radius: 999px;
  background: rgba(246, 243, 236, 0.86);
  color: var(--sg-text);
  font-size: 0.92rem;
  line-height: 1.2;
}

.sg-google-badge strong {
  font-weight: 700;
}

.sg-stars {
  color: var(--sg-accent);
  letter-spacing: 0.04em;
}

.sg-ritual-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
  color: var(--sg-muted);
}

.sg-pill {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--sg-border);
  border-radius: 999px;
  padding: 0.35rem 0.7rem;
  background: rgba(255, 255, 255, 0.38);
  color: var(--sg-muted);
  font-size: 0.86rem;
}

.sg-service-list .gb-container,
.sg-review-card,
.sg-team-card {
  border-radius: var(--sg-radius-md);
}

.sg-muted {
  color: var(--sg-muted);
}

.sg-text {
  color: var(--sg-text);
}

.sg-bg {
  background: var(--sg-bg);
}

.sg-bg-alt {
  background: var(--sg-bg-alt);
}

@media (max-width: 768px) {
  .sg-google-badge {
    font-size: 0.84rem;
  }

  .sg-ritual-meta {
    gap: 0.45rem;
  }
}