* { box-sizing:border-box; }
body { margin:var(--s-0); font-family:var(--font-sans); color:var(--c-text); background:var(--c-bg); font-size:var(--fs-base); line-height:var(--lh-base); }
a { color:inherit; }
a:focus-visible, main:focus-visible { outline:var(--s-1) solid var(--c-focus); outline-offset:var(--s-1); }
.skip { position:absolute; transform:translateY(-200%); background:var(--c-bg); padding:var(--s-4); }
.skip:focus { transform:none; }
.showcase-header, section, footer { max-width:var(--size-content-max); margin:auto; padding:var(--s-7) var(--size-gutter-mobile); }
.showcase-header { display:flex; justify-content:space-between; align-items:center; gap:var(--s-4); }
.showcase-header img { display:block; object-fit:contain; }
nav { display:flex; flex-wrap:wrap; gap:var(--s-4); }
nav a { display:inline-flex; align-items:center; min-height:var(--size-control-md); font-size:var(--fs-sm); }
h1 { font-size:var(--fs-display); line-height:var(--lh-display); letter-spacing:var(--ls-display); font-weight:var(--fw-display); }
h2 { font-size:var(--fs-2xl); line-height:var(--lh-2xl); font-weight:var(--fw-2xl); }
h3 { font-size:var(--fs-lg); font-weight:var(--fw-lg); }
h1,h2,h3,p { overflow-wrap:anywhere; }
.showcase-hero { display:grid; gap:var(--s-7); background:var(--c-surface); align-items:center; }
.showcase-hero img { width:100%; height:auto; border-radius:var(--r-lg); }
.intro { max-width:var(--size-text-max); margin-bottom:var(--s-7); }
.btn { text-decoration:none; min-height:var(--size-control-md); }
.showcase-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-4); }
article img { width:100%; height:auto; display:block; border-radius:var(--r-lg); }
article h3 { margin-top:var(--s-3); }
.note, footer { color:var(--c-text-muted); font-size:var(--fs-sm); }
.showcase-opening { background:var(--c-surface); }
.showcase-opening p { max-width:var(--size-text-max); }
@media(min-width:48rem) { .showcase-header, section, footer { padding:var(--s-9) var(--size-gutter-desktop); } .showcase-hero { grid-template-columns:1fr 1fr; } .showcase-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }