/* Gracia Giráldez 1.2 · Fondo en movimiento, animaciones y cabecera translúcida.
   Todo el movimiento sigue un ciclo de respiración de 8 s (4 s inspirar · 4 s espirar).
   Con «reducir movimiento» activado en el dispositivo, style.css desactiva animaciones y transiciones. */
:root{--gg-breath:8s;--gg-ease:cubic-bezier(.22,.8,.24,1);--gg-ease-out:cubic-bezier(.16,1,.3,1);--gg-f1:rgba(188,211,176,.62);--gg-f2:rgba(228,213,158,.36);--gg-f3:rgba(170,205,203,.36)}

/* ===== Cabecera: transparente arriba, vidrio esmerilado al hacer scroll ===== */
.site-header{background:transparent;border-bottom:1px solid transparent;transition:background-color .5s var(--gg-ease),box-shadow .5s var(--gg-ease),border-color .5s,-webkit-backdrop-filter .5s,backdrop-filter .5s}
.site-header .header-inner{transition:min-height .5s var(--gg-ease)}
.site-header .brand{transform-origin:left center;transition:transform .5s var(--gg-ease)}
.site-header.is-scrolled{background:rgba(255,255,255,.62);-webkit-backdrop-filter:saturate(175%) blur(18px);backdrop-filter:saturate(175%) blur(18px);border-bottom-color:rgba(36,75,62,.1);box-shadow:0 12px 34px -24px rgba(23,57,45,.5)}
.site-header.menu-open{background:rgba(255,255,255,.97)}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.site-header.is-scrolled{background:rgba(255,255,255,.93)}}
@media(min-width:1241px){.site-header.is-scrolled .header-inner{min-height:76px}.site-header.is-scrolled .brand{transform:scale(.88)}}
@media(max-width:1240px){.site-header.is-scrolled .header-inner{min-height:72px}}
@media(max-width:740px){.site-header.is-scrolled .header-inner{min-height:66px}.site-header.is-scrolled .brand{transform:scale(.92)}}
/* Barra de progreso de lectura */
.site-header::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,#9db382,var(--green) 55%,#b3a362);transform-origin:left center;transform:scaleX(var(--gg-progress,0));opacity:0;transition:opacity .4s;pointer-events:none}
.site-header.is-scrolled::after{opacity:.9}
.site-header.menu-open::after{opacity:0}
.gg-motion .site-header{animation:gg-drop 1s var(--gg-ease-out) .05s backwards}
@keyframes gg-drop{from{opacity:0;transform:translateY(-100%)}}
/* Enlaces del menú: subrayado que crece */
@media(min-width:1241px){
  .main-navigation .nav-list>li>.nav-item-row>a::after,.main-navigation .nav-list>li>a::after{content:'';position:absolute;left:0;right:0;bottom:8px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right center;transition:transform .5s var(--gg-ease)}
  .main-navigation .nav-list>li>.nav-item-row>a:hover::after,.main-navigation .nav-list>li>a:hover::after,.main-navigation .nav-list>li>.nav-item-row>a:focus-visible::after,.main-navigation .nav-list>li>a:focus-visible::after{transform:scaleX(1);transform-origin:left center}
  .main-navigation .nav-list li:hover>ul,.main-navigation .nav-list li:focus-within>ul,.main-navigation .nav-list li.is-open>ul{animation:gg-pop .35s var(--gg-ease-out)}
  .main-navigation .nav-list li ul{background:rgba(255,255,255,.98);border:1px solid rgba(36,75,62,.08)}
  .submenu-toggle span{display:inline-block;transition:transform .35s var(--gg-ease)}
  .main-navigation li:hover>.nav-item-row .submenu-toggle span,.main-navigation li.is-open>.nav-item-row .submenu-toggle span{transform:rotate(180deg)}
}
@keyframes gg-pop{from{opacity:0;transform:translateY(8px)}}
/* Menú móvil: se despliega como una lámina */
@media(max-width:1240px){
  .menu-open .main-navigation{animation:gg-sheet .5s var(--gg-ease-out)}
  .menu-open .main-navigation .nav-list>li{animation:gg-up .55s var(--gg-ease-out) backwards}
  .menu-open .main-navigation .nav-list>li:nth-child(2){animation-delay:.03s}.menu-open .main-navigation .nav-list>li:nth-child(3){animation-delay:.06s}.menu-open .main-navigation .nav-list>li:nth-child(4){animation-delay:.09s}.menu-open .main-navigation .nav-list>li:nth-child(5){animation-delay:.12s}.menu-open .main-navigation .nav-list>li:nth-child(6){animation-delay:.15s}.menu-open .main-navigation .nav-list>li:nth-child(7){animation-delay:.18s}.menu-open .main-navigation .nav-list>li:nth-child(8){animation-delay:.21s}.menu-open .main-navigation .nav-list>li:nth-child(n+9){animation-delay:.24s}
  .menu-lines,.menu-lines::after{transition:transform .35s var(--gg-ease),opacity .35s}
  .menu-open .menu-lines{border-color:transparent}
  .menu-open .menu-lines::before{content:'';position:absolute;top:4px;left:0;width:18px;border-top:1.5px solid;transform:rotate(45deg)}
  .menu-open .menu-lines::after{transform:rotate(-45deg)}
}
@keyframes gg-sheet{from{clip-path:inset(0 0 100% 0);opacity:.4}to{clip-path:inset(0 0 0 0);opacity:1}}

/* ===== Fondo vivo en todas las secciones ===== */
.hero,.section,.interior-hero{isolation:isolate}
.gg-bg{--rx:88%;--ry:18%;--rs:min(1100px,130vw);position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;opacity:0;transition:opacity 1.8s ease;contain:strict;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 170px,#000 calc(100% - 150px),transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 170px,#000 calc(100% - 150px),transparent 100%)}
.gg-bg--alt{--rx:10%;--ry:84%}
.gg-bg--hero{-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 150px),transparent 100%);mask-image:linear-gradient(180deg,#000 calc(100% - 150px),transparent 100%)}
.gg-bg.is-ready{opacity:1}
.gg-bg>i{position:absolute;display:block}
.gg-observed:not(.gg-live) :is(.gg-bg>i,.wave svg){animation-play-state:paused!important}
/* Manchas de color que derivan despacio */
.gg-bg__field{--s:max(64%,480px);width:var(--s);aspect-ratio:1;margin:calc(var(--s)/-2) 0 0 calc(var(--s)/-2);left:var(--x);top:var(--y);border-radius:50%;background:radial-gradient(closest-side,var(--c),rgba(255,255,255,0));animation:gg-drift-a 30s ease-in-out infinite alternate}
.gg-bg__field--a{--x:12%;--y:18%;--c:var(--gg-f1)}
.gg-bg__field--b{--x:88%;--y:82%;--c:var(--gg-f2);--s:max(54%,420px);animation-name:gg-drift-b;animation-duration:38s}
.gg-bg__field--c{--x:58%;--y:96%;--c:var(--gg-f3);--s:max(46%,380px);animation-duration:26s;animation-direction:alternate-reverse}
.gg-bg--alt .gg-bg__field--a{--x:86%;--y:22%}
.gg-bg--alt .gg-bg__field--b{--x:10%;--y:84%}
@keyframes gg-drift-a{0%{transform:translate(0,0) scale(1)}35%{transform:translate(10%,7%) scale(1.14)}70%{transform:translate(-6%,12%) scale(.92)}100%{transform:translate(5%,-7%) scale(1.06)}}
@keyframes gg-drift-b{0%{transform:translate(0,0) scale(1.05)}40%{transform:translate(-9%,-8%) scale(.9)}75%{transform:translate(7%,-12%) scale(1.15)}100%{transform:translate(-4%,5%) scale(1)}}
/* Anillos orgánicos que respiran (como los de un árbol) */
.gg-bg__rings{width:var(--rs);aspect-ratio:1;left:var(--rx);top:var(--ry);margin:calc(var(--rs)/-2) 0 0 calc(var(--rs)/-2);background:url('../images/gg-rings-light.svg') center/100% 100% no-repeat;translate:0 var(--gg-par,0px);animation:gg-spin 220s linear infinite,gg-breathe var(--gg-breath) ease-in-out infinite}
.gg-bg--alt .gg-bg__rings{animation-direction:reverse,normal}
@keyframes gg-spin{to{rotate:360deg}}
@keyframes gg-breathe{0%,100%{scale:.94}50%{scale:1.05}}
/* Secciones verdes: brillo más profundo y luces que suben */
.gg-bg--dark{--gg-f1:rgba(124,170,134,.34);--gg-f2:rgba(222,210,163,.13);--rx:50%;--ry:52%;--rs:min(1400px,160vw)}
.gg-bg--dark .gg-bg__rings{background-image:url('../images/gg-rings-dark.svg')}
.gg-bg__motes{left:0;right:0;top:0;height:calc(100% + 360px);background:url('../images/gg-motes-a.svg') 0 0/360px 360px repeat;animation:gg-rise-a 30s linear infinite,gg-sway 11s ease-in-out infinite alternate}
.gg-bg__motes--b{height:calc(100% + 560px);background-image:url('../images/gg-motes-b.svg');background-size:560px 560px;opacity:.75;animation:gg-rise-b 52s linear infinite,gg-sway 17s ease-in-out infinite alternate-reverse}
@keyframes gg-rise-a{to{transform:translate3d(0,-360px,0)}}
@keyframes gg-rise-b{to{transform:translate3d(0,-560px,0)}}
@keyframes gg-sway{from{translate:-14px 0}to{translate:14px 0}}
/* Portada: el fondo sigue suavemente al cursor */
.gg-bg--hero .gg-bg__field--a{--x:18%;--y:34%;translate:calc(var(--px,0)*-70px) calc(var(--py,0)*-50px)}
.gg-bg--hero .gg-bg__field--b{--x:76%;--y:46%;--c:var(--gg-f1);translate:calc(var(--px,0)*50px) calc(var(--py,0)*40px)}
.gg-bg--hero .gg-bg__field--c{translate:calc(var(--px,0)*-30px) calc(var(--py,0)*-20px)}
.gg-bg--hero .gg-bg__field--b::after{content:'';position:absolute;inset:18%;border-radius:50%;background:radial-gradient(closest-side,var(--gg-f2),rgba(255,255,255,0))}
.gg-bg--hero .gg-bg__rings{translate:calc(var(--px,0)*20px) calc(var(--gg-par,0px) + var(--py,0)*14px)}
@media(max-width:740px){.gg-bg__field{--s:max(80%,340px)}.gg-bg__field--b{--s:max(70%,300px)}.gg-bg__motes--b{display:none}}

/* El formulario oscuro flota sobre el fondo en movimiento como un vidrio */
.contact--dark .form-card{background:rgba(27,58,46,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.contact--dark .field input,.contact--dark .field textarea{background:rgba(20,46,36,.45)}
.contact--dark .map-box{background:rgba(27,58,46,.55)}

/* ===== Ondas vivas entre secciones ===== */
.wave{overflow:hidden}
.wave svg{position:absolute;top:0;left:0;width:200%;height:100%;display:block;transform-origin:50% 100%}
/* Avanzan en horizontal y además «respiran»: la ola principal se eleva al inspirar (mismo ciclo de 8 s que los anillos)
   y la ola clara de detrás lo hace a contratiempo. El borde inferior queda fijo, así nunca se abre un hueco. */
.wave__front{animation:gg-wave 60s linear infinite,gg-swell var(--gg-breath) ease-in-out infinite}
.wave__back{animation:gg-wave 38s linear infinite reverse,gg-swell-back var(--gg-breath) ease-in-out infinite}
@keyframes gg-wave{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes gg-swell{0%,100%{scale:1 .8}50%{scale:1 1.1}}
@keyframes gg-swell-back{0%,100%{scale:1 1.14}50%{scale:1 .78}}

/* ===== Portada: retrato, órbita y hoja ===== */
.hero-portrait>img{animation:gg-float var(--gg-breath) ease-in-out infinite;translate:calc(var(--px,0)*-10px) calc(var(--py,0)*-8px)}
@keyframes gg-float{0%,100%{transform:translateY(4px)}50%{transform:translateY(-8px)}}
.portrait-orbit{animation:gg-orbit 90s linear infinite;translate:calc(var(--px,0)*16px) calc(var(--py,0)*12px)}
.portrait-orbit::before,.portrait-orbit::after{content:'';position:absolute;border-radius:50%}
.portrait-orbit::after{width:10px;height:10px;top:-5px;left:50%;margin-left:-5px;background:#b3a362;box-shadow:0 0 0 7px rgba(179,163,98,.16),0 0 18px rgba(179,163,98,.55)}
.portrait-orbit::before{width:7px;height:7px;bottom:12%;left:6%;background:#9db382;box-shadow:0 0 0 5px rgba(157,179,130,.18)}
@keyframes gg-orbit{from{transform:rotate(-11deg)}to{transform:rotate(349deg)}}
.hero .botanical{translate:calc(var(--px,0)*24px) calc(var(--py,0)*18px)}
.hero-note>span{position:relative}
.hero-note>span::after{content:'';position:absolute;inset:0;border-radius:50%;background:#80956d;animation:gg-ping 2.6s cubic-bezier(.2,.6,.3,1) infinite}
@keyframes gg-ping{0%{transform:scale(1);opacity:.7}80%,100%{transform:scale(3.4);opacity:0}}

/* Secuencia de entrada (portada y cabecera de páginas interiores) */
.gg-motion:not(.gg-intro) :is(.hero-copy>*,.hero-portrait,.interior-hero .wrap>*){opacity:0}
.gg-w{display:inline-block;overflow:clip;vertical-align:top;padding:0 .04em .14em;margin:0 -.04em -.14em}
.gg-w__i{display:inline-block;transform-origin:0 100%}
.gg-intro .hero .eyebrow{animation:gg-eyebrow 1.3s var(--gg-ease-out) .2s backwards}
.gg-intro :is(.hero,.interior-hero) h1 .gg-w__i{animation:gg-word 1.2s var(--gg-ease-out) backwards;animation-delay:calc(.32s + var(--wi,0)*70ms)}
.gg-intro :is(.hero,.interior-hero) h1:not(.gg-split){animation:gg-up 1.1s var(--gg-ease-out) .35s backwards}
.gg-intro .hero-subtitle{animation:gg-up 1.1s var(--gg-ease-out) .85s backwards}
.gg-intro .hero-copy>.button{animation:gg-up 1.1s var(--gg-ease-out) 1s backwards}
.gg-intro .hero-note{animation:gg-up 1.1s var(--gg-ease-out) 1.12s backwards}
.gg-intro .hero-portrait{animation:gg-portrait 1.9s var(--gg-ease-out) .2s backwards}
.gg-intro .portrait-orbit{animation:gg-orbit 90s linear infinite,gg-orbit-in 2.2s var(--gg-ease-out) .45s backwards}
.gg-intro .portrait-caption{animation:gg-up 1.1s var(--gg-ease-out) 1.25s backwards}
.gg-intro .botanical path{stroke-dasharray:var(--len,0);animation:gg-draw 2.8s var(--gg-ease) .9s backwards}
.gg-intro .interior-hero .breadcrumbs{animation:gg-up .9s var(--gg-ease-out) .15s backwards}
.gg-intro .interior-hero .eyebrow{animation:gg-eyebrow 1.3s var(--gg-ease-out) .25s backwards}
.gg-intro .interior-hero .wrap>p:not(.eyebrow){animation:gg-up 1.1s var(--gg-ease-out) .8s backwards}
@keyframes gg-word{from{transform:translateY(112%) rotate(4deg)}}
@keyframes gg-up{from{opacity:0;transform:translateY(26px)}}
@keyframes gg-eyebrow{from{opacity:0;letter-spacing:.46em}}
@keyframes gg-portrait{from{opacity:0;transform:scale(.88) translateY(34px)}}
@keyframes gg-orbit-in{from{opacity:0;scale:.72}}
@keyframes gg-draw{from{stroke-dashoffset:var(--len,0)}}

/* ===== Apariciones al hacer scroll (cada tipo de contenido con su propio gesto) ===== */
.gg-motion .gg-r:not(.is-in){opacity:0}
.gg-motion .gg-r--words.gg-split:not(.is-in){opacity:1}
.gg-motion .gg-r--words:not(.is-in) .gg-w__i{transform:translateY(112%)}
.gg-r--words.is-in .gg-w__i{animation:gg-word 1.1s var(--gg-ease-out) backwards;animation-delay:calc(var(--d,0ms) + var(--wi,0)*55ms)}
.gg-r--up.is-in{animation:gg-up 1.05s var(--gg-ease-out) var(--d,0ms) backwards}
.gg-r--eyebrow.is-in{animation:gg-eyebrow 1.4s var(--gg-ease-out) var(--d,0ms) backwards}
.gg-r--unveil.is-in{animation:gg-unveil 1.6s var(--gg-ease-out) var(--d,0ms) backwards}
.gg-r--card.is-in{animation:gg-card 1.15s var(--gg-ease-out) var(--d,0ms) backwards}
.gg-r--card.is-in .person-photo img{animation:gg-zoom 1.8s var(--gg-ease-out) var(--d,0ms) backwards}
.gg-r--value.is-in{animation:gg-up 1.1s var(--gg-ease-out) var(--d,0ms) backwards}
.gg-motion .gg-r--value:not(.is-in) .value-icon svg>*{stroke-dasharray:var(--len,0);stroke-dashoffset:var(--len,0)}
.gg-r--value.is-in .value-icon svg>*{stroke-dasharray:var(--len,0);animation:gg-draw 2.2s var(--gg-ease) backwards;animation-delay:calc(var(--d,0ms) + 250ms + var(--pi,0)*140ms)}
.gg-r--bloom.is-in{animation:gg-bloom 1.8s var(--gg-ease-out) var(--d,0ms) backwards}
.gg-star{display:inline-block}
.gg-r--card.is-in .gg-star{animation:gg-star .9s cubic-bezier(.3,1.7,.5,1) backwards;animation-delay:calc(var(--d,0ms) + 450ms + var(--si,0)*120ms)}
@keyframes gg-unveil{from{opacity:0;clip-path:inset(12% 9% 12% 9% round 32px);transform:scale(1.07)}to{opacity:1;clip-path:inset(0 0 0 0 round 0)}}
@keyframes gg-card{from{opacity:0;transform:translateY(48px) rotate(-1.4deg) scale(.97)}}
@keyframes gg-zoom{from{transform:scale(1.2)}}
@keyframes gg-bloom{from{opacity:0;transform:scale(.6) rotate(-28deg)}}
@keyframes gg-star{0%{opacity:.1;transform:scale(.2) rotate(-70deg)}60%{text-shadow:0 0 16px rgba(240,222,150,.95)}}

/* Profundidad al hacer scroll */
.gg-motion .team-banner>img{scale:1.1;translate:0 var(--gg-shift,0px)}
.gg-motion :is(.informal-photo,.logo-animation,.about-intro>img){translate:0 var(--gg-shift,0px)}

/* ===== Respuesta al pasar el cursor ===== */
.button{position:relative;overflow:hidden;isolation:isolate}
.button::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.26) 50%,rgba(255,255,255,0) 70%);transform:translateX(-120%);transition:transform .9s var(--gg-ease);pointer-events:none}
.button--outline::after{background:linear-gradient(110deg,rgba(36,75,62,0) 30%,rgba(36,75,62,.1) 50%,rgba(36,75,62,0) 70%)}
.button:hover::after{transform:translateX(120%)}
.button>span{transition:transform .4s var(--gg-ease)}
.button:hover>span{transform:translate(3px,-3px)}
.text-link svg{transition:transform .45s var(--gg-ease)}
.text-link:hover svg{transform:translateX(7px)}
.person-arrow{transition:transform .5s var(--gg-ease),background-color .4s,color .4s}
.person:hover .person-arrow{transform:rotate(45deg)}
.person-photo img{transition:transform .9s var(--gg-ease)}
.person:hover .person-photo img{transform:scale(1.06)}
.review{transition:transform .6s var(--gg-ease),border-color .5s,background-color .5s}
.review:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.42);background-color:rgba(255,255,255,.06)}
.page-directory a{transition:background-color .35s,color .35s,transform .5s var(--gg-ease),box-shadow .5s}
.page-directory a:hover{transform:translateY(-3px);box-shadow:0 14px 30px -22px rgba(23,57,45,.5)}
.page-directory a>span:last-child{transition:transform .45s var(--gg-ease)}
.page-directory a:hover>span:last-child{transform:translate(4px,-4px)}
.collaborator-logos img{transition:filter .5s,opacity .5s}
.collaborator-logos img:hover{filter:none;opacity:1}
/* WhatsApp flotante: entra y respira para invitar a escribir */
.floating-contact a{position:relative;transition:transform .45s var(--gg-ease),box-shadow .45s}
.floating-contact a:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(21,51,38,.32)}
.floating-contact a::before{content:'';position:absolute;inset:-1px;border-radius:inherit;border:2px solid var(--green);animation:gg-halo var(--gg-breath) cubic-bezier(.2,.6,.3,1) infinite 3s;pointer-events:none;opacity:0}
.floating-contact a:hover::before{animation-play-state:paused}
.gg-motion .floating-contact{animation:gg-slide-in 1.1s var(--gg-ease-out) 1.6s backwards}
@keyframes gg-halo{0%{transform:scale(1);opacity:.55}45%,100%{transform:scale(1.22);opacity:0}}
@keyframes gg-slide-in{from{opacity:0;transform:translateX(40px) scale(.9)}}

/* ===== Entidades: cinta continua ===== */
.collaborator-logos.gg-marquee{display:block;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.gg-marquee__track{display:flex;width:max-content;animation:gg-marquee var(--gg-mq,40s) linear infinite}
.gg-marquee:hover .gg-marquee__track{animation-play-state:paused}
.gg-marquee__set{display:flex;align-items:center;flex-shrink:0;gap:var(--gg-mq-gap,45px);padding-right:var(--gg-mq-gap,45px)}
@keyframes gg-marquee{to{transform:translateX(-50%)}}
@media(max-width:740px){.gg-marquee{--gg-mq-gap:28px}}

/* ===== Accesibilidad e impresión ===== */
@media(prefers-reduced-motion:reduce){.gg-bg__motes{display:none}.gg-motion .team-banner>img{scale:1}}
@media print{.gg-bg{display:none}}