.app-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 30;
  width: 250px;
  padding: 30px 20px;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  background: #fffdf9;
  border-right: 1px solid #f1ddc8;
}
.sidebar-description {
  margin: 16px 0 28px;
  color: var(--muted);
  font-size: 13px;
}
.sidebar-navigation summary {
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
  cursor: pointer;
}
.side-menu { display: flex; flex-direction: column; gap: 9px; }
.side-menu a {
  display: flex;
  flex-direction: column;
  padding: 14px 15px;
  border: 1px solid transparent;
  border-radius: 12px;
}
.side-menu a span { font-size: 14px; font-weight: 750; }
.side-menu a small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
}
.side-menu a:hover { background: #fff0dd; }
.side-menu a[aria-current="page"] {
  background: #ffdfb8;
  border-color: #ffc486;
  box-shadow: inset 4px 0 0 #ff7a1a;
}
.side-menu a[aria-current="page"] span { color: #6f2d08; }
.sidebar-bottom { margin-top: auto; padding-top: 32px; }
.sidebar-note {
  margin-bottom: 22px;
  padding: 16px;
  border-radius: 14px;
  background: #fff2df;
}
.sidebar-note strong { font-size: 12px; }
.sidebar-note p { margin-top: 7px; color: var(--muted); font-size: 11px; }
.app-main { margin-left: 250px; min-width: 0; }
.app-main .container { width: min(1120px, calc(100% - 56px)); }
.app-main .hero-grid { gap: 36px; }
.app-main h1 { font-size: clamp(38px, 4.5vw, 64px); }
.app-main .hero { padding: 56px 0; }
.app-main .hero-visual img { height: 280px; }

.module-view { min-height: calc(100vh - 110px); padding: 56px 0 70px; }
.module-view h1 { max-width: 850px; color: #4b3023; }
.module-description {
  max-width: 760px;
  margin-top: 24px;
  color: var(--muted);
  font-size: 17px;
}
.module-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin-top: 36px;
}
.module-card {
  padding: 25px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fffaf3;
}
.module-card h2 { margin: 18px 0 12px; font-size: 21px; letter-spacing: -.5px; }
.module-card p { color: var(--muted); font-size: 14px; }
.module-banner {
  margin-top: 28px;
  padding: 30px;
  border-radius: 20px;
  background: linear-gradient(120deg, #ffe3bd, #fff3df);
}
.module-banner h2 { font-size: 26px; }
.module-banner p { margin-top: 12px; max-width: 740px; color: #715640; }

.logistics-flow {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 34px;
}
.logistics-flow span {
  padding: 10px 14px;
  border-radius: 9px;
  background: #fff0dd;
  border: 1px solid #f0d4b4;
  font-size: 12px;
  font-weight: 700;
}
.logistics-flow span:last-child { background: #f1e8f6; color: var(--contrast); }

.idea-card { overflow: hidden; padding: 0 0 25px; background: white; }
.idea-card img { width: 100%; height: 210px; object-fit: cover; background: #fff0dd; }
.idea-card h2, .idea-card p { margin-left: 22px; margin-right: 22px; }

.learning-list { display: grid; gap: 14px; margin-top: 36px; max-width: 900px; }
.learning-list details {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 20px 24px;
  background: #fffaf3;
}
.learning-list summary { cursor: pointer; font-weight: 700; font-size: 17px; }
.learning-list p { margin-top: 15px; color: var(--muted); font-size: 15px; }
.learning-list details[open] { background: #fff2df; }

@media (max-width: 1150px) {
  .app-main .product-grid { grid-template-columns: repeat(2, 1fr); }
  .module-grid { grid-template-columns: 1fr; }
  .app-main .filter-fields { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 850px) {
  .app-sidebar {
    position: static;
    width: 100%;
    padding: 20px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .sidebar-description { margin: 10px 0 18px; }
  .sidebar-bottom { padding-top: 18px; }
  .sidebar-note { display: none; }
  .app-main { margin-left: 0; }
  .app-main .container { width: calc(100% - 32px); }
  .app-main .hero-grid { grid-template-columns: 1fr; }
  .module-view { padding: 36px 0; }
}
@media (max-width: 640px) {
  .app-main .product-grid, .app-main .filter-fields { grid-template-columns: 1fr; }
  .app-main h1 { font-size: 40px; }
  .module-description { font-size: 16px; }
  .module-banner { padding: 24px; }
}