/* Hiljaa Yoga Studio, Helsinki. Designed and developed by Smit Desai, https://smitdev.online/ */
@font-face{font-family:"Gloock";src:url(/assets/fonts/gloock-latin.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Albert Sans";src:url(/assets/fonts/albert-sans-latin.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:"Albert Sans";src:url(/assets/fonts/albert-sans-italic-latin.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}

:root{
  --paper:#F3F1EC;--ink:#2F2A26;--sage:#8C9A7B;--moss:#56634A;--mist:#E2E5DA;
  --ink-2:rgba(47,42,38,.78);--rule:rgba(47,42,38,.16);--rule-2:rgba(47,42,38,.3);
  --serif:"Gloock",Georgia,"Times New Roman",serif;
  --sans:"Albert Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --wrap:1280px;--gut:clamp(16px,4vw,48px);--gap:clamp(16px,2.4vw,32px);
  --breath:11s
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:88px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.7 var(--sans);text-rendering:optimizeLegibility}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--ink);text-decoration-color:var(--sage);text-decoration-thickness:1px;text-underline-offset:.25em}
a:hover{text-decoration-color:var(--ink)}
:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:2px}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.06;margin:0 0 .5em;letter-spacing:-.012em;text-wrap:balance;overflow-wrap:break-word;hyphens:auto}
h1{font-size:clamp(2.4rem,7.2vw,6.25rem);line-height:.98;letter-spacing:-.02em}
h2{font-size:clamp(2rem,4.4vw,3.6rem)}
h3{font-size:clamp(1.3rem,1.9vw,1.6rem);line-height:1.2}
p{margin:0 0 1.1em}
ul,ol{margin:0 0 1.1em;padding-left:1.15em}
li{margin-bottom:.35em}
address{font-style:normal}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-80px;z-index:100;background:var(--ink);color:var(--paper);padding:10px 18px;text-decoration:none}
.skip:focus{top:12px}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
main{display:block}
[hidden]{display:none!important}
main:focus{outline:none}

/* Small type */
.kick{display:flex;align-items:center;gap:14px;margin:0 0 22px;font:italic 400 1.0625rem/1.4 var(--sans);color:var(--moss)}
.kick::before{content:"";flex:0 0 32px;height:1px;background:currentColor}
.lede{font-size:clamp(1.15rem,1.7vw,1.375rem);line-height:1.6;max-width:34em}
.muted{color:var(--ink-2)}
.small{font-size:.9375rem;line-height:1.6}
.note{font-size:.9375rem;color:var(--ink-2);border-left:1px solid var(--sage);padding-left:16px;max-width:40em}
.measure{max-width:38em}
.ph{border-bottom:1px dashed var(--rule-2);color:var(--ink-2)}

/* Links that breathe: a sage circle that grows on hover */
.go{display:inline-flex;align-items:center;gap:14px;min-height:52px;font:500 1.0625rem/1.2 var(--sans);color:var(--ink);text-decoration:none}
.go::before{content:"";flex:0 0 auto;width:44px;height:44px;border-radius:50%;background:var(--sage) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F2A26' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/20px no-repeat;transition:transform .5s ease}
.go:hover::before{transform:scale(1.12)}
.go:hover span{text-decoration:underline;text-decoration-color:var(--sage);text-underline-offset:.3em}
.go.light::before{background-color:var(--paper)}
.link{display:inline-flex;align-items:center;min-height:32px;font-weight:500;text-decoration:underline;text-decoration-color:var(--sage);text-decoration-thickness:1px;text-underline-offset:.32em}
.link:hover{text-decoration-color:var(--ink)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 32px;margin-top:32px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 30px;border:0;border-radius:26px;background:var(--ink);color:var(--paper);font:500 1.0625rem/1.2 var(--sans);text-decoration:none;cursor:pointer;transition:background .3s}
.btn:hover{background:var(--moss)}

/* Header: slim, left-aligned */
.top{position:sticky;top:0;z-index:30;background:var(--paper);border-bottom:1px solid var(--rule)}
.top .wrap{display:flex;align-items:center;gap:clamp(20px,3vw,44px);min-height:64px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);flex:0 0 auto}
.brand svg{width:30px;height:30px}
.brand b{font:400 1.5rem/1 var(--serif);letter-spacing:-.01em}
.brand i{font:italic 400 .875rem/1 var(--sans);color:var(--ink-2);padding-top:5px}
.nav{display:flex;gap:clamp(14px,2vw,28px)}
.nav a{position:relative;display:inline-flex;align-items:center;min-height:40px;font-size:.96875rem;text-decoration:none;color:var(--ink)}
.nav a::after{content:"";position:absolute;left:50%;bottom:4px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--sage);transform:scale(0);transition:transform .3s}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scale(1)}
.nav a[aria-current="page"]::after{background:var(--moss)}
.top-end{display:flex;align-items:center;gap:20px;margin-left:auto}
.lang{display:flex;align-items:center;gap:2px;font-size:.875rem}
.lang a{display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:32px;text-decoration:none;color:var(--ink-2)}
.lang a[aria-current="true"]{color:var(--ink);font-weight:600}
.lang span[aria-hidden]{color:var(--rule-2)}
.top-cta{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 18px;border:1px solid var(--ink);border-radius:20px;font-size:.9375rem;text-decoration:none;color:var(--ink);transition:background .3s,color .3s}
.top-cta::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--sage)}
.top-cta:hover{background:var(--ink);color:var(--paper)}
.menu-btn{display:none;align-items:center;gap:10px;min-height:40px;padding:0 4px;border:0;background:none;font:500 1rem/1 var(--sans);color:var(--ink);cursor:pointer}
.menu-btn i{position:relative;width:22px;height:9px;border-top:1px solid currentColor;border-bottom:1px solid currentColor}
.menu-btn[aria-expanded="true"] i{border-bottom-color:transparent}

/* Sections and grids */
.sec{padding-block:clamp(72px,11vw,152px)}
.sec.tight{padding-top:0}
.rule-top{border-top:1px solid var(--rule)}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--gap)}
.side{grid-column:1/4;align-self:start;margin-top:.7em}
.body{grid-column:5/12}
.body-wide{grid-column:5/13}
.span-7{grid-column:1/8}
.span-5r{grid-column:8/13}
.band{background:var(--mist)}

/* Hero */
.hero{padding-block:clamp(48px,8vw,112px) clamp(56px,8vw,104px)}
.hero .grid{align-items:center}
.hero-text{grid-column:1/8}
.hero-text .lede{margin-top:28px}
.hero-art{grid-column:8/13;margin:0}
.hero-art figcaption{margin-top:14px;font:italic 400 .9375rem/1.5 var(--sans);color:var(--ink-2);text-align:center}
.page-head{padding-block:clamp(48px,8vw,104px) clamp(40px,6vw,72px)}
.page-head .grid{align-items:end}
.page-head h1{grid-column:1/9;margin:0}
.page-head .lede{grid-column:9/13;margin:0;font-size:1.125rem}
.page-head .kick{grid-column:1/-1}

/* Breathing circle */
.breath{width:100%;max-width:440px;margin-inline:auto;aspect-ratio:1}
.breath .disc{fill:var(--mist)}
.breath .core{fill:var(--sage)}
.breath .ring{fill:none;stroke:var(--rule-2);stroke-width:1}
.breath .dots{fill:none;stroke:var(--sage);stroke-width:2;stroke-linecap:round;stroke-dasharray:0 9}
.breath .orbit{fill:var(--moss)}
.breath text{font-family:var(--serif);font-size:30px;fill:var(--ink);text-anchor:middle}
.breath .say-in,.breath .say-out{opacity:0}
.breath .say-rest{opacity:1}
@media (prefers-reduced-motion:no-preference){
  .breath .disc,.breath .core{transform-box:fill-box;transform-origin:center;animation:breathe var(--breath) ease-in-out infinite}
  .breath .core{animation-name:breathe-core}
  .breath .spin{transform-origin:200px 200px;animation:orbit var(--breath) linear infinite}
  .breath .say-rest{animation:say-rest var(--breath) linear infinite}
  .breath .say-in{animation:say-in var(--breath) ease-in-out infinite}
  .breath .say-out{animation:say-out var(--breath) ease-in-out infinite}
}
@keyframes breathe{0%,100%{transform:scale(1)}55%,62%{transform:scale(.7)}}
@keyframes breathe-core{0%,100%{transform:scale(1)}55%,62%{transform:scale(.82)}}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes say-rest{0%,100%{opacity:0}}
@keyframes say-out{0%,50%{opacity:1}56%,96%{opacity:0}100%{opacity:1}}
@keyframes say-in{0%,56%{opacity:0}62%,90%{opacity:1}95%,100%{opacity:0}}

/* Next class strip */
.next{display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;margin-top:clamp(40px,6vw,72px);padding-block:18px;border-block:1px solid var(--rule)}
.next p{margin:0}
.next b{font-weight:600}
.next .label{font:italic 400 1rem/1.4 var(--sans);color:var(--moss)}
.next .link{margin-left:auto}

/* Style list (home and classes) */
.styles{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.styles li{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px var(--gap);align-items:baseline;margin:0;padding-block:clamp(22px,3vw,36px);border-bottom:1px solid var(--rule)}
.styles h3{grid-column:1/5;margin:0;font-size:clamp(1.75rem,3.2vw,2.75rem);display:flex;align-items:baseline;gap:16px}
.styles p{grid-column:5/11;margin:0}
.styles .link{grid-column:11/13;justify-self:end}

/* Style markers, used in the timetable legend and on class names */
.mk{display:inline-block;flex:0 0 auto;width:14px;height:14px;border-radius:50%;background:var(--sage);vertical-align:-1px}
.mk.yin{background:linear-gradient(90deg,var(--moss) 50%,transparent 50%);box-shadow:inset 0 0 0 1.5px var(--moss)}
.mk.vinyasa{background:none;box-shadow:inset 0 0 0 2px var(--moss)}
.mk.pilates{border-radius:2px;width:12px;height:12px;background:var(--moss)}
.mk.hatha{background:var(--moss)}

/* Pull quote */
.pull{grid-column:3/11;margin:0}
.pull blockquote{margin:0;font:400 clamp(1.6rem,3.2vw,2.75rem)/1.22 var(--serif);letter-spacing:-.01em;text-wrap:balance}
.pull blockquote::before{content:"";display:block;width:18px;height:18px;margin-bottom:28px;border-radius:50%;background:var(--sage)}
.pull figcaption{margin-top:22px;font:italic 400 1rem/1.5 var(--sans);color:var(--ink-2)}
.pull.right{grid-column:5/13}

/* Two-column text blocks */
.cols-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,56px)}
.cols-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3.5vw,48px)}
.cols-2 h3,.cols-3 h3{margin-bottom:.4em}
.dots-list{list-style:none;padding:0}
.dots-list li{position:relative;padding-left:24px}
.dots-list li::before{content:"";position:absolute;left:2px;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--sage)}

/* People */
.people{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--gap)}
.person{margin:0}
.portrait{position:relative;display:block;background:var(--mist);overflow:hidden}
.portrait img{width:100%}
.portrait .ini{position:absolute;right:12px;top:8px;font:400 1.75rem/1 var(--serif);color:var(--moss)}
.person h3{margin:16px 0 2px;font-size:1.375rem}
.person p{margin:0;font-size:.9375rem;color:var(--ink-2)}
.person a{text-decoration:none}
.person a:hover h3{text-decoration:underline;text-decoration-color:var(--sage)}
.bio{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px var(--gap);padding-block:clamp(40px,6vw,80px);border-top:1px solid var(--rule)}
.bio .portrait{grid-column:1/5}
.bio .bio-text{grid-column:6/12}
.bio:nth-of-type(even) .portrait{grid-column:8/12;grid-row:1}
.bio:nth-of-type(even) .bio-text{grid-column:1/7;grid-row:1}
.bio h2{font-size:clamp(2rem,3.6vw,3rem);margin-bottom:.2em}
.bio .role{font:italic 400 1.0625rem/1.5 var(--sans);color:var(--moss);margin-bottom:1.4em}
.facts{display:grid;grid-template-columns:auto 1fr;gap:6px 20px;margin:0 0 1.4em;font-size:.9375rem}
.facts dt{color:var(--ink-2)}
.facts dd{margin:0}

/* Sample reviews */
.quotes{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px var(--gap)}
.quotes figure{margin:0;grid-column:span 5}
.quotes figure:nth-child(2){grid-column:7/13;margin-top:clamp(0px,6vw,96px)}
.quotes blockquote{margin:0;font:400 clamp(1.25rem,2vw,1.6rem)/1.35 var(--serif)}
.quotes figcaption{margin-top:14px;font-size:.9375rem;color:var(--ink-2)}
.tag-sample{display:inline-block;margin-bottom:14px;padding:2px 10px;border:1px solid var(--rule-2);border-radius:12px;font-size:.8125rem;color:var(--ink-2)}

/* Call to action block */
.cta{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px var(--gap);align-items:center}
.cta h2{grid-column:1/8;margin:0}
.cta div{grid-column:8/13}
.cta p{margin:0 0 20px}

/* Timetable */
.filters{display:grid;gap:18px;margin:0 0 28px;padding:24px 0;border-block:1px solid var(--rule)}
.filters fieldset{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:0;border:0;min-width:0}
.filters legend{float:left;width:7.5em;margin-right:8px;padding:0;font:italic 400 1rem/36px var(--sans);color:var(--moss)}
.chip input{position:absolute;opacity:0;width:1px;height:1px}
.chip span{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 16px;border:1px solid var(--rule-2);border-radius:18px;font-size:.9375rem;cursor:pointer;transition:background .25s,color .25s,border-color .25s;user-select:none}
.chip span:hover{border-color:var(--ink)}
.chip input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.chip input:checked+span .mk{box-shadow:inset 0 0 0 2px var(--paper)}
.chip input:checked+span .mk.hatha,.chip input:checked+span .mk.pilates{background:var(--paper);box-shadow:none}
.chip input:checked+span .mk.yin{background:linear-gradient(90deg,var(--paper) 50%,transparent 50%)}
.chip input:focus-visible+span{outline:2px solid var(--ink);outline-offset:3px}
.tt-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-bottom:20px}
.count{margin:0;font-size:.9375rem;color:var(--ink-2)}
.who-note{display:flex;align-items:center;gap:12px;margin:0;font-size:.9375rem}
.who-note button,.reset{min-height:32px;padding:0 12px;border:1px solid var(--rule-2);border-radius:16px;background:none;font:inherit;font-size:.875rem;color:var(--ink);cursor:pointer}
.legend{display:flex;flex-wrap:wrap;gap:6px 22px;margin:0;padding:0;list-style:none;font-size:.875rem;color:var(--ink-2)}
.legend li{display:flex;align-items:center;gap:8px;margin:0}
.daypick{display:none;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin:0 0 18px}
.daypick button{min-width:0;min-height:44px;padding:0;border:1px solid var(--rule-2);border-radius:22px;background:none;font:500 .9375rem/1 var(--sans);color:var(--ink);cursor:pointer}
.daypick button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.daypick button[data-day="all"]{grid-column:1/-1;justify-self:start;min-height:32px;margin-top:4px;border:0;border-radius:0;text-decoration:underline;text-decoration-color:var(--sage);text-underline-offset:.3em}
.daypick button[data-day="all"][aria-pressed="true"]{background:none;color:var(--ink);font-weight:700;text-decoration:none}
.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--ink)}
.day{padding:16px 12px 24px;border-right:1px solid var(--rule);min-width:0}
.day:first-child{padding-left:0}
.day:last-child{border-right:0;padding-right:0}
.day h2{margin:0 0 14px;font-size:1.375rem}
.slots{list-style:none;margin:0;padding:0}
.slot{margin:0 0 12px;padding:12px 0 14px;border-bottom:1px solid var(--rule)}
.slot[hidden]{display:none}
.slot time,.slot .time{display:block;font-size:.875rem;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.slot h3{display:flex;gap:8px;align-items:baseline;margin:6px 0 4px;font-size:1.0625rem;line-height:1.25}
.slot h3 .mk{width:10px;height:10px;flex-basis:10px}
.slot h3 .mk.pilates{width:9px;height:9px}
.slot p{margin:0;font-size:.875rem;line-height:1.5;color:var(--ink-2)}
.slot .meta{display:flex;flex-wrap:wrap;gap:4px 6px;margin-top:8px}
.pill{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border:1px solid var(--rule-2);border-radius:11px;font-size:.75rem;line-height:1;color:var(--ink)}
.pill.lang-tag{background:var(--mist);border-color:transparent;font-weight:600;letter-spacing:.04em}
.slot .link{min-height:24px;margin-top:6px;font-size:.875rem}
.none{margin:0;padding:12px 0;font:italic 400 .9375rem/1.5 var(--sans);color:var(--ink-2)}
.none[hidden]{display:none}

/* Classes page */
.style-sec{padding-block:clamp(56px,8vw,112px);border-top:1px solid var(--rule)}
.style-sec h2{display:flex;align-items:center;gap:18px}
.s-meta{grid-column:1/5}
.s-text{grid-column:6/12}
.style-sec h2 .mk{width:20px;height:20px}
.style-sec h2 .mk.pilates{width:18px;height:18px}
.pace{display:flex;gap:6px;align-items:center}
.pace i{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--moss)}
.pace i.on{background:var(--moss)}

/* Prices */
.prices{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.price-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:10px var(--gap);align-items:baseline;margin:0;padding-block:clamp(26px,3.5vw,44px);border-bottom:1px solid var(--rule)}
.price-row h2,.price-row h3{grid-column:1/5;margin:0;font-size:clamp(1.6rem,2.8vw,2.4rem)}
.price-row .what{grid-column:5/10;margin:0}
.price-row .what p{margin:0 0 .4em}
.price-row .amount{grid-column:10/13;justify-self:end;text-align:right}
.amount b{display:block;font:400 clamp(2.2rem,4vw,3.4rem)/1 var(--serif);letter-spacing:-.02em}
.amount small{display:block;margin-top:8px;font-size:.9375rem;color:var(--ink-2)}
.amount b small{display:inline;margin:0 0 0 8px;font:400 .9375rem/1 var(--sans);letter-spacing:0}
.amount .from{display:block;font:italic 400 .9375rem/1.4 var(--sans);color:var(--moss);margin-bottom:4px}
.finder{padding:clamp(28px,4vw,48px);background:var(--mist)}
.finder fieldset{margin:0 0 20px;padding:0;border:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.finder legend{float:left;width:100%;margin-bottom:10px;font:italic 400 1rem/1.4 var(--sans);color:var(--moss)}
.finder .chip span{border-color:rgba(47,42,38,.4)}
.finder output{display:block;margin-top:8px;padding-top:20px;border-top:1px solid var(--rule-2)}
.finder output b{display:block;font:400 clamp(1.5rem,2.6vw,2rem)/1.2 var(--serif);margin-bottom:6px}

/* FAQ */
.faq details{border-bottom:1px solid var(--rule)}
.faq details:first-of-type{border-top:1px solid var(--rule)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:64px;padding-block:14px;font:400 1.25rem/1.35 var(--serif);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:0 0 auto;width:14px;height:14px;border-radius:50%;border:1.5px solid var(--moss);transition:background .3s}
.faq details[open] summary::after{background:var(--moss)}
.faq details p{margin:0 0 20px;max-width:42em}

/* Studio page */
.props{background:var(--mist)}
.checks{list-style:none;padding:0;margin:0}
.checks li{display:flex;gap:14px;padding-block:12px;border-bottom:1px solid var(--rule);margin:0}
.checks li::before{content:"";flex:0 0 auto;width:10px;height:10px;margin-top:.55em;border-radius:50%;border:1.5px solid var(--moss)}
.checks.have li::before{background:var(--moss)}
.steps{list-style:none;padding:0;margin:0;counter-reset:s}
.steps li{position:relative;padding:0 0 22px 52px;margin:0}
.steps li::before{counter-increment:s;content:counter(s);position:absolute;left:0;top:-2px;width:34px;height:34px;border-radius:50%;background:var(--sage);display:grid;place-items:center;font:400 1rem/1 var(--serif)}
.steps h3{font-size:1.25rem;margin-bottom:.25em}

/* Contact form */
.form{display:grid;gap:26px}
.field{display:grid;gap:8px}
.field label,.field legend{font-weight:500;font-size:1rem}
.field .hint{font-size:.875rem;color:var(--ink-2);margin:0}
.field input[type=text],.field input[type=email],.field input[type=tel],.field select,.field textarea{width:100%;min-height:52px;padding:12px 2px;border:0;border-bottom:1px solid var(--ink);border-radius:0;background:transparent;font:400 1.0625rem/1.4 var(--sans);color:var(--ink)}
.field select{appearance:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F2A26' stroke-width='1.6'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 4px center/18px no-repeat;padding-right:30px}
.field textarea{min-height:120px;resize:vertical;border:1px solid var(--rule-2);padding:12px 14px}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.field fieldset{margin:0;padding:0;border:0;display:flex;flex-wrap:wrap;gap:8px}
.field fieldset legend{width:100%;margin-bottom:8px}
.field [aria-invalid="true"]{border-color:#9B2C1F}
.err{margin:0;font-size:.9375rem;color:#9B2C1F;font-weight:500}
.err[hidden]{display:none}
.check{display:flex;gap:12px;align-items:flex-start;font-size:.9375rem}
.check input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--moss);flex:0 0 auto}
.two-up{display:grid;grid-template-columns:1fr 1fr;gap:26px var(--gap)}
.done{padding:clamp(28px,4vw,44px);background:var(--mist)}
.done h2{font-size:clamp(1.75rem,3vw,2.4rem)}
.done:focus{outline:2px solid var(--ink);outline-offset:4px}
.aside{grid-column:9/13;display:grid;gap:30px;align-content:start}
.aside h2{font-size:1.5rem;margin-bottom:.4em}
.aside p{margin:0}
.hours{display:grid;grid-template-columns:auto 1fr;gap:4px 18px;margin:0;font-size:.9375rem}
.hours dt{color:var(--ink-2)}
.hours dd{margin:0}

/* Not found */
.lost .grid{align-items:center}
.lost .hero-art{grid-column:1/6}
.lost .lost-text{grid-column:7/13}
.lost .h2{font:400 clamp(1.6rem,2.8vw,2.2rem)/1.15 var(--serif);margin:0 0 .5em}

/* Footer */
.foot{margin-top:clamp(40px,6vw,80px);padding-block:clamp(48px,6vw,72px) 32px;border-top:1px solid var(--ink)}
.foot-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px var(--gap)}
.foot-brand{grid-column:1/6}
.foot-brand p{margin:14px 0 0;max-width:24em;color:var(--ink-2);font-size:.9375rem}
.foot-col{grid-column:span 2}
.foot-col.wide{grid-column:span 3}
.foot h2{margin:0 0 12px;font:italic 400 1rem/1.4 var(--sans);color:var(--moss)}
.foot ul{list-style:none;padding:0;margin:0}
.foot li{margin:0}
.foot li a,.foot address a{display:inline-flex;min-height:32px;align-items:center;text-decoration:none;font-size:.9375rem}
.foot li a:hover,.foot address a:hover{text-decoration:underline;text-decoration-color:var(--sage)}
.foot address{font-size:.9375rem;line-height:1.7}
.foot-note{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 32px;margin-top:48px;padding-top:20px;border-top:1px solid var(--rule);font-size:.875rem;color:var(--ink-2)}
.foot-note a{color:var(--ink)}

/* Tablet */
@media (max-width:1080px){
  .nav{gap:16px}
  .nav a{font-size:.9375rem}
  .day{padding-inline:8px}
  .slot h3{font-size:1rem}
  .people{grid-template-columns:repeat(3,minmax(0,1fr))}
  .menu-btn{display:inline-flex}
  .top .wrap{flex-wrap:wrap;gap:12px 20px}
  .top-end{gap:14px}
  .nav{order:5;flex:1 0 100%;flex-direction:column;gap:0;padding:4px 0 20px}
  .js .nav{display:none}
  .js .nav.open{display:flex}
  .nav a{min-height:56px;font:400 1.6rem/1.2 var(--serif);border-top:1px solid var(--rule)}
  .nav a::after{left:auto;right:4px;top:50%;bottom:auto;margin-top:-3px;width:8px;height:8px}
}
@media (max-width:960px){
  .hero-text,.hero-art,.page-head h1,.page-head .lede,.side,.body,.body-wide,.span-7,.span-5r,.pull,.pull.right,.cta h2,.cta div,.lost .hero-art,.lost .lost-text,.s-meta,.s-text,.aside{grid-column:1/-1}
  .aside{margin-top:56px}
  .hero-art{max-width:420px;margin:40px auto 0}
  .page-head .lede{margin-top:24px}
  .side{margin-bottom:28px}
  .styles h3{grid-column:1/-1}
  .styles p{grid-column:1/-1}
  .styles .link{grid-column:1/-1;justify-self:start}
  .bio .portrait,.bio:nth-of-type(even) .portrait{grid-column:1/-1;grid-row:auto;max-width:360px}
  .bio .bio-text,.bio:nth-of-type(even) .bio-text{grid-column:1/-1;grid-row:auto}
  .quotes figure,.quotes figure:nth-child(2){grid-column:1/-1;margin-top:0}
  .price-row h2,.price-row h3,.price-row .what{grid-column:1/-1}
  .price-row .amount{grid-column:1/-1;justify-self:start;text-align:left;margin-top:8px}
  .foot-brand{grid-column:1/-1}
  .foot-col,.foot-col.wide{grid-column:span 6}
  .week{display:block;border-top:0}
  .js .daypick{display:grid}
  .day,.day:first-child,.day:last-child{padding:0 0 28px;border-right:0}
  .day h2{padding-top:14px;border-top:1px solid var(--ink)}
  .week[data-day="0"] .day:not([data-day="0"]),.week[data-day="1"] .day:not([data-day="1"]),.week[data-day="2"] .day:not([data-day="2"]),.week[data-day="3"] .day:not([data-day="3"]),.week[data-day="4"] .day:not([data-day="4"]),.week[data-day="5"] .day:not([data-day="5"]),.week[data-day="6"] .day:not([data-day="6"]){display:none}
  .slot{display:grid;grid-template-columns:86px 1fr;gap:0 14px}
  .slot>*{grid-column:2}
  .slot time,.slot .time{grid-column:1;grid-row:1/span 4;padding-top:2px;font-size:1rem}
  .slot h3{margin-top:0;font-size:1.25rem}
  .cols-3{grid-template-columns:1fr}
}
@media (max-width:640px){
  body{font-size:1rem}
  h1{line-height:1.04}
  .hero-art{max-width:300px}
  .brand i{display:none}
  .top-cta{display:none}
  .cols-2,.two-up{grid-template-columns:1fr}
  .people{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filters legend{float:none;width:100%;line-height:1.4}
  .next .link{margin-left:0}
  .foot-col,.foot-col.wide{grid-column:1/-1}
  .slot{grid-template-columns:64px 1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
