/* ==========================================================================
   Photo Maxs — responsive layer
   Breakpoints follow Bootstrap 5: 1399 / 1199 / 991 / 767 / 575
   ========================================================================== */

/* ---------- ≤ 1399px ------------------------------------------------------ */
@media (max-width:1399.98px){
  .pm-cta__fan{ width:1000px; }
  .pm-fan{ width:118px; height:150px; }
  .pm-fan--1{ left:10px;  top:140px; }
  .pm-fan--2{ left:146px; top:70px; }
  .pm-fan--3{ left:292px; top:20px; }
  .pm-fan--4{ left:438px; top:6px; }
  .pm-fan--5{ left:584px; top:20px; }
  .pm-fan--6{ left:730px; top:70px; }
  .pm-fan--7{ left:866px; top:140px; }
  .pm-cta__inner{ padding-top:270px; }
}

@media (min-width:1200px){
  .pm-cta__title{
      margin-top: -100px
  }
}

/* ---------- ≤ 1199px ------------------------------------------------------ */
@media (max-width:1199.98px){
  :root{ --pm-pad-section:88px; }

  .pm-nav__link{ padding:9px 12px; font-size:.9rem; }

  .pm-stage{ max-width:100%; min-height:500px; }
  .pm-stage__side{ width:170px; }
  .pm-stage__side img{ height:190px; }
  .pm-stage__side--left{ left:0; }
  .pm-stage__side--right{ right:0; }
  .pm-stage__swap--l{ left:180px; }
  .pm-stage__swap--r{ right:180px; }

  .pm-steps{ gap:22px; padding:58px 0 62px; }
  .pm-step__tag--down{ bottom:-40px; }

  .pm-plan--featured{ transform:none; padding-top:30px; padding-bottom:30px; }

  .pm-cta__fan{ width:820px; height:290px; }
  .pm-fan{ width:100px; height:128px; }
  .pm-fan--1{ left:8px;   top:120px; }
  .pm-fan--2{ left:124px; top:60px; }
  .pm-fan--3{ left:246px; top:18px; }
  .pm-fan--4{ left:360px; top:4px; }
  .pm-fan--5{ left:474px; top:18px; }
  .pm-fan--6{ left:596px; top:60px; }
  .pm-fan--7{ left:712px; top:120px; }
  .pm-cta__inner{ padding-top:238px; }
}

/* ---------- ≤ 991px (mobile navigation kicks in) -------------------------- */
@media (max-width:991.98px){
  :root{ --pm-pad-section:76px; }

  html{ scroll-padding-top:96px; }

  .pm-nav{ padding:9px 9px 9px 18px; border-radius:26px; }
  .pm-burger{ display:flex; }

  .pm-nav__menu{
    position:absolute;
    top:calc(100% + 10px);
    left:0; right:0;
    display:block;
    padding:14px;
    background:#fff;
    border:1px solid var(--pm-line);
    border-radius:24px;
    box-shadow:var(--pm-sh-md);
    backdrop-filter:blur(16px);
    opacity:0;
    visibility:hidden;
    transform:translateY(-8px);
    transition:opacity .22s var(--pm-ease), transform .22s var(--pm-ease), visibility .22s;
  }
  .pm-nav__menu.is-open{ opacity:1; visibility:visible; transform:none; }
  .pm-nav__list{ display:block; }
  .pm-nav__link{ padding:12px 14px; font-size:1rem; border-radius:14px; }
  .pm-nav__cta{ margin-top:10px; padding-top:12px; border-top:1px solid var(--pm-line-soft); }
  .pm-nav__cta .pm-btn{ flex:1; }

  .pm-hero{ padding-top:140px; }

  .pm-stage{ min-height:auto; flex-direction:column; align-items:center; padding-bottom:40px; }
  .pm-stage__side{ position:static; width:100%; max-width:300px; display:none; }
  .pm-stage__swap{ display:none; }
  .pm-device{ width:290px; }

  .pm-steps{ grid-template-columns:1fr; gap:56px; padding:52px 0 40px; }
  .pm-step__tag--down{ top:-40px; bottom:auto; }
  .pm-step__tag--right{ left:6px; right:auto; flex-direction:row-reverse; }
  .pm-arc--c{ margin-right:0; margin-left:6px; transform:scaleX(-1); }

  .pm-faq__head{ position:static; }
  .pm-head{ margin-bottom:48px; }

  .pm-stats{ grid-template-columns:repeat(2,1fr); margin-top:44px; }
  .pm-stat:nth-child(2){ border-right:none; }
  .pm-stat:nth-child(-n+2){ border-bottom:1px solid var(--pm-line-soft); }

  .pm-cta{ padding:72px 0 80px; }
  .pm-cta__fan{ width:640px; height:230px; }
  .pm-fan{ width:82px; height:104px; border-radius:16px; }
  .pm-fan--1{ left:6px;   top:96px; }
  .pm-fan--2{ left:100px; top:48px; }
  .pm-fan--3{ left:196px; top:14px; }
  .pm-fan--4{ left:284px; top:2px; }
  .pm-fan--5{ left:372px; top:14px; }
  .pm-fan--6{ left:468px; top:48px; }
  .pm-fan--7{ left:558px; top:96px; }
  .pm-cta__inner{ padding-top:200px; }

  .pm-footer{ padding-top:56px; }
  .pm-footer__top{ padding-bottom:36px; }
}

/* ---------- ≤ 767px ------------------------------------------------------- */
@media (max-width:767.98px){
  :root{ --pm-pad-section:64px; }

  body{ font-size:15.5px; }

  .pm-hero{ padding-top:126px; }
  .pm-hero__sub{ font-size:1rem; }
  .pm-hero__actions .pm-btn{ flex:1 1 100%; }

  .pm-head__sub{ font-size:1rem; }

  .pm-rail{ margin:0 -12px; padding-bottom:26px; }
  .pm-fcard{ width:252px; margin-top:0; }
  .pm-fcard__text{ padding:22px 20px 18px; }
  .pm-fcard__text h3{ font-size:1.35rem; }
  .pm-fcard__media,
  .pm-fcard--tall .pm-fcard__media{ height:196px; }

  .pm-step__tag--up{ top:-40px; }
  .pm-arc{ width:64px; height:30px; }

  .pm-wcard{ padding:28px 24px; }

  .pm-toggle{ margin:-20px auto 36px; }
  .pm-toggle__btn{ padding:9px 15px; font-size:.88rem; }

  .pm-acc .accordion-button{ padding:17px 18px; font-size:1rem; }
  .pm-acc .accordion-body{ padding:0 18px 18px; }

  .pm-cta__fan{ width:430px; height:190px; }
  .pm-fan{ width:66px; height:84px; border-radius:13px; }
  .pm-fan--1,
  .pm-fan--7{ display:none; }
  .pm-fan--2{ left:12px;  top:64px; }
  .pm-fan--3{ left:96px;  top:22px; }
  .pm-fan--4{ left:182px; top:6px; }
  .pm-fan--5{ left:268px; top:22px; }
  .pm-fan--6{ left:352px; top:64px; }
  .pm-cta__inner{ padding-top:176px; }
  .pm-cta__actions .pm-btn{ flex:1 1 100%; }

  .pm-footer__bar{ justify-content:flex-start; }
  .pm-footer__bar ul{ gap:16px; }
}

/* ---------- ≤ 575px ------------------------------------------------------- */
@media (max-width:575.98px){
  .pm-hero__title{ letter-spacing:-.036em; }
  .pm-device{ width:264px; }
  .pm-chip{ padding:6px 11px; font-size:.7rem; }

  .pm-logos__row{ gap:12px 26px; }
  .pm-logos__row li{ font-size:1rem; }

  .pm-stats{ grid-template-columns:1fr; }
  .pm-stat{ border-right:none; border-bottom:1px solid var(--pm-line-soft); }
  .pm-stat:last-child{ border-bottom:none; }
  .pm-stat:nth-child(2){ border-bottom:1px solid var(--pm-line-soft); }

  .pm-plan{ padding:26px 22px; }
  .pm-plan__price{ font-size:2.5rem; }

  .pm-cta__fan{ width:340px; height:160px; }
  .pm-fan{ width:56px; height:72px; }
  .pm-fan--2{ left:8px;   top:52px; }
  .pm-fan--3{ left:78px;  top:18px; }
  .pm-fan--4{ left:146px; top:4px; }
  .pm-fan--5{ left:214px; top:18px; }
  .pm-fan--6{ left:282px; top:52px; }
  .pm-cta__inner{ padding-top:152px; }
}
