/* t4-tablets-landscape : responsive rules for this tier only. Every rule lives inside an @media block that can never match 1440x900. */
/* Tier range: (min-width:1024px) and (max-width:1279px). iPad Pro portrait (1024x1366), iPad landscape (1024x768),
   iPad Air and Pro 11 landscape (1180x820, 1194x834). Parent-site rule for this band: the desktop composition
   survives unchanged; only heights relax and one optional element per short band gives way.
   Cascade note: the page keeps 25 <style> blocks in <body>, after the head links, so a same-selector rule here would lose on source order. Every selector therefore carries a leading html type selector (one extra point of specificity, no !important); the page's own stateful selectors (.ask.talking .ask-new, [hidden], id-scoped rules) still outrank these as before.
   Ordering: the whole-tier block first, then the narrow sub-band (1024 to 1100) widest-first, then height refinements.
   Round 2 (council review): consent card top right and 350px wide across the tier, social rail 40px and standing down over About and the board across the tier, the hero instrument one row at every tier width, Fig. 01 caption re-seated under the 800px height refinement, team headline balanced and the rail stat stacked, map fixed at the desktop 360px, rail cells 36px in the 1024 to 1100 band, broker pins back to 32px, hit areas for the assistant's send and Start over controls. */

/* ================= A. whole tier, 1024 to 1279 ================= */
@media (min-width:1024px) and (max-width:1279px){
  /* A1. the hero instrument reads as one sentence again from 1100 up: the sentence's natural width is 434px at this
     type size, so label + sentence + count + button (846px) plus three desktop gaps fits every width from 1100 with
     room to spare. The page's own 1240 fold was measured against the grown sentence, not its natural width. */
  html .hr-inst{flex-wrap:nowrap;gap:clamp(16px,2.6vw,40px);padding:16px 22px 17px}
  html .hr-sent{flex:1 1 auto;white-space:nowrap}

  /* A2. the Ask Linville.ai wordmark never breaks: the hidden Start-over button was still reserving 93px beside it
     in the 273px rail head, so the name wrapped to two lines with .ai stranded. The button leaves the flow until a
     conversation is live, then takes its own row under the name. */
  html .ask-top{flex-wrap:wrap}
  html .ask-name{white-space:nowrap;flex:0 0 auto}
  html .ask-new{display:none}
  html .ask.talking .ask-new{display:block}
  /* A3. the composer's placeholder is longer than the 243px field: end it with an ellipsis instead of a cut letter */
  html .ask-in{text-overflow:ellipsis}
  html .ask-in::placeholder{text-overflow:ellipsis}

  /* A4. the fixed social rail: the frames move in with the viewport but the rail kept its 46px desktop cells, so it
     sat 1 to 9px from the frame hairlines (16px at 1440). 40px cells, the parent's small-screen size, clear the team
     frame and the contact tile by 7px at the 1101 seam, 11px at 1180, 12px at 1194, 15px at 1279. The rail also
     stands down while About or the board is in view (the page's own About device stops at 1100; its end-of-page
     toggle looks for #sec5 and .sf-ft, which this page does not have, so it never fires). */
  html .cta-social a{width:40px;height:40px}
  html body.ab-inview .cta-social,html body.le-sec4-inview .cta-social{opacity:0;visibility:hidden;pointer-events:none}

  /* A5. the consent card: the page's desktop card is 480px wide and sits top right under the plat from 1101. In this
     tier the hero copy is top-anchored on every landscape iPad, so a 480px card overprints "Relationships." by 83px
     at 1101, 45px at 1180 and 44px at 1194 (clear only from about 1260). At 350px it clears the headline by 47px at
     1101, 85px at 1180 and 30px at 1024, and ACCEPT / REJECT / CUSTOMIZE still sit on one line. One card size for
     every iPad. The placement for 1024 to 1100 is in block B (the page keeps the phone corner there). */
  html .consent{width:min(350px,calc(100vw - 2*var(--pad)))}

  /* A6. hit areas on a touch tier, drawn size unchanged: the assistant's send arrow is 20x30 and Start over 81x21.
     Invisible padding takes them to 40x44 and 81x45 (neither has an ::after of its own; the send extends 8px into
     the composer's 10px gap and 12px into the panel's padding, so it steals nothing from the field). Seeds, the map
     zoom stack and the selects cannot grow without moving their neighbours; see the report. */
  html .ask-send{position:relative}
  html .ask-send::after{content:"";position:absolute;inset:-7px -12px -7px -8px}
  html .ask-new::after{content:"";position:absolute;inset:-12px 0}
}

/* ================= B. 1024 to 1100: the page's own tablet fold starts at 1100, but from 1024 the desktop composition
   still fits, so this band restores it (the parent keeps the desktop grammar from exactly 1024 landscape). ================= */
@media (min-width:1024px) and (max-width:1100px){
  /* B1. the instrument stays one sentence here too. Inner content is 846px (label 102, sentence 434, count 147,
     button 163) and the plate is 934px wide at 1024, so the three gaps share what is left: 30.4vw - 294px is
     exactly (plate - 30px padding - 846px) / 3, which gives 17px at 1024, 28px at 1060 and the desktop 40px from
     1100. The count sits 17px after the sentence's period at the narrowest width and the row never wraps. (Round 1
     folded this to two rows; the council read the empty right half of row one as the one place in the tier where
     the instrument did not read as a single sentence.) */
  html .hr-inst{gap:clamp(16px,calc(30.4vw - 294px),40px);padding:16px 15px 17px}

  /* B2. the metrics keep the desktop four-up: each cell is 233px wide at 1024, more than the longest label needs */
  html .hr-led{display:flex;gap:normal;padding-top:16px}
  html .hr-led::before{display:block}
  html .hr-cell{padding:0 22px;border-left:1px solid rgba(247,246,242,.5);border-top:0}
  html .hr-cell:nth-child(odd){padding-left:22px;border-left:1px solid rgba(247,246,242,.5)}
  html .hr-cell:first-child{border-left:0;padding-left:0}

  /* B3. About keeps the desktop spread: copy and ledger left, drawing and marks right (the page turns the ledger
     into three narrow columns under the plate at 1100; at 1024 the left column is still 431px, enough for the rows) */
  html #sec-about.ab-elev{padding-top:clamp(44px,5.6vh,64px);padding-bottom:clamp(30px,4vh,44px)}
  html #sec-about.ab-elev .ab-spread{grid-template-columns:minmax(0,6fr) minmax(0,7fr);grid-template-rows:auto auto minmax(0,1fr);grid-template-areas:"head fig" "body fig" "arg fig";column-gap:var(--gap);align-items:stretch;margin-top:clamp(14px,2vh,22px)}
  html #sec-about.ab-elev .ab-body{align-self:auto}
  html #sec-about.ab-elev .ab-p{max-width:58ch;font-size:clamp(1rem,1.1vw,1.08rem)}
  html #sec-about.ab-elev .ab-fig2{justify-content:flex-start;padding-bottom:40px}
  html #sec-about.ab-elev .ab-fig2 .ab-cap{padding-top:10px}
  html #sec-about.ab-elev .ab-fig2 .ab-el{margin-top:auto}
  html #sec-about.ab-elev .ab-el{margin-top:18px}
  html #sec-about.ab-elev .ab-fig2 .ab-co-marks{margin-top:clamp(80px,11vh,124px);margin-bottom:auto}
  html #sec-about.ab-elev .ab-argw{align-self:end;padding-top:clamp(14px,2vh,22px);border-top:0}
  html #sec-about.ab-elev .ab-arg{display:block;max-width:62ch}
  html #sec-about.ab-elev .ab-arow{grid-template-columns:58px minmax(0,1fr) auto;grid-template-areas:"num txt amt";column-gap:14px;row-gap:0;padding:9px 0 10px}
  html #sec-about.ab-elev .ab-arow+.ab-arow{padding-left:0;border-left:0}
  html #sec-about.ab-elev .ab-arow::before,html #sec-about.ab-elev .ab-arow:last-child::after{display:block}
  html #sec-about.ab-elev .ab-nsvg{width:46px;height:32px}
  html #sec-about.ab-elev .ab-ad{font-size:.96rem}
  html #sec-about.ab-elev .ab-amt{justify-self:end;padding-top:1px}
  html #sec-about.ab-elev .ab-amv{font-size:1.35rem}
  html #sec-about.ab-elev .ab-argft{max-width:50ch;padding:14px 0 0;border-top:0}
  html #sec-about.ab-elev .ab-argft .ab-link{padding-top:0}
  html #sec-about.ab-elev .ab-src{padding-top:0}
  html #sec-about.ab-elev .ab-bg::after{background:linear-gradient(90deg,rgba(246,247,245,.80) 0%,rgba(246,247,245,.70) 22%,rgba(246,247,245,.44) 38%,rgba(246,247,245,.14) 50%,rgba(246,247,245,0) 60%)}
  html.hr-anim #sec-about.ab-elev .ab-argw,html.hr-anim #sec-about.ab-elev .ab-arow+.ab-arow{border-color:transparent}

  /* B4. the listings board keeps the desktop sheet: rail left (count, assistant, map), tabs and filters over two
     card columns right, then three across. The card module is (W - 2g)/3 as on desktop, 277px at 1024. */
  html .lx-body{--cgap:24px;--lxgap:24px;grid-template-columns:calc((100% - 3*var(--lxgap) + var(--cgap))/3) minmax(0,1fr);align-items:stretch}
  html .lx-body::before{display:block}
  html .lx-grid-wide{grid-template-columns:repeat(3,minmax(0,1fr))}
  html .lx-side{grid-column:1;grid-row:1;position:sticky;top:76px;order:0;display:flex;flex-direction:column;align-items:stretch;gap:0;min-height:0;margin-bottom:0;--railgap:clamp(22px,2.8vh,30px);padding-bottom:var(--railgap)}
  html .lx-left{grid-column:2;grid-row:1}
  /* the map keeps the desktop's 360px height at both iPad heights; round 1 let it follow the viewport (34vh) and at
     1366 tall it grew to 464px, pushing the rail 56px past the second card row so the wide grid started under it and
     rows two and three sat 80px apart. Fixed, the rail's foot meets the second row exactly and the assistant absorbs
     the slack, as on desktop. */
  html .lx-map{max-width:none;flex:0 0 auto;height:360px;display:flex;margin-bottom:0}
  html .lx-map .lx-osm{flex:1 1 auto;aspect-ratio:auto;min-height:0}
  html .r2-board{margin-bottom:var(--railgap)}
  html .ask{flex:1 1 auto;min-height:260px;max-height:none;margin-bottom:var(--railgap)}
  html .lx-side .r2-board,html .lx-side .ask,html .lx-side .lx-map{margin-left:calc(-1*var(--lxpadx)/2);margin-right:calc(var(--lxpadx)/2)}
  html .ask.talking~.lx-map{display:none}
  html .ask-log{max-height:none;flex:1 1 auto;min-height:0}
  html .lx-filters{flex:0 0 auto}
  html .lx-frow{flex-wrap:nowrap}
  /* the off-market tile joins the grid as one card again (the fold made it span the row) */
  html .le-offmkt{grid-column:auto;margin-top:0}
  /* the page hands twelve slots per page below 1101 (its desktop page of seven is gated at min-width:1101 in
     script). Four sit beside the rail and eight run wide, so the last wide row holds two. On page one the eighth
     slot is the off-market tile: it takes the two remaining modules so the row closes flush, and its copy block
     is centred in the double module so it reads as a set tile rather than a stretched one. */
  html .lx-grid-wide>.lx-omtile:nth-child(3n+2):last-child{grid-column:span 2;align-items:center;text-align:center}
  html .lx-grid-wide>.lx-omtile:nth-child(3n+2):last-child .lx-om-kick{justify-content:center}
  html .lx-grid-wide>.lx-omtile:nth-child(3n+2):last-child .lx-om-copy{margin-left:auto;margin-right:auto}
  html .lx-grid-wide>.lx-omtile:nth-child(3n+2):last-child .lx-orcta{align-self:center}

  /* B5. the team bench keeps the desktop module: the rail is the first cell of a three-column grid, so the eleven
     portraits fill exactly four rows of three (the page's fold put the rail across the top and left Drew and
     Taryne alone on a fourth row). The headline balances its three lines ("Your broker has a / team behind them. /
     So do you.", the desktop break) instead of stranding "them." on its own line at 1100. Head height stays 82px. */
  html .tb-body{grid-template-columns:repeat(3,minmax(0,1fr))}
  html .tb-rail{grid-column:1;grid-row:1}
  html #sec-team .tb-head{text-wrap:balance}
  /* the rail's stat keeps the desktop stack (figure, then "of our clients come back." on its own line): the page lets
     the label flow inline beside the figure when the cell is wide enough, which it is from 1064 to 1100 (300px cell,
     47px figure), so the label read as "84 % OF OUR CLIENTS COME BACK." at 1100 while 1024 and 1101 stacked it. */
  html #sec-team .tb-stat-n .tb-stat-t{flex-basis:100%}

  /* B8. the fixed social rail at this band: with 40px cells the rail cleared the team frame hairline and the List
     with us tile by 4 to 5px (rail left 984 vs frame right 979 at 1024; 1060 vs 1052 at 1100) and its own left border
     read as a doubled hairline against the frame. 36px cells clear the frame by 9px at 1024 and 12px at 1100, the same
     air 1180 and 1194 keep with the 40px cells; the 16px glyphs are unchanged. The rail still stands down over About
     and the board (block A); the page has no team or contact in-view toggle, so that stand-down needs script. */
  html .cta-social a{width:36px;height:36px}

  /* B6. the card caption at a 277px module: "Winston-Salem, NC" was ellipsised beside the broker credit. The credit
     closes its gap to 4px and the caption gains 4px of plate, so the city reads whole with the page's own 32px pins
     (round 1 shrank them to 28px; at 32px the page's coarse-pointer hit area of -6px reaches 44px again). */
  html .pl-cap{left:14px;right:9px}
  html .pl-cap-btm{gap:8px}
  html .pl-brok{gap:4px}
  html .pl-brok2 .pl-brokby .bn{font-size:.84rem}

  /* B7. the consent card: the page's desktop placement (top right under the plat, flush with Get in touch) is gated
     at 1101, so in this band the card sat bottom left over FIND A PROPERTY, the sentence and the first two metric
     cells. It takes the desktop position; the 350px width from block A clears "Relationships." by 30px at 1024. */
  html .consent{left:auto;right:var(--pad);bottom:auto;top:calc(12px + 76px + 22px)}
}

/* ================= C. height refinements ================= */
/* C1. 800px tall or less (1024x768 and every tier width at 800): the hero's stack ran past the fold and the metrics
   were cut. The instrument's top margin trims to the parent's short-desktop clamp; the Fig. 01 caption, which rides
   down by its own 12svh offset, is re-seated so it keeps 47px of air over the plate (it was 3px) and sits level with
   the family chip's foot, where 1180x820 keeps 51px. */
@media (min-width:1024px) and (max-width:1279px) and (max-height:800px){
  html .hr-inst{margin-top:clamp(64px,11svh,124px)}
  html .hr-cap{top:calc(11svh - 36px)}
}
