/* self hosted, latin subset, variable so one file covers every weight we use.
   No second origin, so text paints without a cross origin DNS + TLS round trip. */
@font-face{font-family:"Newsreader";src:url(/assets/fonts/newsreader-latin.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Sans 3";src:url(/assets/fonts/source-sans-3-latin.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

*{box-sizing:border-box}
body{margin:0;background:#F6F1E7;color:#22201D;font-family:"Source Sans 3",system-ui,sans-serif;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:#4E5D3A;text-decoration:none}
a:hover{color:#3A462B}
h1,h2,h3{font-family:"Newsreader",Georgia,serif;font-weight:600;letter-spacing:-.012em;margin:0}
.wrap{max-width:1240px;margin:0 auto;padding:0 40px}
.lede{font-size:20px;line-height:1.62;color:#3D3A34}
.sm{font-size:15px;color:#5D5849}

/* header */
.hdr{position:absolute;top:0;left:0;right:0;z-index:20;padding:26px 0}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand img{display:block;height:52px;width:auto}
.hnav{display:flex;align-items:center;gap:22px}
.hnav a:not(.hbtn){font:600 14px/1 "Source Sans 3",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#F6F1E7;padding:8px 0;border-bottom:1px solid transparent}
.hnav a:not(.hbtn):hover{color:#fff;border-bottom-color:rgba(246,241,231,.6)}
.hnav a.on{border-bottom-color:#9FAE86;color:#fff}
.hnav a.hbtn{display:inline-flex;align-items:center;gap:9px;padding:13px 18px;font:700 14px/1 "Source Sans 3",sans-serif;letter-spacing:.08em;text-transform:uppercase;background:#4E5D3A;color:#F6F1E7;border:1px solid #4E5D3A}
.hnav a.hbtn:hover{background:#3F4C2E;color:#fff}
.hnav a.hbtn.ghost{background:transparent;border-color:rgba(246,241,231,.55);color:#F6F1E7}
.hnav a.hbtn.ghost:hover{background:rgba(246,241,231,.12);color:#fff}
.burger{display:none;align-items:center;gap:8px;font:700 13px/1 "Source Sans 3",sans-serif;letter-spacing:.1em;color:#F6F1E7;background:none;border:0;cursor:pointer;padding:10px 0;font-family:"Source Sans 3",sans-serif}
.hdr a:focus-visible,.hdr button:focus-visible{outline:3px solid #9FAE86;outline-offset:3px}

/* hero */
.hero{position:relative;overflow:hidden;min-height:530px;display:flex;align-items:flex-end;background:#2A271F}
.hero .slot{position:absolute;inset:0}
.hero .slot image-slot,.hero .slot img{background:#EBE4D5;width:100%;height:100%;object-fit:cover;display:block}
.hero .scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(24,22,18,.5) 0%,rgba(24,22,18,.06) 34%,rgba(24,22,18,.74) 100%)}
.hero .plate2{position:absolute;left:0;right:0;bottom:0;height:64%;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(24,22,18,0) 0%,rgba(24,22,18,.52) 34%,rgba(24,22,18,.76) 100%)}
.hero .wrap{position:relative;z-index:2;width:100%;flex:1 1 auto;padding-bottom:58px;padding-top:172px;pointer-events:none}
.hero .wrap a,.hero .wrap button{pointer-events:auto}
.hero h1{font-size:clamp(52px,7vw,92px);line-height:1;color:#F6F1E7;margin:0 0 20px;max-width:14ch}
.hero p{font-size:21px;line-height:1.5;color:#EDE7DA;margin:0;max-width:46ch}
.hero .place{font:700 12px/1 "Source Sans 3",sans-serif;letter-spacing:.28em;text-transform:uppercase;color:#F6F1E7;margin:0 0 22px}

/* .hero.mark: the branded homepage hero, composed like the share card. Centred,
   heavier veil, the logo doing the naming. The lighter two gradient treatment is
   for a hero whose text sits in the lower band; this one sits in the middle, so
   it needs one even veil instead. */
.hero.mark{align-items:center;text-align:center}
.hero.mark .scrim{background:linear-gradient(180deg,rgba(24,22,18,.86) 0%,rgba(24,22,18,.84) 48%,rgba(24,22,18,.90) 100%)}
.hero.mark .wrap{display:flex;flex-direction:column;align-items:center;padding-top:144px;padding-bottom:44px}
.heromark{display:block;width:min(520px,74vw);height:auto;margin:0 0 22px}
.hero.mark h1{font-size:clamp(30px,3.6vw,46px);max-width:18ch;margin:0 0 14px}
.hero.mark p{max-width:50ch}
@media (max-width:880px){
  .hero.mark .wrap{padding-top:112px;padding-bottom:36px}
  .heromark{width:min(340px,78vw);margin-bottom:18px}
  .hero.mark h1{font-size:clamp(27px,6.8vw,36px)}
}

/* page head (inner pages) */
.phead{background:#22201D;color:#F6F1E7;padding:172px 0 58px}
.phead .crumb{font:700 12px/1 "Source Sans 3",sans-serif;letter-spacing:.28em;text-transform:uppercase;color:#9FAE86;margin:0 0 22px}
.phead h1{font-size:clamp(40px,5.6vw,70px);line-height:1.04;color:#F6F1E7;margin:0 0 20px;max-width:17ch}
.phead p{font-size:20px;line-height:1.55;color:#CFC7B5;max-width:60ch;margin:0}

/* booking bar */
.bar{background:#EFE8DA;border-bottom:1px solid rgba(34,32,29,.16);position:relative;z-index:10}
.bar .wrap{display:flex;flex-wrap:wrap;align-items:stretch;gap:14px;padding-top:20px;padding-bottom:20px}
.bar .wrap.trustbar{display:grid;grid-template-columns:1fr 1fr;gap:0;padding-top:0;padding-bottom:0}
.tbcell{display:flex;flex-direction:column;gap:8px;padding:20px 34px 20px 0;min-width:0}
.tbcell+.tbcell{padding:20px 0 20px 34px;border-left:1px solid rgba(34,32,29,.16)}
.tblab{margin:0;font:700 10px/1 "Source Sans 3",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#6B6659}
.tbval{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;min-height:32px;font:400 15px/1.3 "Source Sans 3",sans-serif;color:#4A463C}
.tbval b{font-family:"Newsreader",Georgia,serif;font-size:21px;font-weight:600;letter-spacing:-.012em;color:#22201D;line-height:1.15}
.tbval em{font-style:normal;font-size:13px;letter-spacing:.14em;color:#4E5D3A;line-height:1}
a.tbval:hover{color:#22201D}
a.tbval:hover b{color:#4E5D3A}
a.tbval:focus-visible{outline:3px solid #4E5D3A;outline-offset:4px}
.tbval .addr{flex:1 1 auto}
.maps{display:flex;gap:8px;flex:none}
.maps a{display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:0 12px;border:1px solid rgba(34,32,29,.3);font:600 12px/14px "Source Sans 3",sans-serif;letter-spacing:.04em;color:#3D3A34;white-space:nowrap}
.maps a img,.maps a svg{display:block;width:14px;height:14px;opacity:.8;flex:none}
.maps a:hover img,.maps a:hover svg{opacity:1}
.maps a:hover{background:#E7E0CE;border-color:rgba(34,32,29,.5);color:#22201D}
.maps a:focus-visible{outline:3px solid #4E5D3A;outline-offset:2px}
.bar .wrap.callrow{display:flex;flex-wrap:wrap;align-items:center;gap:16px 30px;padding-top:24px;padding-bottom:24px}
.callrow .lead{flex:1 1 300px;margin:0;font:400 16px/1.5 "Source Sans 3",sans-serif;color:#4A463C}
.callrow .lead b{display:block;font-family:"Newsreader",Georgia,serif;font-size:24px;font-weight:600;letter-spacing:-.012em;color:#22201D;margin-bottom:3px}
.callact{display:flex;gap:12px;flex-wrap:wrap}
.callact a{display:inline-flex;align-items:center;gap:11px;min-height:60px;padding:0 26px;font:700 15px/1 "Source Sans 3",sans-serif;letter-spacing:.06em;text-transform:uppercase;border:1px solid #4E5D3A;background:#4E5D3A;color:#F6F1E7}
.callact a:hover{background:#3F4C2E;color:#fff}
.callact a.alt{background:transparent;color:#4E5D3A}
.callact a.alt:hover{background:rgba(78,93,58,.1);color:#3A462B}
.callact a:focus-visible{outline:3px solid #22201D;outline-offset:3px}
.callact svg{width:19px;height:19px;flex:none}
.bar .wrap.note{padding-top:0;padding-bottom:18px;gap:9px;flex-wrap:wrap;align-items:center;font:400 14px/1.3 "Source Sans 3",sans-serif;color:#5D5849}
.microtrust{display:flex;align-items:center;gap:9px;margin-left:auto;font:400 14px/1 "Source Sans 3",sans-serif;color:#3D3A34}
.microtrust b{font-family:"Newsreader",Georgia,serif;font-size:19px;font-weight:600}
.microtrust .ms{letter-spacing:.1em;color:#4E5D3A;font-size:12px}
.microtrust .mc{color:#6B6659}
.microtrust img{display:block;opacity:.75}
.microtrust:hover{color:#22201D}
.microtrust:hover img{opacity:1}
.dot{width:8px;height:8px;background:#4E5D3A;border-radius:50%;display:block;flex:none}
/* stamp */
.plate .wrap{position:relative}
.sec.plate{padding-top:60px;padding-bottom:40px}
.stamp{position:absolute;top:-79px;right:40px;transform:rotate(-2.5deg);transform-origin:100% 50%;background:#9FAE86;color:#22201D;padding:13px 22px;font:700 12px/1 "Source Sans 3",sans-serif;letter-spacing:.16em;text-transform:uppercase;box-shadow:5px 5px 0 rgba(20,19,16,.4);z-index:2}

/* sections */
.sec{padding:68px 0;position:relative}
.sec.tight{padding:52px 0}
.sec.alt{background:#EFE8DA;border-top:1px solid rgba(34,32,29,.14);border-bottom:1px solid rgba(34,32,29,.14)}
.rule{height:1px;background:rgba(34,32,29,.16)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start}
.two.lean{grid-template-columns:1.05fr .95fr}
h2.big{font-size:clamp(38px,4.4vw,58px);line-height:1.06;margin:0 0 22px}
h3.mid{font-size:27px;line-height:1.2;margin:0 0 10px}
.more{display:inline-flex;align-items:center;gap:10px;font:700 14px/1 "Source Sans 3",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#4E5D3A;border-bottom:1px solid rgba(78,93,58,.45);padding-bottom:6px}
.more:hover{color:#3A462B;border-bottom-color:#3A462B}
.more svg{width:16px;height:16px;transition:transform .2s cubic-bezier(.2,.7,.3,1)}
.more:hover svg{transform:translateX(5px)}
.more:focus-visible{outline:3px solid #4E5D3A;outline-offset:4px}
.sechead{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:end;margin-bottom:34px}
.sechead.stack{grid-template-columns:1fr;gap:14px;align-items:start}
/* a section head that has lost its heading is a lone intro line, so it should
   run the full width rather than sit in the left half of a two column grid */
.sechead:has(> :only-child){grid-template-columns:1fr}
.sechead.stack .lede{max-width:none}

/* rate plate */
.plate{background:#22201D;color:#F6F1E7}
.plate h2{color:#F6F1E7}
.rateone{display:grid;grid-template-columns:1.35fr .65fr;gap:0}
.rateone .lead{padding:14px 44px 18px 0;display:flex;flex-direction:column;justify-content:center}
.rateone .lead h3{font:700 12px/1 "Source Sans 3",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#9FAE86;margin:0 0 10px}
.rateone .lead .figure{font-size:76px;line-height:.92}
.rateone .lead .figure .cur{font-size:32px}
.rateone .lead p{font-size:17px;line-height:1.5;color:#CFC7B5;margin:8px 0 0;max-width:60ch}
.rateone .alt{padding:0;display:grid;grid-template-columns:1fr;align-content:center;border-left:1px solid rgba(246,241,231,.22)}
.altcard{padding:16px 0 16px 34px;display:flex;flex-direction:column;gap:5px}
.altcard+.altcard{border-left:0;border-top:1px solid rgba(246,241,231,.16)}
.altcard b{font:700 11px/1 "Source Sans 3",sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#9FAE86}
.altcard i{font-style:normal;font-family:"Newsreader",Georgia,serif;font-size:30px;font-weight:600;color:#E8E2D4;line-height:1}
.altcard i .cur{font-family:"Source Sans 3",sans-serif;font-size:16px;font-weight:400;color:#8F887A;vertical-align:.5em;margin-right:3px}
.altcard span{font:400 14px/1.45 "Source Sans 3",sans-serif;color:#A9A292}
.rate{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid rgba(246,241,231,.22)}
.rate .cell{padding:26px 30px 26px;border-right:1px solid rgba(246,241,231,.22)}
.rate .cell:last-child{border-right:0}
.rate .cell h3{letter-spacing:.14em;text-transform:uppercase;font-family:"Source Sans 3",sans-serif;font-weight:700;color:#9FAE86;margin:0 0 10px;font-size:12px}
.figure{font-family:"Newsreader",Georgia,serif;font-weight:600;font-size:58px;line-height:1;color:#F6F1E7;display:block}
.figure .cur{font-family:"Source Sans 3",sans-serif;font-size:24px;font-weight:400;color:#A9A292;vertical-align:.9em;margin-right:4px}
.rate .cell p{font-size:16px;color:#CFC7B5;margin:10px 0 0;line-height:1.5}
.plate .foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:0;padding-top:20px;border-top:1px solid rgba(246,241,231,.22)}
.fnote{display:flex;align-items:baseline;gap:6px;border:1px solid rgba(246,241,231,.3);padding:9px 13px;white-space:nowrap}
.fnote b::after{content:":";color:rgba(246,241,231,.55);font-weight:400}
.fnote b{font:600 13px/1 "Source Sans 3",sans-serif;letter-spacing:.04em;color:#F6F1E7}
.fnote i{font-style:normal;font:400 13px/1 "Source Sans 3",sans-serif;color:#B9C4A4}
.platelink{margin-left:auto;font:600 15px/1 "Source Sans 3",sans-serif;color:#9FAE86;border-bottom:1px solid rgba(159,174,134,.5);padding-bottom:3px;white-space:nowrap}
.platelink:hover{color:#DCE2CE;border-bottom-color:#DCE2CE}

/* gallery */
.gal{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.gal .cell{position:relative;overflow:hidden;background:#EBE4D5}
.gal .cell image-slot,.gal .cell img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.3,1)}
.gal .cell:hover image-slot,.gal .cell:hover img{transform:scale(1.04)}
.gal .a{grid-column:span 7;height:420px}
.gal .b{grid-column:span 5;height:420px}
.gal .c{grid-column:span 4;height:280px}
.gal .d{grid-column:span 4;height:280px}
.gal .e{grid-column:span 4;height:280px}
.gal .f{grid-column:span 6;height:320px}

.terms{display:grid;grid-template-columns:1fr 1fr;gap:34px 52px}
.terms h3{font-size:23px;line-height:1.2;margin:0 0 8px}
.terms p{font-size:16px;line-height:1.6;color:#4A463C;margin:0}
.terms p b{color:#22201D;font-weight:600}

/* amenities */
.amen{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:40px;padding-top:34px;border-top:1px solid rgba(34,32,29,.2)}
.amen.plain{margin-top:0;padding-top:0;border-top:0}
.am .ic{width:56px;height:56px;flex:none;display:flex;align-items:center;justify-content:center;border:1px solid rgba(34,32,29,.26);background:#FFFDF8;margin:0 0 18px}
.am .ic svg{width:26px;height:26px;color:#4E5D3A;display:block;margin:0}
.am svg{width:30px;height:30px;color:#4E5D3A;display:block;margin:0 0 16px}
.am h3{font-size:22px;line-height:1.2;margin:0 0 8px}
.am p{font-size:16px;line-height:1.55;color:#4A463C;margin:0}

/* spec table */
.spec{width:100%;border-collapse:collapse;border-top:1px solid rgba(34,32,29,.24)}
.spec th,.spec td{text-align:left;padding:16px 18px 16px 0;border-bottom:1px solid rgba(34,32,29,.16);vertical-align:top;font-size:16px}
.spec th{font:700 11px/1.3 "Source Sans 3",sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#6B6659;padding-top:14px;padding-bottom:14px;white-space:nowrap}
.spec td b{font-weight:600}
.spec tbody th{font:600 17px/1.4 "Source Sans 3",sans-serif;letter-spacing:0;text-transform:none;color:#22201D}

/* reviews */
.revband{background:#4E5D3A;color:#F6F1E7}
.revband .wrap{display:flex;align-items:stretch;gap:40px;padding-top:30px;padding-bottom:30px}
.rleft{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
.rscore{display:flex;align-items:center;gap:12px}
.rnum{font-family:"Newsreader",Georgia,serif;font-weight:600;font-size:50px;line-height:.9;color:#F6F1E7}
.rstars{font-size:15px;letter-spacing:.13em;color:#DFE5D2}
.rscore p{margin:4px 0 0;font:400 14px/1 "Source Sans 3",sans-serif;color:#DCE2CE}
.rquote{flex:1;margin:0;display:flex;flex-direction:column;justify-content:center;border-left:1px solid rgba(246,241,231,.3);padding-left:34px}
.rquote p{font-family:"Newsreader",Georgia,serif;font-size:20px;line-height:1.42;margin:0 0 6px;color:#F6F1E7}
.rquote footer{font:400 14px/1 "Source Sans 3",sans-serif;color:#DCE2CE}
.rquote footer span{font-weight:600;color:#F6F1E7}
.rplats{display:flex;gap:7px}
.rplats a{display:flex;align-items:center;gap:7px;border:1px solid rgba(246,241,231,.4);background:rgba(246,241,231,.08);padding:7px 10px;font:600 13px/1 "Source Sans 3",sans-serif;color:#F6F1E7}
.rplats a svg{flex:none}
.rplats a:hover{background:rgba(246,241,231,.18);border-color:rgba(246,241,231,.7)}
.rplats img{display:block}

/* events */
.evs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.evs.two-up{grid-template-columns:repeat(2,1fr)}
.ev{border:1px solid rgba(34,32,29,.2);background:#FFFDF8;padding:26px 24px;display:flex;flex-direction:column;gap:14px;transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .2s}
.ev:hover{transform:translate(-4px,-4px);box-shadow:6px 6px 0 rgba(78,93,58,.2)}
.ev .when{display:flex;align-items:baseline;gap:10px;font:700 12px/1 "Source Sans 3",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#4E5D3A}
.ev .when b{font-family:"Newsreader",Georgia,serif;font-size:34px;letter-spacing:0;font-weight:600;color:#22201D}
.ev h3{font-size:22px;margin:0}
.ev p{font-size:16px;color:#4A463C;margin:0}
.ev .src{font-size:14px;color:#6B6659;margin-top:auto}
a.src{display:inline-flex;align-items:center;gap:5px;width:fit-content;border-bottom:1px solid rgba(34,32,29,.22);padding-bottom:2px}
a.src:hover{color:#4E5D3A;border-bottom-color:#4E5D3A}
a.src:focus-visible{outline:3px solid #4E5D3A;outline-offset:3px}
/* the arrow says the link leaves the site; .vh text says the same to a screen reader */
a.src .ext{width:11px;height:11px;flex:none;transform:translateY(-1px)}

/* contact panels */
.panels{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.panel{border:1px solid rgba(34,32,29,.22);background:#FFFDF8;padding:28px 26px;display:flex;flex-direction:column;gap:10px}
.panel h3{font-size:22px;margin:0}
.panel p{margin:0;font-size:16px;color:#4A463C;line-height:1.6}
.panel .big-line{font-family:"Newsreader",Georgia,serif;font-size:28px;font-weight:600;color:#22201D;line-height:1.2}
.panel .tag{font:700 11px/1 "Source Sans 3",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#4E5D3A}

/* faq */
.faq{display:grid;grid-template-columns:1fr 1fr;gap:30px 52px}
.faq h3{font-size:21px;margin:0 0 8px}
.faq p{margin:0;font-size:16px;color:#4A463C;line-height:1.6}

/* cta */
.cta{background:#4E5D3A;color:#F6F1E7;text-align:center}
/* The events band sits between the reviews band and the call to action, and all
   three grounds are pasture green. When the events band is empty it is dropped
   entirely, which butts two green blocks together into one slab. Hairline the
   seam, the same device used everywhere else on an ink ground. */
.revband+.sec.cta{border-top:1px solid rgba(246,241,231,.22)}
.sec.cta{padding:48px 0}
.cta h2{color:#F6F1E7;font-size:clamp(30px,3.2vw,42px);margin:0 0 12px}
.cta p{font-size:18px;color:#DFE5D2;margin:0 auto 24px;max-width:44ch}
.cta .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.ctagrid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;text-align:left}
.ctagrid h2{margin:0 0 12px}
.ctagrid p{margin:0 0 24px;max-width:40ch}
.ctagrid .row{justify-content:flex-start}
.ctamap{position:relative;border:1px solid rgba(246,241,231,.35);background:#3F4C2E;min-height:300px}
.ctamap iframe{display:block;width:100%;height:100%;min-height:300px;border:0;filter:grayscale(.25) contrast(1.04)}
.ctamap .pin{position:absolute;left:0;bottom:0;background:#22201D;color:#F6F1E7;padding:11px 16px;font:600 14px/1.35 "Source Sans 3",sans-serif;border-top:1px solid rgba(246,241,231,.35);border-right:1px solid rgba(246,241,231,.35)}
.ctamap .pin span{display:block;font:400 13px/1.35 "Source Sans 3",sans-serif;color:#B9B2A2}
.cta .b1{background:#F6F1E7;color:#22201D;border:1px solid #F6F1E7;padding:16px 30px;font:700 15px/1 "Source Sans 3",sans-serif;letter-spacing:.08em;text-transform:uppercase}
.cta .b1:hover{background:#fff}
.cta .b2{background:transparent;color:#F6F1E7;border:1px solid rgba(246,241,231,.6);padding:16px 30px;font:700 15px/1 "Source Sans 3",sans-serif;letter-spacing:.08em;text-transform:uppercase}
.cta .b2:hover{background:rgba(246,241,231,.14)}

/* pager */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid rgba(34,32,29,.2)}
.pager a{padding:34px 0;display:flex;flex-direction:column;gap:7px}
.pager a+a{border-left:1px solid rgba(34,32,29,.2);padding-left:40px}
.pager span{font:700 11px/1 "Source Sans 3",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#6B6659}
.pager b{font-family:"Newsreader",Georgia,serif;font-size:29px;font-weight:600;color:#22201D;line-height:1.15}
.pager a:hover b{color:#4E5D3A}

/* footer */
.ftr{background:#22201D;color:#CFC7B5;padding:72px 0 40px}
.ftr img{height:64px;width:auto;display:block;margin-bottom:20px}
.ftr p a{color:#CFC7B5}
.ftr p a:hover{color:#F6F1E7}
.fgrid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:56px}
.ftr h3{font-size:19px;color:#9FAE86;margin:0 0 16px;padding-bottom:11px;border-bottom:1px solid rgba(159,174,134,.35)}
.fcol{display:flex;flex-direction:column;gap:11px;font-size:16px}
.fcol a{color:#CFC7B5}
.fcol a:hover{color:#F6F1E7}
.ftr .base{margin-top:52px;padding-top:24px;border-top:1px solid rgba(246,241,231,.16);display:flex;justify-content:space-between;gap:14px 28px;font-size:14px;color:#8F887A;flex-wrap:wrap}
.ftr .legal{display:flex;flex-wrap:wrap;gap:8px 22px}
.ftr .legal a{color:#8F887A}
.ftr .legal a:hover{color:#CFC7B5}

/* mobile */
.mnav{display:none}
@media (max-width:880px){
  .wrap{padding:0 22px}
  .hnav{display:none}
  .burger{display:flex}
  .hdr{padding:18px 0}
  .brand img{height:40px}
  .hero{min-height:460px}
  .hero .wrap{padding-top:126px;padding-bottom:40px}
  .hero h1{font-size:clamp(42px,11vw,58px)}
  .hero p{font-size:18px}
  .phead{padding:126px 0 42px}
  .phead h1{font-size:clamp(34px,9vw,46px)}
  .phead p{font-size:18px}
  .bar .wrap{flex-direction:column;gap:10px}
  .bar .wrap.trustbar{grid-template-columns:1fr}
  .tbcell{padding:16px 0}
  .tbcell+.tbcell{padding:16px 0;border-left:0;border-top:1px solid rgba(34,32,29,.16)}
  .bar .wrap.callrow{align-items:stretch;gap:18px}
  .callact{width:100%}
  .callact a{flex:1 1 auto;justify-content:center;padding:0 18px}
  .sec{padding:46px 0}
  .sec.cta{padding:36px 0}
  .ctagrid{grid-template-columns:1fr;gap:26px}
  .ctamap,.ctamap iframe{min-height:240px}
  .sec.tight{padding:38px 0}
  .two,.two.lean,.sechead{grid-template-columns:1fr;gap:26px}
  /* where a column holds nothing but the heading, the stacked gap is separating
     a heading from its own copy, so close it up and drop the paragraph's lead-in */
  .two:has(>div>h2:only-child){row-gap:10px}
  .two>div>.lede:first-child{margin-top:0}
  .sechead{margin-bottom:28px}
  .rate{grid-template-columns:1fr}
  .rateone{grid-template-columns:1fr}
  .rateone .lead{padding:22px 0;border-right:0;border-bottom:1px solid rgba(246,241,231,.22)}
  .rateone .lead .figure{font-size:66px}
  .rateone .alt{padding:0;grid-template-columns:1fr;border-left:0}
  .altcard{padding:18px 0}
  .altcard+.altcard{border-left:0;border-top:1px solid rgba(246,241,231,.16)}
  .rate .cell{border-right:0;border-bottom:1px solid rgba(246,241,231,.22);padding:22px 0}
  /* chips wrap two-up and crowd on a phone. Give each its own full width row,
     label left and value right, so the block breathes */
  .plate .foot{gap:10px;padding-top:22px}
  .fnote{flex:1 1 100%;justify-content:space-between;white-space:normal;padding:11px 14px}
  .platelink{margin-left:0;margin-top:12px}
  .rate .cell:last-child{border-bottom:0}
  .figure{font-size:50px}
  .gal{grid-template-columns:repeat(2,1fr);gap:10px}
  .gal .a,.gal .b,.gal .f{grid-column:span 2;height:260px}
  .gal .c,.gal .d,.gal .e{grid-column:span 2;height:200px}
  .terms,.faq{grid-template-columns:1fr;gap:26px}
  .amen{grid-template-columns:1fr 1fr;gap:24px;margin-top:36px;padding-top:30px}
  .am .ic{width:46px;height:46px;margin-bottom:14px}
  .am .ic svg{width:22px;height:22px}
  .am svg{width:26px;height:26px;margin-bottom:12px}
  .sec.plate{padding-top:46px}
  .stamp{top:-62px;right:22px;padding:10px 16px;font-size:11px}
  .am h3{font-size:19px}
  .evs,.evs.two-up,.panels{grid-template-columns:1fr}
  .spec th,.spec td{padding:12px 12px 12px 0;font-size:15px}
  .revband .wrap{flex-direction:column;align-items:flex-start;gap:22px;padding-top:24px;padding-bottom:24px}
  .rquote{border-left:0;padding-left:0}
  .rplats{flex-wrap:wrap}
  .rleft{width:100%;align-items:flex-start}
  .pager{grid-template-columns:1fr}
  .pager a+a{border-left:0;border-top:1px solid rgba(34,32,29,.2);padding-left:0}
  .fgrid{grid-template-columns:1fr;gap:32px}
  .mnav{display:grid;position:fixed;bottom:0;left:0;right:0;grid-template-columns:repeat(4,1fr);background:#EFE8DA;border-top:1px solid rgba(34,32,29,.3);z-index:30}
  /* padding-bottom pulls the centred icon+label group up by half its value, to
     offset the label's line box sitting lower than its visible glyphs */
  .mnav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:66px;padding-bottom:7px;font:600 12px/1 "Source Sans 3",sans-serif;color:#6B6659;border-right:1px solid rgba(34,32,29,.14)}
  .mnav a:last-child{border-right:0}
  .mnav a.on{color:#4E5D3A;background:#F6F1E7;box-shadow:inset 0 3px 0 #4E5D3A}
  .ftr{padding-bottom:110px}
}

/* construction notice */
.notice{background:#4E5D3A;color:#F6F1E7;border-bottom:1px solid rgba(34,32,29,.3)}
.notice .wrap{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 22px;padding-top:14px;padding-bottom:14px}
.notice p{margin:0;font:400 15px/1.5 "Source Sans 3",sans-serif;color:#E7E9DC}
.notice p b{font-weight:700;color:#F6F1E7;letter-spacing:.02em}
.notice a{position:relative;font:600 14px/1.4 "Source Sans 3",sans-serif;letter-spacing:.04em;color:#F6F1E7;border-bottom:1px solid rgba(246,241,231,.55);padding-bottom:2px;white-space:nowrap}
/* the visible link is 22px tall, which is under the 24px target minimum and
   small for a thumb on what is the primary call to action on a phone. Extend
   the hit area without dragging the underline away from the text. */
.notice a:after{content:"";position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);height:44px}
.notice a:hover{border-bottom-color:#F6F1E7}

/* full-bleed photo bands */
.band{position:relative;overflow:hidden;background:#2A271F;height:62vh;min-height:420px;max-height:620px}
picture{display:contents}
.band>img,.band>picture>img{display:block;width:100%;height:100%;object-fit:cover}
.band .cap{position:absolute;left:max(0px, calc((100% - 1160px) / 2));bottom:30px;max-width:520px;background:#F6F1E7;border:1px solid rgba(34,32,29,.3);border-left:0;padding:18px 26px 20px;box-shadow:2px 2px 0 rgba(24,22,18,.22)}
.band .cap b{display:block;font:700 11px/1 "Source Sans 3",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#4E5D3A;margin-bottom:8px}
.band .cap p{margin:0;font:400 17px/1.55 "Source Sans 3",sans-serif;color:#3D3A34}
.band .cap p em{font-style:italic;color:#6B6659}
@media (min-width:1240px){.band .cap{border-left:1px solid rgba(34,32,29,.3)}}

.band.dark{height:auto;min-height:0;max-height:none;display:grid}
.band.dark>img,.band.dark>picture>img{position:absolute;inset:0;height:100%}
.band.dark .ink{position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,22,18,.92) 0%,rgba(24,22,18,.82) 46%,rgba(24,22,18,.42) 100%)}
.band.dark .wrap{position:relative;z-index:2;padding-top:58px;padding-bottom:58px;color:#F6F1E7}
.band.dark h2{color:#F6F1E7;font-size:clamp(28px,2.8vw,38px);line-height:1.08;max-width:26ch;margin:0 0 16px}
.band.dark p{font:400 17px/1.6 "Source Sans 3",sans-serif;color:#DCD6C7;max-width:50ch;margin:0 0 12px}
.band.dark .attrib{font:400 14px/1.5 "Source Sans 3",sans-serif;color:#9FAE86;margin-top:16px}

/* numbers band */
.nums{background:#F6F1E7;border-bottom:1px solid rgba(34,32,29,.16)}
.nums .wrap{display:grid;grid-template-columns:repeat(4,1fr);padding-top:0;padding-bottom:0}
.numcell{padding:38px 30px 36px 0}
.numcell+.numcell{padding-left:30px;border-left:1px solid rgba(34,32,29,.16)}
.numcell b{display:block;font:600 clamp(46px,5vw,72px)/1 "Newsreader",Georgia,serif;letter-spacing:-.02em;color:#22201D}
.numcell b{white-space:nowrap}
.numcell b .u{display:inline;margin:0 0 0 4px;font-family:"Source Sans 3",sans-serif;font-size:.34em;font-weight:400;color:#6B6659;letter-spacing:0;vertical-align:.28em}
.numcell b .cur{display:inline;margin:0;font-family:"Source Sans 3",sans-serif;font-size:.44em;font-weight:400;color:#6B6659;letter-spacing:0;vertical-align:.42em}
.numcell>span{display:block;margin-top:12px;font:400 15px/1.5 "Source Sans 3",sans-serif;color:#5D5849;max-width:22ch}

.notice.mob{display:none}

/* sticky desktop call bar */
.ftr{padding-bottom:78px}
.callbar{position:fixed;left:0;right:0;bottom:0;z-index:40;background:#22201D;border-top:1px solid rgba(246,241,231,.22)}
.callbar .wrap{display:flex;align-items:center;gap:16px 26px;padding-top:12px;padding-bottom:12px}
.callbar p{margin:0;font:400 15px/1.4 "Source Sans 3",sans-serif;color:#CFC7B5}
.callbar p b{color:#F6F1E7;font-weight:600}
.callbar .acts{display:flex;gap:10px;margin-left:auto}
.callbar a{white-space:nowrap;display:inline-flex;align-items:center;gap:9px;padding:13px 24px;font:700 14px/1 "Source Sans 3",sans-serif;letter-spacing:.08em;text-transform:uppercase;background:#4E5D3A;border:1px solid #4E5D3A;color:#F6F1E7}
.callbar a:hover{background:#3F4C2E;border-color:#3F4C2E;color:#fff}
.callbar a.ghost{background:transparent;color:#F6F1E7;border-color:rgba(246,241,231,.55)}
.callbar a.ghost:hover{background:rgba(246,241,231,.12);border-color:rgba(246,241,231,.55);color:#fff}
.callbar a:focus-visible{outline:3px solid #9FAE86;outline-offset:3px}

@keyframes paddockdrift{from{transform:scale(1.06) translate3d(0,0,0)}to{transform:scale(1.14) translate3d(-1.6%,-1.4%,0)}}
.hero .slot img{animation:paddockdrift 30s ease-in-out infinite alternate}
@media (prefers-reduced-motion:reduce){.hero .slot img{animation:none}}

@media (max-width:880px){
  .band{height:auto;min-height:0;max-height:none}
  .band>img,.band>picture>img{height:56vw;min-height:240px}
  /* extra bottom padding is the landing zone for the stamp that straddles the
     seam below, so it never sits on the last line of the quote */
  .band .cap{position:static;max-width:none;border-left:0;border-right:0;box-shadow:none;padding-bottom:30px}
  .band.dark>img,.band.dark>picture>img{position:absolute;height:100%}
  .band.dark .wrap{padding-top:44px;padding-bottom:44px}
  .band.dark .ink{background:linear-gradient(180deg,rgba(24,22,18,.72) 0%,rgba(24,22,18,.92) 100%)}
  .nums .wrap{grid-template-columns:1fr 1fr}
  .numcell{padding:26px 20px 24px 0}
  .numcell:nth-child(2n){padding-left:20px;border-left:1px solid rgba(34,32,29,.16)}
  .numcell:nth-child(2n+1){padding-left:0;border-left:0}
  .numcell:nth-child(n+3){border-top:1px solid rgba(34,32,29,.16)}
  .callbar{display:none}
  .notice.mob{display:block}
  .ftr{padding-bottom:110px}
}

/* stamp hangs over the seam between the photo band and the plate */
.band+.sec.plate .stamp{top:-79px;box-shadow:6px 6px 0 rgba(20,19,16,.4)}

.hbtn{white-space:nowrap}
@media (max-width:1180px){
  .hnav{gap:16px}
  .hnav a.hbtn{padding:12px 14px;letter-spacing:.05em}
}

/* straddling the green strip: a bone chip reads on both the green above and the ink below */
.notice+.sec.plate{padding-top:52px}
.notice+.sec.plate .stamp{top:-72px;background:#F6F1E7;color:#22201D;box-shadow:0 2px 0 rgba(34,32,29,.28)}
/* desktop: the notice is hidden, so the plate follows the photo head. keep the stamp inside the bone. */
.notice.mob+.sec.plate{padding-top:56px}
.notice.mob+.sec.plate .stamp{top:-79px;right:40px;background:#F6F1E7;box-shadow:6px 6px 0 rgba(20,19,16,.4)}
@media (max-width:880px){
  .notice+.sec.plate .stamp{top:-62px;right:22px}
  .notice.mob+.sec.plate{padding-top:46px}
  .notice.mob+.sec.plate .stamp{top:-62px;background:#F6F1E7;box-shadow:5px 5px 0 rgba(20,19,16,.4)}
  /* The stamp hangs over the seam, as it does on desktop. On a phone the band
     stacks the caption below the photo and it ends flush at the seam, but its
     bottom 20px is padding, so a 20px overhang sits over that rather than over
     the quote. Stamps are positioned against .wrap, so top is measured from the
     content edge: 46px of padding minus 66 puts the stamp 20px above the seam. */
  .band+.sec.plate{padding-top:46px}
  .band+.sec.plate .stamp{top:-66px;right:22px;box-shadow:5px 5px 0 rgba(20,19,16,.4)}
}

/* page head with a photograph behind it */
.phead.shot{position:relative;overflow:hidden;background:#2A271F}
.phead.shot>img,.phead.shot>picture>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phead.shot .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(24,22,18,.86) 0%,rgba(24,22,18,.62) 52%,rgba(24,22,18,.9) 100%)}
.phead.shot .wrap{position:relative;z-index:2}

/* stacked spec rows: label above its description */
.spec.stack,.spec.stack tbody{display:block;width:100%;border-top:0}
.spec.stack tr{display:block;padding:15px 0;border-bottom:1px solid rgba(34,32,29,.16)}
.spec.stack tr:first-child{padding-top:0}
.spec.stack tr:last-child{border-bottom:0;padding-bottom:0}
.spec.stack tr{display:grid;grid-template-columns:minmax(180px,240px) 1fr;gap:8px 40px;align-items:baseline}
.spec.stack th{display:block;text-align:left;padding:0;border:0;white-space:normal}
.spec.stack td{display:block;padding:0;border:0;font-size:16px;line-height:1.55;color:#4A463C;max-width:none}
@media (max-width:700px){
  .spec.stack tr{display:block}
  .spec.stack th{padding-bottom:5px}
}

.lede+.lede{margin-top:16px}

/* pager sits flush against the sections above and below */
.sec.tight:has(>.wrap>.pager){padding-top:0;padding-bottom:0}


/* legal documents (privacy, terms) */
.legaldoc{display:grid;grid-template-columns:238px 1fr;gap:0 60px;align-items:start}
/* Terms carries 15 entries, which is taller than a laptop viewport. A sticky
   box with no overflow simply hides the tail with no way to reach it, so cap it
   and let it scroll on its own. */
.legaldoc .toc{position:sticky;top:34px;max-height:calc(100vh - 113px);overflow-y:auto;overscroll-behavior:contain;padding-right:6px}
.legaldoc .toc h2{font:700 11px/1 "Source Sans 3",sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#6B6659;margin:0 0 16px}
.legaldoc .toc a{display:block;font-size:15px;line-height:1.4;color:#3D3A34;text-decoration:none;padding:9px 0;border-top:1px solid rgba(34,32,29,.16)}
.legaldoc .toc a:hover{color:#4E5D3A}
.legalbody{max-width:74ch}
.legalbody>section+section{margin-top:40px;padding-top:36px;border-top:1px solid rgba(34,32,29,.16)}
.legalbody h2{font-size:28px;line-height:1.2;margin:0 0 14px}
.legalbody h3{font-size:19px;margin:26px 0 8px}
.legalbody p{font-size:17px;line-height:1.62;color:#3D3A34;margin:0 0 14px}
.legalbody p:last-child{margin-bottom:0}
.legalbody ul{list-style:none;margin:14px 0;padding:0;display:grid;gap:11px}
.legalbody li{position:relative;padding-left:22px;font-size:17px;line-height:1.6;color:#3D3A34}
.legalbody li:before{content:"";position:absolute;left:0;top:12px;width:9px;height:1px;background:#4E5D3A}
.legalbody .updated{font:700 11px/1 "Source Sans 3",sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#6B6659}
@media (max-width:880px){
  .legaldoc{grid-template-columns:1fr;gap:34px}
  .legaldoc .toc{position:static;max-height:none;overflow:visible;padding-right:0}
}


/* anchored sections: ease into place and clear the header */
html{scroll-behavior:smooth}
[id]{scroll-margin-top:112px}
@media (max-width:880px){[id]{scroll-margin-top:88px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}


/* contact: ways to reach us, stacked in the left column */
.reach{margin-top:32px;display:grid;gap:0}
.reach>div{padding:20px 0;border-top:1px solid rgba(34,32,29,.16)}
.reach>div:last-child{border-bottom:1px solid rgba(34,32,29,.16)}
.reach .line{display:flex;align-items:center;gap:14px;margin:0 0 8px;font-family:"Newsreader",Georgia,serif;font-size:23px;line-height:1.15;letter-spacing:-.012em}
.reach .line a{color:#22201D;text-decoration:none;border-bottom:1px solid rgba(34,32,29,.28)}
.reach .line a:hover{color:#4E5D3A;border-bottom-color:#4E5D3A}
.reach .ic{flex:none;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(34,32,29,.26);background:#FFFDF8;color:#4E5D3A;margin-top:-6px}
.reach .ic svg{width:21px;height:21px;display:block}
.reach p:not(.line){margin:0;font-size:16px;line-height:1.55;color:#5D5849;max-width:none}
@media (max-width:880px){.reach .line{font-size:21px}}

.ftr .base .credit{display:block;margin-top:7px;font-size:14px;color:#8F887A}
.ftr .base .credit a{color:#8F887A;border-bottom:1px solid rgba(246,241,231,.22)}
.ftr .base .credit a:hover{color:#CFC7B5;border-bottom-color:rgba(246,241,231,.5)}

.skip{position:absolute;left:-9999px;top:0;z-index:60;background:#22201D;color:#F6F1E7;padding:14px 20px;font:700 13px/1 "Source Sans 3",sans-serif;letter-spacing:.1em;text-transform:uppercase}
.skip:focus{left:0}


/* mobile: comparison tables become stacked rows with inline chips */
@media (max-width:700px){
  table.spec:not(.stack){display:block;border-top:0}
  table.spec:not(.stack) thead{display:none}
  table.spec:not(.stack) tbody{display:block}
  table.spec:not(.stack) tr{display:flex;flex-wrap:wrap;gap:6px 18px;padding:16px 0;border-bottom:1px solid rgba(34,32,29,.16)}
  table.spec:not(.stack) tr:first-child{padding-top:0}
  table.spec:not(.stack) tr:last-child{border-bottom:0}
  table.spec:not(.stack) tbody th{flex:1 1 100%;padding:0;border:0;font:600 18px/1.3 "Source Sans 3",sans-serif;letter-spacing:0;text-transform:none;color:#22201D;white-space:normal}
  table.spec:not(.stack) td{padding:0;border:0;font-size:16px;line-height:1.5;color:#4A463C}
  table.spec:not(.stack) td:first-of-type{flex:1 1 100%}
  table.spec:not(.stack) td:not(:first-of-type){flex:0 0 auto;display:flex;align-items:baseline;gap:6px;font-size:15px;color:#22201D}
  table.spec:not(.stack) td:not(:first-of-type)::before{content:attr(data-label);font:700 10px/1 "Source Sans 3",sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#6B6659}
  table.spec:not(.stack) td:not(:first-of-type):empty{display:none}
}

/* mobile: micro-labels and inline CTAs get a little more room */
@media (max-width:880px){
  .tblab{font-size:11px}
  .more{padding:11px 0}
  .platelink{padding:10px 0}
  .ftr .legal a{padding:4px 0}
}


/* contact: what to tell us */
.askfor{border:1px solid rgba(34,32,29,.22);background:#FFFDF8;padding:30px 28px;display:flex;flex-direction:column;gap:14px}
.askfor .tag{margin:0;font:700 11px/1 "Source Sans 3",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#4E5D3A}
.askfor .big-line{margin:0;font-family:"Newsreader",Georgia,serif;font-size:28px;font-weight:600;letter-spacing:-.012em;color:#22201D;line-height:1.2}
.askfor ul{list-style:none;margin:2px 0 4px;padding:0;display:grid;gap:10px}
.askfor li{position:relative;padding-left:22px;font-size:16px;line-height:1.55;color:#4A463C}
.askfor li:before{content:"";position:absolute;left:0;top:12px;width:9px;height:1px;background:#4E5D3A}
.askfor .callact{margin-top:4px}
@media (max-width:880px){
  .askfor{padding:24px 22px}
  .askfor .callact{width:100%}
  .askfor .callact a{flex:1 1 auto;justify-content:center}
}


/* visually hidden, still announced. For headings that keep the document outline
   intact where the design has no visible heading to give. */
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* gallery zoom affordance + lightbox. Square corners, ink ground, hairlines,
   same as everything else. The <dialog> gives us the focus trap, Escape and
   focus restore for free. */
.zoom{display:block;width:100%;height:100%;position:relative;cursor:zoom-in}
.zoomcue{position:absolute;right:12px;bottom:12px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:rgba(34,32,29,.72);border:1px solid rgba(246,241,231,.5);color:#F6F1E7;opacity:0;transition:opacity .2s cubic-bezier(.2,.7,.3,1)}
.zoomcue svg{width:19px;height:19px}
.zoom:hover .zoomcue,.zoom:focus-visible .zoomcue{opacity:1}
.zoom:focus-visible{outline:3px solid #9FAE86;outline-offset:-3px}
@media (hover:none){.zoomcue{opacity:1}}

/* scroll lock is declarative so it cannot get stuck on if script never runs */
html:has(dialog.lb[open]){overflow:hidden}
.lb{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100%;height:100%;overflow:hidden;color:#F6F1E7}
.lb::backdrop{background:rgba(20,19,16,.94)}
.lbfig{margin:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:64px 68px}
.lbfig picture{display:contents}
.lbimg{display:block;max-width:100%;max-height:calc(100vh - 168px);width:auto;height:auto;object-fit:contain;background:#2A271F}
.lbcap{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;justify-content:center;max-width:70ch;text-align:center}
.lbtext{font:400 15px/1.45 "Source Sans 3",sans-serif;color:#CFC7B5}
.lbcount{font:700 11px/1 "Source Sans 3",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#9FAE86;white-space:nowrap}
.lbclose,.lbnav{position:absolute;display:flex;align-items:center;justify-content:center;background:rgba(34,32,29,.72);border:1px solid rgba(246,241,231,.4);color:#F6F1E7;cursor:pointer;padding:0}
.lbclose{top:16px;right:16px;width:48px;height:48px}
.lbnav{top:50%;transform:translateY(-50%);width:48px;height:64px}
.lbprev{left:12px}
.lbnext{right:12px}
.lbclose svg,.lbnav svg{width:22px;height:22px}
.lbclose:hover,.lbnav:hover{background:#4E5D3A;border-color:#4E5D3A}
.lbclose:focus-visible,.lbnav:focus-visible{outline:3px solid #9FAE86;outline-offset:3px}
.lbnav[hidden]{display:none}
@media (max-width:880px){
  .lbfig{padding:56px 12px 76px}
  .lbimg{max-height:calc(100vh - 190px)}
  .lbnav{top:auto;bottom:12px;transform:none;width:56px;height:48px}
  .lbprev{left:12px}
  .lbnext{right:12px}
  .lbclose{top:12px;right:12px}
}

/* Skip rendering work for offscreen blocks until they are scrolled near.
   Applied only to leaf blocks that contain no anchor target: putting this on a
   .sec, .terms or .legalbody would make the browser mis-compute the position of
   the ids inside them on a cold load of a deep link. contain-intrinsic-size uses
   the `auto` keyword so the real size is remembered after the first render.
   The fallbacks are measured, not guessed, and differ per breakpoint: a single
   compromise value put the page height ~450px out on desktop, which is enough
   to land a deep link in the wrong place before the blocks have rendered. */
.gal{content-visibility:auto;contain-intrinsic-size:auto 1052px}
.amen{content-visibility:auto;contain-intrinsic-size:auto 394px}
.faq{content-visibility:auto;contain-intrinsic-size:auto 564px}
.evs{content-visibility:auto;contain-intrinsic-size:auto 498px}
.panels{content-visibility:auto;contain-intrinsic-size:auto 236px}
.revband{content-visibility:auto;contain-intrinsic-size:auto 151px}
.ftr{content-visibility:auto;contain-intrinsic-size:auto 514px}
@media (max-width:880px){
  .gal{contain-intrinsic-size:auto 1700px}
  .amen{contain-intrinsic-size:auto 900px}
  .faq{contain-intrinsic-size:auto 1359px}
  .evs{contain-intrinsic-size:auto 1542px}
  .panels{contain-intrinsic-size:auto 678px}
  .revband{contain-intrinsic-size:auto 295px}
  .ftr{contain-intrinsic-size:auto 1116px}
}

/* mobile menu: MORE opens a panel under the header. A details/summary drives
   the state, so it works with no script. The panel itself sits outside the
   <details> and is revealed with :has(), because Chrome's ::details-content
   establishes containment and would size an absolutely positioned panel to the
   summary rather than to .hdr. Shown only under 880px, where .hnav is hidden. */
.burgerwrap{display:none}
.burgerwrap>summary.burger{display:flex;list-style:none}
.burgerwrap>summary.burger::-webkit-details-marker{display:none}
.burgerwrap>summary.burger::marker{content:"";font-size:0}
.burgerwrap>summary.burger:focus-visible{outline:3px solid #9FAE86;outline-offset:3px}
.burger .ic-close,.burger .lb-close{display:none}
.burgerwrap[open]>summary .ic-open,.burgerwrap[open]>summary .lb-open{display:none}
.burgerwrap[open]>summary .ic-close,.burgerwrap[open]>summary .lb-close{display:block}
/* full screen ink takeover, per wireframe F1b: one destination per row at 60px,
   Newsreader labels, a sage icon on each, and the phone as a real button */
.mmenu{display:none;position:fixed;inset:0;z-index:40;background:#22201D;overflow-y:auto;overscroll-behavior:contain;padding:90px 20px 26px}
/* rows bleed 13px past the panel padding so the current-page rail has a gutter
   to sit in. Labels still line up on 20px, and nothing shifts when a row is on. */
.mmenu a:not(.hbtn){display:flex;align-items:center;gap:14px;min-height:60px;margin:0 -13px;padding:0 13px;color:#F6F1E7;font:600 21px/1.2 "Newsreader",Georgia,serif;letter-spacing:-.012em;border-bottom:1px solid rgba(246,241,231,.16)}
.mmenu a:not(.hbtn):last-of-type{border-bottom:0}
/* centring the boxes leaves the icon low, because the label's line box carries
   descender space its glyphs mostly do not use. Lift the icon onto the text's
   cap height centre, which is stable whether or not the word has a descender. */
.mmenu a:not(.hbtn) svg{flex:none;stroke:#9FAE86;transform:translateY(-3px)}
.mmenu a:not(.hbtn):hover{color:#fff}
/* current page: sage rail down the left, full height of the link, with the whole
   row lifted. Same device as the bottom bar's .on state. */
.mmenu a.on{color:#fff;background:rgba(246,241,231,.06);box-shadow:inset 3px 0 0 #9FAE86}
.mmenu a:focus-visible{outline:3px solid #9FAE86;outline-offset:-3px}
/* .hbtn is scoped to .hnav in the header, so the menu carries its own buttons */
.mmenu .acts{display:grid;gap:10px;margin-top:26px}
.mmenu .acts a{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:60px;padding:0 18px;font:700 14px/1 "Source Sans 3",sans-serif;letter-spacing:.08em;text-transform:uppercase;background:#4E5D3A;border:1px solid #4E5D3A;color:#F6F1E7}
.mmenu .acts a:hover{background:#3F4C2E;border-color:#3F4C2E;color:#fff}
.mmenu .acts a.ghost{background:transparent;border-color:rgba(246,241,231,.55)}
.mmenu .acts a.ghost:hover{background:rgba(246,241,231,.12);border-color:rgba(246,241,231,.55);color:#fff}
.mmenu .acts a svg{flex:none;transform:translateY(-1.5px)}
@media (max-width:880px){
  .burgerwrap{display:block}
  /* reveal only where the burger exists, so a menu left open on a phone does
     not strand an orphaned panel after a rotate or resize past the breakpoint */
  .hdr:has(.burgerwrap[open]) .mmenu{display:block}
  /* header pins above the panel so the logo and CLOSE stay put and tappable */
  .hdr:has(.burgerwrap[open]){position:fixed;background:#22201D;border-bottom:1px solid rgba(246,241,231,.2)}
  .hdr:has(.burgerwrap[open]) .wrap{position:relative;z-index:41}
  body:has(.burgerwrap[open]){overflow:hidden}
}


/* Spacing utilities replacing the prototypes inline style attributes. The
   Content-Security-Policy sets style-src 'self', which blocks style="" outright,
   so those declarations never applied in production. !important reproduces the
   precedence an inline attribute had. */
.nb{white-space:nowrap}
.m0{margin:0!important}
.mt0{margin-top:0!important}
.mt6{margin-top:6px!important}
.mt14{margin-top:14px!important}
.mt18{margin-top:18px!important}
.mt22{margin-top:22px!important}
.mt26{margin-top:26px!important}
.mt28{margin-top:28px!important}
.mt30{margin-top:30px!important}
.mt34{margin-top:34px!important}
.mb18{margin:0 0 18px!important}
.mb26{margin:0 0 26px!important}
.mto18{margin:18px 0 0!important}
.faddr{margin:0!important;font-size:16px;line-height:1.7}
.fsub{margin:18px 0 0!important;font-size:15px;color:#8F887A}