/* ==========================================================================
   MAIN: Import All CSS Modules (order matters for ITCSS)
   ========================================================================== */
@import 'settings.variables.css';
@import 'tools.mixins.css';
@import 'generic.reset.css';
@import 'elements.base.css';
@import 'objects.layout.css';
@import 'components.button.css';
@import 'components.hero.css';
@import 'components.feature.css';
@import 'components.portfolio.css';
@import 'components.treadmill.css';
@import 'components.footer.css';
@import 'utilities.css';
@import 'components.feature3d.css';

/* ==========================================================================
   RESPONSIVE: Mobile-First Media Queries
   ========================================================================== */
@media (max-width: 900px) {
  .c-feature__star, .c-feature__star3d { width: 48px; height: 48px; top: -22px; left: -22px; }
  .c-portfolio { padding: var(--space-l) 0 var(--space-m) 0; border-radius: 18px; }
  .c-portfolio__title { font-size: 1.5rem; }
  .c-portfolio__grid { gap: 1rem; }
  .c-portfolio__thumb { max-width: 98vw; }
}
@media (max-width: 700px) {
  .c-hero__content { flex-direction: column; align-items: center; gap: 1.5rem; }
  .c-hero__logo3d { width: 95vw; min-width: 180px; max-width: 98vw; height: auto; aspect-ratio: 4/1; margin-bottom: 1.2rem; }
  .c-hero__bust-col, .c-hero__text-col { min-width: unset; width: 100%; padding-left: 0; padding-right: 0; }
  .c-hero__text-col { align-items: center; text-align: center; padding-top: 0.5rem; padding-left: 1rem; padding-right: 1rem; }
  .c-hero__canvas--vertical { margin-bottom: 1.2rem; }
  .c-treadmill__title { font-size: 1.3rem; }
  .c-treadmill__viewport { height: 140px; }
  .c-treadmill__line { bottom: 24px; height: 4px; }
  .c-treadmill__drop-point { width: 22px; height: 22px; }
  .c-treadmill__objects { bottom: 36px; height: 80px; }
  .c-treadmill__object { width: 80px; height: 100px; }
  .c-treadmill__object canvas { width: 80px; height: 100px; }
  .c-portfolio__grid { gap: 1.2rem 1.2rem; padding: 1rem 0.5rem; }
  .c-portfolio__item, .c-portfolio__item canvas { width: 90px; height: 110px; }
}