/* Brandable design tokens. All visible text and layout are real HTML/CSS.
   Photo crops reuse the approved concept image without rasterizing the page.
   v1 upgrade: real type (Figtree/Caveat), additive motion layer, targeted glass. */
:root{--blue:#0648df;--ink:#090909;--white:#fff;--orange:#ff6b27;--pink:#f2bed5;--line:#ededed;--content:1320px;
  /* sampled off the hero film's own card stock (flat top faces, 2026-09-07).
     The existing --blue and --orange were already within 6 of the real thing,
     so they are untouched; these are the colours the site did not have. */
  --cyan:#1ECBF2;/* the card stock itself; only 1.93:1 on white, never use it for text */
  --cyan-ink:#0EA1C2;/* same hue at 80% brightness = 3.05:1, the readable version */
  /* The services band, as a set. Change all four together, never just --band.
     COBALT (current). Restored after cyan was tried: the Banners & Tradeshow tile
     directly above it is turquoise, and a cyan band ran into it so the section
     boundary dissolved. Cobalt separates them and gives the page its only dark
     anchor. Ink only makes 2.84:1 here, hence white type.
       --band:#0648df; --band-fg:#fff; --band-line:#ffffff55; --band-glow:rgba(255,255,255,.30)
     LIGHT SATURATED alternative (cyan / lavender #B491EA / mint #90E1B2 / yellow
     #FDE245) - these take INK type, and the glow must flip to white-on-colour:
       --band:#1ECBF2; --band-fg:#090909; --band-line:rgba(9,9,9,.18); --band-glow:rgba(255,255,255,.34)
     Beware any cyan or mint value while the turquoise banner tile sits above. */
  --band:#0648df;
  --band-fg:#fff;
  --band-line:#ffffff55;
  --band-glow:rgba(255,255,255,.30);
  --magenta:#FA3683;--lavender:#B491EA;--yellow:#FDE245;--mint:#90E1B2;
  --sans:'Figtree',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --script:'Caveat','Segoe Script','Snell Roundhand',cursive}

/* Registered custom properties let drift + tilt animate on the compositor and compose
   with the hover lift instead of overwriting it. Falls back to plain vars if unsupported. */
@property --drift{syntax:'<length>';inherits:true;initial-value:0px}
@property --tiltX{syntax:'<angle>';inherits:false;initial-value:0deg}
@property --tiltY{syntax:'<angle>';inherits:false;initial-value:0deg}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:104px}
/* GOTCHA: html AND body both scrolling-hidden breaks position:sticky. body uses clip,
   which does not create a scroll container, so the header still sticks. */
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button{border:0}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--orange);outline-offset:5px}
button:disabled{cursor:default;opacity:.6}
h1,h2,h3,p{margin:0}
.wrap{width:min(var(--content),calc(100% - 80px));margin-inline:auto}
.skip-link{position:absolute;top:-100px;left:20px;background:white;padding:14px;z-index:60}
.skip-link:focus{top:10px}

/* ---------- sticky glass header (glass #1: page content passes behind it) ---------- */
.header-bar{position:sticky;top:0;z-index:50;background:transparent;transition:background .3s ease,box-shadow .3s ease,backdrop-filter .3s ease}
.header-bar.scrolled{background:rgba(255,255,255,.72);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);box-shadow:inset 0 -1px 0 rgba(9,9,9,.08)}
/* Header placement follows the approved Automations concept: taller, and the
   nav pushed over to sit beside the call to action rather than floating in the
   middle of the bar. margin-left:auto is what holds it there. */
.header{min-height:112px;display:flex;align-items:center;justify-content:space-between;gap:32px}
.header nav{margin-left:auto;margin-right:40px}
/* real wordmark (brand kit) replaces the type-set logo. Height is set to match the
   cap height the 38px text logo occupied, so header rhythm is unchanged. */
.logo{display:inline-flex;align-items:center;line-height:1}
.logo img{height:29px;width:auto;display:block}
.header nav,.footer nav{display:flex;align-items:center;gap:36px;font-size:16px}
.header nav a:hover,.footer nav a:hover{text-decoration:underline;text-underline-offset:5px}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:16px 26px;border-radius:12px;background:var(--blue);color:white;font-size:16px;font-weight:600;transition:background .2s,transform .2s}
.button:hover{background:#0038b9;transform:translateY(-2px)}
.menu-toggle{display:none}

/* ---------- hero ---------- */
.hero{position:relative;display:grid;grid-template-columns:1fr 1fr;max-width:1440px;margin:auto;overflow:hidden}
html.motion /* one wrapper carries the parallax for EVERY hero element (copy, buttons, note, cue) */
.hero-copy{padding:98px 0 38px max(40px,calc((100vw - 1320px)/2));position:relative;z-index:1;will-change:transform,opacity}
.hero h1{font-size:clamp(44px,4.4vw,66px);letter-spacing:-.065em;line-height:1.01;font-weight:800;white-space:nowrap}
.hero-copy>p:not(.handwritten){font-size:clamp(20px,2vw,27px);line-height:1.32;max-width:540px;letter-spacing:-.035em;margin:32px 10px 27px 0}
.hero-actions{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.hero-actions .button{min-width:182px}
.understated{font-size:16px;border-bottom:1px solid #819adb;padding-block:8px}
.understated span{margin-left:12px}
.handwritten{font-family:var(--script);font-size:30px;line-height:1.06;transform:rotate(-9deg);letter-spacing:0}
.hero-copy>.handwritten{margin:92px 0 15px 12px;max-width:250px}
.scroll-cue{display:flex;align-items:center;gap:12px;margin-top:26px;font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#6a707a}
.scroll-cue-line{width:34px;height:1px;background:#c8ccd3;position:relative;overflow:hidden}
html.motion .scroll-cue-line::after{content:"";position:absolute;inset:0;background:var(--blue);transform:translateX(-100%);animation:cue 2.1s ease-in-out infinite}
@keyframes cue{0%{transform:translateX(-100%)}55%{transform:translateX(100%)}100%{transform:translateX(100%)}}
.photo-crop{position:relative;overflow:hidden;background:#fafafa}
.photo-crop img{position:absolute;max-width:none;height:auto;display:block;pointer-events:none}
.hero-photo{width:100%;align-self:end;z-index:1}

/* glass #3: chips sit over real photography, so there is something to blur */
.chip{position:absolute;left:14px;bottom:14px;z-index:2;padding:7px 13px;border-radius:999px;font-size:13px;font-weight:600;letter-spacing:-.01em;color:var(--ink);background:rgba(255,255,255,.62);backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%);box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 4px 14px rgba(9,9,9,.10)}
.hero-photo .chip{left:auto;right:16px;bottom:16px;padding:9px 14px}
.chip-mark img{height:13px;width:auto;display:block}

.manifesto{text-align:center;padding:31px 24px;border-block:1px solid var(--line);font-size:13px;font-weight:700;letter-spacing:.31em;text-transform:uppercase;line-height:1.6}

/* ---------- print section (gaps: ~96px desktop between sections) ---------- */
.print-section{padding-block:96px 40px}
h2{font-size:clamp(34px,3.75vw,54px);line-height:1.08;letter-spacing:-.055em;font-weight:800}
.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:32px}
/* all three tiles share ONE --drift (set on the grid) so the row moves as a unit and
   no gap between a tile and its own caption text can change while scrolling */
.product-grid .product{transform:translate3d(0,var(--drift),0) perspective(900px) rotateX(var(--tiltX)) rotateY(var(--tiltY));transform-style:preserve-3d}
.product .photo-crop{border-radius:12px;transition:transform .25s}
.photo-crop .photo-link{position:absolute;inset:0;z-index:3}  /* the photo is a click target for its collection; the text link below carries the name */
.product:hover .photo-crop{transform:translateY(-4px)}
.text-link{display:flex;gap:12px;align-items:center;background:none;padding:14px 0 0;text-align:left;font-weight:700;font-size:20px;letter-spacing:-.035em}

/* ---------- services ---------- */
.services{background:var(--band);color:var(--band-fg);padding:56px 0 60px;position:relative;overflow:hidden}
.services-glow{position:absolute;left:50%;top:var(--glow,50%);width:min(760px,92vw);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,var(--band-glow),rgba(255,255,255,0) 62%);opacity:0;transition:opacity .8s ease;pointer-events:none}
html.motion .services-glow{opacity:1}
.services>.wrap{position:relative;z-index:1}
.services-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:32px}
.services-heading h2{max-width:1000px}
.services-heading .handwritten{font-size:26px;flex-shrink:0;color:var(--band-fg)}
.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:72px}
.service-grid article{padding:0 32px;border-right:1px solid var(--band-line);scroll-margin-top:104px}
.service-grid article:first-child{padding-left:0}
.service-grid article:last-child{border-right:0;padding-right:0}
.service-title{display:flex;gap:20px;align-items:center}
.service-title svg{width:38px;height:38px;flex-shrink:0}
.service-title h3{font-size:21px;letter-spacing:-.025em}
.service-grid p{font-size:18px;line-height:1.55;max-width:330px;margin:18px 0 25px}
.service-link{color:var(--band-fg);background:none;border-bottom:1px solid var(--band-fg);padding:0 0 4px;font-size:17px}
.service-link span{margin-left:12px}

.footer{padding-block:48px 44px;display:grid;grid-template-columns:minmax(180px,.9fr) minmax(0,2.3fr) minmax(150px,.85fr) minmax(150px,.85fr);gap:40px 36px;align-items:start;border-top:1px solid var(--line)}
.footer p{font-size:18px;margin-top:14px}
.footer-right{text-align:right}
.footer nav{gap:26px;font-size:14px}
.footer-right p{font-size:14px;margin-top:28px}



/* ---------- product page (Next.js Commerce layout, in white) ---------- */
.product-page{padding-block:28px 96px}
.crumbs{font-size:14px;color:#6a707a;margin-bottom:18px}
.crumbs a:hover{text-decoration:underline;text-underline-offset:4px}
.crumbs span{margin:0 8px;color:#c3c8d0}
.product-shell{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;border:1px solid var(--line);border-radius:20px;padding:26px;background:#fff}
.gallery-main{border-radius:14px;background:#fafafa}
.gallery-thumbs{display:flex;gap:12px;margin-top:12px}
.thumb{width:84px;border-radius:10px;border:2px solid transparent;cursor:pointer;flex:none}
.thumb.is-active{border-color:var(--blue)}
.product-detail h1{font-size:clamp(34px,3.4vw,50px);line-height:1.04;letter-spacing:-.05em;font-weight:800}
.price-pill{display:inline-flex;align-items:center;background:var(--blue);color:#fff;font-weight:700;font-size:18px;
  padding:9px 18px;border-radius:999px;margin-top:16px;letter-spacing:-.02em}
.price-note{font-size:14px;color:#6a707a;margin-top:9px}
.rule{border:0;border-top:1px solid var(--line);margin:22px 0}
.opt-group{margin-bottom:20px}
.opt-label{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#6a707a;margin-bottom:9px}
.opts{display:flex;flex-wrap:wrap;gap:9px}
.opt{background:#fff;border:1px solid #d8dce3;border-radius:999px;padding:9px 17px;font-size:15px;font-weight:600;
  color:var(--ink);transition:border-color .18s,background .18s,transform .18s}
.opt:hover{border-color:var(--blue);transform:translateY(-1px)}
.opt.is-selected{background:var(--blue);border-color:var(--blue);color:#fff}
.opt.no-price{opacity:.72}
.spec{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:7px}
.spec li{font-size:15px;color:#41505e;padding-left:20px;position:relative;line-height:1.45}
.spec li::before{content:"";position:absolute;left:2px;top:8px;width:7px;height:7px;border-radius:50%;background:var(--blue)}
.cta-order{width:100%;margin-top:26px;min-height:58px;border-radius:999px;font-size:17px}
.cta-note{font-size:13px;color:#6a707a;margin-top:12px;line-height:1.5}
.linkish{background:none;padding:0;font:inherit;color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:3px}
@media(max-width:900px){.product-shell{grid-template-columns:1fr;gap:26px;padding:18px}.product-page{padding-block:20px 70px}}

/* ---------- FAQ: chat-style accordion (ported from the 21st.dev FaqAccordion pattern,
   MIT, rebuilt dependency-free — no React/framer-motion/radix). Hearts only, no star. ---------- */
.faq{padding-block:36px 56px}
.faq-time{text-align:center;font-size:13px;font-weight:600;color:#8b919b;letter-spacing:-.01em;margin-top:14px}
.faq-list{display:grid;gap:14px;max-width:760px;margin:34px auto 0}
.faq-item{position:relative}
.faq-row{display:flex;align-items:center;gap:12px}
.faq-q{position:relative;display:inline-flex;align-items:center;gap:10px;background:#f2f3f5;color:var(--ink);
  padding:15px 22px;border-radius:22px 22px 22px 6px;font-size:17px;font-weight:600;letter-spacing:-.02em;
  line-height:1.3;text-align:left;transition:background .2s,transform .2s}
.faq-q:hover{background:#e9ebee;transform:translateY(-1px)}
.faq-item.open .faq-q{background:var(--ink);color:#fff}
/* heart badge pinned to the bubble corner, like the original's icon slot */
.heart{position:absolute;top:-11px;right:-8px;font-size:19px;line-height:1;transform:rotate(9deg);pointer-events:none}
.faq-toggle{position:relative;flex:none;width:22px;height:22px;opacity:.55;transition:opacity .2s,transform .3s cubic-bezier(.2,.7,.2,1)}
.faq-toggle::before,.faq-toggle::after{content:"";position:absolute;left:50%;top:50%;background:var(--ink);border-radius:2px;transform:translate(-50%,-50%)}
.faq-toggle::before{width:15px;height:2px}
.faq-toggle::after{width:2px;height:15px;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.faq-item.open .faq-toggle{opacity:1;transform:rotate(180deg)}
.faq-item.open .faq-toggle::after{transform:translate(-50%,-50%) scaleY(0)}
.faq-q:hover + .faq-toggle{opacity:1}
/* answer arrives as the reply bubble on the other side */
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s cubic-bezier(.2,.7,.2,1);margin-top:0}
.faq-item.open .faq-a{grid-template-rows:1fr;margin-top:10px}
.faq-a>div{overflow:hidden}
.faq-a p{background:var(--blue);color:#fff;padding:15px 22px;border-radius:22px 22px 6px 22px;font-size:16px;
  line-height:1.5;max-width:86%;margin-left:auto;opacity:0;transform:translateY(6px);
  transition:opacity .3s ease .06s,transform .3s ease .06s}
.faq-item.open .faq-a p{opacity:1;transform:none}

/* ---------- reveals: hidden ONLY when motion is on, so reduced-motion sees everything ---------- */
html.motion .reveal{opacity:0;transform:translate3d(0,26px,0)}
html.motion .reveal.in{opacity:1;transform:none;transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0ms)}

/* ---------- dialogs (glass #2) + forms ---------- */
dialog{border:0;border-radius:18px;padding:44px;width:min(560px,calc(100% - 32px));max-height:88vh;overflow:auto;color:var(--ink);background:rgba(255,255,255,.86);backdrop-filter:blur(22px) saturate(180%);-webkit-backdrop-filter:blur(22px) saturate(180%);box-shadow:0 24px 100px #0003}
dialog::backdrop{background:#00103980;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
dialog h2{font-size:36px;margin:16px 0;letter-spacing:-.04em}
dialog>p,.dialog-lede{font-size:18px;line-height:1.5}
.eyebrow{letter-spacing:.2em;font-weight:bold;color:var(--blue);font-size:13px!important}
.close-dialog{position:absolute;right:16px;top:10px;font-size:32px;background:none;padding:5px 10px;line-height:1}
.inquiry-form{margin-top:26px;display:grid;gap:18px}
.field{display:grid;gap:7px;border:0;padding:0;margin:0;min-width:0}
.field label,.field legend{font-size:14px;font-weight:600;letter-spacing:-.01em;padding:0}
.field input,.field textarea{width:100%;font:inherit;font-size:16px;padding:13px 14px;border:1px solid #d8dce3;border-radius:10px;background:rgba(255,255,255,.9);color:var(--ink)}
.field input:focus,.field textarea:focus{border-color:var(--blue);outline-offset:2px}
.field textarea{resize:vertical}
.field.invalid input,.field.invalid textarea{border-color:#c0271e;background:#fff6f5}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;margin-top:2px}
.check{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:400}
.check input{width:18px;height:18px;accent-color:var(--blue)}
.error{font-size:13px;color:#c0271e;min-height:0}
.error:empty{display:none}
.form-status{font-size:14px;min-height:0}
.form-status:empty{display:none}
.form-status.err{color:#c0271e}
.submit{width:100%;margin-top:4px}
.form-success h3{font-size:26px;letter-spacing:-.03em;margin-bottom:10px}
.form-success p{font-size:17px;line-height:1.5;margin-bottom:22px}

@media(min-width:1440px){.hero-copy{padding-left:60px}}
@media(max-width:1100px){.header nav{gap:20px}.header{gap:20px}.hero-copy{padding-top:65px}.hero-copy>.handwritten{margin-top:64px}.hero-actions{gap:16px}.hero-actions .button{min-width:auto}.services-heading .handwritten{display:none}.service-grid article{padding-inline:22px}.service-title{gap:12px}.service-title h3{font-size:19px}}
@media(max-width:800px){.wrap{width:calc(100% - 40px)}.header{min-height:78px;flex-wrap:wrap;gap:16px;position:relative}.logo img{height:25px}.header-cta{display:none}.menu-toggle{display:flex;align-items:center;gap:12px;background:none;padding:12px 0;font-size:16px}.header nav{display:none;flex-basis:100%;padding:0 0 22px;justify-content:space-between;gap:12px;margin-left:0;margin-right:0}.header nav.open{display:flex}.header-bar.nav-open{background:rgba(255,255,255,.92);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}.hero{display:flex;flex-direction:column}.hero-copy{padding:42px 20px 32px}.hero h1{font-size:clamp(39px,7.6vw,62px);white-space:normal}.hero-copy>p:not(.handwritten){max-width:530px;font-size:22px;margin:24px 0}.hero-copy>.handwritten{display:none}.hero-actions{gap:20px}.scroll-cue{margin-top:22px}.hero-photo{max-height:620px;aspect-ratio:483/568!important;width:100%}.manifesto{font-size:12px;letter-spacing:.18em;padding:24px 20px}
  /* ~70px section gaps on mobile */
  .print-section{padding-block:70px 30px}.services{padding:40px 0 44px}.faq{padding-block:26px 30px}.faq-q{font-size:16px;padding:13px 18px}.faq-a p{max-width:100%;font-size:15px}.faq-list{gap:12px}
  .product-grid{gap:16px}.text-link{font-size:17px;line-height:1.3}.service-grid{margin-top:36px;grid-template-columns:1fr;gap:28px}.service-grid article,.service-grid article:first-child,.service-grid article:last-child{padding:0 0 28px;border-right:0;border-bottom:1px solid var(--band-line)}.service-grid article:last-child{border-bottom:0;padding-bottom:0}.service-grid p{max-width:100%;margin:12px 0 16px}.service-title h3{font-size:22px}.footer{flex-direction:column}.footer-right{text-align:left}.footer nav{flex-wrap:wrap;gap:22px}.footer-right p{margin-top:20px}.checks{grid-template-columns:1fr}}
@media(max-width:520px){.product-grid{grid-template-columns:1fr;gap:28px}.text-link{font-size:20px}.hero-actions{align-items:flex-start;flex-direction:column;gap:12px}.hero-actions .button{min-width:174px}.hero-copy{padding-top:28px}.print-section h2{font-size:36px}.services-heading h2{font-size:37px}.manifesto{letter-spacing:.14em}.footer nav{gap:18px}dialog{padding:32px 24px}dialog h2{font-size:30px}}

/* Reduced motion: no orbs, no reveals, no drift — the complete static site renders. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
    .reveal{opacity:1!important;transform:none!important}
  .product-grid .product{transform:none!important}
  .hero-copy{transform:none!important;opacity:1!important}
  .faq-a{transition:none!important}
  .faq-item.open .faq-a p{opacity:1;transform:none}
}

/* ---------------------------------------------------------------------------
   PITCH + CARD DECK — bold statement under the hero, then a fanned deck of the
   six things we make. The fan is the point: a print company should look like it
   is holding a hand of its own cards.
   Type scale is deliberately restrained. The reference that inspired this ran a
   164px headline; the owner's note was that it reads way too big.
--------------------------------------------------------------------------- */
/* Order is headline -> cards -> blurb -> CTA. The copy is split across two
   wrappers around the deck, so the paragraph and button rules live on
   .pitch-foot, not .pitch-head. */
.pitch{padding:104px 0 clamp(72px,7vw,104px);overflow:hidden}
.pitch-head,.pitch-foot{text-align:center;max-width:860px}
.pitch-head h2{font-size:clamp(34px,5.2vw,68px);line-height:1.02;letter-spacing:-.055em;font-weight:900}
.pitch-foot>p{margin:0 auto;max-width:610px;font-size:clamp(17px,1.35vw,20px);line-height:1.5;color:#3d3d3d}
.pitch-foot>.button{margin-top:30px}

.deck{--ovl:clamp(18px,2.4vw,38px);
  display:flex;justify-content:center;align-items:flex-start;list-style:none;
  margin:clamp(38px,4.4vw,60px) 0 0;padding:0 24px clamp(40px,4.4vw,58px)}
.deck-card{flex:0 0 auto;width:clamp(132px,15.4vw,226px)}
.deck-card+.deck-card{margin-left:calc(-1 * var(--ovl))}
.deck-inner{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;
  width:100%;aspect-ratio:250/342;border:0;text-align:center;cursor:pointer;
  /* the right edge of every card but the last is covered by its neighbour, so the
     content is padded off it and reads centred within the VISIBLE part of the card */
  padding:22px calc(16px + var(--ovl)) 22px 16px;
  border-radius:26px;background:var(--bg);color:var(--fg);text-decoration:none;font:inherit;
  position:relative;z-index:var(--z,1);
  transform:rotate(var(--rot)) translateY(var(--lift));
  box-shadow:0 18px 34px rgba(9,14,38,.14),0 2px 6px rgba(9,14,38,.08);
  transition:transform .42s cubic-bezier(.2,.75,.25,1),box-shadow .42s cubic-bezier(.2,.75,.25,1)}
.deck-card:last-child .deck-inner{padding-right:16px}

.deck-label{font-size:clamp(17px,1.6vw,25px);font-weight:900;line-height:1.03;letter-spacing:-.035em}
.deck-note{font-size:12.5px;line-height:1.35;opacity:.72;max-width:15ch}
/* white-on-colour cards: the small note is the weakest contrast on the card,
   so it carries a little more weight and less transparency to hold up */
.deck-bc .deck-note,.deck-pf .deck-note{font-weight:500;opacity:.92}
.deck-card:hover,.deck-card:focus-within{z-index:9}
.deck-card:hover .deck-inner,.deck-inner:focus-visible{
  transform:rotate(0deg) translateY(calc(var(--lift) - 26px)) scale(1.045);
  box-shadow:0 34px 60px rgba(9,14,38,.2),0 3px 10px rgba(9,14,38,.1)}
.deck-inner:focus-visible{outline:3px solid var(--ink);outline-offset:4px}

/* Each card's colour is sampled from its own photograph's backdrop, so the photo
   and the card below it are literally the same colour and the join is invisible.
   Label colour is whichever of ink/white measures higher against that backdrop. */
.deck-bc .deck-inner{--bg:#0656EB;--fg:#ffffff}   /* white 5.9:1 */
.deck-pf .deck-inner{--bg:#FC338B;--fg:#ffffff}   /* white 3.5:1 - clears the 3:1 bar for the label */
.deck-sl .deck-inner{--bg:#FDE333;--fg:#090909}   /* ink 15.4:1 */
.deck-gd .deck-inner{--bg:#BA93E7;--fg:#090909}   /* ink 8.0:1 */
.deck-wb .deck-inner{--bg:#1EE3FD;--fg:#090909}   /* ink 12.8:1 */
.deck-au .deck-inner{--bg:#8BE4B3;--fg:#090909}   /* ink 13.1:1 */

/* The reveal system sets `transform:none` on `.reveal.in`, which would flatten
   the fan. The rotation therefore lives on .deck-inner, never on .deck-card. */

@media(max-width:900px){
  .pitch{padding-top:74px;padding-bottom:74px}
  .deck{flex-wrap:wrap;justify-content:center;gap:16px;margin-top:38px;padding-bottom:40px;max-width:520px;
    margin-inline:auto}
  .deck-card{width:calc(50% - 8px)}
  .deck-card+.deck-card{margin-left:0}
  /* The deck photos are 1254x1715 - exactly 250/342. Squaring the card up on a
     phone cropped the bottom of the frame away, which is what pushed the label
     onto the artwork on the banner, the brand book, the postcards and the robot.

     250/324 is a measured floor, not a taste call: at a 165px card the label band
     is 56px, so the crop puts the label at 70% of the photo while the lowest
     subject (the brand book and the robot) ends at 64%. 250/300 lands the label
     AT 63% and the artwork is back underneath it. Do not shorten past ~250/310. */
  .deck-inner{transform:rotate(var(--mrot,0deg));aspect-ratio:250/324;padding:22px 16px}
  .deck-card:nth-child(odd) .deck-inner{--mrot:-1.6deg}
  .deck-card:nth-child(even) .deck-inner{--mrot:1.6deg}
  .deck-card:hover .deck-inner,.deck-inner:focus-visible{transform:rotate(0deg) translateY(-8px) scale(1.03)}
}
@media(max-width:520px){
  .pitch-head>p{font-size:16px}
  .deck-note{display:none}
  .deck-inner{aspect-ratio:250/324;padding:18px 16px}
}
@media(prefers-reduced-motion:reduce){
  .deck-inner{transition:none}
}

/* ---------------------------------------------------------------------------
   FAQ LIVE — phone on the left mirroring the thread, a tap cursor that opens
   the questions on its own until a real visitor takes over, and livestream
   hearts rising out of the phone. Decorative: the phone duplicates the
   accordion's content, so it is aria-hidden and the accordion stays the
   accessible source of truth. All of it is off under reduced motion.
--------------------------------------------------------------------------- */
.faq-shell{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);
  gap:clamp(28px,4.5vw,72px);align-items:start;max-width:1080px;margin:38px auto 0}
.faq-shell .faq-list{margin:0;max-width:none}

.faq-device{position:relative;flex:none;align-self:start;padding-top:6px}
.phone{position:relative;width:clamp(208px,19vw,252px);aspect-ratio:250/452;
  background:linear-gradient(160deg,#1c1c20,#090909 46%,#26262c);
  border-radius:40px;padding:9px;
  box-shadow:0 30px 60px rgba(9,14,38,.26),0 4px 12px rgba(9,14,38,.14),
             inset 0 0 0 1.5px rgba(255,255,255,.14)}
.phone-notch{position:absolute;top:15px;left:50%;transform:translateX(-50%);
  width:34%;height:20px;background:#090909;border-radius:14px;z-index:3}
.phone-screen{position:relative;width:100%;height:100%;border-radius:32px;background:#fff;
  overflow:hidden;display:flex;flex-direction:column}
.phone-top{flex:none;display:flex;align-items:center;justify-content:center;gap:7px;
  padding:26px 12px 11px;font-size:13px;font-weight:800;letter-spacing:-.02em;
  border-bottom:1px solid #eff0f2;background:#fff}
.phone-live{width:7px;height:7px;border-radius:50%;background:#ff3b30;flex:none}
.phone-livetag{font-size:9px;font-weight:900;letter-spacing:.12em;color:#ff3b30;margin-left:-2px}
html.motion .phone-live{animation:phlive 1.7s ease-in-out infinite}
@keyframes phlive{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.78)}}
.phone-chat{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:7px;
  padding:12px 11px 15px;overflow:hidden}
.phone-msg{max-width:84%;padding:9px 12px;font-size:11.5px;line-height:1.35;letter-spacing:-.01em;
  border-radius:15px 15px 15px 5px;background:#f2f3f5;color:var(--ink);
  animation:phpop .34s cubic-bezier(.2,.8,.3,1) both}
.phone-msg.q{background:var(--ink);color:#fff;font-weight:600;align-self:flex-start}
.phone-msg.a{background:var(--blue);color:#fff;align-self:flex-end;border-radius:15px 15px 5px 15px}
@keyframes phpop{from{opacity:0;transform:translateY(9px) scale(.96)}to{opacity:1;transform:none}}

/* hearts in the chat, rising out of the phone's right edge */
.hearts{position:absolute;left:100%;margin-left:-32px;bottom:46px;width:72px;height:330px;
  pointer-events:none;overflow:visible}
.heart-up{position:absolute;bottom:0;left:0;font-size:var(--hs,19px);line-height:1;
  will-change:transform,opacity;animation:heartup var(--hd,3.4s) cubic-bezier(.25,.6,.4,1) forwards}
@keyframes heartup{
  0%{opacity:0;transform:translate3d(0,0,0) scale(.4) rotate(0deg)}
  12%{opacity:1;transform:translate3d(var(--h1,6px),-38px,0) scale(1) rotate(-8deg)}
  55%{opacity:.95;transform:translate3d(var(--h2,26px),-165px,0) scale(1.05) rotate(9deg)}
  100%{opacity:0;transform:translate3d(var(--h3,10px),-310px,0) scale(.72) rotate(-6deg)}}

/* the demo tap indicator */
.faq-cursor{position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;
  background:rgba(9,9,9,.34);border:2px solid rgba(255,255,255,.9);
  box-shadow:0 4px 14px rgba(9,14,38,.3);
  opacity:0;pointer-events:none;z-index:6;
  transform:translate3d(var(--cx,0px),var(--cy,0px),0);
  transition:transform .78s cubic-bezier(.4,0,.2,1),opacity .4s ease}
.faq-cursor.on{opacity:1}
.faq-cursor.tap::after{content:"";position:absolute;inset:-6px;border-radius:50%;
  border:2px solid rgba(6,72,223,.75);animation:tapring .5s ease-out forwards}
@keyframes tapring{from{opacity:.9;transform:scale(.5)}to{opacity:0;transform:scale(1.9)}}
.faq-item.auto .faq-q{transform:translateY(-1px)}

@media(max-width:900px){
  .faq-shell{grid-template-columns:1fr;gap:0;max-width:760px}
  .faq-device,.faq-cursor{display:none}
}
@media(prefers-reduced-motion:reduce){
  .faq-device,.faq-cursor{display:none}
  .faq-shell{grid-template-columns:1fr;max-width:760px}
}

/* ---------------------------------------------------------------------------
   AS SEEN ON — a bordered band in the same family as the manifesto strip.
   Monotone on purpose: a press row should read as a quiet row of names, not a
   parade of brand colours competing with the card deck above it.
   Ships hidden. See the comment on the section in index.html.
--------------------------------------------------------------------------- */
.press[hidden]{display:none!important}
.press{border-block:1px solid var(--line);padding:34px 0}
.press-label{text-align:center;font-size:11px;font-weight:800;letter-spacing:.26em;
  text-transform:uppercase;color:#9aa1ab;margin:0 0 22px}
.press-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:clamp(28px,4.6vw,68px);list-style:none;margin:0;padding:0}
.press-logo{color:#7c8590;font-weight:800;letter-spacing:-.02em;font-size:clamp(17px,1.6vw,23px);
  line-height:1;white-space:nowrap;transition:color .25s}
.press-row:hover .press-logo{color:#aeb5be}
.press-row .press-logo:hover{color:#4a525c}
/* real logo files drop straight in: any <img> is sized and knocked monotone */
.press-logo img{display:block;height:clamp(17px,1.7vw,25px);width:auto;
  filter:grayscale(1) opacity(.62);transition:filter .25s}
.press-logo:hover img{filter:grayscale(1) opacity(.9)}
/* the two that read better with their own casing */
.press-ap{letter-spacing:.02em}
@media(max-width:640px){
  .press{padding:26px 0}
  .press-row{gap:20px 26px}
  .press-label{margin-bottom:16px}
}

/* Product tiles that use a real standalone photograph rather than a crop of the
   concept sheet. The image simply fills the tile; no width/left/top percentages,
   so changing the tile's aspect-ratio can never re-anchor it. */
.photo-crop.product-photo picture{position:absolute;inset:0;display:block}
.photo-crop.product-photo img{position:absolute;inset:0;width:100%;height:100%;
  max-width:100%;object-fit:cover}

/* ---------------------------------------------------------------------------
   Deck cards that carry a photograph instead of flat colour. The card colour
   stays as the backdrop, so a photo shot on that colour reads as one surface.
   Label moves to the bottom over a scrim: centred type on top of a photo is a
   coin toss, bottom-anchored over a gradient always reads.
--------------------------------------------------------------------------- */
.deck-inner.has-photo{padding-top:0;overflow:hidden}
.deck-inner.has-photo picture{position:absolute;inset:0;display:block;border-radius:inherit;overflow:hidden}
.deck-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:50% 0;z-index:0;border-radius:inherit}

.deck-inner.has-photo .deck-label,
.deck-inner.has-photo .deck-note{position:relative;z-index:2}

/* ---------------------------------------------------------------------------
   Jump-to-next control. It sits in the gap under the manifesto strip and frames
   the card deck in the viewport rather than nudging the page a fixed distance.
   A purely decorative arrow would be noise; this one does a job.
--------------------------------------------------------------------------- */
.jump-wrap{display:flex;justify-content:center;padding:40px 0 0}
.jump-next{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;
  background:#fff;color:var(--ink);border:1px solid #e4e6ea;cursor:pointer;padding:0;
  box-shadow:0 2px 10px rgba(9,14,38,.07);
  transition:transform .25s cubic-bezier(.2,.8,.3,1),box-shadow .25s,border-color .25s}
.jump-next svg{width:22px;height:22px;display:block}
.jump-next:hover{transform:translateY(3px);border-color:#cfd3da;
  box-shadow:0 6px 18px rgba(9,14,38,.12)}
.jump-next:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
html.motion .jump-next svg{animation:jumpbob 2.4s ease-in-out infinite}
@keyframes jumpbob{0%,100%{transform:translateY(-1px)}50%{transform:translateY(3px)}}
/* once you have scrolled past it, it has done its job */
.jump-wrap.is-spent{opacity:0;pointer-events:none;transition:opacity .5s ease}
@media(max-width:640px){.jump-wrap{padding-top:28px}.jump-next{width:42px;height:42px}}
@media(prefers-reduced-motion:reduce){
  html.motion .jump-next svg{animation:none}
  .jump-next:hover{transform:none}
  .jump-wrap.is-spent{transition:none}
}

/* ---------------------------------------------------------------------------
   COLLECTION PAGE — category listing above the product template.
   Layout follows the Next.js Commerce reference the owner supplied: collections
   rail left, product grid centre, sort right. Rendered in the Brandable palette
   rather than that template's chrome.
--------------------------------------------------------------------------- */
.collection-page{padding-top:34px}
.collection-head{margin:26px 0 34px;max-width:720px}
.collection-head h1{font-size:clamp(34px,4.4vw,58px);line-height:1.04;letter-spacing:-.05em}
.collection-head p{margin-top:14px;font-size:clamp(16px,1.3vw,19px);line-height:1.5;color:#3d3d3d}

.collection-shell{display:grid;grid-template-columns:168px minmax(0,1fr);
  gap:clamp(24px,3vw,48px);align-items:start;padding-bottom:96px}
/* Grid children default to min-width:auto and refuse to shrink below their
   content, so the horizontal scroll strips below pushed the whole column wider
   than the viewport instead of scrolling inside it. */
.collection-shell>*{min-width:0}

.rail-label{font-size:11px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;
  color:#9aa1ab;margin:0 0 14px}
.collection-rail ul,.collection-sort ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.rail-link,.sort-link{background:none;border:0;padding:0;font:inherit;font-size:15.5px;
  color:#3d3d3d;text-align:left;cursor:pointer;text-decoration:none;
  border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.rail-link:hover,.sort-link:hover{color:var(--ink)}
.rail-link.is-current,.sort-link.is-current{color:var(--ink);font-weight:600;
  border-bottom-color:var(--ink)}
.rail-link:focus-visible,.sort-link:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

.tile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;
  list-style:none;margin:0;padding:0}
.tile-inner{display:block;width:100%;text-align:left;background:none;border:0;padding:0;
  font:inherit;color:inherit;text-decoration:none;cursor:pointer}
.tile-art{position:relative;display:block;aspect-ratio:1/1;border-radius:14px;overflow:hidden;
  background:#fafafa;border:1px solid var(--line);
  transition:transform .25s cubic-bezier(.2,.8,.3,1),box-shadow .25s,border-color .25s}
.tile-art picture,.tile-art img{display:block;width:100%;height:100%;object-fit:cover}
.tile-inner:hover .tile-art{transform:translateY(-4px);border-color:#dcdfe4;
  box-shadow:0 12px 28px rgba(9,14,38,.10)}
.tile-inner:focus-visible .tile-art{outline:3px solid var(--blue);outline-offset:3px}

/* finishes we have no photography for yet: show the card face itself, in stock colour */
.tile-face{position:absolute;inset:0;display:grid;place-items:center;background:var(--face)}
/* the same placeholder standing on its own in a product gallery */
.gallery-main .tile-face{position:relative;inset:auto;aspect-ratio:1;border-radius:18px}
.gallery-main .tile-face-mark{font-size:clamp(22px,4vw,38px)}
.tile-face-mark{font-size:clamp(15px,2vw,22px);font-weight:800;letter-spacing:-.045em;
  color:var(--ink);transform:rotate(-4deg)}

.tile-meta{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:13px}
.tile-name{font-size:17px;font-weight:700;letter-spacing:-.02em}
.tile-price{flex:none;font-size:14px;font-weight:700;color:#fff;background:var(--blue);
  padding:5px 11px;border-radius:999px;white-space:nowrap}
.tile-price.is-quote{color:#5b6270;background:#f1f2f4}
.tile-note{display:block;margin-top:5px;font-size:14px;line-height:1.4;color:#6b7280}

@media(max-width:1000px){
  .collection-shell{grid-template-columns:1fr;gap:26px}
  /* rail and sort become horizontal strips above the grid on narrow screens */
  .collection-rail ul,.collection-sort ul{display:flex;flex-wrap:nowrap;
    overflow-x:auto;gap:20px;padding-bottom:4px;width:100%;
    scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .collection-rail ul::-webkit-scrollbar,.collection-sort ul::-webkit-scrollbar{display:none}
  .collection-rail li,.collection-sort li{flex:0 0 auto}
  .collection-sort{order:-1}
  .tile-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
}
@media(max-width:560px){
  .tile-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .tile-name{font-size:15px}
  .tile-note{display:none}
}

/* ---- card corridor hero -----------------------------------------------------
   Ported from a React component the owner found. The effect is CSS perspective
   plus a keyframe track; PHP prints the keyframes, so there is no JS in it.
   Scoped under .stream-hero so it cannot reach the homepage, which shares this
   stylesheet. */
.stream-hero{position:relative;overflow:hidden;background:#fff;container-type:inline-size;
  min-height:min(860px,calc(100svh - 88px));
  display:grid;grid-template-rows:auto auto auto;align-content:center;
  row-gap:0;
  padding:clamp(12px,2vh,30px) 0 clamp(16px,2.4vh,34px);text-align:center}

/* The corridor owns the middle row, so the copy can sit above and below it
   instead of on top of it. cqw still resolves against .stream-hero, so the
   corridor keeps its proportions whatever the rows do. */
.stream-stage{position:relative;height:clamp(186px,25vh,250px);pointer-events:none;z-index:0}
.stream-space{position:absolute;inset:0;transform-style:preserve-3d}
.stream-card{position:absolute;overflow:hidden;backface-visibility:hidden;
  box-shadow:0 2cqw 4cqw rgba(9,14,38,.13)}
.stream-card img{width:100%;height:100%;object-fit:cover;display:block}
/* Pause rather than disable: every card is already dropped mid-flight by its
   negative delay, so it freezes as a finished still instead of collapsing onto
   the axis. */
@media (prefers-reduced-motion:reduce){ .stream-card{animation-play-state:paused} }

.stream-head, .stream-foot{position:relative;z-index:1}
.stream-hero h1{font-size:clamp(44px,6.4vw,98px);font-weight:900;line-height:.92;
  letter-spacing:-.055em;color:var(--ink);margin:0}
/* the changing word keeps its own line so the fixed word never shifts sideways */
.stream-hero h1 .film-word{color:var(--cyan-ink);display:block;
  transition:opacity .32s ease,transform .32s ease}
.stream-hero h1 .film-fixed{display:block}
.stream-hero h1 .film-word.is-out{opacity:0;transform:translateY(-.14em)}
.stream-lead{margin:0 auto;max-width:38ch;font-size:clamp(16px,1.25vw,19px);
  line-height:1.55;color:#3d4149}
.stream-actions{margin-top:clamp(14px,2vh,22px)}
@media (max-width:767px){
  /* Do NOT hold a viewport-height hero on a phone. The content measures ~377px
     and the 680px floor left 303px of slack, which align-content:center split
     evenly - 150px of white above the headline before you have read a word.
     Hug the content and set the breathing room directly. Desktop keeps its
     floor; the owner likes that one as it is. */
  .stream-hero{min-height:auto;padding:44px 0 40px}
  .stream-stage{height:clamp(150px,21vh,200px)}
  .stream-lead{max-width:30ch}
}
@media (prefers-reduced-motion:reduce){ .stream-hero h1 .film-word{transition:none} }


/* The design page switches the CTA to the brand cyan. Dark ink on it, not white:
   white on #1ECBF2 is 1.9:1 and even on #0EA1C2 only 3.05:1, both failing AA for
   a button label. Ink on the bright cyan is 10.3:1 and looks bolder anyway. */
.page-template-page-design .stream-actions .button{background:var(--cyan);color:var(--ink)}
.page-template-page-design .stream-actions .button:hover{background:#16BCE2}

/* ---- design page, under the hero -------------------------------------------
   Only the heading and its lead remain; the owner cleared what sat below them.
   Everything that styled those sections went with them rather than lingering as
   dead CSS on the site's single stylesheet. */
.dsn-suite{padding:clamp(56px,9vh,110px) 0 clamp(56px,9vh,110px);text-align:center}
.dsn-suite h2{font-size:clamp(32px,4.4vw,58px);font-weight:900;letter-spacing:-.05em;
  line-height:1.02;margin:0}
.dsn-suite-lead{margin:18px auto 0;max-width:52ch;font-size:clamp(15px,1.2vw,18px);
  line-height:1.6;color:#4a4f57}
.stream-caption{margin:14px 0 0;font-size:12.5px;color:#8b9098}

/* Reuse the homepage chevron at each design-page section transition. Native
   fragment links keep scrolling and keyboard focus working without JavaScript;
   html's scroll padding and reduced-motion rule apply to these links as well. */
.page-template-page-design .dsn-jump{padding-top:32px}
.page-template-page-design .dsn-jump .jump-next{width:46px;height:46px}
@media(max-width:640px){.page-template-page-design .dsn-jump{padding-top:24px}}

/* ---- Neo scroll stage (websites) --------------------------------------------
   The MacBook Neo hero pattern: a stage pinned to the viewport while the page
   scrolls past it, the visual advancing with scroll progress, step cards
   changing at thresholds, a progress bar underneath.

   position:sticky does the pinning. The section is tall - that height IS the
   scroll distance - and the stage sticks inside it for the whole way down. No
   spacer element, no fixed positioning, nothing to unwind at the end. */
.neo{position:relative;background:#fff}
.neo-stage{position:sticky;top:0;height:100svh;overflow:hidden;
  display:grid;grid-template-columns:1.05fr .95fr;align-items:center;
  gap:clamp(20px,3vw,56px);padding:calc(88px + 2vh) max(28px,calc((100vw - 1320px)/2)) 6vh}
.neo-shot{position:relative;grid-column:1;align-self:center;aspect-ratio:3/2}
.neo-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  opacity:0;transform:scale(.985);transition:opacity .45s ease,transform .45s ease;
  filter:drop-shadow(0 26px 44px rgba(9,14,38,.13))}
.neo-frame.is-on{opacity:1;transform:none}

.neo-copy{position:absolute;left:max(28px,calc((100vw - 1320px)/2));top:calc(88px + 4vh);
  z-index:2;pointer-events:none;padding:0}
.neo-copy h1{font-size:clamp(34px,3.9vw,62px);font-weight:900;line-height:.98;
  letter-spacing:-.055em;margin:0;color:var(--ink)}
.neo-scrollhint{margin:14px 0 0;font-size:13px;letter-spacing:.02em;color:#8b9098}

.neo-cards{position:relative;grid-column:2;min-height:clamp(260px,34vh,340px)}
.neo-card{position:absolute;inset:0 0 auto 0;opacity:0;transform:translateY(14px);
  transition:opacity .4s ease,transform .4s ease;pointer-events:none}
.neo-card.is-on{opacity:1;transform:none;pointer-events:auto}
.neo-card-num{margin:0 0 14px;font-size:13px;color:#8b9098;letter-spacing:.04em}
.neo-card-num strong{color:var(--ink);font-weight:800}
.neo-card h2{font-size:clamp(26px,2.6vw,40px);font-weight:900;letter-spacing:-.045em;
  line-height:1.04;margin:0}
.neo-card-desc{margin:14px 0 24px;max-width:38ch;font-size:clamp(15px,1.1vw,17px);
  line-height:1.6;color:#4a4f57}

.neo-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:#eceef1;transition:opacity .35s ease}
/* only while the stage is running - not as an empty track before, not as a
   finished teal rule parked above the footer after */
.neo.is-idle .neo-progress,.neo.is-done .neo-progress{opacity:0}
.neo-progress span{display:block;height:100%;width:0;background:var(--cyan-ink);
  transition:width .12s linear}
.neo-caption{margin:26px auto;font-size:12.5px;color:#8b9098;text-align:center}

@media (max-width:900px){
  .neo-stage{grid-template-columns:1fr;grid-template-rows:auto 1fr;
    padding:calc(72px + 2vh) 22px 5vh;gap:14px}
  .neo-shot{grid-column:1;grid-row:1}
  .neo-cards{grid-column:1;grid-row:2;min-height:clamp(220px,30vh,300px)}
  .neo-copy{position:static;padding:0 0 8px}
  .neo-copy h1{font-size:clamp(28px,7.4vw,40px)}
}
/* No sticky pin and no scroll choreography for reduced motion: the stage becomes
   an ordinary stack showing every step at once. */
@media (prefers-reduced-motion:reduce){
  .neo{min-height:auto !important}
  .neo-stage{position:static;height:auto;display:block}
  .neo-shot{aspect-ratio:auto;height:auto}
  .neo-frame{position:static;opacity:1;transform:none;margin-bottom:18px}
  .neo-card{position:static;opacity:1;transform:none;pointer-events:auto;margin-bottom:34px}
  .neo-progress{display:none}
}

/* ---- design services pricing ------------------------------------------------
   Colour blocks, not bordered white boxes. These sit on a page with a card
   corridor and a scroll stage; a plain pricing table died next to them.

   The ink/white choice per card is contrast, not taste: white reads 7.0:1 on
   the cobalt but only 3.55:1 on the magenta and 1.30:1 on the yellow, so those
   two take ink. Same rule the CTA followed. */
.svc-pricing{padding:clamp(56px,9vh,104px) 0 clamp(44px,7vh,80px);text-align:center}
.svc-pricing h2{font-size:clamp(32px,4.4vw,58px);font-weight:900;letter-spacing:-.05em;
  line-height:1.02;margin:0}
.svc-pricing-lead{margin:16px auto 0;max-width:46ch;font-size:clamp(15px,1.2vw,18px);
  line-height:1.6;color:#4a4f57}

.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.5vw,20px);
  margin-top:clamp(30px,4.5vh,52px);text-align:left}
@media (max-width:1180px){ .svc-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:900px){ .svc-grid{grid-template-columns:1fr} }

.svc-card{position:relative;border-radius:22px;padding:clamp(26px,2.5vw,36px);
  display:flex;flex-direction:column;overflow:hidden;
  transition:transform .28s cubic-bezier(.22,.61,.36,1),box-shadow .28s ease;
  box-shadow:0 14px 34px rgba(9,14,38,.10)}
.svc-card:hover{transform:translateY(-6px);box-shadow:0 24px 52px rgba(9,14,38,.16)}
.svc-cobalt { background:var(--blue) }
/* The magenta is deepened so white type is legible on it (3.55:1 -> 4.91:1).
   The yellow is the site's own --yellow and takes ink type, because white on it
   is 1.30:1. */
.svc-magenta{ background:#D91B60 }
.svc-yellow { background:var(--yellow) }
.svc-lavender{ background:var(--lavender) }
.svc-ink-light{color:#fff}
.svc-ink-dark {color:var(--ink)}

.svc-card h3{margin:0;font-size:clamp(20px,1.7vw,25px);font-weight:800;letter-spacing:-.025em}
.svc-sub{margin:3px 0 0;font-size:13.5px;opacity:.72}
.svc-price{margin:clamp(14px,1.6vh,20px) 0 0;font-size:clamp(46px,4.8vw,68px);font-weight:900;
  letter-spacing:-.055em;line-height:.92}
.svc-list{list-style:none;margin:clamp(20px,2.4vh,28px) 0 clamp(24px,3vh,32px);padding:0;
  display:grid;gap:11px;font-size:14.5px;line-height:1.45}
.svc-list li{display:flex;gap:10px;opacity:.9}
.svc-list li::before{content:"\2192";font-weight:800;flex:0 0 auto;opacity:.85}
.svc-cta{margin-top:auto;width:100%}
/* the button inverts against its own card, so each one carries its deck colour */
.svc-ink-light .svc-cta{background:#fff;color:var(--blue)}
.svc-ink-light .svc-cta:hover{background:#eef3ff}
.svc-ink-dark .svc-cta{background:var(--ink);color:#fff}
.svc-ink-dark .svc-cta:hover{background:#2b2b2b}
.svc-magenta .svc-cta{color:#D91B60}

@media (prefers-reduced-motion:reduce){ .svc-card,.svc-card:hover{transform:none;transition:none} }

/* the brief's two steps */
.brief-service{margin:0 0 18px;font-size:13.5px;font-weight:700;color:var(--blue)}
.brief-actions{display:flex;align-items:center;gap:16px;margin-top:4px}
.brief-actions .button{flex:1}
.brief-form .brief-next{width:100%}

/* ---- design page film -------------------------------------------------------
   A poster that becomes the player on click. Sized by aspect-ratio so the page
   never reflows when the iframe replaces the image. */
/* Size the film to the room the section actually has, rather than picking a
   width and hoping. Heading, lead, film and the jump arrow together come to
   about 400px of furniture plus the 88px header, so whatever height is left is
   the film's - converted back to a width through 16/9. Below ~520px wide it
   stops shrinking and the jump control frames the foot instead.
   This is what stops the section being taller than the screen, which is what
   forced a choice between showing the heading and showing the next arrow. */
.dsn-film{margin:22px auto 0;max-width:clamp(520px,calc((100svh - 490px) * 16 / 9),880px)}
.dsn-film-play{display:block;position:relative;width:100%;padding:0;border:0;cursor:pointer;
  background:var(--blue);border-radius:18px;overflow:hidden;aspect-ratio:16/9;
  box-shadow:0 26px 60px rgba(9,14,38,.18),0 2px 8px rgba(9,14,38,.08);
  transition:transform .25s ease,box-shadow .25s ease}
.dsn-film-play:hover{transform:translateY(-3px);box-shadow:0 34px 74px rgba(9,14,38,.24)}
.dsn-film-play img{width:100%;height:100%;object-fit:cover;display:block}
.dsn-film-btn{position:absolute;inset:0;margin:auto;width:86px;height:86px;border-radius:50%;
  display:grid;place-items:center;background:#ffffff;color:var(--blue);
  box-shadow:0 10px 30px rgba(9,14,38,.3);transition:transform .25s ease}
.dsn-film-btn svg{margin-left:4px}
.dsn-film-play:hover .dsn-film-btn{transform:scale(1.08)}
.dsn-film iframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:18px}
@media(max-width:767px){
  .dsn-film{margin-top:24px}
  .dsn-film-play,.dsn-film iframe{border-radius:14px}
  .dsn-film-btn{width:64px;height:64px}
  .dsn-film-btn svg{width:26px;height:26px}
}
@media(prefers-reduced-motion:reduce){
  .dsn-film-play,.dsn-film-btn{transition:none}
  .dsn-film-play:hover{transform:none}
}


/* ---- design page: the websites panel --------------------------------------
   The closing panel from the approved Automations concept, reused for website
   design and carrying id="websites" - the homepage's Websites deck card and the
   301 from /websites/ both point at /design/#websites, so this is where they
   land now. Scoped to .dsn-cta; the concept's colour names are mapped onto the
   site's own variables so nothing new is invented. */
.dsn-cta{--cobalt:var(--blue);--pink:var(--magenta);--ink:#090909;display:block}
.dsn-cta .pink{background:var(--pink)}
.dsn-cta .yellow{background:var(--yellow)}
.dsn-cta .cyan{background:var(--cyan)}
.dsn-cta .lavender{background:var(--lavender)}
.dsn-cta .mint{background:var(--mint)}
.dsn-cta .button-white{background:white;color:var(--ink)}
.dsn-cta .button-white:hover{background:var(--yellow)}
.dsn-cta .closing{margin-top:120px;display:grid;grid-template-columns:1.6fr 1fr;background:var(--cobalt);color:white;border-radius:23px;overflow:hidden;position:relative;min-height:484px}
.dsn-cta .closing-content{padding:48px;position:relative;z-index:2}
.dsn-cta .closing h2{font-size:61px;margin-top:49px;white-space:nowrap}
.dsn-cta .closing p{font-size:15px;margin:22px 0 26px}
.dsn-cta .closing .button{min-height:51px;font-size:13px}
.dsn-cta .closing-graphic{display:grid;grid-template-columns:1fr 1fr;position:absolute;right:-61px;bottom:2px;width:420px;gap:15px;transform:rotate(-14deg)}
.dsn-cta .closing-square{display:grid;place-items:center;border-radius:28px;aspect-ratio:1;color:var(--ink)}
.dsn-cta .closing-square svg{width:105px;height:105px;stroke-width:1.3}
@media(max-width:1150px){.dsn-cta .closing-graphic{width:340px;right:-55px;bottom:35px}}
@media(max-width:1150px){.dsn-cta .closing h2{font-size:55px}}
@media(max-width:1150px){.dsn-cta .closing-content{padding:40px}}
@media(max-width:850px){.dsn-cta .closing{margin-top:95px;min-height:430px}}
@media(max-width:850px){.dsn-cta .closing-content{padding:35px}}
@media(max-width:850px){.dsn-cta .closing h2{font-size:45px;margin-top:42px}}
@media(max-width:850px){.dsn-cta .closing-graphic{width:260px;right:-70px;bottom:40px;gap:10px}}
@media(max-width:850px){.dsn-cta .closing-square{border-radius:20px}}
@media(max-width:850px){.dsn-cta .closing-square svg{width:65px;height:65px}}
@media(max-width:850px){.dsn-cta .closing p{font-size:13px;max-width:275px}}
@media(max-width:600px){.dsn-cta .closing{margin-top:77px;display:block;border-radius:18px;min-height:490px}}
@media(max-width:600px){.dsn-cta .closing-content{padding:31px 26px}}
@media(max-width:600px){.dsn-cta .closing-content>img{width:143px}}
@media(max-width:600px){.dsn-cta .closing h2{font-size:clamp(31px,8.9vw,47px);margin-top:38px}}
@media(max-width:600px){.dsn-cta .closing p{font-size:13px;max-width:258px;line-height:1.6;margin-top:20px}}
@media(max-width:600px){.dsn-cta .closing .button{font-size:12px;min-height:48px;padding-inline:18px;gap:20px}}
@media(max-width:600px){.dsn-cta .closing-graphic{width:242px;right:-17px;bottom:-134px;gap:12px;transform:rotate(-13deg)}}
@media(max-width:600px){.dsn-cta .closing-square svg{width:60px;height:60px}}
.dsn-cta em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.06em}
.dsn-cta .button svg{width:19px;height:19px}

.dsn-cta .closing-content>img{display:block;height:28px;width:auto}
.dsn-cta .closing .button{display:inline-flex;align-items:center;gap:22px}
.dsn-cta .closing{margin-top:28px}   /* the jump arrow above already gives it air */
.dsn-cta{margin-bottom:96px}

/* ---- product page: the questions, in the Automations page's pattern ---------
   An intro card on the left, a details/summary accordion on the right. Ported
   from the approved concept and scoped here; the site's own colors and type. */
.pd-faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,5vw,65px);margin-top:clamp(56px,7vh,96px);padding-top:clamp(36px,5vh,56px);border-top:1px solid var(--line)}
.pd-faq .eyebrow{margin:0 0 21px;font-size:11px;font-weight:650;letter-spacing:.1em;line-height:1.5;color:var(--blue)}
.pd-faq h2{margin:0;font-size:clamp(34px,3.6vw,52px);font-weight:800;letter-spacing:-.04em;line-height:1}
.pd-faq h2 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.06em}
.pd-faq .faq-intro>p:not(.eyebrow){font-size:14px;color:#626262;margin:24px 0 0;max-width:30ch}
.pd-faq .text-button{margin-top:14px;padding:0;border:0;background:none;font:inherit;font-size:13px;font-weight:600;color:var(--ink);cursor:pointer;border-bottom:1px solid var(--ink)}
.pd-faq .faq-art{position:relative;width:170px;height:160px;margin:38px 0 0 18px}
.pd-faq .faq-art span{position:absolute;display:grid;place-items:center;width:100px;height:112px;border-radius:16px;font-size:70px;letter-spacing:-.1em;line-height:1;font-weight:600;color:var(--ink)}
.pd-faq .faq-art span:first-child{transform:rotate(-14deg);left:0;top:0;background:var(--magenta)}
.pd-faq .faq-art span:last-child{transform:rotate(10deg);top:26px;left:75px;background:var(--yellow)}
.pd-faq .faq-list{display:block;gap:0;border-top:1px solid #dcdcdc;margin:0;max-width:none}
.pd-faq .faq-list details{border-bottom:1px solid #dcdcdc}
.pd-faq .faq-list summary{min-height:76px;padding:24px 0;list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:17px;line-height:1.3;font-weight:600}
.pd-faq .faq-list summary::-webkit-details-marker{display:none}
.pd-faq .faq-list summary>span{display:block;width:14px;height:14px;position:relative;flex-shrink:0}
.pd-faq .faq-list summary>span:before,.pd-faq .faq-list summary>span:after{content:'';position:absolute;background:var(--ink);width:12px;height:1.5px;left:1px;top:6px}
.pd-faq .faq-list summary>span:after{transform:rotate(90deg);transition:transform .2s}
.pd-faq .faq-list details[open] summary>span:after{transform:rotate(0)}
.pd-faq .faq-list details>p{margin:0;color:#626262;font-size:14px;line-height:1.75;padding:0 28px 25px 0}
@media(max-width:850px){.pd-faq{grid-template-columns:.7fr 1.3fr;gap:40px}.pd-faq .faq-list summary{font-size:15px}.pd-faq .faq-list details>p{font-size:13px}}
@media(max-width:600px){.pd-faq{grid-template-columns:1fr;gap:30px}.pd-faq h2 br{display:none}.pd-faq .faq-art{display:none}.pd-faq .faq-list summary{font-size:15px;min-height:72px;padding-block:22px;gap:16px}.pd-faq .faq-list details>p{font-size:13px;padding-right:14px}}

/* ---- product page: the artwork studio (ported from the approved concept; scoped .pd-art) ----
   Ported rules first, then the sheet geometry rewritten to run off --sw/--ar so any product's
   trim size draws correctly: cards, postcards, sheets, the trifold and the banner. */
.pd-art a{color:inherit;text-decoration:none}.pd-art button,.pd-art input{font:inherit}.pd-art button{cursor:pointer;border:0}.pd-art button,.pd-art a{-webkit-tap-highlight-color:transparent}.pd-art img{display:block;max-width:100%;height:auto}.pd-art h1,.pd-art h2,.pd-art h3,.pd-art p{margin:0}.pd-art h1,.pd-art h2,.pd-art h3{font-weight:650;line-height:1.04;letter-spacing:-.045em}.pd-art h2{font-size:62px}.pd-art h3{font-size:28px}.pd-art em{font-family:Georgia,serif;font-weight:400;letter-spacing:-.055em}.pd-art svg{height:24px;width:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.pd-art .pink{background:var(--pink)}.pd-art .yellow{background:var(--yellow)}.pd-art .cyan{background:var(--cyan)}.pd-art .lavender{background:var(--lavender)}.pd-art .eyebrow{font-size:10px;font-weight:650;letter-spacing:.1em}.pd-art .text-button{background:none;padding:10px 0;display:inline-flex;align-items:center;gap:20px;min-height:44px;font-size:13px;font-weight:650;color:var(--ink)}.pd-art .text-button span{font-size:22px}.pd-art .text-button:hover{text-decoration:underline;text-underline-offset:5px}.pd-art button:focus-visible,.pd-art a:focus-visible,.pd-art summary:focus-visible,.pd-art input:focus-visible{outline:3px solid var(--blue);outline-offset:4px}.pd-art .section-nav{position:sticky;top:0;z-index:15;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);margin-top:58px;min-height:70px}.pd-art .section-nav>div{display:flex;gap:32px;height:70px}.pd-art .section-nav a{display:flex;align-items:center;gap:7px;font-size:12px;position:relative}.pd-art .section-nav a.active{font-weight:650}.pd-art .section-nav a.active:after{content:'';height:3px;background:var(--blue);position:absolute;left:0;right:0;bottom:-1px}.pd-art .artwork{padding-top:84px}.pd-art .section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:40px}.pd-art .section-heading .eyebrow{display:flex;align-items:center;gap:8px;margin-bottom:20px}.pd-art .small-cross{font-size:24px;line-height:1;color:var(--blue)}.pd-art .section-heading>p{font-size:14px;color:var(--muted);line-height:1.75;margin-bottom:4px}.pd-art .quick-specs{display:grid;grid-template-columns:1.32fr .88fr .88fr .92fr;gap:15px}.pd-art .quick-specs article{padding:22px 22px 19px;border-radius:15px;min-height:179px;display:flex;flex-direction:column}.pd-art .spec-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:23px;min-height:22px}.pd-art .spec-top>span:first-child{font-size:8px;letter-spacing:.06em;font-weight:650}.pd-art .spec-top svg{width:19px;height:19px}.pd-art .quick-specs h3{font-size:35px;white-space:nowrap;letter-spacing:-.06em}.pd-art .quick-specs h3 span{font-size:22px;font-weight:500}.pd-art .quick-specs .canvas-card h3{font-size:31px}.pd-art .quick-specs .canvas-card h3 span{font-size:22px}.pd-art .quick-specs p{font-size:11px;margin-top:9px}.pd-art .spec-bottom{font-size:7px;font-weight:600;letter-spacing:.04em;margin-top:auto;padding-top:22px}.pd-art .copy-size{padding:4px 0 0;background:none;display:flex;align-items:center;gap:9px;width:max-content;font-size:10px;font-weight:650;text-decoration:underline;text-underline-offset:4px;min-height:35px;margin-top:6px;color:var(--ink)}.pd-art .copy-size svg{width:13px;height:13px}.pd-art .copy-status{font-size:9px;line-height:1;min-height:0}.pd-art .resolution-icon{font-size:25px;line-height:1}.pd-art .cmyk{display:flex;padding-right:2px}.pd-art .cmyk i{width:12px;height:12px;border-radius:50%;margin-left:-4px;border:1px solid #0002;background:#00adee}.pd-art .cmyk i:nth-child(2){background:var(--pink)}.pd-art .cmyk i:nth-child(3){background:var(--yellow)}.pd-art .cmyk i:nth-child(4){background:var(--ink)}.pd-art .artwork-studio{display:grid;grid-template-columns:1.1fr 1fr;gap:0;border:1px solid var(--line);border-radius:20px;overflow:hidden;margin-top:23px}.pd-art .visual-guide{background:#f5f3fa;min-width:0}.pd-art .visual-topline{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:22px 23px 0}.pd-art .visual-topline>div:first-child{font-size:7px;font-weight:650;letter-spacing:.06em;display:flex;gap:6px;align-items:center}.pd-art .visual-topline i{width:5px;height:5px;border-radius:50%;background:var(--blue)}.pd-art .view-switch{background:#e8e5ef;border-radius:7px;padding:3px;display:flex;gap:2px}.pd-art .view-switch button{background:none;padding:7px 9px;border-radius:5px;font-size:9px;line-height:1.2;min-height:31px;color:#5c5666}.pd-art .view-switch button.selected{background:white;color:var(--ink);box-shadow:0 1px 3px #0001}.pd-art .diagram-legend{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:19px}.pd-art .diagram-legend>span{font-size:9px;display:flex;align-items:center;gap:6px;color:#5e5968}.pd-art .diagram-legend i{height:6px;width:6px;border-radius:50%;background:var(--pink)}.pd-art .diagram-legend i.legend-trim{background:#0094b4}.pd-art .diagram-legend i.legend-safe{background:#837300}.pd-art .diagram-note{text-align:center;font-size:8px;color:#686371;line-height:1.5;padding:16px 24px 22px}.pd-art .guide-explainer{padding:42px 34px 30px;display:flex;flex-direction:column;min-width:0}.pd-art .guide-explainer>.eyebrow{font-size:8px;color:var(--blue);margin-bottom:20px}.pd-art .guide-explainer>h3{font-size:43px;letter-spacing:-.05em}.pd-art .guide-intro{font-size:12px;margin-top:17px;color:var(--muted)}.pd-art .guide-rules{margin-top:26px}.pd-art .guide-rule{display:flex;align-items:center;gap:12px;padding:17px 12px;border-radius:10px;min-height:92px;background:white;color:var(--ink);text-align:left;width:100%;margin-bottom:5px;border:1px solid transparent}.pd-art .guide-rule.selected{background:#f6f6f4;border-color:#ecece8}.pd-art .guide-rule:hover{border-color:#d5d5d2}.pd-art .rule-number{display:grid;place-items:center;width:32px;height:35px;flex-shrink:0;border-radius:7px;font-size:10px;font-weight:650}.pd-art .guide-rule strong{font-size:13px;line-height:1.3;display:block;letter-spacing:-.015em}.pd-art .guide-rule small{font-size:10px;color:var(--muted);display:block;margin-top:6px;line-height:1.5}.pd-art .guide-rule>svg{height:16px;width:16px;margin-left:auto;opacity:0}.pd-art .guide-rule.selected>svg{opacity:1}.pd-art .zone-description{font-size:12px;line-height:1.7;color:var(--muted);padding:18px 13px 0;min-height:100px}.pd-art .top-tip{display:flex;align-items:flex-start;gap:11px;border-top:1px solid var(--line);padding-top:23px;margin-top:auto}.pd-art .top-tip svg{width:21px;height:21px;color:var(--blue)}.pd-art .top-tip p{font-size:11px;line-height:1.6;color:var(--muted)}.pd-art .top-tip strong{display:block;color:var(--ink);font-size:12px;margin-bottom:5px}.pd-art .help-row{display:grid;grid-template-columns:.84fr 1.16fr;gap:22px;margin-top:22px}.pd-art .guide-download{border:1px solid var(--line);border-radius:14px;display:flex;align-items:center;gap:17px;padding:26px}.pd-art .download-icon{display:grid;place-items:center;width:46px;height:51px;border-radius:9px;background:var(--blue);color:white;flex-shrink:0}.pd-art .download-icon svg{width:21px;height:21px}.pd-art .guide-download strong{font-size:18px;letter-spacing:-.03em;line-height:1.2;display:block}.pd-art .guide-download small{font-size:11px;color:var(--muted);display:block;margin-top:7px}.pd-art .guide-download>svg{margin-left:auto;height:18px;width:18px}.pd-art .guide-download:hover{border-color:var(--blue)}.pd-art .help-design{background:var(--lavender);border-radius:14px;padding:23px 26px;display:flex;align-items:center;gap:23px}.pd-art .help-mark{font-size:67px;color:var(--ink);line-height:1}.pd-art .help-design h3{font-size:22px;letter-spacing:-.035em}.pd-art .help-design p{font-size:11px;line-height:1.6;margin-top:9px;max-width:390px}.pd-art .help-design .text-button{font-size:11px;padding-block:7px;min-height:37px;gap:12px}.pd-art .help-design .text-button span{font-size:18px}.pd-art .final-check{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;background:#fffbe2;border:1px solid #f2edcb;border-radius:18px;padding:37px 40px;margin-top:47px}.pd-art .check-intro .eyebrow{font-size:9px;margin-bottom:20px}.pd-art .check-intro h3{font-size:43px;line-height:1}.pd-art .check-intro>p:not(.eyebrow){font-size:12px;color:var(--muted);margin-top:17px}.pd-art .check-progress{max-width:235px;margin-top:27px}.pd-art .check-progress>div{height:4px;border-radius:10px;overflow:hidden;background:#e6dfb4}.pd-art .check-progress span{height:100%;display:block;width:0;background:var(--blue);transition:width .25s}.pd-art .check-progress p{font-size:10px;margin-top:9px;color:var(--muted)}.pd-art .check-list label{display:flex;gap:13px;align-items:center;border-bottom:1px solid #e8e2bd;padding:12px 0;min-height:48px;font-size:12px;line-height:1.5;cursor:pointer}.pd-art .check-list label:first-child{padding-top:0}.pd-art .check-list input{height:17px;width:17px;accent-color:var(--blue);flex-shrink:0;margin:0;cursor:pointer}.pd-art .check-list input:checked+span{color:#60604e}.pd-art .check-note{font-size:9px;color:#726d58;margin-top:16px}.pd-art .extra-specs{border-bottom:1px solid var(--line);margin-top:20px}.pd-art .extra-specs summary{display:flex;align-items:center;justify-content:space-between;font-size:13px;min-height:65px;cursor:pointer;list-style:none;padding:16px 0}.pd-art .extra-specs summary::-webkit-details-marker{display:none}.pd-art .extra-specs summary span{font-size:21px}.pd-art .extra-specs[open] summary span{transform:rotate(45deg)}.pd-art .extra-specs>div{display:grid;grid-template-columns:1fr 1fr;gap:24px 45px;padding:5px 0 25px}.pd-art .extra-specs p{font-size:12px;line-height:1.7;color:var(--muted)}.pd-art .extra-specs strong{display:block;color:var(--ink);margin-bottom:6px}.pd-art .proof-section{padding:90px 0;display:grid;grid-template-columns:.9fr 1.1fr;gap:80px}.pd-art .proof-heading .eyebrow{font-size:9px;margin-bottom:20px;color:var(--blue)}.pd-art .proof-heading h2{font-size:47px;line-height:1.06}.pd-art .proof-heading>p:last-child{font-size:12px;color:var(--muted);margin-top:22px}.pd-art .proof-steps{list-style:none;padding:0;margin:0;display:grid;gap:28px}.pd-art .proof-steps li{display:flex;gap:18px}.pd-art .proof-steps li>span{height:40px;width:40px;display:grid;place-items:center;border-radius:9px;flex-shrink:0;font-size:11px;font-weight:650}.pd-art .proof-steps h3{font-size:23px;margin-top:3px;letter-spacing:-.03em}.pd-art .proof-steps p{font-size:12px;line-height:1.7;color:var(--muted);margin-top:10px;max-width:460px}@media(max-width:1150px){.pd-art h2{font-size:55px}.pd-art .section-heading>p{font-size:12px}.pd-art .quick-specs{grid-template-columns:1.28fr .88fr .88fr .96fr;gap:12px}.pd-art .quick-specs article{padding:19px 16px}.pd-art .quick-specs .canvas-card h3{font-size:27px}.pd-art .quick-specs h3{font-size:30px}.pd-art .quick-specs h3 span{font-size:19px}.pd-art .spec-top>span:first-child{font-size:6px}.pd-art .spec-top{margin-bottom:21px}.pd-art .quick-specs p{font-size:10px}.pd-art .spec-bottom{font-size:6px}.pd-art .artwork-studio{grid-template-columns:1.08fr 1fr}.pd-art .visual-topline{padding-inline:18px;gap:10px;flex-wrap:wrap}.pd-art .guide-explainer{padding:33px 26px 26px}.pd-art .guide-explainer>h3{font-size:37px}.pd-art .guide-rules{margin-top:21px}.pd-art .guide-rule{padding:14px 8px;gap:10px;min-height:88px}.pd-art .guide-rule strong{font-size:11px}.pd-art .guide-rule small{font-size:9px}.pd-art .guide-rule>svg{width:14px;height:14px}.pd-art .rule-number{width:29px;height:31px;font-size:9px}.pd-art .zone-description{font-size:11px;padding:15px 8px 18px;min-height:103px}.pd-art .top-tip p{font-size:10px}.pd-art .guide-download{padding:21px;gap:12px}.pd-art .guide-download strong{font-size:17px}.pd-art .guide-download small{font-size:9px}.pd-art .help-design{padding:21px;gap:17px}.pd-art .help-design h3{font-size:19px}.pd-art .help-mark{font-size:53px}.pd-art .final-check{gap:35px;padding:32px}.pd-art .proof-section{gap:55px}.pd-art .proof-heading h2{font-size:43px}}@media(max-width:900px){.pd-art .section-nav>div{gap:28px}.pd-art .section-heading{gap:25px}.pd-art h2{font-size:46px}.pd-art .section-heading>p{font-size:11px;max-width:240px}.pd-art .section-heading>p br{display:none}.pd-art .section-heading .eyebrow{font-size:8px}.pd-art .quick-specs{grid-template-columns:1fr 1fr;gap:14px}.pd-art .quick-specs article{padding:23px;min-height:185px}.pd-art .quick-specs .canvas-card h3{font-size:32px}.pd-art .quick-specs h3{font-size:35px}.pd-art .spec-top>span:first-child{font-size:8px}.pd-art .spec-top{margin-bottom:22px}.pd-art .quick-specs p{font-size:11px}.pd-art .spec-bottom{font-size:7px}.pd-art .artwork-studio{grid-template-columns:1fr}.pd-art .visual-topline{padding:25px 28px 0;flex-wrap:nowrap}.pd-art .visual-topline>div:first-child{font-size:8px}.pd-art .view-switch button{font-size:10px;padding:9px 13px;min-height:36px}.pd-art .diagram-note{font-size:9px}.pd-art .guide-explainer{padding:35px 36px}.pd-art .guide-explainer>h3{font-size:39px}.pd-art .guide-explainer>h3 br{display:none}.pd-art .guide-explainer>.eyebrow{font-size:8px;margin-bottom:16px}.pd-art .guide-intro{font-size:13px}.pd-art .guide-rule{min-height:84px;padding:17px 14px;gap:15px}.pd-art .guide-rule strong{font-size:14px}.pd-art .guide-rule small{font-size:11px}.pd-art .rule-number{width:34px;height:37px;font-size:10px}.pd-art .guide-rule>svg{width:19px;height:19px}.pd-art .zone-description{font-size:13px;min-height:85px;padding:20px 14px}.pd-art .top-tip{margin-top:10px}.pd-art .top-tip p{font-size:12px}.pd-art .top-tip strong{font-size:13px}.pd-art .help-row{grid-template-columns:1fr 1fr;gap:16px}.pd-art .guide-download{padding:22px;gap:13px;flex-wrap:wrap}.pd-art .guide-download>svg{height:15px;width:15px}.pd-art .guide-download strong{font-size:19px}.pd-art .guide-download small{font-size:10px}.pd-art .help-design{padding:22px}.pd-art .help-mark{display:none}.pd-art .help-design h3{font-size:21px}.pd-art .help-design p{font-size:11px}.pd-art .final-check{grid-template-columns:.8fr 1.2fr;gap:30px;padding:30px}.pd-art .check-intro h3{font-size:36px}.pd-art .check-list label{font-size:11px;padding-block:11px;gap:10px}.pd-art .check-intro>p:not(.eyebrow){font-size:11px}.pd-art .proof-section{gap:37px}.pd-art .proof-heading h2{font-size:37px}.pd-art .proof-steps h3{font-size:21px}.pd-art .proof-steps p{font-size:11px}.pd-art .proof-steps li{gap:13px}}@media(max-width:600px){.pd-art .section-nav{margin-top:36px;min-height:61px}.pd-art .section-nav>div{height:61px;gap:23px;width:100%;justify-content:space-between}.pd-art .section-nav a{font-size:10px;white-space:nowrap}.pd-art .artwork{padding-top:51px}.pd-art .section-heading{display:block;margin-bottom:27px}.pd-art .section-heading .eyebrow{font-size:7px;margin-bottom:17px}.pd-art .small-cross{font-size:21px}.pd-art h2{font-size:43px}.pd-art .section-heading>p{font-size:13px;max-width:310px;margin:21px 0 0;line-height:1.7}.pd-art .quick-specs{gap:10px}.pd-art .quick-specs article{border-radius:12px;padding:16px 14px;min-height:170px}.pd-art .spec-top{min-height:20px;margin-bottom:21px;gap:5px}.pd-art .spec-top>span:first-child{font-size:6px;letter-spacing:.04em}.pd-art .spec-top svg{width:15px;height:15px}.pd-art .quick-specs .canvas-card h3{font-size:22px;line-height:1.1;white-space:normal;max-width:114px}.pd-art .quick-specs .canvas-card h3 span{font-size:15px}.pd-art .quick-specs h3{font-size:29px}.pd-art .quick-specs h3 span{font-size:17px}.pd-art .quick-specs p{font-size:9px;margin-top:8px}.pd-art .spec-bottom{font-size:5.5px;padding-top:19px}.pd-art .copy-size{font-size:9px;min-height:33px;padding-top:2px;margin-top:3px}.pd-art .copy-size svg{width:12px;height:12px}.pd-art .resolution-icon{font-size:20px}.pd-art .cmyk i{height:10px;width:10px;margin-left:-3px}.pd-art .copy-status{font-size:8px}.pd-art .artwork-studio{border-radius:15px;margin-top:18px}.pd-art .visual-topline{padding:19px 16px 0;gap:11px;flex-direction:column;align-items:flex-start}.pd-art .visual-topline>div:first-child{font-size:7px}.pd-art .view-switch{align-self:flex-end}.pd-art .view-switch button{font-size:9px;min-height:32px;padding:8px 11px}.pd-art .diagram-legend{gap:14px}.pd-art .diagram-legend>span{font-size:8px;gap:5px}.pd-art .diagram-note{font-size:7px;padding:15px 17px 20px}.pd-art .guide-explainer{padding:26px 20px}.pd-art .guide-explainer>.eyebrow{font-size:7px;margin-bottom:15px}.pd-art .guide-explainer>h3{font-size:32px}.pd-art .guide-explainer>h3 br{display:block}.pd-art .guide-intro{font-size:11px;margin-top:15px}.pd-art .guide-rules{margin-top:19px}.pd-art .guide-rule{min-height:89px;gap:10px;padding:14px 8px;margin-bottom:4px}.pd-art .rule-number{height:30px;width:28px;border-radius:6px;font-size:8px}.pd-art .guide-rule strong{font-size:11px;line-height:1.35}.pd-art .guide-rule small{font-size:9px;line-height:1.6}.pd-art .guide-rule>svg{width:13px;height:13px}.pd-art .zone-description{font-size:11px;line-height:1.8;min-height:126px;padding:16px 8px 22px}.pd-art .top-tip{gap:10px;padding-top:20px;margin-top:0}.pd-art .top-tip p{font-size:10px}.pd-art .top-tip strong{font-size:11px}.pd-art .top-tip svg{height:19px;width:19px}.pd-art .help-row{grid-template-columns:1fr;gap:14px;margin-top:17px}.pd-art .guide-download{padding:22px;flex-wrap:nowrap;gap:15px}.pd-art .guide-download strong{font-size:19px}.pd-art .guide-download small{font-size:10px}.pd-art .download-icon{width:41px;height:46px}.pd-art .guide-download>svg{height:16px;width:16px}.pd-art .help-design{padding:24px;gap:17px}.pd-art .help-mark{display:block;font-size:43px}.pd-art .help-design h3{font-size:22px;line-height:1.1}.pd-art .help-design p{font-size:11px;margin-top:11px}.pd-art .help-design .text-button{font-size:10px;min-height:43px}.pd-art .final-check{grid-template-columns:1fr;gap:20px;margin-top:31px;padding:26px;border-radius:15px}.pd-art .check-intro .eyebrow{font-size:8px;margin-bottom:16px}.pd-art .check-intro h3{font-size:35px}.pd-art .check-intro>p:not(.eyebrow){font-size:11px;margin-top:15px}.pd-art .check-progress{max-width:none;margin-top:22px}.pd-art .check-progress p{font-size:9px}.pd-art .check-list label{font-size:11px;line-height:1.7;padding-block:12px;gap:12px;align-items:flex-start}.pd-art .check-list input{margin-top:3px;width:17px;height:17px}.pd-art .check-note{font-size:8px;margin-top:15px}.pd-art .extra-specs{margin-top:16px}.pd-art .extra-specs summary{font-size:11px;min-height:62px;gap:15px}.pd-art .extra-specs>div{grid-template-columns:1fr;gap:18px;padding-bottom:23px}.pd-art .extra-specs p{font-size:11px}.pd-art .proof-section{padding:58px 0;grid-template-columns:1fr;gap:31px}.pd-art .proof-heading .eyebrow{font-size:8px;margin-bottom:18px}.pd-art .proof-heading h2{font-size:38px}.pd-art .proof-heading>p:last-child{font-size:11px;margin-top:18px}.pd-art .proof-steps{gap:25px}.pd-art .proof-steps li{gap:15px}.pd-art .proof-steps li>span{width:34px;height:37px;font-size:10px;border-radius:8px}.pd-art .proof-steps h3{font-size:21px}.pd-art .proof-steps p{font-size:11px;line-height:1.8}}@media(max-width:375px){.pd-art h2{font-size:37px}.pd-art .section-nav>div{gap:15px}.pd-art .section-nav a{font-size:9px}.pd-art .quick-specs article{padding:14px 12px}.pd-art .quick-specs .canvas-card h3{font-size:21px}.pd-art .spec-top>span:first-child{font-size:5px}.pd-art .spec-top svg{width:13px;height:13px}.pd-art .guide-explainer{padding-inline:16px}.pd-art .guide-rule{gap:8px}.pd-art .guide-rule strong{font-size:10px}.pd-art .guide-rule small{font-size:8px}.pd-art .guide-rule>svg{height:11px;width:11px}.pd-art .guide-download{padding:19px;gap:11px}.pd-art .guide-download strong{font-size:17px}.pd-art .guide-download small{font-size:8px}.pd-art .help-design{padding:22px}.pd-art .help-design h3{font-size:19px}.pd-art .final-check{padding:23px}.pd-art .check-list label{font-size:10px}.pd-art .proof-heading h2{font-size:34px}}
.pd-art{--pink:var(--magenta);--muted:#616161;--k:1;--callout-w:105px;--callout-gap:21px;font-size:16px;line-height:1.5}
.pd-art .sprite{position:absolute;width:0;height:0;overflow:hidden}
.pd-art .section-nav{top:112px}
.pd-art .section-nav>span{font-size:8px;letter-spacing:.12em;color:var(--muted)}
.pd-art .artwork,.pd-art .proof-section{scroll-margin-top:190px}
.product-shell{scroll-margin-top:130px}
.pd-faq{scroll-margin-top:190px}
.pd-art+.pd-faq{margin-top:0;padding-top:75px;margin-bottom:85px}
.pd-art .diagram-stage{position:relative;padding:48px 24px 58px;display:flex;justify-content:center;min-height:330px}
.pd-art .sheet-wrap{position:relative;isolation:isolate;container-type:size;flex-shrink:0;width:min(calc(var(--sw) * var(--k)),calc(100% - var(--callout-w) - 60px));aspect-ratio:var(--ar);margin-right:60px}
.pd-art .sheet{position:absolute;inset:0;background:var(--blue);box-shadow:0 16px 24px -14px #1010304a;transition:box-shadow .2s}
.pd-art .sheet-design{position:absolute;inset:12px 12px calc(12px + var(--base-h,0px));overflow:hidden;padding:9cqmin 7cqmin;color:#fff;z-index:2}
.pd-art .sheet-design img{width:67cqw;height:auto;position:relative;z-index:2}
.pd-art .sheet-design>p{font-size:10cqmin;line-height:1.12;letter-spacing:-.05em;font-weight:550;margin-top:11cqmin;position:relative;z-index:2}
.pd-art .petal{position:absolute;border-radius:100%;background:var(--lavender);width:53cqmin;height:110cqmin;left:1%;top:36%;transform:rotate(-28deg)}
.pd-art .petal-two{background:var(--pink);width:62cqmin;height:110cqmin;left:41%;top:46%;transform:rotate(27deg)}
.pd-art .petal-three{background:var(--mint);width:106cqmin;height:47cqmin;left:-17%;top:67%;transform:rotate(27deg)}
.pd-art .sheet-url{position:absolute;left:7cqmin;bottom:7cqmin;font-size:4.5cqmin;font-weight:550;z-index:2}
.pd-art .bleed-guide{position:absolute;inset:0;border:8px solid var(--pink);z-index:4;pointer-events:none;transition:box-shadow .2s}
.pd-art .trim-guide{position:absolute;inset:8px;border:1px solid var(--cyan);z-index:5;pointer-events:none}
.pd-art .safe-guide{position:absolute;inset:17px 17px calc(17px + var(--safe-extra,0px));border:1.5px dashed var(--yellow);z-index:6;pointer-events:none;opacity:.8;transition:opacity .2s,box-shadow .2s}
.pd-art.kind-base{--base-h:30px;--safe-extra:36px}
.pd-art .base-zone{position:absolute;bottom:8px;left:8px;right:8px;height:40px;background:var(--blue);border-top:1.5px dashed var(--cyan);z-index:7;display:flex;align-items:center;justify-content:center;transition:background .2s}
.pd-art .base-zone span{font-size:7px;letter-spacing:.08em;color:#fff;opacity:.85}
.pd-art .fold-line{position:absolute;top:8px;bottom:8px;width:0;border-left:1.5px dashed var(--cyan);z-index:6;opacity:.55;transition:opacity .2s,box-shadow .2s;pointer-events:none}
.pd-art .corner-mark{position:absolute;width:34px;height:34px;border:1.5px dashed var(--yellow);border-radius:50%;z-index:6;opacity:.4;transition:opacity .2s;pointer-events:none}
.pd-art .corner-mark.tl{left:3px;top:3px}.pd-art .corner-mark.tr{right:3px;top:3px}.pd-art .corner-mark.bl{left:3px;bottom:3px}.pd-art .corner-mark.br{right:3px;bottom:3px}
.pd-art.kind-corners .sheet,.pd-art.kind-corners .bleed-guide,.pd-art.kind-corners .back-sheet{border-radius:20px}
.pd-art.kind-corners .trim-guide{border-radius:13px}.pd-art.kind-corners .safe-guide{border-radius:6px}
.pd-art.kind-edge .sheet{box-shadow:7px 7px 0 var(--pink),0 16px 24px -14px #1010304a}
.pd-art .gloss-mark{position:absolute;left:calc(12px + 7cqmin - 6px);top:calc(12px + 9cqmin - 6px);width:calc(67cqw + 12px);height:calc(11.2cqw + 12px);z-index:6;border-radius:6px;background:linear-gradient(115deg,#fff0 25%,#ffffff73 50%,#fff0 75%);border:1px dashed #ffffffaa;opacity:.45;transition:opacity .2s;pointer-events:none}
.pd-art .sheen{position:absolute;inset:0;z-index:3;background:linear-gradient(155deg,#ffffff33 0%,#ffffff05 45%,#ffffff22 100%);opacity:.7;transition:opacity .2s,background .2s;pointer-events:none}
.pd-art .back-sheet{position:absolute;inset:0;background:#fff;border:1px solid #d5d5d5;transform:translate(12px,12px);z-index:-1;transition:transform .2s}
.pd-art .address-zone{position:absolute;top:17px;bottom:17px;left:52%;right:17px;border:1.5px dashed var(--yellow);z-index:6;opacity:.4;display:grid;place-items:center;transition:opacity .2s;pointer-events:none}
.pd-art .hole-mark{position:absolute;left:50%;top:calc(3.6% + 8px);width:29.4cqw;height:29.4cqw;transform:translateX(-50%);border:1.5px dashed var(--yellow);border-radius:50%;background:#ffffff22;z-index:6;opacity:.55;transition:opacity .2s,box-shadow .2s;pointer-events:none}
.pd-art .hole-slit{position:absolute;left:calc(50% + 12cqw);top:8px;height:calc(3.6% + 12cqw);border-left:1.5px dashed var(--yellow);transform:rotate(-32deg);transform-origin:bottom left;z-index:6;opacity:.55;transition:opacity .2s;pointer-events:none}
.pd-art .hole-zone{position:absolute;left:8px;right:8px;top:8px;height:20.5%;border-bottom:1.5px dashed var(--yellow);z-index:6;opacity:.45;display:flex;align-items:flex-end;justify-content:flex-start;padding:0 0 3px 10px;transition:opacity .2s;pointer-events:none}
.pd-art .hole-zone span{font-size:6px;letter-spacing:.08em;color:#fff}
.pd-art.kind-hole .pin-3{left:calc(50% + 14.7cqw - 6px);top:calc(3.6% + 8px + 14.7cqw - 13px);right:auto;bottom:auto}
.pd-art .studio[data-zone=hole] .hole-mark{opacity:1;box-shadow:0 0 0 4px #fde24533}
.pd-art .studio[data-zone=hole] .hole-slit,.pd-art .studio[data-zone=hole] .hole-zone{opacity:1}
.pd-art .studio[data-view=artwork] .hole-mark,.pd-art .studio[data-view=artwork] .hole-slit,.pd-art .studio[data-view=artwork] .hole-zone{visibility:hidden}
.pd-art .address-zone span{font-size:6px;letter-spacing:.08em;color:#fff;text-align:center;line-height:1.6;background:#0648dfcc;padding:3px 4px;border-radius:3px}
.pd-art .diagram-pin{position:absolute;z-index:10;width:27px;height:27px;display:grid;place-items:center;border-radius:50%;font-size:11px;font-weight:650;box-shadow:0 2px 10px #0002;background:#fff;color:var(--ink);border:1px solid #0001;padding:0}
.pd-art .diagram-pin.selected{background:var(--ink);color:#fff;box-shadow:0 0 0 4px #ffffff80}
.pd-art .pin-bleed{right:-12px;top:12%}
.pd-art .pin-safe{left:4px;top:30%}
.pd-art .pin-3{right:-12px;bottom:14px}
.pd-art.kind-folds .pin-3{left:calc(33.3% - 13px);top:-12px;right:auto;bottom:auto}
.pd-art.kind-corners .pin-3{left:-12px;top:-12px;right:auto;bottom:auto}
.pd-art.kind-gloss .pin-3{left:calc(12px + 7cqmin + 67cqw - 12px);top:calc(12px + 9cqmin - 14px);right:auto;bottom:auto}
.pd-art.kind-address .pin-3,.pd-art.kind-sheen .pin-3,.pd-art.kind-edge .pin-3{right:-12px;top:52%;bottom:auto}
.pd-art .width-measure{position:absolute;left:8px;right:8px;top:-19px;height:8px;border:1px solid #a9a5b0;border-bottom:0}
.pd-art .width-measure span{position:absolute;left:50%;top:-11px;transform:translateX(-50%);background:#f5f3fa;padding:0 8px;font-size:7px;white-space:nowrap;letter-spacing:.07em;color:#66616f}
.pd-art .height-measure{position:absolute;left:-21px;top:8px;bottom:8px;width:8px;border:1px solid #a9a5b0;border-right:0}
.pd-art .height-measure span{position:absolute;top:50%;left:-5px;transform:translate(-50%,-50%) rotate(-90deg);background:#f5f3fa;padding:0 10px;font-size:7px;white-space:nowrap;letter-spacing:.07em;color:#66616f}
.pd-art .guide-callout{position:absolute;left:calc(100% + var(--callout-gap));top:min(159px,26%);width:var(--callout-w)}
.pd-art .guide-callout>span{font-size:7px;letter-spacing:.06em;font-weight:650}
.pd-art .guide-callout strong{font-size:51px;font-weight:600;line-height:1.1;letter-spacing:-.07em;display:block;margin-top:11px}
.pd-art .guide-callout p{font-size:10px;line-height:1.6;margin-top:11px;color:#686371}
.pd-art .diagram-legend{bottom:18px}
.pd-art .studio[data-zone=bleed] .bleed-guide{box-shadow:0 0 0 4px #fa36832e}
.pd-art .studio[data-zone=bleed] .safe-guide{opacity:.35}
.pd-art .studio[data-zone=safe] .safe-guide{opacity:1;box-shadow:0 0 0 5px #fde24522}
.pd-art .studio[data-zone=base] .base-zone{background:var(--cyan)}
.pd-art .studio[data-zone=base] .base-zone span{color:var(--ink);opacity:1}
.pd-art .studio[data-zone=base] .safe-guide{opacity:.3}
.pd-art .studio[data-zone=folds] .fold-line{opacity:1;box-shadow:0 0 0 4px #1ecbf233}
.pd-art .studio[data-zone=corners] .corner-mark{opacity:1}
.pd-art .studio[data-zone=edge] .sheet{box-shadow:7px 7px 0 var(--pink),0 0 0 4px #fa36832e,0 16px 24px -14px #1010304a}
.pd-art .studio[data-zone=gloss] .gloss-mark{opacity:1}
.pd-art .studio[data-zone=sheen] .sheen{opacity:1;background:linear-gradient(155deg,#ffffff59 0%,#ffffff12 45%,#ffffff40 100%)}
.pd-art .studio[data-zone=back] .back-sheet{transform:translate(20px,20px)}
.pd-art .studio[data-zone=address] .address-zone{opacity:1}
.pd-art .studio[data-view=artwork] .bleed-guide,.pd-art .studio[data-view=artwork] .trim-guide,.pd-art .studio[data-view=artwork] .safe-guide,.pd-art .studio[data-view=artwork] .diagram-pin,.pd-art .studio[data-view=artwork] .base-zone,.pd-art .studio[data-view=artwork] .guide-callout,.pd-art .studio[data-view=artwork] .diagram-legend,.pd-art .studio[data-view=artwork] .width-measure,.pd-art .studio[data-view=artwork] .height-measure,.pd-art .studio[data-view=artwork] .fold-line,.pd-art .studio[data-view=artwork] .corner-mark,.pd-art .studio[data-view=artwork] .gloss-mark,.pd-art .studio[data-view=artwork] .address-zone,.pd-art .studio[data-view=artwork] .back-sheet{visibility:hidden}
.pd-art .guide-download{display:block;padding:0}
.pd-art .guide-download-main{display:flex;align-items:center;gap:17px;padding:26px;color:inherit}
.pd-art .guide-download-main>svg{margin-left:auto;height:18px;width:18px}
.pd-art .tpl-pills{display:flex;flex-wrap:wrap;align-items:center;gap:7px;padding:0 26px 22px;border-top:1px solid var(--line);margin-top:0;padding-top:16px}
.pd-art .tpl-pills>span{font-size:10px;color:var(--muted);margin-right:4px;width:100%}
.pd-art .tpl-pills a{display:inline-flex;align-items:center;min-height:30px;padding:5px 11px;border:1px solid var(--ink);border-radius:999px;font-size:10px;font-weight:650;color:var(--ink);transition:background .15s,color .15s}
.pd-art .tpl-pills a:hover{background:var(--ink);color:#fff}
@media(max-width:1150px){.pd-art{--k:.93;--callout-w:77px;--callout-gap:16px}.pd-art .guide-callout strong{font-size:42px}.pd-art .guide-callout p{font-size:9px}.pd-art .guide-callout>span{font-size:6px}.pd-art .guide-download-main{padding:21px;gap:12px}.pd-art .tpl-pills{padding-inline:21px}}
@media(max-width:900px){.pd-art{--k:1.05;--callout-w:105px;--callout-gap:23px}.pd-art .guide-callout strong{font-size:50px}.pd-art .guide-callout p{font-size:10px}.pd-art .guide-callout>span{font-size:7px}.pd-art .guide-download-main{padding:22px;gap:13px}.pd-art .guide-download-main>svg{height:15px;width:15px}}
@media(max-width:800px){.pd-art .section-nav{position:static}.pd-art .artwork,.pd-art .proof-section,.pd-faq{scroll-margin-top:100px}}
@media(max-width:600px){.pd-art{--k:.8;--callout-w:49px;--callout-gap:13px}.pd-art .diagram-stage{padding:46px 16px 56px;min-height:280px}.pd-art .sheet-wrap{margin-right:44px}.pd-art .guide-callout>span{font-size:5px;line-height:1.5;display:block}.pd-art .guide-callout strong{font-size:33px;margin-top:8px}.pd-art .guide-callout p{font-size:7px;line-height:1.6;margin-top:8px}.pd-art .diagram-pin{width:25px;height:25px;font-size:10px}.pd-art .pin-bleed,.pd-art .pin-3{right:-10px}.pd-art.kind-corners .pin-3{left:-10px;top:-10px}.pd-art .bleed-guide{border-width:7px}.pd-art .trim-guide{inset:7px}.pd-art .safe-guide{inset:14px 14px calc(14px + var(--safe-extra,0px))}.pd-art.kind-base{--base-h:23px;--safe-extra:31px}.pd-art .base-zone{height:33px;left:7px;right:7px;bottom:7px}.pd-art .base-zone span{font-size:5px;letter-spacing:.06em}.pd-art .sheet-design{inset:10px 10px calc(10px + var(--base-h,0px))}.pd-art .width-measure span,.pd-art .height-measure span{font-size:6px}.pd-art .corner-mark{width:26px;height:26px}.pd-art .guide-download-main{padding:22px;gap:15px}.pd-art .tpl-pills{padding:14px 22px 20px}}
@media(max-width:400px){.pd-art{--k:.7;--callout-w:41px;--callout-gap:11px}.pd-art .guide-callout strong{font-size:30px}.pd-art .guide-callout p{font-size:6px}}
@media(prefers-reduced-motion:reduce){.pd-art *,.pd-art *:before,.pd-art *:after{transition:none!important;animation:none!important}}


/* ---- footer: a clear catalogue grid with secondary links below ---- */
.footer.footer-refined{display:block;padding-block:44px 28px}
.footer-refined .footer-brand{display:flex;align-items:center;gap:32px;padding-bottom:36px;border-bottom:1px solid var(--line)}
.footer-refined .logo{flex-shrink:0}
.footer-refined .logo img{width:207px;max-width:100%;height:auto}
.footer-refined .footer-tag{font-size:15px;line-height:1.5;color:#535762;margin:0;max-width:34ch}
.footer-shop-link{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;margin-left:auto;color:var(--blue);font-size:14px;font-weight:700;white-space:nowrap}
.footer-directory{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:36px 28px;padding-block:36px 40px}
.footer-refined .footer-col{display:block;min-width:0}
.footer-refined .footer-h{font-size:14px;line-height:1.4;font-weight:800;letter-spacing:0;margin:0 0 14px}
.footer-refined ul{list-style:none;padding:0;margin:0}
.footer-refined .footer-col ul{display:grid;gap:5px}
.footer-refined .footer-col li a{display:block;width:fit-content;max-width:100%;padding-block:4px;font-size:14px;line-height:1.5;color:#535762}
.footer-refined a:hover{color:var(--blue);text-decoration:underline;text-underline-offset:4px}
.footer-bottom{display:grid;grid-template-columns:1fr auto;gap:14px 32px;padding-top:24px;border-top:1px solid var(--line)}
.footer-refined .footer-bottom nav{display:block;font-size:13px}
.footer-bottom ul{display:flex;flex-wrap:wrap;gap:8px 24px}
.footer-bottom a{display:inline-block;padding-block:4px;font-size:13px;line-height:1.5;color:#626671}
.footer-refined .footer-legal{justify-self:end}
.footer-refined .footer-bottom .footer-compare{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 24px}
.footer-compare-label{font-size:12px;line-height:1.5;color:#626671}
.footer-refined .footer-copyright{align-self:center;justify-self:end;margin:0;font-size:12px;line-height:1.5;color:#626671}
@media(max-width:1100px){
  .footer-directory{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 40px}
  .footer-refined .footer-brand{gap:24px}
  .footer-bottom{gap:12px 24px}
  .footer-refined .footer-bottom .footer-compare{grid-column:1/-1;grid-row:2}
  .footer-refined .footer-copyright{grid-column:1/-1;justify-self:start}
}
@media(max-width:640px){
  .footer.footer-refined{padding-block:32px 24px}
  .footer-refined .footer-brand{display:grid;grid-template-columns:1fr;gap:14px;padding-bottom:24px}
  .footer-refined .footer-tag{font-size:14px;max-width:none}
  .footer-shop-link{justify-self:start;margin-left:0;min-height:44px}
  .footer-directory{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px;padding-block:28px 32px}
  .footer-refined .footer-h{margin-bottom:10px}
  .footer-refined .footer-col ul{gap:0}
  .footer-refined .footer-col li a{min-height:40px;display:flex;align-items:center;padding-block:8px}
  .footer-bottom{grid-template-columns:1fr;gap:10px;padding-top:20px}
  .footer-bottom ul{gap:4px 24px}
  .footer-bottom a{min-height:40px;padding-block:10px}
  .footer-refined .footer-legal{justify-self:start}
  .footer-refined .footer-bottom .footer-compare{grid-row:auto;display:block;margin-top:8px}
  .footer-compare-label{display:block;margin-bottom:6px}
  .footer-refined .footer-compare ul{display:grid;gap:0}
  .footer-refined .footer-copyright{margin-top:12px}
}


/* ---- collection pages: hero, facts, catalogue heading, design cross-sell ---------
   Ported from the approved concept (minus the pill, the caps labels and the photo
   switcher); the button is the site's cobalt. Copy is authored per collection in
   archive-product.php. */
.col-crumbs{font-size:12px;color:#62606a;display:flex;gap:12px;align-items:center;padding:6px 0 23px}
.col-crumbs a:hover{text-decoration:underline;text-underline-offset:4px}
.col-crumbs [aria-current]{color:var(--ink)}
.col-hero{display:grid;grid-template-columns:1.12fr .88fr;min-height:488px;border-radius:22px;overflow:hidden;background:#f4f0fa}
.col-hero-copy{padding:46px 40px 30px 48px;display:flex;flex-direction:column;align-items:flex-start}
.col-hero h1{margin:0;font-size:clamp(50px,5.1vw,77px);font-weight:600;letter-spacing:-.063em;line-height:.99}
.col-hero h1 em,.col-catalog-head h2 em,.col-invite h2 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.065em;font-style:italic}
.col-hero h1 em{color:var(--blue);white-space:nowrap}
.col-hero-lede{margin:24px 0 0;font-size:16px;line-height:1.65;color:#52505c;max-width:44ch}
.col-hero-cta{margin-top:27px;gap:22px}
.col-hero-cta span{font-size:22px;line-height:1;font-weight:400}
.col-hero-foot{margin-top:auto;padding-top:33px;display:flex;align-items:center;gap:14px}
.col-hero-foot p{margin:0;font-size:12px;color:#52505c}
.col-dots{display:flex;padding-right:4px}
.col-dots i{width:15px;height:15px;border-radius:50%;margin-right:-4px;border:1px solid #f4f0fa;background:var(--magenta)}
.col-dots i:nth-child(2){background:var(--yellow)}.col-dots i:nth-child(3){background:var(--cyan)}.col-dots i:nth-child(4){background:var(--blue)}.col-dots i:nth-child(5){background:var(--lavender)}
.col-hero-photo{position:relative;overflow:hidden;background:#0642eb;min-height:420px}
.col-hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 57%}
.col-hero-tag{position:absolute;bottom:19px;right:22px;background:#fff;border-radius:7px;padding:10px 12px;font-size:12px;font-weight:600;display:flex;gap:22px;align-items:center;box-shadow:0 4px 18px #0001;min-height:39px;color:var(--ink);transition:background .15s}
.col-hero-tag span{font-size:17px;line-height:1;font-weight:400}
.col-hero-tag:hover{background:var(--yellow)}
.col-facts{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:92px;border-bottom:1px solid var(--line);padding:19px 22px}
.col-facts p{margin:0;font-size:13px;display:flex;gap:5px;align-items:center;color:#62606a;white-space:nowrap}
.col-facts strong{font-weight:600;color:var(--ink)}
.col-fact-icon{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;flex-shrink:0;margin-right:7px;color:var(--ink);font-size:20px}
.col-fact-icon.pink{background:var(--magenta)}.col-fact-icon.yellow{background:var(--yellow)}.col-fact-icon.cyan{background:var(--cyan)}
.col-catalog{padding-top:55px;scroll-margin-top:120px}
.col-catalog-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:31px}
.col-catalog-head h2{margin:0;font-size:44px;letter-spacing:-.055em;line-height:1.05;font-weight:600}
.col-design-link{font-size:13px;display:flex;align-items:center;gap:16px;padding-block:9px;border-bottom:1px solid #ccc;white-space:nowrap;color:var(--ink)}
.col-design-link span{font-size:19px;line-height:1}
.col-design-link:hover{color:var(--blue);border-color:var(--blue)}
.col-body{min-width:0}
.col-results{margin:0 0 16px;font-size:12px;color:#62606a}
.col-guide-links{margin:34px 0 0;display:grid;gap:10px;justify-items:start}
.col-guide-link{margin:0;display:flex}  /* the editorial guide that serves this collection; reuses the design-link style */
.col-guide-link .col-design-link{white-space:normal}
.collection-shell{padding-bottom:0}
.col-invite{border-radius:15px;background:var(--yellow);display:flex;align-items:center;gap:28px;padding:31px 35px;margin:65px 0 60px}
.col-invite-spark{font-size:68px;line-height:1;font-family:Arial,sans-serif}
.col-invite p{margin:0 0 8px;font-size:12px;color:#3d3d3d}
.col-invite h2{margin:0;font-size:30px;letter-spacing:-.035em;font-weight:600;line-height:1.1}
.col-invite>div{flex:1 1 auto;min-width:0}
.col-invite .button{margin-left:auto;flex-shrink:0;gap:18px}
.col-invite .button span{font-size:20px;line-height:1;font-weight:400}
@media(max-width:1200px){.col-hero-copy{padding:36px 29px 27px 34px}.col-hero{min-height:465px}.col-hero h1{font-size:5.15vw}.col-hero-lede{font-size:14px}.col-hero-photo{min-height:390px}.col-facts{padding-inline:5px;gap:15px}.col-facts p{font-size:11px;gap:4px}.col-fact-icon{margin-right:5px;width:26px;height:26px}.col-catalog-head h2{font-size:39px}.col-invite{padding:29px;gap:23px}.col-invite h2{font-size:27px}.col-invite-spark{font-size:54px}}
@media(max-width:900px){.col-crumbs{font-size:11px}.col-hero{min-height:430px;grid-template-columns:1fr 1fr}.col-hero-copy{padding:30px 23px}.col-hero h1{font-size:5.6vw;letter-spacing:-.07em}.col-hero-lede{font-size:13px;margin-top:21px}.col-hero-cta{margin-top:23px}.col-hero-foot{gap:10px;padding-top:27px}.col-hero-foot p{font-size:11px}.col-dots i{height:12px;width:12px}.col-hero-photo{min-height:367px}.col-hero-photo img{object-position:center}.col-hero-tag{bottom:16px;right:15px;font-size:11px;min-height:35px;padding:7px 10px;gap:17px}.col-facts{gap:12px;align-items:flex-start;min-height:91px;padding-block:22px}.col-facts p{font-size:11px;white-space:normal;display:block;position:relative;padding-left:32px;line-height:1.7}.col-fact-icon{position:absolute;left:0;top:1px;width:23px;height:26px;font-size:18px}.col-catalog{padding-top:42px}.col-catalog-head{gap:24px;margin-bottom:27px}.col-catalog-head h2{font-size:33px}.col-design-link{font-size:11px;gap:10px}.col-invite{padding:25px;gap:18px;flex-wrap:wrap;margin-top:48px;margin-bottom:45px}.col-invite h2{font-size:25px;max-width:360px}.col-invite .button{min-height:44px}.col-invite-spark{font-size:44px}}
@media(max-width:600px){.col-crumbs{font-size:10px;padding:3px 0 18px;gap:10px}.col-hero{display:flex;flex-direction:column;border-radius:17px;min-height:0}.col-hero-copy{padding:27px 26px 25px}.col-hero h1{font-size:clamp(40px,11.5vw,65px);letter-spacing:-.06em;line-height:1}.col-hero-lede{font-size:13px;line-height:1.65;margin-top:19px;max-width:320px}.col-hero-cta{margin-top:21px}.col-hero-foot{display:none}.col-hero-photo{min-height:0;aspect-ratio:1.12;flex:none}.col-hero-photo img{object-position:center 55%}.col-hero-tag{right:17px;bottom:17px;min-height:37px;font-size:10px;padding:8px 11px}.col-facts{padding:22px 1px;min-height:0;gap:13px;justify-content:space-between}.col-facts p{padding-left:0;font-size:10px;line-height:1.55;flex:1;max-width:120px}.col-fact-icon{position:static;display:grid;margin:0 0 9px;width:26px;height:27px;font-size:20px}.col-catalog{padding-top:33px;scroll-margin-top:100px}.col-catalog-head{display:block;margin-bottom:25px}.col-catalog-head h2{font-size:34px}.col-design-link{font-size:11px;display:inline-flex;margin-top:13px;gap:14px;min-height:42px}.col-results{margin:6px 0 14px;font-size:11px}.col-invite{padding:25px;display:block;margin:39px 0 35px;border-radius:13px}.col-invite-spark{font-size:38px;display:block;margin-bottom:19px}.col-invite h2{font-size:30px;line-height:1.08;max-width:280px}.col-invite .button{margin:22px 0 0;min-height:46px}}

/* SEO TEMPLATE START: append this block to the existing theme styles.css. */
.seo-page{padding-bottom:16px}.seo-wrap{width:min(1200px,calc(100% - 80px));margin-inline:auto}.seo-hero{display:grid;grid-template-columns:1.18fr 1fr;gap:72px;align-items:center;padding-block:52px 76px}.seo-hero h1{font-size:clamp(44px,5.4vw,76px);font-weight:800;letter-spacing:-.055em;line-height:1.02;max-width:650px}.seo-highlight{color:var(--cyan-ink)}.seo-intro{font-size:20px;line-height:1.65;margin-top:26px;max-width:570px}.seo-jump{display:inline-flex;gap:40px;align-items:center;margin-top:27px;padding-block:12px;border-bottom:1px solid var(--ink);font-size:15px;font-weight:600}.seo-hero-figure{margin:0;position:relative;min-width:0}.seo-hero-figure img{width:100%;height:410px;object-fit:cover;object-position:center 39%;border-radius:18px;display:block}.seo-hero-figure figcaption{font-size:13px;line-height:1.5;margin-top:13px;color:#525252}.seo-guide{display:grid;grid-template-columns:245px minmax(0,1fr);gap:80px;border-top:1px solid var(--line);padding-top:58px}.seo-aside{min-width:0}.seo-toc{position:sticky;top:132px;padding-right:8px}.seo-toc h2{font-size:17px;letter-spacing:-.02em;margin-bottom:16px}.seo-toc a{display:block;font-size:14px;line-height:1.45;padding:10px 0;color:#595959}.seo-toc a:hover{color:var(--blue);text-decoration:underline;text-underline-offset:4px}.seo-article{max-width:770px;min-width:0}.seo-answer{border-left:3px solid var(--cyan);padding:1px 0 1px 26px;margin-bottom:57px}.seo-answer p{font-size:22px;line-height:1.55;font-weight:500;letter-spacing:-.018em}.seo-body-section{margin-bottom:58px;scroll-margin-top:130px}.seo-body-section h2,.seo-section-head h2,.seo-products h2,.seo-closing h2{font-size:clamp(30px,3.1vw,43px);line-height:1.12;font-weight:800;letter-spacing:-.045em}.seo-body-section h2{max-width:680px;margin-bottom:22px}.seo-body-section p{font-size:18px;line-height:1.8;color:#343434;margin-bottom:19px}.seo-body-section ul{margin:24px 0;padding-left:23px}.seo-body-section li{font-size:17px;line-height:1.7;margin-bottom:10px;padding-left:5px}.seo-body-section li::marker{color:var(--blue)}.seo-inline-link{display:inline-flex;gap:20px;margin-top:3px;color:var(--blue);font-size:16px;font-weight:600;text-decoration:underline;text-underline-offset:5px}.seo-data{padding:48px 0 72px;border-top:1px solid var(--line);scroll-margin-top:125px}.seo-section-head{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start;margin-bottom:32px}.seo-section-head p{font-size:17px;line-height:1.65;color:#535353;max-width:450px}.seo-table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:15px}.seo-table{border-collapse:collapse;width:100%;font-size:16px;line-height:1.5;text-align:left}.seo-table th,.seo-table td{padding:21px 26px;vertical-align:top;border-bottom:1px solid var(--line)}.seo-table thead{background:var(--blue);color:var(--white)}.seo-table thead th{font-weight:600}.seo-table tbody th{font-weight:600;width:26%}.seo-table tbody tr:nth-child(even){background:#f7f7f7}.seo-table tr:last-child td,.seo-table tr:last-child th{border-bottom:0}.seo-faq{display:grid;grid-template-columns: .8fr 1.2fr;gap:85px;padding-block:60px 75px;border-top:1px solid var(--line);scroll-margin-top:125px}.seo-faq .seo-section-head{display:block;margin:0}.seo-faq .seo-section-head p{margin-top:21px;max-width:290px}.seo-faq-list details{border-bottom:1px solid var(--line)}.seo-faq-list details:first-child{border-top:1px solid var(--line)}.seo-faq-list summary{list-style:none;cursor:pointer;font-size:19px;line-height:1.4;font-weight:600;display:flex;gap:25px;align-items:center;justify-content:space-between;padding:24px 0}.seo-faq-list summary::-webkit-details-marker{display:none}.seo-faq-list summary::after{content:'+';font-size:25px;font-weight:400;flex:0 0 20px;color:var(--blue)}.seo-faq-list details[open] summary::after{content:'−'}.seo-faq-list details p{padding:0 33px 24px 0;font-size:17px;line-height:1.75;color:#484848}.seo-faq-list summary:focus-visible,.seo-table-scroll:focus-visible{outline:3px solid var(--orange);outline-offset:5px}.seo-products{padding-block:50px 65px;border-top:1px solid var(--line);scroll-margin-top:125px}.seo-product-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:30px;gap:28px}.seo-product-link{display:block;border-top:2px solid var(--ink);padding:22px 0 18px}.seo-product-link h3{font-size:23px;font-weight:700;letter-spacing:-.025em;display:flex;justify-content:space-between;gap:12px}.seo-product-link p{font-size:16px;line-height:1.6;margin-top:14px;max-width:290px;color:#535353}.seo-product-link:hover h3{color:var(--blue)}.seo-closing{display:flex;align-items:center;justify-content:space-between;gap:50px;background:color-mix(in srgb,var(--cyan) 13%,white);padding:48px;border-radius:18px;margin-bottom:55px}.seo-closing h2{max-width:680px}.seo-closing p{font-size:17px;line-height:1.6;margin-top:15px;max-width:570px}.seo-button{display:inline-flex;align-items:center;justify-content:center;gap:30px;white-space:nowrap;padding:18px 25px;background:var(--blue);color:var(--white);border-radius:12px;font-size:15px;font-weight:600;min-height:52px}.seo-button:hover{background:#0038b9}.seo-footer{padding:32px 0 48px;border-top:1px solid var(--line);display:flex;gap:30px;align-items:center;justify-content:space-between}.seo-footer img{width:130px;height:auto}.seo-footer p,.seo-footer>a:last-child{font-size:13px;line-height:1.6}.seo-footer>a:last-child{max-width:235px;text-decoration:underline;text-underline-offset:4px}.seo-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1000px){.seo-hero{gap:35px}.seo-hero-figure img{height:365px}.seo-guide{grid-template-columns:195px minmax(0,1fr);gap:40px}.seo-faq{gap:40px}.seo-closing{padding:35px;gap:30px}.seo-section-head{gap:35px}.seo-table th,.seo-table td{padding:18px}.seo-closing h2{font-size:34px}}
@media(max-width:760px){.seo-wrap{width:calc(100% - 40px)}.seo-hero{grid-template-columns:1fr;gap:30px;padding-block:30px 40px}.seo-hero h1{font-size:clamp(42px,10.6vw,64px)}.seo-intro{font-size:18px;line-height:1.65;margin-top:23px}.seo-jump{margin-top:16px}.seo-hero-figure img{height:290px;object-position:center 39%}.seo-hero-figure figcaption{font-size:12px}.seo-guide{display:block;padding-top:28px}.seo-toc{position:static;padding:0 0 24px;border-bottom:1px solid var(--line);margin-bottom:35px}.seo-toc a{padding-block:8px}.seo-toc h2{margin-bottom:8px}.seo-answer{padding-left:20px;margin-bottom:40px}.seo-answer p{font-size:20px}.seo-body-section{margin-bottom:42px;scroll-margin-top:95px}.seo-body-section h2{font-size:31px}.seo-body-section p{font-size:17px;line-height:1.75}.seo-section-head{display:block}.seo-section-head p{margin-top:19px}.seo-data{padding:37px 0 44px}.seo-table{font-size:14px;min-width:575px}.seo-table th,.seo-table td{padding:16px}.seo-faq{display:block;padding-block:39px}.seo-faq-list{margin-top:26px}.seo-faq-list summary{font-size:18px;padding:21px 0}.seo-faq-list details p{font-size:16px}.seo-products{padding-block:37px}.seo-product-row{grid-template-columns:1fr;gap:12px;margin-top:25px}.seo-product-link{padding-bottom:20px}.seo-product-link p{max-width:none;margin-top:9px}.seo-closing{display:block;padding:28px;margin-bottom:35px}.seo-closing h2{font-size:32px}.seo-button{margin-top:23px;white-space:normal}.seo-footer{flex-wrap:wrap;gap:20px;padding-bottom:30px}.seo-footer p{max-width:170px}.seo-footer>a:last-child{max-width:none;width:100%}.seo-data,.seo-faq,.seo-products{scroll-margin-top:90px}}
/* SEO TEMPLATE END */ */

/* ---- artwork upload + preflight on product pages ---- */
.brandable-cart{margin:22px 0 0}
.brandable-cart .wc-notices:empty{display:none}
.brandable-cart .woocommerce-error,.brandable-cart .woocommerce-message,.brandable-cart .woocommerce-info{list-style:none;margin:0 0 14px;padding:12px 14px;border-radius:10px;background:#fff7ed;border:1px solid #fed7aa;font-size:14px}
.artwork-block{margin:0 0 18px}
.artwork-block>.opt-group{margin-top:20px}
.art-lede{margin:10px 0 0;color:var(--muted,#5d6068);font-size:13.5px}
.art-lede a{color:inherit;text-decoration:underline}
.art-panel{margin:14px 0 0}
.art-panel.is-open{animation:artIn .22s ease-out}
@keyframes artIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.art-drops{display:grid;gap:12px}
@media (min-width:720px){.art-drops{grid-template-columns:1fr 1fr}}
.art-drop{border:1.5px dashed #c9ccd3;border-radius:14px;padding:14px;background:#fff;position:relative;transition:border-color .15s,background .15s}
.art-drop.is-over{border-color:#0648DF;background:#f3f6ff}
.art-drop.is-busy{border-style:solid;border-color:#0648DF}
.art-drop.is-error{border-color:#b91c1c;background:#fff5f5}
.art-drop.is-covered{border-style:solid;border-color:#e6e7ea;background:#f7f8fa}
.art-drop.has-file{border-style:solid;border-color:#e6e7ea}
.art-target{display:block;cursor:pointer}
.art-target input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.art-label{display:block;font-weight:700}
.art-hint{display:block;font-size:13px;color:var(--muted,#5d6068);margin-top:2px}
.art-drop.has-file .art-hint,.art-drop.is-covered .art-target{display:none}
.art-preview{margin:10px 0 0;line-height:0}
.art-preview:empty{display:none}
.art-canvas{width:100%;height:auto;border:1px solid #e6e7ea;border-radius:6px;background:#fff}
.art-status{margin:8px 0 0;font-size:13.5px;font-weight:600}
.art-status:empty{display:none}
.art-checks{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:4px;font-size:13px;color:#333}
.art-checks:empty{display:none}
.art-checks li{padding:6px 9px;border-radius:8px;background:#f7f8fa}
.art-checks.is-warn li{background:#fff7ed}
.art-checks.is-bad li{background:#fef2f2}
.art-remove{display:none;margin-top:8px;font-size:13px}
.art-drop.has-file .art-remove{display:inline}
.art-prompt{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:#fff7ed;border:1px solid #fed7aa;font-size:14px}
#cta-price{font-weight:800}

/* SEO COMPARISON TEMPLATE START
   Append this block to the live theme's existing styles.css. No second stylesheet.
   Existing theme tokens and Figtree are reused. Every added class uses seo-.
*/
.seo-vs-body{background:#fff;color:var(--ink)}
.seo-vs-page{overflow:clip}
.seo-vs-page figure{margin:0}
.seo-vs-page [hidden]{display:none!important}
.seo-vs-wrap{width:min(1240px,calc(100% - 96px));margin-inline:auto}
.seo-vs-page h1,.seo-vs-page h2,.seo-vs-page h3{font-family:var(--sans);text-wrap:balance}
.seo-vs-page h2{font-size:clamp(40px,4.4vw,64px);line-height:1.02;letter-spacing:-.058em;font-weight:800}
.seo-vs-page p{line-height:1.6}
.seo-vs-cyan{color:var(--cyan-ink)}
.seo-vs-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.seo-vs-logo img{display:block;width:214px;height:auto}
.seo-vs-button{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:58px;padding:17px 26px;border-radius:12px;background:var(--blue);color:white;font-size:16px;font-weight:700;line-height:1.3;transition:transform .18s,background .18s}
.seo-vs-button:hover{background:#0039b6;transform:translateY(-2px)}
.seo-vs-button span{font-size:23px;line-height:1}
.seo-vs-hero{padding:68px 0 20px;text-align:center;position:relative}
.seo-vs-hero h1{font-size:clamp(54px,7.6vw,110px);font-weight:800;line-height:.99;letter-spacing:-.068em;margin:0 auto;max-width:1080px;position:relative;z-index:1}
.seo-vs-comparison-title{display:block;font-size:21px;letter-spacing:-.035em;font-weight:600;line-height:1.4;margin-bottom:22px}
.seo-vs-hero h1 .seo-vs-cyan{position:relative;white-space:nowrap}
.seo-vs-lead{font-size:19px;max-width:605px;margin:26px auto 25px;color:#55565c;text-wrap:pretty}
.seo-vs-actions{display:flex;gap:30px;align-items:center;justify-content:center}
.seo-vs-text-link{display:inline-flex;align-items:center;gap:17px;font-weight:700;font-size:16px;line-height:1.5;padding:10px 0;text-decoration:underline;text-underline-offset:5px;text-decoration-color:#c7c9d0;transition:color .2s}
.seo-vs-text-link:hover{color:var(--blue);text-decoration-color:var(--blue)}
.seo-vs-spark{position:absolute;width:80px;height:80px;fill:var(--magenta);transform:rotate(10deg);top:138px;left:12px}
.seo-vs-spark-two{width:52px;height:52px;fill:var(--yellow);top:274px;left:auto;right:8px;transform:rotate(-12deg)}
.seo-vs-showcase{display:grid;grid-template-columns:1fr 1.72fr 1fr;gap:22px;align-items:center;margin:65px 10px 0;padding-bottom:22px}
.seo-vs-showcase figure{position:relative;border-radius:22px;overflow:hidden;box-shadow:0 18px 30px -26px #17214355;isolation:isolate}
.seo-vs-showcase img{display:block;width:100%;height:100%;object-fit:cover}
.seo-vs-showcase-main{aspect-ratio:1.17;background:var(--blue);transform:rotate(-3deg);z-index:2}
.seo-vs-showcase-main img{object-position:center 45%;transform:scale(1.02)}
.seo-vs-showcase-main figcaption{position:absolute;bottom:18px;left:22px;right:22px;color:white;display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:15px}
.seo-vs-showcase-main svg{fill:var(--mint);height:30px;width:30px;transform:rotate(10deg)}
.seo-vs-showcase-side{aspect-ratio:.88;transform:rotate(-7deg)}
.seo-vs-showcase-side:last-child{transform:rotate(7deg)}
.seo-vs-showcase-side img{object-position:center;transform:scale(1.1)}
.seo-vs-showcase-side figcaption{position:absolute;left:20px;top:20px;text-align:left;font-size:19px;font-weight:800;line-height:1.1;letter-spacing:-.035em}
.seo-vs-hero-note{margin:12px 0 25px;font-size:14px;color:#62636b}
.seo-vs-subnav{position:sticky;top:0;z-index:15;border-block:1px solid var(--line);background:rgba(255,255,255,.94);backdrop-filter:blur(16px)}
.seo-vs-subnav>div{display:flex;justify-content:center;gap:42px;max-width:100%;overflow:auto;padding:0 24px;scrollbar-width:none}
.seo-vs-subnav a{font-size:14px;font-weight:600;white-space:nowrap;min-height:66px;display:flex;align-items:center;border-bottom:3px solid transparent;padding-top:3px;color:#65656e}
.seo-vs-subnav a:hover,.seo-vs-subnav a[aria-current]{color:var(--blue);border-bottom-color:var(--blue)}
.seo-vs-section{padding-top:108px;padding-bottom:36px;scroll-margin-top:90px}
.seo-vs-section-head{text-align:center;max-width:790px;margin:0 auto 48px}
.seo-vs-section-head p{font-size:18px;color:#60616b;margin:22px auto 0;max-width:660px}
.seo-vs-table-region{border:1px solid #e3e6ed;border-radius:22px;overflow:auto}
.seo-vs-table{width:100%;border-collapse:separate;border-spacing:0;text-align:left;table-layout:fixed}
.seo-vs-table th,.seo-vs-table td{padding:25px 30px;vertical-align:middle;border-bottom:1px solid #e4e7ee;font-size:15px;line-height:1.55}
.seo-vs-table thead th{height:158px;background:#f7f7f9;vertical-align:middle}
.seo-vs-table thead th:first-child{width:27%;background:white}
.seo-vs-table thead th.seo-vs-brand-col{background:var(--blue);color:white}
.seo-vs-table thead th>strong{font-size:33px;letter-spacing:-.055em;display:block}
.seo-vs-table thead th>span{display:block;font-size:13px;font-weight:400;margin-top:11px}
.seo-vs-table thead img{width:min(220px,95%);height:auto;display:block}
.seo-vs-table .seo-vs-table-prompt{font-size:27px;font-weight:700;line-height:1.1;letter-spacing:-.045em;margin:0}
.seo-vs-table-prompt span{display:block;margin-top:15px;color:var(--magenta);font-size:36px}
.seo-vs-table tbody th{font-weight:650;letter-spacing:-.015em;background:white}
.seo-vs-table td{color:#666773;background:#fafafa}
.seo-vs-table td.seo-vs-brand-col{background:#f0f5ff;color:#162a55;font-weight:500;position:relative;padding-left:58px}
.seo-vs-cell-mark{position:absolute;left:25px;color:var(--blue);font-size:22px;top:50%;transform:translateY(-50%)}
.seo-vs-table tr:last-child>*{border-bottom:0}
.seo-vs-table-note{font-size:12px;color:#6b6d75;max-width:930px;margin:19px auto 0;text-align:center}
.seo-vs-table-note a{color:var(--blue);white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.seo-vs-features{padding-top:80px}
.seo-vs-feature{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:92px;margin-bottom:110px;scroll-margin-top:100px}
.seo-vs-feature-reverse .seo-vs-feature-art{order:2}
.seo-vs-feature-art{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:1/1.06;min-width:0}
.seo-vs-feature-art>img{display:block;width:100%;height:100%;object-fit:cover}
.seo-vs-feature-copy{max-width:505px}
.seo-vs-number{font-size:17px;font-weight:600;color:var(--blue);display:block;margin-bottom:23px;border-bottom:2px solid var(--cyan);padding-bottom:8px;width:30px}
.seo-vs-feature-copy h2{font-size:clamp(36px,3.7vw,54px)}
.seo-vs-feature-copy p{font-size:16px;color:#676873;margin-top:20px}
.seo-vs-feature-copy .seo-vs-feature-intro{font-size:20px;line-height:1.5;color:#252731;margin-top:25px}
.seo-vs-feature-copy .seo-vs-text-link{margin-top:23px;color:var(--blue)}
.seo-vs-pink{background:var(--magenta)}
.seo-vs-cyan-bg{background:var(--cyan)}
.seo-vs-lavender{background:var(--lavender)}
.seo-vs-yellow{background:var(--yellow)}
.seo-vs-blue{background:var(--blue)}
.seo-vs-price-card{position:absolute;bottom:25px;left:25px;background:#fff;box-shadow:0 8px 35px #3f10271a;border-radius:16px;padding:20px 23px;transform:rotate(-4deg);text-align:left}
.seo-vs-price-card>span{font-size:13px;font-weight:600;display:block}
.seo-vs-price-card strong{font-size:60px;line-height:1.1;font-weight:800;letter-spacing:-.06em;display:block;margin:6px 0;color:var(--blue)}
.seo-vs-price-card small{font-size:11px;color:#666}
.seo-vs-finish{display:flex;flex-direction:column;overflow:hidden;background:#f6f7fa;aspect-ratio:1/1.06}
.seo-vs-finish-panels{flex:1;min-height:0;position:relative}
.seo-vs-finish-panel{height:100%;position:relative}
.seo-vs-finish-panel img{width:100%;height:100%;object-fit:cover;display:block}
.seo-vs-finish-panel figcaption{position:absolute;top:26px;left:26px;right:22px;font-size:24px;font-weight:750;letter-spacing:-.04em;line-height:1.1;max-width:235px}
.seo-vs-finish-panel:last-child figcaption{color:white}
.seo-vs-finish-tabs{display:flex;gap:5px;padding:13px;background:#f3f4f7;flex-shrink:0}
.seo-vs-finish-tabs button{flex:1;min-height:43px;padding:10px 9px;background:transparent;border-radius:8px;font-weight:600;font-size:12px;color:#595d69}
.seo-vs-finish-tabs button[aria-selected="true"]{background:white;color:var(--blue);box-shadow:0 2px 8px #0000000c}
.seo-vs-service-art{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:35px 40px;background:#ddd0fb}
.seo-vs-orbit{position:absolute;inset:8% 20%;border:1px solid #8c64ce;border-radius:50%;transform:rotate(40deg)}
.seo-vs-service-slip{width:88%;padding:19px 24px;display:flex;align-items:center;justify-content:space-between;gap:17px;border-radius:12px;position:relative;box-shadow:0 10px 15px #31135812;min-height:125px}
.seo-vs-service-slip strong{font-size:29px;line-height:1.04;letter-spacing:-.045em;margin-right:auto}
.seo-vs-service-slip>span:first-child{font-size:12px;align-self:flex-start}
.seo-vs-service-slip>span:last-child{font-size:34px;align-self:flex-end}
.seo-vs-slip-print{background:var(--yellow);transform:rotate(-8deg) translate(-9px,3px);z-index:1}
.seo-vs-slip-web{background:white;transform:rotate(5deg);z-index:2}
.seo-vs-slip-work{background:var(--blue);color:white;transform:rotate(-4deg) translate(7px,-2px);z-index:3}
.seo-vs-choice{padding:0 0 15px}
.seo-vs-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.seo-vs-choice-grid article{padding:34px 38px 27px;border:1px solid #e5e6eb;border-radius:22px}
.seo-vs-choice-grid .seo-vs-choice-brand{background:#f1f5ff;border-color:#dce6fd}
.seo-vs-choice-icon{color:var(--blue);font-size:40px;display:block;line-height:1;margin-bottom:24px}
.seo-vs-choice-grid article:last-child .seo-vs-choice-icon{color:#989ba5}
.seo-vs-choice-grid h3{font-size:29px;line-height:1.1;letter-spacing:-.04em;max-width:360px;font-weight:750}
.seo-vs-choice-grid p{font-size:16px;margin-top:20px;color:#5d6371}
.seo-vs-choice-grid .seo-vs-text-link{font-size:14px;margin-top:16px}
.seo-vs-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px}
.seo-vs-product-image{border-radius:20px;overflow:hidden;aspect-ratio:1;position:relative}
.seo-vs-product-image img{height:100%;width:100%;object-fit:cover;display:block;transition:transform .4s}
.seo-vs-product:hover img{transform:scale(1.04)}
.seo-vs-product-arrow{position:absolute;bottom:17px;right:17px;background:white;border-radius:50%;height:45px;width:45px;display:grid;place-items:center;font-size:25px;color:var(--ink)}
.seo-vs-product h3{font-size:24px;font-weight:750;letter-spacing:-.04em;margin:20px 0 5px}
.seo-vs-product p{font-size:15px;color:#686b75}
.seo-vs-all{display:flex;width:fit-content;margin:34px auto 0;color:var(--blue)}
.seo-vs-faq{display:grid;grid-template-columns:.78fr 1.22fr;gap:80px;padding:85px 0 110px;scroll-margin-top:100px}
.seo-vs-faq-heading h2{font-size:78px;line-height:.99;letter-spacing:-.065em}
.seo-vs-faq-heading p{font-size:18px;margin-top:23px;color:#626672}
.seo-vs-question-art{font-size:170px;font-weight:850;line-height:1.2;color:var(--magenta);transform:rotate(-16deg);display:block;margin-left:70px;width:fit-content;letter-spacing:-.1em}
.seo-vs-faq-list{border-top:1px solid #dce0e8}
.seo-vs-faq-item{border-bottom:1px solid #dce0e8}
.seo-vs-faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:22px;list-style:none;cursor:pointer;padding:25px 0;font-size:18px;font-weight:650;line-height:1.4;letter-spacing:-.015em}
.seo-vs-faq-item summary::-webkit-details-marker{display:none}
.seo-vs-faq-item summary>span{font-size:27px;font-weight:400;color:var(--blue);flex:none;transition:transform .18s}
.seo-vs-faq-item[open] summary>span{transform:rotate(45deg)}
.seo-vs-faq-item[open] summary{color:var(--blue)}
.seo-vs-faq-item p{font-size:16px;color:#5e6370;padding:0 36px 26px 0}
.seo-vs-page summary:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.seo-vs-closing-inner{position:relative;overflow:hidden;text-align:center;background:var(--blue);color:white;border-radius:28px;padding:76px 45px 65px}
.seo-vs-closing h2{position:relative;max-width:840px;margin:0 auto;font-size:clamp(40px,5vw,72px);z-index:1}
.seo-vs-closing p{position:relative;font-size:18px;margin:24px 0 30px;color:#e4ebff;z-index:1}
.seo-vs-closing .seo-vs-actions{position:relative;z-index:1}
.seo-vs-white-button{background:white;color:var(--blue)}
.seo-vs-white-button:hover{background:#eaf0ff}
.seo-vs-close-secondary{font-size:14px;text-decoration:underline;text-underline-offset:5px;color:white}
.seo-vs-close-heart{position:absolute;width:275px;height:275px;right:-35px;bottom:-50px;fill:var(--magenta);transform:rotate(-19deg);opacity:.95}
.seo-vs-sources{padding-top:30px;padding-bottom:48px;font-size:12px;color:#727682}
.seo-vs-sources summary{cursor:pointer;list-style:none;display:flex;gap:20px;justify-content:space-between;padding:8px 0}
.seo-vs-sources summary::-webkit-details-marker{display:none}
.seo-vs-sources summary::before{content:'+'}
.seo-vs-sources summary span{margin-left:auto}
.seo-vs-sources p{max-width:800px;margin:15px 0}
.seo-vs-sources a{text-decoration:underline;text-underline-offset:3px}
@media(min-width:1500px){.seo-vs-hero h1{font-size:110px}}
@media(max-width:1050px){
 .seo-vs-wrap{width:calc(100% - 56px)}.seo-vs-hero{padding-top:55px}.seo-vs-spark{left:0;width:46px;top:150px}.seo-vs-spark-two{width:35px;top:225px}.seo-vs-showcase{gap:16px;margin-top:50px}.seo-vs-showcase-side figcaption{font-size:16px;left:14px;top:14px}.seo-vs-feature{gap:45px;margin-bottom:80px}.seo-vs-feature-copy .seo-vs-feature-intro{font-size:18px}.seo-vs-feature-copy p{font-size:15px}.seo-vs-price-card{padding:15px;bottom:16px;left:16px}.seo-vs-price-card strong{font-size:44px}.seo-vs-service-art{padding:20px}.seo-vs-service-slip strong{font-size:23px}.seo-vs-service-slip{padding:18px;min-height:100px}.seo-vs-faq{gap:45px}.seo-vs-faq-heading h2{font-size:62px}.seo-vs-table th,.seo-vs-table td{padding:22px 20px;font-size:14px}.seo-vs-table td.seo-vs-brand-col{padding-left:44px}.seo-vs-cell-mark{left:17px}.seo-vs-choice-grid article{padding:28px}.seo-vs-choice-grid h3{font-size:25px}
}
@media(max-width:700px){
 .seo-vs-wrap{width:calc(100% - 36px)}.seo-vs-logo img{width:182px}.seo-vs-hero{padding-top:43px}.seo-vs-comparison-title{font-size:16px;margin-bottom:20px}.seo-vs-hero h1{font-size:clamp(40px,10.8vw,74px);line-height:1.02;letter-spacing:-.065em}.seo-vs-spark{width:27px;top:55px;left:4px}.seo-vs-spark-two{display:none}.seo-vs-lead{font-size:16px;max-width:440px;margin:22px auto 23px;padding:0 9px}.seo-vs-actions{gap:16px;flex-direction:column}.seo-vs-button{font-size:15px;min-height:54px;padding:15px 24px}.seo-vs-text-link{font-size:14px}.seo-vs-showcase{width:calc(100% + 120px);margin:36px -60px 0;grid-template-columns:.6fr 1.5fr .6fr;gap:13px;padding-bottom:8px}.seo-vs-showcase figure{border-radius:14px}.seo-vs-showcase-side{aspect-ratio:.65}.seo-vs-showcase-side img{transform:scale(1.5)}.seo-vs-showcase-side figcaption{display:none}.seo-vs-showcase-main{aspect-ratio:1.05;transform:rotate(-4deg)}.seo-vs-showcase-main figcaption{font-size:11px;left:15px;bottom:12px;right:15px}.seo-vs-showcase-main svg{width:20px;height:20px}.seo-vs-hero-note{font-size:11px;margin-top:20px}.seo-vs-subnav>div{justify-content:flex-start;gap:24px;padding:0 18px}.seo-vs-subnav a{font-size:12px;min-height:58px}.seo-vs-section{padding-top:68px;padding-bottom:20px}.seo-vs-page h2{font-size:39px;letter-spacing:-.05em}.seo-vs-section-head{margin-bottom:30px}.seo-vs-section-head p{font-size:16px;margin-top:18px}.seo-vs-table-region{border-radius:14px}.seo-vs-table{min-width:650px}.seo-vs-table th,.seo-vs-table td{font-size:13px;padding:18px}.seo-vs-table thead th:first-child{width:24%}.seo-vs-table thead th{height:120px}.seo-vs-table thead th>strong{font-size:25px}.seo-vs-table thead th>span{font-size:11px}.seo-vs-table .seo-vs-table-prompt{font-size:23px}.seo-vs-table-note{font-size:11px;text-align:left}.seo-vs-features{padding-top:50px}.seo-vs-feature{grid-template-columns:1fr;gap:32px;margin-bottom:64px}.seo-vs-feature-reverse .seo-vs-feature-art{order:0}.seo-vs-feature-art{aspect-ratio:1.12}.seo-vs-feature-copy{max-width:none}.seo-vs-number{margin-bottom:17px}.seo-vs-feature-copy h2{font-size:39px}.seo-vs-feature-copy .seo-vs-feature-intro{font-size:19px;margin-top:19px}.seo-vs-feature-copy p{font-size:16px;margin-top:15px}.seo-vs-feature-copy .seo-vs-text-link{margin-top:16px}.seo-vs-price-card{padding:13px 18px}.seo-vs-price-card strong{font-size:44px}.seo-vs-finish-panel figcaption{font-size:22px;max-width:200px;left:20px;top:20px}.seo-vs-finish-tabs{padding:10px 8px;gap:2px}.seo-vs-finish-tabs button{font-size:11px;min-height:42px;padding:8px 6px}.seo-vs-service-slip{min-height:85px;width:78%;padding:14px 18px}.seo-vs-service-slip strong{font-size:24px}.seo-vs-choice-grid{grid-template-columns:1fr;gap:14px}.seo-vs-choice-grid article{padding:28px}.seo-vs-choice-grid h3{font-size:27px}.seo-vs-choice-icon{margin-bottom:18px}.seo-vs-products{grid-template-columns:1fr;gap:34px}.seo-vs-product-image{aspect-ratio:1.15}.seo-vs-product h3{font-size:25px;margin-top:17px}.seo-vs-product p{font-size:15px}.seo-vs-faq{grid-template-columns:1fr;gap:30px;padding-top:65px;padding-bottom:65px}.seo-vs-faq-heading{position:relative}.seo-vs-faq-heading h2{font-size:57px}.seo-vs-faq-heading p{font-size:16px;margin-top:18px}.seo-vs-question-art{position:absolute;right:17px;top:-2px;font-size:134px;margin:0}.seo-vs-faq-item summary{font-size:17px;padding:23px 0}.seo-vs-faq-item p{font-size:15px;padding-right:8px}.seo-vs-closing-inner{padding:48px 23px 46px;border-radius:21px}.seo-vs-closing h2{font-size:40px}.seo-vs-closing p{font-size:16px;margin:22px 0}.seo-vs-close-heart{width:170px;height:170px;right:-60px;bottom:-50px;opacity:.8}.seo-vs-close-secondary{font-size:12px}.seo-vs-sources{font-size:11px;padding-bottom:30px;padding-top:22px}.seo-vs-sources summary{flex-wrap:wrap;gap:8px}.seo-vs-sources summary span{margin-left:0;flex-basis:100%;padding-left:15px}
}
@media(prefers-reduced-motion:reduce){.seo-vs-body{scroll-behavior:auto}.seo-vs-button:hover{transform:none}}
.seo-vs-swipe{display:none}
@media(max-width:700px){.seo-vs-swipe{display:block;font-size:12px;color:var(--blue);margin:0 0 12px;text-align:right}}
@media(prefers-reduced-motion:reduce){html:has(.seo-vs-body){scroll-behavior:auto}}
/* SEO COMPARISON TEMPLATE END */

/* ---- comparison pages: additions to Astra's block ---- */
.seo-vs-verdict{margin:22px 0 0;font-size:clamp(19px,2vw,24px);line-height:1.35;font-weight:700;letter-spacing:-.02em;max-width:64ch}
.seo-vs-sources{padding:8px 0 56px}
.seo-vs-sources-title{font-size:13px!important;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#5d6068);font-weight:700!important;margin:0 0 10px}
.seo-vs-sources-list{margin:0;padding-left:20px;font-size:14px;color:var(--muted,#5d6068);display:grid;gap:6px}
.seo-vs-sources-list a{color:inherit}
.seo-vs-next{margin:18px 0 0;font-size:15px}
.seo-vs-next a{font-weight:700}
.seo-vs-hero{padding-bottom:40px}
.seo-vs-page .seo-vs-section-head{margin-inline:auto;max-width:760px}

/* ---- comparison pages, second pass: Apple-clean ---- */
.seo-vs-page h2{font-size:clamp(34px,3.6vw,54px);letter-spacing:-.045em}
.seo-vs-hero h1{font-size:clamp(50px,7vw,100px)}
.seo-vs-eyebrow{display:block;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin:0 0 16px}
.seo-vs-section-head p{font-size:17px;max-width:600px}
/* local nav: sticky under the site header, name left, links, one button */
.seo-vs-localnav{position:sticky;top:78px;z-index:15;background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);border-block:1px solid rgba(0,0,0,.06)}
.seo-vs-localnav-inner{display:flex;align-items:center;gap:28px;min-height:54px}
.seo-vs-localnav-name{font-weight:700;font-size:16px;letter-spacing:-.02em;margin-right:auto;white-space:nowrap}
.seo-vs-localnav-links{display:flex;gap:26px}
.seo-vs-localnav-links a{font-size:13px;color:#4b4c55;white-space:nowrap;text-decoration:none}
.seo-vs-localnav-links a:hover,.seo-vs-localnav-links a[aria-current]{color:var(--blue)}
.seo-vs-localnav-cta{font-size:13px;font-weight:600;color:#fff;background:var(--blue);border-radius:999px;padding:8px 14px;text-decoration:none;white-space:nowrap}
.seo-vs-localnav-cta:hover{background:#0540c4}
@media (max-width:860px){.seo-vs-localnav{position:static}.seo-vs-localnav-links{display:none}.seo-vs-localnav-inner{min-height:50px}}
/* the chart: one continuous cobalt band for us, quiet neutral for them */
.seo-vs-table-region{border:0;border-radius:24px;box-shadow:0 1px 0 rgba(0,0,0,.05),0 24px 60px -36px rgba(17,33,67,.35);background:#fff}
.seo-vs-table th,.seo-vs-table td{padding:22px 28px;font-size:15px;border-bottom:1px solid #eceef3}
.seo-vs-table thead th{height:150px;background:#fff;border-bottom:1px solid #e3e6ed}
.seo-vs-table thead th:first-child{background:#fff}
.seo-vs-table .seo-vs-table-prompt{font-size:22px;color:#111}
.seo-vs-table-prompt span{color:var(--blue);font-size:26px;margin-top:10px}
.seo-vs-table thead th.seo-vs-brand-col{background:linear-gradient(165deg,#0F5BFF 0%,#0648DF 55%,#0A3BB8 100%);color:#fff;border-bottom:1px solid rgba(255,255,255,.18)}
.seo-vs-table thead th.seo-vs-brand-col img{width:min(230px,92%);height:auto;display:block}
.seo-vs-table thead th.seo-vs-brand-col>span{color:rgba(255,255,255,.78);margin-top:14px}
.seo-vs-table thead th:last-child{background:#f4f5f8}
.seo-vs-table thead th:last-child>strong{font-size:30px;color:#111}
.seo-vs-table thead th:last-child>span{color:#6b6d75}
.seo-vs-table tbody th{font-weight:650;color:#111;background:#fff}
.seo-vs-table td{background:#fafbfc;color:#5d5f68}
.seo-vs-table td.seo-vs-brand-col{background:var(--blue);color:#fff;font-weight:700;padding-left:62px;border-bottom-color:rgba(255,255,255,.16)}
.seo-vs-table tbody tr:hover td.seo-vs-brand-col{background:#0540c4}
.seo-vs-cell-mark{left:24px;width:24px;height:24px;border-radius:50%;background:#fff;color:var(--blue);font-size:14px;font-weight:800;display:grid;place-items:center;line-height:1}
.seo-vs-table tbody tr:last-child td.seo-vs-brand-col{border-bottom-left-radius:0}
@media (max-width:860px){.seo-vs-table th,.seo-vs-table td{padding:16px 16px;font-size:13px}.seo-vs-table td.seo-vs-brand-col{padding-left:46px}.seo-vs-cell-mark{left:14px;width:20px;height:20px;font-size:12px}.seo-vs-table thead th{height:126px}.seo-vs-table thead th.seo-vs-brand-col img{width:150px}.seo-vs-table thead th:last-child>strong{font-size:22px}}
/* the big numbers under the chart */
.seo-vs-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:28px 0 0}
.seo-vs-stat{border-radius:22px;padding:30px 30px 26px;display:grid;gap:8px;text-align:center}
.seo-vs-stat-brand{background:var(--blue);color:#fff}
.seo-vs-stat-other{background:#f4f5f8;color:#111}
.seo-vs-stat-who{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.75}
.seo-vs-stat strong{font-size:clamp(48px,6vw,84px);font-weight:800;letter-spacing:-.05em;line-height:1}
.seo-vs-stat-small{font-size:14px;opacity:.85}
.seo-vs-verdict{margin:26px auto 0;font-size:clamp(17px,1.6vw,20px);line-height:1.5;font-weight:500;letter-spacing:-.01em;max-width:62ch;text-align:center;color:#3a3b43}
@media (max-width:640px){.seo-vs-stats{grid-template-columns:1fr}}
@media (max-width:640px){.seo-vs-table thead th>span:not(.seo-vs-competitor-mark){display:none}.seo-vs-table thead th{height:96px}}

/* ---- the big numbers as glass tiles on a colour wash, with air above ---- */
.seo-vs-stats{margin:64px 0 0;gap:22px;padding:30px;border-radius:34px;position:relative;isolation:isolate;background:linear-gradient(135deg,rgba(6,72,223,.14) 0%,rgba(43,183,198,.14) 52%,rgba(250,54,131,.12) 100%)}
.seo-vs-stats::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(60% 80% at 20% 20%,rgba(255,255,255,.55),transparent 70%);pointer-events:none}
.seo-vs-stat{position:relative;border-radius:26px;padding:38px 30px 32px;-webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);border:1px solid rgba(255,255,255,.7);box-shadow:0 18px 40px -26px rgba(17,33,67,.45),inset 0 1px 0 rgba(255,255,255,.75)}
.seo-vs-stat-brand{background:linear-gradient(160deg,rgba(15,91,255,.92) 0%,rgba(6,72,223,.9) 55%,rgba(10,59,184,.9) 100%);border-color:rgba(255,255,255,.38);box-shadow:0 22px 44px -24px rgba(6,72,223,.7),inset 0 1px 0 rgba(255,255,255,.35)}
.seo-vs-stat-other{background:rgba(255,255,255,.62)}
.seo-vs-stat-who{opacity:.72}
.seo-vs-stat-small{opacity:.82}
.seo-vs-verdict{margin-top:44px}
@media (max-width:640px){.seo-vs-stats{margin-top:40px;padding:16px;gap:14px;border-radius:26px}.seo-vs-stat{padding:28px 20px 24px;border-radius:20px}}

/* ---- comparison hero, third pass: one headline, then the numbers ---- */
.seo-vs-hero{padding:64px 0 28px}
.seo-vs-hero .seo-vs-eyebrow{margin-bottom:18px}
.seo-vs-hero h1{font-size:clamp(46px,6.4vw,92px)}
.seo-vs-lead{max-width:640px;margin:22px auto 0;font-size:18px;color:#5d5f68}
.seo-vs-hero .seo-vs-actions{margin-top:26px}
.seo-vs-hero-numbers{margin:44px auto 0;max-width:1040px;text-align:center}
.seo-vs-hero-verdict{max-width:60ch;margin:26px auto 0;font-size:16px;line-height:1.55;color:#5d5f68}
.seo-vs-hero-video{margin:44px auto 0;max-width:1040px;border-radius:30px;overflow:hidden;background:#0648DF;box-shadow:0 30px 60px -36px rgba(17,33,67,.5);aspect-ratio:16/9}
.seo-vs-hero-video video{width:100%;height:100%;object-fit:cover;display:block}
.seo-vs-chart-head h2{font-size:clamp(26px,2.8vw,38px)}
.seo-vs-chart-head{margin-bottom:26px}
.seo-vs-section#comparison{padding-top:72px}
@media (max-width:640px){.seo-vs-hero{padding:40px 0 20px}.seo-vs-hero-numbers{margin-top:30px}}
.seo-vs-table thead th .seo-vs-competitor-logo{display:block;width:auto;max-width:min(190px,90%);max-height:44px;height:auto}
@media (max-width:860px){.seo-vs-table thead th .seo-vs-competitor-logo{max-width:130px;max-height:32px}}
.seo-vs-competitor-mark{display:inline-block;line-height:0}
.seo-vs-competitor-mark.has-badge{padding:10px 16px;border-radius:12px}
.seo-vs-competitor-mark.has-badge .seo-vs-competitor-logo{max-height:34px}

/* ===== city printing pages (page-local.php) ====================================
   Ported from Astra's local template. Astra's palette kept as its own tokens so
   the theme's --pink (a pale rose) is not clobbered by the template's magenta. */
:root{--local-blue:var(--blue);--local-cyan:var(--cyan);--local-lavender:#b491ea;--local-pink:#fa3683;--local-yellow:#fde245}
.local-page{--local-blue:#0648df;--local-pink:#fa3683;--local-yellow:#fde245;--local-lavender:#b491ea;--local-cyan:#1ecbf2}.local-eyebrow{font-size:10px;letter-spacing:.14em;font-weight:600;line-height:1.6}.local-breadcrumb{display:flex;align-items:center;gap:12px;padding:9px 0 25px;font-size:12px;color:#666}.local-breadcrumb a:hover{text-decoration:underline}.local-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:65px;align-items:center;padding:20px 0 52px}.local-hero-copy>.local-eyebrow{display:flex;gap:9px;align-items:center}.local-eyebrow i{display:block;width:7px;height:7px;border-radius:50%;background:var(--local-pink)}.local-hero h1{font-size:clamp(48px,4.7vw,68px);line-height:1.02;margin:27px 0 25px;letter-spacing:-.06em}.local-hero h1 em{color:var(--local-blue);white-space:nowrap}.local-hero-intro{font-size:18px;line-height:1.65;max-width:550px}.local-hero-support{font-size:15px;line-height:1.7;color:#62626d;max-width:490px;margin-top:15px}.local-hero-actions{display:flex;align-items:center;gap:29px;margin-top:27px}.local-hero-actions .button{min-height:54px}.local-text-link{display:inline-flex;align-items:center;gap:18px;font-size:13px;min-height:44px}.local-text-link:hover{color:var(--local-blue)}.local-city-tag{display:flex;align-items:center;gap:11px;font-size:8px;letter-spacing:.1em;font-weight:600;margin-top:32px}.local-city-tag>span{color:var(--local-blue);font-size:24px}.local-hero-art{height:515px;position:relative;min-width:0}.local-art-main{width:82%;position:absolute;top:0;right:0;aspect-ratio:1;border-radius:19px;overflow:hidden}.local-art-main img{width:100%;height:100%;object-fit:cover}.local-art-small{position:absolute;bottom:0;right:0;width:42%;aspect-ratio:1;border-radius:12px;overflow:hidden;border:8px solid white;transform:rotate(7deg);transform-origin:center;box-shadow:0 15px 40px #18104414}.local-art-small img{width:100%;height:100%;object-fit:cover}.local-art-label{position:absolute;left:0;bottom:15px;background:var(--local-yellow);border-radius:13px;width:56%;padding:25px 25px 24px;transform:rotate(-4deg);box-shadow:0 10px 30px #1810440a}.local-art-label>span:first-child{font-size:8px;font-weight:650;letter-spacing:.14em}.local-art-label p{font-size:26px;letter-spacing:-.045em;font-weight:550;line-height:1.05;margin-top:14px}.local-art-label>span:last-child{font-size:30px;position:absolute;right:17px;top:15px}.local-benefits{display:grid;grid-template-columns:1fr 1fr 1fr;border-block:1px solid var(--line);padding:23px 0;gap:30px}.local-benefits p{display:flex;align-items:center;gap:14px;font-size:14px;font-weight:500}.local-benefits p:nth-child(2){justify-content:center}.local-benefits p:nth-child(3){justify-content:flex-end}.local-benefits span{height:34px;width:34px;border-radius:8px;display:grid;place-items:center;font-size:10px;font-weight:650;background:var(--local-pink)}.local-benefits p:nth-child(2) span{background:var(--local-yellow)}.local-benefits p:nth-child(3) span{background:var(--local-cyan)}.local-products{padding:64px 0 60px;scroll-margin-top:28px}.local-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:55px;margin-bottom:34px}.local-section-heading .local-eyebrow{font-size:9px;color:#6c6b78;margin-bottom:17px}.local-section-heading h2{font-size:48px;line-height:1.04}.local-section-heading>p{font-size:14px;line-height:1.8;color:#666572;max-width:350px;padding-bottom:2px}.local-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}.local-product{display:block}.local-product-image{aspect-ratio:1;overflow:hidden;border-radius:13px;position:relative;background:#f3f0f7}.local-product-image>img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.local-product:hover .local-product-image img{transform:scale(1.035)}.local-product-image>span{height:35px;width:35px;background:white;border-radius:50%;position:absolute;bottom:12px;right:12px;display:grid;place-items:center;font-size:22px}.local-product>.local-eyebrow{display:block;margin:18px 0 9px;font-size:7px;letter-spacing:.1em;color:#6b6976}.local-product h3{font-size:22px;letter-spacing:-.04em}.local-product>p{font-size:13px;line-height:1.65;color:#64646e;margin-top:12px}.local-guide-head{padding-top:54px;border-top:1px solid var(--line);max-width:100%;margin-bottom:45px}.local-guide-head>.local-eyebrow{font-size:9px;color:var(--local-blue);margin-bottom:19px}.local-guide-head h2{font-size:47px;line-height:1.1;max-width:730px}.local-guide-head>p:last-child{font-size:16px;line-height:1.8;color:#666572;max-width:700px;margin-top:20px}.local-guide{display:grid;grid-template-columns:250px minmax(0,780px);justify-content:space-between;gap:70px}.local-aside-sticky{position:sticky;top:30px}.local-toc{border-top:1px solid #d7d7de;padding-top:19px}.local-toc>p{font-size:9px;color:#777582;letter-spacing:.13em;font-weight:650;margin-bottom:17px}.local-toc a{display:block;line-height:1.45;font-size:13px;color:#6b6a77;padding:11px 12px;border-left:2px solid transparent;transition:color .2s,background .2s}.local-toc a.active{border-color:var(--local-blue);color:var(--local-blue);background:#f4f6fd}.local-toc a:hover{color:var(--local-blue)}.local-aside-card{background:var(--local-lavender);border-radius:12px;padding:25px;margin-top:33px;position:relative}.local-aside-card>span{position:absolute;top:17px;right:18px;font-size:29px}.local-aside-card strong{display:block;font-size:29px;line-height:1.04;letter-spacing:-.05em;padding-top:24px}.local-aside-card a{display:inline-block;font-size:11px;font-weight:600;border-bottom:1px solid #10101090;margin-top:25px;padding-block:9px}.local-article{min-width:0}.local-body-section{padding-bottom:38px;margin-bottom:36px;border-bottom:1px solid var(--line);scroll-margin-top:36px}.local-body-section:last-child{border:0;margin-bottom:0;padding-bottom:0}.local-section-number{font-size:10px;color:#777;letter-spacing:.1em;display:block;margin-bottom:12px}.local-body-section h2{font-size:34px;line-height:1.17;letter-spacing:-.043em;margin-bottom:22px;max-width:670px}.local-body-section>p{font-size:17px;color:#4f4e5b;line-height:1.83;margin-top:18px}.local-inline-link{display:inline-flex;align-items:center;gap:18px;font-size:13px;font-weight:550;color:var(--local-blue);margin-top:21px;min-height:44px}.local-inline-link>span{font-size:21px}.local-inline-link:hover{text-decoration:underline;text-underline-offset:4px}.local-table-wrap{background:#fffceb;border:1px solid #eee8cd;border-radius:13px;padding:25px 27px;margin-top:30px}.local-table-wrap table{border-collapse:collapse;width:100%;text-align:left}.local-table-wrap caption{font-size:20px;font-weight:600;letter-spacing:-.035em;text-align:left;margin-bottom:22px}.local-table-wrap thead th{font-size:10px;font-weight:600;color:#67624f;padding:0 0 13px;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid #e4dfc6}.local-table-wrap tbody th,.local-table-wrap td{font-size:13px;font-weight:400;line-height:1.6;border-bottom:1px solid #e4dfc6;padding:14px 14px 14px 0}.local-table-wrap tbody tr:last-child>*{border:0;padding-bottom:0}.local-table-wrap tbody th{width:58%;font-weight:500}.local-design-note{display:flex;align-items:center;gap:23px;background:#f1eafc;border-radius:12px;padding:25px 28px;margin:29px 0 0}.local-design-symbol{font-family:Arial,sans-serif;font-size:57px;line-height:1;color:var(--local-blue)}.local-design-note strong{font-size:20px;font-weight:550;letter-spacing:-.035em;display:block}.local-design-note figcaption>span{font-size:12px;line-height:1.7;color:#676174;display:block;margin-top:8px}.local-order{padding:66px 0 58px;scroll-margin-top:25px}.local-order .local-section-heading h2{font-size:43px}.local-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;list-style:none;margin:0;padding:0}.local-steps li{padding:28px 27px 30px;border-radius:13px;background:var(--local-pink)}.local-steps li:nth-child(2){background:var(--local-yellow)}.local-steps li:nth-child(3){background:var(--local-cyan)}.local-step-index{font-size:10px;display:block;margin-bottom:30px;letter-spacing:.08em;font-weight:600}.local-steps h3{font-size:24px;letter-spacing:-.04em;line-height:1.1}.local-steps p{font-size:13px;line-height:1.8;margin-top:14px}.local-faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;padding:58px 0 65px;border-top:1px solid var(--line);scroll-margin-top:25px}.local-faq .local-eyebrow{font-size:9px;color:var(--local-blue);margin-bottom:21px}.local-faq h2{font-size:60px;line-height:1.02}.local-question-art{width:190px;height:150px;position:relative;margin:37px 0 0 15px}.local-question-art span{position:absolute;display:grid;place-items:center;width:100px;height:108px;font-size:66px;background:var(--local-pink);border-radius:12px;transform:rotate(-13deg)}.local-question-art span+span{background:var(--local-yellow);transform:rotate(12deg);left:72px;top:27px}.local-faq-list{border-top:1px solid #ddd}.local-faq-list details{border-bottom:1px solid #ddd}.local-faq-list summary{list-style:none;display:flex;gap:20px;align-items:center;justify-content:space-between;cursor:pointer;font-size:16px;font-weight:550;padding:22px 0;min-height:77px;line-height:1.5}.local-faq-list summary::-webkit-details-marker{display:none}.local-faq-list summary>span{width:14px;height:14px;position:relative;flex-shrink:0}.local-faq-list summary>span:before,.local-faq-list summary>span:after{content:'';height:1px;width:12px;background:#111;position:absolute;top:6px;left:0}.local-faq-list summary>span:after{transform:rotate(90deg)}.local-faq-list details[open] summary>span:after{transform:none}.local-faq-list details>p{font-size:14px;line-height:1.9;color:#666572;padding:0 22px 23px 0}.local-closing{background:var(--local-blue);color:white;border-radius:17px;position:relative;overflow:hidden;padding:44px 48px;display:flex;align-items:center;justify-content:space-between;gap:35px;margin-bottom:65px}.local-closing .local-eyebrow{font-size:8px;margin-bottom:18px}.local-closing h2{font-size:46px;line-height:1.04}.local-closing>div>p:last-child{font-size:14px;line-height:1.7;margin-top:21px;max-width:425px;color:#ecedff}.local-closing .button{background:white;color:#111;z-index:1;flex-shrink:0;font-size:12px;gap:23px}.local-closing .button:hover{background:var(--local-yellow)}.local-closing-spark{position:absolute;font-family:Arial,sans-serif;bottom:-72px;right:0;font-size:270px;line-height:1;color:#8de1b128;transform:rotate(10deg);pointer-events:none}@media(min-width:1600px){.local-hero h1{font-size:68px}.local-hero-art{height:535px}}@media(max-width:1200px){.local-hero{gap:40px}.local-hero h1{font-size:4.65vw}.local-hero-art{height:450px}.local-hero-intro{font-size:16px}.local-hero-support{font-size:14px}.local-art-label{padding:24px 20px}.local-art-label p{font-size:23px}.local-product-grid{gap:18px}.local-product h3{font-size:20px}.local-product>p{font-size:12px}.local-guide{grid-template-columns:220px minmax(0,710px);gap:65px}.local-guide-head h2{font-size:43px}.local-section-heading h2{font-size:44px}.local-body-section h2{font-size:31px}.local-body-section>p{font-size:16px}.local-steps{gap:17px}.local-steps li{padding:25px}.local-steps h3{font-size:22px}.local-faq{gap:60px}}@media(max-width:900px){.local-hero{gap:25px;padding-top:13px;padding-bottom:37px}.local-hero h1{font-size:4.75vw;margin-top:21px}.local-hero-copy>.local-eyebrow{font-size:7px}.local-hero-intro{font-size:14px}.local-hero-support{font-size:12px;line-height:1.8}.local-hero-actions{gap:18px;margin-top:22px}.local-hero-actions .button{font-size:11px;padding:12px 16px;min-height:47px;gap:17px}.local-text-link{font-size:11px;gap:10px}.local-city-tag{font-size:6px;gap:8px;margin-top:23px}.local-city-tag>span{font-size:20px}.local-hero-art{height:381px}.local-art-label{padding:21px 16px;bottom:25px;width:58%}.local-art-label>span:first-child{font-size:6px}.local-art-label p{font-size:20px;margin-top:12px}.local-art-label>span:last-child{font-size:22px;right:12px;top:11px}.local-art-small{bottom:14px;width:46%;border-width:6px}.local-benefits{gap:20px;padding:21px 0}.local-benefits p{font-size:11px;gap:10px}.local-benefits span{width:28px;height:30px;font-size:8px;flex-shrink:0}.local-section-heading{gap:30px;margin-bottom:28px}.local-section-heading h2{font-size:37px}.local-section-heading>p{font-size:12px;max-width:270px}.local-products{padding:48px 0}.local-product-grid{grid-template-columns:1fr 1fr;gap:28px 22px}.local-product h3{font-size:23px}.local-product>p{font-size:13px}.local-product>.local-eyebrow{font-size:8px}.local-guide-head{padding-top:40px;margin-bottom:34px}.local-guide-head h2{font-size:38px}.local-guide-head>p:last-child{font-size:14px}.local-guide{grid-template-columns:177px minmax(0,1fr);gap:35px}.local-toc a{font-size:11px;padding:10px 8px}.local-toc>p{font-size:8px}.local-aside-card{padding:20px}.local-aside-card strong{font-size:25px}.local-aside-card a{font-size:9px}.local-body-section h2{font-size:29px}.local-body-section>p{font-size:15px;line-height:1.8}.local-inline-link{font-size:12px;gap:12px}.local-table-wrap{padding:23px 20px}.local-table-wrap caption{font-size:19px;line-height:1.3}.local-table-wrap thead th{font-size:8px}.local-table-wrap tbody th,.local-table-wrap td{font-size:11px}.local-design-note{padding:22px 20px;gap:18px}.local-design-symbol{font-size:43px}.local-design-note strong{font-size:19px}.local-design-note figcaption>span{font-size:10px}.local-order{padding:48px 0}.local-order .local-section-heading h2{font-size:36px}.local-steps{gap:13px}.local-steps li{padding:23px 19px}.local-steps h3{font-size:21px}.local-steps p{font-size:11px}.local-step-index{margin-bottom:23px}.local-faq{gap:45px;padding:43px 0 48px}.local-faq h2{font-size:51px}.local-faq-list summary{font-size:14px;min-height:72px;padding-block:20px}.local-faq-list details>p{font-size:12px}.local-closing{padding:35px;margin-bottom:48px;gap:24px}.local-closing h2{font-size:37px}.local-closing>div>p:last-child{font-size:12px}.local-closing .button{font-size:11px;padding:14px 17px;gap:16px}}@media(max-width:650px){.local-breadcrumb{font-size:10px;padding:5px 0 22px;gap:10px}.local-hero{display:block;padding:9px 0 30px}.local-hero-copy>.local-eyebrow{font-size:8px}.local-hero h1{font-size:clamp(38px,10.3vw,60px);margin:23px 0 22px;line-height:1.02}.local-hero-intro{font-size:16px;line-height:1.7}.local-hero-support{font-size:13px;line-height:1.75;margin-top:13px}.local-hero-actions{gap:27px;margin-top:24px}.local-hero-actions .button{font-size:12px;min-height:49px;padding-inline:20px;gap:23px}.local-text-link{font-size:12px;gap:14px}.local-city-tag{margin-top:25px;font-size:7px}.local-hero-art{height:390px;margin-top:27px}.local-art-main{width:83%;border-radius:14px}.local-art-small{width:43%;border:6px solid white;bottom:5px;right:2px}.local-art-label{bottom:13px;width:57%;padding:22px 21px}.local-art-label p{font-size:24px}.local-art-label>span:first-child{font-size:7px}.local-art-label>span:last-child{font-size:25px}.local-benefits{gap:15px;padding:21px 0}.local-benefits p{display:block;line-height:1.55;font-size:10px;max-width:115px}.local-benefits span{margin-bottom:9px}.local-products{padding:37px 0 40px}.local-section-heading{display:block;margin-bottom:26px}.local-section-heading .local-eyebrow{font-size:8px;margin-bottom:15px}.local-section-heading h2{font-size:39px}.local-section-heading>p{margin-top:20px;font-size:13px;max-width:340px;line-height:1.8}.local-product-grid{gap:25px 13px}.local-product-image{border-radius:10px}.local-product-image>span{width:27px;height:27px;font-size:17px;right:8px;bottom:8px}.local-product>.local-eyebrow{font-size:6px;letter-spacing:.075em;margin:14px 0 8px}.local-product h3{font-size:19px;letter-spacing:-.035em;line-height:1.15}.local-product>p{font-size:11px;line-height:1.7;margin-top:10px}.local-guide-head{padding-top:35px;margin-bottom:24px}.local-guide-head>.local-eyebrow{font-size:8px;margin-bottom:17px}.local-guide-head h2{font-size:36px;line-height:1.07;max-width:345px}.local-guide-head>p:last-child{font-size:14px;line-height:1.8;margin-top:18px}.local-guide{display:block}.local-aside{margin-bottom:31px}.local-aside-sticky{position:static}.local-toc{border:1px solid var(--line);border-radius:11px;background:#f7f5fa;padding:19px}.local-toc>p{font-size:8px;margin-bottom:12px}.local-toc a{font-size:11px;display:inline-flex;min-height:37px;padding:9px 10px;margin:0 4px 4px 0;border:1px solid #e2dce9;border-radius:5px;background:white;line-height:1.3}.local-toc a.active{border-color:var(--local-blue);background:#eff3ff}.local-aside-card{display:none}.local-body-section{margin-bottom:30px;padding-bottom:31px}.local-body-section h2{font-size:29px;line-height:1.14;margin-bottom:20px}.local-section-number{font-size:9px;margin-bottom:12px}.local-body-section>p{font-size:15px;line-height:1.85;margin-top:18px}.local-inline-link{font-size:12px;margin-top:18px}.local-table-wrap{margin-top:25px;padding:22px 18px}.local-table-wrap caption{font-size:21px;margin-bottom:21px}.local-table-wrap thead th{font-size:8px;line-height:1.7}.local-table-wrap tbody th,.local-table-wrap td{font-size:11px;line-height:1.65;padding:13px 10px 13px 0}.local-table-wrap tbody th{width:58%}.local-design-note{gap:18px;padding:22px;margin-top:25px}.local-design-note strong{font-size:19px;line-height:1.2}.local-design-note figcaption>span{font-size:11px}.local-design-symbol{font-size:43px}.local-order{padding:40px 0}.local-order .local-section-heading h2{font-size:36px}.local-order .local-section-heading>p{font-size:13px}.local-steps{grid-template-columns:1fr;gap:14px}.local-steps li{padding:25px 26px}.local-step-index{margin-bottom:21px;font-size:9px}.local-steps h3{font-size:25px}.local-steps p{font-size:13px;line-height:1.8;max-width:370px;margin-top:14px}.local-faq{grid-template-columns:1fr;gap:29px;padding:36px 0 40px}.local-faq .local-eyebrow{font-size:8px;margin-bottom:17px}.local-faq h2{font-size:43px}.local-faq h2 br{display:none}.local-question-art{display:none}.local-faq-list summary{font-size:15px;padding:21px 0;min-height:75px;gap:20px;line-height:1.5}.local-faq-list details>p{font-size:13px;line-height:1.85;padding-right:10px}.local-closing{display:block;padding:30px 27px 32px;border-radius:14px;margin-bottom:40px}.local-closing .local-eyebrow{font-size:7px;margin-bottom:19px}.local-closing h2{font-size:36px}.local-closing>div>p:last-child{font-size:13px;line-height:1.8;margin-top:20px;max-width:275px}.local-closing .button{margin-top:25px;position:relative;font-size:12px;padding:13px 19px;min-height:48px;gap:23px}.local-closing-spark{font-size:210px;right:-34px;bottom:-40px}}@media(max-width:375px){.local-hero h1{font-size:36px}.local-hero-intro{font-size:14px}.local-hero-support{font-size:12px}.local-hero-actions{gap:19px}.local-hero-actions .button{font-size:11px;padding-inline:16px}.local-text-link{font-size:11px}.local-hero-art{height:330px}.local-art-label p{font-size:20px}.local-art-label{padding:20px 17px}.local-art-label>span:first-child{font-size:6px}.local-art-small{bottom:0}.local-benefits{gap:13px}.local-benefits p{font-size:9px}.local-section-heading h2{font-size:35px}.local-product h3{font-size:17px}.local-product>p{font-size:10px}.local-product>.local-eyebrow{font-size:5px}.local-guide-head h2{font-size:33px}.local-body-section h2{font-size:27px}.local-body-section>p{font-size:14px}.local-table-wrap{padding-inline:16px}.local-design-note{padding:21px 19px;gap:15px}.local-design-note strong{font-size:18px}.local-closing h2{font-size:32px}}@media(prefers-reduced-motion:reduce){.button:hover,.local-product:hover .local-product-image img{transform:none}}

/* the /printing/ hub: every published city page, grouped by state */
.local-hub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:34px 28px;margin:0 0 90px}
.local-hub-state .local-eyebrow{margin:0 0 12px}
.local-hub-state ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.local-hub-state a{color:var(--ink);text-decoration:none;font-size:17px;line-height:1.45}
.local-hub-state a:hover{color:var(--local-blue);text-decoration:underline;text-underline-offset:3px}
.local-hub .local-guide-head{margin-top:34px}

/* ===== about page (page-about.php) =========================================
   Ported from Astra's about template. Every colour it asks for already exists
   as a theme token, so nothing new is defined here. The tab strip and the copy
   button only appear once about.js adds .seo-about-enhanced to <html>. */
.seo-about-body{background:#fff;color:var(--ink)}.seo-about-page{overflow:clip}.seo-about-page [hidden]{display:none!important}.seo-about-page figure{margin:0}.seo-about-page h1,.seo-about-page h2,.seo-about-page h3{font-family:var(--sans);text-wrap:balance}.seo-about-page h2{font-size:clamp(38px,4.25vw,62px);line-height:1.04;letter-spacing:-.055em;font-weight:750}.seo-about-page p{line-height:1.65}.seo-about-wrap{width:min(1240px,calc(100% - 96px));margin-inline:auto}.seo-about-button{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:56px;padding:16px 25px;border-radius:12px;background:var(--blue);color:white;font-size:15px;font-weight:700;line-height:1.3;transition:transform .18s,background .18s}.seo-about-button:hover{background:#0039b6;transform:translateY(-2px)}.seo-about-button span{font-size:23px;line-height:1}.seo-about-blue-text{color:var(--blue);font-weight:750}.seo-about-highlight{color:var(--cyan-ink);font-weight:750}.seo-about-label{display:block;font-size:17px;font-weight:600;letter-spacing:-.02em;line-height:1.4;margin-bottom:28px}.seo-about-hero{text-align:center;padding-top:42px}.seo-about-definition{position:relative;padding:62px 88px 69px;margin-inline:-16px;isolation:isolate}.seo-about-definition h1{font-size:clamp(39px,4.35vw,64px);line-height:1.105;letter-spacing:-.051em;font-weight:550;max-width:1100px;margin:auto;position:relative;z-index:2}.seo-about-rings{position:absolute;inset:0;z-index:-1;pointer-events:none}.seo-about-rings i{position:absolute;inset:0;border:1px solid var(--cyan);border-radius:66px;transform:rotate(-1deg)}.seo-about-rings i:nth-child(2){inset:9px -7px;border-color:var(--lavender);border-radius:66px;transform:rotate(.7deg)}.seo-about-rings i:nth-child(3){inset:19px -12px;border-color:var(--magenta);border-radius:65px;transform:rotate(-.25deg)}.seo-about-hero-heart{position:absolute;width:67px;height:67px;bottom:13px;right:63px;fill:var(--magenta);background:white;transform:rotate(15deg);padding:5px;z-index:3}.seo-about-hero-intro{max-width:740px;margin:35px auto 12px;font-size:18px;color:#5b606c}.seo-about-link{display:inline-flex;align-items:center;gap:16px;font-size:15px;font-weight:650;padding:10px 0;line-height:1.4;color:var(--blue);text-decoration:underline;text-underline-offset:5px;text-decoration-color:#b8c8f3}.seo-about-link:hover{text-decoration-color:var(--blue)}.seo-about-link span{font-size:20px;line-height:1}.seo-about-service-links{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid #e4e7ef;margin-top:34px;text-align:left}.seo-about-service-links a{display:flex;align-items:center;justify-content:space-between;padding:23px 28px;font-size:17px;font-weight:650;border-right:1px solid #e4e7ef}.seo-about-service-links a:first-child{padding-left:0}.seo-about-service-links a:last-child{border-right:0;padding-right:0}.seo-about-service-links span{font-size:22px;color:var(--blue)}.seo-about-service-links a:hover{color:var(--blue)}.seo-about-purpose{padding-top:115px;display:grid;grid-template-columns:1fr 1fr;gap:105px;align-items:center;scroll-margin-top:40px}.seo-about-purpose-copy{max-width:520px}.seo-about-purpose-copy h2{font-size:clamp(40px,4.8vw,69px);letter-spacing:-.06em}.seo-about-purpose-copy p{font-size:17px;color:#626673;margin-top:20px}.seo-about-purpose-copy p.seo-about-lead{font-size:21px;color:#272c37;line-height:1.5;margin-top:30px}.seo-about-purpose-art{position:relative;background:var(--magenta);border-radius:25px;aspect-ratio:.88;min-width:0;display:flex;flex-direction:column;overflow:hidden}.seo-about-purpose-top{position:relative;z-index:2;display:flex;align-items:center;gap:12px;padding:25px 28px;font-size:15px;font-weight:700}.seo-about-purpose-top svg{width:27px;height:27px;fill:var(--ink);flex:none}.seo-about-purpose-art figure{flex:1;position:relative;min-height:0}.seo-about-purpose-art img{display:block;width:100%;height:100%;object-fit:cover}.seo-about-sticker{position:absolute;right:24px;bottom:25px;transform:rotate(8deg);font-size:35px;letter-spacing:-.06em;font-weight:800;line-height:.98;background:var(--yellow);padding:24px 26px;box-shadow:0 5px 20px #6f22322b;border-radius:5px;color:var(--ink)}.seo-about-sticker span{color:var(--blue)}.seo-about-services{padding-top:115px;scroll-margin-top:40px}.seo-about-section-head{max-width:870px;margin:auto;text-align:center}.seo-about-section-head p{font-size:18px;color:#656975;max-width:620px;margin:22px auto 0}.seo-about-service-tabs{display:grid;grid-template-columns:repeat(4,1fr);margin-top:45px;border:1px solid #dfe3ed;border-radius:18px 18px 0 0;overflow:hidden}.seo-about-service-tabs button{position:relative;background:#fff;color:#555f70;text-align:left;padding:22px 24px 26px;border-right:1px solid #dfe3ed;border-bottom:3px solid transparent;min-height:125px}.seo-about-service-tabs button:last-child{border-right:0}.seo-about-service-tabs button[aria-selected="true"]{background:#f2f6ff;border-bottom-color:var(--blue);color:var(--blue)}.seo-about-service-tabs button:hover{background:#f7f9fe}.seo-about-tab-number{font-size:12px;font-weight:600;display:block;margin-bottom:10px}.seo-about-service-tabs strong{font-size:24px;letter-spacing:-.04em;font-weight:700;display:block}.seo-about-tab-short{font-size:12px;display:block;margin-top:6px;color:#6e7481}.seo-about-tab-arrow{position:absolute;right:20px;top:21px;font-size:20px}.seo-about-service-panels{border:1px solid #dfe3ed;border-top:0;border-radius:0 0 22px 22px;overflow:hidden;background:#fff}.seo-about-service-panel{display:grid;grid-template-columns:1fr 1fr;min-height:500px}.seo-about-service-copy{padding:55px 52px;align-self:center}.seo-about-service-copy h3{font-size:42px;line-height:1.07;letter-spacing:-.05em;font-weight:750}.seo-about-service-copy p{font-size:17px;color:#626774;margin-top:23px}.seo-about-service-copy ul{list-style:none;padding:0;margin:24px 0 22px;display:flex;flex-direction:column;gap:9px;font-size:14px;color:#363f50}.seo-about-service-copy li::before{content:'↗';margin-right:12px;color:var(--blue);font-size:17px}.seo-about-service-art{position:relative;min-width:0;display:grid;place-items:center;overflow:hidden}.seo-about-service-art>img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}.seo-about-blue{background:var(--blue)}.seo-about-lavender{background:#e8def9}.seo-about-mint{background:var(--mint)}.seo-about-yellow{background:var(--yellow)}.seo-about-browser{width:84%;margin:40px 0 55px;border-radius:14px;background:white;box-shadow:0 18px 35px #174f402b;transform:rotate(-5deg);overflow:hidden;max-width:440px}.seo-about-browser-top{height:37px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;font-size:10px;color:#9a9daa;border-bottom:1px solid #eef0f5}.seo-about-browser-top>span:first-child{font-size:7px;letter-spacing:2px}.seo-about-browser-content{padding:25px;background:var(--blue);color:white}.seo-about-browser-content>img{width:102px;height:auto;display:block;margin-bottom:32px}.seo-about-browser-content>strong{font-size:51px;line-height:.95;letter-spacing:-.065em;font-weight:750;display:block}.seo-about-browser-button{display:block;width:fit-content;background:white;color:var(--blue);font-size:9px;font-weight:650;margin-top:20px;padding:9px 12px;border-radius:5px}.seo-about-browser-cards{display:flex;gap:12px;margin-top:27px}.seo-about-browser-cards img{width:calc(50% - 6px);height:auto;aspect-ratio:1.4;object-fit:cover;border-radius:6px}.seo-about-art-caption{position:absolute;bottom:17px;left:20px;font-size:11px;color:#164932}.seo-about-flow{width:80%;max-width:395px;padding-block:30px 40px}.seo-about-flow-node{display:flex;align-items:center;gap:16px;border:1px solid #00000008;background:white;padding:25px;border-radius:12px;box-shadow:0 6px 14px #a8931910}.seo-about-flow-node>span{font-size:12px;color:#5e6570}.seo-about-flow-node>strong{font-size:20px;letter-spacing:-.03em}.seo-about-flow-node>b{font-size:24px;color:var(--blue);margin-left:auto;line-height:1}.seo-about-flow-line{display:block;width:1px;height:37px;background:#80700b;margin:auto;position:relative}.seo-about-flow-line::after{content:'';border-right:1px solid #80700b;border-bottom:1px solid #80700b;width:7px;height:7px;position:absolute;bottom:1px;left:-3px;transform:rotate(45deg)}.seo-about-flow-blue{background:var(--blue);color:white}.seo-about-flow-blue>span,.seo-about-flow-blue>b{color:white}.seo-about-flow-label{font-size:14px;text-align:center;margin-top:21px;font-weight:600;color:#494207}.seo-about-beliefs{padding-top:115px}.seo-about-belief-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:52px;margin-top:55px}.seo-about-belief-grid article{border-top:1px solid #dfe3ed;padding-top:30px}.seo-about-belief-symbol{width:68px;height:68px;display:grid;place-items:center;margin-bottom:30px;background:none}.seo-about-belief-symbol svg{width:68px;height:68px;fill:currentColor}.seo-about-belief-symbol.seo-about-pink{color:var(--magenta);transform:rotate(-12deg)}.seo-about-belief-symbol.seo-about-blue{color:var(--blue)}.seo-about-belief-symbol.seo-about-yellow{color:#9f7900}.seo-about-belief-grid h3{font-size:26px;line-height:1.15;letter-spacing:-.04em;font-weight:750}.seo-about-belief-grid p{font-size:17px;color:#646a78;margin-top:17px}.seo-about-founder{margin-top:110px;padding:55px 0;border-block:1px solid #dfe3ed;display:grid;grid-template-columns:1fr 1fr;gap:90px}.seo-about-founder p{font-size:18px;color:#5b6271;margin-bottom:20px}.seo-about-founder-name{margin-top:24px;color:var(--blue)!important;font-weight:700}.seo-about-process{margin-top:110px;background:#f4f6fb;border-radius:24px;padding:58px 55px}.seo-about-process-head{display:flex;align-items:flex-end;gap:70px;justify-content:space-between}.seo-about-process-head h2{font-size:47px;flex:1}.seo-about-process-head p{font-size:17px;color:#626a79;max-width:360px}.seo-about-process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:38px;margin-top:48px}.seo-about-step-number{display:block;border-top:1px solid #c8cedd;font-size:14px;color:var(--blue);padding-top:20px;margin-bottom:18px;font-weight:650}.seo-about-process-grid h3{font-size:24px;letter-spacing:-.04em;line-height:1.1;font-weight:750}.seo-about-process-grid p{font-size:15px;color:#636b7b;margin-top:15px}.seo-about-faq{padding-top:108px;display:grid;grid-template-columns:.86fr 1.14fr;gap:90px}.seo-about-faq h2{font-size:51px}.seo-about-faq-list{border-top:1px solid #dce1eb}.seo-about-faq details{border-bottom:1px solid #dce1eb}.seo-about-faq summary{display:flex;justify-content:space-between;align-items:center;gap:24px;list-style:none;cursor:pointer;padding:23px 0;font-size:18px;font-weight:600;letter-spacing:-.015em;line-height:1.4}.seo-about-faq summary::-webkit-details-marker{display:none}.seo-about-faq summary>span{font-size:27px;color:var(--blue);font-weight:400;line-height:1}.seo-about-faq details[open] summary{color:var(--blue)}.seo-about-faq details[open] summary>span{transform:rotate(45deg)}.seo-about-faq details p{font-size:16px;color:#606777;margin:0 30px 25px 0}.seo-about-page summary:focus-visible{outline:3px solid var(--blue);outline-offset:4px}.seo-about-boilerplate{margin-top:90px;padding:35px 0;border-top:1px solid #e2e6ef;display:grid;grid-template-columns:1fr auto;gap:75px;align-items:center}.seo-about-boilerplate h2{font-size:25px;letter-spacing:-.035em}.seo-about-boilerplate p{font-size:14px;color:#707786;max-width:800px;margin-top:13px}.seo-about-copy{padding:13px 16px;min-height:46px;border-radius:9px;font-size:13px;color:var(--blue);background:#eef3ff;white-space:nowrap;font-weight:650}.seo-about-copy>span{margin-left:12px;font-size:19px;vertical-align:middle}.seo-about-copy-controls p{font-size:12px;min-height:20px;max-width:220px;color:var(--blue)}.seo-about-closing{padding-top:40px;padding-bottom:55px}.seo-about-closing-inner{background:var(--yellow);border-radius:24px;padding:64px 60px;display:grid;grid-template-columns:1.7fr 1fr;position:relative;overflow:hidden;align-items:center;gap:20px}.seo-about-closing h2{font-size:clamp(42px,4.8vw,69px);letter-spacing:-.06em}.seo-about-closing p{font-size:20px;margin:22px 0 28px;color:#4c420f}.seo-about-actions{display:flex;gap:27px;align-items:center}.seo-about-closing .seo-about-link{color:var(--ink);text-decoration-color:#a39546;font-size:14px}.seo-about-closing-art{position:relative;height:275px;transform:rotate(8deg)}.seo-about-closing-art svg{position:absolute;inset:0;width:100%;height:100%;fill:var(--magenta)}.seo-about-closing-art>span{position:absolute;inset:0;display:grid;place-items:center;font-size:65px;letter-spacing:-.08em;font-weight:800;color:#171724;padding-bottom:20px}html:not(.seo-about-enhanced) .seo-about-service-panel[hidden]{display:grid!important}html:not(.seo-about-enhanced) .seo-about-service-tabs,html:not(.seo-about-enhanced) .seo-about-copy-controls{display:none}html:not(.seo-about-enhanced) .seo-about-service-panel{border-top:1px solid #dfe3ed}@media(max-width:1050px){.seo-about-wrap{width:calc(100% - 56px)}.seo-about-definition{padding:54px 58px;margin-inline:0}.seo-about-definition h1{font-size:48px}.seo-about-purpose{gap:55px;padding-top:85px}.seo-about-purpose-copy h2{font-size:51px}.seo-about-purpose-copy p.seo-about-lead{font-size:19px}.seo-about-purpose-copy p{font-size:16px}.seo-about-purpose-top{padding:21px;font-size:12px;gap:9px}.seo-about-sticker{font-size:28px;padding:20px}.seo-about-service-tabs button{padding:21px 17px;min-height:120px}.seo-about-service-tabs strong{font-size:22px}.seo-about-tab-short{font-size:10px}.seo-about-service-copy{padding:38px 32px}.seo-about-service-copy h3{font-size:35px}.seo-about-service-copy p{font-size:16px}.seo-about-service-panel{min-height:470px}.seo-about-service-copy li{font-size:12px}.seo-about-belief-grid{gap:30px}.seo-about-belief-grid h3{font-size:23px}.seo-about-belief-grid p{font-size:16px}.seo-about-process{padding:45px 35px}.seo-about-process-head{gap:35px}.seo-about-process-head h2{font-size:40px}.seo-about-process-head p{max-width:290px;font-size:15px}.seo-about-process-grid{gap:26px}.seo-about-process-grid h3{font-size:21px}.seo-about-faq{gap:55px}.seo-about-faq h2{font-size:44px}.seo-about-closing-inner{padding:50px 40px;grid-template-columns:1.6fr 1fr}.seo-about-closing-art{height:230px}.seo-about-closing-art>span{font-size:51px}.seo-about-actions{gap:16px;align-items:flex-start;flex-direction:column}.seo-about-boilerplate{gap:25px}.seo-about-flow-node{padding:20px 15px;gap:12px}.seo-about-flow-node>strong{font-size:17px}.seo-about-browser-content>strong{font-size:42px}}@media(max-width:700px){.seo-about-wrap{width:calc(100% - 36px)}.seo-about-hero{padding-top:28px}.seo-about-definition{padding:34px 16px 46px;margin-inline:4px}.seo-about-definition h1{font-size:clamp(29px,8vw,45px);line-height:1.16;letter-spacing:-.045em}.seo-about-label{font-size:14px;margin-bottom:19px}.seo-about-rings i{border-radius:30px;inset:0 -7px}.seo-about-rings i:nth-child(2){inset:7px -10px;border-radius:32px}.seo-about-rings i:nth-child(3){inset:14px -12px;border-radius:30px}.seo-about-hero-heart{width:45px;height:45px;bottom:1px;right:23px;padding:4px}.seo-about-hero-intro{font-size:16px;margin:26px auto 8px;padding:0 5px}.seo-about-link{font-size:14px}.seo-about-service-links{grid-template-columns:repeat(2,1fr);margin-top:25px}.seo-about-service-links a{font-size:14px;padding:17px 15px!important}.seo-about-service-links a:nth-child(2){border-right:0}.seo-about-service-links a:nth-child(-n+2){border-bottom:1px solid #e4e7ef}.seo-about-service-links span{font-size:20px}.seo-about-purpose{grid-template-columns:1fr;gap:31px;padding-top:65px}.seo-about-purpose-copy h2{font-size:47px;letter-spacing:-.055em}.seo-about-purpose-copy p.seo-about-lead{font-size:19px;margin-top:24px}.seo-about-purpose-copy p{font-size:16px;margin-top:16px}.seo-about-purpose-art{aspect-ratio:1;border-radius:20px}.seo-about-purpose-top{padding:19px;font-size:12px}.seo-about-purpose-top svg{width:24px;height:24px}.seo-about-sticker{font-size:27px;padding:17px 22px;right:20px;bottom:20px}.seo-about-services{padding-top:70px}.seo-about-page h2{font-size:39px}.seo-about-purpose-copy h2{font-size:47px}.seo-about-section-head p{font-size:16px;margin-top:20px}.seo-about-service-tabs{margin-top:28px;border-radius:13px 13px 0 0;grid-template-columns:repeat(4,minmax(0,1fr))}.seo-about-service-tabs button{padding:13px 9px 14px;min-height:73px;text-align:center}.seo-about-service-tabs strong{font-size:12px;letter-spacing:-.015em}.seo-about-tab-number{font-size:10px;margin-bottom:8px}.seo-about-tab-short,.seo-about-tab-arrow{display:none}.seo-about-service-panel{grid-template-columns:1fr;min-height:0}.seo-about-service-copy{padding:30px 24px}.seo-about-service-copy h3{font-size:34px}.seo-about-service-copy p{font-size:16px;margin-top:20px}.seo-about-service-copy ul{margin:20px 0 17px;gap:9px}.seo-about-service-copy li{font-size:13px}.seo-about-service-art{aspect-ratio:1.08;min-height:0}.seo-about-browser{width:77%;max-width:305px;margin:30px 0 44px}.seo-about-browser-top{height:27px;font-size:8px;padding:0 10px}.seo-about-browser-content{padding:19px}.seo-about-browser-content>img{width:85px;margin-bottom:19px}.seo-about-browser-content>strong{font-size:36px}.seo-about-browser-button{font-size:7px;margin-top:14px;padding:7px 9px}.seo-about-browser-cards{margin-top:18px;gap:8px}.seo-about-browser-cards img{width:calc(50% - 4px);aspect-ratio:1.7}.seo-about-art-caption{font-size:9px;bottom:12px;left:15px}.seo-about-flow{width:79%;padding:20px 0 35px}.seo-about-flow-node{padding:16px 17px;border-radius:9px;gap:13px}.seo-about-flow-node>strong{font-size:16px}.seo-about-flow-node>span{font-size:10px}.seo-about-flow-node>b{font-size:20px}.seo-about-flow-line{height:25px}.seo-about-flow-label{font-size:12px;margin-top:16px}.seo-about-beliefs{padding-top:65px}.seo-about-belief-grid{grid-template-columns:1fr;gap:29px;margin-top:32px}.seo-about-belief-grid article{padding-top:26px;display:grid;grid-template-columns:55px 1fr;gap:0 21px}.seo-about-belief-symbol{width:50px;height:50px;grid-row:1/3;margin-bottom:0}.seo-about-belief-symbol svg{width:50px;height:50px}.seo-about-belief-grid h3{font-size:25px;align-self:center}.seo-about-belief-grid p{font-size:16px;margin-top:13px}.seo-about-founder{grid-template-columns:1fr;gap:15px;margin-top:65px;padding-block:35px}.seo-about-founder p{font-size:16px}.seo-about-founder-name{margin-top:20px}.seo-about-process{margin-top:65px;padding:32px 25px;border-radius:20px}.seo-about-process-head{display:block}.seo-about-process-head h2{font-size:35px}.seo-about-process-head p{font-size:16px;margin-top:21px;max-width:none}.seo-about-process-grid{grid-template-columns:1fr;gap:27px;margin-top:29px}.seo-about-step-number{padding-top:20px;margin-bottom:13px}.seo-about-process-grid h3{font-size:24px}.seo-about-process-grid p{font-size:15px;margin-top:11px}.seo-about-faq{grid-template-columns:1fr;gap:30px;padding-top:65px}.seo-about-faq h2{font-size:39px}.seo-about-faq summary{font-size:17px;padding:22px 0;gap:20px}.seo-about-faq details p{font-size:15px;margin-right:10px}.seo-about-boilerplate{margin-top:57px;grid-template-columns:1fr;gap:20px;padding:28px 0}.seo-about-boilerplate h2{font-size:25px}.seo-about-boilerplate p{font-size:14px}.seo-about-copy-controls p{max-width:none}.seo-about-closing{padding-top:15px;padding-bottom:35px}.seo-about-closing-inner{padding:35px 26px;grid-template-columns:1fr;border-radius:20px;gap:5px}.seo-about-closing h2{font-size:42px}.seo-about-closing p{font-size:17px;margin-top:21px}.seo-about-closing-art{height:155px;width:190px;justify-self:end;margin-top:5px;margin-bottom:-21px;margin-right:-20px}.seo-about-closing-art>span{font-size:46px}.seo-about-button{min-height:52px;padding:14px 23px}.seo-about-actions{gap:13px}}@media(prefers-reduced-motion:reduce){html:has(.seo-about-body){scroll-behavior:auto}.seo-about-page *{transition:none!important;animation:none!important}.seo-about-button:hover{transform:none}}

/* the /vs/ hub list: one card per published comparison, from the data */
.seo-vs-hub-list{list-style:none;margin:34px 0 0;padding:0;display:grid;gap:14px;max-width:820px}
.seo-vs-hub-list a{display:grid;grid-template-columns:1fr auto;gap:4px 18px;align-items:center;padding:22px 26px;border:1px solid var(--line);border-radius:16px;text-decoration:none;color:var(--ink);transition:border-color .18s,transform .18s}
.seo-vs-hub-list a:hover{border-color:var(--blue);transform:translateY(-2px)}
.seo-vs-hub-list strong{font-size:21px;letter-spacing:-.02em}
.seo-vs-hub-list span{grid-column:1;font-size:15.5px;line-height:1.5;color:#5b5b60}
.seo-vs-hub-list em{grid-row:1/3;font-style:normal;font-size:22px;color:var(--blue)}
@media(max-width:650px){.seo-vs-hub-list a{padding:18px 20px}.seo-vs-hub-list strong{font-size:19px}}

/* "where we have the edge": the part a two-column price chart cannot carry */
.seo-vs-edge{padding-top:8px}
.seo-vs-edge-list{list-style:none;margin:46px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:38px 56px;counter-reset:none}
.seo-vs-edge-list li{position:relative;padding-top:26px;border-top:1px solid var(--line)}
.seo-vs-edge-n{position:absolute;top:26px;left:0;font-size:13px;font-weight:600;letter-spacing:.12em;color:var(--blue)}
.seo-vs-edge-list h3{margin:0 0 10px 44px;font-size:22px;line-height:1.22;letter-spacing:-.021em}
.seo-vs-edge-list p{margin:0 0 0 44px;font-size:16.5px;line-height:1.62;color:#4b4b52}
.seo-vs-fair{margin:64px 0 0;padding:38px 42px;border-radius:20px;background:#f7f7f9}
.seo-vs-fair h3{margin:0 0 8px;font-size:24px;letter-spacing:-.022em}
.seo-vs-fair-intro{margin:0 0 20px;font-size:16.5px;color:#4b4b52}
.seo-vs-fair ul{margin:0;padding:0;list-style:none;display:grid;gap:13px}
.seo-vs-fair li{position:relative;padding-left:26px;font-size:16.5px;line-height:1.6;color:#39393f}
.seo-vs-fair li::before{content:"";position:absolute;left:2px;top:10px;width:9px;height:9px;border-radius:50%;background:var(--cyan)}
@media(max-width:860px){
  .seo-vs-edge-list{grid-template-columns:1fr;gap:30px}
  .seo-vs-edge-list h3{font-size:20px}
  .seo-vs-fair{padding:28px 24px;margin-top:46px}
}

/* city pages: the rest of the region */
.local-nearby{margin:0 0 96px;padding:44px 48px;border-radius:22px;background:#f7f6fb}
.local-nearby h2{margin:8px 0 12px;font-size:clamp(27px,3vw,38px);line-height:1.12;letter-spacing:-.028em}
.local-nearby>p{margin:0 0 24px;max-width:620px;font-size:16.5px;line-height:1.62;color:#4b4b52}
.local-nearby ul{list-style:none;margin:0 0 26px;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.local-nearby li a{display:inline-block;padding:9px 16px;border-radius:999px;background:white;border:1px solid #e6e3ef;font-size:15px;color:var(--ink);text-decoration:none;transition:border-color .16s,transform .16s}
.local-nearby li a:hover{border-color:var(--local-blue);color:var(--local-blue);transform:translateY(-1px)}
@media(max-width:650px){.local-nearby{padding:30px 22px;margin-bottom:64px}}

/* the competitor logo lives in a span inside the chart header; the phone rule that
   hides the small caption under each name was hiding the logo with it */
@media(max-width:640px){
  .seo-vs-table thead th{height:104px}
  .seo-vs-table thead th .seo-vs-competitor-logo{max-width:112px;max-height:28px}
  .seo-vs-competitor-mark.has-badge{padding:8px 12px;border-radius:10px}
  .seo-vs-competitor-mark.has-badge .seo-vs-competitor-logo{max-height:26px}
}

/* the /printing/ hub: what these pages are, before the list of them */
.local-hub-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 38px;margin:0 0 64px;padding:34px 0 0;border-top:1px solid var(--line)}
.local-hub-facts p{margin:0;font-size:16px;line-height:1.6;color:#4b4b52}
.local-hub-facts p strong{display:block;color:var(--ink);margin-bottom:6px;font-size:17px;letter-spacing:-.015em}
.local-hub-facts>a{grid-column:1/-1}
@media(max-width:860px){.local-hub-facts{grid-template-columns:1fr;gap:22px;margin-bottom:44px}}

/* the gallery thumbnails are buttons now, so they need the button reset */
.thumb{padding:0;background:none;font:inherit;color:inherit;line-height:0;display:block;overflow:hidden}
.thumb img{display:block;width:100%;height:auto;border-radius:8px}
.thumb:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

/* catalog pagination: only rendered when the catalog outgrows one page */
.woocommerce-pagination{margin:44px 0 0;display:flex;justify-content:center}
.woocommerce-pagination ul{list-style:none;display:flex;gap:8px;margin:0;padding:0}
.woocommerce-pagination li{margin:0}
.woocommerce-pagination a,.woocommerce-pagination span{display:grid;place-items:center;min-width:42px;height:42px;padding:0 12px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--ink);font-size:15px}
.woocommerce-pagination a:hover{border-color:var(--blue);color:var(--blue)}
.woocommerce-pagination .current{background:var(--blue);border-color:var(--blue);color:#fff}
/* ===== LEGAL (privacy policy, terms of service; template page-legal.php) ===== */
.legal-head{padding-block:56px 40px;max-width:770px}.legal-head h1{font-size:clamp(40px,4.8vw,64px);font-weight:800;letter-spacing:-.05em;line-height:1.04}.legal-updated{font-size:14px;color:#595959;margin-top:14px}.legal-intro{font-size:20px;line-height:1.65;margin-top:22px;color:#343434}.legal-page .seo-body-section h2{font-size:clamp(26px,2.6vw,34px)}.legal-page .seo-body-section li strong{color:var(--ink)}.legal-page .seo-body-section a{color:var(--blue);text-decoration:underline;text-underline-offset:4px}
@media(max-width:760px){.legal-head{padding-block:32px 24px}.legal-head h1{font-size:clamp(36px,9vw,48px)}.legal-intro{font-size:18px}}
.modal-note a{color:inherit;text-decoration:underline;text-underline-offset:3px}

/* The account entry remains visible on phones, alongside the menu. */
@media(max-width:800px){
  .header a.button.header-account{display:inline-flex;margin-left:auto;min-height:44px;padding:12px 16px;font-size:14px}
  .header .menu-toggle{order:3}
  .header #navigation{order:4}
}
@media(max-width:520px){
  .header{gap:10px}
  .header .logo img{width:154px;height:auto}
  .header .menu-toggle{font-size:0;min-width:32px;min-height:44px;justify-content:center}
  .header .menu-toggle span{font-size:20px}
  .header a.button.header-account{padding:11px 12px;font-size:13px}
}
@media(max-width:380px){.header .logo img{width:132px}.header a.button.header-account{padding-inline:10px}}

/* Launch usability: readable specs, discoverable navigation and collection tools. */
.header #navigation .nav-secondary{display:none}
.nav-search{position:relative;font-size:14px}
.nav-search summary{cursor:pointer;padding:12px 0}
.nav-search form{position:absolute;right:0;top:100%;width:min(360px,85vw);padding:18px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px #0002;z-index:30}
.nav-search label{display:block;font-size:14px;margin-bottom:10px;color:var(--ink)}
.nav-search form>div{display:flex;gap:8px}
.nav-search input{min-width:0;width:100%;padding:10px;font:inherit;border:1px solid #777;border-radius:5px}
.nav-search button{padding:10px;background:var(--blue);color:#fff;border:0;border-radius:5px;font:inherit}
.footer-contact{font-size:14px;overflow-wrap:anywhere;margin:16px 0}.footer-contact a{text-decoration:underline;text-underline-offset:3px}
.contact-page{padding-top:90px;padding-bottom:100px;min-height:65vh}.contact-page h1{font-size:clamp(36px,5vw,68px);letter-spacing:-.04em;line-height:1.08;margin:22px 0}.contact-page p{font-size:16px;line-height:1.7;max-width:640px}.contact-email{display:inline-block;font-size:clamp(18px,3vw,30px);color:var(--blue);margin:24px 0;overflow-wrap:anywhere}.contact-actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin:12px 0 24px}
.press-label,.press-row .press-logo,.press-row:hover .press-logo{color:#5b626d}
.catalog-tools{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:20px}.catalog-tools .col-results{margin:0;flex:1;min-width:220px}.catalog-tools select{font:inherit;font-size:14px;padding:10px 12px;border:1px solid #76717d;border-radius:7px;max-width:100%;background:#fff}.catalog-tools form{margin:0}
.pd-art .spec-top>span:first-child,.pd-art .spec-bottom{font-size:12px;line-height:1.5;letter-spacing:.03em}
.pd-art .quick-specs p{font-size:14px;line-height:1.5}.pd-art .quick-specs article{height:auto;min-height:200px}
.pd-art .guide-callout>span,.pd-art .guide-callout p{font-size:12px;line-height:1.5}
.pd-art .copy-size,.pd-art .copy-status,.pd-art .diagram-note,.pd-art .diagram-legend>span,.pd-art .width-measure span,.pd-art .height-measure span{font-size:12px}
.pd-art .guide-rule strong{font-size:15px}.pd-art .guide-rule small,.pd-art .check-note,.pd-art .guide-download small,.pd-art .guide-download-main small{font-size:13px;line-height:1.6}
@media(max-width:800px){.header #navigation{flex-wrap:wrap}.header #navigation .nav-secondary{display:inline-flex}.nav-search{width:100%}.nav-search form{position:static;width:100%;box-shadow:none}.nav-search summary{min-height:44px}.catalog-tools .woocommerce-ordering{width:100%}}
@media(max-width:600px){
  .collection-rail ul{flex-wrap:wrap;overflow:visible;gap:8px}.collection-rail .rail-link{font-size:13px;min-height:44px;padding:10px 12px;white-space:normal}
  .pd-art .quick-specs{grid-template-columns:1fr 1fr}.pd-art .quick-specs article{padding:18px 14px}.pd-art .spec-top{align-items:flex-start;min-height:40px;margin-bottom:14px}.pd-art .spec-top svg{flex-shrink:0}.pd-art .spec-bottom{padding-top:14px}
  .pd-art .guide-callout{position:absolute;left:50%;top:calc(100% + 26px);width:220px;transform:translateX(-50%);text-align:center}.pd-art .guide-callout strong{font-size:32px;margin-top:6px}.pd-art .guide-callout p{margin-top:6px}.pd-art .sheet-wrap{margin-right:0;width:min(calc(var(--sw) * var(--k)),calc(100% - 20px))}.pd-art .diagram-stage{padding:52px 35px 210px;min-height:0}.pd-art .diagram-legend{flex-wrap:wrap;bottom:18px}
  .pd-art .guide-intro,.pd-art .zone-description,.pd-art .top-tip p,.pd-art .help-design p,.pd-art .check-list label,.pd-art .check-intro>p:not(.eyebrow),.pd-art .proof-steps p,.pd-art .extra-specs p{font-size:14px;line-height:1.65}.pd-art .section-nav a{font-size:12px}.pd-art .section-nav>div{gap:14px;flex-wrap:wrap}
  .col-results,.col-crumbs,.col-design-link{font-size:13px}.contact-page{padding-top:55px;padding-bottom:60px}
}

.art-drop.is-error .art-remove{display:inline}