:root{
  --gold:#d8a94f;
  --gold-light:#f1cf8d;
  --gold-soft:#f8ead0;
  --gold-pale:#fff7e8;
  --brown:#3f210c;
  --brown-2:#6e5428;
  --cream:#fbf4e7;
  --text:#3f2512;
  --muted:#725f50;
  --white:#fff;
  --shadow:0 14px 32px rgba(63,33,12,.14);
  --shadow-strong:0 22px 48px rgba(63,33,12,.20)
}

*{
  box-sizing:border-box;
  margin:0;
  padding:0
}

html{
  scroll-behavior:smooth;
  scroll-padding-top:82px
}

body{
  font-family:"Montserrat",sans-serif;
  color:var(--text);
  background:#fff;
  line-height:1.45
}

img{
  max-width:100%;
  display:block
}

a{
  text-decoration:none;
  color:inherit
}

button{
  font:inherit
}

.container{
  width:min(1120px,calc(100% - 40px));
  margin:auto
}

.container.wide{
  width:min(1240px,calc(100% - 40px))
}

.section{
  padding:86px 0
}

h1,
h2,
h3{
  line-height:1.12
}

h2{
  font-size:clamp(1.8rem,3vw,2.7rem)
}

em{
  color:var(--gold);
  font-style:normal
}

.section-kicker{
  display:inline-block;
  margin-bottom:15px;
  color:var(--gold);
  font-size:.71rem;
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase
}

.section-kicker-light{
  color:#fff3d7
}

/* ==================================================
   CABEÇALHO
================================================== */

.site-header{
  height:82px;
  position:sticky;
  top:0;
  z-index:1000;
  background:#fff;
  box-shadow:0 3px 14px rgba(0,0,0,.06)
}

.header-inner{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}

.brand{
  display:flex;
  align-items:center;
  justify-content:center;
  height:100%
}

.brand img{
  width:115px;
  height:70px;
  object-fit:contain;
  transition:transform .3s ease,filter .3s ease
}

.brand:hover img{
  transform:scale(1.05);
  filter:drop-shadow(0 5px 8px rgba(63,33,12,.15))
}

.main-nav{
  display:flex;
  align-items:center;
  gap:46px
}

.main-nav a{
  position:relative;
  font-size:.92rem;
  font-weight:500
}

.main-nav a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-7px;
  width:0;
  height:2px;
  background:var(--gold);
  transition:.25s
}

.main-nav a:hover::after,
.main-nav a.active::after{
  width:100%
}

.main-nav a.active{
  color:var(--gold)
}

.menu-toggle{
  display:none;
  background:none;
  border:0;
  cursor:pointer
}

.menu-toggle span{
  display:block;
  width:26px;
  height:2px;
  margin:5px;
  background:var(--brown)
}

/* ==================================================
   BOTÕES
================================================== */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 25px;
  border:1px solid transparent;
  border-radius:7px;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.025em;
  text-transform:uppercase;
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    background .25s ease,
    color .25s ease,
    border-color .25s ease
}

.btn:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow)
}

.btn-gold{
  color:#fff;
  background:linear-gradient(135deg,#e1b45f,#ca9235)
}

.btn-gold:hover{
  background:linear-gradient(135deg,#e7bd6d,#d59d3b)
}

.btn-ghost{
  color:var(--brown);
  border-color:rgba(63,33,12,.25);
  background:rgba(255,255,255,.65)
}

.btn-ghost:hover{
  border-color:var(--gold);
  background:#fff
}

.btn-light{
  color:var(--brown);
  background:#fff
}

.btn-dark{
  color:#fff;
  background:var(--brown)
}

.btn-dark:hover{
  background:#552e10
}

/* ==================================================
   LANDING PAGE
================================================== */

.hero{
  position:relative;
  min-height:calc(100vh - 82px);
  display:flex;
  align-items:center;
  overflow:hidden;
  scroll-margin-top:82px;
  background:
    radial-gradient(
      circle at 8% 16%,
      rgba(216,169,79,.22),
      transparent 30%
    ),
    radial-gradient(
      circle at 78% 24%,
      rgba(255,255,255,.42),
      transparent 26%
    ),
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,.045) 0,
      rgba(255,255,255,.045) 1px,
      transparent 1px,
      transparent 7px
    ),
    linear-gradient(
      135deg,
      #fffaf1 0%,
      #f8e9cd 55%,
      #efd3a0 100%
    )
}

.hero::before{
  content:"";
  position:absolute;
  left:-130px;
  bottom:-180px;
  width:390px;
  height:390px;
  border:1px solid rgba(216,169,79,.28);
  border-radius:50%
}

.hero::after{
  content:"";
  position:absolute;
  left:-80px;
  bottom:-130px;
  width:290px;
  height:290px;
  border:1px solid rgba(216,169,79,.22);
  border-radius:50%
}

.hero-grid{
  position:relative;
  z-index:2;
  min-height:calc(100vh - 82px);
  display:flex;
  align-items:center;
  padding-top:55px;
  padding-bottom:55px
}

.hero-content{
  position:relative;
  z-index:3;
  max-width:860px
}

.eyebrow{
  margin-bottom:18px;
  color:var(--gold);
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase
}

.hero h1{
  max-width:860px;
  margin-bottom:25px;
  color:var(--brown);
  font-size:clamp(2.2rem,3.15vw,3.05rem);
  line-height:1.04;
  letter-spacing:-.035em;
  white-space:nowrap
}

.hero h1 span{
  display:block;
  white-space:nowrap
}

.hero-description{
  max-width:650px;
  color:#634e3d;
  font-size:1.03rem;
  font-weight:500;
  line-height:1.75
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  margin-top:32px
}

.hero-details{
  display:flex;
  flex-wrap:wrap;
  gap:22px;
  margin-top:28px
}

.hero-details div{
  display:flex;
  align-items:center;
  gap:8px;
  color:#705945;
  font-size:.76rem;
  font-weight:600
}

.hero-details i{
  color:var(--gold);
  font-size:1.05rem
}

.hero-image-column{
  position:absolute;
  top:50%;
  right:-95px;
  z-index:1;
  width:min(45%,500px);
  transform:translateY(-50%)
}

.hero-image-frame{
  position:relative;
  height:min(430px,52vh);
  min-height:360px;
  overflow:hidden;
  border-radius:26px 8px 26px 8px;
  box-shadow:0 28px 65px rgba(63,33,12,.25);
  transition:
    transform .9s cubic-bezier(.22,.61,.36,1),
    box-shadow .9s cubic-bezier(.22,.61,.36,1);
}

.hero-image-frame:hover{
  transform:translateY(-6px);
  box-shadow:0 38px 78px rgba(63,33,12,.30);
}

.hero-image-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:
    transform 1.5s cubic-bezier(.22,.61,.36,1),
    filter 1.5s cubic-bezier(.22,.61,.36,1);
}

.hero-image-frame:hover img{
  transform:scale(1.025);
  filter:brightness(1.03);
}

.hero-image-shade{
  display:none
}


/* ==================================================
   NÚMEROS
================================================== */

.stats{
  position:relative;
  padding:60px 0;
  background:#f3dfb9
}

.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:25px
}

.card{
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 18px rgba(0,0,0,.10);
  transition:transform .3s ease,box-shadow .3s ease
}

.card:hover{
  transform:translateY(-8px);
  box-shadow:var(--shadow-strong)
}

.stat-card{
  min-height:150px;
  display:flex;
  align-items:center;
  gap:18px;
  padding:26px 22px
}

.stat-card.featured{
  background:#efc978
}

.stat-icon{
  flex:0 0 auto;
  color:var(--gold);
  font-size:2rem
}

.stat-card.featured .stat-icon{
  color:var(--brown)
}

.stat-card strong,
.stat-card span{
  display:block
}

.stat-card strong{
  margin-bottom:7px;
  color:var(--brown);
  font-size:1.45rem;
  line-height:1.1
}

.stat-card span{
  color:#624c3b;
  font-size:.91rem;
  font-weight:500;
  line-height:1.5
}

/* ==================================================
   FARDAMENTO ESCOLAR
================================================== */

.school{
  position:relative;
  overflow:hidden;
  background:linear-gradient(
    180deg,
    #fffaf1 0%,
    #ffffff 54%,
    #fff8ec 100%
  )
}

.school-container{
  position:relative;
  z-index:2
}

.school-decoration{
  position:absolute;
  border-radius:50%;
  pointer-events:none
}

.school-decoration-left{
  width:310px;
  height:310px;
  left:-170px;
  top:220px;
  border:1px solid rgba(216,169,79,.24)
}

.school-decoration-left::before,
.school-decoration-left::after{
  content:"";
  position:absolute;
  border:1px solid rgba(216,169,79,.16);
  border-radius:50%
}

.school-decoration-left::before{
  inset:35px
}

.school-decoration-left::after{
  inset:75px
}

.school-decoration-right{
  right:-110px;
  bottom:30px;
  width:220px;
  height:220px;
  background:rgba(216,169,79,.08)
}

.school-heading{
  max-width:790px;
  margin-bottom:55px;
  text-align:left
}

.school-heading h2{
  max-width:760px;
  margin-bottom:20px;
  color:var(--brown);
  font-size:clamp(2rem,3.7vw,3.2rem);
  letter-spacing:-.025em
}

.school-heading h2 em{
  display:block
}

.school-heading p{
  max-width:750px;
  color:#5d4838;
  font-size:1.05rem;
  font-weight:500;
  line-height:1.75
}

.school-grid{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);
  align-items:center;
  gap:80px;
  width:min(100%,1000px);
  margin-left:auto;
  margin-right:auto
}

.school-content{
  position:relative
}

.benefits-list{
  list-style:none;
  display:grid
}

.school-benefits{
  gap:16px
}

.school-benefits li{
  min-height:98px;
  display:flex;
  align-items:center;
  gap:18px;
  padding:18px 20px;
  border:1px solid rgba(110,84,40,.10);
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 22px rgba(63,33,12,.07);
  transition:
    transform .3s ease,
    box-shadow .3s ease,
    border-color .3s ease
}

.school-benefits li:hover{
  transform:translateX(8px);
  border-color:rgba(216,169,79,.58);
  box-shadow:0 15px 30px rgba(63,33,12,.12)
}

.benefit-icon{
  flex:0 0 48px;
  width:48px;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:var(--brown);
  background:#f1cf8d;
  box-shadow:0 6px 15px rgba(63,33,12,.12)
}

.benefit-icon i{
  font-size:1.25rem
}

.benefit-content{
  display:flex;
  flex-direction:column;
  gap:5px
}

.benefit-content strong{
  color:var(--brown);
  font-size:1.03rem;
  line-height:1.25
}

.benefit-content small{
  color:#5f4c3d;
  font-size:.88rem;
  font-weight:500;
  line-height:1.55
}

.school-action{
  display:flex;
  align-items:center;
  gap:18px;
  margin-top:28px
}

.school-action-note{
  max-width:170px;
  color:#7a6451;
  font-size:.73rem;
  line-height:1.4
}

.school-image-wrapper{
  position:relative;
  width:min(100%,350px);
  justify-self:center
}

.image-card{
  position:relative;
  overflow:hidden;
  border-radius:19px;
  box-shadow:0 20px 40px rgba(63,33,12,.18);
  transition:transform .35s ease,box-shadow .35s ease
}

.image-card:hover{
  transform:translateY(-10px);
  box-shadow:0 28px 55px rgba(63,33,12,.24)
}

.school-card{
  aspect-ratio:3/4.25
}

.school-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .6s ease
}

.school-card:hover img{
  transform:scale(1.045)
}

.image-card-overlay{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(
    180deg,
    transparent 40%,
    rgba(31,16,5,.82) 100%
  )
}

.image-card-caption{
  position:absolute;
  right:22px;
  bottom:22px;
  left:22px;
  z-index:2;
  color:#fff;
  text-shadow:0 2px 8px rgba(0,0,0,.7)
}

.image-card-caption span,
.image-card-caption strong{
  display:block
}

.image-card-caption span{
  margin-bottom:4px;
  font-size:.7rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.9
}

.image-card-caption strong{
  font-size:1.25rem;
  line-height:1.2
}

.school-floating-badge{
  position:absolute;
  top:38px;
  right:-50px;
  z-index:3;
  min-width:180px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:14px 16px;
  border-radius:12px;
  background:#fff;
  box-shadow:var(--shadow)
}

.school-floating-badge i{
  color:var(--gold);
  font-size:1.4rem
}

.school-floating-badge strong,
.school-floating-badge span{
  display:block
}

.school-floating-badge strong{
  color:var(--brown);
  font-size:.86rem
}

.school-floating-badge span{
  margin-top:2px;
  color:var(--muted);
  font-size:.65rem
}

/* ==================================================
   PORTFÓLIO
================================================== */

.portfolio{
  overflow:hidden;
  background:#d8b26b
}

.portfolio-heading{
  display:block;
  margin-bottom:48px
}

.portfolio-heading h2{
  color:#fff;
  font-size:clamp(1.85rem,3.3vw,3rem);
  letter-spacing:-.02em;
  white-space:nowrap
}

.portfolio-heading h2 span{
  color:var(--brown);
  white-space:nowrap
}

.portfolio-slider{
  position:relative;
  padding:0 58px 8px
}

.portfolio-track{
  position:relative;
  min-height:425px
}

.portfolio-slide{
  position:absolute;
  inset:0;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:25px;
  opacity:0;
  transform:translateX(40px);
  pointer-events:none;
  transition:.45s
}

.portfolio-slide.active{
  position:relative;
  opacity:1;
  transform:none;
  pointer-events:auto
}

.portfolio-slide .single{
  grid-column:2
}

.portfolio-card{
  transition:transform .3s ease
}

.portfolio-card:hover{
  transform:translateY(-9px)
}

.portfolio-image{
  position:relative;
  aspect-ratio:4/4.5;
  overflow:hidden;
  border-radius:16px;
  box-shadow:0 14px 30px rgba(63,33,12,.22)
}

.portfolio-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .55s ease
}

.portfolio-card:hover img{
  transform:scale(1.05)
}

.portfolio-image-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
    180deg,
    transparent 44%,
    rgba(35,17,5,.86) 100%
  )
}

.portfolio-card-caption{
  position:absolute;
  right:20px;
  bottom:20px;
  left:20px;
  color:#fff;
  text-shadow:0 2px 8px rgba(0,0,0,.65)
}

.portfolio-card-caption span{
  display:block;
  margin-bottom:4px;
  font-size:.66rem;
  letter-spacing:.08em;
  text-transform:uppercase
}

.portfolio-card-caption h3{
  color:#fff;
  font-size:1.03rem;
  line-height:1.3
}

.carousel-arrow{
  position:absolute;
  top:50%;
  z-index:10;
  width:45px;
  height:45px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:50%;
  color:var(--brown);
  background:#fff;
  box-shadow:0 9px 20px rgba(63,33,12,.20);
  cursor:pointer;
  transform:translateY(-70%);
  transition:
    transform .25s ease,
    background .25s ease,
    color .25s ease
}

.carousel-arrow:hover{
  color:#fff;
  background:var(--brown);
  transform:translateY(-70%) scale(1.08)
}

.carousel-arrow i{
  font-size:1.2rem
}

.carousel-arrow-left{
  left:0
}

.carousel-arrow-right{
  right:0
}

.slider-dots{
  position:relative;
  z-index:10;
  min-height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:11px;
  margin-top:24px;
  padding:7px 0
}

.dot{
  flex:0 0 auto;
  width:11px;
  height:11px;
  padding:0;
  border:0;
  border-radius:50%;
  background:#fff7e8;
  cursor:pointer;
  opacity:.65;
  transition:transform .2s ease,opacity .2s ease
}

.dot.active{
  opacity:1;
  background:var(--brown);
  transform:scale(1.18)
}

.portfolio-actions{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:22px;
  margin-top:35px
}

/* ==================================================
   PROCESSO
================================================== */

.process{
  background:#fff
}

.process-heading{
  max-width:760px;
  margin-bottom:55px;
  margin-left:auto;
  text-align:right
}

.process-heading h2{
  margin-bottom:16px;
  color:var(--brown);
  font-size:clamp(2rem,3.5vw,3rem)
}

.process-heading p{
  max-width:650px;
  margin-left:auto;
  color:var(--muted);
  font-size:.97rem;
  line-height:1.7
}

.process-grid{
  display:grid;
  grid-template-columns:minmax(440px,1.1fr) minmax(350px,.9fr);
  align-items:center;
  gap:65px;
  width:100%;
  max-width:1050px;
  margin:0 auto
}

.process-card{
  width:100%;
  padding:32px;
  border:2px solid #e3b45e;
  border-radius:16px;
  background:#fff;
  box-shadow:0 12px 28px rgba(63,33,12,.10)
}

.process-list{
  display:grid;
  gap:15px;
  padding:0;
  list-style:none
}

.process-list li{
  display:flex;
  align-items:center;
  gap:15px;
  padding:15px;
  border-radius:12px;
  background:#fffaf1;
  transition:transform .25s ease,background .25s ease
}

.process-list li:hover{
  transform:translateX(5px);
  background:#f9e8c8
}

.process-icon{
  flex:0 0 45px;
  width:45px;
  height:45px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(135deg,#e2b45e,#c98f30)
}

.process-icon i{
  font-size:1.16rem
}

.process-step-content{
  flex:1
}

.process-step-content strong{
  display:block;
  margin-bottom:5px;
  color:var(--brown);
  font-size:.98rem
}

.process-step-content p{
  color:#5f4a3a;
  font-size:.88rem;
  font-weight:500;
  line-height:1.5
}

.process-card .btn{
  display:flex;
  width:max-content;
  min-width:210px;
  margin:25px auto 0
}

.process-image{
  position:relative;
  width:100%;
  height:480px;
  overflow:hidden;
  border-radius:18px
}

.process-image img{
  width:100%;
  height:100%;
  object-fit:cover
}

.process-image-label{
  position:absolute;
  right:20px;
  bottom:20px;
  left:20px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:15px 17px;
  border-radius:12px;
  background:rgba(255,255,255,.92);
  box-shadow:0 10px 25px rgba(63,33,12,.18);
  backdrop-filter:blur(8px)
}

.process-image-label i{
  color:var(--gold);
  font-size:1.45rem
}

.process-image-label span,
.process-image-label strong{
  display:block
}

.process-image-label span{
  color:var(--muted);
  font-size:.68rem
}

.process-image-label strong{
  margin-top:2px;
  color:var(--brown);
  font-size:.86rem
}

/* ==================================================
   DIFERENCIAIS
================================================== */

.differentiators{
  background:#f7e6c5
}

.differentiators-layout{
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  align-items:center;
  gap:70px
}

.differentiators-heading h2{
  margin-bottom:20px;
  color:var(--brown);
  font-size:clamp(2rem,3.3vw,3rem)
}

.differentiators-heading h2 em{
  display:block;
  margin-top:5px
}

.differentiators-heading p{
  color:#675140;
  font-size:.94rem;
  line-height:1.7
}

.differentiators-card{
  width:100%;
  padding:45px 52px;
  border:none;
  border-radius:17px;
  background:#fff;
  box-shadow:0 16px 35px rgba(63,33,12,.13)
}

.benefits-list.large{
  gap:25px
}

.benefits-list.large li{
  display:flex;
  align-items:center;
  gap:18px;
  color:#4e3827;
  font-size:1rem;
  font-weight:500;
  line-height:1.45
}

.differential-check{
  flex:0 0 36px;
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:var(--brown);
  background:#f1cf8d
}

.differential-check i{
  font-size:1rem
}

/* ==================================================
   DEPOIMENTOS
================================================== */

.testimonials{
  background:#fff
}

.testimonials-heading{
  max-width:650px;
  margin-bottom:45px
}

.testimonials-heading h2{
  color:var(--brown);
  font-size:clamp(2rem,3.4vw,3rem)
}

.testimonials-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px
}

.testimonial-card{
  padding:28px;
  border:1px solid rgba(216,169,79,.55);
  border-radius:13px;
  box-shadow:0 9px 22px rgba(63,33,12,.07)
}

.testimonial-card img{
  width:92px;
  margin-bottom:18px
}

.testimonial-card p{
  margin-bottom:18px;
  color:#515170;
  font-size:.9rem;
  line-height:1.75
}

.testimonial-card strong,
.testimonial-card span{
  display:block
}

.testimonial-card span{
  margin-top:4px;
  color:#77779a;
  font-size:.82rem
}

/* ==================================================
   CHAMADA FINAL
================================================== */

.cta-section{
  padding:65px 0;
  background:var(--gold)
}

.cta-container{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:28px
}

.cta-icon{
  width:62px;
  height:62px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:var(--brown);
  background:rgba(255,255,255,.48)
}

.cta-icon i{
  font-size:1.55rem
}

.cta-section h2{
  margin-bottom:10px;
  color:var(--brown);
  font-size:clamp(1.7rem,2.7vw,2.4rem)
}

.cta-section p{
  max-width:700px;
  color:#5d3e22;
  font-size:.95rem;
  font-weight:500;
  line-height:1.65
}

/* ==================================================
   RODAPÉ
================================================== */

.site-footer{
  padding-top:65px;
  background:#fff
}

.footer-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:70px
}

.site-footer h2{
  margin-bottom:24px;
  color:var(--brown);
  font-size:2.15rem
}

.site-footer p{
  display:flex;
  align-items:center;
  gap:10px;
  margin:10px 0;
  color:#666;
  font-size:.9rem
}

.site-footer p img{
  width:18px
}

.social-links{
  display:flex;
  gap:14px;
  margin-top:22px
}

.social-links img{
  width:42px;
  transition:.25s
}

.social-links a:hover img{
  transform:translateY(-4px);
  filter:drop-shadow(0 8px 10px rgba(0,0,0,.16))
}

.map-card{
  display:block;
  overflow:hidden;
  border-radius:14px;
  cursor:pointer
}

.map-card iframe{
  width:100%;
  height:250px;
  display:block;
  border:0;
  pointer-events:none
}

.copyright{
  margin-top:50px;
  padding:9px;
  color:#fff;
  text-align:center;
  font-size:.76rem;
  background:var(--gold)
}

/* ==================================================
   WHATSAPP FLUTUANTE
================================================== */

.floating-whatsapp{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:999;
  width:46px;
  height:46px;
  filter:drop-shadow(0 9px 14px rgba(0,0,0,.24));
  transition:.25s
}

.floating-whatsapp img{
  width:100%;
  height:100%;
  object-fit:contain
}

.floating-whatsapp:hover{
  transform:translateY(-6px) scale(1.04)
}

/* ==================================================
   TABLETS
================================================== */

@media(max-width:1000px){

  .hero-grid{
    min-height:calc(100vh - 82px)
  }

  .hero h1{
    font-size:clamp(2rem,3.7vw,2.75rem)
  }

  .hero-image-frame{
    min-height:340px
  }

  .portfolio-heading{
    grid-template-columns:1fr;
    gap:18px
  }

  .portfolio-heading h2{
    white-space:normal
  }

  .process-grid{
    grid-template-columns:1fr 1fr;
    gap:40px
  }
}

@media(max-width:900px){

  .brand img{
    width:100px;
    height:64px
  }

  .header-cta{
    display:none
  }

  .menu-toggle{
    display:block
  }

  .main-nav{
    position:fixed;
    top:82px;
    right:-100%;
    width:280px;
    height:calc(100vh - 82px);
    flex-direction:column;
    align-items:flex-start;
    padding:35px;
    background:#fff;
    box-shadow:-10px 10px 25px rgba(0,0,0,.12);
    transition:.3s
  }

  .main-nav.open{
    right:0
  }

  .hero{
    min-height:auto
  }

  .hero-grid{
    min-height:auto;
    display:grid;
    grid-template-columns:1fr;
    gap:45px;
    padding-top:65px;
    padding-bottom:65px
  }

  .hero-content{
    max-width:760px
  }

  .hero-image-column{
    position:relative;
    top:auto;
    right:auto;
    width:min(100%,520px);
    margin:auto;
    transform:none
  }

  .hero-image-frame{
    height:400px;
    min-height:0
  }

  .stats-grid{
    grid-template-columns:repeat(2,1fr)
  }

  .school-grid{
    grid-template-columns:1fr;
    gap:52px;
    max-width:680px
  }

  .school-image-wrapper{
    width:min(100%,380px)
  }

  .school-floating-badge{
    right:-25px
  }

  .portfolio-slide{
    grid-template-columns:1fr 1fr
  }

  .portfolio-slide .portfolio-card:nth-child(3){
    grid-column:1/-1;
    width:50%;
    margin:auto
  }

  .portfolio-slide .single{
    grid-column:1/-1;
    width:50%;
    margin:auto
  }

  .process-grid{
    grid-template-columns:1fr;
    max-width:650px
  }

  .process-image{
    height:430px
  }

  .differentiators-layout{
    grid-template-columns:1fr;
    gap:40px
  }

  .differentiators-heading{
    max-width:650px
  }

  .testimonials-grid{
    grid-template-columns:1fr
  }

  .testimonial-card{
    max-width:650px
  }

  .cta-container{
    grid-template-columns:auto 1fr
  }

  .cta-container .btn{
    grid-column:2
  }

  .footer-grid{
    grid-template-columns:1fr;
    gap:45px
  }
}

/* ==================================================
   CELULARES
================================================== */

@media(max-width:600px){

  .container,
  .container.wide{
    width:min(100% - 28px,1120px)
  }

  .section{
    padding:64px 0
  }

  .brand img{
    width:88px;
    height:58px
  }

  .hero-grid{
    padding-top:48px;
    padding-bottom:48px
  }

  .hero h1{
    font-size:clamp(2rem,10vw,2.7rem);
    white-space:normal
  }

  .hero h1 span{
    display:block;
    white-space:normal
  }

  .hero-description{
    font-size:.94rem
  }

  .hero-actions{
    flex-direction:column
  }

  .hero-actions .btn{
    width:100%
  }

  .hero-details{
    flex-direction:column;
    gap:10px
  }

  .hero-image-frame{
    height:330px;
    min-height:0
  }

  .stats-grid{
    grid-template-columns:1fr
  }

  .stat-card{
    min-height:125px
  }

  .school-heading{
    margin-bottom:38px
  }

  .school-heading h2{
    font-size:2rem
  }

  .school-heading p{
    font-size:.96rem
  }

  .school-grid{
    gap:42px
  }

  .school-benefits li{
    min-height:auto;
    padding:16px
  }

  .school-benefits li:hover{
    transform:translateY(-4px)
  }

  .benefit-icon{
    flex-basis:43px;
    width:43px;
    height:43px
  }

  .benefit-content strong{
    font-size:.93rem
  }

  .benefit-content small{
    font-size:.82rem
  }

  .school-action{
    flex-direction:column;
    align-items:stretch
  }

  .school-action .btn{
    width:100%
  }

  .school-action-note{
    max-width:none;
    text-align:center
  }

  .school-image-wrapper{
    width:min(88%,340px)
  }

  .school-floating-badge{
    top:22px;
    right:-18px;
    min-width:155px;
    padding:11px 13px
  }

  .portfolio-heading h2{
    font-size:2rem
  }

  .portfolio-heading h2 span{
    white-space:normal
  }

  .portfolio-slider{
    padding:0 42px 8px
  }

  .portfolio-track{
    min-height:0
  }

  .portfolio-slide{
    grid-template-columns:1fr;
    gap:25px
  }

  .portfolio-slide .portfolio-card:nth-child(3),
  .portfolio-slide .single{
    grid-column:auto;
    width:100%
  }

  .portfolio-image{
    aspect-ratio:4/4.6
  }

  .carousel-arrow{
    width:38px;
    height:38px
  }

  .portfolio-actions{
    gap:13px
  }

  .portfolio-actions .btn{
    width:100%
  }

  .process-heading{
    text-align:left
  }

  .process-heading p{
    margin-left:0
  }

  .process-card{
    padding:20px 16px
  }

  .process-list li{
    align-items:flex-start;
    padding:13px
  }

  .process-icon{
    flex-basis:40px;
    width:40px;
    height:40px
  }

  .process-step-content p{
    font-size:.82rem
  }

  .process-card .btn{
    width:100%;
    min-width:0
  }

  .process-image{
    height:340px
  }

  .differentiators-card{
    padding:30px 22px
  }

  .benefits-list.large li{
    align-items:flex-start;
    gap:13px;
    font-size:.92rem
  }

  .differential-check{
    flex-basis:32px;
    width:32px;
    height:32px
  }

  .cta-container{
    grid-template-columns:1fr;
    text-align:center
  }

  .cta-icon{
    margin:auto
  }

  .cta-container .btn{
    grid-column:auto;
    width:100%
  }

  .floating-whatsapp{
    width:44px;
    height:44px
  }
}

/* ==================================================
   PÁGINAS INTERNAS — SOBRE, SERVIÇOS E PORTFÓLIO
================================================== */

.internal-page{
  background:#fffdf9
}

.inner-hero{
  position:relative;
  overflow:hidden;
  padding:96px 0 82px;
  background:
    radial-gradient(circle at 12% 25%,rgba(216,169,79,.22),transparent 27%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.05) 0,rgba(255,255,255,.05) 1px,transparent 1px,transparent 7px),
    linear-gradient(135deg,#fffaf1 0%,#f7e5c4 58%,#efd09a 100%)
}

.inner-hero::after{
  content:"";
  position:absolute;
  right:-120px;
  bottom:-170px;
  width:390px;
  height:390px;
  border:1px solid rgba(110,84,40,.18);
  border-radius:50%
}

.inner-hero-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:end;
  gap:55px
}

.inner-hero h1{
  max-width:830px;
  color:var(--brown);
  font-size:clamp(2.35rem,4.6vw,4.6rem);
  letter-spacing:-.045em
}

.inner-hero p{
  max-width:760px;
  margin-top:22px;
  color:#654d39;
  font-size:1.02rem;
  font-weight:500;
  line-height:1.75
}

.inner-hero-mark{
  min-width:180px;
  padding:22px 24px;
  border:1px solid rgba(63,33,12,.10);
  border-radius:18px;
  background:rgba(255,255,255,.72);
  box-shadow:0 14px 30px rgba(63,33,12,.10);
  backdrop-filter:blur(8px)
}

.inner-hero-mark i,
.inner-hero-mark strong,
.inner-hero-mark span{
  display:block
}

.inner-hero-mark i{
  margin-bottom:12px;
  color:var(--gold);
  font-size:1.7rem
}

.inner-hero-mark strong{
  color:var(--brown);
  font-size:1.25rem
}

.inner-hero-mark span{
  margin-top:4px;
  color:var(--muted);
  font-size:.76rem
}

.about-history{
  background:#fff
}

.about-history-grid{
  display:grid;
  grid-template-columns:minmax(310px,.8fr) minmax(0,1.2fr);
  align-items:center;
  gap:72px
}

.about-photo{
  height:520px;
  overflow:hidden;
  border-radius:22px
}

.about-photo img{
  width:100%;
  height:100%;
  object-fit:cover
}

.about-copy h2,
.purpose-heading h2,
.services-page-heading h2{
  margin-bottom:24px;
  color:var(--brown)
}

.about-copy p{
  color:#5f4a39;
  font-size:1rem;
  font-weight:500;
  line-height:1.9;
  text-align:justify;
  margin:0 0 16px
}

.about-copy p:last-child{
  margin-bottom:0
}

.purpose-section{
  background:#f6e5c3
}

.purpose-heading,
.services-page-heading{
  max-width:760px;
  margin-bottom:48px
}

.purpose-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:26px
}

.purpose-card{
  min-height:315px;
  padding:31px;
  border:1px solid rgba(216,169,79,.30)
}

.purpose-icon,
.service-mini-icon{
  width:49px;
  height:49px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:20px;
  border-radius:50%;
  color:var(--brown);
  background:#f1cf8d
}

.purpose-icon i,
.service-mini-icon i{
  font-size:1.25rem
}

.purpose-card h3{
  margin-bottom:16px;
  color:var(--brown);
  font-size:1.35rem
}

.purpose-card p,
.purpose-card li{
  color:#5c4838;
  font-size:.93rem;
  font-weight:500;
  line-height:1.75
}

.values-card ul{
  display:grid;
  gap:8px;
  padding-left:18px
}

.internal-cta{
  padding:65px 0;
  background:#fff
}

.internal-cta-box{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:34px;
  padding:48px 52px;
  border-radius:22px;
  background:linear-gradient(135deg,#d8a94f,#c99035);
  box-shadow:0 20px 42px rgba(63,33,12,.18)
}

.internal-cta-box::after{
  content:"";
  position:absolute;
  right:-85px;
  bottom:-120px;
  width:250px;
  height:250px;
  border:1px solid rgba(255,255,255,.30);
  border-radius:50%
}

.internal-cta-box > *{
  position:relative;
  z-index:2
}

.internal-cta-box h2{
  max-width:760px;
  margin-bottom:12px;
  color:var(--brown)
}

.internal-cta-box p{
  max-width:760px;
  color:#56361c;
  font-size:.95rem;
  font-weight:500;
  line-height:1.65
}

.services-page-section{
  background:#fffaf1
}

.services-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:32px
}

.service-card{
  overflow:hidden;
  border:1px solid rgba(216,169,79,.26)
}

.service-card:nth-child(5){
  grid-column:1 / -1;
  width:calc(50% - 16px);
  justify-self:center
}

.service-image{
  position:relative;
  aspect-ratio:16/10;
  overflow:hidden;
  background:#e8d8bd
}

.service-slideshow{
  position:absolute;
  inset:0
}

.service-slideshow img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transform:scale(1.04);
  animation:serviceFade 12s infinite
}

.service-slideshow img:nth-child(1){animation-delay:0s}
.service-slideshow img:nth-child(2){animation-delay:4s}
.service-slideshow img:nth-child(3){animation-delay:8s}

@keyframes serviceFade{
  0%{opacity:0;transform:scale(1.05)}
  7%{opacity:1}
  29%{opacity:1;transform:scale(1)}
  36%{opacity:0}
  100%{opacity:0}
}

.service-image-overlay{
  position:absolute;
  inset:0;
  z-index:2;
  background:linear-gradient(180deg,transparent 38%,rgba(35,17,5,.88) 100%)
}

.service-caption{
  position:absolute;
  right:24px;
  bottom:22px;
  left:24px;
  z-index:3;
  color:#fff;
  text-shadow:0 2px 8px rgba(0,0,0,.65)
}

.service-caption span{
  display:block;
  max-width:90%;
  margin-bottom:5px;
  font-size:.68rem;
  font-weight:600;
  line-height:1.45;
  letter-spacing:.07em;
  text-transform:none
}

.service-caption h3{
  max-width:92%;
  color:#fff;
  font-size:1.35rem;
  line-height:1.22
}

.service-body{
  padding:25px 27px 28px
}

.service-body .service-mini-icon{
  width:40px;
  height:40px;
  margin-bottom:13px
}

.service-body p{
  color:#5b4737;
  font-size:.92rem;
  font-weight:500;
  line-height:1.72
}

.portfolio-intro{
  padding:100px 0;
  background:
    radial-gradient(circle at 85% 20%,rgba(255,255,255,.15),transparent 24%),
    linear-gradient(135deg,#d8b26b 0%,#d4a54d 100%)
}

.portfolio-intro-content{
  position:relative;
  z-index:2
}

.portfolio-intro h1{
  max-width:960px;
  color:#fff;
  font-size:clamp(2.25rem,4.2vw,4.1rem);
  line-height:1.08;
  letter-spacing:-.04em
}

.portfolio-gallery-section{
  background:#fffaf1
}

.portfolio-gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  gap:30px
}

.project-card{
  display:flex;
  flex-direction:column;
  height:100%;
  overflow:hidden;
  border:1px solid rgba(216,169,79,.28)
}

.project-image{
  aspect-ratio:1/1;
  overflow:hidden;
  background:#eee2cf
}

.project-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .65s ease
}

.project-card:hover .project-image img{
  transform:scale(1.045)
}

.project-meta{
  display:flex;
  flex:1;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:104px;
  padding:20px 22px
}

.project-meta > div{
  min-width:0
}

.project-meta h2{
  margin-bottom:7px;
  color:var(--brown);
  font-size:1rem;
  line-height:1.3
}

.project-meta p{
  color:var(--muted);
  font-size:.86rem;
  font-weight:600
}

.project-arrow{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:var(--brown);
  background:#f1cf8d
}

.project-photo-only{
  margin-top:0
}

.project-photo-only .project-image{
  aspect-ratio:1/1
}

@media(max-width:900px){
  .inner-hero-grid,
  .about-history-grid,
  .purpose-grid{
    grid-template-columns:1fr
  }

  .portfolio-gallery-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .inner-hero-mark{
    width:max-content
  }

  .about-photo{
    height:430px
  }

  .purpose-grid{
    max-width:680px
  }

  .services-grid{
    grid-template-columns:1fr
  }

  .service-card:nth-child(5){
    grid-column:auto;
    width:100%
  }

  .internal-cta-box{
    grid-template-columns:1fr
  }

  .internal-cta-box .btn{
    width:max-content
  }

  .portfolio-gallery-grid{
    max-width:none;
    margin:auto
  }

  .project-photo-only{
    margin-top:0
  }
}

@media(max-width:600px){
  .portfolio-gallery-grid{
    grid-template-columns:1fr
  }

  .inner-hero{
    padding:70px 0 60px
  }

  .inner-hero h1,
  .portfolio-intro h1{
    font-size:2.35rem
  }

  .about-photo{
    height:350px
  }

  .purpose-card{
    min-height:0;
    padding:25px 22px
  }

  .internal-cta-box{
    padding:36px 24px
  }

  .internal-cta-box .btn{
    width:100%
  }

  .service-caption{
    right:18px;
    bottom:18px;
    left:18px
  }

  .service-caption h3{
    font-size:1.12rem
  }

  .service-body{
    padding:22px 20px 24px
  }

  .portfolio-intro{
    padding:72px 0
  }
}


/* ==================================================
   AJUSTES 25/08/2026 — PORTFÓLIO E DEPOIMENTOS
================================================== */

.testimonials-grid-two{
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:stretch;
}

.testimonials-grid-two .testimonial-card{
  display:flex;
  flex-direction:column;
}

.testimonials-grid-two .testimonial-card p{
  flex:1;
}

.project-meta p{
  margin-top:7px;
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.04em;
}

@media(max-width:900px){
  .testimonials-grid-two{
    grid-template-columns:1fr;
  }
}

/* Carrossel interno do projeto Clínica Oliva */
.project-carousel{position:relative}
.project-carousel-track{position:absolute;inset:0}
.project-carousel-track img{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .35s ease;transform:none!important}
.project-carousel-track img.active{opacity:1;pointer-events:auto}
.project-carousel-arrow{position:absolute;top:50%;z-index:4;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:0;border-radius:50%;color:var(--brown);background:rgba(255,255,255,.92);box-shadow:0 5px 14px rgba(63,33,12,.18);cursor:pointer;transform:translateY(-50%);transition:background .2s ease,transform .2s ease}
.project-carousel-arrow:hover{background:#f1cf8d;transform:translateY(-50%) scale(1.06)}
.project-carousel-arrow.prev{left:12px}
.project-carousel-arrow.next{right:12px}