/* SkawpShop's visual language: warm paper, ink, citrus accents and generous
   editorial type. System fonts avoid external requests or font loading shifts. */
:root{--paper:#f2f0e8;--ink:#242820;--orange:#df572d;--line:#d5d5ca}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--orange);outline-offset:5px}.announcement{background:var(--ink);color:var(--paper);text-align:center;font-size:11px;letter-spacing:.3px;padding:12px}.announcement a{margin-left:20px;border-bottom:1px solid #9c9e8f}header{max-width:1440px;margin:auto;padding:30px 5%;display:flex;align-items:center;justify-content:space-between}.wordmark{font-size:31px;font-weight:800;letter-spacing:-1.8px}.logo-star{font-size:25px;display:inline-block;margin:0 1px;color:var(--orange)}.dot{color:var(--orange)}nav{display:flex;gap:32px;font-size:13px}.header-link{font-size:13px;border-bottom:1px solid;padding-bottom:6px}.header-link span{margin-left:24px}.hero{max-width:1440px;margin:auto;display:grid;grid-template-columns:1fr 1.05fr;padding:25px 5% 60px;gap:35px;align-items:center}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700}.tiny-star{font-size:22px;vertical-align:middle;margin-right:8px;color:var(--orange)}h1{font-size:clamp(65px,7.4vw,109px);line-height:.98;letter-spacing:-6px;font-weight:500;margin:27px 0}em{font-family:Georgia,'Times New Roman',serif;font-weight:normal}h1 em{color:var(--orange);letter-spacing:-5px}.intro{font-size:16px;line-height:1.65;color:#62665b;margin:27px 0}.button{border:0;background:var(--ink);color:var(--paper);display:inline-flex;gap:38px;align-items:center;padding:18px 23px;font-size:12px}.button:hover{background:var(--orange)}.small-note{font-size:9px;letter-spacing:1.6px;margin-top:27px;color:#6d7265}.hero-art{position:relative}.hero-art>svg{width:100%;display:block}.art-tag{position:absolute;left:-24px;top:30px;transform:rotate(-9deg);background:#e8ed74;padding:18px;font-size:10px;line-height:1.5;letter-spacing:1px;border:1px solid #303628;box-shadow:3px 4px 0 #303628}.art-tag span{font-size:23px;margin-left:15px;float:right}.art-caption{display:block;text-align:right;font-size:8px;letter-spacing:1.8px;margin-top:12px}.ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 5%;display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:10px;letter-spacing:1.6px}.ticker b{font-size:26px;color:var(--orange)}.collection{max-width:1440px;margin:auto;padding:80px 5%}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:32px}h2{font-size:clamp(40px,4.2vw,61px);font-weight:500;letter-spacing:-2.5px;line-height:1.06;margin:20px 0 0}.section-heading>p{font-size:13px;line-height:1.8;color:#62665b;margin-bottom:5px}.filters{display:flex;gap:10px;margin-bottom:25px}.filters button{border:1px solid var(--line);border-radius:24px;background:transparent;padding:11px 18px;font-size:11px}.filters .active{background:var(--ink);color:var(--paper);border-color:var(--ink)}.filters span{margin-left:9px;color:#c3c9b4}.products{display:grid;grid-template-columns:repeat(3,1fr);gap:23px}.product{border:0;padding:0;background:transparent;text-align:left}.product[hidden]{display:none}.product-art{position:relative;overflow:hidden}.product-art svg{width:100%;display:block;transition:transform .3s}.product:hover svg{transform:scale(1.045)}.peach{background:#eedbc9}.sage{background:#dce1d0}.lilac{background:#dcd8e7}.label{position:absolute;top:20px;left:20px;font-size:8px;letter-spacing:1.5px}.view{position:absolute;right:17px;bottom:17px;border:1px solid #ffffff90;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;background:#ffffff50}.product-title{display:flex;align-items:center;justify-content:space-between;margin-top:18px}.product-title h3{font-size:16px;font-weight:500;margin:0}.product-title span{font-size:10px;color:#74786d}.product>p{font-size:12px;color:#62665b;margin-top:8px}.concept-note{font-size:11px;line-height:1.8;color:#6b6f63;max-width:740px;margin-top:27px}.approach{background:#e4e6da;padding:75px 12%;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.big-star{font-size:270px;color:var(--orange);line-height:1;text-align:center;transform:rotate(12deg)}.approach h2{font-size:65px;margin-bottom:25px}.approach p:not(.eyebrow){font-size:14px;line-height:1.8;max-width:425px;color:#5a6052}.text-link{display:inline-block;border-bottom:1px solid;padding:14px 0 8px;font-size:12px}.text-link span{margin-left:40px}.closing{text-align:center;padding:85px 20px 95px}.closing h2{font-size:clamp(50px,6vw,83px);letter-spacing:-4px}.closing h2 span{color:var(--orange)}.closing>p:not(.eyebrow){font-size:14px;color:#62665b;margin:25px 0}.closing .button{margin-top:7px}footer{border-top:1px solid var(--line);padding:35px 5%;display:flex;align-items:center;gap:35px}footer>p{font-size:11px;color:#62665b}footer>div{margin-left:auto;display:flex;flex-direction:column;gap:9px;font-size:9px;letter-spacing:1px}dialog{background:var(--paper);color:var(--ink);border:1px solid var(--line);max-width:540px;width:calc(100% - 32px);padding:45px}dialog::backdrop{background:#24282099}dialog h2{font-size:42px}dialog>p:not(.eyebrow){line-height:1.8}dialog .button{margin-top:18px}.close{position:absolute;top:10px;right:15px;border:0;background:none;font-size:28px}
/* The long hero word scales within its column at phone and desktop widths. */
h1 em{font-size:.84em}
/* The skip link stays available to keyboard users without displacing the header. */
.skip-link{position:absolute;top:8px;left:8px;z-index:10;padding:12px;background:var(--ink);color:var(--paper);transform:translateY(-160%)}.skip-link:focus{transform:none}
/* Narrow layouts preserve reading order, comfortable targets and the full art;
   reduced motion respects visitors who avoid animated scrolling or hover effects. */
@media(max-width:760px){header{padding:25px 6%}nav{display:none}.wordmark{font-size:26px}.header-link{font-size:11px}.hero{grid-template-columns:1fr;padding:15px 6% 35px;gap:30px}h1{font-size:76px;letter-spacing:-4px}h1 em{letter-spacing:-4px}.hero-art{margin-left:13px}.art-tag{left:-13px}.ticker{padding:18px 6%;font-size:8px;line-height:1.6}.ticker span:last-child,.ticker b:last-of-type{display:none}.collection{padding:50px 6%}.section-heading{display:block}.section-heading>p{margin-top:22px}.products{grid-template-columns:1fr;gap:30px}.product-art svg{max-height:330px}.approach{grid-template-columns:1fr;padding:45px 8%;gap:25px}.big-star{font-size:140px;text-align:left}.approach h2{font-size:52px}.closing{padding:65px 6%}.closing h2{letter-spacing:-2px}footer{flex-wrap:wrap;gap:12px;padding:30px 6%}footer>p{width:100%}footer>div{margin:10px 0 0}.announcement{font-size:9px}.announcement a{margin-left:7px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.product-art svg{transition:none}}
