/* Broad painted street lettering inspired by the supplied Bronx Originals art.
   Knewave by Tyler Finck, SIL Open Font License 1.1; hosted with the site.
   Original logo artwork and customer design samples remain untouched. */
@font-face{
  font-family:'Knewave';
  src:url('assets/fonts/knewave-regular.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
.graffiti-theme{--brush-font:'Knewave','Impact','Arial Black',Arial,sans-serif;font-synthesis:none}
.graffiti-theme .header nav a{
  font-family:var(--brush-font);font-weight:400;font-size:15px;letter-spacing:.05px;
}
.graffiti-theme .hero h1.hero-design-heading,
.graffiti-theme .bronx-brand-copy h2,
.graffiti-theme .section-heading h2,
.graffiti-theme .collection-tile h3,
.graffiti-theme .accessory-design-actions h3,
.graffiti-theme .keychain-feature h2,
.graffiti-theme .design-section-heading h3,
.graffiti-theme .city-group-title,
.graffiti-theme .denim-concept-copy h2,
.graffiti-theme .denim-designer-heading h3,
.graffiti-theme .story-copy h2,
.graffiti-theme .questions h2,
.graffiti-theme .new-designs-callout>div>p:last-child,
.graffiti-theme .design-your-own-callout strong,
.graffiti-theme .reel-topline h2,
.story-page .origin-hero h1,
.story-page .origin-sidebar h2,
.story-page .origin-article h2,
.story-page .origin-article h3,
.story-page .culture-film h4,
.story-page .origin-footer p strong,
.story-page .brand-origins-finale .brand-origins-tagline{
  font-family:var(--brush-font);font-weight:400;font-style:normal;
  letter-spacing:.1px;text-transform:uppercase;line-height:1.22;
  text-wrap:balance;overflow-wrap:break-word;
}
.graffiti-theme .hero h1.hero-design-heading,
.graffiti-theme .hero h1.hero-design-heading em,
.graffiti-theme .bronx-brand-copy h2,
.graffiti-theme .bronx-brand-copy h2 em,
.graffiti-theme .story-copy h2,
.graffiti-theme .story-copy h2 em,
.story-page .origin-hero h1,
.story-page .origin-hero h1 em{
  color:#fff;-webkit-text-stroke:1px #080b0e;paint-order:stroke fill;
  text-shadow:3px 3px 0 #080b0e,5px 5px 0 #080b0e;
  font-style:normal;
}
.graffiti-theme .hero h1.hero-design-heading{
  position:relative;font-size:clamp(44px,5.5vw,76px);line-height:1.15;
  letter-spacing:-.4px;transform:rotate(-2deg);margin-bottom:34px;
}
/* A few short paint trails add the reference's drip detail without covering text. */
.graffiti-theme .hero h1.hero-design-heading:after{
  content:'';display:block;width:72%;height:12px;margin-top:-1px;
  background:linear-gradient(#fff,#fff) 8% 0/3px 9px no-repeat,
    linear-gradient(#fff,#fff) 39% 0/2px 12px no-repeat,
    linear-gradient(#fff,#fff) 83% 0/3px 7px no-repeat;
  filter:drop-shadow(2px 2px 0 #080b0e);pointer-events:none;
}
.graffiti-theme .bronx-brand-copy h2{font-size:clamp(38px,5.5vw,78px);line-height:1.2}
.graffiti-theme .section-heading h2,
.graffiti-theme .denim-concept-copy h2,
.graffiti-theme .questions h2{font-size:clamp(28px,3.25vw,46px);letter-spacing:0}
.graffiti-theme .custom-studio .section-heading h2.design-your-own-heading,
.graffiti-theme .collections .section-heading h2,
.graffiti-theme .new-accessories .section-heading h2,
.graffiti-theme .denim-concept-copy h2{
  color:#10161b;text-shadow:2px 2px 0 #fff;font-style:normal;
}
.graffiti-theme .shop>.section-heading h2,
.graffiti-theme .design-section-heading h3,
.graffiti-theme .design-section:nth-child(2n) .design-section-heading h3{
  color:#fff;text-shadow:2px 2px 0 #060a0e,4px 4px 0 #060a0e;font-style:normal;
}
.graffiti-theme .design-section-heading h3,
.graffiti-theme .design-section:nth-child(2n) .design-section-heading h3{
  font-size:clamp(28px,3.4vw,44px);line-height:1.25;letter-spacing:0;
}
.graffiti-theme .design-section-heading h3>span{
  font-family:Arial,Helvetica,sans-serif;font-weight:700;vertical-align:middle;
}
.graffiti-theme .collection-tile h3{font-size:22px;line-height:1.3;letter-spacing:0;color:#fff}
.graffiti-theme .city-group-title{font-size:24px;color:#fff;line-height:1.4}
.graffiti-theme .reel-topline h2{font-size:19px;line-height:1.35;letter-spacing:0}
.story-page .origin-hero h1{
  font-size:clamp(43px,5.5vw,78px);line-height:1.2;max-width:14ch;letter-spacing:-.5px;
}
.story-page .origin-article h2{font-size:clamp(30px,3.5vw,46px);line-height:1.3;letter-spacing:0}
.story-page .origin-article h3{font-size:24px;line-height:1.5;letter-spacing:0}
.story-page .origin-sidebar h2{font-size:27px;line-height:1.35;color:#fff}
.story-page .culture-film h4{font-size:27px;line-height:1.3;color:#fff}
.story-page .brand-origins-finale .brand-origins-tagline{font-size:23px;line-height:1.5}
@media(max-width:1200px){
  .graffiti-theme .header nav a{font-size:14px;padding:10px 11px}
}
@media(max-width:720px){
  .graffiti-theme .hero h1.hero-design-heading{font-size:clamp(40px,10vw,66px);line-height:1.18}
  .graffiti-theme .bronx-brand-copy h2{font-size:clamp(34px,9vw,62px)}
  .graffiti-theme .collection-tile h3{font-size:20px}
  .graffiti-theme .city-group-title{font-size:21px}
  .story-page .origin-hero h1{font-size:clamp(35px,8.5vw,58px);max-width:15ch;line-height:1.25}
  .story-page .origin-article h2{font-size:30px}
  .story-page .origin-article h3{font-size:22px}
  .story-page .origin-sidebar h2{font-size:24px}
}

/* Carry the same angular lettering through every customer-facing HTML surface.
   The explicit HTML selector leaves SVG labels, drawing previews and logo art alone.
   Font-family is intentionally authoritative over component font shorthands. */
.graffiti-theme{
  --font:var(--brush-font);
  font-family:var(--brush-font);
  line-height:1.7;
}
.graffiti-theme :where(
  a,abbr,address,b,blockquote,button,caption,cite,code,dd,details,dfn,dialog,
  div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,
  header,i,input,kbd,label,legend,li,main,mark,nav,ol,optgroup,option,
  output,p,pre,q,s,samp,section,select,small,span,strong,sub,summary,sup,
  table,tbody,td,textarea,tfoot,th,thead,time,tr,u,ul,var
):not(svg *){
  font-family:var(--brush-font) !important;
}
.graffiti-theme input::placeholder,
.graffiti-theme textarea::placeholder,
.graffiti-theme input::file-selector-button{
  font-family:var(--brush-font);
}
/* Letter shapes need room, especially in forms and longer product names. */
.graffiti-theme :where(button,input,select,textarea,label,legend,summary){line-height:1.5}
.graffiti-theme :where(input:not([type=range]):not([type=checkbox]):not([type=radio]),select,textarea){
  font-size:16px;
}
.graffiti-theme .product-title{line-height:1.5;letter-spacing:0;overflow-wrap:break-word}
.graffiti-theme .product-subtitle,
.graffiti-theme .product-tag,
.graffiti-theme .detail-note,
.graffiti-theme .cart-item p,
.graffiti-theme .required-note,
.graffiti-theme .builder-label>small,
.graffiti-theme .builder-label>span,
.graffiti-theme .design-request>label span,
.graffiti-theme .motif-option>small,
.graffiti-theme .footer-bottom{
  font-size:11px;line-height:1.75;letter-spacing:0;
}
.graffiti-theme .design-approval-notice p{line-height:1.85;letter-spacing:.1px}
.graffiti-theme .site-beat{font-weight:400}
.graffiti-theme .beat-toggle{font-weight:400;font-size:12px;line-height:1.5}
.graffiti-theme .beat-status,
.graffiti-theme .beat-volume{font-size:11px;line-height:1.5}
.graffiti-theme .beat-controls{min-width:0;flex-wrap:wrap}
.graffiti-theme .beat-details{overflow-wrap:break-word}
.graffiti-theme .origin-reading{line-height:1.9}
.graffiti-theme .origin-reading :where(p,dd,li){line-height:1.9}

/* Brand first, with a direct custom-design action immediately underneath. */
.graffiti-theme .hero h1.hero-brand-heading{font-size:clamp(40px,5.1vw,72px);max-width:100%;margin-bottom:18px;line-height:1.15}
.graffiti-theme .hero .hero-brand-design-link{font-size:clamp(17px,1.8vw,24px);line-height:1.45;margin:0 0 25px;padding:5px 0 9px;max-width:100%;border-bottom:3px solid var(--gold);text-wrap:balance}
.graffiti-theme .hero .hero-brand-design-link:focus-visible{outline:3px solid var(--gold);outline-offset:6px}
@media(max-width:720px){.graffiti-theme .hero h1.hero-brand-heading{font-size:clamp(36px,9.5vw,66px)}.graffiti-theme .hero .hero-brand-design-link{font-size:clamp(17px,4.5vw,24px)}}

/* Ice-blue painted faces and heavy black outlines echo the supplied artwork.
   Effects belong to live HTML lettering, never the uploaded product/logo images. */
.graffiti-theme{
  --letter-cyan:#dcf5ff;
  --letter-ink:#080d16;
  --letter-gold:#ffd340;
  --letter-pink:#077edb;
  font-size:17px;
  font-weight:400;
  letter-spacing:.35px;
}
.graffiti-theme :is(h1,h2,h3,h4,h5,h6):not(.logo-heading):not(:has(img,svg)),
.graffiti-theme :is(.hero-roots-line,.origin-stamp,.brand-origins-tagline,.design-your-own-callout strong,.new-designs-callout>div>p:last-child){
  color:var(--letter-cyan) !important;
  font-weight:400 !important;
  font-style:normal !important;
  letter-spacing:.65px;
  -webkit-text-stroke:clamp(.8px,.045em,2.8px) var(--letter-ink) !important;
  paint-order:stroke fill;
  text-shadow:2px 2px 0 var(--letter-ink),3px 3px 0 var(--letter-gold),5px 5px 0 var(--letter-pink) !important;
}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
  .graffiti-theme :is(h1,h2,h3,h4,h5,h6):not(.logo-heading):not(:has(img,svg)),
  .graffiti-theme :is(.hero-roots-line,.brand-origins-tagline,.new-designs-callout>div>p:last-child){
    background-image:linear-gradient(176deg,#ffffff 6%,#e4f7ff 26%,#82d7ff 46%,#18acff 53%,#0988e8 74%,#0062bc 100%);
    background-clip:text;-webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    text-shadow:none !important;
    filter:drop-shadow(1px 2px 0 #03060c) drop-shadow(2px 2px 0 #03060c) drop-shadow(1px 1px 0 #08a9ff);
  }
  .graffiti-theme :is(h1,h2) em{
    color:inherit !important;-webkit-text-fill-color:inherit;
    -webkit-text-stroke:inherit !important;text-shadow:none !important;
  }
}
.graffiti-theme .hero h1.hero-design-heading:after{
  background:linear-gradient(#2acded,#1161dc) 8% 0/3px 9px no-repeat,
    linear-gradient(#2acded,#1161dc) 39% 0/2px 12px no-repeat,
    linear-gradient(#2acded,#1161dc) 83% 0/3px 7px no-repeat;
}
.graffiti-theme :is(.header nav a,.button,.beat-toggle,.approval-button,.approval-home,.origin-route a,.design-section-nav>a,.product-type-tabs>button,.product-type-tabs>a,.filters button,.denim-piece-picker button,.denim-placement-tools button,.product-variant-options button,.reel-type-buttons button){
  color:var(--letter-cyan) !important;
  font-weight:400 !important;
  font-style:normal;
  -webkit-text-stroke:.65px var(--letter-ink);
  paint-order:stroke fill;
  text-shadow:1px 1px 0 var(--letter-ink),1.5px 1.5px 0 var(--letter-gold),2px 2px 0 var(--letter-pink);
  line-height:1.4;
  letter-spacing:.65px;
  min-height:44px;
}
/* Keep backgrounds and outlines responsible for selected / focused states. */
.graffiti-theme .header nav a{
  font-size:19px;line-height:1.35;padding:11px 14px;white-space:normal;text-align:center;
}
.graffiti-theme .header nav{flex-wrap:wrap;row-gap:6px}
.graffiti-theme :is(.product-type-tabs>button,.product-type-tabs>a,.filters button,.design-section-nav>a,.origin-route a,.denim-piece-picker button,.denim-placement-tools button,.product-variant-options button,.reel-type-buttons button){
  font-size:18px;white-space:normal;overflow-wrap:break-word;
}
.graffiti-theme :is(.button,.approval-button,.approval-home){font-size:18px;line-height:1.45;white-space:normal}
.graffiti-theme .beat-toggle{font-size:18px;padding:10px 12px;white-space:nowrap}
.graffiti-theme .beat-status,.graffiti-theme .beat-volume{font-size:14px;letter-spacing:.35px;line-height:1.45}
.graffiti-theme .brand>span.brand-motto{font-size:15px;line-height:1.35;letter-spacing:.6px}
.graffiti-theme .design-section-nav>a>span{font-size:14px}
.graffiti-theme .denim-variant-picker span{font-size:18px;line-height:1.45}
.graffiti-theme .denim-piece-picker button{min-width:0;flex:1 1 130px}
.graffiti-theme :is(.product-title,.cart-item h3){font-size:19px;line-height:1.4;letter-spacing:.5px}

/* All controls share the font; customer-entered values keep a solid readable fill. */
.graffiti-theme :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea){
  font-size:18px !important;
  font-weight:400 !important;
  line-height:1.5 !important;
  letter-spacing:.4px;
  text-transform:none !important;
  -webkit-text-stroke:0 !important;
  -webkit-text-fill-color:currentColor !important;
  text-shadow:none !important;
  filter:none;
}
.graffiti-theme :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select){min-height:46px}
.graffiti-theme :is(option,optgroup){font-size:18px;font-weight:400;line-height:1.5;text-transform:none}
.graffiti-theme :is(input,textarea)::placeholder{font-size:17px;letter-spacing:.35px;-webkit-text-fill-color:currentColor}
.graffiti-theme :is(.builder-label,.design-request>label,.design-contact-fields label,.design-filter-selects label,.denim-start-fields label,.denim-size-fields label,.denim-quantity-label,.denim-zone-note,.photo-file-label,.photo-sliders label,.option-group legend,.keychain-personalization>label){
  font-size:18px;line-height:1.5;letter-spacing:.45px;
}
.graffiti-theme :is(.designer-fieldset>legend,.lettering-options>legend,.denim-placement-controls legend){font-size:22px;line-height:1.45;letter-spacing:.6px}
.graffiti-theme :is(.motif-option,.palette-option,.denim-zone-options>label){min-height:48px;line-height:1.5}
.graffiti-theme .motif-option>strong{font-size:18px;font-weight:400;line-height:1.45}
.graffiti-theme .motif-option>small{font-size:14px;line-height:1.55}
.graffiti-theme .palette-option{font-size:17px;white-space:normal;padding:11px 10px;letter-spacing:.3px}
.graffiti-theme .palette-option>span{overflow-wrap:break-word}
.graffiti-theme .denim-zone-options>label{font-size:17px;align-items:center;padding:10px}
.graffiti-theme .denim-zone-options input{flex-shrink:0}
.graffiti-theme :is(.lettering-selected-copy strong,.lettering-style-copy strong,.lettering-style-name){font-size:19px;line-height:1.4;font-weight:400;letter-spacing:.45px}
.graffiti-theme :is(.lettering-selected-copy small,.lettering-style-copy small,.lettering-style-detail){font-size:15px;line-height:1.5;letter-spacing:.2px}
.graffiti-theme .lettering-style-row{min-height:86px;align-items:center}
.graffiti-theme .lettering-selected{min-height:86px}
.graffiti-theme .lettering-dropdown-arrow{font-family:Arial,sans-serif !important}

/* Paragraphs and disclosures stay calm enough to read comfortably. */
.graffiti-theme :is(.hero-description,.story-copy>p:not(.eyebrow),.collection-note,.design-section-description,.builder-hint,.design-request>p,.design-send-disclosure,.design-approval-notice p,.denim-designer-heading>p:not(.eyebrow),.denim-zone-notes>p,.denim-map-help,.detail-description,.photo-help,.photo-privacy,.photo-status,.cart-notice,.catalog-footnote,.approval-small,.approval-confirm span){
  font-size:16px;line-height:1.75;letter-spacing:.35px;
}
.graffiti-theme :is(.product-subtitle,.product-tag,.detail-note,.cart-item p,.required-note,.builder-label>small,.builder-label>span,.design-request>label span,.footer-bottom,.lettering-options-hint,.results-meta){font-size:14px;line-height:1.6;letter-spacing:.4px}
.graffiti-theme :is(.origin-reading p,.origin-reading dd,.origin-reading li){line-height:1.75;letter-spacing:.45px}
.graffiti-theme .approval-details dt,.graffiti-theme .approval-details dd{font-size:17px;line-height:1.6}
.graffiti-theme .approval-badge{font-size:15px;letter-spacing:.5px}
.graffiti-theme .approval-confirm{min-height:48px}
@media(max-width:720px){
  .graffiti-theme .header nav a{font-size:18px;padding:10px 12px}
  .graffiti-theme :is(.product-type-tabs>button,.product-type-tabs>a,.filters button,.design-section-nav>a,.denim-piece-picker button,.denim-placement-tools button,.product-variant-options button){font-size:17px}
  .graffiti-theme .product-title{font-size:18px}
  .graffiti-theme .beat-toggle{font-size:17px}
  .graffiti-theme .brand>span.brand-motto{font-size:14px}
  .graffiti-theme .beat-details{max-width:100%;min-width:0}
  .graffiti-theme .beat-volume{flex-wrap:wrap;row-gap:3px}
  .graffiti-theme .design-section-nav>a{padding:13px 11px}
}
@media(max-width:480px){
  .graffiti-theme .lettering-style-row,.graffiti-theme .lettering-selected{gap:8px}
  .graffiti-theme .lettering-reference-sample{flex-basis:88px;width:88px}
  .graffiti-theme .lettering-style-copy small,.graffiti-theme .lettering-selected-copy small{font-size:14px}
  .graffiti-theme .lettering-style-copy strong,.graffiti-theme .lettering-selected-copy strong{font-size:18px}
  .graffiti-theme .denim-placement-tools button{flex-basis:calc(50% - 8px)}
}
@media(forced-colors:active){
  .graffiti-theme :is(h1,h2,h3,h4,h5,h6,.hero-roots-line,.brand-origins-tagline,.new-designs-callout>div>p:last-child){background:none;color:CanvasText !important;-webkit-text-fill-color:CanvasText;-webkit-text-stroke:0 !important;filter:none;text-shadow:none !important}
  .graffiti-theme :is(.header nav a,.button,.approval-button,.beat-toggle){color:ButtonText !important;-webkit-text-stroke:0;text-shadow:none}
}
.graffiti-theme .collection-tile h3{white-space:normal;overflow-wrap:break-word;text-wrap:balance;line-height:1.3}
.graffiti-theme .design-section-nav>a{min-width:0;white-space:normal;overflow-wrap:break-word}
.graffiti-theme .product-title{-webkit-text-fill-color:var(--letter-cyan);-webkit-text-stroke:.65px var(--letter-ink);paint-order:stroke fill;text-shadow:1px 1px 0 #080d16}
/* Count pills and annotations keep a solid fill inside decorated headings. */
.graffiti-theme .design-section-heading h3>span,
.graffiti-theme .artwork-group-title>span,
.graffiti-theme .city-group-title>span,
.graffiti-theme .face-photo h3>span,
.graffiti-theme :is(h1,h2,h3,h4,h5,h6) :is(small,.required-note,.approval-badge){
  -webkit-text-fill-color:currentColor !important;
  -webkit-text-stroke:0 !important;
  text-shadow:none !important;
  filter:none;
}

/* Collection actions need black faces against their cyan backgrounds.
   A cream outline and gold edge keep the graffiti lettering easy to read. */
.graffiti-theme :is(.hero .button.gold,.button[data-collection],.filters button,.product-type-tabs>button,.product-type-tabs>a,.design-section-nav>a){
  color:#080d16 !important;
  -webkit-text-fill-color:#080d16;
  -webkit-text-stroke:1px #fff8df;
  paint-order:stroke fill;
  text-shadow:1px 1px 0 #fff8df,2px 2px 0 #ffd340;
}
.graffiti-theme .filters button{
  background:#f6efdf;
  border:2px solid #c2bdaa;
}
.graffiti-theme .product-type-tabs>a{
  background:#f6efdf;
  border:2px solid #080d16;
  padding:13px 19px;
}
.graffiti-theme .filters button[aria-pressed=true]{
  background:var(--cyan);
  border-color:#fff8df;
  box-shadow:0 3px 0 #ffd340;
}
.graffiti-theme :is(.hero .button.gold,.button[data-collection],.filters button,.product-type-tabs>button,.product-type-tabs>a,.design-section-nav>a):hover{
  background:#ffe48c;
  border-color:#080d16;
}
.graffiti-theme :is(.hero .button.gold,.button[data-collection],.filters button,.product-type-tabs>button,.product-type-tabs>a,.design-section-nav>a):focus-visible{
  outline:3px solid #ffd340;
  outline-offset:4px;
}
@media(forced-colors:active){
  .graffiti-theme :is(.hero .button.gold,.button[data-collection],.filters button,.product-type-tabs>button,.product-type-tabs>a,.design-section-nav>a){
    color:ButtonText !important;
    -webkit-text-fill-color:ButtonText;
    -webkit-text-stroke:0;
    text-shadow:none;
  }
  .graffiti-theme .filters button[aria-pressed=true]{border-color:Highlight;box-shadow:none}
  .graffiti-theme :is(.hero .button.gold,.button[data-collection],.filters button,.product-type-tabs>button,.product-type-tabs>a,.design-section-nav>a):focus-visible{outline-color:Highlight}
}

/* Reference-art finish: broad strokes and compact blue/black depth.
   The brand uses the actual isolated artwork treatment, not a font approximation. */
.graffiti-theme{letter-spacing:0;font-synthesis:none}
.graffiti-theme :is(h1,h2,h3,h4,h5,h6){font-weight:400;font-style:normal;letter-spacing:0;line-height:1.35}
.graffiti-theme :is(h1,h2,h3,h4,h5,h6):not(.logo-heading):not(:has(img,svg)){
  letter-spacing:0;
  -webkit-text-stroke:clamp(1px,.055em,3px) #03060c !important;
}
.graffiti-theme :is(.section-heading h2,.denim-concept-copy h2,.questions h2){font-size:clamp(28px,3.2vw,43px)}
.graffiti-theme .design-section-heading h3,
.graffiti-theme .design-section:nth-child(2n) .design-section-heading h3{font-size:clamp(26px,3vw,40px);line-height:1.45}
.graffiti-theme :is(.custom-studio,.collections,.new-accessories) .section-heading h2,
.graffiti-theme .denim-concept-copy h2,
.graffiti-theme .story-copy h2{
  background-image:linear-gradient(175deg,#fff4a2 0%,#ffe526 32%,#ffc300 53%,#ff7c16 80%,#f84420 100%) !important;
}
.graffiti-theme .hero h1.hero-brand-heading.reference-brand-heading,
.graffiti-theme .bronx-brand-copy h2.reference-brand-heading{
  width:100%;max-width:580px;font-size:inherit;line-height:1;
  margin:20px 0 24px;transform:none;
  background:none;color:inherit;-webkit-text-fill-color:currentColor;
  -webkit-text-stroke:0;filter:none;text-shadow:none;
}
.graffiti-theme .hero h1.hero-brand-heading.reference-brand-heading:after{content:none}
.reference-wordmark{display:block;width:100%;height:auto;max-width:100%;object-fit:contain}
.graffiti-theme .bronx-brand-copy .reference-brand-heading{margin-inline:auto}
.origin-footer .origin-wordmark{width:min(440px,100%);height:auto;margin:0 auto 22px}
.graffiti-theme .hero .hero-brand-design-link{font-size:clamp(17px,1.7vw,22px);line-height:1.65}
.graffiti-theme .hero-roots-line{
  background:var(--gold);color:#080d16 !important;-webkit-text-fill-color:#080d16;
  -webkit-text-stroke:0 !important;filter:none;text-shadow:none !important;
  font-size:clamp(19px,2vw,27px);line-height:1.4;
}
.graffiti-theme .header nav a{
  font-size:20px;font-weight:400;letter-spacing:0;line-height:1.55;
  color:#e7f6ff !important;-webkit-text-fill-color:#e7f6ff;
  -webkit-text-stroke:.7px #03060c;
  text-shadow:1px 2px 0 #03060c,2px 3px 0 #077edb;
  padding:9px 12px;max-width:100%;white-space:normal;
}
.graffiti-theme .header nav{flex-wrap:wrap;gap:4px 8px}
.graffiti-theme .header nav a:is([aria-current],:hover){
  color:#080d16 !important;-webkit-text-fill-color:#080d16;
  -webkit-text-stroke:.7px #fff8df;text-shadow:1px 1px 0 #fff8df;
}
.graffiti-theme :is(.button,.approval-button,.approval-home,.origin-route a,.design-section-nav>a,.product-type-tabs>button,.product-type-tabs>a,.filters button,.denim-piece-picker button,.denim-placement-tools button,.product-variant-options button,.reel-type-buttons button){
  letter-spacing:0;font-weight:400;line-height:1.55;text-wrap:balance;
}
.graffiti-theme :is(.button,.approval-button,.approval-home,.origin-route a){
  color:#edf8ff !important;-webkit-text-fill-color:#edf8ff;
  -webkit-text-stroke:.7px #03060c;
  text-shadow:1px 2px 0 #03060c,2px 2px 0 #078fe6;
}
/* Preserve the requested black lettering on blue collection actions. */
.graffiti-theme :is(.hero .button.gold,.button[data-collection],.button.gold,.filters button,.product-type-tabs>button,.product-type-tabs>a,.design-section-nav>a,.origin-route a[aria-current]){
  color:#080d16 !important;-webkit-text-fill-color:#080d16;
  -webkit-text-stroke:1px #fff8df;
  text-shadow:1px 1px 0 #fff8df,2px 2px 0 #ffd340;
}
.graffiti-theme :is(.product-title,.cart-item h3){font-size:18px;line-height:1.65;letter-spacing:0}
.graffiti-theme .product-title{color:#def4ff;-webkit-text-fill-color:#def4ff}
.graffiti-theme .collection-tile h3{font-size:22px;line-height:1.45;max-width:100%}
.graffiti-theme :is(input,select,textarea){letter-spacing:0}
.graffiti-theme :is(.product-subtitle,.product-tag,.detail-note,.cart-item p,.required-note,.builder-label>small,.builder-label>span,.design-request>label span,.footer-bottom,.lettering-options-hint,.results-meta){line-height:1.75;letter-spacing:0}
.graffiti-theme :is(.hero-description,.design-section-description,.design-approval-notice p,.origin-reading p,.origin-reading dd,.origin-reading li){letter-spacing:0;line-height:1.9}
.graffiti-theme .lettering-dropdown-arrow{font-family:Arial,sans-serif !important}
.story-page .origin-hero h1{font-size:clamp(36px,4.5vw,66px);line-height:1.4;max-width:18ch}
.story-page .origin-article h2{font-size:clamp(28px,3.1vw,42px);line-height:1.45}
.story-page .origin-article h3{line-height:1.65}
@media(max-width:720px){
  .graffiti-theme .hero h1.hero-brand-heading.reference-brand-heading{max-width:520px;margin:20px auto 24px}
  .graffiti-theme .header nav a{font-size:18px;padding:9px 10px}
  .graffiti-theme :is(.filters button,.product-type-tabs>button,.product-type-tabs>a,.design-section-nav>a,.origin-route a){font-size:16px}
  .graffiti-theme .product-title{font-size:16px;line-height:1.7}
  .graffiti-theme .collection-tile h3{font-size:20px}
  .graffiti-theme .lettering-style-row,.graffiti-theme .lettering-selected{height:auto;min-height:94px}
}
@media(forced-colors:active){
  .graffiti-theme :is(h1,h2,h3,h4,h5,h6,.hero-roots-line,.brand-origins-tagline,.new-designs-callout>div>p:last-child){background:none;color:CanvasText !important;-webkit-text-fill-color:CanvasText;-webkit-text-stroke:0 !important;filter:none;text-shadow:none !important}
  .graffiti-theme :is(.header nav a,.button,.approval-button,.approval-home,.origin-route a,.filters button,.product-type-tabs>button,.product-type-tabs>a,.design-section-nav>a){color:ButtonText !important;-webkit-text-fill-color:ButtonText;-webkit-text-stroke:0;text-shadow:none}
}

/* The radio play key keeps dark letters on its gold face. */
.graffiti-theme #site-beat .beat-toggle{color:#101820 !important;-webkit-text-fill-color:#101820}
@media(forced-colors:active){.graffiti-theme #site-beat .beat-toggle{color:ButtonText !important;-webkit-text-fill-color:ButtonText}}
.graffiti-theme .collection-tile h3,.graffiti-theme .design-section-heading h3,.graffiti-theme .city-group-title{font-family:Arial,Helvetica,sans-serif!important;font-weight:800!important;font-style:normal!important;color:#f2cd67!important;text-shadow:none!important;-webkit-text-stroke:0!important;line-height:1.3!important}
