:root { --green:#1f6965; --green-dark:#15534f; --cream:#faf7f0; --ink:#183a39; --coral:#e88370; --line:#dbe6df; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:"DM Sans", sans-serif; line-height:1.6; }
.header { height:80px; padding:0 clamp(24px, 7vw, 110px); background:#fffdfa; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:5; box-shadow:0 1px 12px #183a3909; }
.brand { color:var(--green); font-family:"Playfair Display",serif; font-size:1.05rem; text-decoration:none; line-height:1.1; max-width:175px; }
.brand span { display:block; font-size:1.25rem; }
.nav { display:flex; gap:30px; }
.nav a { color:var(--ink); font-size:.92rem; text-decoration:none; }
.nav a:hover, .text-link:hover { color:var(--coral); }
.menu-button { display:none; background:none; border:0; font-size:1.5rem; color:var(--green); cursor:pointer; }
.hero { min-height:560px; display:grid; grid-template-columns:1.1fr .9fr; overflow:hidden; }
.hero-copy { padding:clamp(70px, 11vw, 150px) clamp(24px, 10vw, 160px); background:#fffdfa; }
.eyebrow { margin:0 0 13px; color:var(--coral); letter-spacing:.16em; font-weight:700; font-size:.7rem; }
h1,h2,h3 { font-family:"Playfair Display",serif; line-height:1.12; }
h1 { margin:0; font-size:clamp(2.6rem, 4.6vw, 4.65rem); color:var(--green); letter-spacing:-.04em; }
h1 em { color:var(--coral); font-weight:600; }
.intro { max-width:470px; margin:25px 0 30px; font-size:1.04rem; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:25px; }
.button { display:inline-block; padding:13px 23px; border-radius:3px; background:var(--green); color:white; text-decoration:none; font-weight:700; font-size:.9rem; transition:.2s; }
.button:hover { transform:translateY(-2px); background:var(--green-dark); }
.text-link { color:var(--green); text-decoration:none; font-weight:700; font-size:.9rem; }.text-link span { font-size:1.2rem; margin-left:4px; }
.hero-art { background:#dceee6; position:relative; overflow:hidden; min-height:380px; display:flex; align-items:flex-end; justify-content:center; }
.hero-art:before,.hero-art:after { content:""; position:absolute; border-radius:50%; border:1px solid #a9cfc1; width:440px; height:440px; }.hero-art:before { top:-140px; right:-190px; }.hero-art:after { bottom:-300px; left:-200px; }
.sun { position:absolute; width:85px; height:85px; border-radius:50%; background:#f6bd72; top:18%; right:22%; }
.tooth { width:230px; height:280px; background:#fffdfa; border-radius:45% 45% 38% 38% / 42% 42% 62% 62%; position:relative; transform:rotate(2deg); box-shadow:12px 17px 0 #c7e2d6; z-index:1; margin-bottom:-45px; }
.tooth:before,.tooth:after { content:""; position:absolute; width:66px; height:135px; background:#fffdfa; bottom:-70px; border-radius:0 0 60px 60px; }.tooth:before { left:29px; transform:rotate(22deg); }.tooth:after { right:29px; transform:rotate(-22deg); }.tooth span { position:absolute; width:12px; height:12px; border-radius:50%; background:#e88370; top:96px; left:75px; }.tooth i { position:absolute; width:12px; height:12px; border-radius:50%; background:#e88370; top:96px; right:75px; }
.hero-art p { position:absolute; z-index:2; bottom:30px; right:30px; color:var(--green); font-family:"Playfair Display",serif; font-size:1.35rem; line-height:1.2; }
.welcome { max-width:850px; margin:auto; padding:100px 24px; text-align:center; }.welcome h2,.section-heading h2,.appointment h2 { margin:0; font-size:clamp(2rem, 3vw, 3.15rem); color:var(--green); letter-spacing:-.03em; }.welcome > p:last-child { max-width:680px; margin:24px auto 0; }
.services { padding:88px clamp(24px, 9vw, 145px); background:#edf5f0; }.section-heading { text-align:center; margin-bottom:40px; }.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.service-card { background:#fffdfa; padding:32px 28px; border-radius:5px; }.icon { color:var(--coral); font-size:1.8rem; height:45px; }.service-card h3 { color:var(--green); font-size:1.42rem; margin:8px 0; }.service-card p { margin:0; font-size:.94rem; }
.appointment { display:grid; grid-template-columns:1fr 1fr; gap:70px; padding:92px clamp(24px, 11vw, 175px); background:var(--green); color:#eff9f2; }.appointment h2 { color:white; max-width:460px; }.appointment > div > p:not(.eyebrow) { margin:18px 0 28px; }.light { background:#f7c67b; color:var(--ink); }.light:hover { background:#ffe0a6; }.appointment address { font-style:normal; border-left:1px solid #80aaa2; padding-left:38px; }.appointment address div { margin-bottom:21px; }.appointment strong { display:block; color:#f7c67b; font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; }.appointment a,.appointment span { display:block; color:white; text-decoration:none; font-size:.96rem; }
footer { padding:23px; text-align:center; background:#123f3c; color:#c5dbd4; font-size:.8rem; }
@media (max-width:760px) { .header { height:68px; }.menu-button { display:block; }.nav { display:none; position:absolute; top:68px; left:0; right:0; padding:20px 24px; background:#fffdfa; flex-direction:column; gap:15px; box-shadow:0 7px 10px #00000010; }.nav.open { display:flex; }.hero { grid-template-columns:1fr; }.hero-copy { padding:75px 26px; }.hero-art { min-height:350px; }.welcome { padding:75px 24px; }.services { padding:70px 24px; }.service-grid,.appointment { grid-template-columns:1fr; }.appointment { padding:70px 26px; gap:42px; }.appointment address { padding-left:22px; }.tooth { transform:scale(.85); margin-bottom:-60px; } }

.photo-hero img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:center; z-index:0; }
.photo-hero:after { content:""; position:absolute; inset:0; background:linear-gradient(135deg, #1f696555, transparent 58%); z-index:1; }
.photo-hero .sun { z-index:2; opacity:.9; }
.photo-hero p { color:white; text-shadow:0 2px 8px #183a3999; }
.gallery { padding:0 clamp(24px, 9vw, 145px) 90px; display:grid; grid-template-columns:1.1fr .8fr 1fr; grid-template-rows:220px 220px; gap:18px; align-items:center; }
.gallery figure { margin:0; overflow:hidden; border-radius:5px; }
.gallery img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.gallery figure:hover img { transform:scale(1.04); }
.gallery-main { grid-row:span 2; height:458px; }
.gallery-side { height:220px; }
.gallery-copy { padding:20px 8px 20px 20px; }
.gallery-copy h2 { color:var(--green); font-size:clamp(1.8rem, 2.6vw, 2.65rem); line-height:1.1; margin:0 0 15px; }
.gallery-copy p:last-child { font-size:.94rem; }
@media (max-width:760px) { .gallery { display:flex; flex-direction:column; padding:0 24px 70px; align-items:stretch; } .gallery-main,.gallery-side { height:280px; } .gallery-copy { padding:15px 0; } }

/* Galería: dos fotografías alineadas */
.gallery { grid-template-columns:repeat(2, minmax(0, 1fr)); grid-template-rows:auto auto; }
.gallery-main, .gallery-side { grid-row:auto; height:330px; }
.gallery-copy { grid-column:1 / -1; max-width:650px; margin:auto; padding:18px 10px 0; text-align:center; }
@media (max-width:760px) { .gallery-main, .gallery-side { height:280px; } }

/* Mostrar las fotos inferiores completas, sin recortes */
.gallery figure { display:flex; align-items:center; justify-content:center; background:#edf5f0; }
.gallery img { object-fit:contain; }
