.oil-intro h2,.oil-content h2,.oil-content h3{font-family:Georgia,serif;font-weight:400;letter-spacing:-.035em;color:inherit}.oil-ribbon{background:#132d45;color:#f5eacb;padding:10px 18px;text-align:center;font:11px/1.5 Arial;letter-spacing:.18em}.oil-header{max-width:1240px;margin:auto;padding:22px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #bba87866}.oil-brand{font:700 21px/1.2 Georgia,serif;letter-spacing:.05em;color:#173249;text-decoration:none}.oil-header nav{display:flex;gap:24px;align-items:center}.oil-header nav a{color:#233c50;text-decoration:none;font:13px Arial,sans-serif}.oil-cart{border:1px solid #ad8737;padding:9px 16px}.oil-intro{max-width:1180px;padding:35px 30px 0;margin:auto}.oil-eyebrow{display:block;font:11px/1.5 Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#8d671d}.oil-intro h2{font-size:clamp(36px,5.5vw,68px);line-height:1.02;margin:14px 0;max-width:800px}.oil-intro h2 em{color:#a57218}.oil-intro p{max-width:650px;color:#5c625f;line-height:1.7}.comic-kicker{font:11px/1.5 Arial;letter-spacing:.16em;text-transform:uppercase;color:#8d671d}.comic-subtitle{font:15px/1.7 Arial;color:#616860}.oil-features{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;border-top:1px solid #bba87866;border-bottom:1px solid #bba87866;padding:14px 0;margin-bottom:18px}.oil-features span+span{border-left:1px solid #baa676;padding-left:12px}.oil-gallery img{width:100%;height:auto;display:block}.oil-gallery [data-oil-main]{aspect-ratio:1;object-fit:contain}.oil-thumbs{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.oil-thumbs button{padding:0;background:transparent;border:1px solid #ad9b78;width:64px;height:64px;cursor:pointer}.oil-thumbs button[aria-pressed=true]{outline:2px solid #a57218;outline-offset:2px}.oil-thumbs img{width:100%;height:100%;object-fit:cover}.oil-content{max-width:1180px;margin:auto;padding:50px 30px}.oil-content h2{font-size:clamp(30px,4vw,49px);line-height:1.08;margin:14px 0 22px}.oil-content p{font:15px/1.75 Arial;color:#5d645f}.oil-split{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.oil-frame{margin:0;padding:8px;border:1px solid #b78a30;background:#d7bd81;box-shadow:0 8px 28px #182e3b20}.oil-frame img{width:100%;height:auto;display:block}.oil-caption{font:12px/1.5 Arial;color:#736d5b;margin:10px 0 0}.oil-navy{background:#132d45;color:#f7edcf;margin-top:30px}.oil-navy .oil-eyebrow{color:#e8c56e}.oil-navy p{color:#d9ded8}.oil-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:35px}.oil-steps article{border-top:1px solid #d9c58b66;padding-top:20px}.oil-steps b{font:italic 26px Georgia;color:#d6ac49}.oil-steps h3{font-size:26px;margin:12px 0}.oil-works{display:grid;grid-template-columns:1fr 1fr;gap:24px}.oil-works img{width:100%;display:block;aspect-ratio:1;object-fit:contain;background:#e9e1d1}.oil-works figure{margin:0}.oil-works figcaption{font:13px/1.6 Arial;margin-top:12px;color:#596159}.oil-note{font:12px/1.65 Arial;color:#687067;margin-top:20px}.oil-faq details{border-bottom:1px solid #bcad8a;padding:20px 0}.oil-faq summary{font:19px/1.4 Georgia;cursor:pointer}.oil-faq p{max-width:850px}.oil-footer{background:#132d45;color:#f7edcf;padding:30px;display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap}.oil-footer .oil-brand{color:#f7edcf}.oil-footer p,.oil-footer a{color:#d9ded8;font:12px/1.7 Arial}.oil-footer nav{display:flex;gap:20px;flex-wrap:wrap}.oil-link{display:inline-block;background:#dba62e;color:#132637!important;text-decoration:none;padding:13px 25px;font:700 12px Arial;letter-spacing:.1em}.oil-cta{text-align:center;border-top:1px solid #baaa83;padding-top:35px;margin-top:45px}.oil-header a:focus-visible,.oil-content a:focus-visible,.oil-content summary:focus-visible,.oil-thumbs button:focus-visible{outline:3px solid #b17a16;outline-offset:4px}@media(max-width:749px){.oil-header{padding:20px;flex-wrap:wrap}.oil-header nav{gap:16px}.oil-intro{padding:26px 20px 0}.oil-split,.oil-steps,.oil-works{grid-template-columns:1fr;gap:28px}.oil-content{padding:35px 20px}.oil-thumbs button{width:52px;height:52px}.oil-features{gap:8px}.oil-footer{padding:25px 20px}}.comic-pens-page.oil-motion-ready{--oil-scroll-progress:0}.oil-progress{position:fixed;z-index:30;top:0;left:0;width:100%;height:3px;pointer-events:none;background:#dba62e;transform:scaleX(var(--oil-scroll-progress,0));transform-origin:left;transition:transform .12s linear}.oil-motion-toggle{font:12px/1.4 Arial,sans-serif;color:#233c50;border:1px solid #b6a47c;background:transparent;padding:8px 12px;cursor:pointer}.oil-intro{position:relative;isolation:isolate;overflow:hidden}.oil-intro>*{position:relative;z-index:1}.oil-motion-ready .oil-intro:before{content:"";position:absolute;z-index:0;pointer-events:none;width:360px;height:230px;right:-70px;top:5px;border-radius:50%;background:radial-gradient(ellipse,#dba62e30,transparent 68%);animation:oil-pigment 12s ease-in-out infinite alternate}.oil-motion-ready .oil-intro h2 em{background-image:linear-gradient(90deg,#a5721818,#dba62e55,#a5721818);background-size:200% 100%;background-repeat:no-repeat;background-position:100% 100%;animation:oil-brush 10s ease-in-out infinite alternate}.oil-motion-ready .oil-navy{background-image:radial-gradient(ellipse at 20% 30%,#35547360,transparent 65%),radial-gradient(ellipse at 80% 80%,#b4851920,transparent 60%);background-size:140% 140%;animation:oil-canvas 18s ease-in-out infinite alternate}.oil-motion-ready [data-oil-reveal]{opacity:0;transform:translateY(22px);transition:opacity .8s ease var(--oil-delay,0ms),transform .8s cubic-bezier(.2,.65,.3,1) var(--oil-delay,0ms)}.oil-motion-ready [data-oil-reveal].oil-visible{opacity:1;transform:none}.oil-motion-ready .oil-steps article.oil-visible b{display:inline-block;animation:oil-number .7s ease-out both;animation-delay:var(--oil-delay,0ms)}.oil-frame{transition:box-shadow .35s ease,transform .35s ease}.oil-thumbs button{transition:transform .25s ease,outline-color .25s ease}.oil-motion-ready .oil-faq details[open]>p{animation:oil-answer .35s ease both}.oil-motion-paused *,.oil-motion-paused:before,.oil-motion-paused *:before{animation-play-state:paused!important;transition:none!important}.oil-motion-paused [data-oil-reveal]{opacity:1;transform:none}@media(hover:hover)and (pointer:fine){.oil-frame:hover{transform:translateY(-4px);box-shadow:0 14px 34px #182e3b30}.oil-thumbs button:hover{transform:translateY(-3px)}}@keyframes oil-pigment{0%{transform:translate(-20px) scale(.95)}to{transform:translate(-50px,30px) scale(1.15)}}@keyframes oil-brush{to{background-position:0 100%}}@keyframes oil-canvas{0%{background-position:0 0,100% 100%}to{background-position:100% 60%,0 20%}}@keyframes oil-number{0%{opacity:.3;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes oil-answer{0%{opacity:.3;transform:translateY(-5px)}to{opacity:1;transform:none}}@media(max-width:749px){.oil-motion-ready [data-oil-reveal]{transform:translateY(12px);transition-duration:.55s}.oil-motion-ready [data-oil-reveal].oil-visible{transform:none}.oil-motion-ready .oil-intro:before{width:230px;height:180px;animation-duration:18s}.oil-motion-ready .oil-navy{animation:none}.oil-progress{height:2px}}@media(prefers-reduced-motion:reduce){.oil-motion-ready [data-oil-reveal]{opacity:1;transform:none;transition:none}.oil-motion-ready *,.oil-motion-ready:before,.oil-motion-ready *:before{animation:none!important;transition:none!important}.oil-motion-toggle{display:none}}.oil-intro,.oil-content{color:#1c2d3c;background-color:#f8f4e9}.oil-navy .oil-content{background:transparent;color:#f7edcf}.oil-link{position:relative;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}.oil-link:hover{box-shadow:0 6px 18px #71551f30}
/*# sourceMappingURL=/cdn/shop/t/22/assets/oil-pens.css.map */