/* Small usability fixes only. Original colors, fonts, imagery and page styles remain intact. */
img{max-width:100%;height:auto}
a:focus-visible,button:focus-visible{outline:2px solid #ff3d00;outline-offset:4px}
.sidebar{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
.sidebar-content{height:auto;min-height:0;flex-shrink:0}
.sidebar a,.sidebar .menu-toggle{min-height:44px;flex-shrink:0;cursor:pointer}
.sidebar:focus-within .label{opacity:1;transform:translateX(0)}
.accordion-trigger{display:flex;align-items:center;gap:12px;width:100%;padding:0;border:0;color:inherit;background:none;text-align:inherit;font:inherit;cursor:pointer}
.accordion-content[hidden]{display:none}
.accordion-tab.open .accordion-content{max-height:none}
.contact-form{max-width:100%;box-sizing:border-box}
@media(min-width:900px){.sidebar:focus-within{width:240px}.sidebar:focus-within .sidebar-logo{opacity:1}}
@media(max-width:899px){
  main.page-content{margin-left:60px;padding:24px 16px;box-sizing:border-box;min-width:0}
  .header-widget .hero-heading-wrapper{width:calc(100% - 60px);margin-left:60px;box-sizing:border-box}
  .hero-text-group{left:0;max-width:100%}
  .hero-name{font-size:clamp(30px,8vw,72px);max-width:100%;overflow-wrap:break-word;white-space:normal}
  .hero-subtitle{font-size:clamp(24px,5.5vw,48px)}
  #home-page .hero-name{left:50%;width:100%;font-size:clamp(28px,8vw,72px);white-space:nowrap}
  #home-page .rotating-text{left:50%;font-size:clamp(27px,6vw,54px)}
  .about-me-container{margin-left:0;padding:16px 0;gap:24px}
  .about-text-widget,.about-image-widget{min-width:0;flex-basis:100%;max-width:100%}
  .about-text-widget h2{font-size:clamp(24px,6vw,40px)}
  .centered-tutoring-wrapper{padding:0;min-width:0;left:0;width:100%;box-sizing:border-box}
  .accordion-container{padding:0;min-width:0}
  .accordion-tab h2{padding:16px 12px;font-size:clamp(18px,4.5vw,26px)}
  .accordion-tab.open .accordion-content{padding:16px 12px}
  .two-column,.expertise-columns{grid-template-columns:1fr;flex-direction:column;gap:18px}
  .portfolio-inner{min-width:0}
  .portfolio-inner>div{box-sizing:border-box;max-width:100%!important;padding:24px 16px!important;margin:24px auto!important}
  .crt-line{white-space:normal;overflow-wrap:anywhere}
  .hacker-list{font-size:clamp(18px,4.5vw,28px)}
  .notice{box-sizing:border-box;max-width:100%;padding:16px;overflow-wrap:break-word}
  .contact-embed{margin-left:60px;padding:20px 12px!important}
  .contact-embed>div{box-sizing:border-box;min-width:0;padding:8px!important}
  .contact-form{width:100%!important;max-width:100%;display:block;min-height:950px}
}
/* Fit text to the space remaining beside the rail, including intermediate windows. */
@media(max-width:1100px){
 main.page-content p,main.page-content li,main.page-content h2,main.page-content h3{overflow-wrap:break-word}
 .about-text-widget,.about-image-widget,.expertise-column,.title-text{min-width:0}
}
@media(max-width:899px){
 .about-text-widget p,.opening-context,.intro p,.section p{font-size:clamp(16px,calc(14px + .5vw),18px);line-height:1.65}
 .section-header{gap:12px;align-items:flex-start}
 .section-header .title-text{flex:1;overflow-wrap:break-word}
 .section-header i{flex-shrink:0;margin-top:4px}
 .tutoring-section h3{font-size:clamp(20px,calc(16px + 1.1vw),26px);line-height:1.3}
 .quote-line{margin-inline:0;padding:12px;box-sizing:border-box}
 .accordion-trigger{min-width:0;overflow-wrap:anywhere}
 .accordion-trigger i{flex-shrink:0}
 .accordion-content blockquote{margin-inline:0;overflow-wrap:break-word}
 .hero-heading-wrapper{container-type:inline-size}
 .hero-name{font-size:clamp(24px,9cqw,72px)}
 #home-page .hero-name{font-size:clamp(24px,10cqw,72px)}
}
@media(max-height:600px){.sidebar-content{justify-content:flex-start}.sidebar-links{justify-content:flex-start}.sidebar a,.sidebar .menu-toggle{margin:3px 0}.sidebar-logo{margin-top:0;min-height:50px}}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .rotating-text .word{opacity:0}.rotating-text .word:first-child{opacity:1}
 .fade-in-opening,.opening-quote,.opening-context,.intro{opacity:1!important;transform:none!important}
}
