:root {
  --gold: #b9873b;
  --gold-light: #e8cf99;
  --gold-soft: #f6eedf;
  --cream: #fcfaf5;
  --brown: #493b35;
  --brown-soft: #75645c;
  --white: #ffffff;
  --line: rgba(73, 59, 53, 0.14);
  --shadow: 0 24px 70px rgba(73, 59, 53, 0.12);
  --radius-lg: 32px;
  --radius-md: 22px;
  --container: 1180px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: "Inter", sans-serif; color: var(--brown); background: var(--white); line-height: 1.65; overflow-x: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.section { padding: 112px 0; }

.header { position: fixed; inset: 0 0 auto; z-index: 1000; background: rgba(255,255,255,.88); backdrop-filter: blur(18px); border-bottom: 1px solid transparent; transition: .3s ease; }
.header.scrolled { border-color: var(--line); box-shadow: 0 10px 35px rgba(61,43,31,.07); }
.nav-wrap { height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand { display: flex; align-items: center; gap: 12px; font-family: "Cormorant Garamond", serif; font-weight: 700; font-size: 1.35rem; }
.brand img { width: 58px; height: 58px; object-fit: contain; border-radius: 50%; }
.nav { display: flex; align-items: center; gap: 28px; font-size: .95rem; font-weight: 600; }
.nav a:not(.nav-cta) { position: relative; }
.nav a:not(.nav-cta)::after { content:""; position:absolute; left:0; bottom:-6px; width:0; height:1px; background:var(--gold); transition:.25s; }
.nav a:hover::after { width:100%; }
.nav-cta { background: var(--brown); color: var(--white); padding: 13px 20px; border-radius: 999px; transition: .25s; }
.nav-cta:hover { background: var(--gold); transform: translateY(-2px); }
.menu-toggle { display:none; background:none; border:0; width:42px; height:42px; cursor:pointer; }
.menu-toggle span { display:block; width:25px; height:2px; margin:5px auto; background:var(--brown); transition:.25s; }

.hero { position: relative; min-height: 780px; padding: 150px 0 90px; display:flex; align-items:center; background: linear-gradient(135deg, #fff 0%, #fbf7ee 100%); overflow:hidden; }
.hero-grid { position:relative; z-index:2; display:grid; grid-template-columns: 1.02fr .98fr; gap:72px; align-items:center; }
.hero-glow { position:absolute; border-radius:50%; filter:blur(10px); pointer-events:none; }
.hero-glow-one { width:540px; height:540px; background:radial-gradient(circle, rgba(232,207,153,.36), transparent 67%); right:-120px; top:40px; }
.hero-glow-two { width:380px; height:380px; background:radial-gradient(circle, rgba(185,135,59,.12), transparent 70%); left:-160px; bottom:-120px; }
.eyebrow { display:inline-block; margin-bottom:18px; color:var(--gold); text-transform:uppercase; letter-spacing:.18em; font-size:.76rem; font-weight:700; }
h1,h2,h3 { font-family:"Cormorant Garamond",serif; line-height:1.08; }
h1 { font-size:clamp(3.25rem, 6.2vw, 5.7rem); letter-spacing:-.045em; max-width:760px; }
h2 { font-size:clamp(2.5rem, 4.5vw, 4.15rem); letter-spacing:-.035em; }
h3 { font-size:1.8rem; }
.hero-content > p { max-width:640px; margin:26px 0 34px; color:var(--brown-soft); font-size:1.08rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:54px; padding:0 25px; border-radius:999px; font-weight:700; transition:.25s ease; }
.btn:hover { transform:translateY(-3px); }
.btn-primary { color:var(--white); background:linear-gradient(135deg, var(--brown), #6a5247); box-shadow:0 14px 30px rgba(73,59,53,.22); }
.btn-primary:hover { background:linear-gradient(135deg, var(--gold), #d3a254); }
.btn-secondary { border:1px solid var(--line); background:rgba(255,255,255,.55); }
.hero-notes { display:flex; flex-wrap:wrap; gap:12px 22px; margin-top:34px; color:var(--brown-soft); font-size:.86rem; }
.hero-notes span::before { content:"•"; color:var(--gold); margin-right:8px; }
.hero-visual { position:relative; min-height:560px; }
.hero-image-card { position:absolute; inset:0 20px 30px 0; border-radius:48% 48% 28px 28px; overflow:hidden; box-shadow:var(--shadow); }
.hero-image-card img { width:100%; height:100%; object-fit:cover; }
.hero-image-card::after { content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(60,43,34,.22), transparent 45%); }
.floating-card { position:absolute; right:-12px; bottom:0; width:min(300px, 78%); background:rgba(255,255,255,.95); border:1px solid rgba(185,135,59,.18); border-radius:20px; padding:22px; box-shadow:0 20px 50px rgba(73,59,53,.16); }
.floating-card strong { display:block; font-family:"Cormorant Garamond",serif; font-size:1.35rem; }
.floating-card span { display:block; color:var(--brown-soft); font-size:.9rem; margin-top:4px; }

.split-grid { display:grid; grid-template-columns:.95fr 1.05fr; gap:100px; align-items:center; }
.image-stack { position:relative; min-height:590px; }
.stack-main { position:absolute; inset:0 90px 70px 0; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); }
.stack-main img,.stack-small img { width:100%; height:100%; object-fit:cover; }
.stack-small { position:absolute; width:47%; height:44%; right:0; bottom:0; border:10px solid var(--white); border-radius:var(--radius-md); overflow:hidden; box-shadow:0 18px 45px rgba(73,59,53,.16); }
.gold-line { position:absolute; width:130px; height:130px; border:1px solid var(--gold-light); border-radius:50%; top:-30px; left:-30px; z-index:-1; }
.section-copy p { margin-top:20px; color:var(--brown-soft); }
.text-link { display:inline-flex; gap:8px; margin-top:30px; color:var(--gold); font-weight:700; }
.text-link span { transition:.2s; }
.text-link:hover span { transform:translateX(5px); }

.services { background:var(--cream); }
.section-heading { max-width:760px; margin-bottom:52px; }
.section-heading p { color:var(--brown-soft); margin-top:18px; }
.cards-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.service-card { position:relative; min-height:320px; padding:34px 28px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); overflow:hidden; transition:.3s; }
.service-card:hover { transform:translateY(-8px); box-shadow:var(--shadow); border-color:transparent; }
.service-card.featured { background:linear-gradient(145deg, #5b483f, #3e312c); color:var(--white); }
.service-number { width:48px; height:48px; display:grid; place-items:center; border-radius:50%; background:var(--gold-soft); color:var(--gold); font-weight:700; margin-bottom:60px; }
.featured .service-number { background:rgba(255,255,255,.13); color:var(--gold-light); }
.service-card h3 { margin-bottom:14px; }
.service-card p { color:var(--brown-soft); font-size:.94rem; }
.featured p { color:rgba(255,255,255,.7); }

.child-section { padding-top:0; background:var(--cream); }
.child-grid { display:grid; grid-template-columns:1fr 1fr; align-items:center; background:var(--white); border-radius:40px; overflow:hidden; box-shadow:var(--shadow); }
.child-copy { padding:70px; }
.child-copy p { color:var(--brown-soft); margin:20px 0; }
.child-copy .btn { margin-top:10px; }
.child-image { position:relative; height:100%; min-height:620px; }
.child-image img { width:100%; height:100%; object-fit:cover; }
.child-badge { position:absolute; left:28px; bottom:28px; background:rgba(255,255,255,.92); padding:14px 18px; border-radius:14px; font-weight:700; box-shadow:0 12px 30px rgba(73,59,53,.15); }

.professionals-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px; }
.professional-card { background:var(--cream); border:1px solid var(--line); border-radius:28px; overflow:hidden; transition:.3s; }
.professional-card:hover { transform:translateY(-6px); box-shadow:var(--shadow); }
.professional-card img { width:100%; aspect-ratio:1.72/1; object-fit:cover; object-position:center top; }
.professional-info { padding:26px 28px 30px; }
.professional-info p { color:var(--gold); font-weight:600; }

.faq-section { background:linear-gradient(130deg,#fff 0%,#fbf7ef 100%); }
.faq-grid { display:grid; grid-template-columns:.72fr 1.28fr; gap:90px; align-items:start; }
.faq-intro p { color:var(--brown-soft); margin-top:18px; }
.faq-logo { width:170px; margin-top:36px; opacity:.9; }
.accordion { border-top:1px solid var(--line); }
.accordion-item { border-bottom:1px solid var(--line); }
.accordion-trigger { width:100%; display:flex; justify-content:space-between; align-items:center; gap:20px; background:none; border:0; padding:25px 0; color:var(--brown); text-align:left; font-weight:600; cursor:pointer; }
.accordion-icon { flex:0 0 38px; width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:#f0eee9; color:var(--brown-soft); font-size:1.45rem; transition:.25s; }
.accordion-trigger[aria-expanded="true"] .accordion-icon { transform:rotate(45deg); background:var(--gold); color:#fff; }
.accordion-content { display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s ease; }
.accordion-content > p { overflow:hidden; color:var(--brown-soft); padding-right:58px; }
.accordion-item.active .accordion-content { grid-template-rows:1fr; }
.accordion-item.active .accordion-content > p { padding-bottom:25px; }

.cta-section { padding:0 0 112px; }
.cta-box { display:flex; align-items:center; justify-content:space-between; gap:40px; padding:60px; color:#fff; border-radius:36px; background:linear-gradient(135deg,#493b35,#7d5c49); box-shadow:var(--shadow); }
.cta-box h2 { max-width:760px; }
.cta-box p { color:rgba(255,255,255,.72); margin-top:14px; }
.eyebrow.light { color:var(--gold-light); }
.btn-light { flex:0 0 auto; color:var(--brown); background:#fff; }
.btn-light:hover { color:#fff; background:var(--gold); }

.footer { padding:70px 0 28px; color:rgba(255,255,255,.74); background:#312824; }
.footer-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:60px; }
.footer-brand img { width:100px; border-radius:50%; margin-bottom:14px; }
.footer h3 { color:#fff; font-size:1.35rem; margin-bottom:16px; }
.footer a { display:block; margin:8px 0; transition:.2s; }
.footer a:hover { color:var(--gold-light); }
.footer-bottom { display:flex; justify-content:space-between; gap:30px; margin-top:55px; padding-top:24px; border-top:1px solid rgba(255,255,255,.1); font-size:.8rem; }

.whatsapp-float { position:fixed; right:22px; bottom:22px; z-index:900; width:58px; height:58px; display:grid; place-items:center; color:#fff; background:#25d366; border-radius:50%; box-shadow:0 14px 30px rgba(37,211,102,.35); transition:.25s; }
.whatsapp-float:hover { transform:translateY(-4px) scale(1.04); }
.whatsapp-float svg { width:29px; fill:currentColor; }

.reveal { opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity:1; transform:none; }

@media (max-width: 1100px) {
  .nav { gap:18px; }
  .hero-grid { gap:42px; }
  .cards-grid { grid-template-columns:repeat(2,1fr); }
  .split-grid { gap:60px; }
  .child-copy { padding:50px; }
}

@media (max-width: 860px) {
  .section { padding:86px 0; }
  .menu-toggle { display:block; z-index:3; }
  .nav { position:fixed; top:84px; left:20px; right:20px; display:flex; flex-direction:column; align-items:stretch; gap:0; padding:18px; background:#fff; border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); opacity:0; visibility:hidden; transform:translateY(-12px); transition:.25s; }
  .nav.open { opacity:1; visibility:visible; transform:none; }
  .nav a { padding:13px 10px; }
  .nav-cta { text-align:center; margin-top:8px; }
  .hero { min-height:auto; padding-top:130px; }
  .hero-grid,.split-grid,.child-grid,.faq-grid { grid-template-columns:1fr; }
  .hero-visual { min-height:500px; }
  .split-grid { gap:55px; }
  .image-stack { min-height:520px; }
  .child-image { min-height:440px; order:-1; }
  .faq-grid { gap:45px; }
  .faq-logo { display:none; }
  .cta-box { flex-direction:column; align-items:flex-start; }
}

@media (max-width: 640px) {
  .container { width:min(calc(100% - 28px), var(--container)); }
  .nav-wrap { height:74px; }
  .nav { top:74px; }
  .brand span { display:none; }
  .brand img { width:52px; height:52px; }
  .hero { padding:112px 0 70px; }
  h1 { font-size:3.15rem; }
  h2 { font-size:2.65rem; }
  .hero-actions .btn { width:100%; }
  .hero-visual { min-height:440px; }
  .hero-image-card { inset:0 6px 45px 0; border-radius:120px 120px 24px 24px; }
  .floating-card { right:0; padding:18px; }
  .image-stack { min-height:430px; }
  .stack-main { inset:0 40px 55px 0; }
  .stack-small { width:48%; height:39%; border-width:7px; }
  .cards-grid,.professionals-grid { grid-template-columns:1fr; }
  .service-card { min-height:auto; }
  .service-number { margin-bottom:35px; }
  .child-copy { padding:34px 24px 40px; }
  .child-image { min-height:360px; }
  .professional-card img { aspect-ratio:1.25/1; }
  .cta-section { padding-bottom:80px; }
  .cta-box { padding:38px 24px; border-radius:26px; }
  .btn-light { width:100%; }
  .footer-grid { grid-template-columns:1fr; gap:34px; }
  .footer-bottom { flex-direction:column; }
}

@media (min-width: 1600px) {
  :root { --container: 1380px; }
  .hero { min-height:900px; }
  .hero-grid { gap:110px; }
  .hero-visual { min-height:650px; }
  .section { padding:140px 0; }
}
