/*
 * AH Digital — Homepage Desktop Refinement Pass v1
 *
 * Scope:
 * - tighter desktop rhythm
 * - hero above-the-fold improvement
 * - sticky Product Studio architecture
 * - sticky Why Abdessamad profile
 * - FAQ hierarchy/readability
 * - Technology + system micro-text readability
 * - Final CTA spacing/readability
 *
 * Loaded after all homepage section styles so it can refine without
 * replacing the section source files.
 */

/* ------------------------------------------------------------
   Shared homepage readability
   ------------------------------------------------------------ */

@media (min-width: 1024px) {
  .ah-home .ah-section-heading__eyebrow {
    font-size: clamp(0.68rem, 0.72vw, 0.76rem);
    line-height: 1.45;
  }
}

/* ------------------------------------------------------------
   HERO — more useful content inside the first viewport
   ------------------------------------------------------------ */

@media (min-width: 1024px) {
  .ah-home-hero {
    padding-block:
      clamp(52px, 5.2vw, 82px)
      clamp(52px, 4.8vw, 76px);
  }

  .ah-home-hero__grid {
    gap: clamp(40px, 5vw, 78px);
  }

  .ah-home-hero__eyebrow {
    margin-block-end: 18px;
    font-size: 0.76rem;
  }

  .ah-home-hero__title {
    max-width: 13.8ch;
    font-size: clamp(3.45rem, 4.65vw, 5.15rem);
    line-height: 0.985;
  }

  .ah-home-hero__copy {
    max-width: 58ch;
    margin-block-start: 22px;
    font-size: clamp(1.03rem, 1.15vw, 1.16rem);
    line-height: 1.62;
  }

  .ah-home-hero__actions {
    margin-block-start: 26px;
  }

  .ah-home-hero__trust {
    margin-block-start: 22px;
    font-size: 0.86rem;
  }

  .ah-home-system__canvas {
    height: 395px;
  }

  .ah-home-system__footer {
    min-height: 58px;
  }
}

/* Keep mid-size laptops balanced without making the H1 dominate. */
@media (min-width: 1024px) and (max-width: 1180px) {
  .ah-home-hero__title {
    max-width: 13.2ch;
    font-size: clamp(3.25rem, 4.75vw, 4.55rem);
  }

  .ah-home-system__canvas {
    height: 370px;
  }
}

/* ------------------------------------------------------------
   PRODUCT STUDIO — sticky architecture + tighter rhythm
   ------------------------------------------------------------ */

@media (min-width: 1024px) {
  .ah-studio {
    padding-block: clamp(88px, 8vw, 128px);
  }

  .ah-studio__system {
    margin-block-start: clamp(52px, 6vw, 78px);
  }

  .ah-studio__architecture-top {
    font-size: 0.64rem;
  }

  .ah-studio-node > span,
  .ah-studio__principles span,
  .ah-studio-product__number {
    font-size: 0.62rem;
  }

  .ah-studio-node small {
    font-size: 0.56rem;
  }

  .ah-studio-node strong {
    font-size: clamp(0.76rem, 0.82vw, 0.86rem);
  }

  .ah-studio__principles strong {
    font-size: 0.92rem;
  }

  .ah-studio__principles p {
    font-size: 0.82rem;
  }

  .ah-studio__possibilities-heading span {
    font-size: 0.98rem;
  }

  .ah-studio-product h3 {
    font-size: 0.98rem;
  }

  .ah-studio-product p {
    font-size: 0.82rem;
    line-height: 1.58;
  }
}

@media (min-width: 1100px) {
  /*
   * overflow:hidden on the section can stop position:sticky from behaving
   * naturally. clip keeps the decorative overflow controlled without
   * creating a scrolling ancestor.
   */
  .ah-studio {
    overflow: clip;
  }

  .ah-studio__architecture {
    position: sticky;
    inset-block-start: 112px;
    align-self: start;
  }
}

/* ------------------------------------------------------------
   WHY ABDESSAMAD — founder profile stays visible with reasons
   ------------------------------------------------------------ */

@media (min-width: 1024px) {
  .ah-why {
    padding-block: clamp(88px, 8.5vw, 136px);
  }

  .ah-why__grid {
    gap: clamp(32px, 4vw, 58px);
    margin-block-start: clamp(56px, 6.5vw, 82px);
  }

  .ah-why .ah-section-heading__title {
    max-width: 15ch;
    font-size: clamp(3rem, 4.45vw, 5.15rem);
  }

  .ah-why__statement span {
    font-size: 0.65rem;
  }

  .ah-why__portrait {
    min-height: 490px;
  }

  .ah-why__portrait img {
    width: min(91%, 570px);
  }

  .ah-why__portrait-badge span {
    font-size: 0.6rem;
  }

  .ah-why__portrait-badge strong {
    font-size: 0.78rem;
  }

  .ah-why__operator-top {
    min-height: 50px;
    font-size: 0.62rem;
  }

  .ah-why__operator-body {
    padding: 18px 20px;
  }

  .ah-why__operator-name strong {
    font-size: 1.02rem;
  }

  .ah-why__operator-name span {
    font-size: 0.8rem;
  }

  .ah-why__operator-list {
    margin-block: 16px;
  }

  .ah-why__operator-list > div {
    padding-block: 10px;
  }

  .ah-why__operator-list dt,
  .ah-why-card__number,
  .ah-why__experience-intro > span {
    font-size: 0.62rem;
  }

  .ah-why__operator-list dd {
    font-size: 0.79rem;
  }

  .ah-why-card {
    min-height: 158px;
    padding-block: 24px;
  }

  .ah-why__experience {
    margin-block-start: 58px;
  }

  .ah-why__closing {
    margin-block-start: 36px;
  }
}

@media (min-width: 1100px) {
  .ah-why {
    overflow: clip;
  }

  .ah-why__profile {
    position: sticky;
    inset-block-start: 108px;
    align-self: start;
  }
}

/* ------------------------------------------------------------
   FAQ — stronger content hierarchy, less oversized left title
   ------------------------------------------------------------ */

@media (min-width: 1024px) {
  .ah-faq {
    padding-block: clamp(88px, 8vw, 128px);
  }

  .ah-faq__layout {
    grid-template-columns: minmax(300px, 0.62fr) minmax(0, 1.38fr);
    gap: clamp(48px, 6vw, 92px);
  }

  .ah-faq__intro {
    inset-block-start: 108px;
  }

  .ah-faq .ah-section-heading__title {
    max-width: 12.5ch;
    font-size: clamp(2.85rem, 4.05vw, 4.65rem);
    line-height: 1.02;
  }

  .ah-faq .ah-section-heading__copy {
    max-width: 37ch;
  }

  .ah-faq__signal {
    margin-block-start: 30px;
  }

  .ah-faq__signal span,
  .ah-faq__contact > span,
  .ah-faq-item__index,
  .ah-faq__footer span {
    font-size: 0.62rem;
  }

  .ah-faq__signal strong {
    font-size: 0.76rem;
  }

  .ah-faq-item summary {
    min-height: 94px;
  }

  .ah-faq-item__question {
    max-width: 46ch;
    font-size: clamp(1.08rem, 1.45vw, 1.32rem);
  }

  .ah-faq-item__answer p {
    font-size: 0.92rem;
  }
}

/* ------------------------------------------------------------
   TECHNOLOGY — lift micro text to a comfortable desktop size
   ------------------------------------------------------------ */

@media (min-width: 1024px) {
  .ah-tech {
    padding-block: clamp(88px, 8vw, 132px);
  }

  .ah-tech__matrix {
    margin-block-start: clamp(54px, 6vw, 78px);
  }

  .ah-tech__principle span,
  .ah-tech-row__number {
    font-size: 0.64rem;
  }

  .ah-tech__matrix-head {
    font-size: 0.62rem;
    min-height: 50px;
  }

  .ah-tech-row {
    min-height: 122px;
  }

  .ah-tech-row__items span {
    font-size: 0.66rem;
    padding: 7px 10px;
  }

  .ah-tech-architecture__top {
    font-size: 0.62rem;
  }

  .ah-tech-node span {
    font-size: 0.58rem;
  }

  .ah-tech-node strong {
    font-size: 0.84rem;
  }
}

/* ------------------------------------------------------------
   FINAL CTA — reduce dead space, preserve impact
   ------------------------------------------------------------ */

@media (min-width: 1024px) {
  .ah-final-cta {
    padding-block: clamp(64px, 6vw, 94px);
  }

  .ah-final-cta__content {
    gap: clamp(40px, 5vw, 72px);
    padding:
      clamp(40px, 5.2vw, 68px)
      clamp(28px, 4.5vw, 58px);
  }

  .ah-final-cta__copy h2 {
    max-width: 13.5ch;
    font-size: clamp(2.7rem, 4.45vw, 5.1rem);
  }

  .ah-final-cta__eyebrow,
  .ah-final-cta__starter-head span {
    font-size: 0.64rem;
  }

  .ah-final-cta__starter-head small {
    font-size: 0.76rem;
  }

  .ah-final-cta__starter-list a > strong {
    font-size: 0.88rem;
  }

  .ah-final-cta__footer span {
    font-size: 0.6rem;
  }

  .ah-final-cta__footer strong {
    font-size: 0.8rem;
  }

  .ah-final-cta__flow strong {
    font-size: 0.6rem;
  }
}

/* ------------------------------------------------------------
   Reduced motion: refinement does not add motion, but keep
   geometry changes instant for users who request reduced motion.
   ------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
  .ah-studio__architecture,
  .ah-why__profile {
    scroll-behavior: auto;
  }
}