/*
Theme Name: Garal Soluciones Studio
Theme URI: https://garalsoluciones.com/
Author: Garal Soluciones
Author URI: https://garalsoluciones.com/
Description: Tema corporativo minimalista para Garal Soluciones: marketing, desarrollo web, diseño, asesoría y gestoría online.
Requires at least: 6.3
Tested up to: 6.8
Requires PHP: 7.4
Version: 3.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: garal-soluciones-studio
*/

:root{
  --garal-navy:#061227;
  --garal-navy-2:#0b1d38;
  --garal-blue:#004aad;
  --garal-blue-soft:#eaf2ff;
  --garal-red:#ef0000;
  --garal-ink:#101722;
  --garal-muted:#667085;
  --garal-line:#dfe5ee;
  --garal-paper:#ffffff;
  --garal-soft:#f4f7fb;
  --garal-radius:8px;
  --garal-shadow:0 24px 80px rgba(6,18,39,.14);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--garal-ink);
  background:var(--garal-paper);
  font-family:Inter,Arial,Helvetica,sans-serif;
  line-height:1.55;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto}
a{color:inherit}
button,input,select,textarea{font:inherit}
.wp-site-blocks{min-height:100vh;display:flex;flex-direction:column}
.wp-site-blocks>main{flex:1}
.alignfull{width:100%}
.has-global-padding{padding-left:24px;padding-right:24px}

.garal-site-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:#fff !important;
  color:var(--garal-ink) !important;
  border-bottom:1px solid rgba(16,23,34,.1);
  box-shadow:0 8px 28px rgba(6,18,39,.07);
}
.garal-header,
.garal-site-header.is-scrolled,
.garal-header.is-scrolled{
  position:sticky;
  top:0;
  z-index:1000;
  background:#fff !important;
  color:var(--garal-ink) !important;
  border-bottom:1px solid rgba(16,23,34,.1);
  box-shadow:0 8px 28px rgba(6,18,39,.07);
}
.admin-bar .garal-site-header{top:32px}
.admin-bar .garal-header{top:32px}
.garal-site-header .wp-block-group{
  min-height:78px;
}
.garal-brand{
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--garal-ink);
  text-decoration:none;
}
.garal-brand-mark{
  width:34px;
  height:34px;
  border-radius:50%;
  border:4px solid var(--garal-blue);
  position:relative;
  display:inline-block;
}
.garal-brand-mark:before,
.garal-brand-mark:after{
  content:"";
  position:absolute;
  background:var(--garal-red);
}
.garal-brand-mark:before{
  width:11px;
  height:11px;
  border-radius:50%;
  left:7px;
  top:7px;
}
.garal-brand-mark:after{
  width:18px;
  height:4px;
  right:-15px;
  top:12px;
}
.garal-site-title{
  margin:0;
  color:var(--garal-ink);
  font-size:18px;
  font-weight:900;
  line-height:1;
  text-transform:uppercase;
}
.garal-site-title small{
  display:block;
  margin-top:4px;
  color:var(--garal-muted);
  font-size:11px;
  font-weight:800;
  letter-spacing:0;
}
.garal-main-nav .wp-block-navigation-item__content{
  color:var(--garal-ink) !important;
  font-size:14px;
  font-weight:800;
  text-decoration:none;
}
.garal-header .wp-block-navigation-item__content{
  color:var(--garal-ink) !important;
}
.garal-main-nav .wp-block-navigation-item__content:hover{color:var(--garal-red) !important}
.garal-main-nav .wp-block-navigation__responsive-container.is-menu-open{
  background:#fff;
  color:var(--garal-ink);
  padding:24px;
}
.garal-nav-cta .wp-block-navigation-item__content{
  background:var(--garal-red) !important;
  color:#fff !important;
  border-radius:999px;
  padding:12px 18px !important;
  box-shadow:0 12px 30px rgba(239,0,0,.2);
}
.garal-header .wp-block-button__link,
.garal-header .garal-nav-cta .wp-block-navigation-item__content{
  background:var(--garal-red) !important;
  color:#fff !important;
}
.garal-nav-cta .wp-block-navigation-item__content:hover{
  background:#cf0000 !important;
  color:#fff !important;
}

.garal-button,
.garal-submit,
.garal-link-button a,
.wp-block-button__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  border:0;
  border-radius:999px;
  background:var(--garal-red);
  color:#fff !important;
  padding:13px 22px;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 16px 36px rgba(239,0,0,.2);
}
.garal-button:hover,
.garal-submit:hover,
.garal-link-button a:hover,
.wp-block-button__link:hover{
  background:#cf0000;
  color:#fff !important;
}
.garal-button.is-secondary,
.is-style-outline>.wp-block-button__link{
  background:transparent;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.42);
  box-shadow:none;
}

.garal-kicker,
.garal-eyebrow{
  margin:0 0 14px;
  color:var(--garal-red) !important;
  font-size:13px !important;
  font-weight:950;
  line-height:1.25;
  letter-spacing:0 !important;
  text-transform:uppercase;
}
.garal-lead{
  max-width:780px;
  color:inherit;
  font-size:21px;
  line-height:1.56;
}
.garal-section-title{
  max-width:980px;
  margin:0;
  color:var(--garal-ink);
  font-size:56px;
  line-height:.98;
  font-weight:950;
}

.garal-hero{
  position:relative;
  overflow:hidden;
  min-height:calc(100vh - 78px);
  color:#fff;
  background:
    radial-gradient(circle at 78% 18%,rgba(0,74,173,.5),transparent 26%),
    radial-gradient(circle at 18% 78%,rgba(239,0,0,.2),transparent 24%),
    linear-gradient(135deg,#050914 0%,#07152e 58%,#061227 100%);
}
.garal-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:52px 52px;
  opacity:.7;
}
.garal-hero-inner{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  gap:48px;
  align-items:center;
  max-width:1280px;
  min-height:calc(100vh - 78px);
  margin:0 auto;
  padding:88px 24px 76px;
}
.garal-hero h1{
  max-width:820px;
  margin:0;
  color:#fff;
  font-size:82px;
  line-height:.92;
  font-weight:950;
}
.garal-hero .garal-lead{
  margin-top:24px;
  color:rgba(255,255,255,.78);
}
.garal-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:34px;
}
.garal-hero-proof{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  overflow:hidden;
  margin-top:44px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--garal-radius);
  background:rgba(255,255,255,.12);
}
.garal-hero-proof div{
  padding:18px;
  background:rgba(6,18,39,.62);
}
.garal-hero-proof strong{
  display:block;
  color:#fff;
  font-size:27px;
  line-height:1;
}
.garal-hero-proof span{
  display:block;
  margin-top:8px;
  color:rgba(255,255,255,.72);
  font-size:30px;
  font-weight:750;
}

.garal-growth-map{
  position:relative;
  min-height:560px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:var(--garal-radius);
  background:
    linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.03)),
    rgba(255,255,255,.04);
  box-shadow:0 42px 120px rgba(0,0,0,.32);
  overflow:hidden;
}
.garal-growth-map:before{
  content:"";
  position:absolute;
  inset:22px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:50%;
}
.garal-growth-map:after{
  content:"";
  position:absolute;
  left:14%;
  right:14%;
  top:50%;
  height:2px;
  background:linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,255,255,.72),rgba(255,255,255,.18));
  transform:rotate(-16deg);
}
.garal-map-title{
  position:absolute;
  left:30px;
  top:30px;
  z-index:2;
}
.garal-map-title strong{
  display:block;
  color:#fff;
  font-size:20px;
  line-height:1.1;
}
.garal-map-title span{
  display:block;
  margin-top:7px;
  color:rgba(255,255,255,.62);
  font-size:30px;
  font-weight:750;
}
.garal-map-node{
  position:absolute;
  z-index:3;
  width:152px;
  min-height:118px;
  padding:15px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--garal-radius);
  background:rgba(5,9,20,.78);
  box-shadow:0 22px 50px rgba(0,0,0,.32);
}
.garal-map-node b{
  display:inline-flex;
  width:30px;
  height:30px;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--garal-red);
  color:#fff;
  font-size:30px;
  line-height:1;
}
.garal-map-node strong{
  display:block;
  margin-top:13px;
  color:#fff;
  font-size:17px;
  line-height:1.05;
}
.garal-map-node span{
  display:block;
  margin-top:7px;
  color:rgba(255,255,255,.68);
  font-size:30px;
  font-weight:650;
  line-height:1.35;
}
.garal-map-node.one{left:8%;top:30%}
.garal-map-node.two{left:30%;top:52%}
.garal-map-node.three{right:31%;top:23%}
.garal-map-node.four{right:8%;top:48%}
.garal-map-node.five{left:42%;bottom:8%}
.garal-map-pulse{
  position:absolute;
  right:28px;
  bottom:28px;
  z-index:2;
  display:flex;
  gap:8px;
}
.garal-map-pulse i{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#fff;
  opacity:.7;
  animation:garalPulse 1.8s infinite;
}
.garal-map-pulse i:nth-child(2){animation-delay:.25s;background:var(--garal-red)}
.garal-map-pulse i:nth-child(3){animation-delay:.5s;background:var(--garal-blue)}

@keyframes garalPulse{
  0%,100%{transform:translateY(0);opacity:.5}
  50%{transform:translateY(-9px);opacity:1}
}

.garal-section{
  padding:92px 24px;
  background:#fff;
}
.garal-section-soft{
  padding:92px 24px;
  background:var(--garal-soft);
}
.garal-section-dark{
  padding:92px 24px;
  color:#fff;
  background:var(--garal-navy);
}
.garal-container{
  max-width:1220px;
  margin:0 auto;
}
.garal-section-head{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(320px,.55fr);
  gap:48px;
  align-items:end;
  margin-bottom:54px;
}
.garal-section-head p{
  margin:0;
  color:var(--garal-muted);
  font-size:18px;
}
.garal-section-dark .garal-section-title{color:#fff}
.garal-section-dark .garal-section-head p{color:rgba(255,255,255,.7)}

.garal-capability-list{
  border-top:1px solid var(--garal-line);
}
.garal-capability-row{
  display:grid;
  grid-template-columns:160px minmax(0,.85fr) minmax(300px,1fr) 44px;
  gap:28px;
  align-items:start;
  padding:34px 0;
  border-bottom:1px solid var(--garal-line);
  text-decoration:none;
}
.garal-capability-row:hover h3{color:var(--garal-blue)}
.garal-capability-row .num{
  color:var(--garal-red);
  font-size:30px;
  font-weight:950;
}
.garal-capability-row h3{
  margin:0;
  color:var(--garal-ink);
  font-size:42px;
  line-height:1;
  font-weight:950;
}
.garal-capability-row p{
  margin:0;
  color:var(--garal-muted);
  font-size:17px;
}
.garal-arrow{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--garal-line);
  border-radius:50%;
  color:var(--garal-blue);
  font-weight:950;
}

.garal-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.garal-card{
  border:1px solid var(--garal-line);
  border-radius:var(--garal-radius);
  background:#fff;
  padding:26px;
  box-shadow:0 18px 48px rgba(6,18,39,.06);
}
.garal-card img{
  display:block;
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  border-radius:var(--garal-radius);
  margin-bottom:22px;
}
.garal-card h3{
  margin:0;
  color:var(--garal-ink);
  font-size:27px;
  line-height:1.08;
}
.garal-card p{
  margin:16px 0 0;
  color:var(--garal-muted);
}
.garal-tag{
  display:inline-flex;
  margin-bottom:16px;
  color:var(--garal-red);
  font-size:12px;
  font-weight:950;
  line-height:1.2;
  text-transform:uppercase;
}

.garal-framework{
  display:grid;
  grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  gap:44px;
  align-items:start;
}
.garal-framework-panel{
  position:sticky;
  top:110px;
}
.garal-framework-steps{
  counter-reset:garal-step;
  border-top:1px solid rgba(255,255,255,.16);
}
.garal-framework-step{
  counter-increment:garal-step;
  display:grid;
  grid-template-columns:72px 1fr;
  gap:22px;
  padding:28px 0;
  border-bottom:1px solid rgba(255,255,255,.16);
}
.garal-framework-step:before{
  content:"0" counter(garal-step);
  color:var(--garal-red);
  font-size:14px;
  font-weight:950;
}
.garal-framework-step h3{
  margin:0;
  color:#fff;
  font-size:30px;
  line-height:1;
}
.garal-framework-step p{
  margin:10px 0 0;
  color:rgba(255,255,255,.68);
}

.garal-proof-band{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  overflow:hidden;
  border:1px solid var(--garal-line);
  border-radius:var(--garal-radius);
  background:var(--garal-line);
}
.garal-proof-band div{
  padding:28px;
  background:#fff;
}
.garal-proof-band strong{
  display:block;
  color:var(--garal-blue);
  font-size:36px;
  line-height:1;
}
.garal-proof-band span{
  display:block;
  margin-top:10px;
  color:var(--garal-muted);
  font-size:14px;
  font-weight:750;
}

.garal-service-hero{
  position:relative;
  min-height:620px;
  display:flex;
  align-items:end;
  overflow:hidden;
  color:#fff;
  background-color:var(--garal-navy);
}
.garal-service-hero>img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.84;
}
.garal-service-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(5,9,20,.92),rgba(5,9,20,.78) 54%,rgba(5,9,20,.4)),
    linear-gradient(0deg,rgba(5,9,20,.72),transparent 42%);
}
.garal-service-hero .garal-container{
  position:relative;
  z-index:1;
  padding:118px 24px 76px;
}
.garal-service-hero h1{
  max-width:920px;
  margin:0;
  color:#fff;
  font-size:72px;
  line-height:.96;
  font-weight:950;
}
.garal-service-hero .garal-lead{
  margin-top:24px;
  color:rgba(255,255,255,.78);
}
.garal-service-layout{
  display:grid;
  grid-template-columns:minmax(260px,.6fr) minmax(0,1.4fr);
  gap:48px;
}
.garal-service-intro{
  position:sticky;
  top:112px;
  align-self:start;
}
.garal-service-intro h2{
  margin:0;
  font-size:38px;
  line-height:1.03;
}
.garal-service-intro p{color:var(--garal-muted)}
.garal-service-items{
  border-top:1px solid var(--garal-line);
}
.garal-service-item{
  display:grid;
  grid-template-columns:92px 1fr;
  gap:24px;
  padding:30px 0;
  border-bottom:1px solid var(--garal-line);
}
.garal-service-item b{
  color:var(--garal-red);
  font-size:13px;
  font-weight:950;
}
.garal-service-item h3{
  margin:0;
  font-size:32px;
  line-height:1.05;
}
.garal-service-item p{
  margin:12px 0 0;
  color:var(--garal-muted);
}
.garal-benefit-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-top:46px;
}
.garal-benefit{
  padding:22px;
  border:1px solid var(--garal-line);
  border-radius:var(--garal-radius);
  background:#fff;
}
.garal-benefit strong{
  display:block;
  color:var(--garal-blue);
  font-size:18px;
}
.garal-benefit span{
  display:block;
  margin-top:8px;
  color:var(--garal-muted);
  font-size:14px;
}

.garal-form-shell{
  max-width:1120px;
  margin:0 auto;
  border:1px solid var(--garal-line);
  border-radius:var(--garal-radius);
  background:#fff;
  box-shadow:var(--garal-shadow);
}
.garal-form-inner{padding:34px}
.garal-form-shell h2{
  margin:0;
  color:var(--garal-ink);
  font-size:42px;
  line-height:1;
}
.garal-form-shell p{color:var(--garal-muted)}
.garal-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:24px;
}
.garal-field label{
  display:block;
  margin-bottom:8px;
  color:var(--garal-ink);
  font-size:14px;
  font-weight:850;
}
.garal-field input,
.garal-field select,
.garal-field textarea{
  width:100%;
  min-height:50px;
  border:1px solid #ccd5e1;
  border-radius:var(--garal-radius);
  background:#fff;
  color:var(--garal-ink);
  padding:13px 14px;
}
.garal-field textarea{min-height:150px;resize:vertical}
.garal-field input:focus,
.garal-field select:focus,
.garal-field textarea:focus{
  outline:3px solid rgba(0,74,173,.16);
  border-color:var(--garal-blue);
}
.garal-full{grid-column:1/-1}
.garal-consent label{
  display:flex;
  align-items:flex-start;
  gap:10px;
  color:var(--garal-muted);
  font-weight:650;
  line-height:1.45;
}
.garal-consent input{width:auto;min-height:auto;margin-top:4px}
.garal-form-success{
  margin:18px 0 0;
  border-left:4px solid var(--garal-blue);
  background:var(--garal-blue-soft);
  color:var(--garal-ink);
  padding:14px 16px;
  font-weight:800;
}
.garal-hp{position:absolute;left:-9999px;opacity:0}
.garal-note{font-size:14px}

.garal-page-main{
  padding:74px 24px;
}
.garal-page-main h1{
  font-size:58px;
  line-height:1;
}
.garal-post-card{
  border:1px solid var(--garal-line);
  border-radius:var(--garal-radius);
  background:#fff;
  padding:24px;
}

.garal-footer{
  color:#fff;
  background:linear-gradient(135deg,#050914 0%,#061227 68%,#071f48 100%);
}
.garal-footer a{
  color:rgba(255,255,255,.82);
  text-decoration:none;
}
.garal-footer a:hover{color:#fff}
.garal-footer-top{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) repeat(3,minmax(170px,.45fr));
  gap:42px;
  max-width:1220px;
  margin:0 auto;
  padding:70px 24px 48px;
}
.garal-footer-brand h2{
  margin:0;
  color:#fff;
  font-size:36px;
  line-height:1;
}
.garal-footer-brand p{
  max-width:520px;
  color:rgba(255,255,255,.68);
}
.garal-footer-col h3{
  margin:0 0 18px;
  color:#fff;
  font-size:13px;
  font-weight:950;
  text-transform:uppercase;
}
.garal-footer-col ul{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}
.garal-footer-bottom{
  max-width:1220px;
  margin:0 auto;
  padding:22px 24px 34px;
  border-top:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.58);
  font-size:13px;
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:18px;
}

.garal-animate{
  transform:translateY(18px);
  opacity:0;
  transition:opacity .7s ease,transform .7s ease;
}
.garal-animate.is-visible{
  transform:translateY(0);
  opacity:1;
}

@media (max-width:1080px){
  .garal-hero-inner{grid-template-columns:1fr;min-height:auto}
  .garal-growth-map{min-height:520px}
  .garal-section-head,
  .garal-framework,
  .garal-service-layout{grid-template-columns:1fr}
  .garal-framework-panel,
  .garal-service-intro{position:static}
  .garal-capability-row{grid-template-columns:80px 1fr}
  .garal-capability-row p,
  .garal-capability-row .garal-arrow{grid-column:2}
  .garal-footer-top{grid-template-columns:1fr 1fr}
}
@media (max-width:780px){
  .admin-bar .garal-site-header{top:0}
  .admin-bar .garal-header{top:0}
  .garal-site-header .wp-block-group{min-height:68px}
  .garal-site-title{font-size:16px}
  .garal-site-title small{display:none}
  .garal-hero-inner{padding-top:62px;padding-bottom:56px}
  .garal-hero h1{font-size:52px}
  .garal-section-title{font-size:40px}
  .garal-service-hero h1{font-size:46px}
  .garal-lead{font-size:18px}
  .garal-hero-proof,
  .garal-card-grid,
  .garal-benefit-grid,
  .garal-proof-band,
  .garal-form-grid{grid-template-columns:1fr}
  .garal-growth-map{min-height:auto;padding:112px 18px 18px;display:grid;gap:12px}
  .garal-growth-map:before,
  .garal-growth-map:after,
  .garal-map-pulse{display:none}
  .garal-map-node{
    position:static;
    width:100%;
    min-height:auto;
  }
  .garal-capability-row{grid-template-columns:1fr;gap:12px}
  .garal-capability-row p,
  .garal-capability-row .garal-arrow{grid-column:auto}
  .garal-capability-row h3{font-size:34px}
  .garal-service-item{grid-template-columns:1fr;gap:10px}
  .garal-footer-top{grid-template-columns:1fr}
  .garal-footer-bottom{display:block}
}
@media (max-width:520px){
  .garal-hero h1{font-size:42px}
  .garal-section,
  .garal-section-soft,
  .garal-section-dark{padding:64px 18px}
  .garal-form-inner{padding:24px}
  .garal-form-shell h2{font-size:32px}
}
