/*
Theme Name: Seguroso Pro
Theme URI: https://www.seguroso.shop
Author: ChatGPT
Author URI: https://openai.com
Description: Tema profesional para Seguroso — tienda WooCommerce, suscripciones y panel IoT integrado con Seguroso API.
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: seguroso-pro
*/
:root{
  --blue:#0b3d91;
  --orange:#ff6600;
  --bg:#f7f9fc;
  --text:#0b1a2b;
  --muted:#6b7b8a;
}
body{font-family: 'Poppins', Arial, sans-serif; background:var(--bg); color:var(--text); margin:0;}
.header{background:#fff; border-bottom:1px solid #e6eef6; padding:18px 24px; display:flex; align-items:center; gap:18px;}
.header .logo img{height:48px;}
.header .nav{margin-left:auto; display:flex; gap:12px; align-items:center;}
.header .btn{padding:10px 14px; border-radius:6px; text-decoration:none; font-weight:700;}
.header .btn-primary{background:var(--orange); color:#fff;}
.hero{background:linear-gradient(90deg, rgba(11,61,145,0.05), rgba(255,102,0,0.03)); padding:56px 0;}
.container{max-width:1140px; margin:0 auto; padding:0 18px;}
.hero .grid{display:flex; gap:24px; align-items:center; justify-content:space-between;}
.hero h1{color:var(--blue); font-size:34px; margin:0 0 12px;}
.hero p{color:var(--muted); margin:0 0 16px;}
.card{background:#fff; border-radius:10px; padding:18px; box-shadow:0 6px 18px rgba(11,26,43,0.06); border:1px solid #eef6fb;}
.devices-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; margin-top:16px;}
.device-card{padding:14px; border-radius:8px; background:linear-gradient(180deg,#ffffff,#fbfdff); border:1px solid #e9f1fb;}
.device-card h3{margin:0 0 6px; color:var(--blue);}
.device-state{font-weight:800;}
.btn-outline{border:1px solid #cfe0fa; background:transparent; color:var(--blue); padding:8px 12px; border-radius:6px;}
.footer{background:#fff; padding:28px 18px; margin-top:36px; border-top:1px solid #e6eef6; text-align:center; color:var(--muted);}
@media(max-width:800px){
  .hero .grid{flex-direction:column; text-align:center;}
  .header{padding:12px;}
}
