.index-layout { --page-width:1280px; --page-gutter:36px; }
.index-layout .site-header,.index-layout main,.index-layout footer { max-width:var(--page-width); padding-inline:var(--page-gutter); }
.home-directory { padding-bottom:32px; }
.index-intro { display:grid; grid-template-columns:1.25fr 1fr; align-items:center; gap:40px; padding:30px 0; }
.index-intro h1 { margin-top:9px; font-size:clamp(34px,3.5vw,48px); letter-spacing:-.045em; line-height:1.12; }
.index-intro h1 em { font-family:Georgia,serif; font-weight:400; }
.index-bio { max-width:480px; font-size:15px; line-height:1.75; }
.index-intro-links { display:flex; flex-wrap:wrap; gap:8px 24px; margin-top:13px; font:11px/1.6 var(--mono); }
.index-intro-links a { padding:5px 0; border-bottom:1px solid #555; }
.index-feature { border-block:1px solid var(--line); }
.feature-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; }
.feature-toolbar .eyebrow { font-size:10px; }
.feature-controls { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.feature-count { color:#aaa; font:11px/1.5 var(--mono); margin-right:10px; }
.feature-controls button { display:grid; place-items:center; padding:6px 9px; min-width:38px; min-height:38px; background:transparent; border:1px solid #44443e; color:#ddd; font:11px/1.4 var(--mono); cursor:pointer; }
.feature-controls [data-feature-pause] { min-width:60px; }
.feature-controls button:hover { background:#ffffff0a; color:#fff; }
.feature-controls button:focus-visible { outline:2px solid #dfdec0; outline-offset:3px; }
.feature-slides { display:grid; }
.feature-slide { grid-area:1 / 1; display:grid; grid-template-rows:auto 1fr; min-width:0; }
/* Reserve room for the longest title so automatic rotation never moves the directory. */
.feature-slide[hidden] { display:grid!important; visibility:hidden; pointer-events:none; }
.feature-media { display:grid; grid-template-columns:var(--feature-columns,1.35fr 1.18fr 1fr); height:clamp(270px,28vw,360px); gap:12px; min-width:0; }
[data-feature=sync-tank] { --feature-columns:1.777fr .753fr .753fr; --support-columns:1fr 1fr; }
[data-feature=iykyd] { --feature-columns:1.777fr 1.777fr .753fr; --support-columns:1.777fr .753fr; }
[data-feature=awear] { --feature-columns:1fr 1fr 1fr; }
[data-feature=solar] { --feature-columns:1.425fr .911fr .911fr; }
[data-feature=electric-drives] { --feature-columns:1.328fr 1.328fr 2.22fr; --support-columns:1.328fr 2.22fr; }
[data-feature=feedback-loop] { --feature-columns:1fr 1fr 1fr; }
.feature-tile { display:grid; grid-template-rows:minmax(0,1fr) auto; min-width:0; min-height:0; }
.feature-tile img,.feature-tile video,.feature-crop { display:block; width:100%; height:100%; min-height:0; min-width:0; object-fit:contain; }
.feature-caption { display:block; padding:8px 0 4px; font:10px/1.5 var(--mono); color:#aaa; }
.feature-copy { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); grid-template-areas:"label description" "title description" "link description"; align-content:start; gap:7px 40px; padding:20px 0 18px; }
.feature-copy .eyebrow { grid-area:label; color:#c7c6af; }
.feature-copy h2 { grid-area:title; font-size:clamp(25px,2.5vw,32px); line-height:1.15; margin:0; max-width:630px; }
.feature-copy>p:not(.eyebrow) { grid-area:description; align-self:start; padding-top:21px; font-size:15px; line-height:1.7; max-width:480px; }
.feature-link { grid-area:link; display:flex; align-items:center; gap:12px; width:fit-content; padding:5px 0; margin-top:3px; border-bottom:1px solid #626359; font-size:12px; color:#e5e4ce; }
.feature-link span { font-size:16px; }
.feature-progress { height:2px; background:#ffffff08; overflow:hidden; }
.feature-progress span { display:block; height:100%; background:#aead90; transform:scaleX(0); transform-origin:left; }
.feature-slide:not([hidden]) .feature-media { animation:feature-appear .3s ease-out; }
.index-content { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr); gap:40px; padding-top:30px; align-items:start; }
.index-section-heading { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:16px; }
.index-section-heading h2,.index-aside h2 { font-size:25px; line-height:1.2; letter-spacing:-.025em; margin-top:6px; }
.index-section-heading>a { font:11px/1.6 var(--mono); color:#bbb; border-bottom:1px solid #555; padding-block:5px; }
.index-projects { list-style:none; padding:0; margin:0; counter-reset:project; }
.index-projects li { counter-increment:project; border-bottom:1px solid var(--line); }
.index-projects li:first-child { border-top:1px solid var(--line); }
.index-projects a { display:grid; grid-template-columns:22px minmax(0,1fr) 16px; gap:10px; padding:15px 0; align-items:start; }
.index-projects a::before { content:counter(project,decimal-leading-zero); color:#999; font:10px/1.8 var(--mono); padding-top:3px; }
.index-projects h3 { font-size:18px; line-height:1.3; letter-spacing:-.02em; color:#eee; }
.index-projects p { margin-top:4px; font-size:13px; line-height:1.55; color:#aaa; }
.index-arrow { padding-top:3px; color:#999; font:16px/1.4 var(--mono); }
.home-directory a:hover { color:#fff; }
.index-projects a:hover h3 { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px; }
.home-directory a:focus-visible { outline:2px solid #dfdec0; outline-offset:4px; }
.index-field-notes figure { margin:16px 0 12px; }
.index-field-notes img { width:100%; height:auto; }
.index-field-notes figcaption { margin-top:7px; font:10px/1.6 var(--mono); }
.index-field-notes>p:not(.eyebrow) { font-size:13px; line-height:1.7; }
.index-field-links { display:flex; flex-wrap:wrap; justify-content:start; gap:4px 20px; margin-top:10px; }
.index-field-links a { font:11px/1.6 var(--mono); border-bottom:1px solid #555; padding:6px 0; }
.index-pages { display:block; margin-top:24px; border-top:1px solid var(--line); }
.index-pages a { display:grid; grid-template-columns:1fr auto; gap:2px 16px; padding:13px 0; border-bottom:1px solid var(--line); }
.index-pages strong { font-weight:500; font-size:15px; }
.index-pages small { grid-row:2; font-size:12px; color:#aaa; }
.index-pages span { grid-column:2; grid-row:1 / 3; align-self:center; }
@keyframes feature-appear { from { opacity:.5; } to { opacity:1; } }
@media(max-width:1050px) {
 .index-layout { --page-gutter:28px; }
 .index-intro,.feature-copy { column-gap:28px; }
 .index-intro h1 { font-size:36px; }
 .index-content { gap:28px; }
}
@media(max-width:800px) {
 .index-intro { grid-template-columns:1fr; gap:16px; padding-block:24px; }
 .index-bio { max-width:620px; }
 .index-content { grid-template-columns:1.4fr 1fr; gap:24px; }
 .feature-copy h2 { font-size:26px; }
 .feature-copy>p:not(.eyebrow) { font-size:14px; }
}
@media(max-width:700px) {
 .index-layout { --page-gutter:18px; }
 .index-intro h1 { font-size:35px; }
 .feature-media { grid-template-columns:var(--support-columns,minmax(0,1fr) minmax(0,1fr)); grid-template-rows:minmax(0,1.7fr) minmax(0,1fr); height:clamp(410px,123vw,535px); gap:10px; }
 .feature-tile:first-child { grid-column:1 / 3; }
 [data-feature=sync-tank] .feature-media { grid-template-rows:minmax(0,1fr) minmax(0,1.15fr); }
 .feature-caption { font-size:10px; padding-top:6px; }
 .feature-copy { grid-template-columns:1fr; grid-template-areas:"label" "title" "description" "link"; padding:17px 0; gap:8px; }
 .feature-copy h2 { font-size:27px; }
 .feature-copy>p:not(.eyebrow) { padding-top:0; max-width:600px; }
 .index-content { grid-template-columns:1fr; gap:28px; padding-top:24px; }
 .index-projects h3 { font-size:18px; }
 .index-section-heading h2 { font-size:23px; }
 .index-field-notes { padding-top:24px; border-top:1px solid var(--line); }
 .index-field-notes figure { max-width:580px; }
 .feature-toolbar { gap:8px; }
 .feature-toolbar .eyebrow { font-size:9px; }
 .feature-count { margin-right:3px; font-size:10px; }
 .feature-controls { gap:4px; }
 .feature-controls button { min-width:34px; }
 .feature-controls [data-feature-pause] { min-width:54px; }
}
@media(prefers-reduced-motion:reduce) { .feature-slide:not([hidden]) .feature-media { animation:none; } }
