/* DGX theme — WordPress additions on top of site.css (banner slider, form messages/captcha, blog content, menus). */

.skip-link{position:absolute;left:12px;top:-60px;z-index:100;background:#fff;color:var(--teal-dd);padding:10px 16px;border-radius:10px;font-weight:600;transition:top .2s}
.skip-link:focus{top:12px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* banner photo slider (2+ photos): cross-fade with a slow zoom */
.banner .bg .sl{opacity:0;transform:scale(1.06);transition:opacity 1.4s ease,transform calc(var(--sl-ms,6000ms) + 1.4s) linear}
.banner .bg .sl.on{opacity:1;transform:scale(1);z-index:2}
.banner .bg .sl.prev{opacity:1;z-index:1;transition:none}
.banner:not(.has-slides) .bg .sl{opacity:1;transform:none}
.sdots{position:absolute;z-index:3;left:50%;bottom:28px;transform:translateX(-50%);display:flex;gap:8px}
.sdots button{width:34px;height:20px;border:0;background:none;padding:0;cursor:pointer;display:grid;place-items:center}
.sdots i{display:block;width:100%;height:3px;border-radius:3px;background:rgba(255,255,255,.35);transition:background .3s}
.sdots button.on i{background:var(--gold)}
@media (max-width:680px){.sdots{bottom:18px}}

/* inner-page header title when it is not the page's h1 (product pages) */
.phero p.ph1{font-family:var(--head);font-size:clamp(36px,4.6vw,64px);font-weight:600;letter-spacing:-.03em;line-height:1.05;max-width:900px;color:#fff;margin:0}
.phero .ph1 span{color:#7fd0e6}
.phero:has(+ [data-product-detail]) p.ph1{font-size:clamp(28px,3vw,40px)}
.crumb [aria-current]{color:#fff}

/* product pages */
.spec th{padding:10px 0;border-bottom:1px solid var(--line);color:var(--muted);width:42%;text-align:left;font-weight:400}
.pd .desc p{color:var(--muted);font-size:15.5px}
.pd .desc p+p{margin-top:10px}
.gsec+.gsec{padding-top:0}

/* sections with any number of items */
.steps5{grid-template-columns:repeat(var(--n,5),1fr)}
@media (max-width:1100px){.steps5{grid-template-columns:repeat(3,1fr)}}
@media (max-width:680px){.steps5{grid-template-columns:1fr 1fr}}
.itext p{color:var(--muted);margin-top:12px}

/* quote form */
.form .ok,.form .err{display:block;margin:0 0 16px;padding:12px 16px;border-radius:12px;text-align:left;font-weight:500;font-size:14.5px}
.form .ok{background:var(--teal-l);color:var(--teal-d)}
.form .err{background:#fdecec;color:#a12b2b}
.form:not(.sent) .ok{display:none}
.form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form .captcha{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:2px 0 14px;padding:12px 14px;border:1px dashed var(--line);border-radius:14px;background:var(--bg)}
.form .captcha label{font-size:14px;color:var(--muted)}
.form .captcha label b{color:var(--ink);font-family:var(--head)}
.form .captcha input{width:110px!important;height:42px!important;margin:0!important;background:#fff!important}
.form .g-recaptcha{margin:2px 0 14px}
.form .btn[disabled]{cursor:wait}

/* footer headings (h2 for a clean outline, styled like before) */
footer.ft .h4{color:#fff;font-size:15px;margin-bottom:18px;font-family:var(--head);font-weight:600}

/* page content: core blocks (paragraphs, headings, images…) sit in the page width */
.page-content>:not(section):not(.strip):not(.bigtxt):not(.lb):not(.alignfull){width:var(--wrap);margin-inline:auto}
.page-content>p,.page-content>ul,.page-content>ol{max-width:760px;color:#41545d;font-size:17px;line-height:1.75;margin-top:14px}
.page-content>h2,.page-content>h3{color:var(--teal-dd);margin-top:40px;max-width:760px}
.page-content>.wp-block-spacer{width:auto}

/* blog article body (block editor content) */
.post .crumb i{width:4px;height:4px;border-radius:50%;background:var(--gold)}
.post-body>*+*{margin-top:14px}
.post-body h2,.post-body h3{color:var(--teal-dd);margin:40px 0 12px}
.post-body h2{font-size:26px}
.post-body h3{font-size:21px}
.post-body p,.post-body li{color:#41545d;font-size:17px;line-height:1.75}
.post-body p.lead{font-size:19px;color:var(--ink)}
.post-body ul,.post-body ol{margin-left:22px}
.post-body figure,.post-body .wp-block-image{margin:30px 0;border-radius:var(--r);overflow:hidden}
.post-body img{height:auto}
.post-body a{color:var(--teal);text-decoration:underline}
.bgrid.three .bcard.big{grid-column:auto}
.pager{margin-top:34px}
.pager .nav-links{display:flex;gap:8px;flex-wrap:wrap}
.pager .page-numbers{min-width:42px;height:42px;padding:0 12px;border-radius:21px;border:1px solid var(--line);display:inline-grid;place-items:center;font-weight:600}
.pager .page-numbers.current{background:var(--teal-dd);border-color:var(--teal-dd);color:#fff}

/* simple text section */
.dgx-text .tbody{max-width:820px}
.dgx-text.is-center .tbody{margin-inline:auto;text-align:center}
.dgx-text p{color:var(--muted);margin-top:16px;font-size:17px}

/* WordPress admin bar */
.admin-bar header.site{top:32px}
@media (max-width:782px){.admin-bar header.site{top:46px}}
