@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap');

:root{--syb-bg:#f6f5f2;--syb-text:#1c1c1c;--syb-muted:#64625c;--syb-line:#dad6cf;--syb-soft:#ece9e3;--syb-dark:#161616;--syb-title:"TeX Gyre Adventor","Avant Garde","Century Gothic",Arial,sans-serif;--syb-body:"Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif}
body,.wp-site-blocks{background:var(--syb-bg)}
.syb-container{max-width:1180px;margin-inline:auto;padding-inline:24px}.syb-section{margin-block:clamp(56px,7vw,104px)}
.syb-header{border-bottom:1px solid var(--syb-line);padding-block:18px}.syb-header-inner{display:flex;align-items:center;justify-content:space-between;gap:28px}
.syb-brand{display:inline-flex;align-items:center;gap:16px;min-width:max-content;text-decoration:none}.syb-brand img{width:52px;height:52px;object-fit:contain;display:block}.syb-brand-text{font-family:var(--syb-title);font-size:26px;letter-spacing:.04em;line-height:1;color:var(--syb-text)}.syb-brand-text strong{font-weight:700}.syb-brand-text span{font-weight:400}
.syb-nav{display:flex;align-items:center;gap:clamp(18px,2vw,32px);font-size:14px;font-weight:300}.syb-nav a{color:var(--syb-text);text-decoration:none}
.syb-button,.wp-block-button__link{border-radius:0!important;padding:12px 26px!important;font-family:var(--syb-title);font-weight:700;letter-spacing:.02em}.syb-button-outline a,.syb-button-outline .wp-block-button__link{border:1px solid var(--syb-dark);background:transparent!important;color:var(--syb-dark)!important}
.syb-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:clamp(40px,7vw,96px);align-items:center}.syb-hero h1{font-size:40px!important;line-height:1.08!important;max-width:680px;margin:0 0 28px}.syb-hero p{max-width:580px;color:var(--syb-muted)}.syb-hero img{width:100%;height:auto;filter:grayscale(100%)}
.syb-routes{border-top:1px solid var(--syb-line);border-bottom:1px solid var(--syb-line)}.syb-routes-grid{display:grid;grid-template-columns:repeat(3,1fr)}.syb-route{position:relative;display:grid;grid-template-columns:44px 1fr auto;gap:20px;align-items:center;min-height:124px;padding:22px 28px;text-decoration:none;color:var(--syb-text)}.syb-route:not(:last-child)::after{content:"";position:absolute;top:18px;right:0;bottom:18px;width:1px;background:var(--syb-line)}.syb-icon-line{width:34px;height:34px}.syb-route strong,.syb-card h3,.syb-service h3,.syb-lead h3{display:block;font-family:var(--syb-title);font-weight:700;letter-spacing:.02em}.syb-route small,.syb-card p,.syb-service p,.syb-video p,.syb-newsletter p,.syb-testimonial p{color:var(--syb-muted)}.syb-arrow{font-family:var(--syb-title);font-weight:700;font-size:24px}
.syb-section-heading{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid var(--syb-line);padding-bottom:14px;margin-bottom:36px}.syb-section-heading h2{font-size:15px;font-family:var(--syb-body);font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.syb-services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0}.syb-service{position:relative;display:grid;grid-template-columns:76px 1fr;gap:22px;padding:12px clamp(18px,3vw,48px) 28px 0}.syb-service:not(:last-child)::after{content:"";position:absolute;top:0;right:24px;bottom:0;width:1px;background:var(--syb-line)}.syb-service img{max-width:72px;max-height:72px;object-fit:contain}
.syb-category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.syb-card{border:1px solid var(--syb-line);border-radius:14px;overflow:hidden;background:transparent}.syb-card img{width:100%;aspect-ratio:4/1.75;object-fit:cover}.syb-card-body{padding:22px}.syb-card .syb-arrow{display:inline-block;transform:translateY(-10px)}
.syb-video{display:grid;grid-template-columns:.9fr 1fr;gap:52px;align-items:center;border:1px solid var(--syb-line);border-radius:18px;padding:28px}.syb-video-media{position:relative;display:block}.syb-video-media img{width:100%;aspect-ratio:16/9;object-fit:cover;filter:grayscale(100%)}.syb-play{position:absolute;inset:50% auto auto 50%;width:68px;height:68px;transform:translate(-50%,-50%);display:grid;place-items:center;border-radius:50%;background:rgba(22,22,22,.86);color:#fff}
.syb-cta{background:var(--syb-soft);padding-block:38px}.syb-cta-inner{max-width:1180px;margin-inline:auto;padding-inline:24px;display:flex;justify-content:space-between;align-items:center}
.syb-testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.syb-testimonial{border:1px solid var(--syb-line);border-radius:14px;padding:28px}
.syb-newsletter-box{border:1px solid var(--syb-line);border-radius:18px;padding:36px;display:grid;grid-template-columns:minmax(250px,.82fr) minmax(0,1.38fr);grid-template-areas:"intro resources" "form form";gap:28px 54px}.syb-newsletter-intro{grid-area:intro}.syb-leads{grid-area:resources;display:grid;grid-template-columns:repeat(2,minmax(240px,1fr));gap:24px;padding-left:84px;padding-right:15px}.syb-lead{border:1px solid var(--syb-line);border-radius:12px;padding:16px;display:grid;grid-template-columns:132px 1fr;gap:14px;align-items:center}.syb-lead img{width:132px;height:94px;object-fit:cover}.syb-newsletter-window{grid-area:form;border:1px solid var(--syb-line);border-radius:12px;overflow:hidden}.syb-window-top{display:flex;gap:8px;padding:12px 16px;border-bottom:1px solid var(--syb-line);background:rgba(255,255,255,.45)}.syb-window-top span{width:10px;height:10px;border-radius:50%;background:#c7c2b8}.syb-window-body{padding:24px;display:grid;grid-template-columns:1fr minmax(360px,.9fr);gap:26px;align-items:center}.syb-form-row{display:flex}.syb-form-row input{min-height:46px;flex:1;border:1px solid var(--syb-line);background:var(--syb-bg);padding:0 14px;font:inherit}.syb-form-row button{min-width:160px;border:1px solid var(--syb-dark);background:var(--syb-dark);color:#fff;font-weight:700}
.syb-footer{border-top:1px solid var(--syb-line);padding-block:64px}.syb-footer-grid{display:grid;grid-template-columns:1.35fr repeat(3,1fr);gap:36px}.syb-footer a{display:block;color:var(--syb-muted);text-decoration:none;margin-bottom:8px}.syb-footer h2{font-family:var(--syb-body);font-size:13px;text-transform:uppercase;letter-spacing:.08em}
@media(max-width:1024px){.syb-header-inner,.syb-nav,.syb-hero-grid,.syb-video,.syb-window-body{display:grid;grid-template-columns:1fr}.syb-nav{display:flex;flex-wrap:wrap}.syb-routes-grid,.syb-services-grid,.syb-category-grid,.syb-testimonials-grid,.syb-footer-grid,.syb-newsletter-box{grid-template-columns:1fr}.syb-newsletter-box{grid-template-areas:"intro" "resources" "form"}.syb-route:not(:last-child)::after,.syb-service:not(:last-child)::after{display:none}.syb-route{border-bottom:1px solid var(--syb-line)}.syb-leads{padding-left:0;padding-right:0;grid-template-columns:1fr}}@media(max-width:640px){.syb-container{padding-inline:16px}.syb-hero h1{font-size:34px!important}.syb-lead,.syb-service{grid-template-columns:1fr}.syb-form-row{display:grid;gap:10px}}


/* v22 - corrección definitiva de botones hero: no depende de .wp-block-buttons */
.syb-hero-buttons {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 16px !important;
  margin-top: 28px !important;
}

.syb-hero-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 0 28px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--syb-dark) !important;
  font-family: var(--syb-title) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.syb-hero-button-dark {
  background: var(--syb-dark) !important;
  color: #fff !important;
}

.syb-hero-button-outline {
  background: transparent !important;
  color: var(--syb-dark) !important;
}

/* Salvaguarda si WordPress conserva el bloque anterior en una plantilla ya guardada */
.syb-hero .wp-block-buttons {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  align-items: center !important;
  margin-top: 28px !important;
}

.syb-hero .wp-block-button,
.syb-hero .wp-block-buttons > .wp-block-button {
  display: block !important;
  width: auto !important;
  margin: 0 !important;
  position: static !important;
}

.syb-hero .wp-block-button__link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 0 28px !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}


/* v24 - testimonios sin marco gris */
.syb-testimonial {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 18px 28px !important;
  background: transparent !important;
}


/* v26 - versión más segura para REST/JSON en editor */
.syb-form-row-visual {
  display: flex;
  gap: 0;
}
.syb-fake-input {
  min-height: 46px;
  flex: 1;
  display: flex;
  align-items: center;
  border: 1px solid var(--syb-line);
  background: var(--syb-bg);
  padding: 0 14px;
  color: var(--syb-muted);
}
.syb-fake-button {
  min-width: 160px;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--syb-dark);
  background: var(--syb-dark);
  color: #fff !important;
  font-weight: 700;
  text-decoration: none;
}
@media(max-width:640px){
  .syb-form-row-visual { display: grid; gap: 10px; }
}

/* v27 - páginas, menú cursos, categorías y popup */
.syb-nav a[href="/cursos/"] { font-weight: 500; }
.syb-card { border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--syb-text); text-decoration: none; }
.syb-card img { border: 0 !important; border-radius: 0 !important; filter: none; }
.syb-card-body { padding: 18px 0 0 !important; }
.syb-card:hover h3 { text-decoration: underline; text-underline-offset: 4px; }
.syb-page-hero { padding-block: clamp(72px, 9vw, 132px) clamp(48px, 6vw, 80px); }
.syb-page-hero h1 { max-width: 820px; font-size: clamp(38px, 5vw, 68px); line-height: 1.02; margin-bottom: 24px; }
.syb-page-hero p { max-width: 720px; color: var(--syb-muted); font-size: 1.08rem; }
.syb-page-kicker { font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--syb-muted); }
.syb-page-grid, .syb-two-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: clamp(28px, 5vw, 72px); align-items: start; }
.syb-three-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 28px; }
.syb-page-card { border-top: 1px solid var(--syb-line); padding-top: 24px; }
.syb-page-card h2, .syb-page-card h3 { margin-top: 0; }
.syb-big-cta { background: var(--syb-soft); padding: clamp(34px, 5vw, 64px); margin-block: clamp(54px, 7vw, 92px); }
.syb-big-cta h2 { margin-top: 0; }
.syb-text-list { padding-left: 1.1rem; }
.syb-text-list li { margin-bottom: .55rem; }
.syb-link-button { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 26px; border: 1px solid var(--syb-dark); background: var(--syb-dark); color: #fff !important; text-decoration: none; font-weight: 700; }
.syb-link-button-outline { background: transparent; color: var(--syb-dark) !important; }
.syb-legal-text h2 { margin-top: 2.4rem; }
.syb-legal-note { border: 1px solid var(--syb-line); padding: 18px; color: var(--syb-muted); }
.syb-popup { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; padding: 24px; background: rgba(22,22,22,.56); }
.syb-popup:target { display: flex; }
.syb-popup-box { width: min(560px, 100%); background: var(--syb-bg); border: 1px solid var(--syb-line); padding: 32px; position: relative; }
.syb-popup-close { position: absolute; top: 14px; right: 16px; text-decoration: none; font-size: 28px; line-height: 1; color: var(--syb-text); }
.syb-lead a[href="#newsletter-popup"] { cursor: pointer; }
@media(max-width:1024px){ .syb-page-grid, .syb-two-grid, .syb-three-grid { grid-template-columns: 1fr; } }

/* v29 - refinamientos generales */
h1, .wp-block-post-title, .syb-page-hero h1, .syb-hero h1 {
  font-size: 40px !important;
  line-height: 1.1 !important;
}
.syb-menu-item { position: relative; }
.syb-submenu {
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  min-width: 250px;
  padding: 12px;
  border: 1px solid var(--syb-line);
  background: var(--syb-bg);
  display: none;
  z-index: 100;
}
.syb-menu-item:hover .syb-submenu,
.syb-menu-item:focus-within .syb-submenu {
  display: block;
}
.syb-submenu a {
  display: block;
  padding: 9px 10px;
}
.syb-card {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--syb-text);
  text-decoration: none;
}
.syb-card img {
  border: 0 !important;
  border-radius: 0 !important;
  filter: none;
}
.syb-card-body { padding: 18px 0 0 !important; }
.syb-card:hover h3 { text-decoration: underline; text-underline-offset: 4px; }

.syb-newsletter-box {
  border: 0 !important;
  border-top: 1px solid var(--syb-line) !important;
  border-radius: 0 !important;
  padding: 42px 0 0 !important;
}
.syb-lead {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
.syb-newsletter-window {
  border: 0 !important;
  border-top: 1px solid var(--syb-line) !important;
  border-radius: 0 !important;
}
.syb-window-top { display: none !important; }
.syb-window-body { padding-inline: 0 !important; }

.syb-page-hero { padding-block: clamp(72px, 9vw, 132px) clamp(48px, 6vw, 80px); }
.syb-page-hero p { max-width: 720px; color: var(--syb-muted); font-size: 1.08rem; }
.syb-page-kicker { font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--syb-muted); }
.syb-page-grid, .syb-two-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: clamp(28px, 5vw, 72px); align-items: start; }
.syb-three-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 28px; }
.syb-page-card { border-top: 1px solid var(--syb-line); padding-top: 24px; }
.syb-page-card h2, .syb-page-card h3 { margin-top: 0; }
.syb-big-cta { background: var(--syb-soft); padding: clamp(34px, 5vw, 64px); margin-block: clamp(54px, 7vw, 92px); }
.syb-big-cta h2 { margin-top: 0; }
.syb-text-list { padding-left: 1.1rem; }
.syb-text-list li { margin-bottom: .55rem; }
.syb-link-button { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 26px; border: 1px solid var(--syb-dark); background: var(--syb-dark); color: #fff !important; text-decoration: none; font-weight: 700; }
.syb-link-button-outline { background: transparent; color: var(--syb-dark) !important; }
.syb-legal-text h2 { margin-top: 2.4rem; }
.syb-legal-note { border: 1px solid var(--syb-line); padding: 18px; color: var(--syb-muted); }
.syb-popup { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; padding: 24px; background: rgba(22,22,22,.56); }
.syb-popup:target { display: flex; }
.syb-popup-box { width: min(560px, 100%); background: var(--syb-bg); border: 1px solid var(--syb-line); padding: 32px; position: relative; }
.syb-popup-close { position: absolute; top: 14px; right: 16px; text-decoration: none; font-size: 28px; line-height: 1; color: var(--syb-text); }
.syb-mailchimp-form, .syb-form-row { display: flex; gap: 0; }
.syb-mailchimp-form input, .syb-form-row input {
  min-height: 48px;
  flex: 1;
  border: 1px solid var(--syb-line);
  background: var(--syb-bg);
  padding: 0 14px;
  font: inherit;
}
.syb-mailchimp-form button, .syb-form-row button {
  min-width: 160px;
  min-height: 48px;
  border: 1px solid var(--syb-dark);
  background: var(--syb-dark);
  color: #fff;
  font-weight: 700;
}
.syb-icon-mini { width: 42px; height: 42px; margin-bottom: 16px; }
.syb-about-photo { width: 100%; filter: grayscale(100%); }
.syb-book-card { display: grid; grid-template-columns: 180px 1fr; gap: 24px; align-items: center; }
.syb-book-card img { max-width: 180px; width: 100%; box-shadow: 0 12px 30px rgba(0,0,0,.08); }
.syb-social-links { display: flex; gap: 18px; flex-wrap: wrap; }

@media(max-width:1024px){
  .syb-page-grid, .syb-two-grid, .syb-three-grid { grid-template-columns: 1fr; }
  .syb-nav { align-items: flex-start; }
  .syb-menu-item { width: 100%; }
  .syb-submenu { position: static; display: block; border: 0; padding: 4px 0 4px 16px; background: transparent; }
  .syb-book-card { grid-template-columns: 1fr; }
}
@media(max-width:640px){
  .syb-mailchimp-form, .syb-form-row { display: grid; gap: 10px; }
}


/* v30 - menú Servicios: zona mouse-over ampliada y continua */
.syb-header,
.syb-header-inner,
.syb-nav {
  overflow: visible !important;
}

.syb-header {
  position: relative;
  z-index: 1000;
}

.syb-menu-item {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  z-index: 1001;
}

/* Aumenta el área activa real del enlace Servicios */
.syb-menu-item > a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding-top: 12px;
  padding-bottom: 12px;
}

/* Puente invisible entre Servicios y el desplegable:
   forma parte del elemento padre, por lo que mantiene :hover activo. */
.syb-menu-item::after {
  content: "";
  position: absolute;
  left: -22px;
  right: -22px;
  top: 100%;
  height: 34px;
  background: transparent;
  pointer-events: auto;
}

/* Solapamos ligeramente el submenú con el puente para que no haya hueco muerto */
.syb-submenu {
  top: calc(100% + 22px) !important;
  left: -18px !important;
  z-index: 1002 !important;
  min-width: 260px;
}

.syb-menu-item:hover .syb-submenu,
.syb-menu-item:focus-within .syb-submenu,
.syb-submenu:hover {
  display: block !important;
}

/* Página Servicios v30 */
.syb-services-v30-intro {
  max-width: 880px;
}

.syb-services-v30-intro p,
.syb-services-v30-body p,
.syb-services-v30-body li,
.syb-services-v30-final p {
  color: var(--syb-muted);
}

.syb-services-v30-section {
  margin-block: clamp(56px, 7vw, 92px);
}

.syb-services-v30-problems {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin-top: 34px;
}

.syb-services-v30-problem {
  border-top: 1px solid var(--syb-line);
  padding-top: 24px;
}

.syb-services-v30-problem strong {
  display: block;
  margin-bottom: 8px;
  font-family: var(--syb-title);
  font-size: 23px;
}

.syb-services-v30-connection {
  max-width: 900px;
  margin-top: 32px;
  font-size: 18px;
}

.syb-services-v30-figure {
  margin: 38px 0 0;
}

.syb-services-v30-figure img {
  width: 100%;
  height: auto;
  display: block;
}

.syb-services-v30-quote {
  margin-block: 70px;
  padding: 44px 0;
  background: var(--syb-soft);
}

.syb-services-v30-quote blockquote {
  max-width: 900px;
  margin: 0;
  font-family: var(--syb-title);
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.15;
}

.syb-services-v30-quote p {
  margin-bottom: 0;
  color: var(--syb-muted);
}

.syb-services-v30-process {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 56px;
}

.syb-services-v30-stats {
  display: grid;
  gap: 16px;
}

.syb-services-v30-stat {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 16px;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--syb-line);
}

.syb-services-v30-stat strong {
  font-family: var(--syb-title);
  font-size: 38px;
}

.syb-services-v30-principles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
  margin-top: 34px;
}

.syb-services-v30-principles p {
  border-top: 1px solid var(--syb-line);
  padding-top: 18px;
  margin: 0;
  font-weight: 500;
}

.syb-services-v30-experience {
  display: grid;
  grid-template-columns: 1fr .8fr;
  gap: 56px;
  align-items: start;
}

.syb-services-v30-book {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 22px;
  align-items: center;
  padding: 24px;
  border: 1px solid var(--syb-line);
}

.syb-services-v30-book img {
  width: 100%;
  height: auto;
  display: block;
}

.syb-services-v30-offer {
  padding: 48px 0;
  background: var(--syb-soft);
}

.syb-services-v30-offer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
}

.syb-services-v30-offer dl {
  margin: 0;
}

.syb-services-v30-offer dl div {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(28,28,28,.16);
}

.syb-services-v30-offer dt {
  color: var(--syb-muted);
}

.syb-services-v30-offer dd {
  margin: 0;
  font-weight: 700;
}

.syb-services-v30-final {
  text-align: center;
  padding-bottom: 90px;
}

.syb-services-v30-final p {
  max-width: 760px;
  margin-inline: auto;
}

.syb-services-v30-related {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--syb-line);
}

@media(max-width:1024px) {
  .syb-services-v30-problems,
  .syb-services-v30-process,
  .syb-services-v30-principles,
  .syb-services-v30-experience,
  .syb-services-v30-offer-grid {
    grid-template-columns: 1fr;
  }

  .syb-services-v30-book {
    grid-template-columns: 160px 1fr;
  }

  /* En móvil el submenú ya está desplegado en v29; mantenemos esa lógica */
  .syb-menu-item::after {
    display: none;
  }
}

@media(max-width:640px) {
  .syb-services-v30-book {
    grid-template-columns: 1fr;
  }
}


/* v32 - página Proyectos / recuperación Stepienybarno Arquitectos */
.syb-projects-hero {
  max-width: 980px;
}

.syb-projects-manifesto {
  margin-block: 30px 90px;
  display: grid;
  grid-template-columns: .75fr 1.25fr;
  gap: 64px;
  align-items: start;
}

.syb-projects-manifesto h2,
.syb-projects-index h2,
.syb-projects-closing h2 {
  font-size: 34px;
}

.syb-projects-manifesto-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 26px 34px;
}

.syb-projects-manifesto-grid p {
  margin: 0;
  padding-top: 18px;
  border-top: 1px solid var(--syb-line);
  color: var(--syb-muted);
}

.syb-projects-index {
  margin-bottom: 72px;
}

.syb-projects-index h2 {
  max-width: 840px;
}

.syb-projects-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 24px;
  margin-top: 26px;
  padding-top: 20px;
  border-top: 1px solid var(--syb-line);
}

.syb-projects-nav a {
  color: var(--syb-text);
  text-decoration: none;
  font-weight: 500;
}

.syb-project-detail {
  padding-block: 68px;
  border-top: 1px solid var(--syb-line);
  scroll-margin-top: 120px;
}

.syb-project-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
  gap: clamp(40px, 6vw, 82px);
  align-items: start;
}

.syb-project-detail-grid--reverse .syb-project-cover {
  order: 2;
}

.syb-project-detail-grid--reverse .syb-project-copy {
  order: 1;
}

.syb-project-cover {
  margin: 0;
}

.syb-project-cover img {
  width: 100%;
  height: auto;
  display: block;
  filter: grayscale(100%);
}

.syb-project-cover--type {
  min-height: 420px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--syb-line);
  background: var(--syb-soft);
  font-family: var(--syb-title);
  letter-spacing: .12em;
}

.syb-project-cover--type span {
  font-size: clamp(64px, 9vw, 120px);
  line-height: .9;
}

.syb-project-cover--type small {
  margin-top: 16px;
  font-size: 18px;
  letter-spacing: .35em;
}

.syb-project-copy h2 {
  margin: 6px 0 22px;
  font-size: 34px;
}

.syb-project-copy > p {
  color: var(--syb-muted);
}

.syb-project-data {
  margin: 30px 0 24px;
  border-top: 1px solid var(--syb-line);
}

.syb-project-data div {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 18px;
  padding: 10px 0;
  border-bottom: 1px solid var(--syb-line);
}

.syb-project-data dt {
  color: var(--syb-muted);
}

.syb-project-data dd {
  margin: 0;
}

.syb-projects-closing {
  padding-block: 80px 100px;
  text-align: center;
}

.syb-projects-closing p {
  max-width: 780px;
  margin-inline: auto;
  color: var(--syb-muted);
}

@media(max-width:900px) {
  .syb-projects-manifesto,
  .syb-project-detail-grid {
    grid-template-columns: 1fr;
  }

  .syb-projects-manifesto-grid {
    grid-template-columns: 1fr;
  }

  .syb-project-detail-grid--reverse .syb-project-cover,
  .syb-project-detail-grid--reverse .syb-project-copy {
    order: initial;
  }

  .syb-project-cover--type {
    min-height: 280px;
  }
}

@media(max-width:640px) {
  .syb-project-copy h2,
  .syb-projects-manifesto h2,
  .syb-projects-index h2,
  .syb-projects-closing h2 {
    font-size: 28px;
  }

  .syb-project-data div {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}


/* v33 - galerías de proyectos */
.syb-project-gallery {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1.55fr .85fr .85fr;
  gap: 14px;
  margin-top: 34px;
  padding-top: 24px;
  border-top: 1px solid var(--syb-line);
}

.syb-project-gallery__item {
  display: block;
  overflow: hidden;
  min-height: 210px;
  background: var(--syb-soft);
}

.syb-project-gallery__item img {
  width: 100%;
  height: 100%;
  min-height: 210px;
  object-fit: cover;
  filter: grayscale(100%);
  transition: transform .25s ease;
}

.syb-project-gallery__item--wide img {
  object-position: center;
}

.syb-project-gallery__item--crop-left img {
  object-position: 20% center;
  transform: scale(1.14);
}

.syb-project-gallery__item:hover img {
  transform: scale(1.04);
}

.syb-project-gallery__item--crop-left:hover img {
  transform: scale(1.18);
}

.syb-project-gallery__source,
.syb-project-gallery__type {
  min-height: 210px;
  padding: 24px;
  border: 1px solid var(--syb-line);
  background: transparent;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: var(--syb-text);
  text-decoration: none;
}

.syb-project-gallery__source span,
.syb-project-gallery__source small,
.syb-project-gallery__type small {
  color: var(--syb-muted);
}

.syb-project-gallery__source strong {
  margin: 8px 0;
  font-family: var(--syb-title);
  font-size: 20px;
}

.syb-project-gallery__type {
  align-items: center;
  justify-content: center;
  font-family: var(--syb-title);
  letter-spacing: .12em;
  background: var(--syb-soft);
}

.syb-project-gallery__type span {
  font-size: 48px;
}

.syb-project-gallery__type small {
  margin-top: 8px;
  letter-spacing: .3em;
}

/* Footer: redes debajo de Servicios, en bloque propio */
.syb-footer-social {
  margin-top: 26px;
  padding-top: 20px;
  border-top: 1px solid var(--syb-line);
}

/* Botón móvil del menú */
.syb-mobile-menu-button {
  display: none;
  min-height: 44px;
  padding: 8px 14px;
  border: 1px solid var(--syb-dark);
  background: transparent;
  color: var(--syb-text);
  font-family: var(--syb-title);
  font-weight: 700;
  cursor: pointer;
}

.syb-mobile-talk {
  display: none !important;
}

@media(max-width:900px) {
  .syb-header-inner {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    gap: 14px !important;
  }

  .syb-brand {
    min-width: 0;
  }

  .syb-brand-text {
    font-size: 22px;
  }

  .syb-brand img {
    width: 44px;
    height: 44px;
  }

  .syb-mobile-menu-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: end;
  }

  .syb-header .syb-nav {
    grid-column: 1 / -1;
    display: none !important;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
    padding-top: 10px;
    border-top: 1px solid var(--syb-line);
  }

  .syb-header.syb-mobile-menu-open .syb-nav {
    display: flex !important;
  }

  .syb-header .syb-nav > a,
  .syb-header .syb-menu-item > a {
    width: 100%;
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 10px 2px;
    border-bottom: 1px solid var(--syb-line);
  }

  .syb-header .syb-menu-item {
    display: block !important;
    width: 100%;
  }

  .syb-header .syb-submenu {
    position: static !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    min-width: 0 !important;
    padding: 0 0 0 18px;
    border: 0;
    background: transparent;
  }

  .syb-header .syb-submenu a {
    border-bottom: 1px solid var(--syb-line);
    padding: 10px 0;
  }

  .syb-header .syb-button.syb-button-outline {
    display: none !important;
  }

  .syb-mobile-talk {
    display: flex !important;
    font-weight: 700;
  }

  .syb-project-gallery {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 12px;
    padding-bottom: 8px;
  }

  .syb-project-gallery > * {
    flex: 0 0 78%;
    scroll-snap-align: start;
  }
}

/* Más margen lateral en Recursos / Newsletter en móvil */
@media(max-width:640px) {
  .syb-newsletter {
    padding-inline: 12px;
  }

  .syb-newsletter .syb-container {
    padding-left: 26px !important;
    padding-right: 26px !important;
  }

  .syb-newsletter-box {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .syb-leads {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }

  .syb-project-gallery > * {
    flex-basis: 86%;
  }
}


/* v34 - páginas de servicios y sobre nosotros */
.syb-service-detail-section {
  margin-block: clamp(60px, 8vw, 104px);
}

.syb-service-detail-section > h2,
.syb-service-band h2,
.syb-about-intro h2,
.syb-about-collabs h2,
.syb-about-closing h2 {
  font-size: 34px;
  max-width: 820px;
}

.syb-service-pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin-top: 32px;
}

.syb-service-pillars article {
  position: relative;
  padding: 24px 34px 18px 0;
}

.syb-service-pillars article:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 12px;
  right: 18px;
  bottom: 12px;
  width: 1px;
  background: var(--syb-line);
}

.syb-service-pillars span,
.syb-service-steps span {
  display: block;
  margin-bottom: 12px;
  color: var(--syb-muted);
  font-size: 13px;
  letter-spacing: .08em;
}

.syb-service-pillars h3,
.syb-service-steps h3 {
  font-size: 23px;
}

.syb-service-pillars p,
.syb-service-wide,
.syb-service-audience p,
.syb-service-steps p,
.syb-about-intro p,
.syb-about-collabs p,
.syb-about-closing p {
  color: var(--syb-muted);
}

.syb-service-band {
  margin-block: 72px;
  padding-block: 54px;
  background: var(--syb-soft);
}

.syb-service-two {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 72px;
}

.syb-service-checks {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 28px;
}

.syb-service-checks p {
  margin: 0;
  padding: 14px 0;
  border-bottom: 1px solid rgba(28,28,28,.16);
}

.syb-service-audience {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 72px;
}

.syb-service-audience > div:last-child {
  display: grid;
  gap: 0;
}

.syb-service-audience > div:last-child p {
  margin: 0;
  padding: 14px 0;
  border-bottom: 1px solid var(--syb-line);
}

.syb-service-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 30px;
}

.syb-service-steps article {
  padding: 22px;
  border: 1px solid var(--syb-line);
}

.syb-about-intro {
  margin-block: 56px 90px;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 70px;
  align-items: center;
}

.syb-about-timeline {
  margin-block: 70px;
  padding-block: 58px;
  background: var(--syb-soft);
}

.syb-about-timeline-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 28px;
}

.syb-about-timeline-grid article {
  padding-top: 20px;
  border-top: 1px solid rgba(28,28,28,.2);
}

.syb-about-timeline-grid strong {
  font-family: var(--syb-title);
  font-size: 28px;
}

.syb-about-timeline-grid p {
  color: var(--syb-muted);
}

.syb-about-collabs {
  margin-block: 78px;
}

.syb-about-logo-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin: 30px 0;
}

.syb-about-logo-list span {
  min-height: 94px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  border: 1px solid var(--syb-line);
  text-align: center;
  font-family: var(--syb-title);
  font-weight: 700;
}

.syb-about-closing {
  padding-block: 72px 100px;
  text-align: center;
}

.syb-about-closing h2 {
  margin-inline: auto;
}

.syb-about-closing p {
  max-width: 760px;
  margin-inline: auto;
}

@media(max-width:900px) {
  .syb-service-pillars,
  .syb-service-two,
  .syb-service-audience,
  .syb-service-steps,
  .syb-about-intro,
  .syb-about-timeline-grid,
  .syb-about-logo-list {
    grid-template-columns: 1fr;
  }

  .syb-service-pillars article:not(:last-child)::after {
    display: none;
  }

  .syb-service-pillars article {
    border-bottom: 1px solid var(--syb-line);
  }

  .syb-service-checks {
    grid-template-columns: 1fr;
  }
}