:root{
  --emerald:#073f35;
  --ivory:#f5f0e6;
  --ink:#163029;
  --soft-ink:#365148;
  --white:#fffdf8;
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"Manrope", Arial, sans-serif;
  --script:"Imperial Script", "Times New Roman", cursive;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;touch-action:pan-y}
body{margin:0;background:var(--ivory);color:var(--ink);font-family:var(--sans);overflow-x:hidden;touch-action:pan-y}
img{max-width:100%}

.grain{
  position:fixed;
  inset:0;
  z-index:9999;
  pointer-events:none;
  opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E");
}

/* SECTION 1 — PORTADA */
.hero{
  position:relative;
  min-height:100svh;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:#0a1915;
}
.hero-photo{
  position:absolute;
  top:0;
  bottom:0;
  left:3%;
  right:auto;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 60%;
  opacity:0;
  transform:scale(1.13);
  filter:saturate(.94) contrast(1.02) blur(4px);
  animation:heroPhotoIn 2.2s cubic-bezier(.22,.7,.2,1) forwards,
            heroDrift 15s 2.2s cubic-bezier(.18,.72,.22,1) forwards;
}
.hero-shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,rgba(3,26,22,.12) 0%,rgba(3,34,28,.06) 46%,rgba(2,27,23,.33) 100%);
  opacity:0;
  animation:heroShadeIn 2.1s ease-out forwards;
}
.hero-names{
  position:absolute;
  left:50%;
  top:39%;
  z-index:2;
  width:min(88vw,760px);
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(54px,6.4vw,96px);
  line-height:.9;
  letter-spacing:-.025em;
  color:#fffaf0;
  text-shadow:0 5px 34px rgba(0,0,0,.4);
  opacity:0;
  filter:blur(24px);
  transform:translate(-50%,18px) scale(.985);
  animation:heroNamesIn 1.55s 1.45s cubic-bezier(.2,.7,.2,1) forwards;
}
.hero-names .amp{font-size:.7em;line-height:.72;margin:.02em 0}

@keyframes heroPhotoIn{
  0%{opacity:0;transform:scale(1.13);filter:saturate(.9) contrast(.98) blur(4px)}
  100%{opacity:1;transform:scale(1.08);filter:saturate(.96) contrast(1.02) blur(0)}
}
@keyframes heroDrift{from{transform:scale(1.08)}to{transform:scale(1.115)}}
@keyframes heroShadeIn{from{opacity:0}to{opacity:1}}
@keyframes heroNamesIn{
  0%{opacity:0;filter:blur(24px);transform:translate(-50%,18px) scale(.985)}
  100%{opacity:1;filter:blur(0);transform:translate(-50%,0) scale(1)}
}

/* GENERIC REVEAL */
.reveal{
  opacity:0;
  transition:opacity 1.05s cubic-bezier(.2,.6,.2,1),transform 1.05s cubic-bezier(.2,.6,.2,1),filter 1.05s ease;
  will-change:opacity,transform,filter;
}
.reveal-down{transform:translateY(-32px)}
.reveal-up{transform:translateY(28px)}
.reveal-fade{transform:none;filter:blur(5px)}
.reveal.visible{opacity:1;transform:none;filter:blur(0)}

/* SECTION 2 — FECHA + COUNTDOWN */
.date-section{
  min-height:auto;
  display:block;
  background:var(--ivory);
  padding:10px clamp(18px,4vw,42px) clamp(58px,6vw,80px);
}
.date-inner{
  width:min(1180px,100%);
  min-height:auto;
  margin:0 auto;
  display:grid;
  justify-items:center;
  text-align:center;
  gap:clamp(72px,6vw,84px);
  position:relative;
  top:0;
}
.date-main{display:grid;justify-items:center;gap:8px}
.date-day{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(138px,18vw,260px);
  line-height:.82;
  letter-spacing:-.055em;
  color:var(--emerald);
  margin-bottom:clamp(16px,1.35vw,24px);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  font-variant-numeric:lining-nums;
  font-feature-settings:"lnum" 1;
}
.date-digit{display:block;line-height:.82}
.date-month-year{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(36px,3.3vw,58px);
  line-height:1.05;
  color:#264239;
}
.date-location{
  margin-top:4px;
  font-size:clamp(12px,1vw,16px);
  letter-spacing:.21em;
  text-transform:uppercase;
  color:rgba(7,63,53,.68);
}
.countdown-block{width:min(1120px,100%);display:grid;gap:18px}
.countdown-title{
  font-size:clamp(12px,1vw,14px);
  letter-spacing:.24em;
  text-transform:uppercase;
  color:rgba(7,63,53,.72);
}
.countdown{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
  align-items:center;
  gap:clamp(10px,1.3vw,18px);
}
.countdown-item{display:grid;gap:8px;justify-items:center;min-width:0}
.countdown-item strong{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(50px,5.4vw,84px);
  line-height:1;
  color:var(--emerald);
}
.countdown-item span{
  font-size:clamp(11px,.95vw,14px);
  letter-spacing:.17em;
  text-transform:uppercase;
  color:rgba(7,63,53,.68);
}
.divider{width:1px;height:58px;background:rgba(7,63,53,.17)}

/* SECTION 3 — FOTO COMPLETA + CITA */
.sky-section{margin:0;padding:0;background:#163029}
.sky-wrap{position:relative;margin:0;width:100%;overflow:hidden}
.sky-photo{display:block;width:100%;height:auto}
.sky-quote{
  position:absolute;
  z-index:2;
  top:clamp(34px,5vw,86px);
  left:50%;
  transform:translateX(-50%);
  width:min(86%,900px);
  text-align:center;
  color:#f8f4ee;
  pointer-events:none;
}
.sky-quote.reveal{
  opacity:0;
  filter:blur(8px);
  transform:translate(-50%,12px);
  transition:opacity 2.75s cubic-bezier(.16,.62,.20,1),
             filter 2.75s cubic-bezier(.16,.62,.20,1),
             transform 2.75s cubic-bezier(.16,.62,.20,1);
}
.sky-quote.reveal.visible{
  opacity:1;
  filter:blur(0);
  transform:translate(-50%,0);
}
.sky-quote p{
  margin:0;
  font-family:var(--serif);
  font-style:normal;
  font-weight:300;
  font-size:clamp(28px,3vw,48px);
  line-height:1.18;
  letter-spacing:-.01em;
  text-shadow:0 2px 12px rgba(0,0,0,.3),0 1px 2px rgba(0,0,0,.22);
}
.sky-quote cite{
  display:block;
  margin-top:18px;
  font-family:var(--serif);
  font-style:normal;
  font-weight:300;
  font-size:clamp(16px,1.35vw,21px);
  letter-spacing:.04em;
  text-transform:none;
  color:#f5ecdd;
  text-shadow:0 2px 10px rgba(0,0,0,.26);
}


/* SECTION 2 — INVITACIÓN + FECHA + COUNTDOWN */
.invite-section{
  min-height:auto;
  display:grid;
  justify-items:center;
  align-content:start;
  background:var(--ivory);
  padding:clamp(38px,4vw,58px) clamp(24px,7vw,96px) clamp(22px,2.4vw,34px);
}
.invite-section + .date-section{
  padding-top:0;
}
.invite-inner{
  width:min(980px,100%);
  text-align:center;
  display:grid;
  justify-items:center;
  gap:0;
}

.monogram{display:none}
.monogram::before,.monogram::after{content:none}
.monogram span{display:none}
.invite-inner h2{
  margin:0;
  max-width:920px;
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(48px,5.4vw,76px);
  line-height:1.02;
  letter-spacing:-.028em;
  color:var(--emerald);
  text-wrap:balance;
}

@media(max-width:760px){
  .hero{min-height:100svh}
  .hero-photo{left:0;right:auto;object-position:45% 60%}
  .hero-names{left:50%;top:40%;font-size:11.5vw;width:88vw}
  .date-section{min-height:auto;padding:8px 18px 54px}
  .date-inner{min-height:auto;gap:54px;width:min(100%,620px);position:relative;top:0}
  .date-day{font-size:36vw}
  .date-month-year{font-size:9vw}
  .date-location{font-size:3.4vw;letter-spacing:.18em}
  .countdown{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:0;column-gap:2px;width:100%}
  .divider{display:none}
  .countdown-item{gap:5px}
  .countdown-item strong{font-size:clamp(31px,11vw,54px)}
  .countdown-item span{font-size:clamp(7px,2.35vw,10px);letter-spacing:.05em;white-space:nowrap}
  .sky-quote{top:28px;width:min(88%,680px)}
  .sky-quote p{font-size:clamp(22px,5vw,34px);line-height:1.2}
  .sky-quote cite{margin-top:14px;font-size:11px;letter-spacing:.14em}
  .invite-section{min-height:auto;padding:34px 22px 22px}
  .invite-section + .date-section{padding-top:0}
  .invite-inner{gap:0}
  .monogram{display:none}
  .monogram::before,.monogram::after{content:none}
  .monogram span{display:none}
  .invite-inner h2{font-size:11.5vw;line-height:1.02;max-width:94vw}
}

@media(max-width:560px){
  .sky-quote{top:22px;width:min(90%,540px)}
  .sky-quote p{font-size:clamp(20px,6vw,30px)}
  .sky-quote cite{font-size:10px;letter-spacing:.12em}
}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .hero-photo,.hero-shade,.hero-names,.reveal{opacity:1!important;filter:none!important}
  .hero-photo{transform:scale(1.08)!important}
  .hero-names{transform:translate(-50%,0)!important}
  .reveal{transform:none!important}
}



/* SECTION 4 — DETALLES */
.details-section{
  background:var(--ivory);
  padding:clamp(74px,8vw,112px) 22px clamp(88px,9vw,128px);
}
.details-inner{
  width:min(860px,100%);
  margin:0 auto;
  display:grid;
  justify-items:center;
  gap:clamp(72px,7vw,96px);
}
.detail-item{
  width:min(760px,100%);
  display:grid;
  justify-items:center;
  text-align:center;
  gap:18px;
}
.detail-illustration{
  display:block;
  height:auto;
  object-fit:contain;
}
.detail-illustration.map{width:clamp(108px,11vw,150px)}
.detail-illustration.cross{width:clamp(82px,8vw,112px)}
.detail-illustration.celebration{width:clamp(142px,14vw,195px)}
.detail-illustration.dresscode{width:clamp(140px,14vw,190px)}
.detail-copy{
  display:grid;
  justify-items:center;
  gap:9px;
}
.detail-copy h3{
  margin:0;
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(34px,3.25vw,50px);
  line-height:1.04;
  letter-spacing:-.02em;
  color:var(--emerald);
  text-wrap:balance;
}
.detail-copy p{
  margin:0;
  max-width:700px;
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(22px,2vw,30px);
  line-height:1.3;
  color:#2d473f;
  text-wrap:balance;
}
.detail-copy .detail-time{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:.28em;
  line-height:1;
  white-space:nowrap;
}
.detail-time .time-main{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(40px,3.6vw,56px);
  line-height:.92;
  color:var(--emerald);
}
.detail-time .time-suffix{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(15px,1.25vw,19px);
  line-height:1;
  letter-spacing:.08em;
  color:#2d473f;
  padding-bottom:.16em;
}
.detail-link{
  display:inline-block;
  margin-top:5px;
  font-family:var(--sans);
  font-size:13px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--emerald);
  text-decoration:none;
  border-bottom:1px solid rgba(7,63,53,.36);
  padding-bottom:4px;
}
.detail-link:hover{border-color:var(--emerald)}
@media(max-width:760px){
  .details-section{padding:64px 20px 82px}
  .details-inner{gap:62px}
  .detail-item{gap:15px}
  .detail-copy h3{font-size:10.5vw;max-width:92vw}
  .detail-copy p{font-size:5.8vw;line-height:1.26;max-width:92vw}
  .detail-time .time-main{font-size:11.5vw}
  .detail-time .time-suffix{font-size:4.2vw;padding-bottom:.14em}
  .detail-link{font-size:11px}
  .detail-illustration.map{width:126px}
  .detail-illustration.cross{width:92px}
  .detail-illustration.celebration{width:156px}
  .detail-illustration.dresscode{width:152px}
}


/* Section 5 - Galeria fotografica / movimiento continuo */
.gallery-section{
  width:100%;
  margin:0;
  padding:0;
  overflow:hidden;
  background:transparent;
}
.gallery-viewport{
  position:relative;
  width:100%;
  height:min(82vh,920px);
  overflow:hidden;
  outline:none;
  touch-action:pan-y;
}
.gallery-track{
  position:absolute;
  left:0;
  top:50%;
  display:flex;
  align-items:center;
  gap:0;
  width:max-content;
  will-change:transform;
  transform:translate3d(0,-50%,0);
  animation:galleryMarquee var(--gallery-duration,180s) linear infinite;
}
.gallery-slide{
  flex:0 0 auto;
  height:min(82vh,920px);
  margin:0;
  padding:0;
  line-height:0;
  user-select:none;
  overflow:hidden;
}
.gallery-slide img{
  display:block;
  width:auto;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:contain;
  user-select:none;
  -webkit-user-drag:none;
  pointer-events:none;
}
.gallery-dots{display:none!important}
@keyframes galleryMarquee{
  from{transform:translate3d(0,-50%,0)}
  to{transform:translate3d(-50%,-50%,0)}
}
@media(max-width:760px){
  .gallery-viewport{height:min(72vh,760px)}
  .gallery-slide{height:min(72vh,760px)}
}
@media(prefers-reduced-motion:reduce){
  .gallery-track{animation:none}
}



/* Section 6 - Mesa de Regalos */
.gifts-section{
  position:relative;
  width:100%;
  margin:0;
  padding:clamp(96px,11vw,150px) 22px;
  background:var(--ivory);
  display:grid;
  place-items:center;
  text-align:center;
}
.gifts-inner{
  width:min(900px,100%);
  margin:0 auto;
}
.gifts-title{
  margin:0;
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(48px,5.4vw,76px);
  line-height:1;
  letter-spacing:-.025em;
  color:var(--emerald);
}
.gifts-copy{
  margin:24px auto 0;
  max-width:760px;
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(24px,2.1vw,31px);
  line-height:1.35;
  color:#2d473f;
  text-wrap:balance;
}
.gifts-grid{
  margin-top:42px;
  display:grid;
  grid-template-columns:repeat(2,minmax(260px,1fr));
  gap:clamp(22px,2.4vw,34px);
  align-items:stretch;
}
.gift-card{
  background:transparent;
  border:none;
  border-radius:28px;
  padding:clamp(24px,2.6vw,34px) clamp(18px,2vw,26px) 24px;
  box-shadow:none;
  display:grid;
  justify-items:center;
  align-content:start;
  gap:12px;
}
.gift-logo-wrap{
  width:100%;
  height:auto;
  display:grid;
  place-items:center;
}
.gift-logo-frame{
  position:relative;
  width:min(100%,340px);
  height:auto;
  aspect-ratio:340 / 90;
  border-radius:22px;
  overflow:visible;
  display:grid;
  place-items:center;
  box-shadow:none;
  background:transparent;
}
.gift-logo-frame-liverpool{background:transparent;border:none;}
.gift-logo-frame-palacio{background:transparent;border:none;}
.gift-logo{
  display:block;
  max-width:none;
  user-select:none;
}
.gift-logo-liverpool{
  width:92%;
  max-width:302px;
  height:auto;
  object-fit:contain;
}
.gift-logo-palacio{
  position:static;
  width:92%;
  max-width:302px;
  max-height:126px;
  height:auto;
  transform:none;
  object-fit:contain;
}
.gift-caption{
  margin:0;
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(7,63,53,.72);
}
@media(max-width:760px){
  .gifts-section{padding:82px 20px 96px}
  .gifts-title{font-size:11.5vw}
  .gifts-copy{font-size:6vw;max-width:92vw}
  .gifts-grid{grid-template-columns:1fr;gap:20px;margin-top:34px}
  .gift-card{border-radius:24px;padding:22px 18px}
  .gift-logo-wrap{height:auto}
  .gift-logo-frame{width:min(100%,320px);height:auto;border-radius:20px}
  .gift-logo-palacio{width:92%;max-height:118px}
}


.gift-link{
  text-decoration:none;
  border-bottom:1px solid rgba(7,63,53,.32);
  padding-bottom:4px;
  transition:border-color .25s ease,opacity .25s ease;
  cursor:pointer;
}
.gift-link:hover{border-color:rgba(7,63,53,.78);opacity:.82}

/* Divider + Section 7 */
.section7-separator{
  width:100%;
  height:1px;
  background:rgba(7,63,53,.28);
}
.section7-empty{
  width:100%;
  min-height:auto;
  background:var(--ivory);
  padding:clamp(96px,11vw,150px) 22px;
  display:block;
  text-align:center;
}
.section7-inner{
  width:min(760px,100%);
  margin:0 auto;
  display:grid;
  justify-items:center;
  text-align:center;
  gap:22px;
}
.section7-title{
  margin:0;
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(48px,5.4vw,76px);
  line-height:1;
  letter-spacing:-.025em;
  color:var(--emerald);
}
.section7-icon-link{
  display:inline-grid;
  place-items:center;
  text-decoration:none;
  color:var(--emerald);
  transition:transform .28s ease, opacity .28s ease;
}
.section7-icon-link:hover{
  transform:translateY(-2px);
  opacity:.86;
}
.section7-whatsapp{
  width:clamp(82px,8.3vw,112px);
  height:auto;
  display:block;
}
.section7-message{
  display:inline-block;
  margin:0;
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(24px,2.1vw,32px);
  line-height:1.28;
  color:#2d473f;
  text-decoration:none;
  border-bottom:0;
  padding-bottom:6px;
  transition:opacity .25s ease;
  text-wrap:balance;
}
.section7-message:hover{
  opacity:.84;
}
.section7-message-emphasis{
  border-bottom:1px solid rgba(7,63,53,.42);
  padding-bottom:2px;
}
.section7-message:hover .section7-message-emphasis{
  border-color:rgba(7,63,53,.82);
}
@media(max-width:760px){
  .section7-empty{padding:82px 20px}
  .section7-inner{gap:18px}
  .section7-title{font-size:11.5vw}
  .section7-whatsapp{width:88px}
  .section7-message{font-size:6.2vw;max-width:92vw}
}


/* Section 8 - Fotografía + cita */
.section8-photo-section{
  position:relative;
  width:100%;
  margin:0;
  padding:0;
  overflow:hidden;
  background:var(--ivory);
  aspect-ratio:1600 / 1066;
}
.section8-photo{
  display:block;
  width:100%;
  height:auto;
  max-width:none;
}
.section8-monogram{
  position:absolute;
  z-index:2;
  left:50%;
  top:clamp(86px,9vw,138px);
  width:min(60%,820px);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(12px,1.4vw,22px);
  color:#8d1f16;
  pointer-events:none;
  font-family:var(--serif);
  font-style:normal;
  font-weight:600;
  font-size:clamp(50px,5.15vw,86px);
  line-height:1;
  letter-spacing:.05em;
  text-shadow:0 1px 10px rgba(255,248,238,.18),0 1px 2px rgba(0,0,0,.12);
}
.section8-monogram .mono-r,
.section8-monogram .mono-amp{
  display:inline-block;
}
.section8-monogram::before,
.section8-monogram::after{
  content:"";
  width:clamp(28px,3vw,54px);
  height:1px;
  background:rgba(141,31,22,.58);
}
.section8-monogram.reveal{
  opacity:0;
  filter:blur(8px);
  transform:translate(-50%,12px);
  transition:opacity 2.75s cubic-bezier(.16,.62,.20,1),
             filter 2.75s cubic-bezier(.16,.62,.20,1),
             transform 2.75s cubic-bezier(.16,.62,.20,1);
}
.section8-monogram.reveal.visible{
  opacity:1;
  filter:blur(0);
  transform:translate(-50%,0);
}

.section8-quote{
  position:absolute;
  z-index:2;
  right:5.5%;
  top:47%;
  width:min(41%,640px);
  text-align:left;
  color:#f8f4ee;
  pointer-events:none;
}
.section8-quote.reveal{
  opacity:0;
  filter:blur(8px);
  transform:translateY(12px);
  transition:opacity 2.75s cubic-bezier(.16,.62,.20,1),
             filter 2.75s cubic-bezier(.16,.62,.20,1),
             transform 2.75s cubic-bezier(.16,.62,.20,1);
}
.section8-quote.reveal.visible{
  opacity:1;
  filter:blur(0);
  transform:translateY(0);
}
.section8-quote p{
  margin:0;
  font-family:var(--serif);
  font-style:normal;
  font-weight:300;
  font-size:clamp(22px,2.1vw,35px);
  line-height:1.22;
  letter-spacing:-.01em;
  text-shadow:0 2px 12px rgba(0,0,0,.38),0 1px 2px rgba(0,0,0,.28);
  text-wrap:normal;
}
.section8-quote cite{
  display:block;
  margin-top:16px;
  text-align:right;
  font-family:var(--serif);
  font-style:normal;
  font-weight:700;
  font-size:clamp(15px,1.2vw,20px);
  letter-spacing:.035em;
  color:#f7efe2;
  text-shadow:0 2px 10px rgba(0,0,0,.34);
}
@media(max-width:760px){
  .section8-monogram{
    left:50%;
    top:clamp(34px,10vw,50px);
    width:64%;
    gap:8px;
    font-size:clamp(25px,7.2vw,44px);
  }
  .section8-monogram::before,
  .section8-monogram::after{
    width:clamp(14px,4vw,28px);
  }
  .section8-quote{
    right:5.5%;
    top:43.5%;
    width:41%;
    text-align:left;
  }
  .section8-quote p{
    font-size:clamp(12.5px,1.85vw,15px);
    line-height:1.22;
    letter-spacing:-.01em;
  }
  .section8-quote cite{
    margin-top:8px;
    font-size:clamp(8.5px,1.0vw,10.5px);
    letter-spacing:.035em;
  }
}

.bank-transfer{
  width:min(620px,100%);
  margin:52px auto 0;
  padding-top:0;
  text-align:center;
  color:var(--emerald);
  position:relative;
}
.bank-transfer-title{
  margin:0;
  font-family:var(--serif);
  font-size:clamp(24px,2.2vw,32px);
  font-weight:300;
  line-height:1.15;
  color:var(--emerald);
}
.bank-transfer-bank{
  margin:12px 0 0;
  font-family:var(--sans);
  font-size:13px;
  font-weight:400;
  line-height:1.5;
  letter-spacing:.08em;
  color:rgba(7,63,53,.78);
}
.bank-transfer-name{
  margin:3px 0 0;
  font-family:var(--serif);
  font-size:clamp(18px,1.55vw,23px);
  font-weight:300;
  line-height:1.2;
  color:#2d473f;
}
.bank-transfer-clabe{
  margin:18px auto 0;
  font-family:var(--sans);
  font-size:clamp(22px,2.1vw,28px);
  font-weight:400;
  line-height:1.25;
  letter-spacing:.075em;
  color:var(--emerald);
  font-variant-numeric:tabular-nums lining-nums;
  font-feature-settings:"tnum" 1,"lnum" 1;
  white-space:nowrap;
}
.clabe-copy-controls{
  display:grid;
  justify-items:center;
  gap:12px;
  margin:18px auto 0;
  width:100%;
}
.copy-clabe{
  appearance:none;
  -webkit-appearance:none;
  display:block;
  margin:0;
  padding:8px 2px 7px;
  border:0;
  border-bottom:1px solid rgba(7,63,53,.32);
  background:transparent;
  color:rgba(7,63,53,.72);
  font-family:var(--sans);
  font-size:11px;
  font-weight:500;
  line-height:1.4;
  letter-spacing:.18em;
  text-transform:uppercase;
  cursor:pointer;
  transition:opacity .2s ease,border-color .2s ease;
}
.copy-clabe:hover{opacity:.78;border-bottom-color:rgba(7,63,53,.72)}
.copy-clabe:focus-visible{outline:2px solid rgba(7,63,53,.35);outline-offset:6px;border-radius:2px}
.copy-clabe:disabled{cursor:wait;opacity:.6}
.copy-feedback{
  display:block;
  width:100%;
  max-width:460px;
  min-height:20px;
  margin:0;
  padding:0;
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  line-height:1.55;
  letter-spacing:.015em;
  text-transform:none;
  color:var(--emerald);
  text-wrap:balance;
}
.clabe-manual{
  width:min(100%,370px);
  display:grid;
  gap:10px;
  text-align:center;
}
.clabe-manual[hidden]{display:none}
.clabe-manual label,.clabe-manual p{
  margin:0;
  font-family:var(--sans);
  font-size:12px;
  font-weight:400;
  line-height:1.6;
  color:var(--emerald);
}
.clabe-manual input{
  width:100%;
  min-width:0;
  padding:12px 10px;
  border:1px solid rgba(7,63,53,.3);
  border-radius:8px;
  background:var(--ivory);
  color:var(--emerald);
  font-family:var(--sans);
  font-size:clamp(16px,4.7vw,21px);
  font-weight:500;
  font-variant-numeric:tabular-nums lining-nums;
  letter-spacing:.04em;
  text-align:center;
  user-select:text;
  -webkit-user-select:text;
}
.clabe-manual input:focus{outline:2px solid rgba(7,63,53,.4);outline-offset:3px}
@media(max-width:760px){
  .bank-transfer{margin-top:44px;padding-top:0}
  .bank-transfer-bank{font-size:12px}
  .bank-transfer-clabe{font-size:clamp(18px,5.1vw,23px);letter-spacing:.055em}
}