/* t9-iphone-duo : the foldable iPhone Duo's three screens (Brent-approved mockups, 2026-10-26,
   https://claude.ai/artifact/XEL9NEtjdoLgyKk7YgXvMQ). Every rule lives inside an @media block bounded on
   width, height and orientation, so no phone, tablet, laptop or desktop size the other tiers perfected
   can match (checked at 360x780, 390x844, 768x1024, 932x430 and 1440x900).
   Screens: cover 466x678 portrait, unfolded upright 626x890 portrait, unfolded sideways 890x626 landscape.
   Specificity note: the page carries <style> blocks in the body after the head links, so every selector
   here starts with html:root body to win over them. Hero only: nothing below the first screen changes. */

/* ================= A. cover screen (~466x678): the find-a-property sentence on one line ================= */
@media (min-width:450px) and (max-width:480px) and (orientation:portrait) and (min-height:480px) and (max-height:760px){
  /* the plate reaches 8px past the text column on each side so the full sentence fits at a 16px select size (iOS zooms on anything smaller) */
  html:root body .hr-inst{margin-left:-8px;margin-right:-8px;width:calc(100% + 16px);max-width:none;box-sizing:border-box;padding-left:12px;padding-right:12px}
  html:root body .hr-sent{max-width:none;white-space:nowrap;font-size:14.5px}
  html:root body .hr-inst .hr-sent select{padding-right:10px;padding-left:0;background-position:right 0 center;margin:0}
  /* a select is as wide as its LONGEST option ("industrial or flex"), which pushed the sentence past the plate.
     Size each to the chosen value instead: field-sizing where the browser has it, fixed widths otherwise. */
  html:root body #hrNeed{width:4.9em}
  html:root body #hrType{width:6.9em}
  html:root body #hrMkt{width:6.4em;padding-right:10px;background-position:right 0 center}
  @supports (field-sizing:content){
    html:root body .hr-inst select{field-sizing:content;width:auto}
  }
}

/* ================= B. unfolded upright (~626x890): bigger headline, one-line sentence, count beside the
   button, the four firm figures on one row ================= */
@media (min-width:600px) and (max-width:660px) and (orientation:portrait) and (min-height:680px) and (max-height:960px){
  html:root body .hr-in{padding-bottom:104px}
  html:root body .hr-h1{font-size:60px;line-height:.98}
  html:root body .hr-inst{margin-top:26px;padding:16px 20px 18px;gap:10px 18px}
  html:root body .hr-lab{flex:1 1 100%}
  html:root body .hr-sent{flex:1 1 100%;max-width:none;white-space:nowrap;font-size:19px}
  html:root body .hr-count{flex:0 0 auto}
  html:root body .hr-submit{flex:1 1 auto;justify-content:space-between;padding:17px 18px 17px 22px}
  html:root body .hr-led{display:flex;margin-top:26px;padding-top:14px}
  html:root body .hr-led::before{display:block}
  html:root body .hr-cell,html:root body .hr-cell:nth-child(odd){padding:0 0 0 14px;border-top:0;border-left:1px solid rgba(247,246,242,.5)}
  html:root body .hr-cell:first-child{padding-left:0;border-left:0}
  html:root body .hr-v{font-size:30px}
  html:root body .hr-k{white-space:normal}
  /* the floating social rail sat on top of the search plate at this width */
  html:root body .cta-social{display:none}
}

/* ================= C. unfolded sideways (~890x626): headline left, firm figures right, the search plate full
   width below, the consent bar as a full-width strip along the bottom (Brent, 2026-10-26) ================= */
@media (min-width:860px) and (max-width:920px) and (orientation:landscape) and (min-height:480px) and (max-height:680px){
  html:root body .hr-in{display:grid;grid-template-columns:minmax(0,1fr) 330px;grid-template-areas:"copy led" "inst inst";column-gap:48px;align-content:start;
    padding-top:calc(14px + 76px + 44px);padding-bottom:90px}
  html:root body .hr-copy{grid-area:copy;display:block}
  html:root body .hr-cap{display:none}
  html:root body .hr-eyebrow{margin-bottom:14px}
  html:root body .hr-h1{font-size:52px;line-height:.98}
  html:root body .hr-chip{margin-top:18px}
  html:root body .hr-led{grid-area:led;align-self:end;display:grid;grid-template-columns:1fr 1fr;row-gap:16px;column-gap:24px;margin:0;padding:0}
  html:root body .hr-led::before{display:none}
  html:root body .hr-cell,html:root body .hr-cell:nth-child(odd),html:root body .hr-cell:first-child{padding:12px 0 0;border-left:0;border-top:1px solid rgba(169,209,139,.5)}
  html:root body .hr-v{font-size:32px;text-shadow:0 1px 2px rgba(28,46,24,.8),0 2px 18px rgba(28,46,24,.6)}
  html:root body .hr-k{color:#F7F6F2;text-shadow:0 1px 2px rgba(28,46,24,.9),0 2px 14px rgba(28,46,24,.7)}
  html:root body .hr-inst{grid-area:inst;max-width:none;margin:24px 0 0;padding:14px 22px 16px;flex-wrap:wrap;gap:6px 20px}
  html:root body .hr-lab{flex:1 1 100%}
  html:root body .hr-sent{flex:1 1 auto;max-width:none;white-space:nowrap;font-size:19px}
  html:root body .hr-count{margin-left:auto}
  html:root body .hr-submit{flex:1 1 100%;justify-content:center;gap:16px;padding:18px}
  html:root body .cta-social{display:none}
  /* consent: the phone strip, stretched edge to edge (same copy, same buttons, same behavior) */
  html:root body #consent-banner.consent,html:root body #consent-banner.consent-corner{left:16px!important;right:16px!important;top:auto!important;bottom:calc(14px + env(safe-area-inset-bottom))!important;transform:none!important;
    width:auto;padding:8px 10px 8px 18px;display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-left:4px solid var(--terra-deep);border-radius:6px;box-shadow:0 30px 70px -34px rgba(43,44,45,.5)}
  html:root body #consent-banner[hidden]{display:none}
  html:root body #consent-banner h2,html:root body #consent-banner>p:not(.consent-mini),html:root body #consent-banner .consent-custom{display:none}
  html:root body #consent-banner .consent-mini{display:block;flex:1 1 auto;margin:0;font:400 .82rem/1.35 var(--sans);color:var(--ink)}
  html:root body #consent-banner .consent-mini a{color:var(--green-text);text-decoration:underline;text-underline-offset:2px}
  html:root body #consent-banner .consent-actions{margin:0;gap:8px;flex:0 0 auto;flex-wrap:nowrap}
  html:root body #consent-banner .consent-actions button{min-height:44px;padding:0 16px;font:600 .6rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;border-radius:2px;flex:0 0 auto}
  html:root body #consent-banner .consent-actions button[data-consent="accept"]{background:var(--terra-deep);border-color:var(--terra-deep);color:#fff}
  html:root body #consent-banner .consent-actions button[data-consent="customize"]{display:none}
}

/* ================= D. the Duo in Safari (Aidan, 2026-10-27). The screen sizes above are the whole screen; Safari's
   bars take about 160 upright and 110 sideways, so the page is really about 466x518, 626x730 and 890x516. The three
   queries above now start at those real heights (480 and 680 tall; phones held sideways stay under 440), and these
   blocks act only when the page is that short, so the search and the consent bar both fit on the first screen. The
   "A Linville Team Partners Business" chip steps aside on the short cover and sideways screens (the sideways header
   already carries the same line). At the full screen sizes nothing here applies. ================= */
@media (min-width:450px) and (max-width:480px) and (orientation:portrait) and (min-height:480px) and (max-height:620px){
  html:root body .hr-in{padding-top:92px}
  html:root body .hr-h1{font-size:44px}
  html:root body .hr-chip{display:none}
  html:root body .hr-inst{margin-top:18px;row-gap:8px}
}
@media (min-width:600px) and (max-width:660px) and (orientation:portrait) and (min-height:680px) and (max-height:840px){
  html:root body .hr-in{padding-top:108px}
}
@media (min-width:860px) and (max-width:920px) and (orientation:landscape) and (min-height:480px) and (max-height:600px){
  html:root body .hr-in{padding-top:100px;padding-bottom:84px}
  html:root body .hr-h1{font-size:46px}
  html:root body .hr-chip{display:none}
  html:root body .hr-inst{margin-top:16px}
}