.button-compact{padding:9px 16px;gap:8px;font-size:10px}
:root{--ink:#12312a;--forest:#174d3e;--green:#236d52;--mint:#e5f0e8;--yellow:#f2c84b;--paper:#f8f7f1;--blue:#287fa0;--line:#d7dfd8;--serif:"Iowan Old Style","Baskerville","Times New Roman",serif;--sans:"Avenir Next","Trebuchet MS",sans-serif}*{box-sizing:border-box}img{max-width:100%;height:auto}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.55}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.shell{width:min(1180px,calc(100% - 48px));margin:0 auto}.brand{display:block;width:min(470px,72%)}.brand img{display:block;width:100%;height:auto}.text-link{font-size:13px;text-transform:uppercase;letter-spacing:.1em;font-weight:700}.hero{position:relative;min-height:560px;display:flex;align-items:center;color:#fff;overflow:hidden;background:var(--forest)}.hero-image,.hero-overlay{position:absolute;inset:0}.hero-image img{width:100%;height:100%;object-fit:cover;object-position:center 35%;filter:saturate(.82)}.hero-overlay{background:linear-gradient(90deg,#07281fd9 0%,#0d382eaa 42%,#0d382e26 100%)}.hero-content{position:relative;padding:88px 0 110px}.eyebrow,.section-kicker,.card-label,.news-date{font-size:10px;letter-spacing:.18em;font-weight:700}.eyebrow{color:var(--yellow);margin:0 0 17px}.hero h1{font-family:var(--serif);font-size:clamp(3.1rem,6.8vw,6.3rem);font-weight:400;line-height:.94;letter-spacing:-.03em;max-width:760px;margin:0;overflow-wrap:break-word}.hero-copy{max-width:475px;font-size:19px;line-height:1.5;color:#f0f4ee;margin:27px 0}.hero-actions{display:flex;align-items:center;gap:28px}.button{display:inline-flex;align-items:center;gap:24px;padding:15px 20px;text-transform:uppercase;font-size:11px;letter-spacing:.1em;font-weight:700}.button span,.arrow-link span,.card-arrow{font-size:17px}.button-yellow{background:var(--yellow);color:var(--ink)}.button-dark{background:var(--ink);color:#fff}.hero-text-link{border-bottom:1px solid #ffffff99;padding-bottom:3px;font-size:13px}.hero-text-link span{margin-left:8px;color:var(--yellow)}.hero-note{position:absolute;right:28px;bottom:24px;border-left:1px solid #fff8;padding-left:12px;font-size:10px;color:#fff}.hero-note span,.photo-caption span{color:#d9e3db}.section{padding:102px 0}.section-kicker{color:var(--green);margin-bottom:17px}.intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:90px;align-items:start}.intro h2,.section-heading h2,.feature-copy h2,.membership h2,.contact-band h2,.notes-content h1,.notes-content h2{font-family:var(--serif);font-size:clamp(2.6rem,4.7vw,5rem);font-weight:400;line-height:.98;letter-spacing:-.03em;margin:0;overflow-wrap:break-word}.lead{font-size:20px;line-height:1.5;max-width:440px;margin:0 0 24px}.arrow-link{display:inline-flex;align-items:center;gap:18px;border-bottom:1px solid var(--ink);padding-bottom:5px;font-size:12px;text-transform:uppercase;letter-spacing:.1em;font-weight:700}.fact-line{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-top:85px}.fact-line>div{border-right:1px solid var(--line);padding:22px 25px 0 0;margin-right:25px}.fact-line>div:last-child{border:0}.fact-line b{display:block;font-family:var(--serif);font-size:27px;font-weight:400}.fact-line span{display:block;color:#61766b;font-size:12px;margin-top:5px}.section-tint{background:var(--mint)}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:46px}.section-heading>p{max-width:280px;font-size:13px;color:#61766b;margin:0}.activity-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}.activity-card{position:relative;display:block;min-height:290px;background:#fff;grid-column:span 4;padding:25px;overflow:hidden}.activity-feature{grid-column:span 8;min-height:440px;color:#fff;background:var(--forest)}.activity-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}.activity-card:hover img{transform:scale(1.04)}.activity-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#12312a05 30%,#12312abf 100%)}.activity-card:not(.activity-feature):not(.dark-card) h3,.activity-card:not(.activity-feature):not(.dark-card) .card-label,.activity-card:not(.activity-feature):not(.dark-card) .preview-tag{position:relative;z-index:1}.activity-card .card-label{color:var(--green)}.activity-feature .card-label{color:var(--yellow)}.activity-card h3{position:absolute;bottom:42px;left:25px;z-index:1;font-family:var(--serif);font-size:31px;font-weight:400;line-height:1.02;margin:0}.activity-feature h3{font-size:50px;bottom:36px}.card-arrow{position:absolute;right:27px;bottom:27px;z-index:1;color:var(--yellow)}.preview-tag{display:inline-block;margin-top:17px;font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#a16829;border-bottom:1px solid #d8b271}.dark-card{background:var(--blue);color:#fff}.dark-card .card-label{color:var(--yellow)}.dark-card h3{position:relative;left:auto;bottom:auto;margin-top:55px;font-size:38px}.dark-card p{position:relative;z-index:1;font-size:13px;max-width:280px;margin:20px 0 0;color:#e0eef0}.journals-card{grid-column:span 4}.feature-band{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.feature-copy h2{font-size:clamp(3rem,5vw,5.5rem)}.feature-copy h2 em{color:var(--blue);font-style:normal}.feature-copy>p{max-width:410px;color:#61766b;margin:25px 0}.discipline-list{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0}.discipline-list span{border:1px solid var(--line);padding:8px 11px;font-size:11px}.feature-photo{position:relative}.feature-photo img{display:block;width:100%;height:535px;object-fit:cover}.photo-caption{position:absolute;bottom:18px;left:18px;border-left:1px solid #fff;padding-left:10px;color:#fff;font-size:10px}.gallery-strip{background:#fff}.photo-row{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr 1fr;gap:10px}.photo-row a{position:relative;display:block;height:190px;overflow:hidden;background:var(--mint);box-shadow:0 1px 3px rgba(18,49,42,.12);transition:box-shadow .25s ease}.photo-row a:hover{box-shadow:0 22px 40px -16px rgba(18,49,42,.4)}.photo-row a:first-child{height:250px}.photo-row img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.photo-row a:hover img{transform:scale(1.05)}.photo-row a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(18,49,42,.85) 100%);opacity:0;transition:opacity .25s ease}.photo-row a:hover::after{opacity:1}.photo-tag{position:absolute;left:12px;bottom:12px;z-index:1;color:#fff;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;opacity:0;transform:translateY(6px);transition:opacity .25s ease,transform .25s ease}.photo-row a:hover .photo-tag{opacity:1;transform:translateY(0)}.asset-note{font-size:11px;color:#789086;margin:21px 0 0}.news-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.news-card{background:#fff;border-top:3px solid var(--yellow);padding:32px;min-height:270px}.journal-note{border-color:var(--blue)}.news-date{color:var(--green)}.news-card h3{font-family:var(--serif);font-size:32px;font-weight:400;line-height:1.05;margin:35px 0 13px}.news-card p{font-size:13px;color:#61766b;max-width:450px;margin-bottom:25px}.membership{background:var(--yellow);padding:70px 0}.membership-inner{display:flex;justify-content:space-between;align-items:center;gap:40px}.membership h2{font-size:clamp(2.6rem,4vw,4.3rem)}.membership p{max-width:520px;margin:17px 0 0;font-size:13px}.contact-band{display:flex;justify-content:space-between;align-items:end;gap:60px}.contact-band p{max-width:450px;color:#61766b;font-size:13px;overflow-wrap:break-word}.contact-band strong{color:var(--ink)}footer{background:var(--ink);color:#c4d4c8;padding:35px 0}.footer-inner{display:flex;align-items:center;gap:30px;justify-content:space-between}.footer-inner img{width:190px;height:auto;filter:brightness(0) invert(1);opacity:.9}.footer-inner div{display:flex;flex-direction:column;gap:5px;font-size:11px}.footer-inner a{color:var(--yellow)}.footer-note{font-size:10px;color:#829c8c}.notes-page{background:var(--paper)}.notes-header{display:flex;justify-content:space-between;align-items:center;padding:30px 0;border-bottom:1px solid var(--line)}.notes-header img{width:300px}.notes-content{padding:80px 0 110px}.notes-lead{max-width:590px;font-size:18px;color:#61766b;margin:24px 0 70px}.sitemap-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:100px;border-top:1px solid var(--line);padding-top:32px}.sitemap-grid ul{list-style:none;padding:0;margin:22px 0}.sitemap-grid li{padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}.sitemap-grid ul ul{margin:4px 0 0 18px}.sitemap-grid ul ul li{font-size:12px;color:#61766b;border:0;padding:4px 0}.sitemap-grid .pending{color:#aa6e2c}.sitemap-grid .confirm{color:#1c6a86}.notes-lead .confirm,.notes-lead .pending{font-weight:700;font-style:normal}.note-box{background:var(--mint);padding:22px;margin-top:40px;font-size:13px}.note-box p{margin-bottom:0}.decisions{margin:105px 0 55px;border-top:1px solid var(--line);padding-top:28px}.decision-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:45px 0}.decision-grid article{background:#fff;padding:25px;min-height:220px}.decision-grid b{font-family:var(--serif);font-size:28px;color:var(--blue);font-weight:400}.decision-grid h3{font-family:var(--serif);font-size:25px;font-weight:400;margin:25px 0 7px}.decision-grid p{color:#61766b;font-size:13px;margin:0}@media (max-width:900px){.shell{width:min(100% - 36px,680px)}.brand{width:min(350px,80%)}.button-compact{padding:7px 12px;font-size:9px}.text-link{display:none}.menu-open{overflow:hidden}.hero{min-height:600px}.hero-content{padding:95px 0 135px}.hero h1{font-size:clamp(3rem,12vw,5.2rem)}.intro-grid,.feature-band,.sitemap-grid{grid-template-columns:minmax(0,1fr);gap:35px}.fact-line{margin-top:55px;grid-template-columns:minmax(0,1fr)}.fact-line>div{border-right:0;border-bottom:1px solid var(--line);padding:17px 0;margin:0}.activity-card,.activity-feature,.journals-card{grid-column:span 6}.activity-feature{min-height:390px}.feature-band{padding-top:75px;padding-bottom:75px}.feature-photo img{height:430px}.photo-row{grid-template-columns:repeat(3,1fr)}.photo-row a,.photo-row a:first-child{height:180px}.photo-row a:first-child{grid-column:span 2}.section-heading,.membership-inner,.contact-band{align-items:flex-start;flex-direction:column}.news-grid,.decision-grid{grid-template-columns:minmax(0,1fr)}.notes-content{padding-top:55px}.footer-inner{align-items:flex-start;flex-wrap:wrap}.footer-note{width:100%}}
@media (max-width:560px){.shell{width:calc(100% - 30px)}.brand{width:auto;flex:1 1 0%;min-width:0}.button-compact{padding:4px 6px;font-size:7.5px;letter-spacing:.04em}.hero{min-height:610px}.hero-content{padding-top:80px}.hero-copy{font-size:17px}.hero-actions{align-items:flex-start;flex-direction:column;gap:18px}.hero-note{left:15px;right:auto}.section{padding:72px 0}.intro h2,.section-heading h2{font-size:3.15rem}.activity-card,.activity-feature,.journals-card{grid-column:span 12;min-height:270px}.activity-feature{min-height:390px}.activity-feature h3{font-size:42px}.dark-card h3{font-size:34px}.feature-copy h2{font-size:3.7rem}.feature-photo img{height:350px}.photo-row{grid-template-columns:repeat(2,1fr)}.photo-row a,.photo-row a:first-child{height:150px;grid-column:auto}.photo-row a:first-child{grid-column:span 2;height:205px}.notes-header{align-items:flex-start;gap:20px;flex-direction:column}.notes-header img{width:250px}.footer-inner img{width:155px}}

@media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}
.hero-slides{position:absolute;inset:0}.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 900ms ease}.hero-slide.is-active{opacity:1}.hero-slide img{width:100%;height:100%;object-fit:cover;object-position:center 35%;filter:saturate(.82)}.hero-controls{position:absolute;z-index:2;right:28px;bottom:72px;display:flex;align-items:center;gap:13px}.hero-controls>button{width:36px;height:36px;border:1px solid #ffffff99;background:#12312a55;color:#fff;font-size:17px;cursor:pointer}.hero-controls>button:hover,.hero-controls>button:focus-visible{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}.hero-dots{display:flex;gap:7px}.hero-dots button{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:#fff8;cursor:pointer}.hero-dots button.is-active{background:var(--yellow);transform:scale(1.35)}@media (max-width:560px){.hero-controls{right:15px;bottom:76px}.hero-controls>button{width:34px;height:34px}}
.aims{background:#fff}.aims h2 em{font-style:normal;color:var(--blue)}.aims-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.aims-grid article{background:var(--mint);padding:36px;border:1px solid rgba(18,49,42,.08);transition:box-shadow .25s ease,transform .25s ease}.aims-grid article:hover{box-shadow:0 20px 40px -18px rgba(18,49,42,.25);transform:translateY(-2px)}.aims-grid .aims-wide{grid-column:span 2}.aims-grid .performance-card{grid-column:span 2;background:var(--ink);color:#eff5ee;display:grid;grid-template-columns:.85fr 1.15fr;padding:0;overflow:hidden}.aims-grid .performance-card:hover{transform:none;box-shadow:0 24px 48px -18px rgba(18,49,42,.4)}.aim-number{display:inline-block;position:relative;color:var(--blue);font:400 28px var(--serif);margin-bottom:42px;padding-bottom:16px}.aim-number::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:2px;background:currentColor;opacity:.4}.aims-grid .performance-card .aim-number{color:var(--yellow)}.aims-grid h3{font:400 34px/1 var(--serif);margin:0 0 22px}.aims-grid p{font-size:13px;line-height:1.65;color:#49665a}.aims-grid .performance-card p{color:#d5e2d8;margin-top:0}.aims-grid .performance-card h3{color:#fff}.performance-media{position:relative;min-height:280px}.performance-media img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9)}.performance-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,var(--ink) 100%)}.performance-body{padding:44px 48px;align-self:center}.legacy-details summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;transition:color .15s ease}.legacy-details summary::-webkit-details-marker{display:none}.legacy-details summary:hover{color:var(--blue)}.details-chev{transition:transform .25s ease;flex-shrink:0}.legacy-details[open] .details-chev{transform:rotate(180deg)}@media (max-width:560px){.aims-grid{grid-template-columns:minmax(0,1fr)}.aims-grid .performance-card,.aims-grid .aims-wide{grid-column:auto}.aims-grid .performance-card{grid-template-columns:minmax(0,1fr)}.performance-media{min-height:220px}.performance-media::after{background:linear-gradient(180deg,transparent 45%,var(--ink) 100%)}.performance-body{padding:32px 25px}.aims-grid article{padding:25px}.aim-number{margin-bottom:28px}}.page-hero{min-height:420px;position:relative;display:flex;align-items:end;color:#fff;overflow:hidden;background:var(--forest)}.page-hero-photo,.page-hero-shade{position:absolute;inset:0}.page-hero-photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.78)}.page-hero-shade{background:linear-gradient(90deg,#092e25e6,#123e31a8 55%,#123e3122)}.page-hero-content{position:relative;padding:85px 0 62px}.page-hero-content .section-kicker{color:var(--yellow)}.page-hero h1{font:400 clamp(3.1rem,6vw,5.5rem)/.96 var(--serif);letter-spacing:-.03em;max-width:760px;margin:0}.page-hero p{font-size:17px;max-width:560px;margin:20px 0 0;color:#e4ece6}.layout-card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.layout-card{min-height:330px;position:relative;overflow:hidden;background:#fff;padding:0;display:flex;align-items:end}.layout-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.7)}.layout-card>div{position:relative;z-index:1;padding:23px;color:var(--ink);width:100%;background:#fffffff2}.layout-card:has(>img)>div{background:linear-gradient(180deg,#12312a00,#12312ad9);color:#fff;padding-top:75px}.layout-card .card-label{color:var(--green)}.layout-card:has(>img) .card-label{color:var(--yellow)}.layout-card h3{font:400 29px/1.03 var(--serif);margin:15px 0 9px}.layout-card p{font-size:12px;line-height:1.45;margin:0;min-height:52px}.layout-card .preview-tag{margin-top:13px}.layout-card .card-arrow{bottom:20px}.filter-row,.tab-row{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:32px}.filter,.tab{border:1px solid var(--line);background:transparent;padding:9px 13px;text-transform:uppercase;letter-spacing:.08em;font-size:10px;font-weight:700}.filter.active,.tab.active{background:var(--ink);border-color:var(--ink);color:#fff}.masonry{columns:4 200px;column-gap:10px}.gallery-tile{border:0;padding:0;background:transparent;width:100%;display:block;margin:0 0 10px;break-inside:avoid;cursor:pointer}.gallery-tile img{display:block;width:100%;max-height:350px;object-fit:cover}.lightbox{display:none;position:fixed;inset:0;background:#0b201aeF;z-index:30;padding:50px}.lightbox[aria-hidden=false]{display:flex;align-items:center;justify-content:center}.lightbox img{max-width:100%;max-height:100%;object-fit:contain}.lightbox button{position:absolute;right:22px;top:14px;border:0;background:transparent;color:#fff;font-size:38px;cursor:pointer}.empty-stage{border:1px solid var(--line);background:var(--mint);padding:58px min(8vw,100px);text-align:center;margin:30px 0 75px}.empty-stage h2{font:400 clamp(2.5rem,4vw,4rem)/1 var(--serif);margin:0}.empty-stage p{max-width:590px;font-size:14px;color:#61766b;margin:20px auto 0}.article-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:90px;align-items:start}.article-layout h2,.journal-layout h2,.two-column-copy h2,.form-layout h2{font:400 clamp(2.5rem,4vw,4.4rem)/.98 var(--serif);letter-spacing:-.03em;margin:0}.article-layout article>p,.journal-layout p,.two-column-copy p,.form-layout>div>p{font-size:16px;color:#61766b;max-width:600px}.article-layout aside{border-top:3px solid var(--yellow);padding-top:17px}.article-layout aside strong{font-size:11px;letter-spacing:.1em;text-transform:uppercase}.article-layout aside a{display:block;border-bottom:1px solid var(--line);padding:12px 0;font-size:13px}.article-layout aside ul{padding-left:17px;color:#61766b;font-size:13px}.callout-copy{border-left:3px solid var(--yellow);padding-left:20px;color:var(--ink)!important}.journal-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:85px}.issue-stack{display:grid;gap:14px}.issue-card{display:grid;grid-template-columns:180px 1fr;background:#fff;min-height:210px}.issue-card img{width:100%;height:100%;object-fit:cover}.issue-card-images{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}.souti-archive{columns:6 150px;column-gap:10px;margin-top:24px}.souti-archive button{border:0;padding:0;background:transparent;width:100%;display:block;margin:0 0 10px;break-inside:avoid;cursor:pointer}.souti-archive img{display:block;width:100%;object-fit:cover}.souti-archive span{display:block;text-align:center;font-size:10px;letter-spacing:.06em;color:#61766b;margin-top:4px}.issue-card>div{padding:28px}.issue-card h3{font:400 30px/1 var(--serif);margin:18px 0 9px}.issue-card p{font-size:13px;margin:0}.issue-card.muted{display:block;background:var(--mint)}.people-layout{display:grid;grid-template-columns:.7fr 2fr;gap:55px}.people-intro p{font-size:16px;color:#61766b;margin-top:0}.people-layout .layout-card-grid{grid-template-columns:repeat(3,1fr)}.two-column-copy{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:start}.details-preview{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}.details-preview span{border-bottom:1px solid var(--line);padding:15px 0;font-size:14px}.contact-placeholder{border-left:3px solid var(--yellow);padding:14px 18px;margin-top:28px;font-size:16px}.contact-placeholder span{font-size:11px;color:#61766b;text-transform:uppercase;letter-spacing:.08em}.form-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px}.form-layout form{background:#fff;padding:30px;display:grid;gap:17px}.form-layout label{display:grid;gap:6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.form-layout input,.form-layout select,.form-layout textarea{font:400 15px var(--sans);padding:11px;border:1px solid var(--line);border-radius:0;background:#fff;color:var(--ink);resize:vertical}.form-layout input:focus,.form-layout select:focus,.form-layout textarea:focus{outline:2px solid var(--blue);outline-offset:1px}.form-layout .button{justify-self:start;border:0;cursor:pointer}.form-status{margin:0;color:var(--green);font-size:13px;min-height:20px}.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important;padding:0!important;border:0!important}@media (max-width:900px){.page-hero{min-height:390px}.page-hero-content{padding-top:70px}.layout-card-grid{grid-template-columns:repeat(2,1fr)}.article-layout,.journal-layout,.people-layout,.two-column-copy,.form-layout{grid-template-columns:minmax(0,1fr);gap:38px}.people-layout .layout-card-grid{grid-template-columns:repeat(2,1fr)}.masonry{columns:3 160px}.souti-archive{columns:4 130px}.form-layout form{padding:23px}}@media (max-width:560px){.page-hero{min-height:410px}.page-hero-content{padding-bottom:47px}.page-hero h1{font-size:3.3rem}.page-hero p{font-size:15px}.layout-card-grid,.people-layout .layout-card-grid{grid-template-columns:minmax(0,1fr)}.layout-card{min-height:290px}.masonry{columns:2 140px}.souti-archive{columns:3 110px}.empty-stage{padding:45px 20px;margin-bottom:50px}.issue-card{grid-template-columns:120px 1fr}.issue-card>div{padding:20px}.issue-card h3{font-size:25px}.details-preview{grid-template-columns:minmax(0,1fr)}.lightbox{padding:30px 15px}}





.site-footer {
  background: var(--ink);
  color: #c4d4c8;
  padding: 64px 0 22px;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.7fr repeat(3, 1fr);
  gap: 38px;
}

.footer-brand img {
  width: min(290px, 100%);
  height: auto;
}

/* The real logo's colours (dark green wordmark, blue tagline) read fine on
   the light header but disappear on this dark footer — brightness(0)
   invert(1) was meant to make a plain white silhouette instead, but with
   several distinct colours in the source art it just crushed everything to
   an indistinct white blob. A white card behind the real, uninverted logo
   keeps it legible instead. */
.footer-lockup {
  background: #fff;
  padding: 12px 18px;
  border-radius: 10px;
  width: fit-content;
}

.footer-lockup img {
  filter: none !important;
}

.footer-brand p {
  max-width: 310px;
  margin: 24px 0 16px;
  font-size: 13px;
  line-height: 1.6;
}

.footer-brand span,
.footer-base {
  color: #829c8c;
  font-size: 10px;
  letter-spacing: .04em;
}

.footer-grid h2 {
  margin: 0 0 17px;
  color: var(--yellow);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.footer-grid a {
  display: block;
  padding: 6px 0;
  font-size: 13px;
}

.footer-grid a:hover,
.footer-grid a:focus-visible {
  color: var(--yellow);
}

.footer-base {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  border-top: 1px solid #ffffff1c;
  margin-top: 44px;
  padding-top: 20px;
}

.pending-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 100px;
  align-items: start;
}

.pending-layout h2 {
  font: 400 clamp(2.5rem, 4vw, 4.4rem)/.98 var(--serif);
  letter-spacing: -.03em;
  margin: 0;
}

.pending-layout h2 em {
  color: var(--blue);
  font-style: normal;
}

.pending-layout p {
  color: #61766b;
  font-size: 16px;
  margin-top: 0;
}

.pending-checklist {
  border-top: 1px solid var(--line);
  margin: 27px 0 32px;
}

.pending-checklist span {
  display: block;
  border-bottom: 1px solid var(--line);
  color: #49665a;
  font-size: 13px;
  padding: 11px 0;
}

.programme-facts {
  border-top: 1px solid var(--line);
  margin-top: 30px;
}

.programme-facts span {
  border-bottom: 1px solid var(--line);
  color: #49665a;
  display: block;
  font-size: 13px;
  padding: 13px 0;
}

.programme-facts b {
  color: var(--ink);
  display: block;
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 400;
  margin-bottom: 2px;
}

.demo-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 55px;
  align-items: start;
}

.demo-content h3 {
  font: 400 clamp(2.2rem, 3.5vw, 3.7rem)/1 var(--serif);
  grid-column: 1;
  letter-spacing: -.02em;
  margin: 0;
}

.demo-content > p {
  color: #49665a;
  font-size: 15px;
  grid-column: 1;
  margin: -35px 0 0;
}

.demo-content-image {
  grid-column: 2;
  grid-row: 1 / span 3;
}

.demo-content-image img {
  display: block;
  height: 330px;
  max-width: 100%;
  object-fit: cover;
  width: 100%;
}

.demo-content-image span {
  color: #61766b;
  display: block;
  font-size: 10px;
  letter-spacing: .05em;
  margin-top: 9px;
  text-transform: uppercase;
}

.donation-band {
  background: var(--blue);
  color: #fff;
  padding: 76px 0;
}

.donation-band-inner,
.donation-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 100px;
  align-items: center;
}

.donation-band .section-kicker {
  color: var(--yellow);
}

.donation-band h2,
.donation-note h2 {
  font: 400 clamp(2.8rem, 4.8vw, 5rem)/.96 var(--serif);
  letter-spacing: -.03em;
  margin: 0;
}

.donation-band h2 em {
  color: var(--yellow);
  font-style: normal;
}

.donation-band p {
  font-size: 16px;
  line-height: 1.6;
  margin: 0 0 26px;
  max-width: 460px;
}

.donation-note p {
  color: #61766b;
  font-size: 16px;
  line-height: 1.6;
}

.payment-panel {
  background: var(--ink);
  color: #fff;
  padding: 29px;
}

.payment-panel-heading {
  align-items: start;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.payment-panel-heading .section-kicker {
  color: var(--yellow);
}

.payment-panel-heading .preview-tag {
  color: #e8bd73;
}

.payment-rows {
  border-top: 1px solid #ffffff2c;
  margin-top: 16px;
}

.payment-rows div {
  border-bottom: 1px solid #ffffff2c;
  display: flex;
  font-size: 12px;
  gap: 20px;
  justify-content: space-between;
  padding: 12px 0;
}

.payment-rows span {
  color: #b5c9ba;
}

.payment-rows b {
  color: #fff;
  font-weight: 600;
  text-align: right;
}

.qr-placeholder {
  align-items: center;
  border: 1px dashed #ffffff70;
  display: flex;
  gap: 16px;
  margin-top: 21px;
  padding: 17px;
}

.qr-placeholder span {
  align-items: center;
  background: #fff;
  color: var(--ink);
  display: flex;
  font: 700 13px var(--sans);
  height: 72px;
  justify-content: center;
  letter-spacing: .1em;
  width: 72px;
}

.qr-placeholder p,
.payment-caution {
  color: #c6d8ca;
  font-size: 12px;
  line-height: 1.5;
  margin: 0;
}

.payment-caution {
  margin-top: 18px;
}

.belong-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 14px;
}

.belong-card {
  background: #fff;
  color: var(--ink);
  display: flex;
  grid-column: span 4;
  min-height: 310px;
  overflow: hidden;
  padding: 25px;
  position: relative;
}

.belong-card img {
  filter: saturate(.78);
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  transition: transform .45s ease;
  width: 100%;
}

.belong-card:hover img {
  transform: scale(1.04);
}

.belong-card:has(img)::after {
  background: linear-gradient(180deg, #12312a08 25%, #12312add 100%);
  content: "";
  inset: 0;
  position: absolute;
}

.belong-card > div,
.belong-card > ul,
.belong-card > .card-label {
  position: relative;
  z-index: 1;
}

.belong-card:has(img) > div {
  align-self: end;
  color: #fff;
}

.belong-card .card-label {
  color: var(--green);
}

.belong-card:has(img) .card-label {
  color: var(--yellow);
}

.belong-card h3 {
  font: 400 34px/1.03 var(--serif);
  letter-spacing: -.02em;
  margin: 15px 0 9px;
}

.belong-card p,
.belong-card li {
  font-size: 12px;
  line-height: 1.5;
  margin: 0;
}

.belong-card .card-arrow {
  bottom: 22px;
  color: var(--yellow);
  position: absolute;
  right: 24px;
  z-index: 2;
}

.belong-sport {
  grid-column: span 7;
  min-height: 430px;
}

.belong-sport h3 {
  font-size: 52px;
}

.belong-kala {
  grid-column: span 5;
  min-height: 430px;
}

.belong-service {
  background: var(--ink);
  color: #fff;
  flex-direction: column;
  grid-column: span 5;
}

.belong-service .card-label {
  color: var(--yellow);
}

.belong-service ul {
  border-top: 1px solid #ffffff33;
  list-style: none;
  margin: 23px 0 0;
  padding: 0;
}

.belong-service li {
  border-bottom: 1px solid #ffffff33;
  color: #d5e2d8;
  padding: 10px 0;
}

.belong-winter {
  grid-column: span 4;
}

.belong-archive {
  grid-column: span 3;
}

.belong-member {
  background: var(--yellow);
  grid-column: span 5;
}

.belong-member > div {
  align-self: end;
}

.belong-member .card-arrow {
  color: var(--ink);
}

.belong-watermark {
  color: var(--ink);
  opacity: .13;
  position: absolute;
  left: 50%;
  top: 38%;
  transform: translate(-50%, -50%);
}

.belong-card {
  transition: box-shadow .25s ease, transform .25s ease;
}

.belong-card:hover {
  box-shadow: 0 24px 48px -20px rgba(18, 49, 42, .35);
  transform: translateY(-3px);
}

.people-records {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.people-records article,
.people-records figure {
  background: var(--mint);
  margin: 0;
  padding: 28px;
}

.people-records h3 {
  font: 400 31px/1 var(--serif);
  margin: 0 0 18px;
}

.people-records p {
  color: #49665a;
  font-size: 13px;
  line-height: 1.7;
  margin: 0;
}

.people-records small,
.people-records figcaption,
.kalakendra-source figcaption {
  display: block;
  color: #61766b;
  font-size: 11px;
  line-height: 1.5;
  margin-top: 17px;
}

.people-records .memorial {
  background: var(--ink);
  color: #fff;
}

.people-records .memorial p {
  color: #d5e2d8;
}

.people-records figure {
  padding: 0;
}

.people-records figure img {
  display: block;
  max-height: 460px;
  object-fit: cover;
  width: 100%;
}

.people-records figure figcaption {
  padding: 0 22px 20px;
}

.kalakendra-source {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 80px;
  align-items: center;
}

.kalakendra-source figure {
  margin: 0;
}

.kalakendra-source figure img {
  display: block;
  max-height: 600px;
  object-fit: cover;
  width: 100%;
}

.form-layout > div > img {
  border: 1px solid var(--line);
  display: block;
  margin: 24px 0 4px;
  max-height: 440px;
  object-fit: cover;
  object-position: top;
  width: min(100%, 340px);
}

.record-page h2,
.discipline-page h2 {
  font: 400 clamp(2.5rem, 4vw, 4.4rem)/.98 var(--serif);
  letter-spacing: -.03em;
  margin: 0 0 36px;
}

.name-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
}

.name-grid span,
.role-list span {
  border-bottom: 1px solid var(--line);
  font-size: 14px;
  padding: 14px 10px 14px 0;
}

.role-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 35px;
}

.role-list span {
  display: flex;
  justify-content: space-between;
  gap: 18px;
}

.role-list b {
  font-family: var(--serif);
  font-size: 17px;
  font-weight: 400;
  text-align: right;
}

.memorial-page {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.memorial-page article {
  background: var(--ink);
  color: #fff;
  min-height: 220px;
  padding: 28px;
}

.memorial-page span {
  display: block;
  font: 400 32px/1.05 var(--serif);
}

.memorial-page small {
  color: var(--yellow);
  display: block;
  font-size: 11px;
  letter-spacing: .1em;
  margin-top: 48px;
}

.scan-page figure {
  background: var(--mint);
  margin: 0 auto;
  max-width: 670px;
  padding: 20px;
}

.scan-page img {
  display: block;
  max-height: 760px;
  object-fit: contain;
  width: 100%;
}

.scan-image {
  height: auto;
  max-width: 100%;
}

.scan-page figcaption {
  color: #61766b;
  font-size: 12px;
  margin-top: 15px;
}

.discipline-page {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 100px;
  align-items: start;
}

@media (max-width: 900px) {
  .footer-grid,
  .pending-layout,
  .kalakendra-source,
  .discipline-page,
  .donation-band-inner,
  .donation-layout {
    grid-template-columns: repeat(2, 1fr);
    gap: 35px;
  }

  .belong-sport,
  .belong-kala,
  .belong-service,
  .belong-winter,
  .belong-archive,
  .belong-member {
    grid-column: span 6;
  }

  .demo-content {
    gap: 30px;
  }

  .footer-brand {
    grid-column: span 2;
  }}

@media (max-width: 560px) {
  .site-footer {
    padding-top: 48px;
  }

  .footer-grid,
  .pending-layout,
  .kalakendra-source,
  .people-records,
  .discipline-page,
  .memorial-page,
  .donation-band-inner,
  .donation-layout {
    grid-template-columns:minmax(0,1fr);
  }

  .name-grid,
  .role-list {
    grid-template-columns:minmax(0,1fr);
  }

  .belong-sport,
  .belong-kala,
  .belong-service,
  .belong-winter,
  .belong-archive,
  .belong-member {
    grid-column: span 12;
    min-height: 285px;
  }

  .demo-content {
    grid-template-columns:minmax(0,1fr);
  }

  .demo-content > p,
  .demo-content-image {
    grid-column: auto;
    grid-row: auto;
    margin: 0;
  }

  .demo-content-image img {
    height: 230px;
  }

  .belong-sport h3 {
    font-size: 43px;
  }

  .footer-brand {
    grid-column: auto;
  }

  .footer-base {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    margin-top: 30px;
  }}

.logo-segment {
  display: block;
  height: 168px;
  overflow: hidden;
  position: relative;
}

.logo-segment img {
  height: 168px !important;
  max-width: none !important;
  position: static;
  top: auto;
  width: auto !important;
  filter: saturate(1.3) brightness(1.07) contrast(1.05);
}

.logo-emblem {
  width: 118px;
}

.logo-emblem img {
  left: auto;
}

.logo-identity {
  width: 870px;
}

.logo-identity img {
  left: auto;
}

.logo-motto {
  width: 160px;
}

.logo-motto img {
  left: auto;
}

.footer-lockup {
  gap: 6px;
}

.footer-lockup .logo-segment,
.footer-lockup .logo-segment img {
  height: 48px !important;
}

.footer-lockup .logo-emblem {
  width: 34px;
}

.footer-lockup .logo-identity {
  width: 249px;
}

.footer-lockup .logo-emblem img {
  left: auto;
}

.footer-lockup .logo-identity img {
  left: auto;
}

@media (min-width: 901px) and (max-width: 1320px) {
  .logo-segment,
  .logo-segment img {
    height: 92px !important;
  }

  .logo-emblem {
    width: 65px;
  }

  .logo-identity {
    width: 477px;
  }

  .logo-motto {
    width: 87px;
  }}

/* This is the whole hamburger-menu range (see the max-width:900px rule
   turning .menu-toggle on in styles.css). It shares one compact logo size
   throughout rather than stepping down further at 560px like earlier: a
   taller size here only fits once the header stops having to share its row
   with the hamburger button, and measurement showed the previous two-tier
   92px/52px split overflowed against the hamburger between 561-749px. */
@media (max-width: 900px) {

  .logo-segment,
  .logo-segment img {
    height: 52px !important;
  }

  .logo-emblem {
    width: 37px;
  }

  .logo-identity {
    width: 270px;
  }

  .logo-identity img {
    left: auto;
  }

  .logo-motto {
    display: none;
  }}

/* Below ~340px viewport width (narrower than any current production phone,
   but tested anyway) even the 52px header tier is too wide alongside the
   hamburger button. */
@media (max-width: 340px) {
  .logo-segment,
  .logo-segment img {
    height: 38px !important;
  }

  .logo-emblem {
    width: 27px;
  }

  .logo-identity {
    width: 197px;
  }}

/* .footer-lockup's `width:fit-content` (structure.css) sizes it to this
   logo's natural width regardless of the footer column's actual available
   space — at ~375px and under that natural width overflows the viewport, so
   it needs its own smaller tier here too. */
@media (max-width: 400px) {
  .footer-lockup .logo-segment,
  .footer-lockup .logo-segment img {
    height: 38px !important;
  }

  .footer-lockup .logo-emblem {
    width: 27px;
  }

  .footer-lockup .logo-identity {
    width: 197px;
  }}

@media (max-width: 300px) {
  .footer-lockup {
    padding: 8px 10px;
  }

  .footer-lockup .logo-segment,
  .footer-lockup .logo-segment img {
    height: 24px !important;
  }

  .footer-lockup .logo-emblem {
    width: 17px;
  }

  .footer-lockup .logo-identity {
    width: 124px;
  }}
/* ===================== Navigation (rebuilt) =====================
   Shared tokens/layout live unscoped; mobile-overlay-and-accordion rules
   sit under max-width:900px and desktop-mega-menu rules under
   min-width:901px so the two systems never fight over the same rule. */

.skip-link{position:absolute;left:16px;top:-60px;background:var(--yellow);padding:10px 16px;z-index:60}
.skip-link:focus{top:16px}

.site-header{position:relative}
.utility-bar{background:var(--forest);color:#cfe0d2;font-size:12px}
.utility-inner{height:36px;display:flex;justify-content:space-between;align-items:center}
.utility-actions{display:flex;align-items:center;gap:22px}
.utility-actions a:hover,.text-link:hover{color:var(--yellow)}
.utility-social{display:flex;align-items:center;gap:10px;padding-right:16px;margin-right:16px;border-right:1px solid #3f6b57}
.utility-social a{display:flex;color:#cfe0d2}
.utility-social a:hover{color:var(--yellow)}
.utility-social svg{width:18px;height:18px}

.brand-row{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:23px 0 18px}
.brand-actions{display:flex;align-items:center;gap:26px}
.brand-lockup{align-items:center;display:flex;gap:10px;max-width:none;overflow:visible}
.brand-row .brand-lockup{flex:1;justify-content:space-between;width:auto}

.menu-toggle{display:none;border:0;background:none;cursor:pointer;flex-shrink:0}
.menu-toggle span{display:block;width:22px;height:2px;margin:4px 0;background:var(--ink);transition:transform .25s ease,opacity .2s ease}
.menu-toggle b{display:none}
.menu-toggle:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* Real top-level links outside any accordion (Home, Contact Us, Membership)
   share this base row look on both desktop and mobile; each context below
   overrides layout as needed. */
.nav-row{display:flex;align-items:center;color:var(--ink);cursor:pointer}
.nav-membership{background:var(--yellow);color:var(--ink);font-weight:700}

.badge{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;border-radius:10px;margin-left:6px;vertical-align:1px;white-space:nowrap}
.badge-confirm{background:#e7f3f7;color:#1c6a86;border:1px solid rgba(28,106,134,.35)}
.badge-pending{background:#f2f1ea;color:#7a8a83;border:1px solid var(--line)}

/* ===================== MOBILE (<=900px): overlay + accordions ===================== */
@media (max-width:900px){
  .menu-toggle{display:block;padding:0;width:20px}
  .menu-toggle span{width:18px}
  .menu-toggle b{display:none}
  .utility-inner{height:31px;font-size:10px;justify-content:flex-end}
  .utility-inner>span{display:none}
  .utility-actions{gap:10px}
  .utility-social{gap:7px;padding-right:10px;margin-right:10px}
  .utility-social svg{width:15px;height:15px}
  .brand-row{padding:17px 0;gap:4px}
  .brand-row .brand-lockup{flex:none;gap:5px}
  .brand-actions{flex-shrink:0;gap:3px}

  .menu-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  .menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0}
  .menu-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

  /* --- Full-viewport overlay shell --- */
  .nav-overlay{
    position:fixed;
    inset:0;
    height:100vh;
    height:100dvh;
    z-index:100;
    display:flex;
    flex-direction:column;
    background:var(--paper);
    visibility:hidden;
    opacity:0;
    transition:opacity .28s ease,visibility 0s linear .28s;
    padding-top:env(safe-area-inset-top);
    padding-bottom:env(safe-area-inset-bottom);
    padding-left:env(safe-area-inset-left);
    padding-right:env(safe-area-inset-right);
  }
  .menu-open .nav-overlay{
    visibility:visible;
    opacity:1;
    transition:opacity .28s ease,visibility 0s linear 0s;
  }

  /* Fixed header row: logo + close button in separate columns, never
     overlapping regardless of how long the logo's wordmark renders. */
  .nav-overlay-bar{
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:14px 16px;
    border-bottom:1px solid var(--line);
  }
  .nav-overlay-brand{flex:1;min-width:0;gap:5px;justify-content:flex-start}
  .nav-overlay-brand .logo-segment{flex-shrink:0}
  .nav-overlay-brand .logo-identity{min-width:0}
  .nav-close{
    flex-shrink:0;
    width:44px;height:44px;
    display:flex;align-items:center;justify-content:center;
    border:0;background:transparent;color:var(--ink);cursor:pointer;
    border-radius:8px;
  }
  .nav-close:hover{background:var(--mint)}
  .nav-close:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}

  /* Separately scrolling nav area — min-height:0 is what lets a flex child
     actually scroll instead of stretching its parent. */
  .primary-nav{
    flex:1;
    min-height:0;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    outline:none;
    overscroll-behavior:contain;
  }
  .nav-list{list-style:none;margin:0;padding:4px 0 24px}
  .nav-list>li{border-bottom:1px solid var(--line)}

  .nav-row{
    width:100%;
    min-height:56px;
    padding:0 20px;
    font-size:16px;
    font-weight:600;
    letter-spacing:.005em;
    border:0;background:transparent;text-align:left;
  }
  a.nav-row{text-decoration:none}

  .nav-row-group{display:flex;align-items:stretch}
  .nav-row-group .nav-parent-link{flex:1;min-height:56px}
  .nav-row-group .nav-toggle{
    flex-shrink:0;width:56px;min-height:56px;
    display:flex;align-items:center;justify-content:center;
    border:0;background:transparent;padding:0;
  }
  .nav-row-group-solo .nav-toggle{
    width:100%;justify-content:space-between;padding:0 20px;flex:1;
  }
  .nav-toggle .chev{transition:transform .2s ease;flex-shrink:0}
  .nav-toggle[aria-expanded=true] .chev{transform:rotate(180deg)}

  .nav-row:active,.nav-toggle:active{background:var(--mint)}
  .nav-row:focus-visible,.nav-toggle:focus-visible,.nav-close:focus-visible{
    outline:2px solid var(--blue);outline-offset:-2px;
  }

  /* Active item: green tint (colour) + bold weight and a leading dot
     (shape, not colour-dependent) + aria-current for assistive tech. */
  .nav-row.is-active,.nav-row-group:has(.is-active){background:var(--mint)}
  .nav-row.is-active{font-weight:700}
  .nav-row.is-active::before{
    content:"";
    display:inline-block;
    width:6px;height:6px;
    border-radius:50%;
    background:currentColor;
    margin-right:10px;
    flex-shrink:0;
  }

  /* Accordion: grid-rows 0fr->1fr animates to intrinsic height without JS
     measuring anything. The inner wrapper is what actually clips.
     visibility is also toggled (delayed on close, immediate on open) —
     the 0-height grid row visually clips the content, but the links
     inside it remain in the Tab order unless visibility is hidden too. */
  .submenu{
    display:grid;
    grid-template-rows:0fr;
    background:var(--mint);
    visibility:hidden;
    transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1),visibility 0s linear .3s;
  }
  .submenu-inner{overflow:hidden;min-height:0}
  .nav-item.is-open>.submenu{
    grid-template-rows:1fr;
    visibility:visible;
    transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1),visibility 0s linear 0s;
  }

  .submenu-group-label{
    margin:0;
    padding:14px 20px 6px;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--green);
  }
  .submenu-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    padding:11px 20px 11px 32px;
    font-size:14.5px;
    color:var(--ink);
    text-decoration:none;
    min-height:44px;
  }
  a.submenu-row:active{background:rgba(23,77,62,.08)}
  a.submenu-row:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
  .submenu-row-pending{color:#7a8a83;cursor:default}

  /* Third level: one further indent, a quiet rule to show the grouping. */
  .submenu-group{margin-left:20px;border-left:2px solid var(--line)}
  .submenu-group .submenu-group-label{padding-left:16px}
  .submenu-row-sub{padding-left:48px;font-size:14px}

  .nav-membership{
    background:var(--yellow);justify-content:center;
    margin:16px 20px 0;
    width:calc(100% - 40px);
    border-radius:10px;
    font-size:14px;
    min-height:52px;
  }
  .nav-list>li:has(.nav-membership){border-bottom:0}

  body.menu-open{overflow:hidden}
}

@media (prefers-reduced-motion:reduce){
  .nav-overlay,.submenu,.nav-toggle .chev,.menu-toggle span{transition:none !important}
}

/* ===================== DESKTOP/TABLET (>=901px): mega-menu dropdowns ===================== */
@media (min-width:901px){
  .nav-overlay{position:static;height:auto;visibility:visible;opacity:1;background:none}
  .nav-overlay-bar{display:none}
  .primary-nav{display:flex;align-items:stretch;border-top:1px solid var(--line);border-bottom:1px solid var(--line);min-height:60px;overflow:visible}
  /* .primary-nav's border/background stay full-bleed; only the item row
     itself is inset to the site's shared container width, matching the
     centred .shell used by the brand row above it. */
  .nav-list{list-style:none;display:flex;align-items:stretch;margin:0 auto;padding:0;width:min(1180px,calc(100% - 48px))}
  .nav-list>li{border-bottom:0;display:flex}
  .nav-item{position:relative}

  .nav-row{
    padding:19px 18px;
    font-size:12.5px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.09em;
    text-decoration:none;
    position:relative;
    white-space:nowrap;
    transition:color .18s ease;
  }
  .nav-row:hover,.nav-row.is-active{color:var(--blue)}
  .nav-row::after{
    content:"";
    position:absolute;left:18px;right:18px;bottom:0;height:2px;
    background:var(--blue);transform:scaleX(0);transform-origin:left;
    transition:transform .22s ease;
  }
  .nav-row:hover::after,.nav-row.is-active::after{transform:scaleX(1)}
  .nav-row.is-active::before{display:none}

  .nav-row-group{display:flex;align-items:stretch}
  .nav-row-group .nav-parent-link{padding-right:6px}
  .nav-row-group .nav-toggle{
    border:0;background:transparent;cursor:pointer;padding:19px 15px 19px 0;
    display:flex;align-items:center;color:inherit;
  }
  .nav-row-group-solo .nav-toggle{padding:19px 18px}
  .nav-toggle .chev{transition:transform .2s ease}
  .nav-toggle[aria-expanded=true] .chev{transform:rotate(180deg)}
  .nav-row-group:hover .nav-row,.nav-row-group:hover .nav-toggle,
  .nav-toggle[aria-expanded=true]{color:var(--blue)}
  .nav-row-group:hover .nav-row::after,.nav-toggle[aria-expanded=true] ~ .nav-row::after{transform:scaleX(1)}

  .nav-membership{
    margin-inline-start:auto;align-self:center;
    background:var(--yellow);color:var(--ink);
    padding:11px 20px;border-radius:3px;font-size:12px;font-weight:700;
    text-transform:uppercase;letter-spacing:.08em;text-decoration:none;
    box-shadow:0 1px 2px #17402a22;transition:transform .18s ease,box-shadow .18s ease;
  }
  .nav-membership:hover{transform:translateY(-1px);box-shadow:0 8px 18px -4px #d9ae1c66}

  /* Mega-menu card: floats below its trigger, isolated from the mobile
     accordion entirely (no shared class does double duty for layout). */
  .submenu{
    display:block;
    position:absolute;left:0;top:100%;z-index:20;
    width:260px;
    padding:20px;
    background:rgba(255,255,255,.9);
    backdrop-filter:blur(22px) saturate(190%);
    -webkit-backdrop-filter:blur(22px) saturate(190%);
    border:1px solid rgba(18,49,42,.09);
    border-radius:10px;
    box-shadow:0 24px 48px -14px rgba(18,49,42,.32),0 0 0 1px rgba(18,49,42,.03);
    opacity:0;visibility:hidden;transform:translateY(6px);pointer-events:none;
    transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;
  }
  .nav-item[data-wide]>.submenu{width:560px}.nav-item[data-wide] .submenu-inner{display:grid;grid-template-columns:1fr 1fr;column-gap:24px;align-content:start}
  .nav-item.nav-align-right>.submenu{left:auto;right:0}
  .submenu-inner{overflow:visible;min-height:auto}
  /* One class, toggled by JS, drives the open state on both mobile and
     desktop — avoids relying on sibling combinators that break the moment
     a parent link sits between the toggle and the submenu in the DOM. */
  .nav-item.is-open>.submenu{
    opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;
    transition:opacity .18s ease,transform .18s ease;
  }

  .submenu-group-label{margin:0 0 6px;padding:0 0 9px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.13em;color:var(--green);border-bottom:1px solid rgba(18,49,42,.1);break-after:avoid}
  .submenu-row{
    display:block;padding:7px 8px;font-size:13px;color:var(--ink);
    text-decoration:none;border-radius:6px;border-left:2px solid transparent;
    padding-left:8px;break-inside:avoid;
    transition:background .15s ease,border-color .15s ease,color .15s ease;
  }
  .submenu-row:hover{background:rgba(35,109,82,.06);border-left-color:var(--forest);color:var(--ink)}
  .submenu-row-pending{color:#8a9a92}
  .submenu-group{margin:6px 0 0;padding-top:10px;border-top:1px solid rgba(18,49,42,.1);border-left:0}
  .submenu-group .submenu-group-label{padding-left:0}
  .submenu-row-sub{padding-left:8px}

  .nav-row:focus-visible,.nav-toggle:focus-visible,.submenu-row:focus-visible{
    outline:2px solid var(--blue);outline-offset:2px;
  }
}

/* Intermediate tablet/small-desktop tier: tighten spacing so the full nav
   fits without wrapping before the 901px breakpoint's row widths are hit.
   Placed after the main desktop block so it wins the cascade in this range. */
@media (min-width:901px) and (max-width:1150px){
  .nav-row{padding-left:9px;padding-right:9px;font-size:11.5px;letter-spacing:.06em}
  .nav-row-group .nav-parent-link{padding-right:2px}
  .nav-row-group .nav-toggle{padding-right:7px}
  .nav-row-group-solo .nav-toggle{padding-left:9px;padding-right:9px}
  .nav-membership{padding:11px 11px}
}

/* ===================== Kalakendra instructor grid & source docs ===================== */

.instructor-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin: 32px 0;
}

.instructor-card {
  display: block;
  background: #fff;
  border: 1px solid var(--line);
  padding: 20px;
  text-decoration: none;
  color: inherit;
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}

.instructor-card:hover,
.instructor-card:focus-visible {
  box-shadow: 0 14px 30px -12px rgba(18, 49, 42, .25);
  transform: translateY(-2px);
  border-color: var(--forest);
}

.instructor-card:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}

.instructor-discipline {
  display: block;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--green);
  margin-bottom: 10px;
}

.instructor-discipline span[lang="bn"] {
  display: inline-block;
  text-transform: none;
  letter-spacing: 0;
  margin-left: 6px;
  color: #61766b;
  font-weight: 400;
}

.instructor-name {
  display: block;
  font-family: var(--serif);
  font-size: 19px;
  color: var(--ink);
  margin-bottom: 2px;
}

.instructor-name-en {
  display: block;
  font-size: 12px;
  color: #61766b;
}

.instructor-flag {
  display: flex;
  gap: 6px;
  align-items: flex-start;
  margin: 12px 0 0;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-size: 11px;
  line-height: 1.5;
  color: #8a5a25;
}

.instructor-flag-info {
  color: #49665a;
}

.instructor-card-uncertain {
  border-left: 3px solid var(--yellow);
}

.source-doc-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin: 28px 0;
}

.source-doc {
  background: #fff;
  border: 1px solid var(--line);
}

.source-doc img {
  display: block;
  width: 100%;
  height: auto;
  border-bottom: 1px solid var(--line);
}

.source-doc-body {
  padding: 16px 18px;
}

.source-doc-body p {
  margin: 0 0 10px;
  font-size: 12px;
  color: #61766b;
}

@media (max-width: 900px) {
  .instructor-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .source-doc-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 560px) {
  .instructor-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}