/* Pool design detail template: Classic. */
.pool-design-page .site-header{background:#062b48}
.pool-design-page .site-header.is-scrolled{background:#062b48}
.pool-design-page [id]{scroll-margin-top:100px}
.design-hero{position:relative;min-height:660px;color:#fff;background:#062b48;overflow:hidden}
.design-hero-image,.design-hero-shade{position:absolute;inset:0;width:100%;height:100%}
.design-hero-image{object-fit:cover;object-position:center 57%}
.design-hero-shade{background:linear-gradient(90deg,rgba(3,34,57,.7),rgba(3,34,57,.18) 62%,rgba(3,34,57,.08)),linear-gradient(0deg,rgba(2,25,42,.68),transparent 55%)}
.design-hero-inner{position:relative;z-index:1;min-height:660px;display:flex;flex-direction:column;padding-top:125px;padding-bottom:28px}
.breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:.76rem;font-weight:700;color:#e2f2f8}
.breadcrumbs a:hover{color:#8ee7fa}
.breadcrumbs span[aria-current]{color:#fff}
.design-hero-copy{margin-top:auto;max-width:675px;padding:35px 0 45px}
.design-hero-copy .eyebrow{margin-bottom:13px}
.design-hero h1{font-size:clamp(3.6rem,6.3vw,6.4rem);line-height:1.02;font-weight:800;letter-spacing:-.065em;margin:0 0 19px}
.design-hero-copy>p:not(.eyebrow){font-size:clamp(1.1rem,1.8vw,1.42rem);line-height:1.45;font-weight:600;max-width:540px;color:#f3fbff;margin-bottom:28px}
.design-hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:17px 24px}
.design-hero-actions .btn{background:var(--aqua);border-color:var(--aqua);color:#fff;gap:20px}
.design-hero-actions .btn:hover{background:#0ba9df;border-color:#0ba9df}
.design-hero-link{font:800 .76rem/1.4 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.07em;border-bottom:1px solid #e3f9ff;padding-bottom:6px}
.design-hero-link:hover{color:#8ee7fa}
.design-jump{background:#083854;color:#e9f7fc}
.design-jump .shell{display:flex;align-items:center;gap:clamp(15px,3vw,42px);min-height:62px;overflow-x:auto;scrollbar-width:none}
.design-jump .shell::-webkit-scrollbar{display:none}
.design-jump a{white-space:nowrap;font:800 .72rem/1.4 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.065em;padding:20px 0;border-bottom:2px solid transparent}
.design-jump a:hover,.design-jump a:focus-visible{color:#8deaff;border-bottom-color:#5bd8f5}
.design-jump a:last-child{margin-left:auto;color:#9fe8fb}

.design-overview{display:grid;grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr);align-items:start;gap:clamp(40px,6vw,86px)}
.design-story{padding-top:16px;max-width:470px}
.design-story h2{font-size:clamp(2.4rem,3.5vw,3.6rem);line-height:1.08}
.design-story p:not(.eyebrow){color:#476274;font-size:.96rem;line-height:1.76}
.design-story .design-story-lede{font-size:1.1rem!important;line-height:1.58!important;font-weight:700;color:#133b53!important}
.design-story .text-link{display:inline-block;margin-top:16px}
.spec-panel{background:#e7f5fa;padding:29px 30px 21px;box-shadow:0 17px 36px rgba(5,63,90,.08)}
.spec-panel-header{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}
.spec-panel-header .eyebrow{margin-bottom:8px}
.spec-panel h3{font-size:1.34rem;letter-spacing:-.04em;margin:0}
.spec-pill{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#007ca3;white-space:nowrap}
.size-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.size-tabs.is-single{grid-template-columns:1fr}
.size-tabs button{border:1px solid #c9e5ee;background:#fff;color:#0d506d;padding:12px 4px;font:800 .73rem/1.25 Manrope,Arial,sans-serif;transition:background .2s,color .2s}
.size-tabs button:hover{background:#c8eef9}
.size-tabs button[aria-selected="true"]{background:#062f4e;color:#fff;border-color:#062f4e}
.spec-body{display:grid;grid-template-columns:minmax(180px,.88fr) minmax(0,1.12fr);background:#fff;min-height:393px}
.plan-frame{display:grid;place-items:center;padding:16px;background:#f8fcfd;border-right:1px solid #d8edf4}
.plan-frame img{max-height:359px;width:auto;object-fit:contain}
.spec-details{padding:27px 24px;display:flex;flex-direction:column;justify-content:center}
.spec-overline{font:800 .66rem/1.3 Manrope,Arial,sans-serif;letter-spacing:.13em;text-transform:uppercase;color:#008bb1;margin-bottom:5px}
.selected-size{font:800 1.65rem/1.15 Manrope,Arial,sans-serif;letter-spacing:-.05em;margin:0 0 24px}
.selected-size span[aria-hidden]{color:#40a8c3;padding:0 3px}
.spec-metrics{display:grid;grid-template-columns:1fr 1fr;gap:0 13px;border-top:1px solid #cce4ee;margin-bottom:17px}
.spec-metrics div{border-bottom:1px solid #cce4ee;padding:9px 0;display:flex;flex-direction:column;gap:1px}
.spec-metrics span{font-size:.67rem;text-transform:uppercase;letter-spacing:.07em;color:#657e89;font-weight:800}
.spec-metrics strong{font:800 .95rem Manrope,Arial,sans-serif}
.spec-details>p:last-child{font-size:.76rem;line-height:1.55;color:#56717e;margin:0}
.spec-all-sizes{font-size:.74rem;line-height:1.6;color:#365c70;margin:15px 0 0}
.spec-facts{display:flex;align-items:center;flex-wrap:wrap;gap:10px 24px;border-top:1px solid #cce4ee;padding-top:14px;margin-top:17px;font:700 .68rem/1.4 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.05em}
.spec-facts span{display:inline-flex;align-items:baseline;gap:5px;color:#536f7b}
.spec-facts strong{font-size:.91rem;color:#0b304e}
.spec-note{font-size:.72rem;line-height:1.5;color:#536f7b;margin:13px 0 0}

.design-features{background:#edf8fc;color:#0b304e}
.features-intro{max-width:840px;margin-bottom:31px}
.features-intro h2{max-width:760px}
.features-intro>p:last-child{color:#486879;font-size:.98rem}
.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.feature-grid article{padding:27px 24px 32px;border:1px solid #d5eaf2;background:#fff;min-height:235px}
.feature-number{font:800 .76rem Manrope,Arial,sans-serif;color:#008ab5;letter-spacing:.1em;display:block;margin-bottom:28px}
.feature-grid h3{font-size:1.18rem;color:#0b304e;line-height:1.2}
.feature-grid p{font-size:.85rem;color:#4f6b79;line-height:1.65;margin-bottom:0}

.design-colours{background:#e7f6fb}
.colour-intro{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:30px}
.colour-intro h2{max-width:700px;margin:0}
.colour-intro>p{max-width:345px;color:#4e6c7a;font-size:.9rem;line-height:1.65;margin:0}
.colour-layout{display:grid;grid-template-columns:1.05fr .95fr;background:#fff;box-shadow:0 16px 36px rgba(6,72,102,.08)}
.finish-picker{padding:36px 38px;border-right:1px solid #d6e7ef}
.finish-picker h3{font-size:1.1rem;margin-bottom:20px}
.finish-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.finish-option{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:103px;padding:12px 6px;border:1px solid #d9e9ef;background:#f7fbfd;color:#193f55;font:700 .74rem/1.25 'DM Sans',Arial,sans-serif;transition:border-color .2s,background .2s,transform .2s}
.finish-option:hover{border-color:#0097bc;transform:translateY(-2px)}
.finish-option.is-selected{border:2px solid #0079ad;background:#e9f8fc}
.finish-chip{width:48px;height:48px;border-radius:50%;background:var(--finish);box-shadow:inset 0 0 0 2px rgba(255,255,255,.67),0 2px 8px rgba(0,36,58,.13)}
.colour-note{font-size:.73rem;color:#5b7380;line-height:1.5;margin:20px 0 0}
.finish-preview{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:28px 35px;min-width:0}
.finish-model{width:min(100%,320px);display:grid;place-items:center;margin:0 auto 15px}
.finish-model img{width:100%;max-height:285px;object-fit:contain}
.finish-sample{display:flex;align-items:center;gap:17px;width:min(100%,420px);border-top:1px solid #d9e9f0;padding-top:18px}
.finish-sample img{width:82px;height:72px;object-fit:cover;object-position:top;flex:none;border:1px solid #d2e1e8}
.finish-sample div{display:flex;flex-direction:column}
.finish-sample span{font:800 .65rem Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.1em;color:#587481}
.finish-sample strong{font:800 1.25rem Manrope,Arial,sans-serif;color:#103b57;margin:2px 0}
.finish-sample small{font-size:.72rem;color:#6a808c}

.gallery-heading{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:27px}
.gallery-heading h2{margin-bottom:10px}
.gallery-heading p:last-child{max-width:650px;color:#536e7d;margin:0}
.gallery-hint{font:800 .7rem Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.07em;color:#007fa6;white-space:nowrap}
.gallery-grid{display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:repeat(2,260px);gap:11px}
.gallery-grid.is-single{grid-template-columns:1fr;grid-template-rows:440px}
.gallery-grid.is-pair{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:440px}
.gallery-grid.is-four{grid-template-rows:repeat(3,172px)}
.gallery-trigger{position:relative;padding:0;border:0;overflow:hidden;text-align:left;background:#093754;color:#fff}
.gallery-trigger:first-child{grid-row:span 2}
.gallery-grid.is-single .gallery-trigger:first-child{grid-row:auto}
.gallery-grid.is-pair .gallery-trigger:first-child{grid-row:auto}
.gallery-grid.is-four .gallery-trigger:first-child{grid-row:span 3}
.gallery-trigger img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.gallery-trigger:hover img,.gallery-trigger:focus-visible img{transform:scale(1.035)}
.gallery-trigger span{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:32px 20px 18px;background:linear-gradient(transparent,rgba(3,29,48,.8));font:800 .8rem Manrope,Arial,sans-serif}
.gallery-trigger span span{position:static;display:inline;padding:0;background:none;font-size:1.3rem}
.gallery-dialog{position:fixed;max-width:min(92vw,1250px);max-height:92vh;padding:12px 12px 9px;border:0;background:#fff;color:#0c3048;box-shadow:0 24px 70px rgba(0,0,0,.3)}
.gallery-dialog::backdrop{background:rgba(1,17,31,.82)}
.gallery-dialog img{display:block;max-width:100%;max-height:calc(92vh - 85px);object-fit:contain}
.gallery-dialog p{margin:7px 40px 0 2px;font-size:.8rem;font-weight:700}
.gallery-close{position:absolute;top:16px;right:16px;width:38px;height:38px;border:0;border-radius:50%;background:#fff;color:#082f4a;font-size:1.75rem;line-height:1;box-shadow:0 4px 14px rgba(0,0,0,.2)}

.design-local{display:grid;grid-template-columns:1fr 1fr;min-height:455px;background:#e4f4fa;color:#0b304e}
.design-local-image{min-height:455px}
.design-local-image img{width:100%;height:100%;object-fit:cover}
.design-local-copy{display:flex;align-items:center;padding:55px clamp(35px,6.5vw,115px)}
.design-local-copy>div{max-width:550px}
.design-local-copy h2{font-size:clamp(2.2rem,3.5vw,3.65rem)}
.design-local-copy .eyebrow.light{color:#008ab5}
.design-local-copy p:not(.eyebrow){color:#486879;font-size:.91rem;line-height:1.72}
.design-local-copy .btn{margin-top:12px}

.design-faq{display:grid;grid-template-columns:minmax(220px,310px) minmax(0,1fr);gap:clamp(40px,7vw,100px)}
.design-faq .faq-heading h2{font-size:clamp(2.2rem,3vw,3.2rem)}
.design-faq .faq-heading p:last-child{max-width:300px}
.design-related{background:#eff8fc}
.design-related .section-heading-row{margin-bottom:29px}
.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.related-grid a{display:block;background:#fff;box-shadow:0 7px 22px rgba(5,61,88,.06);transition:transform .25s,box-shadow .25s}
.related-grid a:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(5,61,88,.14)}
.related-grid img{width:100%;height:218px;object-fit:cover}
.related-grid a>span{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:19px 22px 21px;align-items:center}
.related-grid strong{font:800 1.15rem Manrope,Arial,sans-serif}
.related-grid small{grid-column:1;color:#607b88;font-size:.8rem}
.related-grid b{grid-column:2;grid-row:1/3;color:#008eb9;font-size:1.25rem}

.design-contact{background:#d9eff8;color:#0b304e}
.design-contact-inner{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,7vw,110px);align-items:center;padding-block:86px}
.design-contact-copy{align-self:start;padding-top:26px}
.design-contact-copy h2{font-size:clamp(2.6rem,4.3vw,4.35rem)}
.design-contact-copy .eyebrow.light{color:#008ab5}
.design-contact-copy p:not(.eyebrow){max-width:480px;color:#486879;line-height:1.7}
.design-contact-copy a{display:inline-block;margin-top:15px;border-bottom:1px solid #80c8df;padding-bottom:6px;color:#006e97;font-weight:800;font-size:.83rem}
.design-contact-form{background:#f5fbfd;padding:30px 33px;color:#0b304e}
.design-contact-form .quote-form{margin-top:0}
.design-contact-form .quote-form .btn{background:var(--aqua);border-color:var(--aqua);color:#fff;gap:12px}
.design-contact-form .quote-form .btn:hover{background:#0ba9df;border-color:#0ba9df}

@media(max-width:1100px){
  .design-overview{grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr);gap:35px}
  .spec-panel{padding:23px}
  .spec-details{padding:20px 16px}
  .feature-grid article{padding:25px 18px}
}
@media(max-width:940px){
  .design-hero,.design-hero-inner{min-height:620px}
  .design-hero-inner{padding-top:105px}
  .design-overview{grid-template-columns:1fr;gap:35px}
  .design-story{max-width:780px}
  .spec-panel{max-width:780px;width:100%}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .feature-grid article{min-height:190px}
  .colour-intro{display:block}
  .colour-intro>p{max-width:680px;margin-top:13px}
  .design-faq{gap:35px;grid-template-columns:230px 1fr}
}
@media(max-width:680px){
  .pool-design-page .site-header{margin-bottom:0}
  .design-hero,.design-hero-inner{min-height:560px}
  .design-hero-inner{padding-top:27px;padding-bottom:24px}
  .design-hero-image{object-position:52% center}
  .design-hero-shade{background:linear-gradient(0deg,rgba(2,23,39,.89),rgba(2,23,39,.13) 72%)}
  .breadcrumbs{font-size:.68rem}
  .design-hero-copy{padding:28px 0 27px}
  .design-hero h1{font-size:clamp(3.1rem,12vw,4.5rem)}
  .design-hero-copy>p:not(.eyebrow){font-size:1.05rem}
  .design-jump .shell{min-height:51px;gap:23px}
  .design-jump a{font-size:.62rem;padding:16px 0}
  .design-overview{gap:28px}
  .design-story{padding-top:0}
  .spec-panel{padding:18px 14px}
  .spec-panel-header{display:block}
  .spec-pill{display:none}
  .size-tabs{grid-template-columns:repeat(2,1fr)}
  .size-tabs button{font-size:.75rem;padding:10px 5px}
  .spec-body{grid-template-columns:1fr}
  .plan-frame{border-right:0;border-bottom:1px solid #d8edf4;min-height:265px}
  .plan-frame img{max-height:260px}
  .spec-details{padding:20px}
  .spec-metrics{grid-template-columns:repeat(3,1fr)}
  .feature-grid{gap:9px}
  .feature-grid article{padding:20px 15px;min-height:210px}
  .feature-grid h3{font-size:1rem}
  .feature-grid p{font-size:.78rem}
  .feature-number{margin-bottom:20px}
  .colour-layout{grid-template-columns:1fr}
  .finish-picker{padding:23px 18px;border-right:0;border-bottom:1px solid #d6e7ef}
  .finish-grid{gap:8px}
  .finish-option{font-size:.67rem;min-height:91px}
  .finish-chip{width:40px;height:40px}
  .finish-preview{padding:24px 20px}
  .finish-model{width:min(100%,240px)}
  .gallery-heading{display:block}
  .gallery-hint{display:inline-block;margin-top:15px}
  .gallery-grid{grid-template-columns:1fr 1fr;grid-template-rows:240px 160px;gap:8px}
  .gallery-grid.is-single{grid-template-columns:1fr;grid-template-rows:250px}
  .gallery-grid.is-pair{grid-template-columns:1fr;grid-template-rows:240px 200px}
  .gallery-grid.is-four{grid-template-rows:240px 160px 180px}
  .gallery-trigger:first-child{grid-row:auto;grid-column:1/-1}
  .gallery-grid.is-four .gallery-trigger:first-child{grid-row:auto}
  .gallery-grid.is-four .gallery-trigger:last-child{grid-column:1/-1}
  .gallery-trigger span{font-size:.7rem;padding:30px 11px 10px}
  .design-local{grid-template-columns:1fr}
  .design-local-image{min-height:0;height:270px}
  .design-local-copy{padding:52px 25px 62px}
  .design-faq{display:block}
  .design-faq .faq-heading{margin-bottom:28px}
  .related-grid{gap:10px}
  .related-grid img{height:150px}
  .related-grid a>span{padding:11px 12px 14px}
  .related-grid strong{font-size:.88rem}
  .related-grid small{font-size:.66rem}
  .design-contact-inner{grid-template-columns:1fr;padding-block:60px;gap:28px}
  .design-contact-copy{padding-top:0}
  .design-contact-form{padding:24px 18px}
}
@media(max-width:520px){
  .spec-facts{gap:7px 15px;font-size:.61rem}
  .related-grid{grid-template-columns:1fr}
  .related-grid a{display:grid;grid-template-columns:42% 58%}
  .related-grid img{height:115px}
  .related-grid a>span{align-content:center}
}
@media(max-width:390px){.design-hero h1{font-size:2.85rem}.finish-grid{grid-template-columns:repeat(2,1fr)}.feature-grid{grid-template-columns:1fr}.feature-grid article{min-height:0}.design-hero-actions .btn{width:100%}}