/* Ministerio Juvenil: the section's own look inside advenz.com (body.mj-site). A camp at dusk: pine green, campfire
   orange, canvas sand. Fonts are the Advenz theme's own (Source Sans 3, bundled), set heavier for a trail-sign feel. */

.mj-site {
	--mj-pine-deep: #14281d;
	--mj-pine: #1d3a2a;
	--mj-forest: #2e5a3c;
	--mj-moss: #5e8c4f;
	--mj-fire: #e2621b;
	--mj-fire-dark: #b84a10;
	--mj-ember: #f5a23a;
	--mj-sand: #f7f1e6;
	--mj-canvas: #efe4cf;
	--mj-bark: #5a4330;
	--mj-ink: #1f2b24;
	--mj-muted: #5b675d;
	--mj-line: #e2d7c2;
	--mj-club: var(--mj-fire);
	--mj-sans: var(--wp--preset--font-family--sans, "Source Sans 3", system-ui, sans-serif);
	--mj-topo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420' viewBox='0 0 420 420'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.07' stroke-width='1.5'%3E%3Cpath d='M60 210c0-80 70-140 150-130s130 70 120 140-80 120-150 110S60 280 60 210z'/%3E%3Cpath d='M95 210c0-60 50-100 115-95s100 50 92 105-62 90-115 82S95 262 95 210z'/%3E%3Cpath d='M130 210c0-40 35-65 80-62s68 34 62 70-42 60-80 55-62-27-62-63z'/%3E%3Cpath d='M168 212c0-20 18-32 42-30s34 18 31 36-22 30-42 28-31-14-31-34z'/%3E%3Cpath d='M-40 40c60-30 140-20 200 10s150 20 220-10'/%3E%3Cpath d='M-40 70c60-30 140-20 200 10s150 20 220-10'/%3E%3Cpath d='M-40 380c80 20 150 0 220-20s150-10 240 20'/%3E%3Cpath d='M-40 350c80 20 150 0 220-20s150-10 240 20'/%3E%3C/g%3E%3C/svg%3E");
	background: var(--mj-sand);
	color: var(--mj-ink);
	font-family: var(--mj-sans);
}
.mj-site.mj-club-aventureros { --mj-club: #e9a612; }
.mj-site.mj-club-conquistadores { --mj-club: var(--mj-fire); }
.mj-site.mj-club-guias-mayores { --mj-club: var(--mj-moss); }

/* The theme's block gap would put space between the header, the band and the page. */
.mj-site .wp-site-blocks > * { margin-block-start: 0; }
.mj-wrap { box-sizing: border-box; width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 clamp(16px, 4vw, 32px); }
.mj-site .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }

/* ---- Header ------------------------------------------------------------------------------------------------- */
.mj-header { position: relative; z-index: 50; font-family: var(--mj-sans); }
.mj-topbar { background: var(--mj-pine-deep); color: #cfc6b2; font-size: .8rem; }
.mj-topbar__inner { display: flex; gap: 1rem; justify-content: space-between; align-items: center; min-height: 34px; }
.mj-topbar a { color: #f3e9d6; text-decoration: none; font-weight: 600; }
.mj-topbar a:hover, .mj-topbar a:focus { color: var(--mj-ember); }
.mj-bar { background: var(--mj-pine) var(--mj-topo); background-size: 420px; border-bottom: 3px solid var(--mj-fire); }
.mj-bar__inner { display: flex; align-items: center; gap: 1.5rem; min-height: 76px; }
.mj-brand { display: flex; align-items: center; gap: .75rem; color: #fff; text-decoration: none; flex: 0 0 auto; }
.mj-emblem { width: 48px; height: 48px; flex: 0 0 auto; }
.mj-brand__text { display: flex; flex-direction: column; line-height: 1.1; }
.mj-brand__name { font-size: 1.3rem; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; }
.mj-brand__tag { margin-top: .2rem; font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--mj-ember); }
.mj-nav { margin-left: auto; }
.mj-nav__list { display: flex; align-items: center; gap: .25rem; margin: 0; padding: 0; list-style: none; }
.mj-nav__item { position: relative; display: flex; align-items: center; margin: 0; }
.mj-nav__link { display: flex; align-items: center; gap: .4rem; padding: .6rem .55rem; white-space: nowrap; border-radius: 8px; color: #f3e9d6; font-weight: 700; font-size: .98rem; text-decoration: none; }
.mj-nav__link:hover, .mj-nav__link:focus-visible { background: rgba(255, 255, 255, .08); color: #fff; }
.mj-nav__item.is-current > .mj-nav__link { color: #fff; box-shadow: inset 0 -3px 0 var(--mj-ember); border-radius: 8px 8px 0 0; }
.mj-icon { width: 1.25em; height: 1.25em; flex: 0 0 auto; }
.mj-nav__icon { color: var(--mj-ember); }
.mj-sub-toggle { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; margin-left: -.35rem; padding: 0; border: 0; border-radius: 6px; background: none; color: #f3e9d6; cursor: pointer; }
.mj-sub-toggle svg { width: 16px; height: 16px; transition: transform .15s ease; }
.mj-sub-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.mj-sub-toggle:hover, .mj-sub-toggle:focus-visible { background: rgba(255, 255, 255, .1); }
.mj-sub { position: absolute; top: calc(100% + 6px); left: 0; min-width: 240px; margin: 0; padding: .5rem; list-style: none; background: #fff; border-radius: 12px; box-shadow: 0 14px 34px rgba(20, 40, 29, .25); border-top: 4px solid var(--mj-fire); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .15s ease, transform .15s ease, visibility .15s; }
.mj-sub li { margin: 0; }
.mj-sub a { display: block; padding: .5rem .75rem; border-radius: 8px; color: var(--mj-ink); font-weight: 600; font-size: .95rem; text-decoration: none; }
.mj-sub a:hover, .mj-sub a:focus-visible, .mj-sub a.is-current { background: var(--mj-sand); color: var(--mj-fire-dark); }
@media (min-width: 1181px) {
	.mj-nav__item.has-sub:hover > .mj-sub, .mj-nav__item.has-sub:focus-within > .mj-sub, .mj-sub.is-open { opacity: 1; visibility: visible; transform: none; }
}
.mj-menu-toggle { display: none; margin-left: auto; align-items: center; gap: .4rem; padding: .5rem .8rem; border: 2px solid rgba(243, 233, 214, .4); border-radius: 999px; background: none; color: #f3e9d6; font: 700 .95rem var(--mj-sans); cursor: pointer; }
.mj-menu-toggle .mj-icon { width: 20px; height: 20px; }
@media (max-width: 1180px) {
	.mj-topbar__note { display: none; }
	.mj-bar__inner { flex-wrap: wrap; gap: .75rem; min-height: 64px; padding-block: .5rem; }
	.mj-emblem { width: 40px; height: 40px; }
	.mj-brand__name { font-size: 1.1rem; }
	.mj-menu-toggle { display: inline-flex; }
	.mj-nav { display: none; flex-basis: 100%; margin: 0 0 .5rem; }
	.mj-nav.is-open { display: block; }
	.mj-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
	.mj-nav__item { flex-wrap: wrap; border-top: 1px solid rgba(255, 255, 255, .08); }
	.mj-nav__link { flex: 1 1 auto; padding: .8rem .25rem; }
	.mj-nav__item.is-current > .mj-nav__link { box-shadow: none; color: var(--mj-ember); }
	.mj-sub-toggle { width: 44px; height: 44px; margin: 0; }
	.mj-sub { position: static; display: none; flex-basis: 100%; min-width: 0; margin: 0 0 .6rem; opacity: 1; visibility: visible; transform: none; box-shadow: none; border-top: 0; background: rgba(255, 255, 255, .06); }
	.mj-sub.is-open { display: block; }
	.mj-sub a { color: #f3e9d6; }
	.mj-sub a:hover, .mj-sub a:focus-visible, .mj-sub a.is-current { background: rgba(255, 255, 255, .1); color: var(--mj-ember); }
}

/* ---- A page's band: path back, title, a ridge of mountains into the page ----------------------------------- */
.mj-hero { position: relative; overflow: hidden; background: var(--mj-pine) var(--mj-topo); background-size: 420px; color: #fff; }
.mj-hero::before { content: ""; position: absolute; inset: 0 0 auto auto; width: min(46vw, 560px); height: 100%; background: radial-gradient(circle at 70% 40%, rgba(245, 162, 58, .22), transparent 60%); pointer-events: none; }
.mj-hero__inner { position: relative; padding-top: clamp(1.75rem, 4vw, 3rem); padding-bottom: clamp(3.5rem, 7vw, 5rem); }
.mj-crumbs { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; margin: 0 0 1rem; font-size: .9rem; color: #cfc6b2; }
.mj-crumbs a { color: #f3e9d6; font-weight: 600; text-decoration: none; }
.mj-crumbs a:hover, .mj-crumbs a:focus { color: var(--mj-ember); text-decoration: underline; }
.mj-hero__kicker { display: flex; align-items: center; gap: .45rem; margin: 0 0 .5rem; color: var(--mj-ember); font-size: .85rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.mj-hero__title { max-width: 900px; margin: 0; font-family: var(--mj-sans); font-size: clamp(2rem, 1.4rem + 2.6vw, 3.3rem); font-weight: 800; line-height: 1.08; letter-spacing: -.01em; color: #fff; }
.mj-ridge { position: absolute; left: 0; bottom: -1px; width: 100%; height: clamp(28px, 4vw, 56px); display: block; }
.mj-site.mj-club-aventureros .mj-hero, .mj-site.mj-club-conquistadores .mj-hero, .mj-site.mj-club-guias-mayores .mj-hero { box-shadow: inset 0 4px 0 var(--mj-club); }

/* ---- The hub's scene ------------------------------------------------------------------------------------------ */
.mj-hub-hero { position: relative; overflow: hidden; min-height: clamp(460px, 62vw, 620px); display: flex; align-items: center; background: #10202b; color: #fff; }
.mj-scene { position: absolute; inset: 0; width: 100%; height: 100%; }
.mj-hub-hero__inner { position: relative; padding-top: 3rem; padding-bottom: 7rem; }
.mj-hub-hero__kicker { margin: 0 0 .6rem; color: var(--mj-ember); font-size: .85rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.mj-hub-hero__title { margin: 0; font-family: var(--mj-sans); font-size: clamp(2.6rem, 1.6rem + 4.5vw, 5rem); font-weight: 800; line-height: 1; text-transform: uppercase; letter-spacing: .01em; color: #fff; text-shadow: 0 2px 18px rgba(0, 0, 0, .35); }
.mj-hub-hero__lead { max-width: 560px; margin: 1rem 0 1.75rem; font-size: clamp(1.05rem, 1rem + .4vw, 1.3rem); line-height: 1.5; color: #efe7d6; }
.mj-hub-hero__clubs { display: flex; flex-wrap: wrap; gap: .75rem; }
.mj-hub-hero__club { display: flex; align-items: center; gap: .7rem; padding: .7rem 1.1rem .7rem .8rem; border: 1px solid rgba(243, 233, 214, .35); border-radius: 14px; background: rgba(13, 31, 24, .55); color: #fff; text-decoration: none; backdrop-filter: blur(4px); transition: transform .15s ease, background .15s ease; }
.mj-hub-hero__club:hover, .mj-hub-hero__club:focus-visible { transform: translateY(-2px); background: rgba(226, 98, 27, .85); border-color: transparent; }
.mj-hub-hero__club .mj-icon { width: 30px; height: 30px; color: var(--mj-ember); }
.mj-hub-hero__club:hover .mj-icon, .mj-hub-hero__club:focus-visible .mj-icon { color: #fff; }
.mj-hub-hero__club span { display: flex; flex-direction: column; line-height: 1.15; }
.mj-hub-hero__club strong { font-size: 1.05rem; }
.mj-hub-hero__club small { font-size: .8rem; color: #e3d8c3; }
@media (max-width: 600px) {
	.mj-hub-hero { min-height: 0; }
	.mj-hub-hero__inner { padding-top: 2.5rem; padding-bottom: 5rem; }
	.mj-hub-hero__club { flex: 1 1 100%; }
}

/* ---- Text --------------------------------------------------------------------------------------------------- */
.mj-site .mj-content { font-size: 1.08rem; }
.mj-site .mj-content h2, .mj-site .mj-content h3, .mj-site .mj-content h4 { font-family: var(--mj-sans); font-weight: 800; color: var(--mj-pine); letter-spacing: -.005em; }
.mj-site .mj-content h2 { font-size: clamp(1.45rem, 1.2rem + 1vw, 1.9rem); }
.mj-site .mj-content a { color: var(--mj-forest); text-decoration-color: var(--mj-ember); text-underline-offset: 3px; }
.mj-site .mj-content a:hover, .mj-site .mj-content a:focus { color: var(--mj-fire-dark); }
.mj-site .mj-lead { font-size: 1.2rem; color: #33413a; }
.mj-site .mj-note { background: #f1e7d3; border-left-color: var(--mj-fire); color: var(--mj-ink); }
.mj-button, .mj-site .mj-content a.mj-button { display: inline-block; padding: .7rem 1.4rem; border-radius: 999px; background: var(--mj-fire); color: #fff; font-weight: 800; text-decoration: none; }
.mj-button:hover, .mj-button:focus, .mj-site .mj-content a.mj-button:hover { background: var(--mj-fire-dark); color: #fff; }

/* The honors' and the plugin lists' colours, in the camp's palette; the band above already shows the path back. */
.mj-site .orion-honor, .mj-site .orion-areas {
	--h-ink: var(--mj-ink);
	--h-moss: var(--mj-forest);
	--h-leaf: var(--mj-moss);
	--h-ember: var(--mj-fire);
	--h-sand: #f2e9d8;
	--h-line: var(--mj-line);
	--h-muted: var(--mj-muted);
}
.mj-site .orion-honor > .orion-honor__crumbs { display: none; }
.mj-site .orion-areas__card, .mj-site .orion-area-list__item a, .mj-site .mj-resources__item a, .mj-site .orion-honor__head { border-color: var(--mj-line); border-radius: 14px; }
.mj-site .orion-areas__card:hover, .mj-site .orion-area-list__item a:hover { box-shadow: 0 10px 24px rgba(20, 40, 29, .14); }
.mj-site .orion-honor-search__input, .mj-site .orion-division__select { border-color: var(--mj-line); }
.mj-site .orion-honor-search__input:focus, .mj-site .orion-division__select:focus { border-color: var(--mj-moss); box-shadow: 0 0 0 3px rgba(94, 140, 79, .22); }
.mj-site .orion-adv-classes__chip.is-on { background: var(--mj-pine); border-color: var(--mj-pine); }

/* A club's pages, as cards with an icon. */
.mj-site .mj-pages .orion-areas__card { position: relative; padding-left: 4.1rem; border-top: 0; border-left: 5px solid var(--mj-club); min-height: 5.2rem; justify-content: center; }
.mj-site .mj-pages .orion-areas__name { font-family: var(--mj-sans); font-weight: 800; color: var(--mj-pine); }
.mj-card__icon { position: absolute; left: 1rem; top: 1.05rem; display: flex; align-items: center; justify-content: center; width: 2.3rem; height: 2.3rem; border-radius: 50%; background: #f2e9d8; color: var(--mj-fire-dark); }
.mj-card__icon .mj-icon { width: 1.3rem; height: 1.3rem; }

/* ---- The hub's sections ----------------------------------------------------------------------------------- */
.mj-hub-section { margin-top: 2.5rem !important; }
.mj-site .mj-content .mj-hub-section__title { margin: 0 0 1.25rem; font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.2rem); text-transform: uppercase; letter-spacing: .02em; }
.mj-site .mj-content .mj-hub-section__title::after { content: ""; display: block; width: 64px; height: 4px; margin-top: .4rem; border-radius: 2px; background: var(--mj-fire); }
.mj-clubs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.mj-club { position: relative; display: flex; flex-direction: column; padding: 1.5rem 1.4rem 1.3rem; border: 1px solid var(--mj-line); border-radius: 18px; background: #fff; box-shadow: 0 6px 18px rgba(20, 40, 29, .06); }
.mj-club--aventureros { --mj-club: #e9a612; }
.mj-club--conquistadores { --mj-club: var(--mj-fire); }
.mj-club--guias-mayores { --mj-club: var(--mj-moss); }
.mj-club__badge { display: flex; align-items: center; justify-content: center; width: 3.6rem; height: 3.6rem; margin: -2.8rem 0 .75rem; border: 4px solid var(--mj-sand); border-radius: 50%; background: var(--mj-club); color: #fff; }
.mj-club__badge .mj-icon { width: 1.9rem; height: 1.9rem; }
.mj-site .mj-content .mj-club__age { margin: 0; color: var(--mj-muted); font-size: .8rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.mj-site .mj-content .mj-club__name { margin: .15rem 0 .5rem; font-size: 1.55rem; }
.mj-site .mj-content .mj-club__name a { color: var(--mj-pine); text-decoration: none; }
.mj-site .mj-content .mj-club__text { margin: 0 0 1rem; font-size: 1rem; line-height: 1.5; color: #3b4a40; }
.mj-club__links { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1rem; padding: 0; list-style: none; }
.mj-club__links li { margin: 0; }
.mj-site .mj-content .mj-club__links a { display: inline-block; padding: .3rem .75rem; border-radius: 999px; background: #f2e9d8; color: var(--mj-pine); font-size: .9rem; font-weight: 700; text-decoration: none; }
.mj-site .mj-content .mj-club__links a:hover { background: var(--mj-club); color: #fff; }
.mj-site .mj-content .mj-club__more { display: inline-flex; align-items: center; gap: .35rem; margin-top: auto; color: var(--mj-fire-dark); font-weight: 800; text-decoration: none; }
.mj-feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.mj-site .mj-content .mj-feature { display: flex; flex-direction: column; padding: 1.4rem; border-radius: 18px; background: var(--mj-pine) var(--mj-topo); background-size: 420px; color: #f3e9d6; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease; }
.mj-site .mj-content .mj-feature:hover, .mj-site .mj-content .mj-feature:focus-visible { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(20, 40, 29, .25); color: #fff; }
.mj-feature__icon { width: 2rem; height: 2rem; color: var(--mj-ember); }
.mj-feature__count { margin-top: .75rem; font-size: 2.4rem; font-weight: 800; line-height: 1; color: #fff; }
.mj-feature__name { margin-top: .3rem; font-size: 1.15rem; font-weight: 800; color: var(--mj-ember); }
.mj-feature__text { margin-top: .4rem; font-size: .95rem; line-height: 1.45; }
.mj-orion { display: flex; gap: 1.25rem; align-items: flex-start; margin-top: 2.5rem !important; padding: 1.6rem; border-radius: 18px; background: #f1e7d3; border: 1px dashed #cdbb97; }
.mj-orion__icon { display: flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 3.6rem; height: 3.6rem; border-radius: 50%; background: var(--mj-fire); color: #fff; }
.mj-orion__icon .mj-icon { width: 2rem; height: 2rem; }
.mj-site .mj-content .mj-orion h2 { margin: 0 0 .4rem; font-size: 1.4rem; }
.mj-site .mj-content .mj-orion p { margin: 0 0 .8rem; }
@media (max-width: 900px) {
	.mj-clubs, .mj-feature-grid { grid-template-columns: 1fr; gap: 2.4rem 1rem; }
	.mj-feature-grid { gap: 1rem; }
}
@media (max-width: 600px) {
	.mj-orion { flex-direction: column; }
}

/* ---- Footer ------------------------------------------------------------------------------------------------- */
.mj-footer { margin-top: 0; font-family: var(--mj-sans); }
.mj-treeline { display: block; width: 100%; height: 60px; margin-bottom: -1px; }
.mj-footer__body { background: var(--mj-pine-deep) var(--mj-topo); background-size: 420px; color: #cfc6b2; padding: 2.5rem 0 1.5rem; }
.mj-footer__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2rem; }
.mj-footer__brand { display: flex; gap: 1rem; align-items: flex-start; }
.mj-footer__brand .mj-emblem { width: 56px; height: 56px; }
.mj-footer__brand p { margin: 0; font-size: .95rem; line-height: 1.5; }
.mj-footer__brand strong { color: #fff; font-size: 1.1rem; text-transform: uppercase; letter-spacing: .03em; }
.mj-footer h2 { margin: 0 0 .7rem; font-family: var(--mj-sans); font-size: .85rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--mj-ember); }
.mj-footer ul { margin: 0; padding: 0; list-style: none; }
.mj-footer li { margin: 0 0 .45rem; }
.mj-footer a { color: #f3e9d6; text-decoration: none; }
.mj-footer a:hover, .mj-footer a:focus { color: var(--mj-ember); text-decoration: underline; }
.mj-footer__note { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid rgba(255, 255, 255, .1); font-size: .85rem; }
@media (max-width: 800px) {
	.mj-footer__grid { grid-template-columns: 1fr 1fr; }
	.mj-footer__brand { grid-column: 1 / -1; }
}