/* Checkout and confirmation share a full travel scene and one white card.
   The order remains the focus: editable eSIM rows, contact details, then pay. */
.checkout-review{max-width:1120px;padding-bottom:88px}
.review-heading{margin-bottom:32px}
.review-heading h1{font-size:42px;letter-spacing:-.045em;line-height:1.12}
.review-heading p{margin-top:10px;color:var(--muted);font-size:16px;line-height:1.6}
.checkout-basket{max-width:none;padding-bottom:0}
.checkout-card{position:relative;max-width:1120px;width:calc(100% - 64px);margin:32px auto 0;padding:32px 40px 40px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 14px 42px rgb(25 39 40 / .08)}
.checkout-art+.checkout-card{margin-top:clamp(-104px,-8vw,-32px)}
.checkout-card .breadcrumbs{padding:0 0 22px;font-size:12px}
.review-layout{display:grid;grid-template-columns:minmax(0,1fr) 420px;align-items:start;gap:40px}
.review-checkout{min-width:0;padding-left:28px;border-left:1px solid var(--line)}
.review-details{min-width:0}
.review-main,.review-travellers{min-width:0}
.review-section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.review-section-heading h2{display:flex;align-items:center;gap:10px;font-size:24px;line-height:1.2;letter-spacing:-.025em}
.review-section-heading .flag{width:28px;height:21px;object-fit:cover;border-radius:3px;flex-shrink:0}
.review-section-heading>span{color:var(--muted);font-size:13px;white-space:nowrap}
.review-lines{border-bottom:1px solid var(--line)}
.review-line{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:16px;padding:16px 0;border-top:1px solid var(--line)}
.review-line-details{min-width:0}
.review-person{display:flex;align-items:center;gap:12px;min-width:0}
.review-person>div{min-width:0}
.review-person h3,.review-traveller{font-size:16px;line-height:1.3;letter-spacing:-.01em;overflow-wrap:anywhere}
:is(.review-person,.review-traveller) .person-avatar{width:36px;height:36px;font-size:13px;flex-shrink:0}
:is(.review-person,.review-traveller) .person-avatar>.icon{width:18px;height:18px}
:is(.review-person,.review-traveller) .person-avatar>img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.checkout-basket .unassigned-avatar{background:transparent;color:#73827f;border:1px dashed #bbc6c2}
.review-person-change{display:inline-flex;align-items:center;gap:12px;max-width:100%;min-height:44px;padding:0;font:inherit;font-weight:600;text-align:left;color:var(--ink);border-radius:6px}
.review-person-change>span:not(.person-avatar){min-width:0;overflow-wrap:anywhere}
.review-person-change>.icon{width:14px;height:14px;flex-shrink:0;color:var(--muted);margin-left:-5px}
.review-person-change:hover>span:not(.person-avatar){text-decoration:underline;text-underline-offset:3px}
.review-plan{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 16px;margin-left:48px;font-size:14px;color:var(--muted);line-height:1.5}
.review-change,.review-remove{display:inline-flex;align-items:center;min-height:32px;padding:0;font-size:13px;line-height:1.5;text-align:left;border-radius:3px}
.review-change{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:#a1aaa8}
.review-change:hover{text-decoration-color:currentColor}
.review-line-total{display:flex;flex-direction:column;align-items:flex-end;min-width:44px}
.review-price{display:flex;align-items:center;min-height:44px;font-size:18px;white-space:nowrap;text-align:right}
.review-remove{color:var(--muted);margin-top:auto}
.review-remove:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.review-add{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:7px;font-size:14px;font-weight:600}
.review-add .icon{width:17px;height:17px}
.review-add:hover:not(:disabled){color:var(--orange)}
.review-add:disabled{color:var(--muted);cursor:default}
.review-invite{display:flex;align-items:flex-start;gap:10px;margin-top:7px;font-size:13px;color:var(--muted);line-height:1.55}
.review-invite .icon{width:17px;height:17px;flex-shrink:0;margin-top:1px}
.review-contact{margin-top:24px;padding:24px;background:var(--cream);border-radius:12px}
.review-contact h2{font-size:20px;letter-spacing:-.025em;margin-bottom:8px}
.review-contact-purpose{font-size:14px;line-height:1.6;color:var(--muted);max-width:520px;margin-bottom:20px}
.review-contact .review-field{color:var(--ink);margin-bottom:10px}
.review-contact .review-signin{padding:0;margin:0;border:0}
.review-optional{margin-top:18px;padding-top:16px;border-top:1px solid #dedbd6}
.review-optional h3{font-size:13px;line-height:1.5;letter-spacing:0}
.review-optional .review-marketing{margin:4px 0 0}
.review-account{display:flex;align-items:center;justify-content:flex-start;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.review-account-email{display:block;margin-top:4px;overflow-wrap:anywhere}
.review-account .text-link{font-size:13px;gap:6px;min-height:28px}
.review-account .icon{width:15px;height:15px}
.review-summary{min-width:0}
.review-summary>h2{font-size:21px;letter-spacing:-.025em}
.review-summary-count{font-size:14px;color:var(--muted);margin:8px 0 26px}
.review-total{display:flex;justify-content:space-between;align-items:center;gap:12px}
.review-total>span{font-size:16px;font-weight:600}
.review-total small{font-size:11px;color:var(--muted);font-weight:400;margin-left:4px}
.review-total>strong{font-size:32px;line-height:1.1;letter-spacing:-.04em}
.review-payment-note{font-size:12px;color:var(--muted);margin-top:8px;line-height:1.6}
.review-terms-line a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.review-terms-line a:hover{color:var(--ink)}
.review-runway{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:500;color:var(--td-runway);padding:0;min-height:30px;margin-top:14px;text-align:left}
.review-runway:hover{text-decoration:underline;text-underline-offset:3px}
.review-runway .icon{width:14px;height:14px;flex-shrink:0}
.review-next{margin-top:20px}
.review-submit{width:100%;margin:0}
.review-next .review-plan-line{display:flex;align-items:flex-start;gap:8px;margin-top:18px;font-size:13px;color:var(--ink)}
.review-plan-line .icon{width:16px;height:16px;margin-top:2px;flex-shrink:0}
.review-next .review-terms-line{font-size:11px;color:var(--muted);line-height:1.7;margin-top:10px}
.checkout-reassurance{max-width:1040px;width:calc(100% - 80px);margin:42px auto 56px;display:grid;grid-template-columns:1fr 1fr;gap:64px}
.checkout-reassurance>section{display:flex;align-items:flex-start;gap:15px}
.checkout-note-icon{color:#426350;flex-shrink:0;margin-top:3px}
.checkout-note-icon>.icon{width:24px;height:24px}
.checkout-reassurance h2{font-size:18px;line-height:1.3;letter-spacing:-.015em}
.checkout-reassurance p{font-size:14px;line-height:1.6;color:var(--muted);margin-top:8px}
.checkout-reassurance .text-link{font-size:13px;margin-top:8px;min-height:28px}
.checkout-reassurance .text-link .icon{width:15px;height:15px}
@media(max-width:1000px){.checkout-card{padding-inline:28px}.review-layout{grid-template-columns:minmax(0,1fr) 360px;gap:28px}.review-checkout{padding-left:24px}}
@media(max-width:850px){
  .checkout-card{width:calc(100% - 32px);max-width:620px;padding:24px;margin-bottom:0}
  .checkout-art+.checkout-card{margin-top:-24px}
  .checkout-card .breadcrumbs{padding-bottom:20px}
  .checkout-card .review-heading h1{font-size:34px}
  .checkout-card .review-heading{margin-bottom:26px}
  .review-layout{grid-template-columns:minmax(0,1fr);gap:28px}
  .review-change,.review-remove{min-height:44px}
  .review-contact{padding:20px}
  .review-checkout{border-left:0;border-top:1px solid var(--line);padding:24px 0 0}
  .review-summary-count{margin-bottom:20px}
  .checkout-reassurance{max-width:572px;width:calc(100% - 64px);grid-template-columns:1fr;gap:26px;margin-top:32px;margin-bottom:40px}
}
@media(max-width:380px){.checkout-card{padding:20px}.checkout-card .review-heading h1{font-size:30px}.review-line{column-gap:12px}.review-person,.review-person-change{gap:9px}:is(.review-person,.review-traveller) .person-avatar{width:32px;height:32px}.review-person h3,.review-traveller{font-size:15px}.review-plan{font-size:13px;margin-left:41px;column-gap:12px}.review-price{font-size:16px}}
/* The two questions before paying (engine ADR-156): a guest's email, the
   email-code sign-in for an email that has an account, the trip card. */
.review-field{display:grid;gap:6px;margin:0 0 18px;font-size:13px;color:var(--muted)}
.review-field input{min-height:46px;padding:0 14px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:15px;color:var(--ink);background:#fff}
.review-field input:focus{outline:2px solid var(--ink);outline-offset:1px}
.review-marketing{margin:-8px 0 18px;font-size:13px;line-height:1.5;color:var(--muted)}
.review-marketing .text-link{display:inline;min-height:0;font-size:13px;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.review-signin{display:grid;gap:12px;margin:0 0 18px;padding:15px;border:1px solid var(--line);border-radius:8px;font-size:14px;line-height:1.5}
.review-signin p{margin:0}
.review-signin .review-field{margin:0}
.review-signin-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.review-error{margin:0 0 12px;font-size:13px;color:#b3261e}
/* "Which trip?" (the founder, 26 Sep 2026: "the vertical stacking makes it
   feel less like an equal choice"): its own step after the eSIMs, the live
   trip and "Start a new trip" as equal cards, side by side, stacked (same
   size, border and type) at 650px and below; a tick only on the chosen one. */
.review-trip{margin-top:34px}
.review-trip h2{margin-bottom:12px;font-size:17px;line-height:1.3;letter-spacing:-.01em}
.review-trip-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:10px}
.review-trip-option{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:4px;min-height:78px;padding:16px 46px 16px 16px;border:1px solid var(--line);border-radius:12px;background:white;text-align:left}
.review-trip-option:hover{border-color:#789681}
.review-trip-option[aria-pressed=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.review-trip-option strong{font-size:15px;line-height:1.3;letter-spacing:-.01em;overflow-wrap:anywhere}
.review-trip-option span{font-size:13px;line-height:1.4;color:var(--muted)}
.review-trip-option .icon{position:absolute;top:50%;right:16px;width:18px;height:18px;margin-top:-9px}
@media(max-width:650px){.review-trip-options{grid-template-columns:minmax(0,1fr)}}

/* The same full scene and white receipt card throughout checkout. Stripe
   owns the payment fields; the reviewed plans stay beside them. */
.checkout-review.payment-page{padding:0;max-width:none}
.payment-overview{width:100%;max-width:none}
.payment-layout{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:48px;max-width:1120px;width:calc(100% - 64px);margin:40px auto 56px;padding:40px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 14px 42px rgb(25 39 40 / .08);align-items:start}
.payment-overview:has(.purchase-art:not([hidden])) .payment-layout{margin-top:clamp(-104px,-8vw,-32px)}
.payment-entry{min-width:0}
.payment-page [hidden]{display:none!important}
.payment-entry form>.button{width:100%;margin-top:16px}
.payment-entry [data-payment-element]{min-height:180px}
.payment-entry .review-heading{margin:0 0 28px;text-align:left}
.payment-entry h1{scroll-margin-top:28px}
.payment-entry h1:focus,.checkout-card h1:focus{outline:none}
.checkout-card h1{scroll-margin-top:28px}
.payment-entry .review-heading [data-payment-message]:empty{display:none}
.payment-entry .review-error:empty{display:none}
.payment-entry .review-error:not(:empty){margin-bottom:20px}
.payment-back{display:block;margin-top:20px;font-size:13px;text-decoration:underline;text-underline-offset:3px}
.payment-summary{align-self:start;min-width:0;padding-left:36px;border-left:1px solid var(--line)}
.payment-summary-body{padding:0}
.payment-test{padding:12px 16px;margin-bottom:20px;background:#fff3d8;border-radius:8px;font-size:14px}
.payment-contact{border-top:1px solid var(--line);margin-top:24px;padding-top:20px;display:grid;gap:5px;overflow-wrap:anywhere}
.payment-contact>span{font-size:12px;color:var(--muted)}
.payment-contact>strong{font-size:14px;line-height:1.5;font-weight:500}
.purchase-access{max-width:300px;margin-top:12px;color:var(--muted);font-size:13px;line-height:1.6}
.purchase-art[hidden]{display:none}
.purchase-art img{display:block;width:100%;height:auto;aspect-ratio:3;object-fit:contain}
.purchase-destination{display:flex;align-items:center;gap:10px;margin-bottom:5px}
.purchase-destination h2{font-size:30px;line-height:1.15;margin:0;letter-spacing:-.035em}
.purchase-destination .flag{display:block;width:30px;height:23px;object-fit:cover;border-radius:3px}
.purchase-destination>span:empty{display:none}
.payment-summary-body>p{font-size:14px;color:var(--muted);margin-top:8px}
.payment-summary-body>.review-total{margin-top:24px}
.purchase-next-link{display:flex;width:fit-content;margin-top:20px;font-size:14px}
.purchase-next-link .icon{width:16px}
.purchase-items{list-style:none;padding:0;margin:22px 0 0}
.purchase-items li{padding:14px 0;border-top:1px solid var(--line);display:grid;gap:5px;font-size:14px;line-height:1.5}
.payment-page:not(.payment-confirmed) .purchase-items li{grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:start}
.payment-line-price{font-size:15px;white-space:nowrap;padding-top:2px}
.purchase-refund-note{font-size:13px;color:var(--muted)}
.purchase-delay{margin:0 0 22px;padding-left:16px;border-left:3px solid var(--orange);font-size:15px;line-height:1.65;color:var(--ink)}
.payment-confirmed .payment-layout{max-width:1000px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-bottom:64px}
.payment-confirmed .payment-entry{padding:8px 0}
.payment-confirmed .review-heading{max-width:440px}
.payment-confirmed .review-heading h1{font-size:42px;line-height:1.08;letter-spacing:-.045em}
.payment-confirmed .review-heading [data-payment-message]{margin-top:20px;font-size:17px;line-height:1.6}
/* A quiet trust row bridges payment and the destination artwork. */
.payment-reassurance{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;margin-top:0;margin-bottom:64px}
.payment-reassurance>section{display:block}
.payment-reassurance .checkout-note-icon{display:block;margin:0 0 14px}
.payment-reassurance h2{font-size:17px;line-height:1.4}
@media(max-width:850px){.payment-reassurance{grid-template-columns:1fr;gap:28px;margin-bottom:40px}.payment-reassurance>section{display:flex;gap:14px}.payment-reassurance .checkout-note-icon{margin:2px 0 0}}
@media(max-width:1000px) and (min-width:851px){.payment-layout{grid-template-columns:minmax(0,1fr) 330px;gap:28px;padding:28px}.payment-summary{padding-left:24px}}
@media(max-width:850px){
  .payment-page .payment-layout{grid-template-columns:minmax(0,1fr);width:calc(100% - 32px);max-width:620px;padding:24px;gap:28px;margin-bottom:40px}
  .payment-overview:has(.purchase-art:not([hidden])) .payment-layout{margin-top:-24px}
  .payment-entry{display:contents}
  .payment-entry .review-heading{grid-row:1;max-width:none;margin:0}
  .payment-entry .review-heading h1{font-size:34px}
  .payment-entry .review-heading [data-payment-message]{margin-top:14px;font-size:16px}
  .payment-summary{grid-row:2;border:0;padding:0}
  .payment-controls{grid-row:3;border-top:1px solid var(--line);padding-top:24px;min-width:0}
  .payment-controls:has([data-payment-form][hidden]):has([data-payment-retry][hidden]):has([data-payment-error]:empty){border:0;padding:0}
  [data-payment-success]{grid-row:3}
  [data-purchase-link]{width:100%;justify-content:center}
  .purchase-access{max-width:none;text-align:center}
  .purchase-next-link{margin-inline:auto}
  .payment-summary-body>.review-total{margin-top:12px}
}
@media(max-width:380px){.payment-page .payment-layout{padding:20px}.payment-entry .review-heading h1{font-size:30px}}
/* After payment the purchase action introduces the account; avoid a competing signup prompt. */
body:has(.payment-confirmed) .tdh-signin,body:has(.payment-confirmed) .tdh-signup{display:none}
body:has(.payment-confirmed) .tdh-short{display:flex}

/* The paid page continues into useful preparation, then practical answers and
   destination artwork before the site’s unchanged footer. The purchase guide
   appears only after verified payment; checkout shares the destination artwork. */
.payment-confirmed.checkout-review{padding-bottom:0}
[data-purchase-guide][hidden]{display:none}
.purchase-guide-shell{max-width:1120px}
.purchase-next{padding:12px 0 48px}
.purchase-next-heading{max-width:680px;margin-bottom:28px}
.purchase-next-heading h2{font-size:35px;line-height:1.12;letter-spacing:-.04em}
.purchase-next-heading>p{margin-top:12px;font-size:16px;line-height:1.6}
/* The country pages' illustrated cards, with purchase-specific steps inside. */
.purchase-steps{grid-template-columns:repeat(var(--purchase-step-count),minmax(0,1fr));list-style:none;padding:0;margin:0}
.purchase-steps>.buying-moment{display:flex;flex-direction:column}
.purchase-steps .purchase-step-scene{height:190px;min-height:190px;padding:26px 24px 0;justify-content:flex-end}
.purchase-step-scene>.setup-visual{width:100%;height:164px;min-height:164px;margin:0;padding:22px 18px;align-self:flex-end}
.purchase-steps .purchase-step-copy{padding:24px;flex:1}
.purchase-step-number{display:block;font-size:11px;line-height:1;font-weight:600;color:var(--muted);margin-bottom:12px}
.purchase-steps .purchase-step-copy h3{padding:0;font-size:20px;line-height:1.25;margin-bottom:10px}
.purchase-steps .purchase-step-copy p{max-width:none;font-size:15px;line-height:1.6}
.purchase-step-copy .text-link{font-size:14px;margin-top:12px}
.purchase-steps .setup-connect>div,.purchase-steps .setup-connect>div>strong{font-size:12px}
.purchase-steps .setup-connect>p{font-size:12px}
.purchase-start-note{display:flex;align-items:center;justify-content:center;gap:9px;text-align:center;font-size:14px;margin-top:24px}
.purchase-start-note .icon{width:17px;height:17px}
.purchase-guide-notes{border-top:1px solid var(--line);margin-top:32px;padding-top:28px;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:32px}
.purchase-guide-note{display:flex;align-items:flex-start;gap:14px;max-width:750px}
.purchase-guide-note>.icon{margin-top:1px;color:#426350}
.purchase-guide-note h3{font-size:17px;line-height:1.3;margin-bottom:8px}
.purchase-guide-note p{font-size:15px;line-height:1.6}
.purchase-questions{max-width:1120px;display:grid;grid-template-columns:1fr 1.6fr;gap:64px;padding:64px 0 72px}
.purchase-questions h2{font-size:34px;line-height:1.12}
.purchase-questions>div>p{font-size:16px;line-height:1.6;margin-top:14px}
.purchase-questions>div>.text-link{margin-top:18px;font-size:14px}
.purchase-questions .faq-list p{font-size:16px;line-height:1.65}
@media(max-width:900px){.purchase-steps .purchase-step-copy{padding:22px 18px}.purchase-steps .purchase-step-scene{padding-inline:16px}.purchase-step-scene>.setup-visual{padding-inline:12px}.purchase-questions{gap:36px;grid-template-columns:1fr 1.4fr}}
@media(max-width:700px){
  .purchase-next{padding:0 0 28px}.purchase-next-heading{margin-bottom:24px}.purchase-next-heading h2{font-size:31px}
  .purchase-steps{grid-template-columns:1fr;gap:16px}
  .purchase-steps .purchase-step-scene{height:166px;min-height:166px;padding:20px 28px 0}
  .purchase-step-scene>.setup-visual{max-width:340px;height:146px;min-height:146px;padding:18px 22px;align-self:center}
  .purchase-steps .purchase-step-copy{padding:22px 24px 24px}
  .purchase-start-note{align-items:flex-start;text-align:left;font-size:14px}.purchase-start-note .icon{margin-top:2px}
  .purchase-guide-notes{grid-template-columns:1fr;gap:24px}.purchase-questions{grid-template-columns:1fr;gap:24px;padding:24px 0 48px}.purchase-questions h2{font-size:30px}
}

.review-heading [data-payment-message]{margin-top:10px;color:var(--muted);font-size:16px;line-height:1.65}
.purchase-items .review-person{gap:10px}
.purchase-items .person-avatar{width:36px;height:36px;font-size:14px}
.purchase-items .unassigned-avatar{background:transparent;color:#73827f;border:1px dashed #bbc6c2}
.purchase-items .unassigned-avatar>.icon{width:19px;height:19px}
.purchase-items .review-person h3{font-size:17px;line-height:1.3}
.purchase-plan{color:var(--muted);margin-top:3px;font-size:14px}
.purchase-items .purchase-refund-note{margin-left:46px}
.purchase-delay-help{margin-bottom:22px;font-size:14px}
