/* =========================================================
   Design tokens
   ========================================================= */
:root{
  --navy:#7e1317; --navy-800:#6b1014; --navy-900:#550d10;
  --blue:#9a1a1f; --blue-600:#7e1317; --sky:#fbeced;
  --amber:#ffbb13; --amber-700:#e0a200; --gold-ink:#8a5d00; --green:#0f7a5c; --green-700:#0b5f47;
  --ink:#152233; --body:#4a5a6e; --muted:#7a8798;
  --line:#e7dcdc; --line-soft:#f3eaea;
  --bg:#ffffff; --bg-alt:#faf6f5; --bg-deep:#550d10;
  --wrap:1180px; --r:10px; --r-lg:16px;
  --sh-sm:0 1px 2px rgba(126,19,23,.06), 0 2px 8px rgba(126,19,23,.05);
  --sh-md:0 4px 14px rgba(126,19,23,.09);
  --sh-lg:0 18px 44px rgba(85,13,16,.16);
  --sans:"Segoe UI",Roboto,"Helvetica Neue",Arial,system-ui,sans-serif;
}

/* =========================================================
   Base
   ========================================================= */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;font-family:var(--sans);font-size:17px;line-height:1.65;color:var(--body);background:var(--bg)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{color:var(--ink);line-height:1.2;margin:0 0 .5em;font-weight:700;letter-spacing:-.015em}
h1{font-size:clamp(2rem,4.2vw,3.15rem)}
h2{font-size:clamp(1.55rem,2.9vw,2.3rem)}
h3{font-size:1.2rem}
p{margin:0 0 1.1em}
a{color:var(--blue-600);text-decoration:none}
a:hover{text-decoration:underline}
ul{margin:0;padding:0}
figure,blockquote{margin:0}
details summary{list-style:none}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:4px;box-shadow:0 0 0 5px rgba(85,13,16,.3)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:.7rem 1.1rem;z-index:200}
.skip:focus{left:0}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:22px}

/* =========================================================
   Buttons
   ========================================================= */
.btn{display:inline-block;padding:.82rem 1.5rem;border-radius:var(--r);font-weight:700;font-size:.97rem;
     background:var(--amber);color:#fff;border:2px solid var(--amber);transition:.16s ease;cursor:pointer;text-align:center}
.btn:hover{background:var(--amber-700);border-color:var(--amber-700);text-decoration:none;color:#fff}
.btn--sm{padding:.5rem 1.05rem;font-size:.88rem}
.btn--blue{background:var(--blue);border-color:var(--blue)}
.btn--blue:hover{background:var(--blue-600);border-color:var(--blue-600)}
.btn--light{background:#fff;border-color:#fff;color:var(--navy)}
.btn--light:hover{background:var(--sky);border-color:var(--sky);color:var(--navy-900)}
.btn--blue{color:#fff}
.btn--blue:hover{color:#fff}
.btn--ghost{background:transparent;border-color:var(--navy);color:var(--navy)}
.btn--ghost:hover{background:var(--navy);color:#fff}
.btn--ghost-light{background:transparent;border-color:rgba(255,255,255,.7);color:#fff}
.btn--ghost-light:hover{background:rgba(255,255,255,.14);border-color:#fff;color:#fff}

/* =========================================================
   Utility bar
   ========================================================= */
.utility{background:var(--navy-900);color:#c6d8ee;font-size:.84rem}
.utility__in{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:40px;flex-wrap:wrap}
.utility__note{margin:0}
.utility__links{display:flex;gap:1.35rem;align-items:center}
.utility a{color:#f6e6e7}
.utility__login{border:1px solid rgba(255,255,255,.35);padding:.18rem .8rem;border-radius:999px}

/* =========================================================
   Header + nav
   ========================================================= */
.site-head{background:#fff;border-bottom:3px solid var(--amber);position:sticky;top:0;z-index:100;box-shadow:var(--sh-sm)}
.site-head__in{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;min-height:84px}
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:.3rem;color:var(--ink);line-height:1;padding-block:.35rem}
.brand:hover{text-decoration:none}
.brand__logo{height:40px;width:auto;max-width:none;flex:none}
.brand__mark{width:44px;height:44px;flex:none;border-radius:11px;background:linear-gradient(150deg,var(--blue),var(--navy));
             color:#fff;display:grid;place-items:center;font-weight:800;font-size:1.3rem}
.brand__text strong{display:block;font-size:1.05rem;letter-spacing:.02em;line-height:1.25}
.brand__text small{display:block;font-size:.66rem;line-height:1.32;color:var(--muted);
  max-width:228px;letter-spacing:.005em}

.nav__list{display:flex;align-items:center;gap:.15rem;list-style:none}
.nav__item{position:relative}
.nav__link{display:block;padding:.6rem .62rem;font-size:.9rem;white-space:nowrap;font-weight:600;color:var(--ink);border-radius:7px}
.nav__link:hover{background:var(--sky);color:var(--navy);text-decoration:none}
.nav__link.is-current{color:var(--blue-600);box-shadow:inset 0 -3px 0 var(--amber)}
.subnav{position:absolute;top:calc(100% + 6px);left:0;min-width:224px;background:#fff;border:1px solid var(--line);
        border-radius:var(--r);box-shadow:var(--sh-lg);padding:.4rem;list-style:none;opacity:0;visibility:hidden;
        transform:translateY(-6px);transition:.15s ease;z-index:60}
.nav__item.has-sub:hover .subnav,.nav__item.has-sub:focus-within .subnav{opacity:1;visibility:visible;transform:none}
.subnav a{display:block;padding:.52rem .75rem;border-radius:6px;font-size:.9rem;color:var(--body)}
.subnav a:hover{background:var(--bg-alt);color:var(--navy);text-decoration:none}
.nav__item--cta{margin-left:.5rem}

.navtoggle{display:none;background:none;border:1px solid var(--line);border-radius:8px;padding:.55rem .6rem;cursor:pointer}
.navtoggle span{display:block;width:22px;height:2px;background:var(--ink);margin:4px 0;transition:.2s}
.navtoggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.navtoggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.navtoggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* =========================================================
   Hero slider
   ========================================================= */
.hero{position:relative;background:var(--bg-deep);overflow:hidden}
.slide{display:none;position:relative;min-height:460px}
.slide.is-active{display:block;animation:fade .5s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}
.slide::before{content:"";position:absolute;inset:0;opacity:.9}
.slide-a::before{background:linear-gradient(115deg,#4a0b0e 0%,#7e1317 55%,#9a1a1f 100%)}
.slide-b::before{background:linear-gradient(115deg,#3d090c 0%,#7e1317 50%,#b8891a 130%)}
.slide-c::before{background:linear-gradient(115deg,#550d10 0%,#8e1519 46%,#e0a200 128%)}
.slide::after{content:"";position:absolute;inset:0;opacity:.16;
  background-image:radial-gradient(circle at 1px 1px,#fff 1px,transparent 0);background-size:22px 22px}
.slide__in{position:relative;z-index:2;display:flex;align-items:center;min-height:460px;padding-block:4rem}
.slide__copy{max-width:620px;color:#fff}
.slide__eyebrow{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);padding:.32rem .85rem;border-radius:999px;margin-bottom:1.1rem}
.slide__copy h1{color:#fff;margin-bottom:.5em}
.slide__copy p{font-size:1.13rem;color:#d6e6f7;margin-bottom:1.7em;max-width:52ch}

.hero__dots{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);display:flex;gap:.55rem;z-index:5}
.hero__dots button{width:36px;height:5px;border:0;border-radius:99px;background:rgba(255,255,255,.38);cursor:pointer;padding:0}
.hero__dots button[aria-selected="true"]{background:var(--amber);width:52px}
.hero__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(255,255,255,.4);background:rgba(85,13,16,.35);color:#fff;font-size:1.3rem;cursor:pointer;display:grid;place-items:center}
.hero__arrow:hover{background:rgba(85,13,16,.7)}
.hero__arrow--prev{left:16px} .hero__arrow--next{right:16px}

/* =========================================================
   Sections
   ========================================================= */
.section{padding-block:76px}
.section--alt{background:var(--bg-alt)}
.section--deep{background:var(--bg-deep);color:#cfe0f2}
.section--deep h2,.section--deep h3{color:#fff}
.section--deep .eyebrow{color:var(--amber)}
.section__head{max-width:720px;margin:0 auto 2.8rem;text-align:center}
.section__head p{font-size:1.06rem;margin-bottom:0}
.eyebrow{display:block;font-size:.79rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:.7rem}

/* Mission / intro */
.mission{display:grid;grid-template-columns:1.25fr .75fr;gap:3.2rem;align-items:center}
.mission p:last-child{margin-bottom:0}
.mission__lead{font-size:1.2rem;color:var(--ink)}
.stats{display:grid;gap:1rem}
.stat{background:var(--sky);border-left:4px solid var(--blue);border-radius:var(--r);padding:1.05rem 1.25rem}
.stat b{display:block;font-size:1.9rem;color:var(--navy);line-height:1.1}
.stat span{font-size:.9rem;color:var(--body)}

/* Service grid */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.7rem;box-shadow:var(--sh-sm);
      transition:.18s ease;display:flex;flex-direction:column}
/* A plain card is information, not a button — it stays put.
   Only a card that actually leads somewhere reacts to the cursor. */
.card--link{position:relative;cursor:pointer}
.card--link:hover,
.card--link:focus-within{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:#c9a3a5}

/* The whole card is the click target, not just the small link at the bottom. */
.card--link .card__more::before{content:"";position:absolute;inset:0;border-radius:inherit}
.card--link:focus-within{outline:3px solid var(--amber);outline-offset:3px}
.card--link .card__more:focus-visible{outline:none}

/* The icon fills in, so it is obvious which card the cursor is on. */
.card--link .card__icon{transition:background .18s ease,color .18s ease,transform .18s ease}
.card--link:hover .card__icon,
.card--link:focus-within .card__icon{background:var(--navy);color:#fff;transform:scale(1.04)}

/* and the arrow leans towards where it is taking you */
.card__more::after{display:inline-block;transition:transform .18s ease}
.card--link:hover .card__more::after,
.card--link:focus-within .card__more::after{transform:translateX(4px)}
.card h3{margin-bottom:.45em}
.card p{font-size:.96rem;margin-bottom:1.1em}
.card__more{margin-top:auto;font-weight:700;font-size:.92rem;color:var(--blue-600)}
.card__more::after{content:" \2192"}
.card__icon{width:48px;height:48px;border-radius:12px;background:var(--sky);color:var(--navy);
            display:grid;place-items:center;margin-bottom:1.1rem}
.card__icon svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* Testimonials */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.quote{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.7rem;box-shadow:var(--sh-sm)}
.quote p{font-size:1rem;color:var(--ink);font-style:italic;margin-bottom:1.2em}
.quote__by{display:flex;align-items:center;gap:.75rem}
.quote__logo{width:40px;height:40px;border-radius:9px;background:linear-gradient(150deg,var(--sky),#d3e4f6);
             color:var(--navy);display:grid;place-items:center;font-weight:800;font-size:.9rem;flex:none}
.quote__by b{display:block;font-size:.92rem;color:var(--ink)}
.quote__by span{font-size:.83rem;color:var(--muted)}

/* Events */
.events{list-style:none;display:grid;gap:.75rem}
.event{display:grid;grid-template-columns:78px 1fr auto;gap:1.2rem;align-items:center;background:#fff;
       border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.25rem}
.event__date{text-align:center;background:var(--navy);color:#fff;border-radius:8px;padding:.45rem 0}
.event__date b{display:block;font-size:1.45rem;line-height:1;color:#fff}
.event__date span{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}
.event__body h3{font-size:1.03rem;margin-bottom:.15em}
.event__meta{font-size:.87rem;color:var(--muted);margin:0}
.event__cta{white-space:nowrap}

/* Prefoot CTA */
.prefoot{background:linear-gradient(115deg,var(--navy-900),var(--blue));color:#fff;padding-block:56px}
.prefoot__in{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.prefoot h2{color:#fff;margin-bottom:.3em}
.prefoot p{margin:0;color:#d3e5f8}
.prefoot__actions{display:flex;gap:.8rem;flex-wrap:wrap}

/* Footer */
.site-foot{background:var(--navy-900);color:#a9c2dd;font-size:.93rem;padding-top:52px}
.site-foot__cols{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;padding-bottom:2.4rem}
.foot-col h3{color:#fff;font-size:.83rem;letter-spacing:.13em;text-transform:uppercase;margin-bottom:1rem}
.foot-col ul{list-style:none;display:grid;gap:.55rem}
.site-foot a{color:#c3d8ee}
.foot-contact li{line-height:1.5}
.site-foot__base{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
                 border-top:1px solid rgba(255,255,255,.14);padding-block:1.2rem;font-size:.86rem}
.site-foot__base p{margin:0}
.legal{list-style:none;display:flex;gap:1.3rem}

/* =========================================================
   Inner page pieces
   ========================================================= */
.pagehead{background:linear-gradient(115deg,var(--navy-900),#9a1a1f);color:#fff;padding-block:62px}
.pagehead h1{color:#fff;margin-bottom:.35em}
.pagehead p{color:#cfe2f5;font-size:1.1rem;max-width:60ch;margin:0}
.crumbs{list-style:none;display:flex;gap:.5rem;font-size:.85rem;color:#a8c6e5;margin-bottom:1.1rem}
.crumbs a{color:#d6e8fa}
.crumbs li+li::before{content:"/";margin-right:.5rem;color:#6e93bd}

.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;align-items:start}
.plan{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.9rem;box-shadow:var(--sh-sm)}
.plan--feature{border:2px solid var(--blue);box-shadow:var(--sh-md);position:relative}
.plan__flag{position:absolute;top:-13px;left:1.9rem;background:var(--amber);color:#fff;font-size:.74rem;font-weight:700;
            letter-spacing:.09em;text-transform:uppercase;padding:.25rem .8rem;border-radius:999px}
.plan__price{font-size:2.1rem;font-weight:800;color:var(--navy);line-height:1.1;margin:.3em 0 .1em}
.plan__price small{font-size:.85rem;font-weight:500;color:var(--muted)}
.ticks{list-style:none;display:grid;gap:.6rem;margin:1.3rem 0 1.7rem;font-size:.95rem}
.ticks li{padding-left:1.65rem;position:relative}
.ticks li::before{content:"";position:absolute;left:0;top:.42em;width:1rem;height:.55rem;
  border-left:2.5px solid var(--blue);border-bottom:2.5px solid var(--blue);transform:rotate(-45deg)}

.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg);background:#fff}
table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:560px}
th,td{padding:.85rem 1.1rem;text-align:left;border-bottom:1px solid var(--line-soft)}
th{background:var(--bg-alt);color:var(--ink);font-size:.83rem;letter-spacing:.06em;text-transform:uppercase}
tbody tr:last-child td{border-bottom:0}

details.acc{background:#fff;border:1px solid var(--line);border-radius:var(--r);margin-bottom:.7rem;overflow:hidden}
details.acc summary{cursor:pointer;padding:1rem 1.25rem;font-weight:700;color:var(--ink);list-style:none;position:relative}
details.acc summary::-webkit-details-marker{display:none}
details.acc summary::after{content:"+";position:absolute;right:1.25rem;color:var(--blue);font-size:1.3rem;line-height:1}
details.acc[open] summary::after{content:"\2212"}
details.acc .acc__body{padding:0 1.25rem 1.1rem;font-size:.96rem}

.form{display:grid;gap:1.1rem;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.9rem;box-shadow:var(--sh-sm)}
.field{display:grid;gap:.35rem}
.field label{font-weight:600;font-size:.9rem;color:var(--ink)}
.field input,.field select,.field textarea{font:inherit;font-size:.97rem;padding:.72rem .9rem;border:1px solid var(--line);
  border-radius:8px;background:#fff;color:var(--ink);width:100%}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--blue);outline:2px solid var(--sky)}
.field--2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}

.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.post__tag{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--blue-600);background:var(--sky);padding:.22rem .65rem;border-radius:999px;margin-bottom:.8rem}
.post__meta{font-size:.85rem;color:var(--muted)}

.product{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-sm);display:flex;flex-direction:column}
.product__thumb{aspect-ratio:4/3;background:linear-gradient(150deg,var(--sky),#cddff2);display:grid;place-items:center;
  color:var(--navy);font-weight:800;font-size:1.1rem;letter-spacing:.05em;text-align:center;padding:1rem}
.product__body{padding:1.3rem;display:flex;flex-direction:column;flex:1}
.product__price{font-weight:800;color:var(--navy);font-size:1.25rem;margin:.2rem 0 1rem}

.team{display:grid;grid-template-columns:repeat(4,1fr);gap:1.8rem 1.4rem}
.member{text-align:center}
.member__avatar{width:96px;height:96px;margin:0 auto .9rem;border-radius:50%;background:linear-gradient(150deg,var(--blue),var(--navy));
  color:#fff;display:grid;place-items:center;font-size:1.6rem;font-weight:800}
.member b{display:block;color:var(--ink)}
.member span{display:block;font-size:.88rem;color:var(--muted)}
.member__state{font-size:.8rem;color:var(--gold-ink);font-weight:600}

.split{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.9rem;box-shadow:var(--sh-sm)}
.mb0{margin-bottom:0}
.center{text-align:center}
.mt2{margin-top:2rem}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:1150px){
  .brand__text small{display:none}
  .nav__link{padding:.55rem .45rem;font-size:.85rem}
}
@media (max-width:1040px){
  .nav__link{padding:.5rem .38rem;font-size:.82rem}
  .team{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .brand__text small{display:block;white-space:normal}
  .navtoggle{display:block}
  .nav{position:absolute;top:100%;left:0;right:0;background:#fff;border-top:1px solid var(--line);
       box-shadow:var(--sh-lg);display:none;max-height:76vh;overflow-y:auto}
  .nav.is-open{display:block}
  .nav__list{flex-direction:column;align-items:stretch;gap:0;padding:.5rem 22px 1.2rem}
  .nav__item{border-bottom:1px solid var(--line-soft)}
  .nav__link{padding:.9rem .2rem;font-size:1rem;white-space:normal}
  .nav__link.is-current{box-shadow:none;border-left:3px solid var(--amber);padding-left:.6rem}
  .subnav{position:static;opacity:1;visibility:visible;transform:none;border:0;box-shadow:none;padding:0 0 .6rem .9rem}
  .nav__item--cta{border:0;padding-top:.9rem}
  .nav__item--cta .btn{display:block}
  .site-head__in{position:relative;min-height:68px}
  .mission,.split{grid-template-columns:1fr;gap:2rem}
  .grid-3,.quotes,.plans,.posts{grid-template-columns:repeat(2,1fr)}
  .site-foot__cols{grid-template-columns:repeat(2,1fr)}
  .slide,.slide__in{min-height:400px}
}
@media (max-width:640px){
  body{font-size:16px}
  .section{padding-block:54px}
  .utility__note{display:none}
  .utility__in{justify-content:center}
  /* the language switch takes room, so let the links wrap tidily
     and never break the phone number across lines */
  .utility__links{flex-wrap:wrap;justify-content:center;gap:.45rem 1rem}
  .utility__links>a{white-space:nowrap}
  .grid-3,.grid-2,.quotes,.plans,.posts,.team{grid-template-columns:1fr}
  .event{grid-template-columns:60px 1fr;gap:.9rem}
  .event__cta{grid-column:1/-1}
  .event__cta .btn{width:100%}
  .field--2{grid-template-columns:1fr}
  .hero__arrow{display:none}
  .prefoot__actions .btn{width:100%}
  .site-foot__base{justify-content:center;text-align:center}
}

/* FICCIM additions */
.badge-soft{display:inline-block;align-self:flex-start;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  background:#fff3d6;color:var(--gold-ink);padding:.24rem .7rem;border-radius:999px}
.todo{border-left:4px solid var(--amber);background:#fff8ef;padding:1rem 1.2rem;border-radius:0 var(--r) var(--r) 0;
  font-size:.93rem;color:#7a5314;margin-bottom:1.6rem}
.todo b{color:#5e3f0d}
.chamber{display:flex;gap:.9rem;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);padding:1.1rem 1.25rem}
.chamber__dot{width:10px;height:10px;border-radius:50%;background:var(--amber);margin-top:.5rem;flex:none}
.chamber b{display:block;color:var(--ink);font-size:.98rem}
.chamber span{font-size:.88rem;color:var(--muted)}
.btn--green{background:var(--blue);border-color:var(--blue);color:#fff}
.btn--green:hover{background:var(--blue-600);border-color:var(--blue-600);color:#fff}

/* form errors, honeypot, member photos, event images */
.formerr{background:#fdecea;color:#8c1d16;border:1px solid #f3c4bf;border-radius:8px;padding:.6rem .85rem;font-size:.9rem;margin:0 0 .4rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.member__photo{width:96px;height:96px;margin:0 auto .9rem;border-radius:50%;object-fit:cover}
.product__img{aspect-ratio:4/3;object-fit:cover;width:100%}

/* logo lockups */
.foot-brand{padding-bottom:1.6rem;border-bottom:1px solid rgba(255,255,255,.14);margin-bottom:2rem}
.foot-brand img{height:74px;width:auto}
@media (max-width:900px){ .brand__logo{height:38px} .foot-brand img{height:62px} }
@media (max-width:640px){ .foot-brand{text-align:center} .foot-brand img{margin-inline:auto} }

/* content written in the admin page editor */
.prose{max-width:800px;font-size:1.05rem}
.prose > *:first-child{margin-top:0}
.prose > *:last-child{margin-bottom:0}
.prose h2{font-size:clamp(1.4rem,2.4vw,1.9rem);margin:1.6em 0 .5em}
.prose h3{font-size:1.2rem;margin:1.5em 0 .45em}
.prose h4{font-size:1.05rem;margin:1.4em 0 .4em}
.prose p{margin:0 0 1.05em}
.prose ul,.prose ol{margin:0 0 1.05em;padding-left:1.5rem}
.prose li{margin-bottom:.4em}
.prose ul{list-style:disc}
.prose ol{list-style:decimal}
.prose blockquote{margin:0 0 1.2em;padding:.6rem 0 .6rem 1.2rem;border-left:4px solid var(--amber);
  color:var(--ink);font-size:1.1rem}
.prose a{color:var(--blue-600);text-decoration:underline}
.prose a:hover{color:var(--navy-900)}
.prose img{max-width:100%;height:auto;border-radius:12px;margin:1.2em 0;box-shadow:var(--sh-sm)}
.prose hr{border:0;border-top:1px solid var(--line);margin:2em 0}
.prose table{min-width:0;margin-bottom:1.2em}
.prose strong{color:var(--ink)}
.page-body{padding-block:56px}
.page-body + .section--alt{border-top:1px solid var(--line-soft)}

/* ---------- membership: comparison, steps, wide form ---------- */
.compare th:first-child,.compare td:first-child{text-align:left;min-width:220px}
.compare th{text-align:center}
.compare td.center,.compare th{text-align:center}
.compare .yes{color:var(--green);font-weight:800;font-size:1.05rem}
.compare .no{color:var(--muted)}
.compare tbody tr:nth-child(odd){background:#fbf8f8}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:2rem}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;
  display:flex;gap:.8rem;align-items:center}
.step b{width:30px;height:30px;flex:none;border-radius:50%;background:var(--navy);color:#fff;
  display:grid;place-items:center;font-size:.9rem}
.step span{font-size:.9rem;color:var(--body);line-height:1.35}

.form--wide{max-width:840px;margin-inline:auto}
.form__head{font-size:1rem;letter-spacing:.04em;text-transform:uppercase;color:var(--navy);
  margin:.6rem 0 -.2rem;padding-top:.9rem;border-top:1px solid var(--line-soft)}
.form--wide .form__head:first-of-type{border-top:0;padding-top:0}
.field__hint{margin:.35rem 0 0;font-size:.85rem;color:var(--muted)}
.req{color:#b3261e}
.declare{display:flex;gap:.7rem;align-items:flex-start;background:var(--bg-alt);
  border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;font-size:.92rem}
.declare input{margin-top:.25rem;flex:none;width:auto}
.quote__pic{width:40px;height:40px;border-radius:9px;object-fit:cover;flex:none}
@media (max-width:900px){ .steps{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .steps{grid-template-columns:1fr} }

/* ---------- photo gallery ---------- */
.pagehead__date{color:#e9c8c9;font-size:.95rem;margin:.4rem 0 0}
.albums{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.album{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--sh-sm);transition:.18s ease;color:var(--ink)}
.album:hover{transform:translateY(-3px);box-shadow:var(--sh-md);text-decoration:none;border-color:#d7c2c3}
.album__img{position:relative;display:block;aspect-ratio:4/3;background:var(--bg-alt);overflow:hidden}
.album__img img{width:100%;height:100%;object-fit:cover;transition:.4s ease}
.album:hover .album__img img{transform:scale(1.04)}
.album__empty{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-size:.9rem}
.album__count{position:absolute;right:.6rem;bottom:.6rem;background:rgba(85,13,16,.85);color:#fff;
  font-size:.75rem;font-weight:700;padding:.2rem .6rem;border-radius:999px}
.album__body{display:block;padding:1rem 1.2rem}
.album__body b{display:block;font-size:1.02rem;line-height:1.3}
.album__body small{display:block;margin-top:.2rem;color:var(--muted);font-size:.85rem}

.photos{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem}
.photo{padding:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--bg-alt);
  cursor:zoom-in;aspect-ratio:1;display:block}
.photo img{width:100%;height:100%;object-fit:cover;transition:.3s ease}
.photo:hover img{transform:scale(1.05)}

.lb{position:fixed;inset:0;z-index:300;background:rgba(10,4,5,.94);display:grid;
  grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem;padding:1rem}
.lb[hidden]{display:none}
.lb__stage{margin:0;display:grid;place-items:center;gap:.8rem;max-height:92vh;min-width:0}
.lb__img{max-width:100%;max-height:84vh;width:auto;height:auto;border-radius:8px;
  box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lb__cap{color:#f0e4e4;font-size:.95rem;text-align:center;max-width:70ch}
.lb__nav,.lb__close{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);color:#fff;
  border-radius:50%;cursor:pointer;display:grid;place-items:center}
.lb__nav{width:52px;height:52px;font-size:1.8rem;flex:none}
.lb__nav:hover,.lb__close:hover{background:rgba(255,255,255,.22)}
.lb__close{position:absolute;top:1rem;right:1rem;width:44px;height:44px;font-size:1.5rem;z-index:2}

@media (max-width:900px){ .albums{grid-template-columns:repeat(2,1fr)} .photos{grid-template-columns:repeat(3,1fr)} }
@media (max-width:640px){
  .albums{grid-template-columns:1fr}
  .photos{grid-template-columns:repeat(2,1fr);gap:.6rem}
  .lb{grid-template-columns:1fr;padding:.5rem}
  .lb__nav{position:absolute;bottom:1.2rem;width:46px;height:46px}
  .lb__nav--prev{left:1.2rem} .lb__nav--next{right:1.2rem}
  .lb__img{max-height:70vh}
}

/* =========================================================
   Second stage: registrations, documents, missions, members,
   partners, search, language switch, WhatsApp
   ========================================================= */

/* --- language switch in the top bar --- */
.langsw{display:inline-flex;gap:.2rem;align-items:center;margin-left:.5rem;
  padding:.1rem;background:rgba(255,255,255,.1);border-radius:999px}
.langsw__opt{display:inline-flex;align-items:center;gap:.32rem;padding:.2rem .55rem;border-radius:999px;
  font-weight:700;font-size:.74rem;letter-spacing:.02em;line-height:1;color:#fff;opacity:.78;
  transition:opacity .15s ease,background .15s ease}
.langsw__opt:hover,.langsw__opt:focus-visible{opacity:1;background:rgba(255,255,255,.16);text-decoration:none}
.langsw__opt.is-on{opacity:1;background:#fff;color:var(--navy)}
.langsw .flag{display:block;width:20px;height:10px;border-radius:2px;flex:none;
  box-shadow:0 0 0 1px rgba(0,0,0,.18)}
@media (prefers-reduced-motion:reduce){ .langsw__opt{transition:none} }

/* --- floating WhatsApp button --- */
.wa{position:fixed;right:1.1rem;bottom:1.1rem;z-index:120;width:56px;height:56px;border-radius:50%;
  display:grid;place-items:center;background:#25d366;color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.28);
  transition:transform .18s ease,box-shadow .18s ease}
.wa:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 12px 28px rgba(0,0,0,.34);text-decoration:none}
.wa:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
@media (max-width:640px){ .wa{width:52px;height:52px;right:.8rem;bottom:.8rem} }
@media (prefers-reduced-motion:reduce){ .wa{transition:none} }

/* --- key/value lists (event and mission details, member card) --- */
.factlist{margin:0 0 1.4rem;padding:0}
.factlist>div{display:grid;grid-template-columns:9.5rem 1fr;gap:.6rem;padding:.55rem 0;
  border-bottom:1px solid var(--line)}
.factlist>div:last-child{border-bottom:0}
.factlist dt{margin:0;font-weight:700;color:var(--muted);font-size:.88rem}
.factlist dd{margin:0}
.factlist--tight>div{padding:.35rem 0;grid-template-columns:8.5rem 1fr}
@media (max-width:540px){ .factlist>div,.factlist--tight>div{grid-template-columns:1fr;gap:.1rem} }

/* --- event detail --- */
.event__hero{width:100%;height:auto;border-radius:var(--r);margin-bottom:1.4rem;display:block}
.event__tags{display:flex;flex-wrap:wrap;gap:.4rem;margin:.5rem 0 0}
.event__body h3 a{color:inherit}
.split--wide{grid-template-columns:1.5fr 1fr;align-items:start}  /* a short column should sit at the top, not float in the middle */
@media (max-width:900px){ .split--wide{grid-template-columns:1fr} }
.badge-soft--warn{background:#fdf1d8;color:#8a5d00;border-color:#f0dcae}
.panel--ok{border-color:#bcd9c2;background:#f3faf4}
.notice{background:#fdf7e6;border:1px solid #f0e0b4;border-radius:var(--r);padding:.9rem 1.1rem;
  margin:0 0 1.6rem;color:#6b5518}
.notice--wide{max-width:none}

/* --- search bar, tags, paging --- */
.searchbar{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin:0 0 1.2rem}
.searchbar input[type=search]{flex:1 1 16rem;min-width:0;padding:.7rem .9rem;border:1px solid var(--line);
  border-radius:var(--r);font:inherit;background:#fff}
.searchbar select{padding:.7rem .9rem;border:1px solid var(--line);border-radius:var(--r);font:inherit;background:#fff}
.searchbar__clear{font-size:.9rem;color:var(--muted)}
.taglist{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1.6rem}
.tagpill{display:inline-flex;gap:.35rem;align-items:center;padding:.25rem .7rem;border-radius:999px;
  border:1px solid var(--line);background:#fff;font-size:.85rem;color:var(--ink)}
.tagpill span{color:var(--muted);font-size:.78rem}
.tagpill.is-on,.tagpill:hover{background:var(--navy);border-color:var(--navy);color:#fff;text-decoration:none}
.tagpill.is-on span,.tagpill:hover span{color:rgba(255,255,255,.75)}
.pager{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:2rem;
  padding-top:1.2rem;border-top:1px solid var(--line)}
.pager__step{font-weight:700}
.pager__step.is-off{color:var(--muted);opacity:.55}
.pager__count{color:var(--muted);font-size:.9rem}
@media (max-width:520px){ .pager{flex-direction:column;gap:.5rem} }

/* --- document library --- */
.doclist{list-style:none;margin:0 0 2.2rem;padding:0;display:grid;gap:.7rem}
.doc{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;
  border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:1rem 1.2rem}
.doc--locked{background:var(--bg-alt)}
.doc__ext{display:grid;place-items:center;width:52px;height:52px;border-radius:10px;flex:none;
  background:var(--navy);color:#fff;font-size:.72rem;font-weight:800;letter-spacing:.03em}
.doc--locked .doc__ext{background:var(--muted)}
.doc__body{display:block;min-width:0}
.doc__body b{display:inline;margin-right:.4rem}
.doc__body small{display:block;color:var(--muted);font-size:.85rem;margin-top:.15rem}
.doc__cta{flex:none}
@media (max-width:640px){
  .doc{grid-template-columns:auto 1fr;row-gap:.7rem}
  .doc__cta{grid-column:1/-1}
}

/* --- trade missions --- */
.tmissions{list-style:none;margin:0;padding:0;display:grid;gap:1.2rem}
.tmission{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:1.4rem 1.6rem;
  box-shadow:var(--sh-sm)}
.tmission__head{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.6rem}
.tmission h3{margin:0 0 .8rem}
.tmission__form{margin-top:.6rem}
.tmission__form summary{display:inline-flex;cursor:pointer;list-style:none}
.tmission__form summary::-webkit-details-marker{display:none}
.tmission__form[open] summary{margin-bottom:1rem}
.tmission__form .form{max-width:none}

/* --- partner logo strip --- */
.logos{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;align-items:center}
.logo{display:grid;place-items:center;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);padding:1rem;min-height:96px}
.logo img{max-width:100%;max-height:64px;width:auto;height:auto;object-fit:contain;
  filter:grayscale(1);opacity:.72;transition:.2s ease}
.logo:hover img{filter:none;opacity:1}
.logo__name{font-weight:700;color:var(--muted);text-align:center;font-size:.92rem}

/* --- members area --- */
.members{background:var(--bg-alt)}
.mhead{background:var(--navy);color:#fff;padding:.8rem 0}
.mhead__in{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;flex-wrap:wrap}
.brand--sm .brand__logo{height:36px;width:auto}
.mnav{display:flex;flex-wrap:wrap;gap:.2rem}
.mnav a{color:#fff;padding:.45rem .8rem;border-radius:var(--r);font-weight:600;font-size:.94rem;opacity:.85}
.mnav a:hover{background:rgba(255,255,255,.12);opacity:1;text-decoration:none}
.mnav a.is-on{background:rgba(255,255,255,.2);opacity:1}
.mbar{background:#fff;border-bottom:1px solid var(--line)}
.mbar__in{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;padding:.7rem 0;font-size:.92rem}
.mtitle{margin:0 0 1.4rem}
.mcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.6rem 1.8rem;
  margin-bottom:1.4rem;display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;box-shadow:var(--sh-sm)}
@media (max-width:820px){ .mcard{grid-template-columns:1fr} }
.mfoot{background:var(--navy);color:rgba(255,255,255,.8);padding:1.6rem 0;font-size:.9rem;margin-top:3rem}
.mfoot a{color:#fff}
.plainlist{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.6rem}
.plainlist li{padding-bottom:.6rem;border-bottom:1px solid var(--line)}
.plainlist li:last-child{border-bottom:0;padding-bottom:0}
.plainlist--cols{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.6rem 1.6rem}
.logo-preview{max-width:180px;height:auto;border:1px solid var(--line);border-radius:8px;padding:.4rem;background:#fff}
.tbl--roomy td{padding-top:.8rem;padding-bottom:.8rem}
tr.is-you{background:#fdf7e6}
.narrow{max-width:640px}
.section--flush{padding-bottom:0}
.mapwrap{margin-top:1.4rem;line-height:0;background:var(--bg-alt)}
.mapwrap iframe{display:block;width:100%;border:0}
.section__head--left{text-align:left;max-width:none;margin-bottom:1.2rem}

/* two-column blocks in the members area */
.cols-2{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-bottom:1.4rem}
.cols-2>*{margin-bottom:0}
@media (max-width:860px){ .cols-2{grid-template-columns:1fr} }

/* a form sitting inside a panel should not draw a second box around itself */
.panel>.form{background:none;border:0;padding:0;box-shadow:none;max-width:none;margin-bottom:1.6rem}
.panel>.form:last-child{margin-bottom:0}

/* Nobody should be thrown around the page by a hover effect. */
@media (prefers-reduced-motion:reduce){
  .card,.card--link,.card--link .card__icon,.card__more::after{transition:none}
  .card--link:hover,.card--link:focus-within{transform:none}
  .card--link:hover .card__icon,.card--link:focus-within .card__icon{transform:none}
  .card--link:hover .card__more::after,.card--link:focus-within .card__more::after{transform:none}
}

/* =========================================================
   Movement
   Everything here is switched on by a class that only appears
   when animation is enabled AND JavaScript is running, so the
   site without either is simply a site that is already there.
   ========================================================= */

/* the page itself settles in, rather than snapping */
.js-anim body{animation:page-in .32s ease-out both}
@keyframes page-in{from{opacity:0}to{opacity:1}}

/* sections ease up into place as they are reached */
.js-anim .reveal{opacity:0;transform:translateY(16px);
  transition:opacity .55s cubic-bezier(.22,.61,.36,1),transform .55s cubic-bezier(.22,.61,.36,1);
  will-change:opacity,transform}
.js-anim .reveal.is-in{opacity:1;transform:none;will-change:auto}

/* the hero is the first thing seen and runs its own slider — leave it be */
.js-anim .hero .reveal,.js-anim .slide .reveal{opacity:1;transform:none}

/* the counting figures should not jiggle the layout as the digits change */
.stat b{font-variant-numeric:tabular-nums}

@media (prefers-reduced-motion:reduce){
  .js-anim body{animation:none}
  .js-anim .reveal,.js-anim .reveal.is-in{opacity:1;transform:none;transition:none}
}

/* =========================================================
   Institutional pass
   A chamber is an old, serious body, and the site should carry
   itself that way: serif headings, square corners, hairline
   rules instead of soft glows, and a neutral ground so the
   maroon reads as an accent rather than as the weather.

   Everything below is an override. Delete this block and the
   site returns exactly to how it looked before.
   ========================================================= */

:root{
  /* Georgia is on effectively every Windows and Mac; Noto Serif covers
     Android. No web font is fetched, so nothing waits on a download. */
  --serif:Georgia,"Noto Serif","Times New Roman",serif;

  --r:3px; --r-lg:4px;

  /* a neutral paper, not a pink one */
  --bg-alt:#f4f6f8;
  --line:#dce2e8; --line-soft:#eef1f5;
  --sky:#f8eff1;

  /* shadows you notice only when they are gone */
  --sh-sm:0 1px 2px rgba(21,34,51,.05);
  --sh-md:0 3px 10px rgba(21,34,51,.09);
  --sh-lg:0 14px 36px rgba(21,34,51,.14);
}

/* ---- Type ---- */
h1,h2,h3,h4{font-family:var(--serif);letter-spacing:0}
h1{font-size:clamp(1.95rem,3.7vw,2.75rem);line-height:1.16}
h2{font-size:clamp(1.45rem,2.6vw,2.05rem)}
h3{font-size:1.14rem}
body{line-height:1.6}
.eyebrow{font-size:.74rem;letter-spacing:.17em}

/* A short gold rule under a section heading — the oldest trick in
   institutional print, and it still works. */
.section__head{margin-bottom:2.5rem}
.section__head h2::after{content:"";display:block;width:54px;height:3px;
  background:var(--amber);margin:.9rem auto 0}
.section__head--left h2::after{margin-inline:0}

/* ---- Surfaces: square, ruled, flat ---- */
.card,.panel,.plan,.quote,.form,.album,.doc,.tmission,.mcard,.product,
.member,.stat,.notice,.mapwrap,.logo{border-radius:var(--r)}
.card,.panel,.quote,.form{box-shadow:none;border:1px solid var(--line)}
.card{padding:1.6rem}

/* The icon becomes a ruled square that fills in on hover, rather than a
   soft pink blob. */
.card__icon{width:44px;height:44px;border-radius:3px;background:transparent;
  border:1px solid var(--line);color:var(--navy);margin-bottom:1rem}
.card--link:hover,.card--link:focus-within{transform:translateY(-2px);
  border-color:var(--navy);box-shadow:var(--sh-md)}
.card--link:hover .card__icon,.card--link:focus-within .card__icon{
  background:var(--navy);border-color:var(--navy);color:#fff;transform:none}

/* ---- Buttons ---- */
/* White on gold measures 1.7:1 against the WCAG minimum of 4.5:1 — it was
   close to unreadable in daylight. Dark maroon on the same gold is 8.5:1. */
.btn{border-radius:var(--r);padding:.78rem 1.45rem;font-size:.94rem;
  letter-spacing:.015em;color:var(--navy-900)}
.btn:hover{color:var(--navy-900)}
.btn--blue,.btn--blue:hover{color:#fff}
.btn--ghost{border-width:1px}
.btn--sm{padding:.48rem 1rem}

/* ---- Detail ---- */
.badge-soft,.tagpill,.post__tag,.tag,.slide__eyebrow{border-radius:2px}
.stat b{font-family:var(--serif)}
.tbl th{letter-spacing:.06em;font-size:.76rem;text-transform:uppercase}
.pagehead{border-bottom:3px solid var(--amber)}
.site-foot h3{font-family:var(--sans);font-size:.78rem;letter-spacing:.12em}
.prose blockquote{border-left:3px solid var(--amber);padding-left:1.1rem;font-style:normal}

/* The membership cards: the category should lead and the fee should follow,
   and the flag had white text on gold — the same 1.7:1 problem as the buttons. */
.plan{border-radius:var(--r);box-shadow:none}
.plan--feature{border-width:1px;border-color:var(--navy);box-shadow:var(--sh-md)}
.plan h3{font-size:1.3rem;margin-bottom:.25em}
.plan__price{font-size:1.02rem;font-weight:700;color:var(--gold-ink);
  font-family:var(--sans);letter-spacing:.01em;margin:0 0 .9em}
.plan__flag{border-radius:2px;color:var(--navy-900);letter-spacing:.08em}

/* =========================================================
   Affiliated chambers, given some thickness
   The depth here is plain CSS and is always on. The tilt that
   follows the cursor is added by script, only on a device with
   a real pointer, and only when animation is switched on.
   ========================================================= */

.chambers-3d{perspective:none;align-items:start}   /* a short profile should not be stretched to match a long one */

.chambers-3d .chamber{
  position:relative;
  transform-style:preserve-3d;
  background:linear-gradient(178deg,#ffffff 0%,#fcfcfd 62%,#f7f8fa 100%);
  border-color:#d6dde4;
  /* three stacked shadows: the contact edge, the near shade, the cast
     shadow. One big blur alone just looks like fog. */
  box-shadow:
    0 1px 1px rgba(21,34,51,.06),
    0 3px 6px rgba(21,34,51,.05),
    0 8px 18px rgba(21,34,51,.06);
  transition:transform .4s cubic-bezier(.22,.61,.36,1),
             box-shadow .4s ease, border-color .3s ease;
}

/* the light that would fall across the top face of a real card */
.chambers-3d .chamber::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,0) 40%);
}

/* a warm sheen that tracks the cursor */
.chambers-3d .chamber::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  opacity:0;transition:opacity .35s ease;
  background:radial-gradient(180px circle at var(--mx,50%) var(--my,50%),
             rgba(255,187,19,.13), rgba(255,187,19,0) 65%);
}
.chambers-3d .chamber:hover::after,
.chambers-3d .chamber.is-tilting::after{opacity:1}

.chambers-3d .chamber:hover,
.chambers-3d .chamber.is-tilting{
  border-color:#c9a3a5;
  box-shadow:
    0 2px 3px rgba(21,34,51,.07),
    0 10px 20px rgba(21,34,51,.10),
    0 26px 50px rgba(21,34,51,.13);
}

/* the contents stand off the face, so the tilt has real parallax */
.chambers-3d .chamber > *{transform:translateZ(14px)}
.chambers-3d .chamber__dot{transform:translateZ(22px);
  box-shadow:0 2px 6px rgba(138,93,0,.5)}

/* without the script — or with animation switched off — a plain, honest lift */
html:not(.js-anim) .chambers-3d .chamber:hover{transform:translateY(-3px)}

@media (prefers-reduced-motion:reduce){
  .chambers-3d .chamber{transition:box-shadow .2s ease,border-color .2s ease}
  .chambers-3d .chamber:hover{transform:none}
}

/* =========================================================
   Loading circle
   ========================================================= */

.preloader{position:fixed;inset:0;z-index:400;display:grid;place-items:center;align-content:center;
  gap:1.1rem;background:var(--navy);opacity:0;visibility:hidden;
  transition:opacity .35s ease,visibility .35s ease}
.preloader.is-on{opacity:1;visibility:visible}
.preloader.is-off{opacity:0;visibility:hidden}

.preloader__ring{width:46px;height:46px;border-radius:50%;
  border:3px solid rgba(255,255,255,.22);border-top-color:var(--amber);
  animation:ficcim-spin .9s linear infinite}
.preloader__word{color:#fff;font-weight:700;font-size:.78rem;letter-spacing:.28em;
  text-indent:.28em;font-family:var(--sans)}

@keyframes ficcim-spin{to{transform:rotate(360deg)}}

/* A spinner has to turn to mean anything, so it keeps turning — slowly. */
@media (prefers-reduced-motion:reduce){
  .preloader__ring{animation-duration:2.6s}
  .preloader{transition:none}
}

/* ---- the same circle, inside a button that has been pressed ---- */
.btn.is-loading,.btn.is-loading:hover{color:transparent;pointer-events:none;position:relative}
.btn.is-loading::after{content:"";position:absolute;top:50%;left:50%;width:17px;height:17px;
  margin:-9px 0 0 -9px;border-radius:50%;border:2px solid rgba(21,34,51,.28);
  border-top-color:var(--navy-900);animation:ficcim-spin .7s linear infinite;transform:none}
.btn--blue.is-loading::after,.btn--green.is-loading::after{
  border-color:rgba(255,255,255,.35);border-top-color:#fff}
.btn--ghost.is-loading::after,.btn--light.is-loading::after{
  border-color:rgba(126,19,23,.25);border-top-color:var(--navy)}

/* ---- the affiliated chamber card, now that it holds a real profile ---- */
.chamber{align-items:flex-start}
.chamber__mark{flex:none;width:52px;display:grid;place-items:center;padding-top:.15rem}
.chamber__mark img{max-width:52px;max-height:44px;width:auto;height:auto;object-fit:contain}
.chamber__body{display:grid;gap:.22rem;min-width:0}
.chamber__body b{font-size:1rem;line-height:1.3}
.chamber__state{justify-self:start;background:#fdf3d9;color:var(--gold-ink);border:1px solid #f0e0b4;
  border-radius:2px;padding:.08rem .45rem;font-size:.72rem;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;margin:.15rem 0}
.chamber__detail{font-size:.88rem;color:var(--muted)}
.chamber__lead{font-size:.88rem;color:var(--ink);font-weight:600}
.chamber__about{font-size:.86rem;color:var(--body);margin-top:.15rem}
.chamber__meta{font-size:.8rem;color:var(--muted);margin-top:.15rem}
.chamber__links{font-size:.84rem;margin-top:.35rem;display:flex;flex-wrap:wrap;gap:.1rem .5rem;align-items:center}
.chamber__links a{font-weight:600}
.chamber__links i{color:var(--line);font-style:normal}
@media (max-width:520px){ .chamber__mark{width:40px} .chamber__mark img{max-width:40px} }

/* the chamber's own page */
.chamber__hero{max-width:220px;height:auto;border:1px solid var(--line);border-radius:var(--r);
  padding:.9rem;background:#fff;margin-bottom:1.4rem}

/* ---------- Organiser filter on the events calendar ---------- */
.filterbar{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin:0 0 2rem}
.chip-f{display:inline-block;padding:.4rem 1rem;border:1px solid var(--line);border-radius:999px;
  background:#fff;color:var(--body);font-size:.88rem;font-weight:600;line-height:1.4;
  transition:border-color .18s ease, background .18s ease, color .18s ease}
.chip-f:hover{border-color:var(--navy);color:var(--navy);text-decoration:none}
.chip-f.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
.chip-f.is-on:hover{color:#fff}

/* ---------- Events shown on a chamber's own page ---------- */
.chevents{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.chevent{display:flex;gap:1rem;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);padding:1rem 1.1rem}
.chevent__date{flex:none;width:3.2rem;text-align:center;border-right:1px solid var(--line-soft);padding-right:.8rem}
.chevent__date b{display:block;font-size:1.4rem;color:var(--navy);line-height:1}
.chevent__date span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.chevent__body{min-width:0}
.chevent__body h4{margin:0 0 .15em;font-size:1rem}
.chevent__body p{margin:0;font-size:.88rem;color:var(--muted)}

/* ---------- small form pieces used in the members area ---------- */
.chk{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.9rem;color:var(--ink)}
.chk input{width:auto;margin:0}
.alert--note{background:#fff8e4;color:var(--gold-ink);border:1px solid #f0dca8;border-radius:8px;
  padding:.7rem 1rem;font-size:.92rem;margin:0 0 1rem}
form.inline{display:inline}
.linkish{background:none;border:0;padding:0;font:inherit;font-size:inherit;color:var(--blue-600);cursor:pointer}
.linkish:hover{text-decoration:underline}

/* ---------- Annual activity reports, on the About page ---------- */
.reportrow{list-style:none;margin:0;padding:0;display:grid;gap:1.1rem;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.reportcard{display:flex;flex-direction:column;align-items:flex-start;gap:.3rem;background:#fff;
  border:1px solid var(--line);border-radius:var(--r);padding:1.3rem 1.4rem;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease}
.reportcard:hover{border-color:var(--navy);box-shadow:var(--sh-md);transform:translateY(-2px)}
.reportcard__year{font-size:2.1rem;line-height:1;color:var(--navy);letter-spacing:-.03em;
  font-family:var(--serif,inherit)}
.reportcard__title{font-size:1rem;color:var(--ink);margin-top:.35rem}
.reportcard__note{font-size:.88rem;color:var(--body)}
.reportcard__meta{font-size:.8rem;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.reportcard .btn{margin-top:.85rem}

/* ---------- Formatting the editor can apply ----------
   Named steps from the site's own palette, so a page keeps looking like
   one site whoever wrote it. Used in .prose, in captions and in the
   admin editor, which loads this same block. */
.al-left{text-align:left}
.al-center{text-align:center}
.al-right{text-align:right}
.al-justify{text-align:justify}
.in-1{padding-left:2rem}
.in-2{padding-left:4rem}
.in-3{padding-left:6rem}
.tx-lg{font-size:1.15em}
.tx-sm{font-size:.88em}
.tx-brand{color:var(--navy)}
.tx-gold{color:var(--gold-ink)}
.tx-green{color:var(--green-700)}
.tx-muted{color:var(--muted)}
.prose mark, .doc__body mark, mark{background:#ffe680;color:var(--ink);padding:0 .15em;border-radius:2px}
.prose s{text-decoration:line-through}
.prose sub,.prose sup{font-size:.72em;line-height:0}
@media (max-width:640px){
  .in-1{padding-left:1rem}.in-2{padding-left:2rem}.in-3{padding-left:3rem}
}


/* btn--ghost-light fix (30 Sep 2026): a later .btn rule turned the text dark red on the dark footer band */
.btn.btn--ghost-light, .btn.btn--ghost-light:visited { color: #fff; }