.slax-welcome { background:#f6f6f6; padding-block:56px 48px; }
.welcome-layout { display:grid; grid-template-columns:.95fr 1.25fr; gap:30px; align-items:center; }
.welcome-copy { max-width:550px; }
.welcome-logo { display:flex; align-items:center; gap:23px; margin:0px 0px 9px -14px; }
.welcome-logo>img:first-child { width:83px; height:auto; }
.welcome-logo>img:last-child { width:187px; height:auto; }
.welcome-copy h1 { font-size:32px; color:#737a7d; margin-bottom:25px; }
.welcome-copy>p { font-size:20px; line-height:1.75; margin-bottom:21px; color:#4f5a61; }
.welcome-actions { display:flex; align-items:center; flex-wrap:wrap; gap:15px; margin-top:30px; }
.welcome-copy .download-meta,.download-meta { display:flex; flex-wrap:wrap; gap:9px 18px; font-size:14px; line-height:1.7; color:#626b60; margin-top:20px; margin-bottom:0; }
.download-meta strong { font-weight:600; }
.download-meta a { text-decoration:underline; text-underline-offset:3px; }
.welcome-picture { display:block; min-width:0; width:100%; margin:0; }
.welcome-photo { display:block; width:100%; height:auto; border-radius:10px; box-shadow:0 16px 42px #3f321b14; }
/* Keep the panoramic photograph full width and the copy clear on its quiet left side. */
.welcome-wide { position:relative; isolation:isolate; display:flex; align-items:center; min-height:700px; overflow:hidden; background:#f6f6f6; }
.welcome-wide .welcome-layout { display:block; }
.welcome-wide .welcome-copy { position:relative; z-index:1; max-width:550px; }
.welcome-wide .welcome-picture { position:absolute; inset:0; z-index:-2; width:100%; height:100%; }
/* Keep the drive's focal point at the center of the viewport's right half. */
.welcome-wide .welcome-photo { position:absolute; left:75%; width:auto; min-width:100%; max-width:none; height:100%; transform:translateX(-70%); object-fit:cover; object-position:center; border-radius:0; box-shadow:none; }
.welcome-wide::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#f6f6f6 0%,#f6f6f6 38%,#f6f6f6c2 46%,#f6f6f633 57%,transparent 66%); }
.welcome-explore { display:inline-flex; align-items:center; gap:16px; color:#427d20; font-size:20px; margin-top:7px; text-decoration:underline; text-underline-offset:5px; }
.welcome-explore .icon { transform:rotate(90deg); }
.welcome-copy .welcome-release { font-size:14px; color:#697561; margin:18px 0 0; }
.features-intro { text-align:center; padding-block:75px 25px; }
.features-intro h2 { font-size:36px; margin-bottom:17px; }
.features-intro>p { font-size:20px; }
.slax-feature { padding-block:72px; background:#fff; }
.feature-wash { background:#f5f7f2; }
.partition-feature { background:#f0f6f9; }
.feature-layout { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr); align-items:center; gap:65px; }
.picture-first { grid-template-columns:minmax(0,1.4fr) minmax(0,.9fr); }
.picture-first .feature-copy { grid-column:2; grid-row:1; }
.picture-first .feature-picture { grid-column:1; grid-row:1; }
.feature-copy { min-width:0; }
.feature-art { display:block; width:96px; height:96px; object-fit:contain; margin-bottom:24px; }
.app-art { width:auto; height:96px; display:flex; align-items:center; gap:12px; }
.app-art img { width:78px; height:78px; }
.app-art img:nth-child(2) { width:90px; height:90px; }
.feature-copy h2 { font-size:36px; line-height:1.25; margin-bottom:24px; color:#474e51; }
.feature-copy p { font-size:20px; line-height:1.75; margin-bottom:20px; color:#525d63; }
.feature-copy code { background:#eaf2e2; color:#4d7139; font-size:16px; padding:2px 6px; border-radius:3px; }
.feature-link { display:inline-flex; align-items:center; gap:13px; color:#4c852a; font-size:16px; margin-top:9px; font-weight:600; }
.feature-link:hover { color:#2b6512; text-decoration:underline; text-underline-offset:4px; }
.feature-link .icon { width:20px; height:20px; }
kbd { font:16px/1.5 var(--body-font); padding:1px 6px; background:white; border:1px solid #d5ddd0; border-bottom-width:2px; border-radius:4px; white-space:nowrap; }
.feature-picture { min-width:0; margin:0; }
.feature-picture>a { display:block; background:#fff; border:1px solid #d8ded4; border-radius:8px; box-shadow:0 14px 35px #29391516; overflow:hidden; }
.feature-picture img { display:block; width:100%; height:auto; }
#slax-installer .feature-picture>a { border:0; border-radius:0; }
/* Extra black canvas fills the shared frame; the source image is never enlarged. */
.boot-scene>a { background:#000; }
.boot-canvas { display:grid; place-items:center; aspect-ratio:8/5; }
.boot-scene img { max-width:768px; }
.feature-picture figcaption { text-align:center; font-size:16px; line-height:1.65; color:#697662; margin-top:19px; padding-inline:12px; }
.slax-get { padding-block:75px 85px; background:#fff; }
.get-heading { text-align:center; margin-bottom:40px; }
.get-heading h2 { font-size:36px; margin-bottom:22px; }
.get-heading>p { font-size:20px; line-height:1.7; }
.slax-download { padding-block:64px; background:#f6f6f6; }
.download-layout { align-items:center; }
.download-content { grid-column:2/span 2; min-width:0; padding:32px; background:#fff; border:1px solid #e0e5dc; border-radius:12px; box-shadow:0 12px 32px #29391508; }
.download-art { display:flex; gap:12px; margin-bottom:22px; }
.download-art img { display:block; width:80px; height:auto; }
.download-heading { grid-column:1; margin:0; padding-right:24px; }
.download-version { display:block; margin-bottom:8px; color:#6c7963; font-size:14px; }
.download-version>span { margin-inline:5px; }
.download-heading h2 { font-size:32px; margin-bottom:16px; text-wrap:balance; }
.download-heading p { font-size:20px; line-height:1.65; }
.slax-devices,.download-layout { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.slax-device { position:relative; isolation:isolate; display:flex; flex-direction:column; min-height:550px; padding:30px; border:1px solid #e2e5de; border-radius:10px; overflow:hidden; background:#fff; color:var(--muted); text-align:center; cursor:default; box-shadow:0 10px 35px #2734231a; transition:color .2s,border-color .2s; }
.slax-device::before { content:''; position:absolute; inset:0; z-index:-1; background:#60cc19 url('/images/new/Highlight-download-section-with-green-BG.png') center/100% 100% no-repeat; opacity:0; transition:opacity .2s; }
.slax-device h3 { font-size:32px; margin-bottom:8px; }
.slax-device header>p { font-size:16px; color:inherit; }
.device-details { display:flex; flex-direction:column; flex:1; gap:24px; margin-block:28px; }
.device-details>img { display:block; width:100%; height:240px; object-fit:contain; transition:opacity .2s; }
.device-details>img[src$="kingston-ironkey-64gb.webp"] { object-fit:cover; }
.device-info { display:flex; flex-direction:column; justify-content:space-between; gap:24px; text-align:left; transition:opacity .2s; }
.device-info>p { font-size:16px; line-height:1.75; color:inherit; }
.device-info form { text-align:center; }
.device-info .button { min-width:185px; background:#fff; color:var(--ink); border-color:#556369; }
.device-price { display:flex; align-items:baseline; justify-content:center; gap:6px; margin-top:auto; color:inherit; }
.device-price strong { font:500 48px/1.2 var(--heading-font); }
.device-price>span { font-size:14px; }
/* Match the original cards on pointer devices; touch users see the details and order button immediately. */
@media (hover:hover) and (pointer:fine) {
    .device-details { display:grid; gap:0; align-items:center; }
    .device-details>img,.device-info { grid-area:1/1; }
    .device-info { align-self:stretch; opacity:0; pointer-events:none; }
    .device-info>p { margin:12px 20px 24px; font-size:23px; line-height:1.5; }
    .slax-device:is(:hover,:focus-within) { color:#fff; border-color:transparent; }
    .slax-device:is(:hover,:focus-within)::before { opacity:1; }
    .slax-device:is(:hover,:focus-within) .device-details>img { opacity:0; }
    .slax-device:is(:hover,:focus-within) .device-info { opacity:1; pointer-events:auto; }
}
.get-footnote { text-align:center; font-size:16px; margin:28px auto 0; }
.get-footnote a { color:#477c29; text-decoration:underline; text-underline-offset:3px; }
.slax-email-form { margin:0; }
.slax-email-form>label { display:block; font-size:16px; margin-bottom:8px; }
.slax-email-form>div { display:flex; gap:12px; }
.slax-email-form input { flex:1; width:100%; min-width:0; min-height:56px; border:1px solid #aebba4; border-radius:6px; padding:12px 16px; font-size:20px; line-height:1.5; background:white; color:var(--ink); }
.slax-email-form button { flex-shrink:0; min-height:56px; white-space:nowrap; }
.download-email-note { display:grid; font-size:14px; line-height:1.65; margin-top:14px; }
.download-email-note>span { grid-area:1/1; }
.download-email-note a { color:#477c29; text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }
.email-pending { display:flex; align-self:start; align-items:center; gap:7px; }
.email-pending .icon { display:none; width:1em; height:1em; flex:none; animation:email-spin .8s linear infinite; }
.slax-email-form:has(button:disabled) #download-email-note { visibility:hidden; }
.slax-email-form:has(button:disabled) .email-pending .icon { display:block; }
@keyframes email-spin { to { transform:rotate(1turn); } }
.email-status { font-size:16px; margin-top:18px; }
.email-status:empty { display:none; }
.email-status a { color:#477c29; text-decoration:underline; }
.email-confirmation { display:grid; grid-template-columns:48px minmax(0,1fr); column-gap:18px; align-content:center; min-height:154px; }
.email-confirmation-icon { display:grid; place-items:center; grid-row:1/span 3; width:48px; height:48px; border-radius:50%; background:#e7f3dd; color:var(--green-deep); }
.email-confirmation-icon .icon { width:28px; height:28px; }
.email-confirmation h3 { font-size:24px; margin-bottom:8px; }
.email-confirmation-recipient { grid-column:2; font-size:16px; font-weight:600; overflow-wrap:anywhere; }
.email-confirmation-message { grid-column:2; margin-top:8px; font-size:16px; line-height:1.65; }
.email-confirmation-message a { color:var(--green-deep); text-decoration:underline; text-underline-offset:3px; }
.direct-download { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:20px; padding-top:18px; border-top:1px solid var(--line); }
.direct-download>a { display:inline-flex; align-items:center; gap:10px; font-size:16px; color:#477c29; }
.direct-download>a:hover { text-decoration:underline; text-underline-offset:4px; }
.direct-download .icon { width:20px; height:20px; }
.direct-download>.download-checksum { color:var(--muted); font-size:14px; text-decoration:underline; text-underline-offset:3px; }
@media (min-width:1500px) { .slax-welcome { padding-block:80px 65px; } }
@media (min-width:1101px) { .slax-device>header { min-height:96px; } }
@media (max-width:1150px) {
    .welcome-layout { gap:15px; grid-template-columns:1fr 1.1fr; }
    .welcome-copy h1 { font-size:28px; }
    .welcome-copy>p { font-size:20px; }
    .welcome-actions { gap:12px; }
    .welcome-actions .button { padding-inline:16px; }
    .feature-layout { gap:38px; grid-template-columns:1fr 1.2fr; }
    .picture-first { grid-template-columns:1.2fr 1fr; }
    .feature-copy h2 { font-size:32px; }
    .feature-copy p { font-size:20px; }
}
@media (max-width:1100px) {
    .slax-welcome { padding-block:40px; }
    .welcome-layout { grid-template-columns:1fr; justify-items:center; gap:35px; }
    .welcome-copy { max-width:780px; }
    .welcome-picture { width:min(880px,100%); }
    .welcome-wide { display:block; min-height:0; padding-bottom:80px; }
    .welcome-wide .welcome-layout { display:flex; flex-direction:column; gap:30px; }
    .welcome-wide .welcome-copy { width:100%; max-width:780px; }
    .welcome-wide .welcome-picture { position:static; width:100%; height:auto; aspect-ratio:2148/1312; z-index:auto; }
    .welcome-wide .welcome-photo { position:static; width:100%; min-width:0; transform:none; border-radius:10px; }
    .welcome-wide::after { display:none; }
    .welcome-logo>img:first-child { width:72px; }
    .welcome-logo>img:last-child { width:170px; }
    .welcome-copy h1 { font-size:32px; }
    .features-intro { padding-top:55px; }
    .feature-layout,.picture-first { grid-template-columns:1fr; gap:35px; }
    .picture-first .feature-copy,.picture-first .feature-picture { grid-column:auto; grid-row:auto; }
    .feature-copy { max-width:740px; }
    .feature-copy h2 { font-size:36px; }
    .feature-picture { width:100%; max-width:850px; justify-self:center; }
    .slax-feature { padding-block:55px; }
    .slax-devices,.download-layout { grid-template-columns:1fr; }
    .slax-device { max-width:480px; width:100%; justify-self:center; }
    .download-heading { grid-column:auto; display:grid; grid-template-columns:max-content minmax(0,1fr); column-gap:24px; padding:0; }
    .download-art { grid-row:1/span 3; align-self:center; margin:0; }
    .download-heading>.download-version,.download-heading>h2,.download-heading>p { grid-column:2; }
    .download-content { grid-column:auto; }
}
@media (max-width:700px) {
    .slax-email-form>div { flex-direction:column; }
    .slax-email-form button { align-self:stretch; }
}
@media (max-width:600px) {
    .slax-welcome { padding-block:30px; }
    .welcome-wide { padding-bottom:60px; }
    .welcome-layout { gap:30px; }
    .welcome-logo { gap:19px; }
    .welcome-logo>img:first-child { width:65px; }
    .welcome-logo>img:last-child { width:150px; }
    .welcome-copy h1 { font-size:26px; margin-bottom:22px; }
    .welcome-copy>p { font-size:20px; line-height:1.7; }
    .welcome-actions { gap:12px; margin-top:25px; }
    .welcome-actions>.button { width:100%; justify-content:space-between; padding-inline:20px; }
    .welcome-copy .download-meta { font-size:14px; gap:6px 14px; margin-top:18px; }
    .features-intro { padding-block:38px 10px; text-align:left; }
    .features-intro h2 { font-size:32px; }
    .features-intro>p { font-size:20px; }
    .slax-feature { padding-block:42px; }
    .feature-layout { gap:28px; }
    .feature-art { width:82px; height:82px; margin-bottom:22px; }
    .app-art { width:auto; gap:10px; }
    .app-art img { width:65px; height:65px; }
    .app-art img:nth-child(2) { width:78px; height:78px; }
    .feature-copy h2 { font-size:30px; margin-bottom:20px; }
    .feature-copy p { font-size:20px; line-height:1.7; }
    .feature-picture figcaption { font-size:16px; padding-inline:0; margin-top:15px; }
    .slax-get { padding-block:45px 50px; }
    .slax-download { padding-block:36px; }
    .get-heading { text-align:left; margin-bottom:30px; }
    .get-heading h2 { font-size:32px; }
    .download-layout { gap:26px; }
    .download-content { padding:25px 22px; }
    .download-heading { display:block; }
    .download-art { margin-bottom:16px; }
    .download-art img { width:64px; }
    .download-heading>h2 { font-size:30px; }
    .direct-download { flex-direction:column; align-items:flex-start; gap:14px; margin-top:22px; }
    .slax-device { padding:25px; }
    .device-details>img { height:220px; }
    .slax-email-form button { white-space:normal; }
}
