/* Aura Web Development — consolidated styles; single source of truth.
   Source order preserved from the working site. Keep edits in this file. */


/* ============================================================
   styles.css: Foundation
   ============================================================ */
/* Aura v10 — full-bleed independent web studio / discreet indie-web personality */
:root{
  color-scheme:light;
  --ink:#243242; --body:#4f5b68; --mute:#667480; --navy:#172739;
  --deep:#111f2c; --deep2:#1d3045; --sky:#56a8dc; --blue:#3177b1;
  --light-blue:#dbeaf4; --ice:#edf5f9; --paper:#fff;
  --faint:#f4f7f9; --line:#dce4e9; --orange:#e8ae78;
  --font:'Aptos','Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono','SFMono-Regular','Cascadia Code',Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 15px/1.65 var(--font);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}button{cursor:pointer}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #7cb7e1;outline-offset:3px}
img,svg{max-width:100%}img{display:block}button{color:inherit}
[hidden]{display:none!important}
p,h1,h2,h3,dl{margin:0}h1,h2,h3{font-weight:690;letter-spacing:-.04em;line-height:1.14}
h1{font-size:clamp(39px,4.7vw,60px)}h2{font-size:clamp(27px,3.1vw,39px)}h3{font-size:23px}
/* Wider site-wide content area; section backgrounds remain full-bleed. */
.container{width:min(1520px,calc(100% - 72px));margin-inline:auto}
.section-pad{padding:94px 0}.mono,.section-kicker,.overline,.eyebrow{font-family:var(--mono)}
.skip{position:absolute;left:12px;top:-200px;padding:12px 17px;background:#fff;z-index:1000;box-shadow:0 3px 18px #0002}.skip:focus{top:12px}
/* Nav */
.site-header{position:relative;z-index:10;background:#fff;box-shadow:0 1px 0 #e6edf2}
.header-inner{height:82px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.brand{display:inline-flex;align-items:center;gap:9px;flex-shrink:0}
.brand-symbol{width:33px;height:33px;color:#fff;background:var(--navy);display:flex;justify-content:center;align-items:center;border-radius:3px}
.brand-symbol svg{width:23px;height:23px}
.brand-name{font-size:30px;font-weight:800;line-height:1;letter-spacing:-.075em}
.brand-name>span,.footer-logo>span{color:var(--blue)}
.brand-note{color:#82909b;font-size:10px;font-weight:640;line-height:1.2;max-width:90px;border-left:1px solid var(--line);padding-left:12px;margin-left:4px}
.primary-nav{display:flex;align-items:center;gap:29px;font-size:13px;font-weight:620}
.primary-nav>a{padding:9px 1px;color:#4a5967;transition:color .2s}
.primary-nav .nav-cta{background:var(--navy);color:#fff;padding:11px 17px;border-radius:3px;display:flex;gap:20px}
.primary-nav .nav-cta:hover,.primary-nav .nav-cta.is-current{background:#286599;color:#fff}
.menu-toggle{display:none;border:1px solid #d6e1e8;background:#fff;padding:7px 12px;border-radius:3px;font-size:12px;font-weight:700}
/* Shared interactions */
.button{display:inline-flex;justify-content:center;align-items:center;gap:40px;min-height:48px;padding:12px 19px;font-size:13px;font-weight:720;border:0;border-radius:3px;transition:transform .18s,background .18s;white-space:nowrap}
.button:hover{transform:translateY(-2px)}
.button-blue{background:var(--blue);color:#fff}.button-blue:hover{background:#245f92}
.button-ink{background:var(--navy);color:#fff}.button-ink:hover{background:#345a7e}
.quiet-link,.small-link,.text-link{display:inline-flex;gap:13px;align-items:center;font-weight:700;font-size:13px;color:var(--ink);border-bottom:1px solid #c0d1de;padding:3px 0}
.quiet-link:hover,.small-link:hover,.text-link:hover{color:var(--blue);border-color:var(--blue)}
.section-kicker{display:block;color:#3575aa;font-size:10px;font-weight:700;letter-spacing:.075em;margin-bottom:16px}
.section-kicker.light{color:#85c8f6}
.heading-alt{color:#2d78ac}
/* Hero */
.home-hero{background:#fff;position:relative;overflow:hidden}
.home-hero:before{content:'';position:absolute;right:-200px;top:-350px;height:650px;width:650px;border-radius:50%;background:radial-gradient(circle,#d9ecf75e,transparent 64%);pointer-events:none}
.hero-layout{min-height:575px;padding:64px 0 73px;display:grid;grid-template-columns:1.06fr .94fr;align-items:center;gap:72px;position:relative}
.hero-content{padding:11px 0}
.overline{font-size:10px;letter-spacing:.02em;color:#657687;display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-weight:650}
.live-dot{display:inline-block;width:8px;height:8px;flex-shrink:0;background:#57a7df;box-shadow:0 0 0 3px #cbe6f7}
.soft-sep{color:#a0aeb8}
.hero-content h1{margin-top:27px;margin-bottom:20px;max-width:590px;letter-spacing:-.048em}
.hero-content .intro{font-size:16px;line-height:1.77;color:var(--body);max-width:520px}
.hero-actions{display:flex;align-items:center;gap:27px;flex-wrap:wrap;margin-top:29px}
.hero-signature{display:flex;align-items:center;gap:12px;margin-top:51px;color:#8695a3;font-size:9px;font-weight:690;letter-spacing:.045em;flex-wrap:wrap}
.hero-signature i{width:4px;height:4px;background:var(--orange);border-radius:50%}
.hero-terminal{background:var(--deep);color:#d6e8f4;box-shadow:14px 15px 0 #dfeaf1;min-width:0;position:relative}
.console-bar,.console-footer,.skills-console-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-family:var(--mono)}
.console-bar{min-height:40px;padding:0 18px;background:#253b50;color:#d0dce5;font-size:10px}
.console-id{display:flex;align-items:center;gap:10px}
.console-square{width:10px;height:10px;display:inline-block;background:#62a9d4;box-shadow:3px -3px 0 #3c7093}
.console-buttons{color:#8ea4b5;font-size:12px}
.console-body{padding:28px 28px 30px}
.console-mini{display:grid;grid-template-columns:32px 1fr auto;gap:15px;font:550 10px var(--mono);color:#86a1b7;padding-bottom:23px}
.console-mini span:last-child{color:#8ecdd8}
.console-code{font:500 13px/2.04 var(--mono);display:flex;flex-direction:column;color:#d8e6ee}
.console-code .indent{padding-left:27px}.code-muted{color:#7d9ba8}.code-blue{color:#72c1f0}.code-yellow{color:#e7b989}
.console-response{margin-top:23px;min-height:50px;padding:13px 14px;background:#0e1d2a;font:500 12px/1.5 var(--mono);color:#d4eaf6}
.console-response .prompt{color:#9ad4f0;margin-right:9px}
.caret{display:inline-block;width:7px;height:13px;margin-left:3px;vertical-align:-2px;background:#88c3e6;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.console-action{margin-top:18px;display:inline-flex;gap:13px;font-size:11px;font-family:var(--mono);color:#89c8f3;border-bottom:1px solid #345a76;padding-bottom:5px}
.console-action:hover{color:#fff}
.console-footer{background:#243749;min-height:31px;padding:0 18px;font-size:9px;color:#97aebc}
.dot-blue{display:inline-block;width:6px;height:6px;background:#6baed5;border-radius:50%;margin-right:5px}
/* Utility strip */
.utility-ticker{background:#dcecf6;color:#315c7c}
.ticker-inner{min-height:52px;display:flex;justify-content:space-between;align-items:center;gap:14px;font:650 10px var(--mono);letter-spacing:.03em}
.ticker-inner b{color:#8daec4;font-size:16px}
/* section headings */
.section-intro{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:38px}
.section-intro h2{max-width:700px}
.section-intro p{margin-top:12px;color:var(--body);max-width:640px}
/* Overview - low border */
.home-overview{background:#fff}
.overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.overview-item{background:#f2f7fa;padding:25px 25px 26px;min-height:232px;position:relative;transition:transform .2s,background .2s;display:block}
.overview-item:nth-child(2){background:#e4f0f7}.overview-item:nth-child(3){background:#f1f3f5}
.overview-item:hover{background:#dcecf8;transform:translateY(-4px)}
.overview-icon{font-family:var(--mono);font-size:24px;line-height:1;color:#3477ab;min-height:36px}
.overview-number{position:absolute;top:29px;right:25px;color:#869ba9;font:600 10px var(--mono)}
.overview-item h3{font-size:20px;margin-top:19px;margin-bottom:9px}
.overview-item p{font-size:13px;line-height:1.65;color:var(--body);max-width:290px}
.overview-arrow{position:absolute;right:24px;bottom:17px;font-size:17px;color:#3c7cae}
/* Work previews */
.home-work{background:#f2f5f8}
.projects-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:27px}
.project-card{min-width:0}
.project-visual{display:block;position:relative;background:#d7e0e8;transition:transform .2s}
.project-visual:hover{transform:translateY(-3px)}
.browser-top{background:#e4ebf0;min-height:36px;padding:0 15px;display:flex;align-items:center;gap:14px;font:550 10px var(--mono);color:#718291}
.browser-lights{display:flex;gap:6px}.browser-lights i{width:8px;height:8px;border-radius:50%;background:#acc3d4}.browser-lights i:first-child{background:#7a9bb7}
.browser-address{background:#f6f9fb;border:1px solid #d8e4ec;border-radius:2px;padding:3px 12px;flex:1;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9px}
.browser-open{color:#3278b1}
.project-screen{aspect-ratio:1.66;position:relative;overflow:hidden;background:linear-gradient(135deg,#d8e9f6,#9fc3dd)}
.project-screen img{height:100%;width:100%;object-fit:cover;object-position:top center;position:relative;z-index:1}
.screen-loading{font:600 11px var(--mono);position:absolute;left:23px;top:28px;color:#4b7092;z-index:0}
.image-error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;padding:20px;background:linear-gradient(135deg,#d6e4ed,#adc9dd);color:#38556d;font:600 12px var(--mono)}
.image-error strong{font-size:16px;color:#29465b}
.project-meta{display:flex;align-items:start;justify-content:space-between;gap:17px;padding:20px 1px 0}
.eyebrow{color:#5e8bb0;font-size:9px;font-weight:690;letter-spacing:.06em}
.project-meta h3{font-size:22px;margin-top:8px}
.project-meta p{color:#63707c;font-size:13px;line-height:1.65;margin-top:8px;max-width:370px}
.project-meta .text-link{white-space:nowrap;font-size:11px;margin-top:15px}
/* skills visual */
.skills-preview{background:#1b2c3f;color:#f3f8fa;padding:83px 0;position:relative}
.skills-preview:after{content:'';position:absolute;right:0;top:0;bottom:0;width:42%;background-image:radial-gradient(#82b9e014 1px,transparent 1px);background-size:18px 18px;pointer-events:none}
.skills-layout{display:grid;grid-template-columns:.8fr 1fr;gap:95px;align-items:center;position:relative;z-index:1}
.skills-layout h2{margin-bottom:16px;max-width:420px}.skills-layout p{max-width:420px;color:#aabfce;line-height:1.75;margin-bottom:22px}
.small-link.white{color:#e5f2fa;border-color:#5d8aab}.small-link.white:hover{color:#80c0ec}
.skills-console{background:#243a50;box-shadow:8px 8px 0 #12202e}
.skills-console-head{background:#35526d;padding:10px 15px;font:600 10px var(--mono);color:#c1d8e7}
.skill-tags{padding:27px;display:flex;flex-wrap:wrap;gap:9px}
.skill-tags span{display:inline-block;background:#31516b;color:#e1f0f9;padding:9px 11px;font:600 11px var(--mono)}
.skill-tags span:nth-child(5n+2){background:#396685}.skill-tags span:nth-child(5n+4){background:#355772}
.skills-console p{font:550 10px var(--mono);padding:11px 25px 16px;margin:0;color:#9bc6e0;border-top:1px solid #3b5266;max-width:none}
.cursor-static{color:#d0e8f8}
.home-cta,.compact-cta{background:#e3f0f8;padding:65px 0}
.cta-layout,.compact-cta>.container{display:flex;align-items:center;justify-content:space-between;gap:35px}
.cta-layout h2,.compact-cta h2{margin-bottom:11px}
.cta-layout p,.compact-cta p{color:#4b6172;max-width:610px}
/* Inner pages */
.inner-hero{background:#eff5f9;padding:52px 0 69px;position:relative;overflow:hidden}
.inner-hero:before{content:'';position:absolute;right:2%;top:-160px;width:530px;height:530px;border-radius:50%;border:110px solid #dcebf480;pointer-events:none}
.inner-hero .container{position:relative}
.breadcrumbs{display:flex;align-items:center;gap:12px;font:600 11px var(--mono);color:#6e879c;margin-bottom:56px}
.breadcrumbs a:hover{text-decoration:underline;color:#315f8b}
.inner-hero h1{font-size:clamp(38px,4.7vw,56px);margin-bottom:17px}
.inner-hero p{font-size:16px;line-height:1.7;color:var(--body);max-width:625px}
/* Work detail */
.work-detail{background:#fff}
.work-overview{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:26px}
.work-overview-title>.mono{font-size:10px;color:#6694b7;font-weight:650}
.work-overview-title h2{margin-top:11px}
.project-switch{display:flex;gap:6px;flex-wrap:wrap}
.project-switch-btn{border:0;background:#ecf2f6;padding:12px 15px;font:600 11px var(--mono);color:#5f7383;transition:background .15s}
.project-switch-btn:hover{background:#dceaf4}
.project-switch-btn.is-active{background:#236a9e;color:#fff}
.project-detail-panel{background:#f1f6f9;padding:24px}
.work-feature-top{display:flex;align-items:center;justify-content:space-between;gap:20px;font:650 10px var(--mono);color:#476b86;margin-bottom:15px}
.work-feature-top a:hover{color:#277bbb;text-decoration:underline}
.feature-shot{width:100%;background:#d3e0ec}
.feature-shot .project-screen{aspect-ratio:2.1;max-height:510px}
.feature-description{display:grid;grid-template-columns:.9fr 1.1fr;gap:35px;padding:31px 7px 9px}
.feature-description h3{font-size:29px;margin-top:8px}
.feature-description p{color:var(--body);line-height:1.75;margin-bottom:16px}
.feature-chips{display:flex;flex-wrap:wrap;gap:7px;margin:19px 0}
.feature-chips span{background:#dfebf3;color:#4b6f88;padding:7px 9px;font:600 10px var(--mono)}
.preview-note{font-size:11px;line-height:1.7;color:#6b8395;margin-top:20px;max-width:730px}
/* Services page */
.service-row{display:grid;grid-template-columns:65px minmax(0,1fr) 230px;gap:28px;padding:36px 0;border-bottom:1px solid #e4eaf0;scroll-margin-top:30px}
.service-row:first-child{padding-top:0}.service-row:last-child{border-bottom:0;padding-bottom:0}
.service-index{font:700 11px var(--mono);color:#6694b7;padding-top:10px}
.service-title{display:flex;align-items:center;gap:18px;margin-bottom:14px}
.service-title>span{font:700 22px var(--mono);color:#3179b0;background:#eaf3f9;width:50px;height:50px;display:grid;place-items:center;flex-shrink:0}
.service-title h2{font-size:25px}
.service-row p{color:var(--body);max-width:540px;line-height:1.75}
.service-items{display:flex;flex-direction:column;gap:8px;align-self:center;font-size:13px;font-weight:640;color:#52718a}
.service-items span:before{content:'↗';color:var(--blue);margin-right:10px}
.capabilities{background:var(--navy);color:#fff;scroll-margin-top:30px}
.capabilities-title{max-width:640px}
.capabilities-title h2{margin-bottom:15px}
.capabilities-title p{color:#b1c3d1;line-height:1.75}
.capability-categories{display:grid;grid-template-columns:1fr 1fr;gap:29px 47px;margin-top:40px}
.capability-label{font:650 11px var(--mono);color:#82c7ef;letter-spacing:.02em}
.capability-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}
.capability-pills span{padding:9px 13px;background:#2a455d;color:#e3f1f8;font:600 12px var(--mono)}
/* About */
.about-story{background:#fff}
.about-layout{display:grid;grid-template-columns:.95fr 1fr;align-items:center;gap:95px}
.about-window{background:#203349;color:#d9eaf8;box-shadow:10px 10px 0 #d7e4ee}
.about-window-body{padding:25px 29px}
.ascii-star{font:400 46px/1 var(--mono);color:#8dc7ec;margin-bottom:25px}
.about-window dl{display:grid;gap:0}
.about-window dl>div{display:grid;grid-template-columns:90px 1fr;gap:20px;padding:11px 0;border-bottom:1px solid #41566c}
.about-window dt{font:600 10px var(--mono);color:#7facc9}
.about-window dd{margin:0;font-size:13px}
.about-end{font:500 10px var(--mono);color:#9fc8de;display:block;margin-top:19px}
.about-prose h2{margin-bottom:18px}
.about-prose p{margin:0 0 16px;color:var(--body);line-height:1.8}
.about-prose .small-link{margin-top:9px}
.how-work{background:#f0f5f8}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.steps>div{background:#fff;padding:29px 25px;min-height:180px}
.steps span{font:700 12px var(--mono);color:#4789b9}
.steps h3{font-size:19px;margin:17px 0 10px}
.steps p{font-size:13px;color:var(--body)}
/* Contact */
.contact-page{background:#fff}
.contact-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px;align-items:start}
.contact-aside h2{margin-bottom:16px}
.contact-aside>p{max-width:320px;color:var(--body);line-height:1.8}
.email-display{display:inline-flex;align-items:center;gap:10px;border-bottom:1px solid #bad1df;color:#2b6e9d;font-weight:700;margin-top:27px;word-break:break-word}
.contact-note{display:flex;align-items:flex-start;gap:14px;color:#728697;font-size:12px;margin-top:46px;line-height:1.7}
.contact-note .live-dot{margin-top:7px}
.message-form{background:#f1f5f8;box-shadow:9px 10px 0 #e0ebf2}
.form-top{background:#dfebf4;padding:11px 19px;color:#547893;display:flex;justify-content:space-between;align-items:center;font:650 11px var(--mono)}
.form-fields{padding:26px 28px 30px}
.form-row{margin-bottom:19px}
.form-row label{display:block;font-size:12px;font-weight:700;margin-bottom:7px}
.form-row label span{color:#347bb1}
.form-row label small{font-size:11px;color:#8c9ba6;font-weight:500}
.form-row input,.form-row textarea{width:100%;background:#fff;border:1px solid #d5e2ec;border-radius:2px;padding:13px 13px;color:var(--ink);outline-offset:0;font-size:13px}
.form-row textarea{resize:vertical;min-height:134px}
.form-row input:focus,.form-row textarea:focus{border-color:#4a95c8;outline:2px solid #a9d2ea}
.form-row ::placeholder{color:#97a5af}
.send-row{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.send-row .mono{font-size:9px;color:#8a9bab}
.visually-hidden{position:absolute!important;overflow:hidden;clip-path:inset(50%);height:1px;width:1px;white-space:nowrap}
/* Small pages */
.simple-page{min-height:480px;background:#f7f9fb}
.narrow{max-width:760px}
.simple-page h1{font-size:clamp(36px,5vw,55px);margin:10px 0 20px}
.simple-page p{line-height:1.8;color:var(--body);margin-bottom:17px}
.simple-page p>a{color:#2c78b1;text-decoration:underline}
.simple-page .button{margin-top:16px}
/* Footer -- intentionally NO project links */
.footer{background:#122333;color:#cddae5;padding-top:65px}
.footer-main{display:flex;align-items:start;justify-content:space-between;gap:35px;padding-bottom:58px}
.footer-logo{font-size:38px;font-weight:800;letter-spacing:-.075em;line-height:1}
.footer-logo span{color:#70b8e8}
.footer-main p{font-size:13px;line-height:1.75;color:#a6bac9;margin-top:15px}
.footer-navigation{display:flex;gap:100px;flex-wrap:wrap}
.footer-navigation>div{display:flex;flex-direction:column;gap:11px;font-size:12px}
.footer-title{font:650 10px var(--mono);color:#73b7e1;margin-bottom:5px;letter-spacing:.065em}
.footer-navigation a:hover{color:#8dd0fc}
.footer-base{border-top:1px solid #304151;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:11px;color:#839eb1}
.footer-base .mono{font-size:10px}
/* responsive */
@media(max-width:1080px){
  .container{width:min(100% - 64px,1520px)}
  .hero-layout{gap:39px}
  .hero-content h1{font-size:clamp(37px,4.5vw,54px)}
  .console-code{font-size:12px}
  .skills-layout,.about-layout{gap:50px}
  .contact-layout{gap:55px}
  .project-meta{flex-direction:column;gap:0}
  .project-meta .text-link{margin-top:13px}
}
@media(max-width:790px){
  .container{width:calc(100% - 46px)}
  .header-inner{height:70px}
  .primary-nav{gap:15px;font-size:12px}
  .primary-nav .nav-cta{padding:8px 11px;gap:9px}
  .hero-layout{grid-template-columns:1fr;gap:37px;padding:57px 0 66px;min-height:0}
  .hero-content h1{font-size:clamp(42px,7vw,55px)}
  .hero-signature{margin-top:27px}
  .hero-terminal{width:100%;max-width:630px;justify-self:center}
  .section-pad{padding:68px 0}
  .ticker-inner{font-size:9px;flex-wrap:wrap;justify-content:center;gap:8px 14px;padding:12px 0}
  .overview-grid{gap:12px}
  .overview-item{min-height:245px;padding:22px 17px}
  .overview-item h3{font-size:18px}
  .overview-item p{font-size:12px}
  .overview-number{right:18px;top:26px}
  .projects-grid{gap:18px}
  .skills-layout{grid-template-columns:1fr;gap:30px}
  .skills-layout p{max-width:610px}
  .work-overview{align-items:start;flex-direction:column}
  .service-row{grid-template-columns:38px 1fr 190px;gap:16px}
  .service-title h2{font-size:22px}
  .about-layout{grid-template-columns:1fr;gap:45px}
  .about-window{max-width:570px;width:100%}
  .contact-layout{grid-template-columns:1fr;gap:36px}
  .contact-note{margin-top:24px}
  .footer-navigation{gap:50px}
}
@media(max-width:610px){
  .container{width:calc(100% - 40px)}
  .header-inner{height:auto;min-height:66px;position:relative;flex-wrap:wrap}
  .brand-name{font-size:28px}.brand-note{font-size:9px}
  .menu-toggle{display:flex;align-items:center;gap:7px;margin-left:auto}
  .primary-nav{display:none;position:absolute;top:100%;left:-20px;right:-20px;background:#fff;box-shadow:0 9px 18px #1a2c3b18;padding:12px 20px 20px;z-index:50;flex-direction:column;align-items:stretch;gap:0}
  .primary-nav.is-open{display:flex}
  .primary-nav>a{padding:12px 6px;border-bottom:1px solid #edf1f3}
  .primary-nav .nav-cta{margin-top:13px;display:flex;justify-content:space-between;padding:12px 14px}
  .hero-layout{padding:49px 0 54px;gap:38px}
  .hero-content h1{font-size:clamp(37px,9vw,49px);line-height:1.12;margin:21px 0 16px}
  .hero-content .intro{font-size:15px}
  .hero-actions{gap:17px}
  .hero-terminal{box-shadow:6px 7px 0 #dce9f2}
  .console-body{padding:20px}
  .console-code{font-size:11px;line-height:1.95}
  .console-response{font-size:10px}
  .ticker-inner{gap:6px 12px;line-height:1.8;font-size:8px}
  .ticker-inner b:nth-of-type(2){display:none}
  .section-intro{align-items:start;flex-direction:column;gap:12px;margin-bottom:24px}
  .section-pad{padding:57px 0}
  h2{font-size:clamp(28px,7.5vw,36px)}
  .overview-grid,.projects-grid,.steps{grid-template-columns:1fr}
  .overview-item{min-height:0;padding:21px 22px 23px}
  .overview-item h3{margin-top:10px}
  .overview-icon{font-size:21px}
  .overview-item p{max-width:90%;font-size:13px}
  .project-screen{aspect-ratio:1.58}
  .project-meta{padding:15px 0 4px}
  .project-meta h3{font-size:21px}
  .project-card+.project-card{margin-top:14px}
  .skills-preview{padding:62px 0}
  .skill-tags{padding:17px}
  .skill-tags span{font-size:10px}
  .cta-layout,.compact-cta>.container{align-items:flex-start;flex-direction:column;gap:24px}
  .home-cta,.compact-cta{padding:50px 0}
  .inner-hero{padding:28px 0 48px}
  .breadcrumbs{margin-bottom:43px}
  .inner-hero h1{font-size:clamp(37px,8.5vw,46px)}
  .inner-hero p{font-size:15px}
  .project-switch{gap:5px}
  .project-switch-btn{padding:11px;font-size:10px}
  .project-detail-panel{padding:13px}
  .feature-shot .project-screen{aspect-ratio:1.6}
  .feature-description{grid-template-columns:1fr;gap:10px;padding:25px 4px 8px}
  .feature-description h3{font-size:25px}
  .work-feature-top{font-size:9px;align-items:flex-start}
  .service-row{grid-template-columns:33px 1fr;gap:15px;padding:29px 0}
  .service-row .service-items{grid-column:2;flex-direction:row;flex-wrap:wrap;gap:10px 15px}
  .service-title{gap:12px}
  .service-title>span{width:38px;height:38px;font-size:18px}
  .service-title h2{font-size:21px}
  .capability-categories{grid-template-columns:1fr;gap:28px}
  .capability-pills span{font-size:11px;padding:8px 11px}
  .about-window-body{padding:21px}
  .contact-aside .email-display{font-size:13px}
  .form-fields{padding:21px 18px 26px}
  .footer{padding-top:48px}
  .footer-main{flex-direction:column;gap:34px;padding-bottom:36px}
  .footer-navigation{width:100%;justify-content:space-between;gap:24px}
  .footer-base{padding:18px 0;flex-wrap:wrap;min-height:0;gap:6px}
}
@media(max-width:375px){
  .container{width:calc(100% - 32px)}
  .primary-nav{left:-16px;right:-16px}
  .hero-content h1{font-size:35px}
  .brand-symbol{height:29px;width:29px}.brand-name{font-size:26px}
  .brand-note{max-width:70px;font-size:8px;padding-left:8px}
  .overline{font-size:9px}
  .hero-actions{align-items:flex-start;flex-direction:column}
  .console-mini{gap:8px}
  .console-code{font-size:10px}
  .footer-navigation{gap:12px}
  .work-feature-top{flex-direction:column;gap:6px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}


/* ══ Aura v11 : v9 browser personality + v10 content, pages and full-bleed sections ══ */
:root {--navy:#1b2e42;--blue:#3779aa;--sky:#63aedb;--ice:#eaf3fa;--orange:#e9b488}
html{scroll-behavior:smooth}
/* Quiet animated underscore: a nod to classic computing without a terminal theme. */
.brand-name .brand-cursor{display:inline-block;color:#397cad;font-weight:520;letter-spacing:-.10em;animation:aura-cursor-blink 1.15s steps(1,end) infinite}
@keyframes aura-cursor-blink{50%{opacity:0}}
.site-header{box-shadow:0 1px 0 #e8eef3}
.hero-layout{grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:62px;min-height:565px}
.hero-content h1{font-size:clamp(35px,3.9vw,51px);line-height:1.18;letter-spacing:-.048em}
.hero-content .intro{font-size:15px}
.hero-content .hero-signature{margin-top:42px}
.heading-alt{color:#376e9c}
.home-hero:before{right:-290px;top:-390px;opacity:.43}
/* A miniature clickable desktop: old web references via structure rather than a faux coding console. */
.hero-workspace{background:#1c2e40;min-width:0;color:#dbe9f3;box-shadow:8px 9px 0 #dce7ef;isolation:isolate;position:relative;font-family:var(--mono)}
.workspace-titlebar{height:36px;background:#1b2c3d;display:flex;align-items:center;gap:9px;padding:0 13px;font-size:10px;color:#b4cbdc}
.workspace-appicon{font-size:13px;color:#7cb6dd}
.window-controls{display:flex;gap:5px;margin-left:auto}
.window-controls i{width:8px;height:8px;border:1px solid #91b1c9;display:block;opacity:.8}
.window-controls i:last-child{border-color:#aac8d9;position:relative}
.workspace-body{display:grid;grid-template-columns:114px minmax(0,1fr);min-height:335px}
.workspace-sidebar{padding:20px 8px 10px;background:#223649;display:flex;flex-direction:column;gap:7px;min-width:0}
.workspace-caption{color:#8ea9bd;font-size:9px;letter-spacing:.04em;margin:0 4px 9px}
.workspace-entry{font:550 10px/1.4 var(--mono);text-align:left;color:#c1d2e0;border:0;background:transparent;padding:10px 7px;display:flex;gap:8px;align-items:center;transition:background .18s,color .18s;min-width:0}
.workspace-entry>span{font-size:10px;color:#90bddb}
.workspace-entry:hover{background:#324d67;color:#fff}
.workspace-entry.is-active{background:#416c90;color:#fff}
.workspace-entry.is-active>span{color:#daeffc}
.workspace-version{margin-top:auto;padding:10px 4px 0;color:#7b9ab2;font-size:8px}
.workspace-desktop{background-color:#2b4761;background-image:linear-gradient(#aecce80e 1px,transparent 1px),linear-gradient(90deg,#aecce80e 1px,transparent 1px);background-size:23px 23px;display:flex;align-items:center;justify-content:center;padding:37px 20px 45px;position:relative;min-width:0}
.mini-browser{width:min(100%,380px);background:#f4f8fb;color:#283747;box-shadow:6px 7px 0 #192d41;transition:transform .25s ease,box-shadow .25s ease;position:relative;z-index:1}
.hero-workspace:hover .mini-browser{transform:translateY(-3px);box-shadow:6px 10px 0 #192d41}
.mini-titlebar{height:30px;background:#d6e6f0;display:flex;align-items:center;gap:8px;padding:0 10px;font-size:10px;font-weight:650;color:#365b79}
.mini-icon{font-size:12px;color:#3a78aa}.mini-controls{margin-left:auto;font-size:10px;color:#597e9b;white-space:nowrap}
.mini-toolbar{height:31px;display:flex;align-items:center;gap:8px;background:#eaf2f7;padding:0 10px;border-bottom:1px solid #d4e0e9;font-size:11px;color:#6d8597}
.mini-back,.mini-refresh{flex:none}
.mini-url{background:#fff;color:#547086;display:block;border:1px solid #d7e3ea;padding:4px 7px;min-width:0;flex:1;font-size:9px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.url-lock{color:#3d94bf}
.mini-page{min-height:207px;padding:23px 22px 17px;background:#f7fafd}
.mini-view{animation:mini-page-in .19s ease}
@keyframes mini-page-in{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.mini-eyebrow{font:700 9px var(--mono);color:#437ba3;letter-spacing:.045em}
.mini-view-row{display:grid;grid-template-columns:52px 1fr;gap:13px;margin-top:14px;align-items:start}
.mini-star{display:grid;place-items:center;width:52px;height:52px;background:#e4eff7;border:1px solid #bcd2e3;color:#3979ae;font-size:30px;line-height:1}
.mini-view h2{font-size:19px;letter-spacing:-.045em;line-height:1.18;color:#263b4f;margin:8px 0}
.mini-view-row h2{margin-top:0}
.mini-view p{font:400 11px/1.65 var(--font);color:#66798a;margin-bottom:11px}
.mini-view a{display:inline-flex;gap:9px;border-bottom:1px solid #a8c2d5;padding-bottom:3px;color:#346a97;font:650 10px var(--font)}
.mini-view a:hover{color:#1d4d72;border-bottom-color:#346a97}
.mini-files,.mini-mini-tags{display:flex;flex-wrap:wrap;gap:6px;margin:11px 0}
.mini-files span,.mini-mini-tags span{background:#e6f0f7;color:#4a7495;padding:6px 7px;font:600 9px var(--mono)}
.mini-statusbar{display:flex;justify-content:space-between;gap:10px;background:#e2edf5;color:#678ba6;padding:7px 10px;font-size:8px}
.mini-statusbar>span{white-space:nowrap}
.mini-online{width:5px;height:5px;background:#67a1c3;display:inline-block;margin-right:6px;border-radius:50%}
.desktop-doodle{position:absolute;right:13px;top:10px;font-size:16px;color:#88b6d6;opacity:.55;animation:quiet-sparkle 4.5s ease-in-out infinite}
@keyframes quiet-sparkle{50%{opacity:.9;transform:rotate(18deg)}}
.desktop-label{position:absolute;right:14px;bottom:13px;font:500 8px var(--mono);color:#a5c2d8}
.workspace-footer{background:#192b3b;padding:8px 13px;display:flex;justify-content:space-between;align-items:center;gap:10px;font:500 8px var(--mono);color:#a9c0cf}
.status-dot{background:#6da9cb;border-radius:50%;width:6px;height:6px;display:inline-block;margin-right:6px}
/* Quiet modern touches to carry the desktop vocabulary through the whole site. */
.browser-top{background:#dce9f1;min-height:35px}
.browser-lights i{border-radius:2px;width:8px;height:8px;background:#a4bfd1}
.browser-lights i:first-child{background:#527fa0}
.project-visual{overflow:hidden}
.project-visual img{transition:transform .35s ease}
.project-visual:hover img{transform:scale(1.025)}
.overview-item{transition:transform .23s ease,background .23s ease}
.overview-item:hover{transform:translateY(-3px)}
/* Simple browser chrome for the homepage skills panel. */
.skills-preview{background:#213449}
.skills-browser{background:#e8f0f6;color:#314b60;box-shadow:7px 8px 0 #142539;overflow:hidden}
.skills-browser .skills-console-head{background:#bdd6e6;color:#315d7b;min-height:32px;display:flex;align-items:center;justify-content:flex-start;gap:9px}
.skills-browser .skill-window-dot{font-size:12px;color:#3a7dae}
.skills-browser .skill-tags{background:#e8f1f7;gap:8px}
.skills-browser .skill-tags span,.skills-browser .skill-tags span:nth-child(5n+2),.skills-browser .skill-tags span:nth-child(5n+4){background:#fff;color:#426b89;border:1px solid #cddfea;padding:8px 10px}
.skills-browser p{background:#dceaf3;color:#5c7c96;border:0;font-size:10px}
.capability-pills span{transition:background .2s,color .2s}
.capability-pills span:hover{background:#46769a;color:#fff}
.about-browser{box-shadow:8px 8px 0 #d7e4ee}
.about-browser .about-window-body{background:#23384d}
/* Small-page behavior: no huge headings or jitter on phones. */
@media(max-width:1100px){.hero-layout{gap:40px}.mini-page{padding:18px 16px}.mini-view h2{font-size:18px}}
@media(max-width:790px){.hero-layout{grid-template-columns:1fr;gap:33px}.hero-content h1{font-size:clamp(36px,6vw,49px)}.hero-workspace{width:100%;max-width:655px;justify-self:center}.workspace-body{min-height:330px}.mini-browser{width:min(100%,410px)}.mini-page{min-height:200px}}
@media(max-width:610px){.hero-layout{padding:42px 0 55px;gap:31px}.hero-content h1{font-size:clamp(34px,8.4vw,44px)}.hero-content .intro{font-size:14px}.hero-content .hero-signature{margin-top:28px}.workspace-body{grid-template-columns:87px minmax(0,1fr);min-height:288px}.workspace-sidebar{padding:13px 4px}.workspace-entry{font-size:8px;padding:9px 5px;gap:5px}.workspace-caption{font-size:8px}.workspace-desktop{padding:21px 10px 29px}.mini-browser{box-shadow:4px 5px 0 #192d41}.mini-toolbar{gap:4px;padding:0 6px}.mini-page{min-height:188px;padding:14px 10px 12px}.mini-view h2{font-size:16px}.mini-view p{font-size:10px;line-height:1.5}.mini-view-row{grid-template-columns:1fr;gap:4px;margin-top:9px}.mini-view-row .mini-star{display:none}.mini-view a{font-size:9px}.mini-titlebar{font-size:9px}.mini-url{font-size:8px}.mini-statusbar{font-size:7px}.mini-statusbar span:last-child{display:none}.workspace-footer{font-size:7px}.mini-mini-tags span,.mini-files span{font-size:8px;padding:4px 5px}}
@media(max-width:390px){.workspace-body{grid-template-columns:71px minmax(0,1fr)}.workspace-entry{font-size:7px}.workspace-caption{font-size:7px}.workspace-desktop{padding:17px 7px 25px}.mini-page{min-height:181px}.mini-view h2{font-size:15px}.mini-view p{font-size:9px}.mini-titlebar{font-size:8px}.mini-controls{font-size:8px}}
@media(prefers-reduced-motion:reduce){.brand-name .brand-cursor,.desktop-doodle{animation:none!important}.mini-view{animation:none}.hero-workspace:hover .mini-browser,.project-visual:hover img,.overview-item:hover{transform:none}}


/* ═══ Aura v12 / identity, simpler navigation, subtle indie-web edge ═══ */
/* The supplied logo remains an unchanged, high-resolution transparent PNG. */
.brand{display:flex;align-items:center;flex:none;line-height:1}
.brand-logo{width:208px;height:auto;max-width:100%;object-fit:contain;transition:transform .22s ease,opacity .22s ease}
.brand:hover .brand-logo{transform:translateY(-1px);opacity:.88}
/* One selected state, one hover state, no ::before/::after underline layers. */
.primary-nav{gap:6px}
.primary-nav>a:not(.nav-cta){display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 14px;border-radius:4px;color:#4b5e6f;border:0;background:transparent;position:relative;transition:background-color .19s ease,color .19s ease,transform .19s ease;white-space:nowrap}
.primary-nav>a:not(.nav-cta)::before,.primary-nav>a:not(.nav-cta)::after{content:none!important;display:none!important}
.primary-nav>a:not(.nav-cta):hover{background:#e7f0f7;color:#254c6b;transform:translateY(-1px)}
.primary-nav>a.is-current:not(.nav-cta){background:#263d52;color:#f8fcff}
.primary-nav>a.is-current:not(.nav-cta):hover{background:#304d67;color:#fff}
.primary-nav .nav-cta{min-height:39px;align-items:center;margin-left:8px;border-radius:4px;background:#236a9e;transition:background-color .2s ease,transform .2s ease}
.primary-nav .nav-cta:hover{background:#184e79;transform:translateY(-1px)}
.primary-nav .nav-cta.is-current{background:#193d5b;box-shadow:inset 3px 0 0 #8bcdf1}
/* Supplied SVG wordmarks: navy logo on white header, light logo on dark footer. */
.footer-logo{display:inline-flex;align-items:center;justify-content:flex-start;max-width:100%;line-height:1;background:transparent;padding:0;border:0;border-radius:0;transition:opacity .2s ease}
.footer-logo:hover{opacity:.84}
.footer-logo-image{width:211px;height:auto;max-width:100%;object-fit:contain}
/* Small geometric touches, not a different visual theme. */
.hero-cursor{font:700 15px/1 var(--mono);color:#2f83bd;animation:aura-cursor-blink 1.15s steps(1,end) infinite;transform:translateY(-2px)}
.section-kicker{display:flex;align-items:center;gap:10px}
.section-kicker::before{content:'';display:inline-block;width:7px;height:7px;background:#347dae;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);flex:none}
.section-kicker.light::before{background:#86ccef}
/* Standard, clean button corners across the site. */
.button-blue{clip-path:none;border-radius:4px}
.button-blue:hover{background:#1f648f}
/* Small, responsive blue progress-mark on preview hover. */
.project-visual::after{content:'';position:absolute;left:0;bottom:0;height:3px;width:0;background:#4aace6;pointer-events:none;z-index:4;transition:width .3s ease}
.project-visual:hover::after,.project-visual:focus-visible::after{width:100%}
.browser-open{transition:transform .2s ease,color .2s ease}
.project-visual:hover .browser-open{transform:translate(1px,-1px);color:#1b5d90}
/* A small highlight at the edge of the mini-browser, like an active window. */
.mini-browser::before{content:'';position:absolute;top:0;left:0;width:30px;height:2px;background:#65b6e8;z-index:2}
.workspace-entry:hover{box-shadow:inset 2px 0 0 #88bfdd}
.workspace-entry.is-active{box-shadow:inset 2px 0 0 #a4d6f2}
.overview-item{clip-path:none;border-radius:4px}
.overview-item:focus-visible{outline-offset:-4px}
.overview-arrow{transition:transform .18s ease}
.overview-item:hover .overview-arrow{transform:translate(2px,-2px)}
/* Maintain comfortable nav spacing without wrapping at tablet sizes. */
@media(max-width:1000px){
  .brand-logo{width:177px}
  .primary-nav{gap:2px}
  .primary-nav>a:not(.nav-cta){padding:8px 10px;font-size:12px}
  .primary-nav .nav-cta{margin-left:3px;gap:9px;padding:9px 12px}
}
@media(max-width:610px){
  .header-inner{min-height:72px}
  .brand-logo{width:174px}
  .primary-nav{gap:3px;box-shadow:0 13px 25px #1a2c3b1d}
  .primary-nav>a:not(.nav-cta){justify-content:flex-start;padding:12px 14px;min-height:43px;width:100%;border:0;font-size:13px}
  .primary-nav .nav-cta{margin:10px 0 0;min-height:43px}
  .footer-logo-image{width:198px}
}
@media(max-width:375px){.brand-logo{width:158px}}
@media(prefers-reduced-motion:reduce){
  .hero-cursor{animation:none}
  .brand-logo,.browser-open,.overview-arrow{transition:none}
  .brand:hover .brand-logo,.primary-nav>a:not(.nav-cta):hover,.primary-nav .nav-cta:hover{transform:none}
  .project-visual::after{transition:none}
}


/* Aura v13: original SVG identities + conventional shapes + full-bleed project screenshots. */
.brand-logo,.footer-logo-image{display:block;aspect-ratio:506/92;object-fit:contain}
.brand-logo{width:208px;height:auto}
.footer-logo-image{width:211px;height:auto}
/* Screenshot is an absolutely positioned layer, never an inline image with intrinsic whitespace. */
.project-screen{width:100%;isolation:isolate}
.project-screen img[data-shot]{
  position:absolute;inset:0;display:block;
  width:100%;height:100%;max-width:none;
  object-fit:cover;object-position:left top;
  transform:scale(1.075);transform-origin:top left;
  transition:transform .3s ease;
}
.project-visual:hover .project-screen img[data-shot],
.project-visual:focus-visible .project-screen img[data-shot]{transform:scale(1.095)}
/* The screen clips the overscan; browser chrome itself is unchanged. */
.feature-shot,.project-visual{min-width:0}
.feature-shot .project-screen{width:100%}
@media(max-width:1000px){.brand-logo{width:177px}}
@media(max-width:610px){.brand-logo{width:174px}.footer-logo-image{width:198px}}
@media(max-width:375px){.brand-logo{width:158px}}
@media(prefers-reduced-motion:reduce){.project-screen img[data-shot]{transition:none}.project-visual:hover .project-screen img[data-shot],.project-visual:focus-visible .project-screen img[data-shot]{transform:scale(1.075)}}


/* ==== Aura v14 — natural-ratio captures, clear logo cache, discreet visual color ==== */
/* Each screenshot sets the height of its own browser window, so *all* of the
   screenshot is shown. No forced aspect ratio, overscan, zoom or hover crop. */
.project-screen,
.feature-shot .project-screen {
  aspect-ratio:auto;
  width:100%;
  max-height:none;
  height:auto;
  min-height:0;
  position:relative;
  overflow:hidden;
  background:#ddeaf3;
}
.project-screen img[data-shot] {
  display:block;
  position:relative;
  inset:auto;
  width:100%;
  height:auto;
  max-width:100%;
  max-height:none;
  object-fit:contain;
  object-position:center top;
  transform:none !important;
  transform-origin:center center;
  transition:none;
}
.project-visual:hover .project-screen img[data-shot],
.project-visual:focus-visible .project-screen img[data-shot],
.feature-shot:hover .project-screen img[data-shot] {
  transform:none !important;
}
/* When an external thumbnail is unavailable, show a legible fallback. */
.project-screen:has(.image-error:not([hidden])) {min-height:225px}

/* Use a restrained warm accent to contrast with blue and charcoal.
   These are small highlights, not a new full-page palette. */
:root {--aura-copper:#cd8964;--aura-copper-light:#f5e6dd;--aura-cyan:#70c5ef}
.hero-signature i {background:var(--aura-copper)}
.section-kicker::before {background:var(--aura-copper)}
.section-kicker.light::before {background:#f0af85}
.browser-lights i:nth-child(2) {background:#e3ab82}
.browser-lights i:last-child {background:#b3c1cb}
.mini-browser::before {background:var(--aura-cyan)}
.overview-item:nth-child(3) .overview-icon {color:var(--aura-copper)}
.overview-item:nth-child(2) .overview-icon {color:#377baa}
.feature-chips span:first-child {background:var(--aura-copper-light);color:#8a5a41}
.project-switch-btn:hover {background:#d9eaf5;color:#21486b}
.project-switch-btn.is-active {background:#235a86;color:#fff}
.project-switch-btn.is-active:hover {background:#235a86;color:#fff}
.work-feature-top > span {color:#3b6e93}
.skills-browser .skill-window-dot {color:#d79b74}
.footer-base .mono span {color:#e6ad86}
/* A small accent in the URL chrome feels like a working browser. */
.browser-address {border-color:#d6e1e9}
.project-visual:focus-visible {outline-offset:5px}
@media (prefers-reduced-motion:reduce){
  .project-screen img[data-shot] {transition:none!important;transform:none!important}
}


/* ============================================================
   aura-creative.css: Visual and interaction refinements
   ============================================================ */
/* Aura — balanced indie-web palette.
   Coral, periwinkle, blue and gold stay; blue consistently means interaction.
   The navy footer remains, and large translucent circle decorations are removed. */
:root {
  --ink:#303344;
  --body:#5c6271;
  --mute:#687084;
  --navy:#35394d;
  --deep:#333448;
  --deep2:#43465d;
  --blue:#5d78b6;
  --sky:#86b8d8;
  --ice:#f3f5fc;
  --light-blue:#edf2fa;
  --paper:#ffffff;
  --faint:#f8f8fb;
  --line:#e5e6ee;
  --orange:#ed9c7e;
  --aura-copper:#ed9c7e;
  --aura-copper-light:#fff0eb;
  --aura-cyan:#9fcddd;
  --rose:#db7895;
  --lilac:#a2a0d9;
  --sun:#f3ca70;
}
body {background:#fff;color:var(--ink)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible {outline-color:#d46d91}
.site-header {background:#fff;box-shadow:0 1px 0 #ecebf2}
.primary-nav>a:not(.nav-cta):hover {color:#b05d83}
.primary-nav>a.is-current:not(.nav-cta) {color:#435b92}
.primary-nav .nav-cta {background:#4b5275;color:white}
.primary-nav .nav-cta:hover,.primary-nav .nav-cta.is-current {background:#b85f82;color:white}
.brand-logo {transition:opacity .2s ease,transform .2s ease}
/* Light editorial hero; contrasting details are more important than boxes. */
.home-hero {background:#fff;isolation:isolate}


.hero-layout {gap:58px}
.hero-content h1 {font-size:clamp(37px,4.35vw,55px);letter-spacing:-.055em}
.heading-alt {font:italic 500 1.02em/1.16 Georgia,'Iowan Old Style',serif;letter-spacing:-.055em;color:#aa648e}
.hero-content .intro {color:#5a606b}
.overline {color:#746a83}
.live-dot {background:#df7894;box-shadow:0 0 0 3px #fce3eb}
.hero-signature {margin-top:42px;color:#858394}
.hero-signature i {background:#df7894}
.signature-spark {font:700 19px/1 var(--mono);color:#d48e75;margin-right:3px;transform:rotate(-12deg)}
.button-blue {background:#536eab;border-radius:5px}
.button-blue:hover {background:#b65f84}
.button-ink {background:#4c5066;border-radius:5px}
.button-ink:hover {background:#ba6087}
.quiet-link,.small-link,.text-link {border-color:#dfcbdc}
.quiet-link:hover,.small-link:hover,.text-link:hover {color:#a8527c;border-color:#a8527c}
.section-kicker {color:#965b88}
.section-kicker:before {background:#d77893}
/* The hero window keeps its early-web feeling but feels more like a creative desk. */
.hero-workspace {box-shadow:10px 11px 0 #e8e7f1;--play-accent:#8b79ba;--play-light:#f2effa}


.workspace-titlebar {background:#d4d8e9;color:#495170}
.workspace-appicon {color:#a65484}
.window-controls i:first-child {background:#ee9c88}
.window-controls i:nth-child(2) {background:#f2d187}
.window-controls i:nth-child(3) {background:#aabed7}
.workspace-sidebar {background:#f4f1f8;color:#76718a}
.workspace-entry.is-active {background:#e6d9ed;color:#8e4e79}
.workspace-entry:hover {background:#eee2ee;color:#8e4e79}
.workspace-version {color:#ada2b6}
.workspace-desktop {background-color:#d5deec;background-image: radial-gradient(#f9faff 1px,transparent 1px),linear-gradient(145deg,#b9cde8b8,transparent 66%);background-size:17px 17px,cover;padding-bottom:72px}

.mini-browser {border-color:#61627a;box-shadow:5px 6px 0 #7a82a457;transition:transform .25s ease}
.hero-workspace:hover .mini-browser {transform:translateY(-2px)}
.mini-browser:before {background:var(--play-accent)}
.mini-titlebar {background:#dbe2f2;color:#4a5374}
.mini-icon,.mini-eyebrow,.mini-view a,.mini-star,.url-lock {color:var(--play-accent)}
.mini-view h2 {color:#353748}
.mini-page {background:#fff}
.mini-star {background:var(--play-light);border-color:var(--play-accent);border-radius:4px;transition:background .2s,border-color .2s,color .2s}
.mini-files span,.mini-mini-tags span {background:var(--play-light);color:#65586c}
.mini-statusbar {background:#eceef7;color:#76738b}
.mini-online {background:var(--play-accent)}
.workspace-footer {background:#4a4a62}
.desktop-doodle {color:#b56591;font-size:22px;right:12px;top:10px}
.desktop-label {color:#606682}
/* Bright, zine-like details but with fewer rules and borders. */
.utility-ticker {background:#ffe0d9;color:#755368}
.ticker-inner b {color:#ce7186}
.home-overview {background:#fff}
.overview-grid {gap:17px}
.overview-item {border-radius:5px;background:#eaf3fb}
.overview-item:nth-child(2) {background:#f1ecfa}
.overview-item:nth-child(3) {background:#fff0e9}
.overview-item:hover {background:#fff1da}
.overview-item:nth-child(2):hover {background:#ebe5fa}
.overview-item:nth-child(3):hover {background:#fde3e8}
.overview-item .overview-icon {color:#507cad}
.overview-item:nth-child(2) .overview-icon {color:#8974b6}
.overview-item:nth-child(3) .overview-icon {color:#cf7c6a}
.overview-item .overview-arrow {color:#94719a}
.overview-item:before {content:'';position:absolute;left:0;top:0;width:43px;height:5px;background:#74b3cf}
.overview-item:nth-child(2):before {background:#b4a0d5}
.overview-item:nth-child(3):before {background:#efa78d}
.home-work {background:#f7f7fb}
.browser-top {background:#e5e8f1}
.browser-lights i {background:#b9b7d4}
.browser-lights i:first-child {background:#e9a497}
.browser-lights i:nth-child(2) {background:#f0cd85}
.browser-lights i:last-child {background:#98c7d5}
.browser-address {border-color:#d9d9e5;color:#6d7085;background:#fff}
.project-screen {background:#eef0f7}
.project-visual::after {background:#e37b98}
.project-meta .eyebrow {color:#b15e87}
/* Contrasting dark plum-charcoal section is intentional, not predominantly blue. */
.skills-preview {background:#404056;color:#fbfafc}
.skills-preview:after {background-image:radial-gradient(#f8cc8b24 1px,transparent 1px)}

.section-kicker.light {color:#f4b8bf}
.skills-browser {background:#f7f4fc;box-shadow:7px 8px 0 #302f42;color:#4c536d}
.skills-browser .skills-console-head {background:#dcd7ee;color:#525470}
.skills-browser .skill-window-dot {color:#bc6b91}
.skills-browser .skill-tags {background:#f8f6fd}
.skills-browser .skill-tags span,.skills-browser .skill-tags span:nth-child(5n+2),.skills-browser .skill-tags span:nth-child(5n+4) {color:#5e607d;border-color:#e5e0ef}
.skills-browser p {background:#eee8f5;color:#68657f}
.home-cta,.compact-cta {background:#f8e9ec}
.footer {background:#303446;color:#dbe0ec}
.footer-main p,.footer-base {color:#b7bed0}
.footer-title {color:#f1abc0}
.footer-navigation a:hover {color:#f5c5d4}
.footer-base .mono span {color:#f1c17e}
/* Cross-page details */
.page-heading,.interior-hero,.page-intro {background:#fff}
.project-detail-panel {background:#f5f3fb}
.project-switch-btn.is-active,.project-switch-btn.is-active:hover {background:#775d9f;color:#fff}
.project-switch-btn:hover {background:#eee0f2;color:#66547d}
.feature-chips span:first-child {background:#ffe6e4;color:#9a6077}
.work-feature-top>span {color:#995c83}
.service-title>span {background:#f2eaf6;color:#966f9d}
.service-index {color:#a16e9b}
.capabilities {background:#42415a}
.capability-label {color:#f3b8c9}
.capability-pills span {background:#54516c;color:#faf7ff}
.capability-pills span:hover {background:#be7899;color:#fff}
.about-window {background:#3e3c54;box-shadow:10px 10px 0 #e8e0ef}
.about-browser .about-window-body {background:#424059}
.ascii-star {color:#e1a3b8}
.how-work {background:#f8f6fb}
.steps>div:nth-child(2) {background:#f3effb}
.message-form {background:#f7f3fa;box-shadow:9px 10px 0 #eee5f2}
.form-top {background:#e7dff0;color:#605876}
.form-row input:focus,.form-row textarea:focus {border-color:#be7a9e;outline-color:#f0cfdd}
/* Never crop actual website screenshots again */
.project-screen,.feature-shot .project-screen {aspect-ratio:auto;height:auto;max-height:none}
.project-screen img[data-shot] {position:relative;inset:auto;display:block;width:100%;height:auto;max-width:100%;object-fit:contain;transform:none!important}
.project-visual:hover .project-screen img[data-shot],.project-visual:focus-visible .project-screen img[data-shot] {transform:none!important}
@media (max-width:1000px) { .hero-layout {gap:35px} }
@media (max-width:790px) { .hero-layout {gap:32px} .hero-workspace {max-width:625px} }
@media (max-width:610px) {
  .hero-content h1 {font-size:clamp(34px,8.4vw,44px)}
  .workspace-desktop {padding-bottom:65px}
  .signature-spark {font-size:15px}
}
@media (max-width:390px) { }
@media (prefers-reduced-motion:reduce) { .palette-choice,.mini-star,.mini-browser {transition:none!important} .hero-workspace:hover .mini-browser,.palette-choice:hover {transform:none!important} }


/* --- Color roles, shared across every page ----------------------------------
   action = blue, selected navigation = navy
   decorative = rose/coral/periwinkle/yellow
   hover = the same blue response everywhere, without changing card palettes. */
:root{
  --aura-action:#536fa9;
  --aura-action-hover:#405a8f;
  --aura-navy:#172b3e;
  --aura-coral:#ed9c7e;
  --aura-rose:#db7895;
  --aura-lilac:#a2a0d9;
  --aura-yellow:#f3ca70;
  --aura-sky:#86b8d8;
}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline-color:var(--aura-action)}
/* Navigation, primary buttons and text links are always blue on interaction. */
.primary-nav>a:not(.nav-cta):hover{color:#354f85;background:#edf0fa}
.primary-nav>a.is-current:not(.nav-cta),
.primary-nav>a.is-current:not(.nav-cta):hover{background:var(--aura-navy);color:white}
.primary-nav .nav-cta,.button-blue{background:var(--aura-action);color:#fff}
.primary-nav .nav-cta:hover,.primary-nav .nav-cta.is-current,
.button-blue:hover{background:var(--aura-action-hover);color:#fff}
.button-ink{background:#31394b;color:#fff}
.button-ink:hover{background:var(--aura-action-hover);color:#fff}
.quiet-link:hover,.small-link:hover,.text-link:hover,
.mini-view a:hover{color:var(--aura-action-hover);border-color:var(--aura-action-hover)}
/* Color is part of the design, not an unpredictable hover effect. */
.heading-alt{color:#ad6f92}
.live-dot{background:var(--aura-rose);box-shadow:0 0 0 3px #fbe3ec}
.hero-signature i{background:var(--aura-rose)}
.section-kicker{color:#886fa6}
.section-kicker::before{background:var(--aura-coral)}
.hero-workspace{--play-accent:#8975b4;--play-light:#f2effb}
.workspace-entry:hover{background:#e6e1f2;color:#514e79;box-shadow:inset 2px 0 0 #7b90c7}
.workspace-entry.is-active{background:#dfd9f0;color:#514e79;box-shadow:inset 2px 0 0 #7b90c7}
.mini-view a{color:#516fa7}
.mini-view a:hover{color:var(--aura-action-hover)}
.mini-browser::before{background:var(--aura-lilac)}
.mini-online{background:var(--aura-action)}
/* Four coordinated backgrounds, identical motion and hover shadows. */
.overview-item,.overview-item:nth-child(2),.overview-item:nth-child(3),.overview-item:nth-child(4){transition:transform .2s ease,box-shadow .2s ease;border-radius:5px}
.overview-item{background:#eaf3fb}
.overview-item:nth-child(2){background:#f1ecfa}
.overview-item:nth-child(3){background:#fff0e9}
.overview-item:hover,.overview-item:nth-child(2):hover,.overview-item:nth-child(3):hover,.overview-item:nth-child(4):hover{
  transform:translateY(-3px);box-shadow:0 8px 0 #dfe5f1;
}
.overview-item:hover{background:#eaf3fb}
.overview-item:nth-child(2):hover{background:#f1ecfa}
.overview-item:nth-child(3):hover{background:#fff0e9}
.overview-item .overview-arrow,.overview-item:nth-child(2) .overview-arrow,
.overview-item:nth-child(3) .overview-arrow{color:var(--aura-action)}
.overview-item:hover .overview-arrow{color:var(--aura-action-hover)}
.overview-item:nth-child(2) .overview-icon{color:#8974b6}
.overview-item:nth-child(3) .overview-icon{color:#cf7c6a}
.overview-item:before{background:var(--aura-sky)}
.overview-item:nth-child(2):before{background:var(--aura-lilac)}
.overview-item:nth-child(3):before{background:var(--aura-coral)}
.utility-ticker{background:#ffe7df;color:#66546a}
.ticker-inner b{color:#ba6284}
.browser-lights i:first-child{background:var(--aura-coral)}
.browser-lights i:nth-child(2){background:var(--aura-yellow)}
.browser-lights i:last-child{background:var(--aura-sky)}
.project-visual:after{background:var(--aura-action)}
.project-meta .eyebrow{color:#94688b}
/* Dark navy anchors the color, rather than purple across large surfaces. */
.skills-preview,.capabilities{background:#22354a;color:#f7f9fc}
.skills-preview:after{background-image:radial-gradient(#f8cc8b20 1px,transparent 1px)}
.skills-browser{box-shadow:7px 8px 0 #16283a}
.skills-browser .skills-console-head{background:#e3dff1;color:#535b76}
.skills-browser .skill-window-dot{color:#a36e9e}
.skills-browser .skill-tags span,.skills-browser .skill-tags span:nth-child(5n+2),
.skills-browser .skill-tags span:nth-child(5n+4){color:#5d6082;border-color:#e6dff0}
.skills-browser p{background:#ede9f7;color:#646781}
.home-cta,.compact-cta{background:#fae9ed}
/* Consistent accents on Work, Services, About and Contact. */
.project-detail-panel{background:#f6f3fb}
.project-switch-btn:hover{background:#e7ecf8;color:#405a8f}
.project-switch-btn.is-active,.project-switch-btn.is-active:hover{background:var(--aura-navy);color:#fff}
.feature-chips span:first-child{background:#ffe9df;color:#945c65}
.work-feature-top>span{color:#8a6ca0}
.service-title>span{background:#f0eaf8;color:#8b6fb0}
.service-index{color:#9a6fa6}
.capability-label{color:#d7c9f1}
.capability-pills span{background:#3c4e67;color:#f5f5fa}
.capability-pills span:hover{background:var(--aura-action);color:white}
.about-window{background:#283d52;box-shadow:10px 10px 0 #e5e0ef}
.about-browser .about-window-body{background:#293d53}
.ascii-star{color:#e8a7bd}
.how-work{background:#f8f7fb}
.steps>div:nth-child(2){background:#f2eefb}
.message-form{background:#f7f4fa;box-shadow:9px 10px 0 #ebe5f0}
.form-top{background:#e8e2f1;color:#605c78}
.form-row input:focus,.form-row textarea:focus{border-color:var(--aura-action);outline-color:#c9d6ed}
/* Restore the charcoal-navy footer with the uploaded light SVG. */
.footer{background:#122b3f;color:#d8e4ee}
.footer-main p,.footer-base{color:#aec2d1}
.footer-title{color:#b7d8ea}
.footer-navigation a:hover{color:#b6daf2}
.footer-base .mono span{color:var(--aura-yellow)}
/* Remove giant low-opacity circles/rings, leaving desktop UI dots intact. */
.home-hero::before,.home-hero::after,
.skills-preview::before,.workspace-desktop::before,
.inner-hero::before{content:none!important;display:none!important}
@media(prefers-reduced-motion:reduce){
  .overview-item,.overview-item:nth-child(2),.overview-item:nth-child(3){transition:none!important}
  .overview-item:hover,.overview-item:nth-child(2):hover,.overview-item:nth-child(3):hover{transform:none!important}
}

/* --- AURA FINISHING TOUCHES BEGIN --- */
/* AURA FINISHING TOUCHES — crisp neutrals, carefully placed color.
   Keeps the existing color system, interactive browser, and navy footer. */
/* White contact strips on the home page and all internal pages. */
.home-cta,.compact-cta { background:#fff; }
/* Keep the colorful service-card identities, with less candy-like fills. */
.overview-item,.overview-item:hover { background:#e5ecf2; }
.overview-item:nth-child(2),.overview-item:nth-child(2):hover { background:#eae8f0; }
.overview-item:nth-child(3),.overview-item:nth-child(3):hover { background:#f1e8e2; }
/* Quiet larger surfaces; accents remain coral, lavender, yellow, and blue. */
.utility-ticker { background:#f1f3f6; color:#535d70; }
.ticker-inner b { color:#aa6183; }
.workspace-titlebar { background:#dce2eb; }
.workspace-sidebar { background:#eef0f4; }
.workspace-entry.is-active { background:#e2e1ed; }
.workspace-entry:hover { background:#e5e7f0; }
.workspace-desktop { background-color:#d7e0e9; background-image:radial-gradient(#ffffffa0 1px,transparent 1px),linear-gradient(145deg,#c6d7e6,transparent 68%); }
.home-work { background:#f6f7f9; }
.skills-browser .skills-console-head { background:#dfe3ed; }
.skills-browser .skill-tags { background:#f4f5f8; }
.skills-browser p { background:#e7eaf2; }
.project-detail-panel,.how-work { background:#f6f7f9; }
.steps>div:nth-child(2) { background:#f0f1f5; }
.message-form { background:#f5f6f9; box-shadow:9px 10px 0 #e8eaf0; }
.form-top { background:#e5e8f0; }
/* Footer is intentionally unchanged: dark navy with the light SVG. */
/* --- AURA FINISHING TOUCHES END --- */

/* ===== Aura brighter, balanced site-wide palette =====
   All five public pages: navy base, white space, blue actions;
   periwinkle/coral/gold for recurring accents. No random hover colors. */
:root {
 --aura-action:#397fb5;--aura-action-hover:#2d6596;
 --aura-sky:#62add8;--aura-lilac:#9583d1;
 --aura-coral:#e99680;--aura-rose:#cf6f98;--aura-yellow:#ecc25d;
}
/* Consistent button/link states throughout every page. */
.primary-nav .nav-cta,.button-blue{background:var(--aura-action)}
.primary-nav .nav-cta:hover,.button-blue:hover{background:var(--aura-action-hover)}
.primary-nav>a:not(.nav-cta):hover{color:#2e6397;background:#e6f1fa}
.primary-nav>a.is-current:not(.nav-cta),.primary-nav>a.is-current:not(.nav-cta):hover{background:#172b3e;color:#fff}
.button-ink:hover{background:var(--aura-action-hover)}
.quiet-link:hover,.small-link:hover,.text-link:hover,.mini-view a:hover{color:var(--aura-action-hover);border-color:var(--aura-action-hover)}
/* Repeated decorative colors: periwinkle in headlines, coral in labels, blue for UI. */
.heading-alt{color:#a35f92}
.section-kicker{color:#8a65a7}
.section-kicker::before{background:var(--aura-coral)}
.live-dot,.hero-signature i{background:var(--aura-rose)}
.signature-spark,.desktop-doodle{color:#ce7998}
.utility-ticker{background:#f5e8f2;color:#645368}
.ticker-inner b{color:#ad5c88}
/* Hero fake desktop window: visibly brighter, but still blue/charcoal. */
.workspace-titlebar{background:#d6e7f5;color:#405d7c}
.workspace-sidebar{background:#eef4fc}
.workspace-entry.is-active{background:#e5def5;color:#5e4e8b}
.workspace-entry:hover{background:#e5eefb;color:#475f89}
.workspace-desktop{background-color:#cfe6f7;background-image:radial-gradient(#ffffffbf 1px,transparent 1px),linear-gradient(145deg,#a9cee9,transparent 72%)}
.mini-titlebar{background:#deeafb}
.browser-lights i:first-child,.window-controls i:first-child{background:var(--aura-coral)}
.browser-lights i:nth-child(2),.window-controls i:nth-child(2){background:var(--aura-yellow)}
.browser-lights i:last-child,.window-controls i:nth-child(3){background:var(--aura-sky)}
/* Three bright colors repeat on Home AND on About process cards. */
.overview-item,.overview-item:hover,.steps>div:nth-child(1),.how-work .steps>div:nth-child(1){background:#daedfa}
.overview-item:nth-child(2),.overview-item:nth-child(2):hover,.steps>div:nth-child(2),.how-work .steps>div:nth-child(2){background:#e7e1f8}
.overview-item:nth-child(3),.overview-item:nth-child(3):hover,.steps>div:nth-child(3),.how-work .steps>div:nth-child(3){background:#f8e4d8}
.overview-item:before{background:var(--aura-sky)}
.overview-item:nth-child(2):before{background:var(--aura-lilac)}
.overview-item:nth-child(3):before{background:var(--aura-coral)}
.overview-item:nth-child(2) .overview-icon{color:#7661b5}
.overview-item:nth-child(3) .overview-icon{color:#bd6a62}
/* Stronger section contrasts, but never pink footer or colored bottom CTA. */
.home-work{background:#f1f6fb}
.project-detail-panel{background:#f1f5fc}
.project-meta .eyebrow,.work-feature-top>span{color:#a65f90}
.project-visual::after{background:var(--aura-action)}
.project-switch-btn:hover{background:#e4effa;color:var(--aura-action-hover)}
.project-switch-btn.is-active,.project-switch-btn.is-active:hover{background:#172b3e;color:#fff}
.feature-chips span:first-child{background:#fbe3dc;color:#9e5d60}
/* Clear Skills and Services color. */
.skills-preview,.capabilities{background:#22354a}
.skills-browser .skills-console-head{background:#e1def4}
.skills-browser .skill-window-dot{color:#ce6c99}
.skills-browser .skill-tags{background:#f7f6fe}
.skills-browser p{background:#ebe9f9}
.service-title>span{background:#e6ddfa;color:#795cac}
.service-index{color:#8f64bb}
.capability-label{color:#c8b6ef}
.capability-pills span:hover{background:var(--aura-action)}
/* Repeated color details across About and Contact. */
.about-window{box-shadow:10px 10px 0 #dce5f3}
.about-browser .about-window-body{background:#293d53}
.how-work{background:#f3f7fb}
.ascii-star{color:#e2a0b1}
.message-form{background:#f2f6fc;box-shadow:9px 10px 0 #dfe8f3}
.form-top{background:#e3e7f5;color:#526985}
.form-row input:focus,.form-row textarea:focus{border-color:var(--aura-action);outline-color:#b6d8f0}
/* Keep footer dark navy + all full-width contact strips pure white. */
.footer{background:#122b3f}
.home-cta,.compact-cta{background:#fff}
/* Older low-opacity circles remain disabled. */
.home-hero::before,.home-hero::after,.skills-preview::before,.workspace-desktop::before,.inner-hero::before{content:none!important;display:none!important}
/* ===== End site-wide palette ===== */

/* --- HOMEPAGE HERO DARK-BLUE BROWSER TUNE --- */
/* Darker hero workspace like the earlier version, while keeping the brighter palette elsewhere. */
.home-hero .workspace-titlebar{background:#1b2c3d;color:#bfd3e6}
.home-hero .workspace-caption,.home-hero .workspace-footer{color:#bfd3e6}
.home-hero .workspace-sidebar{background:#eef4fc;color:#5e6f88}
.home-hero .workspace-entry{color:#576981}
.home-hero .workspace-entry.is-active{background:#4c7aa3;color:#fff}
.home-hero .workspace-entry:hover{background:#dfeaf7;color:#375673}
.home-hero .workspace-desktop{background-color:#2c4f73;background-image:linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px),linear-gradient(145deg,#315779 0%, #264766 72%);background-size:29px 29px,29px 29px,100% 100%}
.home-hero .desktop-doodle,.home-hero .workspace-desktop::after{color:#7ea4c4}
.home-hero .mini-browser{box-shadow:8px 8px 0 #1d3248}
.home-hero .mini-titlebar{background:#d9e3ec}
.home-hero .mini-url{background:#f4f5f6}
.home-hero .mini-page{background:#fcfcfd}
.home-hero .mini-statusbar{background:#d8e3ee}
.home-hero .mini-icon,.home-hero .mini-eyebrow,.home-hero .mini-view a,.home-hero .mini-star,.home-hero .url-lock{color:#4b82ad}
.home-hero .mini-view h2{color:#213449}
.home-hero .mini-view p{color:#64788a}
/* --- END HOMEPAGE HERO DARK-BLUE BROWSER TUNE --- */


/* ============================================================
   aura-about.css: Visual and interaction refinements
   ============================================================ */
/* Aura About page refinement — intentionally scoped to About only. */
/* The process cards repeat the same palette as the homepage overview. */
.how-work .steps > div {border-radius:5px;}
.how-work .steps > div:nth-child(1) {background:#e5ecf2;}
.how-work .steps > div:nth-child(2) {background:#eae8f0;}
.how-work .steps > div:nth-child(3) {background:#f1e8e2;}
/* A small portrait belongs inside the existing about.txt window. */
.about-window-intro {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  min-height:150px;
  margin-bottom:8px;
}
.about-window-intro .ascii-star {
  margin:8px 0 0;
  color:#b8cce1;
  font-size:38px;
}
.about-photo {
  margin:0;
  width:124px;
  flex:none;
  padding:4px;
  background:#f8f9fb;
  box-shadow:4px 4px 0 rgba(10,23,38,.24);
}
.about-photo img {
  width:100%;
  height:124px;
  aspect-ratio:1;
  object-fit:cover;
  object-position:center;
  background:#dbe6ef;
}
.about-photo figcaption {
  color:#465c71;
  font:650 8px/1.4 var(--mono);
  letter-spacing:.055em;
  padding:6px 1px 1px;
  text-align:center;
}
@media(max-width:610px){
  .about-window-intro{min-height:133px;}
  .about-photo{width:110px;}
  .about-photo img{height:108px;}
}

/* Real photo in the little polaroid inside the left about.txt card. */
.about-window-intro{min-height:197px;gap:10px;margin-bottom:7px}
.about-photo{width:154px;padding:6px 6px 4px;background:#fff;transform:rotate(2deg);box-shadow:5px 6px 0 rgba(10,23,38,.27)}
.about-photo img{height:172px;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center top;display:block;background:#dbe6ef}
.about-photo figcaption{font-size:9px;letter-spacing:.065em;padding:7px 1px 2px;color:#526073}
.about-window-intro .ascii-star{font-size:43px;color:#eaa79b;margin:12px 0 0}
@media(max-width:610px){.about-window-intro{min-height:184px}.about-photo{width:140px}.about-photo img{height:156px}}


/* ============================================================
   aura-details.css: Visual and interaction refinements
   ============================================================ */
/* AURA indie-web details — additive only, on top of the existing design. */
/* All interactive highlights use the same action blue, with small decorative accents. */
:root{--aura-ui:#397fb5;--aura-ui-dark:#2d6596;--aura-ui-outline:#22567a}
/* Accessible keyboard focus even for the new miniature browser elements. */
:where(a,button,input,textarea,select):focus-visible{outline:3px solid #176cad!important;outline-offset:3px!important}
.site-header .brand:focus-visible{border-radius:3px}
/* Compact decorative file shortcuts inside the existing homepage mini-browser. */
.mini-shortcuts{display:flex;align-items:flex-start;flex-wrap:wrap;gap:7px}
.mini-shortcuts .mini-shortcut{display:inline-flex;align-items:center;gap:5px;padding:7px 8px;min-height:29px;max-width:100%;color:#294f70;background:#e5eff8;text-decoration:none;border:1px solid #c5d9e9;box-shadow:none;font:650 9px/1.3 var(--mono);overflow-wrap:anywhere}
.mini-shortcut:hover,.mini-shortcut:focus-visible{background:#d4e8f6;color:#1b4566;border-color:#6fa5cd}
.shortcut-icon{display:inline-block;flex:0 0 13px;width:13px;height:12px;background:#f9d789;border:1px solid #926b36;box-shadow:inset 0 2px #ffe8b2;position:relative;border-radius:1px}
.shortcut-icon:before{content:'';position:absolute;top:-4px;left:-1px;width:7px;height:4px;background:#f9d789;border:1px solid #926b36;border-bottom:0;border-radius:1px 2px 0 0}
/* project selector: short file tabs, with subtle focus and shadow instead of more colorful cards */
.project-switch-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:41px}
.project-switch-btn .shortcut-icon{margin-top:3px}
.project-switch-btn.is-active .shortcut-icon{border-color:#8d683b}
.project-file-status{margin:12px 0 0;text-align:right;color:#486a85;font:600 10px/1.5 var(--mono)}
.project-detail-panel.is-opening .feature-shot .browser-top{position:relative;overflow:hidden}
.project-detail-panel.is-opening .feature-shot .browser-top::after{content:'';display:block;position:absolute;bottom:0;left:0;height:3px;background:#3b86b6;animation:aura-progress .48s ease-out forwards;pointer-events:none;z-index:5}
@keyframes aura-progress{from{width:0}to{width:100%}}
/* little native-text tooltips: nonessential, keyboard reachable, no content hidden behind them */
@media(hover:hover) and (pointer:fine){
  [data-hint]{position:relative}
  [data-hint]::after{content:attr(data-hint);position:absolute;z-index:30;left:50%;bottom:calc(100% + 8px);transform:translate(-50%,4px);padding:6px 8px;background:#1b3043;color:white;font:600 10px/1.25 var(--mono);white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .12s,transform .12s;box-shadow:2px 3px 0 #adc8dc;border:1px solid #9cb9cd}
  [data-hint]:is(:hover,:focus-visible)::after{opacity:1;visibility:visible;transform:translate(-50%,0)}
  .workspace-sidebar [data-hint]::after{left:0;bottom:calc(100% + 4px);transform:translate(0,4px)}
  .workspace-sidebar [data-hint]:is(:hover,:focus-visible)::after{transform:translate(0,0)}
}
/* status bar updates without an artificial delay or a distracting animation */
.workspace-footer{min-height:34px}
.workspace-current{color:#c3deee;letter-spacing:.02em}
.blink-cursor{display:inline-block;animation:aura-blink 1.1s steps(1,end) infinite}
@keyframes aura-blink{50%{opacity:0}}
/* About readme.txt lives in the existing about-browser card. */
.about-file-actions{display:flex;align-items:center;gap:8px;margin:20px 0 5px}
.readme-launch{border:1px solid #5d8bad;background:#e8f2f9;color:#234764;padding:9px 11px;display:inline-flex;align-items:center;gap:9px;min-height:39px;font:650 11px var(--mono);transition:background .15s,transform .15s}
.readme-launch:hover{background:#d7e9f7;transform:translateY(-1px)}
.note-file-icon{display:inline-block;width:12px;height:15px;background:#f7fafd;border:1px solid #517f9f;position:relative;box-shadow:inset 0 -3px #d5eafa}
.note-file-icon:after{content:'';position:absolute;top:3px;left:2px;width:6px;border-top:1px solid #517f9f;box-shadow:0 3px #517f9f,0 6px #517f9f}
.aura-readme-dialog{max-width:min(92vw,460px);width:460px;padding:0;border:1px solid #7b9bb5;border-radius:2px;box-shadow:10px 10px 0 #213b51;color:#1f3043;background:#f8fbff}
.aura-readme-dialog::backdrop{background:rgba(8,24,39,.63)}
.readme-titlebar{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#dbe9f5;padding:9px 11px;color:#315b7d;font:650 11px var(--mono)}
.readme-titlebar>span{display:inline-flex;align-items:center;gap:10px}
.readme-close{width:34px;height:32px;display:inline-flex;justify-content:center;align-items:center;border:1px solid #8aabc6;background:#f9fcff;color:#1b4468;font:600 21px/1 var(--mono)}
.readme-close:hover{background:#cce5f5}
.readme-body{padding:27px 30px}
.readme-kicker{color:#6b568c;font:650 10px var(--mono);letter-spacing:.04em}
.readme-body h2{font-size:clamp(22px,4vw,30px);line-height:1.15;margin:12px 0 15px;color:#1d3144}
.readme-body p{font-size:14px;line-height:1.7;color:#475c6b;margin:0 0 14px}
.readme-link{color:#266896;text-decoration:underline;text-underline-offset:4px;font-weight:650}
.readme-status{padding:9px 16px;background:#e4eef6;font:600 10px var(--mono);color:#537791}
@media(max-width:760px){.project-file-status{text-align:left}.readme-body{padding:22px}.aura-readme-dialog{box-shadow:5px 5px 0 #213b51}}
@media(max-width:610px){.mini-shortcuts{gap:4px}.mini-shortcuts .mini-shortcut{font-size:8px;padding:6px;min-height:28px}.workspace-current{font-size:7px}.project-switch-btn{min-height:44px}.readme-launch{min-height:44px}}
@media(prefers-reduced-motion:reduce){
  .blink-cursor{animation:none}.project-detail-panel.is-opening .feature-shot .browser-top::after{animation:none;display:none}
  .readme-launch{transition:none}.readme-launch:hover{transform:none}
  [data-hint]::after{transition:none}
}
/* Keep the established blue but give white button labels AA contrast. */
.primary-nav .nav-cta,.button-blue{background:#3579aa}
.primary-nav .nav-cta:hover,.button-blue:hover{background:#2d6596}
/* Hover-only labels aren't useful on narrow touch layouts. */
@media(max-width:760px){[data-hint]::after{display:none!important}}
/* Keep the workspace bottom bar in the same navy family as the footer. */
.workspace-footer{background:#1b2e41;color:#c9ddeb}


/* ============================================================
   aura-fun.css: Visual and interaction refinements
   ============================================================ */
/* Additional interactive details – unobtrusive, consistent with Aura's bright-blue/navy palette. */
.project-properties-launch{display:inline-flex;align-items:center;gap:9px;min-height:38px;margin:9px 12px 10px 0;background:#e0edfb;color:#244f73;border:1px solid #bdd4e9;padding:8px 11px;font:650 11px/1.3 var(--mono);cursor:pointer}
.project-properties-launch:hover{background:#d0e6fa;border-color:#8db7db}
.project-properties-dialog{width:min(92vw,520px);max-width:520px;padding:0;background:#f8fbff;color:#21344b;border:1px solid #88a9c4;box-shadow:12px 12px 0 #1b3148}
.project-properties-dialog::backdrop{background:rgba(13,29,46,.67)}
.properties-titlebar{display:flex;justify-content:space-between;align-items:center;background:#dcebf8;color:#285475;padding:10px 12px;font:650 11px/1.4 var(--mono)}
.properties-titlebar>span{display:inline-flex;align-items:center;gap:9px}
.properties-close{display:grid;place-items:center;width:34px;height:34px;min-width:34px;background:#fff;border:1px solid #9bb9d0;color:#244a69;font-size:23px;line-height:1}
.properties-close:hover{background:#e1f0fa}
.properties-content{padding:25px 30px 27px}
.properties-kicker{font:650 10px/1.4 var(--mono);color:#9366a3;letter-spacing:.06em}
.properties-content h2{font-size:clamp(24px,3vw,30px);margin:10px 0 22px}
.properties-list>div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:13px;padding:11px 0;border-bottom:1px solid #d8e3ed}
.properties-list dt{font:650 10px/1.5 var(--mono);color:#507591}
.properties-list dd{margin:0;font-size:13px;line-height:1.5;color:#2b455c}
.properties-notes{font-size:13px;line-height:1.65;color:#486173;margin:21px 0}
#project-properties-link{display:inline-flex;min-height:38px;align-items:center;color:#236da1;border-bottom:1px solid #8cb4d0;font-size:13px;font-weight:700}
.properties-status{background:#e4eef8;padding:10px 15px;color:#5b7991;font:650 10px var(--mono)}
/* Small personal note in readme.txt. */
.favorites-list{margin:16px 0 19px;border-top:1px solid #dbe6f0}
.favorites-list>div{display:flex;align-items:flex-start;gap:12px;border-bottom:1px solid #dbe6f0;padding:10px 0;font:600 12px/1.45 var(--mono);color:#35566f}
.favorites-list span{color:#bf7697;font-size:10px;flex-shrink:0}
.readme-body p.favorites-footnote{font-size:12px;color:#6a7c90;font-style:italic}
/* Purposeful fake file-not-found panel, not a stock error template. */
.error-page{background:#f7fafc}
.error-layout{max-width:1200px;display:grid;grid-template-columns:1fr minmax(320px,.9fr);gap:clamp(30px,5vw,85px);align-items:center}
.error-text h1{font-size:clamp(39px,4.7vw,70px);margin:16px 0}
.error-text p{max-width:460px}
.error-actions{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:26px}
.error-actions .small-link{margin-top:0}
.error-browser{box-shadow:9px 10px 0 #d5e3ee;background:#f9fcff;border:1px solid #9ab8ce}
.error-titlebar{background:#203b53;color:#eff7fd;padding:11px 15px;display:flex;align-items:center;justify-content:space-between;gap:10px;font:650 11px var(--mono)}
.error-body{padding:35px 32px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}
.error-folder{display:grid;place-items:center;width:66px;height:66px;border-radius:4px;background:#f8e4d8;border:1px solid #d6aba3;font:700 39px/1 var(--mono);color:#9d5571}
.error-code{font:750 13px/1 var(--mono);color:#af658a}
.error-body strong{font-size:20px;color:#253c52}
.error-file,.error-info{font:600 10px/1.5 var(--mono);color:#70879b}
.error-progress{height:9px;width:80%;background:#dae7f2;border:1px solid #c2d4e6;margin-top:7px;overflow:hidden}
.error-progress span{display:block;height:100%;width:62%;background:linear-gradient(90deg,#83b5df,#9e89ce)}
.error-status{background:#e0ecf5;color:#597b97;font:600 10px var(--mono);padding:10px 14px}
@media(max-width:780px){.error-layout{grid-template-columns:1fr}.error-browser{max-width:540px}.properties-list>div{grid-template-columns:95px minmax(0,1fr)}}
@media(max-width:480px){.properties-content{padding:20px}.properties-list>div{grid-template-columns:1fr;gap:3px}.error-body{padding:30px 17px}}
@media(prefers-reduced-motion:reduce){.project-properties-launch{transition:none}}


/* ============================================================
   About readme.txt native popover (previously embedded in about.html)
   ============================================================ */
/* Self-contained styles for readme.txt — intentionally independent of other CSS files. */
.about-window .about-file-actions{display:flex;align-items:center;gap:8px;margin:20px 0 5px}
.about-window .readme-launch{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:10px 13px;border:1px solid #83b6d8;border-radius:3px;background:#e5f2fa;color:#1b4364;font:650 12px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;opacity:1;cursor:pointer;text-decoration:none;transition:background .15s,transform .15s}
.about-window .readme-launch:hover{background:#cfe8f8;color:#163957;transform:translateY(-1px)}
.about-window .readme-launch:focus-visible,.aura-readme-dialog button:focus-visible,.aura-readme-dialog a:focus-visible{outline:3px solid #80bfec;outline-offset:3px}
.about-window .readme-launch .note-file-icon,.aura-readme-dialog .note-file-icon{display:inline-block;flex:0 0 auto;width:12px;height:15px;position:relative;background:#f7fbff;border:1px solid #527c9f;box-shadow:inset 0 -3px #d8eaf8}
.about-window .readme-launch .note-file-icon::after,.aura-readme-dialog .note-file-icon::after{content:'';position:absolute;left:2px;top:3px;width:6px;border-top:1px solid #527c9f;box-shadow:0 3px #527c9f,0 6px #527c9f}
.aura-readme-dialog[popover]{position:fixed;inset:0;width:min(92vw,460px);max-width:460px;max-height:min(85vh,650px);overflow:auto;margin:auto;padding:0;border:1px solid #7d9db8;border-radius:3px;background:#f8fbff;color:#1f3043;box-shadow:9px 10px 0 #213b51;z-index:9999}
.aura-readme-dialog[popover]::backdrop{background:rgba(8,24,39,.65)}
.aura-readme-dialog .readme-titlebar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;background:#dbe9f5;color:#315b7d;font:650 11px ui-monospace,SFMono-Regular,Consolas,monospace}
.aura-readme-dialog .readme-titlebar>span{display:inline-flex;align-items:center;gap:9px}
.aura-readme-dialog .readme-close{display:inline-flex;align-items:center;justify-content:center;width:35px;height:33px;min-width:35px;padding:0;border:1px solid #91aec5;border-radius:2px;background:#fff;color:#163e62;font:600 21px/1 ui-monospace,Consolas,monospace;cursor:pointer}
.aura-readme-dialog .readme-close:hover{background:#cce5f5}
.aura-readme-dialog .readme-body{padding:27px 29px}
.aura-readme-dialog .readme-kicker{color:#7b649d;font:650 11px ui-monospace,Consolas,monospace;letter-spacing:.035em}
.aura-readme-dialog .favorites-list{margin:17px 0 19px;border-top:1px solid #d9e5ef}
.aura-readme-dialog .favorites-list>div{display:flex;align-items:flex-start;gap:12px;padding:11px 0;border-bottom:1px solid #d9e5ef;color:#35566f;font:600 13px/1.5 ui-monospace,Consolas,monospace}
.aura-readme-dialog .favorites-list span{color:#ae6f93;font-size:11px;white-space:nowrap;flex-shrink:0}
.aura-readme-dialog .favorites-footnote{margin:0 0 14px;font:italic 12px/1.6 system-ui,sans-serif;color:#667b90}
.aura-readme-dialog .readme-link{font:650 13px system-ui,sans-serif;color:#266896;text-decoration:underline;text-underline-offset:3px}
.aura-readme-dialog .readme-status{padding:10px 16px;background:#e4eef6;color:#537791;font:600 10px ui-monospace,Consolas,monospace}
@media(max-width:520px){.aura-readme-dialog[popover]{box-shadow:5px 6px 0 #213b51}.aura-readme-dialog .readme-body{padding:22px 18px}}
@media(prefers-reduced-motion:reduce){.about-window .readme-launch{transition:none}.about-window .readme-launch:hover{transform:none}}


/* ============================================================
   Consistent project screenshot frames / compact Work viewer
   ============================================================ */
/* AURA VIEWER AND TOOLTIP REPAIR / Nov 2026
   Additive styles only; no screenshot recapture or quality reduction. */

/* Homepage: equal frame height for both locally captured 1600x1000 images. */
.home-work .project-visual .project-screen {
  display: block;
  width: 100%;
  aspect-ratio: 8 / 5;
  height: auto;
  min-height: 0;
  max-height: none;
  position: relative;
  overflow: hidden;
  background: #e8eef4;
}
.home-work .project-visual .project-screen img[data-shot] {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: contain;
  object-position: center top;
  transform: none !important;
  transition: none !important;
}

/* Work: smaller file selector and browser-sized project preview. */
.work-detail > .container { max-width: 1080px; }
.work-detail .feature-shot .project-screen {
  display: block;
  width: 100%;
  aspect-ratio: 8 / 5;
  height: auto;
  min-height: 0;
  max-height: none;
  position: relative;
  overflow: hidden;
  background: #e8eef4;
}
.work-detail .feature-shot .project-screen img[data-shot] {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: contain;
  object-position: center top;
  transform: none !important;
  transition: none !important;
}
.project-screen .image-error[hidden] { display: none !important; }

/* Desktop-style tooltip alignment: hint stays readable above controls. */
@media (hover: hover) and (pointer: fine) {
  .workspace-sidebar [data-hint] { z-index: 2; }
  .workspace-sidebar [data-hint]:is(:hover,:focus-visible) { z-index: 5; }
}


/* ============================================================
   November 2026: quieter page introductions & smaller mobile gaps
   Keep the real breadcrumb; the redundant eyebrow has been removed in HTML.
   ============================================================ */
.inner-hero { padding: 40px 0 49px; }
.inner-hero .breadcrumbs { margin-bottom: 19px; gap: 10px; }
.inner-hero h1 { font-size: clamp(36px,4vw,51px); line-height:1.12; margin-bottom: 13px; }
.inner-hero p { max-width: 650px; line-height: 1.58; }
.work-detail { padding-top: 65px; }
.work-overview { align-items: center; margin-bottom: 20px; }
.work-overview-title > .mono { display: block; color: #5e7892; font-size: 11px; letter-spacing: .05em; }
.work-overview-title h2 { display: none; }
.work-detail .project-file-status { margin-top: 6px; }
.about-prose h2, .contact-aside h2 { margin-top: 0; }
.capabilities-title h2 { margin-bottom: 8px; }
/* Make four services read like one tidy list on narrow screens. */
.detail-services .service-row { scroll-margin-top: 88px; }
@media (max-width: 790px) {
  .inner-hero { padding: 32px 0 42px; }
  .inner-hero .breadcrumbs { margin-bottom: 15px; }
  .inner-hero h1 { font-size: clamp(35px,5.7vw,46px); }
  .work-detail { padding-top: 48px; }
}
@media (max-width: 610px) {
  .inner-hero { padding: 24px 0 36px; }
  .inner-hero .breadcrumbs { margin-bottom: 13px; font-size: 10px; }
  .inner-hero h1 { font-size: clamp(34px,8vw,42px); margin-bottom: 11px; }
  .inner-hero p { font-size: 14px; line-height: 1.55; }
  .work-detail { padding-top: 38px; }
  .work-overview { align-items: flex-start; gap: 12px; margin-bottom: 16px; }
  .work-overview-title > .mono { font-size: 10px; }
  .project-switch { width: 100%; }
  .service-row { padding: 25px 0; }
  .service-title h2 { font-size: 20px; }
}

@media (max-width: 610px) {
  #management .service-title h2 { font-size: 19px; }
}


/* ============================================================
   November 2026 — four balanced homepage service cards &
   flatter Work endcap. This is part of the consolidated CSS.
   ============================================================ */

/* Signature labels beneath the homepage intro were intentionally removed. */
.home-overview .overview-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.home-overview .overview-item {
  min-width: 0;
  min-height: 226px;
  padding: 23px 21px 29px;
}
.home-overview .overview-item h3 {
  font-size: clamp(17px, 1.45vw, 20px);
  line-height: 1.23;
  margin-top: 18px;
  margin-bottom: 9px;
  max-width: 19ch;
}
.home-overview .overview-item p {
  font-size: 13px;
  line-height: 1.6;
  max-width: 32ch;
}
.home-overview .overview-item:nth-child(4),
.home-overview .overview-item:nth-child(4):hover {background: #f5f0e4;}
.home-overview .overview-item:nth-child(4)::before {background: #e2b47b;}
.home-overview .overview-item:nth-child(4) .overview-icon {color: #9d754a;}
.home-overview .overview-item:nth-child(4) .overview-arrow {color: #457faf;}
.home-overview .overview-item:nth-child(4):hover {box-shadow: 0 8px 0 #dfe5f1;}

/* All four Services rows must be siblings, with a consistent grid. */
.detail-services .service-row {
  grid-template-columns: 56px minmax(0, 1fr) 205px;
  gap: 24px;
  align-items: start;
}
.detail-services .service-row > div:nth-child(2) {min-width: 0;}
.detail-services .service-title {align-items: center;}
.detail-services .service-title h2 {line-height: 1.2; overflow-wrap: normal;}
.detail-services .service-items {min-width: 0; align-self: center;}
.detail-services .service-items span {line-height: 1.45;}

/* Less of an empty white buffer under the project browser. */
.work-detail.section-pad {padding-bottom: 30px;}
.work-detail .project-detail-panel {padding-bottom: 22px;}
.work-detail .feature-description {padding: 25px 7px 5px; gap: 25px;}
.work-detail .feature-description p {margin-bottom: 12px;}
.work-detail .feature-chips {margin: 14px 0;}
.work-endcap {background: #fff; padding: 25px 0 40px;}
.work-endcap > .container {
  max-width: 1080px;
  display: flex;
  gap: 24px;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #e5ecf2;
  padding-top: 24px;
}
.work-endcap p {font-size: 21px; font-weight: 700; letter-spacing: -.025em; color: #293344;}
.work-endcap .small-link {flex-shrink:0;}

@media (max-width: 1180px) {
  .home-overview .overview-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}
  .home-overview .overview-item {min-height: 210px; padding: 23px 23px 28px;}
  .home-overview .overview-item h3 {font-size: 20px; max-width: none;}
}
@media (max-width: 790px) {
  .detail-services .service-row {grid-template-columns: 36px minmax(0, 1fr); gap: 14px 18px;}
  .detail-services .service-items {grid-column: 2; align-self: start; flex-direction: row; flex-wrap: wrap; gap: 8px 15px;}
  .detail-services .service-title h2 {font-size: 22px;}
  .work-detail.section-pad {padding-bottom: 22px;}
}
@media (max-width: 610px) {
  .home-overview .overview-grid {grid-template-columns: 1fr; gap: 12px;}
  .home-overview .overview-item {min-height: 0; padding: 18px 21px 22px;}
  .home-overview .overview-item h3 {font-size: 19px; margin-top: 10px;}
  .home-overview .overview-item p {max-width: 45ch; font-size: 13px; padding-right: 12px;}
  .detail-services .service-row {grid-template-columns: 27px minmax(0, 1fr);gap: 12px; padding: 23px 0;}
  .detail-services .service-title {gap: 10px; align-items: flex-start;}
  .detail-services .service-title > span {width: 38px; height: 38px; flex-shrink: 0; font-size: 18px;}
  .detail-services .service-title h2, #management .service-title h2 {font-size: 20px; line-height: 1.2;}
  .detail-services .service-row p {font-size: 14px; line-height: 1.55;}
  .detail-services .service-items {gap: 7px 13px;}
  .detail-services .service-items span {font-size: 12px;}
  .work-endcap {padding: 14px 0 36px;}
  .work-endcap > .container {padding-top: 24px; gap: 13px; align-items: flex-start; flex-direction: column;}
  .work-endcap p {font-size: 19px;}
  .work-detail .feature-description {padding-top: 20px;}
}
@media (prefers-reduced-motion: reduce) {
  .home-overview .overview-item:nth-child(4):hover {transform: none;}
}