@font-face{font-family:Jost;src:url('../../fonts/jost/jost.woff2') format('woff2');font-display:swap}@font-face{font-family:Oswald;src:url('../../fonts/oswald/oswald.woff2') format('woff2');font-display:swap}
:root{--yellow:#ffd400;--ink:#101214;--paper:#faf9f5;--muted:#686868;--line:#deded7;--surface:#f1f1ed}.satill-site{margin:0!important;background:var(--paper)!important;color:var(--ink)!important}#satill{font:16px/1.55 Jost,Arial,sans-serif;color:var(--ink);text-align:left}#satill *{box-sizing:border-box}#satill h1,#satill h2,#satill h3,#satill p{margin:0;color:inherit}#satill a{color:inherit;text-decoration:none}#satill button,#satill input,#satill select,#satill textarea{font:inherit;border-radius:0;letter-spacing:normal;text-transform:none}#satill button{cursor:pointer;color:inherit}#satill button:disabled{opacity:.45;cursor:not-allowed}#satill img{display:block;width:100%;object-fit:cover;max-width:100%}#satill svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;vertical-align:middle}#satill :focus-visible{outline:3px solid #b88e00;outline-offset:4px}#satill h1,#satill h2{font-weight:400;line-height:1.06;letter-spacing:-.045em}#satill h1{font-size:clamp(44px,6.5vw,94px)}#satill h2{font-size:clamp(32px,3.4vw,49px)}#satill h3{font-size:20px;font-weight:500}#satill .wrap{max-width:1440px;margin:auto;padding-left:6%;padding-right:6%}#satill .announcement{height:34px;background:var(--ink);color:white;text-align:center;font-size:12px;letter-spacing:.12em;display:flex;align-items:center;justify-content:center;gap:13px}#satill .announcement span{color:var(--yellow)}#satill .header{position:absolute;z-index:30;top:34px;left:0;width:100%;height:103px;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 6%;border-bottom:1px solid #ffffff40;transition:background .3s,height .3s,color .3s}#satill .header.solid{position:fixed;top:0;height:78px;background:var(--yellow);color:var(--ink);border:0;box-shadow:0 2px 15px #00000009}#satill .brand{display:flex;gap:10px;align-items:center}#satill .brand img{width:65px;height:65px;border-radius:50%}#satill .brand b{font:bold italic 32px Oswald,Arial,sans-serif;letter-spacing:-1px}#satill .brand small{display:block;font-size:9px;letter-spacing:3px;margin-top:-3px}#satill nav{display:flex;gap:30px;font-size:14px}#satill nav a:hover{box-shadow:0 1px currentColor}#satill .actions{display:flex;gap:20px;align-items:center}#satill .icon{border:0;background:transparent;padding:10px;min-width:44px;min-height:44px;position:relative}#satill .count{background:var(--yellow);color:var(--ink);font-size:10px;position:absolute;border-radius:50%;width:16px;height:16px;right:0;top:1px}#satill .menu-toggle{display:none}#satill .hero{height:min(850px,calc(100svh - 34px));min-height:650px;position:relative;color:#fff;background:#5f574c;overflow:hidden}#satill .hero>img{position:absolute;height:100%;object-position:50% 57%}#satill .hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#171b1ac2 0%,#171b1a57 53%,#171b1a18 100%)}#satill .hero-copy{position:relative;z-index:1;padding-top:205px;max-width:820px}#satill .eyebrow{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.19em;margin-bottom:23px}#satill .hero .eyebrow:before{content:'';display:inline-block;background:var(--yellow);width:29px;height:2px;vertical-align:middle;margin-right:13px}#satill .hero h1 em{font-style:normal;color:#f5e5c4}#satill .hero-copy p{font-size:18px;max-width:400px;margin:23px 0 29px;color:#f2f0e9}#satill .btn{display:inline-flex;align-items:center;justify-content:center;gap:35px;background:var(--yellow);color:var(--ink);padding:16px 25px;border:1px solid transparent;font-size:14px;min-height:50px;font-weight:500}#satill .btn:hover{background:#ecc500}#satill .btn.secondary{background:transparent;border-color:var(--line)}#satill .btn.dark{background:var(--ink);color:white}#satill .hero-bottom{position:absolute;z-index:2;bottom:33px;left:6%;right:6%;display:flex;align-items:end;justify-content:space-between;font-size:12px;letter-spacing:.08em}#satill .hero-bottom .dots{display:flex;gap:8px;margin-top:12px}#satill .dots i{height:3px;width:24px;background:#ffffff50}#satill .dots i:first-child{width:52px;background:var(--yellow)}#satill .hero-note{text-align:right;max-width:225px;border-left:1px solid #ffffff70;padding-left:24px}#satill .benefits{display:grid;grid-template-columns:repeat(4,1fr);padding-top:25px;padding-bottom:25px;border-bottom:1px solid var(--line);gap:22px}#satill .benefit{display:flex;align-items:center;gap:15px;font-size:13px}#satill .benefit small{display:block;color:var(--muted);font-size:12px}#satill .benefit svg{width:26px;height:26px}#satill .section{padding-top:82px;padding-bottom:20px}#satill .section-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:30px;gap:24px}#satill .section-head .eyebrow{color:var(--muted);margin-bottom:12px}#satill .text-link{font-size:14px;border-bottom:1px solid;padding-bottom:5px;white-space:nowrap}#satill .categories{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}#satill .category{position:relative;overflow:hidden;aspect-ratio:4/5;background:#ddd}#satill .category img{height:100%;transition:transform .6s}#satill .category:hover img{transform:scale(1.045)}#satill .category:after{content:'';position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#0009)}#satill .category span{position:absolute;z-index:1;bottom:20px;left:20px;right:20px;color:white;display:flex;justify-content:space-between;font-size:20px}#satill .products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}#satill .product-image{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--surface)}#satill .product-image img{height:100%;transition:opacity .4s,transform .6s}#satill .product-image .alternate{position:absolute;inset:0;opacity:0}#satill .product-image:hover .alternate{opacity:1}#satill .badge{position:absolute;top:14px;left:14px;background:var(--paper);padding:4px 9px;font-size:11px;text-transform:uppercase;letter-spacing:.06em}#satill .badge.sale{background:var(--yellow)}#satill .quick-add{position:absolute;bottom:12px;left:12px;right:12px;border:0;padding:12px;background:#faf9f5ed;opacity:0;transform:translateY(5px);transition:.2s}#satill .product-image:hover .quick-add,#satill .product-image:focus-within .quick-add{opacity:1;transform:none}#satill .product-info{padding:14px 0}#satill .product-info small{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}#satill .product-info h3{font-size:17px;margin:3px 0 8px}#satill .price{font-weight:500;font-size:16px}#satill del{color:#777;font-size:13px;margin-left:7px}#satill .swatches{display:flex;gap:6px;margin-top:12px}#satill .swatches i{width:12px;height:12px;border-radius:50%;background:var(--swatch);border:1px solid #0002}#satill .editorial{display:grid;grid-template-columns:1.1fr 1fr;margin-top:70px;background:#eeeae0}#satill .editorial-media{height:560px}#satill .editorial-copy{padding:70px 14%;display:flex;align-items:start;justify-content:center;flex-direction:column}#satill .editorial-copy p{color:var(--muted);margin:22px 0 30px}#satill .season{background:var(--yellow);padding:35px 6%;display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:65px}#satill .season h2{font-size:36px}#satill .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:30px}#satill blockquote{margin:0;border:0;padding:0;font-size:19px}#satill .stars{font-size:15px;letter-spacing:4px;margin-bottom:18px}#satill blockquote footer{font-size:13px;margin-top:22px;color:var(--muted)}#satill .newsletter{padding:65px 6%;margin-top:90px;background:var(--surface);display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}#satill .newsletter h2{font-size:34px}#satill .newsletter p{color:var(--muted);margin-top:12px}#satill .inline-form{display:flex;border-bottom:1px solid var(--ink)}#satill .inline-form input{background:transparent;border:0;flex:1;min-width:0;padding:17px 0}#satill .inline-form button{background:transparent;border:0}#satill .site-footer{background:var(--ink);color:#eee;padding-top:60px;padding-bottom:25px}#satill .footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:50px;padding-bottom:50px}#satill .footer-grid h3{font-size:15px;margin-bottom:20px}#satill .footer-grid a:not(.brand){display:block;color:#bbb;font-size:14px;margin:9px 0}#satill .footer-grid p{color:#aaa;font-size:14px;margin-top:16px;max-width:250px}#satill .footer-bottom{display:flex;justify-content:space-between;border-top:1px solid #ffffff25;padding-top:24px;font-size:12px;color:#aaa}#satill .page{padding-top:135px;padding-bottom:70px;min-height:70vh}#satill .breadcrumb{color:var(--muted);font-size:13px;margin-bottom:28px}#satill .page h1{font-size:54px;margin-bottom:25px}#satill .catalog-layout{display:grid;grid-template-columns:210px 1fr;gap:45px;margin-top:35px}#satill .catalog-layout .products{grid-template-columns:repeat(3,minmax(0,1fr))}#satill .filters fieldset{border:0;border-bottom:1px solid var(--line);padding:0 0 23px;margin:0 0 22px}#satill .filters legend{font-size:16px;font-weight:500;margin-bottom:12px}#satill .filters label{display:block;font-size:14px;margin:8px 0}#satill input[type=checkbox],#satill input[type=radio]{accent-color:var(--ink);margin-right:8px}#satill .toolbar{display:flex;gap:15px;align-items:center;justify-content:space-between;margin:20px 0}#satill input:not([type=checkbox]):not([type=radio]):not([type=range]),#satill select,#satill textarea{padding:13px;background:transparent;border:1px solid var(--line);max-width:100%;color:var(--ink)}#satill .chips{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}#satill .chip{border:1px solid var(--line);background:var(--surface);padding:6px 10px;font-size:12px}#satill .detail-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:65px}#satill .main-product{height:560px;cursor:zoom-in}#satill .thumbnails{display:flex;gap:10px;margin-top:12px}#satill .thumbnails button{width:80px;border:1px solid var(--line);padding:0;background:none}#satill .thumbnails img{height:85px}#satill .detail-copy h1{font-size:43px;margin:12px 0 18px}#satill .detail-copy p{color:var(--muted);margin:18px 0}#satill .detail-copy label{display:block;margin:18px 0 6px}#satill .detail-copy .price{font-size:26px}#satill .buy-row{display:flex;gap:12px;margin:24px 0 14px}#satill .buy-row input{width:75px}#satill .buy-row .btn{flex:1}#satill details{border-bottom:1px solid var(--line);padding:18px 0}#satill summary{cursor:pointer;font-weight:500}#satill details p{margin:12px 0;font-size:15px}#satill .tabs-content{margin-top:55px;max-width:800px}#satill .two-col{display:grid;grid-template-columns:1.6fr 1fr;gap:55px}#satill .summary{background:var(--surface);padding:30px;align-self:start;position:sticky;top:100px}#satill .total-row{display:flex;justify-content:space-between;margin:16px 0;gap:20px}#satill .total-row.total{border-top:1px solid var(--line);padding-top:20px;font-size:22px}#satill .cart-row{display:grid;grid-template-columns:85px 1fr auto;gap:18px;border-bottom:1px solid var(--line);padding:20px 0;align-items:center}#satill .cart-row img{height:100px}#satill .cart-row small{color:var(--muted);display:block}#satill .cart-row input{width:67px}#satill .remove{border:0;background:none;font-size:12px;text-decoration:underline;padding:8px 0}#satill .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}#satill .form-grid label{display:flex;flex-direction:column;gap:7px;font-size:14px}#satill .wide{grid-column:1/-1}#satill .form-section{margin-bottom:35px}#satill .form-section h3{margin-bottom:20px}#satill .narrow{max-width:650px;margin:auto}#satill .narrow form{display:grid;gap:17px}#satill .narrow p{margin:20px 0;color:var(--muted)}#satill .empty{text-align:center;padding:65px 20px}#satill .empty h2{margin:20px 0}#satill .empty p{margin-bottom:25px;color:var(--muted)}#satill .modal{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;background:#0007;border:0;margin:0;padding:0;z-index:100;color:var(--ink)}#satill .modal[open]{display:flex;justify-content:flex-end}#satill .panel{width:480px;max-width:100%;height:100%;overflow:auto;background:var(--paper);padding:30px}#satill .panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}#satill .panel h2{font-size:30px}#satill .search-panel{width:700px}#satill .search-panel input{width:100%}#satill .search-results{margin-top:25px}#satill .toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:14px 25px;z-index:110;max-width:90vw;box-shadow:0 5px 25px #0002}#satill .mobile-buy,#satill .filter-toggle{display:none}#satill .skeleton{height:320px;background:linear-gradient(90deg,#e8e7e1,#f7f6f2,#e8e7e1);background-size:200%;animation:shimmer 1.5s infinite}@keyframes shimmer{to{background-position:-200%}}#satill .policy-note{font-size:12px;color:var(--muted);margin-top:12px}#satill .zoom-image{height:85vh;object-fit:contain}#satill .zoom-panel{width:90vw}#satill .order-table{width:100%;border-collapse:collapse}#satill .order-table td,#satill .order-table th{padding:18px;text-align:left;border-bottom:1px solid var(--line)}
@media(min-width:1600px){#satill .hero-copy{padding-top:220px}}@media(max-width:1000px){#satill nav{gap:16px}#satill .actions{gap:4px}#satill .products{gap:16px}#satill .editorial-copy{padding:40px 9%}#satill .catalog-layout{gap:25px;grid-template-columns:175px 1fr}#satill .catalog-layout .products{grid-template-columns:repeat(2,minmax(0,1fr))}#satill .detail-grid{gap:30px}#satill .footer-grid{gap:25px}#satill .hero h1{font-size:74px}}
@media(max-width:700px){#satill .wrap{padding-left:6%;padding-right:6%}#satill .announcement{font-size:10px;letter-spacing:.05em}#satill .header{height:85px;padding:0 4%}#satill .brand img{width:45px;height:45px}#satill .brand b{font-size:25px}#satill .brand small{font-size:7px;letter-spacing:2px}#satill nav,#satill .account-icon{display:none}#satill .menu-toggle{display:inline-block}#satill .actions{gap:0}#satill .icon{padding:8px}#satill .hero{min-height:655px;height:calc(90svh - 34px);max-height:800px}#satill .hero>img{object-position:61% center}#satill .hero-copy{padding-top:190px}#satill .hero h1{font-size:57px}#satill .hero-copy p{font-size:16px;max-width:280px}#satill .hero-note{display:none}#satill .hero .eyebrow{font-size:10px}#satill .benefits{grid-template-columns:1fr 1fr;gap:20px 12px}#satill .benefit{font-size:12px;gap:9px}#satill .benefit small{font-size:10px}#satill .section{padding-top:50px}#satill .section-head{align-items:start}#satill .section-head h2{font-size:32px}#satill .section-head .text-link{font-size:12px;margin-top:30px}#satill .categories{display:flex;gap:12px;overflow-x:auto;padding-bottom:12px}#satill .category{min-width:155px}#satill .category span{font-size:18px;left:12px;right:12px}#satill .products{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 13px}#satill .product-info h3{font-size:15px}#satill .price{font-size:14px}#satill del{display:block;margin:0}#satill .quick-add{opacity:1;transform:none;font-size:12px;bottom:7px;left:7px;right:7px;padding:8px}#satill .badge{font-size:9px;left:8px;top:8px}#satill .editorial{grid-template-columns:1fr;margin-top:40px}#satill .editorial-media{height:380px}#satill .editorial-copy{padding:45px 7%}#satill .season{align-items:start;flex-direction:column;padding:30px 6%;margin-top:35px}#satill .season h2{font-size:30px}#satill .quotes{grid-template-columns:1fr;gap:30px}#satill blockquote{font-size:18px;border-bottom:1px solid var(--line);padding-bottom:25px}#satill .newsletter{grid-template-columns:1fr;gap:24px;margin-top:50px;padding:45px 6%}#satill .footer-grid{grid-template-columns:1fr 1fr;gap:32px}#satill .footer-grid>div:first-child{grid-column:1/-1}#satill .footer-bottom{flex-direction:column;gap:15px}#satill .page{padding-top:110px}#satill .page h1{font-size:39px}#satill .catalog-layout{display:block}#satill .filters{display:none}#satill .filters.is-open{display:block;position:fixed;inset:78px 0 0;background:var(--paper);z-index:40;padding:28px;overflow:auto}#satill .filter-toggle{display:inline-flex}#satill .toolbar{flex-wrap:wrap;font-size:13px}#satill .toolbar input{width:100%}#satill .detail-grid,#satill .two-col{grid-template-columns:1fr;gap:30px}#satill .main-product{height:410px}#satill .detail-copy h1{font-size:35px}#satill .mobile-buy{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--paper);border-top:1px solid var(--line);z-index:35;padding:12px 6%;align-items:center;justify-content:space-between}#satill:has(.mobile-buy){padding-bottom:80px}#satill .form-grid{grid-template-columns:1fr}#satill .summary{position:static}#satill .panel{padding:22px}#satill .order-table td,#satill .order-table th{padding:10px;font-size:13px}}
@media(prefers-reduced-motion:reduce){#satill *,#satill *:before,#satill *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Keep the editorial copy aligned with the shared page grid. */
#satill .hero-copy{max-width:1440px;width:100%}#satill .hero-copy h1{max-width:820px}#satill #colecciones{scroll-margin-top:100px}#satill .skip-link:focus{position:fixed;top:8px;left:8px;z-index:150;background:var(--yellow);color:var(--ink);padding:12px;width:auto;height:auto;clip:auto;clip-path:none}#satill .product-image>a{display:block;height:100%}#satill .btn svg{flex-shrink:0}#satill .form-grid input{width:100%}

/* The parent theme also uses .product-image as a four-column grid. Reset that
   legacy layout so both product photos fill the SATILL card identically. */
#satill .product-image {
  display:block;
  grid-template-columns:none;
  gap:0;
  text-align:left;
}
#satill .product-image > a,
#satill .product-image > a > img {
  width:100%;
  height:100%;
}

/* SATILL display lettering and signature paint details. */
@font-face {
  font-family: 'SATILL Display';
  src: url('../../fonts/edo/edosz.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
#satill h1,
#satill h2 {
  font-family: 'SATILL Display', Oswald, sans-serif;
  font-weight: 400;
  font-style: oblique 10deg;
  text-transform: uppercase;
  letter-spacing: -.025em;
  line-height: 1.1;
  -webkit-text-stroke: .35px currentColor;
  color: var(--ink);
  text-wrap: balance;
}
#satill .hero h1 {
  color: #fff;
  font-size: clamp(58px, 6.4vw, 92px);
  max-width: 1000px;
  text-shadow: 0 2px 18px #0005;
}
#satill .hero h1 em {
  font-style: inherit;
  color: var(--yellow);
}
#satill .hero:after {
  background: linear-gradient(90deg, #101214d1 0%, #10121480 53%, #10121420 100%);
}
#satill .hero-copy > .btn {
  position: relative;
  isolation: isolate;
  background-color: var(--yellow);
  background-image: url('paint-splatter-black-tl.png'), url('paint-splatter-black-br.png');
  background-repeat: no-repeat;
  background-position: left top, right bottom;
  background-size: auto 100%;
  border: 0;
  padding: 20px 44px;
  min-height: 62px;
  gap: 34px;
  font-weight: 500;
  color: var(--ink);
  box-shadow: 0 4px 16px #0002;
  transition: background-color .2s, box-shadow .2s;
}
#satill .hero-copy > .btn:hover {
  background-color: #ffe13b;
  box-shadow: 0 6px 22px #0003;
}
#satill .hero-copy > .btn:focus-visible {
  outline-color: #fff;
  outline-offset: 5px;
}
@media (max-width:700px) {
  #satill .hero h1 {font-size: clamp(40px, 10.2vw, 68px); line-height: 1.12;}
  #satill .hero-copy > .btn {padding: 19px 35px; gap: 25px; max-width:100%;}
  #satill .section-head {flex-wrap:wrap; gap:16px;}
  #satill .section-head .text-link {margin-top:0;}
}

/* Shared paint treatment for every add-to-cart control, including mobile. */
#satill button[data-add] {
  background-color: var(--yellow);
  background-image: url('paint-splatter-black-tl.png'), url('paint-splatter-black-br.png');
  background-repeat: no-repeat;
  background-position: left top, right bottom;
  background-size: auto 100%;
  border: 0;
  color: var(--ink);
  padding-left: 28px;
  padding-right: 28px;
  min-height: 46px;
}
#satill button[data-add]:not(:disabled):hover {background-color: #ffe13b;}
#satill button[data-add]:focus-visible {outline: 3px solid var(--ink); outline-offset: 3px;}
#satill button[data-add]:disabled {opacity: .55;}
@media (max-width:700px) {
  #satill .quick-add[data-add] {padding: 10px 19px; font-size:12px;}
  #satill .mobile-buy button[data-add] {padding: 14px 25px;}
}

/* Graphic SATILL lightning: independent from text fonts. */
#satill svg.brand-bolt {
  display: inline-block;
  width: .8em;
  height: 1.35em;
  vertical-align: -.25em;
  fill: var(--yellow);
  stroke: var(--ink);
  stroke-width: 1.4;
  stroke-linejoin: round;
  paint-order: stroke fill;
  flex: 0 0 auto;
}
/* Align the bolt with the letter baseline, not the full font line box. */
#satill .brand b {display:block;line-height:1.1;white-space:nowrap;}
#satill .brand b .brand-bolt {
  display:inline-block;
  width:.53em;
  height:.94em;
  vertical-align:-.18em;
  margin:0 -.045em 0 -.025em;
}
#satill .announcement .brand-bolt {height:19px;width:11px;vertical-align:middle;}
#satill .eyebrow .brand-bolt {width:15px;height:24px;margin-right:7px;vertical-align:middle;}
#satill .footer-bottom .brand-bolt {width:12px;height:19px;}

/* Transparent wordmark with a baked per-letter outline for consistent rendering. */
#satill .brand-wordmark {
  display:block;
  width:164px;
  height:49px;
  background:url('wordmark-outlined.png') center / 100% auto no-repeat;
  filter:drop-shadow(0 2px 4px rgba(16,18,20,.52));
  -webkit-filter:drop-shadow(0 2px 4px rgba(16,18,20,.52));
}
#satill .brand small {
  display:block;
  margin-top:3px;
  color:currentColor;
  font-size:9px;
  letter-spacing:3px;
  text-align:center;
}
@media(max-width:700px) {
  #satill .brand-wordmark {
    width:124px;
    height:37px;
  }
  #satill .brand small {font-size:7px;letter-spacing:2px;}
}

/* Header shortcuts use visible labels as well as icons. */
#satill .actions {gap:12px;}
#satill .header-action {
  position:relative;
  display:flex;
  min-width:54px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
}
#satill .header-action svg {width:25px;height:25px;}
#satill .action-label {
  display:block;
  font-size:11px;
  line-height:1;
  white-space:nowrap;
}
#satill .header-action .count {right:4px;top:-5px;}

/* White paint corners for black promotional buttons. */
#satill .btn.dark {
  background-color:var(--ink);
  background-image:url('paint-splatter-white-tl.png'), url('paint-splatter-white-br.png');
  background-repeat:no-repeat;
  background-position:left top, right bottom;
  background-size:auto 100%;
  color:#fff;
  padding-left:38px;
  padding-right:38px;
}
#satill .btn.dark:hover {
  background-color:#25282a;
  background-image:url('paint-splatter-white-tl.png'), url('paint-splatter-white-br.png');
}

@media(max-width:700px) {
  #satill .action-label {display:none;}
  #satill .header-action {min-width:32px;gap:0;}
  #satill .store-icon {display:none;}
  #satill .actions {gap:0;}
}

/* Scroll effects: fixed geometry keeps navigation stable across the hero edge. */
#satill .header,
#satill .header.solid {
  position:fixed;
  height:103px;
  transition:background-color .24s ease,color .24s ease,box-shadow .24s ease;
}
#satill .header {background-color:transparent;}
#satill .header.solid {background-color:var(--yellow);}
#satill .page {scroll-margin-top:115px;}
#satill #colecciones {scroll-margin-top:115px;}
#satill .scroll-reveal {
  opacity:1;
  transform:none;
  transition:opacity .48s ease var(--reveal-delay,0ms),transform .48s cubic-bezier(.2,.65,.3,1) var(--reveal-delay,0ms);
}
#satill .reveal-pending {opacity:0;transform:translateY(14px);}
#satill .scroll-reveal:focus-within,
#satill .reveal-immediate {opacity:1;transform:none;transition:none;}
#satill .editorial-media {position:relative;overflow:hidden;min-width:0;}
#satill .editorial-media > img {height:100%;}
#satill .editorial-media.parallax-active > img {
  position:absolute;
  top:-12px;
  height:calc(100% + 24px);
  transform:translateY(var(--parallax-y,0px));
}
@media(max-width:700px) {
  #satill .header,#satill .header.solid {height:85px;}
  #satill #colecciones {scroll-margin-top:97px;}
}

/* Paint lives on its own layer so it can fade instead of disappearing abruptly. */
#satill .btn:not(.secondary),
#satill button[data-add] {
  isolation:isolate;
  overflow:hidden;
  background-image:none;
  transition:background-color .25s ease,color .25s ease,box-shadow .25s ease;
}
#satill .btn:not(.secondary),
#satill button[data-add]:not(.quick-add) {
  position:relative;
}
/* Product-card buttons must stay pinned over the photo. */
#satill .quick-add[data-add] {
  position:absolute;
}
#satill .btn.dark,
#satill .btn.dark:hover {
  background-image:none;
}
#satill .btn:not(.secondary)::before,
#satill .btn:not(.secondary)::after,
#satill button[data-add]::before,
#satill button[data-add]::after {
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  width:68px;
  max-width:22%;
  background-repeat:no-repeat;
  background-size:auto 100%;
  pointer-events:none;
  opacity:1;
  transition:opacity .65s ease;
}
#satill .btn:not(.secondary)::before,
#satill button[data-add]::before {
  left:0;
  background-image:url('paint-splatter-black-tl.png');
  background-position:left top;
}
#satill .btn:not(.secondary)::after,
#satill button[data-add]::after {
  right:0;
  background-image:url('paint-splatter-black-br.png');
  background-position:right bottom;
}
#satill .btn.dark::before {background-image:url('paint-splatter-white-tl.png');}
#satill .btn.dark::after {background-image:url('paint-splatter-white-br.png');}
#satill .btn:not(.secondary):hover::before,
#satill .btn:not(.secondary):hover::after,
#satill button[data-add]:not(:disabled):hover::before,
#satill button[data-add]:not(:disabled):hover::after {
  opacity:0;
}

/* Mobile navigation: eased drawer, dimmed backdrop and staggered links. */
@media(max-width:700px) {
  #satill .menu-modal {
    align-items:stretch;
    background:rgba(5,7,8,.18);
    opacity:0;
    transition:opacity .32s ease,background-color .32s ease;
  }
  #satill .menu-modal.is-visible {
    background:rgba(5,7,8,.66);
    opacity:1;
  }
  #satill .menu-panel {
    position:relative;
    width:min(89vw,390px);
    height:100%;
    max-width:none;
    padding:28px 25px 34px;
    overflow:hidden auto;
    border-top:5px solid var(--yellow);
    background:#fff;
    color:var(--ink);
    box-shadow:-20px 0 60px #0005;
    transform:translateX(104%);
    transition:transform .46s cubic-bezier(.22,.78,.2,1);
  }
  #satill .menu-modal.is-visible .menu-panel {transform:translateX(0);}
  #satill .menu-modal.is-closing .menu-panel {
    transform:translateX(104%);
    transition-timing-function:cubic-bezier(.55,.06,.68,.19);
    transition-duration:.34s;
  }
  #satill .menu-panel::before {
    content:"";
    position:absolute;
    width:170px;
    height:170px;
    right:-76px;
    top:90px;
    border-radius:50%;
    background:var(--yellow);
    opacity:.16;
    filter:blur(1px);
    pointer-events:none;
  }
  #satill .menu-panel .panel-head {
    position:relative;
    z-index:1;
    align-items:center;
    margin-bottom:34px;
    padding-bottom:20px;
    border-bottom:1px solid #10121424;
  }
  #satill .menu-panel .panel-head h2 {
    max-width:230px;
    color:var(--ink);
    font-size:38px;
    line-height:.95;
  }
  #satill .menu-panel .panel-head .icon {
    color:var(--ink);
    border:1px solid #10121436;
    transition:transform .32s ease,border-color .25s ease,background-color .25s ease;
  }
  #satill .menu-panel .panel-head .icon:active {
    transform:rotate(90deg) scale(.94);
    background:var(--yellow);
    border-color:var(--yellow);
  }
  #satill .mobile-menu-links {display:grid;}
  #satill .mobile-menu-links a {
    position:relative;
    display:grid;
    grid-template-columns:1fr 30px;
    align-items:center;
    gap:10px;
    min-height:66px;
    border-bottom:1px solid #1012141f;
    opacity:0;
    transform:translateX(24px);
    transition:opacity .38s ease,transform .42s cubic-bezier(.2,.7,.2,1),color .2s ease;
    transition-delay:calc(95ms + var(--menu-order) * 52ms);
  }
  #satill .menu-modal.is-visible .mobile-menu-links a {
    opacity:1;
    transform:translateX(0);
  }
  #satill .mobile-menu-links a strong {
    font-size:22px;
    font-weight:400;
    letter-spacing:.01em;
  }
  #satill .mobile-menu-links a svg {
    width:28px;
    height:28px;
    padding:6px;
    border-radius:50%;
    background:var(--yellow);
    color:var(--ink);
    transform:translateX(-5px);
    transition:transform .25s ease;
  }
  #satill .mobile-menu-links a:active svg {transform:translateX(1px);}
  #satill .mobile-menu-links a[aria-current="page"] {background:linear-gradient(90deg,#ffd40024,transparent 72%);}
  #satill .mobile-menu-links a[aria-current="page"]::after {
    content:"";
    position:absolute;
    left:0;
    bottom:-1px;
    width:54px;
    height:2px;
    background:var(--yellow);
  }
  #satill .mobile-menu-note {
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:34px;
    color:#10121499;
    font-size:9px;
    letter-spacing:.16em;
  }
  #satill .mobile-menu-note .brand-bolt {
    width:12px;
    height:21px;
    margin:0;
  }
}
@media(prefers-reduced-motion:reduce) {
  #satill .scroll-reveal {opacity:1;transform:none;transition:none;}
  #satill .editorial-media.parallax-active > img {position:static;height:100%;transform:none;}
  #satill .category:hover img {transform:none;}
  #satill .btn::before,#satill .btn::after,#satill button[data-add]::before,#satill button[data-add]::after {transition:none;}
}
