
/* ============================================================
   PHOENIX RESPONSIVE FINAL — v17
   Loaded AFTER all page-specific CSS.
   Scope: responsive behavior only.
   Desktop design is intentionally left unchanged.
   Front page and auction page are excluded because their
   responsive layouts are already approved.
   ============================================================ */

html,body{max-width:100%;overflow-x:hidden;}
img{max-width:100%;height:auto;}
*,*::before,*::after{box-sizing:border-box;}

@media (min-width:901px) and (max-width:1365px){
  /* Prevent fixed desktop containers from forcing horizontal overflow. */
  .phx-tender-page:not(.phx-auction-page) .t-hero-inner,
  .phx-contract-page .cm-hero-inner,
  .phx-status-page .sm-hero-inner,
  .phx-incident-page .pi-hero-inner,
  .phx-occmed-page .om-hero-grid,
  .phx-srm-page .phx-srm-hero-grid,
  .phx-web-design-page .phx-web-design-hero,
  .phx-sms-page .phx-sms-hero,
  .phx-catalog-page .phx-catalog-hero-inner,
  .phx-clients-testimonials-page .phx-cl-hero-inner{
    width:100%!important;max-width:100%!important;min-width:0!important;
  }

  .phx-tender-page:not(.phx-auction-page) [class*="-inner"],
  .phx-contract-page [class*="-inner"],
  .phx-status-page [class*="-inner"],
  .phx-incident-page [class*="-inner"],
  .phx-occmed-page [class*="-inner"],
  .phx-srm-page [class*="-inner"],
  .phx-web-design-page [class*="-inner"],
  .phx-sms-page [class*="-inner"],
  .phx-catalog-page [class*="-inner"],
  .phx-clients-testimonials-page [class*="-inner"]{
    min-width:0!important;max-width:100%!important;
  }

  .phx-tender-page:not(.phx-auction-page) .t-hero,
  .phx-contract-page .cm-hero,
  .phx-status-page .sm-hero,
  .phx-incident-page .pi-hero,
  .phx-occmed-page .om-hero,
  .phx-srm-page .phx-srm-hero,
  .phx-web-design-page .phx-web-design-hero,
  .phx-sms-page .phx-sms-hero,
  .phx-catalog-page .phx-catalog-hero,
  .phx-clients-testimonials-page .phx-cl-hero{
    max-width:100%!important;overflow:hidden;
  }

  .phx-tender-page:not(.phx-auction-page) .t-hero-inner,
  .phx-contract-page .cm-hero-inner,
  .phx-status-page .sm-hero-inner,
  .phx-incident-page .pi-hero-inner,
  .phx-occmed-page .om-hero-grid,
  .phx-srm-page .phx-srm-hero-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:clamp(18px,3vw,48px)!important;
    padding-left:clamp(20px,4vw,48px)!important;
    padding-right:clamp(20px,4vw,48px)!important;
  }

  .phx-tender-page:not(.phx-auction-page) .t-hero-copy,
  .phx-contract-page .cm-hero-copy,
  .phx-status-page .sm-hero-copy,
  .phx-incident-page .pi-hero-copy,
  .phx-occmed-page .om-hero-copy,
  .phx-srm-page .phx-srm-copy{
    min-width:0!important;max-width:100%!important;
  }

  .phx-tender-page:not(.phx-auction-page) [class*="grid"],
  .phx-contract-page [class*="grid"],
  .phx-status-page [class*="grid"],
  .phx-incident-page [class*="grid"],
  .phx-occmed-page [class*="grid"],
  .phx-srm-page [class*="grid"],
  .phx-web-design-page [class*="grid"],
  .phx-sms-page [class*="grid"],
  .phx-clients-testimonials-page [class*="grid"]{
    min-width:0!important;
  }

  .phx-contract-page .cm-features,
  .phx-status-page .sm-features,
  .phx-incident-page .pi-features,
  .phx-occmed-page .om-features,
  .phx-srm-page .phx-srm-features,
  .phx-web-design-page .phx-web-design-feature-grid,
  .phx-sms-page .phx-sms-feature-grid{
    width:100%!important;max-width:100%!important;
  }

  .phx-catalog-page .phx-catalog-book-stage,
  .phx-catalog-page .phx-catalog-book{
    max-width:100%!important;
  }
}

/* Tablet landscape + small desktop */
@media (max-width:900px){
  .navbar{max-width:100%!important;}
  .phx-tender-page:not(.phx-auction-page),
  .phx-contract-page,.phx-status-page,.phx-incident-page,
  .phx-occmed-page,.phx-srm-page,.phx-web-design-page,.phx-sms-page,
  .phx-catalog-page,.phx-licenses-page,.phx-clients-testimonials-page,
  .phx-bird-page,.phx-hse-page{width:100%!important;max-width:100%!important;overflow-x:hidden!important;}

  /* All major page shells */
  .phx-web-design-page .phx-web-design-page-shell,
  .phx-sms-page .phx-sms-page-shell,
  .phx-catalog-page .phx-catalog-hero-inner,
  .phx-clients-testimonials-page .phx-cl-container,
  .phx-licenses-page .phx-licenses-shell,
  .phx-srm-page .phx-srm-wrap,
  .phx-bird-page .pb-shell,
  .phx-hse-page .hse-wrap,
  .phx-incident-page .pi-wrap,
  .phx-occmed-page .om-container{
    width:100%!important;max-width:100%!important;min-width:0!important;
    margin-left:auto!important;margin-right:auto!important;
  }

  /* Hero layouts become one clean column instead of squeezed desktop columns. */
  .phx-tender-page:not(.phx-auction-page) .t-hero-inner,
  .phx-contract-page .cm-hero-inner,
  .phx-status-page .sm-hero-inner,
  .phx-incident-page .pi-hero-inner,
  .phx-occmed-page .om-hero-grid,
  .phx-srm-page .phx-srm-hero-grid,
  .phx-web-design-page .phx-web-design-hero,
  .phx-sms-page .phx-sms-hero{
    width:100%!important;max-width:100%!important;min-width:0!important;
    display:grid!important;grid-template-columns:1fr!important;
    gap:18px!important;padding-left:16px!important;padding-right:16px!important;
  }

  .phx-tender-page:not(.phx-auction-page) .t-hero-copy,
  .phx-contract-page .cm-hero-copy,
  .phx-status-page .sm-hero-copy,
  .phx-incident-page .pi-hero-copy,
  .phx-occmed-page .om-hero-copy,
  .phx-srm-page .phx-srm-copy,
  .phx-web-design-page .phx-web-design-hero-copy,
  .phx-sms-page .phx-sms-hero-copy{
    width:100%!important;max-width:100%!important;min-width:0!important;
    margin:0!important;
  }

  .phx-tender-page:not(.phx-auction-page) [class*="-copy"],
  .phx-contract-page [class*="-copy"],
  .phx-status-page [class*="-copy"],
  .phx-incident-page [class*="-copy"],
  .phx-occmed-page [class*="-copy"],
  .phx-srm-page [class*="-copy"],
  .phx-web-design-page [class*="-copy"],
  .phx-sms-page [class*="-copy"]{
    min-width:0!important;max-width:100%!important;overflow-wrap:anywhere;
  }

  /* Main content grids */
  .phx-contract-page .cm-benefit-grid,
  .phx-contract-page .cm-compare-grid,
  .phx-status-page .sm-benefit-grid,
  .phx-status-page .sm-point-grid,
  .phx-incident-page .pi-compare-grid,
  .phx-incident-page .pi-process-grid,
  .phx-occmed-page .om-benefits-grid,
  .phx-occmed-page .om-compare-grid,
  .phx-occmed-page .om-process-grid,
  .phx-srm-page .phx-srm-feature-grid,
  .phx-srm-page .phx-srm-network-grid,
  .phx-web-design-page .phx-web-design-feature-grid,
  .phx-sms-page .phx-sms-feature-grid{
    width:100%!important;max-width:100%!important;min-width:0!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .phx-hse-page .hse-cap-columns,
  .phx-hse-page .hse-why-grid{
    width:100%!important;max-width:100%!important;min-width:0!important;
  }

  .phx-catalog-page .phx-catalog-book-stage{
    width:100%!important;max-width:100%!important;min-width:0!important;
    padding-left:8px!important;padding-right:8px!important;
  }
  .phx-catalog-page .phx-catalog-book{
    width:min(100%,1100px)!important;max-width:100%!important;
  }

  .phx-licenses-page .phx-licenses-showcase,
  .phx-licenses-page .phx-licenses-trust{
    width:100%!important;max-width:100%!important;min-width:0!important;
  }

  .phx-clients-testimonials-page .phx-cl-stage,
  .phx-clients-testimonials-page .phx-cl-showcase{
    width:100%!important;max-width:100%!important;min-width:0!important;
  }

  .phx-bird-page .pb-story-grid,
  .phx-bird-page .pb-culture-grid,
  .phx-bird-page .pb-symbol-grid{
    width:100%!important;max-width:100%!important;min-width:0!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .phx-hse-page .hse-cap-layout,
  .phx-hse-page .hse-two{
    width:100%!important;max-width:100%!important;min-width:0!important;
    grid-template-columns:1fr!important;
  }

  /* Prevent media/artwork from defining the viewport width. */
  .phx-tender-page:not(.phx-auction-page) img,
  .phx-contract-page img,.phx-status-page img,.phx-incident-page img,
  .phx-occmed-page img,.phx-srm-page img,.phx-web-design-page img,
  .phx-sms-page img,.phx-catalog-page img,.phx-licenses-page img,
  .phx-clients-testimonials-page img,.phx-bird-page img,.phx-hse-page img{
    max-width:100%!important;
  }

  .phx-tender-page:not(.phx-auction-page) .t-actions,
  .phx-contract-page .cm-actions,
  .phx-status-page .sm-actions,
  .phx-incident-page .pi-actions,
  .phx-occmed-page .om-actions,
  .phx-srm-page .phx-srm-actions{
    width:100%!important;max-width:100%!important;display:flex!important;
    flex-wrap:wrap!important;gap:10px!important;
  }

  .phx-tender-page:not(.phx-auction-page) .t-btn,
  .phx-contract-page .cm-btn,
  .phx-status-page .sm-btn,
  .phx-incident-page .pi-actions a,
  .phx-occmed-page .om-btn,
  .phx-srm-page .phx-srm-actions a{
    max-width:100%!important;min-width:0!important;white-space:normal!important;
  }
}

/* Tablet portrait */
@media (max-width:768px){
  .phx-contract-page .cm-benefit-grid,
  .phx-contract-page .cm-compare-grid,
  .phx-status-page .sm-benefit-grid,
  .phx-status-page .sm-point-grid,
  .phx-incident-page .pi-compare-grid,
  .phx-incident-page .pi-process-grid,
  .phx-occmed-page .om-benefits-grid,
  .phx-occmed-page .om-compare-grid,
  .phx-occmed-page .om-process-grid,
  .phx-srm-page .phx-srm-feature-grid,
  .phx-srm-page .phx-srm-network-grid,
  .phx-web-design-page .phx-web-design-feature-grid,
  .phx-sms-page .phx-sms-feature-grid,
  .phx-bird-page .pb-story-grid,
  .phx-bird-page .pb-culture-grid,
  .phx-bird-page .pb-symbol-grid{
    grid-template-columns:1fr!important;
  }

  .phx-licenses-page .phx-licenses-showcase,
  .phx-clients-testimonials-page .phx-cl-testimonial{
    min-width:0!important;max-width:100%!important;
  }
}

/* Phone */
@media (max-width:600px){
  .phx-tender-page:not(.phx-auction-page) .t-hero-inner,
  .phx-contract-page .cm-hero-inner,
  .phx-status-page .sm-hero-inner,
  .phx-incident-page .pi-hero-inner,
  .phx-occmed-page .om-hero-grid,
  .phx-srm-page .phx-srm-hero-grid,
  .phx-web-design-page .phx-web-design-hero,
  .phx-sms-page .phx-sms-hero{
    padding-left:12px!important;padding-right:12px!important;
  }

  .phx-tender-page:not(.phx-auction-page) .t-buttons,
  .phx-contract-page .cm-actions,
  .phx-status-page .sm-actions,
  .phx-incident-page .pi-actions,
  .phx-occmed-page .om-actions,
  .phx-srm-page .phx-srm-actions{
    flex-direction:column!important;align-items:stretch!important;
  }

  .phx-tender-page:not(.phx-auction-page) .t-btn,
  .phx-contract-page .cm-btn,
  .phx-status-page .sm-btn,
  .phx-occmed-page .om-btn,
  .phx-srm-page .phx-srm-actions a{
    width:100%!important;
  }

  .phx-catalog-page .phx-catalog-controls{
    width:100%!important;max-width:100%!important;flex-wrap:wrap!important;
  }

  .phx-catalog-page .phx-catalog-nav{
    max-width:100%!important;flex-wrap:wrap!important;
  }

  .phx-licenses-page .phx-licenses-controls{
    max-width:100%!important;flex-wrap:wrap!important;
  }

  .phx-clients-testimonials-page .phx-cl-logo-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .phx-bird-page .pb-tags{
    max-width:100%!important;flex-wrap:wrap!important;
  }

  .phx-hse-page .hse-actions{
    max-width:100%!important;flex-wrap:wrap!important;
  }
}

@media (max-width:375px){
  .phx-tender-page:not(.phx-auction-page) .t-hero-inner,
  .phx-contract-page .cm-hero-inner,
  .phx-status-page .sm-hero-inner,
  .phx-incident-page .pi-hero-inner,
  .phx-occmed-page .om-hero-grid,
  .phx-srm-page .phx-srm-hero-grid,
  .phx-web-design-page .phx-web-design-hero,
  .phx-sms-page .phx-sms-hero{
    padding-left:10px!important;padding-right:10px!important;
  }
}

/* Never allow long Persian/Latin labels to push the layout wider. */
.phx-tender-page:not(.phx-auction-page) :where(h1,h2,h3,h4,p,a,span,button),
.phx-contract-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-status-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-incident-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-occmed-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-srm-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-web-design-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-sms-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-catalog-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-licenses-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-clients-testimonials-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-bird-page :where(h1,h2,h3,h4,p,a,span,button),
.phx-hse-page :where(h1,h2,h3,h4,p,a,span,button){
  overflow-wrap:anywhere;
  max-width:100%;
}


/* ============================================================
   SAFE HERO TYPOGRAPHY SCALING — based on the approved SRM ratio reference.
   Only text sizes within known page hero sections and the shared navigation
   are adjusted at the requested laptop/tablet sizes. Hero geometry, image
   dimensions, text positions, page sections, and admin settings are untouched.
   ============================================================ */

/* 1366×768 and nearby laptop viewports: moderate scaling by viewport height. */
@media screen and (min-width:1101px) and (max-width:1440px) and (min-height:651px) {
  body.phx-contact-page .pc-hero h1,
  body.page-template-page-status-management-php .phx-status-page .sm-hero h1,
  body.phx-licenses-page .phx-licenses-hero h1,
  body.phx-contract-page .cm-hero h1,
  body.phx-clients-testimonials-page .phx-cl-hero h1,
  body.phx-web-design-page .phx-web-design-hero h1,
  body.phx-articles-page .pa-hero h1,
  body.phx-occmed-page .om-hero h1,
  body.phx-bird-page .pb-hero h1,
  body.phx-tender-page .t-hero h1,
  body.phx-tender-page.phx-auction-page .a-hero h1,
  body.phx-about-page .pa-hero h1,
  body.phx-srm-page .phx-srm-hero h1,
  body.phx-sms-page .phx-sms-hero h1,
  body.phx-incident-page .pi-hero h1,
  body.phx-hse-page .hse-hero h1,
  body.phx-catalog-page .phx-catalog-hero h1 {
    font-size:clamp(28px, calc(21px + 1.05vh), 34px)!important;
    line-height:1.3!important;
  }
  body.phx-contact-page .pc-hero p,
  body.page-template-page-status-management-php .phx-status-page .sm-hero p,
  body.phx-licenses-page .phx-licenses-hero p,
  body.phx-contract-page .cm-hero p,
  body.phx-clients-testimonials-page .phx-cl-hero p,
  body.phx-web-design-page .phx-web-design-hero p,
  body.phx-articles-page .pa-hero p,
  body.phx-occmed-page .om-hero p,
  body.phx-bird-page .pb-hero p,
  body.phx-tender-page .t-hero p,
  body.phx-tender-page.phx-auction-page .a-hero p,
  body.phx-about-page .pa-hero p,
  body.phx-srm-page .phx-srm-hero p,
  body.phx-sms-page .phx-sms-hero p,
  body.phx-incident-page .pi-hero p,
  body.phx-hse-page .hse-hero p,
  body.phx-catalog-page .phx-catalog-hero p {
    font-size:clamp(13px, calc(11.5px + .32vh), 15px)!important;
    line-height:1.65!important;
  }
  body.phx-contact-page .pc-hero :where(a,button),
  body.page-template-page-status-management-php .phx-status-page .sm-hero :where(a,button),
  body.phx-licenses-page .phx-licenses-hero :where(a,button),
  body.phx-contract-page .cm-hero :where(a,button),
  body.phx-clients-testimonials-page .phx-cl-hero :where(a,button),
  body.phx-web-design-page .phx-web-design-hero :where(a,button),
  body.phx-articles-page .pa-hero :where(a,button),
  body.phx-occmed-page .om-hero :where(a,button),
  body.phx-bird-page .pb-hero :where(a,button),
  body.phx-tender-page .t-hero :where(a,button),
  body.phx-tender-page.phx-auction-page .a-hero :where(a,button),
  body.phx-about-page .pa-hero :where(a,button),
  body.phx-srm-page .phx-srm-hero :where(a,button),
  body.phx-sms-page .phx-sms-hero :where(a,button),
  body.phx-incident-page .pi-hero :where(a,button),
  body.phx-hse-page .hse-hero :where(a,button),
  body.phx-catalog-page .phx-catalog-hero :where(a,button) {
    font-size:clamp(12px, calc(10.5px + .25vh), 14px)!important;
  }
  .nav-links > li > a { font-size:clamp(13px, calc(11.5px + .2vh), 15px)!important; }
  .cta-demo { font-size:clamp(12px, calc(10.5px + .2vh), 14px)!important; }
}

/* 1366×600 short laptop viewports: reduce text sizes without moving elements. */
@media screen and (min-width:1101px) and (max-width:1440px) and (max-height:650px) {
  body.phx-contact-page .pc-hero h1,
  body.page-template-page-status-management-php .phx-status-page .sm-hero h1,
  body.phx-licenses-page .phx-licenses-hero h1,
  body.phx-contract-page .cm-hero h1,
  body.phx-clients-testimonials-page .phx-cl-hero h1,
  body.phx-web-design-page .phx-web-design-hero h1,
  body.phx-articles-page .pa-hero h1,
  body.phx-occmed-page .om-hero h1,
  body.phx-bird-page .pb-hero h1,
  body.phx-tender-page .t-hero h1,
  body.phx-tender-page.phx-auction-page .a-hero h1,
  body.phx-about-page .pa-hero h1,
  body.phx-srm-page .phx-srm-hero h1,
  body.phx-sms-page .phx-sms-hero h1,
  body.phx-incident-page .pi-hero h1,
  body.phx-hse-page .hse-hero h1,
  body.phx-catalog-page .phx-catalog-hero h1 {
    font-size:clamp(24px, calc(18px + 1.15vh), 29px)!important;
    line-height:1.26!important;
  }
  body.phx-contact-page .pc-hero p,
  body.page-template-page-status-management-php .phx-status-page .sm-hero p,
  body.phx-licenses-page .phx-licenses-hero p,
  body.phx-contract-page .cm-hero p,
  body.phx-clients-testimonials-page .phx-cl-hero p,
  body.phx-web-design-page .phx-web-design-hero p,
  body.phx-articles-page .pa-hero p,
  body.phx-occmed-page .om-hero p,
  body.phx-bird-page .pb-hero p,
  body.phx-tender-page .t-hero p,
  body.phx-tender-page.phx-auction-page .a-hero p,
  body.phx-about-page .pa-hero p,
  body.phx-srm-page .phx-srm-hero p,
  body.phx-sms-page .phx-sms-hero p,
  body.phx-incident-page .pi-hero p,
  body.phx-hse-page .hse-hero p,
  body.phx-catalog-page .phx-catalog-hero p {
    font-size:clamp(12px, calc(10px + .42vh), 13px)!important;
    line-height:1.52!important;
  }
  body.phx-contact-page .pc-hero :where(a,button),
  body.page-template-page-status-management-php .phx-status-page .sm-hero :where(a,button),
  body.phx-licenses-page .phx-licenses-hero :where(a,button),
  body.phx-contract-page .cm-hero :where(a,button),
  body.phx-clients-testimonials-page .phx-cl-hero :where(a,button),
  body.phx-web-design-page .phx-web-design-hero :where(a,button),
  body.phx-articles-page .pa-hero :where(a,button),
  body.phx-occmed-page .om-hero :where(a,button),
  body.phx-bird-page .pb-hero :where(a,button),
  body.phx-tender-page .t-hero :where(a,button),
  body.phx-tender-page.phx-auction-page .a-hero :where(a,button),
  body.phx-about-page .pa-hero :where(a,button),
  body.phx-srm-page .phx-srm-hero :where(a,button),
  body.phx-sms-page .phx-sms-hero :where(a,button),
  body.phx-incident-page .pi-hero :where(a,button),
  body.phx-hse-page .hse-hero :where(a,button),
  body.phx-catalog-page .phx-catalog-hero :where(a,button) {
    font-size:11px!important;
  }
  .nav-links > li > a { font-size:12px!important; }
  .cta-demo { font-size:11px!important; }
}

/* Tablet: typography only; existing tablet navigation/layout rules remain intact. */
@media screen and (min-width:601px) and (max-width:1100px) {
  body.phx-contact-page .pc-hero h1,
  body.page-template-page-status-management-php .phx-status-page .sm-hero h1,
  body.phx-licenses-page .phx-licenses-hero h1,
  body.phx-contract-page .cm-hero h1,
  body.phx-clients-testimonials-page .phx-cl-hero h1,
  body.phx-web-design-page .phx-web-design-hero h1,
  body.phx-articles-page .pa-hero h1,
  body.phx-occmed-page .om-hero h1,
  body.phx-bird-page .pb-hero h1,
  body.phx-tender-page .t-hero h1,
  body.phx-tender-page.phx-auction-page .a-hero h1,
  body.phx-about-page .pa-hero h1,
  body.phx-srm-page .phx-srm-hero h1,
  body.phx-sms-page .phx-sms-hero h1,
  body.phx-incident-page .pi-hero h1,
  body.phx-hse-page .hse-hero h1,
  body.phx-catalog-page .phx-catalog-hero h1 {
    font-size:clamp(25px, 3.05vw, 33px)!important;
    line-height:1.3!important;
  }
  body.phx-contact-page .pc-hero p,
  body.page-template-page-status-management-php .phx-status-page .sm-hero p,
  body.phx-licenses-page .phx-licenses-hero p,
  body.phx-contract-page .cm-hero p,
  body.phx-clients-testimonials-page .phx-cl-hero p,
  body.phx-web-design-page .phx-web-design-hero p,
  body.phx-articles-page .pa-hero p,
  body.phx-occmed-page .om-hero p,
  body.phx-bird-page .pb-hero p,
  body.phx-tender-page .t-hero p,
  body.phx-tender-page.phx-auction-page .a-hero p,
  body.phx-about-page .pa-hero p,
  body.phx-srm-page .phx-srm-hero p,
  body.phx-sms-page .phx-sms-hero p,
  body.phx-incident-page .pi-hero p,
  body.phx-hse-page .hse-hero p,
  body.phx-catalog-page .phx-catalog-hero p {
    font-size:clamp(13px, 1.45vw, 15px)!important;
    line-height:1.6!important;
  }
  .nav-links > li > a { font-size:clamp(12px, 1.25vw, 14px)!important; }
  .cta-demo { font-size:clamp(11px, 1.15vw, 13px)!important; }
}



/* ============================================================
   Corrected all-page hero responsive typography.
   Scoped to unique hero components so page wrappers/body classes do not
   prevent rules from matching. No positioning, order, or layout changes.
   ============================================================ */
@media screen and (min-width:1101px) and (max-width:1440px) and (max-height:650px) {
  :is(.pc-hero,.sm-hero,.phx-licenses-hero,.cm-hero,.phx-cl-hero,.phx-web-design-hero,.phx-article-hero,.pa-hero,.om-hero,.pb-hero,.a-hero,.t-hero,.phx-srm-hero,.phx-sms-hero,.pi-hero,.hse-hero,.phx-catalog-hero,.hero-wrap) h1 {
    font-size:clamp(23px, calc(17px + 1.15vh), 29px)!important;
    line-height:1.28!important;
  }
  :is(.pc-hero,.sm-hero,.phx-licenses-hero,.cm-hero,.phx-cl-hero,.phx-web-design-hero,.phx-article-hero,.pa-hero,.om-hero,.pb-hero,.a-hero,.t-hero,.phx-srm-hero,.phx-sms-hero,.pi-hero,.hse-hero,.phx-catalog-hero,.hero-wrap) p {
    font-size:clamp(11.5px, calc(9.5px + .4vh), 13px)!important;
    line-height:1.55!important;
  }
  :is(.pc-hero,.sm-hero,.phx-licenses-hero,.cm-hero,.phx-cl-hero,.phx-web-design-hero,.phx-article-hero,.pa-hero,.om-hero,.pb-hero,.a-hero,.t-hero,.phx-srm-hero,.phx-sms-hero,.pi-hero,.hse-hero,.phx-catalog-hero,.hero-wrap) :is(a,button,.button) {
    font-size:11px!important;
  }
  .navbar .nav-links > li > a {font-size:12px!important;}
  .navbar .cta-demo,.navbar .nav-left a {font-size:11px!important;}
}
@media screen and (min-width:1101px) and (max-width:1440px) and (min-height:651px) {
  :is(.pc-hero,.sm-hero,.phx-licenses-hero,.cm-hero,.phx-cl-hero,.phx-web-design-hero,.phx-article-hero,.pa-hero,.om-hero,.pb-hero,.a-hero,.t-hero,.phx-srm-hero,.phx-sms-hero,.pi-hero,.hse-hero,.phx-catalog-hero,.hero-wrap) h1 {
    font-size:clamp(27px, calc(22px + .85vh), 34px)!important;
    line-height:1.3!important;
  }
  :is(.pc-hero,.sm-hero,.phx-licenses-hero,.cm-hero,.phx-cl-hero,.phx-web-design-hero,.phx-article-hero,.pa-hero,.om-hero,.pb-hero,.a-hero,.t-hero,.phx-srm-hero,.phx-sms-hero,.pi-hero,.hse-hero,.phx-catalog-hero,.hero-wrap) p {
    font-size:clamp(12px, calc(10.5px + .3vh), 15px)!important;
    line-height:1.65!important;
  }
  :is(.pc-hero,.sm-hero,.phx-licenses-hero,.cm-hero,.phx-cl-hero,.phx-web-design-hero,.phx-article-hero,.pa-hero,.om-hero,.pb-hero,.a-hero,.t-hero,.phx-srm-hero,.phx-sms-hero,.pi-hero,.hse-hero,.phx-catalog-hero,.hero-wrap) :is(a,button,.button) {
    font-size:clamp(12px, calc(10px + .22vh), 14px)!important;
  }
  .navbar .nav-links > li > a {font-size:clamp(12px, calc(11px + .18vh), 15px)!important;}
  .navbar .cta-demo,.navbar .nav-left a {font-size:clamp(11px, calc(10px + .18vh), 14px)!important;}
}
@media screen and (min-width:601px) and (max-width:1100px) {
  :is(.pc-hero,.sm-hero,.phx-licenses-hero,.cm-hero,.phx-cl-hero,.phx-web-design-hero,.phx-article-hero,.pa-hero,.om-hero,.pb-hero,.a-hero,.t-hero,.phx-srm-hero,.phx-sms-hero,.pi-hero,.hse-hero,.phx-catalog-hero,.hero-wrap) h1 {
    font-size:clamp(24px, 2.8vw, 32px)!important;
    line-height:1.32!important;
  }
  :is(.pc-hero,.sm-hero,.phx-licenses-hero,.cm-hero,.phx-cl-hero,.phx-web-design-hero,.phx-article-hero,.pa-hero,.om-hero,.pb-hero,.a-hero,.t-hero,.phx-srm-hero,.phx-sms-hero,.pi-hero,.hse-hero,.phx-catalog-hero,.hero-wrap) p {
    font-size:clamp(12px, 1.3vw, 15px)!important;
    line-height:1.65!important;
  }
  :is(.pc-hero,.sm-hero,.phx-licenses-hero,.cm-hero,.phx-cl-hero,.phx-web-design-hero,.phx-article-hero,.pa-hero,.om-hero,.pb-hero,.a-hero,.t-hero,.phx-srm-hero,.phx-sms-hero,.pi-hero,.hse-hero,.phx-catalog-hero,.hero-wrap) :is(a,button,.button) {
    font-size:clamp(11px, 1.1vw, 13px)!important;
  }
  .navbar .nav-links > li > a {font-size:clamp(11px, 1.15vw, 14px)!important;}
  .navbar .cta-demo,.navbar .nav-left a {font-size:clamp(10px, 1vw, 13px)!important;}
}

/* ============================================================
   TARGETED SECOND PASS — only the five reported headers.
   Keeps existing content order/positions while preventing overflow.
   ============================================================ */
@media screen and (min-width:1101px) and (max-width:1440px) and (max-height:650px) {
  /* Home hero: text and main navigation fit the shorter viewport. */
  body.home .hero-content { min-width:0!important; max-width:100%!important; }
  body.home .hero-text { width:min(42vw,450px)!important; max-width:100%!important; }
  body.home .hero-text h1 { font-size:clamp(24px,2.05vw,29px)!important; line-height:1.28!important; }
  body.home .hero-text p { font-size:clamp(11px,.88vw,12.5px)!important; line-height:1.55!important; }
  body.home .hero-buttons :is(a,button) { font-size:11px!important; min-height:34px!important; padding:7px 15px!important; }
  body.home .navbar { padding-top:12px!important; padding-bottom:12px!important; }
  body.home .nav-links { gap:clamp(10px,1.4vw,20px)!important; }
  body.home .nav-links>li>a { font-size:12px!important; }
  body.home .navbar .cta-demo, body.home .navbar .nav-left a { font-size:11px!important; padding:7px 12px!important; }
  body.home .hero-wrap .phoenix-glass-rail { transform:translateX(-50%) scale(.88)!important; transform-origin:top center!important; }

  /* Tender: remove old nowrap behavior that pushed feature items outside the hero. */
  .phx-tender-page:not(.phx-auction-page) .t-hero,
  .phx-tender-page:not(.phx-auction-page) .t-hero-inner { height:auto!important; min-height:0!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-inner { padding-top:clamp(68px,11vh,84px)!important; padding-bottom:18px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy { width:100%!important; max-width:100%!important; padding-left:clamp(20px,3vw,42px)!important; padding-right:clamp(20px,3vw,42px)!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy h1 { font-size:clamp(23px,1.9vw,28px)!important; line-height:1.28!important; white-space:normal!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy p { font-size:11px!important; line-height:1.55!important; margin-bottom:10px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy>h1,
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy>p { white-space:normal!important; overflow-wrap:anywhere!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-features { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:7px!important; margin-top:10px!important; padding-top:8px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-mini { min-width:0!important; gap:5px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-mini-icon { width:23px!important; height:23px!important; flex-basis:23px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-mini b { font-size:9px!important; line-height:1.35!important; }
  .phx-tender-page:not(.phx-auction-page) .t-mini span { font-size:7px!important; line-height:1.45!important; }
  .phx-tender-page:not(.phx-auction-page) .t-buttons { gap:7px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-btn { min-width:0!important; min-height:32px!important; padding:6px 12px!important; font-size:10px!important; }

  /* Auction: preserve full image ratio and compact the feature row/buttons. */
  .phx-auction-page .a-hero { min-height:0!important; }
  .phx-auction-page .a-hero-art img { object-fit:contain!important; object-position:center!important; width:100%!important; height:100%!important; }
  .phx-auction-page .a-hero-copy { width:54%!important; padding:78px 4vw 18px 3vw!important; }
  .phx-auction-page .a-hero-copy h1 { font-size:clamp(24px,1.95vw,29px)!important; line-height:1.25!important; margin-bottom:7px!important; }
  .phx-auction-page .a-hero-copy p { font-size:11px!important; line-height:1.5!important; margin-bottom:8px!important; }
  .phx-auction-page .a-buttons { gap:6px!important; }
  .phx-auction-page .a-btn { min-width:0!important; min-height:30px!important; padding:5px 10px!important; font-size:10px!important; }
  .phx-auction-page .a-hero-features { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:6px!important; margin-top:8px!important; padding-top:7px!important; }
  .phx-auction-page .a-mini { min-width:0!important; gap:4px!important; padding-left:2px!important; }
  .phx-auction-page .a-mini-icon { max-width:25px!important; max-height:25px!important; }
  .phx-auction-page .a-mini b { font-size:9px!important; line-height:1.35!important; }
  .phx-auction-page .a-mini span { font-size:7px!important; line-height:1.4!important; }

  /* Contracts: scale the full artwork within its column without cropping. */
  .phx-contract-page .cm-hero { height:clamp(500px,78vh,600px)!important; min-height:0!important; }
  .phx-contract-page .cm-hero-inner { height:100%!important; min-height:0!important; grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important; }
  .phx-contract-page .cm-hero-copy { min-width:0!important; padding:clamp(70px,11vh,88px) clamp(22px,3.5vw,46px) 18px!important; }
  .phx-contract-page .cm-hero h1 { font-size:clamp(24px,1.9vw,29px)!important; line-height:1.28!important; }
  .phx-contract-page .cm-hero p { font-size:11px!important; line-height:1.55!important; margin-bottom:10px!important; }
  .phx-contract-page .cm-hero-art { min-width:0!important; min-height:0!important; padding:12px!important; }
  .phx-contract-page .cm-hero-art img { width:100%!important; height:100%!important; max-width:100%!important; max-height:100%!important; object-fit:contain!important; }
  .phx-contract-page .cm-features { gap:6px!important; margin-top:12px!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  .phx-contract-page .cm-feature { gap:5px!important; }
  .phx-contract-page .cm-feature-icon { width:25px!important; height:25px!important; flex:0 0 25px!important; }
  .phx-contract-page .cm-feature b { font-size:9px!important; line-height:1.35!important; }
  .phx-contract-page .cm-feature small { font-size:7px!important; line-height:1.4!important; }
  .phx-contract-page .cm-btn { min-width:0!important; padding:7px 12px!important; font-size:10px!important; }

  /* Status: shrink title, description, feature row and actions to fit the hero. */
  .phx-status-page .sm-hero { height:clamp(500px,78vh,600px)!important; min-height:0!important; }
  .phx-status-page .sm-hero-inner { height:100%!important; min-height:0!important; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)!important; }
  .phx-status-page .sm-hero-copy { min-width:0!important; padding:78px 3vw 18px!important; }
  .phx-status-page .sm-hero h1 { font-size:clamp(24px,1.9vw,29px)!important; line-height:1.28!important; }
  .phx-status-page .sm-hero .sm-subtitle { font-size:clamp(17px,1.35vw,20px)!important; line-height:1.35!important; margin-bottom:8px!important; }
  .phx-status-page .sm-hero-copy>p { font-size:11px!important; line-height:1.5!important; margin-bottom:9px!important; }
  .phx-status-page .sm-features { gap:6px!important; margin-bottom:10px!important; }
  .phx-status-page .sm-features div { font-size:9px!important; line-height:1.35!important; }
  .phx-status-page .sm-features span { font-size:21px!important; }
  .phx-status-page .sm-features span img { width:21px!important; height:21px!important; }
  .phx-status-page .sm-btn { min-width:0!important; height:33px!important; padding:0 12px!important; font-size:10px!important; }

  /* Contact: keep the original two-column composition, but fit all copy. */
  .phx-contact-reference .pc-hero { min-height:0!important; }
  .phx-contact-reference .pc-hero-inner { min-height:0!important; padding:clamp(76px,11vh,88px) clamp(24px,4vw,50px) 24px!important; gap:clamp(18px,3vw,38px)!important; }
  .phx-contact-reference .pc-hero-copy { min-width:0!important; max-width:100%!important; }
  .phx-contact-reference .pc-hero h1 { font-size:clamp(24px,1.9vw,29px)!important; line-height:1.3!important; margin-bottom:9px!important; }
  .phx-contact-reference .pc-hero p { font-size:11px!important; line-height:1.55!important; }
  .phx-contact-reference .pc-kicker { font-size:11px!important; margin-bottom:8px!important; }
  .phx-contact-reference .pc-hero-art img { max-width:100%!important; max-height:260px!important; height:auto!important; object-fit:contain!important; }
}

@media screen and (min-width:1101px) and (max-width:1440px) and (min-height:651px) {
  body.home .hero-text h1 { font-size:clamp(28px,2.25vw,34px)!important; line-height:1.32!important; }
  body.home .hero-text p { font-size:clamp(12px,.98vw,14px)!important; line-height:1.65!important; }
  body.home .nav-links { gap:clamp(12px,1.7vw,24px)!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy h1 { font-size:clamp(27px,2.15vw,32px)!important; line-height:1.32!important; white-space:normal!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy>h1,
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy>p { white-space:normal!important; }
  .phx-auction-page .a-hero-art img { object-fit:contain!important; }
  .phx-auction-page .a-hero-copy { padding-top:82px!important; padding-bottom:24px!important; }
  .phx-auction-page .a-hero-copy h1 { font-size:clamp(28px,2.15vw,33px)!important; line-height:1.3!important; }
  .phx-auction-page .a-hero-copy p { font-size:12px!important; line-height:1.6!important; }
  .phx-contract-page .cm-hero { height:clamp(560px,78vh,620px)!important; min-height:0!important; }
  .phx-contract-page .cm-hero h1 { font-size:clamp(28px,2.15vw,34px)!important; }
  .phx-status-page .sm-hero { height:clamp(560px,78vh,620px)!important; min-height:0!important; }
  .phx-status-page .sm-hero h1 { font-size:clamp(28px,2.15vw,34px)!important; }
  .phx-contact-reference .pc-hero h1 { font-size:clamp(28px,2.15vw,34px)!important; }
}

@media screen and (min-width:601px) and (max-width:1100px) {
  body.home .hero-wrap { min-height:0!important; }
  body.home .hero-text { width:min(52vw,460px)!important; max-width:100%!important; }
  body.home .hero-text h1 { font-size:clamp(24px,2.7vw,31px)!important; line-height:1.3!important; }
  body.home .hero-text p { font-size:clamp(11px,1.3vw,14px)!important; line-height:1.6!important; }
  body.home .nav-links { gap:clamp(8px,1.2vw,14px)!important; }
  body.home .nav-links>li>a { font-size:clamp(10px,1.1vw,13px)!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-inner { grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important; height:auto!important; min-height:0!important; padding:90px 20px 22px!important; gap:16px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy { width:100%!important; padding:0!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy h1 { font-size:clamp(23px,2.8vw,30px)!important; line-height:1.3!important; white-space:normal!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-copy p { font-size:clamp(10px,1.2vw,12px)!important; line-height:1.55!important; }
  .phx-tender-page:not(.phx-auction-page) .t-hero-features { gap:6px!important; margin-top:10px!important; padding-top:8px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-mini { gap:4px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-mini-icon { width:22px!important; height:22px!important; flex-basis:22px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-mini b { font-size:9px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-mini span { font-size:7px!important; }
  .phx-tender-page:not(.phx-auction-page) .t-btn { min-width:0!important; padding:6px 10px!important; font-size:10px!important; }
  .phx-auction-page .a-hero-art img { object-fit:contain!important; }
  .phx-auction-page .a-hero-copy { width:56%!important; padding:90px 24px 20px!important; }
  .phx-auction-page .a-hero-copy h1 { font-size:clamp(24px,2.8vw,31px)!important; line-height:1.3!important; }
  .phx-auction-page .a-hero-copy p { font-size:clamp(10px,1.2vw,13px)!important; line-height:1.55!important; }
  .phx-auction-page .a-hero-features { gap:5px!important; margin-top:8px!important; }
  .phx-auction-page .a-mini b { font-size:9px!important; }
  .phx-auction-page .a-mini span { font-size:7px!important; }
  .phx-contract-page .cm-hero { height:auto!important; min-height:0!important; }
  .phx-contract-page .cm-hero-inner { height:auto!important; grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important; }
  .phx-contract-page .cm-hero-copy { padding:88px 22px 20px!important; }
  .phx-contract-page .cm-hero h1 { font-size:clamp(24px,2.8vw,31px)!important; line-height:1.3!important; }
  .phx-contract-page .cm-hero p { font-size:clamp(10px,1.2vw,13px)!important; line-height:1.55!important; }
  .phx-contract-page .cm-hero-art { min-height:0!important; }
  .phx-contract-page .cm-hero-art img { height:auto!important; max-height:420px!important; object-fit:contain!important; }
  .phx-contract-page .cm-features { gap:5px!important; margin-top:12px!important; }
  .phx-contract-page .cm-feature b { font-size:9px!important; }
  .phx-contract-page .cm-feature small { font-size:7px!important; }
  .phx-status-page .sm-hero { height:auto!important; min-height:0!important; }
  .phx-status-page .sm-hero-inner { height:auto!important; grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important; }
  .phx-status-page .sm-hero-copy { padding:88px 22px 22px!important; }
  .phx-status-page .sm-hero h1 { font-size:clamp(24px,2.8vw,31px)!important; line-height:1.3!important; }
  .phx-status-page .sm-hero .sm-subtitle { font-size:clamp(17px,1.8vw,22px)!important; }
  .phx-status-page .sm-hero-copy>p { font-size:clamp(10px,1.2vw,13px)!important; line-height:1.55!important; }
  .phx-status-page .sm-features { gap:5px!important; margin-bottom:12px!important; }
  .phx-status-page .sm-features div { font-size:9px!important; }
  .phx-status-page .sm-features span { font-size:22px!important; }
  .phx-status-page .sm-features span img { width:22px!important; height:22px!important; }
  .phx-contact-reference .pc-hero-inner { padding:88px 24px 26px!important; gap:20px!important; }
  .phx-contact-reference .pc-hero h1 { font-size:clamp(24px,2.8vw,31px)!important; line-height:1.35!important; }
  .phx-contact-reference .pc-hero p { font-size:clamp(11px,1.25vw,14px)!important; line-height:1.6!important; }
  .phx-contact-reference .pc-hero-art img { max-height:280px!important; object-fit:contain!important; }
}


/* Targeted follow-up: home, contract and contact hero sizing only.
   Keep desktop-wide design unchanged; applies only to laptop/tablet ranges. */
@media screen and (min-width:1101px) and (max-width:1440px) {
  /* Home: image ratio is set from the source image by phx-hero-ratio-responsive.js. */
  body.home .hero-wrap,
  body.front-page .hero-wrap { min-height:0!important; max-height:none!important; }
  body.home .hero-bg img,
  body.front-page .hero-bg img { width:100%!important; height:100%!important; object-fit:contain!important; object-position:center top!important; }
  body.home .hero-content,
  body.front-page .hero-content { padding-top:clamp(24px,4.2vh,38px)!important; padding-bottom:clamp(18px,3vh,30px)!important; }
  body.home .hero-text,
  body.front-page .hero-text { width:min(42vw,450px)!important; max-width:100%!important; padding-top:clamp(18px,3vh,34px)!important; }
  body.home .hero-text h1,
  body.front-page .hero-text h1 { font-size:clamp(23px,1.8vw,28px)!important; line-height:1.28!important; margin-bottom:8px!important; }
  body.home .hero-text p,
  body.front-page .hero-text p { font-size:clamp(10px,.82vw,12px)!important; line-height:1.55!important; margin-top:10px!important; }
  body.home .hero-buttons,
  body.front-page .hero-buttons { margin-top:16px!important; gap:8px!important; flex-wrap:wrap!important; }
  body.home .hero-buttons :is(a,button),
  body.front-page .hero-buttons :is(a,button) { min-height:30px!important; padding:6px 11px!important; font-size:10px!important; }
  body.home .navbar,
  body.front-page .navbar { gap:clamp(10px,1.2vw,18px)!important; padding-top:8px!important; padding-bottom:8px!important; }
  body.home .navbar-glass,
  body.front-page .navbar-glass { gap:clamp(10px,1.2vw,18px)!important; padding:7px 14px!important; }
  body.home .nav-links,
  body.front-page .nav-links { gap:clamp(8px,1vw,14px)!important; }
  body.home .nav-links>li>a,
  body.front-page .nav-links>li>a { font-size:clamp(10px,.82vw,12px)!important; }
  body.home .navbar .cta-demo, body.home .navbar .nav-left a,
  body.front-page .navbar .cta-demo, body.front-page .navbar .nav-left a { font-size:10px!important; padding:6px 10px!important; }
  body.home .hero-wrap .phoenix-glass-rail,
  body.front-page .hero-wrap .phoenix-glass-rail { transform:translateX(-50%) scale(.78)!important; transform-origin:top center!important; }

  /* Contracts: let the artwork's intrinsic ratio and the text determine hero height. */
  .phx-contract-page .cm-hero { height:auto!important; min-height:0!important; max-height:none!important; }
  .phx-contract-page .cm-hero-inner { height:auto!important; min-height:0!important; grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr)!important; align-items:center!important; }
  .phx-contract-page .cm-hero-copy { min-width:0!important; padding:clamp(76px,12vh,88px) clamp(22px,3vw,40px) 22px!important; }
  .phx-contract-page .cm-kicker { font-size:clamp(10px,.85vw,12px)!important; margin-bottom:7px!important; }
  .phx-contract-page .cm-hero h1 { font-size:clamp(23px,1.85vw,28px)!important; line-height:1.28!important; margin-bottom:8px!important; }
  .phx-contract-page .cm-hero p { font-size:clamp(10px,.82vw,12px)!important; line-height:1.55!important; margin-bottom:10px!important; }
  .phx-contract-page .cm-actions { gap:7px!important; }
  .phx-contract-page .cm-btn { min-width:0!important; min-height:30px!important; padding:6px 11px!important; font-size:10px!important; }
  .phx-contract-page .cm-features { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:6px!important; margin-top:10px!important; }
  .phx-contract-page .cm-feature { min-width:0!important; gap:4px!important; }
  .phx-contract-page .cm-feature-icon { width:22px!important; height:22px!important; flex:0 0 22px!important; }
  .phx-contract-page .cm-feature b { font-size:clamp(8px,.68vw,9px)!important; line-height:1.35!important; }
  .phx-contract-page .cm-feature small { font-size:7px!important; line-height:1.35!important; }
  .phx-contract-page .cm-hero-art { min-width:0!important; min-height:0!important; height:auto!important; align-self:center!important; padding:10px!important; }
  .phx-contract-page .cm-hero-art img { display:block!important; width:100%!important; height:auto!important; max-width:100%!important; max-height:none!important; object-fit:contain!important; }

  /* Contact: preserve source image ratio and compact text without moving the columns. */
  .phx-contact-reference .pc-hero { min-height:0!important; max-height:none!important; }
  .phx-contact-reference .pc-hero-inner { min-height:0!important; padding:clamp(72px,11vh,84px) clamp(24px,3.2vw,42px) 20px!important; gap:clamp(16px,2.5vw,30px)!important; }
  .phx-contact-reference .pc-hero-copy { min-width:0!important; max-width:100%!important; }
  .phx-contact-reference .pc-kicker { font-size:clamp(10px,.82vw,12px)!important; margin-bottom:7px!important; }
  .phx-contact-reference .pc-hero h1 { font-size:clamp(23px,1.85vw,28px)!important; line-height:1.28!important; margin-bottom:8px!important; }
  .phx-contact-reference .pc-hero p { font-size:clamp(10px,.82vw,12px)!important; line-height:1.55!important; }
  .phx-contact-reference .pc-hero-buttons { gap:7px!important; margin-top:14px!important; flex-wrap:wrap!important; }
  .phx-contact-reference .pc-btn { min-height:32px!important; padding:6px 11px!important; font-size:10px!important; }
  .phx-contact-reference .pc-hero-art { min-width:0!important; }
  .phx-contact-reference .pc-hero-art img { display:block!important; width:100%!important; max-width:100%!important; height:auto!important; max-height:clamp(180px,32vh,250px)!important; object-fit:contain!important; }
}

@media screen and (min-width:601px) and (max-width:1100px) {
  /* Home tablet: retain the existing visual order, scale the full hero controls. */
  body.home .hero-bg img, body.front-page .hero-bg img { object-fit:contain!important; object-position:center top!important; }
  body.home .hero-content, body.front-page .hero-content { padding:18px 24px 22px!important; }
  body.home .hero-text, body.front-page .hero-text { width:min(48vw,420px)!important; max-width:100%!important; padding-top:14px!important; }
  body.home .hero-text h1, body.front-page .hero-text h1 { font-size:clamp(21px,2.6vw,28px)!important; line-height:1.3!important; }
  body.home .hero-text p, body.front-page .hero-text p { font-size:clamp(10px,1.15vw,12px)!important; line-height:1.55!important; margin-top:10px!important; }
  body.home .hero-buttons, body.front-page .hero-buttons { margin-top:14px!important; gap:8px!important; flex-wrap:wrap!important; }
  body.home .hero-buttons :is(a,button), body.front-page .hero-buttons :is(a,button) { min-height:30px!important; padding:6px 10px!important; font-size:10px!important; }
  body.home .navbar, body.front-page .navbar { gap:8px!important; padding:7px 18px!important; }
  body.home .navbar-glass, body.front-page .navbar-glass { gap:8px!important; padding:6px 10px!important; }
  body.home .nav-links, body.front-page .nav-links { gap:clamp(6px,.9vw,10px)!important; }
  body.home .nav-links>li>a, body.front-page .nav-links>li>a { font-size:clamp(9px,1vw,11px)!important; }
  body.home .navbar .cta-demo, body.home .navbar .nav-left a,
  body.front-page .navbar .cta-demo, body.front-page .navbar .nav-left a { font-size:9px!important; padding:5px 8px!important; }
  body.home .hero-wrap .phoenix-glass-rail, body.front-page .hero-wrap .phoenix-glass-rail { transform:translateX(-50%) scale(.72)!important; transform-origin:top center!important; }

  /* Contract art keeps its natural ratio; hero height follows the grid contents. */
  .phx-contract-page .cm-hero { height:auto!important; min-height:0!important; }
  .phx-contract-page .cm-hero-inner { height:auto!important; min-height:0!important; grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important; align-items:center!important; }
  .phx-contract-page .cm-hero-copy { min-width:0!important; padding:76px 18px 18px!important; }
  .phx-contract-page .cm-hero h1 { font-size:clamp(21px,2.5vw,27px)!important; line-height:1.3!important; }
  .phx-contract-page .cm-hero p { font-size:clamp(10px,1.15vw,12px)!important; line-height:1.55!important; }
  .phx-contract-page .cm-btn { min-width:0!important; padding:6px 9px!important; font-size:10px!important; }
  .phx-contract-page .cm-features { grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:6px!important; }
  .phx-contract-page .cm-feature b { font-size:9px!important; }
  .phx-contract-page .cm-feature small { font-size:7px!important; }
  .phx-contract-page .cm-hero-art { height:auto!important; min-height:0!important; padding:8px!important; }
  .phx-contract-page .cm-hero-art img { display:block!important; width:100%!important; height:auto!important; max-width:100%!important; max-height:none!important; object-fit:contain!important; }

  /* Contact tablet: shrink typography/buttons and preserve the artwork ratio. */
  .phx-contact-reference .pc-hero { min-height:0!important; }
  .phx-contact-reference .pc-hero-inner { min-height:0!important; padding:76px 20px 20px!important; gap:14px!important; }
  .phx-contact-reference .pc-hero h1 { font-size:clamp(21px,2.5vw,27px)!important; line-height:1.3!important; }
  .phx-contact-reference .pc-hero p { font-size:clamp(10px,1.15vw,12px)!important; line-height:1.55!important; }
  .phx-contact-reference .pc-hero-buttons { margin-top:12px!important; gap:6px!important; flex-wrap:wrap!important; }
  .phx-contact-reference .pc-btn { min-height:30px!important; padding:5px 9px!important; font-size:10px!important; }
  .phx-contact-reference .pc-hero-art img { width:100%!important; height:auto!important; max-width:100%!important; max-height:220px!important; object-fit:contain!important; }
}


/* ============================================================
   SAFE LAPTOP HERO RATIO CORRECTIONS — scoped to reported pages.
   The ratio helper measures the real source image for Home, Contracts,
   and Auction; these rules remove older fixed-height overrides and keep
   the existing layout/content inside the resized hero.
   ============================================================ */
@media screen and (min-width:1101px) and (max-width:1440px) {
  /* Homepage: the background layer must follow the ratio-locked wrapper. */
  body.home .hero-bg, body.front-page .hero-bg {
    height:100%!important; min-height:0!important; max-height:none!important;
  }
  body.home .hero-bg img, body.front-page .hero-bg img {
    width:100%!important; height:100%!important; min-height:0!important; max-height:none!important;
    object-fit:contain!important; object-position:center top!important;
  }
  /* Bring the homepage navigation back near the normal site-wide size. */
  body.home .navbar-glass, body.front-page .navbar-glass { padding:9px 16px!important; }
  body.home .nav-links, body.front-page .nav-links { gap:clamp(14px,1.3vw,20px)!important; }
  body.home .nav-links>li>a, body.front-page .nav-links>li>a { font-size:clamp(13px,.98vw,14px)!important; }
  body.home .navbar .cta-demo, body.home .navbar .nav-left a,
  body.front-page .navbar .cta-demo, body.front-page .navbar .nav-left a {
    font-size:clamp(12px,.95vw,13px)!important; padding:8px 13px!important;
  }
  body.home .hero-wrap .phoenix-glass-rail, body.front-page .hero-wrap .phoenix-glass-rail {
    transform:translateX(-50%) scale(.86)!important;
  }

  /* Contracts: source artwork spans the hero, so its real ratio defines height. */
  body.page-template-page-contract-management .phx-contract-page .cm-hero {
    height:auto!important; min-height:0!important; max-height:none!important;
  }
  body.page-template-page-contract-management .phx-contract-page .cm-hero-inner {
    height:100%!important; min-height:0!important; align-items:stretch!important;
  }
  body.page-template-page-contract-management .phx-contract-page .cm-hero-art,
  body.page-template-page-contract-management .phx-contract-page .cm-hero-art img {
    height:100%!important; min-height:0!important; max-height:none!important;
  }
  body.page-template-page-contract-management .phx-contract-page .cm-hero-art img {
    width:100%!important; object-fit:contain!important; object-position:center!important;
  }
  body.page-template-page-contract-management .phx-contract-page .cm-hero-copy {
    min-width:0!important; padding:clamp(66px,9vh,76px) clamp(22px,3vw,40px) 14px!important;
  }
  body.page-template-page-contract-management .phx-contract-page .cm-kicker { font-size:11px!important; margin-bottom:6px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-hero h1 { font-size:clamp(22px,1.75vw,26px)!important; line-height:1.25!important; margin-bottom:7px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-hero p { font-size:clamp(10px,.78vw,11px)!important; line-height:1.45!important; margin-bottom:8px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-actions { gap:6px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-btn { min-width:0!important; min-height:28px!important; padding:5px 10px!important; font-size:9px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-features { gap:5px!important; margin-top:8px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-feature-icon { width:20px!important; height:20px!important; flex:0 0 20px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-feature b { font-size:8px!important; line-height:1.3!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-feature small { font-size:7px!important; line-height:1.3!important; }

  /* Auction: override the old 600px desktop lock using the actual hero image ratio. */
  body.page-template-page-auction-management .phx-auction-page .a-hero {
    min-height:0!important; max-height:none!important; background-size:100% 100%!important; background-position:center!important;
  }
  body.page-template-page-auction-management .phx-auction-page .a-hero-inner,
  body.page-template-page-auction-management .phx-auction-page .a-hero-art {
    height:100%!important; min-height:0!important; max-height:none!important;
  }
  body.page-template-page-auction-management .phx-auction-page .a-hero-art img {
    width:100%!important; height:100%!important; object-fit:contain!important; object-position:center!important;
  }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy {
    width:54%!important; padding:clamp(62px,8vh,74px) 4vw 12px 3vw!important;
  }
  body.page-template-page-auction-management .phx-auction-page .a-kicker { font-size:11px!important; margin-bottom:5px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy h1 { font-size:clamp(22px,1.8vw,27px)!important; line-height:1.24!important; margin-bottom:7px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy p { font-size:clamp(10px,.8vw,11px)!important; line-height:1.45!important; margin-bottom:8px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-buttons { gap:6px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-btn { min-width:0!important; min-height:28px!important; padding:5px 10px!important; font-size:9px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-features { gap:5px!important; margin-top:8px!important; padding-top:6px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-mini-icon { max-width:22px!important; max-height:22px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-mini b { font-size:8px!important; line-height:1.3!important; }
  body.page-template-page-auction-management .phx-auction-page .a-mini span { font-size:7px!important; line-height:1.3!important; }

  /* Contact: its inner wrapper previously remained fixed at 600px after the hero shrank. */
  body.page-template-page-contact .phx-contact-reference .pc-hero-inner {
    height:100%!important; min-height:0!important; padding:clamp(68px,9vh,76px) clamp(22px,3vw,38px) 14px!important;
    gap:clamp(14px,2vw,24px)!important;
  }
  body.page-template-page-contact .phx-contact-reference .pc-hero-copy { min-width:0!important; max-width:100%!important; }
  body.page-template-page-contact .phx-contact-reference .pc-kicker { font-size:10px!important; margin-bottom:6px!important; }
  body.page-template-page-contact .phx-contact-reference .pc-hero h1 { font-size:clamp(22px,1.75vw,26px)!important; line-height:1.25!important; margin-bottom:7px!important; }
  body.page-template-page-contact .phx-contact-reference .pc-hero p { font-size:clamp(10px,.8vw,11px)!important; line-height:1.45!important; margin-bottom:8px!important; }
  body.page-template-page-contact .phx-contact-reference .pc-hero-buttons { gap:6px!important; margin-top:10px!important; }
  body.page-template-page-contact .phx-contact-reference .pc-btn { min-height:28px!important; padding:5px 10px!important; font-size:9px!important; }
  body.page-template-page-contact .phx-contact-reference .pc-hero-art img { width:100%!important; height:auto!important; max-height:clamp(170px,28vh,220px)!important; object-fit:contain!important; }
}

@media screen and (min-width:1101px) and (max-width:1440px) and (max-height:650px) {
  body.home .nav-links>li>a, body.front-page .nav-links>li>a { font-size:13px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-hero-copy { padding-top:62px!important; padding-bottom:10px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-hero h1 { font-size:22px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-hero p { font-size:10px!important; line-height:1.35!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy { padding-top:58px!important; padding-bottom:8px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy h1 { font-size:22px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy p { font-size:10px!important; line-height:1.35!important; }
  body.page-template-page-contact .phx-contact-reference .pc-hero-inner { padding-top:60px!important; padding-bottom:10px!important; }
  body.page-template-page-contact .phx-contact-reference .pc-hero h1 { font-size:22px!important; }
  body.page-template-page-contact .phx-contact-reference .pc-hero p { font-size:10px!important; line-height:1.35!important; }
}


/* ============================================================
   CONSISTENT LAPTOP HEADER — match the Purchase & Services page.
   Scoped to the laptop/desktop widths used for the responsive review.
   Applies one shared scale/spacing to the global header on every page.
   ============================================================ */
@media screen and (min-width:1101px) and (max-width:1440px) {
  header.navbar {
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:20px!important;
    margin-left:40px!important;
    margin-right:40px!important;
    padding:0!important;
    box-sizing:border-box!important;
  }
  header.navbar .nav-right,
  header.navbar .logo,
  header.navbar .phx-header-logo-link,
  header.navbar .nav-left,
  header.navbar .navbar-glass {
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
  }
  header.navbar .phx-header-logo-link { flex:0 0 auto!important; }
  header.navbar .phx-header-logo-image {
    display:block!important;
    width:auto!important;
    height:29px!important;
    max-height:29px!important;
    max-width:104px!important;
    object-fit:contain!important;
    align-self:center!important;
  }
  header.navbar .logo-icon { width:25px!important; height:25px!important; flex:0 0 25px!important; }
  header.navbar .logo-main { font-size:15px!important; line-height:1.15!important; }
  header.navbar .logo-sub { font-size:7.5px!important; line-height:1.2!important; }
  header.navbar .navbar-glass {
    gap:20px!important;
    padding:9px 16px!important;
    box-sizing:border-box!important;
  }
  header.navbar .nav-links {
    display:flex!important;
    align-items:center!important;
    gap:clamp(12px,1.15vw,16px)!important;
    margin:0!important;
    padding:0!important;
    min-width:0!important;
  }
  header.navbar .nav-links>li>a {
    font-size:15px!important;
    line-height:1.35!important;
    white-space:nowrap!important;
    padding-bottom:5px!important;
  }
  header.navbar .nav-left { gap:12px!important; flex:0 0 auto!important; }
  header.navbar .cta-demo,
  header.navbar .nav-left a {
    font-size:13px!important;
    line-height:1.3!important;
    padding:8px 13px!important;
    min-height:34px!important;
    box-sizing:border-box!important;
    white-space:nowrap!important;
  }
  header.navbar .search-icon { width:18px!important; height:18px!important; flex:0 0 18px!important; }
}

@media screen and (min-width:1101px) and (max-width:1440px) and (max-height:650px) {
  header.navbar .navbar-glass { padding-top:7px!important; padding-bottom:7px!important; }
  header.navbar .nav-links { gap:clamp(12px,1.2vw,17px)!important; }
  header.navbar .nav-links>li>a { font-size:14px!important; }
  header.navbar .phx-header-logo-image { height:29px!important; max-height:29px!important; max-width:104px!important; }
  header.navbar .logo-icon { width:25px!important; height:25px!important; flex-basis:25px!important; }
  header.navbar .cta-demo,
  header.navbar .nav-left a { font-size:12px!important; min-height:32px!important; padding:7px 11px!important; }
}


/* Tablet header sizing alignment — preserve each page's existing layout. */
@media screen and (min-width:601px) and (max-width:1100px) {
  header.navbar .phx-header-logo-image {
    width:auto!important; height:26px!important; max-height:26px!important;
    max-width:96px!important; object-fit:contain!important;
  }
  header.navbar .logo-icon { width:23px!important; height:23px!important; flex-basis:23px!important; }
  header.navbar .logo-main { font-size:14px!important; line-height:1.15!important; }
  header.navbar .logo-sub { font-size:7px!important; line-height:1.2!important; }
  header.navbar .nav-links { gap:clamp(8px,1.05vw,12px)!important; }
  header.navbar .nav-links>li>a { font-size:13px!important; line-height:1.35!important; }
  header.navbar .cta-demo,
  header.navbar .nav-left a { font-size:12px!important; line-height:1.3!important; min-height:31px!important; padding:7px 10px!important; }
  header.navbar .search-icon { width:16px!important; height:16px!important; }
}


/* FINAL HEADER SIZE NORMALIZATION — all pages, desktop/laptop and tablet.
   Keep each page's existing header placement/layout; standardize only element sizing. */
@media screen and (min-width:1101px) and (max-width:1440px) {
  header.navbar .nav-links>li>a { font-size:15px!important; line-height:1.35!important; white-space:nowrap!important; }
  header.navbar .cta-demo, header.navbar .nav-left a { font-size:13px!important; line-height:1.3!important; min-height:34px!important; padding:8px 13px!important; }
  header.navbar .phx-header-logo-image { height:29px!important; max-height:29px!important; max-width:104px!important; object-fit:contain!important; }
  header.navbar .logo-icon { width:25px!important; height:25px!important; flex-basis:25px!important; }
  header.navbar .logo-main { font-size:15px!important; line-height:1.15!important; }
  header.navbar .logo-sub { font-size:7.5px!important; line-height:1.2!important; }
  header.navbar .search-icon { width:18px!important; height:18px!important; flex-basis:18px!important; }
}
@media screen and (min-width:1101px) and (max-width:1440px) and (max-height:650px) {
  header.navbar .nav-links>li>a { font-size:14px!important; }
  header.navbar .cta-demo, header.navbar .nav-left a { font-size:12px!important; min-height:32px!important; padding:7px 11px!important; }
}
@media screen and (min-width:601px) and (max-width:1100px) {
  header.navbar .nav-links>li>a { font-size:13px!important; line-height:1.35!important; white-space:nowrap!important; }
  header.navbar .cta-demo, header.navbar .nav-left a { font-size:12px!important; line-height:1.3!important; min-height:31px!important; padding:7px 10px!important; }
  header.navbar .phx-header-logo-image { height:26px!important; max-height:26px!important; max-width:96px!important; object-fit:contain!important; }
  header.navbar .logo-icon { width:23px!important; height:23px!important; flex-basis:23px!important; }
  header.navbar .logo-main { font-size:14px!important; line-height:1.15!important; }
  header.navbar .logo-sub { font-size:7px!important; line-height:1.2!important; }
  header.navbar .search-icon { width:16px!important; height:16px!important; }
}


/* ============================================================
   ALL-PAGE HERO BOUNDS + SRM-SIZED TYPOGRAPHY — corrective pass.
   Based on the approved v2 reference. The shared navbar/logo/menu rules above
   are intentionally untouched so the home menu keeps its prior size.
   Only hero content for pages not covered by the existing targeted rules is
   normalized here; image sources and page-specific layout/order are preserved.
   ============================================================ */
@media screen and (min-width:1101px) and (max-width:1440px) and (min-height:560px) and (max-height:800px) {
  /* Keep each page's hero artwork and all overlaid content inside its own bounds. */
  body.phx-licenses-page .phx-licenses-hero,
  body.phx-clients-testimonials-page .phx-cl-hero,
  body.phx-web-design-page .phx-web-design-hero,
  body.phx-articles-page .pa-hero,
  body.phx-occmed-page .om-hero,
  body.phx-bird-page .pb-hero,
  body.phx-about-page .pa-hero,
  body.phx-sms-page .phx-sms-hero,
  body.phx-incident-page .pi-hero,
  body.phx-hse-page .hse-hero,
  body.phx-catalog-page .phx-catalog-hero {
    position:relative!important;
    max-width:100vw!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  body.phx-licenses-page .phx-licenses-hero-copy,
  body.phx-clients-testimonials-page .phx-cl-hero-copy,
  body.phx-web-design-page .phx-web-design-hero-copy,
  body.phx-articles-page .pa-hero-copy,
  body.phx-occmed-page .om-hero-copy,
  body.phx-bird-page .pb-hero-copy,
  body.phx-about-page .pa-hero-copy,
  body.phx-sms-page .phx-sms-hero-copy,
  body.phx-incident-page .pi-hero-copy,
  body.phx-hse-page .hse-hero-copy,
  body.phx-catalog-page .phx-catalog-hero-copy {
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    overflow-wrap:anywhere!important;
  }

  /* Kicker / small heading above the title. */
  body.phx-licenses-page .phx-licenses-hero :is(.phx-licenses-kicker,.kicker,.eyebrow,small),
  body.phx-clients-testimonials-page .phx-cl-hero :is(.phx-cl-kicker,.kicker,.eyebrow,small),
  body.phx-web-design-page .phx-web-design-hero :is(.phx-web-design-kicker,.kicker,.eyebrow,small),
  body.phx-articles-page .pa-hero-copy>span,
  body.phx-occmed-page .om-hero-copy :is(.om-kicker,.kicker,.eyebrow,small),
  body.phx-bird-page .pb-hero-copy :is(.pb-kicker,.kicker,.eyebrow,small),
  body.phx-about-page .pa-hero-copy :is(.pa-kicker,.kicker,.eyebrow,small),
  body.phx-sms-page .phx-sms-hero :is(.phx-sms-kicker,.kicker,.eyebrow,small),
  body.phx-incident-page .pi-hero :is(.pi-kicker,.kicker,.eyebrow,small),
  body.phx-hse-page .hse-hero :is(.hse-kicker,.kicker,.eyebrow,small),
  body.phx-catalog-page .phx-catalog-hero :is(.phx-catalog-kicker,.kicker,.eyebrow,small) {
    font-size:clamp(11px,.9vw,13px)!important;
    line-height:1.5!important;
    max-width:100%!important;
  }

  /* Main title and supporting copy match the approved Purchase & Services scale. */
  body.phx-licenses-page .phx-licenses-hero h1,
  body.phx-clients-testimonials-page .phx-cl-hero h1,
  body.phx-web-design-page .phx-web-design-hero h1,
  body.phx-articles-page .pa-hero h1,
  body.phx-occmed-page .om-hero h1,
  body.phx-bird-page .pb-hero h1,
  body.phx-about-page .pa-hero h1,
  body.phx-sms-page .phx-sms-hero h1,
  body.phx-incident-page .pi-hero h1,
  body.phx-hse-page .hse-hero h1,
  body.phx-catalog-page .phx-catalog-hero h1 {
    font-size:clamp(25px,2.05vw,31px)!important;
    line-height:1.35!important;
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    margin-bottom:8px!important;
  }
  body.phx-licenses-page .phx-licenses-hero p,
  body.phx-clients-testimonials-page .phx-cl-hero p,
  body.phx-web-design-page .phx-web-design-hero p,
  body.phx-articles-page .pa-hero p,
  body.phx-occmed-page .om-hero p,
  body.phx-bird-page .pb-hero p,
  body.phx-about-page .pa-hero p,
  body.phx-sms-page .phx-sms-hero p,
  body.phx-incident-page .pi-hero p,
  body.phx-hse-page .hse-hero p,
  body.phx-catalog-page .phx-catalog-hero p {
    font-size:clamp(12px,.95vw,14px)!important;
    line-height:1.6!important;
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    margin-bottom:10px!important;
  }

  /* Hero actions: same readable scale, with wrapping instead of escaping the image. */
  body.phx-licenses-page .phx-licenses-hero :is(a,button,.phx-licenses-hero-btn),
  body.phx-clients-testimonials-page .phx-cl-hero :is(a,button,.button),
  body.phx-web-design-page .phx-web-design-hero :is(a,button,.button),
  body.phx-articles-page .pa-hero :is(a,button,.button),
  body.phx-occmed-page .om-hero :is(a,button,.button),
  body.phx-bird-page .pb-hero :is(a,button,.button),
  body.phx-about-page .pa-hero :is(a,button,.button),
  body.phx-sms-page .phx-sms-hero :is(a,button,.button),
  body.phx-incident-page .pi-hero :is(a,button,.button),
  body.phx-hse-page .hse-hero :is(a,button,.button),
  body.phx-catalog-page .phx-catalog-hero :is(a,button,.button) {
    max-width:100%!important;
    box-sizing:border-box!important;
    font-size:clamp(11px,.88vw,13px)!important;
    line-height:1.35!important;
    white-space:normal!important;
  }

  /* Feature/icon rows inside these hero sections stay within their parent width. */
  body.phx-licenses-page .phx-licenses-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]),
  body.phx-clients-testimonials-page .phx-cl-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]),
  body.phx-web-design-page .phx-web-design-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]),
  body.phx-articles-page .pa-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]),
  body.phx-occmed-page .om-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]),
  body.phx-bird-page .pb-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]),
  body.phx-about-page .pa-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]),
  body.phx-sms-page .phx-sms-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]),
  body.phx-incident-page .pi-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]),
  body.phx-hse-page .hse-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]),
  body.phx-catalog-page .phx-catalog-hero :is([class*="features"],[class*="feature-list"],[class*="actions"],[class*="buttons"]) {
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    flex-wrap:wrap!important;
  }
}

@media screen and (min-width:1101px) and (max-width:1440px) and (max-height:650px) {
  /* Short laptop screens: keep all copy/actions inside the visible hero without
     changing navbar/menu sizing or moving elements between columns. */
  body.phx-licenses-page .phx-licenses-hero h1,
  body.phx-clients-testimonials-page .phx-cl-hero h1,
  body.phx-web-design-page .phx-web-design-hero h1,
  body.phx-articles-page .pa-hero h1,
  body.phx-occmed-page .om-hero h1,
  body.phx-bird-page .pb-hero h1,
  body.phx-about-page .pa-hero h1,
  body.phx-sms-page .phx-sms-hero h1,
  body.phx-incident-page .pi-hero h1,
  body.phx-hse-page .hse-hero h1,
  body.phx-catalog-page .phx-catalog-hero h1 {
    font-size:clamp(24px,1.9vw,28px)!important;
    line-height:1.28!important;
    margin-bottom:6px!important;
  }
  body.phx-licenses-page .phx-licenses-hero p,
  body.phx-clients-testimonials-page .phx-cl-hero p,
  body.phx-web-design-page .phx-web-design-hero p,
  body.phx-articles-page .pa-hero p,
  body.phx-occmed-page .om-hero p,
  body.phx-bird-page .pb-hero p,
  body.phx-about-page .pa-hero p,
  body.phx-sms-page .phx-sms-hero p,
  body.phx-incident-page .pi-hero p,
  body.phx-hse-page .hse-hero p,
  body.phx-catalog-page .phx-catalog-hero p {
    font-size:12px!important;
    line-height:1.48!important;
    margin-bottom:7px!important;
  }
  body.phx-licenses-page .phx-licenses-hero :is(a,button,.button),
  body.phx-clients-testimonials-page .phx-cl-hero :is(a,button,.button),
  body.phx-web-design-page .phx-web-design-hero :is(a,button,.button),
  body.phx-articles-page .pa-hero :is(a,button,.button),
  body.phx-occmed-page .om-hero :is(a,button,.button),
  body.phx-bird-page .pb-hero :is(a,button,.button),
  body.phx-about-page .pa-hero :is(a,button,.button),
  body.phx-sms-page .phx-sms-hero :is(a,button,.button),
  body.phx-incident-page .pi-hero :is(a,button,.button),
  body.phx-hse-page .hse-hero :is(a,button,.button),
  body.phx-catalog-page .phx-catalog-hero :is(a,button,.button) {
    font-size:11px!important;
    min-height:30px!important;
    padding-top:6px!important;
    padding-bottom:6px!important;
  }
}

/* Homepage hero only: keep the image layer tied to the ratio-locked wrapper.
   Earlier desktop rules pinned .hero-bg to 600px, creating side gaps when the
   responsive helper resized .hero-wrap to the source image's natural ratio. */
@media screen and (min-width:601px) and (max-width:2560px) {
  /* Homepage only: make the image layer exactly match the full-width hero canvas.
     The JS ratio lock sizes .hero-wrap from this same image's intrinsic ratio;
     fill the canvas rather than using contain, which can leave side gutters when
     other theme rules constrain the image's rendered box. */
  body.home .hero-wrap .hero-bg,
  body.front-page .hero-wrap .hero-bg {
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    display:block!important;
    overflow:hidden!important;
  }
  body.home .hero-wrap .hero-bg img,
  body.front-page .hero-wrap .hero-bg img {
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:100%!important;
    max-width:none!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-height:none!important;
    object-fit:fill!important;
    object-position:center center!important;
  }
}


/* ============================================================
   PAGE-SPECIFIC HERO TUNING — based on the user's v6 reference.
   Scope: mobile/tablet and laptop viewport sizes up to 1440px wide.
   These rules intentionally do not alter hero image dimensions, background
   ratios, grid order, or the underlying position of content except where asked.
   ============================================================ */

/* Home: match the readable purchase/services (SRM) hero typography without
   moving the title, paragraph, buttons, or feature rail. */
@media screen and (min-width:601px) and (max-width:1440px) {
  body.home .hero-wrap .hero-text h1,
  body.front-page .hero-wrap .hero-text h1 {
    font-size:clamp(25px, calc(18px + 1.15vh), 29px)!important;
    line-height:1.3!important;
  }
  body.home .hero-wrap .hero-text p,
  body.front-page .hero-wrap .hero-text p {
    font-size:clamp(12px, calc(10px + .42vh), 13px)!important;
    line-height:1.55!important;
  }
  body.home .hero-wrap .hero-buttons :is(a,button),
  body.front-page .hero-wrap .hero-buttons :is(a,button) {
    font-size:11px!important;
    min-height:32px!important;
    padding:7px 13px!important;
  }
}
@media screen and (max-width:600px) {
  body.home .hero-wrap .hero-text h1,
  body.front-page .hero-wrap .hero-text h1 { font-size:clamp(22px,6vw,27px)!important; line-height:1.3!important; }
  body.home .hero-wrap .hero-text p,
  body.front-page .hero-wrap .hero-text p { font-size:13px!important; line-height:1.65!important; }
  body.home .hero-wrap .hero-buttons :is(a,button),
  body.front-page .hero-wrap .hero-buttons :is(a,button) { font-size:12px!important; min-height:36px!important; }
}

/* About: move only the foreground text block left by 100px; preserve its
   existing admin-controlled translate transform and alignment. */
@media screen and (max-width:1440px) {
  body.phx-about-page .pa-hero-copy { translate:-100px 0!important; }
}
@media screen and (max-width:600px) {
  body.phx-about-page .pa-hero-copy { translate:-24px 0!important; max-width:calc(100% - 24px)!important; }
}

/* Tender: move the full text/features block upward without changing its grid
   placement. On tablet the feature divider alone gets an additional 50px lift. */
@media screen and (min-width:1101px) and (max-width:1440px) and (max-height:800px) {
  body.page-template-page-tender-management .t-hero-copy { translate:0 -50px!important; }
}
@media screen and (min-width:601px) and (max-width:1100px) {
  body.page-template-page-tender-management .t-hero-copy { translate:0 -28px!important; }
  body.page-template-page-tender-management .t-hero-features {
    position:relative!important;
    border-top-color:transparent!important;
  }
  body.page-template-page-tender-management .t-hero-features::before {
    content:""!important; position:absolute!important; left:0!important; right:0!important;
    top:-72px!important; height:1px!important;
    background:rgba(224,167,62,.22)!important; pointer-events:none!important;
  }
}
@media screen and (max-width:600px) {
  body.page-template-page-tender-management .t-hero-copy { translate:0 -18px!important; }
}

/* Auction: replace the overly tiny headline/body/button/feature typography with
   readable sizes aligned to the SRM hero; no position or order changes. */
@media screen and (min-width:601px) and (max-width:1440px) {
  body.page-template-page-auction-management .phx-auction-page .a-kicker { font-size:12px!important; line-height:1.4!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy h1 { font-size:clamp(25px,calc(18px + 1.15vh),29px)!important; line-height:1.3!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy p { font-size:clamp(12px,calc(10px + .42vh),13px)!important; line-height:1.55!important; }
  body.page-template-page-auction-management .phx-auction-page .a-btn { font-size:11px!important; min-height:32px!important; padding:7px 13px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-features { gap:8px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-mini b { font-size:10px!important; line-height:1.35!important; }
  body.page-template-page-auction-management .phx-auction-page .a-mini span { font-size:9px!important; line-height:1.45!important; }
  body.page-template-page-auction-management .phx-auction-page .a-mini-icon,
  body.page-template-page-auction-management .phx-auction-page .a-admin-icon { width:24px!important; height:24px!important; max-width:24px!important; max-height:24px!important; }
}
@media screen and (max-width:600px) {
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy h1 { font-size:clamp(22px,6vw,27px)!important; line-height:1.3!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy p { font-size:12px!important; line-height:1.6!important; }
  body.page-template-page-auction-management .phx-auction-page .a-btn { font-size:11px!important; min-height:34px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-mini b { font-size:10px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-mini span { font-size:9px!important; }
}

/* Contracts: move the copy slightly left and increase button, button box and
   feature-icon dimensions by about 20%, while preserving their order/position. */
@media screen and (min-width:601px) and (max-width:1440px) {
  body.page-template-page-contract-management .phx-contract-page .cm-hero-copy { translate:-24px 0!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-btn {
    font-size:clamp(12px,.95vw,14px)!important;
    min-height:34px!important; padding:8px 14px!important;
  }
  body.page-template-page-contract-management .phx-contract-page .cm-feature-icon {
    width:24px!important; height:24px!important; flex-basis:24px!important;
  }
  body.page-template-page-contract-management .phx-contract-page .cm-feature b { font-size:10px!important; line-height:1.35!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-feature small { font-size:9px!important; line-height:1.4!important; }
}
@media screen and (max-width:600px) {
  body.page-template-page-contract-management .phx-contract-page .cm-hero-copy { translate:-12px 0!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-btn { font-size:12px!important; min-height:36px!important; padding:8px 12px!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-feature-icon { width:24px!important; height:24px!important; flex-basis:24px!important; }
}

/* Status: 20% larger typography and feature icons, with the complete copy group
   raised 30px. The hero artwork and columns are untouched. */
@media screen and (min-width:601px) and (max-width:1440px) {
  body.page-template-page-status-management-php .phx-status-page .sm-hero-copy { translate:0 -30px!important; }
  body.page-template-page-status-management-php .phx-status-page .sm-hero h1 { font-size:clamp(29px,2.35vw,36px)!important; line-height:1.28!important; }
  body.page-template-page-status-management-php .phx-status-page .sm-hero .sm-subtitle { font-size:clamp(20px,1.55vw,25px)!important; line-height:1.35!important; }
  body.page-template-page-status-management-php .phx-status-page .sm-hero-copy>p { font-size:clamp(12px,1vw,15px)!important; line-height:1.5!important; }
  body.page-template-page-status-management-php .phx-status-page .sm-features div { font-size:11px!important; line-height:1.4!important; }
  body.page-template-page-status-management-php .phx-status-page .sm-features span,
  body.page-template-page-status-management-php .phx-status-page .sm-features span img { width:26px!important; height:26px!important; font-size:26px!important; }
  body.page-template-page-status-management-php .phx-status-page .sm-btn { font-size:12px!important; min-height:36px!important; padding:7px 14px!important; }
}
@media screen and (max-width:600px) {
  body.page-template-page-status-management-php .phx-status-page .sm-hero-copy { translate:0 -12px!important; }
  body.page-template-page-status-management-php .phx-status-page .sm-hero h1 { font-size:clamp(26px,7vw,32px)!important; }
  body.page-template-page-status-management-php .phx-status-page .sm-hero .sm-subtitle { font-size:20px!important; }
  body.page-template-page-status-management-php .phx-status-page .sm-hero-copy>p { font-size:12px!important; }
  body.page-template-page-status-management-php .phx-status-page .sm-features div { font-size:10px!important; }
}

/* Contact: visually reduce the copy/buttons by 20% and shift the visible group
   100px left on tablet/laptop. Keep the grid slot and image untouched. */
@media screen and (min-width:601px) and (max-width:1440px) {
  body.phx-contact-page .phx-contact-reference .pc-hero-copy {
    scale:.8!important; transform-origin:right center!important; translate:-100px 0!important;
  }
}
@media screen and (max-width:600px) {
  body.phx-contact-page .phx-contact-reference .pc-hero-copy {
    scale:.85!important; transform-origin:right center!important; translate:-20px 0!important;
  }
}


/* User-approved page-specific position updates — only target responsive widths. */
@media screen and (min-width:601px) and (max-width:1440px) {
  /* Home: move title/copy and actions left without altering layout order. */
  body.home .hero-wrap .hero-text,
  body.front-page .hero-wrap .hero-text,
  body.home .hero-wrap .hero-buttons,
  body.front-page .hero-wrap .hero-buttons {
    translate:-100px 0!important;
  }
  /* About: reverse the previous movement; shift copy to the right. */
  body.phx-about-page .pa-hero-copy { translate:100px 0!important; }
  /* Tender: 20% smaller text and move copy + feature row left; wrap the row
     within the hero so its last capability cannot spill outside. */
  body.page-template-page-tender-management .t-hero-copy,
  body.page-template-page-tender-management .t-hero-features {
    translate:-100px 0!important;
    max-width:calc(100% - 24px)!important;
    box-sizing:border-box!important;
  }
  body.page-template-page-tender-management .t-hero-copy h1 { font-size:80%!important; }
  body.page-template-page-tender-management .t-hero-copy p,
  body.page-template-page-tender-management .t-hero-copy .t-kicker,
  body.page-template-page-tender-management .t-hero-copy .t-btn,
  body.page-template-page-tender-management .t-hero-features,
  body.page-template-page-tender-management .t-hero-features * { font-size:80%!important; }
  body.page-template-page-tender-management .t-hero-features {
    display:flex!important; flex-wrap:wrap!important; min-width:0!important;
    overflow:visible!important; gap:8px!important;
  }
  body.page-template-page-tender-management .t-hero-features > * {
    min-width:0!important; max-width:100%!important; flex:0 1 auto!important;
  }
  /* Auction: 10% larger copy/features and shift the full set left. */
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy,
  body.page-template-page-auction-management .phx-auction-page .a-hero-features {
    translate:-100px 0!important;
    scale:1.1!important;
    transform-origin:right center!important;
  }
  /* Contract management: move all hero copy, actions and features as one group. */
  body.page-template-page-contract-management .phx-contract-page .cm-hero-copy {
    translate:-100px 0!important;
  }
}
@media screen and (max-width:600px) {
  body.home .hero-wrap .hero-text,
  body.front-page .hero-wrap .hero-text,
  body.home .hero-wrap .hero-buttons,
  body.front-page .hero-wrap .hero-buttons { translate:-20px 0!important; }
  body.phx-about-page .pa-hero-copy { translate:20px 0!important; }
  body.page-template-page-tender-management .t-hero-copy,
  body.page-template-page-tender-management .t-hero-features { translate:-20px 0!important; max-width:calc(100% - 16px)!important; }
  body.page-template-page-tender-management .t-hero-copy h1 { font-size:80%!important; }
  body.page-template-page-tender-management .t-hero-copy p,
  body.page-template-page-tender-management .t-hero-copy .t-kicker,
  body.page-template-page-tender-management .t-hero-copy .t-btn,
  body.page-template-page-tender-management .t-hero-features,
  body.page-template-page-tender-management .t-hero-features * { font-size:80%!important; }
  body.page-template-page-tender-management .t-hero-features { display:flex!important; flex-wrap:wrap!important; min-width:0!important; gap:6px!important; }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy,
  body.page-template-page-auction-management .phx-auction-page .a-hero-features { translate:-20px 0!important; scale:1.1!important; transform-origin:right center!important; }
  body.page-template-page-contract-management .phx-contract-page .cm-hero-copy { translate:-20px 0!important; }
}

/* DOCX reference-match corrections — scoped to tablet/mobile and 1366x600/768 laptop viewports. */
@media screen and (max-width: 1440px) {
  /* Header brand/logo: reduce the complete logo group visually by 10% without changing its layout slot. */
  header.navbar .nav-right > .logo,
  header.navbar .nav-right > .phx-header-logo-link,
  header.navbar .logo {
    scale: .9 !important;
    transform-origin: right center !important;
  }
}

/* Homepage: in RTL, flex-start places the CTA at the right edge/start of the text. */
@media screen and (min-width: 601px) and (max-width: 1440px),
       screen and (max-width: 600px) {
  body.home .hero-wrap .hero-buttons,
  body.front-page .hero-wrap .hero-buttons {
    display: flex !important;
    direction: rtl !important;
    width: 100% !important;
    justify-content: flex-start !important;
    align-items: center !important;
    align-self: stretch !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
}

/* Tender: undo the old 20% reduction and -100px movement; reduce text by exactly 2%.
   Keep all copy and features inside the hero, without moving the copy group. */
@media screen and (min-width: 601px) and (max-width: 1440px) {
  body.page-template-page-tender-management .t-hero-copy,
  body.page-template-page-tender-management .t-hero-features {
    translate: 0 0 !important;
    scale: 1 !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  body.page-template-page-tender-management .t-hero-copy h1 {
    font-size: 98% !important;
  }
  body.page-template-page-tender-management .t-hero-copy p,
  body.page-template-page-tender-management .t-hero-copy .t-kicker,
  body.page-template-page-tender-management .t-hero-copy .t-btn,
  body.page-template-page-tender-management .t-hero-features,
  body.page-template-page-tender-management .t-hero-features * {
    font-size: 98% !important;
  }
  body.page-template-page-tender-management .t-hero-features {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    overflow: visible !important;
  }
  body.page-template-page-tender-management .t-hero-features > * {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }
}
@media screen and (max-width: 600px) {
  body.page-template-page-tender-management .t-hero-copy,
  body.page-template-page-tender-management .t-hero-features {
    translate: 0 0 !important;
    scale: 1 !important;
    max-width: 100% !important;
  }
  body.page-template-page-tender-management .t-hero-copy h1,
  body.page-template-page-tender-management .t-hero-copy p,
  body.page-template-page-tender-management .t-hero-copy .t-kicker,
  body.page-template-page-tender-management .t-hero-copy .t-btn,
  body.page-template-page-tender-management .t-hero-features,
  body.page-template-page-tender-management .t-hero-features * { font-size: 98% !important; }
  body.page-template-page-tender-management .t-hero-features { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}

/* Auction: scale only the buttons 10%, retaining their anchor point; move the divider/features 100px right. */
@media screen and (min-width: 601px) and (max-width: 1440px),
       screen and (max-width: 600px) {
  body.page-template-page-auction-management .phx-auction-page .a-buttons {
    scale: .9 !important;
    transform-origin: right center !important;
  }
  body.page-template-page-auction-management .phx-auction-page .a-hero-features {
    translate: 100px 0 !important;
    scale: 1 !important;
    transform-origin: right center !important;
  }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy {
    scale: 1 !important;
  }
}

/* Contract: force the feature icon border to a true square, not a stretched flex item. */
@media screen and (min-width: 601px) and (max-width: 1440px),
       screen and (max-width: 600px) {
  body.page-template-page-contract-management .phx-contract-page .cm-feature-icon {
    display: inline-grid !important;
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
    flex: 0 0 24px !important;
    aspect-ratio: 1 / 1 !important;
    box-sizing: border-box !important;
    align-self: center !important;
  }
}

/* SRM: keep each capability label paired beside its own icon in RTL reading order. */
@media screen and (max-width: 1440px) {
  body.phx-srm-template .phx-srm-page .phx-srm-hero .phx-srm-features {
    direction: rtl !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: center !important;
  }
  body.phx-srm-template .phx-srm-page .phx-srm-hero .phx-srm-feature {
    direction: rtl !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    min-width: 0 !important;
  }
  body.phx-srm-template .phx-srm-page .phx-srm-hero .phx-srm-feature > i {
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
  }
  body.phx-srm-template .phx-srm-page .phx-srm-hero .phx-srm-feature > div {
    position: static !important;
    transform: none !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    text-align: right !important;
  }
}

/* V11 requested follow-up: only tablet/mobile and 1366x600/768 laptop widths. */
@media screen and (min-width: 601px) and (max-width: 1440px) {
  /* Tender: reduce all hero copy/features by 20%, move the whole content left 50px
     and raise both content rows so buttons/features remain inside short hero viewports. */
  body.page-template-page-tender-management .t-hero-copy {
    translate: -50px -50px !important;
    scale: .8 !important;
    transform-origin: right center !important;
    max-width: 100% !important;
  }
  body.page-template-page-tender-management .t-hero-features {
    translate: -50px -50px !important;
    scale: .8 !important;
    transform-origin: right center !important;
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    min-width: 0 !important;
  }
  body.page-template-page-tender-management .t-hero-features > * {
    min-width: 0 !important; max-width: 100% !important; overflow-wrap: anywhere !important;
  }
}
@media screen and (max-width: 600px) {
  body.page-template-page-tender-management .t-hero-copy {
    translate: -20px -18px !important; scale: .8 !important;
    transform-origin: right center !important; max-width: 100% !important;
  }
  body.page-template-page-tender-management .t-hero-features {
    translate: -20px -18px !important; scale: .8 !important;
    transform-origin: right center !important; display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 6px !important;
    max-width: 100% !important; min-width: 0 !important;
  }
}

/* Auction: move divider/features 100px RIGHT and tighten feature spacing by about 10%.
   Keep the divider attached to each feature instead of extending it toward the artwork. */
@media screen and (min-width: 601px) and (max-width: 1440px), screen and (max-width: 600px) {
  body.page-template-page-auction-management .phx-auction-page .a-hero-features {
    translate: clamp(20px, 7.33vw, 100px) 0 !important;
    scale: 1 !important;
    gap: 7.2px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  body.page-template-page-auction-management .phx-auction-page .a-mini {
    gap: 7.2px !important; padding-left: 3.6px !important; min-width: 0 !important;
  }
  body.page-template-page-auction-management .phx-auction-page .a-mini:not(:last-child)::after {
    right: auto !important;
    left: 0 !important;
    width: auto !important;
    max-width: 100% !important;
  }
}

/* Contract: feature icon frames are 10% larger than the original 31px square. */
@media screen and (min-width: 601px) and (max-width: 1440px), screen and (max-width: 600px) {
  body.page-template-page-contract-management .phx-contract-page .cm-feature-icon {
    width: 34px !important; height: 34px !important;
    min-width: 34px !important; min-height: 34px !important;
    max-width: 34px !important; max-height: 34px !important;
    flex: 0 0 34px !important; aspect-ratio: 1 / 1 !important;
    box-sizing: border-box !important;
  }
}

/* SRM hero: keep each existing icon size unchanged; place each icon to the RIGHT
   of its own text at the requested laptop/tablet/mobile widths. */
@media screen and (max-width: 1440px) {
  body.phx-srm-template .phx-srm-page .phx-srm-hero .phx-srm-features {
    direction: rtl !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: center !important;
    min-width: 0 !important;
  }
  body.phx-srm-template .phx-srm-page .phx-srm-hero .phx-srm-features .phx-srm-feature {
    direction: ltr !important;
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    min-width: 0 !important;
    max-width: 100% !important;
    text-align: right !important;
  }
  body.phx-srm-template .phx-srm-page .phx-srm-hero .phx-srm-features .phx-srm-feature > div {
    position: static !important;
    transform: none !important;
    translate: none !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    text-align: right !important;
  }
  body.phx-srm-template .phx-srm-page .phx-srm-hero .phx-srm-features .phx-srm-feature > div > b,
  body.phx-srm-template .phx-srm-page .phx-srm-hero .phx-srm-features .phx-srm-feature > div > small {
    display: block !important;
    max-width: 100% !important;
    text-align: right !important;
    transform: none !important;
    translate: none !important;
  }
}


/* SRM follow-up: move only hero capability icons another 100px left; keep text and icon sizing unchanged. */
@media screen and (max-width: 1440px) {
  body.phx-srm-template .phx-srm-page .phx-srm-hero .phx-srm-features .phx-srm-feature > i {
    translate: -200px 0 !important;
  }
}

/* Tender header follow-up based on v16 reference: raise the complete copy and
   capability row by 50px on the requested laptop/tablet/mobile viewports.
   Preserve the established horizontal offsets, scale, feature sizing and layout. */
@media screen and (min-width: 601px) and (max-width: 1440px) {
  body.page-template-page-tender-management .t-hero-copy {
    translate: -50px -50px !important;
  }
  body.page-template-page-tender-management .t-hero-features {
    translate: -50px -50px !important;
  }
}
@media screen and (max-width: 600px) {
  body.page-template-page-tender-management .t-hero-copy {
    translate: -20px -50px !important;
  }
  body.page-template-page-tender-management .t-hero-features {
    translate: -20px -50px !important;
  }
}


/* Tender v18 corrective override: move copy and feature row upward using relative positioning,
   independent of existing inline transforms. Scoped only to requested viewport widths. */
@media screen and (min-width: 601px) and (max-width: 1440px) {
  body.page-template-page-tender-management .t-hero-copy,
  body.page-template-page-tender-management .t-hero-features {
    position: relative !important;
    top: -50px !important;
  }
}
@media screen and (max-width: 600px) {
  body.page-template-page-tender-management .t-hero-copy,
  body.page-template-page-tender-management .t-hero-features {
    position: relative !important;
    top: -50px !important;
  }
}

/* Tender follow-up v20: move only the divider above the capabilities and the
   capability row another 50px down from v19; keep copy, sizing and horizontal offsets unchanged. */
@media screen and (min-width: 601px) and (max-width: 1440px) {
  body.page-template-page-tender-management .t-hero-features {
    top: 100px !important;
  }
}
@media screen and (max-width: 600px) {
  body.page-template-page-tender-management .t-hero-features {
    top: 100px !important;
  }
}

/* Tender v23: force a visible additional 30px right shift and explicit feature text sizes.
   Only the divider/features are affected; preserve icon dimensions and all main hero copy. */
@media screen and (min-width: 601px) and (max-width: 1440px), screen and (max-width: 600px) {
  body.page-template-page-tender-management .phx-tender-page .t-hero .t-hero-inner .t-hero-features {
    position: relative !important;
    top: 120px !important;
    left: 30px !important;
    right: auto !important;
    transform: translateX(30px) !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-hero .t-hero-inner .t-hero-features .t-mini > div:not(.t-mini-icon) b {
    font-size: 13.2px !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-hero .t-hero-inner .t-hero-features .t-mini > div:not(.t-mini-icon) span {
    font-size: 10.2px !important;
  }
}


/* Tender v24: hide capability descriptions and raise only the divider/features 20px.
   Keep feature titles, icons, established horizontal offset, and icon sizing unchanged. */
@media screen and (min-width: 601px) and (max-width: 1440px), screen and (max-width: 600px) {
  body.page-template-page-tender-management .phx-tender-page .t-hero .t-hero-inner .t-hero-features {
    top: 100px !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-hero .t-hero-inner .t-hero-features .t-mini > div:not(.t-mini-icon) span {
    display: none !important;
  }
}


/* Tender v25: increase the existing capability/divider section visually by 20%.
   Keep its established position and all other page elements unchanged. */
@media screen and (min-width: 601px) and (max-width: 1440px), screen and (max-width: 600px) {
  body.page-template-page-tender-management .phx-tender-page .t-hero .t-hero-inner .t-hero-features {
    transform: translateX(30px) scale(1.2) !important;
    transform-origin: center center !important;
  }
}


/* Auction v26 correction: adjust only hero copy and hero buttons; leave the
   divider and capability row in their exact v25 position. */
@media screen and (min-width: 601px) and (max-width: 1440px), screen and (max-width: 600px) {
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy > .a-kicker,
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy > h1,
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy > p,
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy > .a-buttons {
    translate: 50px 0 !important;
  }
  body.page-template-page-auction-management .phx-auction-page .a-hero-copy > .a-buttons .a-btn {
    box-sizing: border-box !important;
    min-width: 0 !important;
    padding: 6.4px 13.6px !important;
  }
}


/* Auction v27: adjust only the divider and capability row, based on the confirmed v26 reference.
   Move the complete feature section 50px left, reduce gaps by 30%, and lower it 30px.
   Do not alter the hero copy, buttons, feature sizing, or other pages. */
@media screen and (min-width: 601px) and (max-width: 1440px),
       screen and (max-width: 600px) {
  body.page-template-page-auction-management .phx-auction-page .a-hero-features {
    translate: calc(clamp(20px, 7.33vw, 100px) - 50px) 30px !important;
    gap: 5.04px !important;
  }
}


/* Auction v28: reduce only the spacing between capability items by 50% from v27.
   Keep the divider/features position and all other settings unchanged. */
@media screen and (min-width: 601px) and (max-width: 1440px),
       screen and (max-width: 600px) {
  body.page-template-page-auction-management .phx-auction-page .a-hero-features {
    gap: 2.52px !important;
  }
}


/* Auction v29: bring the three capability columns 30% closer together.
   Center a 70%-wide three-column grid so the outer capabilities move inward;
   preserve the established section translation and vertical position. Desktop/tablet only. */
@media screen and (min-width: 601px) and (max-width: 1440px) {
  body.page-template-page-auction-management .phx-auction-page .a-hero-features {
    grid-template-columns: repeat(3, minmax(0, 23.3333%)) !important;
    justify-content: center !important;
    column-gap: 0 !important;
  }
}

/* Auction v30: move only the capability row 100px right. Counter-shift the divider so its screen position stays unchanged; constrain line width to the 70% capability grid width. */
@media screen and (min-width: 601px) and (max-width: 1440px), screen and (max-width: 600px) {
  body.page-template-page-auction-management .phx-auction-page .a-hero-features {
    translate: calc(clamp(20px, 7.33vw, 100px) + 50px) 30px !important;
  }
  body.page-template-page-auction-management .phx-auction-page .a-hero-features > .a-auction-header-line {
    translate: -100px 0 !important;
    width: 70% !important;
    max-width: 70% !important;
    box-sizing: border-box !important;
  }
}

/* Contract management page only: configurable feature divider and +20% icon frames. */
@media screen and (min-width:601px) {
  body.page-template-page-contract-management .phx-contract-page .cm-features {
    position:relative!important;
    margin-top:48px!important;
    padding-top:13px!important;
  }
  body.page-template-page-contract-management .phx-contract-page .cm-features::before {
    content:""!important;
    position:absolute!important;
    top:var(--cm-feature-line-y,0px)!important;
    right:calc(0px - var(--cm-feature-line-x,40px))!important;
    width:var(--cm-feature-line-length,100%)!important;
    height:0!important;
    border:0!important;
    border-top:var(--cm-feature-line-width,1px) var(--cm-feature-line-style,solid) var(--cm-feature-line-color,#52e1da)!important;
    opacity:var(--cm-feature-line-opacity,.35)!important;
    pointer-events:none!important;
  }
  body.page-template-page-contract-management .phx-contract-page .cm-feature-icon {
    width:29px!important;
    height:29px!important;
    flex:0 0 29px!important;
  }
}

/* Contract management — mobile hero artwork: preserve the source image ratio.
   The legacy V29 rule used object-fit:fill and stretched the image. On phones,
   fill the existing hero canvas by cropping naturally instead of distorting it.
   Copy, buttons, feature row, and all tablet/desktop rules remain untouched. */
@media screen and (max-width: 760px) {
  body.page-template-page-contract-management .phx-contract-page .cm-hero-art img {
    object-fit: cover !important;
    object-position: var(--cm-hero-pos, 50% 50%) !important;
  }
}

/* Tender management — mobile-only hero artwork height correction.
   Keep the artwork proportional and visually balanced with the existing
   heading/copy/features. Tablet, laptop and larger displays are untouched. */
@media screen and (max-width: 600px) {
  body.page-template-page-tender-management .phx-tender-page .t-hero-art {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    align-self: center !important;
    overflow: hidden !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-hero-art img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: clamp(150px, 48vw, 210px) !important;
    object-fit: contain !important;
    object-position: center center !important;
  }
}


/* Tender CTA — phone-only background image with content-driven section height.
   Keep the selected artwork as the CTA background, remove the duplicate inline
   image, and let the copy/buttons determine the section height. Tablet and wider
   layouts retain the existing rules unchanged. */
@media screen and (max-width: 600px) {
  body.page-template-page-tender-management .phx-tender-page .t-cta {
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background-image: var(--t-cta-image) !important;
    background-size: auto 100% !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    overflow: hidden !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-cta-inner {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-cta-art {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-cta-copy {
    display: flex !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 25px 18px 27px !important;
    box-sizing: border-box !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 0 !important;
    overflow-wrap: anywhere !important;
    text-shadow: 0 1px 8px rgba(0,0,0,.55) !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-cta-copy h2 {
    font-size: clamp(20px, 5.5vw, 26px) !important;
    line-height: 1.55 !important;
    margin: 0 0 8px !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-cta-copy p {
    font-size: 11px !important;
    line-height: 1.9 !important;
    margin: 0 0 13px !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-cta-copy .t-buttons {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }
  body.page-template-page-tender-management .phx-tender-page .t-cta-copy .t-btn {
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 38px !important;
    white-space: normal !important;
    text-align: center !important;
    line-height: 1.6 !important;
    padding: 8px 13px !important;
  }
}

/* Phoenix bird story — phone-only spacing and horizontal story/poem divider.
   Kept in the final responsive sheet so it wins over earlier responsive rules. */
@media screen and (max-width:600px){
  body.phx-bird-template .phx-bird-page .pb-story .pb-shell{
    width:calc(100% - 40px)!important;
    max-width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  body.phx-bird-template .phx-bird-page .pb-story-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:20px!important;
    align-items:stretch!important;
  }
  body.phx-bird-template .phx-bird-page .pb-divider{
    position:relative!important;
    display:grid!important;
    place-items:center!important;
    width:100%!important;
    height:1px!important;
    min-height:1px!important;
    margin:2px 0!important;
  }
  body.phx-bird-template .phx-bird-page .pb-divider:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:50%!important;
    width:100%!important;
    height:1px!important;
    transform:translateY(-50%)!important;
    background:var(--a)!important;
  }
  body.phx-bird-template .phx-bird-page .pb-divider b{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    right:auto!important;
    bottom:auto!important;
    width:9px!important;
    height:9px!important;
    margin:0!important;
    transform:translate(-50%,-50%) rotate(45deg)!important;
    border:1px solid var(--a)!important;
    background:var(--bg)!important;
    z-index:1!important;
  }
}



/* Homepage and foreground-image heroes: preserve intrinsic image proportions. */
@media screen and (max-width:600px){
  body.home .hero-wrap,
  body.front-page .hero-wrap{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
  }
  body.home .hero-wrap .hero-bg,
  body.front-page .hero-wrap .hero-bg{
    height:100%!important;
    overflow:hidden;
  }
  body.home .hero-wrap .hero-bg img,
  body.front-page .hero-wrap .hero-bg img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  .phx-contract-page .cm-hero-art img,
  .phx-auction-page .a-hero-art img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  .phx-contract-page .cm-hero-art,
  .phx-auction-page .a-hero-art{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
  }
}
