.about-page { --about-ink:#243540; --about-slate:#405565; --about-mist:#86b7c3; --about-pale:#edf2f7; --about-paper:#f8fafb; color:var(--about-ink); background:var(--about-paper); }
.about-shell { width:min(1180px, calc(100% - 48px)); margin-inline:auto; }
.about-page .sf-floating-balloons { z-index:1; }
.about-page .about-shell { position:relative; z-index:2; }
.about-eyebrow { margin:0 0 1rem; color:var(--about-mist); font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }

/* ── Hero ── */
.about-hero { position:relative; height:auto; min-height:0; overflow:hidden; padding:118px 0 0; background:linear-gradient(180deg, #f8fafb 0%, var(--about-pale) 100%); }
.about-hero__grid { display:block; }
.about-hero__copy { max-width:720px; padding-bottom:clamp(3rem,5vw,4.5rem); }
.about-hero-kicker { margin:0 0 1.25rem; color:var(--about-mist) !important; font-size:.78rem !important; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.about-hero__copy h1 { margin:0 0 1.1rem; font-size:clamp(3.1rem,4.8vw,4.6rem); font-weight:500; line-height:1.02; letter-spacing:-.035em; color:var(--about-ink); }
.about-hero__copy h1 em { color:var(--about-mist); font-style:italic; font-weight:500; }
.about-hero__copy > p:not(.about-eyebrow) { color:#5d717b; font-size:1.05rem; line-height:1.75; }
.about-hero-signature { margin:1.5rem 0 0; color:var(--about-slate) !important; font-size:.82rem !important; font-weight:700; letter-spacing:.04em; }
.about-hero .about-eyebrow { color:var(--about-slate); }
.about-hero__photo { overflow:hidden; height:clamp(360px,42vw,590px); border:0; border-radius:20px 20px 0 0; background:#d6e3e6; box-shadow:none; }
.about-hero__photo img { display:block; width:100%; height:100%; object-fit:cover; }

/* ── Botones ── */
.about-button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.75rem 1.15rem; border:1px solid transparent; font-size:.82rem; font-weight:700; text-decoration:none; transition:transform .18s ease,background-color .18s ease; }
.about-button:hover { transform:translateY(-2px); }
.about-button--primary { background:var(--about-slate); color:#fff; }
.about-button--primary:hover { background:var(--about-ink); color:#fff; }
.about-button--light { background:#fff; color:var(--about-ink); }

/* ── Story (Sergio) ── */
.about-story { padding:clamp(5.5rem,9vw,8rem) 0; background:linear-gradient(180deg, var(--about-pale) 0%, var(--about-paper) 54%, #e8f0f2 100%); }
.about-story__copy { max-width:780px; margin-inline:auto; text-align:center; }
.about-story h2 { margin:0 0 1.35rem; font-size:clamp(2.7rem,4.6vw,4.9rem); font-weight:500; line-height:1; letter-spacing:-.035em; }
.about-story__copy p { color:#5d717b; font-size:1.02rem; line-height:1.75; margin:0 0 1.25rem; }

/* ── Values ── */
.about-values { position:relative; z-index:2; padding:clamp(5.5rem,9vw,8rem) 0; background:var(--about-ink); color:#fff; }
.about-section-heading { margin-bottom:2.7rem; }
.about-section-heading h2 { max-width:720px; margin-bottom:0; font-size:clamp(2.3rem,3.7vw,3.8rem); font-weight:500; line-height:1; letter-spacing:-.035em; }
.about-values .about-eyebrow { color:var(--about-mist); }
.about-values h2 { color:#fff; }
.about-values__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.about-values article { padding:1.6rem; border-radius:10px; background:rgba(255,255,255,.08); }
.about-values i { display:block; margin-bottom:1.5rem; color:var(--about-mist); font-size:1.8rem; }
.about-values h3 { margin:0 0 .7rem; color:#fff; font-size:1.45rem; font-weight:600; }
.about-values article p { margin:0; color:rgba(255,255,255,.72); font-size:.95rem; line-height:1.7; }

/* ── Detail ── */
.about-detail { padding:clamp(5.5rem,8vw,7rem) 0; background:#fff; }
.about-detail__copy { max-width:760px; }
.about-detail h2 { margin:0 0 1.35rem; font-size:clamp(2.7rem,4.6vw,4.9rem); font-weight:500; line-height:1; letter-spacing:-.035em; }
.about-detail__copy p { color:#5d717b; font-size:1.02rem; line-height:1.75; margin:0 0 1.5rem; }
.about-detail ul { margin:0; padding-left:1.2rem; color:#5d717b; line-height:2; }

/* ── Gallery ── */
.about-gallery { padding:clamp(5.5rem,9vw,8rem) 0; background:linear-gradient(180deg, #fff 0%, var(--about-pale) 100%); }
.about-section-heading--row { display:flex; align-items:end; justify-content:space-between; gap:2rem; }
.about-text-link { display:inline-flex; align-items:center; gap:.55rem; color:var(--about-slate); font-size:.9rem; font-weight:700; text-decoration:none; white-space:nowrap; }
.about-text-link:hover { color:var(--about-ink); }
.about-gallery__grid { display:flex; flex-wrap:wrap; gap:1.35rem; align-items:flex-start; padding:1.25rem 0 3.25rem; }
.about-gallery__item { position:relative; display:block; overflow:hidden; border:7px solid #fff; border-radius:8px; background:#d6e3e6; color:#fff; text-decoration:none; box-shadow:0 14px 28px rgba(36,53,64,.12); aspect-ratio:4/3; }
.about-gallery__item img { display:block; width:100%; height:100%; object-fit:cover; object-position:top center; transition:transform .3s ease; }
.about-gallery__item:hover img { transform:scale(1.04); }
.about-gallery__item span { position:absolute; inset:auto 0 0; padding:1.25rem; background:linear-gradient(transparent,rgba(36,53,64,.78)); font-family:var(--ec-font-title); font-size:1.25rem; font-weight:500; }
.about-gallery__item--1 { flex:0 0 calc(36% - .7rem); transform:rotate(1.1deg) translateY(.8rem); }
.about-gallery__item--2 { flex:0 0 calc(64% - .7rem); transform:rotate(-1deg) translateY(-1.1rem); }
.about-gallery__item--3 { flex:0 0 calc(45% - .9rem); transform:rotate(-.8deg) translateY(1.6rem); }
.about-gallery__item--4 { flex:0 0 calc(28% - .9rem); transform:rotate(1.3deg) translateY(-.3rem); }
.about-gallery__item--5 { flex:0 0 calc(27% - .9rem); transform:rotate(-1.1deg) translateY(1rem); }
.about-gallery__item:hover { transform:translateY(-.4rem) rotate(0); z-index:2; }

/* ── Closing ── */
.about-closing { padding:clamp(5.5rem,9vw,8rem) 0; background:linear-gradient(180deg, var(--about-pale) 0%, #fff 52%); color:var(--about-ink); text-align:center; }
.about-closing h2 { color:var(--about-ink); font-size:clamp(2.6rem,4.4vw,4.6rem); font-weight:500; line-height:1; letter-spacing:-.035em; margin:0 0 1.35rem; }
.about-closing p { max-width:560px; margin:0 auto 2rem; color:#5d717b; font-size:1.02rem; line-height:1.75; }
.about-closing .about-button--light { background:var(--about-slate); color:#fff; }
.about-closing .about-button--light:hover { background:var(--about-ink); color:#fff; }

/* ── Reveal ── */
.about-page [data-reveal] { opacity:0; transform:translateY(22px); transition:opacity .62s ease var(--reveal-delay, 0ms), transform .62s ease var(--reveal-delay, 0ms); }
.about-page [data-reveal].reveal-from-above:not(.is-revealed) { transform:translateY(-22px); }
.about-page [data-reveal].is-revealed { opacity:1; transform:translateY(0); }
.about-page .page-title-line { display:block; overflow:visible; }
.about-page .page-title-line > * { display:block; animation:about-title-rise .55s cubic-bezier(.2,.7,.2,1) both; }
.about-page .page-title-line:nth-child(2) > * { animation-delay:.08s; }
@keyframes about-title-rise { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }

/* ── 4:3 for gallery images ── */
.about-page .about-hero__photo { aspect-ratio:auto; }
.about-page .about-hero__photo img { object-position:top center; }

/* ── Responsive ── */
@media (max-width:991px) {
  .about-shell { width:min(100% - 36px,760px); }
  .about-hero { padding:100px 0 60px; }
  .about-hero__grid { grid-template-columns:1fr; }
  .about-hero__copy { padding-bottom:0; }
  .about-page .about-hero__photo { height:auto; margin-top:2.5rem; aspect-ratio:4/3; border-radius:16px; }
  .about-values__grid { grid-template-columns:repeat(2,1fr); }
  .about-gallery__grid { justify-content:center; }
}

@media (max-width:767px) {
  .about-shell { width:calc(100% - 30px); }
  .about-hero { padding:96px 0 56px; }
  .about-hero__copy h1 { font-size:clamp(2.8rem,12vw,4rem); }
  .about-story, .about-values, .about-gallery, .about-closing { padding:5rem 0; }
  .about-section-heading h2, .about-story h2, .about-detail h2 { font-size:clamp(2.2rem,9vw,3.2rem); }
  .about-values__grid { grid-template-columns:1fr; }
  .about-section-heading--row { align-items:start; flex-direction:column; }
  .about-gallery__grid { display:grid; grid-template-columns:1fr; gap:1rem; padding:0; }
  .about-gallery__item, .about-gallery__item--1, .about-gallery__item--2, .about-gallery__item--3, .about-gallery__item--4, .about-gallery__item--5 { flex-basis:auto; border-width:5px; transform:none; }
}

@media (prefers-reduced-motion:reduce) {
  .about-page [data-reveal] { opacity:1; transform:none; transition:none; }
  .about-page .page-title-line > * { animation:none; }
}

/* Brand-led redesign */
.about-page { overflow-x:hidden; background:var(--about-paper); }
.about-kicker { margin:0 0 1rem; color:var(--about-mist); font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }

.about-hero { min-height:760px; padding:120px 0 72px; background:linear-gradient(145deg,#f8fafb 0%,#edf2f7 58%,#dfe9ed 100%); }
.about-hero__grid { display:grid; grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr); gap:clamp(3rem,7vw,7rem); align-items:center; }
.about-hero__copy { max-width:630px; padding:0; }
.about-hero__copy h1 { margin:0 0 1.5rem; font-size:clamp(3.5rem,5.5vw,6rem); line-height:.93; letter-spacing:-.045em; }
.about-hero__copy h1 em { display:block; margin-top:.2em; color:var(--about-mist); font-style:normal; }
.about-hero__lead { max-width:560px; margin:0; color:#526a76 !important; font-size:1.08rem !important; line-height:1.8 !important; }
.about-hero__services { display:flex; flex-wrap:wrap; gap:.65rem; margin-top:2rem; }
.about-hero__services span { padding:.55rem .85rem; border:1px solid rgba(64,85,101,.22); border-radius:999px; color:var(--about-slate); font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.about-hero__brand { position:relative; min-height:570px; overflow:hidden; border-radius:28px 28px 120px 28px; background:linear-gradient(145deg,#edf2f7 0%,#d9e8ec 100%); }
.about-hero__pattern { position:absolute; inset:0; background:url('../brand/complements/pattern-balloons.webp') center / 118% auto no-repeat; opacity:.78; }
.about-hero__seal { position:absolute; inset:50% auto auto 50%; width:min(72%,330px); padding:1.8rem 2rem; border:1px solid rgba(64,85,101,.1); background:#fff; text-align:center; transform:translate(-50%,-50%) rotate(-2deg); }
.about-hero__seal img { display:block; width:100%; height:76px; object-fit:contain; }
.about-hero__seal small { display:block; margin-top:.7rem; color:var(--about-slate); font-size:.65rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.about-hero__index { position:absolute; right:-.02em; bottom:-.28em; color:rgba(255,255,255,.4); font-family:var(--ec-font-title); font-size:clamp(12rem,25vw,28rem); font-weight:700; line-height:1; pointer-events:none; }

.about-story { padding:clamp(6rem,10vw,9rem) 0; background:linear-gradient(180deg,#edf2f7 0%,#f8fafb 38%,#fff 100%); }
.about-story__copy { max-width:780px; }
.about-story h2 { margin-bottom:1.4rem; font-size:clamp(3rem,5vw,5.2rem); }
.about-story__intro { color:var(--about-ink) !important; font-family:var(--ec-font-title); font-size:clamp(1.3rem,2vw,1.75rem) !important; font-weight:500; line-height:1.45 !important; }
.about-story__credit { display:inline-block; margin:0 0 1.25rem; color:var(--about-slate) !important; font-size:.72rem !important; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.about-story__copy blockquote { margin:2.2rem auto 0; padding:1.4rem 0 1.4rem 1.5rem; border-left:3px solid var(--about-mist); color:var(--about-slate); font-family:var(--ec-font-title); font-size:1.2rem; line-height:1.55; text-align:left; max-width:520px; }

.about-manifesto { position:relative; z-index:2; isolation:isolate; padding:clamp(6rem,10vw,9rem) 0; overflow:hidden; background:var(--about-ink); color:#fff; }
.about-manifesto::before { content:''; position:absolute; inset:0; z-index:0; background:url('../brand/patterns/dark-floral-pattern.webp') center / cover no-repeat; opacity:.04; pointer-events:none; }
.about-manifesto > * { position:relative; z-index:1; }
.about-manifesto::after { content:''; position:absolute; right:-7rem; bottom:-9rem; width:30rem; height:30rem; border:1px solid rgba(134,183,195,.18); border-radius:50%; box-shadow:0 0 0 5rem rgba(134,183,195,.04),0 0 0 10rem rgba(134,183,195,.025); }
.about-manifesto__heading { position:relative; z-index:1; max-width:900px; }
.about-manifesto__heading h2 { margin:0; color:#fff; font-size:clamp(3rem,5.3vw,5.5rem); font-weight:500; line-height:.98; letter-spacing:-.04em; }
.about-manifesto__heading h2 em { color:var(--about-mist); font-style:normal; }
.about-manifesto__steps { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin:4.5rem 0 0; padding:0; border-top:1px solid rgba(255,255,255,.2); list-style:none; }
.about-manifesto__steps li { display:flex; gap:1.2rem; padding:2rem 1.6rem 0 0; }
.about-manifesto__steps li + li { padding-left:1.6rem; border-left:1px solid rgba(255,255,255,.16); }
.about-manifesto__steps li > span { color:var(--about-mist); font-size:.72rem; font-weight:700; letter-spacing:.1em; }
.about-manifesto__steps h3 { margin:0 0 .7rem; color:#fff; font-size:1.35rem; }
.about-manifesto__steps p { margin:0; color:rgba(255,255,255,.67); font-size:.92rem; line-height:1.7; }

.about-signature { padding:clamp(6rem,10vw,9rem) 0; background:linear-gradient(180deg,#d9e8ec 0%,#edf2f7 55%,#f8fafb 100%); }
.about-signature > .about-shell { display:grid; grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr); gap:clamp(4rem,9vw,8rem); align-items:start; }
.about-signature__heading { display:block; margin:0; }
.about-signature__heading h2 { max-width:490px; margin:0 0 1.4rem; font-size:clamp(3rem,4.6vw,5rem); font-weight:500; line-height:.96; letter-spacing:-.04em; }
.about-signature__heading h2 em { display:block; color:var(--about-mist); font-style:normal; }
.about-signature__heading > p:last-child { max-width:420px; margin:0; color:#5d717b; line-height:1.75; }
.about-signature__grid { display:flex; flex-direction:column; border-top:1px solid rgba(64,85,101,.25); }
.about-signature__grid article { display:grid; grid-template-columns:38px minmax(180px,.8fr) minmax(240px,1.2fr); gap:1.25rem; align-items:center; min-height:0; padding:1.8rem 0; border:0; border-bottom:1px solid rgba(64,85,101,.25); background:transparent; }
.about-signature__grid article > span { position:static; color:var(--about-mist); font-size:.68rem; font-weight:700; letter-spacing:.08em; }
.about-signature__grid h3 { max-width:none; margin:0; font-size:1.35rem; line-height:1.2; }
.about-signature__grid p { max-width:none; margin:0; color:#5d717b; font-size:.9rem; line-height:1.65; }

.about-promise { position:relative; z-index:2; isolation:isolate; overflow:hidden; padding:clamp(5rem,8vw,7rem) 0; background:linear-gradient(135deg,#dbe9ec 0%,#edf2f7 100%); }
.about-promise::before { content:''; position:absolute; inset:0; z-index:0; background:url('../brand/patterns/inverse-floral-pattern.webp') center / cover no-repeat; opacity:.025; pointer-events:none; }
.about-promise > * { position:relative; z-index:1; }
.about-promise__inner { display:block; max-width:920px; text-align:center; }
.about-promise p { margin:0 0 1rem; color:var(--about-slate); font-size:.78rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.about-promise strong { display:block; color:var(--about-ink); font-family:var(--ec-font-title); font-size:clamp(2rem,3.6vw,3.6rem); font-weight:500; line-height:1.18; }

.about-gallery { padding:clamp(6rem,10vw,9rem) 0; background:linear-gradient(180deg,#f8fafb 0%,#fff 42%,#edf2f7 100%); }
.about-gallery__heading { display:flex; align-items:end; justify-content:space-between; gap:2rem; margin-bottom:3rem; }
.about-gallery__heading h2 { max-width:720px; margin:0; font-size:clamp(2.8rem,4.5vw,4.8rem); font-weight:500; line-height:1; letter-spacing:-.035em; }
.about-gallery__grid { padding-top:0; }

.about-closing { position:relative; z-index:auto; overflow:hidden; padding:clamp(6rem,10vw,9rem) 0; background:linear-gradient(180deg,#edf2f7 0%,#fff 42%,#fff 100%); color:var(--about-ink); text-align:left; }
.about-closing__pattern { position:absolute; inset:0 0 0 55%; display:grid; grid-template-columns:repeat(3,1fr); place-items:center; opacity:.14; transform:rotate(-6deg) scale(1.12); }
.about-closing__pattern img { width:72px; }
.about-closing__content { position:relative; max-width:820px; text-align:center; }
.about-closing h2 { max-width:760px; margin:0 auto 1.2rem; color:var(--about-ink); font-size:clamp(3.2rem,5.5vw,5.8rem); }
.about-closing p:not(.about-kicker) { max-width:610px; margin:0 auto 2rem; color:#5d717b; }
.about-closing .about-button { gap:.65rem; background:var(--about-slate); color:#fff; }
.about-closing .about-button:hover { background:var(--about-ink); color:#fff; }

@media (max-width:991px) {
  .about-hero { min-height:0; padding:108px 0 64px; }
  .about-hero__grid { grid-template-columns:1fr; }
  .about-hero__brand { min-height:470px; }
  .about-manifesto__steps { grid-template-columns:1fr; }
  .about-manifesto__steps li,.about-manifesto__steps li + li { padding:1.5rem 0; border-left:0; border-bottom:1px solid rgba(255,255,255,.16); }
  .about-signature > .about-shell { grid-template-columns:1fr; gap:3rem; }
}

@media (max-width:767px) {
  .about-hero__copy h1 { font-size:clamp(3rem,13vw,4.4rem); }
  .about-hero__brand { min-height:390px; border-radius:20px 20px 70px 20px; }
  .about-hero__seal { width:76%; padding:1.25rem; }
  .about-hero__seal img { height:58px; }
  .about-signature__grid article { grid-template-columns:32px 1fr; }
  .about-signature__grid article p { grid-column:2; }
  .about-gallery__heading { align-items:flex-start; flex-direction:column; }
  .about-closing__pattern { inset:35% -20% -15% 30%; }
}