@font-face{font-family:Bricolage;src:url("assets/bricolage-extra.ttf") format("truetype");font-weight:800;font-display:swap}
:root{--ink:#38244e;--lime:#e5ee93;--cream:#fdfaf1;--violet:#653e8a;--lilac:#d8c8e9;--line:#c9c1ce;--display:Bricolage,"Arial Black",Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:1rem}
body{margin:0;color:var(--ink);background:var(--cream);font:16px/1.55 Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}
button{color:inherit;font:inherit}
a:focus-visible,button:focus-visible{outline:3px solid #9251c1;outline-offset:5px}
img{display:block;max-width:100%}
svg{width:1.2em;height:1.2em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.symbols{display:none}
.wrap{width:min(1190px,calc(100% - 112px));margin-inline:auto}
.skip{position:fixed;top:-100px;left:1rem;padding:.5rem 1rem;background:white;z-index:5}
.skip:focus{top:1rem}
header{background:var(--cream);border-bottom:1px solid var(--ink);position:relative;z-index:4}
.head{height:84px;display:flex;align-items:center;gap:2.2rem}
.wordmark{display:block;flex:none}
.wordmark img{width:103px;height:43px}
nav{display:flex;align-items:center;gap:clamp(19px,2.6vw,38px);margin-left:auto}
nav a,.headcall{font-size:.92rem;font-weight:700}
nav a:hover,footer a:not(.wordmark):hover,.textlink:hover{text-decoration:underline;text-underline-offset:4px}
.headcall,.button,.textlink{display:inline-flex;align-items:center;justify-content:center;gap:.65rem}
.headcall,.button{border-radius:99px;font-weight:700;border:1.4px solid var(--ink);line-height:1.2}
.headcall{padding:.76rem 1.2rem;background:transparent}
.headcall:hover{background:var(--lime)}
.mobile-menu{display:none}
.hero{background:var(--lime);overflow:hidden;border-bottom:1px solid var(--ink)}
.hero-grid{display:grid;grid-template-columns:1.03fr 1fr;align-items:center;gap:clamp(30px,5vw,84px);padding-block:66px 74px;min-height:612px}
.kicker{font-size:.72rem;line-height:1.35;font-weight:800;letter-spacing:.145em;text-transform:uppercase;display:flex;align-items:center;gap:.75rem;margin:0 0 1.3rem}
.dash{height:2px;width:27px;background:currentColor}
h1,h2,h3,p,figure,blockquote{margin:0}
h1,h2,h3,.rating-num{font:800 1rem/1 var(--display);letter-spacing:-.065em}
h1{font-size:clamp(78px,8.35vw,126px);line-height:.89;letter-spacing:-.083em}
h1 span{color:var(--violet)}
.lead{max-width:465px;font-size:clamp(17px,1.4vw,20px);margin:1.55rem 0 1.85rem;line-height:1.5}
.actions{display:flex;align-items:center;gap:1.55rem;flex-wrap:wrap}
.button{min-height:48px;padding:.83rem 1.2rem;font-size:.95rem}
.button svg{transition:transform .18s ease}
.button:hover svg{transform:translateX(3px)}
.solid{color:var(--cream);background:var(--ink)}
.solid:hover{background:#523469}
.textlink{font-weight:700;font-size:.95rem;min-height:44px}
.art{position:relative;width:100%;aspect-ratio:1.12;max-width:514px;justify-self:center}
.photo{position:absolute;inset:2% 9% 3% 10%;display:flex;flex-direction:column;background:var(--cream);border:2px solid var(--ink);padding:10px 10px 0;transform:rotate(5deg);box-shadow:7px 7px 0 var(--ink)}
.photo img{flex:1;min-height:0;min-width:0;width:100%;height:0;object-fit:cover;object-position:50% 40%;border:1px solid var(--ink)}
.photo figcaption{min-height:34px;display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:.72rem;line-height:1.2}
.photo figcaption span{font-weight:bold;letter-spacing:.08em;text-transform:uppercase}
.halftone{position:absolute;inset:9% 7% 17% 0;transform:rotate(-6deg);border-radius:42% 40% 35% 38%;background-image:radial-gradient(var(--violet) 1.8px,transparent 2px);background-size:9px 9px}
.dog-stamp{position:absolute;bottom:-2%;left:-2%;width:26%;aspect-ratio:1;background:var(--lilac);border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;transform:rotate(-11deg);box-shadow:2px 3px var(--ink)}
.dog-stamp::before{content:"";position:absolute;inset:6%;border:1px dashed var(--ink);border-radius:50%}
.dog-stamp img{width:52%;height:72%;object-fit:contain}
.spark{position:absolute;right:0;top:-4%;width:16%;height:18%;color:var(--violet);transform:rotate(9deg)}
.ribbon{color:var(--lime);background:var(--ink);padding:13px 0}
.ribbon .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px}
.ribbon span{font:800 clamp(16px,1.6vw,23px)/1.25 var(--display);letter-spacing:-.035em;white-space:nowrap}
.ribbon svg{width:17px;height:17px;color:var(--lilac)}
h2{font-size:clamp(46px,5.2vw,76px);line-height:.98;letter-spacing:-.07em}
.shop{display:grid;grid-template-columns:1fr 1.06fr;gap:9%;padding-block:clamp(75px,8vw,120px)}
.shop-intro{position:relative;min-height:330px}
.bird-drawing{position:absolute;width:97px;height:auto;transform:rotate(8deg);left:clamp(215px,18vw,260px);top:172px;opacity:.95}
.offerings{border-top:1.5px solid var(--ink);align-self:center}
.offerings article{padding:20px 0;border-bottom:1px solid var(--line)}
.offerings h3{font-size:clamp(25px,2.1vw,33px);letter-spacing:-.06em;margin-bottom:7px}
.offerings p,.groom-copy p:not(.kicker){font-size:1.02rem;max-width:54ch;color:#51475a}
.groom-section{background:var(--lilac);border-block:1px solid var(--ink)}
.groom{display:grid;grid-template-columns:1fr 1.05fr;gap:9.5%;align-items:center;padding-block:clamp(60px,7vw,102px)}
.groom-photo{background:var(--ink);border-radius:50% 50% 4px 4px;overflow:hidden;border:2px solid var(--ink);max-width:440px;aspect-ratio:1.08}
.groom-photo img{width:100%;height:100%;object-fit:cover;object-position:center 48%}
.groom-copy h2{margin-bottom:1.2rem}
.groom-copy p:not(.kicker){margin-bottom:.75rem;color:var(--ink);max-width:44ch}
.groom-copy .button{margin-top:.7rem}
.reviews{padding-block:clamp(74px,8vw,120px)}
.reviews h2{margin-bottom:2rem}
.review-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--ink);border-left:1px solid var(--ink)}
.review-grid>figure,.rating{padding:clamp(21px,2.4vw,35px);min-height:184px;display:flex;flex-direction:column;border-right:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.rating{background:var(--lime);gap:3px;justify-content:center}
.rating-num{font-size:48px;line-height:1;margin-bottom:4px}
.rating-num small{font-size:22px;letter-spacing:-.025em}
.rating>small{font-size:.72rem}
.rating a{font-size:.86rem;font-weight:700;display:flex;gap:6px;align-items:center;text-decoration:underline;text-underline-offset:3px;margin-top:8px}
.review-grid figure{justify-content:space-between;gap:22px}
.review-grid blockquote{font:800 clamp(21px,2vw,29px)/1.13 var(--display);letter-spacing:-.045em}
.review-grid figcaption{font-size:.77rem;letter-spacing:.025em}
.visit{background:var(--ink);color:var(--cream)}
.visit-grid{display:grid;grid-template-columns:1fr 1.06fr;gap:9%;align-items:center;padding-block:clamp(58px,7vw,94px)}
.visit .kicker,.visit h2{color:var(--lime)}
address{display:flex;align-items:flex-start;flex-direction:column;font-style:normal}
.address{font:800 clamp(23px,2.1vw,32px)/1.2 var(--display);letter-spacing:-.04em}
.number{margin:14px 0 8px;font-size:1.35rem;text-decoration:underline;text-underline-offset:4px}
.hours{font-size:.92rem;border-collapse:collapse;margin:0 0 18px}
.hours th{text-align:left;padding-right:15px}
.pale{background:var(--lime);color:var(--ink);border-color:var(--lime)}
.pale:hover{background:var(--cream)}
footer{padding-block:22px;display:flex;align-items:center;gap:22px;font-size:.78rem}
footer .wordmark img{width:70px;height:30px}
footer>a:last-child{margin-left:auto;font-weight:700;white-space:nowrap}
@media(max-width:1000px){
  .wrap{width:calc(100% - 68px)}.head{gap:24px}.headcall{padding:.65rem .8rem}.hero-grid{min-height:535px;padding:62px 0;gap:24px}.art{aspect-ratio:1}.actions{gap:.8rem}.ribbon .wrap{gap:10px}.groom{gap:6%}.shop{gap:6%}.bird-drawing{left:180px;top:150px;width:78px}
}
@media(max-width:760px){
  .wrap{width:calc(100% - 40px)}.head{height:66px;gap:12px}.wordmark img{width:80px;height:34px}.headcall{margin-left:auto;font-size:.83rem;min-height:40px}
  .mobile-menu{display:grid;place-items:center;background:transparent;border:1px solid var(--ink);border-radius:50%;height:40px;width:40px;cursor:pointer}
  nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--cream);border-bottom:1px solid var(--ink);padding:9px 20px 16px}
  nav.open{display:grid;gap:0}nav a{padding:.65rem 0}
  .hero-grid{grid-template-columns:1fr;gap:32px;padding:44px 0 48px;min-height:0}.intro{max-width:540px}.hero-grid .kicker{margin-bottom:16px}
  h1{font-size:clamp(70px,13vw,94px)}.lead{font-size:1.04rem;margin:1.1rem 0 1.2rem;max-width:47ch}
  .art{width:85%;max-width:350px;aspect-ratio:1.13;margin-block:5px 0}.photo{padding:7px 7px 0;box-shadow:4px 5px 0 var(--ink)}.photo figcaption{min-height:27px;font-size:.61rem}
  .ribbon{padding:12px 0}.ribbon .wrap{flex-wrap:wrap;justify-content:center;gap:7px 12px}.ribbon span{font-size:14px}.ribbon svg{width:11px;height:11px}
  .shop,.groom,.visit-grid{grid-template-columns:1fr;gap:28px}.shop,.reviews{padding-block:62px}.shop-intro{min-height:0}.shop-intro h2 br{display:none}.bird-drawing{left:auto;right:2%;top:-10px;width:62px}.shop-intro h2{max-width:78%}
  .offerings article{padding:17px 0}.groom{padding-block:48px;gap:30px}.groom-photo{max-width:none;width:min(100%,450px);aspect-ratio:1.45}.groom-copy h2 br{display:none}
  .review-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.review-grid>figure,.rating{min-height:165px}.reviews h2{margin-bottom:25px}
  .visit-grid{padding-block:50px;gap:28px}.visit-grid h2 br{display:none}.visit-grid .kicker{margin-bottom:14px}
  footer{gap:12px;flex-wrap:wrap}footer p{font-size:.7rem}
}
@media(max-width:495px){
  .ribbon .wrap{width:calc(100% - 20px);gap:5px 7px}.ribbon span{font-size:12px}.ribbon svg{width:8px;height:8px}
  .review-grid{grid-template-columns:1fr}.review-grid>figure,.rating{min-height:0;padding:22px}.review-grid figure{gap:12px}.headcall{gap:6px}
  .actions{gap:14px}.actions .button,.actions .textlink{font-size:.84rem}.actions .button{padding:.8rem 1rem}.bird-drawing{width:51px}
  footer p{flex:1;line-height:1.25}footer .wordmark img{width:57px;height:25px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
@media(min-width:761px) and (max-width:815px){h1{font-size:72px}}
@media(max-width:350px){h1{font-size:clamp(53px,18.8vw,65px)}.head{gap:7px}.ribbon .wrap{column-gap:5px}}
.perrolia{display:inline-flex;align-items:center;gap:5px;margin-top:15px;color:var(--cream);font-size:.88rem;text-decoration:underline;text-underline-offset:3px}.perrolia svg{width:14px;height:14px}
