/* The pack and what grows around it: the offer on a report, the pack window, the booking step, the progress band,
   the share window, the quote form and the wall of quotes on the home page. Tokens come from tokens.css. */

/* Text on the pale green of a success chip is mixed darker than the status line so it keeps 4.5 to 1 at small sizes. */
:root { --pass-ink: color-mix(in srgb, var(--status-pass-line) 50%, var(--encore-midnight)); }

/* ---- The offer on a report ---------------------------------------------------------------------------------------- */
.pm { display: grid; gap: clamp(24px, 4vw, 48px); margin-top: 72px; padding: clamp(26px, 4vw, 52px); border-radius: var(--radius-panel); background: var(--encore-buffalo-brown); color: var(--encore-buttercream); }
@media (min-width: 980px) { .pm { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: center; } }
.pm :focus-visible { outline-color: var(--encore-ibiza-yellow); }
.pm-kicker { font: 700 12.5px/1 var(--font-ui); letter-spacing: 0.1em; text-transform: uppercase; color: var(--encore-lolly-pink); }
.pm-title { margin-top: 14px; font: 500 clamp(34px, 4.4vw, 56px)/0.98 var(--font-display); letter-spacing: -0.03em; text-wrap: balance; }
.pm-sub { max-width: 46ch; margin-top: 16px; font-size: 17px; line-height: 1.45; color: color-mix(in srgb, var(--encore-buttercream) 88%, transparent); }
.pm-sub .lit { color: var(--encore-ibiza-yellow); }
.pm-act { display: grid; justify-items: start; gap: 12px; margin-top: 28px; }
.pm-fine { max-width: 40ch; font-size: 13.5px; line-height: 1.4; color: color-mix(in srgb, var(--encore-buttercream) 74%, transparent); }
.pm-cards { display: grid; gap: 12px; }
.pm-card { display: grid; grid-template-columns: 40px minmax(0, 1fr); grid-template-areas: 'ic h' 'ic p' 'ic f'; column-gap: 16px; row-gap: 4px; padding: 18px 20px; border-radius: var(--radius-card); background: rgba(255, 249, 241, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 249, 241, 0.16); }
.pm-ic { grid-area: ic; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: rgba(255, 249, 241, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 249, 241, 0.22); color: var(--encore-buttercream); }
.pm-card-h { grid-area: h; font: 600 18px/1.2 var(--font-ui); letter-spacing: -0.02em; }
.pm-card-p { grid-area: p; font-size: 14.5px; line-height: 1.4; color: color-mix(in srgb, var(--encore-buttercream) 82%, transparent); }
.pm-fact { grid-area: f; margin-top: 4px; font: 600 13px/1.2 var(--font-ui); letter-spacing: 0; color: var(--encore-ibiza-yellow); }
@media (max-width: 559.98px) { .pm-act .btn { width: 100%; justify-content: center; } }

/* ---- Progress band ------------------------------------------------------------------------------------------------ */
.pg { display: grid; gap: 28px 48px; margin-top: 44px; padding: clamp(22px, 3vw, 36px); border-radius: var(--radius-panel); background: var(--surface-card); box-shadow: var(--ring); }
@media (min-width: 900px) { .pg { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; } }
.pg-kicker { font: 700 12.5px/1 var(--font-ui); letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-secondary); }
.pg-title { margin-top: 12px; font: 500 clamp(28px, 3.2vw, 40px)/1.05 var(--font-display); letter-spacing: -0.03em; color: var(--text-heading); }
.pg-up { color: var(--encore-izmir-blue); }
.pg-range { margin-top: 10px; font-size: 16px; color: var(--text-body); }
.pg-range b { font-weight: 600; font-variant-numeric: tabular-nums; }
.pg-level { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; padding: 6px 12px 6px 10px; border-radius: var(--btn-radius); background: var(--status-pass-bg); color: var(--pass-ink); font: 600 14px/1.25 var(--font-ui); letter-spacing: -0.01em; }
.pg-level .icon { flex: none; }
.pg-moved { margin-top: 20px; }
.pg-moved-h { font: 600 13.5px/1.2 var(--font-ui); color: var(--text-secondary); }
.pg-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.pg-chip { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: var(--btn-radius); background: var(--encore-white); box-shadow: inset 0 0 0 1px rgba(34, 34, 34, 0.14); font-size: 14px; line-height: 1.25; color: var(--text-heading); }
.pg-chip b { color: var(--pass-ink); font-variant-numeric: tabular-nums; }
.pg-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 24px; }
.pg-chart { margin: 0; min-width: 0; }
.tc { width: 100%; height: auto; max-height: 230px; overflow: visible; }
.tc-base { stroke: var(--encore-hairline); stroke-width: 1; }
.tc-line { stroke: var(--encore-izmir-blue); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; animation: tc-draw 1.1s var(--ease-standard) 0.2s both; }
.tc-dot { fill: var(--encore-white); stroke: var(--encore-izmir-blue); stroke-width: 2.5; }
.tc-dot--last { fill: var(--encore-izmir-blue); stroke: var(--surface-card); stroke-width: 2; }
.tc-num { font: 600 13px var(--font-ui); fill: var(--text-heading); font-variant-numeric: tabular-nums; }
.tc-date { font: 500 11.5px var(--font-ui); fill: var(--text-secondary); }
.pg-cap { margin-top: 6px; font-size: 13px; text-align: center; color: var(--text-secondary); }
@keyframes tc-draw { from { stroke-dashoffset: 1; } }
@media (prefers-reduced-motion: reduce) { .tc-line { animation: none; } }
@media (max-width: 559.98px) { .pg-actions > .btn, .pg-actions > .pill { width: 100%; justify-content: center; } }

/* ---- Shared form parts for the windows below ---------------------------------------------------------------------- */
.bk-err, .wn-err, .pk-note--bad { color: var(--status-fail-line); }
.bk-err:empty, .wn-err:empty { display: none; }
.bk-err, .wn-err { margin: 12px 0 0; font-size: 14.5px; line-height: 1.4; font-weight: 500; }
:is(.bk-note, .wn-said, .pgm-text, .wn-input) { width: 100%; padding: 12px 14px; border: 0; border-radius: var(--radius-card-inner); background: var(--encore-white); box-shadow: var(--ring); color: var(--text-body); font: 400 15.5px/1.45 var(--font-ui); letter-spacing: -0.01em; resize: vertical; }
:is(.bk-note, .wn-said, .pgm-text, .wn-input):focus-visible { outline: 2px solid var(--border-focus); outline-offset: 2px; }
.wn-input { height: 44px; padding-block: 0; resize: none; }
:is(.bk-label, .wn-label, .pgm-label) { display: block; margin: 16px 0 6px; font: 600 14px/1.2 var(--font-ui); color: var(--text-heading); }

/* ---- Booking window ----------------------------------------------------------------------------------------------- */
dialog.mdl--book { width: min(920px, 96vw); max-height: min(96vh, 900px); }
.bk-lead { margin: 10px 0 12px; font-size: 15.5px; line-height: 1.45; color: var(--text-body); }
.bk-framewrap { position: relative; overflow: hidden; border-radius: var(--radius-card-inner); background: var(--encore-white); box-shadow: var(--ring); }
.bk-framewrap::before { content: 'Loading the calendar'; position: absolute; inset: 0; display: grid; place-items: center; font-size: 14.5px; color: var(--text-secondary); }
.bk-framewrap.is-loaded::before { content: none; }
.bk-frame { position: relative; display: block; width: 100%; height: min(660px, 64vh); min-height: 460px; border: 0; background: transparent; }
.bk-alt { margin-top: 10px; font-size: 13.5px; color: var(--text-secondary); }
.bk-stage--link { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 16px; align-items: start; padding: 6px 0 18px; }
.bk-ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--surface-muted); box-shadow: var(--ring); color: var(--text-heading); }
.bk-linktext { display: grid; justify-items: start; gap: 14px; }
.bk-linktext .bk-lead { margin: 0; max-width: 56ch; }
.bk-linktext .bk-help { margin: 0; }
.bk-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
@media (max-width: 560px) { .bk-two { grid-template-columns: 1fr; } }
.bk-help { margin-top: 8px; font-size: 13.5px; color: var(--text-secondary); }
.bk-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; }
.bk-fine { max-width: 48ch; font-size: 13.5px; line-height: 1.4; color: var(--text-secondary); }
@media (max-width: 560px) { .bk-foot .btn { width: 100%; justify-content: center; } .bk-frame { height: 62vh; } }

/* ---- Pack window -------------------------------------------------------------------------------------------------- */
dialog.mdl--pack { width: min(940px, 96vw); max-height: min(94vh, 940px); }
.pk-load { padding: 28px 0; color: var(--text-secondary); }
.pk-fail { display: grid; justify-items: start; gap: 14px; padding: 18px 0; }
.pk-tabs { position: sticky; top: -5px; z-index: 2; display: flex; gap: 6px; margin: 0 -24px; padding: 12px 24px 10px; overflow-x: auto; background: var(--surface-page); }
.pk-tab { display: inline-flex; align-items: center; gap: 8px; flex: none; height: 40px; padding: 0 16px; border: 0; border-radius: var(--btn-radius); background: transparent; box-shadow: inset 0 0 0 1px rgba(34, 34, 34, 0.2); color: var(--text-heading); font: 600 14.5px/1 var(--font-ui); letter-spacing: -0.01em; white-space: nowrap; cursor: pointer; transition: background-color var(--duration-base) var(--ease-standard); }
.pk-tab:hover { background: var(--surface-muted); }
.pk-tab[aria-selected='true'] { background: var(--encore-midnight); color: var(--encore-buttercream); box-shadow: none; }
.pk-tab .icon { width: 16px; height: 16px; stroke-width: 1.75; }
.pk-panel { padding: 8px 0 20px; }
.pk-top { display: grid; gap: 12px; margin: 8px 0 18px; }
.pk-lead { max-width: 72ch; font-size: 16px; line-height: 1.45; color: var(--text-body); }
.pk-tools { display: flex; flex-wrap: wrap; gap: 8px; }
.pk-items { display: grid; gap: 10px; }
.pk-item { border-radius: var(--radius-card-inner); background: var(--surface-card); box-shadow: var(--ring); }
.pk-sum { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 14px 16px; list-style: none; cursor: pointer; }
.pk-sum::-webkit-details-marker { display: none; }
.pk-sum .glyph { flex: none; }
.pk-n { min-width: 1.2em; font: 600 13px/1 var(--font-ui); color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.pk-title { font: 600 16px/1.25 var(--font-ui); color: var(--text-heading); }
.pk-pts { font-size: 13.5px; color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.pk-chev { display: inline-flex; color: var(--text-secondary); transition: transform var(--duration-base) var(--ease-standard); }
.pk-item[open] > .pk-sum .pk-chev { transform: rotate(180deg); }
.pk-body { display: grid; gap: 12px; padding: 2px 18px 18px; }
.pk-p { font-size: 15px; line-height: 1.45; }
.pk-h { margin: 8px 0 0; font: 700 12.5px/1 var(--font-ui); letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-secondary); }
.pk-steps { counter-reset: pkstep; display: grid; gap: 10px; }
.pk-steps li { position: relative; padding-left: 34px; font-size: 15px; line-height: 1.45; }
.pk-steps li::before { counter-increment: pkstep; content: counter(pkstep); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--encore-midnight); color: var(--encore-buttercream); font: 600 12px/1 var(--font-ui); }
.pk-body .lit, .pk-lead .lit, .pk-note .lit, .pk-saw-row .lit { padding: 1px 5px; border-radius: 5px; background: var(--surface-muted); }
.pk-code { margin: 4px 0 0; overflow: hidden; border-radius: var(--radius-card-inner); background: var(--encore-midnight); color: var(--encore-buttercream); }
.pk-code-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 8px 10px 8px 16px; border-bottom: 1px solid rgba(255, 249, 241, 0.14); }
.pk-code-label { font: 600 13.5px/1.2 var(--font-ui); }
.pk-code-label .lit { background: rgba(255, 249, 241, 0.12); color: var(--encore-buttercream); }
.pk-code-head .pk-code-where { padding: 0; background: none; font-size: 12px; color: var(--encore-ibiza-yellow); }
.pk-code-head .pill { margin-left: auto; background: transparent; color: var(--encore-buttercream); --pill-ring: rgba(255, 249, 241, 0.35); }
.pk-code-head .pill:hover { background: rgba(255, 249, 241, 0.12); color: var(--encore-buttercream); --pill-ring: rgba(255, 249, 241, 0.7); }
.pk-code :focus-visible { outline-color: var(--encore-ibiza-yellow); }
.pk-pre { max-height: 340px; margin: 0; padding: 14px 16px; overflow: auto; font: 400 12.5px/1.55 var(--font-mono); letter-spacing: 0; white-space: pre; tab-size: 2; }
.pk-pre code { font: inherit; }

/* Login plan */
.pk-path { display: grid; gap: 14px; margin: 4px 0 24px; }
.pk-stage { position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 14px; }
.pk-stage:not(:last-child)::after { content: ''; position: absolute; left: 19px; top: 100%; width: 2px; height: 14px; background: var(--encore-hairline); }
.pk-stage-mark { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--surface-muted); color: var(--text-heading); }
.pk-stage--pass .pk-stage-mark { background: var(--status-pass-bg); color: var(--pass-ink); }
.pk-stage--partial .pk-stage-mark { background: var(--status-partial-bg); color: var(--status-partial); }
.pk-stage--fail .pk-stage-mark { background: var(--status-fail-bg); color: var(--status-fail-line); }
.pk-stage-title { font: 600 16px/1.25 var(--font-ui); color: var(--text-heading); }
.pk-stage-q { margin-top: 2px; font-size: 14px; line-height: 1.35; color: var(--text-secondary); }
.pk-stage-state { display: grid; justify-items: end; gap: 2px; font: 600 13.5px/1.2 var(--font-ui); color: var(--text-heading); text-align: right; }
.pk-stage-pts { font-weight: 400; font-size: 12.5px; color: var(--text-secondary); }
.pk-saw { margin: 0 0 24px; }
.pk-saw-list { display: grid; gap: 6px; margin-top: 10px; font-size: 14.5px; line-height: 1.4; }
.pk-shots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.pk-shot { margin: 0; overflow: hidden; border-radius: var(--radius-card-inner); background: var(--surface-card); box-shadow: var(--ring); }
.pk-shot img { width: 100%; height: auto; aspect-ratio: 8 / 5; object-fit: cover; object-position: top; }
.pk-shot figcaption { padding: 8px 12px; font-size: 13px; color: var(--text-secondary); }
.pk-plan { margin-top: 4px; }
.pk-plan > .pk-h { margin-bottom: 12px; }

/* API map */
.pk-api { min-width: 0; }
.pk-run { display: flex; align-items: center; gap: 18px; padding-top: 22px; }
.pk-spin { flex: none; width: 30px; height: 30px; border: 3px solid var(--encore-hairline); border-top-color: var(--encore-izmir-blue); border-radius: 50%; animation: pk-spin 0.9s linear infinite; }
@keyframes pk-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .pk-spin { animation: none; border-top-color: var(--encore-izmir-blue); border-right-color: var(--encore-izmir-blue); } }
.pk-points { display: grid; gap: 8px; margin: 14px 0 22px; padding-left: 0; font-size: 15px; line-height: 1.45; }
.pk-points li { position: relative; padding-left: 22px; }
.pk-points li::before { content: ''; position: absolute; left: 4px; top: 0.62em; width: 7px; height: 7px; border-radius: 50%; background: var(--encore-izmir-blue); }
.pk-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 6px 0 16px; }
@media (max-width: 640px) { .pk-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pk-stat { display: grid; gap: 4px; padding: 14px 16px; border-radius: var(--radius-card-inner); background: var(--surface-card); box-shadow: var(--ring); }
.pk-stat-v { font: 500 34px/1 var(--font-display); letter-spacing: -0.03em; color: var(--encore-izmir-blue); font-variant-numeric: tabular-nums; }
.pk-stat-l { font-size: 13px; line-height: 1.3; color: var(--text-secondary); }
.pk-note { max-width: 72ch; margin-bottom: 8px; font-size: 14.5px; line-height: 1.45; color: var(--text-secondary); }
.pk-sec { margin-top: 24px; }
.pk-sec > .pk-h { margin: 0 0 10px; }
.pk-eps { display: grid; gap: 6px; }
.pk-ep { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 4px 12px; padding: 10px 12px; border-radius: 12px; background: var(--surface-card); box-shadow: var(--ring); }
.pk-method { align-self: start; padding-top: 2px; font: 700 12px/1.3 var(--font-mono); letter-spacing: 0; color: var(--encore-izmir-blue); }
.pk-method--post, .pk-method--put, .pk-method--patch, .pk-method--delete { color: var(--encore-buffalo-brown); }
.pk-ep-main { display: grid; gap: 2px; min-width: 0; }
.pk-ep-path { font-size: 13px; }
.pk-ep-ops { font-size: 12.5px; color: var(--text-secondary); }
.pk-ep-meta { grid-column: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; font-size: 12.5px; color: var(--text-secondary); }
.pk-acc { padding: 2px 8px; border-radius: var(--btn-radius); background: var(--status-unknown-bg); color: var(--text-heading); font-weight: 600; }
.pk-acc--open { background: var(--status-pass-bg); color: var(--pass-ink); }
.pk-acc--keyed { background: var(--status-partial-bg); color: var(--status-partial); }
.pk-acc--gated { background: var(--status-live-bg); color: var(--encore-izmir-blue); }
.pk-more { margin-top: 10px; font-size: 14px; font-weight: 600; }
.pk-plain { display: grid; gap: 6px; font-size: 14.5px; line-height: 1.4; }
.pk-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pk-chips .chip { height: auto; min-height: 26px; padding-block: 4px; white-space: normal; }
.pk-chip-n { color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.pk-pages > summary { cursor: pointer; font: 600 14px/1.3 var(--font-ui); color: var(--text-link); }
.pk-pages .pk-plain { margin-top: 10px; }
.pk-again { margin-top: 18px; font-size: 13.5px; color: var(--text-secondary); }
@media (max-width: 560px) {
  .pk-tabs { margin-inline: -18px; padding-inline: 18px; gap: 4px; }
  .pk-tab { padding: 0 12px; gap: 6px; font-size: 14px; }
  .pk-tab .icon { display: none; }
  .pk-sum { grid-template-columns: auto minmax(0, 1fr) auto auto; }
  .pk-n { display: none; }
  .pk-body { padding-inline: 14px; }
  .pk-stage { grid-template-columns: 40px minmax(0, 1fr); }
  .pk-stage-state { grid-column: 2; justify-items: start; text-align: left; grid-auto-flow: column; gap: 10px; }
  .pk-shots { grid-template-columns: minmax(0, 1fr); }
}

/* ---- Share window ------------------------------------------------------------------------------------------------- */
dialog.mdl--progress { width: min(780px, 96vw); }
.pgm-preview { position: relative; margin: 14px 0 6px; overflow: hidden; border-radius: var(--radius-card-inner); background: var(--surface-muted); box-shadow: var(--ring); aspect-ratio: 1200 / 630; }
.pgm-img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pgm-shim { position: absolute; inset: 0; display: grid; place-items: center; padding: 16px; text-align: center; font-size: 14px; color: var(--text-secondary); background: linear-gradient(100deg, var(--surface-muted) 30%, var(--encore-white) 50%, var(--surface-muted) 70%); background-size: 200% 100%; animation: pgm-shim 1.4s linear infinite; }
@keyframes pgm-shim { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .pgm-shim { animation: none; } }
.pgm-text { min-height: 130px; }
.pgm-help { margin-top: 6px; font-size: 13.5px; color: var(--text-secondary); }
.pgm-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.pgm-quote { margin: 20px 0 8px; font-size: 14.5px; color: var(--text-secondary); }
.pgm-empty { padding: 20px 0 10px; }
@media (max-width: 560px) { .pgm-row > .pill { flex: 1 1 100%; } }

/* ---- Quote form --------------------------------------------------------------------------------------------------- */
dialog.mdl--win { width: min(640px, 96vw); }
.wn-lead { margin: 10px 0 0; font-size: 15.5px; line-height: 1.45; }
.wn-said { min-height: 108px; }
.wn-meta { display: flex; justify-content: space-between; gap: 12px; margin-top: 6px; font-size: 13px; color: var(--text-secondary); }
.wn-count { font-variant-numeric: tabular-nums; }
.wn-count.is-over { color: var(--status-fail-line); font-weight: 600; }
.wn-startlabel { margin: 16px 0 8px; font: 600 13.5px/1.2 var(--font-ui); color: var(--text-secondary); }
.wn-starters { display: grid; gap: 8px; }
.wn-starter { width: 100%; padding: 10px 14px; border: 0; border-radius: var(--radius-card-inner); background: var(--surface-card); box-shadow: var(--ring); font: 400 14px/1.4 var(--font-ui); letter-spacing: -0.01em; text-align: left; color: var(--text-body); cursor: pointer; transition: box-shadow var(--duration-base) var(--ease-standard), background-color var(--duration-base) var(--ease-standard); }
.wn-starter:hover { background: var(--encore-white); box-shadow: var(--ring-muted); }
.wn-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
@media (max-width: 560px) { .wn-two { grid-template-columns: minmax(0, 1fr); } }
.wn-consent { display: flex; align-items: flex-start; gap: 12px; margin-top: 18px; font-size: 14px; line-height: 1.4; cursor: pointer; }
.wn-box { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--encore-izmir-blue); cursor: pointer; }
.wn-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; }
.wn-fine { font-size: 13.5px; color: var(--text-secondary); }
.wn-empty { padding: 20px 0 10px; }
.wn-thanks { display: grid; justify-items: start; gap: 12px; padding: 22px 0 12px; }
.wn-thanks-ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--status-pass-bg); color: var(--pass-ink); }
.wn-thanks-h { font: 500 30px/1 var(--font-display); letter-spacing: -0.03em; color: var(--text-heading); }
@media (max-width: 560px) { .wn-foot .btn { width: 100%; justify-content: center; } }
:is(.mdl--book, .mdl--pack, .mdl--progress, .mdl--win) .btn.is-busy { opacity: 0.6; pointer-events: none; }

/* ---- Wall of quotes on the home page ------------------------------------------------------------------------------ */
.wins { padding-block: clamp(48px, 7vw, 96px); }
.wins .wall-k { margin-bottom: 18px; }
.wins .section-sub { max-width: 60ch; margin-top: 18px; }
.wv-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: clamp(24px, 3vw, 40px); }
@media (min-width: 1000px) { .wv-cards:has(.wv-card:only-child) { grid-template-columns: minmax(0, 440px); } }
@media (max-width: 999.98px) { .wv-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639.98px) { .wv-cards { grid-template-columns: minmax(0, 1fr); } }
.wv-card { display: flex; flex-direction: column; gap: 20px; min-width: 0; padding: 24px; border-radius: 28px; background: var(--encore-white); box-shadow: var(--ring); }
.wv-score { display: flex; align-items: center; gap: 10px; font: 500 42px/1 var(--font-display); letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.wv-from { color: var(--text-secondary); }
.wv-arrow { display: inline-flex; color: var(--text-secondary); }
.wv-to { color: var(--encore-izmir-blue); }
.wv-up { margin-left: auto; padding: 6px 12px; border-radius: var(--btn-radius); background: var(--status-pass-bg); color: var(--pass-ink); font: 600 13px/1 var(--font-ui); letter-spacing: 0; }
.wv-quote p { font: 500 23px/1.18 var(--font-display); letter-spacing: -0.02em; color: var(--text-heading); text-wrap: pretty; }
.wv-by { display: flex; align-items: center; gap: 14px; margin-top: auto; }
.wv-by .lv-brand { flex: none; height: 52px; min-width: 52px; margin: 0; padding: 0 12px; border-radius: 14px; }
.wv-by .lv-brand-img { height: 26px; max-width: 110px; }
.wv-by .lv-brand-img.is-tile { height: 34px; width: 34px; }
.wv-org { font: 600 15.5px/1.2 var(--font-ui); color: var(--text-heading); }
.wv-who, .wv-lvl { margin-top: 2px; font-size: 13.5px; line-height: 1.3; color: var(--text-secondary); }
.wins:not(.is-in) .wv-card { opacity: 0; transform: translateY(14px); }
.wins .wv-card { transition: opacity 0.6s var(--ease-standard), transform 0.6s var(--ease-standard); }
.wins .wv-card:nth-child(2) { transition-delay: 70ms; }
.wins .wv-card:nth-child(3) { transition-delay: 140ms; }
@media (prefers-reduced-motion: reduce) { .wins:not(.is-in) .wv-card { opacity: 1; transform: none; } .wins .wv-card { transition: none; } }

/* Booking window, step one: the email */
.bk-step { margin: 14px 0 6px; font: 600 12.5px/1.2 var(--font-ui); letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-secondary); }
.bk-lead-form .bk-lead { margin: 0; max-width: 60ch; }