/*
Theme Name: Concretizar Concretos
Theme URI: https://usinaconcretizar.com.br
Author: Concretizar Concretos
Author URI: https://usinaconcretizar.com.br
Description: Tema institucional para a Concretizar Concretos — concreto usinado, argamassa, autonivelante e concreto projetado. Inclui homepage com hero, seção de produtos, sobre, estatísticas e formulário de contato integrado.
Version: 1.2.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: concretizar
Tags: business, blue, two-columns, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/


:root {
  --radius: 0.5rem;
  --background: #ffffff;
  --foreground: #0f172a;
  --primary: #1d4fd8;
  --primary-foreground: #ffffff;
  --primary-dark: #0f2d6b;
  --primary-light: #4d8bf0;
  --secondary: #f0f4fa;
  --secondary-foreground: #111827;
  --muted: #f4f6fb;
  --muted-foreground: #64748b;
  --accent: #e8eefb;
  --accent-foreground: #1e3a8a;
  --card: #ffffff;
  --card-foreground: #0f172a;
  --popover: #ffffff;
  --popover-foreground: #0f172a;
  --destructive: #dc2626;
  --destructive-foreground: #ffffff;
  --border: #dfe4ec;
  --input: #dfe4ec;
  --ring: #3b6fd9;
  --whatsapp: #25d366;
  --gradient-hero: linear-gradient(135deg, rgba(15,45,107,0.92), rgba(29,79,216,0.75));
  --gradient-brand: linear-gradient(135deg, var(--primary-dark), var(--primary));
  --shadow-elegant: 0 20px 50px -20px rgba(15,45,107,0.35);
  --shadow-card: 0 10px 30px -15px rgba(15,45,107,0.2);
}

* { margin: 0; padding: 0; box-sizing: border-box; border-color: var(--border); }
html { scroll-behavior: smooth; }
body { font-family: "Inter", system-ui, sans-serif; background: var(--background); color: var(--foreground); -webkit-font-smoothing: antialiased; }
h1,h2,h3,h4,h5,h6 { font-family: "Montserrat", system-ui, sans-serif; letter-spacing: -0.02em; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
button { cursor: pointer; border: none; font-family: inherit; }
input, textarea { font-family: inherit; }

.container { width: 100%; max-width: 80rem; margin: 0 auto; padding: 0 1.5rem; }

/* Header */
.header { position: sticky; top: 0; z-index: 40; width: 100%; border-bottom: 1px solid rgba(223,228,236,0.6); background: rgba(255,255,255,0.85); backdrop-filter: blur(12px); }
.header .container { display: flex; height: 5rem; align-items: center; justify-content: space-between; }
.logo { display: flex; align-items: center; gap: 0.5rem; }
.logo-icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 0.375rem; color: #fff; font-family: "Montserrat", sans-serif; font-weight: 900; font-size: 1.125rem; background: var(--gradient-brand); }
.logo-text { line-height: 1.2; }
.logo-brand { font-family: "Montserrat", sans-serif; font-size: 1.125rem; font-weight: 800; color: var(--primary-dark); }
.logo-sub { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.18em; color: var(--muted-foreground); }
.nav { display: none; align-items: center; gap: 2rem; }
.nav a { font-size: 0.875rem; font-weight: 600; color: rgba(15,23,42,0.8); transition: color 0.2s; }
.nav a:hover { color: var(--primary); }
.btn-primary { display: inline-flex; align-items: center; gap: 0.5rem; border-radius: 0.375rem; padding: 0.625rem 1.25rem; font-size: 0.875rem; font-weight: 700; color: #fff; background: var(--gradient-brand); box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1); transition: transform 0.2s; }
.btn-primary:hover { transform: translateY(-2px); }
.btn-hero { display: inline-flex; align-items: center; gap: 0.5rem; border-radius: 0.375rem; padding: 1rem 1.75rem; font-size: 0.875rem; font-weight: 700; background: #fff; color: var(--primary-dark); box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1); transition: transform 0.2s; }
.btn-hero:hover { transform: translateY(-2px); }
.btn-outline { display: inline-flex; align-items: center; gap: 0.5rem; border-radius: 0.375rem; border: 2px solid rgba(255,255,255,0.4); background: rgba(255,255,255,0.05); padding: 1rem 1.75rem; font-size: 0.875rem; font-weight: 700; color: #fff; backdrop-filter: blur(4px); transition: background 0.2s; }
.btn-outline:hover { background: rgba(255,255,255,0.15); }
.header-cta { display: none; }

/* Hero */
.hero { position: relative; overflow: hidden; }
.hero-bg { position: absolute; inset: 0; z-index: -10; width: 100%; height: 100%; object-fit: cover; }
.hero-overlay { position: absolute; inset: 0; z-index: -10; background: var(--gradient-hero); }
.hero .container { padding-top: 7rem; padding-bottom: 7rem; }
.hero-badge { display: inline-flex; align-items: center; gap: 0.5rem; border-radius: 9999px; background: rgba(255,255,255,0.1); padding: 0.375rem 1rem; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.18em; color: #fff; backdrop-filter: blur(4px); margin-bottom: 1rem; }
.hero-badge .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--primary-light); }
.hero h1 { font-size: 2.5rem; font-weight: 900; line-height: 1.05; color: #fff; max-width: 48rem; }
.hero h1 span { color: var(--primary-light); }
.hero p { margin-top: 1.5rem; font-size: 1.125rem; color: rgba(255,255,255,0.85); max-width: 42rem; }
.hero-buttons { margin-top: 2.5rem; display: flex; flex-wrap: wrap; gap: 1rem; }

/* Features */
.features { border-bottom: 1px solid var(--border); background: rgba(240,244,250,0.6); padding: 4rem 0; }
.features-grid { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
.feature-card { border-radius: 0.75rem; border: 1px solid var(--border); background: var(--card); padding: 1.75rem; transition: all 0.3s; box-shadow: var(--shadow-card); }
.feature-card:hover { transform: translateY(-4px); border-color: rgba(29,79,216,0.3); }
.feature-icon { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 0.5rem; color: #fff; background: var(--gradient-brand); margin-bottom: 1.25rem; }
.feature-icon svg { width: 1.5rem; height: 1.5rem; }
.feature-card h3 { font-size: 1.125rem; font-weight: 700; color: var(--primary-dark); margin-bottom: 0.5rem; }
.feature-card p { font-size: 0.875rem; line-height: 1.625; color: var(--muted-foreground); }

/* About */
.about { padding: 6rem 0; }
.about-grid { display: grid; align-items: center; gap: 3.5rem; }
.about-label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--primary); margin-bottom: 0.75rem; }
.about h2 { font-size: 1.875rem; font-weight: 800; line-height: 1.25; color: var(--primary-dark); }
.about-text { margin-top: 1.5rem; font-size: 1rem; line-height: 1.625; color: var(--muted-foreground); }
.about-list { margin-top: 2rem; display: flex; flex-direction: column; gap: 0.75rem; }
.about-list li { display: flex; align-items: flex-start; gap: 0.75rem; }
.about-list li svg { width: 1.25rem; height: 1.25rem; flex: none; margin-top: 2px; color: var(--primary); }
.about-list li span { font-weight: 500; color: rgba(15,23,42,0.9); }
.about-image-wrap { position: relative; }
.about-glow { position: absolute; inset: -1rem; z-index: -10; border-radius: 1.5rem; opacity: 0.2; filter: blur(16px); background: var(--gradient-brand); }
.about-image { width: 100%; aspect-ratio: 4/3; border-radius: 1rem; object-fit: cover; box-shadow: var(--shadow-elegant); }
.about-badge { position: absolute; bottom: -1.5rem; left: -1.5rem; display: none; border-radius: 0.75rem; background: var(--card); padding: 1.25rem; box-shadow: var(--shadow-card); }
.about-badge .num { font-family: "Montserrat", sans-serif; font-size: 1.875rem; font-weight: 900; color: var(--primary); }
.about-badge .label { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted-foreground); }

/* Products */
.products { background: rgba(240,244,250,0.5); padding: 6rem 0; }
.products-header { text-align: center; max-width: 42rem; margin: 0 auto 3.5rem; }
.products-header .label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--primary); margin-bottom: 0.75rem; }
.products-header h2 { font-size: 1.875rem; font-weight: 800; color: var(--primary-dark); }
.products-header p { margin-top: 1rem; color: var(--muted-foreground); }
.products-grid { display: grid; gap: 1.75rem; grid-template-columns: 1fr; }
.product-card { overflow: hidden; border-radius: 0.75rem; border: 1px solid var(--border); background: var(--card); transition: all 0.3s; box-shadow: var(--shadow-card); }
.product-card:hover { transform: translateY(-6px); }
.product-img { overflow: hidden; aspect-ratio: 4/3; }
.product-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.product-card:hover .product-img img { transform: scale(1.05); }
.product-body { padding: 1.5rem; }
.product-body h3 { font-family: "Montserrat", sans-serif; font-size: 1.125rem; font-weight: 700; color: var(--primary-dark); margin-bottom: 0.5rem; }
.product-body p { font-size: 0.875rem; line-height: 1.625; color: var(--muted-foreground); }

/* Stats */
.stats { padding: 5rem 0; color: #fff; background: var(--gradient-brand); }
.stats-grid { display: grid; gap: 2.5rem; text-align: center; grid-template-columns: 1fr; }
.stats-grid .num { font-family: "Montserrat", sans-serif; font-size: 2.25rem; font-weight: 900; }
.stats-grid .label { margin-top: 0.5rem; font-size: 0.875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: rgba(255,255,255,0.8); }

/* Contact */
.contact { padding: 6rem 0; }
.contact-grid { display: grid; gap: 3rem; }
.contact-info .label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: var(--primary); margin-bottom: 0.75rem; }
.contact-info h2 { font-size: 1.875rem; font-weight: 800; color: var(--primary-dark); }
.contact-info > p { margin-top: 1rem; color: var(--muted-foreground); }
.contact-items { margin-top: 2rem; display: flex; flex-direction: column; gap: 1.25rem; }
.contact-item { display: flex; align-items: flex-start; gap: 1rem; }
.contact-icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; flex: none; border-radius: 0.5rem; color: #fff; background: var(--gradient-brand); }
.contact-icon svg { width: 1.25rem; height: 1.25rem; }
.contact-item .item-label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted-foreground); }
.contact-item .item-value { font-weight: 600; color: var(--foreground); }
.contact-form { border-radius: 1rem; border: 1px solid var(--border); background: var(--card); padding: 2rem; box-shadow: var(--shadow-card); }
.form-grid { display: grid; gap: 1.25rem; }
.form-row { display: grid; gap: 1.25rem; }
.form-group label { display: block; margin-bottom: 0.375rem; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted-foreground); }
.form-group input, .form-group textarea { width: 100%; border-radius: 0.375rem; border: 1px solid var(--input); background: var(--background); padding: 0.75rem 1rem; font-size: 0.875rem; color: var(--foreground); outline: none; transition: border-color 0.2s, box-shadow 0.2s; }
.form-group input:focus, .form-group textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(29,79,216,0.2); }
.form-group textarea { resize: vertical; }

/* Footer */
.footer { background: var(--primary-dark); color: #fff; padding: 3rem 0 1.5rem; }
.footer * { color: rgba(255,255,255,.85); }
.footer-grid { display: grid; gap: 2rem; grid-template-columns: 1fr; }
.footer-brand { font-family: "Montserrat", sans-serif; font-size: 1.25rem; font-weight: 800; color: #fff !important; margin-bottom: .75rem; }
.footer p { font-size: 0.875rem; color: rgba(255,255,255,.7); line-height: 1.625; }
.footer-title { font-size: 0.75rem; font-weight: 700; color: rgba(255,255,255,.6) !important; text-transform: uppercase; letter-spacing: .08em; margin-bottom: .75rem; }
.footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.footer ul li, .footer ul a { font-size: 0.875rem; color: rgba(255,255,255,.85); text-decoration: none; transition: color .2s; }
.footer ul a:hover { color: #fff !important; }
.footer-bottom { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.1); text-align: center; font-size: 0.75rem; color: rgba(255,255,255,.6) !important; }

/* Floating WhatsApp */
.whats-float, .whatsapp-float { position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 50; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: #25D366; color: #fff !important; display: grid; place-items: center; box-shadow: 0 10px 25px -5px rgba(37,211,102,0.5); transition: transform 0.2s; }
.whats-float:hover, .whatsapp-float:hover { transform: scale(1.1); }
.whats-float svg, .whatsapp-float svg { width: 1.75rem; height: 1.75rem; stroke: #fff; }

/* Responsive */
@media (min-width: 640px) {
  .hero h1 { font-size: 3rem; }
  .features-grid { grid-template-columns: repeat(2, 1fr); }
  .products-grid { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .about-badge { display: block; }
  .form-row { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 768px) {
  .nav { display: flex; }
  .header-cta { display: inline-flex; }
  .hero h1 { font-size: 3.5rem; }
  .about h2, .products-header h2, .contact-info h2 { font-size: 2.25rem; }
}
@media (min-width: 1024px) {
  .hero h1 { font-size: 4.5rem; }
  .features-grid { grid-template-columns: repeat(4, 1fr); }
  .products-grid { grid-template-columns: repeat(4, 1fr); }
  .stats-grid { grid-template-columns: repeat(4, 1fr); }
  .about-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 2fr 1fr 1fr 1fr; }
  .footer-bottom { flex-direction: row; justify-content: space-between; text-align: left; }
}

/* ===== Extras WordPress: páginas internas, formulário e CTA ===== */
.grid-2{display:grid;grid-template-columns:1fr;gap:28px;}
@media(min-width:880px){.grid-2{grid-template-columns:1fr 1fr;}}
.produtos-detalhe .product-card{display:flex;flex-direction:column;}
.btn-block{display:block;width:100%;text-align:center;}
.contact{padding:60px 0 80px;background:#f6f9ff;}
.contact-grid{display:grid;grid-template-columns:1fr;gap:40px;}
@media(min-width:960px){.contact-grid{grid-template-columns:1fr 1.1fr;}}
.contact-list{list-style:none;padding:0;margin:24px 0 0;}
.contact-list li{display:flex;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px dashed #d6e0f3;font-size:.95rem;}
.contact-list li strong{color:#0b2e8c;text-transform:uppercase;letter-spacing:.08em;font-size:.78rem;}
.contact-list li a{color:#1d4fd8;text-decoration:none;font-weight:600;}
.contact-form{background:#fff;padding:28px;border:1px solid #e2e8f5;border-radius:14px;box-shadow:0 10px 30px -18px rgba(15,42,120,.25);}
.contact-form .field{margin-bottom:16px;}
.contact-form .row{display:grid;grid-template-columns:1fr;gap:16px;}
@media(min-width:640px){.contact-form .row{grid-template-columns:1fr 1fr;}}
.contact-form label{display:block;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#475569;margin-bottom:6px;}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;padding:12px 14px;border:1px solid #cdd6ea;border-radius:8px;font:inherit;background:#fff;outline:none;transition:border-color .15s, box-shadow .15s;}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#1d4fd8;box-shadow:0 0 0 3px rgba(29,79,216,.18);}
.contact-form .form-note{margin-top:10px;font-size:.8rem;color:#64748b;text-align:center;}
.cta{padding:64px 0;}
.cta-box{background:var(--gradient-brand,linear-gradient(135deg,#1d4fd8,#2563eb));color:#fff;text-align:center;padding:48px 24px;border-radius:18px;}
.cta-box h2{font-family:var(--font-display,'Montserrat',sans-serif);font-size:1.9rem;margin:0 0 8px;}
.cta-box p{margin:0 0 22px;opacity:.9;}
.cta-box .btn-primary{background:#fff;color:#0b2e8c;}
.btn-ghost{display:inline-block;padding:14px 26px;border-radius:8px;border:2px solid rgba(255,255,255,.45);color:#fff;font-weight:700;text-decoration:none;backdrop-filter:blur(4px);}
.btn-ghost:hover{background:rgba(255,255,255,.15);}
.nav .nav-menu{display:flex;gap:28px;list-style:none;margin:0;padding:0;}
.nav .nav-menu a{color:inherit;text-decoration:none;font-weight:600;font-size:.95rem;}
.nav .nav-menu a:hover{color:#1d4fd8;}

/* ===== Aliases de classes usadas nos templates PHP ===== */
.grid-4{display:grid;gap:1.5rem;grid-template-columns:1fr;}
@media(min-width:640px){.grid-4{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1024px){.grid-4{grid-template-columns:repeat(3,1fr);}}

.eyebrow{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.2em;color:var(--primary);margin-bottom:.75rem;}

.section-head{text-align:center;max-width:42rem;margin:0 auto 3.5rem;}
.section-head h2{font-size:1.875rem;font-weight:800;color:var(--primary-dark);}
.section-head p{margin-top:1rem;color:var(--muted-foreground);}
@media(min-width:768px){.section-head h2{font-size:2.25rem;}}

.check-list{margin-top:2rem;display:flex;flex-direction:column;gap:.75rem;list-style:none;padding:0;}
.check-list li{position:relative;padding-left:1.75rem;font-weight:500;color:rgba(15,23,42,.9);}
.check-list li::before{content:"✓";position:absolute;left:0;top:0;color:var(--primary);font-weight:800;}

.about-grid{display:grid;align-items:center;gap:3.5rem;grid-template-columns:1fr;}
@media(min-width:1024px){.about-grid{grid-template-columns:1fr 1fr;}}
.about-img{position:relative;}
.about-img img{width:100%;aspect-ratio:4/3;border-radius:1rem;object-fit:cover;box-shadow:var(--shadow-elegant);}
.about-img .about-badge{position:absolute;bottom:-1.5rem;left:-1.5rem;display:none;border-radius:.75rem;background:var(--card);padding:1.25rem;box-shadow:var(--shadow-card);}
.about-img .about-badge strong{display:block;font-family:"Montserrat",sans-serif;font-size:1.875rem;font-weight:900;color:var(--primary);}
.about-img .about-badge span{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted-foreground);}
@media(min-width:640px){.about-img .about-badge{display:block;}}

.about h2{font-size:1.875rem;font-weight:800;line-height:1.25;color:var(--primary-dark);}
@media(min-width:768px){.about h2{font-size:2.25rem;}}

.stats .grid-4{gap:2.5rem;text-align:center;}
.stat-num{font-family:"Montserrat",sans-serif;font-size:2.25rem;font-weight:900;color:#fff;}
.stat-label{margin-top:.5rem;font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:rgba(255,255,255,.85);}

.features .grid-4{gap:1.5rem;}
.products .grid-4{gap:1.75rem;}

/* ===== Estilos adicionais (páginas internas, formulário, mensagens) ===== */
.notice-success{background:#e8f5ee;color:#0f5132;border:1px solid #badbcc;padding:14px 18px;border-radius:8px;margin-bottom:24px;font-weight:600;}
.notice-error{background:#fdecea;color:#842029;border:1px solid #f5c2c7;padding:14px 18px;border-radius:8px;margin-bottom:24px;font-weight:600;}
.page-hero{padding:80px 0 60px;background:var(--gradient-brand,linear-gradient(135deg,#1d4fd8,#2563eb));color:#fff;text-align:center;}
.page-hero h1{font-family:var(--font-display,'Montserrat',sans-serif);font-size:clamp(2rem,4vw,3.5rem);font-weight:800;margin:0 0 12px;}
.page-hero p{max-width:680px;margin:0 auto;opacity:.9;font-size:1.05rem;}
.page-content{padding:60px 0;}
.page-content .container{max-width:900px;}
.page-content h2{font-family:var(--font-display,'Montserrat',sans-serif);color:#0b2e8c;margin-top:32px;}