/* Vallini base: shared by the home (story) and the shop.
   A gallery wall on a 12-column grid. Black ink, white wall, a night room for film moments.
   Colour lives in the paintings and in one Vallini yellow. */
:root{
  --wall:#FFFFFF;
  --ink:#0D0D0D;
  --night:#080808;
  --grey:#6E6E6E;
  --smoke:#9A9A9A;     /* grey on night */
  --hair:#E3E3E3;
  --hair-n:#262626;    /* hairline on night */
  --tint:#F3F3F3;      /* frame mat behind a work */
  --yel:#FFC21A;       /* Vallini yellow */
  --race:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;
  --text:"Archivo",ui-sans-serif,system-ui,sans-serif;
  --gl:max(16px,env(safe-area-inset-left,0px));
  --gr:max(16px,env(safe-area-inset-right,0px));
  --ease:cubic-bezier(.7,0,.2,1);
  color-scheme:light;
}
*{box-sizing:border-box}
html{background:var(--wall)}
body{background:var(--wall);color:var(--ink);font-family:var(--text);font-size:16px;line-height:1.5;overflow-x:hidden;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;margin:0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
img{display:block;max-width:100%}
h1,h2,h3,p,figure{margin:0}
.wrap{padding-left:var(--gl);padding-right:var(--gr)}
.grid12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px}
.lbl{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.grey{color:var(--grey)}
.race{font-family:var(--race);font-weight:900;text-transform:uppercase;line-height:.84;letter-spacing:-.005em}
.u{background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:2px;transition:background-size .45s var(--ease)}
.u:hover{background-size:0 1px;background-position:100% 100%}
.buy{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;background:var(--ink);color:var(--wall);padding:15px 18px;font-size:13px;font-weight:600;letter-spacing:.04em;min-width:220px;transition:background-color .3s,color .3s}
.buy:hover{background:var(--yel);color:var(--ink)}
.ln{display:block;overflow:hidden}
.ln > span{display:block}

/* header */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--wall)}
body.night-top::before{background:var(--night)}
.top{position:fixed;z-index:50;top:env(safe-area-inset-top,0px);left:0;right:0;background:var(--wall);border-bottom:1px solid var(--hair);transition:background-color .4s,color .4s,border-color .4s}
.top .grid12{align-items:center;height:64px}
.top .logo{grid-column:1/4;justify-self:start}
.top .logo img{height:26px;width:auto;filter:invert(1);transition:filter .4s}
.top nav{grid-column:4/10;display:flex;gap:28px;justify-content:center}
.top nav a{font-size:13px;font-weight:500}
.top nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:5px}
.top .side{grid-column:10/13;justify-self:end;display:flex;gap:20px;align-items:center;font-size:13px;font-weight:500}
.top.dark{background:transparent;color:var(--wall);border-bottom-color:transparent}
.top.dark .logo img{filter:none}
@media (max-width:900px){.top nav{display:none}.top .logo{grid-column:1/6}.top .side{grid-column:6/13}}

/* footer */
.foot{background:var(--ink);color:var(--wall);overflow:hidden}
.foot .sig{padding-block:72px 32px}
.foot .sig img{width:clamp(150px,16vw,230px);height:auto}
.foot .cols{padding-block:28px 40px;border-top:1px solid #333;row-gap:28px}
.foot .cols > div{grid-column:span 3;display:grid;gap:6px;align-content:start;font-size:15px}
.foot .lbl{color:#8A8A8A}
.foot .legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-block:20px 28px;border-top:1px solid #333;font-size:12px;color:#8A8A8A}
@media (max-width:900px){.foot .cols > div{grid-column:span 6}}


/* visible to search engines and screen readers, not on screen */
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
