:root {
  --prifono-cream: #fff7e8;
  --prifono-cream-strong: #f7e4c4;

  --prifono-pink: #e77997;
  --prifono-pink-dark: #b8325e;

  --prifono-blue: #8fd3f4;
  --prifono-blue-dark: #4aa8d8;

  --prifono-yellow: #f8d77a;

  --color-background: var(--prifono-cream);
  --color-background-warm: #fff0d5;

  --color-brand: var(--prifono-pink);
  --color-brand-hover: var(--prifono-pink-dark);
  --color-brand-soft: rgba(231, 121, 151, 0.16);

  --color-accent: var(--prifono-blue-dark);
  --color-accent-soft: rgba(143, 211, 244, 0.28);

  --color-border: rgba(247, 228, 196, 0.95);

  --shadow-sm: 0 6px 18px rgba(120, 76, 42, 0.08);
  --shadow-md: 0 18px 48px rgba(120, 76, 42, 0.13);
  --shadow-lg: 0 28px 90px rgba(120, 76, 42, 0.18);

 
}

body {
  background:
    radial-gradient(
      circle at 15% 20%,
      rgba(255, 255, 255, 0.35),
      transparent 45%
    ),
    url("../../images/themes/prifono/background-site.svg") repeat,
    var(--color-background);
  background-size: 420px auto;
}

.header {
  transition:
    height 0.35s ease,
    background 0.35s ease;
}

.header.scrolled {
  height: 82px;
}

.header.scrolled .header__logo img {
  height: 64px;
}

.header__logo {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
}

.header__logo img {
  height: 88px;
  width: auto;

  /* margin-right: 2rem; */

  flex-shrink: 0;

  transition:
    transform 0.3s ease,
    filter 0.3s ease;

  filter: drop-shadow(0 8px 20px rgba(0, 0, 0, 0.1));
}

.header__logo:hover img {
  transform: scale(1.04);
}

@media (max-width: 768px) {
  .header__logo img {
    height: 72px;
  }
}

.section-childish {
  position: relative;
  overflow: hidden;
}

.section-childish::before {
  content: "";

  position: absolute;
  inset: 0;

  background-image: url("../../images/themes/prifono/background-site.svg");

  background-repeat: repeat;

  background-size: 420px auto;

  opacity: 0.42;

  z-index: 0;

  pointer-events: none;
}

.section-childish > * {
  position: relative;

  z-index: 1;
}

.hero__image-card,
.about-section__image-card,
.gallery-card,
.location-map-card,
.google-review-card,
.service-card,
.trust-card {
  border-radius: 2rem;
}

.section-eyebrow {
  background: rgba(255, 255, 255, 0.72);
  color: var(--color-brand);
  border: 1px solid rgba(231, 121, 151, 0.16);
  box-shadow: var(--shadow-sm);
}

.btn-primary {
  background: var(--color-brand);
}

.btn-outline {
  background: rgba(255, 255, 255, 0.78);
  backdrop-filter: blur(10px);
}

:root {
    --header-height: 122px;
    --header-height-scrolled: 92px;
    --header-height-mobile: 96px;

    --header-logo-height: 104px;
    --header-logo-height-scrolled: 72px;

    --header-logo-height-mobile: 82px;
    --header-logo-height-mobile-scrolled: 64px;

    --header-logo-radius: 999rem;
    --header-logo-box-padding: 0.75rem 1.05rem;
    --header-logo-box-padding-mobile: 0.55rem 0.75rem;
}

.hero__brand {
    position: relative;

    width: min(100%, 560px);

    margin-bottom: var(--space-8);

    display: flex;
    align-items: center;

    z-index: 1;
}

.hero__brand img {
    width: 100%;
    height: auto;

    display: block;

    filter: drop-shadow(0 18px 34px rgba(120, 76, 42, 0.16));
}

.hero__brand-halo::before {
    content: "";

    position: absolute;
    inset: -2.25rem;

    z-index: -1;

    border-radius: 999px;

    background:
        radial-gradient(
            circle,
            rgba(255, 255, 255, 0.86),
            rgba(255, 255, 255, 0.38),
            transparent 68%
        );
}

.hero__brand-animated img {
    animation: prifonoHeroLogoFloat 6s ease-in-out infinite;
}

@keyframes prifonoHeroLogoFloat {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-6px);
    }

    100% {
        transform: translateY(0);
    }
}

@media (max-width: 960px) {
    .hero__brand {
        width: min(100%, 500px);
    }
}

@media (max-width: 560px) {
    .hero__brand {
        width: min(100%, 420px);
        margin-bottom: var(--space-6);
    }

    .hero__brand-halo::before {
        inset: -1.4rem;
    }
}
