/* ============================================================
   Advoke CV — Responsive layout (final)
   Single source of truth for breakpoint adjustments.
   Breakpoints: 360, 480, 640, 768, 960, 1200, 1440.
   ============================================================ */

/* --- Very small phones (older Android) --- */
@media (max-width: 359px) {
  html { font-size: 15px; }
  .container,
  .container-xs,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl,
  .container-2xl { padding-inline: var(--space-4); }

  .adv-header__inner { padding-inline: var(--space-4); gap: var(--space-2); }
  .adv-header__brand span { display: none; }

  .adv-hero {
    padding-inline: var(--space-4);
    padding-block: var(--space-9) var(--space-10);
  }
  .adv-hero__title { font-size: 1.5rem; }
  .adv-hero__lead { font-size: 0.9375rem; }

  .adv-btn {
    font-size: var(--font-size-xs);
    padding: 0.55em 0.85em;
    min-height: 40px;
  }
}

/* --- Small phones --- */
@media (min-width: 360px) and (max-width: 479px) {
  .adv-header__inner { padding-inline: var(--space-5); }

  .adv-hero {
    padding-inline: var(--space-5);
    padding-block: var(--space-10) var(--space-11);
  }
  .adv-hero__title { font-size: 1.75rem; }

  .adv-home-cats,
  .adv-home-examples,
  .adv-home-features,
  .adv-home-workflow,
  .adv-home-learn,
  .adv-home-index { grid-template-columns: 1fr; }

  .adv-home-stats,
  .adv-stat-grid,
  .adv-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- Standard phones --- */
@media (min-width: 480px) and (max-width: 639px) {
  .adv-home-cats,
  .adv-home-examples,
  .adv-home-features,
  .adv-home-learn,
  .adv-home-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .adv-home-workflow { grid-template-columns: 1fr; }
  .adv-hero__title { font-size: 2rem; }
}

/* --- Large phones / small tablets --- */
@media (min-width: 640px) and (max-width: 767px) {
  .adv-home-cats,
  .adv-home-examples,
  .adv-home-features,
  .adv-home-learn,
  .adv-home-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .adv-home-workflow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .adv-hero__title { font-size: 2.25rem; }
  .adv-header__actions .adv-btn--primary { display: inline-flex; }
}

/* --- Tablets --- */
@media (min-width: 768px) and (max-width: 959px) {
  .adv-home-cats,
  .adv-home-examples,
  .adv-home-features,
  .adv-home-learn,
  .adv-home-index { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .adv-home-workflow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .adv-header__actions .adv-btn--ghost { display: inline-flex; }

  .adv-content-layout,
  .adv-gallery { grid-template-columns: 1fr; }

  .adv-content-sidebar,
  .adv-gallery__rail {
    position: static;
    max-height: none;
    overflow: visible;
  }
}

/* --- Small desktops --- */
@media (min-width: 960px) and (max-width: 1199px) {
  .adv-home-cats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .adv-home-examples { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .adv-home-features,
  .adv-home-learn { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .adv-home-workflow { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .adv-gallery__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- Standard desktops --- */
@media (min-width: 1200px) {
  .adv-home-cats,
  .adv-home-examples { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .adv-gallery__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* --- Large desktops --- */
@media (min-width: 1440px) {
  .adv-header__inner,
  .adv-footer__inner,
  .adv-home-section__inner,
  .adv-section__inner,
  .adv-content,
  .adv-article__inner,
  .adv-guide__inner,
  .adv-legal__inner,
  .adv-story__inner,
  .adv-blog__inner,
  .adv-blog-post__inner {
    max-width: var(--container-2xl);
  }
}

/* --- Hover-aware behaviour --- */
@media (hover: none) {
  .adv-card:hover,
  .adv-tpl-card:hover,
  .adv-tile:hover,
  .adv-feature:hover,
  .adv-cat:hover {
    transform: none;
    box-shadow: none;
    border-color: var(--color-line);
  }
  .adv-btn--primary:hover,
  .adv-btn--secondary:hover,
  .adv-btn--ghost:hover {
    transform: none;
    box-shadow: none;
  }
}

@media (hover: hover) and (pointer: fine) {
  .adv-tpl-card:hover .adv-tpl-card__thumb img {
    transform: scale(1.02);
  }
  .adv-tpl-card__thumb img {
    transition: transform var(--duration-medium) var(--ease-standard);
  }
  .adv-feature:hover .adv-feature__icon {
    background: var(--color-accent-soft);
    color: var(--color-accent);
    transition: var(--transition-base);
  }
}

/* --- Print --- */
@media print {
  .adv-header,
  .adv-footer,
  .adv-toast-region,
  .adv-modal,
  .adv-modal__panel,
  .skip-to-main,
  .adv-theme-toggle,
  .adv-header__toggle,
  .adv-header__mobile,
  .no-print,
  .adv-gallery__rail,
  .adv-content-sidebar,
  .adv-article__toc,
  .adv-guide__toc,
  .adv-legal__toc,
  .adv-pagination,
  .adv-load-more,
  .adv-error__ctas,
  .adv-error__search,
  .adv-sticky-bar,
  .adv-back-to-top {
    display: none !important;
  }

  .adv-page {
    box-shadow: none !important;
    page-break-after: always;
    break-after: page;
  }
  .adv-page:last-child {
    page-break-after: auto;
    break-after: auto;
  }
  body { background: #ffffff; }
}

/* --- Accessibility preferences --- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

@media (prefers-contrast: more) {
  :root {
    --color-muted: #1e293b;
    --color-muted-soft: #334155;
    --color-line: #94a3b8;
    --color-line-strong: #475569;
  }
  a { text-decoration: underline; }
  .adv-btn { border-width: 2px; }
}

@media (forced-colors: active) {
  .adv-btn,
  .adv-card,
  .adv-chip,
  .adv-badge,
  .adv-alert,
  .adv-empty,
  .adv-field input,
  .adv-field select,
  .adv-field textarea,
  .adv-header__toggle,
  .adv-tpl-card,
  .adv-page {
    border: 1px solid CanvasText;
  }
  .adv-btn--primary {
    background: ButtonFace;
    color: ButtonText;
    border-color: ButtonText;
  }
  a { color: LinkText; }
  a:visited { color: VisitedText; }
  :focus-visible { outline: 2px solid Highlight; }
}

/* --- Landscape phones --- */
@media (orientation: landscape) and (max-height: 500px) {
  .adv-modal__panel { max-height: calc(100vh - var(--space-4)); }
  .adv-hero { padding-block: var(--space-8); }
  .adv-header { position: static; }
  .adv-editor__topbar { position: static; }
}

/* --- Editor --- */
@media (max-width: 959px) {
  .adv-editor { grid-template-columns: 1fr; }
  .adv-editor__pane { max-height: none; }
  .adv-editor__pane--form {
    border-right: 0;
    border-bottom: 1px solid var(--color-line);
  }
  .adv-editor__pane[hidden] { display: none; }
  .adv-editor__mobile-switch { display: flex; }

  .adv-page[data-size="a4"],
  .adv-page[data-size="letter"] {
    width: 100%;
    height: auto;
    aspect-ratio: 210 / 297;
  }
  .adv-page__inner { padding: var(--space-5); }
  .adv-page__name { font-size: 18pt; }
  .adv-page__section-title { font-size: 9pt; }
}

@media (min-width: 960px) {
  .adv-editor__mobile-switch { display: none; }
}

/* --- Gallery --- */
@media (max-width: 959px) {
  .adv-gallery { grid-template-columns: 1fr; }
  .adv-gallery__rail {
    position: static;
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
  .adv-gallery__filter-toggle { display: inline-flex; }
  .adv-gallery__mobile-filters { display: block; }
}

@media (min-width: 960px) {
  .adv-gallery { grid-template-columns: 240px minmax(0, 1fr); }
  .adv-gallery__mobile-filters { display: none; }
}

/* --- Content pages --- */
@media (max-width: 767px) {
  .adv-content,
  .adv-article__inner,
  .adv-guide__inner,
  .adv-legal__inner,
  .adv-story__inner,
  .adv-blog__inner,
  .adv-blog-post__inner { padding-inline: var(--space-5); }

  .adv-content-layout { grid-template-columns: 1fr; }
  .adv-content-sidebar { position: static; order: 2; }

  .adv-article__title,
  .adv-guide__title,
  .adv-legal__title,
  .adv-story__title,
  .adv-blog__title,
  .adv-blog-post__title { font-size: 1.75rem; }

  .adv-article__body,
  .adv-blog-post__body { font-size: var(--font-size-md); }
}

/* --- Card grids --- */
@media (max-width: 639px) {
  .adv-card-grid,
  .adv-card-grid--2,
  .adv-card-grid--4,
  .adv-grid--2,
  .adv-grid--3,
  .adv-grid--4,
  .adv-related,
  .adv-testimonials { grid-template-columns: 1fr; }
}

@media (min-width: 640px) and (max-width: 959px) {
  .adv-card-grid,
  .adv-grid--2,
  .adv-grid--3,
  .adv-related,
  .adv-testimonials { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .adv-card-grid--4,
  .adv-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 960px) {
  .adv-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .adv-card-grid--2,
  .adv-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .adv-card-grid--4,
  .adv-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .adv-grid--3,
  .adv-related,
  .adv-testimonials { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* --- Sticky bar and back to top --- */
.adv-sticky-bar {
  position: fixed;
  left: var(--space-4);
  right: var(--space-4);
  bottom: var(--space-4);
  display: none;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  background: var(--color-bg);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  z-index: var(--z-sticky);
}
.adv-sticky-bar .adv-btn { flex: 1 1 auto; }
@media (max-width: 767px) {
  .adv-sticky-bar[data-visible="true"] { display: flex; }
}

.adv-back-to-top {
  position: fixed;
  right: var(--space-4);
  bottom: var(--space-4);
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-bg);
  color: var(--color-primary);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-circle);
  box-shadow: var(--shadow-md);
  opacity: 0;
  pointer-events: none;
  transition: var(--transition-base);
  z-index: var(--z-sticky);
}
.adv-back-to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
}
.adv-back-to-top:hover {
  background: var(--color-primary-soft);
  border-color: var(--color-accent);
}
.adv-back-to-top:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

/* --- Preview zoom --- */
[data-preview-pages] { --preview-zoom: 1; }
[data-preview-pages] > [data-page] { transform-origin: top center; }
@media (max-width: 959px) {
  [data-preview-pages] > [data-page] { transform: none !important; }
}

/* --- Story player --- */
@media (max-width: 639px) {
  .adv-story-player {
    max-width: 100%;
    border-radius: 0;
    aspect-ratio: 9 / 16;
  }
}

@media print {
  @page {
    size: A4;
    margin: 18mm 14mm;
  }
}