/* MicroMoments Machine · micromoments.css · versión 2026-10-08. Una sola hoja para páginas de origen, de destino y de ciudad a ciudad en airTRFX: todo vive bajo .mm-page y cada página indica su tipo con data-mm-page. Al actualizarla se reemplaza este mismo archivo. */
@font-face{font-family:"Copa Gilroy";src:url("https://www.copaair.com/promotions/assets/fonts/Gilroy-Bold.woff") format("woff");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Copa Suisse";src:url("https://www.copaair.com/promotions/assets/fonts/SuisseIntl-Regular.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Copa Suisse";src:url("https://www.copaair.com/promotions/assets/fonts/SuisseIntl-SemiBold.woff") format("woff");font-weight:600;font-style:normal;font-display:swap}
.mm-page{--mm-main:#0032A0;--mm-dark:#002880;--mm-light:#0E68FF;--mm-ink:#333333;--mm-muted:#666666;--mm-soft:#EFF5FF;--mm-line:#DBDAD8;max-width:1224px;margin:0 auto;padding:0 16px 48px;color:var(--mm-ink);background:#fff;font:400 16px/24px "Copa Suisse","Suisse Int’l","Suisse Intl",Helvetica,Arial,sans-serif;font-synthesis:none;overflow-wrap:break-word;text-align:left}
.mm-page,.mm-page *{box-sizing:border-box}
.mm-page h2,.mm-page h3{font-family:"Copa Gilroy",Gilroy,Helvetica,Arial,sans-serif;font-weight:700!important;color:var(--mm-main);text-transform:none}
.mm-page h2{font-size:20px;line-height:24px;letter-spacing:-.01em;margin:0 0 12px;max-width:40ch}
.mm-page h3{font-size:18px;line-height:24px;letter-spacing:normal;margin:0 0 4px}
.mm-page p{font:inherit;color:inherit;margin:0;text-wrap:pretty}
.mm-page h2,.mm-page h3{text-wrap:balance}
.mm-page a{color:var(--mm-light);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.mm-page a:hover{color:var(--mm-main)}
.mm-page a:focus-visible{outline:3px solid var(--mm-main);outline-offset:3px;border-radius:4px}
.mm-page img{display:block;max-width:100%;height:auto}

/* Opening photo and direct answer. On phones the photo runs edge to edge, then the answer and the action. */
.mm-page .mm-page__hero{margin:0 0 56px}
.mm-page .mm-page__hero-image{width:calc(100% + 32px);max-width:none;margin:0 -16px 24px;aspect-ratio:3/2;object-fit:cover}
.mm-page .mm-page__answer{max-width:65ch;font-size:18px;line-height:28px;margin:0 0 24px}
.mm-page .mm-page__button{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;padding:12px 24px;background:var(--mm-light);color:#fff;font-weight:600;border-radius:8px;text-decoration:none}
.mm-page .mm-page__button:hover{background:var(--mm-main);color:#fff}

/* Sections: question as heading, short answer first, then photo and detail. */
.mm-page .mm-page__section{margin:0 0 56px;min-width:0}
.mm-page .mm-page__section:last-child{margin-bottom:0}
.mm-page .mm-page__lead{max-width:65ch;font-size:18px;line-height:28px;margin:0 0 24px}
.mm-page .mm-page__section-head{min-width:0}
.mm-page .mm-page__section-image{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:16px;margin:0 0 20px;background:var(--mm-soft)}

/* Information cards: one idea per card, uniform neutral border. */
.mm-page .mm-page__cards{display:grid;gap:12px}
.mm-page .mm-page__cards .mm-page__item{padding:16px 20px;border:1px solid var(--mm-line);border-radius:16px;background:#fff}

/* Ordered steps on a Light Blue surface; the number is part of the sequence. */
.mm-page .mm-page__steps{display:grid;gap:12px;margin:0;padding:12px;background:var(--mm-soft);border-radius:24px;list-style:none;counter-reset:mm-step}
.mm-page .mm-page__steps .mm-page__item{position:relative;padding:20px 20px 20px 68px;background:#fff;border-radius:16px;counter-increment:mm-step}
.mm-page .mm-page__steps .mm-page__item::before{content:counter(mm-step);position:absolute;left:20px;top:20px;width:32px;height:32px;border-radius:999px;background:var(--mm-main);color:#fff;font-weight:600;font-size:16px;line-height:32px;text-align:center}
.mm-page .mm-page__steps--titled .mm-page__item{padding-left:20px}
.mm-page .mm-page__steps--titled .mm-page__item::before{content:none}

/* Questions and useful links: one readable column with subtle separators. */
.mm-page .mm-page__faq,.mm-page .mm-page__links{display:grid;max-width:80ch}
.mm-page .mm-page__faq .mm-page__item,.mm-page .mm-page__links .mm-page__item{padding:16px 0;border-bottom:1px solid var(--mm-line)}
.mm-page .mm-page__faq .mm-page__item:first-child,.mm-page .mm-page__links .mm-page__item:first-child{padding-top:0}
.mm-page .mm-page__faq .mm-page__item:last-child,.mm-page .mm-page__links .mm-page__item:last-child{border-bottom:0;padding-bottom:0}
.mm-page .mm-page__links h3{font-family:"Copa Suisse","Suisse Int’l","Suisse Intl",Helvetica,Arial,sans-serif;font-size:16px;line-height:24px}
.mm-page .mm-page__links p{color:var(--mm-muted)}

/* Official Copa icons: interface icons beside a fact, pictograms beside a step or a Copa service. Decorative (alt=""). */
.mm-page .mm-page__icon{display:block;flex:none;max-width:none}
.mm-page .mm-page__cards .mm-page__item--icon{display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:12px;align-items:start}
.mm-page .mm-page__cards .mm-page__item--icon > .mm-page__icon{grid-row:1/3;width:24px;height:24px}
.mm-page .mm-page__cards .mm-page__item--picto{grid-template-columns:48px minmax(0,1fr);column-gap:16px;align-items:center}
.mm-page .mm-page__cards .mm-page__item--picto > .mm-page__icon{width:48px;height:48px}
.mm-page .mm-page__steps .mm-page__item--icon{padding-left:20px}
.mm-page .mm-page__steps .mm-page__item--icon::before{content:none}
.mm-page .mm-page__steps .mm-page__item--icon > .mm-page__icon{width:56px;height:56px;margin:0 0 12px}
.mm-page .mm-page__steps .mm-page__item--icon h3::before{content:counter(mm-step) ". "}
.mm-page .mm-page__links .mm-page__item--icon{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:16px;align-items:center}
.mm-page .mm-page__links .mm-page__item--icon > .mm-page__icon{grid-row:1/3;width:48px;height:48px}

/* Copa services: their own chapter on a Light Blue band, after the destination content. */
.mm-page .mm-page__section--service{padding:24px 20px;background:var(--mm-soft);border-radius:24px}
.mm-page .mm-page__section--service + .mm-page__section--service{margin-top:-40px}
.mm-page .mm-page__section--service .mm-page__links{gap:12px;max-width:none}
.mm-page .mm-page__section--service .mm-page__links .mm-page__item,.mm-page .mm-page__section--service .mm-page__links .mm-page__item:first-child,.mm-page .mm-page__section--service .mm-page__links .mm-page__item:last-child,.mm-page .mm-page__section--service .mm-page__links .mm-page__item:nth-child(2){padding:16px;border:0;border-radius:16px;background:#fff}

@media(min-width:600px){
 .mm-page .mm-page__cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
 .mm-page .mm-page__button{display:inline-flex;width:auto}
}
@media(min-width:700px){
 .mm-page{padding:0 24px 64px}
 .mm-page h2{font-size:28px;line-height:32px;letter-spacing:-.025em;margin-bottom:16px}
 .mm-page .mm-page__hero{margin-bottom:72px}
 .mm-page .mm-page__hero-image{width:100%;margin:24px 0;border-radius:24px}
 .mm-page .mm-page__section{margin-bottom:72px}
 .mm-page .mm-page__section--service{padding:40px}
 .mm-page .mm-page__section-image{border-radius:24px;margin-bottom:24px}
 .mm-page .mm-page__steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:16px}
 .mm-page .mm-page__section--service .mm-page__links{column-gap:12px}
 .mm-page .mm-page__links{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;max-width:none}
 .mm-page .mm-page__links .mm-page__item:nth-child(2){padding-top:0}
}
@media(min-width:960px){
 .mm-page .mm-page__hero--media{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);align-items:center;gap:40px;padding-top:24px}
 .mm-page .mm-page__hero--media .mm-page__hero-image{margin:0}
 .mm-page .mm-page__answer{font-size:20px;line-height:32px}
 .mm-page .mm-page__cards{grid-template-columns:repeat(3,minmax(0,1fr))}
 .mm-page .mm-page__cards:has(> .mm-page__item:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
 .mm-page .mm-page__steps{grid-template-columns:repeat(3,minmax(0,1fr))}
 /* Sections with a photo: question and short answer centered next to the whole photo, alternating sides; detail below. */
 .mm-page .mm-page__section--media{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:48px;align-items:center}
 .mm-page .mm-page__section--media > .mm-page__section-head{grid-column:1;grid-row:1}
 .mm-page .mm-page__section--media > .mm-page__section-image{grid-column:2;grid-row:1;margin:0}
 .mm-page .mm-page__section--flip > .mm-page__section-head{grid-column:2}
 .mm-page .mm-page__section--flip > .mm-page__section-image{grid-column:1}
 .mm-page .mm-page__section--media > .mm-page__section-head .mm-page__lead{margin-bottom:0}
 .mm-page .mm-page__section--media > :is(.mm-page__cards,.mm-page__steps,.mm-page__faq,.mm-page__links){grid-column:1/-1;grid-row:2;margin-top:32px}
 /* Every third photo section: question and answer centered, wide photo below, detail after. */
 .mm-page .mm-page__section--center{grid-template-columns:minmax(0,1fr)}
 .mm-page .mm-page__section--center > .mm-page__section-head{grid-column:1;grid-row:1;max-width:760px;margin:0 auto 32px;text-align:center}
 .mm-page .mm-page__section--center > .mm-page__section-head :is(h2,.mm-page__lead){margin-left:auto;margin-right:auto}
 .mm-page .mm-page__section--center > .mm-page__section-image{grid-column:1;grid-row:2;aspect-ratio:2/1}
 .mm-page .mm-page__section--center > :is(.mm-page__cards,.mm-page__steps,.mm-page__faq,.mm-page__links){grid-row:3}
 /* Questions in two columns on large screens; the separator disappears on the last row. */
 .mm-page .mm-page__faq{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;max-width:none}
 .mm-page .mm-page__faq .mm-page__item,.mm-page .mm-page__faq .mm-page__item:last-child{padding:20px 0;border-bottom:1px solid var(--mm-line)}
 .mm-page .mm-page__faq .mm-page__item:nth-child(-n+2){padding-top:0}
 .mm-page .mm-page__faq .mm-page__item:last-child,.mm-page .mm-page__faq .mm-page__item:nth-child(odd):nth-last-child(2){border-bottom:0;padding-bottom:0}
}
@media(min-width:1100px){
 .mm-page .mm-page__steps--titled{grid-template-columns:repeat(4,minmax(0,1fr))}
 .mm-page h2{font-size:32px;line-height:40px;letter-spacing:-.496px}
 .mm-page h3{font-size:20px;line-height:32px}
 .mm-page .mm-page__links h3{font-size:16px;line-height:24px}
}