/* 4Church — site institucional. Identidade: tinta noturna + dourado (mesma do sistema), com a
   estrutura da família IV Solutions (hero escuro, seções alternadas, CTA âmbar/dourado). */
:root{
  --ink:#0E1220; --ink-2:#161C33; --wine:#3A1830;
  --gold:#C9A15A; --gold-lt:#E4C88E; --gold-dk:#8A6424;
  --mist:#B9B3C9; --text:#1F2430; --muted:#5C6270; --faint:#8A90A0;
  --ivory:#F8F4EC; --line:#E7E0D2; --white:#FFFFFF;
  --ruby:#B3324F; --sapphire:#2F5DB8; --emerald:#2F8C74; --amber:#D9902B; --slate:#64708A;
  --raio:16px; --largura:1200px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:80px;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{margin:0;font-family:'Poppins',system-ui,Arial,sans-serif;color:var(--text);background:var(--white);
  line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img,svg{max-width:100%;}
a{color:inherit;}
h1,h2,h3,h4,p{margin:0;}
h2{font-size:clamp(26px,3vw,36px);line-height:1.18;font-weight:700;letter-spacing:-.01em;text-wrap:balance;}
h3{font-size:17px;font-weight:600;}
.wrap{max-width:var(--largura);margin:0 auto;padding:0 28px;}
.estreito{max-width:820px;}
.pular{position:absolute;left:-999px;top:8px;background:var(--gold);color:var(--ink);padding:10px 16px;border-radius:8px;font-weight:600;z-index:100;}
.pular:focus{left:8px;}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px;}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:999px;
  font:600 13.5px 'Poppins',sans-serif;text-decoration:none;border:1.5px solid transparent;cursor:pointer;white-space:nowrap;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease;}
.btn:hover{transform:translateY(-2px);}
.btn-lg{padding:14px 26px;font-size:15px;}
.btn-gold{background:var(--gold);color:var(--ink);box-shadow:0 12px 26px -10px rgba(201,161,90,.6);}
.btn-gold:hover{background:var(--gold-lt);}
.btn-ghost{color:var(--white);border-color:rgba(255,255,255,.3);background:transparent;}
.btn-ghost:hover{border-color:rgba(255,255,255,.75);}
.btn-ink{background:var(--ink);color:var(--white);box-shadow:0 12px 26px -12px rgba(14,18,32,.6);}
.btn-linha{background:transparent;color:var(--text);border-color:var(--line);}
.btn-linha:hover{border-color:var(--gold);}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;color:var(--white);
  background:linear-gradient(135deg,var(--ink) 0%,var(--ink-2) 48%,var(--wine) 100%);}
.ring{position:absolute;border-radius:50%;border:1px solid rgba(201,161,90,.18);pointer-events:none;}
.ring-a{width:900px;height:900px;top:-320px;right:-260px;}
.ring-b{width:640px;height:640px;top:-190px;right:-90px;border-color:rgba(201,161,90,.1);}
.dots{position:absolute;left:0;bottom:90px;width:360px;height:260px;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.13) 1.4px,transparent 1.4px);background-size:26px 26px;}
.skyline{position:absolute;top:64px;left:0;width:100%;line-height:0;opacity:.55;pointer-events:none;}
.skyline svg{width:100%;height:60px;display:block;}
.skyline path{fill:none;stroke:var(--gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}

.nav{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:20px;
  max-width:var(--largura);margin:0 auto;padding:20px 28px;}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;}
.simbolo{height:40px;width:auto;display:block;flex:none;}
.brand-name{display:block;font-weight:700;font-size:17px;line-height:1.1;color:var(--white);}
.brand-sub{display:block;font-size:10px;color:var(--mist);letter-spacing:.09em;text-transform:uppercase;}
.nav-menu{display:flex;align-items:center;gap:26px;}
.nav-menu > a:not(.btn){font-size:14px;font-weight:500;color:var(--mist);text-decoration:none;}
.nav-menu > a:not(.btn):hover{color:var(--white);}
.menu-btn{display:none;width:42px;height:42px;border-radius:10px;border:1.5px solid rgba(255,255,255,.25);background:none;color:var(--white);cursor:pointer;}
.menu-btn svg{width:22px;height:22px;}
@media (max-width:1120px){
  .menu-btn{display:grid;place-items:center;}
  .nav-menu{display:none;position:absolute;left:16px;right:16px;top:74px;flex-direction:column;align-items:stretch;gap:4px;
    background:#151A2E;border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:14px;box-shadow:0 30px 60px -20px rgba(0,0,0,.7);}
  .nav-menu.aberto{display:flex;}
  .nav-menu > a:not(.btn){padding:12px 10px;border-radius:10px;color:var(--white);}
  .nav-menu > a:not(.btn):hover{background:rgba(255,255,255,.06);}
  .nav-menu .btn{margin-top:6px;}
}

.hero-main{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:56px;
  max-width:var(--largura);margin:0 auto;padding:72px 28px 64px;}
.eyebrow,.kicker{font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;}
h1{font-size:clamp(32px,4.2vw,52px);line-height:1.08;font-weight:700;letter-spacing:-.015em;margin-bottom:20px;text-wrap:balance;}
h1 em{font-style:normal;color:var(--gold-lt);}
.lede{font-size:17px;line-height:1.65;color:var(--mist);max-width:520px;margin-bottom:30px;}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;}
.tagline{font-family:'Lora',Georgia,serif;font-style:italic;font-size:16px;color:#D9D3E6;margin-top:32px;}

.hero-art{position:relative;min-height:380px;}
.mock{background:#FBFAF7;border-radius:18px;overflow:hidden;color:var(--text);
  box-shadow:0 50px 100px -30px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.08);transform:perspective(1400px) rotateY(-6deg) rotateX(2deg);}
.mock-bar{display:flex;align-items:center;gap:6px;padding:11px 14px;background:#EEEBE4;border-bottom:1px solid var(--line);}
.mock-bar i{width:10px;height:10px;border-radius:50%;background:#D5CFC2;}
.mock-bar span{margin-left:10px;font-size:11px;color:var(--faint);}
.mock > img{display:block;width:100%;height:auto;}
.mock-body{display:grid;grid-template-columns:64px 1fr;min-height:310px;}
.mock-side{background:var(--ink);padding:16px 12px;display:flex;flex-direction:column;gap:12px;align-items:center;}
.mock-side b{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,var(--gold),#9C7638);margin-bottom:6px;}
.mock-side span{width:34px;height:8px;border-radius:4px;background:rgba(255,255,255,.14);}
.mock-side span.on{background:var(--gold);}
.mock-content{padding:20px 22px;}
.mock-title{font-weight:600;font-size:14px;margin-bottom:14px;}
.mock-row{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--line);}
.mock-row strong{display:block;font-size:13px;font-weight:600;line-height:1.3;}
.mock-row small{font-size:11.5px;color:var(--faint);}
.tag{flex:none;width:86px;text-align:center;font-size:10.5px;font-weight:600;padding:4px 0;border-radius:999px;}
.t-missa{background:#F6E9CF;color:#7A5A1E;} .t-batismo{background:#DCE8FA;color:#274C96;}
.t-agenda{background:#DDF1EA;color:#1F6B57;} .t-matrimonio{background:#F7DEE5;color:#8E2740;}
.float{position:absolute;display:flex;align-items:center;gap:11px;background:var(--white);color:var(--text);border-radius:14px;padding:11px 15px;
  box-shadow:0 22px 44px -16px rgba(0,0,0,.55);animation:flutuar 6s ease-in-out infinite;}
.float strong{display:block;font-size:12.5px;line-height:1.25;} .float small{font-size:11px;color:var(--faint);}
.float-a{left:-26px;bottom:-22px;} .float-b{right:-10px;top:-18px;animation-delay:-3s;}
.float .wa,.float .ok{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;flex:none;}
.float .wa{background:#DDF6E5;color:#1E8E4E;} .float .wa svg{width:17px;height:17px;}
.float .ok{background:#F6E9CF;color:#7A5A1E;font-weight:700;}
@keyframes flutuar{50%{transform:translateY(-8px);}}
@media (prefers-reduced-motion:reduce){.float{animation:none;}}

.hero-strip{position:relative;z-index:2;list-style:none;margin:0 auto;padding:22px 28px 30px;max-width:var(--largura);
  display:flex;flex-wrap:wrap;gap:10px 12px;border-top:1px solid rgba(255,255,255,.1);}
.hero-strip li{font-size:12.5px;color:var(--mist);padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);}
@media (max-width:980px){
  .hero-main{grid-template-columns:1fr;padding:68px 28px 56px;gap:44px;}
  .mock{transform:none;} .float-a{left:8px;bottom:-18px;} .float-b{right:8px;}
}
@media (max-width:520px){.float-b{display:none;}.tag{width:74px;}}

/* ---------- seções ---------- */
.sec{padding:88px 0;}
.sec-light{background:var(--white);} .sec-ivory{background:var(--ivory);}
.sec-dark{background:linear-gradient(135deg,var(--ink) 0%,var(--ink-2) 60%,#231634 100%);color:var(--white);}
.sec-dark .sub{color:var(--mist);}
.sub{font-size:16.5px;color:var(--muted);max-width:680px;margin-top:14px;}
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
@media (max-width:900px){.sec{padding:64px 0;}.split{grid-template-columns:1fr;gap:40px;}}

.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px;}
.card{padding:28px 26px;border:1px solid var(--line);border-radius:var(--raio);background:var(--white);}
.card h3{margin:16px 0 8px;} .card p{font-size:14.5px;color:var(--muted);}
.ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:#F6EEDD;color:var(--gold-dk);}
.ico svg{width:22px;height:22px;}
@media (max-width:860px){.trio{grid-template-columns:1fr;}}

.grupos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px;}
.grupo{background:var(--white);border:1px solid var(--line);border-radius:var(--raio);padding:26px 24px;}
.grupo h3{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.barra{width:6px;height:22px;border-radius:4px;flex:none;}
.b-ruby{background:var(--ruby);} .b-sapphire{background:var(--sapphire);} .b-emerald{background:var(--emerald);}
.b-amber{background:var(--amber);} .b-gold{background:var(--gold);} .b-slate{background:var(--slate);}
.grupo ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.grupo li{font-size:14px;color:var(--muted);line-height:1.55;}
.grupo li b{color:var(--text);font-weight:600;}
@media (max-width:980px){.grupos{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.grupos{grid-template-columns:1fr;}}

/* ---------- WhatsApp ---------- */
.passos{list-style:none;margin:32px 0 0;padding:0;display:grid;gap:18px;}
.passos li{display:flex;gap:16px;align-items:flex-start;}
.passos li > span{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:14px;
  color:var(--ink);background:var(--gold);}
.passos b{display:block;font-weight:600;} .passos div{font-size:14.5px;color:var(--mist);} .passos div b{color:var(--white);font-size:15.5px;}
.phone{justify-self:center;width:100%;max-width:360px;background:#ECE5DD;border-radius:28px;padding:0 0 22px;color:#111;overflow:hidden;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.8),0 0 0 8px #0A0D18,0 0 0 9px rgba(255,255,255,.12);}
.phone-head{display:flex;align-items:center;gap:11px;background:#075E54;color:#fff;padding:14px 16px;margin-bottom:16px;}
.phone-head b{display:block;font-size:14px;font-weight:600;line-height:1.2;} .phone-head small{font-size:11px;opacity:.75;}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--gold);color:var(--ink);display:grid;place-items:center;font-size:16px;}
.bubble{position:relative;margin:0 46px 10px 14px;background:#fff;border-radius:4px 14px 14px 14px;padding:10px 12px 20px;font-size:13px;line-height:1.5;box-shadow:0 1px 1px rgba(0,0,0,.12);}
.bubble.me{margin:0 14px 12px 90px;background:#D9FDD3;border-radius:14px 4px 14px 14px;}
.bubble .link{display:block;margin-top:6px;color:#0B6BCB;font-size:12.5px;}
.bubble time{position:absolute;right:10px;bottom:4px;font-size:10px;color:#667781;}
.status-chip{margin:6px 14px 0;display:flex;align-items:center;gap:8px;justify-content:center;font-size:12px;font-weight:600;color:#1F2430;
  background:#FFF8E6;border:1px solid #F0DFB2;border-radius:10px;padding:8px;}
.dotok{width:8px;height:8px;border-radius:50%;background:#1E8E4E;}

/* ---------- destaques ---------- */
.destaques{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:44px;}
.destaque h3{margin:20px 0 8px;font-size:18px;} .destaque p{font-size:14.5px;color:var(--muted);}
.mini{height:200px;border-radius:var(--raio);background:var(--ivory);border:1px solid var(--line);display:grid;place-items:center;padding:20px;overflow:hidden;}
.mini-cal{display:grid;grid-template-columns:repeat(7,26px);gap:6px;}
.mini-cal span{font-size:10px;font-weight:600;color:var(--faint);text-align:center;}
.mini-cal i{height:26px;border-radius:7px;background:var(--white);border:1px solid var(--line);}
.mini-cal i.m{background:#F6E9CF;border-color:#EAD5A6;} .mini-cal i.e{box-shadow:inset 0 -6px 0 var(--emerald);} .mini-cal i.x{background:#F7DEE5;border-color:#EDC2CE;}
.mini-meta{width:100%;max-width:250px;} .mini-meta small{font-size:11px;color:var(--faint);display:block;} .mini-meta b{font-size:22px;}
.trilho{height:8px;border-radius:6px;background:#E9E2D3;margin:8px 0 16px;overflow:hidden;} .feito{width:62%;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-lt));}
.barras{display:flex;align-items:flex-end;gap:8px;height:70px;} .barras i{flex:1;border-radius:5px 5px 0 0;background:#DDD3BE;} .barras i.hoje{background:var(--gold);}
.mini-doc{width:170px;background:var(--white);border:1px solid var(--line);border-radius:8px;padding:14px;box-shadow:0 14px 30px -18px rgba(14,18,32,.4);display:grid;gap:5px;}
.mini-doc .selo{width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--gold);display:grid;place-items:center;font-size:13px;}
.mini-doc b{font-size:12px;} .mini-doc small{font-size:9.5px;color:var(--faint);} .mini-doc hr{width:100%;border:0;border-top:1px solid var(--line);margin:4px 0;}
.mini-doc i{height:6px;border-radius:3px;background:#E9E2D3;} .mini-doc i.c{width:70%;} .mini-doc i.c2{width:45%;}
@media (max-width:900px){.destaques{grid-template-columns:1fr;}}

/* ---------- segurança ---------- */
.checks{list-style:none;margin:0;padding:0;display:grid;gap:14px;}
.checks li{position:relative;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:16px 18px 16px 54px;font-size:14px;color:var(--muted);}
.checks li b{display:block;color:var(--text);font-weight:600;font-size:15px;}
.checks li::before{content:"✓";position:absolute;left:16px;top:16px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:#E3F3EC;color:var(--emerald);font-weight:700;font-size:13px;}

/* ---------- dioceses ---------- */
.dio{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center;}
.dio .btn{margin-top:26px;}
.dio-art{display:grid;justify-items:center;gap:0;padding:34px 20px;border-radius:var(--raio);background:var(--ivory);border:1px solid var(--line);}
.no{padding:12px 20px;border-radius:12px;background:var(--white);border:1px solid var(--line);font-size:13.5px;font-weight:600;position:relative;}
.no.raiz{background:var(--ink);color:var(--gold-lt);border-color:var(--ink);}
.ramos{display:flex;gap:14px;margin-top:46px;position:relative;flex-wrap:wrap;justify-content:center;}
.ramos::before{content:"";position:absolute;top:-23px;left:14%;right:14%;border-top:1.5px solid var(--gold);}
.ramos .no::before,.raiz::after{content:"";position:absolute;left:50%;width:1.5px;height:23px;background:var(--gold);}
.ramos .no::before{top:-24px;} .raiz::after{bottom:-24px;}
@media (max-width:900px){.dio{grid-template-columns:1fr;gap:36px;}}

/* ---------- etapas ---------- */
.etapas{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px;}
.etapa{padding:28px 26px;border-radius:var(--raio);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.11);}
.etapa span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--gold);color:var(--ink);font-weight:700;}
.etapa h3{margin:16px 0 8px;} .etapa p{font-size:14.5px;color:var(--mist);}
@media (max-width:860px){.etapas{grid-template-columns:1fr;}}

/* ---------- FAQ ---------- */
details{background:var(--white);border:1px solid var(--line);border-radius:14px;margin-top:12px;}
#faq h2{margin-bottom:28px;}
summary{cursor:pointer;list-style:none;padding:18px 52px 18px 20px;font-weight:600;font-size:15.5px;position:relative;}
summary::-webkit-details-marker{display:none;}
summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:22px;font-weight:400;color:var(--gold-dk);}
details[open] summary::after{content:"–";}
details p{padding:0 20px 20px;font-size:14.5px;color:var(--muted);}

/* ---------- contato ---------- */
.sec-cta{background:linear-gradient(135deg,var(--ink) 0%,var(--ink-2) 55%,var(--wine) 100%);color:var(--white);}
.sec-cta .sub{color:var(--mist);}
.sec-cta .split{align-items:center;}
.conversa{background:var(--white);color:var(--text);border-radius:20px;padding:32px 30px 28px;box-shadow:0 40px 90px -30px rgba(0,0,0,.7);}
.conversa h3{font-size:20px;margin-bottom:20px;}
.conversa-passos{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:16px;}
.conversa-passos li{display:flex;gap:14px;align-items:flex-start;}
.conversa-passos li > span{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:14px;
  background:#F6EEDD;color:var(--gold-dk);}
.conversa-passos div{font-size:14px;color:var(--muted);line-height:1.5;}
.conversa-passos b{display:block;color:var(--text);font-weight:600;font-size:15px;}
.conversa-btn{width:100%;} .conversa-btn svg{width:20px;height:20px;}
.conversa-email{text-align:center;margin-top:16px;font-size:13.5px;color:var(--muted);}
.conversa-email a{color:var(--gold-dk);font-weight:600;}
@media (max-width:520px){.conversa{padding:26px 20px 22px;}}

/* ---------- rodapé ---------- */
.rodape{background:#0A0D18;color:var(--mist);padding:56px 0 26px;font-size:14px;}
.rodape-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px;}
.rodape p{margin-top:16px;max-width:320px;font-size:13.5px;} .rodape p a{color:var(--gold-lt);}
.rodape h4{color:var(--white);font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px;}
.rodape nav a{display:block;text-decoration:none;padding:5px 0;} .rodape nav a:hover{color:var(--white);}
.copy{text-align:center;margin:44px auto 0;padding:22px 28px 0;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:#6F6A85;max-width:none;}
@media (max-width:860px){.rodape-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:480px){.rodape-grid{grid-template-columns:1fr;}}

/* ---------- entrada suave ---------- */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease;}
.js .reveal.visivel{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none;}}

/* ---------- telas reais ---------- */
.abas{display:flex;flex-wrap:wrap;gap:8px;margin:34px 0 22px;}
.abas button{font:500 13.5px 'Poppins',sans-serif;padding:9px 16px;border-radius:999px;border:1.5px solid var(--line);background:var(--white);
  color:var(--muted);cursor:pointer;transition:background .15s,color .15s,border-color .15s;}
.abas button:hover{border-color:var(--gold);color:var(--text);}
.abas button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:var(--white);}
.vitrine{margin:0;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:#FBFAF7;
  box-shadow:0 40px 80px -40px rgba(14,18,32,.45);}
.vitrine-img{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;}
.vitrine-img img{display:block;width:100%;height:auto;transition:opacity .2s ease;}
.vitrine-img img.trocando{opacity:0;}
.vitrine figcaption{padding:14px 20px;font-size:14px;color:var(--muted);border-top:1px solid var(--line);background:var(--white);}
.ampliada{padding:0;border:0;background:transparent;max-width:96vw;max-height:94vh;}
.ampliada::backdrop{background:rgba(8,10,20,.86);}
.ampliada img{display:block;max-width:96vw;max-height:94vh;border-radius:10px;}
.ampliada-fechar{position:fixed;top:14px;right:18px;width:42px;height:42px;border-radius:50%;border:0;background:rgba(255,255,255,.14);
  color:#fff;font-size:24px;cursor:pointer;}
@media (max-width:640px){.abas{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;margin-right:-28px;padding-right:28px;}.abas button{flex:none;}}