@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#0a1119;--panel:#101c27;--panel2:#142330;--line:#263543;--text:#f0f4f6;--muted:#a0b0bf;--accent:#b5e46c;--cyan:#7ddfdb}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',Arial,sans-serif;font-size:15px}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.topbar{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(5%,calc((100% - 1300px)/2));gap:25px}.brand{display:flex;align-items:center;gap:22px}.brand-symbol{font:700 29px 'Space Grotesk';letter-spacing:-2px}.brand-symbol span,.period{color:var(--accent)}.brand-text{font-size:10px;letter-spacing:.22em;color:var(--muted);font-weight:700}.topbar nav{display:flex;gap:34px;font-size:13px;color:#c7d1d9}.topbar nav a:hover,.header-link:hover{color:var(--accent)}.header-link{font-size:13px;font-weight:700;color:var(--accent)}.hero{max-width:1300px;margin:auto;min-height:620px;padding:95px 5% 95px;display:grid;grid-template-columns:1.2fr .8fr;gap:20px;align-items:center}.eyebrow,.section-kicker{font-size:11px;font-weight:700;letter-spacing:.19em;color:var(--accent)}.pulse{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:9px;box-shadow:0 0 14px var(--accent)}h1,h2,h3{font-family:'Space Grotesk',Arial,sans-serif}h1{font-size:clamp(48px,5.4vw,82px);line-height:1.09;letter-spacing:-.065em;font-weight:600;margin:25px 0 25px}h1 em{font-style:normal;color:var(--accent)}.hero-description{max-width:555px;color:var(--muted);line-height:1.85;font-size:15px}.hero-actions{display:flex;gap:25px;align-items:center;margin-top:36px}.primary-btn{background:var(--accent);color:#101813;border-radius:6px;font-weight:700;font-size:13px;padding:17px 23px;display:inline-flex;gap:22px}.primary-btn:hover{filter:brightness(1.1)}.subtle-btn{font-weight:600;font-size:13px;color:#ccd8e2}.hero-side{height:400px;position:relative;display:flex;align-items:center;justify-content:center}.hero-orbit{height:340px;width:340px;position:relative}.orb{position:absolute;border:1px solid #36515b;border-radius:50%;inset:0}.orb.middle{inset:44px;border-style:dashed;border-color:#4b6870}.orb.inner{inset:99px;border-color:var(--accent);opacity:.6}.center-dot{position:absolute;inset:133px;background:#17302e;color:var(--accent);border:1px solid var(--accent);border-radius:50%;display:grid;place-items:center;font-size:37px}.orbit-label{position:absolute;background:#14242d;color:#a5cfca;border:1px solid #2d4850;padding:7px 11px;border-radius:3px;font:10px 'Space Grotesk';letter-spacing:.08em}.orbit-label.one{top:8px;right:-8px}.orbit-label.two{left:-20px;top:110px}.orbit-label.three{right:-60px;bottom:70px}.orbit-label.four{left:0;bottom:2px}.side-code{position:absolute;right:-6px;bottom:-10px;color:#4f7181;font:10px/2.1 monospace;letter-spacing:.14em}.proof{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr);padding:29px max(5%,calc((100% - 1300px)/2));gap:20px;background:#0d1923}.proof>div{border-right:1px solid var(--line);display:flex;flex-direction:column;gap:8px}.proof>div:last-child{border:0}.proof-number{font:600 31px 'Space Grotesk';color:var(--text)}.proof-label{color:var(--muted);font-size:12px;line-height:1.55}.work{padding:100px 5% 115px;max-width:1300px;margin:auto}.section-top{display:flex;align-items:end;justify-content:space-between;gap:20px}.section-top h2,.about h2{font-size:clamp(36px,4vw,55px);letter-spacing:-.05em;line-height:1.1;margin:20px 0}.section-top h2 span,.about h2 span{color:var(--accent)}.section-blurb{max-width:600px;color:var(--muted);line-height:1.8}.count{color:#72909e;font:11px monospace;white-space:nowrap}.filters{display:flex;flex-wrap:wrap;gap:10px;margin:40px 0 24px}.filter{border:1px solid #2d4150;background:transparent;color:#b6c4ce;border-radius:5px;padding:11px 16px;font-size:12px}.filter.active{background:#233e32;color:var(--accent);border-color:#486e45}.filter:hover{border-color:var(--accent)}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.project-card{border:1px solid var(--line);background:var(--panel);border-radius:9px;overflow:hidden;display:flex;flex-direction:column;min-width:0;transition:transform .2s,border-color .2s}.project-card:hover{transform:translateY(-3px);border-color:#5f7c70}.project-visual{height:185px;background:#0e2431;position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center}.project-visual img{width:100%;height:100%;object-fit:cover}.project-visual:before{content:'';position:absolute;inset:0;background:linear-gradient(130deg,transparent 50%,#4ce9bb0e),repeating-linear-gradient(90deg,transparent 0 35px,#ffffff07 36px 37px)}.v-mark{font:600 66px 'Space Grotesk';color:#b8ecc5;text-shadow:0 0 50px #85d6b657;letter-spacing:-.06em;z-index:1}.v-decoration{position:absolute;width:160px;height:160px;border:1px solid #73b5b443;border-radius:50%;transform:rotate(-30deg) scaleX(1.8)}.visual-tag{position:absolute;bottom:16px;left:19px;color:#87bcb7;font:10px monospace;letter-spacing:.15em}.card-content{padding:23px 23px 22px;display:flex;flex:1;flex-direction:column}.card-meta{display:flex;gap:10px;align-items:center;justify-content:space-between;color:#85b4bd;font:10px 'Space Grotesk';letter-spacing:.07em}.status{color:var(--accent);font-size:10px;white-space:nowrap}.card-content h3{font-size:21px;line-height:1.24;letter-spacing:-.04em;margin:17px 0 11px}.card-content p{color:var(--muted);font-size:13px;line-height:1.7;flex:1;margin:0 0 23px}.view-btn{border:0;background:none;color:var(--accent);text-align:left;padding:0;font-weight:700;font-size:12px}.view-btn:hover{text-decoration:underline}.about{padding:85px max(5%,calc((100% - 1300px)/2)) 110px;background:#0f1c25;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:70px}.about-copy>p{line-height:1.8;color:#afbfca;margin-top:0}.skill-pills{display:flex;flex-wrap:wrap;gap:8px;margin:25px 0}.skill-pills span,.detail-skills span{border:1px solid #38525b;background:#172933;color:#b8d7d9;border-radius:4px;font-size:11px;padding:8px 11px}.fine-print{font-size:11px!important;color:#8098a4!important;margin-top:28px!important}footer{display:flex;justify-content:space-between;gap:20px;padding:30px 5%;max-width:1300px;margin:auto;color:#7d94a2;font-size:12px}footer a{color:var(--accent)}dialog{position:fixed;border:1px solid #446070;border-radius:12px;color:var(--text);background:#11212d;width:min(720px,calc(100% - 26px));max-height:min(88vh,850px);padding:0;box-shadow:0 25px 100px #000b}dialog::backdrop{background:#02070bd9;backdrop-filter:blur(5px)}.close{position:absolute;right:15px;top:13px;color:white;background:#243a45;border:0;border-radius:50%;width:35px;height:35px;font-size:23px;z-index:2}.detail-top{padding:42px 42px 25px}.detail-category{color:var(--accent);letter-spacing:.16em;font-size:11px;font-weight:700}.detail-top h2{font-size:36px;line-height:1.14;letter-spacing:-.055em;margin:13px 0}.detail-description{color:#bbccd5;line-height:1.75}.detail-hero{height:210px;display:grid;place-items:center;background:#0c2832;overflow:hidden}.detail-hero img{width:100%;height:100%;object-fit:cover}.detail-body{padding:25px 42px 43px}.detail-body h4{color:var(--accent);font-size:12px;text-transform:uppercase;letter-spacing:.11em;margin:23px 0 10px}.detail-body p{line-height:1.75;color:#becbd2}.detail-skills{display:flex;gap:7px;flex-wrap:wrap}.detail-links{display:flex;flex-wrap:wrap;gap:11px;margin-top:25px}.detail-links a{background:var(--accent);color:#182018;padding:12px 18px;border-radius:5px;font-weight:700;font-size:12px}.detail-note{font-size:12px;color:#94aeba!important}.image-note{font-size:11px;color:#84a0ac;text-align:center;margin:10px 0 0}@media(max-width:980px){.hero{grid-template-columns:1fr;min-height:auto}.hero-side{display:none}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.proof{grid-template-columns:repeat(2,1fr)}.proof>div:nth-child(2){border:0}.about{grid-template-columns:1fr;gap:18px}}@media(max-width:620px){.topbar{height:72px}.brand-text,.topbar nav,.header-link{display:none}.hero{padding:72px 6%}.hero-description{font-size:14px}.hero-actions{flex-wrap:wrap}.proof{padding:23px 6%;gap:23px}.proof-number{font-size:25px}.work{padding:72px 6%}.section-top{align-items:start}.count{display:none}.project-grid{grid-template-columns:1fr}.filters{gap:8px}.filter{padding:9px 11px}.about{padding:65px 6%}.detail-top{padding:35px 22px 20px}.detail-body{padding:18px 22px 35px}.detail-top h2{font-size:29px}footer{flex-wrap:wrap;padding:25px 6%}}

/* Dedicated project pages */
.project-page{max-width:1130px;margin:0 auto;padding:58px 5% 100px}
.breadcrumb{display:flex;gap:10px;align-items:center;flex-wrap:wrap;color:#9db1bf;font-size:12px;margin-bottom:44px}.breadcrumb a{color:var(--accent)}
.project-heading{max-width:900px}.project-heading h1{font-size:clamp(38px,5vw,66px);margin:15px 0 18px}.project-heading .intro{font-size:17px;line-height:1.75;color:#b8c9d4;max-width:750px}
.project-labels{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 34px}.project-labels span{border:1px solid #37505c;border-radius:4px;padding:8px 12px;font-size:12px;color:#afcbd2}
.page-hero{position:relative;min-height:280px;background:#122b37;border:1px solid #34515d;border-radius:12px;overflow:hidden;display:grid;place-items:center;margin:30px 0 20px}.page-hero img{width:100%;max-height:580px;object-fit:contain}.page-hero .v-mark{font-size:100px}.page-hero .visual-tag{left:22px;bottom:18px}
.project-columns{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(220px,1fr);gap:55px;margin-top:50px}.project-columns h2,.gallery-section h2{font-size:25px;margin:0 0 14px;letter-spacing:-.03em}.project-columns p{color:#b6c7d0;line-height:1.9;margin:0 0 34px}.project-sidebar{border:1px solid var(--line);background:var(--panel);padding:23px;border-radius:9px;align-self:start}.project-sidebar h3{font-size:16px;margin:0 0 16px}.project-sidebar .detail-skills{margin-bottom:23px}.project-sidebar .detail-links{display:flex;flex-direction:column;margin-top:12px}.project-sidebar .detail-links a{display:block;text-align:center}.project-sidebar .detail-note{font-size:12px;line-height:1.65;color:#98abb7}.project-sidebar .no-demo{color:#95aeba;line-height:1.65;font-size:13px}
.gallery-section{margin-top:38px;padding-top:34px;border-top:1px solid var(--line)}.gallery-section p{color:#aabec8;line-height:1.75}.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:22px}.gallery-item{border:1px solid #36505a;background:#122330;border-radius:9px;overflow:hidden}.gallery-item img{display:block;width:100%;height:240px;object-fit:contain}.gallery-item figcaption{padding:12px;color:#a9bfc9;font-size:12px}.gallery-empty{border:1px dashed #4e6974;color:#9db6c0;padding:30px;border-radius:7px;background:#101f2b}.related-nav{display:flex;justify-content:space-between;gap:16px;margin-top:50px;border-top:1px solid var(--line);padding-top:26px}.related-nav a{color:var(--accent);font-weight:600;font-size:13px}
@media(max-width:720px){.project-page{padding:38px 6% 70px}.project-columns{grid-template-columns:1fr;gap:16px}.gallery-grid{grid-template-columns:1fr}.page-hero{min-height:200px}.related-nav{flex-wrap:wrap}}

/* Historical speed-test dashboard */
.speed-dashboard{margin:30px 0 62px;border:1px solid #335466;background:linear-gradient(165deg,#142733,#0d1924 65%);border-radius:14px;padding:28px;box-shadow:0 26px 60px #0003}.dash-head{display:flex;justify-content:space-between;gap:24px;align-items:center}.dash-head h2{font-size:clamp(28px,3vw,40px);letter-spacing:-.05em;margin:8px 0}.dash-head p:not(.section-kicker){color:#abbfc9;line-height:1.7;max-width:620px}.data-mark{font:11px/1.9 monospace;color:#95b3bd;letter-spacing:.07em;text-align:right;white-space:nowrap}.data-mark span{color:var(--accent)}.dash-toolbar,.chart-top,.detail-panel{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.dash-toolbar{margin:24px 0}.range-buttons,.metric-switch{display:flex;flex-wrap:wrap;gap:6px}.range-buttons button,.metric-switch button{border:1px solid #335260;background:#142b38;color:#bed0d9;border-radius:6px;padding:10px 12px;font-size:12px}.range-buttons button.chosen,.metric-switch button.chosen{background:#b5e46c;color:#122019;border-color:#b5e46c;font-weight:700}.date-label{display:flex;align-items:center;gap:8px;color:#acbdc6;font-size:12px}.date-label input,.date-label select{border:1px solid #3b5967;border-radius:5px;color:#eff8f6;background:#122733;padding:9px;max-width:170px}.metric-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0}.metric-card{background:#0b1a25;border:1px solid #2c4857;border-radius:10px;padding:17px;min-width:0}.metric-card span{font-size:11px;color:#98afbe;display:block}.metric-card strong{font:600 clamp(21px,2.8vw,34px) 'Space Grotesk',sans-serif;display:block;margin:9px 0 3px;letter-spacing:-.05em;overflow-wrap:anywhere}.metric-card small{font-size:11px;color:#90adba}.chart-panel{border:1px solid #2e4756;border-radius:11px;padding:22px;background:#0c1b27}.chart-top h3,.detail-panel h3{font-size:18px;margin:0 0 4px}.chart-top p,.detail-panel p{font-size:12px;color:#9ab2bf;line-height:1.6;margin:0}.chart-wrap{position:relative;margin-top:16px;overflow:hidden}.chart-wrap svg,.day-trend svg{width:100%;height:auto;display:block;overflow:visible}.chart-legend{display:flex;flex-wrap:wrap;gap:20px;color:#bed3d8;font-size:12px;margin:5px 8px}.legend-dot{display:inline-block;height:8px;width:8px;border-radius:50%;margin-right:7px}.chart-notes,.data-disclaimer{font-size:11px!important;color:#8faab5!important;line-height:1.75!important;margin:18px 0 0}.chart-tip{position:absolute;left:20px;top:20px;background:#182f3b;border:1px solid #547580;padding:10px 12px;border-radius:7px;pointer-events:none;font:12px/1.65 monospace;white-space:pre-line;max-width:250px;box-shadow:0 6px 20px #0008}.detail-panel{margin:30px 0 12px}.day-stats{display:flex;flex-wrap:wrap;gap:12px;color:#9fc1cb;font-size:12px;margin:14px 0}.day-stats strong{color:var(--accent)}.day-trend{background:#0c1b27;border:1px solid #2e4756;border-radius:10px;padding:18px}.dash-error{color:#ffb1ae;border:1px solid #8c5151;padding:12px;margin-top:12px;border-radius:5px}@media(max-width:790px){.metric-cards{grid-template-columns:repeat(2,1fr)}.dash-head{align-items:start}.data-mark{text-align:left}.speed-dashboard{padding:15px}.chart-panel{padding:12px}}@media(max-width:480px){.dash-head{flex-direction:column}.metric-card{padding:12px}.range-buttons button,.metric-switch button{padding:8px}}

/* Live HFC calculator embed */
.hfc-live{margin:30px 0 48px;border:1px solid #365666;border-radius:14px;padding:24px;background:linear-gradient(150deg,#142734,#0c1822)}
.hfc-live-heading{display:flex;justify-content:space-between;gap:25px;align-items:center;margin-bottom:18px}
.hfc-live-heading h2{font-size:clamp(25px,3vw,37px);margin:8px 0 10px}
.hfc-live-heading p:not(.section-kicker){margin:0;color:#b2c4cd;line-height:1.75;max-width:730px}
.hfc-external{background:var(--accent);color:#121f17;font-size:13px;font-weight:700;padding:13px 17px;border-radius:6px;white-space:nowrap}
.hfc-frame-wrap{border:1px solid #3d5968;border-radius:10px;overflow:hidden;background:#0d1725}
.hfc-frame-wrap iframe{display:block;width:100%;height:840px;border:0;background:#0b1220}
.hfc-embed-note{font-size:12px;color:#b1c4cd;line-height:1.7;margin:14px 0 0}.hfc-embed-note a{color:var(--accent);text-decoration:underline}
@media(max-width:780px){.hfc-live{padding:13px}.hfc-live-heading{align-items:start;flex-direction:column}.hfc-frame-wrap iframe{height:780px}}
