/*
Theme Name: HydroCenter Em Construção
Theme URI: https://hydrocenterpiscinas.com.br
Author: HydroCenter Piscinas
Author URI: https://hydrocenterpiscinas.com.br
Description: Tema temporário "Site em Construção" para HydroCenter Piscinas. Página única com identidade visual da loja.
Version: 1.0.0
Requires at least: 5.0
Tested up to: 6.6
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hydrocenter-construcao
*/

:root{
  --hc-deep:#0F3D58;
  --hc-blue:#4FA3C7;
  --hc-mist:#DCEAF1;
  --hc-sun:#E9B84B;
  --hc-bg:#F4F9FC;
  --hc-text:#1B2A3B;
}

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

html,body{height:100%;}

body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  background:linear-gradient(135deg,var(--hc-bg) 0%,var(--hc-mist) 100%);
  color:var(--hc-text);
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  -webkit-font-smoothing:antialiased;
  position:relative;
  overflow-x:hidden;
}

body::before{
  content:"";
  position:absolute;
  top:-200px;right:-200px;
  width:500px;height:500px;
  background:radial-gradient(circle,rgba(79,163,199,.18) 0%,transparent 70%);
  border-radius:50%;
  pointer-events:none;
}

body::after{
  content:"";
  position:absolute;
  bottom:-200px;left:-200px;
  width:500px;height:500px;
  background:radial-gradient(circle,rgba(233,184,75,.12) 0%,transparent 70%);
  border-radius:50%;
  pointer-events:none;
}

.wrap{
  position:relative;
  z-index:1;
  max-width:560px;
  width:100%;
  text-align:center;
  background:#fff;
  padding:56px 40px;
  border-radius:16px;
  box-shadow:0 20px 60px rgba(15,61,88,.12),0 2px 6px rgba(15,61,88,.06);
  border:1px solid rgba(79,163,199,.15);
}

.logo{
  width:140px;
  height:140px;
  object-fit:contain;
  margin:0 auto 28px;
  display:block;
}

.tag{
  display:inline-block;
  font-size:11px;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--hc-sun);
  background:rgba(233,184,75,.10);
  border:1px solid rgba(233,184,75,.35);
  padding:6px 14px;
  border-radius:100px;
  margin-bottom:20px;
}

h1{
  font-family:'Inter',sans-serif;
  font-size:clamp(28px,4vw,40px);
  font-weight:700;
  color:var(--hc-deep);
  line-height:1.15;
  letter-spacing:-.02em;
  margin-bottom:16px;
}

h1 em{
  color:var(--hc-blue);
  font-style:normal;
}

p.lead{
  font-size:16px;
  line-height:1.6;
  color:#4A5A6E;
  margin-bottom:32px;
}

.divider{
  width:60px;
  height:3px;
  background:var(--hc-sun);
  border-radius:2px;
  margin:0 auto 28px;
}

.contact{
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:center;
}

.contact a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:15px;
  font-weight:600;
  color:var(--hc-deep);
  text-decoration:none;
  padding:12px 24px;
  background:var(--hc-mist);
  border-radius:100px;
  transition:all .25s ease;
}

.contact a:hover{
  background:var(--hc-deep);
  color:#fff;
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(15,61,88,.20);
}

.contact a.wa{
  background:#25D366;
  color:#fff;
}

.contact a.wa:hover{
  background:#1da851;
}

footer{
  margin-top:36px;
  font-size:12px;
  color:#8A99AB;
  letter-spacing:.04em;
}

@media (max-width:480px){
  .wrap{padding:40px 24px;}
  .logo{width:110px;height:110px;margin-bottom:20px;}
  .contact a{font-size:14px;padding:10px 20px;}
}