.pergola-pdp{padding-bottom:90px}.pg-crumb{display:flex;gap:12px;padding:25px 0 30px;font-size:13px}.pg-product{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,1fr);gap:0 5vw;margin-bottom:80px}.pg-heading{grid-column:2;grid-row:1}.pg-heading h1{font-size:clamp(45px,4.6vw,78px);line-height:1.02;letter-spacing:-.045em;margin:16px 0 22px}.pg-intro{font-size:20px;line-height:1.55}.pg-price{border-block:1px solid var(--line);padding:18px 0;font-weight:600}.pg-price span{display:block;font-size:13px;font-weight:400;margin-top:5px;opacity:.75}.pg-gallery{grid-column:1;grid-row:1/span 2;margin:0;align-self:start;position:sticky;top:28px}.pg-stage{position:relative;overflow:hidden;background:#e6e4df;aspect-ratio:4/3}.pg-stage>img{display:block;width:100%;height:100%;object-fit:contain}.pg-stage:focus-visible{outline:3px solid #a58a5c;outline-offset:4px}.pg-gallery figcaption{display:flex;justify-content:space-between;gap:15px;font-size:11px;line-height:1.5;padding:13px 0}.pg-gallery-arrows{position:absolute;inset:auto 15px 15px auto;display:flex;gap:5px}.pg-gallery-arrows button,.pg-views button{font:inherit;color:inherit;background:var(--bg);border:1px solid var(--line);padding:11px 16px;min-height:44px;cursor:pointer}.pg-gallery-arrows button{background:#f5f3ed;color:#222}.pg-views{display:flex;flex-wrap:wrap;gap:6px}.pg-views button{font-size:12px}.pg-views button[aria-pressed=true]{background:#292d29;color:#fff}.pg-views button[hidden],[hidden]{display:none!important}.pg-options{grid-column:2;grid-row:2}.pg-options fieldset{border:0;margin:22px 0;padding:0;min-width:0}.pg-options legend{font-size:14px;font-weight:600;margin-bottom:13px}.pg-bays{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.pg-roofs{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pg-choice{position:relative;cursor:pointer}.pg-choice input{position:absolute;width:1px;height:1px;opacity:0}.pg-choice>span{display:flex;flex-direction:column;gap:6px;padding:14px 4px;text-align:center;border:1px solid var(--line);height:100%;font-size:13px}.pg-choice small{font-size:11px;line-height:1.3}.pg-choice input:checked+span{background:#292d29;color:#fff}.pg-choice input:focus-visible+span,button:focus-visible,a:focus-visible{outline:3px solid #a58a5c;outline-offset:3px}.pg-help{font-size:13px;line-height:1.65;opacity:.8}.pg-extra{display:flex;align-items:flex-start;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);cursor:pointer}.pg-extra input{width:20px;height:20px;accent-color:#292d29;flex:none;margin:1px 0}.pg-extra strong,.pg-extra small{display:block}.pg-extra strong{font-size:14px}.pg-extra small{font-size:12px;line-height:1.5;margin-top:5px}.pg-extra:has(input:disabled){opacity:.5;cursor:default}.pg-finish{display:flex;align-items:center;gap:12px;padding:18px 0}.pg-finish>span{height:34px;width:34px;background:#191b19;border:1px solid #777}.pg-finish strong,.pg-finish small{display:block;font-size:13px}.pg-finish small{margin-top:5px;font-size:11px}.pg-summary{border-top:1px solid var(--line);padding:20px 0;display:flex;flex-direction:column;gap:7px}.pg-summary span{font-size:12px}.pergola-pdp .pg-primary{display:flex;align-items:center;justify-content:space-between;gap:22px;background:#292d29!important;color:#fff!important;border:1px solid #292d29;min-height:50px;padding:14px 20px;border-radius:0;text-decoration:none;font-weight:500}.pg-section{padding:76px 0;border-top:1px solid var(--line);scroll-margin-top:30px}.pg-section h2{font-size:clamp(34px,4vw,58px);line-height:1.08;letter-spacing:-.035em;margin:15px 0 24px}.pg-section p{line-height:1.75}.pg-lead{font-size:21px;line-height:1.55!important}.pg-story,.pg-measure,.pg-roof-section,.pg-faq,.pg-enquiry{display:grid;grid-template-columns:1fr 1fr;gap:8vw}.pg-story>div:last-child{max-width:650px}.pg-measure-list{padding:0;list-style:none;counter-reset:measure}.pg-measure-list li{counter-increment:measure;display:grid;grid-template-columns:32px 1fr;border-top:1px solid var(--line);padding:18px 0}.pg-measure-list li:before{content:'0' counter(measure);font-size:12px;grid-row:span 2}.pg-measure-list span{display:block;font-size:14px;line-height:1.6;margin-top:6px}.pg-diagram{padding:25px 0}.pg-diagram svg{display:block;width:100%;height:auto}table{width:100%;border-collapse:collapse;font-size:14px}caption{text-align:left;font-size:12px;padding:18px 10px;text-transform:uppercase;letter-spacing:.09em}th,td{text-align:left;border-bottom:1px solid var(--line);padding:14px 10px}tbody tr.is-selected{background:color-mix(in srgb,var(--ink) 7%,transparent)}tbody th{font-weight:500}.pg-roof-figure{display:flex;align-items:center}.pg-roof-figure svg,#pg-roof-drawing svg{width:100%;height:auto;display:block}.pg-roof-figure{background:#e6e8e1;color:#25332b;padding:30px}.pg-roof-section{gap:5vw}.pg-process ol{padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:5vw;margin-top:40px}.pg-process li{border-top:1px solid var(--line);padding-top:20px}.pg-process li>span{font-size:13px;opacity:.7}.pg-process h3{font-size:22px;font-weight:500;margin:22px 0 15px}.pg-process p{font-size:14px}.pg-faq details{border-bottom:1px solid var(--line);padding:20px 0}.pg-faq details:first-child{border-top:1px solid var(--line)}.pg-faq summary{cursor:pointer;font-size:18px;line-height:1.5;padding-right:15px}.pg-faq details p{font-size:14px}.pg-enquiry .enquiry-form{min-width:0}.pg-custom{display:flex;align-items:center;justify-content:space-between;gap:40px}.pg-custom h2{font-size:40px}.pg-sticky{position:fixed;z-index:30;inset:auto 0 0;display:flex;align-items:center;justify-content:space-between;gap:15px;background:var(--bg);color:var(--ink);padding:12px max(24px,5vw);border-top:1px solid var(--line)}.pg-sticky>div{display:flex;flex-direction:column;gap:4px}.pg-sticky strong{font-size:14px}.pg-sticky span{font-size:12px}#pg-roof-drawing{height:100%;display:flex;align-items:center;background:#e6e8e1;color:#25332b;padding:30px}.pergola-pdp .footer{margin-top:20px}.pg-enquiry input,.pg-enquiry textarea{max-width:100%}@media(max-width:800px){.pg-product{display:flex;flex-direction:column;gap:18px;margin-bottom:40px}.pg-heading{order:0}.pg-heading h1{font-size:clamp(34px,10.5vw,44px)}.pg-intro{font-size:18px}.pg-gallery{order:1;position:static}.pg-options{order:2}.pg-heading .pg-price{margin-bottom:0}.pg-story,.pg-measure,.pg-roof-section,.pg-faq,.pg-enquiry{grid-template-columns:1fr;gap:25px}.pg-section{padding:45px 0}.pg-process ol{grid-template-columns:1fr;gap:24px}.pg-custom{display:block}.pg-custom .button{margin-top:22px}.pg-roof-figure{padding:18px}.pg-gallery figcaption{font-size:10px;gap:10px}.pg-gallery figcaption span{max-width:55%}.pg-bays{gap:4px}.pg-choice>span{padding:14px 2px}.pg-choice strong{font-size:12px}.pg-choice small{font-size:10px}.pg-sticky{padding:10px 16px}.pg-sticky .button{font-size:12px;min-height:46px;padding:12px}.pg-sticky strong{font-size:12px}.pg-sticky span{font-size:10px}.pg-crumb{padding:18px 0}.pg-lead{font-size:19px}.pg-main{overflow-wrap:break-word}.pg-enquiry{scroll-margin-top:15px}.pg-roofs .pg-choice small{font-size:12px}.pg-views button{padding:10px 12px}#pg-roof-drawing{padding:16px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.pg-crumb{flex-direction:row!important;align-items:center;flex-wrap:wrap}.pg-crumb a{padding:0!important}@media(max-width:800px){.pg-heading h1{font-size:clamp(34px,10.5vw,44px)}.pg-heading .kicker{font-size:10px}.pg-heading .pg-intro{font-size:16px}.pg-crumb{gap:10px!important}.pg-heading h1{margin:12px 0 18px}}

.pg-patterns{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.pg-swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.pg-swatches i{display:block;width:35px;height:35px;border:1px solid #888;margin:0 auto 7px}.pg-choice input:checked+span{outline:2px solid #a58a5c;outline-offset:-2px}.pg-stage{aspect-ratio:3/2}.pg-gallery figcaption{flex-wrap:wrap}.pg-gallery figcaption span{max-width:100%}.pg-patterns small{font-size:10px}.pg-swatches .pg-choice>span{padding:12px 4px}.pg-swatches strong{font-size:11px}.pg-swatches small{font-size:10px}.pg-summary strong{line-height:1.6}.pg-sticky>div{max-width:65%}@media(max-width:800px){.pg-swatches{grid-template-columns:repeat(2,1fr)}.pg-patterns{gap:5px}.pg-sticky>div{max-width:55%}.pg-sticky span{line-height:1.45}}

@media (max-width: 800px) {
  .pg-stage:has(> .pg-gallery-arrows:not([hidden])) { aspect-ratio: auto; }
  .pg-stage:has(> .pg-gallery-arrows:not([hidden])) > :is(img, #pg-roof-drawing) { height: auto; min-height: 0; aspect-ratio: 3/2; }
  .pg-gallery-arrows { position: static; justify-content: flex-end; padding: 6px 8px 8px; }
}
