.hero { display: grid; grid-template-columns: .8fr 1.2fr; gap: 48px; padding: 52px 48px 46px; background: linear-gradient(125deg, #1d2b17, #201d25); }
.hero h1 { margin: 18px 0; color: var(--acid); font: bold clamp(72px, 10vw, 122px)/.72 Impact, "Arial Black", sans-serif; letter-spacing: -5px; text-shadow: 4px 4px #f82778, -3px -2px #26d5ff; }
.hero h1 span { color: #fa2f80; }.hero h2 { margin-bottom: 18px; font: bold clamp(27px, 3.5vw, 44px)/1.08 var(--mono); letter-spacing: -3px; }.hero-copy > p:not(.version-tag) { max-width: 390px; color: #d2dac7; line-height: 1.85; }.hero-actions { display: flex; align-items: center; gap: 23px; margin-top: 27px; }.text-button, .flat-link { color: var(--lime); font: bold 13px var(--mono); text-decoration: underline; }
.carousel { position: relative; align-self: center; overflow: hidden; border: 4px solid #c1cc9d; background: #0b0d09; box-shadow: 8px 8px #fa318a; }.carousel input { position: absolute; opacity: 0; }.slides { position: relative; height: 345px; }.slide { display: none; position: absolute; inset: 0; margin: 0; background: linear-gradient(125deg, #d7ff00, #fd318f 48%, #182218 49%); }.slide img { width: 100%; height: 100%; object-fit: cover; color: #16200f; font: 12px var(--mono); }.slide figcaption { position: absolute; right: 0; bottom: 0; left: 0; padding: 10px 13px; background: rgba(9, 11, 8, .87); color: #eef2ce; font: 12px var(--mono); }.slide figcaption span { float: right; color: var(--lime); font-size: 10px; }.slide-2 { background: linear-gradient(135deg, #5af2ed, #ed46b5 50%, #d5ff00); }.slide-3 { background: linear-gradient(135deg, #ffed45, #7026c4 52%, #10120c); }#slide-1:checked ~ .slides .slide-1, #slide-2:checked ~ .slides .slide-2, #slide-3:checked ~ .slides .slide-3 { display: block; }.dots { position: absolute; top: 10px; right: 11px; z-index: 2; display: flex; gap: 5px; }.dots label { padding: 3px 5px; background: #10130d; color: #dbe5c5; cursor: pointer; font: 10px var(--mono); }#slide-1:checked ~ .dots label[for=slide-1], #slide-2:checked ~ .dots label[for=slide-2], #slide-3:checked ~ .dots label[for=slide-3] { background: var(--acid); color: #10140d; }
.ticker { overflow: hidden; padding: 6px 0; background: var(--pink); color: #111; white-space: nowrap; font: bold 13px var(--mono); }.ticker span { display: inline-block; animation: slide 16s linear infinite; }.section { margin: 0 22px; padding: 54px 0; border-bottom: 1px solid var(--line); }.section-head { display: flex; align-items: baseline; gap: 19px; }.section-head b { color: var(--pink); font: 20px var(--mono); }.section-head h2 { font: bold clamp(24px, 3vw, 37px)/1 var(--mono); letter-spacing: -2px; }.intro-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 72px; margin: 26px 0; }.intro-grid > p { color: #d8dfcd; font-size: 17px; line-height: 1.9; }.feature-list div { padding: 8px 0; border-bottom: 1px dotted #66704d; }.feature-list b { padding-right: 20px; color: var(--lime); font: 12px var(--mono); }.download-strip { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 35px 48px; background: #dfeb43; color: #101608; }.download-strip p { font: 12px var(--mono); }.download-strip h2 { font: bold 37px/.9 var(--mono); letter-spacing: -3px; }.gallery-note { margin-top: 17px; color: #b8c2aa; }.gallery-note code { color: var(--lime); }.shot-grid { display: grid; grid-template-columns: 1.1fr .7fr .7fr; gap: 12px; margin-top: 24px; }.shot-grid figure { position: relative; min-height: 205px; margin: 0; overflow: hidden; background: linear-gradient(125deg, #ff3a9b, #d7ff00 48%, #151c15 49%); }.shot-grid img { display: block; width: 100%; height: 205px; object-fit: cover; color: #12130e; font: 11px var(--mono); }.shot-grid figcaption { position: absolute; bottom: 0; left: 0; padding: 7px 9px; background: #11130e; color: #eef1d4; font: 11px var(--mono); }@keyframes slide { to { transform: translateX(-45%); } }
@media (max-width: 700px) { .hero { display: block; padding: 39px 22px; }.hero h1 { font-size: 80px; }.hero-actions { flex-direction: column; align-items: flex-start; gap: 18px; }.carousel { margin-top: 40px; }.slides { height: 245px; }.slide figcaption span { display: none; }.section { margin: 0 14px; padding: 40px 0; }.intro-grid { grid-template-columns: 1fr; gap: 25px; }.download-strip { display: block; padding: 31px 22px; }.download-strip .download-button { margin-top: 24px; }.shot-grid { grid-template-columns: 1fr 1fr; }.shot-grid figure:first-child { grid-column: 1 / 3; }.shot-grid figure, .shot-grid img { min-height: 145px; height: 145px; } }