/* Automotive palette shared by the portfolio, gallery and contact form. */
:root { --ink: #101114; --paper: #f4f5f7; --accent: #78b9ff; --muted: #aeb3bc; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { font-family: Arial, Helvetica, sans-serif; }
.skip-link { position: fixed; top: -80px; left: 16px; z-index: 1100; background: white; color: black; padding: 12px; }
.skip-link:focus { top: 12px; }
a:focus-visible, button:focus-visible { outline: 3px solid #78b9ff; outline-offset: 5px; }
.portfolio-home { background: var(--ink); color: var(--paper); }
.portfolio-home .site-nav { background: #101114ed !important; border-bottom: 1px solid #ffffff15; backdrop-filter: blur(16px); }
.site-nav { padding-block: 20px; }
.site-nav .navbar-brand { font-size: 1.05rem; letter-spacing: -.03em; }
.site-nav .nav-link { font-size: .85rem; margin-left: 22px; }
.portfolio-home .site-nav .text-warning { color: var(--accent) !important; }
.hero { position: relative; overflow: hidden; background-image: linear-gradient(#ffffff03 1px, transparent 1px), linear-gradient(90deg, #ffffff03 1px, transparent 1px); background-size: 80px 80px; }
.hero-glow { position: absolute; width: 900px; height: 700px; top: -260px; left: calc(50% - 450px); background: radial-gradient(ellipse, #286ac926, transparent 68%); pointer-events: none; }
.hero-topline,.hero-bottomline { display: flex; justify-content: space-between; align-items: center; gap: 16px; font: .63rem monospace; letter-spacing: .13em; color: var(--muted); }
.hero-topline { padding-top: 32px; }
.hero-stage { min-height: 660px; min-height: min(740px, 83svh); padding: 90px 0; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; }
.eyebrow { color: var(--accent); font: .67rem monospace; letter-spacing: .18em; margin-bottom: 26px; }
.focus-frame { position: relative; padding: 24px 38px 30px; margin: 6px 0 25px; }
.focus-name { font-size: clamp(3.5rem, 9vw, 8rem); letter-spacing: -.075em; font-weight: 700; line-height: 1.08; margin: 0; animation: focus-in 1.8s cubic-bezier(.2,.7,.2,1) both; }
.focus-name > span:not(.name-dot) { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; font-style: italic; }
.name-dot { color: var(--accent); }
.focus-corner { width: 20px; height: 20px; position: absolute; border-color: var(--accent); border-style: solid; opacity: .75; animation: frame-in 1.8s ease both; }
.corner-tl { top: 0; left: 0; border-width: 1px 0 0 1px; }.corner-tr { top: 0; right: 0; border-width: 1px 1px 0 0; }.corner-bl { bottom: 0; left: 0; border-width: 0 0 1px 1px; }.corner-br { bottom: 0; right: 0; border-width: 0 1px 1px 0; }
.welcome { font-size: clamp(1.4rem, 3vw, 2rem); letter-spacing: -.03em; margin-bottom: 16px; }
.hero-description { font-size: .95rem; line-height: 1.8; color: var(--muted); margin-bottom: 32px; max-width: 560px; }
.entrance { animation: rise-in 1s .65s both; }
.btn-accent,.btn-quiet { border-radius: 4px; padding: 13px 23px; font-size: .85rem; font-weight: 600; transition: background .2s, transform .2s; }
.btn-accent { background: var(--accent); color: var(--ink); border: 1px solid var(--accent); }.btn-accent:hover { background: #c2dfff; color: var(--ink); transform: translateY(-2px); }
.btn-quiet { color: var(--paper); border: 1px solid #ffffff30; }.btn-quiet:hover { color: var(--accent); border-color: var(--accent); }
.btn span { margin-left: 18px; }
.hero-bottomline { padding: 24px 0; border-top: 1px solid #ffffff18; }
.hero-bottomline a { color: var(--muted); text-decoration: none; }.hero-bottomline a:hover { color: var(--accent); }
.status-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); margin-right: 9px; box-shadow: 0 0 12px #78b9ff66; }
.content-section { padding: 100px 0; border-top: 1px solid #ffffff12; }
.content-section h2 { font-size: clamp(2rem, 4vw, 3.1rem); letter-spacing: -.055em; margin-bottom: 22px; }
.section-intro { font-size: 1.15rem; color: var(--muted); max-width: 490px; line-height: 1.7; }
.portrait-placeholder { aspect-ratio: 4/4.3; max-width: 300px; border: 1px solid #ffffff24; background: linear-gradient(135deg,#25282e,#17191e); display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 22px; color: var(--muted); font: .6rem monospace; letter-spacing: .12em; }
.portrait-monogram { color: var(--accent); font: italic 5rem Georgia,serif; letter-spacing: -.09em; }
.resume-details h3 { font: .65rem monospace; text-transform: uppercase; letter-spacing: .14em; color: var(--accent); margin-bottom: 16px; }.resume-details p { font-size: .9rem; margin-bottom: 7px; }
.muted-copy { color: var(--muted); line-height: 1.8; }
.work-section { background: #17191e; }.text-link { font-size: .85rem; color: var(--accent); text-underline-offset: 6px; }
.photo-card { display: block; color: var(--paper); text-decoration: none; }.photo-window { overflow: hidden; }.photo-window img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; transition: transform .4s; }.photo-card:hover img { transform: scale(1.04); }.photo-card:hover h3 { color: var(--accent); }
.photo-caption { display: flex; justify-content: space-between; padding-top: 22px; gap: 12px; }.photo-caption p { font: .6rem monospace; color: var(--muted); letter-spacing: .1em; }.photo-caption h3 { font-size: 1.1rem; }.photo-caption > span { color: var(--accent); }
.portfolio-home footer { background: var(--ink) !important; border-top: 1px solid #ffffff18; font-size: .75rem; }
@keyframes focus-in { 0% { filter: blur(18px); opacity: 0; transform: scale(1.09); } 55% { opacity: 1; } 100% { filter: blur(0); opacity: 1; transform: scale(1); } }
@keyframes frame-in { from { opacity: 0; transform: scale(1.6); } to { opacity: .75; transform: scale(1); } }
@keyframes rise-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 767px) { .hero-stage { min-height: 600px; padding: 75px 0; }.hero-topline { font-size: .5rem; letter-spacing: .06em; }.focus-frame { padding: 25px 20px; }.focus-name { font-size: clamp(3rem, 10.5vw, 5rem); }.hero-bottomline { font-size: .52rem; letter-spacing: .04em; }.content-section { padding: 65px 0; }.portrait-placeholder { max-width: 220px; }.site-nav .nav-link { margin-left: 0; padding-top: 12px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } }
/* Shared typography and layout across every portfolio page. */
body.portfolio-home { font-family: Arial, Helvetica, sans-serif; }
.focus-name > span:not(.name-dot) { font-family: inherit; font-weight: 700; font-style: normal; }
.site-nav .nav-link.active { color: var(--accent); }
.profile-photo { width: 100%; max-width: 330px; height: auto; aspect-ratio: auto; object-fit: contain; opacity: .88; border-radius: 4px; border: 1px solid #ffffff25; }
.page-heading { padding: 36px 0 60px; max-width: 850px; }
.page-heading h1 { font-size: clamp(2.7rem, 6vw, 5rem); font-weight: 700; letter-spacing: -.065em; line-height: 1.1; margin-bottom: 25px; }
.page-heading .section-intro { max-width: 620px; }
.photo-window { position: relative; }
.photo-window img { aspect-ratio: 16/9; }
.play-badge { position: absolute; bottom: 15px; right: 15px; width: 40px; height: 40px; background: #101114d9; color: var(--accent); border: 1px solid #78b9ff60; border-radius: 50%; display: grid; place-items: center; font-size: .8rem; }
.video-project { padding: 54px 0; border-top: 1px solid #ffffff20; scroll-margin-top: 100px; }
.video-project h2,.contact-note h2 { font-size: 1.8rem; letter-spacing: -.04em; margin-bottom: 22px; }
.video-project .eyebrow { line-height: 1.8; }
video { display: block; width: 100%; aspect-ratio: 16/9; background: #000; border-radius: 5px; object-fit: contain; }
.video-direct { display: inline-block; margin-top: 15px; font-size: .75rem; }
.project-role { font: .65rem monospace; letter-spacing: .1em; color: var(--accent); margin-top: 28px; }
.project-role span { display: block; color: var(--paper); font: .9rem Arial, sans-serif; margin-top: 10px; letter-spacing: normal; }
.page-cta { border-top: 1px solid #ffffff20; margin-top: 30px; padding: 50px 0 20px; display: flex; align-items: center; justify-content: space-between; gap: 25px; flex-wrap: wrap; }
.page-cta h2 { font-size: 1.8rem; letter-spacing: -.04em; }
.email-panel { display: flex; flex-direction: column; gap: 26px; padding: 40px; background: #1c1f25; border: 1px solid #78b9ff2b; color: var(--paper); text-decoration: none; border-radius: 5px; }
.email-panel:hover { border-color: var(--accent); }.email-panel .eyebrow { margin: 0; }
.email-address { font-size: clamp(1.15rem, 3vw, 1.9rem); letter-spacing: -.04em; overflow-wrap: anywhere; }
.contact-layout { padding-bottom: 70px; }.contact-note { padding: 15px 0; }
.resume-sidebar { position: sticky; top: 110px; }.resume-sidebar h1 { font-size: 2rem; letter-spacing: -.05em; margin-top: 25px; }.resume-sidebar .profile-photo { max-width: 100%; }
.resume-block { border-top: 1px solid #ffffff20; padding: 30px 0; }.resume-block h2 { font-size: .7rem; color: var(--accent); letter-spacing: .15em; text-transform: uppercase; margin-bottom: 26px; }.resume-entry { margin-bottom: 28px; }.resume-entry:last-child { margin-bottom: 0; }.resume-entry h3 { font-size: 1.15rem; line-height: 1.5; }.resume-entry .date { font-size: .8rem; color: var(--accent); }.resume-entry p,.resume-entry li { color: var(--muted); line-height: 1.8; font-size: .95rem; }.resume-entry li { margin-bottom: 8px; }.skill-list { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; padding: 0; }.skill-list li { padding: 7px 13px; border: 1px solid #ffffff26; border-radius: 3px; }
@media print { .site-nav, footer, .skip-link, .print-button, .resume-sidebar .btn { display: none !important; } body.portfolio-home { background: white; color: #111; } .muted-copy,.resume-entry p,.resume-entry li,.resume-entry .date,.resume-block h2,.eyebrow { color: #333 !important; }.resume-sidebar { position: static; }.resume-block { break-inside: avoid; border-color: #ccc; }.resume-sidebar .profile-photo { max-width: 140px; } }
@media (max-width: 767px) { .page-heading { padding: 15px 0 35px; }.email-panel { padding: 25px; }.resume-sidebar { position: static; }.resume-sidebar .profile-photo { max-width: 250px; }.video-project { padding: 35px 0; } }
.gallery-card { background: #1c1f25; border: 1px solid #ffffff20; color: var(--paper); overflow: hidden; }.gallery-card .text-body-secondary { color: var(--muted) !important; }.gallery-card .card-img-top { height: 220px; object-fit: cover; }.portfolio-home .btn-outline-primary,.portfolio-home .btn-outline-secondary { color: var(--accent); border-color: #78b9ff70; }.portfolio-home .btn-outline-primary:hover,.portfolio-home .btn-outline-secondary:hover { background: var(--accent); color: var(--ink); }.portfolio-home main .text-body-secondary { color: var(--muted) !important; }

.contact-form .form-control,.contact-form .form-select { background-color: #1c1f25; color: var(--paper); border-color: #ffffff35; padding: 12px; }.contact-form .form-control:focus,.contact-form .form-select:focus { border-color: var(--accent); box-shadow: 0 0 0 .2rem #78b9ff20; }.contact-form .form-select { color-scheme: dark; }.contact-form .form-check-input:checked { background-color: #286ac9; border-color: var(--accent); }.contact-form .form-label { color: var(--paper); font-size: .9rem; }

/* Motorsport details: static, lightweight graphics and instrument markings. */
.portfolio-home .site-nav { background: #101114f5 !important; backdrop-filter: none; }
.site-nav::after { content: ""; position: absolute; bottom: -1px; left: 0; width: 100%; height: 3px; background: linear-gradient(90deg, #58a9e6 0 5%, #244e9b 5% 10%, #df3946 10% 15%, #ffffff16 15%); }
.site-nav .navbar-brand { text-transform: uppercase; font-style: italic; letter-spacing: .04em; }
.site-nav .nav-link.active { color: #fff; box-shadow: inset 0 -2px #e4424e; }
.hero { isolation: isolate; background: radial-gradient(ellipse at 50% 32%, #26334780, transparent 64%), linear-gradient(140deg,#181b21,#0e0f12 65%); }
.hero-glow { background: radial-gradient(ellipse,#317acb20,transparent 68%); }
.hero::before { content: ""; pointer-events: none; position: absolute; z-index: -1; width: min(950px,110vw); height: min(950px,110vw); border-radius: 50%; left: 50%; top: 44%; transform: translate(-50%,-50%); background: repeating-conic-gradient(from 220deg,#b6c4d533 0deg .35deg, transparent .35deg 6deg); mask-image: radial-gradient(circle,transparent 64%,#000 64.2% 65%,transparent 65.2%); }
.hero::after { content: ""; position: absolute; bottom: 0; left: 7%; right: 7%; height: 210px; z-index: -1; pointer-events: none; background: linear-gradient(110deg,transparent 37%,#ffffff0b 37.2% 37.5%,transparent 37.7%),linear-gradient(70deg,transparent 37%,#ffffff0b 37.2% 37.5%,transparent 37.7%); }
.focus-name { font-style: italic; font-weight: 800; letter-spacing: -.065em; text-shadow: 0 3px 28px #0005; }
.focus-name > span:not(.name-dot) { font-weight: 800; font-style: italic; }
.name-dot { color: #ed4c58; }.focus-corner { border-color: #dce5f3; width: 28px; height: 8px; }
.eyebrow { color: #8dc4ff; }.hero-stage { padding-bottom: 125px; }
.automotive-line { position: absolute; bottom: 62px; left: 50%; transform: translateX(-50%); width: min(620px,80%); height: 92px; color: #c6d0df; opacity: .38; pointer-events: none; }
.automotive-line svg { width: 100%; height: 100%; }
.btn-accent,.btn-quiet { border-radius: 1px; letter-spacing: .025em; }.btn-accent { background: #2464bd; border-color: #3979d0; color: #fff; }.btn-accent:hover { background: #3479dc; border-color: #78b9ff; color: #fff; }
.status-dot { background: #ec4651; box-shadow: none; border-radius: 1px; transform: skewX(-15deg); }
.content-section { border-top-color: #ffffff1c; }.content-section h2,.page-heading h1,.video-project h2 { font-weight: 700; }
.photo-window { border-bottom: 3px solid #347acb; }.photo-card:nth-child(3n) .photo-window { border-color: #e34a55; }
.photo-caption { padding-inline: 3px; }.play-badge { border-radius: 2px; border-color: #ffffff60; }
.email-panel { background: linear-gradient(130deg,#262a32,#17191e); border-color: #ffffff30; border-left: 3px solid #e4424e; border-radius: 1px; }.email-panel:hover { border-color: #78b9ff; }
.resume-block h2::before { content: "// "; color: #e4424e; }.skill-list li { background: #ffffff04; border-radius: 1px; }
.portfolio-home footer { border-top: 3px solid; border-image: linear-gradient(90deg,#58a9e6,#244e9b 40%,#df3946 75%,#df3946) 1; }
.contact-form .form-control,.contact-form .form-select { border-radius: 2px; }.contact-form .form-check-input:checked { background-color: #286ac9; }
@media (max-width: 767px) { .hero-stage { padding-bottom: 115px; }.automotive-line { bottom: 66px; height: 65px; }.site-nav .nav-link.active { box-shadow: none; color: #8dc4ff; } }
@media print { .automotive-line { display: none; } }

/* Silver / electric blue / red: a brighter motorsport edition. */
@media screen {
    :root { --ink: #17202d; --paper: #18212e; --accent: #1756a9; --muted: #536173; }
    body.portfolio-home { background: #f2f4f7; color: var(--ink); }
    .portfolio-home .site-nav { background: #fffffffa !important; border-bottom-color: #d5dce5; }
    .site-nav .navbar-brand { color: #17202d; }
    .site-nav .navbar-brand:hover { color: #1756a9; }
    .site-nav .nav-link { color: #526074; }
    .site-nav .nav-link:hover,.site-nav .nav-link.active { color: #154f9c; }
    .site-nav .navbar-toggler { border-color: #adbacb; }
    .site-nav .navbar-toggler-icon { filter: invert(1); }
    .site-nav::after { height: 4px; background: linear-gradient(90deg,#57b5ee 0 33.33%,#173e88 33.33% 66.66%,#e63845 66.66%); }
    .hero { background: linear-gradient(115deg,#f8fafc 0%,#e8eef5 50%,#cedceb 100%); }
    .hero-glow { width: 41%; height: 140%; top: -16%; left: auto; right: -18%; transform: skewX(-24deg); background: linear-gradient(90deg,#4eacec 0 30%,#194b9e 30% 65%,#e63948 65%); opacity: .92; }
    .hero::before { width: min(950px,110vw); height: min(950px,110vw); background: repeating-conic-gradient(from 220deg,#274b7440 0deg .35deg,transparent .35deg 6deg); }
    .hero::after { left: 0; right: 0; height: 200px; background: linear-gradient(108deg,transparent 20%,#3e91d80e 20% 38%,transparent 38% 40%,#194b9e0c 40% 57%,transparent 57%); }
    .hero-topline,.hero-bottomline { color: #465970; }
    .hero-topline { position: relative; z-index: 1; }
    .hero-stage { position: relative; z-index: 1; }
    .focus-name { color: #17202d; text-shadow: 0 2px 0 #ffffffb0; }
    .focus-name > span:not(.name-dot) { color: #194b9e; }
    .name-dot { color: #df263d; }
    .focus-corner { border-color: #3679bc; }
    .welcome { color: #263c58; font-weight: 600; }
    .eyebrow { color: #235b9d; }
    .hero-description { color: #4b5c70; }
    .hero-bottomline { position: relative; z-index: 1; border-top-color: #1836582b; }
    .hero-bottomline a { color: #354f6b; }
    .hero-bottomline a:hover { color: #0b438b; }
    .automotive-line { color: #224d7a; opacity: .55; }
    .btn-accent { background: #1559b5; border-color: #1559b5; color: #fff; box-shadow: 4px 4px 0 #172f5620; }
    .btn-accent:hover { background: #10458e; border-color: #10458e; color: #fff; }
    .btn-quiet { color: #243c58; border-color: #7c8fa7; background: #ffffff70; }
    .btn-quiet:hover { color: #10458e; border-color: #1559b5; background: #fff; }
    .content-section { border-top-color: #cdd6e1; background: #fff; }
    .work-section { background: #e5ebf3; }
    .contact-section { position: relative; background: #164e9d; color: #fff; }
    .contact-section .eyebrow { color: #d2e6ff; }
    .contact-section .muted-copy { color: #dae6f7; }
    .contact-section .btn-accent { background: #fff; color: #164e9d; border-color: #fff; }
    .profile-photo { border-color: #acbace; box-shadow: 12px 12px 0 #dfe8f2; }
    .photo-card { color: #17202d; }
    .photo-card:hover h3 { color: #1559b5; }
    .photo-window { border-bottom-width: 4px; }
    #portfolio .row > .col-md-4:nth-child(2) .photo-window { border-bottom-color: #173e88; }
    #portfolio .row > .col-md-4:nth-child(3) .photo-window { border-bottom-color: #e63845; }
    .play-badge { background: #ffffffed; color: #164e9d; border-color: #fff; }
    .photo-caption p { color: #536173; }
    .photo-caption > span { color: #1559b5; }
    .page-heading { position: relative; }
    .page-heading::before { content: ""; display: block; width: 88px; height: 7px; margin-bottom: 28px; transform: skewX(-24deg); background: linear-gradient(90deg,#57b5ee 0 33.33%,#173e88 33.33% 66.66%,#e63845 66.66%); }
    .page-heading h1 { color: #172b46; }
    .video-project,.resume-block,.page-cta { border-color: #c5d0de; }
    .video-project { background: #fff; padding-inline: 26px; margin-bottom: 24px; border: 1px solid #d6dfea; box-shadow: 0 5px 16px #16365e06; }
    .project-role span { color: #273c55; }
    .email-panel { background: linear-gradient(120deg,#fff,#e3ebf7); color: #172b46; border-color: #bccbdc; border-left-color: #e63845; box-shadow: 0 8px 24px #17365809; }
    .email-panel:hover { border-color: #1756a9; }
    .resume-block { padding-inline: 20px; }
    .skill-list li { border-color: #c5d0de; background: #e8eef6; }
    .gallery-card { background: #fff; border-color: #cad5e2; color: #18212e; }
    .portfolio-home .btn-outline-primary,.portfolio-home .btn-outline-secondary { color: #1756a9; border-color: #7e9ab9; }
    .portfolio-home .btn-outline-primary:hover,.portfolio-home .btn-outline-secondary:hover { color: #fff; background: #1756a9; }
    .contact-form { padding: 28px; background: #fff; border: 1px solid #cfdae7; border-top: 4px solid #1756a9; }
    .contact-form .form-control,.contact-form .form-select { background-color: #f8fafc; color: #17202d; border-color: #a9b8ca; color-scheme: light; }
    .contact-form .form-label,.contact-form .form-check-label { color: #263c58; }
    .contact-form .form-control:focus,.contact-form .form-select:focus { border-color: #1756a9; box-shadow: 0 0 0 .2rem #1756a920; }
    .portfolio-home footer { background: #e3e8ef !important; color: #34475e !important; }
    .portfolio-home footer .text-white-50 { color: #536173 !important; }
    @media (max-width: 767px) {
        .hero-glow { right: -38%; width: 52%; opacity: .65; }
        .hero-topline { padding-right: 12px; }
        .video-project { padding-inline: 16px; }
        .contact-form { padding: 20px; }
        .resume-block { padding-inline: 0; }
    }
}

/* Sequential shift gate navigation and shared racing livery. */
.gear-readout { display: flex; align-items: center; gap: 10px; margin-left: auto; padding: 8px 18px; border-right: 1px solid #b7c5d8; }
.gear-readout > span { font: .6rem monospace; letter-spacing: .17em; color: #536173; }
.gear-readout strong { font: italic 800 2rem Arial,sans-serif; color: #194b9e; line-height: 1; }
.gear-gate { position: relative; gap: 8px; margin-left: 20px !important; padding: 6px 9px; background: #e6ecf3; border: 1px solid #c4cfdd; border-radius: 6px; }
.gear-gate::before { content: ""; position: absolute; height: 3px; left: 27px; right: 27px; top: 50%; background: #a2b1c5; }
.gear-gate .nav-item { position: relative; }
.site-nav .gear-gate .nav-link { display: grid; grid-template-columns: 24px 1fr; align-items: center; column-gap: 9px; position: relative; min-width: 115px; margin: 0; padding: 10px 14px 15px; border: 1px solid #c0ccdc; border-radius: 3px; background: #f8fafd; color: #4a5c74; box-shadow: 0 2px 0 #afbdd0; transition: transform .16s, background .16s, border-color .16s; }
.gear-number { font: italic 800 1.2rem Arial,sans-serif; color: #72859e; }
.gear-label { font-size: .77rem; font-weight: 700; text-transform: uppercase; letter-spacing: .035em; }
.gear-pin { position: absolute; bottom: 4px; left: calc(50% - 3px); width: 6px; height: 6px; border-radius: 50%; background: #a9b8cb; }
.site-nav .gear-gate .nav-link.active { background: #194b9e; border-color: #194b9e; color: #fff; box-shadow: 0 3px 0 #102c5e; transform: translateY(-3px); }
.gear-gate .active .gear-number { color: #fff; }.gear-gate .active .gear-pin { background: #f04a59; }
.site-nav .gear-gate .nav-link:hover { border-color: #3278c7; transform: translateY(-3px); color: #194b9e; }
.site-nav .gear-gate .nav-link.active:hover { color: #fff; }
.site-nav .gear-gate .nav-link:active { transform: translateY(2px); box-shadow: none; }
@media screen {
    main { position: relative; isolation: isolate; overflow: clip; }
    .home-content { position: relative; }
    main > .container::before { content: ""; position: absolute; z-index: -1; pointer-events: none; right: -105px; top: 0; width: 270px; height: 340px; transform: skewX(-24deg); background: linear-gradient(90deg,#57b5ee22 0 33.33%,#173e881a 33.33% 66.66%,#e6384519 66.66%); }
    .content-section { position: relative; isolation: isolate; overflow: hidden; }
    .content-section::after { content: ""; position: absolute; z-index: -1; right: -75px; top: 0; bottom: 0; width: 170px; transform: skewX(-24deg); background: linear-gradient(90deg,#57b5ee18 0 33.33%,#173e8810 33.33% 66.66%,#e6384512 66.66%); pointer-events: none; }
    .content-section .container { position: relative; z-index: 1; }
    .video-project { border-left: 4px solid #57b5ee; }.video-project:nth-of-type(2) { border-left-color: #173e88; }.video-project:nth-of-type(3) { border-left-color: #e63845; }
    .resume-block h2::before { content: ""; display: inline-block; width: 30px; height: 8px; margin-right: 10px; transform: skewX(-24deg); background: linear-gradient(90deg,#57b5ee 0 33.33%,#173e88 33.33% 66.66%,#e63845 66.66%); }
    .email-panel { border-left: 0; border-top: 4px solid; border-image: linear-gradient(90deg,#57b5ee 0 33.33%,#173e88 33.33% 66.66%,#e63845 66.66%) 1; }
    .contact-form { border-top: 4px solid; border-image: linear-gradient(90deg,#57b5ee 0 33.33%,#173e88 33.33% 66.66%,#e63845 66.66%) 1; }
}
@media (max-width: 991px) and (min-width: 768px) { .site-nav .gear-gate .nav-link { min-width: 91px; padding-inline: 8px; column-gap: 4px; }.gear-readout { padding-inline: 10px; }.gear-gate { margin-left: 10px !important; gap: 5px; } }
@media (max-width: 767px) { .gear-readout { margin-top: 18px; margin-left: 0; border-right: 0; padding: 8px 0; }.gear-gate { display: grid; grid-template-columns: 1fr 1fr; margin: 8px 0 4px !important; gap: 12px; padding: 12px; }.gear-gate::before { display: none; }.site-nav .gear-gate .nav-link { min-width: 0; }.gear-readout strong { font-size: 1.5rem; } }
@media print { .gear-readout { display: none; } }

.social-section h2 { font-size: clamp(1.6rem,3vw,2.2rem); font-weight: 700; letter-spacing: -.04em; margin-bottom: 24px; }.instagram-card { display: flex; align-items: center; gap: 18px; padding: 25px; max-width: 540px; color: #172b46; text-decoration: none; background: #fff; border: 1px solid #c7d3e2; border-left: 4px solid #1756a9; transition: border-color .2s,transform .2s; }.instagram-card:hover { color: #1756a9; border-color: #1756a9; transform: translateY(-2px); }.instagram-icon { width: 44px; height: 44px; flex-shrink: 0; color: #1756a9; }.instagram-icon svg { width: 100%; height: 100%; }.instagram-card strong,.instagram-card > span > span { display: block; }.instagram-card > span > span { color: #536173; font-size: .9rem; margin-top: 5px; }.social-arrow { margin-left: auto; font-size: 1.5rem; }.footer-social { color: inherit; text-decoration: none; font-size: .75rem; text-underline-offset: 4px; }.footer-social:hover { text-decoration: underline; }