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

:root {
  --blue: #07518a;
  --blue-dark: #043b66;
  --yellow: #ffc400;
  --red: #e83b32;
  --green: #4f963d;
  --cream: #fffaf0;
  --text: #17324a;
}

html { scroll-behavior: smooth; }
body { font-family: "Montserrat", sans-serif; color: var(--text); background: var(--cream); line-height: 1.6; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.container { width: min(1180px, calc(100% - 40px)); margin: auto; }

.header {
  position: fixed; inset: 0 0 auto; z-index: 20;
  background: rgba(255,255,255,.94); backdrop-filter: blur(12px);
  box-shadow: 0 2px 18px rgba(0,0,0,.08);
}
.nav { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.logo { display: flex; align-items: center; gap: 10px; color: var(--blue); }
.logo-sun { font-size: 38px; line-height: 1; }
.logo small { display: block; font-size: 10px; font-weight: 800; letter-spacing: 2px; }
.logo strong { display: block; font-family: "Kalam", cursive; font-size: 27px; line-height: .9; }
.menu { display: flex; align-items: center; gap: 28px; font-weight: 600; font-size: 14px; }
.menu a:not(.btn) { position: relative; padding: 8px 0; }
.menu a:not(.btn)::after { content:""; position:absolute; left:0; bottom:0; width:0; height:3px; background:var(--yellow); transition:.25s; }
.menu a:not(.btn):hover::after { width:100%; }
.menu-toggle { display:none; border:0; background:none; font-size:28px; cursor:pointer; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 13px 24px; border-radius: 999px; font-weight: 800; font-size: 13px;
  transition: transform .2s, box-shadow .2s;
}
.btn:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.btn-yellow { background: var(--yellow); color: #18334a; }

.hero {
  min-height: 760px; position: relative; display:flex; align-items:center;
  background: url("../img/hero.jpg") center/cover no-repeat;
}
.hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg, rgba(3,35,59,.72), rgba(3,35,59,.1) 70%); }
.hero-content { position:relative; color:white; padding-top:80px; }
.eyebrow, .section-kicker { font-size:12px; font-weight:800; letter-spacing:2px; margin-bottom:14px; }
.hero h1 { text-transform:uppercase; font-size:clamp(48px,7vw,88px); line-height:.88; letter-spacing:-3px; }
.hero h1 span { font-family:"Kalam", cursive; text-transform:none; font-weight:700; color:var(--yellow); letter-spacing:0; }
.hero-subtitle { font-family:"Kalam", cursive; font-size:30px; margin:22px 0 30px; }

.section { padding: 100px 0; }
.two-columns { display:grid; grid-template-columns: .85fr 1.15fr; gap:70px; align-items:center; }
h2 { font-size:clamp(38px,5vw,58px); line-height:1; letter-spacing:-2px; color:var(--blue); }
h2 span { font-family:"Kalam", cursive; }
.about-text p:not(.section-kicker) { margin-top:18px; max-width:540px; color:#4b5d6b; }
.brush { width:110px; height:8px; border-radius:50%; margin:13px 0 20px; transform:rotate(-2deg); }
.brush.yellow { background:var(--yellow); }
.photo-card { border-radius:28px; overflow:hidden; box-shadow:18px 18px 0 var(--yellow); }
.photo-card img { width:100%; height:430px; display:block; object-fit:cover; }

.gallery { background:#f5ecd9; }
.section-heading { display:flex; align-items:end; justify-content:space-between; margin-bottom:35px; }
.gallery-note { font-family:"Kalam",cursive; color:var(--blue); font-size:21px; text-align:right; }
.gallery-grid { display:grid; grid-template-columns:1.35fr .75fr .75fr; grid-template-rows:260px 260px; gap:14px; }
.gallery-item { border:0; padding:0; cursor:pointer; overflow:hidden; border-radius:18px; background:#ddd; }
.gallery-item.large { grid-row:span 2; }
.gallery-item img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s; }
.gallery-item:hover img { transform:scale(1.06); }

.centered { display:block; text-align:center; margin-bottom:45px; }
.moment-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:15px; }
.moment-card { text-align:center; background:white; border-radius:22px; padding:30px 18px; box-shadow:0 8px 25px rgba(0,0,0,.06); border-bottom:5px solid transparent; }
.moment-card span { display:grid; place-items:center; width:58px; height:58px; border-radius:50%; margin:0 auto 15px; font-size:26px; }
.moment-card h3 { font-size:15px; margin-bottom:7px; }
.moment-card p { font-size:12px; color:#71808b; }
.yellow-card { border-color:var(--yellow); } .yellow-card span { background:#fff0a8; }
.blue-card { border-color:#1195d0; } .blue-card span { background:#b9e6fa; }
.red-card { border-color:var(--red); } .red-card span { background:#ffd0cc; }
.green-card { border-color:var(--green); } .green-card span { background:#d8efcf; }
.orange-card { border-color:#f28a23; } .orange-card span { background:#ffe0bb; }

.location { min-height:430px; display:flex; align-items:center; position:relative; color:white; background:url("../img/hero.jpg") center/cover; }
.location-overlay { position:absolute; inset:0; background:linear-gradient(90deg, rgba(3,43,72,.9), rgba(3,43,72,.25)); }
.location-content { position:relative; }
.location h2 { color:white; max-width:700px; }
.location-content > p:not(.section-kicker) { margin:15px 0 25px; font-size:18px; }

.footer { background:var(--blue-dark); color:white; padding:25px 0; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:12px; }
.footer-logo { color:white; }
.footer-logo .logo-sun { font-size:28px; }
.footer-logo strong { font-size:20px; }

.lightbox { position:fixed; inset:0; z-index:50; background:rgba(0,0,0,.92); display:none; align-items:center; justify-content:center; padding:30px; }
.lightbox.open { display:flex; }
.lightbox img { max-width:95vw; max-height:90vh; object-fit:contain; border-radius:8px; }
.lightbox-close { position:absolute; top:15px; right:25px; color:white; background:none; border:0; font-size:50px; cursor:pointer; }

@media (max-width: 900px) {
  .menu-toggle { display:block; }
  .menu { position:absolute; top:78px; left:0; right:0; display:none; flex-direction:column; align-items:stretch; padding:20px; background:white; box-shadow:0 10px 20px rgba(0,0,0,.1); }
  .menu.open { display:flex; }
  .menu .btn { text-align:center; }
  .two-columns { grid-template-columns:1fr; gap:45px; }
  .moment-grid { grid-template-columns:repeat(2,1fr); }
  .gallery-grid { grid-template-columns:1fr 1fr; grid-template-rows:250px 180px 180px; }
  .gallery-item.large { grid-column:span 2; grid-row:auto; }
  .hero { min-height:680px; }
}
@media (max-width: 600px) {
  .container { width:min(100% - 28px, 1180px); }
  .nav { min-height:68px; }
  .menu { top:68px; }
  .hero { min-height:650px; }
  .hero-content { padding-top:65px; }
  .hero h1 { font-size:52px; }
  .hero-subtitle { font-size:25px; }
  .section { padding:70px 0; }
  .photo-card { box-shadow:10px 10px 0 var(--yellow); }
  .photo-card img { height:320px; }
  .gallery-grid { grid-template-columns:1fr; grid-template-rows:280px repeat(4,190px); }
  .gallery-item.large { grid-column:auto; }
  .moment-grid { grid-template-columns:1fr; }
  .section-heading { align-items:start; gap:20px; }
  .footer-inner { flex-direction:column; text-align:center; }
}

/* Contato WhatsApp */
.hero-actions, .location-actions { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.btn-whatsapp { background:#20c66a; color:#fff; box-shadow:0 6px 18px rgba(0,0,0,.16); }
.btn-whatsapp:hover { box-shadow:0 10px 24px rgba(0,0,0,.2); }
.hero-actions .btn-whatsapp { padding-left:18px; padding-right:18px; }
.hero-actions .btn-whatsapp strong { font-size:12px; }
.phone-highlight { margin-top:20px; display:inline-flex; align-items:center; gap:9px; padding:10px 16px; border-radius:999px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.32); font-size:14px; }
.phone-highlight span { opacity:.9; }
.phone-highlight strong { font-size:17px; }
.footer-contact { display:flex; align-items:center; gap:8px; font-weight:600; }
.footer-contact span { opacity:.8; }
.footer-contact a { color:#fff; font-weight:800; }

/* Movimento sutil na capa: dá vida à foto sem tirar o foco do conteúdo. */
@keyframes heroZoom { from { transform:scale(1); } to { transform:scale(1.045); } }
.hero { overflow:hidden; }
.hero::before { content:""; position:absolute; inset:-2%; background:inherit; background-size:cover; background-position:center; animation:heroZoom 18s ease-in-out infinite alternate; z-index:0; }
.hero-overlay, .hero-content { z-index:1; }

@media (max-width: 700px) {
  .hero-actions, .location-actions { flex-direction:column; align-items:stretch; }
  .hero-actions .btn, .location-actions .btn { width:100%; }
  .phone-highlight { width:100%; justify-content:center; }
  .footer-contact { flex-direction:column; }
}