/* Buy page only. Shared fonts, header, footer and button styling come from style.css. */
.buy-main{max-width:1120px;margin:0 auto;padding:76px 5% 90px}
.buy-intro{text-align:center;max-width:800px;margin:0 auto 48px}
.buy-intro .eyebrow{margin-bottom:20px}
.buy-intro h1{font-size:clamp(3.25rem,7vw,5.6rem);line-height:1.04;margin-bottom:24px}
.buy-lead{max-width:650px;margin:0 auto;font-size:1.125rem;color:var(--muted);line-height:1.7}
.region-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.region-card{perspective:1400px;min-width:0;transition:translate .2s ease}
.region-card-inner{display:grid;height:100%;min-height:580px;transform-style:preserve-3d;transition:transform 400ms cubic-bezier(.2,.7,.2,1)}
.region-card.is-flipped .region-card-inner{transform:rotateY(180deg)}
.region-front,.region-back{grid-area:1/1;min-width:0;border:1px solid #383838;border-radius:10px;background:#121212;color:var(--paper);backface-visibility:hidden;-webkit-backface-visibility:hidden}
/* Explicitly hide the inactive face: Safari can otherwise composite its text
   through the opposite face despite backface-visibility. Keep both in the grid
   so switching faces never changes the card's size. */
.region-card.is-flipped .region-front,.region-card:not(.is-flipped) .region-back{visibility:hidden;pointer-events:none}
.region-front{position:relative;overflow:hidden;font:inherit;text-align:left;padding:32px;display:flex;flex-direction:column;align-items:stretch;cursor:pointer;background:radial-gradient(ellipse at 75% 75%,#1c1c1c,#0c0c0c 80%);box-shadow:inset 0 1px 0 #ffffff0a;transition:border-color .2s ease,box-shadow .2s ease}
.region-flag-layer{position:absolute;inset:0;pointer-events:none}
.region-flag-art{display:block;width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(.72) saturate(.8);transition:filter .25s ease}
.region-flag-layer::after{content:"";position:absolute;inset:0;background:linear-gradient(145deg,#09090908 0%,#09090920 25%,#09090966 46%,#090909d9 69%,#090909f2 100%),linear-gradient(0deg,#080808bb,transparent 48%),radial-gradient(ellipse at 28% 20%,transparent 15%,#00000038 80%,#00000065 100%);pointer-events:none}
.region-front::before{content:"";position:absolute;inset:10px;border:1px solid #ffffff0a;border-radius:5px;pointer-events:none;z-index:1}
.region-front-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;align-self:flex-end;width:85%;margin-top:auto;padding-top:12px}
.region-name{font-weight:700;font-size:clamp(2rem,3.2vw,2.5rem);letter-spacing:-.035em;text-transform:uppercase;line-height:1.06;max-width:330px}
.region-subtitle{font-size:.875rem;line-height:1.5;color:var(--muted);margin-top:12px}
.shop-arrow{transform:rotate(45deg)}
.region-front-action{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;align-self:flex-end;width:85%;margin-top:24px;padding-top:20px;border-top:1px solid #ffffff18;font-size:.75rem;letter-spacing:.15em;font-weight:600;color:var(--paper)}
@media(hover:hover) and (pointer:fine){.region-card:not(.is-flipped):hover,.region-card:has(.region-front:focus-visible){translate:0 -3px}.region-front:hover,.region-front:focus-visible{border-color:#777;box-shadow:inset 0 1px 0 #ffffff12,0 10px 26px #00000040,0 0 22px #ffffff03}.region-front:hover .region-flag-art,.region-front:focus-visible .region-flag-art{filter:brightness(.79) saturate(.8)}}
.region-front:focus-visible,.region-back-control:focus-visible{outline:2px solid var(--paper);outline-offset:5px}
.region-back{transform:rotateY(180deg);padding:28px 24px;display:flex;flex-direction:column;gap:20px;cursor:pointer}
.region-back-title{font-size:1.375rem;margin:0;line-height:1.3}
.edition-grid{display:grid;gap:22px}
.edition-card{min-width:0;border-top:1px solid var(--line);padding-top:18px}
.edition-card h4{font:600 1.125rem/1.3 'DM Sans',Arial,sans-serif;margin:0 0 8px}
.edition-card p{font-size:.9375rem;line-height:1.55;color:var(--muted);margin:0 0 12px}
.edition-card .edition-price{font-size:.875rem;color:var(--paper);margin-bottom:12px}
.edition-card .button{gap:16px;width:100%;font-size:.875rem;padding:14px 18px;min-height:48px}
.edition-card button.button{font-family:inherit;line-height:inherit;border:0;text-align:left}
.edition-card .button[aria-disabled="true"],.edition-card .button[aria-disabled="true"]:hover{background:#303030;color:#b5b5b5;cursor:default;transition:none}
.purchase-arrow{width:16px;height:16px;flex:0 0 16px}
.edition-coming-soon{border-top:1px solid var(--line);padding-top:18px;font-size:.875rem;color:var(--muted);margin:0}
.purchase-note{font-size:.75rem;line-height:1.5;color:var(--muted);margin:0}
.region-back-control{align-self:flex-start;margin-top:auto;min-height:44px;font:inherit;font-size:.875rem;color:var(--muted);background:none;border:0;padding:8px 0;cursor:pointer;text-decoration:underline;text-underline-offset:5px}
.region-hint{text-align:center;font-size:.875rem;color:var(--muted);margin:22px 0 0}
.buy-record{margin-top:72px;padding:56px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);text-align:center}
.buy-record h2{font-size:clamp(2.5rem,4.5vw,3.75rem);margin-bottom:24px}
.buy-record p{max-width:700px;margin:0 auto;color:var(--muted);font-size:1rem;line-height:1.75}
.buy-comparison{padding-top:60px}
.buy-comparison>h2{font-family:'DM Sans',Arial,sans-serif;font-size:1.5rem;line-height:1.3;text-transform:none;font-weight:500;margin-bottom:30px}
.comparison-grid{display:grid;gap:16px}
.comparison-card{background:#121212;padding:28px;border-top:1px solid #444}
.comparison-card .eyebrow{font-size:.75rem;margin-bottom:20px;letter-spacing:.1em}
.comparison-card h3{margin:0 0 14px;font-size:1.25rem}
.comparison-card p:last-child{margin:0;font-size:1rem;color:var(--muted)}
@media(min-width:700px){.region-grid,.comparison-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.buy-record p{font-size:1.125rem}}
@media(max-width:430px){.buy-main{padding:48px 7% 60px}.buy-intro{margin-bottom:32px}.buy-lead{font-size:1rem}.region-back{padding:24px 20px}.buy-record{margin-top:48px;padding:40px 0}.buy-comparison{padding-top:40px}}
@media(max-width:699px){.region-front{padding:30px 26px}.region-name{font-size:clamp(2rem,7vw,2.5rem)}}
@media(prefers-reduced-motion:reduce){.region-card,.region-card-inner,.region-front,.region-flag-art{transition:none}.region-card:not(.is-flipped):hover,.region-card:has(.region-front:focus-visible){translate:none}}

/* Optional regional shipping information beneath its purchase button. */
.edition-shipping-note{display:block;margin-top:8px}

/* Regional Amazon options share the existing purchase button styling. */
.purchase-buttons{display:grid;gap:12px}
