/* QA-PR-18: Express composition only; global buttons, Shell and Contact remain shared. */
.express-index { --express-accent: #24bced; overflow-wrap: anywhere; }
.express-index :is(.stack,.express-intro-grid>*,.express-advantages>*) { min-width: 0; }
.express-index :is(section,article)[id] { scroll-margin-top: 6rem; }
.express-hero { position: relative; overflow: hidden; }
.express-hero .container { position: relative; z-index: 1; }
.express-hero-art { position: absolute; inset: 0; }
.express-hero-art img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.express-hero-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,#07121ef5 0%,#07121eba 38%,#07121e22 78%); }
.express-hero-copy { max-width: 35rem; padding-block: 1.25rem; }
.express-hero-copy h1 span { color: var(--express-accent); }
.express-hero .hero-benefits { margin-top: 2rem; }
.express-signature { font-family: cursive; font-style: italic; color: #cbeeff; }
.express-hero>.container>.express-signature { text-align: right; margin-block: 1rem; }
.express-intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; }
.express-advantages { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.express-advantages article { background: #f1f7ff; padding: 1.25rem; border-radius: .5rem; }
.express-advantages h3 { font-size: 1rem; }
.express-advantages svg,.express-family-heading svg { color: var(--mk-blue, #187ffa); flex-shrink: 0; }
.express-quick-nav { display: flex; flex-wrap: nowrap; gap: 0; overflow-x: auto; margin-bottom: 2.5rem; background: var(--mk-blue); box-shadow: var(--mk-shadow); border-radius: var(--mk-radius); }
.express-index .express-quick-nav a:any-link { display: grid; align-items: center; flex: 0 0 9rem; text-align: center; color: white; background: transparent; padding: .75rem .5rem; border-radius: 0; text-decoration: none; font-size: .875rem; }
.express-quick-nav a + a { border-left: 1px solid #ffffff40; }
.express-quick-nav a:focus-visible { outline-offset: -4px; }
.express-index .express-quick-nav a:is(:hover,:focus-visible,:active) { background: #0754a5; color: white; text-decoration: none; }
.express-section-heading { text-align: center; margin-bottom: 1rem; }
.express-family { padding-block: 2rem; }
.express-family-heading { display: flex; gap: 1rem; align-items: center; margin-bottom: 1.5rem; }
.express-family-heading h3 { font-size: 1.5rem; }
.express-family-heading p { margin-top: .35rem; }
.express-offers { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.5rem; }
/* Shared offer: media, title, modality, includes, price and bottom CTA. */
.express-offer { display: flex; flex-direction: column; background: var(--mk-white); border: 1px solid var(--mk-line); border-radius: var(--mk-radius); min-width: 0; overflow: hidden; }
.express-offer-body { display: flex; flex-direction: column; gap: var(--mk-4); padding: var(--mk-6); flex: 1; }
.express-offer h4 { font-size: var(--mk-h3); line-height: 1.3; }
.express-offer .offer-price { font-size: var(--mk-h3); color: var(--mk-ink); font-weight: 700; margin-top: auto; padding-top: var(--mk-4); }
.express-offer .check-list { font-size: var(--mk-small); }
.express-offer .button { width: fit-content; }
.express-offer-media { background: var(--mk-dark); }
.express-offer-media img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.express-offer-duration { font-size: var(--mk-small); color: var(--mk-muted); }
.express-hosting { grid-template-columns: repeat(3,minmax(0,1fr)); }
.express-store { grid-template-columns: minmax(0,1fr); }
.express-store .express-offer { display: grid; grid-template-columns: 1fr 1.2fr; }
.express-store .express-offer-media { position: relative; min-height: 0; }
.express-store .express-offer-media picture { display: block; height: 100%; }
.express-store .express-offer-media img { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; object-position: center; }
.express-family-benefits { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); list-style: none; padding: var(--mk-6); margin: var(--mk-6) 0 0; gap: var(--mk-6); background: var(--mk-light); border: 1px solid var(--mk-line); border-radius: var(--mk-radius); }
.express-family-benefits li { display: flex; align-items: start; gap: var(--mk-3); font-size: var(--mk-small); }
.express-family-benefits svg { flex: 0 0 32px; width: 32px; height: 32px; color: var(--mk-blue); }
.express-hosting-benefits { grid-template-columns: repeat(5,minmax(0,1fr)); gap: var(--mk-4); }
.express-hosting-benefits li { align-items: center; }
.express-process ol { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 2rem; list-style: none; padding: 1.5rem 0 0; }
.express-process li { position: relative; }
.express-process li>span { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; background: #187ffa; color: white; font-weight: 700; margin-bottom: 1rem; }
.express-process h3 { font-size: 1.1rem; margin-bottom: .5rem; }
.express-modal-open { overflow: hidden; scrollbar-gutter: stable; }
.express-dialog { width: min(calc(var(--mk-content) + 4rem),calc(100% - 2rem)); max-width: none; max-height: calc(100dvh - 2rem); padding: 0; border: 0; border-radius: .65rem; color: #102031; background: #edf5fd; overflow: auto; overscroll-behavior: contain; }
.express-dialog::backdrop { background: #020b17c9; }
.express-dialog:not(:modal)[open] { position: relative; margin: 2rem auto; max-height: none; }
.express-modal-bar { display: flex; align-items: center; gap: 1.5rem; background: #071525; color: white; padding: 1rem 2rem; }
.express-modal-bar>.brand { font-size: 1.25rem; }
.express-modal-close { background: transparent; border: 0; font: inherit; cursor: pointer; margin-left: auto; color: white; display: flex; gap: .75rem; align-items: center; padding: .5rem; text-decoration: none; }
.express-modal-close:is(:hover,:focus-visible) { color: white; background: #23466a; }
.express-modal-close span { font-size: 1.75rem; }
.express-modal-hero { position: relative; isolation: isolate; min-height: 22rem; padding: var(--mk-8); background: #071525; color: var(--mk-white); }
.express-modal-hero-copy { position: relative; z-index: 1; width: 59%; }
.express-modal-hero h2 { font-size: clamp(1.75rem,3vw,2.5rem); line-height: 1.12; color: var(--mk-white); }
.express-modal-hero .eyebrow { color: var(--express-accent); }
.express-modal-hero-media { position: absolute; inset: 0 0 0 auto; width: 43%; }
.express-modal-hero-media picture { display: block; width: 100%; height: 100%; }
.express-modal-hero-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.express-modal-hero-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,#071525 0%,transparent 20%),linear-gradient(0deg,#071525,transparent 20%,transparent 80%,#071525); pointer-events: none; }
.express-modal-subtitle { font-weight: 600; }
.express-modal-facts { display: flex; flex-wrap: wrap; gap: var(--mk-3); }
.express-modal-facts>div { display: flex; align-items: center; gap: var(--mk-3); padding: var(--mk-3) var(--mk-4); background: #0d2942; border: 1px solid #3e6687; border-radius: var(--mk-radius); }
.express-modal-facts svg { flex-shrink: 0; color: var(--express-accent); }
.express-modal-facts :is(strong,small) { display: block; }
.express-modal-facts strong { font-size: var(--mk-small); }
.express-modal-facts small { font-size: var(--mk-meta); }
.express-modal-body { display: grid; grid-template-columns: minmax(0,2.1fr) minmax(0,1fr); gap: var(--mk-6); padding: var(--mk-8); align-items: start; }
.express-modal-sections { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--mk-4); min-width: 0; }
.express-modal-section { display: flex; align-items: start; gap: var(--mk-3); border: 1px solid var(--mk-line); background: #fafdff; border-radius: var(--mk-radius); padding: var(--mk-4); min-width: 0; }
.express-modal-section>.stack { min-width: 0; }
.express-modal-section-wide { grid-column: 1/-1; }
.express-modal-section-icon { flex: 0 0 2.25rem; display: grid; place-items: center; padding: .25rem; background: #e3f3ff; border-radius: var(--mk-radius); color: var(--mk-blue); }
.express-modal-section h3 { font-size: var(--mk-body); color: var(--mk-ink); line-height: 1.3; }
.express-modal-section p,.express-modal-section li { font-size: var(--mk-small); line-height: 1.6; }
.express-modal-summary { position: relative; z-index: 2; display: flex; flex-direction: column; gap: var(--mk-4); padding: var(--mk-4); margin-top: -4rem; background: var(--mk-white); border: 1px solid var(--mk-line); border-radius: var(--mk-radius); box-shadow: var(--mk-shadow); min-width: 0; }
.express-modal-summary h3 { font-size: var(--mk-body); color: var(--mk-ink); }
.express-summary-panel { padding: var(--mk-4); border-radius: var(--mk-radius); background: linear-gradient(135deg,#f6fbff,#eaf7ff); }
.express-summary-fact { display: flex; align-items: start; gap: var(--mk-3); padding-block: var(--mk-4); }
.express-summary-fact + .express-summary-fact { border-top: 1px solid var(--mk-line); }
.express-summary-fact:first-child { padding-top: 0; }
.express-summary-fact:last-child { padding-bottom: 0; }
.express-summary-fact svg { flex: 0 0 32px; color: var(--mk-blue); }
.express-summary-fact h4 { font-size: var(--mk-small); line-height: 1.35; }
.express-summary-fact p { font-size: var(--mk-meta); margin: .25rem 0 0; }
.express-summary-fact strong { font-size: var(--mk-small); }
.express-modal-summary .offer-price { color: var(--mk-ink); font-size: var(--mk-body-lg); font-weight: 700; margin: 0; }
.express-modal-summary .button { text-align: center; justify-content: center; font-size: var(--mk-small); padding-inline: var(--mk-3); }
.express-summary-trust { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--mk-3); }
.express-summary-trust li { display: flex; align-items: center; gap: var(--mk-2); font-size: var(--mk-meta); }
.express-summary-trust svg { flex: 0 0 24px; width: 24px; height: 24px; color: var(--mk-blue); }
.express-summary-conditions { font-size: var(--mk-meta); border-block-start: 1px solid var(--mk-line); padding-top: var(--mk-4); }
.express-summary-conditions p + p { margin-top: var(--mk-2); }
.express-summary-media { margin: 0; }
.express-summary-media img { width: 100%; height: auto; display: block; border-radius: var(--mk-radius); }
.express-summary-media figcaption { font-size: var(--mk-meta); margin-top: var(--mk-2); color: var(--mk-muted); }
.express-commercial-note { font-size: var(--mk-meta); color: var(--mk-muted); }
.express-table { max-width: 100%; overflow-x: auto; }
.express-table table { border-collapse: collapse; width: 100%; font-size: .875rem; }
.express-table :is(th,td) { border: 1px solid #c9d8e9; padding: .5rem; text-align: left; }
@media (max-width: 63.99rem) {
    .express-quick-nav { display: none; }
    .express-hero-art { opacity: .5; }
    .express-intro-grid { gap: 2rem; }
    .express-family-benefits { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .express-modal-body { grid-template-columns: 1fr; }
    .express-modal-summary { grid-row: 1; margin-top: 0; }
    .express-modal-hero-copy { width: 100%; }
    .express-modal-hero-media { position: relative; width: 100%; margin-top: var(--mk-6); }
    .express-modal-hero-media img { height: auto; aspect-ratio: 3 / 2; }
}
@media (max-width: 47.99rem) {
    .express-intro-grid,.express-offers,.express-hosting,.express-store,.express-process ol,.express-modal-sections { grid-template-columns: 1fr; }
    .express-hero>.container>.express-signature { text-align: left; }
    .express-advantages { gap: 1rem; grid-template-columns: 1fr; }
    .express-store .express-offer,.express-family-benefits { grid-template-columns: 1fr; }
    .express-store .express-offer-media img { position: static; height: auto; aspect-ratio: 3 / 2; }
    .express-process li { padding-left: 4rem; }
    .express-process li>span { position: absolute; left: 0; }
    .express-dialog { width: calc(100% - 1rem); max-height: calc(100dvh - 1rem); }
    .express-modal-bar,.express-modal-hero,.express-modal-body { padding: 1rem; }
    .express-modal-bar { gap: .5rem; font-size: .75rem; }
    .express-modal-bar { flex-wrap: wrap; }
    .express-modal-bar>.brand { max-width: 6rem; }
    .express-modal-section { gap: var(--mk-2); padding: var(--mk-3); }
}
@media (prefers-reduced-motion: reduce) { .express-dialog { scroll-behavior: auto; } }

.express-index .check-list li::before { content: "\2713"; }

/* Compact offer rhythm and seven equal desktop navigation targets from the approved master. */
.express-hero .actions { display: flex; flex-wrap: wrap; gap: var(--mk-4); }
.express-offer .stack > * + * { margin-block-start: var(--mk-2); }
.express-offer .check-list { gap: var(--mk-1); }

.express-modal-hero .stack > * + * { margin-block-start: var(--mk-3); }

@media (min-width: 64rem) {
    .express-quick-nav { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); }
    .express-section-heading { display: grid; grid-template-columns: 2fr 1fr; text-align: left; column-gap: 3rem; align-items: center; }
    .express-section-heading h2 { grid-column: 1; }
    .express-section-heading>p:last-child { grid-column: 2; grid-row: 1 / span 2; margin: 0; font-size: .875rem; }
}
