:root {
  color-scheme: light;
  --paper: #f0eee5;
  --paper-bright: #fbfaf5;
  --ink: #172737;
  --ink-soft: #52606a;
  --ink-faint: #5f6c74;
  --line: rgba(23, 39, 55, .18);
  --line-strong: rgba(23, 39, 55, .38);
  --night: #142433;
  --on-dark: #fbfaf5;
  --on-dark-muted: #c3d0d2;
  --signal: #e45e43;
  --signal-deep: #b8422d;
  --mint: #7daecb;
  --sun: #edca71;
  --focus: #095b81;
  --shell: min(1240px, calc(100% - 48px));
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-portfolio-theme="dark"] {
  color-scheme: dark;
  --paper: #050d15;
  --paper-bright: #091722;
  --ink: #f4fffa;
  --ink-soft: #bfd6d7;
  --ink-faint: #75a4ac;
  --line: rgba(60, 232, 194, .22);
  --line-strong: rgba(85, 242, 205, .48);
  --night: #02070c;
  --on-dark: #f5fffb;
  --on-dark-muted: #bedbd7;
  --signal: #ff604b;
  --signal-deep: #ff9a83;
  --mint: #27e0bc;
  --sun: #ffd166;
  --focus: #5cecff;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--paper); }
body { min-width: 320px; margin: 0; background: var(--paper); color: var(--ink); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: rgba(228, 94, 67, .18); touch-action: manipulation; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }
[id] { scroll-margin-top: 132px; }
.portfolio-icon { width: 1em; height: 1em; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.portfolio-shell { width: var(--shell); margin: 0 auto; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); margin: -1px; border: 0; padding: 0; white-space: nowrap; }

.portfolio-skip-link { position: fixed; z-index: 100; top: 12px; left: 12px; padding: 11px 15px; background: var(--signal); color: #fff; font-weight: 850; transform: translateY(-170%); }
.portfolio-skip-link:focus { transform: translateY(0); }

.public-nav { position: sticky; z-index: 30; top: 0; display: flex; min-height: 74px; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); padding: 11px max(24px, calc((100% - 1240px) / 2)); background: var(--paper); }
.public-brand { display: inline-flex; min-width: 0; align-items: center; gap: 11px; }
.public-brand > span:first-child { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border: 1px solid var(--ink); background: var(--night); color: var(--on-dark); font-size: 10px; font-weight: 900; letter-spacing: .1em; }
.public-brand-copy { display: grid; min-width: 0; gap: 1px; }
.public-brand-copy strong { font-size: 13px; letter-spacing: -.025em; }
.public-brand-copy small { overflow: hidden; color: var(--ink-soft); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.public-links { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.nav-contact-link, .panel-link { display: inline-flex; min-height: 40px; align-items: center; gap: 7px; border: 1px solid transparent; padding: 0 12px; font-size: 12px; font-weight: 830; letter-spacing: .015em; transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease; }
.nav-contact-link { color: var(--ink-soft); }
.panel-link { border-color: var(--ink); background: var(--ink); color: var(--paper-bright); }
.nav-contact-link:hover { border-color: var(--line-strong); background: rgba(255, 255, 255, .5); color: var(--signal-deep); }
.panel-link:hover { background: var(--signal); border-color: var(--signal); transform: translateY(-1px); }

.portfolio-index { position: sticky; z-index: 20; top: 74px; display: flex; width: 100%; overflow-x: auto; align-items: center; gap: 2px; border-bottom: 1px solid var(--line); padding: 8px max(24px, calc((100% - 1240px) / 2)); background: var(--paper-bright); scrollbar-width: none; }
.portfolio-index::-webkit-scrollbar { display: none; }
.portfolio-index a, .portfolio-index button { display: inline-flex; min-height: 42px; flex: 0 0 auto; align-items: center; gap: 7px; border: 1px solid transparent; padding: 0 9px; background: transparent; color: var(--ink-faint); cursor: pointer; font-size: 11px; font-weight: 800; letter-spacing: .02em; transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease; }
.portfolio-index span { color: var(--signal); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 9px; font-weight: 800; }
.portfolio-index a:hover, .portfolio-index a:focus-visible, .portfolio-index button:hover, .portfolio-index button:focus-visible, .portfolio-index a[aria-current="location"], .portfolio-index button[aria-expanded="true"] { border-color: var(--line-strong); background: #fffdf7; color: var(--ink); transform: translateY(-1px); }

.portfolio-utility { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--line-strong); padding: 0 13px; background: var(--night); color: var(--on-dark); box-shadow: 4px 4px 0 rgba(23, 39, 55, .24); cursor: pointer; font-size: 11px; font-weight: 860; letter-spacing: .025em; transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease; }
.portfolio-utility .portfolio-icon { width: 16px; height: 16px; }
.portfolio-utility:hover { border-color: var(--mint); background: var(--night); color: var(--mint); box-shadow: 6px 6px 0 rgba(23, 39, 55, .28); transform: translate(-2px, -2px); }
.portfolio-utility[aria-pressed="true"] { border-color: var(--mint); color: var(--mint); }
.portfolio-utilities { position: fixed; z-index: 35; right: max(18px, calc((100vw - 1320px) / 2)); bottom: max(18px, env(safe-area-inset-bottom)); }
.scroll-top-button { width: 46px; min-height: 46px; padding: 0; border-radius: 50%; }
.scroll-top-button[hidden] { display: none; }
.scroll-top-button:not([hidden]) { animation: utility-in .22s cubic-bezier(.16, 1, .3, 1); }
.theme-toggle-icon { display: inline-grid; place-items: center; }
.theme-toggle-icon > span { display: inline-flex; }
.theme-toggle-icon [data-theme-icon="light"] { display: none; }
html[data-portfolio-theme="dark"] .theme-toggle-icon [data-theme-icon="dark"] { display: none; }
html[data-portfolio-theme="dark"] .theme-toggle-icon [data-theme-icon="light"] { display: inline-flex; }

html[data-portfolio-theme="dark"] .nav-contact-link:hover { background: rgba(237, 245, 242, .09); }
html[data-portfolio-theme="dark"] .portfolio-index a:hover, html[data-portfolio-theme="dark"] .portfolio-index a:focus-visible, html[data-portfolio-theme="dark"] .portfolio-index button:hover, html[data-portfolio-theme="dark"] .portfolio-index button:focus-visible, html[data-portfolio-theme="dark"] .portfolio-index a[aria-current="location"], html[data-portfolio-theme="dark"] .portfolio-index button[aria-expanded="true"] { background: #1d3240; }
html[data-portfolio-theme="dark"] .portfolio-button.secondary { background: rgba(237, 245, 242, .06); }
html[data-portfolio-theme="dark"] .case-sheet { background: #182b37; }
html[data-portfolio-theme="dark"] .case-sheet:hover { background: #203744; }
html[data-portfolio-theme="dark"] .accent-sheet { background: #223943; }
html[data-portfolio-theme="dark"] .service-plate:hover { background: #264b44; color: var(--on-dark); }
html[data-portfolio-theme="dark"] .service-plate:hover > p { color: var(--on-dark-muted); }
html[data-portfolio-theme="dark"] .service-plate:hover .service-number { color: #bad2cf; }
html[data-portfolio-theme="dark"] .portfolio-utility { box-shadow: 4px 4px 0 rgba(0, 0, 0, .42); }
html[data-portfolio-theme="dark"] .portfolio-utility:hover { box-shadow: 6px 6px 0 rgba(0, 0, 0, .48); }

.portfolio-main { overflow: clip; }
.portfolio-hero { position: relative; isolation: isolate; overflow: hidden; border-bottom: 1px solid var(--line); }
.hero-layout { display: grid; min-height: min(650px, calc(100svh - 122px)); grid-template-columns: minmax(0, 1.18fr) minmax(280px, .62fr); align-items: center; gap: clamp(32px, 5vw, 76px); padding-top: clamp(42px, 6vh, 66px); padding-bottom: clamp(40px, 6vh, 60px); }
.hero-copy { max-width: 780px; align-self: center; }
.hero-eyebrow, .section-kicker { display: flex; align-items: center; gap: 9px; margin: 0; color: var(--signal-deep); font-size: 11px; font-weight: 900; letter-spacing: .1em; line-height: 1.45; text-transform: uppercase; }
.hero-eyebrow i { display: inline-block; width: 22px; height: 1px; background: currentColor; opacity: .55; }
.status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 4px rgba(228, 94, 67, .14); }
.hero-copy h1 { max-width: 790px; margin: 18px 0 0; font-size: clamp(53px, 6.7vw, 96px); font-weight: 760; letter-spacing: -.085em; line-height: .92; text-wrap: balance; }
.hero-copy h1 em { font-family: Georgia, "Times New Roman", serif; font-weight: 400; letter-spacing: -.1em; }
.hero-intro { max-width: 630px; margin: 24px 0 0; color: var(--ink-soft); font-size: clamp(17px, 1.5vw, 20px); line-height: 1.58; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 26px; }
.portfolio-button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 10px; border: 1px solid var(--ink); padding: 0 16px; background: transparent; color: var(--ink); cursor: pointer; font-size: 13px; font-weight: 840; transition: border-color .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease; }
.portfolio-button.primary { border-color: var(--signal); background: var(--signal); color: var(--night); }
.portfolio-button.secondary { background: rgba(251, 250, 245, .74); }
.portfolio-button.text-button { border-color: transparent; padding-right: 5px; color: var(--ink-soft); }
.portfolio-button.cv-button { position: relative; overflow: hidden; border-color: var(--ink); background: var(--paper-bright); box-shadow: 4px 4px 0 var(--mint); color: var(--ink); }
.portfolio-button.cv-button::before { position: absolute; inset: 0; content: ""; background: linear-gradient(115deg, transparent 26%, color-mix(in srgb, var(--mint) 72%, transparent) 50%, transparent 74%); opacity: .42; transform: translateX(-120%); transition: transform .45s cubic-bezier(.16, 1, .3, 1); }
.portfolio-button.cv-button > * { position: relative; }
.portfolio-button .portfolio-icon { width: 17px; height: 17px; }
.portfolio-button:hover { transform: translateY(-2px); }
.portfolio-button.primary:hover { border-color: var(--signal); background: var(--signal); box-shadow: 0 9px 0 rgba(23, 39, 55, .16); }
.portfolio-button.secondary:hover, .portfolio-button.text-button:hover { border-color: var(--ink); background: var(--ink); color: var(--paper-bright); }
.portfolio-button.text-button:hover { box-shadow: none; }
.portfolio-button.cv-button:hover { border-color: var(--night); background: var(--night); box-shadow: 7px 7px 0 var(--signal); color: var(--on-dark); }
.portfolio-button.cv-button:hover::before { transform: translateX(120%); }

.hero-field-notes { position: relative; align-self: center; border: 1px solid var(--ink); padding: 20px; background: var(--night); color: var(--on-dark); box-shadow: 8px 8px 0 var(--signal); }
.field-note-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid rgba(255, 255, 255, .25); padding-bottom: 15px; color: var(--mint); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.field-note-head b { color: var(--sun); font-weight: 800; }
.hero-field-notes dl { margin: 0; }
.hero-field-notes dl > div { display: grid; grid-template-columns: 94px 1fr; gap: 12px; border-bottom: 1px solid rgba(255, 255, 255, .15); padding: 14px 0; }
.hero-field-notes dt { display: flex; align-items: flex-start; gap: 7px; color: var(--mint); font-size: 12px; font-weight: 850; }
.hero-field-notes dt .portfolio-icon { width: 15px; height: 15px; }
.hero-field-notes dd { margin: 0; color: #d6e0e0; font-size: 13px; line-height: 1.48; }
.field-note-foot { margin: 14px 0 0; color: #aab9be; font-size: 12px; font-style: italic; line-height: 1.5; }
.hero-signal { position: relative; display: grid; width: var(--shell); grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 10px; margin: 0 auto; padding: 10px 0 14px; color: var(--ink-faint); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hero-signal span { display: block; height: 1px; background: var(--line-strong); }
.hero-signal span:first-child { grid-column: 1; }
.hero-signal span:nth-child(2) { grid-column: 3; }
.hero-signal span:nth-child(3) { grid-column: 5; }
.hero-signal b { position: absolute; font-weight: 800; }
.hero-signal b:nth-of-type(1) { grid-column: 1; justify-self: start; transform: translateY(-10px); }
.hero-signal b:nth-of-type(2) { grid-column: 3; justify-self: center; transform: translateY(-10px); }
.hero-signal b:nth-of-type(3) { grid-column: 5; justify-self: end; transform: translateY(-10px); }

.services-section, .projects-section, .kit-section, .method-section, .contact-section { position: relative; padding: clamp(64px, 7vw, 108px) 0; }
.services-section { background: var(--paper); }
.method-section { background: var(--night); color: var(--on-dark); }
.projects-section { border-top: 1px solid var(--line); background: var(--paper-bright); }
.kit-section { position: relative; isolation: isolate; overflow: hidden; border-top: 1px solid var(--line); background: radial-gradient(circle at 88% 18%, rgba(89, 160, 201, .25), transparent 27rem), radial-gradient(circle at 13% 90%, rgba(228, 94, 67, .12), transparent 24rem), linear-gradient(122deg, #f3f5f0, #deebf4 56%, #cbdfea); }
.contact-section { background: var(--night); color: var(--on-dark); }
.section-heading { display: grid; grid-template-columns: minmax(155px, .4fr) minmax(0, 1.36fr) minmax(190px, .42fr); align-items: start; gap: clamp(27px, 5vw, 76px); }
.method-heading, .cases-heading { grid-template-columns: minmax(155px, .4fr) minmax(0, 1.36fr); }
.section-index { display: flex; align-items: center; gap: 11px; margin: 1px 0 0; color: var(--signal-deep); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.section-index::before { width: 27px; height: 1px; content: ""; background: currentColor; }
.section-index span { color: var(--ink-soft); font-family: inherit; font-size: 10px; letter-spacing: .08em; }
.section-index.light { color: var(--sun); }
.section-index.light span { color: #c4d0d0; }
.section-kicker { margin-bottom: 15px; }
.section-heading h2, .kit-layout h2, .contact-copy h2 { max-width: 850px; margin: 0; font-size: clamp(39px, 5vw, 72px); font-weight: 750; letter-spacing: -.075em; line-height: .92; text-wrap: balance; }
.section-aside { max-width: 245px; margin: 4px 0 0; color: var(--ink-soft); font-size: 14px; line-height: 1.55; }

.service-rack { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: clamp(34px, 5vw, 60px); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.service-plate { position: relative; min-height: 360px; overflow: hidden; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); padding: clamp(25px, 3vw, 39px); background: var(--paper-bright); transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.service-plate::after { position: absolute; right: -30px; bottom: -37px; width: 112px; height: 112px; border: 1px solid currentColor; border-radius: 50%; content: ""; opacity: .16; transition: opacity .2s ease, transform .25s ease; }
.service-plate > .portfolio-icon { width: 25px; height: 25px; margin-top: 41px; color: var(--signal); }
.service-number { display: block; color: var(--ink-faint); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; font-weight: 800; letter-spacing: .07em; }
.service-plate h3 { max-width: 330px; margin: 18px 0 0; font-size: clamp(26px, 2.75vw, 39px); letter-spacing: -.055em; line-height: .98; }
.service-plate > p { max-width: 350px; margin: 17px 0 0; color: var(--ink-soft); line-height: 1.58; }
.service-plate ul { display: grid; gap: 7px; margin: 27px 0 0; padding: 0; color: var(--signal-deep); font-size: 12px; font-weight: 820; list-style: none; }
.service-plate li::before { margin-right: 8px; content: "+"; color: var(--ink); }
.service-plate:hover { background: var(--mint); transform: translateY(-5px); }
.service-plate:hover::after { opacity: .32; transform: scale(1.12); }

.method-section .section-kicker { color: var(--mint); }
.method-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(240px, .45fr); align-items: start; gap: clamp(32px, 7vw, 112px); margin-top: clamp(48px, 7vw, 82px); }
.method-grid { display: grid; gap: 0; margin: 0; padding: 0; border-top: 1px solid rgba(255, 255, 255, .36); list-style: none; }
.method-grid li { display: grid; grid-template-columns: 110px 1fr; gap: 18px; border-bottom: 1px solid rgba(255, 255, 255, .22); padding: 26px 0; }
.method-grid li > span { color: var(--sun); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; font-weight: 900; }
.method-grid h3 { margin: -4px 0 0; font-size: clamp(27px, 3vw, 42px); letter-spacing: -.055em; line-height: 1; }
.method-grid p { max-width: 620px; margin: 12px 0 0; color: #c3d0d2; font-size: 16px; line-height: 1.55; }
.method-log { border: 1px solid rgba(255, 255, 255, .35); padding: 23px; background: rgba(255, 255, 255, .05); }
.method-log p { margin: 0; color: var(--mint); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.method-log strong { display: block; margin: 9px 0 4px; color: #fff; font-size: 21px; letter-spacing: -.04em; line-height: 1.05; }
.method-log span { display: block; color: #c8d3d2; font-size: 13px; line-height: 1.5; }
.method-log hr { height: 1px; margin: 25px 0; border: 0; background: rgba(255, 255, 255, .25); }

.case-list { display: grid; gap: 18px; margin-top: clamp(45px, 7vw, 84px); }
.case-sheet { display: grid; grid-template-columns: minmax(130px, .3fr) minmax(280px, 1fr) minmax(250px, .75fr); gap: clamp(24px, 5vw, 78px); border: 1px solid var(--ink); padding: clamp(25px, 3.6vw, 47px); background: #fbfaf5; transition: background-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.case-sheet header { display: grid; align-content: start; gap: 13px; }
.case-sheet header > span { color: var(--signal); font-family: Georgia, "Times New Roman", serif; font-size: 39px; line-height: .8; }
.case-sheet header p, .case-label { margin: 0; color: var(--ink-faint); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 800; letter-spacing: .06em; line-height: 1.45; text-transform: uppercase; }
.case-sheet header i { color: var(--signal); font-style: normal; }
.case-title h3 { margin: 15px 0 0; font-size: clamp(32px, 4vw, 56px); letter-spacing: -.07em; line-height: .9; }
.case-title h3 em { color: var(--signal); font-family: Georgia, "Times New Roman", serif; font-style: normal; font-weight: 400; }
.case-copy { align-self: center; }
.case-copy > p { max-width: 420px; margin: 0; color: var(--ink-soft); line-height: 1.58; }
.case-route { display: grid; grid-template-columns: auto minmax(18px, 1fr) auto minmax(18px, 1fr) auto; align-items: center; gap: 7px; margin-top: 24px; color: var(--ink); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.case-route i { height: 1px; background: linear-gradient(90deg, var(--signal), rgba(228, 94, 67, .15)); }
.case-sheet footer { grid-column: 2 / -1; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid var(--line); padding-top: 18px; }
.case-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 0; padding: 0; list-style: none; }
.case-tags li { border: 1px solid var(--line-strong); padding: 5px 7px; color: var(--ink-soft); font-size: 11px; font-weight: 770; }
.case-state { color: var(--signal-deep); font-size: 11px; font-weight: 880; letter-spacing: .06em; text-transform: uppercase; }
.case-sheet:hover { background: #fff; box-shadow: 10px 10px 0 var(--mint); transform: translate(-3px, -3px); }
.accent-sheet { background: #edf1e8; }
.dark-sheet { border-color: var(--night); background: var(--night); color: var(--on-dark); }
.dark-sheet .case-label, .dark-sheet header p { color: var(--mint); }
.dark-sheet .case-copy > p, .dark-sheet .case-tags li { color: #d1dedb; }
.dark-sheet .case-route { color: #fff; }
.dark-sheet .case-state { color: var(--sun); }
.dark-sheet footer { border-color: rgba(255, 255, 255, .25); }
.dark-sheet .case-tags li { border-color: rgba(255, 255, 255, .32); }
.dark-sheet:hover { background: #203544; box-shadow: 10px 10px 0 var(--signal); }

.kit-layout { display: grid; min-height: 430px; grid-template-columns: minmax(340px, .88fr) minmax(0, 1.12fr); align-items: center; gap: clamp(42px, 5.5vw, 88px); }
.kit-layout .section-kicker { margin-top: 32px; }
.kit-layout h2 { max-width: 560px; font-size: clamp(44px, 3.8vw, 58px); line-height: .96; }
.kit-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: center; gap: 14px; margin: 0; }
.kit-list > div { position: relative; display: grid; min-height: 166px; overflow: hidden; grid-template-columns: 1fr; align-content: center; gap: 16px; border: 1px solid var(--glass-edge); border-radius: var(--card-radius); padding: 22px; background: var(--surface-raised); box-shadow: var(--soft-shadow); transition: box-shadow .24s ease, transform .24s ease; }
.kit-list > div::before { position: absolute; right: 22px; bottom: 18px; left: 22px; height: 2px; content: ""; background: linear-gradient(90deg, var(--signal), var(--mint)); opacity: .7; transform: scaleX(.16); transform-origin: left; transition: transform .32s cubic-bezier(.16, 1, .3, 1); }
.kit-list > div:last-child { min-height: 160px; grid-column: span 2; grid-template-columns: minmax(150px, .58fr) 1fr; align-items: center; }
.kit-list dt { display: flex; align-items: center; gap: 8px; color: var(--signal-deep); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.kit-list dt .portfolio-icon { width: 17px; height: 17px; }
.kit-list dd { margin: 0; color: var(--ink); font-size: clamp(17px, 1.35vw, 21px); font-weight: 650; letter-spacing: -.025em; line-height: 1.32; }

.contact-layout { display: grid; grid-template-columns: minmax(0, 1.14fr) minmax(280px, .64fr); align-items: start; gap: clamp(40px, 10vw, 156px); }
.contact-copy h2 { margin-top: 30px; }
.contact-copy > p:last-child { max-width: 620px; margin: 27px 0 0; color: #c3d0d2; font-size: 18px; line-height: 1.58; }
.contact-ticket { border: 1px solid rgba(255, 255, 255, .44); padding: clamp(22px, 3vw, 32px); background: rgba(255, 255, 255, .05); }
.ticket-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid rgba(255, 255, 255, .22); padding-bottom: 14px; color: var(--mint); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 880; letter-spacing: .07em; text-transform: uppercase; }
.ticket-top b { color: var(--sun); font-weight: 880; }
.contact-ticket > p { margin: 21px 0 0; color: #d9e2e1; font-size: 15px; line-height: 1.5; }
.contact-ticket ul { display: grid; gap: 9px; margin: 16px 0 0; padding: 0; color: #c4d0d2; font-size: 13px; line-height: 1.48; list-style: none; }
.contact-ticket li::before { margin-right: 8px; content: "→"; color: var(--sun); }
.contact-actions { display: grid; gap: 10px; margin-top: 26px; }
.contact-mobile-cta { display: none; }
.contact-actions .portfolio-button { width: 100%; }
.email-link, .cv-contact-link { display: inline-flex; min-height: 45px; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid rgba(255, 255, 255, .3); padding: 0 13px; background: transparent; color: #fff; cursor: pointer; font-size: 13px; font-weight: 800; text-align: left; transition: border-color .18s ease, background-color .18s ease, color .18s ease; }
.email-link:hover, .cv-contact-link:hover { border-color: var(--mint); background: var(--ambient-a); color: var(--mint); }
.email-link.is-copied { border-color: var(--mint); color: var(--mint); }
.email-link.is-copy-error { border-color: var(--sun); color: var(--sun); }
.cv-contact-link { justify-content: flex-start; }
.cv-contact-link .portfolio-icon { width: 17px; height: 17px; }

.portfolio-footer { border-top: 1px solid rgba(255, 255, 255, .18); background: #0c1925; color: #b9c7c8; }
.portfolio-footer .portfolio-shell { display: grid; grid-template-columns: 1fr auto 1fr; gap: 16px; padding-top: 20px; padding-bottom: 20px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.portfolio-footer a { color: var(--mint); text-align: right; }
.portfolio-footer a:hover { color: var(--sun); }

.cv-dialog { width: min(1180px, calc(100vw - 40px)); max-width: none; max-height: min(92dvh, 1000px); margin: auto; border: 1px solid var(--night); padding: 0; background: #f4f7f5; color: #172740; box-shadow: 0 18px 52px rgba(0, 0, 0, .52), 0 0 0 1px rgba(3, 13, 27, .72); contain: layout paint; overflow: hidden; }
.cv-dialog::backdrop { background: rgba(7, 16, 25, .82); }
.cv-dialog-toolbar { display: flex; min-height: 78px; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid #b9c8ce; padding: 14px clamp(18px, 3vw, 30px); background: var(--night); color: #ecf5fa; }
.cv-dialog-toolbar p { margin: 0; color: var(--mint); font-size: 10px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.cv-dialog-toolbar h2 { margin: 4px 0 0; font-size: 20px; letter-spacing: -.035em; line-height: 1; }
.cv-dialog-actions { display: flex; align-items: center; gap: 10px; }
.cv-dialog-download, .cv-dialog-close { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; gap: 8px; border: 1px solid rgba(180, 211, 221, .4); background: transparent; color: #ecf5fa; cursor: pointer; font-size: 12px; font-weight: 800; transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease; }
.cv-dialog-download { padding: 0 12px; }
.cv-dialog-download .portfolio-icon { width: 16px; height: 16px; color: var(--mint); }
.cv-dialog-close { width: 42px; padding: 0; font-size: 26px; font-weight: 400; line-height: 1; }
.cv-dialog-download:hover, .cv-dialog-close:hover { border-color: var(--mint); background: var(--ambient-a); color: var(--mint); transform: translateY(-1px); }
.cv-dialog-scroll { max-height: calc(min(92dvh, 1000px) - 78px); contain: layout paint; overflow: auto; overscroll-behavior: contain; background: #eaf0ef; scrollbar-color: #267f89 #d3dedb; scrollbar-width: thin; }
.cv-preview-status { margin: 0; padding: clamp(28px, 7vw, 70px); color: #314f60; font-size: 16px; line-height: 1.55; text-align: center; }
.cv-preview-status a { color: var(--signal-deep); font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.cv-document { min-width: 0; background: #f7f8f3; }
.cv-document-header { padding: clamp(34px, 5vw, 62px) clamp(26px, 6vw, 70px) 28px; border-bottom: 3px solid var(--signal); background: #fbfcf9; }
.cv-document-header p, .cv-document-section > h4, .cv-document-sidebar h4 { margin: 0; color: var(--signal-deep); font-size: 12px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.cv-document-header h3 { margin: 10px 0 8px; color: #14243d; font-size: clamp(37px, 6vw, 66px); font-weight: 800; letter-spacing: -.075em; line-height: .89; }
.cv-document-header strong { color: var(--signal-deep); font-size: clamp(17px, 2.4vw, 27px); letter-spacing: -.015em; }
.cv-document-layout { display: grid; grid-template-columns: minmax(255px, .67fr) minmax(0, 1.67fr); align-items: stretch; }
.cv-document-sidebar { display: grid; align-content: start; gap: 34px; padding: 42px clamp(24px, 3.4vw, 46px); background: var(--night); color: #d9e8ef; }
.cv-monogram { display: grid; width: 90px; height: 90px; place-items: center; border: 1px solid #b8d1d6; color: #fff; font-size: 27px; font-weight: 900; letter-spacing: .08em; }
.cv-document-sidebar section { display: grid; gap: 11px; }
.cv-document-sidebar h4 { color: var(--mint); }
.cv-document-sidebar h5 { margin: 7px 0 -4px; color: #c1e9e5; font-size: 15px; }
.cv-document-sidebar p { margin: 0; color: #d7e3ec; font-size: 15px; line-height: 1.52; }
.cv-document-sidebar a { width: fit-content; color: #edf9f7; font-size: 15px; line-height: 1.45; text-decoration: underline; text-decoration-color: var(--mint); text-underline-offset: 3px; }
.cv-document-sidebar a:hover { color: var(--mint); }
.cv-tag-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.cv-tag-list li { border: 1px solid rgba(169, 224, 225, .43); padding: 5px 8px; color: #e6f3f5; font-size: 12px; font-weight: 760; }
.cv-document-main { display: grid; align-content: start; gap: 39px; padding: 42px clamp(27px, 5vw, 70px) 62px; }
.cv-document-section { display: grid; gap: 17px; }
.cv-document-section > h4 { border-bottom: 1px solid #d5e1df; padding-bottom: 10px; }
.cv-profile-copy { max-width: 820px; margin: 0; color: #50647d; font-size: 18px; line-height: 1.58; }
.cv-strength-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.cv-strength-grid article { min-height: 150px; border-top: 3px solid var(--signal); padding: 17px; background: #e9f1f0; }
.cv-strength-grid span { color: var(--signal-deep); font-size: 12px; font-weight: 900; letter-spacing: .08em; }
.cv-strength-grid h5, .cv-entry h5 { margin: 21px 0 0; color: #15253e; font-size: 22px; letter-spacing: -.04em; line-height: 1; }
.cv-strength-grid p { margin: 10px 0 0; color: #536781; font-size: 15px; line-height: 1.48; }
.cv-entry { display: grid; grid-template-columns: minmax(140px, .44fr) minmax(0, 1.56fr); gap: clamp(24px, 4vw, 48px); padding: 2px 0 25px; border-bottom: 1px solid #d5e1df; }
.cv-entry + .cv-entry { padding-top: 25px; }
.cv-entry-meta { margin: 2px 0 0; color: #50647d; font-size: 13px; font-weight: 860; letter-spacing: .04em; line-height: 1.45; text-transform: uppercase; }
.cv-entry h5 { margin: 0; font-size: clamp(23px, 3.1vw, 31px); }
.cv-entry h5 span { color: var(--signal-deep); }
.cv-entry-role { margin: 7px 0 0; color: var(--signal-deep); font-size: 16px; font-weight: 800; line-height: 1.38; }
.cv-entry ul { display: grid; gap: 8px; margin: 17px 0 0; padding-left: 20px; color: #50647d; font-size: 16px; line-height: 1.48; }
.cv-entry li::marker { color: var(--signal-deep); }
.cv-entry-stack { margin: 17px 0 0; color: #1a2b44; font-size: 14px; font-weight: 850; line-height: 1.45; }
.cv-noscript-download { display: block; width: fit-content; margin: 20px auto; color: var(--signal-deep); text-decoration: underline; text-underline-offset: 3px; }
body.cv-dialog-open { overflow: hidden; }

:root { --surface-glass: #fbfaf5; --surface-raised: #fffef9; --glass-edge: rgba(23, 39, 55, .14); --ambient-a: rgba(104, 165, 207, .25); --ambient-b: rgba(228, 94, 67, .18); --soft-shadow: 0 1px 1px rgba(23, 39, 55, .04), 0 14px 34px rgba(23, 39, 55, .07); --control-radius: 999px; --card-radius: 22px; }
html[data-portfolio-theme="dark"] { --surface-glass: #07131d; --surface-raised: #0d2636; --glass-edge: rgba(39, 224, 188, .36); --ambient-a: rgba(7, 196, 157, .28); --ambient-b: rgba(255, 96, 75, .2); --soft-shadow: 0 1px 1px rgba(0, 0, 0, .42), 0 16px 38px rgba(0, 0, 0, .42); }

body { background: radial-gradient(circle at 0 0, var(--ambient-a), transparent 31rem), radial-gradient(circle at 100% 18%, var(--ambient-b), transparent 29rem), var(--paper); }
.public-nav, .portfolio-index { background: var(--surface-glass); }
.portfolio-index a, .portfolio-index button, .nav-contact-link, .panel-link, .portfolio-button, .portfolio-utility, .email-link, .cv-contact-link { border-radius: var(--control-radius); }
.portfolio-index a, .portfolio-index button { border-color: transparent; }
.portfolio-index a:hover, .portfolio-index a:focus-visible, .portfolio-index button:hover, .portfolio-index button:focus-visible, .portfolio-index a[aria-current="location"], .portfolio-index button[aria-expanded="true"] { border-color: var(--glass-edge); background: var(--surface-raised); box-shadow: 0 3px 12px rgba(23, 39, 55, .07); }
.portfolio-button { border-color: var(--glass-edge); background: var(--surface-glass); box-shadow: 0 1px 0 rgba(255, 255, 255, .45) inset; }
.portfolio-button.secondary { background: var(--surface-glass); }
.portfolio-button.primary { box-shadow: 0 7px 20px rgba(180, 66, 45, .2); }
.portfolio-button.cv-button { border-color: var(--glass-edge); box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 8px 19px rgba(23, 39, 55, .08); }
.portfolio-button.cv-button::after { position: absolute; right: 10px; width: 5px; height: 5px; border-radius: 50%; content: ""; background: var(--signal); box-shadow: 0 0 0 4px color-mix(in srgb, var(--signal) 13%, transparent); }
.portfolio-button.cv-button:hover { box-shadow: 0 1px 0 rgba(255, 255, 255, .16) inset, 0 13px 27px rgba(23, 39, 55, .22); }

.portfolio-hero { background: var(--paper-bright); }
.portfolio-hero::before { position: absolute; z-index: 0; top: -12%; right: -10%; width: min(56vw, 940px); aspect-ratio: 1; border-radius: 43% 57% 48% 52%; background: #e4eeee; content: ""; opacity: .84; pointer-events: none; }
html[data-portfolio-theme="dark"] .portfolio-hero { background: linear-gradient(135deg, #06121d, #092131); }
html[data-portfolio-theme="dark"] .portfolio-hero::before { background: #0c2d35; opacity: .9; }
.hero-layout, .hero-signal { position: relative; z-index: 1; }
.hero-copy h1 em { color: var(--signal); }
.hero-field-notes, .method-log, .contact-ticket { border-color: var(--glass-edge); border-radius: var(--card-radius); box-shadow: var(--soft-shadow); }
.hero-field-notes { background: linear-gradient(145deg, rgba(20, 36, 51, .96), rgba(11, 26, 38, .92)); }

.services-section::before, .projects-section::before { position: absolute; z-index: 0; width: min(45vw, 580px); aspect-ratio: 1; border: 1px solid var(--glass-edge); border-radius: 50%; content: ""; opacity: .45; pointer-events: none; }
.services-section::before { top: 8%; right: -24%; }
.projects-section::before { bottom: 9%; left: -26%; }
.services-section > *, .projects-section > * { position: relative; z-index: 1; }
.service-rack { gap: 15px; border: 0; }
.service-plate { border: 1px solid var(--glass-edge); border-radius: var(--card-radius); background: var(--surface-raised); box-shadow: var(--soft-shadow); }
.service-plate:hover { background: var(--surface-raised); box-shadow: 0 2px 2px rgba(23, 39, 55, .04), 0 19px 34px rgba(23, 39, 55, .12); transform: translateY(-6px); }
html[data-portfolio-theme="dark"] .service-plate, html[data-portfolio-theme="dark"] .service-plate:hover { background: #10232f; color: var(--on-dark); }
html[data-portfolio-theme="dark"] .service-plate > p { color: var(--on-dark-muted); }
html[data-portfolio-theme="dark"] .service-plate .service-number { color: var(--mint); }

.method-section { background: radial-gradient(circle at 80% 24%, var(--ambient-a), transparent 30rem), linear-gradient(140deg, #102330, var(--night)); }
.method-log { background: #19313e; }
.contact-ticket { background: #112632; }
.method-grid li { transition: padding .28s cubic-bezier(.16, 1, .3, 1), background-color .28s ease; }
.method-grid li:hover { padding-right: 18px; padding-left: 18px; background: rgba(255, 255, 255, .055); }

.case-list { gap: 23px; }
.case-sheet { border-color: var(--glass-edge); border-radius: var(--card-radius); background: var(--surface-raised); box-shadow: var(--soft-shadow); }
.case-sheet:hover { background: var(--surface-raised); box-shadow: 0 18px 32px rgba(23, 39, 55, .13); transform: translateY(-5px); }
.dark-sheet { background: linear-gradient(145deg, #132b39, #0b1822); }
.dark-sheet:hover { background: linear-gradient(145deg, #173543, #0b1822); box-shadow: 0 20px 42px rgba(0, 0, 0, .28); }
html[data-portfolio-theme="dark"] .case-sheet, html[data-portfolio-theme="dark"] .case-sheet:hover { background: #10232f; }
html[data-portfolio-theme="dark"] .accent-sheet, html[data-portfolio-theme="dark"] .accent-sheet:hover { background: #142b37; }

html[data-portfolio-theme="dark"] .kit-section { background: radial-gradient(circle at 86% 18%, rgba(0, 186, 181, .18), transparent 28rem), radial-gradient(circle at 14% 88%, rgba(255, 96, 75, .1), transparent 24rem), linear-gradient(125deg, #06131e, #0a2734 58%, #071822); }
.kit-section > .portfolio-shell { position: relative; z-index: 1; }
.kit-list > div:hover { box-shadow: 0 20px 34px rgba(23, 39, 55, .15); transform: translateY(-5px); }
.contact-section { background: radial-gradient(circle at 76% 28%, var(--ambient-a), transparent 30rem), linear-gradient(145deg, #102330, var(--night)); }

.method-section { isolation: isolate; overflow: hidden; }
.method-section > .portfolio-shell { position: relative; z-index: 1; }
.method-magnet-lines { position: absolute; z-index: 0; top: 50%; right: -16%; width: min(62vw, 820px); height: min(46vw, 540px); opacity: .42; pointer-events: none; transform: translateY(-50%); }
.method-magnet-lines i { position: absolute; inset: 0 0 0 auto; width: 78%; height: 38%; border: 1px solid rgba(89, 213, 180, .32); border-radius: 50%; transform: translate3d(var(--magnet-x, 0px), var(--magnet-y, 0px), 0) rotate(-20deg); transition: transform .24s cubic-bezier(.16, 1, .3, 1); }
.method-magnet-lines i:nth-child(2) { top: 13%; right: 6%; width: 69%; height: 30%; border-color: rgba(255, 220, 120, .28); transform: translate3d(var(--magnet-x, 0px), var(--magnet-y, 0px), 0) rotate(18deg); }
.method-magnet-lines i:nth-child(3) { top: 32%; right: 10%; width: 60%; height: 25%; transform: translate3d(var(--magnet-x, 0px), var(--magnet-y, 0px), 0) rotate(-14deg); }
.method-magnet-lines i:nth-child(4) { top: 49%; right: 3%; width: 74%; height: 30%; border-color: rgba(255, 112, 88, .26); transform: translate3d(var(--magnet-x, 0px), var(--magnet-y, 0px), 0) rotate(20deg); }
.method-magnet-lines i:nth-child(5) { top: 65%; right: 15%; width: 54%; height: 19%; transform: translate3d(var(--magnet-x, 0px), var(--magnet-y, 0px), 0) rotate(-11deg); }
.method-magnet-lines b { position: absolute; top: 48%; right: 37%; width: 12px; height: 12px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 8px rgba(255, 112, 88, .12); transform: translate3d(var(--magnet-x, 0px), var(--magnet-y, 0px), 0); transition: transform .16s ease-out; }

@supports (content-visibility: auto) {
  .cv-document-section { content-visibility: auto; contain-intrinsic-size: auto 320px; }
}

@media (hover: hover) and (pointer: fine) {
  .public-brand:hover > span:first-child { background: var(--signal); transform: rotate(-4deg); }
  .portfolio-button:active, .panel-link:active, .nav-contact-link:active { transform: translateY(0) scale(.98); }
}

@media (prefers-reduced-motion: no-preference) {
  .portfolio-hero::before { animation: hero-atmosphere-drift 18s ease-in-out infinite alternate; }
  .hero-copy > * { animation: hero-copy-enter .72s cubic-bezier(.16, 1, .3, 1) both; }
  .hero-copy > :nth-child(1) { animation-delay: .05s; }
  .hero-copy > :nth-child(2) { animation-delay: .12s; }
  .hero-copy > :nth-child(3) { animation-delay: .2s; }
  .hero-copy > :nth-child(4) { animation-delay: .28s; }
  .hero-field-notes { animation: hero-panel-enter .8s cubic-bezier(.16, 1, .3, 1) .24s both; }
  html.portfolio-enhanced .portfolio-reveal { opacity: 0; transform: translateY(18px); transition: opacity .48s ease, transform .48s cubic-bezier(.16, 1, .3, 1); }
  html.portfolio-enhanced .portfolio-reveal.is-visible { opacity: 1; transform: translateY(0); }
  .cv-dialog[open] { animation: cv-dialog-in .2s cubic-bezier(.16, 1, .3, 1); }
  .cv-dialog.is-closing { animation: cv-dialog-out .16s ease-in forwards; }
  .cv-dialog[open]::backdrop { animation: cv-backdrop-in .2s ease-out; }
  @keyframes hero-copy-enter { from { opacity: 0; transform: translate3d(0, 22px, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
  @keyframes hero-atmosphere-drift { from { transform: translate3d(0, 0, 0) rotate(-4deg) scale(1); } to { transform: translate3d(-4%, 3%, 0) rotate(3deg) scale(1.055); } }
  @keyframes utility-in { from { opacity: 0; transform: translateY(10px) scale(.9); } to { opacity: 1; transform: translateY(0) scale(1); } }
  @keyframes hero-panel-enter { from { opacity: 0; translate: 28px 18px; rotate: 2deg; } to { opacity: 1; translate: 0; rotate: 0deg; } }
  @keyframes cv-dialog-in { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
  @keyframes cv-dialog-out { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(10px) scale(.99); } }
  @keyframes cv-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
}

.login-page { position: relative; isolation: isolate; display: grid; min-height: 100svh; grid-template-columns: minmax(0, .92fr) minmax(440px, 1.08fr); overflow: clip; background: var(--paper); }
.login-panel { position: relative; z-index: 1; display: grid; min-height: 100svh; align-content: center; min-width: 0; padding: clamp(30px, 5.8vw, 80px); background: linear-gradient(145deg, var(--paper-bright), var(--paper) 72%); }
.login-panel::before { position: absolute; top: clamp(22px, 5vw, 72px); left: clamp(22px, 5vw, 72px); width: 42px; height: 1px; content: ""; background: var(--signal); box-shadow: 54px 0 0 var(--mint); }
.login-panel-content { width: min(100%, 500px); }
.login-panel .public-brand { margin-bottom: clamp(34px, 6vh, 68px); }
.login-kicker, .login-aside-index { display: flex; align-items: center; gap: 9px; margin: 0; color: var(--signal-deep); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 850; letter-spacing: .1em; line-height: 1.45; text-transform: uppercase; }
.login-kicker i { display: inline-block; width: 22px; height: 1px; background: currentColor; opacity: .55; }
.login-copy h1 { max-width: 610px; margin: 14px 0 0; font-size: clamp(43px, 5vw, 68px); font-weight: 760; letter-spacing: -.08em; line-height: .92; text-wrap: balance; }
.login-copy h1 em, .login-aside h2 em { font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
.login-copy > p:last-child { max-width: 530px; margin: 16px 0 0; color: var(--ink-soft); font-size: 16px; line-height: 1.5; }
.login-form { display: grid; gap: 14px; margin-top: 28px; }
.login-field { display: grid; gap: 8px; }
.login-field label { color: var(--ink); font-size: 12px; font-weight: 850; }
.login-field input { width: 100%; min-height: 51px; border: 1px solid var(--line-strong); border-radius: 0; padding: 0 14px; background: var(--paper-bright); color: var(--ink); box-shadow: inset 3px 0 0 transparent; transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease; }
.login-field input:hover { border-color: var(--ink-soft); }
.login-field input:focus-visible { border-color: var(--focus); background: #fff; box-shadow: inset 3px 0 0 var(--signal), 0 0 0 3px color-mix(in srgb, var(--focus) 19%, transparent); }
.login-submit { width: 100%; min-height: 52px; margin-top: 4px; justify-content: space-between; padding: 0 18px; box-shadow: 5px 5px 0 var(--night); }
.login-submit:hover { box-shadow: 7px 7px 0 var(--night); transform: translate(-2px, -2px); }
.login-security-note { display: grid; grid-template-columns: auto 1fr; gap: 12px; margin: 20px 0 0; color: var(--ink-faint); font-size: 12px; line-height: 1.5; }
.login-security-note > span:first-child { color: var(--signal-deep); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.login-security-note strong { display: inline; margin-right: 4px; color: var(--ink); }
.login-alert { margin-top: 25px; border: 1px solid rgba(178, 66, 45, .55); border-left: 4px solid var(--signal); padding: 12px 14px; background: rgba(228, 94, 67, .1); color: #7a2619; font-size: 13px; font-weight: 700; line-height: 1.45; }
.login-aside { position: relative; display: grid; min-width: 0; overflow: hidden; place-items: center; padding: clamp(34px, 7vw, 104px); border-left: 1px solid rgba(255, 255, 255, .18); background: var(--night); color: var(--on-dark); }
.login-aside::before { position: absolute; inset: 0; content: ""; background-image: linear-gradient(rgba(189, 226, 221, .09) 1px, transparent 1px), linear-gradient(90deg, rgba(189, 226, 221, .09) 1px, transparent 1px); background-size: 66px 66px; mask-image: linear-gradient(to bottom, #000, rgba(0, 0, 0, .25)); }
.login-aside::after { position: absolute; top: -20%; right: -22%; width: min(42vw, 620px); aspect-ratio: 1; border: 1px solid rgba(125, 174, 203, .38); border-radius: 50%; content: ""; box-shadow: 0 0 0 42px rgba(125, 174, 203, .06), 0 0 0 84px rgba(228, 94, 67, .04); }
.login-aside-content { position: relative; z-index: 1; width: min(100%, 545px); }
.login-aside-index { color: var(--mint); }
.login-aside-index span { color: var(--sun); }
.login-aside h2 { max-width: 520px; margin: 20px 0 0; font-size: clamp(43px, 5.1vw, 76px); font-weight: 760; letter-spacing: -.08em; line-height: .9; text-wrap: balance; }
.login-aside h2 em { color: var(--mint); }
.login-aside-copy { max-width: 430px; margin: 22px 0 0; color: var(--on-dark-muted); font-size: 17px; line-height: 1.55; }
.login-route { display: grid; grid-template-columns: auto minmax(24px, 1fr) auto minmax(24px, 1fr) auto; align-items: center; gap: 10px; margin-top: 32px; color: var(--sun); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.login-route i { height: 1px; background: var(--signal); }

@media (max-width: 980px) {
  .hero-layout { grid-template-columns: minmax(0, 1fr) minmax(270px, .58fr); gap: 34px; }
  .section-heading { grid-template-columns: 142px minmax(0, 1fr); }
  .section-aside { grid-column: 2; max-width: 580px; }
  .case-sheet { grid-template-columns: minmax(115px, .28fr) minmax(0, 1fr); }
  .case-copy { grid-column: 2; }
  .case-sheet footer { grid-column: 2; }
  .kit-layout { gap: 60px; }
  .login-page { grid-template-columns: 1fr; }
  .login-aside { display: none; }
  .login-panel-content { width: min(100%, 500px); }
}

@media (min-width: 981px) and (max-height: 800px) {
  .login-page { grid-template-columns: 1fr; }
  .login-aside { display: none; }
  .login-panel { padding-block: clamp(22px, 4vh, 34px); }
  .login-panel .public-brand { margin-bottom: clamp(24px, 4vh, 36px); }
  .login-form { margin-top: 22px; }
  .login-security-note { margin-top: 16px; }
}

@media (max-width: 760px) {
  :root { --shell: min(100% - 40px, 640px); }
  [id] { scroll-margin-top: 118px; }
  .public-nav { min-height: 65px; padding: 10px 20px; }
  .public-brand > span:first-child { width: 34px; height: 34px; flex-basis: 34px; }
  .public-brand-copy small, .nav-contact-link { display: none; }
  .panel-link { min-height: 38px; padding: 0 11px; }
  .portfolio-index { top: 65px; gap: 0; padding: 7px 12px; }
  .portfolio-index a, .portfolio-index button { min-height: 42px; padding: 0 6px; }
  .portfolio-index::after { position: absolute; top: 0; right: 0; display: grid; width: 26px; height: 100%; place-items: center; content: "›"; background: linear-gradient(90deg, transparent, var(--paper-bright) 65%); color: var(--signal); font-size: 19px; pointer-events: none; }
  .portfolio-index span { font-size: 8px; }
  .portfolio-index button span { font-size: 9px; }
  .portfolio-utilities { right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); }
  .portfolio-hero::before { top: -16%; right: -56%; display: block; width: 112vw; opacity: .42; }
  html[data-portfolio-theme="dark"] .portfolio-hero::before { opacity: .52; }
  .hero-layout { min-height: auto; grid-template-columns: 1fr; gap: 30px; padding-top: 44px; padding-bottom: 50px; }
  .hero-copy h1 { font-size: clamp(45px, 11.8vw, 64px); line-height: .94; }
  .hero-intro { margin-top: 24px; font-size: 18px; }
  .hero-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; margin-top: 29px; }
  .hero-actions .primary { grid-column: span 2; }
  .portfolio-button { width: 100%; }
  .portfolio-button.text-button { justify-content: flex-start; padding-left: 0; }
  .hero-field-notes { padding: 13px 14px; box-shadow: 6px 6px 0 var(--signal); }
  .field-note-head, .field-note-foot { display: none; }
  .hero-field-notes dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .hero-field-notes dl > div { display: block; padding: 0; border: 0; }
  .hero-field-notes dt { gap: 4px; font-size: 10px; line-height: 1.2; }
  .hero-field-notes dt .portfolio-icon { width: 12px; height: 12px; }
  .hero-field-notes dd { display: none; }
  .hero-signal { display: none; }
  .hero-signal { width: var(--shell); font-size: 8px; }
  .services-section, .projects-section, .kit-section, .method-section, .contact-section { padding: 72px 0; }
  .section-heading, .method-heading, .cases-heading, .kit-layout, .contact-layout { grid-template-columns: 1fr; gap: 25px; }
  .section-index { max-width: none; }
  .section-aside { grid-column: auto; max-width: 520px; }
  .section-heading h2, .kit-layout h2, .contact-copy h2 { font-size: clamp(38px, 10.5vw, 56px); }
  .service-rack { grid-template-columns: 1fr; margin-top: 43px; }
  .service-plate { min-height: 0; padding: 29px; }
  .service-plate > .portfolio-icon { margin-top: 32px; }
  .method-layout { grid-template-columns: 1fr; gap: 30px; margin-top: 42px; }
  .method-grid li { grid-template-columns: 58px 1fr; gap: 14px; }
  .method-grid h3 { font-size: 29px; }
  .method-log { max-width: 420px; }
  .case-list { gap: 13px; margin-top: 43px; }
  .case-sheet { grid-template-columns: 1fr; gap: 21px; padding: 27px; }
  .case-sheet header { display: flex; align-items: center; gap: 12px; }
  .case-sheet header > span { font-size: 31px; }
  .case-copy, .case-sheet footer { grid-column: auto; }
  .case-sheet footer { align-items: flex-start; flex-direction: column; gap: 14px; }
  .case-route { max-width: 390px; }
  .kit-layout { min-height: 0; }
  .kit-layout .section-kicker { margin-top: 25px; }
  .kit-list { grid-template-columns: 1fr; gap: 10px; }
  .kit-list > div, .kit-list > div:last-child { min-height: 0; grid-column: auto; grid-template-columns: 1fr; gap: 10px; padding: 20px; }
  .contact-ticket { padding: 24px; }
  .contact-mobile-cta { display: inline-flex; width: 100%; margin-top: 22px; }
  .portfolio-footer .portfolio-shell { grid-template-columns: 1fr; gap: 8px; }
  .portfolio-footer a { text-align: left; }
  .cv-dialog { width: calc(100vw - 20px); max-height: calc(100dvh - 20px); }
  .cv-dialog-toolbar { min-height: 70px; padding: 11px 13px 11px 17px; }
  .cv-dialog-toolbar h2 { font-size: 18px; }
  .cv-dialog-download { min-height: 39px; padding: 0 9px; }
  .cv-dialog-download span { display: none; }
  .cv-dialog-close { width: 39px; min-height: 39px; }
  .cv-dialog-scroll { max-height: calc(100dvh - 90px); }
  .cv-document-header { padding: 33px 26px 24px; }
  .cv-document-layout { grid-template-columns: 1fr; }
  .cv-document-sidebar { gap: 27px; padding: 30px 26px; }
  .cv-monogram { width: 68px; height: 68px; font-size: 21px; }
  .cv-document-main { gap: 32px; padding: 31px 26px 44px; }
  .cv-profile-copy { font-size: 16px; }
  .cv-strength-grid { grid-template-columns: 1fr; gap: 9px; }
  .cv-strength-grid article { min-height: 0; padding: 15px; }
  .cv-strength-grid h5 { margin-top: 13px; }
  .cv-entry { grid-template-columns: 1fr; gap: 9px; }
  .cv-entry-meta { margin: 0; font-size: 11px; }
  .cv-entry ul { font-size: 15px; }
  .login-page { grid-template-columns: 1fr; }
  .login-panel { min-height: auto; padding: 58px 24px 48px; }
  .login-panel::before { top: 21px; left: 24px; }
  .login-panel .public-brand { margin-bottom: 52px; }
  .login-aside { min-height: 440px; padding: 54px 24px; border-top: 1px solid rgba(255, 255, 255, .18); border-left: 0; }
  .login-aside::after { top: -16%; right: -34%; width: 330px; }
  .login-aside h2 { font-size: clamp(42px, 12vw, 62px); }
}

@media (prefers-reduced-motion: reduce), (update: slow) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

@media (max-width: 760px), (hover: none), (pointer: coarse) {
  .method-magnet-lines { right: -46%; width: 118vw; opacity: .3; }
}

@media print {
  @page { size: 312.2mm 440mm; margin: 0; }
  html, body { width: 1180px !important; min-width: 1180px !important; margin: 0 !important; background: #f7f8f3 !important; color: #172740 !important; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  body > :not(.cv-dialog) { display: none !important; }
  body > .cv-dialog { position: static !important; display: block !important; width: 1180px !important; max-width: none !important; max-height: none !important; min-height: 0 !important; margin: 0 !important; border: 0 !important; padding: 0 !important; background: #f7f8f3 !important; box-shadow: none !important; contain: none !important; overflow: visible !important; color: #172740 !important; }
  .cv-dialog-toolbar, .cv-dialog::backdrop { display: none !important; }
  .cv-dialog-scroll { max-height: none !important; contain: none !important; overflow: visible !important; background: transparent !important; }
  .cv-document { width: 1180px !important; min-width: 0 !important; background: #f7f8f3 !important; }
  .cv-document-header { padding: 62px 70px 28px !important; }
  .cv-document-header h3 { font-size: 66px !important; }
  .cv-document-header strong { font-size: 27px !important; }
  .cv-document-layout { grid-template-columns: minmax(255px, .67fr) minmax(0, 1.67fr) !important; }
  .cv-document-sidebar { gap: 34px !important; padding: 42px 46px !important; }
  .cv-document-main { gap: 39px !important; padding: 42px 70px 62px !important; }
  .cv-profile-copy { font-size: 18px !important; }
  .cv-strength-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 12px !important; }
  .cv-strength-grid article { min-height: 150px !important; padding: 17px !important; break-inside: avoid; }
  .cv-strength-grid h5 { margin-top: 21px !important; }
  .cv-entry { grid-template-columns: minmax(140px, .44fr) minmax(0, 1.56fr) !important; gap: 48px !important; break-inside: avoid; }
  .cv-entry h5 { font-size: 31px !important; }
  .cv-entry-meta { margin-top: 2px !important; font-size: 13px !important; }
  .cv-entry ul { font-size: 16px !important; }
  .cv-document-section { content-visibility: visible !important; contain: none !important; contain-intrinsic-size: auto !important; }
  .cv-document-header, .cv-document-sidebar section, .cv-document-section > h4 { break-inside: avoid; }
}