/* =========================================================
   POOL CATEGORY pattern - /pool-heater/  (Figma frame 704:3)

   Every number below was read off a layer of 704:3 with
   get_design_context, not eyeballed. The frame is 1920 wide starting at
   0,0, so a Figma y IS the page y this file produces and the y the spec
   in scripts/figma-gate/specs/patterns/pool-category/ asserts.

   This file also holds what used to be the template's inline <style>
   block (declared in scripts/figma-gate/migrated/pool-category.json so
   the render harness strips the deployed copy). Rules are scoped to
   ".evo-tpl-page-pool-heater" so they cannot reach the interior pages
   that share these class names.

   SHAPE OF THE FRAME. The design is not a flow of padded bands: the
   sections are hand-placed layers, several of which overlap. Reproducing
   that exactly means each section this pattern owns is a fixed-height
   block with its children absolutely positioned at the Figma offset,
   and the bands that overlap in Figma abut at the boundary where the
   upper layer stops being visible:

     hero            0     h 962   photo 0-747, white lip from 684
     contact card    570   h 706   straddles the hero edge (shared)
     intro           782   h 586   awards, h2, body (starts inside the hero)
     product range   1368  h 1026  Figma bg is 1080 tall, the cta band covers the last 54
     evaluation cta  2394  h 767   white lip from 3054 (shared component)
     reviews         3161          shared component, page rhythm only
     leaders band    3754  h 733   navy, radius 28
     browse by sol   4487  h 1045  heading 4612, cards 4733
     testimonial 1   5532  h 684   Figma panel is 728 tall, the navy band covers the last 44
     navy band       6216  h 664   navy panel on a #f4f4f4 section, see below
     testimonial 2   6880  h 697   Figma panel starts 6849, the navy band covers the first 31
     logos           7577          shared component, page rhythm only
     faq             8068          shared component, box heights only
     sizing          8682  h 1070  Figma panel is 1416 tall, the footer covers the last 346
     footer          9752          shared component

   The navy band sits on a #f4f4f4 section rather than on white because in
   Figma the two grey testimonial panels run behind its rounded corners,
   top and bottom. Same reason the guarantee band is only rounded at the
   top: the footer covers its bottom corners.

   All fixed-pixel geometry is inside @media(min-width:1201px). Below that
   the base rules give the fluid layout the templates always had, so 375px
   has no horizontal scroll. There are no mobile frames in Figma.
   ========================================================= */

/* ---------------------------------------------------------
   BASE / FLUID  (all widths, exact geometry overrides below)
   --------------------------------------------------------- */
.evo-tpl-page-pool-heater .php-hero{position:relative;min-height:700px;overflow:visible;color:#fff;background:#0a4a7a;}
.evo-tpl-page-pool-heater .php-hero .bg{position:absolute;inset:0;z-index:0;overflow:hidden;}
/* 704:5 "Overlay" is the layer UNDER 704:6 "Image" in the frame, not over it:
   Figma lists it first, and an export of 704:6 is pixel for pixel the frame
   itself, so the 15% black never reaches the photo. The markup carries the
   overlay after the image, so the layer order is restored here instead. Left
   painting on top it made the whole hero 15% darker than the design. */
.evo-tpl-page-pool-heater .php-hero .bg img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;object-position:bottom;}
.evo-tpl-page-pool-heater .php-hero .bg .ov{position:absolute;inset:0;z-index:0;background:rgba(0,0,0,.15);}
.evo-tpl-page-pool-heater .php-hero .lip{position:absolute;left:0;right:0;bottom:-1px;height:56px;background:#fff;border-radius:28px 28px 0 0;z-index:1;}
.evo-tpl-page-pool-heater .php-hero .container{position:relative;z-index:2;padding-top:380px;}
.evo-tpl-page-pool-heater .php-hero .eyebrow{font-weight:400;font-size:20px;line-height:normal;margin-bottom:6px;}
.evo-tpl-page-pool-heater .php-hero h1{font-weight:700;font-size:40px;line-height:1.15;letter-spacing:-1.5px;}

.evo-tpl-page-pool-heater .php-intro{position:relative;z-index:2;padding:60px 0 70px;}
.evo-tpl-page-pool-heater .php-intro .wrap{max-width:807px;}
.evo-tpl-page-pool-heater .php-intro .badges img{width:308px;height:179px;max-width:100%;object-fit:contain;margin-bottom:19px;}
.evo-tpl-page-pool-heater .php-intro h2{font-weight:700;font-size:32px;line-height:1.1;letter-spacing:-1.5px;color:#27272d;margin-bottom:24px;}
.evo-tpl-page-pool-heater .php-intro p{font-weight:300;font-size:20px;line-height:26px;color:#27272d;}

.evo-tpl-page-pool-heater .php-range{background:#f4f4f4;padding:60px 0 70px;}
.evo-tpl-page-pool-heater .php-range h2{text-align:center;font-weight:700;font-size:32px;line-height:1.16;letter-spacing:-1px;color:#27272d;margin-bottom:40px;}

.evo-tpl-page-pool-heater .php-leaders{background:#002b54;color:#fff;padding:70px 0;text-align:center;border-radius:28px;}
.evo-tpl-page-pool-heater .php-leaders h2{font-weight:700;font-size:30px;line-height:1.2;letter-spacing:-0.96px;margin:0 auto 32px;}
.evo-tpl-page-pool-heater .php-leaders h2 .blue{color:#2ca9e3;}
.evo-tpl-page-pool-heater .php-leaders .badges2{margin:0 auto 32px;background:none;padding:0;}
/* site.css caps every .badges2 img at 80px tall for the interior pages that
   share the class; Figma 704:171 is 1348x179, so the cap is released here. */
.evo-tpl-page-pool-heater .php-leaders .badges2 img{width:auto;max-width:100%;height:auto;max-height:none;object-fit:contain;margin:0 auto;}
.evo-tpl-page-pool-heater .php-leaders p{font-weight:300;font-size:20px;line-height:1.4;letter-spacing:-0.56px;color:#fff;margin:0 auto;}

.evo-tpl-page-pool-heater .php-sol{padding:60px 0;}
.evo-tpl-page-pool-heater .php-sol h2{text-align:center;font-weight:700;font-size:32px;line-height:1.34;letter-spacing:-1px;color:#27272d;margin-bottom:40px;}
.evo-tpl-page-pool-heater .php-sol .row{display:grid;grid-template-columns:1fr;gap:24px;}
.evo-tpl-page-pool-heater .php-scard{position:relative;display:block;aspect-ratio:481/629;border-radius:40px;overflow:hidden;}
.evo-tpl-page-pool-heater .php-scard .sol-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;}
.evo-tpl-page-pool-heater .php-scard .sol-photo{position:absolute;left:0;top:0;width:100%;height:78.06%;object-fit:cover;z-index:2;}
.evo-tpl-page-pool-heater .php-scard .sol-unit{position:absolute;left:22.66%;top:44.51%;width:56.55%;height:auto;z-index:3;}
.evo-tpl-page-pool-heater .php-scard .cap{position:absolute;left:13.93%;bottom:12%;z-index:4;font-weight:500;font-size:24px;line-height:1.2;letter-spacing:-1.44px;color:#fff;}

.evo-tpl-page-pool-heater .php-alt{position:relative;background:#f4f4f4;padding:50px 0;}
.evo-tpl-page-pool-heater .php-alt .grid{display:grid;grid-template-columns:1fr;gap:32px;align-items:center;}
.evo-tpl-page-pool-heater .php-alt .pimg2{display:block;}
.evo-tpl-page-pool-heater .php-alt .pimg2 img{width:100%;height:auto;object-fit:contain;}
.evo-tpl-page-pool-heater .php-alt .stars{display:flex;gap:17.649px;margin-bottom:24px;}
.evo-tpl-page-pool-heater .php-alt .stars img{width:29.881px;height:30px;}
.evo-tpl-page-pool-heater .php-alt blockquote{font-weight:300;font-size:20px;line-height:34px;color:#27272d;margin-bottom:22px;}
.evo-tpl-page-pool-heater .php-alt .who{font-family:var(--font-display);font-weight:700;font-size:18px;line-height:normal;color:#000;}

.evo-tpl-page-pool-heater .php-navy{position:relative;background:#002b54;color:#fff;padding:60px 0;}
.evo-tpl-page-pool-heater .php-navy .grid{display:grid;grid-template-columns:1fr;gap:32px;align-items:center;}
.evo-tpl-page-pool-heater .php-navy h2{font-weight:700;font-size:30px;line-height:1.2;letter-spacing:-0.96px;margin-bottom:22px;}
.evo-tpl-page-pool-heater .php-navy .copy .sub{font-weight:300;font-size:22px;line-height:1.4;letter-spacing:-0.56px;color:#fff;margin:0;}
.evo-tpl-page-pool-heater .php-navy .copy .body{font-weight:300;font-size:18px;line-height:1.5;letter-spacing:-0.56px;color:#fff;margin:24px 0 0;}
.evo-tpl-page-pool-heater .php-navy .chart{background:none;border-radius:0;min-height:0;display:block;}
.evo-tpl-page-pool-heater .php-navy .chart img{width:100%;height:auto;max-width:100%;object-fit:contain;}

.evo-tpl-page-pool-heater .php-faq .fbtn{font-size:16px;}

/* Figma sets its own line breaks inside two text nodes on this frame: 704:268
   breaks after "you may have." and 704:166 breaks after "low carbon
   emissions,". Chromium sets Circular Std a shade narrower than Figma does, so
   without them the build re-wraps and the lines do not land where the design
   draws them. The breaks are the design's, not a nudge, and they are released
   below 1201 where there is no Figma frame to match. */
.evo-tpl-page-pool-heater br.fxbr{display:none;}

.evo-tpl-page-pool-heater .php-guarantee{position:relative;background:#002b54;color:#fff;padding:70px 0 60px;border-radius:28px 28px 0 0;}
.evo-tpl-page-pool-heater .php-guarantee .head{display:grid;grid-template-columns:1fr;gap:24px;justify-items:center;text-align:center;margin-bottom:40px;}
.evo-tpl-page-pool-heater .php-guarantee .head img{width:241px;height:237px;max-width:100%;object-fit:contain;}
.evo-tpl-page-pool-heater .php-guarantee h2{font-weight:700;font-size:30px;line-height:1.2;letter-spacing:-1px;margin-bottom:16px;}
.evo-tpl-page-pool-heater .php-guarantee .head p{font-weight:300;font-size:20px;line-height:1.4;letter-spacing:-0.56px;color:#fff;}
.evo-tpl-page-pool-heater .php-guarantee .grid{display:grid;grid-template-columns:1fr;gap:40px;align-items:center;}
.evo-tpl-page-pool-heater .php-guarantee .copy h3{font-family:var(--font-display);font-weight:700;font-size:20px;line-height:31px;letter-spacing:-0.4px;color:#2ca9e3;margin:0;}
.evo-tpl-page-pool-heater .php-guarantee .copy p{font-weight:300;font-size:20px;line-height:31px;letter-spacing:-0.4px;color:#fff;margin:0;}
.evo-tpl-page-pool-heater .php-guarantee .copy p+h3{margin-top:31px;}
.evo-tpl-page-pool-heater .php-guarantee .ph-box{display:none;}
.evo-tpl-page-pool-heater .php-guarantee .qbtn2{width:276px;height:70px;background:#d2232a;border-radius:60px;font-weight:500;font-size:20px;margin-top:34px;}
.evo-tpl-page-pool-heater .php-guarantee .media{display:flex;align-items:center;justify-content:center;}
.evo-tpl-page-pool-heater .php-guarantee .media .circ{width:min(585px,80vw);aspect-ratio:585/579;border-radius:50%;background:#d9d9d9;overflow:hidden;}

/* ---------------------------------------------------------
   EXACT FIGMA GEOMETRY  (the 1920 artboard)
   --------------------------------------------------------- */
@media(min-width:1201px){

/* the design's own line breaks inside 704:268 and 704:166 */
.evo-tpl-page-pool-heater br.fxbr{display:inline;}

/* ---- HERO 704:4 ------------------------------------------------------
   962 tall. The photo 704:6 and the rgba(0,0,0,.15) overlay 704:5 both
   stop at 747. The white panel 704:16 starts at 684 with a 28 radius and
   runs 915 tall inside an overflow-clip frame, i.e. only its rounded top
   and the 278 down to the hero's edge are ever visible; it is built at
   that visible height so it cannot paint over the intro below it. */
.evo-tpl-page-pool-heater .php-hero{height:962px;min-height:0;}
.evo-tpl-page-pool-heater .php-hero .bg{inset:auto;left:0;right:0;top:0;height:747px;}
.evo-tpl-page-pool-heater .php-hero .lip{top:684px;bottom:auto;height:278px;}
.evo-tpl-page-pool-heater .php-hero .container{position:static;padding:0;max-width:none;}
/* 704:9 Book 20, auto leading. Figma's box is 201,397 348x25 and the line is
   centred in it (the export carries justify-center on a centre of 409.5), so
   the box is built at Figma's height with the line centred inside it. The
   width is the glyph advance and is left to the font. */
.evo-tpl-page-pool-heater .php-hero .eyebrow{position:absolute;left:201px;top:397px;height:25px;display:flex;flex-direction:column;justify-content:center;z-index:2;margin:0;font-weight:400;font-size:20px;line-height:normal;letter-spacing:normal;}
/* 704:8 Bold 75/89, tracking -1.5, box centred on y473.5 */
.evo-tpl-page-pool-heater .php-hero h1{position:absolute;left:195px;top:429px;z-index:2;margin:0;font-weight:700;font-size:75px;line-height:89px;letter-spacing:-1.5px;white-space:nowrap;}
/* 704:21 the contact card straddles the hero edge: 570 to 1276 */
.evo-tpl-page-pool-heater .php-hero .php-contact{top:570px;}

/* ---- CONTACT CARD 704:20, the form inside it ------------------------
   The shared component in site.css gives the card its box, its border and
   the type of a field, but nothing about the layout INSIDE it, so the
   fields shrink to their content, the two column rows stack, the phone
   line inherits the hero's white and the button lands 96px high. Figma
   places every layer by hand, so they are placed here the same way,
   against the card's own 1114,570 origin:

     word 704:26      1247,622   (the wordmark 704:27 sits 13px higher)
     wordmark 704:27  1401,609   196x59
     phone 704:25     1300,666   230x50   Bold 40/50 -1.2 #27272d
     first name       1148,745   535x62   rows every 78
     last name        1148,823   535x62
     email / phone    1148 / 1422.16, 901    260.84x62 each
     state / postcode 1149 / 1423.16, 979
     method / time    1148 / 1422.16, 1057
     submit 704:22    1148,1156  534x65

   This is scoped to this page. The same card is on the spa and commercial
   category frames, so the fix belongs in the component: raised in
   docs/fleet-issues/pool-category.md.

   Every offset below is the Figma page position minus the card's origin
   (1114,570) minus its own 1px border, which is where an absolutely placed
   child of the card starts. The form's children are h2, .ph, two inputs,
   three .row2 and the button, so the rows are addressed by nth-child: .ph
   is a div too, which makes nth-of-type off by one. */
.evo-tpl-page-pool-heater .php-contact h2{display:block;height:0;margin:0;}
.evo-tpl-page-pool-heater .php-contact h2 .ch{position:absolute;left:132px;top:51px;height:50px;display:flex;flex-direction:column;justify-content:center;font-weight:700;font-size:40px;line-height:50px;letter-spacing:-1.2px;color:#27272d;}
.evo-tpl-page-pool-heater .php-contact h2 img{position:absolute;left:286px;top:38px;width:196px;height:59px;}
.evo-tpl-page-pool-heater .php-contact .ph{position:absolute;left:185px;top:95px;height:50px;display:flex;flex-direction:column;justify-content:center;margin:0;font-family:var(--font-display);font-weight:700;font-size:40px;line-height:50px;letter-spacing:-1.2px;color:#27272d;}
.evo-tpl-page-pool-heater .php-contact .fld2{position:absolute;width:534.999px;padding:0 30.52px;letter-spacing:-0.18px;}
.evo-tpl-page-pool-heater .php-contact>.fld2:nth-of-type(1){left:33px;top:174px;}
.evo-tpl-page-pool-heater .php-contact>.fld2:nth-of-type(2){left:33px;top:252px;}
.evo-tpl-page-pool-heater .php-contact .row2{display:block;}
.evo-tpl-page-pool-heater .php-contact .row2 .fld2{width:260.836px;}
.evo-tpl-page-pool-heater .php-contact .row2:nth-child(5) .fld2:nth-child(1){left:33px;top:330px;}
.evo-tpl-page-pool-heater .php-contact .row2:nth-child(5) .fld2:nth-child(2){left:307.16px;top:330px;}
.evo-tpl-page-pool-heater .php-contact .row2:nth-child(6) .fld2:nth-child(1){left:34px;top:408px;}
.evo-tpl-page-pool-heater .php-contact .row2:nth-child(6) .fld2:nth-child(2){left:308.16px;top:408px;}
.evo-tpl-page-pool-heater .php-contact .row2:nth-child(7) .fld2:nth-child(1){left:33px;top:486px;}
.evo-tpl-page-pool-heater .php-contact .row2:nth-child(7) .fld2:nth-child(2){left:307.16px;top:486px;}
/* the chevrons 704:47 / 704:51 / 704:56 / 704:60 are the Figma vector, hand
   placed on each select rather than evenly inset, and the native arrow is
   removed so only the design's own mark shows */
.evo-tpl-page-pool-heater .php-contact select.fld2{appearance:none;-webkit-appearance:none;background-image:url("/wp-content/themes/evoheat/assets/img/figma/pool-category/field-chevron.svg");background-repeat:no-repeat;background-size:9.65146px 5.26476px;}
.evo-tpl-page-pool-heater .php-contact .row2:nth-child(6) .fld2:nth-child(1){background-position:right 18.08px top 30.07px;}
.evo-tpl-page-pool-heater .php-contact .row2:nth-child(6) .fld2:nth-child(2){background-position:right 22.59px top 32.07px;}
.evo-tpl-page-pool-heater .php-contact .row2:nth-child(7) .fld2:nth-child(1){background-position:right 18.08px top 30.07px;}
.evo-tpl-page-pool-heater .php-contact .row2:nth-child(7) .fld2:nth-child(2){background-position:right 20.69px top 32.07px;}
.evo-tpl-page-pool-heater .php-contact .sbtn{position:absolute;left:33px;top:585px;width:534px;height:65px;}

/* ---- INTRO 704:17 ---------------------------------------------------
   The awards badge, heading and body are page-level layers in Figma that
   start at y782, inside the hero's last 180px, so the section is pulled
   up by 180 and ends where the product band starts (1368). */
.evo-tpl-page-pool-heater .php-intro{height:586px;margin-top:-180px;padding:0;}
.evo-tpl-page-pool-heater .php-intro>.container{max-width:none;padding:0;}
.evo-tpl-page-pool-heater .php-intro .wrap{max-width:none;}
/* 704:61 awards 308x179 at y782 */
.evo-tpl-page-pool-heater .php-intro .badges{position:absolute;left:195px;top:0;width:308px;height:179px;}
.evo-tpl-page-pool-heater .php-intro .badges img{width:308px;height:179px;margin:0;}
/* 704:19 Bold 50/50, tracking -1.5, 807 wide box 113 tall, text centred in it */
.evo-tpl-page-pool-heater .php-intro h2{position:absolute;left:195px;top:198px;width:807px;height:113px;margin:0;display:flex;flex-direction:column;justify-content:center;font-weight:700;font-size:50px;line-height:50px;letter-spacing:-1.5px;color:#27272d;}
/* 704:18 Light 20/26, 736 wide */
.evo-tpl-page-pool-heater .php-intro p{position:absolute;left:195px;top:335px;width:736px;max-width:none;margin:0;font-weight:300;font-size:20px;line-height:26px;letter-spacing:normal;color:#27272d;}

/* ---- PRODUCT RANGE 704:62 -------------------------------------------
   Band 704:63 is #f4f4f4 from 1368; it is 1080 tall in Figma but the cta
   image band is drawn over its last 54px, so the section is 1026 and the
   two abut. Heading 704:91 Bold 50/58 tracking -1 at y1491, card row at
   y1613. The cards themselves are the shared product-card component. */
.evo-tpl-page-pool-heater .php-range{padding:123px 0 136px;}
/* 704:91 is a 614 wide box at x653, not a full width centred line: 614 centred
   in the 1520 container puts it on Figma's x exactly. */
.evo-tpl-page-pool-heater .php-range h2{width:614px;max-width:100%;margin:0 auto 64px;text-align:center;font-weight:700;font-size:50px;line-height:58px;letter-spacing:-1px;color:#27272d;}

/* ---- EVALUATION CTA 704:92 (shared component, page rhythm + band art)
   Content block at y2552 (padding 158), band 767 tall. 704:94 lays a
   50% gradient over the photo's top 684 and 704:104 lays the white
   rounded lip from 3054; both are band art, not component internals. */
.evo-tpl-page-pool-heater main>section.ctaform .cf-inner{padding:158px 0 242px;}
/* 704:93 "Image" is a 1920x767 node and the band box is 1920x767, so the
   export drops in at 1:1. The live upload the component ships is 1920x788 and
   object-fit:cover was cropping it, which put the pool edge 21px below the
   design. The component also lays a flat rgba(0,0,0,.2) over the photo: this
   frame has no such layer (an export of 704:93 IS the frame below the
   gradient), so it is cleared for this page only, in this file, and raised for
   the component in docs/fleet-issues/pool-category.md. */
.evo-tpl-page-pool-heater section.ctaform .cfbg>img{object-fit:fill;}
.evo-tpl-page-pool-heater section.ctaform .cfbg .ov{background:transparent;}
/* This frame draws the whole cta row 18px left of the home frame's: card
   704:95 at x197 (home 215), copy 704:101 at x700 (home 718), badge 704:102 at
   x1423 (home 1441). The row is a flex line, so pulling the first child 18px
   left carries the copy and the badge with it and no shared rule is touched. */
.evo-tpl-page-pool-heater section.ctaform .cfcard{margin-left:-3px;}
.evo-tpl-page-pool-heater section.ctaform .cfbg::before{content:"";position:absolute;left:0;right:0;top:0;height:684px;background:linear-gradient(to bottom,rgba(0,0,0,.8) 0%,rgba(0,0,0,0) 50%);opacity:.5;z-index:1;pointer-events:none;}
.evo-tpl-page-pool-heater section.ctaform .cfbg::after{content:"";position:absolute;left:0;right:0;top:660px;height:329px;background:#fff;border-radius:28px;z-index:3;pointer-events:none;}

/* ---- REVIEWS 704:105 (shared component, page rhythm only)
   Heading 704:162 sits on the section's own top edge (3161), badge
   704:163 at 3246, the review columns at 3422. */
.evo-tpl-page-pool-heater main>section.reviews{padding:0 0 147px;}
/* Neither the heading nor the badge is centred on the artboard on this frame:
   704:162 is a 610 box at x664 and 704:163 a 349 badge at x795, both centred
   on 969 rather than 960. Reproduced as drawn. The four review columns are
   not evenly spaced either: 704:106 / 704:120 / 704:134 / 704:148 sit at 173,
   583, 988 and 1403, so the gaps are 410, 405 and 415. The shared grid
   distributes them evenly, which lands the third column 4px right; it is
   nudged back without changing its 346 wide box. */
.evo-tpl-page-pool-heater .rev-row .rcell:nth-child(3){position:relative;left:-4px;}
.evo-tpl-page-pool-heater section.reviews .rh{width:610px;max-width:100%;margin:0 0 22px 464px;}
.evo-tpl-page-pool-heater section.reviews .rlogo{margin:0 auto 107px 595px;}

/* ---- INDUSTRY LEADERS 704:164 ---------------------------------------
   Navy 704:165 3754 h733 radius 28 on white. Heading 704:167 Bold 48
   auto-leading tracking -0.96 in a 1035 box centred on 967.5-7 = 960.5;
   awards row 704:171 1348x179 at 4018; body 704:166 Light 28/39
   tracking -0.56 in a 1197 box centred on 967.5. */
.evo-tpl-page-pool-heater .php-leaders{position:relative;height:733px;padding:0;background:#002b54;border-radius:28px;text-align:left;}
.evo-tpl-page-pool-heater .php-leaders>.container{max-width:none;padding:0;}
.evo-tpl-page-pool-heater .php-leaders h2{position:absolute;left:443px;top:99px;width:1035px;height:108px;margin:0;text-align:center;font-weight:700;font-size:48px;line-height:normal;letter-spacing:-0.96px;color:#fff;}
.evo-tpl-page-pool-heater .php-leaders .badges2{position:absolute;left:266px;top:264px;width:1348px;height:179px;margin:0;padding:0;background:none;border-radius:0;min-height:0;display:block;color:inherit;font-size:inherit;}
.evo-tpl-page-pool-heater .php-leaders .badges2 img{width:1348px;height:179px;max-width:none;max-height:none;object-fit:cover;margin:0;}
.evo-tpl-page-pool-heater .php-leaders p{position:absolute;left:369px;top:468px;width:1197px;height:160px;margin:0;max-width:none;text-align:center;font-weight:300;font-size:28px;line-height:39px;letter-spacing:-0.56px;color:#fff;}

/* ---- BROWSE BY SOLUTIONS 704:172 ------------------------------------
   Heading 704:203 Bold 50/67 tracking -1 at 4612. Three 481x629 cards
   radius 40 at 4733, left 199 / 718 / 1239 - Figma's gaps are 38 then
   40, not a grid, so each card is placed on its own x. Card art, in
   Figma's own order: a 0.2 black rectangle (cards 2 and 3 only, fully
   covered by the photo above it), the card photo, and on card 1 a second
   491-tall photo, then the product render and the caption. */
.evo-tpl-page-pool-heater .php-sol{position:relative;height:1045px;padding:0;}
.evo-tpl-page-pool-heater .php-sol>.container{max-width:none;padding:0;}
/* 704:203 is a 451 wide box at x734, centred on 959.5 */
.evo-tpl-page-pool-heater .php-sol h2{position:absolute;left:734px;right:auto;top:125px;width:451px;margin:0;text-align:center;font-weight:700;font-size:50px;line-height:67px;letter-spacing:-1px;color:#27272d;}
.evo-tpl-page-pool-heater .php-sol .row{display:block;gap:0;}
.evo-tpl-page-pool-heater .php-sol .php-scard{position:absolute;top:246px;width:481px;height:629px;aspect-ratio:auto;border-radius:40px;overflow:hidden;background:none;}
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(1){left:199px;}
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(2){left:718px;}
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(3){left:1239px;}
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(2)::before,
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(3)::before{content:"";position:absolute;inset:0;border-radius:40px;background:rgba(0,0,0,.2);z-index:0;}
.evo-tpl-page-pool-heater .php-sol .php-scard .sol-bg{position:absolute;inset:auto;left:0;top:0;width:481px;height:629px;border-radius:40px;object-fit:cover;z-index:1;}
.evo-tpl-page-pool-heater .php-sol .php-scard .sol-photo{position:absolute;left:0;top:0;width:480px;height:491px;border-radius:40px;object-fit:cover;z-index:2;}
.evo-tpl-page-pool-heater .php-sol .php-scard .sol-unit{position:absolute;z-index:3;object-fit:contain;}
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(1) .sol-unit{left:109px;top:280px;width:272px;height:198px;}
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(2) .sol-unit{left:111px;top:290px;width:257px;height:199px;}
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(3) .sol-unit{left:158px;top:266px;width:155px;height:225px;}
/* captions 704:177 / 704:183 / 704:195 Medium 36 tracking -1.44. Figma's
   boxes are 46 tall at 5241 and 5243 with the line centred in them (centres
   5264 / 5266); card 3's is a 330 box, 50 tall, with 50 leading. Each is
   built at Figma's own height so the box and the line both land as drawn. */
.evo-tpl-page-pool-heater .php-sol .php-scard .cap{position:absolute;bottom:auto;height:46px;display:flex;flex-direction:column;justify-content:center;background:none;padding:0;margin:0;font-weight:500;font-size:36px;line-height:normal;letter-spacing:-1.44px;color:#fff;}
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(1) .cap{left:67px;top:508px;}
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(2) .cap{left:57px;top:510px;}
.evo-tpl-page-pool-heater .php-sol .row .php-scard:nth-child(3) .cap{left:81px;top:508px;width:330px;height:50px;line-height:50px;}

/* ---- TESTIMONIAL BAND 1  704:210 ------------------------------------
   Figma's panel is #f4f4f4 728 tall at x5 (a 5px offset that leaves a
   white strip down the left edge, reproduced as drawn); the navy band is
   drawn over its last 44, so the section is 684 and the grey continues
   into the navy section's own background. Quote 704:214 is lorem ipsum
   in Figma: the build's real review keeps the Figma box, first line on
   Figma's first line. */
.evo-tpl-page-pool-heater .php-alt{height:684px;padding:0;background:#fff;}
/* The panel is the container itself rather than a pseudo-element so the gate
   can measure it: 704:211 is 1920 wide from x5, which leaves the 5px white
   strip Figma draws down the left edge and runs 5px past the artboard, where
   the frame clips it. */
.evo-tpl-page-pool-heater .php-alt>.container{max-width:none;padding:0;position:static;margin-left:5px;width:1920px;height:684px;background:#f4f4f4;border-radius:28px 28px 0 0;}
.evo-tpl-page-pool-heater .php-alt .grid{display:block;gap:0;}
.evo-tpl-page-pool-heater .php-alt .pimg2{position:absolute;left:271px;top:79px;width:615px;height:506px;}
.evo-tpl-page-pool-heater .php-alt .pimg2 img{width:615px;height:506px;max-width:none;max-height:none;object-fit:cover;}
.evo-tpl-page-pool-heater .php-alt .stars{position:absolute;left:970px;top:207.89px;margin:0;}
.evo-tpl-page-pool-heater .php-alt blockquote{position:absolute;left:970px;top:271px;width:671px;margin:0;font-weight:300;font-size:26px;line-height:34px;letter-spacing:normal;color:#27272d;}
/* 704:215 is a 69x23 box at 970,5971 with the name centred in it both ways
   (the export centres on 1004.5 / 5982.5), so the box is built at Figma's
   size rather than hugging the glyphs. */
.evo-tpl-page-pool-heater .php-alt .who{position:absolute;left:970px;top:439px;width:69px;height:23px;display:flex;flex-direction:column;justify-content:center;text-align:center;margin:0;}

/* ---- NAVY BAND 704:244 ----------------------------------------------
   704:245 navy 6216 h664 radius 28. The section's own background is
   #f4f4f4 because in Figma the grey testimonial panels run behind the
   navy panel's rounded corners at both ends. Heading 704:247 Bold 48
   auto tracking -0.96 at x220 y6387; 704:246 is ONE text node: Light
   28/39, an empty 28/39 line, then Light 20/30, all tracking -0.56, so
   the second paragraph carries a 39px top margin. Chart 704:251
   606x410 at 1094,6363. */
.evo-tpl-page-pool-heater .php-navy{height:664px;padding:0;background:#f4f4f4;}
/* 704:245 as a real element rather than a pseudo, so the gate measures it */
.evo-tpl-page-pool-heater .php-navy>.container{max-width:none;padding:0;position:static;width:1920px;height:664px;background:#002b54;border-radius:28px;}
.evo-tpl-page-pool-heater .php-navy .grid{display:block;gap:0;}
/* 704:247 is a 675x61 box at 220,6387 with the line centred in it */
.evo-tpl-page-pool-heater .php-navy h2{position:absolute;left:220px;top:171px;height:61px;display:flex;flex-direction:column;justify-content:center;margin:0;font-weight:700;font-size:48px;line-height:normal;letter-spacing:-0.96px;color:#fff;white-space:nowrap;}
.evo-tpl-page-pool-heater .php-navy .copy{position:absolute;left:220px;top:272px;width:771px;}
.evo-tpl-page-pool-heater .php-navy .copy .sub{font-weight:300;font-size:28px;line-height:39px;letter-spacing:-0.56px;color:#fff;margin:0;}
.evo-tpl-page-pool-heater .php-navy .copy .body{font-weight:300;font-size:20px;line-height:30px;letter-spacing:-0.56px;color:#fff;margin:39px 0 0;}
.evo-tpl-page-pool-heater .php-navy .chart{position:absolute;left:1094px;top:147px;width:606px;height:410px;}
.evo-tpl-page-pool-heater .php-navy .chart img{width:606px;height:410px;max-width:none;max-height:none;object-fit:cover;}

/* ---- TESTIMONIAL BAND 2  704:227 ------------------------------------
   Panel 6849 h728 radius 28, its first 31px covered by the navy band, so
   the section runs 6880 to 7577 and only its bottom corners round. */
.evo-tpl-page-pool-heater .php-alt.white{height:697px;background:#fff;padding:0;}
.evo-tpl-page-pool-heater .php-alt.white>.container{margin-left:0;width:1920px;height:697px;background:#f4f4f4;border-radius:0 0 28px 28px;}
.evo-tpl-page-pool-heater .php-alt.white .pimg2{left:1063px;top:105px;width:608px;height:479px;}
.evo-tpl-page-pool-heater .php-alt.white .pimg2 img{width:608px;height:479px;}
.evo-tpl-page-pool-heater .php-alt.white .stars{left:273px;top:201px;}
.evo-tpl-page-pool-heater .php-alt.white blockquote{left:273px;top:273px;width:643px;}
/* 704:232 is a 61x23 box at 277,7321: 4px right of the stars and the quote
   above it, which start at 273. Reproduced as drawn. */
.evo-tpl-page-pool-heater .php-alt.white .who{left:277px;top:441px;width:61px;}

/* ---- LOGOS 704:252 (shared component, page rhythm only)
   Heading 704:253 at 7697, pills at 7783, FAQ begins at 8068. */
.evo-tpl-page-pool-heater main>section.logos{padding:120px 0 190px;}
/* 704:253 is a 367x33 box at x784, centred on 967.5 rather than on the
   artboard, and the pills sit 53px under it (7697 + 33 + 53 = 7783). */
.evo-tpl-page-pool-heater section.logos .lh{width:367px;max-width:100%;height:33px;display:flex;flex-direction:column;justify-content:center;margin:0 0 53px 784px;}

/* ---- FAQ 704:267 (shared component, box heights only)
   The left column's two Figma boxes are 98 and 91 tall (the heading's
   two 55px lines are centred in a box shorter than they are, as drawn);
   with the component's own 23 and 14 margins that puts the More FAQs
   button on Figma's y8294 exactly. Row 1 is open: its answer box 704:273
   is 126 tall starting 20px above the summary's bottom edge, and the row
   ends on Figma's divider at 8281. */
.evo-tpl-page-pool-heater main>section.php-faq{padding:0 0 111px;}
.evo-tpl-page-pool-heater .php-faq h2{height:98px;display:flex;flex-direction:column;justify-content:center;margin:0 0 23px;}
.evo-tpl-page-pool-heater .php-faq .lead2{height:91px;margin:0 0 14px;}
.evo-tpl-page-pool-heater .php-faq details:first-of-type .fb{height:164px;margin-top:-20px;padding:0 0 38px;}
/* Figma draws the row dividers 704:276 / 704:281 / 704:286 at 8280, 8377 and
   8467, i.e. 212 below the open row's top and 75 below a closed row's, not on
   the row's own bottom edge, and the fourth line is hidden. The shared
   component hangs them off the details border, which lands them 21 and 14
   lower. The border keeps its 1px so the row pitch is unchanged (rows stay on
   Figma's 8068 / 8302 / 8392 / 8482) and the visible line is redrawn at the
   Figma offset. Raised for the component in docs/fleet-issues/pool-category.md. */
.evo-tpl-page-pool-heater .php-faq details{position:relative;border-bottom-color:transparent;}
.evo-tpl-page-pool-heater .php-faq details::after{content:"";position:absolute;left:2px;width:741px;height:1px;background:var(--line);}
.evo-tpl-page-pool-heater .php-faq details:nth-of-type(1)::after{top:212px;}
.evo-tpl-page-pool-heater .php-faq details:nth-of-type(2)::after{top:75px;left:0;}
.evo-tpl-page-pool-heater .php-faq details:nth-of-type(3)::after{top:75px;}
.evo-tpl-page-pool-heater .php-faq details:nth-of-type(4)::after{display:none;}

/* ---- SIZING GUARANTEE 704:294 ---------------------------------------
   704:295 navy 8682 h1416 radius 28. In the frame export the navy runs to
   9847, where the footer's own rounded band starts, so the footer covers its
   last 251 and the section in flow is 1165, not the 1070 an earlier pass
   used. Only its top corners round, and the 251 behind the footer is painted
   by a flat offset shadow so Figma's navy shows through the footer's two top
   corners instead of the page white. Badge
   704:302 241x237 at 235,8808. Heading 704:300 Bold 50 auto tracking -1
   in a 645 box at 519,8820. Lead 704:301 Light 28/39 tracking -0.56,
   1122 wide, 116 tall at 519,8898. 704:296 is ONE text node at 235,9082,
   762 wide: Bold #2ca9e3 20/31 headings, Light white 20/31 paragraphs,
   an empty 20/31 line between groups. 704:298 is Figma's grey placeholder
   ellipse 585x579 at 1075,9105 - the build's real report photo is kept
   inside it. 704:306 is a second Figma placeholder, a 147x176 #d9d9d9
   box at 66% over the navy, kept as drawn. Button 704:304 276x70 radius
   60 at 421,9607, an x that lines up with nothing else on the frame. */
.evo-tpl-page-pool-heater .php-guarantee{height:1165px;padding:0;border-radius:28px 28px 0 0;box-shadow:0 251px 0 0 #002b54;}
.evo-tpl-page-pool-heater .php-guarantee>.container{max-width:none;padding:0;}
.evo-tpl-page-pool-heater .php-guarantee .head{display:block;margin:0;gap:0;text-align:left;}
.evo-tpl-page-pool-heater .php-guarantee .head img{position:absolute;left:235px;top:126px;width:241px;height:237px;max-width:none;object-fit:cover;}
/* 704:300 is a 645x63 box at 519,8820 with the line centred in it */
.evo-tpl-page-pool-heater .php-guarantee h2{position:absolute;left:519px;top:138px;width:645px;height:63px;display:flex;flex-direction:column;justify-content:center;margin:0;font-weight:700;font-size:50px;line-height:normal;letter-spacing:-1px;color:#fff;}
.evo-tpl-page-pool-heater .php-guarantee .head p{position:absolute;left:519px;top:216px;width:1122px;height:116px;max-width:none;margin:0;font-weight:300;font-size:28px;line-height:39px;letter-spacing:-0.56px;color:#fff;}
.evo-tpl-page-pool-heater .php-guarantee .grid{display:block;gap:0;}
.evo-tpl-page-pool-heater .php-guarantee .copy{position:absolute;left:235px;top:400px;width:762px;}
.evo-tpl-page-pool-heater .php-guarantee .ph-box{display:block;position:absolute;left:235px;top:872px;width:147px;height:176px;border-radius:20px;background:#d9d9d9;opacity:.66;}
.evo-tpl-page-pool-heater .php-guarantee .qbtn2{position:absolute;left:421px;top:925px;width:276px;height:70px;margin:0;line-height:normal;}
.evo-tpl-page-pool-heater .php-guarantee .media{position:absolute;left:1075px;top:423px;width:585px;height:579px;display:block;}
.evo-tpl-page-pool-heater .php-guarantee .media .circ{width:585px;height:579px;aspect-ratio:auto;border-radius:50%;background:#d9d9d9;overflow:hidden;}

/* =====================================================================
   VERIFY PASS. Everything below was found by measuring the 1920 render
   against the frame export band by band, ink box by ink box, and is a
   place where the box was on Figma's number but what you SEE was not.
   Each value is the offset that puts the drawn thing where 704:3 draws
   it, measured off the export and cross-checked against the layer.
   ===================================================================== */

/* ---- 1. Where the glyphs sit inside a Figma-sized line box ----------
   Figma centres a line in its box using the font's own cap metrics;
   Chromium splits the leading evenly, which sets Circular Std 2 to 4px
   high in the same box. The BOXES below stay exactly where the design
   puts them (and where the spec asserts them); the padding moves only
   the line inside the box, by the amount measured off the export. A
   flex centred box splits its padding, so it gets twice the shift. */
.evo-tpl-page-pool-heater .php-hero h1{height:89px;padding-top:4px;}          /* 704:8  ink 443 -> 447 */
.evo-tpl-page-pool-heater .php-hero .eyebrow{padding-top:4px;}                 /* 704:9  centred, +2 */
.evo-tpl-page-pool-heater .php-range h2{height:58px;padding-top:2px;}          /* 704:91 ink 1499 -> 1501 */
.evo-tpl-page-pool-heater section.reviews .rh{height:63px;padding-top:4px;}    /* 704:162 ink 3170 -> 3174 */
.evo-tpl-page-pool-heater .php-faq h2{padding-top:8px;}                        /* 704:269 centred, +4 */
.evo-tpl-page-pool-heater .php-guarantee h2{padding-top:6px;}                  /* 704:300 centred, +3 */

/* ---- 2. Auto leading: Figma's is 1.28em, the browser's is 1.21em ----
   Three nodes on this frame are set to Figma's "auto" leading. Chromium
   resolves `normal` for the shipped Circular Std to 1.21em, so every
   line after the first landed 4 to 5px high. The px values below are
   Figma's own auto leading measured off the frame export (48px -> 62
   and 61, 20px -> 25.4), which is the only way to land line two where
   the design draws it. */
/* 704:167, two lines, ink 3865 then 3927 */
.evo-tpl-page-pool-heater .php-leaders h2{line-height:62px;padding-top:1px;}
/* 704:101, two lines centred in a 114 box, ink 2603 then 2664 */
.evo-tpl-page-pool-heater section.ctaform .cfhead{height:114px;line-height:61px;display:flex;flex-direction:column;justify-content:center;padding-top:6px;}
/* 704:97, three lines centred in an 84 box, ink 2729 / 2754 / 2779 */
.evo-tpl-page-pool-heater section.ctaform .cfbody{height:84px;line-height:25.4px;padding-top:2px;}
/* 704:100 sits on 2870.5, the component centres it in the 70px pill */
.evo-tpl-page-pool-heater section.ctaform .cfbtn{padding-top:6px;}

/* ---- 3. FAQ rows 704:271 / 277 / 282 / 287 -------------------------
   The component centres the 56px question line and the 58px toggle in
   the 89px row; Figma hangs both off the row's TOP edge (the question's
   line box IS the top 56px of the row, and the toggle sits on the row
   top except on the open row, where it is 11px down). That put every
   question 16px low and every closed row's toggle 15px low. The row
   keeps its 89px height and its x, so the row pitch and the component
   spec are untouched. Figma also draws each question at its own x
   (977 / 979 / 981 / 980) and rows 2 and 4 pull the toggle 2px and 1px
   in; reproduced as drawn. */
.evo-tpl-page-pool-heater .php-faq summary{align-items:flex-start;}
.evo-tpl-page-pool-heater .php-faq summary::after{top:0;transform:none;}
.evo-tpl-page-pool-heater .php-faq details:nth-of-type(1) summary::after{top:11px;}
.evo-tpl-page-pool-heater .php-faq details:nth-of-type(2) summary{padding-left:2px;}
.evo-tpl-page-pool-heater .php-faq details:nth-of-type(2) summary::after{right:2px;}
.evo-tpl-page-pool-heater .php-faq details:nth-of-type(3) summary{padding-left:4px;}
.evo-tpl-page-pool-heater .php-faq details:nth-of-type(4) summary{padding-left:3px;}
.evo-tpl-page-pool-heater .php-faq details:nth-of-type(4) summary::after{right:1px;}

/* ---- 4. Product card name and sub 704:68/69, 74/75, 81/82 ----------
   The component centres both lines in the 480 card. Figma hand-places
   every one of them, none on the card's centre: name x352 / 879 / 1371
   and sub x364 / 878 / 1365, which is up to 17px from where a centred
   line lands. The box is made to hug the line so the gate can assert
   the x the design draws. */
.evo-tpl-page-pool-heater .php-range .php-pcard h3,
.evo-tpl-page-pool-heater .php-range .php-pcard .psub{width:max-content;max-width:100%;text-align:left;}
.evo-tpl-page-pool-heater .php-range .row .php-pcard:nth-child(1) h3{margin-left:152px;}
.evo-tpl-page-pool-heater .php-range .row .php-pcard:nth-child(1) .psub{margin-left:164px;}
.evo-tpl-page-pool-heater .php-range .row .php-pcard:nth-child(2) h3{margin-left:159px;}
.evo-tpl-page-pool-heater .php-range .row .php-pcard:nth-child(2) .psub{margin-left:158px;}
.evo-tpl-page-pool-heater .php-range .row .php-pcard:nth-child(3) h3{margin-left:131px;}
.evo-tpl-page-pool-heater .php-range .row .php-pcard:nth-child(3) .psub{margin-left:125px;}

/* ---- 5. Review cells 704:106 / 120 / 134 / 148 ---------------------
   Figma puts the name box on the cell top (3422), the five 22.262px
   stars on 3449 and the body's first line on 3494 in every one of the
   four columns. The component's margins (16 and 20) put the stars 11px
   and the body 8px low in all four. Cell two's name 704:122 is also
   drawn 5px right of the column, unlike the other three. */
.evo-tpl-page-pool-heater .rev-row .rcell .rname{margin-bottom:5px;}
.evo-tpl-page-pool-heater .rev-row .rcell .rstars{margin-bottom:23px;}
.evo-tpl-page-pool-heater .rev-row .rcell:nth-child(2) .rname{padding-left:5px;}
/* VERIFY PASS: 704:108 is drawn on x174, a pixel right of its own cell
   (704:106 is on 173) where the other three names sit on their cell. The
   component starts it on the cell, which left it 2px left of the design;
   the other three are already on Figma's x to within a pixel. */
.evo-tpl-page-pool-heater .rev-row .rcell:nth-child(1) .rname{margin-left:2px;}

/* ---- 6. Logo strip 704:254 -----------------------------------------
   Nothing here animates: the six pills are static and each one holds a
   named logo. Figma's order is mantra, University of Queensland,
   Radisson, Marriott, Fitness First, City of Gold Coast, and the six
   per-pill image boxes in site.css are already Figma's (132x48, 183x52,
   188.571x44, 140x57, 202x40, 173x43). The template was feeding them
   in the wrong order, so every logo but Fitness First sat in the wrong
   pill; the template now feeds Figma's order. Figma also draws the last
   logo 704:266 at x1847 inside a pill that starts at 1770, i.e. hard
   left of a 77px inset and running past the pill's end, not centred.
   The section clips at the artboard, as the frame does: without it the
   pill Figma draws bleeding off the right edge gives the page an 86px
   horizontal scroll at 1920. */
.evo-tpl-page-pool-heater main>section.logos{overflow:hidden;}
/* every logo's baseline is 25px up from the pill's outer bottom edge (7853);
   the component measures that inset from inside its own 2px border, which
   left all six sitting 2px high. 75 + the border puts the last logo on
   Figma's x1847. */
.evo-tpl-page-pool-heater .logo-row .lpill{padding-bottom:23px;}
.evo-tpl-page-pool-heater .logo-row .lpill:nth-child(6){justify-content:flex-start;padding-left:75px;}

/* ---- 7. Testimonial panel 704:211 ----------------------------------
   The panel is 1920 wide from x5, so its last 5px fall outside the
   artboard, where the frame clips them. Clipped here too, so the page
   does not scroll sideways at 1920 for 5px of grey. */
.evo-tpl-page-pool-heater .php-alt{overflow:hidden;}

/* ---- 8. FOOTER LEAD-IN 704:307 -------------------------------------
   Figma draws the footer frame at y9752 h1236 with its photo 704:309
   inset 95px inside it (9847, h1141) and its content 110px below that
   photo: eyebrow 704:362 on 9957, headline 704:363 on 9993, sub 704:364
   on 10241, phone 704:365 on 10310, form 704:342 on 9974 with its rows
   on 10069 / 10164 / 10251 and Submit on 10439, link columns 704:312 /
   318 / 323 on 10719, logo 704:341 on 10725, copyright 704:340 on 10819
   and the social row 704:328 on 10841.99.

   site.css measures the component's 205px lead-in from the footer
   ELEMENT's top. On the home frame that element top IS the frame top
   (7102), so the home page lands on Figma. Here the band above ends
   where the photo starts, so the element top is the photo top and every
   layer inside the footer shipped exactly 95px low, with the photo
   stretched over 1236 instead of the 1141 Figma draws. 110 puts all
   fourteen of them on Figma's y, gives the photo its own height back and
   ends the page on Figma's 10988. Page scoped: neither the partial nor
   site.css is touched. The component fix the integrator needs is in
   docs/fleet-issues/pool-category.md item 1c. */
.evo-tpl-page-pool-heater .ft-top{padding-top:110px;}
/* The four layers of the footer's left column are not flush with each other
   in Figma: 704:362 and 704:364 start on x206, 704:363 and 704:365 on x203.
   The component starts all four on the column's own x200. Put each one on
   the x the design draws it at. */
.evo-tpl-page-pool-heater .ft-intro .ftgit{margin-left:6px;}
.evo-tpl-page-pool-heater .ft-intro .fthead{margin-left:3px;width:689px;max-width:none;}
.evo-tpl-page-pool-heater .ft-intro .ftsub{margin-left:6px;}
.evo-tpl-page-pool-heater .ft-intro .ftphone{margin-left:3px;}

/* ---- 9. Logo 3 inside its pill 704:262 ------------------------------
   Figma draws Radisson at x727 in a pill that runs 648..997; centred in
   that pill a 188.571 wide logo lands on 728.219. Nudged back onto
   Figma's x. The other five are centred to within half a pixel of the
   design, and pill six is already hand placed above. */
.evo-tpl-page-pool-heater .logo-row .lpill:nth-child(3) img{position:relative;left:-1.219px;}

/* ---- 10. Where the glyph sits inside two Figma boxes -----------------
   Both boxes already measure exactly as Figma draws them, but Figma and
   Chromium do not put the same half-leading above the first baseline of
   Circular Std, so the ink inside them sat high: 704:203 by 4px (its ink
   starts on 4627 in the frame, 4623 in the render) and 704:19 by 3px
   (993 against 990). Padding moves the ink onto Figma's rows with the
   box unchanged, because border-box keeps the asserted height. */
.evo-tpl-page-pool-heater .php-sol h2{box-sizing:border-box;height:67px;padding-top:4px;}
.evo-tpl-page-pool-heater .php-intro h2{box-sizing:border-box;padding-top:6px;}
/* 704:296 is the same story over twelve lines: Figma draws the first line
   of the block's 31px leading on 9090, Chromium on 9088, and the 2px runs
   all the way down the block. The 762x435 box stays on Figma's 235,9082. */
.evo-tpl-page-pool-heater .php-guarantee .copy{box-sizing:border-box;height:435px;padding-top:2px;}

}
