/* OCEANSING — Herramientas / composición editorial de la suite. */
.tools-page { overflow: clip; }
.tools-kicker { color: rgba(255,255,255,.46); font: 700 10px/1.6 'Courier New',Courier,monospace; letter-spacing: .19em; }

/* Portada: negro puro, ondas gráficas y tipografía con WarpText. */
.tools-hero { background: #000; min-height: max(100svh,700px); position: relative; isolation: isolate; overflow: hidden; }
.tools-hero__content {
  position: relative; z-index: 2;
  width: min(calc(100% - 88px),1500px); min-height: inherit; margin-inline: auto;
  display: grid; grid-template-columns: minmax(0,1.15fr) minmax(390px,.85fr);
  align-items: center; gap: clamp(0px,1vw,22px);
  padding: calc(var(--aq-header-height) + 35px) 0 72px;
}
.tools-hero__copy { min-width: 0; position: relative; z-index: 2; }
.tools-hero__title { margin: 18px 0 12px; width: 100%; text-align:left; }
.tools-title-warp { width: 100%; height: clamp(112px,9.4vw,162px); }
.tools-title-warp--serif { height: clamp(118px,10.3vw,178px); margin-top: -17px; }
.tools-title-warp .warp-fallback { justify-content: flex-start; text-align:left; padding: 0 1.2%; white-space: nowrap; font-weight: 400; }
.tools-title-warp--sans .warp-fallback { font: 500 clamp(60px,7.4vw,112px)/1 Arial,Helvetica,sans-serif; letter-spacing: -.068em; }
.tools-title-warp--serif .warp-fallback { font: italic 400 clamp(57px,7.05vw,108px)/1 'Della Respira',Georgia,serif; letter-spacing: -.06em; }
.tools-hero__intro { color: rgba(255,255,255,.64); font-size: clamp(15px,1.32vw,19px); line-height: 1.65; max-width: 50ch; margin: 12px 0 0; padding-left: 1.2%; text-align:left; }

/* Sección de la suite: la cuadrícula solo aparece bajo la portada. */
.tools-catalog { width: 100%; max-width: none; padding: 0; min-height: 0; }
.tools-catalog__inner { width: min(calc(100% - 96px),1400px); margin-inline: auto; position: relative; z-index: 2; padding: 105px 0 140px; }
.tools-catalog.grid-stage::after { background: linear-gradient(180deg,#000 0%,rgba(0,0,0,.92) 7%,rgba(0,0,0,.25) 30%,rgba(0,0,0,.42) 83%,#000 100%); box-shadow: none; }
.tools-catalog .shape-grid { -webkit-mask-image: linear-gradient(180deg,transparent,#000 200px,#000 calc(100% - 150px),transparent); mask-image: linear-gradient(180deg,transparent,#000 200px,#000 calc(100% - 150px),transparent); }
.tools-catalog__intro { display:block; margin:0 0 56px; padding:0; border:0; }
/* El titular es un único grupo tipográfico, con las dos fuentes y alineación al inicio. */
.programs-grid { display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(13px,1.5vw,22px); }
.program-card { min-width:0; position:relative; }
.card-nav__links a[aria-current='page'] { color:#fff; font-weight:700; }

@media (max-width: 1150px) {
  .tools-hero__content { width:calc(100% - 60px); grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr); }
  .tools-title-warp--sans .warp-fallback { font-size:clamp(54px,6.7vw,88px); }
  .tools-title-warp--serif .warp-fallback { font-size:clamp(52px,6.3vw,84px); }
  .tools-catalog__inner { width:calc(100% - 60px); }
  .programs-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 850px) {
  .tools-hero { min-height: max(100svh,800px); }
  .tools-hero__content { width:min(calc(100% - 44px),670px); grid-template-columns:minmax(0,1fr); gap:12px; align-content:center; padding:150px 0 76px; }
  .tools-hero__copy { text-align:left; }
  .tools-title-warp { height:102px; }
  .tools-title-warp--serif { height:117px; margin-top:-15px; }
  .tools-title-warp--sans .warp-fallback { font-size:clamp(56px,8.5vw,85px); }
  .tools-title-warp--serif .warp-fallback { font-size:clamp(50px,7.4vw,80px); }
  .tools-hero__intro { margin:10px 0 12px; padding-left:1.2%; text-align:left; }
  .tools-catalog__inner { width:calc(100% - 44px); padding:84px 0 110px; }
}
@media (max-width: 700px) {
  .tools-hero { min-height: max(100svh,745px); }
  .tools-hero__content { padding:120px 0 52px; }
  .tools-title-warp { height:84px; }
  .tools-title-warp--serif { height:97px; margin-top:-9px; }
  .tools-title-warp--sans .warp-fallback { font-size:clamp(40px,10.8vw,68px); }
  .tools-title-warp--serif .warp-fallback { font-size:clamp(36px,9vw,60px); }
  .tools-catalog__headline { flex-wrap:wrap; gap:0; }
  .programs-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 460px) {
  .tools-hero { min-height: max(100svh,680px); }
  .tools-hero__content { width:calc(100% - 30px); padding:105px 0 40px; }
  .tools-title-warp { height:69px; }
  .tools-title-warp--serif { height:79px; margin-top:-7px; }
  .tools-title-warp--sans .warp-fallback { font-size:clamp(37px,10.5vw,48px); }
  .tools-title-warp--serif .warp-fallback { font-size:clamp(32px,8.15vw,43px); }
  .tools-hero__intro { font-size:14px; max-width:35ch; }
  .tools-catalog__inner { width:calc(100% - 36px); padding:70px 0 94px; }
  .programs-grid { grid-template-columns:1fr; max-width:390px; margin-inline:auto; }
}
@media (max-width:360px) {
  .tools-title-warp--sans .warp-fallback { font-size:34px; }
  .tools-title-warp--serif .warp-fallback { font-size:29px; }
}

/* Bloque descriptivo y accesos laterales de la suite. */
.tools-catalog__lede {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px 28px;
  align-items: end;
  margin: 18px 0 32px;
}
.tools-catalog__lede-copy {
  max-width: 66ch;
}
.tools-catalog__lede-copy p {
  margin: 0;
  color: rgba(255,255,255,.64);
  font: 400 clamp(14px,1.22vw,17px)/1.72 Arial,Helvetica,sans-serif;
}
.tools-action-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 12px;
}
.tools-action-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 20px;
  border: 0;
  border-radius: 11px;
  background: #f6f6f5;
  color: #111;
  font: 700 12px/1 'Courier New', Courier, monospace;
  letter-spacing: .13em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}
.tools-action-link:hover,
.tools-action-link:focus-visible { background: #dededb; }
.tools-action-link:focus-visible { outline: 2px solid #f6f6f5; outline-offset: 3px; }
.flip-card__front-note {
  margin: -10px 0 16px;
  color: rgba(255,255,255,.63);
  font: 400 11px/1.45 Arial,Helvetica,sans-serif;
  text-wrap: balance;
}
@media (max-width: 900px) {
  .tools-catalog__lede { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .tools-action-links { gap: 10px; }
  .tools-action-link { width: 100%; justify-content: center; }
  }

/* Encabezado de catálogo estático: evita GPU extra y cortes en móvil. */
.tools-catalog__headline.catalog-heading {
  display:flex;
  flex-wrap:nowrap;
  align-items:baseline;
  justify-content:flex-start;
  gap:clamp(5px,1vw,18px);
  margin:14px 0 0;
  max-width:100%;
  white-space:nowrap;
  font-weight:400;
  line-height:1.2;
  font-size:clamp(28px,5.65vw,86px);
  letter-spacing:-.075em;
}
.catalog-heading__primary { font-family:Arial,Helvetica,sans-serif; font-style:normal; font-weight:500; }
.catalog-heading__accent { font-family:'Della Respira',Georgia,serif; font-weight:400; font-style:italic; letter-spacing:-.057em; }
@media(max-width:850px) {
  .tools-catalog__headline.catalog-heading {font-size:clamp(20px,5.8vw,44px);gap:7px;margin-top:8px;}
}
@media(max-width:380px) {
  .tools-catalog__headline.catalog-heading {font-size:clamp(19px,5.6vw,22px);gap:5px;}
}
