/* ==========================================================================
   Fashho For Stationery - responsive.css
   Breakpoints (Bootstrap-aligned): 576, 768, 992, 1200.
   ========================================================================== */

@media (min-width: 576px) {
    .hero__actions { flex-direction: row; flex-wrap: wrap; }
    .facts { grid-template-columns: repeat(2, 1fr); }
    .edu-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 768px) {
    :root { --header-height: 76px; }
    .section { padding-block: var(--space-8); }
    .service { grid-template-columns: auto 1fr; column-gap: var(--space-5); }
    .service__where { grid-column: 2; }
    .why-list { grid-template-columns: repeat(2, 1fr); column-gap: var(--space-6); }
    .dir-row { grid-template-columns: 1.1fr 1.4fr; align-items: center; }
    .dir-row__actions { grid-column: 1 / -1; }
    .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; }
    .wholesale { grid-template-columns: 1.4fr 1fr; padding: var(--space-6); align-items: stretch; }
}

@media (min-width: 992px) {
    /* Desktop navigation: inline, no toggle */
    .nav-toggle { display: none; }
    .site-nav,
    .site-nav[hidden] {
        position: static;
        display: flex;
        align-items: center;
        gap: var(--space-5);
        padding: 0;
        background: none;
        border: 0;
        box-shadow: none;
    }
    .site-nav__list { flex-direction: row; gap: var(--space-1); }
    .site-nav__link {
        min-height: 44px;
        padding: 0 var(--space-3);
        border-block-end: 0;
        border-radius: var(--radius-sm);
        font-size: 1rem;
    }
    .site-nav__link:hover { background: var(--surface-soft); }
    .site-nav__link[aria-current="true"] { box-shadow: inset 0 -3px 0 var(--brand-gold); border-radius: 0; background: none; }
    .site-nav__cta { margin: 0; }

    .hero { padding-block: var(--space-8) 6rem; }
    .hero__grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: var(--space-7); align-items: center; }
    .chooser { margin-block-start: 0; }

    .about__grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: var(--space-7); align-items: start; }
    .facts { grid-template-columns: 1fr; margin-block-start: 0; }

    .lib-grid { grid-template-columns: repeat(3, 1fr); align-items: stretch; }
    .edu-grid { max-width: 56rem; }
    .waffer__inner { grid-template-columns: 1.1fr 0.9fr; }
    .why-list { grid-template-columns: repeat(3, 1fr); }
    .dir-row { grid-template-columns: 1fr 1.2fr auto; }
    .dir-row__actions { grid-column: auto; }
}

@media (min-width: 1200px) {
    .section-head { margin-block-end: var(--space-7); }
    .lib-grid { gap: var(--space-6); }
    .lib-card__body { padding: var(--space-6) var(--space-5); }
}

@media (min-width: 1700px) {
    html { font-size: 106.25%; }
}

/* Small phones (320-380px): tighten spacing so nothing wraps awkwardly */
@media (max-width: 380px) {
    .container { --bs-gutter-x: 1.5rem; }
    .brand__name { font-size: 1.1rem; }
    .brand__en { display: none; }
    .lib-card__head, .lib-card__body, .lib-card__foot { padding-inline: var(--space-4); }
    .chooser { padding: var(--space-4); }
    .btn { padding-inline: 1rem; }
}

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