/* Component styles. Every value here comes from the Luxembourg Drive styleguide. */

/* ---------------- BUTTON ---------------- */
.ld-btn{display:inline-flex;align-items:center;gap:12px;font-family:var(--font-display);font-variation-settings:'wdth' var(--wdth-tight);font-weight:800;font-size:14px;letter-spacing:.06em;text-transform:uppercase;padding:16px 30px;border-radius:var(--radius);cursor:pointer;border:none;text-decoration:none;position:relative;overflow:hidden;transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out)}
.ld-btn--primary{background:var(--action-primary-bg);color:var(--action-primary-fg)}
.ld-btn--primary:hover{transform:translateY(var(--lift-button));box-shadow:var(--glow-red)}
.ld-btn--primary:active{background:var(--action-primary-pressed);transform:none;box-shadow:none}
.ld-btn--primary::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.25) 45%,transparent 60%);transform:translateX(-120%);transition:transform .6s var(--ease-snap)}
.ld-btn--primary:hover::after{transform:translateX(120%)}
.ld-btn--ghost{background:transparent;color:var(--white);box-shadow:inset 0 0 0 1px var(--action-ghost-border)}
.ld-btn--ghost:hover{box-shadow:inset 0 0 0 1px var(--action-ghost-border-hover);color:var(--m-red);transform:translateY(var(--lift-button))}
.ld-btn:disabled,.ld-btn[aria-disabled="true"]{color:var(--dim);background:var(--graphite);box-shadow:none;transform:none;cursor:not-allowed}
.ld-btn:disabled::after{display:none}
.ld-btn:focus-visible{outline:2px solid var(--border-focus);outline-offset:3px}

/* ---------------- EYEBROW ---------------- */
.ld-eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:12px;font-weight:500;letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--grey)}
.ld-eyebrow::before{content:"";width:22px;height:2px;background:var(--m-red);flex:none}
.ld-eyebrow--ice::before{background:var(--m-ice)}

/* ---------------- CARD ---------------- */
.ld-card{background:var(--surface-card);border:var(--border-w) solid var(--border-default);border-radius:var(--radius);padding:28px;position:relative;overflow:hidden;transition:border-color var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.ld-card--interactive:hover{border-color:var(--border-hover);transform:translateY(var(--lift-card))}
.ld-card--interactive:hover .ld-card__num{color:var(--m-red);-webkit-text-stroke:0}
.ld-card__num{font-family:var(--font-display);font-variation-settings:'wdth' var(--wdth-display);font-weight:900;font-size:44px;line-height:1;color:transparent;-webkit-text-stroke:1px var(--dim);transition:all var(--dur-base) var(--ease-out);margin-bottom:16px;display:block}
.ld-card__title{font-family:var(--font-display);font-variation-settings:'wdth' var(--wdth-tight);font-weight:900;text-transform:uppercase;color:var(--text-heading);font-size:var(--size-h3);line-height:var(--lh-display);margin-bottom:8px}
.ld-card__body{font-size:var(--size-body-sm)}

/* ---------------- STAT ---------------- */
.ld-stat{border-left:2px solid var(--m-red);padding-left:18px}
.ld-stat--ice{border-left-color:var(--m-ice)}
.ld-stat__value{font-family:var(--font-mono);font-size:34px;font-weight:600;color:var(--white);line-height:1.1}
.ld-stat__unit{color:var(--m-red);font-size:18px}
.ld-stat--ice .ld-stat__unit{color:var(--m-ice)}
.ld-stat__label{font-family:var(--font-mono);font-size:var(--size-mono-sm);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:4px}

/* ---------------- TIMELINE ---------------- */
.ld-timeline{display:flex;align-items:flex-start;gap:0;background:var(--surface-card);border:var(--border-w) solid var(--border-default);border-radius:var(--radius);padding:26px 30px;position:relative}
.ld-tl-stop{flex:1;position:relative;padding-top:26px}
.ld-tl-stop::before{content:"";position:absolute;top:0;left:0;width:12px;height:12px;border-radius:50%;border:2px solid var(--m-ice);background:var(--asphalt)}
.ld-tl-stop::after{content:"";position:absolute;top:5px;left:18px;right:8px;height:2px;background:var(--line)}
.ld-tl-stop:last-child::after{display:none}
.ld-tl-stop--finish::before{border-color:var(--m-red);box-shadow:var(--glow-dot)}
.ld-tl-stop__label{font-family:var(--font-mono);font-size:var(--size-mono-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--m-ice);margin-bottom:2px}
.ld-tl-stop--finish .ld-tl-stop__label{color:var(--m-red)}
.ld-tl-stop__name{font-family:var(--font-display);font-variation-settings:'wdth' var(--wdth-tight);font-weight:800;font-size:16px;text-transform:uppercase;color:var(--white)}
.ld-tl-stop__time{font-family:var(--font-mono);font-size:var(--size-mono);color:var(--grey);margin-top:2px}

/* ---------------- STRIPE MOTIF ---------------- */
.ld-stripe-divider{position:relative;height:var(--stripe-divider-h);width:100%;overflow:hidden;border:none;background:linear-gradient(90deg,var(--m-ice) 0 33.3%,var(--m-blue) 33.3% 66.6%,var(--m-red) 66.6% 100%)}
.ld-stripe-divider--thin{height:var(--stripe-divider-h-thin)}
.ld-stripe-corner{position:absolute;top:0;right:0;width:40%;height:100%;pointer-events:none;opacity:.9;background:linear-gradient(var(--stripe-angle),transparent 40%,var(--m-ice) 40% 47%,var(--m-blue) 47% 54%,var(--m-red) 54% 64%,transparent 64%)}
.ld-stripe-corner--hero{top:-10%;right:-6%;width:60%;height:130%;background:linear-gradient(var(--stripe-angle),transparent 42%,var(--m-ice) 42% 47%,var(--m-blue) 47% 52%,var(--m-red) 52% 60%,transparent 60%);opacity:.85}

/* ---------------- TAG (do/don't + badges) ---------------- */
.ld-tag{display:inline-block;font-family:var(--font-mono);font-size:var(--size-mono-xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:var(--radius-sm)}
.ld-tag--ice{background:rgba(76,155,214,.15);color:var(--m-ice)}
.ld-tag--red{background:rgba(228,50,43,.15);color:var(--m-red)}
.ld-tag--gold{background:var(--db-gold);color:var(--text-on-gold)}

@keyframes ld-stripes-in{to{opacity:.85;transform:none}}
