/*
Theme Name: Cezanne Odontologia
Theme URI: https://cezanneodontologia.com.br
Description: Landing page de Implantes Dentários da Cezanne Odontologia (convertida do projeto Lovable).
Author: Erick
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: cezanne
*/

/* ── Reset (equivalente ao preflight do Tailwind) ── */
*,*::before,*::after{box-sizing:border-box;border:0 solid var(--border);margin:0;padding:0}
html{line-height:1.5;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
img,svg{display:block;max-width:100%}
img{height:auto}
ul,ol{list-style:none}
a{color:inherit;text-decoration:inherit}
h1,h2,h3{font-size:inherit}

/* ── Tokens ── */
:root{
  --radius:.375rem;
  --background:oklch(.995 .003 85);
  --foreground:oklch(.22 .03 265);
  --card:oklch(1 0 0);
  --secondary:oklch(.96 .012 90);
  --muted-foreground:oklch(.5 .02 265);
  --border:oklch(.9 .012 90);
  --destructive:oklch(.577 .245 27.325);
  --destructive-foreground:oklch(.984 .003 247.858);
  --navy:oklch(.22 .05 265);
  --navy-foreground:oklch(.97 .01 90);
  --gold:oklch(.76 .115 85);
  --gold-soft:oklch(.88 .07 88);
  --whats:oklch(.62 .16 148);
  --whats-foreground:oklch(.99 .01 148);
  --gradient-gold:linear-gradient(100deg,var(--gold),var(--gold-soft));
  --gradient-navy:linear-gradient(160deg,oklch(.24 .05 265),oklch(.16 .04 265));
  --shadow-soft:0 18px 45px -22px oklch(.22 .05 265/.28);
  --shadow-lift:0 30px 70px -30px oklch(.22 .05 265/.4);
  --font-display:"Cormorant Garamond",Georgia,serif;
  --font-sans:"Karla",ui-sans-serif,system-ui,sans-serif;
}

body{font-family:var(--font-sans);-webkit-font-smoothing:antialiased;background:var(--background);color:var(--foreground)}
h1,h2,h3,h4,blockquote{font-family:var(--font-display);font-weight:600;letter-spacing:-.015em}

/* ── Utilitários ── */
.container{max-width:72rem;margin-inline:auto;padding-inline:1.5rem}
.surface-navy{background-image:var(--gradient-navy);color:var(--navy-foreground)}
.text-gold-gradient{background-image:var(--gradient-gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{font-family:var(--font-sans);font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;font-weight:600}
.eyebrow--gold{color:var(--gold)}
.ico{width:1rem;height:1rem;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.section{padding-block:4rem}
.section-title{font-size:1.875rem;line-height:1.25}
.section-title--navy{color:var(--navy)}
.section-title--lg{margin-top:1rem}
@media(min-width:640px){.section{padding-block:6rem}.section-title{font-size:3rem}}

@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── Botões ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:9999px;padding:1rem 2rem;font-size:.875rem;line-height:1.43;font-weight:700;text-transform:uppercase;letter-spacing:.12em;transition:all .3s;font-family:var(--font-sans);cursor:pointer}
.btn:hover{transform:translateY(-.125rem)}
.btn--whats{background:var(--whats);color:var(--whats-foreground);box-shadow:var(--shadow-soft)}
.btn--whats:hover{box-shadow:var(--shadow-lift)}
.btn--gold{background-image:var(--gradient-gold);color:var(--navy);box-shadow:var(--shadow-soft)}
.btn--gold:hover{box-shadow:var(--shadow-lift)}
.btn--outline{border:1px solid oklch(.76 .115 85/.5);color:var(--gold)}
.btn--outline:hover{background:oklch(.76 .115 85/.1)}
.btn .ico--arrow{transition:transform .3s}
.btn:hover .ico--arrow{transform:translateX(.25rem)}

/* ── Top bar ── */
.topbar{background:var(--destructive);color:var(--destructive-foreground);padding-block:.5rem;text-align:center;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.18em}

/* ── Hero ── */
.hero{position:relative;overflow:hidden;min-height:40rem;background:var(--navy)}
.hero__media{position:absolute;inset:0;width:100%;height:100%}
.hero__media img{width:100%;height:100%;object-fit:cover}
.hero__img-mobile{object-position:center}
.hero__img-desktop{display:none;transform:scaleX(-1);object-position:5% 18%}
.hero__overlay-desktop{display:none;position:absolute;inset:0;background:linear-gradient(100deg,oklch(.22 .05 265/.94) 0%,oklch(.22 .05 265/.78) 42%,oklch(.22 .05 265/0) 70%)}
.hero__overlay-mobile{position:absolute;inset:0;background:oklch(.22 .05 265/.85)}
.hero__inner{position:relative;z-index:10;display:flex;flex-direction:column;justify-content:flex-end;min-height:40rem;max-width:72rem;margin-inline:auto;padding:1.5rem 1.5rem 4rem}
.hero__content{max-width:36rem;animation:rise .7s cubic-bezier(.22,1,.36,1) both}
.hero .eyebrow{color:rgb(255 255 255/.8)}
.hero h1{margin-top:1rem;font-size:2rem;line-height:1.1;color:#fff}
.hero__lead{margin-top:1.25rem;max-width:28rem;font-size:.875rem;line-height:1.625;color:rgb(255 255 255/.85)}
.hero__ctas{margin-top:1.75rem;display:flex;flex-direction:column;align-items:stretch;gap:.75rem}
.hero__proof{margin-top:2rem;display:flex;align-items:center;gap:1rem}
.hero__avatars{display:flex}
.hero__avatars img{width:2.5rem;height:2.5rem;border-radius:9999px;border:2px solid rgb(255 255 255/.2);object-fit:cover}
.hero__avatars img+img{margin-left:-.75rem}
.hero__count{font-family:var(--font-display);font-size:1.5rem;line-height:1.33;font-weight:600;color:#fff}
.hero__count-label{font-size:.75rem;line-height:1.33;text-transform:uppercase;letter-spacing:.18em;color:rgb(255 255 255/.75)}
@media(min-width:640px){
  .hero{background:var(--secondary);min-height:44rem}
  .hero__img-mobile,.hero__overlay-mobile{display:none}
  .hero__img-desktop,.hero__overlay-desktop{display:block}
  .hero__inner{min-height:44rem;padding-top:2.5rem}
  .hero h1{font-size:3rem}
  .hero__lead{font-size:1rem;line-height:1.625}
  .hero__ctas{flex-direction:row;flex-wrap:wrap;align-items:center;gap:1rem}
  .hero__avatars img{width:2.75rem;height:2.75rem}
}
@media(min-width:1024px){
  .hero{min-height:0}
  .hero__img-desktop{object-position:35% center}
  .hero__inner{min-height:42rem;justify-content:center;padding-block:7rem}
  .hero h1{margin-top:1.5rem;font-size:3.75rem}
}

/* ── Dor ── */
.pain{border-block:1px solid var(--border);background:var(--background)}
.pain__inner{max-width:48rem;margin-inline:auto;padding-inline:1.5rem;text-align:center}
.pain__mark{position:relative;display:inline-block}
.pain__mark-text{position:relative;z-index:10;padding-inline:.5rem;color:var(--navy-foreground)}
.pain__mark-bg{position:absolute;left:0;right:0;top:.25rem;bottom:.25rem;transform:skewX(-3deg);border-radius:.25rem;background:var(--navy)}
.pain p{margin-top:2rem;line-height:1.625;color:var(--muted-foreground)}

/* ── Benefícios ── */
.benefits__head{max-width:42rem}
.benefits__grid{margin-top:3.5rem;display:grid;gap:1.5rem}
.benefit{position:relative;overflow:hidden;border-radius:.875rem;box-shadow:var(--shadow-soft);transition:transform .5s}
.benefit:hover{transform:translateY(-.375rem)}
.benefit img{width:100%;height:22rem;object-fit:cover;transition:transform .7s}
.benefit:hover img{transform:scale(1.05)}
.benefit__shade{position:absolute;inset:0;background:linear-gradient(to top,oklch(.16 .04 265/.94) 18%,oklch(.16 .04 265/.15) 62%,transparent)}
.benefit__text{position:absolute;left:0;right:0;bottom:0;padding:1.5rem;color:var(--navy-foreground)}
.benefit__text .ico{width:1.25rem;height:1.25rem;margin-bottom:.75rem;color:var(--gold)}
.benefit h3{font-size:1.25rem;line-height:1.375}
.benefit p{margin-top:.5rem;font-size:.875rem;line-height:1.625;color:oklch(.97 .01 90/.75)}
.center-row{margin-top:3rem;display:flex;justify-content:center}
@media(min-width:640px){.benefits__grid{grid-template-columns:repeat(2,1fr)}.benefit img{height:26rem}}
@media(min-width:1024px){.benefits__grid{grid-template-columns:repeat(4,1fr)}}

/* ── Antes e depois ── */
.cases{background:var(--secondary)}
.cases__head{max-width:42rem;margin-inline:auto;padding-inline:1.5rem;text-align:center}
.marquee{position:relative;margin-top:3.5rem;overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}
.marquee__track{display:flex;width:max-content;gap:1.5rem;animation:marquee 55s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.case{width:17rem;flex-shrink:0;overflow:hidden;border-radius:1.125rem;background:var(--card);box-shadow:var(--shadow-soft)}
.case img{width:100%;height:25rem;object-fit:cover}
@media(min-width:640px){.case{width:20rem}.case img{height:29rem}}
@media(prefers-reduced-motion:reduce){.marquee__track{animation:none}.hero__content{animation:none}}

/* ── Avaliações ── */
.reviews__grid{display:grid;gap:1.5rem}
.review{border:1px solid var(--border);border-radius:.875rem;background:var(--card);padding:1.75rem;box-shadow:var(--shadow-soft)}
.review__top{display:flex;align-items:center;gap:.75rem}
.review__avatar{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:9999px;background:var(--navy);color:var(--navy-foreground);font-family:var(--font-display);font-size:1.125rem}
.review__name{font-family:var(--font-sans);font-size:.875rem;font-weight:700;color:var(--navy)}
.review__when{font-size:.75rem;color:var(--muted-foreground)}
.review__stars{margin-top:1rem;display:flex;gap:.125rem;color:var(--gold)}
.review__stars .ico{fill:currentColor}
.review__text{margin-top:1rem;font-family:var(--font-sans);font-size:.875rem;line-height:1.625;color:var(--muted-foreground)}
@media(min-width:768px){.reviews__grid{grid-template-columns:repeat(3,1fr)}}

/* ── Processo ── */
.process__head{max-width:42rem;margin-inline:auto;text-align:center}
.process__steps{margin-top:4rem;display:grid;gap:2.5rem}
.step{position:relative}
.step__row{margin-bottom:1.25rem;display:flex;align-items:center;gap:.75rem}
.step__num{display:grid;place-items:center;flex-shrink:0;width:2.25rem;height:2.25rem;border-radius:9999px;border:1px solid oklch(.76 .115 85/.6);font-family:var(--font-sans);font-size:.75rem;font-weight:700;color:var(--gold)}
.step__line{height:1px;flex:1;background:oklch(.76 .115 85/.25)}
.step h3{font-size:1.25rem;line-height:1.375}
.step p{margin-top:.75rem;font-family:var(--font-sans);font-size:.875rem;line-height:1.625;color:oklch(.97 .01 90/.7)}
@media(min-width:768px){.process__steps{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){.process__steps{grid-template-columns:repeat(5,1fr)}}

/* ── CTA final ── */
.final{background:var(--secondary)}
.final__inner{max-width:56rem;margin-inline:auto;padding-inline:1.5rem;text-align:center}
.final__list{margin-top:2rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;column-gap:2rem;row-gap:.75rem;font-size:.875rem;color:var(--muted-foreground)}
.final__list li{display:flex;align-items:center;gap:.5rem}
.final__list .ico{color:var(--whats)}
.final .center-row{margin-top:2.5rem}

/* ── Rodapé ── */
.footer{padding-block:3rem}
.footer__grid{display:grid;gap:2.5rem;text-align:center}
.footer__cols{display:grid;gap:2rem}
.footer h3{font-size:1.25rem;line-height:1.4;color:var(--gold)}
.footer__line{margin-top:.75rem;display:flex;justify-content:center;gap:.5rem;font-family:var(--font-sans);font-size:.875rem;line-height:1.625;color:oklch(.97 .01 90/.7)}
.footer__line--addr{align-items:flex-start}
.footer__line--addr .ico{margin-top:.125rem}
.footer__line:not(.footer__line--addr){align-items:center}
.footer__line .ico{color:var(--gold)}
.footer__line a:hover{color:var(--gold)}
.footer__brand{display:flex;flex-direction:column;align-items:center;gap:.75rem}
.footer__brand img{width:7rem;border-radius:.625rem}
.footer__name{font-family:var(--font-display);font-size:1.5rem;line-height:1.33;letter-spacing:.025em;color:var(--gold)}
.footer__legal{max-width:24rem;font-family:var(--font-sans);font-size:.75rem;line-height:1.625;color:oklch(.97 .01 90/.6)}
@media(min-width:640px){.footer__cols{grid-template-columns:repeat(2,1fr)}.footer__brand img{width:8rem}}
@media(min-width:768px){
  .footer__grid{grid-template-columns:repeat(2,1fr);text-align:left}
  .footer__line{justify-content:flex-start}
  .footer__brand{align-items:flex-end;text-align:right}
}

/* ── 404 ── */
.notfound{display:flex;min-height:60vh;align-items:center;justify-content:center;padding:1rem;text-align:center}
.notfound h1{font-size:4.5rem;color:var(--foreground)}
.notfound p{margin:1rem 0 1.5rem;color:var(--muted-foreground)}