/*
  PRINTGATS · pasada de claridad 2026-08-09
  Sistema: marfil / tinta / naranja, retícula editorial, títulos legibles junto a la pieza,
  densidad alta con separaciones de 24—96 px y movimiento reservado a orientar el recorrido.
*/

/* Inicio: el ensamblaje conserva su gesto, pero el resultado comparte encuadre con un mensaje útil. */
.hero-story{height:180svh}
.hero-cut,
.hero-story[data-cut-locked] .hero-cut{
  transform:translate(calc(-50% + var(--story-shift,0vw)),-50%)!important;
}
.hero-story__giant{
  z-index:7;
  top:22%;
  right:auto;
  left:var(--pad);
  width:42vw;
  margin:0;
  color:#111318;
  -webkit-text-stroke:0;
  text-stroke:0;
  font-size:clamp(50px,6.25vw,96px);
  font-weight:650;
  line-height:.82;
  letter-spacing:-.065em;
  text-align:left;
  white-space:normal;
  opacity:1;
}
.hero-story__giant span{display:block}
.hero-story__giant span:nth-child(2){font-family:"Newsreader",Georgia,serif;font-style:italic;font-weight:400}
.hero-story__giant span:last-child{margin-top:.08em;color:var(--accent)}
.hero-story__meta--left{max-width:38vw}
.motion-horizontal{height:230svh}

/* Copy de portada aprobado para prueba local: mantiene la composición en tres golpes legibles. */
.hero-story__headline{
  left:var(--pad);
  top:26%;
  width:calc(100% - var(--pad)*2);
  font-size:clamp(46px,7.3vw,124px);
  line-height:.78;
}
.hero-story__headline span:nth-child(2){margin-left:4vw}
.hero-story__headline span:nth-child(3){margin-left:12vw}
.hero-story__promise{
  width:min(50vw,680px);
  font-size:clamp(42px,4.55vw,74px);
  line-height:.86;
}
.hero-story__promise span:nth-child(2){margin-top:.1em;color:var(--accent)}

/* La transformación se ve completa sin convertir la imagen en una pared. */
.before-after{
  min-height:0;
  display:grid;
  grid-template-columns:minmax(260px,.68fr) minmax(390px,1fr);
  align-items:center;
  gap:clamp(38px,7vw,112px);
  padding:clamp(72px,8vw,116px) var(--pad);
}
.before-after .section-head{
  display:block;
  margin:0;
  opacity:1!important;
  transform:none!important;
}
.before-after .section-head>p{margin-bottom:1.25rem}
.before-after .section-head h2{font-size:clamp(58px,7.2vw,108px);line-height:.8}
.before-after .compare{
  justify-self:center;
  width:min(100%,520px)!important;
  height:min(72svh,690px)!important;
  min-height:520px;
  margin:0;
  border:1px solid rgba(11,13,14,.12);
  border-radius:22px!important;
  background:#eee9e1;
  box-shadow:0 24px 62px rgba(28,25,22,.12)!important;
  transform:none!important;
}
.before-after .compare-base,
.before-after .compare-before img{object-fit:contain;object-position:center}

/* Contacto: una única entrada, dos canales reales y la voz como opción secundaria. */
.contact-studio.clarity-contact{
  min-height:0;
  display:block;
  grid-template-columns:none;
  padding:clamp(76px,8vw,116px) var(--pad) clamp(84px,9vw,132px);
  background:#f0eee8;
  color:#0a0b0c;
  clip-path:none;
  transform:none;
}
.clarity-contact__intro{
  display:grid;
  grid-template-columns:minmax(120px,.3fr) minmax(0,1.1fr) minmax(250px,.48fr);
  gap:clamp(24px,4vw,70px);
  align-items:end;
  margin-bottom:clamp(38px,5vw,66px);
  padding-bottom:24px;
  border-bottom:1px solid rgba(10,11,12,.18);
}
.clarity-contact__eyebrow{margin:0;color:#67635c;font-size:9px;font-weight:800;letter-spacing:.17em;text-transform:uppercase}
.clarity-contact__eyebrow span{color:var(--accent)}
.clarity-contact__intro h2{
  max-width:9ch;
  margin:0;
  font-family:"Newsreader",Georgia,serif;
  font-size:clamp(58px,7vw,108px);
  font-weight:400;
  line-height:.79;
  letter-spacing:-.06em;
  text-wrap:balance;
}
.clarity-contact__intro h2 em{color:var(--accent);font-weight:400}
.clarity-contact__intro>p:last-child{max-width:34ch;margin:0;color:#5e5a54;font-size:clamp(14px,1.15vw,17px);line-height:1.55;text-wrap:pretty}
.clarity-contact__shell{
  display:grid;
  grid-template-columns:minmax(330px,.72fr) minmax(0,1.28fr);
  overflow:hidden;
  margin:0;
  border:1px solid rgba(10,11,12,.18);
  border-radius:24px;
  background:#faf8f3;
  box-shadow:0 26px 70px rgba(25,22,18,.1);
}
.clarity-contact__primary{
  display:flex;
  min-width:0;
  flex-direction:column;
  padding:clamp(32px,4vw,58px);
  background:#0a0b0c;
  color:#f5f1e9;
}
.clarity-contact__label{margin:0 0 16px;color:var(--accent);font-size:9px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.clarity-contact__primary h3{max-width:8ch;margin:0;font-family:"Newsreader",Georgia,serif;font-size:clamp(42px,4.8vw,72px);font-weight:400;line-height:.86;letter-spacing:-.055em}
.clarity-contact__primary>p{max-width:31ch;margin:22px 0 0;color:rgba(245,241,233,.68);font-size:14px;line-height:1.55}
.clarity-contact__actions{display:grid;gap:10px;margin:clamp(30px,5vw,58px) 0 0}
.clarity-contact__whatsapp,
.clarity-contact__email{
  display:flex;
  min-height:72px;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:0 22px;
  border:1px solid rgba(245,241,233,.3);
  border-radius:12px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  transition:transform .35s var(--ease),background .3s,color .3s;
}
.clarity-contact__whatsapp{border-color:#25d366;background:#25d366;color:#07140c}
.clarity-contact__whatsapp strong{font-size:clamp(21px,2.3vw,31px);letter-spacing:-.04em;text-transform:none}
.clarity-contact__whatsapp span{display:grid;gap:2px}
.clarity-contact__whatsapp small{font-size:8px;letter-spacing:.14em;text-transform:uppercase}
.clarity-contact__email{min-height:54px}
.clarity-contact__whatsapp:hover,.clarity-contact__whatsapp:focus-visible,.clarity-contact__email:hover,.clarity-contact__email:focus-visible{transform:translateY(-3px);background:#f5f1e9;color:#0a0b0c}
.clarity-contact__next{display:grid;gap:0;margin:auto 0 0;padding:34px 0 0;list-style:none}
.clarity-contact__next li{display:grid;grid-template-columns:30px 1fr;gap:10px;padding:11px 0;border-top:1px solid rgba(245,241,233,.18);font-size:11px;line-height:1.4}
.clarity-contact__next span{color:var(--accent);font-weight:800}
.clarity-contact__next p{margin:0}
.clarity-contact__brief{min-width:0;padding:clamp(32px,4.6vw,64px)}
.clarity-contact__brief-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:30px}
.clarity-contact__brief-head span{color:#6a665f;font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.clarity-contact__brief-head h3{margin:5px 0 0;font-size:clamp(27px,3.2vw,44px);line-height:1;letter-spacing:-.05em}
.clarity-contact__brief-head p{max-width:24ch;margin:0;color:#6a665f;font-size:12px;line-height:1.45;text-align:right}
.clarity-contact fieldset{min-width:0;margin:0;padding:0;border:0}
.clarity-contact legend{margin:0 0 15px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.clarity-contact .quote-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:0 0 26px}
.clarity-contact .quote-options label>span{min-height:112px;height:auto;padding:16px;border:1px solid rgba(10,11,12,.2);border-radius:10px;background:transparent}
.clarity-contact .quote-options label>span b{font-size:14px}
.clarity-contact .quote-options label>span small{font-size:10px;line-height:1.35}
.clarity-contact .quote-field{display:grid;gap:9px}
.clarity-contact .quote-field>span{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.clarity-contact .quote-field textarea{width:100%;min-height:124px;resize:vertical;border:1px solid rgba(10,11,12,.2);border-radius:10px;padding:17px;background:#fffdfa;color:#0a0b0c;font:inherit;line-height:1.5}
.clarity-contact__voice{margin-top:18px;border-top:1px solid rgba(10,11,12,.18);border-bottom:1px solid rgba(10,11,12,.18)}
.clarity-contact__voice>summary{min-height:56px;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;font-size:10px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;list-style:none}
.clarity-contact__voice>summary::-webkit-details-marker{display:none}
.clarity-contact__voice>summary span:last-child{color:#6a665f;font-size:9px}
.clarity-contact__voice[open]>summary{border-bottom:1px solid rgba(10,11,12,.14)}
.clarity-contact .voice-note{margin:0;padding:22px 0 4px;border:0;border-radius:0;background:transparent}
.clarity-contact .voice-status{margin-bottom:14px}
.clarity-contact__status{grid-column:1/-1;min-height:0;margin:0;padding:0 16px;color:#a63218;font-size:11px}
.clarity-contact__privacy{grid-column:1/-1;margin:0;padding:14px 20px;border-top:1px solid rgba(10,11,12,.14);background:#f0eee8;color:#66625c;font-size:10px;line-height:1.45;text-align:center}

@media(max-width:900px){
  .hero-story{height:175svh}
  .hero-cut,.hero-story[data-cut-locked] .hero-cut{transform:translate(-50%,-48%)!important}
  .hero-story__giant{top:12vh;left:var(--pad);width:calc(100% - var(--pad)*2);font-size:clamp(42px,10.5vw,74px);line-height:.82;text-align:center}
  .hero-story__giant span{display:inline}.hero-story__giant span::after{content:" "}
  .hero-story__giant span:last-child{display:block}
  .hero-story__headline{top:26%;width:calc(100% - var(--pad)*2);font-size:clamp(40px,10vw,76px);line-height:.8}
  .hero-story__headline span:nth-child(2),.hero-story__headline span:nth-child(3){margin-left:0}
  .hero-story__promise{top:14vh;width:calc(100% - var(--pad)*2);font-size:clamp(36px,8.5vw,62px)}
  .motion-horizontal{height:auto}
  .before-after{grid-template-columns:1fr;gap:36px;padding-top:76px;padding-bottom:76px}
  .before-after .section-head{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:end}
  .before-after .section-head>p{grid-column:1/-1;margin:0}
  .before-after .section-head h2{font-size:clamp(52px,12vw,82px)}
  .before-after .compare{width:min(100%,440px)!important;height:min(68svh,640px)!important;min-height:470px}
  .clarity-contact__intro{grid-template-columns:1fr;gap:22px}
  .clarity-contact__intro h2{font-size:clamp(55px,14vw,88px)}
  .clarity-contact__shell{grid-template-columns:1fr}
  .clarity-contact__primary{min-height:620px}
}
@media(max-width:620px){
  .hero-story__giant{top:13vh;font-size:11vw}
  .hero-story__headline{top:27%;font-size:clamp(39px,10.4vw,52px)}
  .hero-story__promise{top:16vh;font-size:clamp(33px,8.7vw,43px)}
  .before-after{padding-right:20px;padding-left:20px}
  .before-after .section-head{display:block}.before-after .section-head>p{margin-bottom:18px}
  .before-after .compare{height:min(65svh,570px)!important;min-height:430px}
  .contact-studio.clarity-contact{padding-top:64px;padding-right:20px;padding-left:20px}
  .clarity-contact__intro{margin-bottom:30px}
  .clarity-contact__intro h2{font-size:clamp(50px,15vw,72px)}
  .clarity-contact__primary{min-height:540px;padding:30px 24px}
  .clarity-contact__brief{padding:32px 22px}
  .clarity-contact__brief-head{display:block}.clarity-contact__brief-head p{margin-top:10px;text-align:left}
  .clarity-contact .quote-options{grid-template-columns:1fr}
  .clarity-contact .quote-options label>span{min-height:82px}
}
@media(prefers-reduced-motion:reduce){
  .hero-cut,.hero-story[data-cut-locked] .hero-cut{transform:translate(-50%,-50%)!important}
}