/*
Theme Name: Marcelo Mariottini Editorial
Template: generatepress
Version: 1.1.12
Description: Identidade editorial exclusiva.
Text Domain: marcelo-mariottini
*/
:root {
  --navy: #071d30;
  --navy-soft: #0f3049;
  --cream: #f6f1e8;
  --cream-deep: #ece1d2;
  --gold: #c4a36a;
  --gold-light: #e2cca6;
  --mauve: #9b6175;
  --mauve-light: #eee0e5;
  --green: #4f7166;
  --ink: #162431;
  --muted: #5d6870;
  --background: #fbfaf7;
  --foreground: var(--ink);
  --primary: var(--navy);
  --primary-foreground: #fff;
  --border: #dcd7ce;
  --ring: var(--gold);
  --radius: .75rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 10rem; }
body { margin: 0; background: var(--background); color: var(--foreground); font-family: Arial, Helvetica, sans-serif; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
a:hover, a:focus, a:active { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
svg { width: 1em; height: 1em; stroke-width: 1.7; }
img { max-width: 100%; }
h1, h2, h3, p, li, strong, a { overflow-wrap: anywhere; }
h1, h2, h3 { hyphens: manual; }
[class*="-grid"] > *, .brand, .brand-copy { min-width: 0; }

.container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.skip-link { position: fixed; left: 1rem; top: -100px; z-index: 100; padding: .8rem 1rem; background: #fff; color: var(--navy); border-radius: .5rem; }
.skip-link:focus { top: 1rem; }

.topbar { background: var(--navy); color: #e2e9ee; font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; }
.topbar-inner { height: 38px; display: flex; justify-content: space-between; align-items: center; }
.topbar p { margin: 0; }
.topbar a { display: inline-flex; align-items: center; gap: .4rem; }

.site-header { position: sticky; top: 0; z-index: 30; border-bottom: 1px solid rgb(7 29 48 / 10%); background: var(--background); }
.header-inner { min-height: 144px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-block: .5rem; container: site-navigation / inline-size; }
.brand { display: inline-flex; align-items: center; gap: .75rem; }
.brand-logo { display: block; width: 128px; height: auto; aspect-ratio: 1; flex: 0 0 auto; object-fit: contain; }
.brand-copy { display: flex; flex-direction: column; gap: .25rem; line-height: 1.4; }
.brand-copy strong { color: var(--navy); font: 600 1rem Georgia, serif; letter-spacing: .02em; }
.brand-copy small { color: #665a4d; font-size: .75rem; line-height: 1.5; letter-spacing: .1em; text-transform: uppercase; }
.desktop-nav { display: none; flex: 0 0 auto; align-items: center; gap: 1.4rem; color: #34434e; font-size: .875rem; }
.desktop-nav > a, .desktop-nav > .nav-dropdown { flex: 0 0 auto; white-space: nowrap; overflow-wrap: normal; }
.desktop-nav a { display: inline-flex; align-items: center; gap: .25rem; transition: color .2s ease; }
.desktop-nav a:hover { color: var(--gold); }
.desktop-nav svg { font-size: .72rem; }
.header-cta { display: none; flex: 0 0 auto; align-items: center; gap: .5rem; min-height: 44px; padding: .5rem 1rem; border: 1px solid var(--navy); border-radius: 999px; color: var(--navy); font-size: .875rem; font-weight: 700; white-space: nowrap; overflow-wrap: normal; transition: background .2s ease, color .2s ease; }
.header-cta:hover { background: var(--navy); color: white; }
.mobile-menu-wrap { position: static; display: block; flex-shrink: 0; }
.mobile-menu { display: inline-flex; align-items: center; justify-content: center; width: 44px; min-height: 44px; cursor: pointer; list-style: none; border: 0; background: transparent; color: var(--navy); font-size: 1.35rem; }
.mobile-menu::-webkit-details-marker { display: none; }
.mobile-nav { position: absolute; top: 100%; right: 16px; display: grid; width: min(300px, calc(100% - 32px)); max-height: min(480px, calc(100dvh - 240px)); overflow-y: auto; overscroll-behavior: contain; padding: .6rem; border: 1px solid var(--border); background: #fff; box-shadow: 0 18px 45px rgb(7 29 48 / 18%); }
.mobile-nav a { padding: .8rem; border-bottom: 1px solid #ece8e1; color: var(--navy); font-size: 1rem; }
.mobile-nav a:last-child { border-bottom: 0; }

.hero { position: relative; min-height: 720px; overflow: hidden; background: var(--navy); color: white; }
.hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 72% 45%, rgb(196 163 106 / 18%), transparent 30%), linear-gradient(120deg, transparent 55%, rgb(255 255 255 / 2%) 55%); }
.hero-grid { position: relative; z-index: 2; min-height: 720px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 7vw; padding-block: 72px; }
.hero-copy { outline: none; }
.eyebrow { display: flex; align-items: center; gap: .65rem; margin: 0 0 1.25rem; color: var(--gold-light); font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow span { width: 28px; height: 1px; background: currentColor; }
.eyebrow-dark { color: #8b6b38; }
.eyebrow-mauve { color: var(--mauve); }
.eyebrow-green { color: #c7e0d6; }
.hero h1, .section h2 { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; letter-spacing: -.045em; }
.hero h1 { max-width: 720px; margin: 0; font-size: clamp(3rem, 5.5vw, 5rem); line-height: 1.12; letter-spacing: -.025em; overflow-wrap: normal; }
.hero h1 em { color: var(--gold-light); font-weight: 400; }
.hero-lead { max-width: 620px; margin: 1.8rem 0 0; color: #c4ced5; font-size: 1.05rem; line-height: 1.75; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; margin-top: 2rem; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-height: 52px; padding: .75rem 1.4rem; border: 1px solid transparent; border-radius: 999px; font-size: 1rem; line-height: 1.4; font-weight: 700; transition: background .2s ease, color .2s ease; }
.button.button-gold { background: var(--gold); color: var(--navy); }
.button.button-gold:hover, .button.button-gold:focus { background: var(--gold-light); color: var(--navy); }
.button.button-navy { background: var(--navy); color: #fff; }
.button.button-navy:hover, .button.button-navy:focus { background: var(--navy-soft); color: #fff; }
.button.button-outline { background: transparent; border-color: #b5cbc3; color: #e8f1ee; }
.button.button-outline:hover, .button.button-outline:focus { background: #e8f1ee; color: var(--green); }
.text-link { padding-block: .4rem; border-bottom: 1px solid #b4c3ce; color: #f5f8fa; font-size: 1rem; line-height: 1.5; font-weight: 600; }
.text-link-dark { display: inline-flex; align-items: center; gap: .5rem; border-color: #9b8c79; color: var(--navy); }
.hero-proof { display: flex; flex-wrap: wrap; gap: 1.5rem; margin: 2.3rem 0 0; padding: 0; list-style: none; color: #ced9e1; font-size: .875rem; }
.hero-proof li { display: flex; align-items: center; gap: .45rem; }
.hero-proof svg { color: var(--gold); }

.hero-visual { position: relative; display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.hero-frame { position: relative; width: min(430px, 100%); display: flex; flex-direction: column; gap: 1.5rem; padding: 2rem 1.75rem; border: 1px solid rgb(226 204 166 / 45%); border-radius: 220px 220px 18px 18px; background: linear-gradient(145deg, #173c57, #081d2f 55%, #7f6543); box-shadow: 0 45px 100px rgb(0 0 0 / 30%); }
.hero-monogram { display: grid; place-items: center; }
.hero-monogram .brand-logo { width: 100%; max-width: 350px; }
.hero-caption { display: flex; flex-direction: column; }
.hero-caption span { color: var(--gold-light); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; }
.hero-caption strong { margin-top: .5rem; font: 400 1.6rem/1.25 Georgia, serif; }
.credential-card { display: flex; align-items: center; gap: .8rem; width: min(430px, 100%); padding: 1rem 1.2rem; border: 1px solid #40576a; background: #102a3e; }
.credential-card > svg { flex: none; color: var(--gold); font-size: 1.5rem; }
.credential-card div { display: flex; flex-direction: column; min-width: 0; }
.credential-card small { color: #c9d5dd; font-size: .75rem; line-height: 1.5; text-transform: uppercase; letter-spacing: .06em; }
.credential-card strong { margin-top: .25rem; color: white; font-size: 1rem; line-height: 1.5; }
.hero-orbit { position: absolute; border: 1px solid rgb(226 204 166 / 12%); border-radius: 50%; }
.hero-orbit-one { width: 680px; height: 680px; right: -180px; top: -220px; }
.hero-orbit-two { width: 480px; height: 480px; right: 10%; bottom: -300px; }

.trust-strip { background: #fff; border-bottom: 1px solid var(--border); }
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.trust-grid > div { display: flex; align-items: center; gap: .9rem; min-height: 108px; padding: 1.25rem; border-right: 1px solid var(--border); }
.trust-grid > div:last-child { border-right: 0; }
.trust-grid svg { flex: none; color: var(--gold); font-size: 1.55rem; }
.trust-grid span { display: flex; flex-direction: column; gap: .375rem; color: #46525b; font-size: .875rem; line-height: 1.5; }
.trust-grid strong { color: var(--navy); font: 700 1.125rem/1.3 Georgia, serif; }

.section { padding: 110px 0; }
.section-heading h2, .section h2 { margin: 0; color: var(--navy); font-size: clamp(2.4rem, 5vw, 4.6rem); line-height: 1.12; }
.split-heading { display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; gap: 5rem; }
.split-heading > p { margin: 0 0 .5rem; color: var(--muted); line-height: 1.75; }
.procedure-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 4.5rem; background: var(--border); border: 1px solid var(--border); }
.procedure-card { position: relative; display: flex; flex-direction: column; min-height: 370px; padding: 2rem; background: #fff; transition: background .25s ease, transform .25s ease; }
.procedure-card:hover { z-index: 1; background: var(--cream); transform: translateY(-5px); }
.procedure-number { position: absolute; right: 1.8rem; top: 1.6rem; color: #c7beb2; font: 400 1.1rem Georgia, serif; }
.procedure-card > p { margin: 4.8rem 0 .8rem; color: #9b7b49; font-size: .65rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.procedure-card h3 { margin: 0; color: var(--navy); font: 400 clamp(1.75rem, 2.2vw, 2.1rem)/1.18 Georgia, serif; }
.procedure-card > span { display: block; margin-top: 1.2rem; color: var(--muted); font-size: .85rem; line-height: 1.65; }
.procedure-card a { display: inline-flex; align-items: center; align-self: flex-start; gap: .5rem; margin-top: auto; padding-top: 1.75rem; color: var(--navy); font-size: .75rem; font-weight: 700; }
.category-links { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 2.2rem; border-block: 1px solid var(--border); }
.category-links a { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: 1.2rem 1rem; border-right: 1px solid var(--border); color: #4c5962; font-size: .75rem; }
.category-links a:last-child { border: 0; }

.botox-section { background: var(--mauve-light); }
.botox-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 8vw; }
.botox-art { position: relative; min-height: 500px; display: flex; flex-direction: column; justify-content: center; overflow: hidden; border-radius: 200px 200px 24px 24px; background: linear-gradient(140deg, #6e3e50, #b98798); color: #fff; box-shadow: 0 35px 80px rgb(77 37 52 / 18%); }
.botox-art::after { content: ''; position: absolute; inset: 8%; border: 1px solid rgb(255 255 255 / 30%); border-radius: inherit; }
.botox-line { position: relative; z-index: 2; padding-inline: 9%; font: italic 400 clamp(2rem, 3.2vw, 3.6rem)/1.25 Georgia, serif; }
.botox-line-outline { color: transparent; -webkit-text-stroke: 1px rgb(255 255 255 / 75%); }
.botox-seal { position: absolute; z-index: 3; right: 9%; bottom: 8%; display: grid; width: 100px; aspect-ratio: 1; place-items: center; border: 1px solid rgb(255 255 255 / 45%); border-radius: 50%; text-align: center; font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.botox-copy > p:not(.eyebrow) { color: #5e4f54; line-height: 1.8; }
.botox-copy ul { margin: 2rem 0; padding: 0; list-style: none; }
.botox-copy li { display: flex; align-items: center; gap: .75rem; margin-top: .8rem; color: #56474c; font-size: .85rem; }
.botox-copy li svg { color: var(--mauve); }

.doctor-section { background: var(--cream); }
.doctor-grid { display: grid; grid-template-columns: 1fr .78fr; align-items: center; gap: 8vw; }
.doctor-copy > p:not(.eyebrow) { max-width: 650px; color: var(--muted); line-height: 1.8; }
.doctor-details { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 2.2rem 0; background: #cfc4b6; }
.doctor-details > div { display: flex; flex-direction: column; padding: 1.1rem 1.2rem; background: var(--cream); }
.doctor-details strong { color: var(--navy); font-size: .82rem; }
.doctor-details span { margin-top: .3rem; color: #756c62; font-size: .68rem; }
.doctor-grid blockquote { position: relative; margin: 0; padding: 3.5rem; background: var(--navy); color: #fff; box-shadow: 28px 28px 0 var(--gold-light); }
.doctor-grid blockquote > span { position: absolute; top: 1rem; color: var(--gold); font: 5rem Georgia, serif; opacity: .7; }
.doctor-grid blockquote p { position: relative; margin: 2.8rem 0 2rem; font: italic 400 2rem/1.35 Georgia, serif; }
.doctor-grid cite { color: #aebac2; font-size: .7rem; font-style: normal; letter-spacing: .12em; text-transform: uppercase; }

.technology-section { background: var(--green); color: white; }
.technology-grid { display: grid; grid-template-columns: 1.1fr 1fr auto; align-items: end; gap: 4rem; }
.technology-grid h2 { color: white; }
.technology-grid > p { margin: 0; color: #d7e3df; line-height: 1.75; }

.contact-section { background: var(--navy); color: white; }
.contact-grid { display: grid; grid-template-columns: 1fr .75fr; gap: 8vw; }
.contact-grid h2 { color: white; }
.contact-grid > div > p:not(.eyebrow) { max-width: 620px; color: #b5c0c7; line-height: 1.75; }
.contact-grid address { display: flex; flex-direction: column; justify-content: center; gap: 1.6rem; font-style: normal; }
.contact-grid address > div { display: flex; gap: 1rem; padding-bottom: 1.6rem; border-bottom: 1px solid rgb(255 255 255 / 12%); }
.contact-grid address svg { flex: none; margin-top: .2rem; color: var(--gold); font-size: 1.3rem; }
.contact-grid address span { display: flex; flex-direction: column; color: #b3c0c8; font-size: .8rem; line-height: 1.6; }
.contact-grid address strong { margin-bottom: .2rem; color: #fff; font-size: .8rem; }

.region-section { padding: 72px 0; background: #fff; }
.region-inner { display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 5rem; }
.region-inner h2 { margin: 0; color: var(--navy); font: 400 2.7rem/1.1 Georgia, serif; }
.region-inner ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; margin: 0; padding: 0; list-style: none; }
.region-inner li { padding: .8rem 1rem; border: 1px solid var(--border); color: #5e6870; font-size: .75rem; }

footer { padding: 60px 0 28px; background: #041421; color: #9dabb4; }
.footer-grid { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2rem; }
.brand-footer { flex-wrap: wrap; }
.brand-footer .brand-logo { width: 160px; }
.brand-footer .brand-copy strong { color: #fff; }
.brand-footer .brand-copy small { color: #ccd5dc; }
.footer-grid > p { color: #d0dbe2; font-size: .875rem; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 1rem; color: #d0dbe2; font-size: .875rem; }
.footer-legal { display: flex; justify-content: space-between; gap: 2rem; margin-top: 3rem; padding-top: 1.3rem; border-top: 1px solid rgb(255 255 255 / 10%); color: #c0ccd5; font-size: .875rem; }
.footer-legal p { margin: 0; }
.floating-whatsapp { position: fixed; z-index: 40; right: 24px; bottom: 24px; display: grid; width: 54px; aspect-ratio: 1; place-items: center; border: 1px solid rgb(255 255 255 / 40%); border-radius: 50%; background: #197f55; color: #fff; box-shadow: 0 12px 30px rgb(0 0 0 / 22%); font-size: 1.45rem; }

.detail-hero { position: relative; overflow: hidden; background: var(--navy); color: #fff; }
.detail-hero-mauve { background: #603a49; }
.detail-hero-green { background: #34584e; }
.detail-orbit { position: absolute; width: 720px; height: 720px; right: -290px; top: -340px; border: 1px solid rgb(255 255 255 / 14%); border-radius: 50%; }
.detail-hero-grid { position: relative; z-index: 2; min-height: 610px; display: grid; grid-template-columns: 1.08fr .72fr; align-items: center; gap: 8vw; padding-block: 74px; }
.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-bottom: 2.8rem; color: #9cafba; font-size: .68rem; }
.breadcrumbs a:hover { color: #fff; }
.detail-hero h1 { max-width: 800px; margin: 0; font: 400 clamp(3rem, 6vw, 5.5rem)/1.1 Georgia, serif; letter-spacing: -.03em; }
.detail-hero-grid > div:first-child > p:not(.eyebrow) { max-width: 720px; margin: 1.7rem 0 0; color: #c4cfd6; font-size: 1.02rem; line-height: 1.75; }
.detail-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; margin-top: 2rem; }
.detail-actions > span { display: inline-flex; align-items: center; gap: .45rem; color: #b4c0c7; font-size: .7rem; }
.detail-actions > span svg { color: var(--gold); font-size: 1.2rem; }
.detail-art { position: relative; min-height: 390px; display: flex; flex-direction: column; justify-content: flex-end; padding: 2.4rem; overflow: hidden; border: 1px solid rgb(226 204 166 / 38%); border-radius: 180px 180px 18px 18px; background: linear-gradient(145deg, rgb(255 255 255 / 10%), rgb(0 0 0 / 20%)); }
.detail-art::before { content: ''; position: absolute; inset: 11%; border: 1px solid rgb(255 255 255 / 16%); border-radius: inherit; }
.detail-art span, .detail-art strong { position: relative; z-index: 2; }
.detail-art span { color: var(--gold-light); font-size: .62rem; letter-spacing: .17em; text-transform: uppercase; }
.detail-art strong { max-width: 320px; margin-top: .65rem; font: 400 1.25rem/1.25 Georgia, serif; }

.detail-intro-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: 9vw; }
.detail-intro h2 { font-size: clamp(2.5rem, 4.7vw, 4.2rem); }
.prose > p { margin: 0 0 1.2rem; color: var(--muted); line-height: 1.85; }
.prose aside { display: flex; gap: 1rem; margin-top: 2.2rem; padding: 1.25rem; border-left: 2px solid var(--gold); background: var(--cream); }
.prose aside svg { flex: none; margin-top: .15rem; color: #8b6b38; font-size: 1.35rem; }
.prose aside p { margin: 0; color: #665f56; font-size: .78rem; line-height: 1.65; }
.prose aside strong { display: block; color: var(--navy); }

.indications-section { background: var(--navy); color: #fff; }
.indications-grid { display: grid; grid-template-columns: 1fr .85fr; align-items: center; gap: 8vw; }
.indications-grid h2 { color: #fff; }
.indications-grid > div > p:not(.eyebrow) { max-width: 650px; color: #aebbc3; line-height: 1.75; }
.indications-grid ul { margin: 0; padding: 0; list-style: none; }
.indications-grid li { display: flex; align-items: center; gap: .8rem; padding: 1.15rem 0; border-bottom: 1px solid rgb(255 255 255 / 12%); color: #d5dce1; font-size: .85rem; }
.indications-grid li svg { flex: none; color: var(--gold); }

.planning-section { background: #fff; }
.planning-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 4rem 0 0; padding: 0; background: var(--border); list-style: none; }
.planning-grid li { min-height: 250px; padding: 2rem; background: #fff; }
.planning-grid li > span { color: var(--gold); font: 400 1rem Georgia, serif; }
.planning-grid h3 { margin: 3.2rem 0 .8rem; color: var(--navy); font: 400 1.75rem Georgia, serif; }
.planning-grid p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.65; }

.faq-section { background: var(--cream); }
.faq-grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: 8vw; }
.faq-list details { border-top: 1px solid #cec5b9; }
.faq-list details:last-child { border-bottom: 1px solid #cec5b9; }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.3rem 0; cursor: pointer; list-style: none; color: var(--navy); font: 600 1.05rem Georgia, serif; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { display: grid; flex: none; width: 28px; aspect-ratio: 1; place-items: center; border: 1px solid #b7a993; border-radius: 50%; font: 400 1rem Arial, sans-serif; transition: transform .2s ease; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { margin: 0; padding: 0 3rem 1.3rem 0; color: var(--muted); font-size: .82rem; line-height: 1.7; }

.related-section { background: #fff; }
.related-section h2 { max-width: 700px; }
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 3rem; background: var(--border); }
.related-grid a { position: relative; min-height: 210px; display: flex; flex-direction: column; justify-content: flex-end; padding: 1.6rem; background: #fff; transition: background .2s ease; }
.related-grid a:hover { background: var(--cream); }
.related-grid span { color: #8b6b38; font-size: .6rem; letter-spacing: .12em; text-transform: uppercase; }
.related-grid strong { max-width: 280px; margin-top: .5rem; color: var(--navy); font: 400 1.6rem/1.1 Georgia, serif; }
.related-grid svg { position: absolute; right: 1.4rem; top: 1.4rem; color: var(--gold); }

.detail-cta { background: var(--navy); color: #fff; }
.detail-cta-inner { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4rem; }
.detail-cta h2 { max-width: 780px; color: #fff; }

.hub-hero { padding: 88px 0; background: var(--cream); }
.hub-hero-grid { display: grid; grid-template-columns: 1fr .7fr; align-items: end; gap: 7vw; }
.hub-hero h1 { margin: 0; color: var(--navy); font: 400 clamp(3rem, 6vw, 5.6rem)/1.1 Georgia, serif; letter-spacing: -.03em; }
.hub-hero p:not(.eyebrow) { margin: 0; color: var(--muted); line-height: 1.8; }
.hub-section { padding: 90px 0; }
.hub-section:nth-of-type(even) { background: #fff; }
.hub-section-header { display: grid; grid-template-columns: .65fr 1.35fr; gap: 5rem; margin-bottom: 2.5rem; }
.hub-section h2 { margin: 0; color: var(--navy); font: 400 2.7rem Georgia, serif; }
.hub-section-header p { margin: .5rem 0 0; color: var(--muted); line-height: 1.7; }
.hub-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--border); }
.hub-card { min-height: 250px; display: flex; flex-direction: column; padding: 1.6rem; background: #fff; }
.hub-card:hover { background: var(--cream); }
.hub-card > span { color: #9b7b49; font-size: .62rem; letter-spacing: .13em; text-transform: uppercase; }
.hub-card strong { margin-top: 2.4rem; color: var(--navy); font: 400 1.7rem/1.2 Georgia, serif; }
.hub-card p { margin: .85rem 0 1.25rem; color: var(--muted); font-size: .76rem; line-height: 1.6; }
.hub-card svg { margin-top: auto; color: var(--gold); }

.simple-page { padding: 96px 0; }
.simple-page-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 8vw; }
.simple-page h1 { margin: 0; color: var(--navy); font: 400 clamp(2.5rem, 4vw, 3.5rem)/1.18 Georgia, serif; letter-spacing: -.03em; }
.simple-page .prose h2 { margin: 2.4rem 0 .8rem; color: var(--navy); font: 400 1.8rem Georgia, serif; }
.simple-page .prose ul { padding-left: 1.2rem; color: var(--muted); line-height: 1.8; }
.contact-page { min-height: 650px; background: var(--cream); }
.contact-page-grid { display: grid; grid-template-columns: 1fr .72fr; align-items: center; gap: 8vw; }
.contact-page h1 { margin: 0; color: var(--navy); font: 400 clamp(3rem, 6vw, 5.6rem)/1.1 Georgia, serif; letter-spacing: -.03em; }
.contact-page-grid > div > p:not(.eyebrow) { max-width: 650px; color: var(--muted); line-height: 1.8; }
/* Secondary contact notice: keep the wording legible and separate from the CTA. */
.contact-page-grid > div > .button + p { margin: 1.5rem 0 0; font-size: .9375rem; line-height: 1.65; }
@media (max-width: 720px) {
  .contact-page-grid > div > .button + p { margin-top: 1.25rem; font-size: 1rem; }
}
.contact-page address { display: grid; gap: 1px; background: #cfc5b7; font-style: normal; }
.contact-page address > div { display: flex; gap: 1rem; padding: 1.5rem; background: #fff; }
.contact-page address svg { flex: none; margin-top: .15rem; color: var(--gold); font-size: 1.25rem; }
.contact-page address span { display: flex; flex-direction: column; color: var(--muted); font-size: .8rem; line-height: 1.65; }
.contact-page address strong { margin-bottom: .2rem; color: var(--navy); }

@media (max-width: 1080px) {
  .hero-grid { grid-template-columns: 1fr .7fr; gap: 2rem; }
  .trust-grid { grid-template-columns: 1fr 1fr; }
  .trust-grid > div:nth-child(2) { border-right: 0; }
  .trust-grid > div:nth-child(-n+2) { border-bottom: 1px solid var(--border); }
  .split-heading, .technology-grid { grid-template-columns: 1fr; gap: 2rem; }
  .technology-grid { align-items: start; }
  .category-links { grid-template-columns: 1fr 1fr; }
  .category-links a:nth-child(2) { border-right: 0; }
  .category-links a:nth-child(-n+2) { border-bottom: 1px solid var(--border); }
  .detail-hero-grid { grid-template-columns: 1fr .55fr; }
  .detail-intro-grid, .faq-grid { gap: 4rem; }
  .hub-hero-grid { grid-template-columns: 1fr; align-items: start; }
}

@media (max-width: 720px) {
  html { scroll-padding-top: 9.5rem; }
  .container { width: min(100% - 32px, 1180px); }
  .topbar-inner { height: auto; min-height: 38px; flex-wrap: wrap; gap: .25rem 1rem; padding-block: .5rem; }
  .topbar p { margin: 0; }
  .header-inner { min-height: 136px; gap: .75rem; }
  .brand-logo { width: 120px; }
  .brand-copy strong { font-size: .9rem; }
  .hero, .hero-grid { min-height: auto; }
  .hero-grid { grid-template-columns: 1fr; padding-block: 64px; }
  .hero h1 { font-size: clamp(2.6rem, 12.5vw, 4.3rem); }
  .hero-lead { font-size: .95rem; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .text-link { align-self: flex-start; }
  .hero-proof { flex-direction: column; gap: .7rem; }
  .hero-visual { margin-top: 1rem; }
  .hero-frame, .credential-card { width: min(360px, 100%); }
  .trust-grid { grid-template-columns: 1fr; }
  .trust-grid > div { min-height: 84px; border-right: 0; border-bottom: 1px solid var(--border); }
  .section { padding: 78px 0; }
  .section-heading h2, .section h2 { font-size: 2.65rem; }
  .split-heading, .procedure-grid, .botox-grid, .doctor-grid, .contact-grid, .region-inner { grid-template-columns: 1fr; gap: 3rem; }
  .procedure-grid { margin-top: 3rem; }
  .procedure-card { min-height: 330px; }
  .category-links { grid-template-columns: 1fr; }
  .category-links a { border-right: 0; border-bottom: 1px solid var(--border); }
  .botox-art { min-height: 390px; }
  .doctor-details { grid-template-columns: 1fr; }
  .doctor-grid blockquote { padding: 2.6rem; box-shadow: 14px 14px 0 var(--gold-light); }
  .technology-grid { gap: 2rem; }
  .region-inner ul { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-links { justify-content: flex-start; flex-wrap: wrap; }
  .footer-legal { flex-direction: column; }
  .floating-whatsapp { right: 16px; bottom: 16px; }
  .detail-hero-grid, .detail-intro-grid, .indications-grid, .faq-grid, .detail-cta-inner, .hub-section-header, .simple-page-grid, .contact-page-grid { grid-template-columns: 1fr; gap: 3rem; }
  .detail-hero-grid { min-height: auto; }
  .detail-hero h1 { font-size: clamp(2.4rem, 11vw, 4.2rem); }
  .detail-art { min-height: 300px; }
  .detail-actions { align-items: flex-start; flex-direction: column; }
  .planning-grid, .related-grid, .hub-cards { grid-template-columns: 1fr; }
  .planning-grid li { min-height: 220px; }
  .detail-cta-inner { align-items: start; }
  .hub-hero { padding: 68px 0; }
  .hub-section { padding: 68px 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* Shared editorial scale: body copy at least 16px; compact, readable mobile headings. */
:root { --mauve: #794759; --green: #34584e; }
body { font-size: 16px; }
:focus-visible { outline: 3px solid #1177b5; outline-offset: 4px; }
main { display: block; }
.topbar { font-size: .875rem; letter-spacing: .015em; }
.topbar-inner { height: auto; min-height: 42px; gap: .5rem 1.5rem; padding-block: .5rem; }
.header-inner { min-height: 124px; }
.brand-logo { width: 108px; }
.brand-copy strong { font-size: 1.125rem; line-height: 1.4; }
.desktop-nav, .header-cta { font-size: 1rem; }
.desktop-nav { gap: 1rem; }
.desktop-nav a:hover { color: #745622; text-decoration: underline; text-underline-offset: .3em; }
.hero h1 { font-size: clamp(2.65rem, 4.5vw, 4.25rem); }
.hero-grid { gap: 5vw; }
.section-heading h2, .section h2 { font-size: clamp(2.125rem, 3.7vw, 3.5rem); line-height: 1.18; letter-spacing: -.025em; }
.eyebrow-dark, .procedure-card > p, .hub-card > span, .related-grid span { color: #755422; }
.eyebrow, .procedure-card > p, .hub-card > span, .related-grid span { font-size: .8125rem; letter-spacing: .075em; }
.procedure-card > span, .procedure-card a, .category-links a, .botox-copy li,
.doctor-details strong, .doctor-details span, .contact-grid address span, .contact-grid address strong,
.contact-page address span, .region-inner li, .planning-grid p, .faq-list details p,
.prose aside p, .indications-grid li, .hub-card p { font-size: 1rem; }
.procedure-card > p { margin-top: 3rem; }
.procedure-number, .planning-grid li > span { color: #755422; }
.trust-grid span { font-size: 1rem; }
.doctor-details span { color: #58544d; }
.breadcrumbs { color: #e5eaf0; font-size: .9375rem; line-height: 1.6; }
.breadcrumbs a, .contact-grid address a { text-decoration: underline; text-underline-offset: .3em; }
.detail-actions > span { color: #f0f2f4; font-size: .9375rem; line-height: 1.7; }
.detail-hero-grid > div:first-child > p:not(.eyebrow) { color: #e3e9ed; font-size: 1.125rem; }
.detail-hero h1 { font-size: clamp(2.375rem, 4.5vw, 4.4rem); line-height: 1.14; }
.detail-intro h2 { font-size: clamp(2.125rem, 3.5vw, 3.2rem); }
.faq-list summary { font: 600 1.125rem/1.6 Arial, Helvetica, sans-serif; }
.faq-list details p { padding-right: 1rem; }
.hub-card { min-height: 275px; }
.hub-card strong { margin-top: 1.5rem; font-size: 1.75rem; }
.hub-card h3 { margin: 1.5rem 0 0; color: var(--navy); font: 400 1.75rem/1.25 Georgia, serif; }
.portrait-profile { margin-bottom: 2rem; width: min(440px, 100%); }
.hub-card .card-action { display: flex; align-items: center; gap: .6rem; margin-top: auto; color: var(--navy); font-size: 1rem; font-weight: 700; letter-spacing: 0; text-transform: none; }
.hub-card .card-action svg { margin-top: 0; }
.hub-card:hover .card-action { text-decoration: underline; text-underline-offset: .3em; }
.floating-whatsapp { width: 58px; font-size: 1.85rem; background: #08764c; bottom: max(20px, env(safe-area-inset-bottom)); }
.floating-whatsapp:hover, .floating-whatsapp:focus { background: #065e3d; color: #fff; }
body.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .site-header { top: 46px; } }
@media (max-width: 600px) { body.admin-bar .site-header { top: 0; } }
.footer-legal { padding-bottom: 4rem; }
.footer-links a:hover { text-decoration: underline; text-underline-offset: .3em; }
.doctor-portrait { margin: 0; max-width: 450px; overflow: hidden; border-radius: 180px 180px 14px 14px; border: 1px solid #83909a; background: #e3ded8; }
.doctor-portrait img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; }
.doctor-portrait figcaption { padding: 1rem 1.2rem; background: #102a3e; color: #edf2f6; font-size: .9375rem; line-height: 1.6; }
.hero-visual .doctor-portrait, .hero-visual .credential-card { width: min(420px, 100%); }
/* The portrait caption is the single visible identification in the home hero.
   Hide the retired badge in previously imported editorial content as well. */
.hero-visual > .credential-card { display: none; }
.doctor-principles { padding: 2.25rem; background: var(--navy); color: #e3eaf0; border-left: 4px solid var(--gold); }
.doctor-principles h3 { margin: 0 0 1.4rem; color: white; font: 400 2rem/1.3 Georgia, serif; }
.doctor-principles > p:not(.eyebrow) { font-size: 1.0625rem; line-height: 1.8; }
.medical-figure { margin: 0; overflow: hidden; border: 1px solid #c3b9a9; border-radius: 12px; background: #f6f1e8; }
.medical-figure img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.medical-figure figcaption { padding: .85rem 1rem; color: #4f473d; background: #f6f1e8; font-size: .875rem; line-height: 1.6; }
.detail-hero-grid .medical-figure { align-self: center; }
.detail-hero-grid.no-art { grid-template-columns: 1fr; max-width: 980px; }
.procedure-hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); grid-template-areas: "copy visual" "actions visual"; row-gap: 1.6rem; }
.procedure-hero-copy { grid-area: copy; align-self: end; }
.procedure-hero-actions { grid-area: actions; align-self: start; margin-top: 0; }
.procedure-hero-grid > .procedure-visual { grid-area: visual; }
.procedure-hero-grid.no-art { grid-template-areas: "copy" "actions"; }
.procedure-visual img { object-fit: contain; background: #f6f1e8; }
.procedure-visual figcaption { display: grid; gap: .45rem; padding: 1rem 1.15rem; }
.procedure-visual .visual-kicker { color: #755422; font: 700 .8125rem/1.5 Arial, Helvetica, sans-serif; letter-spacing: .07em; text-transform: uppercase; }
.procedure-visual figcaption strong { color: #102a3e; font: 700 1.125rem/1.4 Arial, Helvetica, sans-serif; }
.procedure-visual .visual-detail { color: #4f473d; font-size: 1rem; line-height: 1.6; }
.procedure-visual figcaption small { display: block; color: #554c41; margin-top: .3rem; font-size: .875rem; line-height: 1.6; border-top: 1px solid #d9d0c2; padding-top: .7rem; }
@media (max-width: 960px) {
  .procedure-hero-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy" "visual" "actions"; }
  .procedure-hero-grid > .procedure-visual { width: 100%; max-width: 640px; justify-self: center; }
}
.botox-page-link { display: flex; width: fit-content; margin-top: 1.4rem; }
.prose a:not(.button) { color: #234e72; text-decoration: underline; text-underline-offset: .2em; }
.medical-risks { margin-top: 2rem; padding: 1.5rem; border: 1px solid #cec0ad; background: #fbf7ef; }
.medical-risks h3 { margin: 0 0 .75rem; font: 600 1.25rem/1.5 Arial, sans-serif; color: var(--navy); }
.medical-risks ul { margin: 0; padding-left: 1.25rem; color: #4a5158; line-height: 1.8; }
.editorial-sources { margin-top: 2rem; border-top: 1px solid var(--border); padding-top: 1rem; }
.editorial-sources summary { cursor: pointer; min-height: 44px; color: #344f65; }
.editorial-sources li { margin: .6rem 0; }
.page-directory { padding-left: 1.5rem; }
.page-directory li { margin-block: .9rem; }
.page-directory a { color: #234e72; text-decoration: underline; text-underline-offset: .2em; }
@media (max-width: 720px) {
  html { scroll-padding-top: 8.5rem; }
  .header-inner { min-height: 108px; gap: .5rem; }
  .brand-logo { width: 88px; }
  .brand-copy { gap: .2rem; }
  .brand-copy strong { font-size: 1rem; }
  .brand-copy small { font-size: .75rem; letter-spacing: .03em; }
  .topbar { font-size: .8125rem; }
  .topbar-inner { flex-wrap: wrap; }
  .hero-grid, .detail-hero-grid { padding-block: 48px; }
  .procedure-hero-grid { grid-template-areas: "copy" "visual" "actions"; row-gap: 1.6rem; }
  .procedure-hero-grid.no-art { grid-template-areas: "copy" "actions"; }
  .hero h1 { font-size: clamp(2.5rem, 10.8vw, 3.4rem); }
  .hero-lead { font-size: 1.0625rem; }
  .hero-proof { font-size: 1rem; }
  .section { padding-block: 60px; }
  .section-heading h2, .section h2, .detail-intro h2 { font-size: clamp(2rem, 8.7vw, 2.375rem); line-height: 1.22; letter-spacing: -.025em; }
  .detail-hero h1, .hub-hero h1, .simple-page h1, .contact-page h1 { font-size: clamp(2.25rem, 10vw, 3rem); line-height: 1.16; }
  .detail-actions > span { font-size: .9375rem; }
  .credential-card small { font-size: .875rem; }
  .hero-visual .doctor-portrait { max-width: 380px; }
  .doctor-principles { padding: 1.7rem; }
  .hub-card { min-height: 240px; }
  .hub-card p { line-height: 1.75; }
  .hub-section, .simple-page { padding-block: 56px; }
  .hub-hero { padding-block: 48px; }
  .hub-section h2 { font-size: 2rem; }
  .region-inner h2 { font-size: 2.125rem; }
  .footer-legal { gap: 1rem; }
}

/* Presentation-only fix: use the existing canonical/links to scope the long
   name without rewriting stored pages. Keep emergency wrapping for text zoom. */
html:has(link[rel="canonical"][href*="/lipoabdominoplastia-araraquara"]) .detail-hero h1 { font-size: clamp(1.75rem, 3.5vw, 3.75rem); text-wrap: balance; }
html:has(link[rel="canonical"][href*="/lipoabdominoplastia-araraquara"]) #faq-title { font-size: 1.625rem; text-wrap: balance; }
.procedure-card[href*="/lipoabdominoplastia-araraquara"] h3,
.procedure-card:has(a[href*="/lipoabdominoplastia-araraquara"]) h3,
.hub-card[href*="/lipoabdominoplastia-araraquara"] h3,
.related-grid a[href*="/lipoabdominoplastia-araraquara"] strong { font-size: 1.25rem; text-wrap: balance; }
@supports (font-size: 1cqi) and selector(:has(a)) {
  html:has(link[rel="canonical"][href*="/lipoabdominoplastia-araraquara"]) .procedure-hero-copy,
  html:has(link[rel="canonical"][href*="/lipoabdominoplastia-araraquara"]) .faq-grid > div:first-child,
  .procedure-card[href*="/lipoabdominoplastia-araraquara"],
  .procedure-card:has(a[href*="/lipoabdominoplastia-araraquara"]),
  .hub-card[href*="/lipoabdominoplastia-araraquara"],
  .related-grid a[href*="/lipoabdominoplastia-araraquara"],
  .detail-art { container-type: inline-size; }
  html:has(link[rel="canonical"][href*="/lipoabdominoplastia-araraquara"]) .detail-hero h1 { font-size: min(clamp(1.75rem, 9.5cqi, 4.4rem), clamp(2.375rem, 4.5vw, 4.4rem)); }
  html:has(link[rel="canonical"][href*="/lipoabdominoplastia-araraquara"]) #faq-title { font-size: clamp(1.625rem, 9.5cqi, 3.2rem); }
  .procedure-card[href*="/lipoabdominoplastia-araraquara"] h3,
  .procedure-card:has(a[href*="/lipoabdominoplastia-araraquara"]) h3 { font-size: min(clamp(1.25rem, 9.5cqi, 2.1rem), clamp(1.75rem, 2.2vw, 2.1rem)); }
  .hub-card[href*="/lipoabdominoplastia-araraquara"] h3 { font-size: clamp(1.25rem, 9.5cqi, 1.75rem); }
  .related-grid a[href*="/lipoabdominoplastia-araraquara"] strong { font-size: clamp(1.25rem, 9.5cqi, 1.6rem); }
  .detail-art strong { font-size: clamp(1rem, 9.5cqi, 2.25rem); }
  @media (max-width: 720px) {
    html:has(link[rel="canonical"][href*="/lipoabdominoplastia-araraquara"]) .detail-hero h1 { font-size: min(clamp(1.75rem, 9.5cqi, 4.4rem), clamp(2.25rem, 10vw, 3rem)); }
    html:has(link[rel="canonical"][href*="/lipoabdominoplastia-araraquara"]) #faq-title { font-size: min(clamp(1.625rem, 9.5cqi, 3.2rem), clamp(2rem, 8.7vw, 2.375rem)); }
  }
}

/* Keep decorative outlines and text on the same spacing system. The inset
   must not be a percentage of a different dimension than the text padding. */
.detail-art {
  --art-inset: 1.25rem;
  --art-text-gap: 1rem;
  padding: calc(var(--art-inset) + var(--art-text-gap));
}
.detail-art::before { inset: var(--art-inset); pointer-events: none; }
.detail-art span, .detail-art strong { min-width: 0; max-width: 100%; }
.detail-art span { font-size: .75rem; line-height: 1.5; letter-spacing: .08em; }
.detail-art strong { line-height: 1.25; text-wrap: balance; }

/* Cards need readable columns at intermediate widths, not only on phones. */
.procedure-grid, .planning-grid, .related-grid {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
}

/* Category navigation: native disclosure for keyboard/touch; small shared
   enhancement adds pointer hover, outside-click dismissal and Escape. */
.nav-dropdown { position: relative; }
.nav-dropdown > summary, .mobile-surgery-menu > summary {
  display: flex; align-items: center; justify-content: space-between; gap: .35rem;
  min-height: 44px; cursor: pointer; list-style: none; color: var(--navy);
}
.nav-dropdown > summary::-webkit-details-marker,
.mobile-surgery-menu > summary::-webkit-details-marker { display: none; }
.nav-dropdown > summary:hover { color: #745622; }
.nav-dropdown > summary svg, .mobile-surgery-menu > summary svg { flex-shrink: 0; transition: transform .15s ease; }
.nav-dropdown[open] > summary svg, .mobile-surgery-menu[open] > summary svg { transform: rotate(180deg); }
.surgery-submenu { display: grid; }
.desktop-nav .surgery-submenu {
  position: absolute; top: 100%; left: -1rem; width: 300px; padding: .65rem;
  border: 1px solid var(--border); border-radius: 12px;
  background: #fff; box-shadow: 0 16px 40px rgb(7 29 48 / 14%);
}
.desktop-nav .surgery-submenu a { min-height: 44px; padding: .7rem .8rem; border-radius: 6px; line-height: 1.45; }
.desktop-nav .surgery-submenu a:hover, .desktop-nav .surgery-submenu a:focus-visible { background: var(--cream); color: var(--navy); }
.surgery-submenu a:last-child { border-top: 1px solid var(--border); font-weight: 700; }
.mobile-surgery-menu { border-bottom: 1px solid #ece8e1; }
.mobile-surgery-menu > summary { padding: .8rem; font-size: 1rem; }
.mobile-surgery-menu .surgery-submenu { margin: 0 .2rem .6rem; padding: .3rem .3rem .3rem .5rem; border-left: 2px solid var(--gold); background: var(--cream); }
.mobile-surgery-menu .surgery-submenu a { display: flex; align-items: center; min-height: 44px; line-height: 1.5; }

/* Balanced rows, not a painted rectangle with empty cells. A six-track grid
   gives three cards per row; a remainder of one is rebalanced into 2 + 2. */
.hub-cards { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; background: transparent; }
.hub-cards > .hub-card { grid-column: span 2; min-width: 0; border: 1px solid var(--border); border-radius: 10px; }
.hub-cards > .hub-card:nth-last-child(2):nth-child(3n + 1),
.hub-cards > .hub-card:last-child:nth-child(3n + 2),
.hub-cards:has(> .hub-card:last-child:nth-child(3n + 1)) > .hub-card:nth-last-child(-n + 4) { grid-column: span 3; }
.hub-cards > .hub-card:only-child { grid-column: 1 / -1; width: min(100%, 760px); justify-self: center; }
@media (min-width: 721px) and (max-width: 1024px) {
  .hub-cards > .hub-card:nth-child(n) { grid-column: span 3; }
  .hub-cards > .hub-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .hub-cards { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .hub-cards > .hub-card:nth-child(n) { grid-column: 1; }
}
@media (max-width: 360px) {
  .hub-cards > .hub-card { padding-inline: 1.25rem; }
  .hub-card h3 { font-size: 1.5rem; }
}
.procedure-card h3, .planning-grid h3, .related-grid strong, .hub-card h3,
.hub-section-header h2, .simple-page h1, .region-inner h2 { text-wrap: balance; }
.planning-grid h3 { line-height: 1.25; }
@media (max-width: 1080px) {
  .hub-section-header, .simple-page-grid, .region-inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.5rem;
  }
}
@media (max-width: 720px) {
  .procedure-grid, .planning-grid, .related-grid, .hub-cards { grid-template-columns: minmax(0, 1fr); }
  .planning-grid li { padding-inline: 1.25rem; }
}

/* The profile introduction and portrait share one balanced opening. Longer
   professional information follows below, in a centered reading column. */
.doctor-profile { padding-block: 80px; }
.doctor-profile-hero { max-width: 1080px; display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; gap: clamp(32px, 5vw, 72px); }
.doctor-profile h1 { margin: 0; color: var(--navy); font: 400 clamp(2.5rem, 4vw, 3.5rem)/1.18 Georgia, serif; letter-spacing: -.03em; text-wrap: balance; }
.doctor-profile-copy > p:not(.eyebrow) { margin: 1.5rem 0 0; color: var(--muted); line-height: 1.85; }
.doctor-profile .portrait-profile { width: 100%; max-width: 420px; margin: 0; justify-self: center; }
.doctor-profile-body { max-width: 760px; margin-top: 64px; padding-top: 48px; border-top: 1px solid var(--border); }
.doctor-profile-body h2 { margin: 2.4rem 0 .8rem; color: var(--navy); font: 400 1.8rem/1.3 Georgia, serif; text-wrap: balance; }
.doctor-profile-body h2:first-child { margin-top: 0; }
.doctor-profile-body ul { padding-left: 1.2rem; color: var(--muted); line-height: 1.8; }
@media (max-width: 960px) {
  .doctor-profile { padding-block: 56px; }
  .doctor-profile-hero { max-width: 680px; grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .doctor-profile-copy { text-align: center; }
  .doctor-profile-copy .eyebrow { justify-content: center; }
}

/* Center presentation on phones, without centering continuous reading,
   medical risk information, FAQ answers, or navigation/menu items. */
@media (max-width: 720px) {
  .hero-copy, .procedure-hero-copy, .hub-hero-grid, .hub-section-header,
  .simple-page-grid > div:first-child, .section-heading,
  .detail-intro-grid > div:first-child, .indications-grid > div:first-child,
  .faq-grid > div:first-child, .detail-cta-inner, .related-section > .container > h2,
  .related-section > .container > .eyebrow, .contact-grid > div,
  .contact-page-grid > div, .technology-grid > div, .technology-grid > p,
  .region-inner > div, .botox-copy > h2, .doctor-copy > h2,
  .doctor-principles > h3 { text-align: center; }
  .hero-copy .eyebrow, .procedure-hero-copy .eyebrow, .hub-hero .eyebrow,
  .simple-page-grid > div:first-child .eyebrow, .section-heading .eyebrow,
  .detail-intro-grid > div:first-child .eyebrow, .indications-grid > div:first-child .eyebrow,
  .faq-grid > div:first-child .eyebrow, .detail-cta .eyebrow, .related-section .eyebrow,
  .contact-grid .eyebrow, .contact-page-grid .eyebrow, .technology-grid .eyebrow,
  .region-inner .eyebrow, .botox-copy .eyebrow, .doctor-copy .eyebrow,
  .doctor-principles .eyebrow { justify-content: center; }
  .topbar-inner { align-items: center; justify-content: center; text-align: center; }
  .hero-actions { align-items: center; }
  .hero-actions > .text-link { align-self: center; }
  .doctor-details { text-align: center; }
  .hero-actions, .hero-proof, .breadcrumbs, .doctor-details { justify-content: center; }
  .detail-actions { align-items: center; justify-content: center; text-align: center; }
  .detail-actions > span { justify-content: center; }
  .hero-proof li { justify-content: center; }
  .section-heading h2, .related-section h2, .detail-cta h2 { margin-inline: auto; }
  .procedure-card, .hub-card { text-align: center; }
  .procedure-card > a { align-self: center; }
  .hub-card .card-action { justify-content: center; }
  .related-grid a { align-items: center; text-align: center; }
  .category-links a { justify-content: center; gap: 1rem; text-align: center; }
  .botox-copy > .button, .botox-copy > .text-link,
  .doctor-copy > .text-link, .doctor-principles > .text-link { display: flex; width: fit-content; max-width: 100%; margin-inline: auto; text-align: center; }
  .technology-grid > .button, .detail-cta-inner > .button { justify-self: center; }
  .doctor-portrait figcaption, .region-inner li { text-align: center; }
  .contact-grid address > div, .contact-page address > div { flex-direction: column; align-items: center; text-align: center; }
  .contact-grid address span, .contact-page address span { align-items: center; }
  .footer-grid { text-align: center; }
  .brand-footer, .footer-links { justify-content: center; }
  .footer-legal { align-items: center; text-align: center; }
  .doctor-profile { padding-block: 48px; }
  .doctor-profile h1 { font-size: clamp(2.25rem, 10vw, 3rem); }
  .doctor-profile .portrait-profile { max-width: 360px; }
  .doctor-profile-body { margin-top: 40px; padding-top: 32px; }
  .doctor-profile-body h2 { text-align: center; }
}

/* Continuous reading belongs below its heading, not in a long side column.
   Keep paragraphs, clinical cautions and answers left-aligned for scanning. */
.detail-intro-grid, .faq-grid, .simple-page-grid {
  max-width: 800px; grid-template-columns: minmax(0, 1fr); gap: 2.5rem;
}
.detail-intro-grid > div:first-child, .faq-grid > div:first-child,
.simple-page-grid > div:first-child { text-align: center; }
.detail-intro-grid .eyebrow, .faq-grid .eyebrow, .simple-page-grid .eyebrow { justify-content: center; }
.detail-intro-grid > .prose, .simple-page-grid > .prose, .faq-list { min-width: 0; text-align: left; }
.detail-intro-grid h2, .faq-grid h2, .simple-page-grid h1 { max-width: 760px; margin-inline: auto; text-wrap: balance; }
.indications-grid { max-width: 860px; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
.indications-grid > div { text-align: center; }
.indications-grid .eyebrow { justify-content: center; }
.indications-grid > div > p:not(.eyebrow) { margin-inline: auto; }
.indications-grid > ul { width: 100%; max-width: 760px; justify-self: center; text-align: left; }
.indications-grid li { align-items: flex-start; }
.indications-grid li svg { margin-top: .35em; }

/* Text-only openings and section headings follow a centered reading axis.
   Photo-led openings and compact contact sections retain their balanced pairs. */
.hub-hero-grid { max-width: 900px; grid-template-columns: minmax(0, 1fr); gap: 1.75rem; text-align: center; }
.hub-hero .eyebrow { justify-content: center; }
.hub-hero-grid > p:not(.eyebrow) { max-width: 760px; margin-inline: auto; }
.hub-section-header { max-width: 800px; margin-inline: auto; grid-template-columns: minmax(0, 1fr); gap: 1rem; text-align: center; }
.planning-section .section-heading, .procedures .section-heading {
  max-width: 800px; margin-inline: auto; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; text-align: center;
}
.planning-section .section-heading .eyebrow, .procedures .section-heading .eyebrow,
.related-section > .container > .eyebrow { justify-content: center; }
.related-section > .container > h2 { max-width: 800px; margin-inline: auto; text-align: center; }

/* Collapse unused tracks in all remaining card families. Individual borders
   replace the full-grid fill, so a missing fourth item never paints a block. */
.procedure-grid, .planning-grid, .related-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  gap: 20px; border: 0; background: transparent;
}
.procedure-grid > .procedure-card, .planning-grid > li, .related-grid > a {
  min-width: 0; border: 1px solid var(--border); border-radius: 10px;
}
.related-grid { max-width: 1040px; margin-inline: auto; }
.related-grid a { min-height: 180px; padding-top: 3.25rem; }
.related-grid strong { max-width: 100%; line-height: 1.25; }
/* Real photographs and clinic context support, rather than replace, the physician. */
.care-heading { max-width: 800px; margin-inline: auto; text-align: center; }
.care-heading .eyebrow { justify-content: center; }
.care-heading h1 { margin: 0; color: var(--navy); font: 400 clamp(2.375rem, 4.5vw, 4rem)/1.15 Georgia, serif; letter-spacing: -.025em; text-wrap: balance; }
.care-heading h2, .clinic-section-copy h2 { margin: 0; color: var(--navy); font: 400 clamp(2rem, 3.2vw, 2.9rem)/1.2 Georgia, serif; text-wrap: balance; }
.care-heading > p:not(.eyebrow), .clinic-section-copy > p:not(.eyebrow) { margin: 1.4rem 0 0; color: var(--muted); font-size: 1.0625rem; line-height: 1.8; }
.care-heading > .text-link, .care-heading > .button { margin-top: 1.6rem; }
.clinic-care-summary, .clinic-surgical-section, .clinic-journey, .contact-next { background: #f2eee6; }
.care-feature-grid, .care-journey-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 40px 0 0; padding: 0; list-style: none; }
.care-feature-grid > div, .care-journey-grid > li { min-width: 0; border: 1px solid #d6cec0; border-radius: 12px; padding: 28px; background: #fff; }
.care-feature-grid svg { width: 28px; height: 28px; color: #80622f; margin-bottom: 18px; }
.care-feature-grid h3, .care-journey-grid h3 { margin: 0; color: var(--navy); font: 400 1.5rem/1.25 Georgia, serif; text-wrap: balance; }
.care-feature-grid p, .care-journey-grid p { margin: 1rem 0 0; color: var(--muted); font-size: 1rem; line-height: 1.75; }
.care-section-action { margin-top: 32px; text-align: center; }
.care-step { display: block; color: #755422; font-size: .9375rem; font-weight: 700; margin-bottom: 1rem; }
.clinic-photo { margin: 0; width: 100%; max-width: 420px; justify-self: center; overflow: hidden; border: 1px solid #c5bbad; border-radius: 20px; background: #102a3e; }
.clinic-photo img { display: block; width: 100%; height: auto; }
.clinic-photo-consultorio img { aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 40%; }
.clinic-photo figcaption { padding: 1rem 1.25rem; color: #f3f5f6; font-size: .9375rem; line-height: 1.6; }
.clinic-photo-grid { max-width: 1040px; display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.clinic-photo-grid .clinic-photo { max-width: 350px; }
.clinic-section-copy { min-width: 0; }
.clinic-section-copy a { color: #234e69; text-decoration: underline; text-underline-offset: .2em; }
.procedure-grid > a.procedure-card { color: var(--navy); text-decoration: none; cursor: pointer; }
.procedure-card > .card-action { display: inline-flex; align-items: center; align-self: flex-start; gap: .5rem; margin-top: auto; padding-top: 1.75rem; color: var(--navy); font-size: 1rem; font-weight: 700; }
.procedure-card:focus-visible { outline: 3px solid #80622f; outline-offset: 4px; background: var(--cream); }
.procedure-card:hover .card-action, .procedure-card:focus-visible .card-action { text-decoration: underline; text-underline-offset: .25em; }
/* Collapse according to the space actually available to the header, including
   narrow previews. The compact menu remains usable without container support. */
.desktop-nav { gap: .85rem; }
@container site-navigation (min-width: 73rem) {
  .desktop-nav, .header-cta { display: inline-flex; }
  .mobile-menu-wrap { display: none; }
  .brand { flex: 0 0 auto; }
  .brand-copy strong, .brand-copy small { white-space: nowrap; overflow-wrap: normal; }
}
@media (max-width: 960px) {
  .care-feature-grid { grid-template-columns: minmax(0, 1fr); max-width: 680px; margin-inline: auto; }
  .care-journey-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .clinic-photo-grid { grid-template-columns: minmax(0, 1fr); max-width: 760px; }
  .clinic-section-copy h2, .clinic-section-copy .eyebrow { text-align: center; justify-content: center; }
}
@media (max-width: 720px) {
  .care-journey-grid { grid-template-columns: minmax(0, 1fr); }
  .care-feature-grid h3, .care-journey-grid h3, .care-step { text-align: center; }
  .care-feature-grid svg { display: block; margin-inline: auto; }
  .clinic-photo { max-width: 360px; }
  .clinic-photo figcaption { text-align: center; }
  .procedure-card > .card-action { align-self: center; }
}
@media (prefers-reduced-motion: reduce) { .procedure-card { transition: none; } .procedure-card:hover { transform: none; } }
@media (min-width: 721px) and (max-width: 1024px) {
  .procedure-grid, .planning-grid, .related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .procedure-grid > :last-child:nth-child(odd), .planning-grid > :last-child:nth-child(odd),
  .related-grid > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .procedure-grid, .planning-grid, .related-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .detail-intro-grid, .faq-grid, .simple-page-grid { gap: 2rem; }
}