/*
Theme Name: Registro Visual
Theme URI: https://registrovisual.com.br
Author: Registro Visual
Description: Tema institucional da Registro Visual com projetos, Instagram, depoimentos, WhatsApp e captação de contatos.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: registro-visual
*/

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');

:root {
  --red:#ed1019;
  --red-dark:#b8050d;
  --ink:#111317;
  --paper:#f7f7f5;
  --gray:#696d75;
  --line:#dadcdf;
  --green:#168b48;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Manrope",system-ui,sans-serif; font-size:1rem; line-height:1.6; }
body.admin-bar .site-header { top:32px; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
button,input,select,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { font-family:"Space Grotesk",sans-serif; letter-spacing:-.045em; line-height:1.02; }
.skip-link { position:fixed; left:1rem; top:-4rem; z-index:99; padding:.7rem 1rem; color:#fff; background:var(--ink); }
.skip-link:focus { top:1rem; }

.site-header { position:sticky; top:0; z-index:30; display:flex; align-items:center; justify-content:space-between; min-height:5.2rem; padding:0 5vw; background:rgba(247,247,245,.94); border-bottom:1px solid rgba(17,19,23,.08); backdrop-filter:blur(16px); }
.rv-brand { width:4rem; height:3.45rem; display:block; }
.rv-brand img,.footer-brand img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 8px 10px rgba(237,16,25,.16)); }
.main-nav { display:flex; align-items:center; gap:1.5rem; font-weight:700; font-size:.9rem; }
.main-nav a:not(.nav-cta):hover { color:var(--red); }
.nav-cta { padding:.75rem 1.05rem; color:#fff; background:var(--ink); border-radius:999px; }
.nav-cta:hover { background:var(--red); }
.menu-toggle { display:none; align-items:center; gap:.45rem; border:1px solid var(--line); background:#fff; padding:.65rem .9rem; border-radius:999px; font-weight:700; cursor:pointer; }
.menu-toggle-icon { width:1.1rem; font-size:1.2rem; line-height:1; }

.hero { min-height:calc(100vh - 5.2rem); padding:5rem 5vw 3rem; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(25rem,.95fr); gap:3rem; align-items:center; overflow:hidden; }
.eyebrow,.section-kicker { margin:0 0 1.2rem; color:var(--red); font-size:.78rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.eyebrow { display:flex; align-items:center; gap:.7rem; }
.eyebrow span { width:2.8rem; height:.18rem; background:var(--red); }
h1 { max-width:13ch; margin-bottom:1.6rem; font-size:clamp(3.5rem,6.4vw,7.2rem); font-weight:700; }
h1 em { color:var(--red); font-style:normal; }
.hero-text { max-width:42rem; color:#565b64; font-size:clamp(1.05rem,1.5vw,1.24rem); }
.hero-actions { display:flex; flex-wrap:wrap; gap:.8rem; margin:2rem 0 2.8rem; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:.7rem; min-height:3.4rem; padding:.85rem 1.25rem; border:0; border-radius:.38rem; font-weight:800; cursor:pointer; transition:transform .2s ease,background .2s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { color:#fff; background:var(--red); box-shadow:0 14px 30px rgba(237,16,25,.2); }
.button-primary:hover { background:var(--red-dark); }
.button-secondary { border:1px solid #c8cbd0; }
.hero-proof { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; max-width:47rem; margin:0; padding:1.4rem 0 0; border-top:1px solid var(--line); list-style:none; }
.hero-proof li { display:flex; flex-direction:column; }
.hero-proof strong { font-size:.9rem; }
.hero-proof span { color:var(--gray); font-size:.78rem; line-height:1.4; }
.hero-visual { position:relative; min-height:43rem; display:grid; place-items:end center; isolation:isolate; }
.hero-visual::before { content:""; position:absolute; inset:4% 2% 4% 7%; z-index:-2; border-radius:50% 50% 8% 50%; background:linear-gradient(145deg,#ff2430,var(--red-dark)); transform:rotate(-7deg); }
.hero-visual::after { content:"RV"; position:absolute; right:-3%; top:3%; z-index:-1; color:rgba(255,255,255,.14); font:700 11rem "Space Grotesk"; letter-spacing:-.12em; }
.mascot { position:relative; z-index:3; width:min(100%,43rem); max-height:46rem; object-fit:contain; filter:drop-shadow(0 28px 30px rgba(0,0,0,.24)); }
.result-card { position:absolute; left:-1rem; top:16%; z-index:5; display:flex; flex-direction:column; min-width:13rem; padding:1rem 1.2rem; background:rgba(255,255,255,.94); border-left:.28rem solid var(--red); box-shadow:0 18px 45px rgba(17,19,23,.18); }
.result-card span { color:var(--red); font-size:.68rem; font-weight:800; letter-spacing:.14em; }
.result-card strong { font:600 1.2rem "Space Grotesk"; }
.result-card small { color:var(--gray); }

.statement { padding:5.5rem 8vw; color:#fff; background:var(--ink); text-align:center; }
.statement p { margin-bottom:.4rem; color:#9ea2aa; text-transform:uppercase; letter-spacing:.18em; font-size:.78rem; font-weight:800; }
.statement h2 { max-width:22ch; margin:0 auto; font-size:clamp(2.4rem,5vw,5.2rem); }
.statement span { color:var(--red); }
.section { padding:7.5rem 5vw; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:3rem; margin-bottom:3rem; }
.section-heading h2 { max-width:16ch; margin-bottom:0; font-size:clamp(2.3rem,4.1vw,4.5rem); }
.section-heading>p { max-width:31rem; margin-bottom:.3rem; color:var(--gray); }

.service-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.service-card { position:relative; min-height:21rem; padding:1.6rem; display:flex; flex-direction:column; justify-content:space-between; background:#fff; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.service-card.featured { color:#fff; background:var(--red); }
.service-number { color:#a6a9ae; font-size:.75rem; font-weight:800; letter-spacing:.14em; }
.featured .service-number,.featured .service-type { color:#fff; }
.service-type { margin-bottom:.5rem; color:var(--red); font-size:.72rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.service-card h3 { margin-bottom:.8rem; font-size:1.65rem; }
.service-card p:last-child { margin-bottom:0; color:var(--gray); font-size:.95rem; }
.featured p:last-child { color:rgba(255,255,255,.82); }
.service-arrow { position:absolute; right:1.3rem; top:1.1rem; font-size:1.35rem; }

.method { display:grid; grid-template-columns:.82fr 1.18fr; gap:7vw; color:#fff; background:var(--ink); }
.section-kicker.light { color:#ff646b; }
.method-intro { position:sticky; top:8rem; align-self:start; }
.method-intro h2 { font-size:clamp(2.4rem,4vw,4.4rem); }
.method-intro>p:last-child { max-width:31rem; color:#aeb2ba; }
.method-list { margin:0; padding:0; list-style:none; border-top:1px solid #353941; }
.method-list li { display:grid; grid-template-columns:4rem 1fr; gap:1.2rem; padding:2rem 0; border-bottom:1px solid #353941; }
.method-list>li>span { color:var(--red); font:700 .82rem "Space Grotesk"; }
.method-list strong { font:600 2.1rem "Space Grotesk"; }
.method-list p { margin:.35rem 0 0; color:#aeb2ba; }

.project-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.project-card { position:relative; min-height:25rem; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; padding:2rem; color:#fff; border-radius:1.4rem; isolation:isolate; background:#25282e; }
.project-card>img { position:absolute; inset:0; z-index:-3; width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.project-card>img.rv-placeholder { object-fit:contain; padding:4rem; background:#111317; }
.project-card:hover>img { transform:scale(1.04); }
.project-overlay { position:absolute; inset:0; z-index:-2; background:linear-gradient(0deg,rgba(0,0,0,.88),rgba(0,0,0,.1) 75%); }
.project-card>span { width:max-content; padding:.45rem .7rem; border:1px solid rgba(255,255,255,.5); border-radius:999px; font-size:.75rem; text-transform:uppercase; letter-spacing:.12em; backdrop-filter:blur(8px); }
.project-card h3 { margin-bottom:.4rem; font-size:2.4rem; }
.project-card p { max-width:30rem; margin-bottom:0; color:rgba(255,255,255,.83); }

.instagram-section { color:#fff; background:var(--red); }
.instagram-section .section-heading h2 { max-width:17ch; }
.text-link { display:inline-flex; align-items:center; gap:.5rem; font-weight:800; border-bottom:1px solid currentColor; }
.light-link { color:#fff; }
.instagram-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.instagram-card { overflow:hidden; color:var(--ink); background:#fff; border-radius:.9rem; box-shadow:0 20px 45px rgba(96,0,4,.18); }
.instagram-image { position:relative; aspect-ratio:1; overflow:hidden; background:#111317; }
.instagram-image img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.instagram-image img.rv-placeholder { object-fit:contain; padding:3rem; }
.instagram-card:hover img { transform:scale(1.04); }
.instagram-badge { position:absolute; right:1rem; top:1rem; width:2.2rem; height:2.2rem; display:grid; place-items:center; color:#fff; background:rgba(0,0,0,.55); border-radius:.4rem; font-weight:800; }
.instagram-card>div:last-child { padding:1.2rem; }
.instagram-card strong { font:600 1.2rem "Space Grotesk"; }
.instagram-card p { margin:.5rem 0 0; color:var(--gray); font-size:.92rem; }

.testimonials { background:#efefed; }
.testimonial-carousel { position:relative; padding:0 3rem 1rem; }
.testimonial-track { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.testimonial-slide { display:block; }
.testimonial-slide[hidden] { display:none!important; }
.testimonial-card { min-height:19rem; display:flex; flex-direction:column; justify-content:space-between; padding:2rem; background:#fff; border:1px solid var(--line); border-radius:1.2rem; }
.testimonial-quote { color:var(--red); font:700 3rem/1 "Space Grotesk"; }
.testimonial-card blockquote { margin:1.6rem 0 2rem; font:500 clamp(1.25rem,2vw,1.7rem)/1.35 "Space Grotesk"; }
.testimonial-person { display:flex; align-items:center; gap:.8rem; }
.testimonial-person>span,.testimonial-person>img { width:2.8rem; height:2.8rem; display:grid; place-items:center; object-fit:cover; border-radius:50%; background:var(--red); color:#fff; font-weight:800; }
.testimonial-person div { display:flex; flex-direction:column; }
.testimonial-person small { color:var(--gray); }
.carousel-button { position:absolute; top:50%; width:2.5rem; height:2.5rem; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; background:#fff; cursor:pointer; transform:translateY(-50%); }
.carousel-prev { left:0; }
.carousel-next { right:0; }

.contact-section { display:grid; grid-template-columns:.9fr 1.1fr; gap:7vw; color:#fff; background:var(--ink); }
.contact-copy h2 { font-size:clamp(2.6rem,4.5vw,5rem); }
.contact-copy>p:not(.section-kicker) { max-width:35rem; color:#aeb2ba; }
.whatsapp-button { display:inline-flex; align-items:center; gap:.8rem; margin-top:1rem; padding:.9rem 1.15rem; color:#fff; background:var(--green); border-radius:.55rem; font-weight:800; box-shadow:0 10px 24px rgba(22,139,72,.22); transition:transform .2s ease,background .2s ease,box-shadow .2s ease; }
.whatsapp-button:hover { transform:translateY(-2px); background:#11783d; box-shadow:0 14px 28px rgba(22,139,72,.28); }
.contact-form { display:grid; gap:1.2rem; padding:2rem; color:var(--ink); background:#fff; border-radius:1.2rem; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.contact-form label { display:block; margin-bottom:.45rem; font-size:.9rem; font-weight:600; }
.contact-form input,.contact-form textarea,.contact-form select { width:100%; min-height:3rem; padding:.7rem .8rem; color:var(--ink); background:#fff; border:1px solid #cfd1d5; border-radius:.45rem; }
.contact-form textarea { min-height:8rem; resize:vertical; }
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus { outline:2px solid rgba(237,16,25,.2); border-color:var(--red); }
.submit-button { min-height:3.1rem; color:#fff; background:var(--red); font-weight:800; }
.form-feedback { display:none; align-items:flex-start; gap:.5rem; margin:0; font-size:.9rem; }
.form-feedback.is-visible { display:flex; }
.form-feedback.is-success { color:#166534; }
.form-feedback.is-error { color:#b8050d; }
.honeypot { position:absolute!important; left:-9999px!important; opacity:0!important; pointer-events:none!important; }

.site-footer { padding:2rem 5vw; display:grid; grid-template-columns:1fr auto auto; gap:2rem; align-items:center; color:#fff; background:#08090b; font-size:.85rem; }
.footer-brand { width:4.45rem; height:3.8rem; }
.footer-links { display:flex; gap:1.2rem; }
.footer-links a:hover { color:#ff646b; }
.site-footer>p { margin:0; color:#8c9098; }
.rv-whatsapp-icon { position:relative; display:inline-grid; place-items:center; flex:0 0 auto; width:1.72rem; height:1.72rem; }
.rv-whatsapp-icon svg { width:100%; height:100%; overflow:visible; }
.rv-whatsapp-icon svg path:first-child { fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.rv-whatsapp-icon svg path:last-child { fill:currentColor; stroke:none; }
.rv-whatsapp-badge { position:absolute; right:-.48rem; bottom:-.34rem; display:grid; place-items:center; width:1.18rem; height:1.18rem; padding:.08rem; overflow:hidden; background:#fff; border:2px solid var(--green); border-radius:50%; box-shadow:0 3px 8px rgba(17,19,23,.22); }
.rv-whatsapp-badge img { width:100%; height:100%; object-fit:contain; }
.floating-whatsapp { position:fixed; right:1.25rem; bottom:1.25rem; z-index:40; display:grid; place-items:center; width:4rem; height:4rem; color:#fff; background:var(--green); border:2px solid rgba(255,255,255,.85); border-radius:50%; box-shadow:0 14px 30px rgba(0,0,0,.24); transition:transform .2s ease,box-shadow .2s ease,background .2s ease; }
.floating-whatsapp:hover { transform:translateY(-3px) scale(1.03); background:#11783d; box-shadow:0 18px 34px rgba(0,0,0,.28); }
.floating-whatsapp .rv-whatsapp-icon { width:2.05rem; height:2.05rem; }
.floating-whatsapp .rv-whatsapp-badge { width:1.28rem; height:1.28rem; right:-.55rem; bottom:-.4rem; }

.rv-notice { max-width:55rem; margin:2rem auto; padding:1rem 1.2rem; border-left:4px solid var(--red); background:#fff; }

@media (max-width:980px) {
  .menu-toggle { display:inline-flex; }
  .main-nav { position:absolute; left:4vw; right:4vw; top:4.6rem; display:none; flex-direction:column; align-items:stretch; gap:0; padding:1rem; background:#fff; border:1px solid var(--line); box-shadow:0 18px 45px rgba(17,19,23,.12); }
  .main-nav.open { display:flex; }
  .main-nav a { padding:.9rem; }
  .hero { grid-template-columns:1fr; padding-top:4rem; }
  .hero-visual { min-height:35rem; max-width:42rem; margin:0 auto; }
  .service-grid { grid-template-columns:repeat(2,1fr); }
  .method { grid-template-columns:1fr; }
  .method-intro { position:static; }
  .instagram-grid { grid-template-columns:repeat(2,1fr); }
  .contact-section { grid-template-columns:1fr; }
  .site-footer { grid-template-columns:1fr; }
}

@media (max-width:782px) { body.admin-bar .site-header { top:46px; } }

@media (max-width:680px) {
  .site-header { min-height:4.5rem; padding-inline:1rem; }
  .rv-brand { width:3.45rem; height:3rem; }
  .hero { min-height:auto; grid-template-columns:minmax(0,1fr); gap:1.5rem; padding:3.2rem 1rem 2rem; }
  h1 { font-size:clamp(3.1rem,16vw,4.6rem); }
  .hero-actions { flex-direction:column; }
  .button { width:100%; }
  .hero-proof { grid-template-columns:1fr; gap:.8rem; }
  .hero-visual { min-height:30rem; width:100%; }
  .result-card { left:0; top:8%; }
  .mascot { max-height:31rem; }
  .statement,.section { padding:5rem 1rem; }
  .section-heading { align-items:start; flex-direction:column; gap:1rem; }
  .service-grid,.project-grid,.instagram-grid { grid-template-columns:1fr; }
  .service-card { min-height:17rem; }
  .method { gap:2.5rem; }
  .project-card { min-height:21rem; }
  .testimonial-carousel { padding:0 2.4rem; }
  .testimonial-track { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
  .contact-form { padding:1.2rem; }
  .site-footer { padding:2rem 1rem; }
  .footer-links { flex-direction:column; gap:.5rem; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none!important; }
}
