@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600;700&family=Barlow+Condensed:wght@500;600;700;800;900&family=Barlow+Semi+Condensed:wght@400;500;600;700&display=swap');

body:has(#blk-messi-retirement) { background:#f5f8ff; }
#blk-messi-retirement,
#blk-messi-retirement * { box-sizing:border-box; }
#blk-messi-retirement {
  --blue:#4a90d9; --deep-blue:#1b5baf; --navy:#0e2354; --pale:#f5f8ff; --line:#c6d8ec;
  width:100%; overflow:visible; background:var(--pale); color:var(--navy);
  font-family:'Barlow',Arial,sans-serif;
}
#blk-messi-retirement a { color:inherit; text-decoration:none; }
#blk-messi-retirement button { font:inherit; }

.blk-m-hero {
  position:relative; min-height:560px; overflow:hidden; display:block;
  background:#0a1c45; color:#fff;
}
.blk-m-hero-picture { position:absolute; inset:0; display:block; }
.blk-m-hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:70% center; opacity:.9; }
.blk-m-hero-shade { position:absolute; inset:0; background:linear-gradient(100deg,rgba(10,28,69,.88) 30%,rgba(10,28,69,.45) 55%,rgba(10,28,69,.1) 100%); }
.blk-m-hero-texture { position:absolute; inset:0; opacity:.05; background:repeating-linear-gradient(-10deg,#4a90d9 0,#4a90d9 56px,transparent 56px,transparent 112px); }
.blk-m-hero-copy { position:relative; z-index:1; width:min(960px,100%); margin:0; padding:64px 32px 96px 64px; }
.blk-m-kicker,.blk-m-section-index {
  margin:0 0 24px; color:var(--blue); font:700 10px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.2em;
}
.blk-m-kicker { display:inline-flex; padding:10px 14px; margin-bottom:32px; color:#fff; background:var(--blue); }
.blk-m-hero h1 {
  margin:0; color:#fff; font:900 clamp(3.2rem,9vw,7.5rem)/.84 'Barlow Condensed',Arial Narrow,sans-serif;
  letter-spacing:-.01em;
}
.blk-m-hero h1 em,.blk-m-story-intro h2 em,.blk-m-shirt-copy h2 em,.blk-m-timeline h2 em,.blk-m-quotes h2 em {
  color:#8ec4f4; font-style:italic;
}
.blk-m-hero-description { max-width:430px; margin:28px 0 36px; color:#e1edfa; font-size:16px; line-height:1.55; }
.blk-m-hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.blk-m-button {
  display:inline-flex; align-items:center; justify-content:center; min-width:174px; min-height:52px; padding:0 22px;
  border:1px solid #fff; color:#fff; font:700 12px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.12em;
}
.blk-m-button-primary { background:var(--blue); border-color:var(--blue); color:#fff !important; }
.blk-m-button-outline { color:#fff; }
.blk-m-button:hover { background:#fff; color:var(--navy) !important; }
.blk-m-hero-stats {
  position:absolute; z-index:1; right:0; bottom:0; left:0; display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.2); background:rgba(10,28,69,.25);
}
.blk-m-hero-stats div {
  display:flex; min-height:64px; flex-direction:column; align-items:center; justify-content:center; gap:5px;
  padding:16px 32px; border-right:1px solid rgba(255,255,255,.2); text-align:center;
}
.blk-m-hero-stats div:last-child { border-right:0; }
.blk-m-hero-stats strong { font:700 24px/1 'Barlow Condensed',Arial Narrow,sans-serif; }
.blk-m-hero-stats span { color:#b8d0ec; font:500 9px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.15em; }

.blk-m-product-section { padding:80px 32px 64px; background:#fff; }
.blk-m-product-section-club { padding-top:64px; padding-bottom:80px; background:var(--pale); }
.blk-m-section-heading {
  width:min(1120px,100%); margin:0 auto 40px; display:flex; align-items:flex-end; justify-content:space-between; gap:24px;
}
.blk-m-section-heading h2 {
  margin:0; color:var(--navy); font:800 clamp(32px,4vw,58px)/1 'Barlow Condensed',Arial Narrow,sans-serif;
  letter-spacing:.01em;
}
.blk-m-section-heading h2 em {
  color:var(--deep-blue); font-style:italic; background:linear-gradient(135deg,#1b5baf,#4a90d9);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.blk-m-section-count { padding-bottom:8px; color:var(--navy); font:600 11px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.12em; }
.blk-m-product-grid {
  width:min(1120px,100%); margin:0 auto; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px;
}
.blk-m-card {
  min-width:0; display:flex; flex-direction:column; overflow:hidden; border:1px solid rgba(74,144,217,.15); background:#fff;
  transition:border-color .25s,box-shadow .25s,transform .25s;
}
.blk-m-card:hover { border-color:var(--blue); box-shadow:0 8px 32px rgba(74,144,217,.14); transform:translateY(-3px); }
.blk-m-card-media {
  position:relative; display:block; overflow:hidden; aspect-ratio:3/3.5; flex:none; background:#ebf4fc;
}
.blk-m-card-media img { width:100%; height:100%; display:block; object-fit:contain; transition:transform .5s ease; }
.blk-m-card:hover .blk-m-card-media img { transform:scale(1.03); }
.blk-m-badge,.blk-m-price {
  position:absolute; z-index:1; font:700 9px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.1em;
}
.blk-m-badge { top:12px; left:12px; padding:5px 8px; color:#fff; background:var(--navy); }
.blk-m-badge-iconic { color:var(--navy); background:#d4aa45; }
.blk-m-badge-new { background:var(--deep-blue); }
.blk-m-badge-retro { color:#4a6a9e; background:#e8eef7; }
.blk-m-badge-limited { background:var(--navy); }
.blk-m-badge-rare { background:var(--blue); }
.blk-m-price {
  right:12px; bottom:12px; padding:0; color:var(--navy); font:700 24px/1 'Barlow Condensed',Arial Narrow,sans-serif;
  text-shadow:0 1px 8px rgba(255,255,255,.8);
}
.blk-m-card-info { display:flex; flex:1; flex-direction:column; gap:12px; padding:20px; background:#fff; }
.blk-m-card h3 { margin:0; color:var(--navy); font:700 16px/1.15 'Barlow Condensed',Arial Narrow,sans-serif; letter-spacing:.02em; }
.blk-m-card p { min-height:0; margin:0; color:#6680a2; font:500 9px/1.35 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.08em; }
.blk-m-sizes { display:flex; flex-wrap:wrap; gap:6px; margin:0; }
.blk-m-sizes button {
  width:auto; height:auto; padding:5px 10px; border:1px solid rgba(74,144,217,.3); background:transparent; color:#4a6a9e;
  cursor:pointer; font:500 10px/1 'Barlow Semi Condensed',Arial,sans-serif;
}
.blk-m-sizes button:hover,.blk-m-sizes button.is-selected { border-color:var(--navy); background:var(--navy); color:#fff; }
.blk-m-card-cta {
  display:flex; align-items:center; justify-content:center; width:100%; min-height:38px; margin-top:auto; border:0;
  background:#f0f4fa; color:#a0b0c8; font:700 10px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.08em;
}
.blk-m-card-cta:hover,.blk-m-card-cta.is-ready { background:var(--deep-blue); color:#fff; }
.blk-m-stripe-divider {
  height:8px; margin:0 32px; border-radius:2px; background:repeating-linear-gradient(90deg,#4a90d9 0 24px,#fff 24px 48px);
}
.blk-m-catalogue-note {
  width:min(1120px,100%); margin:40px auto 0; padding-top:28px; display:flex; align-items:center; justify-content:space-between;
  gap:20px; border-top:1px solid rgba(74,144,217,.15); color:#5f7898; font-size:12px;
}
.blk-m-catalogue-note a { color:var(--deep-blue); font:700 10px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.15em; white-space:nowrap; }

.blk-m-story-intro { padding:80px 32px; background:var(--navy); color:#fff; text-align:center; }
.blk-m-story-inner { width:min(800px,100%); margin:0 auto; }
.blk-m-story-intro .blk-m-section-index { color:#8ec4f4; }
.blk-m-story-intro h2 { margin:0 0 26px; color:#fff; font:700 clamp(40px,7vw,96px)/.86 'Barlow Condensed',Arial Narrow,sans-serif; letter-spacing:-.015em; }
.blk-m-story-intro>div>p:last-child { max-width:580px; margin:0 auto; color:#c8d9ed; font-size:16px; line-height:1.5; }

.blk-m-numbers { padding:80px 32px; background:#fff; }
.blk-m-numbers .blk-m-content-width { width:min(1120px,100%); margin:0 auto; }
.blk-m-numbers h2,.blk-m-timeline h2,.blk-m-quotes h2 {
  display:flex; align-items:flex-end; gap:24px; color:var(--navy); font:700 clamp(32px,4vw,58px)/1 'Barlow Condensed',Arial Narrow,sans-serif;
}
.blk-m-numbers h2 { margin:0 0 48px; }
.blk-m-numbers h2:after,.blk-m-timeline h2:after,.blk-m-quotes h2:after {
  content:''; flex:1; height:1px; margin-bottom:8px; background:linear-gradient(90deg,rgba(74,144,217,.3),transparent);
}
.blk-m-number-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.blk-m-number-grid>div {
  min-height:150px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:8px; padding:24px 28px;
  border:1px solid rgba(74,144,217,.18); background:#fff; text-align:left; transition:border-color .25s,box-shadow .25s,transform .25s;
}
.blk-m-number-grid>div:hover { border-color:var(--blue); box-shadow:0 6px 24px rgba(74,144,217,.12); transform:translateY(-2px); }
.blk-m-number-grid strong { color:var(--deep-blue); font:700 clamp(40px,5vw,64px)/1 'Barlow Condensed',Arial Narrow,sans-serif; background:linear-gradient(135deg,#1b5baf,#4a90d9); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.blk-m-number-grid span { color:var(--navy); font:600 16px/1.2 'Barlow',Arial,sans-serif; }
.blk-m-number-grid small { color:#6b82a0; font:500 10px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.08em; }

.blk-m-timeline { padding:80px 32px; background:#fff; }
.blk-m-timeline .blk-m-content-width { width:min(960px,100%); margin:0 auto; }
.blk-m-timeline h2 { margin:0 0 48px; }
.blk-m-timeline-list { position:relative; display:block; padding-left:32px; }
.blk-m-timeline-list:before { content:''; position:absolute; top:0; bottom:0; left:0; width:1px; background:linear-gradient(#c6d8ec,rgba(198,216,236,.15)); }
.blk-m-timeline-list:after { display:none; }
.blk-m-timeline-list article { position:relative; min-height:0; padding:0 0 40px; border:0; }
.blk-m-timeline-list article:before { content:''; position:absolute; left:-38px; top:5px; width:10px; height:10px; border:2px solid var(--blue); border-radius:50%; background:var(--pale); }
.blk-m-timeline-year { display:flex; align-items:baseline; gap:12px; color:var(--deep-blue); font:700 16px/1 'Barlow Semi Condensed',Arial,sans-serif; }
.blk-m-timeline-year span { margin:0; color:#a0b0c8; font:500 10px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.08em; }
.blk-m-timeline-detail { display:flex; flex-direction:column; }
.blk-m-timeline h3 { margin:6px 0 5px; color:var(--navy); font:700 20px/1 'Barlow Condensed',Arial Narrow,sans-serif; letter-spacing:.03em; }
.blk-m-timeline p { max-width:620px; margin:0; color:#4a6a9e; font-size:14px; line-height:1.5; }

.blk-m-shirt-story { padding:48px 32px; background:var(--pale); }
.blk-m-shirt-panel {
  width:min(1120px,100%); min-height:380px; margin:0 auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  overflow:hidden; border:1px solid rgba(74,144,217,.2); background:#fff;
}
.blk-m-shirt-image { position:relative; min-height:380px; overflow:hidden; background:#ebf4fc; }
.blk-m-shirt-image:after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent 60%,rgba(255,255,255,.4)); pointer-events:none; }
.blk-m-shirt-image img { width:100%; height:100%; min-height:380px; display:block; object-fit:cover; transition:transform .5s ease; }
.blk-m-shirt-image:hover img { transform:scale(1.03); }
.blk-m-shirt-copy { display:flex; flex-direction:column; justify-content:center; padding:56px; background:#fff; }
.blk-m-shirt-copy h2 { margin:0 0 28px; color:var(--navy); font:700 clamp(58px,7vw,100px)/.84 'Barlow Condensed',Arial Narrow,sans-serif; }
.blk-m-shirt-copy>p:not(.blk-m-section-index) { max-width:500px; margin:0 0 16px; color:#466481; font-size:16px; line-height:1.55; }
.blk-m-shirt-copy small { margin-top:16px; padding-top:24px; border-top:1px solid rgba(74,144,217,.12); color:#466481; font:600 10px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.12em; }

.blk-m-quotes { padding:80px 32px; background:#fff; }
.blk-m-quotes .blk-m-content-width { width:min(960px,100%); margin:0 auto; }
.blk-m-quotes h2 { margin:0 0 48px; text-align:left; }
.blk-m-quote-panel { max-width:900px; margin:0 auto; padding:40px 56px; border:1px solid rgba(74,144,217,.15); background:#fff; text-align:left; }
.blk-m-quote-mark { height:34px; color:var(--blue); font:700 94px/.6 Georgia,serif; }
.blk-m-quotes blockquote { max-width:none; margin:16px 0 22px; color:var(--navy); font:500 clamp(22px,3vw,34px)/1.12 'Barlow Condensed',Arial Narrow,sans-serif; }
.blk-m-quote-source { margin:0; color:#6a85a3; font:600 10px/1 'Barlow Semi Condensed',Arial,sans-serif; letter-spacing:.12em; }
.blk-m-quote-controls { display:flex; justify-content:flex-start; gap:8px; margin-top:34px; }
.blk-m-quote-controls button { width:28px; height:4px; padding:0; border:0; background:#c5d3e1; cursor:pointer; }
.blk-m-quote-controls button.is-active { background:var(--blue); }

@media (max-width:900px) {
  .blk-m-hero-copy { padding-left:32px; }
  .blk-m-product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .blk-m-number-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .blk-m-shirt-panel { grid-template-columns:1fr 1fr; }
}
@media (max-width:640px) {
  .blk-m-hero { min-height:680px; }
  .blk-m-hero-image { object-position:63% center; }
  .blk-m-hero-shade { background:linear-gradient(180deg,rgba(14,35,84,.93),rgba(14,35,84,.65) 43%,rgba(14,35,84,.22)); }
  .blk-m-hero-copy { padding:56px 22px 128px; }
  .blk-m-hero h1 { font-size:76px; }
  .blk-m-hero-description { font-size:16px; }
  .blk-m-hero-actions { flex-direction:column; align-items:flex-start; }
  .blk-m-button { min-width:190px; }
  .blk-m-hero-stats { grid-template-columns:repeat(2,1fr); }
  .blk-m-hero-stats div { min-height:76px; padding:14px 12px; }
  .blk-m-hero-stats strong { font-size:20px; }
  .blk-m-product-section { padding-right:22px; padding-left:22px; }
  .blk-m-product-grid { grid-template-columns:1fr; gap:42px; }
  .blk-m-section-heading { align-items:flex-start; flex-direction:column; gap:14px; }
  .blk-m-section-heading h2 { font-size:57px; }
  .blk-m-stripe-divider { margin-right:22px; margin-left:22px; }
  .blk-m-catalogue-note { flex-direction:column; align-items:flex-start; gap:20px; line-height:1.4; }
  .blk-m-story-intro,.blk-m-numbers,.blk-m-timeline,.blk-m-quotes { padding-right:22px; padding-left:22px; }
  .blk-m-story-intro { padding-top:92px; padding-bottom:92px; }
  .blk-m-story-intro h2,.blk-m-timeline h2,.blk-m-numbers h2,.blk-m-quotes h2 { font-size:58px; }
  .blk-m-numbers h2,.blk-m-timeline h2,.blk-m-quotes h2 { display:block; }
  .blk-m-numbers h2:after,.blk-m-timeline h2:after,.blk-m-quotes h2:after { display:block; width:100%; margin-top:18px; }
  .blk-m-number-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .blk-m-number-grid>div { min-height:130px; padding:18px; }
  .blk-m-number-grid span { font-size:14px; }
  .blk-m-timeline-list article { padding-bottom:30px; }
  .blk-m-shirt-story { padding:32px 22px; }
  .blk-m-shirt-panel { grid-template-columns:1fr; }
  .blk-m-shirt-image { min-height:360px; }
  .blk-m-shirt-image img { min-height:360px; }
  .blk-m-shirt-copy { padding:58px 24px 74px; }
  .blk-m-shirt-copy h2 { font-size:65px; }
  .blk-m-quote-panel { padding:28px 24px; }
}
