/* SMART Solutions - Clear Sky shared frame v1.1.1 (2 Nov 2026) - Utopia fluid sizes; theme overrides
   One cached style file for header, footer, pills and the shared motion hooks.
   Safety: nothing is hidden unless scripts run (html.ss-js) and the visitor allows motion. */

:root{
  --ss-sky:#0593C6; --ss-sky-d:#0473A0; --ss-sky-dd:#035A7E; --ss-sky-pale:#EEF8FC; --ss-sky-tint:#DCEFF7; --ss-sky-soft:#BFE3F2;
  --ss-ink:#0B1D26; --ss-ink-2:#33464F; --ss-mut:#52636B; --ss-line:#E3EEF3; --ss-line-2:#E8F0F3;
  --ss-white:#FCFFFF; --ss-mist:#F7FBFD; --ss-pink:#D83995;
  --ss-ease:cubic-bezier(.22,.61,.36,1);
  --ss-display:'Plus Jakarta Sans',-apple-system,'Helvetica Neue',Arial,sans-serif;
  --ss-body:'DM Sans',-apple-system,'Helvetica Neue',Arial,sans-serif;
  --ss-hh:64px;
}

/* Utopia fluid scales - type: 16px x1.22 at 360 wide to 18px x1.333 at 1240 wide; space: 16 to 20 base. Generated by utopia-core 1.6.0, 2 Nov 2026. */
:root{
  --ss-step-6:clamp(52.76px, 33.0336px + 5.4795vw, 100.98px); /* 52.76 to 100.98px */
  --ss-step-5:clamp(43.24px, 29.9364px + 3.6955vw, 75.76px); /* 43.24 to 75.76px */
  --ss-step-4:clamp(35.45px, 26.7036px + 2.4295vw, 56.83px); /* 35.45 to 56.83px */
  --ss-step-3:clamp(29.05px, 23.4945px + 1.5432vw, 42.63px); /* 29.05 to 42.63px */
  --ss-step-2:clamp(23.81px, 20.4677px + 0.9284vw, 31.98px); /* 23.81 to 31.98px */
  --ss-step-1:clamp(19.52px, 17.6914px + 0.508vw, 23.99px); /* 19.52 to 23.99px */
  --ss-step-0:clamp(16px, 15.1818px + 0.2273vw, 18px); /* 16 to 18px */
  --ss-step-n1:clamp(13.11px, 12.9505px + 0.0443vw, 13.5px); /* 13.11 to 13.5px */
  --ss-space-3xs:clamp(4px, 3.5909px + 0.1136vw, 5px); /* 4 to 5px */
  --ss-space-2xs:clamp(8px, 7.1818px + 0.2273vw, 10px); /* 8 to 10px */
  --ss-space-xs:clamp(12px, 10.7727px + 0.3409vw, 15px); /* 12 to 15px */
  --ss-space-s:clamp(16px, 14.3636px + 0.4545vw, 20px); /* 16 to 20px */
  --ss-space-m:clamp(24px, 21.5455px + 0.6818vw, 30px); /* 24 to 30px */
  --ss-space-l:clamp(32px, 28.7273px + 0.9091vw, 40px); /* 32 to 40px */
  --ss-space-xl:clamp(48px, 43.0909px + 1.3636vw, 60px); /* 48 to 60px */
  --ss-space-2xl:clamp(64px, 57.4545px + 1.8182vw, 80px); /* 64 to 80px */
  --ss-space-3xl:clamp(96px, 86.1818px + 2.7273vw, 120px); /* 96 to 120px */
}

/* ---------- base (frame pages only) ---------- */
body.ss-cs{margin:0;background:var(--ss-white);color:var(--ss-ink-2);font-family:var(--ss-body);-webkit-font-smoothing:antialiased}
body.ss-cs :focus-visible{outline:2px solid var(--ss-sky-d);outline-offset:3px;border-radius:8px}
body.ss-cs #masthead,body.ss-cs #ast-mobile-header,body.ss-cs #ss-footer,body.ss-cs #colophon{display:none!important}
html{scroll-padding-top:calc(var(--ss-hh) + 16px)}
.ss-wrap{max-width:1200px;margin:0 auto;padding-inline:var(--ss-space-s);box-sizing:border-box}
.ss-skip{position:absolute;left:16px;top:-80px;z-index:1000;background:var(--ss-ink);color:#fff;padding:12px 18px;border-radius:12px;font-weight:600;text-decoration:none}
.ss-skip:focus{top:12px;color:#fff}

/* ---------- pills: the only button style ---------- */
.ss-pill,
body.ss-cs .wp-block-button__link,
body.ss-cs .ast-button{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:var(--ss-space-xs) var(--ss-space-m);
  border-radius:999px!important;font-family:var(--ss-body);font-weight:600;font-size:var(--ss-step-0);line-height:1.2;text-decoration:none;
  border:1px solid var(--ss-sky-d);background:var(--ss-sky-d);color:#fff;cursor:pointer;white-space:nowrap;box-sizing:border-box;
  transition:transform .2s var(--ss-ease),box-shadow .2s var(--ss-ease),background-color .2s var(--ss-ease),color .2s var(--ss-ease)
}
.ss-pill:hover,body.ss-cs .wp-block-button__link:hover{background:var(--ss-sky-dd);border-color:var(--ss-sky-dd);color:#fff;transform:translateY(-2px);box-shadow:0 10px 24px rgba(4,115,160,.22)}
.ss-pill--ghost,body.ss-cs .is-style-outline .wp-block-button__link{background:transparent;color:var(--ss-sky-d)}
.ss-pill--ghost:hover,body.ss-cs .is-style-outline .wp-block-button__link:hover{background:var(--ss-sky-pale);color:var(--ss-sky-dd)}
.ss-pill--white{background:#fff;color:var(--ss-sky-dd);border-color:#fff}
.ss-pill--white:hover{background:#fff;color:var(--ss-sky-dd)}
.ss-pill--sm{min-height:44px;padding:var(--ss-space-2xs) var(--ss-space-s);font-size:15px}
@media (max-width:640px){.ss-pills .ss-pill{flex:1 1 100%}}
.ss-pills{display:flex;flex-wrap:wrap;gap:var(--ss-space-xs)}

/* ---------- header ---------- */
.ss-hdr{position:sticky;top:0;z-index:900;background:rgba(252,255,255,.86);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid transparent;transition:border-color .3s var(--ss-ease)}
body.admin-bar .ss-hdr{top:32px}
@media (max-width:782px){body.admin-bar .ss-hdr{top:46px}}
.ss-hdr.is-scrolled{border-bottom-color:var(--ss-line-2)}
.ss-hdr-in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:var(--ss-hh)}
.ss-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ss-ink)}
.ss-brand img{width:34px;height:34px;border-radius:50%;display:block}
.ss-brand span{font-family:var(--ss-display);font-weight:600;font-size:18px;letter-spacing:-.02em;color:var(--ss-ink)}
.ss-nav{display:flex;align-items:center;gap:26px;font-size:15px;font-weight:500}
.ss-nav a{color:var(--ss-ink-2);text-decoration:none}
.ss-nav a:hover,.ss-nav a[aria-current="page"]{color:var(--ss-ink)}
.ss-nav a.ss-pill{color:#fff}
.ss-more{position:relative}
.ss-more > summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;color:var(--ss-ink-2)}
.ss-more > summary::-webkit-details-marker{display:none}
.ss-more > summary::after{content:"";width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s var(--ss-ease)}
.ss-more[open] > summary::after{transform:translateY(1px) rotate(-135deg)}
.ss-more-menu{position:absolute;top:calc(100% + 14px);right:-20px;min-width:260px;background:#fff;border:1px solid var(--ss-line);border-radius:18px;padding:10px;box-shadow:0 24px 60px rgba(11,29,38,.12);margin:0;list-style:none}
.ss-more-menu a{display:block;padding:9px 12px;border-radius:10px;font-size:14px}
.ss-more-menu li:first-child a{font-weight:600;color:var(--ss-ink)}
.ss-more-menu a:hover{background:var(--ss-sky-pale)}
.ss-burger{display:none}
@media (max-width:900px){
  .ss-nav{display:none}
  .ss-burger{display:block}
  .ss-burger > summary{list-style:none;width:44px;height:44px;display:grid;place-items:center;border-radius:12px;cursor:pointer}
  .ss-burger > summary::-webkit-details-marker{display:none}
  .ss-burger > summary i{display:block;width:20px;height:2px;background:var(--ss-ink);box-shadow:0 6px 0 var(--ss-ink),0 -6px 0 var(--ss-ink)}
  .ss-burger[open] > summary i{background:transparent;box-shadow:none;position:relative}
  .ss-burger[open] > summary i::before,.ss-burger[open] > summary i::after{content:"";position:absolute;left:0;top:0;width:20px;height:2px;background:var(--ss-ink);transform:rotate(45deg)}
  .ss-burger[open] > summary i::after{transform:rotate(-45deg)}
  .ss-mnav{position:absolute;left:0;right:0;top:var(--ss-hh);background:#fff;border-bottom:1px solid var(--ss-line);padding:6px 16px 18px;max-height:calc(100vh - var(--ss-hh));overflow:auto;box-shadow:0 24px 40px rgba(11,29,38,.08)}
  .ss-mnav ul{list-style:none;margin:0;padding:0}
  .ss-mnav > ul > li > a:not(.ss-pill),.ss-mnav summary{display:flex;justify-content:space-between;align-items:center;padding:15px 2px;border-bottom:1px solid var(--ss-line-2);font-family:var(--ss-display);font-weight:600;font-size:19px;color:var(--ss-ink);text-decoration:none;list-style:none;cursor:pointer}
  .ss-mnav summary::-webkit-details-marker{display:none}
  .ss-mnav details ul a{display:block;padding:9px 2px 9px 14px;font-size:15px;color:var(--ss-ink-2);text-decoration:none}
  .ss-mnav .ss-pill{width:100%;margin-top:18px;color:#fff}
}

/* ---------- reading progress (CSS only, decorative) ---------- */
.ss-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:950;pointer-events:none;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--ss-sky-soft),var(--ss-sky));display:none}
@supports (animation-timeline: scroll()){
  @media (prefers-reduced-motion:no-preference){
    .ss-progress{display:block;animation:ssGrow linear both;animation-timeline:scroll(root)}
  }
}
@keyframes ssGrow{to{transform:scaleX(1)}}

/* ---------- shared scene shapes (sections that slide over the last) ---------- */
.ss-scene{position:relative;z-index:1;background:var(--ss-white);border-radius:44px 44px 0 0;margin-top:-44px;box-shadow:0 -28px 70px rgba(11,29,38,.07)}
.ss-scene--mist{background:var(--ss-mist)}
.ss-scene--sky{background:linear-gradient(180deg,#E9F6FB,var(--ss-white))}
@media (max-width:640px){.ss-scene{border-radius:28px 28px 0 0;margin-top:-28px}}

/* ---------- reveals: hidden ONLY when scripts run and motion is allowed ---------- */
@media (prefers-reduced-motion:no-preference){
  html.ss-js .ss-rv:not(.is-in){opacity:0;transform:translateY(34px);filter:blur(6px)}
  html.ss-js .ss-rv{transition:opacity 1s var(--ss-ease),transform 1.1s var(--ss-ease),filter 1s var(--ss-ease)}
}
/* split-line masks keep room for descenders, so text is never cut at the bottom */
[data-ss-split] > div{padding-bottom:.18em;margin-bottom:-.18em}
.ss-count{font-variant-numeric:tabular-nums}

/* ---------- type and space for page builds (Utopia steps; nothing under 14px except capital labels) ---------- */
.ss-display{margin:0;font-family:var(--ss-display);font-weight:600;font-size:var(--ss-step-5);line-height:1.04;letter-spacing:-.04em;color:var(--ss-ink);text-wrap:balance}
.ss-h1{margin:0;font-family:var(--ss-display);font-weight:600;font-size:var(--ss-step-4);line-height:1.06;letter-spacing:-.035em;color:var(--ss-ink);text-wrap:balance}
.ss-h2{margin:0;font-family:var(--ss-display);font-weight:600;font-size:var(--ss-step-2);line-height:1.12;letter-spacing:-.025em;color:var(--ss-ink);text-wrap:balance}
.ss-h3{margin:0;font-family:var(--ss-display);font-weight:600;font-size:var(--ss-step-1);line-height:1.25;letter-spacing:-.015em;color:var(--ss-ink);text-wrap:balance}
.ss-lead{margin:0;font-size:var(--ss-step-1);line-height:1.5;color:var(--ss-ink-2);max-width:60ch;text-wrap:pretty}
.ss-body,.ss-body p,.ss-body li{font-size:var(--ss-step-0);line-height:1.6;max-width:65ch;text-wrap:pretty}
.ss-eyebrow{margin:0;font-size:var(--ss-step-n1);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ss-sky-d)}
.ss-small{font-size:14px;line-height:1.5;color:var(--ss-mut)}
.ss-section{padding-block:var(--ss-space-2xl)}
.ss-stack{display:flex;flex-direction:column;gap:var(--ss-space-s)}
.ss-stack--m{gap:var(--ss-space-m)}
.ss-card{background:#fff;border:1px solid var(--ss-line);border-radius:22px;padding:var(--ss-space-m)}
.ss-nowrap{white-space:nowrap}

/* ---------- footer ---------- */
.ss-ftr{position:relative;z-index:1;background:linear-gradient(180deg,var(--ss-mist),#EAF6FB);border-radius:44px 44px 0 0;margin-top:var(--ss-space-xl);padding-block:var(--ss-space-2xl) var(--ss-space-3xl);color:var(--ss-mut);font-family:var(--ss-body);font-size:15px}
@media (max-width:640px){.ss-ftr{border-radius:28px 28px 0 0}}
.ss-fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--ss-space-l)}
@media (max-width:860px){.ss-fgrid{grid-template-columns:1fr 1fr}.ss-fabout{grid-column:1/-1}}
.ss-fabout b{font-family:var(--ss-display);font-weight:600;font-size:20px;color:var(--ss-ink)}
.ss-fabout p{margin:12px 0 18px;max-width:34ch;line-height:1.6;color:var(--ss-ink-2)}
.ss-ftr h2{margin:0 0 var(--ss-space-xs);font-family:var(--ss-body);font-size:var(--ss-step-n1);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ss-mut)}
.ss-ftr ul{list-style:none;margin:0;padding:0}
.ss-ftr li{padding:5px 0}
.ss-ftr li a{color:var(--ss-ink-2);text-decoration:none}
.ss-ftr li a:hover{color:var(--ss-sky-d)}
.ss-legal{margin-top:var(--ss-space-xl);padding-top:var(--ss-space-s);border-top:1px solid var(--ss-line);font-size:14px;line-height:1.7}
.ss-legal a{color:var(--ss-mut)}
.ss-legal p{margin:0}
/* the wordmark keeps room for its descenders and is never clipped */
.ss-word{font-family:var(--ss-display);font-weight:700;letter-spacing:-.05em;color:#D5EAF2;font-size:min(10.2vw,148px);line-height:1.12;white-space:nowrap;margin:18px 0 0;padding-bottom:.14em;text-align:center;overflow:visible}

/* ---------- smooth scrolling (Lenis) - its own sheet is NOT loaded, so live demo frames stay clickable ---------- */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-stopped{overflow:clip}
.lenis iframe{pointer-events:auto}

/* ---------- theme overrides: the site's Additional CSS forces fonts and link colours with !important
   (a, h1-h6, body/p/li/span/div/button). On frame pages the Clear Sky values win, scoped to frame parts and ss- classes only. ---------- */
body.ss-cs .ss-hdr a,body.ss-cs .ss-ftr a,body.ss-cs .ss-more > summary{color:var(--ss-ink-2)!important}
body.ss-cs .ss-hdr a:hover,body.ss-cs .ss-ftr li a:hover{color:var(--ss-sky-d)!important}
body.ss-cs .ss-ftr .ss-legal a{color:var(--ss-mut)!important}
body.ss-cs .ss-pill,body.ss-cs a.ss-pill,body.ss-cs .wp-block-button__link{color:#fff!important}
body.ss-cs .ss-pill--ghost,body.ss-cs a.ss-pill--ghost,body.ss-cs .is-style-outline .wp-block-button__link{color:var(--ss-sky-d)!important}
body.ss-cs .ss-pill--white,body.ss-cs a.ss-pill--white{color:var(--ss-sky-dd)!important}
body.ss-cs .ss-skip{color:#fff!important}
body.ss-cs .ss-brand span,body.ss-cs .ss-word,body.ss-cs .ss-fabout b{font-family:var(--ss-display)!important}
body.ss-cs .ss-ftr h2{font-family:var(--ss-body)!important;color:var(--ss-mut)!important;font-weight:600!important;letter-spacing:.14em!important}
body.ss-cs .ss-display,body.ss-cs .ss-h1,body.ss-cs .ss-h2,body.ss-cs .ss-h3{font-family:var(--ss-display)!important;font-weight:600!important;color:var(--ss-ink)!important}
body.ss-cs .ss-display{letter-spacing:-.04em!important}
body.ss-cs .ss-h1{letter-spacing:-.035em!important}
body.ss-cs .ss-h2{letter-spacing:-.025em!important}
body.ss-cs .ss-h3{letter-spacing:-.015em!important}
body.ss-cs .ss-eyebrow{color:var(--ss-sky-d)!important}

/* ---------- reduced motion: no motion at all ---------- */
@media (prefers-reduced-motion:reduce){
  .ss-pill,.ss-hdr,.ss-more > summary::after{transition:none!important}
  .ss-pill:hover{transform:none}
}
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
}

/* ---------- PRODUCT PAGE TEMPLATE (v1.2) - one template for TR19 Grease, TR19 Air, Fire dampers, LEV TExT.
   Phone first: one 16px edge, Utopia sizes, two pills per block, lists of five, cards as a swipe row on phones,
   prices as stacked cards, paperwork cropped (full PDF on tap). ---------- */
.ss-pt{font-family:var(--ss-body);color:var(--ss-ink-2)}
.ss-pt *,.ss-pt *::before,.ss-pt *::after{box-sizing:border-box}
.ss-pt p{margin:0}
.ss-pt img{display:block;max-width:100%;height:auto}
.ss-pt-hero{background:radial-gradient(1100px 520px at 70% -10%,#D7EEF8 0%,rgba(215,238,248,0) 70%),linear-gradient(180deg,#F0F9FD 0%,var(--ss-white) 100%);padding-block:var(--ss-space-l) var(--ss-space-xl);overflow:hidden}
.ss-pt-hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ss-space-l);align-items:center}
.ss-pt-hero .ss-h1{margin-top:var(--ss-space-xs)}
.ss-pt-hero .ss-lead{margin-top:var(--ss-space-s)}
.ss-pt-hero .ss-pills{margin-top:var(--ss-space-m)}
.ss-pt-price{margin-top:var(--ss-space-s)!important;font-size:15px;line-height:1.5;color:var(--ss-mut);max-width:44ch}
.ss-pt-price b{color:var(--ss-ink);font-weight:600}
.ss-pt-alt{margin-top:var(--ss-space-2xs)!important;font-size:15px;color:var(--ss-mut)}
@media (min-width:900px){.ss-pt-hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}.ss-pt-hero{padding-block:var(--ss-space-2xl)}}

/* the phone: a real app screen in a drawn frame */
.ss-pt-phone{width:clamp(220px,62vw,290px);margin-inline:auto;border:8px solid #13242D;border-radius:38px;background:#13242D;box-shadow:0 30px 60px rgba(11,29,38,.16),0 2px 0 rgba(255,255,255,.4) inset;overflow:hidden}
.ss-pt-phone img{width:100%;border-radius:30px}
.ss-pt-phone--sm{width:clamp(200px,56vw,260px)}
.ss-pt-cap{margin-top:var(--ss-space-2xs)!important;text-align:center;font-size:14px;color:var(--ss-mut)}

/* split section: words one side, the phone the other */
.ss-pt-split{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ss-space-l);align-items:center}
@media (min-width:900px){.ss-pt-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--ss-space-2xl)}.ss-pt-split--flip > :first-child{order:2}}
.ss-pt-ticks{list-style:none;margin:var(--ss-space-s) 0 0;padding:0}
.ss-pt-ticks li{position:relative;padding:var(--ss-space-2xs) 0 var(--ss-space-2xs) 28px;border-top:1px solid var(--ss-line-2);font-size:var(--ss-step-0);line-height:1.55}
.ss-pt-ticks li:first-child{border-top:0}
.ss-pt-ticks li::before{content:"";position:absolute;left:3px;top:calc(var(--ss-space-2xs) + .55em);width:11px;height:6px;border-left:2px solid var(--ss-sky);border-bottom:2px solid var(--ss-sky);transform:rotate(-45deg)}
.ss-pt .ss-body{margin-top:var(--ss-space-s)}
body.ss-cs .ss-pt .ss-h1,body.ss-cs .ss-pt .ss-h2{word-spacing:.06em}
.ss-pt-note{margin-top:var(--ss-space-s)!important;padding:var(--ss-space-s);border-radius:16px;background:var(--ss-sky-pale);border:1px solid var(--ss-sky-soft);font-size:15px;line-height:1.55;color:var(--ss-ink-2)}
.ss-pt-note b{color:var(--ss-ink)}

/* section heads */
.ss-pt-head{max-width:46rem}
.ss-pt-head .ss-h2{margin-top:var(--ss-space-2xs)}
.ss-pt-head .ss-body{margin-top:var(--ss-space-xs)}

/* paperwork: a swipe row on phones, three across from tablets */
.ss-pt-papers{display:grid;grid-auto-flow:column;grid-auto-columns:82%;gap:var(--ss-space-s);overflow-x:auto;scroll-snap-type:x mandatory;margin-top:var(--ss-space-m);padding-bottom:var(--ss-space-2xs);scrollbar-width:thin;overscroll-behavior-x:contain}
.ss-pt-paper{scroll-snap-align:start;margin:0;background:#fff;border:1px solid var(--ss-line);border-radius:20px;padding:var(--ss-space-xs);display:flex;flex-direction:column}
.ss-pt-paper a{display:block;text-decoration:none}
.ss-pt-paper .ss-pt-crop{aspect-ratio:3/2;overflow:hidden;border-radius:12px;border:1px solid var(--ss-line-2);background:#fff}
.ss-pt-paper .ss-pt-crop img{width:100%;height:100%;object-fit:cover;object-position:top center}
.ss-pt-paper figcaption{margin-top:var(--ss-space-xs);font-size:15px;line-height:1.45;color:var(--ss-ink-2)}
.ss-pt-paper figcaption b{display:block;font-family:var(--ss-display);font-weight:600;font-size:17px;color:var(--ss-ink)}
.ss-pt-open{display:inline-block;margin-top:var(--ss-space-2xs);font-weight:600;font-size:15px;color:var(--ss-sky-d);text-decoration:underline;text-underline-offset:3px}
@media (min-width:760px){.ss-pt-papers{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible}.ss-pt-papers--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px}}

/* prices: three stacked cards on phones, three across from tablets */
.ss-pt-prices{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ss-space-xs);margin-top:var(--ss-space-m)}
@media (min-width:760px){.ss-pt-prices{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ss-space-s)}}
.ss-pt-pcard{display:flex;align-items:baseline;justify-content:space-between;gap:var(--ss-space-s);background:#fff;border:1px solid var(--ss-line);border-radius:20px;padding:var(--ss-space-s) var(--ss-space-m)}
.ss-pt-pcard.is-this{border-color:var(--ss-sky-soft);background:linear-gradient(180deg,#fff,var(--ss-sky-pale))}
.ss-pt-amt{font-family:var(--ss-display);font-weight:600;font-size:var(--ss-step-3);letter-spacing:-.03em;line-height:1;color:var(--ss-ink);white-space:nowrap}
.ss-pt-amt small{font-family:var(--ss-body);font-size:15px;font-weight:500;letter-spacing:0;color:var(--ss-mut)}
.ss-pt-pcard p{font-size:15px;line-height:1.4;color:var(--ss-ink-2);text-align:right}
@media (min-width:760px){.ss-pt-pcard{flex-direction:column;align-items:flex-start;gap:var(--ss-space-2xs)}.ss-pt-pcard p{text-align:left}}
.ss-pt-terms{margin-top:var(--ss-space-s)!important;font-size:15px;line-height:1.6;color:var(--ss-mut);max-width:70ch}
.ss-pt-prices + .ss-pt-terms + .ss-pills{margin-top:var(--ss-space-m)}

/* questions */
.ss-pt-faq{margin-top:var(--ss-space-m);border-top:1px solid var(--ss-line)}
.ss-pt-faq details{border-bottom:1px solid var(--ss-line)}
.ss-pt-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--ss-space-s);padding:var(--ss-space-s) 0;font-family:var(--ss-display);font-weight:600;font-size:var(--ss-step-0);line-height:1.35;color:var(--ss-ink)}
.ss-pt-faq summary::-webkit-details-marker{display:none}
.ss-pt-faq summary::after{content:"";flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--ss-sky-soft);background:linear-gradient(var(--ss-sky-d),var(--ss-sky-d)) center/12px 1.6px no-repeat,linear-gradient(var(--ss-sky-d),var(--ss-sky-d)) center/1.6px 12px no-repeat;transition:transform .3s var(--ss-ease)}
.ss-pt-faq details[open] summary::after{transform:rotate(45deg);background-color:var(--ss-sky-pale)}
.ss-pt-faq .ss-pt-ans{padding:0 0 var(--ss-space-s);font-size:var(--ss-step-0);line-height:1.6;max-width:65ch}
.ss-pt-faq .ss-pt-ans p + p,.ss-pt-faq .ss-pt-ans ul{margin-top:var(--ss-space-2xs)}
.ss-pt-faq .ss-pt-ans ul{padding-left:1.1em}
.ss-pt-faq .ss-pt-ans li{padding:3px 0}

/* read next: pills only */
.ss-pt-next{margin-top:var(--ss-space-xl)}
.ss-pt-next .ss-pills{margin-top:var(--ss-space-xs)}
.ss-pt-links{list-style:none;margin:var(--ss-space-2xs) 0 0;padding:0}
.ss-pt-links li{border-bottom:1px solid var(--ss-line-2)}
.ss-pt-links a{display:flex;justify-content:space-between;align-items:center;gap:var(--ss-space-s);min-height:52px;padding:var(--ss-space-2xs) 0;font-weight:600;font-size:var(--ss-step-0);line-height:1.35;text-decoration:none}
.ss-pt-links a::after{content:"";flex:none;width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}
.ss-pt-links + .ss-eyebrow{margin-top:var(--ss-space-l)}
@media (max-width:640px){.ss-pt-next .ss-pills .ss-pill{flex:0 1 auto}}

/* in-text links and text inside the template win over the site's Additional CSS */
body.ss-cs .ss-pt p,body.ss-cs .ss-pt li,body.ss-cs .ss-pt span,body.ss-cs .ss-pt div,body.ss-cs .ss-pt figcaption{font-family:var(--ss-body)!important}
body.ss-cs .ss-pt summary,body.ss-cs .ss-pt .ss-pt-amt,body.ss-cs .ss-pt figcaption b{font-family:var(--ss-display)!important}
body.ss-cs .ss-pt .ss-pt-amt small{font-family:var(--ss-body)!important}
body.ss-cs .ss-pt a:not(.ss-pill){color:var(--ss-sky-d)!important}
/* motion (only when the visitor allows it; content never depends on it) */
@media (prefers-reduced-motion:no-preference){
  /* wide screens: the hero stays put and eases back while the next section slides over it */
  @media (min-width:900px){html.ss-js .ss-pt-hero{position:sticky;top:var(--ss-hh);z-index:0}}
  .ss-pt .ss-scene{z-index:1}
  /* cards in a row arrive one after another */
  html.ss-js .ss-pt-papers > .ss-rv:nth-child(2),html.ss-js .ss-pt-prices > .ss-rv:nth-child(2){transition-delay:.12s}
  html.ss-js .ss-pt-papers > .ss-rv:nth-child(3),html.ss-js .ss-pt-prices > .ss-rv:nth-child(3){transition-delay:.24s}
  /* questions open softly */
  .ss-pt-faq details{interpolate-size:allow-keywords}
  .ss-pt-faq details::details-content{block-size:0;overflow:hidden;opacity:0;transition:block-size .5s var(--ss-ease),opacity .4s var(--ss-ease),content-visibility .5s allow-discrete}
  .ss-pt-faq details[open]::details-content{block-size:auto;opacity:1}
  /* paperwork lifts a little under the finger or pointer */
  .ss-pt-paper{transition:transform .35s var(--ss-ease),box-shadow .35s var(--ss-ease),border-color .35s}
  .ss-pt-paper:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(11,29,38,.08);border-color:var(--ss-sky-soft)}
}
@media (prefers-reduced-motion:reduce){.ss-pt-faq summary::after{transition:none}}

/* office screens (laptop crops) and placeholders for material still to come */
.ss-pt-screen{margin:0;background:#fff;border:1px solid var(--ss-line);border-radius:18px;padding:var(--ss-space-2xs);box-shadow:0 24px 50px rgba(11,29,38,.08)}
.ss-pt-screen img{width:100%;border-radius:10px}
.ss-pt-todo{display:inline;background:#FCE7F2;color:#A3236C;border-radius:6px;padding:1px 6px;font-weight:600}
.ss-pt-phone--empty{aspect-ratio:300/604;display:grid;place-items:center;background:linear-gradient(180deg,#F0F9FD,#fff);color:var(--ss-mut);text-align:center;font-size:15px;line-height:1.45;padding:var(--ss-space-m)}
.ss-pt-phone--empty span{display:block;border:1.5px dashed var(--ss-sky-soft);border-radius:18px;padding:var(--ss-space-s)}
.ss-pt-paper--empty .ss-pt-crop{display:grid;place-items:center;background:var(--ss-mist);color:var(--ss-mut);font-size:15px;border-style:dashed}

/* ---------- RECIPE LOOK (approved premium product recipe): add class ss-pt--recipe to .ss-pt ----------
   centred full hero, display headline, counting number tiles, laptop and phone pair that tilt up, more air. */
.ss-pt-stats,.ss-pt-devices{display:none}
.ss-pt--recipe .ss-pt-stats{display:grid}
.ss-pt--recipe .ss-pt-devices{display:block}
.ss-pt--recipe .ss-pt-hero-fig{display:none}
.ss-pt--recipe .ss-pt-hero{text-align:center;padding-block:var(--ss-space-2xl) var(--ss-space-3xl)}
@media (min-width:900px){.ss-pt--recipe .ss-pt-hero{min-height:calc(92svh - var(--ss-hh));display:flex;align-items:center}}
.ss-pt--recipe .ss-pt-hero-grid{grid-template-columns:minmax(0,1fr)!important;justify-items:center;width:100%}
.ss-pt--recipe .ss-pt-hero .ss-h1{font-size:var(--ss-step-5);line-height:1.03;letter-spacing:-.04em!important;max-width:17ch;margin-inline:auto}
.ss-pt--recipe .ss-pt-hero .ss-lead{margin-inline:auto;max-width:40rem}
.ss-pt--recipe .ss-pt-hero .ss-pills{justify-content:center}
.ss-pt--recipe .ss-pt-price,.ss-pt--recipe .ss-pt-alt{margin-inline:auto}
.ss-pt--recipe .ss-pt-hero .ss-eyebrow{margin-inline:auto}
.ss-pt-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ss-space-xs);margin:var(--ss-space-l) auto 0;max-width:780px;width:100%}
.ss-pt-stat{background:rgba(255,255,255,.75);border:1px solid var(--ss-line);border-radius:22px;padding:var(--ss-space-s);text-align:center}
.ss-pt-stat b{display:block;font-family:var(--ss-display);font-weight:600;font-size:var(--ss-step-3);letter-spacing:-.03em;line-height:1;color:var(--ss-ink)}
.ss-pt-stat span{display:block;margin-top:var(--ss-space-2xs);font-size:14px;line-height:1.4;color:var(--ss-mut)}
@media (max-width:640px){.ss-pt-stats{grid-template-columns:minmax(0,1fr);gap:var(--ss-space-2xs)}.ss-pt-stat{display:flex;align-items:baseline;gap:var(--ss-space-xs);text-align:left;padding:var(--ss-space-xs) var(--ss-space-s)}.ss-pt-stat span{margin:0}}
.ss-pt--recipe .ss-section{padding-block:var(--ss-space-3xl)}
.ss-pt--recipe .ss-h2{font-size:var(--ss-step-3);line-height:1.08}
/* laptop and phone pair */
.ss-pt-devices .ss-pt-head{text-align:center;margin-inline:auto}
.ss-pt-pair{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:var(--ss-space-l);align-items:end;margin-top:var(--ss-space-xl);perspective:1600px}
@media (max-width:760px){.ss-pt-pair{grid-template-columns:minmax(0,1fr);justify-items:center;gap:var(--ss-space-m)}.ss-pt-pair .ss-pt-phone{width:min(62vw,230px)}}
.ss-pt-pair .ss-pt-phone{width:250px}
.ss-pt-laptop{width:100%}
.ss-pt-laptop .ss-pt-lscr{border:10px solid #1B2A33;border-bottom-width:14px;border-radius:18px 18px 6px 6px;background:#fff;overflow:hidden}
.ss-pt-laptop .ss-pt-lscr img{width:100%;display:block}
.ss-pt-laptop .ss-pt-base{height:14px;margin:0 -4%;background:linear-gradient(#C9D6DC,#AEBEC6);border-radius:0 0 16px 16px}
.ss-pt-lempty{aspect-ratio:16/10;display:grid;place-items:center;color:var(--ss-mut);font-size:15px;background:linear-gradient(180deg,#F0F9FD,#fff)}
/* recipe: what it does - four cards, two across from tablets */
.ss-pt-h1em{font-style:normal;color:var(--ss-sky)}
body.ss-cs .ss-pt .ss-pt-h1em{color:var(--ss-sky)!important;font-family:inherit!important}
.ss-pt-feat{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ss-space-s);margin-top:var(--ss-space-l)}
@media (min-width:760px){.ss-pt-feat{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ss-space-m)}}
.ss-pt-fcard{background:#fff;border:1px solid var(--ss-line);border-radius:26px;padding:var(--ss-space-m)}
.ss-pt-fcard .ss-pt-ticks{margin-top:var(--ss-space-xs)}
.ss-pt-fcard .ss-pt-ticks li{font-size:16px}
.ss-pt--recipe .ss-pt-papers{margin-top:var(--ss-space-l)}

.ss-pt-terms + .ss-pills{margin-top:var(--ss-space-m)}
.ss-pt--recipe .ss-pt-hero .ss-pt-price{max-width:46ch}
/* phones: the recipe headline one step smaller so it stays within four lines */
@media (max-width:640px){.ss-pt--recipe .ss-pt-hero .ss-h1{font-size:var(--ss-step-4)}}

/* ---------- PHONE BUILD (Eddie, 2 Nov: "rebuild it for mobile for every webpage") ----------
   Below 640px each section is laid out for the phone, not squeezed from the laptop. */
@media (max-width:640px){
  /* hero: first sentence of the lead only, compact number tiles in one row */
  .ss-pt-more{display:none}
  .ss-pt--recipe .ss-pt-hero{padding-block:var(--ss-space-l) var(--ss-space-2xl)}
  .ss-pt-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:var(--ss-space-m)}
  .ss-pt-stat{display:block;text-align:center;padding:12px 6px;border-radius:16px}
  .ss-pt-stat b{font-size:var(--ss-step-2)}
  .ss-pt-stat span{margin-top:4px;font-size:14px;line-height:1.3}
  /* laptop screens are unreadable at phone size: the phone screen stands alone */
  .ss-pt-pair .ss-pt-laptop{display:none}
  .ss-pt-pair{margin-top:var(--ss-space-m)}
  .ss-pt-pair .ss-pt-phone{width:min(64vw,250px)}
  /* section rhythm: 64px between sections, 24px inside */
  .ss-pt--recipe .ss-section{padding-block:var(--ss-space-2xl)}
  .ss-pt--recipe .ss-h2{font-size:var(--ss-step-2)}
  /* four cards become one swipe row with the next card peeking, never a stacked wall */
  .ss-pt-feat{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:84%;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;padding-bottom:var(--ss-space-2xs);margin-inline:calc(var(--ss-space-s) * -1);padding-inline:var(--ss-space-s);scroll-padding-inline:var(--ss-space-s)}
  .ss-pt-fcard{scroll-snap-align:start;padding:var(--ss-space-s);align-self:start}
  .ss-pt-papers{margin-inline:calc(var(--ss-space-s) * -1);padding-inline:var(--ss-space-s);scroll-padding-inline:var(--ss-space-s)}
  /* prices: three slim rows */
  .ss-pt-pcard{padding:var(--ss-space-xs) var(--ss-space-s)}
  .ss-pt-amt{font-size:var(--ss-step-2)}
  .ss-pt-terms{font-size:14px}
  .ss-pt-faq summary{padding-block:var(--ss-space-xs)}
}
/* a hint that the row swipes: dots under each swipe row, drawn by CSS only */
@media (max-width:640px){.ss-pt-feat::after,.ss-pt-papers::after{content:"";flex:none;width:1px}}

/* v1.3.2 - the site's link underline must not reach the page buttons or the read-next list (approved design has none) */
body.ss-cs .ss-pt a.ss-pill,body.ss-cs .ss-pt .ss-pt-links a,body.ss-cs .ss-pt .ss-pt-paper > a{text-decoration:none!important}

/* v1.3.3 - room under the footer small print for floating buttons on phones */
@media (max-width:640px){.ss-ftr{padding-bottom:calc(var(--ss-space-3xl) + 64px)}}


/* v1.3.4 - footer name: full width, on the bottom edge, letters rise into colour (Eddie, 2 Nov: option 2 "Letters rise") */
.ss-ftr{container-type:inline-size;padding-bottom:0!important}
.ss-word{display:block;margin:var(--ss-space-xl) 0 0;padding:0 0 .06em;font-weight:800;letter-spacing:-.055em;font-size:13.1vw;font-size:13.1cqw;line-height:.8;white-space:nowrap;text-align:center;overflow:hidden;color:#D5EAF2;user-select:none}
body.ss-cs .ss-word,body.ss-cs .ss-word span{font-family:var(--ss-display)!important;font-weight:800!important}
.ss-word span{display:inline-block}
body.ss-cs .ss-word span{color:var(--c)!important}
.ss-word .sp{width:.22em}
@media (prefers-reduced-motion:no-preference){
  html.ss-js .ss-word span{transition:transform .9s var(--ss-ease),color .9s ease;transition-delay:var(--d,0s)}
  html.ss-js body.ss-cs .ss-word:not(.is-in) span{transform:translateY(38%);color:#D5EAF2!important}
}


/* v1.3.5 - FLOATING GLASS HEADER (Eddie, 2 Nov: "floating glass"): one rounded glass bar inset from the edges */
body.ss-cs .ss-hdr{position:sticky;top:12px;margin:12px auto 0;width:calc(100% - 32px);max-width:1180px;border-radius:999px;background:rgba(255,255,255,.62);-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);border:1px solid rgba(5,147,198,.16);box-shadow:0 10px 30px rgba(11,29,38,.07)}
body.ss-cs .ss-hdr.is-scrolled{background:rgba(255,255,255,.82);border-color:rgba(5,147,198,.20);box-shadow:0 14px 34px rgba(11,29,38,.10)}
body.ss-cs.admin-bar .ss-hdr{top:44px}
@media (max-width:782px){body.ss-cs.admin-bar .ss-hdr{top:58px}}
body.ss-cs .ss-hdr .ss-wrap{max-width:none;padding-inline:10px 8px}
body.ss-cs .ss-hdr-in{height:58px}
body.ss-cs .ss-brand img{width:32px;height:32px}
body.ss-cs .ss-nav{gap:24px}
@media (max-width:900px){body.ss-cs .ss-hdr{border-radius:22px}body.ss-cs .ss-mnav{top:66px;border-radius:20px;border:1px solid var(--ss-line)}}
/* text scrolling up past the floating glass goes soft, so nothing shows sharp in the gaps around the bar (Eddie, 2 Nov) */
body.ss-cs::after{content:"";position:fixed;top:0;left:0;right:0;height:96px;z-index:899;pointer-events:none;background:linear-gradient(180deg,rgba(252,255,255,.55),rgba(252,255,255,0));-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent)}
body.ss-cs.admin-bar::after{top:32px}
@media (max-width:782px){body.ss-cs.admin-bar::after{top:46px}}

/* v1.3.5 - the theme's back-to-top button lifts clear of the footer name (Eddie, 2 Nov: "lift it") */
#ast-scroll-top{transition:transform .35s var(--ss-ease)}
html.ss-word-on #ast-scroll-top{transform:translateY(calc(-1 * var(--ss-wordh,150px)))}
@media (prefers-reduced-motion:reduce){#ast-scroll-top{transition:none}}

/* 1.3.7 headline word rise */
@media (prefers-reduced-motion:no-preference){html:not(.ss-words-done) [data-ss-split], html:not(.ss-words-done) .ss-pt-hero .ss-h1, html:not(.ss-words-done) .ss-hz h1{opacity:0;animation:ss-wshow 0s 1.4s forwards}ss-w{display:inline-block}ss-w,[data-ss-w]{opacity:0;transform:translateY(.32em);animation:ss-wrise .62s cubic-bezier(.22,.61,.36,1) forwards;animation-delay:calc(var(--i) * 42ms)}}@keyframes ss-wrise{to{opacity:1;transform:none}}@keyframes ss-wshow{to{opacity:1}}
/* 1.3.8 seamless sections: no card edges, lines or shadows - each section fades and softly blurs in over the one above */
.ss-scene,.ss-ftr{border-radius:0!important;box-shadow:none!important}
.ss-scene{margin-top:0!important}
.ss-ftr{margin-top:0!important}
.ss-scene--mist{background:linear-gradient(180deg,var(--ss-white) 0,var(--ss-mist) 120px,var(--ss-mist) calc(100% - 120px),var(--ss-white) 100%)}
.ss-scene--sky{background:linear-gradient(180deg,var(--ss-white) 0,#E9F6FB 140px,var(--ss-white) 100%)}
.ss-ftr{background:linear-gradient(180deg,var(--ss-white) 0,var(--ss-mist) 120px,#EAF6FB 100%)}
.ss-scene::before,.ss-ftr::before{content:"";position:absolute;left:0;right:0;top:-88px;height:88px;pointer-events:none;z-index:0;background:linear-gradient(180deg,rgba(252,255,255,0),var(--ss-white));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);-webkit-mask-image:linear-gradient(180deg,transparent,#000);mask-image:linear-gradient(180deg,transparent,#000)}
/* 1.3.9 (3 Nov 2026) - seamless pass */
/* Homepage hero melts into the page: the horizon glow fades out before the hero ends, and the sky ends in white */
body.ss-cs .ss-hz{background:linear-gradient(180deg,#FCFFFF 0%,#F2FAFD 50%,#E6F4FA 76%,#FCFFFF 100%)!important}
body.ss-cs .ss-hz::before{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 14%,transparent 36%);mask-image:linear-gradient(180deg,#000 0%,#000 14%,transparent 36%)}
/* Journal post buttons in the Clear Sky look: sky pill, readable outline, never wider than the screen */
body.ss-cs.single-post .entry-content .wp-block-buttons{gap:12px}
body.ss-cs.single-post .entry-content .wp-block-button{margin:0!important;max-width:100%}
body.ss-cs.single-post .entry-content .wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;max-width:100%;box-sizing:border-box;white-space:normal;text-align:center;min-height:48px;padding:12px 24px!important;border-radius:999px!important;background:var(--ss-sky-d)!important;color:#fff!important;border:1.5px solid var(--ss-sky-d)!important;font-weight:600;text-decoration:none!important}
body.ss-cs.single-post .entry-content .is-style-outline .wp-block-button__link{background:transparent!important;color:var(--ss-sky-d)!important}