/* Legenda site: the app's own language. Dark always, one metal accent, inscriptions in Didot, signage in Avenir, reading in Iowan. */
:root{
  --obs:#0B0A09;--obsidian:#141311;--basalt:#201E1A;--slate:#32302A;
  --chalk:#EDE8DE;--ash:#938C80;--gilt:#C9A063;--bronze:#8A6A3C;
  --hair:rgba(237,232,222,.16);--glass:rgba(20,19,17,.78);
  --display:"Didot","Bodoni 72","Bodoni MT",Georgia,serif;
  --ui:"Avenir Next","Avenir","Helvetica Neue",Helvetica,Arial,sans-serif;
  --read:"Iowan Old Style","Charter",Palatino,Georgia,serif;
  --r:4px;
}
*{box-sizing:border-box}html{background:var(--obs);color-scheme:dark;scroll-behavior:smooth}
body{margin:0;color:var(--chalk);font:19px/1.65 var(--read);background:var(--obs);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}a{color:var(--gilt);text-underline-offset:.2em}a:hover{color:var(--chalk)}
:focus-visible{outline:2px solid var(--gilt);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--gilt);color:var(--obs);padding:8px 14px;border-radius:var(--r);font:600 14px var(--ui)}.skip:focus{left:8px;z-index:20}
.wrap{max-width:1120px;margin:0 auto;padding:0 28px}
/* label: tracked capitals over a hairline, the app's SectionLabel */
.label{font:600 12px/1 var(--ui);letter-spacing:.34em;text-transform:uppercase;color:var(--ash);padding-bottom:14px;border-bottom:1px solid var(--hair);margin:0 0 28px}
.label b{color:var(--gilt);font-weight:600}
h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:.03em;line-height:1.1;margin:0}
h1{font-size:clamp(44px,7vw,92px)}h2{font-size:clamp(32px,4.4vw,52px);margin-bottom:.4em}h3{font-size:30px;margin-bottom:.35em}.plate h3{font-size:clamp(30px,3.4vw,42px)}
p{margin:0 0 1em}.lede{font-size:clamp(19px,2vw,23px);color:#d8d2c6;max-width:27em}
.meander{height:12px;opacity:.55;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12' viewBox='0 0 24 12'%3E%3Cpath d='M0 11.5H3.5V.5H20.5V8.5H8V4H16.5' fill='none' stroke='%23C9A063' stroke-width='1'/%3E%3C/svg%3E") repeat-x}
/* nav */
.nav{position:absolute;inset:0 0 auto 0;z-index:5}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--chalk);font:400 22px var(--display);letter-spacing:.34em;text-transform:uppercase}
.brand img{width:34px;height:auto;opacity:.95}
.nav nav{display:flex;gap:28px;font:600 12px var(--ui);letter-spacing:.26em;text-transform:uppercase}
.nav nav a{color:var(--ash);text-decoration:none}.nav nav a:hover,.nav nav a[aria-current]{color:var(--gilt)}
/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--obs) url(img/hero.jpg) right 4% top/auto 100% no-repeat}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--obs) 0%,var(--obs) 30%,rgba(11,10,9,.78) 50%,rgba(11,10,9,.12) 100%),linear-gradient(0deg,var(--obs) 0%,rgba(11,10,9,0) 24%)}
.hero .wrap{padding-top:96px;padding-bottom:72px}
.hero .kicker{font:600 12px/1 var(--ui);letter-spacing:.4em;text-transform:uppercase;color:var(--gilt);margin-bottom:26px}
.hero h1{max-width:9em;margin-bottom:.35em}
.cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.btn{display:inline-block;font:600 13px/1 var(--ui);letter-spacing:.24em;text-transform:uppercase;text-decoration:none;padding:17px 26px;border-radius:var(--r);border:1px solid var(--gilt);color:var(--chalk)}
.btn.fill{background:var(--gilt);color:var(--obs)}.btn:hover{background:rgba(201,160,99,.16);color:var(--chalk)}.btn.fill:hover{background:var(--chalk);color:var(--obs)}
.hero .note{font:500 14px var(--ui);color:var(--ash);margin-top:22px;max-width:30em}
@media (max-width:820px){.hero::before{background-position:center top;background-size:cover}.hero::after{background:linear-gradient(180deg,rgba(11,10,9,.55),rgba(11,10,9,.82) 55%,var(--obs))}.nav nav a:not([aria-current]){display:none}.nav nav a.keep{display:inline}}
/* feature plates */
section{padding:88px 0}
.plate{position:relative;display:grid;grid-template-columns:1fr minmax(240px,320px);gap:56px;align-items:center;padding:56px;border:1px solid var(--hair);border-radius:var(--r);overflow:hidden;isolation:isolate;margin-bottom:28px;background:var(--obsidian)}
.plate::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--bg) var(--pos,center)/cover no-repeat}
.plate::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(11,10,9,.9) 0%,rgba(11,10,9,.7) 46%,rgba(11,10,9,.28) 100%)}
.plate.flip{grid-template-columns:minmax(240px,320px) 1fr}.plate.flip .words{order:2}
.plate.flip::after{background:linear-gradient(270deg,rgba(11,10,9,.9) 0%,rgba(11,10,9,.7) 46%,rgba(11,10,9,.28) 100%)}
.plate .words .num{font:600 12px var(--ui);letter-spacing:.34em;color:var(--gilt);margin-bottom:18px;display:block}
.plate .words p{color:#d8d2c6;max-width:27em}
.phones{display:flex;gap:18px;justify-content:center}
.phone{height:auto;border-radius:38px;border:1px solid rgba(201,160,99,.45);box-shadow:0 30px 70px rgba(0,0,0,.6);overflow:hidden;background:#000;width:100%}
.phones.two .phone{width:calc(50% - 9px)}
@media (max-width:860px){.plate,.plate.flip{grid-template-columns:1fr;padding:30px 24px;gap:32px}.plate.flip .words{order:0}.phones{max-width:340px;margin:0 auto}.phones.two{max-width:100%}}
/* films */
.films{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.film{display:block;position:relative;border:1px solid var(--hair);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--chalk);background:var(--obsidian)}
.film img{aspect-ratio:9/16;object-fit:cover;width:100%;transition:transform .6s}.film:hover img{transform:scale(1.03)}
.film span{position:absolute;left:0;right:0;bottom:0;padding:44px 18px 16px;background:linear-gradient(0deg,rgba(11,10,9,.94),rgba(11,10,9,0));font:600 12px/1.4 var(--ui);letter-spacing:.2em;text-transform:uppercase}
@media (max-width:700px){.films{grid-template-columns:1fr 1fr}.film:last-child{display:none}}
/* privacy band */
.band{position:relative;isolation:isolate;border-block:1px solid var(--hair);padding:96px 0;overflow:hidden}
.band::before{content:"";position:absolute;inset:0;z-index:-2;background:url(img/fresco.jpg) center 30%/cover no-repeat}
.band::after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(11,10,9,.86)}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:36px}
.three div{border-top:1px solid var(--gilt);padding-top:18px}.three p{color:#d8d2c6;font-size:17px}
@media (max-width:760px){.three{grid-template-columns:1fr}}
/* closing + footer */
.close{text-align:center}.close img{width:72px;margin:0 auto 26px;opacity:.95}.close .cta{justify-content:center}.close .lede{margin:0 auto 1em}
footer{padding:48px 0 64px}footer .wrap{display:flex;flex-wrap:wrap;gap:18px 40px;justify-content:space-between;align-items:center;font:500 14px var(--ui);color:var(--ash)}
footer a{color:var(--ash);text-decoration:none;letter-spacing:.16em;text-transform:uppercase;font-size:12px}footer a:hover{color:var(--gilt)}
footer .links{display:flex;gap:26px}
/* plain pages (support, privacy) */
.page{padding:150px 0 80px}.page .wrap{max-width:760px}.page h1{font-size:clamp(38px,6vw,64px);margin-bottom:.4em}.page h2{font-size:28px;color:var(--gilt);margin-top:1.8em}
.page .nav{position:absolute}
@media (prefers-reduced-motion:no-preference){.hero .wrap>*{animation:rise .9s both}.hero .wrap>*:nth-child(2){animation-delay:.12s}.hero .wrap>*:nth-child(3){animation-delay:.24s}.hero .wrap>*:nth-child(4){animation-delay:.36s}@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}}