/*
Theme Name: Base Theme
Author: Spores
Author URI: https://spores.com/
Description: Tema base
Version: 1.0.0
Text Domain: base-theme
*/

/* =================================================================
   ADMIN
   ================================================================= */
#wpadminbar{ display:none; }





p{ margin-bottom:0px; }
.entry-content { line-height:36px }


.display-1,.display-2,.display-3,.display-4,.display-5,.display-6{
  font-family: var(--font-primary);
  font-weight: var(--heading-weight);
  color: var(--gray-500);
  letter-spacing: 1px;
}

/* variantes claras */
h1.txt-light, h2.txt-light, h3.txt-light, h4.txt-light, h5.txt-light, h6.txt-light{ color: var(--gray-50) !important; }
p.txt-light, .display-l.txt-light{ color: var(--gray-100) !important; }

/* Display leve */
.display-l{
  font-family: var(--font-primary);
  font-weight: var(--display-weight);
  font-size: 1.2rem;
  line-height: normal;
  color: var(--gray-400);
}

/* =================================================================
   FORMS
   ================================================================= */
input::placeholder,
textarea::placeholder,
.form-control::placeholder{ color: var(--gray-100) !important; opacity: 1; }

.form-label{ font-weight: var(--heading-weight); margin-bottom: 1rem; }

/* campos */
.form-control,
.form-select{
  background: var(--surface-primary);
  color: var(--gray-500);
  border: var(--bd) solid var(--border-primary);
  min-height: 2.75rem;
}
.form-control:focus,
.form-select:focus{
  border-color: var(--brand-secondary);
  box-shadow: 0 0 0 .25rem rgba(104,46,255,.15);
}

/* auxiliares de borda */
.br{ border-right: var(--bd) solid var(--border-primary); }
.border-top{ border-top:1px solid var(--border-secondary)!important; }

/* =================================================================
   SURFACES
   ================================================================= */
.surface-primary{ background: var(--surface-primary); }

/* =================================================================
   ICON BADGE
   ================================================================= */
.icon-badge{
  --size: 72px;
  --trail: url("_assets/img/bg-icon.svg");
  position: relative;
  display: inline-grid;
  place-items: center;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  border: var(--bd) solid var(--border-primary);
  isolation: isolate;
}
.icon-badge__icon{ width: 40%; height: auto; display: block; }
.icon-badge::before{
  content: "";
  position: absolute;
  left: calc(-0.9 * var(--size));
  top: 50%;
  transform: translateY(-50%);
  width: calc(var(--size) * 2.3);
  height: calc(var(--size) * 1);
  background: var(--trail) left center / contain no-repeat;
  pointer-events: none;
  z-index: -1;
}

/* =================================================================
   SPACING HELPERS
   ================================================================= */
.p-40{ padding: 40px; }
.py-8 { padding: 8rem 0 8rem 0 }
.mb-24{ margin-bottom: 24px; }
.mb-40{ margin-bottom: 40px; }
.mb-60{ margin-bottom: 60px; }
.mb-80{ margin-bottom: 80px; }
.mb-120{ margin-bottom: 120px; }
.mt-24{ margin-top: 24px; }
.mt-40{ margin-top: 40px; }
.h-100vh{ min-height:100vh; }

/*btn*/
.btn-theme--icon-only{ --btn-px:1.5rem; --btn-py:.75rem; justify-content:center; }
.btn-theme--accent { --btn-bg: var(--brand-secondary); --btn-fg: #fff;            --btn-border: transparent; }
.btn-theme--solid  { border:none; }
.btn-theme--outline{ --btn-bg:transparent; --btn-border: var(--border-primary); }
.btn-theme--sm     { --btn-py:.375rem; --btn-px:.875rem; --btn-icon-size:.875rem; font-size:.9375rem; }

/* =================================================================
   CTA BANNER (texturas)
   ================================================================= */
.banner-cta{
  display: block;
  position: relative;
  overflow: hidden;
  background: var(--surface-banner);
}
.banner-cta::after{
  content:"";
  position:absolute; inset: 0 auto auto 0;
  width: 685px; height: 783px;
  background: url("_assets/img/texture.png") no-repeat;
  opacity: .8;
  pointer-events: none;
  z-index: -1;
}
.banner-cta::before{
  content:"";
  position:absolute; inset: -300px -230px auto auto;
  width: 685px; height: 783px;
  background: url("_assets/img/texture.png") no-repeat;
  pointer-events: none;
  z-index:-1;
}


/* =================================================================
   CTA CARD
   ================================================================= */
.cta-card{
  display:block;
  position:relative;
  padding: 30px 40px 20px;
  margin-top: 40px;
  background: var(--brand-primary);
  font-family: var(--font-primary);
  color: var(--gray-500);
  border: var(--bd) solid var(--border-primary);
  border-radius: var(--radius-organic);
  text-decoration:none;
}
.cta-card::after{
  content:"";
  position:absolute; top: 34px; right: 30px;
  width: 16px; height: 16px;
  background: var(--icon-arrow) center/contain no-repeat;
}
.cta-card p{ color: var(--gray-400); }

/* =================================================================
   SEÇÕES / BLOCOS
   ================================================================= */

/* Box padrão com radius orgânico */
.box-organic{ border-radius: var(--radius-organic); }






/* =================================================================
   Home Hero
   ================================================================= */


/* HERO — WIDE */
@media (min-width: 1600px){
  .hero .hero-title{ font-size: clamp(3.5rem, 3vw + 1rem, 5rem); }
}
@media (min-width: 1900px){
  .hero .hero-title{ font-size: clamp(4rem, 3.6vw, 6rem); }
  .hero .img-hero{ width: clamp(640px, 60vw, 900px); right: 6%; bottom: 0; }
  .hero .img-texture{ width: clamp(740px, 48vw, 1100px); }
  .hero .img-dot{ width: clamp(140px, 10vw, 240px); }
}

/* HERO — MOBILE */
@media (max-width: 991.98px){
  .hero .hero-title{ font-size: 1.8em; line-height: 1.08; margin-bottom: 12px; }
}

/* =================================================================
   TESTIMONIALS / PARTNERS
   ================================================================= */
.ts-quote{ text-align: center; }
@media (min-width: 768px){ .ts-quote{ text-align: left; } }

.ts-decor-img{
  position: absolute; right: 59px; bottom: 24px;
  width: 148px; height: 59px;
}

/* Carousel */
#testimonialCarousel .carousel-control-prev,
#testimonialCarousel .carousel-control-next{
  background: transparent; width: auto; opacity: 1;
  top: 40%; bottom: auto; transform: translateY(-50%); padding: 0;
}
#testimonialCarousel .ts-control{ width: 48px; height: 48px; display:flex; align-items:center; justify-content:center; }
.carousel-control-prev{ left: 0; transform: rotate(180deg); }
#testimonialCarousel .carousel-control-next{ right: 0; }
#testimonialCarousel .ts-icon{ width: 48x; height: 48px; display:block; pointer-events:none; }
#testimonialCarousel .carousel-control-prev .ts-icon{ transform: scaleX(-1); }

@media (max-width: 767.98px){
  .ts-card{ text-align: center; }
  .ts-quote{ text-align: center; }
}

/* Partners */
.partners .partner-logos{ list-style:none; margin:0; padding:0; }
.partners .partner-logos__item{ list-style:none; margin:0; padding:0; }
.partners .partner-logos__item::marker{ content: none; }

/* Stars (rating) */
.stars{
  --star-size: 18px; --star-gap: .375rem; --star-color: #FFD36E; --star-off-opacity: .35;
  display:inline-flex; align-items:center; gap:var(--star-gap);
  list-style:none; margin:0; padding:0; color: var(--star-color);
}
.stars .star{ inline-size: var(--star-size); block-size: var(--star-size); position: relative; }
.stars .star::before{
  content:""; display:block; inline-size:100%; block-size:100%;
  background: currentColor;
  -webkit-mask-image: var(--icon-star); mask-image: var(--icon-star);
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center;  mask-position: center;
}
.stars .is-off{ opacity: var(--star-off-opacity); }



/* =================================================================
   Pricing
   ================================================================= */
.pricing-nav .nav-link{
  border: 2px solid var(--border-primary);
  margin-bottom: .5rem; border-radius: .5rem;
  text-align: left; font-weight: 500; padding: .6rem .8rem; background: #fff;
  border-radius: 100px;
  color:var(--gray-300) ;
}
.pricing-nav .nav-link.active{
  color:#fff; background: var(--surface-primary); color:var(--gray-500););
}
.plan-card{ border: 2px solid var(--border-primary); border-radius: .75rem; }
.plan-card .plan-price{ font-weight: 700; }
.plan-price {color: var(--gray-300);}
@media (max-width: 991.98px){
  .pricing-nav{ flex-direction: row !important; overflow-x:auto; white-space:nowrap; gap:.5rem; }
  .pricing-nav .nav-link{ display:inline-block; margin-bottom:0; }
}

/* =================================================================
   Google Map
   ================================================================= */
.map-section{ position: relative; overflow: hidden; }
.bt-map-wrap{ position: relative; width:100%; min-height: clamp(360px, 40vh, 720px); }
.bt-map-canvas{ position: relative; width:100%; height: clamp(360px, 60vh, 720px); }
.bt-map-iframe{ display:block; width:100%; height: clamp(360px, 60vh, 720px); border:0; }
.bt-map-placeholder{ width:100%; height: clamp(320px, 50vh, 640px); background:#f4f2ef; border-top:1px solid rgba(0,0,0,.06); border-bottom:1px solid rgba(0,0,0,.06); }
@media (max-width: 575.98px){
  .bt-map-wrap, .bt-map-canvas, .bt-map-iframe, .bt-map-placeholder{ min-height:360px; height:360px; }
}
.bt-map-iframe--mono{
  filter: grayscale(100%) contrast(1.05) brightness(0.98);
  -webkit-filter: grayscale(100%) contrast(1.05) brightness(0.98);
}




/* =================================================================
   Who we Serve
   ================================================================= */
.who-card{
  background:#fff;
  border: var(--bd, 2px) solid var(--border-primary, #F3EFE9);
  border-radius: 16px;
  color: inherit;
  text-decoration: none;
  transition: filter .15s ease, transform .15s ease;
}
.who-card:hover{
  filter: brightness(.98);
}
.who-card h3{ color: var(--gray-500); font-size: 1.1rem; }
.who-card p{ color: var(--gray-400); }

/* Who We Serve wrapper */
.box-wws{ min-height: 644px; }
.box-wws .box-organic{ border: var(--bd) solid var(--border-secondary); }

/* =================================================================
   PAGE HEADER
   ================================================================= */
.page-header{ padding: 64px 0 0; }
.page-header__img{
  display:block; width:100%;
  height: clamp(220px, 40vh, 420px);
  object-fit: cover;
}

/* ===== Page Header com bg opcional ===== */
.page-header{ padding: 124px 0 34px 0; 
  position: relative;
  background:rgba(247, 251, 253, 1);
   }

/* Quando tiver imagem, usa como background do próprio header */
.page-header--bg{
  /* a URL vem inline via --ph-bg no style do section */
  background: var(--ph-bg) center/cover no-repeat;
  /* overlay para contraste do texto */
  position: relative;
  isolation: isolate;
}
.page-header--bg::after{
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.35), rgba(0,0,0,.35));
  z-index: 0;
}
/* garante que o conteúdo fique acima do overlay */
.page-header--bg > .container{ position: relative; z-index: 1; }

/* ajuste responsivo do padding, opcional */
@media (max-width: 991.98px){
  .page-header{ padding: 110px 0 34px 0!important; }
}

/* Breadcrumb básico do header */
.bt-bc{ margin: 0 0 12px; font-size: .95rem; }
.bt-bc__list{ list-style:none; margin:0; padding:0; display:inline-flex; gap:.5rem; flex-wrap:wrap; }
.bt-bc__item{ color: var(--gray-400); }
.bt-bc__item a{ color: var(--gray-500); text-decoration:none; border-bottom:1px solid transparent; }
.bt-bc__item a:hover{ border-bottom-color: currentColor; }
.bt-bc__item.is-current{ color: var(--gray-500); font-weight:600; }

/* versão clara quando há bg imagem */
.bt-bc--light .bt-bc__item{ color: var(--gray-50); }
.bt-bc--light .bt-bc__item a{ color: var(--gray-50); }
.bt-bc--light .bt-bc__item.is-current{ color:#fff; }



/* ===== Footer Social (SVG via mask) ===== */
.footer-social a{
  inline-size: 28px;
  block-size: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--light);
  opacity: .9;
  transition: opacity .2s ease, transform .2s ease;
  position: relative;
}
.footer-social a:hover{ opacity: 1; transform: translateY(-1px); }

/* Base do ícone via pseudo-elemento */
.footer-social a::before{
  content: "";
  inline-size: 100%;
  block-size: 100%;
  background-color: currentColor;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
}

/* Ícones específicos (caminhos do seu tema) */
.footer-social .is-instagram::before{
  -webkit-mask-image: url("_assets/img/icons/icon-instagram.svg");
          mask-image: url("_assets/img/icons/icon-instagram.svg");
}

.footer-social .is-facebook::before{
  -webkit-mask-image: url("_assets/img/icons/icon-facebook.svg");
          mask-image: url("_assets/img/icons/icon-facebook.svg");
}

/* Se quiser já deixar prontos para outras redes */
.footer-social .is-linkedin::before{
  -webkit-mask-image: url("_assets/img/icons/icon-linkedin.svg");
          mask-image: url("_assets/img/icons/icon-linkedin.svg");
}
.footer-social .is-tiktok::before{
  -webkit-mask-image: url("_assets/img/icons/icon-tiktok.svg");
          mask-image: url("_assets/img/icons/icon-tiktok.svg");
}
.footer-social .is-x::before{
  -webkit-mask-image: url("_assets/img/icons/icon-x.svg");
          mask-image: url("_assets/img/icons/icon-x.svg");
}