/* New Wave Graphix — 2026 site styles
   Colors and type are set once here; every page uses this file. */
:root{
  --red:#db1f26;
  --red-dark:#B3191F;
  --red-text:#db1f26;      /* red that passes contrast on white */
  --red-on-dark:#db1f26;   /* red that passes contrast on charcoal */
  --ink:#141416;
  --charcoal:#1E1F22;
  --charcoal-2:#2C2D31;
  --line:#E6E7EA;
  --mist:#F2F3F5;
  --body:#45474D;
  --muted-on-dark:#C9CBD0;
  --wrap:1240px;
  --display:'Barlow Condensed',system-ui,sans-serif;
  --text:'Barlow',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--text);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--red-text)}
a:hover{color:var(--red-dark)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:8px 12px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--red);outline-offset:2px}

/* ---------- display type ---------- */
.eyebrow{font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:.18em;text-transform:uppercase;color:var(--red-text);margin:0}
.on-dark .eyebrow,.eyebrow.on-dark{color:var(--red-on-dark)}
.display{font-family:var(--display);font-style:italic;font-weight:900;text-transform:uppercase;line-height:.95;letter-spacing:-.005em;margin:0}
.display .red{color:var(--red)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 28px;font-family:var(--display);font-weight:700;font-size:19px;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;border:2px solid transparent;transition:background .15s,color .15s,border-color .15s;line-height:1.1;text-align:center}
.btn-red{background:var(--red);color:#fff}
.btn-red:hover{background:var(--red-dark);color:#fff}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#000;color:#fff}
.btn-ghost{border-color:#fff;color:#fff}
.btn-ghost:hover{background:#fff;color:var(--ink)}
.btn-outline{border-color:var(--ink);color:var(--ink)}
.btn-outline:hover{background:var(--ink);color:#fff}
.btn-row{display:flex;flex-wrap:wrap;gap:14px}

/* ---------- top bar ---------- */
.topbar{background:var(--ink);color:#E6E7EA;font-size:14px;font-weight:500}
.topbar .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 24px;padding-top:9px;padding-bottom:9px}
.topbar a{color:#fff;text-decoration:none;font-weight:700}
.topbar a:hover{color:var(--red-on-dark)}
.topbar .group{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:center}

/* ---------- header ---------- */
.site-header{background:#fff;position:relative;z-index:20}
.site-header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 28px;padding-top:16px;padding-bottom:16px}
.brand img{height:58px;width:auto}
.header-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px;font-family:var(--display);font-weight:700;font-size:19px;text-transform:uppercase;letter-spacing:.04em}
.header-actions a.plain{color:var(--ink);text-decoration:none}
.header-actions a.plain:hover{color:var(--red-text)}
.btn-quote{transform:skewX(-12deg)}
.btn-quote>span{display:inline-block;transform:skewX(12deg)}

/* ---------- service nav ---------- */
.service-nav{background:var(--charcoal);border-bottom:4px solid var(--red);position:relative;z-index:15}
.service-nav ul{list-style:none;margin:0 auto;padding:0 24px;max-width:var(--wrap);display:flex;flex-wrap:wrap;justify-content:space-between}
.service-nav a{display:block;padding:14px 2px;color:#fff;text-decoration:none;font-family:var(--display);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.05em;border-bottom:3px solid transparent;margin-bottom:-4px}
.service-nav a:hover{color:var(--red-on-dark)}
.service-nav a[aria-current="page"],.service-nav a[aria-current="true"]{border-bottom-color:#fff}
.menu-toggle{display:none}
.menu-btn{display:none}

/* ---------- hero (home) ---------- */
.hero{position:relative;background:var(--charcoal);color:#fff;overflow:hidden}
.hero::before{content:"";position:absolute;top:0;bottom:0;right:-140px;width:46%;background:var(--charcoal-2);transform:skewX(-14deg);transform-origin:top}
.hero::after{content:"";position:absolute;top:0;bottom:0;right:calc(46% - 170px);width:26px;background:var(--red);transform:skewX(-14deg);transform-origin:top}
.hero .wrap{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:center;gap:56px;padding-top:84px;padding-bottom:92px}
.hero-copy{flex:1 1 480px;min-width:0;display:flex;flex-direction:column;gap:22px}
.hero h1.display{font-size:clamp(48px,7vw,86px)}
.hero p.lead{margin:0;font-size:20px;line-height:1.55;color:#D2D4D9;max-width:580px}
.collage{flex:1 1 400px;min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.collage img{width:100%;aspect-ratio:1/1;object-fit:cover;border:4px solid #fff;background:#fff}
.collage img:nth-child(2){margin-top:40px}
.collage img:nth-child(3){margin-top:-40px}

/* ---------- page hero (inner pages) ---------- */
.page-hero{position:relative;background:var(--charcoal);color:#fff;overflow:hidden}
.page-hero::before{content:"";position:absolute;top:0;bottom:0;right:-160px;width:34%;background:var(--charcoal-2);transform:skewX(-14deg);transform-origin:top}
.page-hero::after{content:"";position:absolute;top:0;bottom:0;right:calc(34% - 190px);width:22px;background:var(--red);transform:skewX(-14deg);transform-origin:top}
.page-hero .wrap{position:relative;z-index:1;padding-top:60px;padding-bottom:64px;display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.page-hero h1.display{font-size:clamp(40px,5.6vw,68px);max-width:900px}
.page-hero .sub{margin:0;font-family:var(--display);font-weight:700;font-size:clamp(20px,2.2vw,26px);text-transform:uppercase;letter-spacing:.03em;color:#D2D4D9;max-width:820px}
.crumbs{font-size:14px;color:var(--muted-on-dark);margin:0}
.crumbs a{color:#fff;text-decoration:none}
.crumbs a:hover{color:var(--red-on-dark)}
.page-hero .btn-row{padding-top:8px}

/* ---------- red strip ---------- */
.strip{background:var(--red);color:#fff}
.strip .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 36px;padding-top:20px;padding-bottom:20px;font-family:var(--display);font-style:italic;font-weight:800;font-size:23px;text-transform:uppercase;letter-spacing:.03em}

/* ---------- sections ---------- */
.section{padding:92px 0}
.section.mist{background:var(--mist)}
.section.dark{background:var(--ink);color:#fff}
.section-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 40px;margin-bottom:44px}
.section-head .display{font-size:clamp(40px,5vw,60px);margin-top:10px}
.section-head p{margin:0;max-width:460px;font-size:18px;color:var(--body)}

/* ---------- service cards ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:24px}
.card{background:#fff;display:flex;flex-direction:column;text-decoration:none;color:var(--ink);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(0,0,0,.16);color:var(--ink)}
.card .pic{position:relative;border-bottom:8px solid var(--red)}
.card .pic img{width:100%;aspect-ratio:1/1;object-fit:cover}
.card .body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:8px;flex-grow:1}
.card h3{margin:0;font-family:var(--display);font-style:italic;font-weight:800;font-size:27px;line-height:1;text-transform:uppercase}
.card p{margin:0;font-size:16px;line-height:1.5;color:var(--body);flex-grow:1}
.card .more{font-family:var(--display);font-weight:700;font-size:17px;text-transform:uppercase;letter-spacing:.06em;padding-top:6px}
.card:hover .more{color:var(--red-text)}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:28px}
.step{border-top:6px solid var(--ink);padding-top:22px}
.step .n{font-family:var(--display);font-style:italic;font-weight:900;font-size:62px;line-height:1;color:var(--red)}
.step h3{margin:10px 0 8px;font-family:var(--display);font-style:italic;font-weight:800;font-size:29px;text-transform:uppercase;line-height:1.05}
.step p{margin:0;color:var(--body)}

/* ---------- about split ---------- */
.split{display:flex;flex-wrap:wrap;gap:56px;align-items:center}
.split>*{flex:1 1 440px;min-width:0}
.split .photo{position:relative}
.split .photo img{width:100%}
.split .photo::after{content:"";position:absolute;left:-12px;bottom:-12px;width:120px;height:12px;background:var(--red)}
.split .copy{display:flex;flex-direction:column;gap:18px}
.split .copy .display{font-size:clamp(38px,4.6vw,56px)}
.split .copy p{margin:0;font-size:18px;color:var(--muted-on-dark)}

/* ---------- CTA band ---------- */
.cta{position:relative;background:var(--red);color:#fff;overflow:hidden}
.cta::before{content:"";position:absolute;top:0;bottom:0;right:-90px;width:34%;background:var(--red-dark);transform:skewX(-14deg);transform-origin:top}
.cta .wrap{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:32px;padding-top:72px;padding-bottom:72px}
.cta .display{font-size:clamp(40px,5.4vw,64px)}
.cta p{margin:12px 0 0;font-size:20px;color:#FFE3E4}

/* ---------- content (inner pages) ---------- */
.content{padding:72px 0 88px}
.content .wrap>*{max-width:820px}
.content .wrap>.gallery,.content .wrap>.callout,.content .wrap>.embed,.content .wrap>.cards,.content .wrap>.info-grid,.content .wrap>.wide{max-width:none}
.content h2{font-family:var(--display);font-style:italic;font-weight:900;font-size:clamp(32px,3.6vw,44px);line-height:1;text-transform:uppercase;margin:56px 0 18px}
.content h3{font-family:var(--display);font-weight:800;font-size:25px;line-height:1.15;text-transform:uppercase;letter-spacing:.02em;margin:40px 0 12px;padding-left:16px;border-left:6px solid var(--red)}
.content h2+h3{margin-top:12px}
.content .wrap>:first-child{margin-top:0}
.content p{margin:0 0 16px;color:#2E3035}
.content ul,.content ol{margin:0 0 20px;padding-left:22px;color:#2E3035}
.content li{margin:0 0 8px}
.content li::marker{color:var(--red)}
.content ul.cols{columns:3 200px;column-gap:32px}
.content ul.cols li{break-inside:avoid}
.content .btn-row{margin:8px 0 24px}

/* galleries */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin:8px 0 36px}
.gallery.wide-tiles{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.gallery figure{margin:0;background:var(--mist);overflow:hidden}
.gallery figure.span2{grid-column:span 2}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.gallery a:hover img{transform:scale(1.03)}
.figure{margin:8px 0 32px}
.figure img{border:1px solid var(--line)}
@media (max-width:520px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.gallery figure.span2{grid-column:span 2}}

/* callout */
.callout{background:var(--mist);border-top:6px solid var(--ink);padding:28px 30px;margin:12px 0 40px;display:flex;flex-wrap:wrap;gap:18px 32px;align-items:center;justify-content:space-between}
.callout h3{margin:0;padding:0;border:0;font-family:var(--display);font-style:italic;font-weight:900;font-size:30px;text-transform:uppercase}
.callout p{margin:6px 0 0;color:var(--body)}

/* embeds (catalogs, map) */
.embed{margin:8px 0 24px;border:1px solid var(--line);background:#fff}
.embed iframe{display:block;width:100%;height:900px;border:0}
.embed.map iframe{height:440px}
.tabs{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px}
.tabs a{display:inline-flex;align-items:center;min-height:44px;padding:8px 20px;border:2px solid var(--ink);color:var(--ink);text-decoration:none;font-family:var(--display);font-weight:700;font-size:18px;text-transform:uppercase;letter-spacing:.04em}
.tabs a:hover{background:var(--ink);color:#fff}
.tabs a[aria-current="page"]{background:var(--red);border-color:var(--red);color:#fff}

/* contact info grid */
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin:0 0 40px}
.info{background:var(--mist);padding:26px 26px 28px;border-top:6px solid var(--red)}
.info h3{margin:0 0 8px;padding:0;border:0;font-size:22px}
.info p{margin:0;font-size:18px}
.info a{font-weight:700}
.hours{border-collapse:collapse;font-size:17px}
.hours td{padding:2px 18px 2px 0}

/* ---------- footer ---------- */
.site-footer{background:var(--charcoal);color:#fff}
.site-footer .wrap{padding-top:68px;padding-bottom:30px}
.foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:40px}
.foot-grid h2{margin:0 0 12px;font-family:var(--display);font-weight:800;font-size:19px;text-transform:uppercase;letter-spacing:.08em;color:var(--red-on-dark)}
.foot-grid p,.foot-grid li{margin:0;color:var(--muted-on-dark);font-size:16px}
.foot-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.foot-grid a{color:var(--muted-on-dark);text-decoration:none}
.foot-grid a:hover{color:#fff}
.logo-plate{background:#fff;padding:10px 14px;display:inline-block;margin-bottom:16px}
.logo-plate img{width:220px}
.social{display:flex;gap:14px;margin-top:16px}
.social a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:2px solid #3A3B40;color:#fff}
.social a:hover{border-color:var(--red);background:var(--red);color:#fff}
.social svg{width:20px;height:20px}
.legal{border-top:1px solid #3A3B40;margin-top:48px;padding-top:22px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;font-size:14px;color:#9EA1A8}

/* ---------- phones & tablets ---------- */
@media (max-width:1020px){
  .service-nav ul{justify-content:flex-start;gap:0 22px}
}
@media (max-width:760px){
  body{font-size:16px}
  .topbar .hide-sm{display:none}
  .brand img{height:44px}
  .header-actions .plain{display:none}
  .menu-btn{display:flex;align-items:center;justify-content:space-between;max-width:var(--wrap);margin:0 auto;padding:0 24px;min-height:52px;color:#fff;cursor:pointer;font-family:var(--display);font-weight:700;font-size:19px;text-transform:uppercase;letter-spacing:.06em}
  .menu-btn svg{width:24px;height:24px}
  .service-nav ul{display:none;flex-direction:column;padding-bottom:12px}
  .menu-toggle:checked~ul{display:flex}
  .menu-toggle:focus-visible+.menu-btn{outline:3px solid var(--red);outline-offset:-3px}
  .service-nav a{padding:12px 0;border-bottom:1px solid #3A3B40;margin:0}
  .service-nav a[aria-current="page"],.service-nav a[aria-current="true"]{border-bottom-color:#3A3B40;color:var(--red-on-dark)}
  .hero .wrap{padding-top:56px;padding-bottom:64px;gap:40px}
  .hero::before,.hero::after,.page-hero::before,.page-hero::after{display:none}
  .section{padding:64px 0}
  .content{padding:52px 0 64px}
  .collage img:nth-child(2),.collage img:nth-child(3){margin-top:0}
  .strip .wrap{font-size:19px}
  .embed iframe{height:720px}
}

/* =====================================================================
   Light grey theme — white and soft-grey panels, a red slash and a
   graphite swoosh, all drawn in CSS (no background image).
   ===================================================================== */
:root{
  --charcoal:#3E4146;
  --charcoal-2:#55585F;
  --ink:#24262A;
  --mist:#F1F1F4;
  --line:#DCDDE1;
  --graphite:#4A4D53;
  --panel:#E6E7EB;
}
.topbar{background:linear-gradient(90deg,#55585F,#3E4146)}
.service-nav{background:linear-gradient(180deg,#5E6168,#474A50)}

/* home hero */
.hero{
  color:var(--ink);
  background:
    radial-gradient(140% 70% at 78% 116%, #4A4D53 0 38%, transparent 38.3%),
    radial-gradient(150% 72% at 70% 112%, #C4C6CB 0 40%, transparent 40.4%),
    linear-gradient(165deg,#FFFFFF 0%,#F3F3F6 55%,#E7E8EC 100%);
}
.hero::before{ /* soft grey panel, top right */
  content:"";position:absolute;top:0;bottom:0;right:-180px;left:auto;width:40%;
  background:linear-gradient(180deg,#ECEDF0,#E0E1E5);
  transform:skewX(-24deg);transform-origin:top;
  box-shadow:-18px 0 40px rgba(40,42,48,.10);
}
.hero::after{ /* red slash */
  content:"";position:absolute;top:-10%;bottom:-10%;right:calc(40% - 192px);width:22px;
  background:linear-gradient(180deg,#db1f26,#db1f26);
  transform:skewX(-24deg);transform-origin:top;
  box-shadow:0 0 18px rgba(219,31,38,.25);
}
.hero p.lead{color:#4A4D53}
.hero .eyebrow.on-dark{color:var(--red-text)}
.hero .btn-ghost{border-color:var(--ink);color:var(--ink)}
.hero .btn-ghost:hover{background:var(--ink);color:#fff}
.collage{position:relative;z-index:1}
.collage img{box-shadow:0 12px 28px rgba(40,42,48,.22)}
.hero .wrap{padding-bottom:120px}

/* inner page banner */
.page-hero{
  color:var(--ink);
  background:
    radial-gradient(160% 60% at 85% 112%, #4A4D53 0 36%, transparent 36.4%),
    radial-gradient(170% 62% at 78% 108%, #C8CACF 0 38.8%, transparent 39.2%),
    linear-gradient(165deg,#FFFFFF 0%,#F2F2F5 60%,#E8E9EC 100%);
}
.page-hero::before{
  content:"";position:absolute;top:0;bottom:0;right:-200px;width:38%;
  background:linear-gradient(180deg,#ECEDF0,#E1E2E6);
  transform:skewX(-24deg);transform-origin:top;box-shadow:-14px 0 34px rgba(40,42,48,.09);
}
.page-hero::after{
  content:"";position:absolute;top:-10%;bottom:-10%;right:calc(38% - 210px);width:18px;
  background:linear-gradient(180deg,#db1f26,#db1f26);
  transform:skewX(-24deg);transform-origin:top;
}
.page-hero .wrap{padding-bottom:92px}
.page-hero .sub{color:#4A4D53}
.page-hero .eyebrow.on-dark{color:var(--red-text)}
.crumbs{color:#5B5E64}
.crumbs a{color:var(--ink)}
.crumbs a:hover{color:var(--red-text)}
.page-hero .btn-ghost{border-color:var(--ink);color:var(--ink)}
.page-hero .btn-ghost:hover{background:var(--ink);color:#fff}

/* about: soft grey instead of black */
.section.dark{background:linear-gradient(180deg,#E8E9EC,#F6F6F8);color:var(--ink)}
.section.dark .eyebrow.on-dark{color:var(--red-text)}
.split .copy p{color:#45474D}
.section.dark .btn-ghost{border-color:var(--ink);color:var(--ink)}
.section.dark .btn-ghost:hover{background:var(--ink);color:#fff}
.split .photo img{box-shadow:0 12px 30px rgba(40,42,48,.2)}

/* CTA keeps the red; softer dark button */
.cta .btn-dark{background:var(--charcoal)}
.cta .btn-dark:hover{background:#2C2F33}

/* footer: graphite gradient */
.site-footer{background:linear-gradient(180deg,#53575E,#33363B)}
.legal{border-top-color:#686C73;color:#C8CACF}
.social a{border-color:#72767D}

@media (max-width:760px){
  .hero::before,.hero::after,.page-hero::before,.page-hero::after{display:none}
  .hero{background:
    radial-gradient(220% 30% at 70% 104%, #45484E 0 40%, transparent 40.5%),
    linear-gradient(165deg,#FFFFFF,#ECEDF0)}
  .page-hero{background:
    radial-gradient(220% 34% at 70% 112%, #4A4D53 0 40%, transparent 40.5%),
    linear-gradient(165deg,#FFFFFF,#ECEDF0)}
  .hero .wrap{padding-bottom:88px}
  .page-hero .wrap{padding-bottom:64px}
}

/* ===== v3: compact banners on the white swoosh background ===== */
/* shared banner background: the swoosh, plus a slim red slash and grey panel at the far right */
.hero,.page-hero{
  color:var(--ink);
  background:#F4F4F6 url(images/2026/banner-swoosh.jpg) left center/cover no-repeat;
  border-bottom:1px solid var(--line);
}
.hero::before,.page-hero::before{
  content:"";position:absolute;top:0;bottom:0;right:-60px;left:auto;width:15%;
  background:linear-gradient(180deg,#6A6D74,#4A4D53);
  transform:skewX(-24deg);transform-origin:top;box-shadow:none;display:block;
}
.hero::after,.page-hero::after{
  content:"";position:absolute;top:-10%;bottom:-10%;right:calc(15% - 60px);width:14px;
  background:linear-gradient(180deg,#db1f26,#db1f26);
  transform:skewX(-24deg);transform-origin:top;box-shadow:none;display:block;
}

/* home banner: about one third of the old height */
.hero .wrap{padding-top:34px;padding-bottom:36px;gap:32px;align-items:center}
.hero-copy{flex:1 1 520px;gap:12px}
.hero h1.display{font-size:clamp(34px,3.6vw,48px)}
.hero p.lead{font-size:17px;max-width:620px}
.hero .btn-row{padding-top:4px}
.collage{flex:0 1 430px;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-right:12%}
.collage img{border-width:3px;box-shadow:0 8px 18px rgba(40,42,48,.2)}
.collage img:nth-child(2),.collage img:nth-child(3){margin-top:0}
.collage img:nth-child(4){display:none}

/* inner page banner: about one third of the old height */
.page-hero .wrap{padding-top:26px;padding-bottom:28px;gap:6px;
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;column-gap:32px}
.page-hero .crumbs,.page-hero .eyebrow{grid-column:1}
.page-hero .crumbs{display:none}
.page-hero h1.display{grid-column:1;font-size:clamp(30px,3.4vw,44px)}
.page-hero .sub{grid-column:1;font-size:clamp(17px,1.6vw,20px)}
.page-hero .btn-row{grid-column:2;grid-row:1 / span 3;padding:0;margin-right:15%;flex-wrap:nowrap}
.page-hero .btn{min-height:44px;padding:10px 20px;font-size:17px}

/* current page in the services menu: a red tab that stands out */
.service-nav ul{justify-content:space-between}
.service-nav a{padding:13px 11px;margin-bottom:-4px;border-bottom:0;transform:skewX(-12deg)}
.service-nav a>span{display:inline-block;transform:skewX(12deg)}
.service-nav a:hover{background:rgba(255,255,255,.1);color:#fff}
.service-nav a[aria-current="page"],.service-nav a[aria-current="true"]{background:var(--red);color:#fff;box-shadow:0 4px 10px rgba(219,31,38,.35)}

@media (max-width:1020px){
  .collage{display:none}
  .page-hero .wrap{grid-template-columns:1fr}
  .page-hero .btn-row{grid-column:1;grid-row:auto;margin:8px 0 0}
}
@media (max-width:760px){
  .hero::before,.hero::after,.page-hero::before,.page-hero::after{display:none}
  .hero,.page-hero{background:#F4F4F6 url(images/2026/banner-swoosh.jpg) left top/cover no-repeat}
  .hero .wrap{padding-top:26px;padding-bottom:28px}
  .page-hero .btn-row{flex-wrap:wrap}
  .service-nav a{transform:none;padding:12px 10px}
  .service-nav a>span{transform:none}
  .service-nav a[aria-current="page"],.service-nav a[aria-current="true"]{color:#fff;border-bottom-color:transparent}
}
/* v3 tightening */
@media (min-width:1021px){
  .service-nav ul{flex-wrap:nowrap}
  .service-nav li{flex:0 0 auto}
  .service-nav a{padding:12px 9px;font-size:15px;letter-spacing:.03em;white-space:nowrap}
}
.btn{white-space:nowrap}
.hero-copy{flex:1 1 640px}
.hero h1.display{font-size:clamp(32px,3.2vw,44px);max-width:720px}
.collage{flex:0 1 330px;margin-right:13%}
.page-hero .btn-row{margin-right:17%}
.hero .wrap{padding-top:26px;padding-bottom:28px}
.hero-copy{gap:10px}
.hero h1.display{font-size:clamp(30px,2.9vw,40px)}
@media (max-width:760px){.btn{white-space:normal}}
@media (min-width:1021px){
  .page-hero .btn-row{margin-right:0}
  .page-hero .wrap{padding-right:200px}
}
@media (min-width:1021px){.page-hero h1.display{font-size:clamp(28px,2.7vw,38px)}}

/* =====================================================================
   Rotating banner photos: red stripe, grey band, then the photo, all on
   the same slant. Each layer is clipped with the same polygon and inset
   a little further, which reveals the stripes between them.
   ===================================================================== */
.hero::before,.hero::after,.page-hero::before,.page-hero::after{display:none}
.collage{display:none}
.banner-media{--slant:110px;position:absolute;top:0;bottom:0;right:0;width:46%;z-index:2;
  clip-path:polygon(var(--slant) 0,100% 0,100% 100%,0 100%);
  background:linear-gradient(180deg,#db1f26,#db1f26)}
.page-hero .banner-media{--slant:80px;width:42%}
.banner-media .band,.banner-media .slides{position:absolute;top:0;bottom:0;right:0;
  clip-path:polygon(var(--slant) 0,100% 0,100% 100%,0 100%)}
.banner-media .band{left:14px;background:linear-gradient(180deg,#6A6D74,#4A4D53)}
.banner-media .slides{left:52px;background:#4A4D53}
.slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s ease}
.slides img.on{opacity:1}
.dots{position:absolute;right:24px;bottom:16px;display:flex;gap:8px;z-index:2}
.dots button{width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center}
.dots button::before{content:"";width:13px;height:13px;border-radius:50%;border:2px solid #fff;background:rgba(0,0,0,.25);box-shadow:0 1px 4px rgba(0,0,0,.4)}
.dots button[aria-pressed="true"]::before{background:var(--red);border-color:#fff}

/* keep text clear of the photo */
.hero .wrap{padding-right:calc(46% - (100vw - min(100vw, var(--wrap))) / 2 + 24px);min-height:294px}
.hero-copy{flex:1 1 auto}
.page-hero .wrap{display:flex;flex-direction:column;align-items:flex-start;gap:8px;
  padding-right:calc(42% - (100vw - min(100vw, var(--wrap))) / 2 + 24px);min-height:210px;justify-content:center}
.page-hero .btn-row{margin:6px 0 0;flex-wrap:wrap}
.page-hero h1.display{font-size:clamp(28px,2.7vw,38px)}

@media (max-width:1020px){
  .hero .wrap,.page-hero .wrap{padding-right:24px;min-height:0}
  .hero .banner-media,.page-hero .banner-media{position:relative;width:100%;height:190px;--slant:0px;clip-path:none;
    border-top:6px solid var(--red)}
  .banner-media .band{display:none}
  .banner-media .slides{left:0;clip-path:none}
  .hero,.page-hero{display:flex;flex-direction:column}
}
@media (prefers-reduced-motion:reduce){.slides img{transition:none}}

/* =====
/* ===== richer grey gradients (metallic, like the brand graphic) ===== */
.topbar{
  background:
    linear-gradient(100deg, transparent 0%, rgba(255,255,255,.07) 38%, rgba(255,255,255,.13) 50%, transparent 64%),
    linear-gradient(180deg,#6E7178 0%,#55585F 45%,#3D4045 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), inset 0 -1px 0 rgba(0,0,0,.35);
}
.service-nav{
  background:
    linear-gradient(100deg, transparent 0%, rgba(255,255,255,.06) 30%, rgba(255,255,255,.14) 46%, transparent 62%),
    linear-gradient(180deg,#83868D 0%,#64676E 38%,#4A4D53 70%,#3B3E43 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 3px 8px rgba(30,32,36,.25);
}
.service-nav a{text-shadow:0 1px 1px rgba(0,0,0,.35)}
.service-nav a[aria-current="page"],.service-nav a[aria-current="true"]{background:linear-gradient(180deg,#db1f26,#db1f26);text-shadow:none}
.banner-media .band{background:
    linear-gradient(100deg, transparent 20%, rgba(255,255,255,.16) 55%, transparent 80%),
    linear-gradient(180deg,#8A8D94 0%,#5E6168 50%,#3E4146 100%)}

/* ===== menu dividers: a slanted groove between buttons ===== */
.service-nav li{position:relative;display:flex}
.service-nav li+li::before{content:"";position:absolute;left:-1px;top:9px;bottom:9px;width:2px;
  background:linear-gradient(90deg,rgba(0,0,0,.35) 0 1px,rgba(255,255,255,.28) 1px 2px);
  transform:skewX(-12deg);pointer-events:none}
.service-nav li:has(a[aria-current="page"])::before,
.service-nav li:has(a[aria-current="page"])+li::before{opacity:0}
@media (min-width:1021px){
  .service-nav ul{justify-content:center}
  .service-nav a{padding:12px 11px;font-size:15px}
}
@media (max-width:1180px) and (min-width:1021px){
  .service-nav a{padding:12px 7px;font-size:14px;letter-spacing:.02em}
}
@media (max-width:1020px){
  .service-nav li+li::before{display:none}
}
@media (max-width:1020px){.service-nav li{display:block}}

/* =====================================================================
   Banner photo sits inside the centered content area (not the screen
   edge): it starts partway across and ends at the content's right edge.
   Percentages here are of the banner's width, so min(100%, --wrap) is
   the width of the centered content area.
   ===================================================================== */
@media (min-width:1021px){
  .hero,.page-hero{--box:min(100%, var(--wrap));--edge:calc((100% - var(--box)) / 2)}
  .hero .banner-media,.page-hero .banner-media{
    right:calc(var(--edge) + 24px);
    width:calc(var(--box) * .58 - 24px)}
  .hero .banner-media{width:calc(var(--box) * .52 - 24px)}
  /* text stops just before the photo's slanted edge */
  .page-hero .wrap{padding-right:calc(var(--box) * .58 + 20px)}
  .hero .wrap{padding-right:calc(var(--box) * .52 + 20px)}
  .page-hero h1.display{font-size:clamp(26px,2.4vw,34px)}
}

/* page text uses the full content width */
.content .wrap>*{max-width:none}
@media (min-width:1021px){
  .hero .banner-media,.page-hero .banner-media{width:calc(var(--box) * .62 - 24px)}
  .hero .wrap,.page-hero .wrap{padding-right:calc(var(--box) * .62 + 20px)}
  .page-hero h1.display{font-size:clamp(24px,2.2vw,31px)}
  .hero h1.display{font-size:clamp(28px,2.5vw,36px)}
  .hero p.lead{font-size:16px}
}
@media (min-width:1021px){
  .hero .btn-row,.page-hero .btn-row{flex-wrap:nowrap;gap:10px}
  .hero .btn,.page-hero .btn{min-height:44px;padding:9px 16px;font-size:16px}
  .hero-copy{gap:8px}
}
@media (max-width:1180px) and (min-width:1021px){
  .service-nav ul{flex-wrap:wrap}
  .hero .btn,.page-hero .btn{padding:9px 12px;font-size:15px}
}
/* narrower laptops: photo goes under the text, like tablets */
@media (max-width:1180px) and (min-width:1021px){
  .hero,.page-hero{display:flex;flex-direction:column}
  .hero .wrap,.page-hero .wrap{padding-right:24px;min-height:0}
  .hero .banner-media,.page-hero .banner-media{position:relative;right:auto;width:100%;height:220px;--slant:0px;clip-path:none;border-top:6px solid var(--red)}
  .banner-media .band{display:none}
  .banner-media .slides{left:0;clip-path:none}
}
@media (min-width:1021px){.service-nav ul{flex-wrap:wrap}}
@media (max-width:1360px) and (min-width:1181px){.service-nav a{padding:12px 8px;font-size:14px;letter-spacing:.02em}}
@media (min-width:1021px){.service-nav ul{max-width:none}}

/* =====================================================================
   2026-11 update: Poppins titles, blue-grey palette, icon strip
   ===================================================================== */
:root{
  --title:'Poppins','Montserrat',system-ui,sans-serif;
  /* blue-grey scale, from the stripe in the brand banner */
  --bg-100:#E6E9EF; --bg-200:#C9CFD9; --bg-300:#B1B8C5; --bg-400:#86909F;
  --bg-500:#6B7585; --bg-600:#566070; --bg-700:#454E5C; --bg-800:#363D49; --bg-900:#2A303A;
  --charcoal:var(--bg-700); --charcoal-2:var(--bg-600); --ink:#20242B; --graphite:var(--bg-600);
}
/* big bold titles */
.display,.content h2,.card h3,.step h3,.callout h3{font-family:var(--title);font-style:italic;font-weight:800;letter-spacing:-.01em;text-transform:uppercase}
.hero h1.display{font-size:clamp(28px,2.6vw,38px);line-height:1.05}
.page-hero h1.display{font-size:clamp(22px,2.1vw,30px);line-height:1.08}
.section-head .display,.split .copy .display{font-size:clamp(30px,3.4vw,44px);line-height:1.05}
.cta .display{font-size:clamp(32px,4vw,52px)}
.content h2{font-size:clamp(26px,2.6vw,34px);line-height:1.1}
.card h3{font-size:21px;line-height:1.1}
.step h3{font-size:22px}
.callout h3{font-size:24px}
.step .n{font-family:var(--title);font-weight:800}
/* banner eyebrow: dark, widely spaced like the brand banner */
.hero .eyebrow.on-dark,.page-hero .eyebrow.on-dark{color:var(--ink);font-family:var(--title);font-style:normal;font-weight:600;font-size:13px;letter-spacing:.32em}
.hero h1 .red,.page-hero h1 .red{color:var(--red)}

/* blue-grey bars */
.topbar{background:
    linear-gradient(100deg,transparent 0%,rgba(255,255,255,.07) 38%,rgba(255,255,255,.13) 50%,transparent 64%),
    linear-gradient(180deg,var(--bg-600) 0%,var(--bg-700) 50%,var(--bg-800) 100%)}
.service-nav{background:
    linear-gradient(100deg,transparent 0%,rgba(255,255,255,.06) 30%,rgba(255,255,255,.14) 46%,transparent 62%),
    linear-gradient(180deg,#7A8494 0%,var(--bg-600) 42%,var(--bg-700) 72%,var(--bg-800) 100%)}
.banner-media .band{background:
    linear-gradient(100deg,transparent 20%,rgba(255,255,255,.22) 55%,transparent 80%),
    linear-gradient(180deg,var(--bg-300) 0%,#9EA6B4 50%,var(--bg-400) 100%)}
.banner-media .slides{background:var(--bg-600)}
.site-footer{background:linear-gradient(180deg,var(--bg-700),var(--bg-900))}
.legal{border-top-color:#5C6676;color:#C9CFD9}
.social a{border-color:#6B7585}
.foot-grid p,.foot-grid li,.foot-grid a{color:#D3D8E0}
.cta .btn-dark{background:var(--bg-800)}
.cta .btn-dark:hover{background:var(--bg-900)}
.section.mist,.callout,.info{background:#EEF0F4}
.mist{--mist:#EEF0F4}

/* red strip with icons */
.strip{background:linear-gradient(180deg,#db1f26 0%,#db1f26 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.strip .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding-top:14px;padding-bottom:14px;font-family:var(--text);font-style:normal;font-weight:400;font-size:15px;text-transform:none;letter-spacing:0}
.strip .item{display:flex;align-items:center;gap:16px;padding:6px 22px;position:relative}
.strip .item+.item::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:1px;background:rgba(255,255,255,.4)}
.strip svg{flex:0 0 46px;width:46px;height:46px;color:#fff}
.strip .t{display:block;font-family:var(--display);font-style:italic;font-weight:800;font-size:24px;line-height:1.05;text-transform:uppercase;letter-spacing:.01em}
.strip .s{display:block;font-size:15px;line-height:1.3;color:#FFE6E7}
@media (max-width:1100px){.strip .wrap{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:6px}.strip .item:nth-child(3)::before{display:none}}
@media (max-width:560px){.strip .wrap{grid-template-columns:1fr}.strip .item::before{display:none}.strip .item{padding:6px 0}}
.strip .t{font-size:22px}.strip .item{padding:6px 18px;gap:14px}.strip svg{flex-basis:42px;width:42px;height:42px}

/* =====================================================================
   2026-11 update 2: exact brand red, HD swoosh, slanted photo edge,
   stripe grey from the brand file, top-aligned strip, SVG logo
   ===================================================================== */
:root{--red:#db1f26;--red-dark:#B3191F;--red-text:#db1f26;--red-on-dark:#ffffff}
/* every red stripe/tab/button uses the exact brand red */
.btn-red,.service-nav a[aria-current="page"],.service-nav a[aria-current="true"],.banner-media,.strip,.cta{background:#db1f26}
.btn-red:hover{background:#B3191F}
.banner-media{background:#db1f26}

/* banner background: high-res swoosh */
.hero,.page-hero{background:#F6F6F8 url(images/2026/banner-swoosh.jpg) left top/cover no-repeat}

/* photo: right edge on the same slant as the stripes */
@media (min-width:1181px){
  .banner-media,.banner-media .band,.banner-media .slides{
    clip-path:polygon(var(--slant) 0,100% 0,calc(100% - var(--slant)) 100%,0 100%)}
}
/* grey stripe colour from the brand file */
.banner-media .band{background:linear-gradient(180deg,#848D9C 0%,#6B7381 55%,#545A65 100%)}

/* red strip: icons and titles line up along the top */
.strip .item{align-items:flex-start}
.strip svg{margin-top:2px}

/* footer headings: white with a brand-red rule (red text is hard to read on grey) */
.foot-grid h2{color:#fff;padding-bottom:8px;border-bottom:3px solid #db1f26;display:inline-block}
.cta p{color:#FFE4E5}
.strip .s{color:#FFE4E5}
@media (min-width:1181px){.dots{right:calc(var(--slant) + 14px)}}
/* photo: bottom-right corner on the content's right edge, top-right corner
   one slant further out (photo starts at the same place as before) */
@media (min-width:1181px){
  .hero .banner-media,.page-hero .banner-media{
    right:calc(var(--edge) + 24px - var(--slant));
    width:calc(var(--box) * .62 - 24px + var(--slant))}
  .dots{right:calc(var(--slant) + 14px)}
}

/* ===== SEO update: home H1 line, related-services cards ===== */
.hero .home-h1{font-size:13px;letter-spacing:.16em;line-height:1.5;margin:0;max-width:600px}
.hero p.display.hero-title{margin:0;font-size:clamp(28px,2.6vw,38px);line-height:1.05}
@media (max-width:1180px){.hero p.display.hero-title{font-size:clamp(28px,5vw,40px)}}
.related{margin-top:48px}
.related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.related-grid a{display:flex;flex-direction:column;gap:4px;padding:20px 22px;background:#EEF0F4;border-top:4px solid #db1f26;text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s}
.related-grid a:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(40,46,58,.15);color:var(--ink)}
.related-grid strong{font-family:var(--title);font-style:italic;font-weight:800;font-size:19px;text-transform:uppercase}
.related-grid span{font-size:15px;color:var(--body)}

/* ===== compact content blocks (boxes, side-by-side, tags) ===== */
.content .box{background:#EEF0F4;padding:24px 26px;border-top:4px solid #db1f26}
.content .box>:first-child{margin-top:0}
.content .box>:last-child{margin-bottom:0}
.content .box h2{font-size:clamp(22px,2.1vw,27px);margin:0 0 10px}
.content .box h3{margin:16px 0 8px;padding:0;border:0;font-size:18px}
.content .box p{margin:0 0 10px}
.content .box ul{margin:0 0 4px}
.content .box li{margin:0 0 4px}
.content .box.muted{background:#F6F7F9;border-top-color:#86909F}
.content .box.accent{background:#2A303A;color:#fff;border-top-color:#db1f26}
.content .box.accent p,.content .box.accent li{color:#E2E6EC}
.content .box.accent h3{color:#fff}
.duo,.step-pair{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:20px;margin:0 0 32px}
.why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:16px;margin:0 0 36px}
.why-grid .box h3{margin-top:0;font-size:17px}
.why-grid .box p{font-size:15px;line-height:1.55}
.step-box{position:relative}
.step-num{display:inline-block;background:#db1f26;color:#fff;font-family:var(--title);font-style:italic;font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:.06em;padding:4px 12px;margin-bottom:6px;transform:skewX(-12deg)}
.content .box.step-box h3{margin-top:4px;font-size:20px}
.content ul.chips{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.content ul.chips li{margin:0;background:#fff;border:1px solid #D3D8E0;padding:5px 12px;font-size:15px;line-height:1.3}
.box.feature{margin:0 0 36px}
.intro-duo{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:28px;align-items:start;margin:0 0 32px}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.facts>div{background:#2A303A;color:#fff;padding:16px 16px;border-left:4px solid #db1f26;display:flex;flex-direction:column;gap:2px}
.facts strong{font-family:var(--title);font-style:italic;font-weight:800;font-size:22px;line-height:1.1}
.facts span{font-size:14px;color:#D3D8E0}
.facts a{color:#fff}
.gallery.tight{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:32px}
.box.visit{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;justify-content:space-between;margin:0 0 40px}
.box.visit>div:first-child{flex:1 1 420px}
.box.visit h3{margin-top:0}
@media (max-width:860px){.intro-duo{grid-template-columns:1fr}.gallery.tight{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:420px){.facts strong{font-size:19px}}
.faq-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:16px;margin:0 0 12px}
.faq-grid .box h3{margin:0 0 6px;font-size:17px}
.faq-grid .box p{font-size:15px;line-height:1.55}

/* catalogs right under the banner */
.content .callout.catalogs-top{margin:0 0 32px}
/* precision placement call-out */
.precision-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 32px;
  background:linear-gradient(110deg,#2A303A 0%,#363D49 60%,#454E5C 100%);color:#fff;padding:26px 30px;margin:0 0 32px;
  border-left:8px solid #db1f26;box-shadow:0 10px 26px rgba(30,34,42,.18)}
.precision-cta .pc-text{flex:1 1 460px;min-width:0}
.precision-cta .pc-tag{display:inline-block;background:#db1f26;color:#fff;font-family:var(--title);font-style:italic;font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.08em;padding:3px 10px;transform:skewX(-12deg);margin-bottom:8px}
.content .precision-cta h2{color:#fff;margin:0 0 6px;font-size:clamp(24px,2.4vw,32px)}
.content .precision-cta p{color:#D3D8E0;margin:0;font-size:16px}
.precision-cta .pc-btn{font-size:20px;padding:14px 30px;min-height:56px;box-shadow:0 6px 16px rgba(219,31,38,.4)}
.precision-cta .pc-btn:hover{transform:translateY(-1px)}
.content .precision-cta ul.pc-points{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-wrap:wrap;gap:8px 20px}
.content .precision-cta ul.pc-points li{margin:0;color:#fff;font-weight:600;font-size:15px;padding-left:22px;position:relative}
.content .precision-cta ul.pc-points li::before{content:"";position:absolute;left:0;top:5px;width:12px;height:7px;border-left:3px solid #db1f26;border-bottom:3px solid #db1f26;transform:rotate(-45deg)}
.content .intro-duo h2{margin-top:0}
.why-grid.five{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
/* page summary strip (under inner-page banners) */
.page-strip .wrap{padding-top:12px;padding-bottom:12px}
.page-strip svg{flex-basis:40px;width:40px;height:40px}
.page-strip .t{font-size:20px}
.page-strip .s{font-size:14px}
.callout .btn-red span[aria-hidden]{margin-left:4px;transition:transform .15s}
.callout .btn-red:hover span[aria-hidden]{transform:translateX(3px)}
.callout p strong{color:var(--ink)}
@media (max-width:560px){.callout .btn-row{width:100%}.callout .btn-row .btn{flex:1 1 100%;white-space:nowrap}}
.box.fonts-box{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;margin:0 0 36px}
.box.fonts-box>div:first-child{flex:1 1 460px;min-width:0}
.content .box.fonts-box h2{margin-top:0}
.box.fonts-box .btn{font-size:19px;min-height:52px;padding:12px 26px}
@media (max-width:560px){.box.fonts-box .btn-row,.box.fonts-box .btn{width:100%}}

/* ===== embroidery fonts page ===== */
.steps-mini{margin:0 0 16px;padding-left:20px}
.steps-mini li{margin:0 0 4px}
.font-tools{position:sticky;top:0;z-index:10;background:#fff;padding:14px 0 12px;margin:0 0 8px;border-bottom:1px solid #DCDDE1}
.font-tools label{display:block;font-weight:600;font-size:15px;margin-bottom:6px}
.font-tools input{width:100%;max-width:520px;min-height:46px;padding:10px 14px;font:inherit;font-size:16px;border:2px solid #86909F;background:#fff;color:var(--ink)}
.font-tools input:focus{outline:none;border-color:#db1f26}
.font-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.font-chip{min-height:38px;padding:6px 14px;border:1px solid #C9CFD9;background:#EEF0F4;color:var(--ink);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.font-chip span{color:#6B7585;font-weight:500;margin-left:2px}
.font-chip:hover{border-color:#86909F}
.font-chip[aria-pressed="true"]{background:#db1f26;border-color:#db1f26;color:#fff}
.font-chip[aria-pressed="true"] span{color:#FFE4E5}
.font-empty{margin:12px 0 0}
.font-section{margin:0 0 8px;scroll-margin-top:200px}
.content .font-section h2{margin:36px 0 6px}
.font-count{font-family:var(--text);font-style:normal;font-weight:600;font-size:15px;color:#6B7585;margin-left:6px;vertical-align:middle;text-transform:none}
.content .font-note{margin:0 0 14px;color:var(--body)}
.font-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:14px}
.font-card{margin:0;background:#fff;border:1px solid #DCDDE1;display:flex;flex-direction:column}
.font-card .font-img{padding:12px;display:flex;align-items:center;justify-content:center;min-height:110px;background:#fff}
.font-card img{max-height:120px;width:auto;max-width:100%;object-fit:contain}
.font-card figcaption{border-top:3px solid #db1f26;background:#EEF0F4;padding:10px 14px;display:flex;flex-direction:column;gap:2px}
.font-card strong{font-size:16px}
.font-card span{font-size:13px;color:var(--body)}
@media (max-width:760px){.font-tools{top:0}}
[hidden]{display:none!important}

/* ===== thread colors page ===== */
.thread-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}
.thread.font-card{border:1px solid #DCDDE1;background:#fff;display:flex;flex-direction:column}
.thread .sw{display:block;height:64px;border-bottom:3px solid #db1f26}
.thread .sw-img{background-size:cover;background-position:center}
.thread .tnum{font-family:var(--title);font-style:italic;font-weight:800;font-size:17px;padding:6px 10px 2px}
.thread em{font-style:normal;font-size:12px;color:var(--body);padding:0 10px 6px;line-height:1.3}
.thread .tnum:last-child{padding-bottom:8px}
.box.fonts-box .btn-row.stack{display:flex;flex-direction:column;gap:10px;align-items:stretch}
@media (max-width:420px){.thread-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.callout .btn-row .btn{white-space:normal}}


/* inner-page summary strip: grey instead of red (home keeps red) */
.strip.page-strip{background:linear-gradient(180deg,#5A6372 0%,#454E5C 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.strip.page-strip .s{color:#D3D8E0}
.strip.page-strip svg{color:#fff}
.strip.page-strip .item+.item::before{background:rgba(255,255,255,.22)}
/* inner-page strip sits inside the content width, not full screen */
.strip.page-strip{background:none;box-shadow:none;padding:0 24px}
.strip.page-strip .wrap{max-width:calc(var(--wrap) - 48px);padding:12px 8px;background:linear-gradient(180deg,#5A6372 0%,#454E5C 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
@media (max-width:560px){.strip.page-strip{padding:0 16px}.strip.page-strip .wrap{padding:10px 14px}}

/* combined catalogs + colors/fonts box */
.plan-box{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);background:#EEF0F4;border-top:6px solid var(--ink);margin:0 0 32px}
.plan-col{padding:26px 30px}
.plan-col+.plan-col{border-left:1px solid #D3D8E0}
.content .plan-col h2{margin:0 0 8px;font-size:clamp(22px,2vw,26px)}
.content .plan-col p{margin:0 0 16px;color:var(--body)}
.plan-col p strong{color:var(--ink)}
.plan-col .btn-row{margin:0;gap:10px}
.plan-col .btn span[aria-hidden]{margin-left:4px}
@media (max-width:980px){.plan-box{grid-template-columns:1fr}.plan-col+.plan-col{border-left:0;border-top:1px solid #D3D8E0}}
@media (max-width:560px){.plan-col{padding:22px 18px}.plan-col .btn-row .btn{flex:1 1 100%;white-space:normal}}
.plan-col .btn{padding:12px 20px}

/* embroidery page order update */
.content .intro{margin:0 0 32px}
.content .intro p{font-size:18px;line-height:1.65}
.content .intro p:last-child{margin-bottom:0}
.content h2.plan-title{margin:44px 0 8px}
.content .plan-steps{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 0 16px;font-weight:600;color:var(--ink)}
.plan-steps span{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;background:#db1f26;color:#fff;font-family:var(--title);font-style:italic;font-weight:800;font-size:14px;border-radius:50%;margin-left:6px}
.plan-steps span:first-child{margin-left:0}

/* Plan your order: its own panel */
.plan-panel{margin:44px 0 32px;border:2px solid #454E5C;background:#fff;box-shadow:0 10px 26px rgba(30,34,42,.10)}
.plan-head{background:linear-gradient(180deg,#5A6372 0%,#454E5C 100%);padding:20px 30px 18px;border-bottom:4px solid #db1f26}
.content .plan-head h2.plan-title{color:#fff;margin:0 0 10px}
.content .plan-head .plan-steps{color:#fff;margin:0}
.plan-panel .plan-box{background:#fff;border-top:0;margin:0}
.plan-panel .plan-col+.plan-col{border-left-color:#DCDDE1}
@media (max-width:980px){.plan-panel .plan-col+.plan-col{border-top-color:#DCDDE1}}
@media (max-width:560px){.plan-head{padding:18px}}
/* bigger "why choose us over other shops" tag */
.precision-cta .pc-tag{font-size:18px;padding:6px 16px;margin-bottom:12px;letter-spacing:.06em}
@media (max-width:560px){.precision-cta .pc-tag{font-size:15px}}
/* customize panel: three equal columns, buttons aligned at the bottom */
.content .plan-head .plan-sub{color:#E2E6EC;margin:0;font-size:17px}
.plan-box.three{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr)}
.plan-box .plan-col{display:flex;flex-direction:column}
.content .plan-col h3{margin:0 0 8px;padding:0;border:0;font-family:var(--title);font-style:italic;font-weight:800;font-size:21px;text-transform:uppercase}
.plan-col p{flex-grow:1}
.plan-col .btn-row{margin-top:auto}
@media (max-width:1100px){.plan-box.three{grid-template-columns:1fr 1fr}.plan-box.three .plan-col:first-child{grid-column:1/-1;border-bottom:1px solid #DCDDE1}.plan-box.three .plan-col:nth-child(2){border-left:0}}
@media (max-width:640px){.plan-box.three{grid-template-columns:1fr}.plan-box.three .plan-col+.plan-col{border-left:0;border-top:1px solid #DCDDE1}}

/* personalized gifts catalog */
.gift-tabs{margin-bottom:22px}
.gift-group{border:2px solid #454E5C;background:#fff;margin:0 0 26px;box-shadow:0 6px 18px rgba(42,48,58,.08)}
.gift-group-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:0;text-decoration:none;color:inherit;border-bottom:4px solid #db1f26}
.gift-group-imgs{display:grid;grid-template-columns:repeat(2,1fr);background:#fff;border-right:1px solid #DCDDE1}
.gift-group-imgs img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;padding:10px;border:0;border-right:1px solid #EEF0F4;border-bottom:1px solid #EEF0F4}
.gift-group-text{background:linear-gradient(180deg,#5A6372,#454E5C);color:#fff;padding:26px 30px;display:flex;flex-direction:column;justify-content:center;gap:10px}
.content .gift-group-text h2{color:#fff;margin:0;padding:0;border:0;font-family:var(--title);font-style:italic;font-weight:800;text-transform:uppercase;font-size:30px}
.gift-group-text p{color:#E2E6EC;margin:0;font-size:17px}
.gift-group-text .btn{align-self:flex-start;margin-top:6px}
.gift-group-head:hover .btn{background:#B3191F}
.gift-subs{list-style:none;margin:0;padding:18px 22px 20px;display:flex;flex-wrap:wrap;gap:8px}
.gift-subs li{margin:0;padding:0}
.gift-subs li::before{display:none}
.gift-subs a{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:7px 14px;background:#EEF0F4;border:1px solid #C9CFD9;color:var(--ink);font-weight:600;font-size:15px;text-decoration:none}
.gift-subs a span{color:#6B7585;font-weight:500}
.gift-subs a:hover{background:#db1f26;border-color:#db1f26;color:#fff}
.gift-subs a:hover span{color:#FFE4E5}
.gift-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:14px}
.gift-card .gift-img{background:#fff;padding:8px;display:flex;align-items:center;justify-content:center}
.font-card.gift-card img{width:100%;height:auto;max-height:none;aspect-ratio:1;object-fit:contain}
.font-card.gift-card figcaption{flex-grow:1}
.font-card.gift-card strong{font-size:15px;line-height:1.3}
.font-card.gift-card .gift-part{font-weight:700;color:#363D49;font-size:14px;margin-top:2px}
@media (max-width:860px){.gift-group-head{grid-template-columns:1fr}.gift-group-imgs{grid-template-columns:repeat(4,1fr);border-right:0}}
@media (max-width:760px){.gift-tools .font-chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch}.gift-tools .font-chip{flex:0 0 auto}.gift-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.content .gift-group-text h2{font-size:24px}.gift-group-text{padding:20px}}
@media (max-width:760px){.gift-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;padding-bottom:6px;-webkit-overflow-scrolling:touch}.gift-tabs a{flex:0 0 auto;white-space:nowrap}}
/* other engraving catalogs page */
.flip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:8px 0 30px}
.flip-card{display:flex;flex-direction:column;border:2px solid #454E5C;background:#fff;text-decoration:none;color:inherit;box-shadow:0 6px 18px rgba(42,48,58,.08);border-bottom:4px solid #db1f26}
.flip-cover{background:#EEF0F4;padding:18px 18px 0;display:flex;justify-content:center}
.flip-cover img{width:100%;max-width:300px;height:auto;box-shadow:0 8px 20px rgba(42,48,58,.25);border:0}
.flip-text{padding:18px 20px 22px;display:flex;flex-direction:column;gap:8px;flex-grow:1}
.content .flip-text h2{margin:0;padding:0;border:0;font-family:var(--title);font-style:italic;font-weight:800;text-transform:uppercase;font-size:23px}
.flip-text p{margin:0;flex-grow:1}
.flip-text .btn{align-self:flex-start;margin-top:6px}
.flip-card:hover .btn{background:#B3191F}
.flip-card:hover{border-color:#363D49}
@media (max-width:900px){.flip-grid{grid-template-columns:1fr}.flip-card{flex-direction:row}.flip-cover{padding:14px;width:38%;flex:0 0 38%}}
@media (max-width:480px){.flip-card{flex-direction:column}.flip-cover{width:auto}}
/* flipbook viewer pages */
.flip-bar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin:0 0 18px}
.flip-bar .tabs{margin:0}
.flip-back{font-weight:700;text-decoration:none;color:var(--ink);white-space:nowrap}
.flip-back:hover{color:#db1f26}
.embed.flipbook iframe{height:min(82vh,900px);min-height:520px}
.flip-note{font-size:15px;color:#5A6372}

/* ===== engraving catalogs bar: a second row styled like the main menu ===== */
.sub-nav{background:
    linear-gradient(100deg,transparent 0%,rgba(255,255,255,.05) 30%,rgba(255,255,255,.10) 46%,transparent 62%),
    linear-gradient(180deg,var(--bg-700) 0%,var(--bg-800) 100%);
  border-bottom:4px solid var(--red);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.sub-nav ul{list-style:none;margin:0 auto;padding:0 24px;display:flex;justify-content:center;flex-wrap:wrap}
.sub-nav li{position:relative;display:flex;margin:0;padding:0}
.sub-nav li::before{display:none}
.sub-nav li+li::before{display:block;content:"";position:absolute;left:-1px;top:8px;bottom:8px;width:2px;
  background:linear-gradient(90deg,rgba(0,0,0,.35) 0 1px,rgba(255,255,255,.28) 1px 2px);transform:skewX(-12deg);pointer-events:none}
.sub-nav li:has(a[aria-current])::before,.sub-nav li:has(a[aria-current])+li::before{opacity:0}
.sub-nav a{display:block;padding:10px 16px;color:#fff;text-decoration:none;font-family:var(--display);font-weight:700;font-size:15px;
  text-transform:uppercase;letter-spacing:.05em;text-shadow:0 1px 1px rgba(0,0,0,.35);transform:skewX(-12deg);white-space:nowrap}
.sub-nav a>span{display:inline-block;transform:skewX(12deg)}
.sub-nav a:hover{background:rgba(255,255,255,.1);color:#fff}
.sub-nav a[aria-current]{background:#db1f26;color:#fff;text-shadow:none;box-shadow:0 4px 10px rgba(219,31,38,.35)}
@media (max-width:1020px){
  .sub-nav ul{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:0 12px}
  .sub-nav li{flex:0 0 auto}
  .sub-nav a{transform:none;padding:10px 12px;font-size:14px;letter-spacing:.03em}
  .sub-nav a>span{transform:none}
}
/* engraving page: products we offer */
.offer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:6px 0 28px}
.offer-box{background:#fff;border:1px solid #DCDDE1;border-top:4px solid #db1f26;padding:18px 20px 16px;box-shadow:0 4px 14px rgba(42,48,58,.06)}
.content .offer-box h3{margin:0 0 10px;padding:0;border:0;font-family:var(--title);font-style:italic;font-weight:800;font-size:19px;text-transform:uppercase;line-height:1.2}
.content .offer-box ul{margin:0;padding:0;list-style:none}
.content .offer-box li{position:relative;margin:0;padding:5px 0 5px 20px;border-top:1px solid #EEF0F4;font-size:16px;line-height:1.4}
.content .offer-box li:first-child{border-top:0}
.content .offer-box li::before{content:"";position:absolute;left:2px;top:12px;width:8px;height:8px;background:#db1f26;transform:skewX(-12deg);border-radius:0}
.offer-ask{background:linear-gradient(180deg,#5A6372,#454E5C);border-color:#454E5C;color:#fff;display:flex;flex-direction:column}
.content .offer-ask h3{color:#fff}
.offer-ask p{color:#E2E6EC;margin:0 0 14px;flex-grow:1}
.offer-ask .btn-row{margin-top:auto}
@media (max-width:1000px){.offer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.offer-grid{grid-template-columns:1fr}}

/* ===== sub-button bar shaped like the banner: slanted ends that continue the photo's edge ===== */
@media (min-width:1181px){
  .sub-nav{--box:min(100%, var(--wrap));--edge:calc((100% - var(--box)) / 2);--slant:80px;--cut:18px;
    position:relative;background:#F4F5F7;border-bottom:0;box-shadow:none}
  .sub-nav::before{content:"";position:absolute;inset:0;z-index:0;
    background:
      linear-gradient(100deg,transparent 0%,rgba(255,255,255,.05) 30%,rgba(255,255,255,.10) 46%,transparent 62%),
      linear-gradient(180deg,var(--bg-700) 0%,var(--bg-800) 100%);
    clip-path:polygon(
      calc(var(--edge) + 24px - var(--slant) - var(--cut)) 0,
      calc(100% - var(--edge) - 24px + var(--slant) + var(--cut)) 0,
      calc(100% - var(--edge) - 24px + var(--slant)) 100%,
      calc(var(--edge) + 24px - var(--slant)) 100%)}
  .sub-nav ul{position:relative;z-index:1}
}

/* sub-button bar: bottom-left corner on the content's left edge, red line along the bottom */
@media (min-width:1181px){
  .sub-nav::before{background:#db1f26;
    clip-path:polygon(
      calc(var(--edge) + 24px - var(--cut)) 0,
      calc(100% - var(--edge) - 24px + var(--slant) + var(--cut)) 0,
      calc(100% - var(--edge) - 24px + var(--slant)) 100%,
      calc(var(--edge) + 24px) 100%)}
  .sub-nav::after{content:"";position:absolute;inset:0;z-index:0;
    background:
      linear-gradient(100deg,transparent 0%,rgba(255,255,255,.05) 30%,rgba(255,255,255,.10) 46%,transparent 62%),
      linear-gradient(180deg,var(--bg-700) 0%,var(--bg-800) 100%);
    clip-path:polygon(
      calc(var(--edge) + 24px - var(--cut)) 0,
      calc(100% - var(--edge) - 24px + var(--slant) + var(--cut)) 0,
      calc(100% - var(--edge) - 24px + var(--slant) + var(--cut) * 4 / 44) calc(100% - 4px),
      calc(var(--edge) + 24px - var(--cut) * 4 / 44) calc(100% - 4px))}
}
/* product boxes with photos: photo on top, red line, then the list */
.offer-box{padding:0;border-top:0;display:flex;flex-direction:column;overflow:hidden}
.offer-box .offer-img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border:0;border-bottom:4px solid #db1f26;margin:0}
.offer-body{padding:18px 20px 16px;display:flex;flex-direction:column;flex-grow:1}
.offer-ask{padding:0}
.offer-ask .offer-body p{flex-grow:1}
/* engraving page: catalogs box with the catalog covers picture beside it */
.callout.callout-covers{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:28px;align-items:center}
.callout-covers .cc-text{display:flex;flex-direction:column;gap:6px;min-width:0}
.callout-covers .cc-text h3{margin:0}
.callout-covers .cc-text p{margin:0 0 10px}
.callout-covers .btn-row{flex-wrap:wrap;gap:10px}
.callout-covers .btn{white-space:normal}
.cc-covers{position:relative;min-width:0}
.cc-covers img{display:block;width:100%;height:auto;border:0;box-shadow:0 6px 18px rgba(42,48,58,.18)}
.cc-spot{position:absolute;top:12%;height:77%;width:18.6%;transition:transform .15s,box-shadow .15s}
.cc-spot:hover,.cc-spot:focus-visible{transform:translateY(-4px);box-shadow:0 0 0 3px #db1f26}
@media (max-width:1000px){.callout.callout-covers{grid-template-columns:1fr}.cc-covers{order:-1}}
@media (max-width:640px){.callout-covers .btn-row{flex-direction:column;align-items:stretch}.callout-covers .btn{white-space:nowrap;font-size:15px;padding:11px 12px;justify-content:center}}
/* catalogs box v2: photo fills the right half edge to edge, compact text on the left */
.callout.callout-covers{padding:0;gap:0;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:stretch;overflow:hidden}
.callout-covers .cc-text{padding:24px 28px;justify-content:center;gap:4px}
.callout-covers .cc-text p{margin:0 0 12px;font-size:16px}
.callout-covers .btn-row{flex-direction:column;align-items:flex-start;gap:8px}
.callout-covers .btn{min-height:40px;padding:8px 16px;font-size:15px;white-space:nowrap}
.cc-covers{display:flex;align-items:center;background:#5A3A24}
.cc-frame{position:relative;width:100%;aspect-ratio:2/1}
.cc-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;box-shadow:none}
.cc-spot{top:18.5%;height:58%;width:18.6%}
@media (max-width:1000px){.callout.callout-covers{grid-template-columns:1fr}.cc-covers{order:-1}.callout-covers .cc-text{padding:20px}}
@media (max-width:640px){.callout-covers .btn-row{align-items:stretch}.callout-covers .btn{justify-content:center}}
@media (min-width:1001px){.cc-covers{align items:stretch;align-items:stretch}.cc-frame{height:100%;min-height:100%}}
.callout-covers .btn-row{flex-wrap:nowrap}
.callout-covers .btn{flex:0 0 auto}
@media (max-width:640px){.callout-covers .btn{width:100%;white-space:nowrap;font-size:15px;padding:10px 12px}}
/* catalogs box v3: shorter, photo cropped to the books, three equal buttons in a row */
.callout.callout-covers{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.callout-covers .cc-text{padding:22px 26px;gap:6px}
.callout-covers .cc-text p{margin:0 0 10px;font-size:15.5px;line-height:1.55}
.cc-btns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.cc-btns .btn{width:100%;min-height:42px;padding:8px 6px;font-size:15px;white-space:nowrap;justify-content:center;text-align:center}
.cc-frame img{object-position:50% 47%}
.cc-spot{top:0;height:100%}
@media (min-width:1001px){.cc-frame{aspect-ratio:auto;height:100%;min-height:200px}}
@media (max-width:1000px){.cc-frame{aspect-ratio:2.6/1}}
@media (max-width:480px){.cc-btns{grid-template-columns:1fr}.cc-btns .btn{min-height:44px}}
.cc-btns .btn{font-size:14px;letter-spacing:.02em;padding:8px 4px;gap:6px}
@media (max-width:1000px){.callout.callout-covers{grid-template-columns:1fr}.cc-frame{height:auto;min-height:0}}
@media (min-width:1001px){.callout.callout-covers{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}.cc-btns{gap:6px}}
/* when the banner photo goes full width (smaller screens), the grey summary strip goes full width too */
@media (max-width:1180px){
  .strip.page-strip{padding:0}
  .strip.page-strip .wrap{max-width:none;padding:12px 24px}
}
@media (max-width:560px){.strip.page-strip .wrap{padding:10px 16px}}
/* product boxes without photos (printing page) */
.offer-box.offer-noimg{border-top:4px solid #db1f26}
.offer-intro{max-width:none;margin:0 0 16px}
.offer-lead{margin:0 0 8px;font-size:15px;color:var(--body)}
.offer-custom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;margin:0 0 32px;padding:22px 26px;
  background:linear-gradient(180deg,#5A6372,#454E5C);color:#fff;border-top:4px solid #db1f26}
.content .offer-custom h3{color:#fff;margin:0 0 6px;padding:0;border:0;font-family:var(--title);font-style:italic;font-weight:800;font-size:21px;text-transform:uppercase}
.offer-custom>div:first-child{flex:1 1 520px;min-width:0}
.offer-custom p{color:#E2E6EC;margin:0 0 6px}
.offer-custom .offer-fine{font-size:14px;color:#C3CAD4;margin:0}
.btn-outline-light{border:2px solid #fff;color:#fff;background:transparent}
.btn-outline-light:hover{background:#fff;color:#363D49}
.offer-ask .offer-fine{font-size:13.5px;color:#C3CAD4;margin:0 0 14px}
.offer-ask.offer-box{border-top:4px solid #db1f26}
.offer-wide{margin:0 0 32px}
.content .offer-box ul.offer-cols{columns:3;column-gap:28px}
.content .offer-cols li{break-inside:avoid}
.content .offer-cols li:first-child{border-top:1px solid #EEF0F4}
@media (max-width:1000px){.content .offer-box ul.offer-cols{columns:2}}
@media (max-width:640px){.content .offer-box ul.offer-cols{columns:1}}
/* printing page: sit down with a designer */
.designer{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:0;margin:8px 0 36px;border:2px solid #454E5C;background:#fff;box-shadow:0 6px 18px rgba(42,48,58,.08)}
.designer-text{padding:28px 32px;border-top:4px solid #db1f26}
.content .designer-text h2{margin:10px 0 10px;font-size:clamp(24px,2.4vw,32px);line-height:1.1}
.designer-q{font-weight:700;color:var(--ink);font-size:18px;margin:0 0 10px}
.designer-text p{margin:0 0 10px}
.designer-close{font-weight:600;color:var(--ink)}
.designer-text .btn-row{margin-top:16px}
.content .designer-points{list-style:none;margin:0;padding:22px 28px;background:linear-gradient(180deg,#5A6372,#454E5C);border-top:4px solid #db1f26;display:flex;flex-direction:column;justify-content:center;gap:4px}
.content .designer-points li{position:relative;margin:0;padding:12px 0 12px 40px;border-top:1px solid rgba(255,255,255,.16);color:#E2E6EC;line-height:1.45}
.content .designer-points li:first-child{border-top:0}
.content .designer-points li::before{content:"";position:absolute;left:0;top:14px;width:24px;height:24px;background:#db1f26 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/16px no-repeat;transform:skewX(-8deg);border-radius:0}
.designer-points strong{display:block;color:#fff;font-family:var(--title);font-style:italic;font-weight:800;text-transform:uppercase;font-size:17px;letter-spacing:.01em;margin-bottom:2px}
@media (max-width:1000px){.designer{grid-template-columns:1fr}.designer-text{padding:24px 22px}.content .designer-points{padding:18px 22px}}
.designer .pc-tag{display:inline-block;background:#db1f26;color:#fff;font-family:var(--title);font-style:italic;font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:.06em;padding:4px 12px;transform:skewX(-12deg)}
/* ===== SanMar apparel catalog ===== */
.ap-search-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:12px;align-items:end}
.ap-search-row label{display:block}
.ap-search-row select{width:100%;min-height:46px;padding:8px 12px;border:2px solid #C9CFD9;background:#fff;font:inherit;font-size:16px;color:var(--ink)}
.ap-count{margin:6px 0 0;font-size:14px;color:#5A6372}
.ap-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:14px;margin:6px 0 32px}
.ap-card{margin:0;background:#fff;border:1px solid #DCDDE1;display:flex;flex-direction:column;box-shadow:0 3px 10px rgba(42,48,58,.05)}
.ap-img{background:#fff;padding:8px;display:flex;justify-content:center;border-bottom:3px solid #db1f26}
.ap-img img{width:100%;max-width:240px;height:auto;aspect-ratio:300/343;object-fit:contain;border:0}
.ap-card figcaption{padding:10px 12px 12px;display:flex;flex-direction:column;gap:3px;flex-grow:1;font-size:14px;line-height:1.35}
.ap-brand{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:13px;color:#db1f26}
.ap-card strong{font-size:15px;color:var(--ink);line-height:1.3}
.ap-sizes{color:#5A6372;font-size:13px}
.ap-color{color:#5A6372;font-size:13px;margin-top:2px}
.ap-color em{font-style:normal;color:var(--ink);font-weight:600}
.ap-sws{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.ap-sw{width:22px;height:22px;padding:2px;border:1px solid #C9CFD9;background:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.ap-sw img{width:16px;height:16px;display:block;border:0}
.ap-sw[aria-pressed="true"],.ap-sw:hover{border-color:#db1f26;box-shadow:0 0 0 1px #db1f26}
.ap-more{border:0;background:none;color:#db1f26;font-weight:700;font-size:13px;cursor:pointer;padding:2px 4px}
.ap-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:14px;margin:0 0 30px}
.ap-tile{display:flex;flex-direction:column;background:#fff;border:1px solid #DCDDE1;text-decoration:none;color:inherit;box-shadow:0 3px 10px rgba(42,48,58,.06);transition:transform .15s,box-shadow .15s}
.ap-tile:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(42,48,58,.15)}
.ap-tile-img{padding:10px;display:flex;justify-content:center;background:#fff}
.ap-tile-img img{width:100%;max-width:200px;height:auto;aspect-ratio:300/343;object-fit:contain;border:0}
.ap-tile-text{background:linear-gradient(180deg,#5A6372,#454E5C);border-top:4px solid #db1f26;padding:12px 14px;color:#fff}
.content .ap-tile-text h2{margin:0;padding:0;border:0;color:#fff;font-family:var(--title);font-style:italic;font-weight:800;text-transform:uppercase;font-size:19px;line-height:1.15}
.ap-tile-text span{color:#E2E6EC;font-size:14px}
.ap-brands p{color:var(--body)}
@media (max-width:640px){.ap-search-row{grid-template-columns:1fr}.ap-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.ap-card figcaption{padding:8px}.ap-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ap-img img,.ap-tile-img img{aspect-ratio:2/3}
/* ===== Apparel: site-wide search, card links, style pages ===== */
.ap-find{position:relative;margin:0 0 18px;padding:16px 18px;background:#F2F3F5;border:1px solid #DCDDE1;border-left:6px solid #db1f26}
.ap-find label{display:block;font-family:var(--display);font-weight:700;font-size:19px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink);margin:0 0 6px}
.ap-find-row{display:flex;gap:10px}
.ap-find-row input{flex:1;min-width:0;min-height:48px;padding:10px 14px;border:2px solid #C9CFD9;background:#fff;font:inherit;font-size:17px;color:var(--ink)}
.ap-find-row input:focus{outline:none;border-color:#db1f26}
.ap-find-row .btn{min-height:48px;padding:10px 22px;flex:0 0 auto}
.ap-find-res{margin-top:12px}
.ap-find-res .ap-find-count{margin:0 0 8px;font-size:14px;color:#5A6372}
.ap-find-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:8px}
.ap-hit{display:grid;grid-template-columns:54px minmax(0,1fr);gap:10px;align-items:center;padding:6px 10px 6px 6px;background:#fff;border:1px solid #DCDDE1;text-decoration:none;color:inherit;line-height:1.25}
.ap-hit:hover,.ap-hit:focus-visible{border-color:#db1f26;box-shadow:0 0 0 1px #db1f26}
.ap-hit img{width:54px;height:72px;object-fit:contain;border:0;background:#fff}
.ap-hit b{display:block;font-family:var(--display);font-size:18px;letter-spacing:.02em;color:#db1f26}
.ap-hit span{display:block;font-size:13px;color:#5A6372}
.ap-hit span.t{color:var(--ink);font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ap-find-more{margin-top:10px;border:2px solid var(--ink);background:#fff;font-family:var(--display);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.05em;padding:8px 18px;cursor:pointer}
.ap-find-more:hover{background:var(--ink);color:#fff}
.ap-card a.ap-img{text-decoration:none}
.ap-card .ap-title{text-decoration:none;color:inherit}
.ap-card .ap-title:hover strong{color:#db1f26;text-decoration:underline}
.ap-msrp{font-weight:700;color:var(--ink);font-size:14px}
.ap-details{margin-top:auto;padding-top:8px;font-family:var(--display);font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.04em;color:#db1f26;text-decoration:none}
.ap-details:hover{text-decoration:underline}
.page-hero.ap-hero .wrap{padding-top:22px;padding-bottom:22px}
.page-hero.ap-hero h1.display{font-size:clamp(26px,3vw,40px);max-width:1100px}
.ap-h1-st{color:#db1f26;white-space:nowrap}
.ap-pdp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start;margin:8px 0 30px}
.ap-gallery{display:flex;flex-direction:column;gap:10px}
.ap-main{background:#fff;border:1px solid #DCDDE1;border-bottom:4px solid #db1f26;padding:10px;display:flex;justify-content:center}
.ap-main img{width:100%;max-width:470px;height:auto;aspect-ratio:2/3;object-fit:contain;border:0}
.ap-views{display:flex;gap:6px}
.ap-views button{flex:0 0 auto;min-height:38px;padding:6px 16px;border:2px solid #C9CFD9;background:#fff;font-family:var(--display);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;color:var(--ink)}
.ap-views button[aria-pressed="true"]{border-color:var(--ink);background:var(--ink);color:#fff}
.ap-cur{margin:0;font-size:16px}
.ap-cur span{color:#5A6372}
.ap-pdp-sws{display:grid;grid-template-columns:repeat(auto-fill,minmax(36px,1fr));gap:5px}
.ap-pdp-sws .ap-sw{width:100%;height:auto;aspect-ratio:1;padding:3px}
.ap-pdp-sws .ap-sw img{width:100%;height:100%}
.ap-info{display:flex;flex-direction:column;gap:10px;min-width:0}
.ap-info .ap-brand{font-size:16px}
.ap-style{margin:0;font-family:var(--display);font-weight:800;font-size:24px;letter-spacing:.02em;color:#db1f26}
.content .ap-info h2{margin:0;padding:0;border:0;font-size:clamp(24px,2.4vw,30px);line-height:1.15}
.ap-price{border:1px solid #DCDDE1;background:#F7F8F9;padding:12px 14px}
.ap-price-h{margin:0 0 6px;font-family:var(--display);font-weight:800;font-size:22px;text-transform:uppercase;letter-spacing:.03em;color:var(--ink)}
.ap-price-h span{font-size:15px;font-weight:600;color:#5A6372;letter-spacing:.04em}
.ap-price dl{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.ap-price dl div{display:flex;flex-direction:column;align-items:center;min-width:78px;padding:6px 10px;background:#fff;border:1px solid #DCDDE1}
.ap-price dt{font-size:13px;font-weight:700;color:#5A6372;text-transform:uppercase}
.ap-price dd{margin:0;font-weight:700;font-size:16px;color:var(--ink);white-space:nowrap}
.ap-price-note{margin:8px 0 0;font-size:13px;line-height:1.45;color:#5A6372}
.ap-feat{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:3px;font-size:16px;line-height:1.45}
.ap-note{margin:0;font-size:15px;color:var(--body);background:#FFF6E5;border-left:4px solid #E5A000;padding:8px 12px}
.ap-sizes-l{margin:0}
.ap-links{margin:0;font-weight:700}
.ap-links a{color:#db1f26}
.ap-spec{margin:0 0 30px;padding:20px;border:1px solid #DCDDE1;background:#fff;scroll-margin-top:90px}
.content .ap-spec h2{margin-top:0}
.ap-spec-sub{margin:-4px 0 14px;color:#5A6372;font-size:15px}
.ap-tbls{display:flex;flex-direction:column;gap:16px}
.content .ap-tbl h3{margin:0 0 6px;font-size:19px}
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.ap-tbl table{border-collapse:collapse;font-size:15px;min-width:100%}
.ap-tbl th,.ap-tbl td{border:1px solid #DCDDE1;padding:7px 10px;text-align:center;white-space:nowrap}
.ap-tbl thead th{background:var(--ink);color:#fff;font-weight:700}
.ap-tbl tbody th{text-align:left;background:#F2F3F5;font-weight:600}
.ap-md{margin:14px 0 0;padding-left:20px;font-size:14px;color:var(--body)}
.content .ap-care h3{margin:16px 0 4px;font-size:19px}
.ap-care p{margin:0;font-size:15px}
.ap-spec-note{margin:12px 0 0;font-size:13px;color:#5A6372}
.ap-comp{margin:0 0 30px}
.ap-minis{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),1fr));gap:12px}
.ap-mini{display:flex;flex-direction:column;gap:2px;padding:8px 10px 10px;background:#fff;border:1px solid #DCDDE1;text-decoration:none;color:inherit;font-size:14px;line-height:1.3}
.ap-mini:hover{border-color:#db1f26;box-shadow:0 0 0 1px #db1f26}
.ap-mini img{width:100%;height:auto;aspect-ratio:2/3;object-fit:contain;border:0;margin-bottom:4px}
.ap-mini strong{color:var(--ink)}
.ap-loading{padding:60px 0;text-align:center;color:#5A6372}
@media (max-width:860px){.ap-pdp{grid-template-columns:1fr;gap:20px}.ap-main img{max-width:360px}}
@media (max-width:640px){.ap-find{padding:12px}.ap-find-row .btn{padding:10px 14px}.ap-spec{padding:14px}.ap-minis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.page-hero.ap-hero .wrap{display:flex}
.page-hero.ap-hero h1.display{max-width:none}
@media (max-width:640px){.ap-pdp-sws{grid-template-columns:repeat(auto-fill,minmax(30px,1fr));gap:4px}.ap-main img{max-width:300px}}
.ap-intro{margin:0 0 18px;max-width:900px}
.ap-intro p{margin:0 0 8px}
.ap-find-cat{display:inline-block;margin-right:8px;padding:2px 10px;background:#db1f26;color:#fff;font-size:16px;letter-spacing:.05em;vertical-align:1px}
/* compact apparel tool bar: search all + filter + brand in one row */
.ap-bar{margin:0 0 16px;padding:12px 14px;background:#F2F3F5;border:1px solid #DCDDE1;border-left:6px solid #db1f26}
.ap-bar-h{margin:0 0 8px;font-family:var(--display);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.05em;color:#5A6372}
.ap-bar-row{display:grid;grid-template-columns:repeat(3,minmax(0,280px));gap:12px;align-items:end}
.ap-bar .ap-find{margin:0;padding:0;background:none;border:0}
.ap-cell label,.ap-bar .ap-find label{display:block;margin:0 0 4px;font-family:var(--display);font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink)}
.ap-bar .ap-find-row{gap:6px}
.ap-bar input,.ap-bar select{width:100%;min-height:42px;padding:7px 10px;border:2px solid #C9CFD9;background:#fff;font:inherit;font-size:16px;color:var(--ink)}
.ap-bar input:focus,.ap-bar select:focus{outline:none;border-color:#db1f26}
.ap-bar .ap-find-row .btn{min-height:42px;padding:6px 14px;font-size:17px}
.ap-bar .ap-find-res{margin-top:12px}
.ap-find-cat{font-size:14px}
.ap-price-h em{display:inline-block;margin-left:10px;padding:2px 10px;background:#1F8A4C;color:#fff;font-style:normal;font-size:14px;letter-spacing:.05em;vertical-align:2px}
@media (max-width:860px){.ap-bar-row{grid-template-columns:1fr 1fr}.ap-bar-row .ap-find{grid-column:1 / -1}}
@media (max-width:480px){.ap-bar-row{grid-template-columns:1fr}}
.page-hero.ap-hero > .wrap{display:block;grid-template-columns:none}
.page-hero.ap-hero > .wrap h1.display{max-width:1100px;width:auto}
.page-hero.ap-hero > .wrap{padding-right:24px;min-height:0}
/* apparel bar v3: one slim row, catalog name as a plain label at the end */
.content:has(> .wrap > .ap-bar:first-child){padding-top:20px}
.ap-bar{padding:10px 14px}
.ap-bar-row{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end}
.ap-bar-row .ap-cell{flex:0 1 270px;min-width:0}
.ap-bar-row .ap-find{flex-basis:290px}
.ap-cell label,.ap-bar .ap-find label{font-size:14px;margin-bottom:3px}
.ap-bar input,.ap-bar select,.ap-bar .ap-find-row .btn{min-height:40px;height:40px}
.ap-bar-h{margin:0 0 0 auto;height:40px;display:flex;align-items:center;gap:10px;padding:0 0 0 14px;border-left:2px solid #C9CFD9;font-size:18px;color:var(--ink);white-space:nowrap}
.ap-bar-h .ap-find-cat{padding:0;background:none;color:var(--ink);font-size:20px;font-weight:800;letter-spacing:.03em}
.ap-bar-h .ap-bar-n{color:#5A6372;font-weight:700}
@media (max-width:860px){.ap-bar-row .ap-find{flex-basis:100%}.ap-bar-row .ap-cell{flex:1 1 200px}.ap-bar-h{margin-left:0;border-left:0;padding-left:0;height:auto;order:-1;flex-basis:100%}}
.ap-bar-row .ap-cell{flex-basis:240px}
.ap-bar-row .ap-find{flex-basis:260px}
@media (max-width:860px){.ap-bar-row .ap-find{flex-basis:100%}.ap-bar-row .ap-cell{flex:1 1 160px}.ap-bar-h{white-space:normal;flex-wrap:wrap;font-size:16px}.ap-bar-h .ap-find-cat{font-size:18px}}
@media (min-width:861px){.ap-bar-row{flex-wrap:nowrap}.ap-bar-row .ap-cell{flex:0 1 230px}.ap-bar-row .ap-find{flex:0 1 250px}.ap-bar-h{flex:0 0 auto}}
@media (min-width:861px){.ap-bar .ap-bar-row .ap-bar-h{margin:0 0 0 auto}}
@media (max-width:860px){.ap-bar-row{gap:8px 10px}.ap-bar-row .ap-cell{flex:1 1 130px}.ap-bar-h{flex-wrap:nowrap;white-space:nowrap;font-size:14px;gap:8px}.ap-bar-h .ap-find-cat{font-size:16px}}
@media (max-width:860px){.ap-bar-row .ap-find.ap-cell{flex:1 1 100%}}
.ap-price .ap-ask{margin:-4px 0 6px;font-size:12px;color:#5A6372;text-align:right}
.ap-bulk{margin:0 0 10px;display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.ap-bulk em{padding:3px 10px;background:#1F8A4C;color:#fff;font-style:normal;font-family:var(--display);font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.05em}
.ap-bulk span{font-size:11px;color:#5A6372}
/* printing: 5 boxes as 3 + 2, and the design desk photo beside the designer text */
@media (min-width:1001px){.offer-grid-5{grid-template-columns:repeat(6,minmax(0,1fr))}.offer-grid-5>.offer-box{grid-column:span 2}.offer-grid-5>.offer-box:nth-child(n+4){grid-column:span 3}}
.designer-photo{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-areas:"img text" "img points"}
.designer-photo .designer-img{grid-area:img;margin:0;min-height:100%;background:#2A3039}
.designer-photo .designer-img img{display:block;width:100%;height:100%;object-fit:cover;border:0}
.designer-photo .designer-text{grid-area:text}
.designer-photo .designer-points{grid-area:points;padding:14px 28px}
.designer-photo .designer-points li{padding:8px 0 8px 40px}
.designer-photo .designer-points li::before{top:10px}
@media (max-width:1000px){.designer-photo{grid-template-columns:1fr;grid-template-areas:"img" "text" "points"}.designer-photo .designer-img img{aspect-ratio:4/3;height:auto}}
@media (min-width:1001px){.designer-photo{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.designer-photo .designer-img img{object-position:22% 50%}
/* designer v2: compact. photo | text on top, the five points as one strip underneath */
@media (min-width:1001px){
  .designer-photo{grid-template-columns:minmax(0,440px) minmax(0,1fr);grid-template-areas:"img text" "points points"}
  .designer-photo .designer-img img{aspect-ratio:1;height:100%;object-position:50% 50%}
  .designer-photo .designer-text{padding:20px 26px}
  .content .designer-photo .designer-text h2{font-size:clamp(22px,2vw,28px);margin:8px 0 6px}
  .designer-photo .designer-text p{font-size:16px;line-height:1.5;margin:0 0 8px}
  .designer-photo .designer-q{font-size:17px}
  .designer-photo .designer-text .btn-row{margin-top:12px}
  .designer-photo .designer-text .btn{min-height:42px;padding:8px 20px;font-size:17px}
  .content .designer-photo .designer-points{flex-direction:row;gap:0;padding:14px 18px}
  .content .designer-photo .designer-points li{flex:1 1 0;border-top:0;border-left:1px solid rgba(255,255,255,.16);padding:4px 12px 4px 44px;font-size:14px;line-height:1.35}
  .content .designer-photo .designer-points li:first-child{border-left:0}
  .content .designer-photo .designer-points li::before{left:12px;top:6px}
  .designer-photo .designer-points strong{font-size:14px}
}
/* tighter gap between the banner / grey strip and the page content */
.content{padding-top:30px}
.content > .wrap > :first-child{margin-top:0}
@media (max-width:1180px){.content{padding-top:24px}}
.content:has(> .wrap > .ap-bar:first-child){padding-top:20px}
/* photo mugs page */
.mug-tag{margin:-4px 0 10px;font-family:var(--title);font-style:italic;font-weight:800;font-size:clamp(18px,1.8vw,22px);text-transform:uppercase;color:#db1f26;letter-spacing:.01em}
.mug-nodesign{margin:6px 0 26px}
.offer-note{margin:-14px 0 24px;font-size:15px;color:#5A6372}
@media (min-width:641px){.offer-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1001px){.offer-grid-2 .offer-body ul{columns:2;column-gap:24px}.offer-grid-2 .offer-body li{break-inside:avoid}}
.mug-points li{padding-top:6px;padding-bottom:6px}
.mug-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:18px;margin:0 0 30px;align-items:stretch}
.mug-duo .box{margin:0}
.mug-duo .callout{margin:0;flex-direction:column;align-items:flex-start}
.mug-sign{font-weight:700}
.mug-ready .offer-fine{margin:12px 0 0;font-size:13px;opacity:.85}
@media (max-width:860px){.mug-duo{grid-template-columns:1fr}}
@media (min-width:1001px){.designer-photo:has(.mug-points){grid-template-columns:minmax(0,340px) minmax(0,1fr)}}
/* photo mugs: photos spread through the page */
.mug-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:28px;align-items:start;margin:0 0 8px}
.mug-hero{margin:0;border:1px solid #DCDDE1;border-bottom:4px solid #db1f26;background:#fff}
.mug-hero img{display:block;width:100%;height:auto;border:0}
.mug-hero figcaption{padding:6px 10px;font-size:13px;color:#5A6372}
.mug-box{padding:0}
.mug-strip{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:3px;background:#fff;border-bottom:3px solid #db1f26}
.mug-strip img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border:0}
.mug-print{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:28px;align-items:start;margin:0 0 30px}
.mug-print-pics{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mug-print-pics img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border:1px solid #DCDDE1}
.mug-print-pics img.wide{grid-column:1 / -1;aspect-ratio:462/221}
@media (max-width:860px){.mug-intro,.mug-print{grid-template-columns:1fr}.mug-hero{max-width:420px}}
.mug-last{background:#F2F3F5;border-left:4px solid #db1f26;padding:10px 14px}
.mug-intro h2{margin-top:0}
.mug-help{margin:0 0 24px}
@media (min-width:861px){.mug-intro{grid-template-columns:minmax(0,1fr) minmax(0,280px)}}
/* budget filter */
@media (min-width:861px){.ap-bar-row .ap-cell{flex:0 1 200px}.ap-bar-row .ap-cell-sm{flex:0 1 160px}.ap-bar-row .ap-find{flex:0 1 240px}}
.ap-cell label span{font-family:var(--text);font-weight:400;text-transform:none;letter-spacing:0;color:#5A6372;font-size:12px}
/* bar v4: budget low/high, sort, stacked catalog label */
.ap-range{display:flex;align-items:center;gap:4px}
.ap-range span{color:#5A6372}
.ap-bar .ap-range input{min-width:0;padding:7px 6px;text-align:center}
.ap-bar .ap-range input::-webkit-inner-spin-button{display:none}
.ap-bar .ap-range input{-moz-appearance:textfield;appearance:textfield}
.ap-bar-h{flex-direction:column;align-items:flex-start;justify-content:center;gap:0;line-height:1.1}
.ap-bar-h .ap-find-cat{font-size:19px}
.ap-bar-h .ap-bar-n{font-size:13px}
@media (min-width:861px){.ap-bar-row .ap-find{flex:0 1 230px}.ap-bar-row .ap-cell{flex:0 1 175px}.ap-bar-row .ap-cell-budget{flex:0 1 170px}.ap-bar-row .ap-cell-sm{flex:0 1 165px}.ap-bar-h{padding-left:12px}}
@media (max-width:860px){.ap-bar-h{flex-direction:row;align-items:baseline;gap:8px}}
.ap-price-note strong{color:var(--ink)}
@media (min-width:861px){.ap-bar-row .ap-find{flex:1 1 220px;max-width:300px}.ap-bar-row .ap-cell-sm{flex:0 0 182px}.ap-bar-row .ap-cell{flex-shrink:1}}
/* results count: easy to spot after changing a filter */
.ap-count{display:inline-block;margin:10px 0 0;padding:8px 16px;background:#1F8A4C;color:#fff;font-family:var(--display);font-weight:700;font-size:18px;letter-spacing:.03em;text-transform:uppercase;border-left:5px solid #136236}
.ap-find-res .ap-find-count{display:inline-block;padding:6px 14px;background:#1F8A4C;color:#fff;font-family:var(--display);font-weight:700;font-size:16px;letter-spacing:.03em;text-transform:uppercase}
.ap-count:empty{display:none}
.content .ap-count,.content .ap-find-res .ap-find-count{color:#fff}
/* results count v2: same size as the filter buttons, with a reset button */
.ap-count{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0 0;padding:6px 8px 6px 14px;font-family:var(--text);font-size:14px;font-weight:600;letter-spacing:0;text-transform:none;border-left:4px solid #136236}
.ap-count[hidden]{display:none}
.ap-count-sep{opacity:.7}
.ap-reset{border:1px solid rgba(255,255,255,.8);background:transparent;color:#fff;font:inherit;font-weight:700;padding:4px 12px;cursor:pointer;transition:background .15s,color .15s}
.ap-reset:hover,.ap-reset:focus-visible{background:#fff;color:#1F8A4C;text-decoration:underline}
.content .ap-count .ap-reset{color:#fff}
.content .ap-count .ap-reset:hover,.content .ap-count .ap-reset:focus-visible{background:#fff;color:#14532d}
/* results bar v3: gap above, 2/3 the height of the filter buttons, nav-style reset */
.content .ap-count{margin:16px 0 0;min-height:26px;padding:0 0 0 12px;gap:0;align-items:stretch;line-height:1}
.ap-count-t{display:flex;align-items:center;padding-right:12px}
.ap-count-sep{position:relative;width:2px;opacity:1;margin:5px 0;
  background:linear-gradient(90deg,rgba(0,0,0,.35) 0 1px,rgba(255,255,255,.4) 1px 2px);transform:skewX(-12deg)}
.content .ap-count .ap-reset{display:flex;align-items:center;border:0;padding:0 14px;background:transparent;color:#fff;
  font-family:var(--display);font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.05em;text-decoration:none;cursor:pointer;transform:skewX(-12deg);margin-right:4px}
.content .ap-count .ap-reset>span{display:inline-block;transform:skewX(12deg)}
.content .ap-count .ap-reset:hover,.content .ap-count .ap-reset:focus-visible{background:rgba(255,255,255,.18);color:#fff;text-decoration:none}
/* search results replace the page content, below the category buttons */
.ap-searching > :not(.ap-bar):not(.ap-tabs):not(.ap-find-res){display:none !important}
.ap-find-res .ap-rcount{margin:0 0 12px}
.ap-find-res .ap-results{margin-top:0}
.ap-none{margin:0 0 20px;padding:12px 14px;background:#F2F3F5;border-left:4px solid #db1f26}
.ap-reset-plain{margin-left:6px;border:0;background:none;color:#db1f26;font:inherit;font-weight:700;text-decoration:underline;cursor:pointer}

/* discontinued style (nightly S&S update) */
.ap-price.ap-gone .ap-price-h{color:var(--red)}

/* JDS catalogs (Engraving Catalog, Photo Mug Catalog): square product photos */
.jd-card .ap-img img,.jd .jd-card .ap-img img,.jd-tiles .ap-tile-img img,.jd-minis .ap-mini img,.jd-pdp .ap-main img{aspect-ratio:1/1}
.jd-card .ap-img img{max-width:220px}
.jd-pdp .ap-main img{max-width:520px}
.jd-pdp .ap-info .ap-brand{text-decoration:none}
.jd-pdp .ap-info a.ap-brand:hover{text-decoration:underline}
.jd-desc{margin:14px 0 6px;line-height:1.6}
.jd-specs{margin-top:8px}
.jd-specs li strong{font-weight:600}

/* home: smaller gap between the red bar and the services section */
.strip + .section{padding-top:44px}
@media (max-width:900px){.strip + .section{padding-top:32px}}

/* ---- home page (2026 order): headline, showroom, recent work, reviews, visit ---- */
.hero h1.display.hero-title{margin:0;font-size:clamp(30px,3vw,44px);line-height:1.04}
@media (max-width:1180px){.hero h1.display.hero-title{font-size:clamp(28px,5.4vw,42px)}}
.hero p.home-h1{font-weight:700}
.showroom-grid{display:grid;grid-template-columns:minmax(0,440px) minmax(0,1fr);gap:48px;align-items:center}
.showroom-img{margin:0;border-bottom:5px solid var(--red)}
.showroom-img img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border:0}
.showroom-copy .display{font-size:clamp(32px,3.6vw,48px);margin:10px 0 16px;text-wrap:balance}
.showroom-copy p{font-size:18px;color:var(--body);max-width:60ch;margin:0 0 18px}
.showroom-points{list-style:none;margin:0 0 24px;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.showroom-points li{background:var(--mist);border-left:4px solid var(--red);padding:9px 14px;font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.04em}
@media (max-width:900px){.showroom-grid{grid-template-columns:1fr;gap:26px}.showroom-img{max-width:440px}}
.work-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.work-tile{margin:0;background:#fff;border:1px solid #DCDDE1;border-bottom:4px solid var(--red);display:flex;flex-direction:column}
.work-tile img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border:0}
.work-tile figcaption{padding:10px 12px 12px;font-size:14px;line-height:1.35;color:var(--body)}
.work-tile figcaption span{display:block;font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--red-text, #c8161d);margin-bottom:3px}
.work-more{margin-top:26px;justify-content:center}
@media (max-width:900px){.work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}
.section.reviews{padding:56px 0}
.reviews-box{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;border-left:6px solid var(--red);padding-left:28px}
.reviews-box .display{font-size:clamp(30px,3.4vw,44px);margin:8px 0 10px}
.reviews-box p{margin:0;max-width:62ch;font-size:17px;color:var(--body)}
.visit-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center}
.visit-grid .display{font-size:clamp(34px,4vw,52px);margin:10px 0 14px}
.visit-grid p{font-size:18px;color:var(--body);margin:0 0 22px;max-width:56ch}
.visit-info{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;background:var(--mist);padding:24px;border-top:5px solid var(--red)}
.visit-info dt{font-weight:800;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--red-text, #c8161d);margin-bottom:4px}
.visit-info dd{margin:0;font-size:16px;line-height:1.45}
@media (max-width:900px){.visit-grid{grid-template-columns:1fr}.visit-info{grid-template-columns:1fr}}
@media (min-width:1001px){#services .cards{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---- customer reviews (real Yelp reviews) ---- */
.rv-stars{display:inline-flex;gap:2px;color:var(--red)}
.rv-stars svg{width:18px;height:18px;fill:currentColor}
.rv-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:28px}
.rv-grid.rv-n1{grid-template-columns:minmax(0,640px)}
.rv-card{margin:0;background:#fff;border:1px solid #DCDDE1;border-top:4px solid var(--red);padding:20px 22px;display:flex;flex-direction:column;gap:12px}
.rv-card blockquote{margin:0;font-size:17px;line-height:1.55;color:var(--ink);flex:1}
.rv-card figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;font-size:14px;color:var(--body)}
.rv-card figcaption strong{color:var(--ink);font-size:15px}
.section.reviews .rv-grid{margin-top:30px}
.section.reviews .reviews-box{align-items:flex-end}
.rv{margin:44px 0 10px}
.rv-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px}
.rv-head h2{margin:0}
.rv-more{font-weight:700}
.rv .rv-grid{margin-top:18px}
.rv .rv-card{background:var(--mist)}
@media (max-width:900px){.rv-grid{grid-template-columns:1fr}}
/* Yelp "People Love Us" badge, far right of the header */
.yelp-badge{display:block;flex:0 0 auto;margin:-8px 0 -8px 6px;line-height:0}
.yelp-badge img{display:block;width:48px;height:auto}
.yelp-badge:hover img{transform:scale(1.04)}
@media (max-width:700px){.yelp-badge img{width:38px}}

/* ---- home page copy (Nov 2026) ---- */
.hero .lead.hero-lead2{margin-top:-4px}
@media (min-width:1181px){.hero .hero-copy .lead{font-size:16px;line-height:1.55}}
.home-intro{margin-bottom:40px}
.home-intro .display{font-size:clamp(34px,4.2vw,54px);margin:10px 0 18px;text-wrap:balance;max-width:24ch}
.home-intro > p{font-size:18px;color:var(--body);max-width:70ch;margin:0}
.section.dark .home-intro > p{color:inherit}
.home-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 40px}
.home-cols p{margin:0 0 12px;font-size:17px;line-height:1.6;color:var(--body)}
@media (max-width:900px){.home-cols{grid-template-columns:1fr}}
.showroom-copy p{font-size:17px}
.why-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.why-box{background:#fff;border-top:4px solid var(--red);padding:22px;box-shadow:0 1px 0 rgba(0,0,0,.04)}
.why-box h3{margin:0 0 10px;font-size:19px}
.why-box p{margin:0;font-size:15.5px;line-height:1.6;color:var(--body)}
@media (max-width:1100px){.why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.why-grid{grid-template-columns:1fr}}
.home-faq-h{font-size:clamp(32px,3.8vw,48px);margin:10px 0 26px}
.section .faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:800px){.section .faq-grid{grid-template-columns:1fr}}
.cta p{max-width:62ch}

/* ---- home page, compact layout ---- */
.hero h1.display.hero-title{font-size:clamp(26px,2.3vw,34px);line-height:1.08}
@media (max-width:1180px){.hero h1.display.hero-title{font-size:clamp(24px,4.6vw,32px)}}
#main > .section{padding:60px 0}
#main > .strip + .section{padding-top:40px}
@media (max-width:900px){#main > .section{padding:44px 0}}
@media (min-width:901px){.showroom-grid{grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:40px}}
.showroom-copy .display{font-size:clamp(28px,2.8vw,38px);margin:8px 0 14px}
.showroom-copy p{font-size:16.5px;margin:0 0 14px}
.home-intro{margin-bottom:28px}
.home-intro .display{font-size:clamp(28px,3vw,40px);max-width:none;margin:8px 0 14px}
.home-cols p{font-size:16px;margin:0 0 10px}
@media (min-width:1001px){#services .cards.cards-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}}
.cards-4 .card .body h3{font-size:18px}
.cards-4 .card .body p{font-size:14.5px}
.why-band{background:var(--ink);color:#fff}
.why-band .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:14px 36px;padding-top:24px;padding-bottom:24px}
.why-band h2{margin:0;font-family:var(--display);font-style:italic;font-weight:800;text-transform:uppercase;font-size:22px;line-height:1.1;flex:0 1 auto;min-width:0}
.why-band ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 28px;flex:1 1 640px}
.why-band li{border-left:3px solid var(--red);padding-left:12px;display:flex;flex-direction:column;gap:2px}
.why-band li strong{font-size:15px;text-transform:uppercase;letter-spacing:.05em}
.why-band li span{font-size:14px;color:#D5D8DE}
.why-band ul{min-width:0}
@media (max-width:900px){.why-band ul{grid-template-columns:repeat(2,minmax(0,1fr));flex-basis:100%}}
.home-faq-h{font-size:clamp(28px,3vw,40px);margin:8px 0 20px}
.section.reviews{padding:52px 0}
.section-head .display{font-size:clamp(30px,3.4vw,44px)}

/* ---- home hero: shorter, headline on two lines, no buttons; Yelp logo in header ---- */
.yelp-badge img{width:120px;height:auto}
@media (max-width:700px){.yelp-badge img{width:92px}}
.home-hero .wrap{min-height:0;padding-top:26px;padding-bottom:28px}
@media (min-width:1181px){.home-hero .banner-media{width:calc(var(--box) * .5 - 24px)}.home-hero .wrap{padding-right:calc(var(--box) * .5 + 20px)}}
.home-hero h1.display.hero-title{font-size:clamp(20px,2.1vw,27px);line-height:1.1}
.home-hero .hero-copy{gap:8px}
.home-hero .lead{font-size:15.5px;line-height:1.55;margin:0}

/* ---- home: why / how / reviews kept inside the content width, compact ---- */
.why-band.why-home{background:none;padding-top:40px}
.why-home .wrap{background:var(--ink);padding:18px 28px;max-width:calc(var(--wrap) - 48px)}
#main > .section.how-home{padding:0 0 4px;background:none}
.how-home > .wrap{background:var(--mist);padding:26px 28px 30px;max-width:calc(var(--wrap) - 48px)}
.how-home .section-head{display:block;margin-bottom:18px}
.how-home .section-head .display{font-size:clamp(26px,2.6vw,34px);margin:6px 0 8px}
.how-home .section-head p{max-width:none;font-size:16px}
.how-home .steps{gap:20px 28px}
.how-home .step{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:baseline;padding-top:12px}
.how-home .step .n{font-size:34px;line-height:1;margin:0}
.how-home .step h3{margin:0;font-size:19px}
.how-home .step p{grid-column:1 / -1;margin:8px 0 0;font-size:15.5px}
@media (max-width:1300px){.why-home .wrap,.how-home > .wrap{max-width:none;margin-left:24px;margin-right:24px}}
@media (max-width:640px){.why-home .wrap,.how-home > .wrap{margin-left:12px;margin-right:12px;padding-left:16px;padding-right:16px}}
.rv-title{display:flex;align-items:center;gap:18px}
.rv-yelp img{display:block;width:108px;height:auto}
.section.reviews{padding:36px 0 44px}
.reviews-box .display{font-size:clamp(28px,3vw,40px)}
@media (max-width:560px){.rv-title{flex-direction:column;align-items:flex-start;gap:10px}}
.home-hero .slides img{object-position:right center}
.home-hero p.home-h1{letter-spacing:.1em;font-size:12px}
.brands-banner{margin:0 0 32px}.brands-banner img{display:block;width:100%;height:auto;border:1px solid #E3E6EB}
.content .sp-split{gap:40px;margin:8px 0 40px;align-items:center}.content .sp-split>.photo{flex:0 1 420px;margin:0}.content .sp-split>.copy{flex:1 1 460px;gap:14px}.content .sp-split .copy h2{margin:0}.content .sp-split .copy p{font-size:17px}
.precision-cta .pc-photo{flex:0 0 180px;margin:0}.precision-cta .pc-photo img{display:block;width:180px;height:180px;object-fit:cover;border:3px solid #fff}
@media (max-width:700px){.precision-cta .pc-photo{flex-basis:100%}.precision-cta .pc-photo img{width:100%;height:auto;max-width:260px}}
/* chips: plain checklist, not button-like */
.content ul.chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:6px 24px;list-style:none;padding:0;margin:12px 0 18px}
.content ul.chips li{background:none;border:0;border-radius:0;padding:0 0 0 22px;margin:0;position:relative;font-size:15.5px;line-height:1.4;color:#2E3035;box-shadow:none}
.content ul.chips li::before{content:"";position:absolute;left:2px;top:5px;width:11px;height:6px;border-left:2.5px solid #db1f26;border-bottom:2.5px solid #db1f26;transform:rotate(-45deg)}
/* home showroom: two photos + compact copy */
.showroom-grid.sr2{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:32px;align-items:center}
.sr-photos{display:grid;grid-template-columns:16fr 9fr;gap:12px;align-items:stretch}
.sr-photos figure{margin:0;border-bottom:5px solid var(--red);min-width:0}
.sr-photos img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:auto}
.sr-room img{aspect-ratio:16/9}.sr-desk img{aspect-ratio:1}
.home-hero ~ .showroom .section, .section.showroom{padding-top:44px;padding-bottom:44px}
.sr2 .showroom-copy .display{font-size:clamp(24px,2.3vw,32px);margin:6px 0 10px}
.sr2 .showroom-copy p:not(.eyebrow){font-size:16px;margin:0 0 16px}
.sr2 .btn-row{gap:10px}
@media (max-width:900px){.showroom-grid.sr2{grid-template-columns:1fr;gap:22px}}
.showroom-grid.sr2{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
.sr2 .btn-row .btn{font-size:15px;padding:12px 18px;min-height:0}
.sr2 .btn-row{flex-wrap:wrap}
@media (max-width:600px){.sr2 .btn-row .btn{box-sizing:border-box;width:100%;max-width:100%;justify-content:center}}
.sr2 .btn-row .btn{padding:11px 14px;font-size:14.5px}
@media (max-width:900px){.showroom-grid.sr2{grid-template-columns:1fr;gap:22px}}
/* home: family + saved-the-day */
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.about-grid .copy .display{font-size:clamp(28px,3vw,42px);margin:8px 0 14px}
.about-grid .copy p:not(.eyebrow){font-size:17px;color:var(--body);margin:0 0 14px}
.save-day{background:linear-gradient(135deg,#2B2E35,#3D424C);color:#fff;border-top:5px solid #db1f26;padding:28px 30px;box-shadow:0 12px 30px rgba(40,42,48,.2)}
.save-day h3{color:#fff;font-family:var(--title);font-style:italic;font-weight:800;text-transform:uppercase;font-size:clamp(20px,2vw,26px);line-height:1.15;margin:12px 0 10px}
.save-day p{color:#D3D8E0;font-size:16px;margin:0}
.save-day ul.pc-points{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px 20px}
.save-day ul.pc-points li{margin:0;color:#fff;font-weight:600;font-size:15px;padding-left:22px;position:relative}
.save-day ul.pc-points li::before{content:"";position:absolute;left:0;top:5px;width:12px;height:7px;border-left:3px solid #db1f26;border-bottom:3px solid #db1f26;transform:rotate(-45deg)}
.save-day blockquote{margin:18px 0 0;padding:14px 0 0;border-top:1px solid rgba(255,255,255,.18);font-size:17px;font-style:italic;color:#fff}
.save-day cite{display:block;margin-top:6px;font-style:normal;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:#AEB4BF}
@media (max-width:900px){.about-grid{grid-template-columns:1fr;gap:26px}.save-day{padding:22px 20px}}
.save-day .pc-tag{display:inline-block;background:#db1f26;color:#fff;font-family:var(--title);font-style:italic;font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:.06em;padding:4px 12px;transform:skewX(-12deg)}
.about-grid .copy .eyebrow{letter-spacing:.12em}
.specialty-note{border-left:4px solid #db1f26;background:#fff;padding:14px 18px;margin-top:6px}
.specialty-note h3{margin:0 0 6px;font-family:var(--title);font-style:italic;font-weight:800;text-transform:uppercase;font-size:17px;letter-spacing:-.01em}
.about-grid .copy .specialty-note p{margin:0;font-size:15.5px}
html{scroll-behavior:smooth}
#catalogs{scroll-margin-top:20px}
.content a.cat-jump{display:inline-flex;align-items:center;gap:6px;margin-top:4px;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#db1f26;text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:1px}
.content a.cat-jump:hover{color:#a8161c}
/* engraving: catalogs panel beside the intro */
.eng-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:36px;align-items:start;margin:0 0 28px}
.eng-intro p{margin:0 0 16px}
.callout.callout-covers.cc-side{display:flex;flex-direction:column;padding:0;gap:0;margin:0;overflow:hidden;border-top:4px solid #db1f26}
.cc-side .cc-covers{order:-1;width:100%}
.cc-side .cc-frame{aspect-ratio:2/1;height:auto;min-height:0}
.cc-side .cc-text{padding:16px 18px 18px;gap:2px}
.cc-side .cc-side-h{margin:0;font-size:20px;line-height:1.15}
.cc-side .cc-text p{margin:2px 0 10px;font-size:14.5px}
.cc-side .cc-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cc-side .cc-btns .btn{min-height:36px;padding:7px 10px;font-size:13.5px;white-space:nowrap;justify-content:center}
@media (max-width:1000px){.eng-top{grid-template-columns:1fr}.callout.callout-covers.cc-side{max-width:560px}}
@media (max-width:420px){.cc-side .cc-btns{grid-template-columns:1fr}}
.cc-side .cc-frame{aspect-ratio:2.5/1}
.cc-side .cc-frame img{object-position:center 55%}
.cc-side .cc-spot{top:6%;height:88%}
.cc-side .cc-text{padding:12px 16px 14px}
.cc-side .cc-side-h{font-size:18px}
.cc-side .cc-text p{margin:2px 0 8px;font-size:14px}
.cc-side .cc-btns{gap:6px}
.eng-top{align-items:center}
@media (max-width:1000px){.eng-top .cc-side{order:-1}}
.stock-note{background:#FFF6E5;border-left:4px solid #E3A008;padding:10px 14px;font-size:15px;color:#2E3035}
.ap-info .stock-note{margin:10px 0}
.mug-cat{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;margin-top:16px;padding:16px 18px;background:#EEF0F4;border-top:4px solid #db1f26}
.mug-cat h3{margin:0 0 4px;font-family:var(--title);font-style:italic;font-weight:800;text-transform:uppercase;font-size:18px}
.mug-cat p{margin:0;font-size:15px}
.mug-cat>div{flex:1 1 260px;min-width:0}
.case-note{background:#FDECEC;border-left:4px solid #db1f26;padding:10px 14px;font-size:15px;color:#2E3035}
.ap-info .case-note{margin:10px 0}
.jd-min{display:block;font-size:13px;font-weight:700;color:#b3181e;margin-top:2px}
/* ===== refreshed catalog tabs: clean tab bar with a red underline ===== */
.tabs{display:flex;flex-wrap:wrap;gap:0 26px;margin:0 0 24px;padding:0;border-bottom:1px solid #D3D8E0}
.tabs a{display:inline-flex;align-items:center;min-height:0;padding:12px 2px 11px;margin-bottom:-1px;border:0;border-bottom:3px solid transparent;background:none;color:#4A505C;font-family:var(--title);font-style:normal;font-weight:700;font-size:14.5px;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:color .15s,border-color .15s}
.tabs a:hover{background:none;color:#1E1F22;border-bottom-color:#AEB4BF}
.tabs a[aria-current="page"],.tabs a[aria-current="true"]{background:none;color:#db1f26;border-bottom-color:#db1f26}
@media (max-width:760px){.tabs,.gift-tabs{flex-wrap:nowrap;overflow-x:auto;gap:0 20px;padding-bottom:0;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}.tabs a{flex:0 0 auto}}
/* ===== refreshed filter pills (category filters with counts) ===== */
.font-chip,.gift-subs a{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:5px 7px 5px 14px;border:1px solid #D3D8E0;border-radius:999px;background:#fff;color:#2E3035;font:inherit;font-size:14px;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;box-shadow:0 1px 2px rgba(30,31,34,.05);transition:border-color .15s,color .15s,background .15s}
.font-chip span,.gift-subs a span{display:inline-block;min-width:24px;margin:0;padding:2px 8px;border-radius:999px;background:#EEF0F4;color:#5A6170;font-size:12px;font-weight:700;text-align:center}
.font-chip:hover,.gift-subs a:hover{background:#fff;border-color:#db1f26;color:#db1f26}
.font-chip:hover span,.gift-subs a:hover span{background:#FDECEC;color:#b3181e}
.font-chip[aria-pressed="true"]{background:#db1f26;border-color:#db1f26;color:#fff}
.font-chip[aria-pressed="true"] span{background:rgba(255,255,255,.22);color:#fff}
.font-chip:focus-visible,.gift-subs a:focus-visible,.tabs a:focus-visible{outline:2px solid #db1f26;outline-offset:2px}
/* ===== chosen style O: slanted tabs and filters (same look, two sizes) ===== */
.tabs{display:flex;flex-wrap:wrap;gap:8px 10px;margin:0 0 24px;padding:0 0 0 6px;border:0}
.tabs a,.font-chip,.gift-subs a{position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:7px;border:0;border-radius:0;background:none;box-shadow:none;color:#20242B;font-family:var(--title);font-style:italic;font-weight:800;text-transform:uppercase;letter-spacing:.01em;line-height:1.2;text-decoration:none;cursor:pointer;white-space:nowrap}
.tabs a::before,.font-chip::before,.gift-subs a::before{content:"";position:absolute;inset:0;z-index:-1;background:#EEF0F4;transform:skewX(-12deg);transition:background .15s}
.tabs a{min-height:0;padding:11px 20px;margin:0;font-size:14px}
.font-chip,.gift-subs a{min-height:0;padding:6px 14px;font-size:12.5px}
.font-chips,.gift-subs{gap:8px 10px;padding-left:6px}
.font-chip span,.gift-subs a span{display:inline;min-width:0;margin:0;padding:0;border-radius:0;background:none;color:#6B7585;font-style:normal;font-weight:700;font-size:inherit}
.tabs a:hover,.font-chip:hover,.gift-subs a:hover{background:none;color:#20242B;border:0}
.tabs a:hover::before,.font-chip:hover::before,.gift-subs a:hover::before{background:#DFE3E9}
.font-chip:hover span,.gift-subs a:hover span{background:none;color:#6B7585}
.tabs a[aria-current="page"],.tabs a[aria-current="true"],.font-chip[aria-pressed="true"]{background:none;color:#fff;border:0}
.tabs a[aria-current="page"]::before,.tabs a[aria-current="true"]::before,.font-chip[aria-pressed="true"]::before{background:#db1f26}
.font-chip[aria-pressed="true"] span{background:none;color:#FFE4E5}
.tabs a:focus-visible,.font-chip:focus-visible,.gift-subs a:focus-visible{outline:2px solid #db1f26;outline-offset:3px}
@media (max-width:760px){.tabs,.gift-tabs{flex-wrap:nowrap;overflow-x:auto;padding:2px 2px 6px 8px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.tabs a{flex:0 0 auto;padding:10px 16px;font-size:13px}}
/* ===== catalog pages: search bar, tabs, description and filters read as one connected panel ===== */
.ap-bar{margin-bottom:0}
.ap-bar ~ .ap-tabs,.ap-bar ~ .ap-intro,.ap-bar ~ .ap-tools{margin:0;max-width:none;background:#fff;border:1px solid #DCDDE1;border-top:0;border-bottom:0;border-left:6px solid #db1f26}
.ap-bar ~ .ap-tabs{padding:16px 18px 4px 24px}
.ap-bar ~ .ap-intro{padding:10px 18px 2px 18px}
.ap-bar ~ .ap-intro p{margin:0 0 6px;max-width:900px}
.ap-bar ~ .ap-intro .case-note,.ap-bar ~ .ap-intro .stock-note{margin:8px 0 10px}
.ap-bar ~ .ap-tools{padding:6px 18px 14px 18px;border-bottom:1px solid #DCDDE1;margin-bottom:22px;position:sticky;top:0;z-index:10}
.ap-bar ~ .ap-tools .font-chips{margin-top:0}
/* hub pages (no filters): the description closes the panel */
.ap-bar ~ .ap-intro:not(:has(~ .ap-tools)){border-bottom:1px solid #DCDDE1;padding-bottom:10px;margin-bottom:22px}
/* while searching, the tabs close the panel and the results follow */
.ap-searching .ap-bar ~ .ap-tabs{border-bottom:1px solid #DCDDE1;padding-bottom:14px}
@media (max-width:760px){.ap-bar ~ .ap-tabs{padding:12px 10px 4px 14px}.ap-bar ~ .ap-intro,.ap-bar ~ .ap-tools{padding-left:12px;padding-right:12px}}
/* no red glow under the selected menu buttons */
.service-nav a,.service-nav a:hover,.service-nav a[aria-current],.sub-nav a,.sub-nav a:hover,.sub-nav a[aria-current]{box-shadow:none}
/* home: bigger showroom photos */
.showroom-grid.sr2{grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:28px}
@media (max-width:900px){.showroom-grid.sr2{grid-template-columns:1fr}}
.sr2 .btn-row .btn{padding:10px 12px;font-size:14px;letter-spacing:.03em}


/* ===== engraving designs: one card per design, style buttons, show more ===== */
.dz-crumb{font-size:15px;margin-bottom:4px}.dz-crumb a{font-weight:700}
.dz-opts{display:flex;align-items:center;gap:4px;flex-wrap:wrap;font-size:13px;color:#5A6372}
.dz-opts em{font-style:normal;margin-left:4px}
.dz-dot{display:inline-block;width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.18);vertical-align:middle}
.dz-more-row{display:flex;align-items:center;justify-content:center;gap:14px;margin:22px 0 30px}
.dz-more-n{font-size:14px;color:#5A6372}
.dz-pick{margin:14px 0 4px}.dz-lab{margin:0 0 6px;font-size:15px}
.dz-opts-row{display:flex;flex-wrap:wrap;gap:8px}
.dz-opt{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:6px 14px;border:1.5px solid #C9CFD9;background:#fff;color:#20242B;font:inherit;font-size:14.5px;font-weight:600;cursor:pointer}
.dz-opt:hover{border-color:#20242B}
.dz-opt[aria-pressed="true"]{border-color:#db1f26;box-shadow:inset 0 0 0 1px #db1f26}
.dz-opt.dz-na{opacity:.45}
.dz-pdp .ap-price{margin-top:14px}
.dz-all{margin:30px 0}
.dz-tbl{width:100%;border-collapse:collapse;font-size:15px}
.dz-tbl th{text-align:left;font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:#5A6372;border-bottom:2px solid #20242B;padding:8px 10px}
.dz-tbl td{padding:9px 10px;border-bottom:1px solid #E3E6EB}
.dz-tbl tbody tr{cursor:pointer}.dz-tbl tbody tr:hover{background:#F4F5F7}
.dz-tbl tbody tr.on{background:#FDECEC}

/* family tiles: a strip of photos and a short dark caption */
.dz-famgrid{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:18px}
.dz-fam{display:flex;flex-direction:column;background:#fff;border:1px solid #DCDDE1;overflow:hidden;padding:0}
.dz-fam-pics{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#E3E6EB;border-bottom:4px solid #db1f26}
.dz-fam-pics.dz-n1{grid-template-columns:1fr}.dz-fam-pics.dz-n2{grid-template-columns:repeat(2,1fr)}.dz-fam-pics.dz-n3{grid-template-columns:repeat(3,1fr)}
.dz-fam-pics span{background:#fff;aspect-ratio:1;display:block}
.dz-fam-pics.dz-n1 span,.dz-fam-pics.dz-n2 span{aspect-ratio:2/1}
.dz-fam-pics img{width:100%;height:100%;object-fit:contain;display:block;padding:4px}
.ap-card.dz-fam figcaption{display:flex;flex-direction:row;align-items:center;justify-content:space-between;text-align:left;gap:10px;padding:11px 14px;margin:0;background:linear-gradient(135deg,#3D424C,#2B2E35);color:#fff;flex:1}
.dz-fam figcaption>div{min-width:0}
.content a.dz-fam-name{display:block;color:#fff;text-decoration:none;font-family:var(--title);font-style:italic;font-weight:800;text-transform:uppercase;font-size:16px;line-height:1.2}
.dz-fam-n{display:block;font-size:13px;color:#C9CFD9;margin-top:3px}
.content a.dz-fam-go{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;background:#db1f26;color:#fff;text-decoration:none;font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:15px}
.content a.dz-fam-go:hover{background:#b3181e}
.dz-fam:hover{border-color:#AEB4BF}
.dz-back{margin:20px 0 26px}

/* main catalog page: bigger tiles with six photos */
.dz-hubgrid{grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:20px;margin-top:6px}
.dz-fam-pics.dz-hub-pics{grid-template-columns:repeat(3,1fr)}
.dz-hub-pics span{aspect-ratio:1}
.dz-hub .dz-fam-name{font-size:18px}
.dz-hub-types{display:block;font-size:12.5px;color:#AEB4BF;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}