:root { --ink:#151a19; --paper:#f5f2eb; --lime:#c6ff00; --line:#c9c7bf; --soft:#e8e5dc; --mono:"DM Mono", monospace; --sans:"Manrope", sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); }
a { color:inherit; text-decoration:none; }
.site-header { height:76px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:0 clamp(1.25rem,5vw,5.5rem); }
.wordmark, .meta, .eyebrow, .label, .post-index, .post-date, .project-number, .project-status, footer, .hint { font-family:var(--mono); font-size:.69rem; letter-spacing:.05em; }
.wordmark { font-weight:500; font-size:.78rem; text-transform:uppercase; }
.mark { color:#2e672a; font-weight:700; font-size:1.2rem; }
nav { display:flex; gap:1.5rem; font-family:var(--mono); font-size:.72rem; }
nav a:hover, .text-link:hover { text-decoration:underline; text-underline-offset:4px; }
.hero { max-width:1200px; margin:0 auto; padding:clamp(5rem,12vw,10rem) clamp(1.25rem,5vw,5.5rem) clamp(5rem,11vw,9rem); }
.eyebrow { color:#42673d; margin:0 0 1.3rem; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(3rem,7.5vw,7.8rem); letter-spacing:-.075em; line-height:.94; max-width:1000px; margin-bottom:2.2rem; font-weight:800; }
h1 em { font-family:Georgia,serif; font-weight:400; letter-spacing:-.09em; }
.intro { font-size:clamp(1.05rem,1.8vw,1.35rem); line-height:1.6; max-width:590px; color:#4a504d; }
.hero-actions { display:flex; gap:.75rem; align-items:center; margin-top:2.2rem; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; gap:2.7rem; padding:.85rem 1rem; font-family:var(--mono); text-transform:uppercase; font-size:.7rem; letter-spacing:.04em; }
.button span { font-size:1rem; }
.primary { background:var(--ink); color:var(--paper); } .primary:hover { background:#315834; }
.quiet { border:1px solid var(--ink); } .quiet:hover { background:var(--soft); }
.hint { color:#767971; margin:1rem 0 0; } code { background:#e4e1d8; padding:.1rem .25rem; }
.currently { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:1.15rem clamp(1.25rem,5vw,5.5rem); display:flex; gap:3rem; align-items:center; }
.currently p { margin:0; } .label { min-width:155px; color:#42673d; } .currently p:last-child { font-size:clamp(.9rem,1.5vw,1.1rem); } .currently span { color:#74a800; margin:0 .45rem; }
.section { max-width:1200px; margin:auto; padding:clamp(4.5rem,8vw,7.5rem) clamp(1.25rem,5vw,5.5rem); }
.section-heading { display:flex; justify-content:space-between; gap:2rem; align-items:end; margin-bottom:3rem; }
h2 { font-size:clamp(2.25rem,4.4vw,4.5rem); line-height:1; letter-spacing:-.065em; margin:0; }
.text-link { font-family:var(--mono); font-size:.73rem; white-space:nowrap; } .text-link span { margin-left:.4rem; color:#42673d; }
.feature-post { display:grid; grid-template-columns:70px 1fr 120px; gap:1.5rem; border-top:2px solid var(--ink); border-bottom:1px solid var(--line); padding:1.7rem 0 2.2rem; }
.post-index,.post-date,.project-number,.project-status { color:#5e625c; }.post-body { max-width:700px; }.post-body h3,.note-card h3,.project h3 { font-size:clamp(1.5rem,3.1vw,2.65rem); letter-spacing:-.06em; line-height:1.08; margin:.5rem 0 .85rem; }.post-body p,.note-card p,.project-main>p { line-height:1.65; color:#575d58; }.post-date { text-align:right; line-height:1.6; }.post-date span { color:var(--ink); }
.note-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border-bottom:1px solid var(--line); }.note-card { background:var(--paper); padding:2rem 1.5rem 2.4rem; }.note-card h3 { font-size:1.45rem; }.note-card p { margin-bottom:0; font-size:.94rem; }
.projects { background:var(--ink); color:var(--paper); max-width:none; padding-left:max(1.25rem,calc((100vw - 1200px)/2 + 5.5rem)); padding-right:max(1.25rem,calc((100vw - 1200px)/2 + 5.5rem)); }.projects .eyebrow { color:var(--lime); }.section-aside { color:#b4bab1; font-family:var(--mono); font-size:.7rem; margin:0; }.project { display:grid; grid-template-columns:70px 1fr auto; gap:1.5rem; padding:2rem 0; border-top:1px solid #454c47; }.project:last-child { border-bottom:1px solid #454c47; }.project .meta { color:#b4bab1; }.project-main { max-width:700px; }.project-main>p { color:#c4c8c2; max-width:550px; }.project-status { color:var(--lime); white-space:nowrap; padding-top:.2rem; }.dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--lime); margin-right:.35rem; }.tags { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:1rem; }.tags span { border:1px solid #656d66; font: .62rem var(--mono); padding:.35rem .45rem; }.placeholder { opacity:.7; }
.about { display:grid; grid-template-columns:1fr 2fr; gap:2rem; }.about-copy h2 { max-width:630px; }.about-copy p { max-width:520px; font-size:1.1rem; line-height:1.6; color:#4d534e; margin:1.6rem 0 2rem; }
footer { border-top:1px solid var(--line); display:flex; justify-content:space-between; padding:1.5rem clamp(1.25rem,5vw,5.5rem); color:#5c615c; } footer p { margin:0; }
@media (max-width:650px) { .site-header { height:62px; } nav { gap:.9rem; font-size:.62rem; } .currently { display:block; } .currently .label { margin-bottom:.65rem; } .feature-post,.project { grid-template-columns:34px 1fr; } .post-date,.project-status { grid-column:2; text-align:left; padding-top:0; } .note-grid,.about { grid-template-columns:1fr; } .section-heading { align-items:start; flex-direction:column; } footer { display:block; line-height:1.8; } }

/* Contemporary dark portfolio treatment, inspired by the supplied reference. */
:root { --ink:#f5f8ff; --paper:#070b16; --lime:#91f2b6; --line:rgba(174,196,233,.18); --soft:#10192b; }
body { background:radial-gradient(circle at 78% 9%,#172945 0,transparent 29rem),radial-gradient(circle at 12% 42%,#112334 0,transparent 34rem),var(--paper); }
.site-header { position:sticky; top:0; z-index:3; background:rgba(7,11,22,.82); backdrop-filter:blur(16px); }
.mark,.eyebrow,.label,.text-link span { color:var(--lime); }.hero { position:relative; }.hero:after { content:"AWS · CLOUD · DEVOPS"; position:absolute; right:5%; top:21%; color:rgba(145,242,182,.24); font:500 .7rem var(--mono); letter-spacing:.18em; writing-mode:vertical-rl; }
h1 { text-shadow:0 0 55px rgba(102,167,255,.16); }.intro,.about-copy p { color:#b9c5da; }.primary { background:linear-gradient(100deg,var(--lime),#b6e8ff); color:#071017; font-weight:500; }.primary:hover { background:linear-gradient(100deg,var(--lime),#b6e8ff); box-shadow:0 0 30px rgba(145,242,182,.35); }.quiet { border-color:#607492; background:rgba(16,25,43,.6); }.hint { color:#8391a9; } code { background:#17243b; }
.currently { background:rgba(10,18,34,.55); }.currently .label { color:var(--lime); }.currently span { color:#a78bfa; }.text-link { color:#c7d3e7; }
.feature-post { border:1px solid var(--line); border-radius:18px; padding:1.7rem; background:linear-gradient(135deg,rgba(23,38,66,.8),rgba(11,18,33,.6)); box-shadow:0 20px 50px rgba(0,0,0,.12); }.post-index,.post-date,.project-number,.project-status { color:#95a7c2; }.post-body p,.note-card p,.project-main>p { color:#aebbd0; }
.note-grid { gap:1rem; margin-top:1rem; background:none; border:0; }.note-card { border:1px solid var(--line); border-radius:16px; background:rgba(16,25,43,.65); }.projects { background:linear-gradient(135deg,#0b1324,#101429 55%,#15112c); }.section-aside { color:#aebbd0; }.project { padding:2rem; border:1px solid var(--line); border-radius:18px; background:rgba(10,16,31,.68); margin-top:1rem; transition:transform .2s,border-color .2s; }.project:last-child { border-bottom:1px solid var(--line); }.project:hover { transform:translateY(-3px); border-color:rgba(145,242,182,.6); }.project .meta { color:#aebbd0; }.project-main>p { color:#c3cde0; }.project-status { color:var(--lime); }.dot { background:var(--lime); box-shadow:0 0 10px var(--lime); }.tags span { border-color:#4d6387; border-radius:99px; color:#d7e4fa; }
footer { color:#95a7c2; } @media (max-width:650px) { .hero:after { display:none; } }

/* Terminal-led home: black, white, and only a spectral edge highlight. */
.terminal-hero { min-height:760px; overflow:hidden; padding-top:5rem; background:#050505; isolation:isolate; }
.terminal-hero::after { display:none; }.network-lines { position:absolute; inset:0; z-index:-1; opacity:.56; background-image:radial-gradient(circle at 17% 18%,#777 1px,transparent 1.6px),radial-gradient(circle at 74% 30%,#777 1px,transparent 1.6px),linear-gradient(127deg,transparent 48%,rgba(255,255,255,.23) 49%,transparent 50%),linear-gradient(42deg,transparent 54%,rgba(255,255,255,.18) 55%,transparent 56%); background-size:31px 31px,43px 43px,410px 320px,370px 290px; mask-image:linear-gradient(to bottom,black 0%,rgba(0,0,0,.5) 70%,transparent); }
.terminal-hero .eyebrow { position:relative; color:#d6d6da; }.glitch-title { position:relative; font-family:var(--mono); font-size:clamp(3rem,8vw,7.4rem); letter-spacing:-.105em; white-space:nowrap; margin:3.4rem 0 4rem; color:#e9e9eb; text-shadow:2px 0 rgba(255,255,255,.34),-2px 0 rgba(115,198,255,.18); animation:scan 5s steps(2,end) infinite; }
.glitch-title::before { content:"DEVOPS & CLOUD"; position:absolute; inset:0; color:transparent; background:repeating-linear-gradient(0deg,rgba(255,255,255,.55) 0 1px,transparent 1px 5px); background-clip:text; -webkit-background-clip:text; transform:translate(3px,-2px); opacity:.55; }.terminal { width:min(660px,100%); margin-left:clamp(0rem,8vw,7rem); border:1px solid #27272c; border-radius:14px; overflow:hidden; background:rgba(7,7,8,.94); box-shadow:0 25px 80px rgba(0,0,0,.62),inset 0 1px rgba(255,255,255,.04); }.terminal-bar { display:flex; align-items:center; justify-content:center; min-height:42px; border-bottom:1px solid #29292e; color:#a3a3aa; font:500 .68rem var(--mono); position:relative; }.traffic { position:absolute; left:17px; display:flex; gap:8px; }.traffic i { width:12px; height:12px; border-radius:50%; background:#d84a4a; }.traffic i:nth-child(2){background:#cba619}.traffic i:nth-child(3){background:#24ad64}.terminal-content { min-height:320px; padding:1.75rem 1.45rem; font:500 clamp(.78rem,1.5vw,.98rem)/1.7 var(--mono); color:#e5e5e9; }.terminal-content p { min-height:1.7em; margin:0; }.terminal-content p:last-child::after { content:""; display:inline-block; width:.55em; height:1.05em; margin-left:4px; vertical-align:-.15em; background:#ddd; animation:blink .8s steps(2,end) infinite; }
@keyframes blink { 50%{opacity:0} } @keyframes scan { 0%,92%,100%{transform:translateX(0)}94%{transform:translateX(-1px)}96%{transform:translateX(1px)} }
@media (prefers-reduced-motion:reduce){.glitch-title,.terminal-content p:last-child::after{animation:none}}@media(max-width:650px){.terminal-hero{min-height:680px;padding-top:4rem}.glitch-title{font-size:clamp(2.35rem,12vw,3.8rem);margin:2.5rem 0 3rem}.terminal{margin-left:0}.terminal-content{min-height:340px;padding:1.25rem 1rem;font-size:.75rem}}

/* Faded Terraform/IaC earth reference: intentionally quiet behind the terminal. */
.terminal-hero::before { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background-image:linear-gradient(90deg,rgba(5,5,5,.86) 0%,rgba(5,5,5,.58) 48%,rgba(5,5,5,.95) 100%),linear-gradient(0deg,rgba(5,5,5,.9),transparent 48%,rgba(5,5,5,.66)),url("terraform-earth.png"); background-position:center,center,center 58%; background-size:cover,cover,cover; background-repeat:no-repeat; opacity:.46; filter:grayscale(.55) contrast(.8) brightness(.62); mask-image:linear-gradient(to bottom,transparent 0%,black 15%,black 74%,transparent 100%); }
.terminal-hero > * { position:relative; z-index:1; }.terminal-hero .network-lines { z-index:0; opacity:.34; }.terminal-hero .terminal { background:rgba(5,5,6,.9); }

.social-rail { position:fixed; left:max(1rem,calc((100vw - 1320px)/2)); top:50%; transform:translateY(-50%); z-index:5; display:grid; gap:.7rem; }.social-rail a { display:grid; place-items:center; width:42px; height:42px; border:1px solid rgba(255,255,255,.28); border-radius:50%; color:#e9e9ed; background:rgba(5,5,5,.62); backdrop-filter:blur(7px); font:500 .66rem var(--mono); transition:transform .2s,border-color .2s,background .2s; }.social-rail a:hover { transform:translateX(3px); border-color:#b899ff; background:linear-gradient(135deg,rgba(156,114,255,.42),rgba(255,158,207,.18)); }.contact-actions { display:flex; flex-wrap:wrap; gap:.75rem; }@media(max-width:900px){.social-rail{left:auto;right:1rem;top:auto;bottom:1rem;transform:none;display:flex}.social-rail a:hover{transform:translateY(-3px)}}

/* Stronger lower-left Terraform texture, plus independently pulsing starlight. */
.terminal-hero::before { background-position:center,center,left bottom; background-size:cover,cover,860px auto; opacity:.62; filter:grayscale(.38) contrast(.9) brightness(.75); mask-image:linear-gradient(to bottom,transparent 0%,black 12%,black 82%,transparent 100%); }
.network-lines::before,.network-lines::after { content:""; position:absolute; inset:0; pointer-events:none; background-repeat:repeat; mix-blend-mode:screen; }.network-lines::before { background-image:radial-gradient(circle,#fff 0 1px,transparent 1.7px),radial-gradient(circle,rgba(179,218,255,.85) 0 1.4px,transparent 2px),radial-gradient(circle,rgba(255,255,255,.75) 0 2px,transparent 3px); background-position:4px 9px,42px 26px,78px 62px; background-size:91px 103px,137px 151px,211px 229px; opacity:.2; animation:starPulse 5.5s ease-in-out infinite alternate; }.network-lines::after { background-image:radial-gradient(circle,rgba(184,213,255,.9) 0 1.5px,transparent 2.4px),radial-gradient(circle,#fff 0 1px,transparent 1.8px); background-position:18px 73px,64px 14px; background-size:173px 197px,113px 127px; opacity:.08; animation:starPulse 3.8s ease-in-out infinite alternate-reverse; }.network-lines { animation:none; }@keyframes starPulse { 0% { opacity:.06; filter:brightness(.65); } 50% { opacity:.3; filter:brightness(1.25); } 100% { opacity:.13; filter:brightness(.8); } }@media(prefers-reduced-motion:reduce){.network-lines::before,.network-lines::after{animation:none}}

/* Lighter terminal glyphs for a cleaner command-line feel. */
.terminal-content { font-family:"IBM Plex Mono",var(--mono); font-weight:300; letter-spacing:-.025em; color:#d7d7dd; }

/* Explicit visible Terraform image layer; anchored at the lower-left corner. */
.terminal-hero .terraform-visual { position:absolute; left:-2rem; bottom:-4rem; z-index:0; width:min(57vw,720px); height:min(61vw,680px); pointer-events:none; background:linear-gradient(90deg,rgba(5,5,5,.15),rgba(5,5,5,.82) 88%),linear-gradient(0deg,rgba(5,5,5,.85),transparent 58%),url("terraform-earth.png") left bottom/cover no-repeat; opacity:.78; filter:saturate(.78) contrast(1.04) brightness(.82); mask-image:radial-gradient(ellipse at 42% 70%,black 0 45%,transparent 75%); mix-blend-mode:screen; }.terminal-hero .network-lines { opacity:.68; }.network-lines::before { opacity:.48; }.network-lines::after { opacity:.28; }@media(max-width:650px){.terminal-hero .terraform-visual{width:108vw;height:82vw;left:-18vw;bottom:-1rem;opacity:.6}}

/* Override the original full-hero image layer; the visual now belongs only at lower left. */
.terminal-hero::before { display:none; }.terminal-hero .terraform-visual { left:-5rem; bottom:-5rem; width:min(50vw,640px); height:min(56vw,620px); z-index:0; opacity:.88; mix-blend-mode:normal; filter:saturate(.88) contrast(1.1) brightness(.88); mask-image:linear-gradient(90deg,black 0 48%,transparent 96%),linear-gradient(0deg,black 0 62%,transparent 100%); }
.starfield { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; background-image:radial-gradient(circle at 7% 14%,#fff 0 1.4px,transparent 2px),radial-gradient(circle at 19% 41%,#dbeeff 0 1px,transparent 1.8px),radial-gradient(circle at 32% 8%,#fff 0 1.5px,transparent 2.3px),radial-gradient(circle at 46% 29%,#b9ddff 0 1px,transparent 1.8px),radial-gradient(circle at 61% 12%,#fff 0 1.2px,transparent 2px),radial-gradient(circle at 74% 46%,#dcefff 0 1.6px,transparent 2.4px),radial-gradient(circle at 89% 18%,#fff 0 1px,transparent 1.8px),radial-gradient(circle at 93% 71%,#c7e6ff 0 1.4px,transparent 2.1px),radial-gradient(circle at 55% 79%,#fff 0 1px,transparent 1.8px),radial-gradient(circle at 28% 73%,#dcefff 0 1.4px,transparent 2.2px); animation:twinkle 3.6s ease-in-out infinite alternate; }.starfield::before,.starfield::after { content:""; position:absolute; inset:0; background-image:radial-gradient(circle,#fff 0 1px,transparent 1.8px); background-size:67px 83px; opacity:.28; animation:twinkle 2.5s ease-in-out infinite alternate-reverse; }.starfield::after { background-size:109px 127px; background-position:25px 31px; opacity:.18; animation-duration:4.7s; }@keyframes twinkle { 0%{opacity:.3;filter:brightness(.65)} 50%{opacity:.85;filter:brightness(1.7)} 100%{opacity:.45;filter:brightness(.9)} }@media(prefers-reduced-motion:reduce){.starfield,.starfield::before,.starfield::after{animation:none}}

/* Personal portfolio palette: monochrome canvas with controlled spectral accents. */
:root { --ink:#f8f8fa; --paper:#050505; --lime:#d7d7dd; --line:rgba(255,255,255,.15); --soft:#101014; }
body { background:#050505; color:var(--ink); }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.28; background-image:radial-gradient(rgba(255,255,255,.75) 1px,transparent 1px); background-size:31px 31px; mask-image:radial-gradient(ellipse at 50% 22%,black,transparent 68%); }
.site-header { background:rgba(5,5,5,.86); }.mark,.eyebrow,.label,.text-link span { color:#e8e8ec; }
.hero:after { color:rgba(255,255,255,.28); }.hero { background:radial-gradient(ellipse 48% 34% at 52% 43%,rgba(120,109,255,.11),transparent); }
h1 { text-shadow:none; }.intro,.about-copy p { color:#b6b6c0; }.currently { background:#08080a; }.currently span { color:#d5d5df; }
.primary { color:white; background:linear-gradient(102deg,#9c72ff 0%,#6e8fff 32%,#71d9ff 57%,#ff9ecf 100%); }.primary:hover { background:linear-gradient(102deg,#ab85ff,#80a0ff,#86e0ff,#ffaed7); box-shadow:0 0 28px rgba(149,117,255,.28); }.quiet { border-color:#4a4a54; background:#0d0d10; }
.feature-post,.note-card,.project { background:rgba(14,14,18,.86); border-color:rgba(255,255,255,.14); box-shadow:none; }.projects { background:#08080a; }.post-body p,.note-card p,.project-main>p { color:#b7b7c1; }.post-index,.post-date,.project-number,.project-status,.section-aside,footer { color:#9797a3; }.project:hover { border-color:#997aff; box-shadow:0 12px 40px rgba(130,104,255,.11); }.project-status { color:#d8d8e2; }.dot { background:#b59aff; box-shadow:0 0 10px #8c70ff; }.tags span { border-color:#4b4b58; color:#d8d8e2; }

.stack-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#09090b;padding:2rem clamp(1.25rem,5vw,5.5rem)}.stack-intro{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1.4rem}.stack-intro h2{font-size:clamp(1.2rem,2.1vw,1.7rem);letter-spacing:-.04em}.stack-grid{display:flex;flex-wrap:wrap;gap:.7rem}.stack-item{width:108px;min-height:100px;border:1px solid rgba(255,255,255,.15);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.55rem;background:#0d0d10;color:#e7e7ea;font:400 .65rem var(--mono);transition:transform .2s,border-color .2s}.stack-item:hover{transform:translateY(-3px);border-color:#9e84ff}.stack-item img{width:42px;height:42px;object-fit:contain}.tool-icon b{font:500 1.25rem var(--mono)}.terraform b{color:#9e7dff}.kubernetes b{color:#6aaeff;font-size:2.2rem;line-height:.75}@media(max-width:650px){.stack-intro{display:block}.stack-intro .label{margin-bottom:.7rem}.stack-item{width:calc(25% - .6rem);min-width:76px;min-height:86px}.stack-item img{width:34px;height:34px}}

/* Place visual layers against the viewport, not the centered hero column. */
.terminal-hero .terraform-visual { left:calc((1200px - 100vw)/2); bottom:-7rem; width:min(48vw,720px); height:min(62vw,760px); opacity:.78; mask-image:linear-gradient(90deg,black 0 55%,transparent 100%),linear-gradient(0deg,black 0 68%,transparent 100%); }

/* Real image element avoids cross-browser mask/background compositing issues. */
.terminal-hero .terraform-visual { background:none; mask-image:none; overflow:hidden; border-radius:0 52% 0 0; opacity:.62; }.terminal-hero .terraform-visual img { display:block; width:100%; height:100%; object-fit:cover; object-position:left bottom; filter:saturate(.8) brightness(.78) contrast(1.08); }.terminal-hero .terraform-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 24%,#050505 98%),linear-gradient(0deg,#050505 0%,transparent 52%); }

/* Final placement: use the supplied image as-is, visibly behind the terminal. */
.terminal-hero .terraform-visual { left:calc((1200px - 100vw)/2); bottom:0; width:min(52vw,820px); height:auto; overflow:visible; border-radius:0; opacity:.72; background:none!important; }.terminal-hero .terraform-visual img { width:100%; height:auto; object-fit:initial; object-position:initial; filter:saturate(.9) brightness(.9) contrast(1.05); }.terminal-hero .terraform-visual::after { display:none; }

/* True full-bleed background: image fills the hero, no square image container. */
.terminal-hero .terraform-visual { display:none; }.terminal-hero::before { display:block; left:calc((1200px - 100vw)/2); bottom:0; top:0; width:100vw; z-index:0; opacity:1; filter:none; mask-image:none; background-image:linear-gradient(90deg,rgba(5,5,5,.82) 0%,rgba(5,5,5,.48) 38%,rgba(5,5,5,.88) 82%),linear-gradient(0deg,rgba(5,5,5,.88) 0%,rgba(5,5,5,.12) 65%),url("terraform-earth.png"); background-size:cover,cover,cover; background-position:center,center,left bottom; background-repeat:no-repeat; }

/* Hero owns the full viewport; content remains aligned to the site grid. */
.terminal-hero { max-width:none; width:100%; margin:0; padding-left:max(1.25rem,calc((100vw - 1200px)/2 + 5.5rem)); padding-right:max(1.25rem,calc((100vw - 1200px)/2 + 5.5rem)); }.terminal-hero::before { left:0; width:100%; background-position:center,center,left bottom; }

/* Smaller, faded Terraform motif; preserve open space for the star field. */
.terminal-hero::before { opacity:.48; background-image:linear-gradient(90deg,rgba(5,5,5,.72) 0%,rgba(5,5,5,.48) 30%,rgba(5,5,5,.98) 66%),linear-gradient(0deg,rgba(5,5,5,.96) 0%,rgba(5,5,5,.22) 72%),url("terraform-earth.png"); background-size:100% 100%,100% 100%,min(46vw,920px) auto; background-position:center,center,left bottom; }
.starfield { left:calc((1200px - 100vw)/2); width:100vw; background:none; overflow:hidden; animation:none; }.starfield,.starfield::before,.starfield::after { width:2px; height:2px; border-radius:50%; background:#dff3ff; box-shadow:4vw 7vh #fff,11vw 23vh #aacfff,17vw 9vh #fff,22vw 42vh #e9f4ff,29vw 17vh #c3e1ff,35vw 56vh #fff,41vw 6vh #aecfff,48vw 34vh #fff,54vw 18vh #bddcff,59vw 61vh #fff,66vw 10vh #e7f3ff,72vw 48vh #a8d6ff,79vw 22vh #fff,84vw 67vh #cce8ff,91vw 13vh #fff,96vw 44vh #b8ddff; }.starfield::before,.starfield::after { content:""; position:absolute; inset:0; }.starfield { animation:starA 4.4s ease-in-out infinite alternate; }.starfield::before { background:#fff; box-shadow:8vw 37vh #fff,15vw 68vh #cce7ff,26vw 28vh #fff,33vw 73vh #b5dcff,43vw 23vh #fff,51vw 72vh #dcefff,63vw 39vh #fff,70vw 7vh #c2e2ff,76vw 58vh #fff,88vw 31vh #bce0ff,98vw 75vh #fff; animation:starB 6.7s ease-in-out -2.1s infinite alternate; }.starfield::after { background:#c8e8ff; box-shadow:2vw 53vh #fff,19vw 49vh #c2e2ff,31vw 4vh #fff,38vw 43vh #dbefff,47vw 65vh #fff,57vw 31vh #b9ddff,68vw 73vh #fff,74vw 27vh #d9efff,82vw 5vh #fff,94vw 59vh #c8e8ff; animation:starC 5.2s ease-in-out -3.5s infinite alternate; }@keyframes starA{from{opacity:.18;filter:brightness(.65)}to{opacity:.9;filter:brightness(1.9)}}@keyframes starB{from{opacity:.08;filter:brightness(.5)}to{opacity:.75;filter:brightness(1.6)}}@keyframes starC{from{opacity:.12;filter:brightness(.55)}to{opacity:1;filter:brightness(2)}}

/* Extra stars: uneven positions and a handful of brighter, larger points. */
.starfield { background-image:radial-gradient(circle at 6vw 15vh,#fff 0 1px,transparent 1.8px),radial-gradient(circle at 13vw 53vh,#b9dcff 0 1.6px,transparent 2.8px),radial-gradient(circle at 21vw 31vh,#fff 0 .8px,transparent 1.5px),radial-gradient(circle at 28vw 77vh,#d7ecff 0 1.3px,transparent 2.3px),radial-gradient(circle at 39vw 14vh,#fff 0 2px,transparent 3.3px),radial-gradient(circle at 46vw 49vh,#b7d9ff 0 1px,transparent 1.8px),radial-gradient(circle at 53vw 8vh,#fff 0 .8px,transparent 1.5px),radial-gradient(circle at 61vw 78vh,#e8f4ff 0 1.7px,transparent 2.8px),radial-gradient(circle at 69vw 26vh,#fff 0 1px,transparent 1.8px),radial-gradient(circle at 77vw 72vh,#b8dcff 0 1.2px,transparent 2.2px),radial-gradient(circle at 86vw 38vh,#fff 0 2px,transparent 3.2px),radial-gradient(circle at 93vw 82vh,#cfe8ff 0 .8px,transparent 1.5px); background-size:100% 100%; }
.starfield::before { background-image:radial-gradient(circle at 4vw 70vh,#fff 0 1.7px,transparent 2.8px),radial-gradient(circle at 18vw 6vh,#c2e3ff 0 .8px,transparent 1.5px),radial-gradient(circle at 25vw 61vh,#fff 0 1px,transparent 1.8px),radial-gradient(circle at 37vw 36vh,#d6edff 0 1.9px,transparent 3px),radial-gradient(circle at 49vw 86vh,#fff 0 .8px,transparent 1.5px),radial-gradient(circle at 58vw 44vh,#b9dcff 0 1.3px,transparent 2.4px),radial-gradient(circle at 73vw 15vh,#fff 0 1.5px,transparent 2.5px),radial-gradient(circle at 81vw 55vh,#d6ecff 0 1px,transparent 1.8px),radial-gradient(circle at 97vw 20vh,#fff 0 1.8px,transparent 3px); background-size:100% 100%; }
.starfield::after { background-image:radial-gradient(circle at 9vw 84vh,#d9efff 0 1px,transparent 1.8px),radial-gradient(circle at 16vw 40vh,#fff 0 1.9px,transparent 3px),radial-gradient(circle at 32vw 19vh,#c0e0ff 0 .8px,transparent 1.5px),radial-gradient(circle at 44vw 74vh,#fff 0 1.4px,transparent 2.4px),radial-gradient(circle at 56vw 55vh,#d4ecff 0 .8px,transparent 1.5px),radial-gradient(circle at 65vw 3vh,#fff 0 1.6px,transparent 2.6px),radial-gradient(circle at 78vw 41vh,#bcdfff 0 1px,transparent 1.8px),radial-gradient(circle at 89vw 8vh,#fff 0 1.4px,transparent 2.4px),radial-gradient(circle at 95vw 66vh,#d3eaff 0 1.9px,transparent 3px); background-size:100% 100%; }

/* Keep the social rail in the document flow rather than fixed over later sections. */
.social-rail { position:absolute; top:50%; transform:translateY(-50%); }
.stack-groups { display:grid; gap:1.5rem; }.stack-group .label { margin:0 0 .7rem; color:#a9a9b3; }.stack-group .stack-grid { margin:0; }
@media(max-width:900px){.social-rail{position:absolute;left:auto;right:1rem;top:auto;bottom:1rem;transform:none;display:flex}}

/* A post preview is one large link: touch anywhere on the card to open it. */
.post-card-link { color:inherit; text-decoration:none; cursor:pointer; transition:border-color .2s,transform .2s,background .2s; }
.note-card.post-card-link { display:block; }
.post-card-link:hover { border-color:#9e84ff; background:rgba(24,24,31,.94); transform:translateY(-2px); }
.post-card-link:focus-visible { outline:2px solid #8bbfff; outline-offset:4px; }

.project-link{cursor:pointer}.project-link:focus-visible{outline:2px solid #8bbfff;outline-offset:4px}.project-link:hover{border-color:#9e84ff;background:rgba(24,24,31,.94);transform:translateY(-2px)}.project-link .project-main h3::after{content:" ↗";font-size:.65em;color:#a88dff}
.project-link{position:relative}.project-overlay-link{position:absolute;inset:0;z-index:1;border-radius:inherit}.project-link .project-status{position:relative;z-index:2}

/* Project cards remain readable on the dark portfolio canvas. */
.projects{color:#f8f8fa}.project-link .project-main h3{color:#f8f8fa}.project-link .project-main h3::after{content:none}.project-overlay-link::after{content:"VIEW DETAILS ↗";position:absolute;right:1.7rem;bottom:1.25rem;color:#b79bff;font:500 .64rem var(--mono);letter-spacing:.06em}.project-link .project-status{color:#d8d8e2}@media(max-width:650px){.project-overlay-link::after{right:1rem;bottom:.8rem}}

/* Locally served brand marks keep the stack fast and CSP-safe. */
.stack-item img[src$="terraform-logo.png"]{object-fit:contain;filter:none}

/* Layer the planet above the star field: stars remain in the surrounding void only. */
.terminal-hero::before { z-index:1; }
.terminal-hero .starfield,.terminal-hero .network-lines { z-index:0; }
.terminal-hero > :not(.starfield):not(.network-lines):not(.terraform-visual) { z-index:2; }

/* Authenticated publishing desk. */

/* Keep the planet present on narrow screens without letting it overpower the content. */
@media(max-width:650px){
  .terminal-hero{min-height:900px;overflow:hidden}
  .terminal-hero .terraform-visual{
    display:block!important;position:absolute;z-index:1;pointer-events:none;
    left:-32vw;top:28%;bottom:auto;width:132vw;height:auto;opacity:.34;
    overflow:visible;mix-blend-mode:screen;mask-image:linear-gradient(90deg,black 0 68%,transparent 100%),linear-gradient(0deg,transparent 0%,black 25%,black 78%,transparent 100%);
  }
  .terminal-hero .terraform-visual img{display:block;width:100%;height:auto;filter:saturate(.72) brightness(.68) contrast(1.05)}
  .terminal-hero::before{
    display:block;left:0;top:0;right:0;bottom:0;width:100%;opacity:.62;
    background-image:linear-gradient(90deg,rgba(5,5,5,.82) 0%,rgba(5,5,5,.42) 46%,rgba(5,5,5,.9) 100%),linear-gradient(0deg,rgba(5,5,5,.94) 0%,rgba(5,5,5,.2) 58%,rgba(5,5,5,.68) 100%),url("terraform-earth.png");
    background-size:100% 100%,100% 100%,auto 58%;
    background-position:center,center,left 42%;
    background-repeat:no-repeat;
  }
}
.nav-button{background:transparent;border:0;color:inherit;font:inherit;cursor:pointer;padding:0}.editor-shell{max-width:980px}.editor-panel{margin-top:2.5rem;padding:1.5rem;border:1px solid rgba(255,255,255,.18);border-radius:1rem;background:rgba(8,8,12,.76)}.editor-panel label{display:grid;gap:.55rem;margin:1rem 0;font:700 .78rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.06em}.editor-panel input,.editor-panel textarea{width:100%;box-sizing:border-box;padding:.85rem;border:1px solid rgba(255,255,255,.2);border-radius:.35rem;color:#f8f9ff;background:#08080b;font:400 .95rem/1.6 var(--mono);text-transform:none;letter-spacing:normal;resize:vertical}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.editor-toolbar{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.editor-toolbar button{border:1px solid rgba(255,255,255,.25);padding:.5rem .65rem;color:#f8f9ff;background:#111119;font:700 .72rem var(--mono);cursor:pointer}.editor-actions{display:flex;gap:.7rem;margin-top:1.25rem}.editor-message{min-height:1.5rem;color:#aeefff;font:.85rem var(--mono)}.label-hint{color:#9ea5b4;font-weight:400;text-transform:none;letter-spacing:normal}.editor-preview{margin-top:2rem;padding:1.5rem;border:1px solid rgba(255,255,255,.12);border-radius:1rem}@media(max-width:640px){.editor-grid{grid-template-columns:1fr}}

/* Published field notes are intentionally more readable than the landing-page hero. */
.post-page{max-width:900px}.post-page>h1,.editor-preview>h1{font-size:clamp(1.9rem,3.6vw,3.35rem)!important;line-height:1.08;letter-spacing:-.05em;max-width:780px;margin-bottom:1.25rem}.post-page>h2,.editor-preview>h2{font-size:clamp(1.6rem,3vw,2.45rem);letter-spacing:-.045em;margin:2.7rem 0 1rem}.post-page>h3,.editor-preview>h3{font-size:1.3rem;margin:2rem 0 .8rem}.post-page>p,.editor-preview>p{max-width:760px;font-size:1.04rem;line-height:1.75;color:#c4c4ce}.post-page a,.editor-preview a{color:#cdbbff;text-decoration:underline;text-underline-offset:3px}.post-page img,.editor-preview img{display:block;max-width:100%;height:auto;border:1px solid rgba(255,255,255,.16);border-radius:.7rem}.media-block{margin:1.6rem 0}.media-block .file-download{display:inline-flex;gap:.55rem;align-items:center;padding:.75rem 1rem;border:1px solid rgba(205,187,255,.65);border-radius:.4rem;background:rgba(105,79,166,.12);font:600 .78rem var(--mono);text-decoration:none}.media-block .file-download:hover{background:rgba(148,113,255,.24)}.post-page blockquote,.editor-preview blockquote{margin:1.5rem 0;padding:.5rem 1rem;border-left:3px solid #a88dff;color:#d1d1dc}.post-page pre,.editor-preview pre{overflow:auto;padding:1rem;border:1px solid rgba(255,255,255,.15);border-radius:.6rem;background:#0a0a0d}.post-page li,.editor-preview li{margin:.45rem 0;color:#c4c4ce}