
/*
 Theme Name: Astra HB Child
 Theme URI: https://hbsystems.solutions/
 Description: Child theme for Astra with HB Systems typography and responsive styles (desktop, tablet, mobile).
 Author: HB Systems
 Author URI: https://hbsystems.com.mx/
 Template: astra
 Version: 1.0.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: astra-hb-child
*/

/* ====== CSS Variables (HB) ====== */
:root{
  --hb-primary:#0a3d58;   /* azul HB */
  --hb-accent:#74ddcf;    /* turquesa HB */
  --hb-white:#ffffff;
  --hb-dark:#0b2230;
  --hb-gray:#777777;
  --hb-radius:14px;
  --hb-shadow:0 6px 18px rgba(10,61,88,.12);

  /* Typography families */
  --hb-font-body: "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --hb-font-head: "Plus Jakarta Sans", "Poppins", "Inter", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
}

/* ====== Base Typography (Desktop defaults) ====== */
html{ box-sizing:border-box; }
*, *:before, *:after{ box-sizing:inherit; }

body{
  font-family: var(--hb-font-body);
  font-size: 17px;
  line-height: 1.65;
  color: var(--hb-dark);
  background:#fff;
}

/* Headings base (desktop) */
h1,h2,h3,h4,h5,h6{ font-family: var(--hb-font-head); line-height:1.2; margin:0 0 .6rem; color:var(--hb-primary); }
h1{ font-size:48px; }
h2{ font-size:36px; }
h3{ font-size:24px; }
h4{ font-size:20px; }
h5{ font-size:18px; }
h6{ font-size:15px; }

/* Links & buttons */
a{ color:var(--hb-primary); text-decoration:none; }
a:hover{ color:var(--hb-accent); }

.wp-block-button__link,
button, .button, input[type=submit], .ast-button, .menu-toggle,
.ast-custom-button, .theme-button{
  background:var(--hb-primary);
  color:var(--hb-white);
  border:none; border-radius:var(--hb-radius);
  padding:.8rem 1.2rem; box-shadow:var(--hb-shadow);
  transition:.2s ease-in-out;
}
.wp-block-button__link:hover,
button:hover, .button:hover, input[type=submit]:hover, .ast-button:hover{
  transform:translateY(-1px);
  background:linear-gradient(0deg, var(--hb-primary) 0%, var(--hb-primary) 40%, var(--hb-accent) 100%);
}

/* Secondary button utility */
.hb-btn-secondary{ background:var(--hb-accent)!important; color:var(--hb-primary)!important; }

/* Header nav */
.main-header-menu .menu-link{ padding:.6rem .9rem; border-radius:10px; }
.main-header-menu .menu-link:hover{ background:rgba(116,221,207,.12); }

/* Container width helpers (safe with Astra) */
.ast-container, .entry-content .alignwide{ max-width:1240px; }
.entry-content .alignfull{ margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); }

/* Hero & cards */
.hb-hero{
  padding:72px 0; border-radius:24px;
  background:
    radial-gradient(700px 280px at 10% 10%, rgba(116,221,207,.15), transparent 60%),
    radial-gradient(700px 280px at 90% 10%, rgba(10,61,88,.10), transparent 60%),
    #f7fbfd;
  border:1px solid rgba(10,61,88,.06);
  box-shadow:var(--hb-shadow);
}
.hb-card{
  background:#fff; border:1px solid rgba(10,61,88,.10);
  border-radius:var(--hb-radius); padding:1.2rem; box-shadow:var(--hb-shadow);
}

/* Lists with check */
.hb-check li{ list-style:none; padding-left:1.8rem; position:relative; margin:.4rem 0; }
.hb-check li:before{ content:"✔"; position:absolute; left:.2rem; top:.05rem; font-weight:700; color:var(--hb-accent); }

/* Forms */
input, select, textarea{ border:1px solid rgba(10,61,88,.25); border-radius:12px; padding:.7rem .9rem; }
input:focus, select:focus, textarea:focus{ outline:none; border-color:var(--hb-accent); box-shadow:0 0 0 3px rgba(116,221,207,.25); }

/* Tables */
table{ width:100%; border-collapse:separate; border-spacing:0; }
th, td{ padding:.75rem .9rem; border-bottom:1px solid rgba(10,61,88,.10); }
thead th{ background:#f0f7f6; color:var(--hb-primary); }
tr:hover td{ background:#fbfefe; }

/* Footer */
.site-footer{ background:#081d29; color:#c7d6dd; }
.site-footer a{ color:#e9fbf8; }
.site-footer a:hover{ color:#74ddcf; }

/* ====== Responsive Typography ====== */
/* Tablet (<=1024px) */
@media (max-width: 1024px){
  body{ font-size:16px; }
  h1{ font-size:36px; }
  h2{ font-size:28px; }
  h3{ font-size:22px; }
  h4{ font-size:19px; }
  h5{ font-size:17px; }
  h6{ font-size:15px; }
  .hb-hero{ padding:56px 0; }
}

/* Mobile (<=600px) */
@media (max-width: 600px){
  body{ font-size:15px; }
  h1{ font-size:30px; }
  h2{ font-size:24px; }
  h3{ font-size:20px; }
  h4{ font-size:18px; }
  h5{ font-size:16px; }
  h6{ font-size:15px; }
  .hb-hero{ padding:44px 0; border-radius:18px; }
}

/* Utilities */
.mt-0{ margin-top:0!important; } .mb-0{ margin-bottom:0!important; }
.mt-2{ margin-top:.5rem!important; } .mb-2{ margin-bottom:.5rem!important; }
.mt-4{ margin-top:1rem!important; } .mb-4{ margin-bottom:1rem!important; }
.p-2{ padding:.5rem!important; } .p-4{ padding:1rem!important; }

/* Header background gradient HB */
.site-header,
.ast-primary-header-bar {
  background: linear-gradient(90deg, #0a3d58 0%, #081d29 100%) !important;
}

/* Por si queires otro degradado
.site-header,
.ast-primary-header-bar {
  background: linear-gradient(90deg, #0a3d58 0%, #74ddcf 100%) !important;
}
*/
/* base style placeholder */

/* === Blog Grid responsiveness === */
.wp-block-post-template.is-layout-grid{ gap:20px; }
@media (max-width:1024px){
  .wp-block-post-template.is-layout-grid{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width:600px){
  .wp-block-post-template.is-layout-grid{ grid-template-columns: 1fr !important; }
  .wp-block-post-excerpt__more-link{ display:inline-block; margin-top:.25rem; }
}
.wp-block-post-featured-image img{ object-fit:cover; width:100%; height:100%; border-radius:14px; }


