@font-face {
  font-family: toppan-bunkyu-midashi-go-std;
  src: url(/wp-content/themes/beaucoup/public/fonts/ToppanBunkyuMidashiGothicStdN-ExtraBold.woff);
  src: url(/wp-content/themes/beaucoup/public/fonts/ToppanBunkyuMidashiGothicStdN-ExtraBold.woff) format('embedded-opentype'), url(/wp-content/themes/beaucoup/public/fonts/ToppanBunkyuMidashiGothicStdN-ExtraBold.woff) format('otf'), url(/wp-content/themes/beaucoup/public/fonts/ToppanBunkyuMidashiGothicStdN-ExtraBold.woff) format('WOFf')
}
*, :after, :before {
  border: 0 solid #e5e7eb;
  box-sizing: border-box
}
:after, :before {
  --tw-content: ""
}
html {
  -webkit-text-size-adjust: 100%;
  font-feature-settings: normal;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Ryo Gothic PlusN B, Helvetica Neue, Ryo Gothic PlusN L, toppan-bunkyu-midashi-go-std, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
  font-variation-settings: normal;
  line-height: 1.5;
  -moz-tab-size: 4;
  tab-size: 4
}
body {
  line-height: inherit;
  margin: 0
}

/* Foundation index page: early-loaded page polish */
.foundation-index-page .foundation-system-grid > a{text-decoration:none}
.foundation-index-page #sec1 .foundation-card-hover{transition:background-color .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease}
.foundation-index-page #sec1 > a .foundation-card-hover::before{content:"↗";position:absolute;right:1.4rem;top:1.2rem;z-index:3;width:2.4rem;height:2.4rem;display:flex;align-items:center;justify-content:center;border:1px solid currentColor;background:var(--color-primary);color:var(--color-secondary);font-size:1.05rem;line-height:1;opacity:.42;transition:opacity .22s ease,background-color .22s ease,color .22s ease,border-color .22s ease}
@media (hover:hover){.foundation-index-page #sec1 > a:hover .foundation-card-hover{background:var(--color-secondary)!important;color:var(--color-primary)!important;border-color:var(--color-secondary)!important;box-shadow:inset 0 0 0 1px var(--color-secondary)}.foundation-index-page #sec1 > a:hover .foundation-card-hover *,.foundation-index-page #sec1 > a:hover .foundation-card-hover svg{color:var(--color-primary)!important;border-color:var(--color-primary)!important}.foundation-index-page #sec1 > a:hover .foundation-card-hover::before{opacity:1;color:var(--color-secondary);background:var(--color-primary);border-color:var(--color-primary)}}
.foundation-index-page .foundation-flow-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid currentColor;border-bottom:1px solid currentColor;color:var(--color-secondary)}
.foundation-index-page .foundation-flow-grid span{position:relative;display:flex;align-items:center;min-height:4.8rem;padding:0 1.2rem;border-right:1px solid currentColor;font-size:1.1rem;line-height:1;text-transform:uppercase;letter-spacing:.04em}
.foundation-index-page .foundation-flow-grid span:last-child{border-right:0}
.foundation-index-page .foundation-flow-grid span:not(:last-child)::after{content:"";position:absolute;right:-.45rem;top:50%;width:.8rem;height:.8rem;border-top:1px solid var(--color-secondary);border-right:1px solid var(--color-secondary);background:var(--color-primary);transform:translateY(-50%) rotate(45deg);z-index:1}
.foundation-index-page .foundation-mini-tags{display:flex;flex-wrap:wrap;gap:.5rem}
.foundation-index-page .foundation-mini-tags span{border:1px solid currentColor;padding:.18rem .5rem .12rem;font-size:.78rem;line-height:1;letter-spacing:.04em;text-transform:uppercase;color:var(--color-secondary);opacity:.68}
.foundation-index-page .foundation-card-lines{display:flex;flex-direction:column;gap:.65rem}
.foundation-index-page .foundation-card-lines > div{display:grid;grid-template-columns:6.2rem 1fr;gap:.7rem;align-items:start;border-top:1px solid currentColor;padding-top:.55rem;color:var(--color-secondary)}
.foundation-index-page .foundation-card-lines > div > div:first-child{font-size:.85rem;line-height:1;letter-spacing:.08em;text-transform:uppercase;opacity:.45}
.foundation-index-page .main-column .box-inner{background:var(--color-primary)}
.foundation-index-page .main-column .terms{padding:2.4rem 1.4rem 1.4rem!important}
.foundation-index-page .foundation-nav-kicker{font-size:.82rem;line-height:1;letter-spacing:.12em;text-transform:uppercase;color:var(--color-secondary);opacity:.45;margin-bottom:.85rem}
.foundation-index-page .foundation-nav-title{padding:.4rem 0 1.55rem;margin-bottom:.25rem;border-bottom:1px solid currentColor}
.foundation-index-page .foundation-nav-title h11{display:block;text-align:left;transform:none;font-size:2.1rem;line-height:.95;letter-spacing:0;font-weight:600}
.foundation-index-page .main-column h2{width:100%;max-width:25rem;line-height:.98;margin-bottom:1.8rem!important}
.foundation-index-page .main-column .anchor{margin-top:0!important;padding:0!important;border-top:1px solid currentColor}
.foundation-index-page .main-column .anchor:first-of-type{border-top:0}
.foundation-index-page .main-column .anchor a{display:grid;grid-template-columns:2.6rem 1fr 1.8rem;align-items:center;min-height:4.4rem;padding:.85rem .9rem;gap:.75rem;transition:background-color .18s ease,color .18s ease}
.foundation-index-page .main-column .anchor a span{font-size:.82rem;line-height:1;letter-spacing:.08em;opacity:.38}
.foundation-index-page .main-column .anchor a h10{font-size:1.28rem!important;line-height:1.05!important;letter-spacing:0!important}
.foundation-index-page .main-column .anchor a i{display:flex;align-items:center;justify-content:flex-end;font-style:normal;font-size:1.05rem;line-height:1;opacity:.34;transition:color .18s ease,opacity .18s ease,transform .18s ease}
.foundation-index-page .main-column .anchor a span,.foundation-index-page .main-column .anchor a h10{transition:color .18s ease,opacity .18s ease}
@media (hover:hover){.foundation-index-page .main-column .anchor a:hover{background:var(--color-secondary);color:var(--color-primary)!important}.foundation-index-page .main-column .anchor a:hover span,.foundation-index-page .main-column .anchor a:hover h10,.foundation-index-page .main-column .anchor a:hover i{color:var(--color-primary)!important;opacity:1}.foundation-index-page .main-column .anchor a:hover i{transform:translate(.12rem,-.12rem)}}
.foundation-index-page .main-column h1{min-height:7.4rem;line-height:.9;font-size:clamp(3.4rem,4vw,4.8rem)!important;padding-bottom:1rem!important}
@media (max-width:1199px){.foundation-index-page #sec1 > a .foundation-card-hover::before{right:1rem;top:1rem}.foundation-index-page .foundation-flow-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.foundation-index-page .foundation-flow-grid span{min-height:3.2rem;border-right:1px solid currentColor;border-bottom:1px solid currentColor;font-size:.95rem}.foundation-index-page .foundation-flow-grid span:nth-child(2n){border-right:0}.foundation-index-page .foundation-flow-grid span:last-child{grid-column:1/-1;border-right:0;border-bottom:0}.foundation-index-page .foundation-flow-grid span:not(:last-child)::after{display:none}.foundation-index-page .main-column h2{max-width:none}}

/* Academic Testing page: right-side index aligned with Foundation pages */
.academic-testing-page .academic-testing-nav{padding:2.4rem 1.4rem 1.4rem!important;gap:0!important;background:var(--color-primary)}
.academic-testing-page .academic-testing-nav-title{width:100%;padding:.4rem 0 1.45rem;margin-bottom:.2rem;border-bottom:1px solid currentColor;color:var(--color-secondary)}
.academic-testing-page .academic-testing-nav-title h11{display:block;text-align:left;transform:none;font-size:2.1rem;line-height:.95;letter-spacing:0;font-weight:600}
.academic-testing-page .academic-testing-nav-item{width:100%;margin-top:0!important;padding:0!important;border-top:1px solid currentColor;color:var(--color-secondary)}
.academic-testing-page .academic-testing-nav-title + .academic-testing-nav-item{border-top:0}
.academic-testing-page .academic-testing-nav-item a{display:grid;grid-template-columns:2.6rem minmax(0,1fr) 1.8rem;align-items:center;width:100%;min-height:5.25rem;padding:.92rem .9rem;gap:.75rem;text-decoration:none;transition:background-color .18s ease,color .18s ease}
.academic-testing-page .academic-testing-nav-item a > div{min-width:0}
.academic-testing-page .academic-testing-nav-item a span{font-size:.82rem;line-height:1;letter-spacing:.08em;opacity:.38}
.academic-testing-page .academic-testing-nav-item a h10{display:block;text-align:left!important;font-size:1.23rem!important;line-height:1.04!important;letter-spacing:0!important}
.academic-testing-page .academic-testing-nav-item a p{margin:.34rem 0 0;font-size:.82rem;line-height:1.22;letter-spacing:0;text-transform:none;opacity:.55;overflow-wrap:break-word}
.academic-testing-page .academic-testing-nav-item a i{display:flex;align-items:center;justify-content:flex-end;font-style:normal;font-size:1.05rem;line-height:1;opacity:.34;transition:color .18s ease,opacity .18s ease,transform .18s ease}
.academic-testing-page .academic-testing-nav-item a span,.academic-testing-page .academic-testing-nav-item a h10,.academic-testing-page .academic-testing-nav-item a p{transition:color .18s ease,opacity .18s ease}
.academic-testing-page #sec1 .px-7{padding-left:1rem!important;padding-right:.65rem!important}
.academic-testing-page #sec1 h2{font-size:1.28rem;line-height:1.12;letter-spacing:0;margin-top:.85rem!important}
.academic-testing-page #sec1 p{font-size:.88rem;line-height:1.28;margin-top:1rem!important}
.academic-testing-page .academic-testing-plain-nav{border-top:1px solid rgba(var(--color-secondary-rgb)/.15);color:var(--color-secondary)}
.academic-testing-page .academic-testing-plain-nav-row{display:block;width:100%;padding:1.08rem .78rem 1rem;border-bottom:1px solid rgba(var(--color-secondary-rgb)/.15);text-decoration:none;transition:background-color .18s ease,color .18s ease}
.academic-testing-page .academic-testing-plain-nav-row h10{display:block;text-align:left!important;font-size:1.24rem!important;line-height:1.1!important;letter-spacing:0!important}
.academic-testing-page .academic-testing-plain-nav-row p{margin:.4rem 0 0;font-size:.78rem;line-height:1.22;letter-spacing:0;text-transform:none;color:currentColor;opacity:.5}
@media (hover:hover){.academic-testing-page .academic-testing-plain-nav-row:hover{background:var(--color-secondary);color:var(--color-primary)!important}.academic-testing-page .academic-testing-plain-nav-row:hover h10,.academic-testing-page .academic-testing-plain-nav-row:hover p{color:var(--color-primary)!important;opacity:1}}
@media (min-width:1024px){.academic-testing-page .sticky-footer-top .grid-w > .main-column{order:2}.academic-testing-page .sticky-footer-top .grid-w > .main-column + .col-span-full{order:1}}
@media (min-width:1200px){.academic-testing-page .grid-w > .col-span-full > section:not(#sec1){height:calc(var(--h-available) - 1px)!important;min-height:calc(var(--h-available) - 1px)!important;overflow:auto}.academic-testing-page .grid-w > .col-span-full > section:not(#sec1) > .p-container,.academic-testing-page .grid-w > .col-span-full > section:not(#sec1) > .order-first{margin-bottom:0!important}.academic-testing-page .grid-w > .col-span-full > section:not(#sec1) .mb-180,.academic-testing-page .grid-w > .col-span-full > section:not(#sec1) .mb-200{margin-bottom:0!important}.academic-testing-page .grid-w > .col-span-full > section:not(#sec1) .mt-20{margin-top:1.2rem!important}.academic-testing-page .grid-w > .col-span-full > section:not(#sec1) button{padding-top:.45rem!important;padding-bottom:.45rem!important}.academic-testing-page .grid-w > .col-span-full > section:not(#sec1) button > div{padding-top:.75rem!important;padding-bottom:.75rem!important}.academic-testing-page .grid-w > .col-span-full > section:not(#sec1) .body-12{line-height:1.25}}
@media (hover:hover){.academic-testing-page .academic-testing-nav-item a:hover{background:var(--color-secondary);color:var(--color-primary)!important}.academic-testing-page .academic-testing-nav-item a:hover span,.academic-testing-page .academic-testing-nav-item a:hover h10,.academic-testing-page .academic-testing-nav-item a:hover p,.academic-testing-page .academic-testing-nav-item a:hover i{color:var(--color-primary)!important;opacity:1}.academic-testing-page .academic-testing-nav-item a:hover i{transform:translate(.12rem,-.12rem)}}
@media (max-width:1199px){.academic-testing-page .academic-testing-nav{padding:1.2rem 1rem!important;overflow-x:auto!important}.academic-testing-page .academic-testing-nav-title{display:none}.academic-testing-page .academic-testing-nav-item{min-width:15rem;border-top:0;border-right:1px solid currentColor}.academic-testing-page .academic-testing-nav-item:last-child{border-right:0}.academic-testing-page .academic-testing-nav-item a{min-height:4.4rem;padding:.7rem .8rem;grid-template-columns:2rem minmax(0,1fr) 1.2rem}.academic-testing-page .academic-testing-nav-item a p{display:none}.academic-testing-page .academic-testing-nav-item a h10{font-size:1.05rem!important}}
@media (max-width:1199px){.academic-testing-page .academic-testing-plain-nav{display:flex;min-width:max-content;border-top:0}.academic-testing-page .academic-testing-plain-nav-row{min-width:15rem;border-bottom:0;border-right:1px solid rgba(var(--color-secondary-rgb)/.15);padding:.75rem .9rem}.academic-testing-page .academic-testing-plain-nav-row:last-child{border-right:0}.academic-testing-page .academic-testing-plain-nav-row p{display:none}.academic-testing-page .academic-testing-plain-nav-row h10{font-size:1rem!important}}

/* Career Database page */
.career-database-page{--career-paper:var(--color-primary);--career-ink:var(--color-secondary);--career-card-line:rgba(var(--color-secondary-rgb)/.24);background:var(--career-paper)}
.career-db-hero-grid{display:grid;grid-template-columns:1fr;gap:2rem}
.career-db-card-grid{display:grid;grid-template-columns:1fr;gap:.8rem}
@media (min-width:768px){.career-db-hero-grid{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)!important}.career-db-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
.career-database-page .career-data-card{position:relative;display:flex;flex-direction:column;min-height:12.6rem;padding:1rem!important;border:1px solid var(--career-card-line)!important;background:var(--career-paper)!important;overflow:hidden;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease,background-color .28s ease}
.career-database-page .career-data-card:hover{transform:translateY(-3px);border-color:var(--career-ink)!important;background:var(--career-ink)!important;color:var(--career-paper)!important}
.career-database-page .career-data-card:hover *{color:var(--career-paper)!important}
.career-database-page .career-rank-badge{display:inline-flex;align-items:center;justify-content:center;min-width:3rem;height:3rem;border:1px solid var(--career-card-line);background:var(--career-paper);color:rgba(var(--color-secondary-rgb)/.55);font-size:1.2rem;font-weight:700;line-height:1}
.career-database-page .career-data-card:hover .career-rank-badge,.career-database-page .career-data-card:hover .border-t-px{border-color:rgba(var(--color-primary-rgb)/.35)!important}
.career-database-page .career-data-card:hover .career-rank-badge{background:var(--career-paper)!important;color:var(--career-ink)!important}
.career-database-page .career-data-card .body-18{font-size:1.42rem;line-height:1.08}
.career-database-page .career-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem .65rem;margin-top:.65rem}
.career-database-page .career-stat-grid>div{border-top:1px solid rgba(var(--color-secondary-rgb)/.12);padding-top:.4rem}
.career-database-page .career-stat-grid span{display:block;font-size:.82rem;line-height:1;text-transform:uppercase;letter-spacing:.04em;color:rgba(var(--color-secondary-rgb)/.38)}
.career-database-page .career-stat-grid b{display:block;margin-top:.3rem;font-size:1rem;line-height:1.1;color:var(--career-ink)}
.career-database-page .career-data-card::after{display:none}

/* Career profile page */
.career-profile-page .career-profile-grid{grid-template-columns:minmax(27rem,33%) minmax(0,1fr)!important}
.career-profile-page .career-profile-aside{padding:2.4rem!important}
.career-profile-page .career-profile-title,.career-profile-page .career-profile-rank,.career-profile-page .career-profile-article{padding:1.8rem!important}
.career-profile-page .career-profile-stat{min-height:6.6rem;padding:1.1rem!important}
.career-profile-page .career-profile-category-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.5rem;max-height:8.8rem;overflow-y:auto}
.career-profile-page .career-profile-category{padding:.6rem .9rem!important;min-height:3.4rem}
.career-profile-page .career-profile-category span{font-size:1.05rem;line-height:1.15}
.career-profile-page .career-profile-category strong{font-size:1.4rem;line-height:1}
.career-profile-page .career-profile-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.8rem!important}
.career-profile-page .career-profile-info-card{min-height:13.5rem!important;padding:1.4rem!important}
.career-profile-page .career-profile-copy{max-height:none!important;overflow:visible!important}
.career-profile-page .career-profile-satisfaction{min-height:7rem!important;padding:1.2rem!important}
@media (max-width:767px){.career-profile-page .career-profile-grid,.career-profile-page .career-profile-info-grid,.career-profile-page .career-profile-category-list{grid-template-columns:1fr!important}.career-profile-page .career-profile-aside,.career-profile-page .career-profile-article{padding:2rem!important}}

/* University Intelligence page: Foundation visual alignment */
.university-intelligence-page .cover{background:var(--color-primary)}
.university-intelligence-page .cover .rounded-10{border-radius:0!important}
.university-intelligence-page .relative.mt-20:has(#universitySearch) > .flex.items-center{border-color:var(--color-secondary)!important;border-radius:0!important}
.university-intelligence-page #universitySearch{border-color:var(--color-secondary)!important}
.university-intelligence-page #universitySearch + *{border-color:var(--color-secondary)!important}
.university-intelligence-page #universitySearch{letter-spacing:.02em}
.university-intelligence-page #universitySearch::placeholder{color:var(--color-secondary);opacity:.42}
.university-intelligence-page #universitySearch:focus{box-shadow:none}
.university-intelligence-page #searchResults{border:1px solid var(--color-secondary)!important;border-radius:0!important;box-shadow:none!important;background:var(--color-primary)!important;color:var(--color-secondary)!important}
.university-intelligence-page .home-bottom-links h3{color:var(--color-secondary)!important;opacity:.46;letter-spacing:.08em}
.university-intelligence-page .home-bottom-links .link{color:var(--color-secondary);text-decoration:none;transition:opacity .18s ease,color .18s ease}
.university-intelligence-page .home-bottom-links .link:hover{opacity:.48}
.university-intelligence-page .qs-page-btn,.university-intelligence-page [class*="page-btn"]{border-color:var(--color-secondary)!important;border-radius:0!important;color:var(--color-secondary);background:var(--color-primary)}
.university-intelligence-page .qs-page-btn.active,.university-intelligence-page .qs-page-btn:hover{background:var(--color-secondary)!important;color:var(--color-primary)!important}
@media (min-width:1024px){.university-intelligence-page .sticky-footer-top .grid-w > .main-column{order:2}.university-intelligence-page .sticky-footer-top .grid-w > .col-span-full:first-child{order:1}}
hr {
  border-top-width: 1px;
  color: inherit;
  height: 0
}

abbr:where([title]) {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted
}
h1, h2, h3, h4, h5, h6, h7, h8, h9{
  font-size: inherit;
  font-weight: inherit
}
h7 {
    font-size: 3.4em;
    text-transform: uppercase;
    font-weight: 600;
    line-height: 1.30;
    text-align:center;
    letter-spacing: -0.08em;
    margin: 0;
    padding: 0;
    font-stretch: condensed; 
    transform: scaleY(0.95);
} 

h10 {
    
    font-size: 1.7em;
    font-weight: 400;
    line-height: 1.2;
    text-align:center;
    letter-spacing: -0.08em;
    margin: 0;
    padding: 0;
    font-stretch: condensed; 
}
h11 {
   
    font-size: 2.0em;
    text-transform: uppercase;
    font-weight: 600;
    line-height: 1;
    text-align:center;
    letter-spacing: -0.08em;
    margin: 0;
    padding: 0;
    font-stretch: condensed; 
    transform: scaleX(0.8);
}
h12 {
   
    font-size: 1.4em;
    font-weight: 400;
    line-height: 1.7;
    text-align:center;
    letter-spacing: -0.08em;
    margin: 0;
    padding: 0;
    font-stretch: condensed; 
    transform: scaleY(0.85);
}
h8 {
    font-size: 1.4em;
    font-weight: 500;
    line-height: 1;
    letter-spacing: -0.08em;
    margin: 0;
    padding: 0;
    font-stretch: condensed;    
    transform: scaleY(0.95); 
}
h9 {
    font-size: 2.4em;
    text-transform: uppercase;
    color: aliceblue;
    font-weight: 300;
    line-height: 1;
    text-align: center;
    letter-spacing: -0.08em;
    margin: 0;
    font-stretch: condensed;    
    transform: scaleY(0.93); 
    padding: 0.5rem 1.25rem;
  background-color: #000;
   text-decoration: none;
}
a {
  color: inherit;
  text-decoration: inherit
}
b, strong {
  font-weight: bolder
}
code, kbd, pre, samp {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
  font-size: 1em
}
small {
  font-size: 80%
}
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: initial
}
sub {
  bottom: -.25em
}
sup {
  top: -.5em
}
table {
  border-collapse: collapse;
  border-color: inherit;
  text-indent: 0
}
button, input, optgroup, select, textarea {
  font-feature-settings: inherit;
  color: inherit;
  font-family: inherit;
  font-size: 100%;
  font-variation-settings: inherit;
  font-weight: inherit;
  line-height: inherit;
  margin: 0;
  padding: 0
}
button, select {
  text-transform: none
}
[type=button], [type=reset], [type=submit], button {
  -webkit-appearance: button;
  background-color: initial;
  background-image: none
}
:-moz-focusring {
  outline: auto
}
:-moz-ui-invalid {
  box-shadow: none
}
progress {
  vertical-align: initial
}
::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
  height: auto
}
[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px
}
::-webkit-search-decoration {
  -webkit-appearance: none
}
::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit
}
summary {
  display: list-item
}
blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, h7, h8, h9, hr, p, pre {
  margin: 0
}
fieldset {
  margin: 0
}
fieldset, legend {
  padding: 0
}
menu, ol, ul {
  list-style: none;
  margin: 0;
  padding: 0
}
dialog {
  padding: 0
}
textarea {
  resize: vertical
}
input::placeholder, textarea::placeholder {
  color: #9ca3af;
  opacity: 1
}
[role=button], button {
  cursor: pointer
}
:disabled {
  cursor: default
}
audio, canvas, embed, iframe, img, object, svg, video {
  display: block;
  vertical-align: middle
}
img, video {
  height: auto;
  max-width: 100%
}
[hidden] {
  display: none
}
*, :after, :before {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position: ;
  --tw-gradient-via-position: ;
  --tw-gradient-to-position: ;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #3b82f680;
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia:
}
::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position: ;
  --tw-gradient-via-position: ;
  --tw-gradient-to-position: ;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #3b82f680;
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia:
}
.pointer-events-none {
  pointer-events: none
}
.pointer-events-auto {
  pointer-events: auto
}
.static {
  position: static
}
.fixed {
  position: fixed
}
.absolute {
  position: absolute
}
.relative {
  position: relative
}
.sticky {
  position: sticky
}
.-top-\[0\.5rem\] {
  top: -.5rem
}
.-top-1 {
  top: -0.25rem
}
.bottom-0 {
  bottom: 0
}
.bottom-8 {
  bottom: 8
}
.bottom-10 {
  bottom: 10
}
.bottom-20 {
  bottom: 20
}
.bottom-40 {
  bottom: 40
}
.bottom-60 {
  bottom: 60
}
.left-0 {
  left: 0
}
.left-1\/2 {
  left: 50%
}

.left-\[26\.5\%\] {
  left: 26.5%
}
.left-\[19\.7\%\] {
  left: 19.7%
}
.left-\[18\.7\%\] {
  left: 18.7%
}
.left-\[13\.8\%\] {
  left: 13.8%
}
.left-\[10\.8\%\] {
  left: 10.8%
}
.left-\[1rem\] {
  left: 1rem
}
.left-\[2rem\] {
  left: 2rem
}
.left-14 {
  left: 3.5rem
}
.right-0 {
  right: 0
}
.right-2 {
  right: 2
}
.right-14 {
  right: 3.5rem
}
.top-0 {
  top: 0
}
.top-56 {
  top: 56%
}
.top-1\/2 {
  top: 50%
}

.top-header {
  top: var(--spacing-header)
}
.top-sticky {
  top: var(--spacing-sticky)
}
.-z-1 {
  z-index: -1
}
.z-0 {
  z-index: 0
}
.z-1 {
  z-index: 1
}
.z-2 {
  z-index: 2
}
.z-3 {
  z-index: 3
}
.z-4 {
  z-index: 4
}
.z-\[8\] {
  z-index: 8
}
.z-\[99\] {
  z-index: 99
}
.z-header {
  z-index: 10
}
.z-loader {
  z-index: 20
}
.z-overlay {
  z-index: 8
}
.z-transition {
  z-index: 9
}
.order-1 {
  order: 1
}
.order-2 {
  order: 2
}
.order-3 {
  order: 3
}
.order-4 {
  order: 4
}
.order-5 {
  order: 5
}
.order-first {
  order: -9999
}
.col-span-1 {
  grid-column: span 1/span 1
}
.col-span-2 {
  grid-column: span 2/span 2
}
.col-span-3 {
  grid-column: span 3/span 3
}
.col-span-5 {
  grid-column: span 5/span 5
}
.col-span-6 {
  grid-column: span 6/span 6
}
.col-span-12 {
  grid-column: span 12/span 12
}
.col-span-14 {
  grid-column: span 14/span 14
}
.col-span-15 {
  grid-column: span 14/span 15
}
.col-span-16 {
  grid-column: span 16/span 16
}
.col-span-full {
  grid-column: 1/-1
}
.col-start-1 {
  grid-column-start: 1
}
.col-start-13 {
  grid-column-start: 13
}
.col-start-15 {
  grid-column-start: 15
}
.col-start-19 {
  grid-column-start: 19
}
.col-start-9 {
  grid-column-start: 9
}

.col-end-15 {
  grid-column-end: 15
}
.col-end-18 {
  grid-column-end: 18
}
.col-end-24 {
  grid-column-end: 24
}
.col-end-23 {
  grid-column-end: 23
}
.col-end-25 {
  grid-column-end: 25
}
.row-span-2 {
  grid-row: span 2/span 2
}
.-mb-\[0\.6rem\] {
  margin-bottom: -.6rem
}
.-ml-\[0\.4rem\] {
  margin-left: -.4rem
}
.-ml-\[0\.7rem\] {
  margin-left: -.7rem
}
.-ml-px {
  margin-left: -1px
}
.-mr-5 {
  margin-right: -.5rem
}
.-mt-px {
  margin-top: -1px
}
.mb-0 {
  margin-bottom: 0
}
.mb-10 {
  margin-bottom: 1rem
}
.mb-15 {
  margin-bottom: 1.5rem
}
.mb-20 {
  margin-bottom: 2rem
}
.mb-30 {
  margin-bottom: 3rem
}
.mb-35 {
  margin-bottom: 3.5rem
}
.mb-40 {
  margin-bottom: 4rem
}
.mb-50 {
  margin-bottom: 5rem
}
.mb-5 {
  margin-bottom: .5rem
}
.mb-8 {
  margin-bottom: .8rem
}
.mb-75 {
  margin-bottom: 7.5rem
}
.mb-180 {
  margin-bottom: 18.0rem
}
.mb-200 {
  margin-bottom: 20.0rem
}
.mb-\[1\.3rem\] {
  margin-bottom: 1.3rem
}
.mb-\[1\.5rem\] {
  margin-bottom: 1.5rem
}
.ml-0 {
  margin-left: 0
}
.ml-10 {
  margin-left: 1rem
}
.ml-20 {
  margin-left: 2rem
}
.ml-\[0\.2rem\] {
  margin-left: .2rem
}

.mr-5 {
  margin-right: .5rem
}
.mt-8 {
  margin-top: .8rem
}
.mt-12 {
  margin-top: 1.2rem
}
.mt-10 {
  margin-top: 1rem
}
.mt-20 {
  margin-top: 2rem
}
.mt-28 {
  margin-top: 2.8rem
}
.mt-30 {
  margin-top: 3rem
}
.mt-5 {
  margin-top: .5rem
}
.mt-40 {
  margin-top: 4rem
}
.mt-50 {
  margin-top: 5rem
}
.mt-100 {
  margin-top: 10rem
}
.mt-150 {
  margin-top: 15rem
}
.mt-250 {
  margin-top: 25rem
}
.mt-200 {
  margin-top: 20rem
}
.mt-300 {
  margin-top: 30rem
}
.mt-400 {
  margin-top: 40rem
}
.block {
  display: block
}
.inline {
  display: inline
}
.flex {
  display: flex
}
.grid {
  display: grid
}
.contents {
  display: contents
}
.hidden {
  display: none
}
inset-x-10 {
  left: 2.5rem;
  right: 2.5rem;  
}

.h-0 {
  height: 0
}
.h-24 {
  height: 6rem
}
.h-\[1\.2rem\] {
  height: 1.2rem
}
.h-\[1\.8rem\] {
  height: 1.8rem
}
.h-\[4rem\] {
  height: 4rem
}
.h-\[5\.5rem\] {
  height: 5.5rem
}
.h-\[20vw\] {
  height: 20vw
}
.h-\[40vw\] {
  height: 40vw
}
.h-\[50vw\] {
  height: 50vw
}
.h-\[6rem\] {
  height: 6rem
}
.h-\[7rem\] {
  height: 7rem
}
.h-\[8\.8rem\] {
  height: 8.8rem
}
.h-\[8rem\] {
  height: 8rem
}
.h-\[calc\(50\%-7rem\)\] {
  height: calc(50% - 7rem)
}
.h-\[var\(--image-height\)\] {
  height: var(--image-height)
}
.h-auto {
  height: auto
}
.h-available {
  height: var(--h-available)
}
.h-full {
  height: 100%
}
.h-header {
  height: var(--h-header)
}
.h-px {
  height: 1px
}
.h-screen {
  height: 100vh
}
.max-h-\[50\%\] {
  max-height: 50%
}
.max-h-\[50vw\] {
  max-height: 50vw
}
.max-h-available {
  max-height: var(--h-available)
}
.max-h-full {
  max-height: 100%
}
.min-h-\[4\.2rem\] {
  min-height: 4.2rem
}
.min-h-available {
  min-height: var(--h-available)
}
.w-0 {
  width: 0
}
.w-1 {
  width: 2
}
.w-24 {
  width: 6rem
}

.w-\[1\.2rem\] {
  width: 1.2rem
}
.w-\[1\.3rem\] {
  width: 1.3rem
}
.w-\[30\%\] {
  width: 30%
}
.w-\[38\%\] {
  width: 38%
}
.w-\[40\%\] {
  width: 40%
}
.w-\[43\%\] {
  width: 43%
}
.w-\[45\%\] {
  width: 45%
}
.w-\[52\%\] {
  width: 52%
}
.w-\[35\%\] {
  width: 35%
}
.w-\[24rem\] {
  width: 24rem
}
.w-\[40rem\] {
  width: 40rem
}
.w-\[54\.3rem\] {
  width: 54.3rem
}
.w-\[56\.0rem\] {
  width: 56.0rem
}
.w-\[65\.0rem\] {
  width: 65.0rem
}
.w-\[47\%\] {
  width: 47%
}
.w-\[55\%\] {
  width: 55%
}
.w-\[66\%\] {
  width: 66%
}
.w-\[6rem\] {
  width: 6rem
}
.w-\[70\%\] {
  width: 70%
}
.w-\[8\.5rem\] {
  width: 8.5rem
}
.w-\[80\%\] {
  width: 80%
}
.w-\[85\%\] {
  width: 85%
}
.w-\[90\%\] {
  width: 90%
}
.w-\[var\(--image-width\)\] {
  width: var(--image-width)
}
.w-auto {
  width: auto
}
.w-full {
  width: 100%
}
.w-screen {
  width: 100vw
}
.max-w-\[97\%\] {
  max-width: 97%
}
.max-w-\[58\%\] {
  max-width: 58%
}
.max-w-\[15rem\] {
  max-width: 15rem
}
.max-w-\[18rem\] {
  max-width: 18rem
}
.max-w-full {
  max-width: 100%
}
.min-w-max {
  min-width: max-content
}
.flex-1 {
  flex: 1 1 0%
}
.shrink-0 {
  flex-shrink: 0
}
.-translate-x-1\/2 {
  --tw-translate-x: -50%
}
.-translate-x-1\/2, .-translate-y-1\/2 {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.-translate-y-1\/2 {
  --tw-translate-y: -50%
}
.translate-x-0 {
  --tw-translate-x: 0
}
.translate-x-0, .translate-y-0 {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.translate-y-0 {
  --tw-translate-y: 0
}
.scale-\[1\.4\] {
  --tw-scale-x: 1.4;
  --tw-scale-y: 1.4
}
.scale-\[1\.4\], .transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.cursor-grab {
  cursor: grab
}
.cursor-pointer {
  cursor: pointer
}
.select-none {
  -webkit-user-select: none;
  user-select: none
}
.resize {
  resize: both
}
.grid-cols-12 {
  grid-template-columns: repeat(12, minmax(0, 1fr))
}
.grid-cols-14 {
  grid-template-columns: repeat(14, minmax(0, 1fr))
}
.grid-cols-18 {
  grid-template-columns: repeat(18, minmax(0, 1fr))
}
.grid-cols-24 {
  grid-template-columns: repeat(24, minmax(0, 1fr))
}
.grid-cols-6 {
  grid-template-columns: repeat(6, minmax(0, 1fr))
}
.grid-cols-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr))
}
.grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr))
}
.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr))
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr))
}
.flex-row {
  flex-direction: row
}
.flex-col {
  flex-direction: column
}
.flex-col-reverse {
  flex-direction: column-reverse
}
.flex-wrap {
  flex-wrap: wrap
}
.flex-nowrap {
  flex-wrap: nowrap
}
.content-start {
  align-content: flex-start
}
.content-end {
  align-content: flex-end
}
.items-start {
  align-items: flex-start
}
.items-end {
  align-items: flex-end
}
.items-center {
  align-items: center
}
.justify-start {
  justify-content: flex-start
}
.justify-end {
  justify-content: flex-end
}
.justify-center {
  justify-content: center
}
.justify-between {
  justify-content: space-between
}
.gap-6 {
  gap: 0.6rem
}
.gap-10, .gap-grid {
  gap: 1rem
}
.gap-12, .gap-grid  {
  gap: 1.2rem
}
.gap-14, .gap-grid  {
  gap: 1.4rem
}
.gap-x-8 {
  -moz-column-gap: .8rem;
  column-gap: .8rem
}
.gap-x-10 {
  -moz-column-gap: 1rem;
  column-gap: 1rem
}
.gap-x-5 {
  -moz-column-gap: .5rem;
  column-gap: .5rem
}
.gap-x-container {
  -moz-column-gap: var(--padding-container);
  column-gap: var(--padding-container)
}
.gap-x-grid {
  -moz-column-gap: 1rem;
  column-gap: 1rem
}
.gap-y-10, .gap-y-grid {
  row-gap: 1rem
}
.gap-y-5 {
  row-gap: .5rem
}
.self-start {
  align-self: flex-start
}
.overflow-hidden {
  overflow: hidden
}
.overflow-y-scroll {
  overflow-y: scroll
}
.whitespace-nowrap {
  white-space: nowrap
}
.rounded-10 {
  border-radius: 10px
}
.rounded-full {
  border-radius: 9999px
}
.rounded-none {
  border-radius: 0
}
.border-px {
  border-width: 1px
}
.border-rem {
  border-width: max(1px, .1rem)
}
.border-y-px {
  border-top-width: 1px
}
.border-b-px, .border-y-px {
  border-bottom-width: 1px
}
.border-l-px {
  border-left-width: 1px
}
.border-r-px {
  border-right-width: 1px
}
.border-t-px {
  border-top-width: 1px
}
.border-secondary {
  border-color: var(--color-secondary)
}
.border-secondary-rgb\/15 {
  border-color: rgba(var(--color-secondary-rgb)/.15)
}
.border-secondary-rgb\/10 {
  border-color: rgba(var(--color-secondary-rgb)/.10)
}
.border-l-secondary {
  border-left-color: var(--color-secondary)
}
.bg-\[\#121212\] {
  --tw-bg-opacity: 1;
  background-color: rgb(18 18 18/var(--tw-bg-opacity))
}
.bg-black {
  background-color: var(--color-black)
}
.bg-black-rgb\/20 {
  background-color: rgba(var(--color-black-rgb)/.2)
}
.bg-grid {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-grid)/var(--tw-bg-opacity))
}
.bg-primary {
  background-color: var(--color-primary)
}
.bg-secondary {
  background-color: var(--color-secondary)
}
.bg-secondary-rgb\/15 {
  background-color: rgba(var(--color-secondary-rgb)/.15)
}
.bg-transparent {
  background-color: initial
}
.bg-white {
  background-color: var(--color-white)
}
.object-contain {
  object-fit: contain
}
.object-cover {
  object-fit: cover
}
.object-center {
  object-position: center
}
.p-10 {
  padding: 1rem
}
.p-20 {
  padding: 2rem
}
.p-5 {
  padding: .5rem
}
.p-container {
  padding: var(--padding-container)
}
.px-8 {
  padding-left: 0.8rem;
  padding-right: 0.8rem
}
.px-10 {
  padding-left: 1rem;
  padding-right: 1rem
}
.px-14 {
  padding-left: 1.4rem;
  padding-right: 1.4rem
}
.px-16 {
  padding-left: 1.6rem;
  padding-right: 1.6rem
}
.px-20 {
  padding-left: 2rem;
  padding-right: 2rem
}
.px-325 {
  padding-left: 32.5rem;
  padding-right: 32.5rem
}
.px-\[1\.1rem\] {
  padding-left: 1.1rem;
  padding-right: 1.1rem
}
.px-\[1\.7rem\] {
  padding-left: 1.7rem;
  padding-right: 1.7rem
}
.px-container {
  padding-left: var(--padding-container);
  padding-right: var(--padding-container)
}
.py-10 {
  padding-bottom: 1rem;
  padding-top: 1rem
}
.py-12 {
  padding-bottom: 1.2rem;
  padding-top: 1.2rem
}
.py-14 {
  padding-bottom: 1.4rem;
  padding-top: 1.4rem
}
.py-20 {
  padding-bottom: 2rem;
  padding-top: 2rem
}
.py-5 {
  padding-bottom: .5rem;
  padding-top: .5rem
}
.py-4 {
  padding-bottom: .4rem;
  padding-top: .4rem
}
.pb-0 {
  padding-bottom: 0
}
.pb-10 {
  padding-bottom: 1rem
}
.pb-20 {
  padding-bottom: 2rem
}
.pb-40 {
  padding-bottom: 4rem
}
.pb-5 {
  padding-bottom: .5rem
}
.pb-8 {
  padding-bottom: .8rem
}
.pb-\[0\.4rem\] {
  padding-bottom: .4rem
}
.pb-\[0\.6rem\] {
  padding-bottom: .6rem
}
.pb-\[0\.7rem\] {
  padding-bottom: .7rem
}
.pb-\[0\.8rem\] {
  padding-bottom: .8rem
}
.pb-\[0\.9rem\] {
  padding-bottom: .9rem
}
.pb-\[1\.1rem\] {
  padding-bottom: 1.1rem
}
.pb-\[1\.2rem\] {
  padding-bottom: 1.2rem
}
.pb-\[1\.3rem\] {
  padding-bottom: 1.3rem
}
.pb-\[1\.6rem\] {
  padding-bottom: 1.6rem
}
.pb-\[1\.8rem\] {
  padding-bottom: 1.8rem
}
.pb-container {
  padding-bottom: var(--padding-container)
}
.pl-09 {
  padding-left: 0.99rem
}
.pl-15 {
  padding-left: 1.5rem
}
.pl-20 {
  padding-left: 2rem
}
.pl-40 {
  padding-left: 4rem
}

.pl-container {
  padding-left: var(--padding-container)
}
.pr-20 {
  padding-right: 2rem
}
.pr-12 {
  padding-right: 1.2rem
}
.pr-\[3\.2rem\] {
  padding-right: 3.2rem
}
.pr-container {
  padding-right: var(--padding-container)
}
.pt-0 {
  padding-top: 0
}
.pt-10 {
  padding-top: 1rem
}
.pt-12 {
  padding-top: 1.2rem
}
.pt-14 {
  padding-top: 1.4rem
}
.pt-15 {
  padding-top: 1.5rem
}
.pt-16 {
  padding-top: 1.6rem
}
.pt-20 {
  padding-top: 2rem
}
.pt-6 {
  padding-top: .6rem
}
.pt-\[0\.2rem\] {
  padding-top: .2rem
}
.pt-\[0\.5rem\] {
  padding-top: .5rem
}
.pt-\[1\.2rem\] {
  padding-top: 1.2rem
}
.pt-\[1\.4rem\] {
  padding-top: 1.4rem
}
.pt-\[1\.5rem\] {
  padding-top: 1.5rem
}
.pt-\[1\.8rem\] {
  padding-top: 1.8rem
}
.pt-\[100\%\] {
  padding-top: 100%
}
.pt-\[110\%\] {
  padding-top: 110%
}
.pt-\[120\%\] {
  padding-top: 120%
}
.pt-\[3rem\] {
  padding-top: 3rem
}
.pt-\[42\.09\%\] {
  padding-top: 42.09%
}
.pt-\[56\.25\%\] {
  padding-top: 56.25%
}
.pt-\[58\.47\%\] {
  padding-top: 58.47%
}
.pt-\[61\.79\%\] {
  padding-top: 61.79%
}
.pt-\[62\.68\%\] {
  padding-top: 62.68%
}
.pt-\[63\.26\%\] {
  padding-top: 63.26%
}
.pt-\[63\.3\%\] {
  padding-top: 63.3%
}
.pt-\[66\.86\%\] {
  padding-top: 66.86%
}
.pt-\[7\.5rem\] {
  padding-top: 7.5rem
}
.pt-container {
  padding-top: var(--padding-container)
}
.text-center {
  text-align: center
}
.text-right {
  text-align: right
}
.text-\[7\.4rem\] {
  font-size: 7.4rem
}
.font-bold {
  font-weight: 700
}
.font-medium {
  font-weight: 500
}
.uppercase {
  text-transform: uppercase
}
.\ !leading-\[2\.6rem\] {
  line-height: 2.6rem !important
}
.leading-\[1\.1\] {
  line-height: 1.1rem
}
.leading-\[1\.3\] {
  line-height: 1.3rem
}
.leading-\[1\.4\] {
  line-height: 1.4rem
}
.leading-\[1\.8\] {
  line-height: 1.8rem
}
.leading-\[1\] {
  line-height: 1
}
.leading-\[normal\] {
  line-height: normal
}
.leading-relaxed {
  line-height: 1.625rem
}
.text-primary {
  color: var(--color-primary)
}
.text-secondary {
  color: var(--color-secondary)
}
.text-secondary-rgb\/70 {
  color: rgba(var(--color-secondary-rgb)/.7)
}
.text-secondary-rgb\/60 {
  color: rgba(var(--color-secondary-rgb)/.6)
}
.text-secondary-rgb\/58 {
  color: rgba(var(--color-secondary-rgb)/.58)
}
.text-secondary-rgb\/50 {
  color: rgba(var(--color-secondary-rgb)/.5)
}
.text-secondary-rgb\/45 {
  color: rgba(var(--color-secondary-rgb)/.45)
}
.text-secondary-rgb\/38 {
  color: rgba(var(--color-secondary-rgb)/.38)
}
.text-secondary-rgb\/35 {
  color: rgba(var(--color-secondary-rgb)/.35)
}
.text-secondary-rgb\/30 {
  color: rgba(var(--color-secondary-rgb)/.3)
}
.text-secondary-rgb\/25 {
  color: rgba(var(--color-secondary-rgb)/.25)
}
.text-secondary-rgb\/15 {
  color: rgba(var(--color-secondary-rgb)/.15)
}
.text-secondary-rgb\/8 {
  color: rgba(var(--color-secondary-rgb)/.08)
}
.text-transparent {
  color: #0000
}
.text-white {
  color: var(--color-white)
}
.opacity-0 {
  opacity: 0
}
.opacity-100 {
  opacity: 1
}
.opacity-10 {
  opacity: .10
}
.opacity-15 {
  opacity: .15
}
.opacity-20 {
  opacity: .2
}
.opacity-30 {
  opacity: .3
}
.opacity-50 {
  opacity: .5
}
.outline-none {
  outline: 2px solid #0000;
  outline-offset: 2px
}
.outline {
  outline-style: solid
}
.grayscale-[15%] {
  filter: grayscale(15%)
}
.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}
.transition {
  transition-duration: .15s;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.transition-\[color\2c border-color\2c transform\2c background-color\] {
  transition-duration: .15s;
  transition-property: color, border-color, transform, background-color;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.transition-opacity {
  transition-duration: .15s;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.transition-transform {
  transition-duration: .15s;
  transition-property: transform;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.delay-200 {
  transition-delay: .2s
}
.duration-500 {
  transition-duration: .5s
}
.duration-fast {
  transition-duration: .3s
}
.ease-out {
  transition-timing-function: cubic-bezier(0, 0, .2, 1)
}
.will-change-transform {
  will-change: transform
}
:root {
  --color-black: #000;
  --color-white: #fff;
  --color-black-rgb: 0 0 0;
  --color-grid: 255 0 0;
  --color-blue: 0 0 255;
  --color-primary: #fff;
  --color-primary-rgb: 255 255 255;
  --color-secondary: #000;
  --color-secondary-rgb: 0 0 0;
  --delay: 0.017s;
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in: cubic-bezier(0.12, 0, 0.39, 0);
  --ease-in-out: cubic-bezier(0.86, 0, 0.07, 1);
  --ease-out-back: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --size: 375;
  --vh: calc(var(--wh, 1vh)*100);
  --padding-container: 1rem;
  --h-header: 4.5rem;
  --h-available: calc(var(--vh) - var(--h-header) - 3rem);
  --spacing-header: calc(var(--h-header) + 1rem);
  --spacing-sticky: calc(var(--h-header) + 2rem);
  --image-width: 100%;
  --image-height: 100%;
  --cursor-x: 0;
  --cursor-y: 0
}
@media (min-width:768px) {
  :root {
    --size: 768;
    --padding-container: 2rem;
    --h-available: calc(100vh - var(--h-header) - 5rem);
    --spacing-header: calc(var(--h-header) + 2rem);
    --spacing-sticky: calc(var(--h-header) + 3rem)
  }
}
@media (min-width:1024px) {
  :root {
    --size: 1024
  }
}
@media (min-width:1200px) and (hover:hover) {
  :root {
    --size: 1440
  }
}
@tailwind components;
@font-face {
  font-display: swap;
  font-family: MaisonNeue;
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/MaisonNeue-Book.cbb526.woff2) format("woff2"), url(../fonts/MaisonNeue-Book.fb63e1.woff) format("woff")
}
@font-face {
  font-display: swap;
  font-family: MaisonNeue;
  font-style: normal;
  font-weight: 500;
  src: url(../fonts/MaisonNeue-Medium.d7e095.woff2) format("woff2"), url(../fonts/MaisonNeue-Medium.b386b6.woff) format("woff")
}
@font-face {
  font-display: swap;
  font-family: MaisonNeue;
  font-style: normal;
  font-weight: 700;
  src: url(../fonts/MaisonNeue-Bold.e772f0.woff2) format("woff2"), url(../fonts/MaisonNeue-Bold.10c7bb.woff) format("woff")
}
@media (hover:hover) {
  .home.a .list-o:hover .list-o-item {
    color: var(--color-primary)
  }
}
@media (min-width:1200px) and (hover:hover) {
  .list-o {
    pointer-events: none
  }
}
@media (hover:hover) {
  .list-o:hover .list-o-item {
    opacity: .2
  }
  .list-o:hover .list-o-item-50 {
    opacity: .5
  }
  .list-o:hover .list-o-item-50.a {
    opacity: 1
  }
}
.list-o .list-o-item, .list-o .list-o-item-50 {
  pointer-events: auto
}
@media (hover:hover) {
  .list-o .list-o-item-50:hover, .list-o .list-o-item:hover {
    opacity: 1
  }
}
.list-o .list-o-item-50.a .list-o-item-50, .list-o .list-o-item.a .list-o-item-50 {
  opacity: 1
}
.archive-term, .term {
  opacity: .3
}
@media (min-width:1200px) and (hover:hover) {
  .archive-term, .term {
    opacity: .2
  }
}
.archive-term.a, .term.a {
  opacity: 1
}
@media (hover:hover) {
  .archive-term:hover, .term:hover {
    opacity: 1
  }
}
@media (min-width:1200px) and (hover:hover) {
  .archive-o {
    pointer-events: none
  }
}
@media (hover:hover) {
  .archive-o:hover .archive-o-item {
    opacity: .2
  }
  .archive-o:hover .works-line {
    opacity: .2
  }
}
.archive-o .archive-o-item {
  pointer-events: auto
}
@media (hover:hover) {
  .archive-o .archive-o-item:hover {
    border-color: rgba(var(--color-secondary-rgb)/.2);
    opacity: 1
  }
}
.mobile-slider {
  --tw-scroll-snap-strictness: mandatory;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  overflow-x: scroll;
  scroll-padding-left: 2rem;
  scroll-snap-type: x var(--tw-scroll-snap-strictness);
  scrollbar-width: none
}
.mobile-slider::-webkit-scrollbar {
  -webkit-appearance: none;
  appearance: none;
  display: none;
  height: 0;
  width: 0
}
.mobile-slider-item {
  scroll-snap-align: start
}
@media (hover:hover) {
  .link:hover .char {
    --tw-translate-y: 100%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
  }
}
.link .word {
  overflow: hidden
}
.link .word .char {
  position: relative;
  transition-delay: calc(var(--delay)*var(--char-index));
  transition-duration: .4s;
  transition-property: transform;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  transition-timing-function: cubic-bezier(0, 0, .2, 1)
}
.link .word .char:before {
  content: attr(data-char);
  left: 0;
  position: absolute;
  top: -100%
}
.service-link .char {
  line-height: 145%
}
.content-link {
  --delay: 0.008s;
  border-bottom-width: 1px;
  border-color: var(--color-secondary);
  padding-bottom: .3rem
}
.works-archives-clip.clip {
  -webkit-clip-path: url(#archiveMask);
  clip-path: url(#archiveMask)
}
.works-archives-clip.mask {
  -webkit-mask: url(../images/mask-logo.404700.svg);
  mask: url(../images/mask-logo.404700.svg);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%
}
.card-work-clip.clip {
  -webkit-clip-path: url(#logoClip);
  clip-path: url(#logoClip)
}
.card-work-clip.mask {
  -webkit-mask: url(../images/mask-logo.404700.svg);
  mask: url(../images/mask-logo.404700.svg);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%
}
.next-clip.clip {
  -webkit-clip-path: url(#logoClip);
  clip-path: url(#logoClip)
}
.next-clip.mask {
  -webkit-mask: url(../images/mask-logo.404700.svg);
  mask: url(../images/mask-logo.404700.svg);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%
}
.heading-78 {
  font-size: 7.8rem
}
.heading-54 {
  font-size: 5.4rem
}
.heading-48 {
  font-size: 4.8rem
}
.heading-42 {
  font-size: 4.2rem
}
.heading-40 {
  font-size: 4.0rem
}
.heading-32, .heading-48 {
  line-height: 1;
  text-transform: uppercase
}
.heading-32 {
  font-size: 3.2rem
}
.heading-30 {
  font-size: 3.0rem
}
.heading-28 {
  font-size: 2.8rem
}
.heading-26 {
  font-size: 2.6rem
}
.heading-24 {
  font-size: 2.4rem
}
.heading-20, .heading-24 {
  line-height: 1;
  text-transform: uppercase
}
.heading-22 {
  font-size: 2.2rem
}
.heading-20 {
  font-size: 2rem
}
.body-20 {
  font-size: 2.0rem;
  line-height: 160%
}
.body-18 {
  font-size: 1.8rem;
  line-height: 150%
}
.body-16 {
  font-size: 1.6rem;
  line-height: 150%
}
.body-14 {
  font-size: 1.4rem;
  line-height: 150%
}
.body-13 {
  font-size: 1.3rem;
  line-height: 133%
}
.body-12 {
  font-size: 1.2rem;
  line-height: 133%
}
.body-10 {
  font-size: 1rem;
  line-height: 1.5
}
.body-08 {
  font-size: 0.9rem;
  line-height: 1.5
}
.grid-w {
  -moz-column-gap: 1rem;
  column-gap: 1rem;
  display: grid;
  grid-template-columns: repeat(24, minmax(0, 1fr));
  padding-left: var(--padding-container);
  padding-right: var(--padding-container)
}
.absolute-full {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%
}
.absolute-center {
  --tw-translate-x: -50%;
  --tw-translate-y: -50%;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.text-stroke {
  -webkit-text-stroke: 1px var(--color-secondary);
  color: #0000
}
.translate-cursor {
  --tw-translate-x: var(--cursor-x);
  --tw-translate-y: var(--cursor-y);
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
#tarteaucitronRoot {
  --bg-color: #fff;
  --text-color: #000;
  --hover-color: var(--color-black);
  --font: var(--font-body);
  --font-size: 1.2rem;
  --letter-spacing: 1px;
  --border: 1px solid #000;
  --text-transform: initial;
  --alert-width: calc(100vw - var(--padding-container)*4);
  --alert-height: auto;
  --alert-padding: 2rem;
  --panel-title-size: 2rem;
  --panel-border: 1px solid var(--color-black);
  --button-text-transform: uppercase;
  z-index: 21
}
@media (min-width:768px) {
  #tarteaucitronRoot {
    --alert-width: 35rem
  }
}
body.isMobile #tarteaucitronRoot {
  overflow: hidden
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk {
  float: left !important;
  margin: 0 !important
}
#tarteaucitronRoot #tarteaucitronAllAllowed {
  margin-left: 0 !important
}
#tarteaucitronRoot #tarteaucitronAlertBig {
  align-items: center;
  background-color: var(--bg-color) !important;
  border: var(--border) !important;
  bottom: calc(var(--padding-container)*2) !important;
  box-sizing: border-box !important;
  flex-wrap: wrap;
  left: calc(var(--padding-container)*2) !important;
  min-height: var(--alert-height) !important;
  opacity: 0;
  padding: var(--alert-padding) !important;
  text-align: left !important;
  transition: none !important;
  width: var(--alert-width) !important;
  z-index: 9 !important
}
#tarteaucitronRoot #tarteaucitronDisclaimerAlert {
  color: var(--text-color) !important;
  font-family: var(--font) !important;
  font-size: var(--font-size) !important;
  letter-spacing: var(--letter-spacing) !important;
  line-height: 1.3 !important;
  margin-bottom: 20px;
  order: 1;
  padding: 0 !important;
  text-transform: var(--text-transform);
  width: 100%
}
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPersonalize2 {
  background-color: #000 !important;
  border: 1px solid #000;
  color: #fff !important;
  font-family: var(--font) !important;
  font-size: 1.1rem !important;
  letter-spacing: var(--letter-spacing) !important;
  line-height: 1.3 !important;
  margin-left: 0 !important;
  order: 2;
  padding: 14px 20px 12px !important;
  text-transform: var(--button-text-transform);
  transition: background-color .3s var(--ease-out), color .3s var(--ease-out)
}
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPersonalize2 span {
  display: none
}
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPersonalize2:hover {
  background-color: #fff !important;
  color: var(--hover-color) !important
}
#tarteaucitronRoot button#tarteaucitronCloseAlert {
  background-color: #bdbbbb;
  border: 1px solid #bdbbbb;
  color: #000;
  font-family: var(--font) !important;
  font-size: 1.1rem !important;
  letter-spacing: var(--letter-spacing) !important;
  line-height: 1.3 !important;
  margin-bottom: 0;
  margin-left: 10px !important;
  order: 3;
  padding: 14px 20px 12px !important;
  position: relative;
  text-transform: var(--button-text-transform);
  transition: background-color .3s var(--ease-out), color .3s var(--ease-out)
}
#tarteaucitronRoot button#tarteaucitronCloseAlert:hover {
  background-color: #fff
}
#tarteaucitronRoot div#tarteaucitron {
  background-color: var(--bg-color);
  height: calc(100vh - var(--padding-container)*2) !important;
  left: var(--padding-container) !important;
  margin: 0 !important;
  opacity: 1;
  outline: none;
  overflow: hidden;
  position: relative;
  top: var(--padding-container) !important;
  width: calc(100vw - var(--padding-container)*2) !important
}
@media (min-width:1200px) and (hover:hover) {
  #tarteaucitronRoot div#tarteaucitron {
    height: 80vh !important;
    left: 0 !important;
    margin: 0 auto !important;
    top: 10vh !important;
    width: 50vw !important
  }
}
@media (min-width:1600px) {
  #tarteaucitronRoot div#tarteaucitron {
    height: 70vh !important;
    top: 15vh !important;
    width: 40vw !important
  }
}
#tarteaucitronRoot div#tarteaucitron > button {
  align-items: flex-end;
  display: flex;
  height: 45px;
  justify-content: flex-end
}
#tarteaucitronRoot div#tarteaucitron > div {
  box-sizing: border-box !important;
  height: calc(100% - 45px) !important;
  overflow-y: auto;
  width: 100% !important
}
#tarteaucitronRoot button#tarteaucitronBack {
  background-color: #000000f2 !important
}
#tarteaucitronRoot #tarteaucitronClosePanel {
  background-color: initial !important;
  box-sizing: border-box !important;
  color: var(--text-color) !important;
  font-family: var(--font) !important;
  font-size: var(--size-14) !important;
  height: auto !important;
  outline: none !important;
  padding: 20px 20px 0 0 !important;
  position: relative !important;
  text-align: right !important;
  text-transform: uppercase !important;
  width: 100% !important;
  z-index: 1
}
#tarteaucitronRoot #tarteaucitronServices {
  background: #0000 !important;
  box-shadow: none !important;
  margin-top: 0 !important;
  padding: var(--padding-container) !important
}
@media (min-width:768px) {
  #tarteaucitronRoot #tarteaucitronServices {
    padding: 40px !important
  }
}
#tarteaucitronRoot #tarteaucitronServices * {
  font-family: var(--font) !important;
  letter-spacing: var(--letter-spacing)
}
#tarteaucitronRoot #tarteaucitronMainLineOffset {
  background-color: initial !important;
  border: unset !important
}
#tarteaucitronRoot #tarteaucitronMainLineOffset #tarteaucitronInfo {
  background: #0000 !important;
  border: unset !important;
  color: var(--text-color) !important;
  margin: 0 0 16px !important;
  max-width: 100% !important;
  padding: 16px 0 !important;
  text-align: left !important
}
#tarteaucitronRoot .tarteaucitronH1 {
  color: var(--text-color) !important;
  font-size: var(--panel-title-size) !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  text-align: left !important;
  text-transform: uppercase !important
}
#tarteaucitronRoot .tarteaucitronName {
  margin: 0 !important;
  width: auto !important
}
#tarteaucitronRoot .tarteaucitronName .tarteaucitronH2 {
  background-color: initial !important;
  color: var(--text-color) !important;
  font-size: var(--text-36) !important;
  line-height: 100% !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  text-transform: uppercase !important
}
#tarteaucitronRoot .tarteaucitronName .tarteaucitronH3 {
  color: var(--text-color) !important;
  font-size: var(--size-14) !important;
  margin-top: 0 !important
}
#tarteaucitronRoot .tarteaucitronBorder {
  background-color: initial !important;
  border: unset !important
}
body.isMobile #tarteaucitronRoot .tarteaucitronBorder {
  padding-bottom: 50px
}
#tarteaucitronRoot #tarteaucitronServices_mandatory, #tarteaucitronRoot .tarteaucitronHidden {
  background-color: initial !important;
  border-bottom: var(--panel-border) !important;
  padding: 16px 0 !important
}
#tarteaucitronRoot #tarteaucitronServices_mandatory br, #tarteaucitronRoot .tarteaucitronHidden br {
  display: none !important
}
#tarteaucitronRoot #tarteaucitronServices_mandatory li, #tarteaucitronRoot .tarteaucitronHidden li {
  padding-bottom: 0 !important;
  padding-top: 0 !important
}
#tarteaucitronRoot .tarteaucitronLine {
  background-color: initial !important;
  padding-left: 0 !important
}
#tarteaucitronRoot .tarteaucitronListCookies {
  color: var(--text-color) !important;
  font-size: var(--size-14) !important;
  line-height: 1.3 !important
}
#tarteaucitronRoot .tarteaucitronListCookies:empty {
  display: none
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronTitle button {
  background-color: initial !important;
  color: var(--text-color) !important;
  font-size: var(--panel-title-size) !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-transform: uppercase !important
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronTitle button span {
  display: none
}
#tarteaucitronRoot .tarteaucitronInfoBox {
  background-color: initial !important;
  color: var(--text-color) !important;
  display: block !important;
  font-size: var(--size-14) !important;
  margin-bottom: 16px !important;
  margin-top: 16px !important;
  max-width: 100% !important;
  padding: 0 !important;
  position: relative !important
}
#tarteaucitronRoot .tacCurrentStatus, #tarteaucitronRoot .tarteaucitronReadmoreSeparator {
  display: none !important
}
#tarteaucitronRoot #tarteaucitronServicesTitle_mandatory {
  border-top: var(--panel-border);
  padding-top: 16px !important
}
#tarteaucitronRoot #tarteaucitronServicesTitle_mandatory .tarteaucitronAsk {
  display: none !important
}
#tarteaucitronRoot .tarteaucitronAsk {
  margin-top: 0 !important
}
#tarteaucitronRoot .tarteaucitronAsk button {
  border-radius: 0 !important;
  font-size: var(--text-12) !important;
  padding: 14px 20px 12px !important;
  text-transform: uppercase !important;
  transition: background-color .3s var(--ease-out), opacity .3s var(--ease-out)
}
#tarteaucitronRoot .tarteaucitronAsk button span {
  display: none !important
}
#tarteaucitronRoot .tarteaucitronAsk button:hover {
  background: #000 !important;
  opacity: 1 !important
}
.image .lazy.loaded {
  opacity: 1;
  transition-duration: .3s;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.image-ratio {
  height: 0;
  padding-top: calc(var(--ratio)*100%);
  position: relative
}
.image-ratio figure {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%
}
.image-wrapper {
  position: relative
}
.image-wrapper > div {
  height: 0;
  width: 100%
}
.image-wrapper .image {
  left: 0;
  position: absolute;
  top: 0
}
.frm_forms .frm__65e74af5aab45 {
  display: none
}
.frm_forms .frm_fields_container {
  gap: 1rem
}
.frm_forms .frm_error_style {
  margin-bottom: .5rem
}
.frm_forms .frm_error {
  --tw-text-opacity: 1;
  color: rgb(239 68 68/var(--tw-text-opacity));
  margin-top: .5rem
}
.frm_forms .frm_form_field label {
  display: none !important
}
.frm_forms .frm_form_field input, .frm_forms .frm_form_field textarea {
  -webkit-appearance: none;
  appearance: none;
  background-color: initial;
  border-color: #00000026;
  border-radius: 0;
  border-width: 1px;
  color: var(--color-secondary);
  outline: 2px solid #0000;
  outline-offset: 2px;
  padding-bottom: 1rem;
  padding-left: var(--padding-container);
  padding-right: var(--padding-container);
  padding-top: 1.4rem;
  resize: none;
  width: 100%
}
.frm_forms .frm_form_field input::placeholder, .frm_forms .frm_form_field textarea::placeholder {
  color: var(--color-secondary);
  text-transform: uppercase
}
.frm_forms .frm_form_field input:focus, .frm_forms .frm_form_field textarea:focus {
  border-color: var(--color-secondary)
}
.frm_forms .frm_form_field textarea {
  height: 20rem
}
.frm_forms .frm_submit button {
  border-color: var(--color-secondary);
  border-width: 1px;
  color: var(--color-secondary);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  padding-bottom: 1.4rem;
  padding-top: 1.6rem;
  text-align: center;
  text-transform: uppercase;
  width: 100%
}
@media (min-width:1200px) and (hover:hover) {
  .frm_forms .frm_submit button:hover {
    background-color: var(--color-secondary);
    color: var(--color-primary)
  }
}
body.dark .frm_forms .frm_form_fields input, body.dark .frm_forms .frm_form_fields textarea {
  border-color: #ffffff26
}
body.dark .frm_forms .frm_form_fields input:focus, body.dark .frm_forms .frm_form_fields textarea:focus {
  border-color: var(--color-secondary)
}
.newsletter .email + .mce_inline_error {
  color: var(--color-secondary);
  margin-top: .5rem
}
#mc_embed_signup div.mce_inline_error {
  background-color: initial !important;
  color: var(--color-secondary) !important;
  font-weight: 400 !important;
  margin: .5rem 0 0 !important;
  padding: 0 !important
}
#mc_embed_signup input.mce_inline_error {
  border-color: rgba(var(--color-secondary-rgb)/.15) !important
}
#mc_embed_signup input.mce_inline_error:focus {
  --tw-border-opacity: 1 !important;
  border-color: rgba(var(--color-secondary-rgb)/var(--tw-border-opacity)) !important
}
.two-columns-content h2 {
  font-size: 2rem;
  line-height: 1;
  line-height: 2.6rem;
  text-transform: uppercase
}
.two-columns-content h3 {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase
}
.two-columns-content * + p {
  margin-top: 1rem
}

.content-page h2 {
  line-height: 1;
  line-height: 2.6rem
}
.content-page h2, .content-page h3 {
  font-size: 2rem;
  text-transform: uppercase
}
.content-page h3 {
  font-weight: 700;
  line-height: 1
}
.content-page p {
  margin-bottom: 1rem;
  margin-top: 1rem
}
.content-page p:last-child {
  margin-bottom: 0
}
.content-page a {
  position: relative
}
.content-page a:before {
  --tw-scale-x: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: right;
  transition-delay: 0s;
  transition-duration: .3s;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  transition-timing-function: cubic-bezier(0, 0, .2, 1)
}
.content-page a:after, .content-page a:before {
  background-color: var(--color-secondary);
  bottom: 0;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  transition-property: background-color, transform;
  width: 100%
}
.content-page a:after {
  --tw-scale-x: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transform-origin: left;
  transition-delay: .1s;
  transition-duration: .3s;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  transition-timing-function: cubic-bezier(0, 0, .2, 1)
}
@media (hover:hover) {
  .content-page a:hover:before {
    --tw-scale-x: 1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform-origin: left;
    transition-delay: .1s
  }
  .content-page a:hover:after {
    --tw-scale-x: 0;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform-origin: right;
    transition-delay: 0s
  }
}
.works-archives {
  -webkit-text-stroke: 1px var(--color-secondary)
}
html {
  font-size: calc((100vw/var(--size))*10);
  line-height: 1.3
}
html.html {
  margin-top: 0 !important
}
body:not(.wp-admin) {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-tap-highlight-color: transparent;
  background-color: var(--color-primary);
  font-family: MaisonNeue, sans-serif;
  font-size: 1.2rem;
  line-height: 133%;
  margin: 0;
  overflow-x: hidden;
  padding: 0
}
body:not(.wp-admin).no-scroll {
  overflow: hidden;
  overscroll-behavior: contain;
  touch-action: none
}
body:not(.wp-admin).is-loading {
  cursor: wait !important
}
body:not(.wp-admin).dark, body:not(.wp-admin).dark-force {
  --color-primary: var(--color-black);
  --color-secondary: var(--color-white);
  --color-primary-rgb: 0 0 0;
  --color-secondary-rgb: 255 255 255
}
body:not(.wp-admin) ::selection {
  background-color: var(--color-secondary);
  color: var(--color-primary)
}
body:not(.wp-admin).dark-home .fade {
  background-color: var(--color-white)
}
html.lenis {
  height: auto
}
@media (min-width:1024px) {
  .lenis ::-webkit-scrollbar {
    width: 5px
  }
}
.lenis ::-webkit-scrollbar-track {
  background-color: #fff;
  border-left: 1px solid #000
}
.lenis ::-webkit-scrollbar-thumb {
  background-color: #000;
  border: 1px solid #000
}
.lenis.dark ::-webkit-scrollbar-track {
  background-color: #000;
  border-left: 1px solid #fff
}
.lenis.dark ::-webkit-scrollbar-thumb {
  background-color: #fff;
  border: 1px solid #fff
}
.lenis.lenis-smooth {
  scroll-behavior: auto !important
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain
}
#gl {
  height: 100%;
  left: 0;
  pointer-events: none;
  position: fixed;
  top: 0;
  width: 100%
}
.header-bg.transparent, .header.transparent {
  background-color: initial;
  position: fixed
}
.header-bg.transparent .header-menu, .header.transparent .header-menu {
  background-color: initial
}
.header-bg.transparent.a .header-menu, .header.transparent.a .header-menu {
  background-color: var(--color-primary)
}
.svg-wrapper svg {
  height: 100%;
  width: 100%
}
.iframe-wrapper iframe {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%
}
.iframe-auto iframe {
  height: auto;
  width: 100%
}
.no-scrollbar {
  -ms-overflow-style: -ms-autohiding-scrollbar;
  scrollbar-width: none
}
.no-scrollbar::-webkit-scrollbar {
  -webkit-appearance: none;
  appearance: none;
  display: none;
  height: 0;
  width: 0
}
.fullwidth-media-image img {
  max-height: 100vh
}
.slider {
  overflow-x: auto;
  scroll-padding: .9rem
}
@media (min-width:768px) {
  .slider {
    scroll-padding: 1.9rem
  }
}
@media (min-width:1200px) and (hover:hover) {
  .slider {
    overflow-x: visible
  }
}
.slider {
  --tw-scroll-snap-strictness: mandatory;
  scroll-snap-type: x var(--tw-scroll-snap-strictness);
  scrollbar-width: none
}
.slider.a {
  cursor: grabbing !important
}
.slider-item {
  scroll-snap-align: start
}
.wysiwyg h2 {
  font-size: 2rem;
  line-height: 1;
  line-height: 2.6rem
}
.wysiwyg h2, .wysiwyg h3 {
  text-transform: uppercase
}
.wysiwyg h3 {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1
}
.wysiwyg * + div, .wysiwyg * + h3, .wysiwyg * + h4, .wysiwyg * + p {
  margin-top: 1rem
}
.wysiwyg * + h2 {
  margin-top: 3rem
}
.wysiwyg * + div:has(h2:first-child) {
  margin-top: 3rem
}
.wysiwyg * + div:has(h3:first-child), .wysiwyg * + div:has(h4:first-child) {
  margin-top: 1rem
}
.wysiwyg p > span {
  color: var(--color-secondary) !important
}
.wysiwyg ul {
  margin-top: 2rem
}
.wysiwyg ul li {
  border-bottom-width: 1px;
  border-color: rgba(var(--color-secondary-rgb)/.15);
  padding: 1rem .3rem
}
.wysiwyg ul li:first-child {
  border-top-width: 1px
}
.wysiwyg ul:not(:last-child) {
  margin-bottom: 2rem
}
a > span, p > span {
  -webkit-text-decoration: none !important;
  text-decoration: none !important
}
.image-contain .image figure img {
  --tw-translate-x: -50%;
  --tw-translate-y: -50%;
  border-color: var(--color-secondary);
  border-width: 1px;
  left: 50%;
  object-fit: contain;
  position: absolute;
  top: 50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
@media (min-width:1024px) {
  .anchor.a {
    background-color: var(--color-secondary);
    color: var(--color-primary)
  }
}
@media (hover:hover) {
  .anchor:hover {
    background-color: var(--color-secondary);
    color: var(--color-primary)
  }
}
.blocks section:last-child {
  border-bottom-width: 0
}
.word {
  display: inline-flex
}
.char {
  display: inline-block
}
.scale-x-0 {
  transform: scaleX(0)
}
.scale-x-100 {
  transform: scaleX(1)
}
.single-work-blocks > section:last-child {
  border-bottom-width: 0
}
.single-work-blocks:has(.two-columns-content:first-child) {
  border-top-width: 0
}
.single-work-blocks .two-columns-content:first-child {
  margin-top: 0;
  padding-top: 2rem
}
@media (min-width:768px) {
  .md\:heading-42 {
    font-size: 4.2rem
  }
  .md\:heading-32, .md\:heading-42 {
    line-height: 1;
    text-transform: uppercase
  }
  .md\:heading-32 {
    font-size: 3.2rem
  }
  .md\:heading-24 {
    font-size: 2.4rem
  }
  .md\:heading-20, .md\:heading-24 {
    line-height: 1;
    text-transform: uppercase
  }
  .md\:heading-20 {
    font-size: 2rem
  }
  .md\:body-12 {
    font-size: 1.2rem;
    line-height: 133%
  }
}
@media (min-width:1024px) {
  .lg\:heading-42 {
    font-size: 4.2rem
  }
  .lg\:heading-40, .lg\:heading-42 {
    line-height: 1;
    text-transform: uppercase
  }
  .lg\:heading-40 {
    font-size: 4rem
  }
  .lg\:heading-24 {
    font-size: 2.4rem;
    line-height: 1;
    text-transform: uppercase
  }
  .lg\:body-14 {
    font-size: 1.4rem;
    line-height: 150%
  }
}
@media (min-width:1200px) and (hover:hover) {
  .xl\:heading-48 {
    font-size: 4.8rem;
    line-height: 1;
    text-transform: uppercase
  }
  .xl\:body-10 {
    font-size: 1rem;
    line-height: 1.5
  }
  .xl\:grid-w {
    -moz-column-gap: 1rem;
    column-gap: 1rem;
    display: grid;
    grid-template-columns: repeat(24, minmax(0, 1fr));
    padding-left: var(--padding-container);
    padding-right: var(--padding-container)
  }
  .xl\:absolute-full {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
  }
}
.placeholder\:text-secondary::placeholder {
  color: var(--color-secondary)
}
.last\:pr-container:last-child {
  padding-right: var(--padding-container)
}
.hover\:opacity-100:hover {
  opacity: 1
}
.focus\:border-secondary:focus {
  border-color: var(--color-secondary)
}
.group:first-child .group-first\:border-t-px {
  border-top-width: 1px
}
.group.a .group-\[\.a\]\:opacity-0 {
  opacity: 0
}
.group.a .group-\[\.a\]\:opacity-100 {
  opacity: 1
}
@media (min-width:768px) {
  .md\:absolute {
    position: absolute
  }
  .md\:sticky {
    position: sticky
  }
  .md\:left-1\/2 {
    left: 50%
  }
  .md\:top-sticky {
    top: var(--spacing-sticky)
  }
  .md\:order-2 {
    order: 2
  }
  .md\:order-first {
    order: -9999
  }
  .md\:order-last {
    order: 9999
  }
  .md\:col-span-10 {
    grid-column: span 10/span 10
  }
  .md\:col-span-12 {
    grid-column: span 12/span 12
  }
  .md\:col-span-16 {
    grid-column: span 16/span 16
  }
  .md\:col-span-6 {
    grid-column: span 6/span 6
}
  .md\:col-span-4 {
    grid-column: span 4/span 4
  }
  .md\:col-span-8 {
    grid-column: span 8/span 8
  }
  .md\:col-start-1 {
    grid-column-start: 1
  }
    .md\:col-start-4 {
    grid-column-start: 4
  }
.md\:col-start-6 {
    grid-column-start: 6
  }
 .md\:col-start-7 {
    grid-column-start: 7
  }
     .md\:col-start-9 {
    grid-column-start: 9
  }
   .md\:col-start-10 {
    grid-column-start: 10
  }
     .md\:col-start-13 {
    grid-column-start: 13
  }
    .md\:col-start-16 {
    grid-column-start: 16
  }
    .md\:col-start-19 {
    grid-column-start: 19
  }
    .md\:col-start-21 {
    grid-column-start: 21
  }
     .md\:col-start-15 {
    grid-column-start: 15
  }
     .md\:col-start-22 {
    grid-column-start: 22
  }
    
  .md\:col-end-9 {
    grid-column-end: 9
  }
    .md\:col-end-12 {
    grid-column-end: 12
  }
    .md\:col-end-15 {
    grid-column-end: 15
  }
    .md\:col-end-18 {
    grid-column-end: 18
  }
  .md\:col-end-21 {
    grid-column-end: 21
  }
  .md\:col-end-24 {
    grid-column-end: 24
  }
 
  .md\:-mt-0 {
    margin-top: 0
  }
  .md\:mb-0 {
    margin-bottom: 0
  }
  .md\:mb-120 {
    margin-bottom: 12rem
  }
  .md\:mb-15 {
    margin-bottom: 1.5rem
  }
  .md\:mb-\[0\.2rem\] {
    margin-bottom: .2rem
  }
  .md\:ml-0 {
    margin-left: 0
  }
  .md\:ml-\[0\.4rem\] {
    margin-left: .4rem
  }
  .md\:mt-0 {
    margin-top: 0
  }
  .md\:mt-100 {
    margin-top: 10rem
  }
  .md\:mt-120 {
    margin-top: 12rem
  }
    .md\:mt-14 {
    margin-top: .14rem
  }
  .md\:block {
    display: block
  }
  .md\:flex {
    display: flex
  }
  .md\:grid {
    display: grid
  }
  .md\:hidden {
    display: none
  }
  .md\:h-\[2rem\] {
    height: 2rem
  }
  .md\:h-\[35vh\] {
    height: 35vh
  }

  .md\:h-\[7vh\] {
    height: 7vh
  }
  .md\:h-\[6\.5rem\] {
    height: 6.5rem
  }
  .md\:h-\[7rem\] {
    height: 7rem
  }
  .md\:h-\[8rem\] {
    height: 8rem
  }
  .md\:h-available {
    height: var(--h-available)
  }
  .md\:h-full {
    height: 100%
  }
  .md\:min-h-available {
    min-height: var(--h-available)
  }
  .md\:w-\[1\.5rem\] {
    width: 1.5rem
  }
  .md\:w-\[42\%\] {
    width: 42%
  }
  .md\:w-\[60\%\] {
    width: 60%
  }
  .md\:w-\[7rem\] {
    width: 7rem
  }
  .md\:w-\[85\%\] {
    width: 85%
  }
  .md\:-translate-x-1\/2 {
    --tw-translate-x: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
  }
  .md\:grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr))
  }
  .md\:grid-cols-24 {
    grid-template-columns: repeat(24, minmax(0, 1fr))
  }
  .md\:flex-row {
    flex-direction: row
  }
  .md\:flex-col {
    flex-direction: column
  }
  .md\:items-end {
    align-items: flex-end
  }
  .md\:items-baseline {
    align-items: baseline
  }
  .md\:justify-end {
    justify-content: flex-end
  }
  .md\:gap-x-grid {
    -moz-column-gap: 1rem;
    column-gap: 1rem
  }
  .md\:border-b-0, .md\:border-b-\[0\] {
    border-bottom-width: 0
  }
  .md\:border-none {
    border-style: none
  }
  .md\:px-0 {
    padding-left: 0;
    padding-right: 0
  }
  .md\:px-20 {
    padding-left: 2rem;
    padding-right: 2rem
  }
  .md\:px-\[1\.7rem\] {
    padding-left: 1.7rem;
    padding-right: 1.7rem
  }
  .md\:py-0 {
    padding-bottom: 0;
    padding-top: 0
  }
  .md\:py-10 {
    padding-bottom: 1rem;
    padding-top: 1rem
  }
  .md\:py-container {
    padding-bottom: var(--padding-container);
    padding-top: var(--padding-container)
  }
  .md\:pb-10 {
    padding-bottom: 1rem
  }
  .md\:pb-15 {
    padding-bottom: 1.5rem
  }
  .md\:pb-20 {
    padding-bottom: 2rem
  }
  .md\:pb-6 {
    padding-bottom: .6rem
  }
  .md\:pb-8 {
    padding-bottom: .8rem
  }
  .md\:pb-\[0\.2rem\] {
    padding-bottom: .2rem
  }
  .md\:pb-\[0\.6rem\] {
    padding-bottom: .6rem
  }
  .md\:pb-\[0\.7rem\] {
    padding-bottom: .7rem
  }
  .md\:pb-\[1\.5rem\] {
    padding-bottom: 1.5rem
  }
  .md\:pb-\[1\.6rem\] {
    padding-bottom: 1.6rem
  }
  .md\:pb-\[1rem\] {
    padding-bottom: 1rem
  }
  .md\:pr-0 {
    padding-right: 0
  }
  .md\:pr-16 {
    padding-right: 1.6rem
  }
  .md\:pt-0 {
    padding-top: 0
  }
  .md\:pt-20 {
    padding-top: 2rem
  }
  .md\:pt-\[0\.4rem\] {
    padding-top: .4rem
  }
  .md\:pt-\[0\.8rem\] {
    padding-top: .8rem
  }
  .md\:pt-\[150\%\] {
    padding-top: 150%
  }
  .md\:pt-\[2\.2rem\] {
    padding-top: 2.2rem
  }
  .md\:pt-\[56\.25\%\] {
    padding-top: 56.25%
  }
  .md\:pt-\[6rem\] {
    padding-top: 6rem
  }
  .md\:pt-container {
    padding-top: var(--padding-container)
  }
  .md\:text-center {
    text-align: center
  }
}
@media (min-width:1024px) {
  .lg\:sticky {
    position: sticky
  }
  .lg\:left-\[1\.6rem\] {
    left: 1.6rem
  }
    .lg\:left-\[2\.0rem\] {
    left: 2rem
  }
  .lg\:top-sticky {
    top: var(--spacing-sticky)
  }
  .lg\:order-2 {
    order: 2
  }
  .lg\:order-first {
    order: -9999
  }
  .lg\:col-span-12 {
    grid-column: span 12/span 12
  }
  .lg\:col-span-16 {
    grid-column: span 16/span 16
  }
  .lg\:col-span-6 {
    grid-column: span 6/span 6
  }
  .lg\:col-span-7 {
    grid-column: span 7/span 7
  }
  .lg\:col-span-8 {
    grid-column: span 8/span 8
  }
  .lg\:col-start-1 {
    grid-column-start: 1
  }
    .lg\:col-start-7 {
    grid-column-start: 7
  }
    .lg\:col-start-8 {
    grid-column-start: 8
  }
    .lg\:col-start-9 {
    grid-column-start: 9
  }
  .lg\:col-start-13 {
    grid-column-start: 13
  }
  .lg\:col-start-15 {
    grid-column-start: 15
  }
     .lg\:col-start-19 {
    grid-column-start: 19
  }
  .lg\:col-start-23 {
    grid-column-start: 23
  }
  .lg\:col-start-7 {
    grid-column-start: 7
  }
  .lg\:col-start-9 {
    grid-column-start: 9
  }
  .lg\:col-end-13 {
    grid-column-end: 13
  }
  .lg\:col-end-10 {
    grid-column-end: 10
  }
  .lg\:col-end-16 {
    grid-column-end: 16
  }
 .lg\:col-end-18 {
    grid-column-end: 18
  }
     .lg\:col-end-21 {
    grid-column-end: 21
  }
  .lg\:col-end-23 {
    grid-column-end: 23
  }
  .lg\:col-end-25 {
    grid-column-end: 25
  }
  .lg\:col-end-7 {
    grid-column-end: 7
  }
  .lg\:-mt-\[var\(--h-available\)\] {
    margin-top: calc(var(--h-available)*-1)
  }
  .lg\:mb-0 {
    margin-bottom: 0
  }
  .lg\:mb-30 {
    margin-bottom: 3rem
  }
  .lg\:mt-0 {
    margin-top: 0
  }
  .lg\:block {
    display: block
  }
  .lg\:flex {
    display: flex
  }
  .lg\:h-\[22vh\] {
    height: 22vh
  }
  .lg\:h-\[9rem\] {
    height: 9rem
  }
  .lg\:h-auto {
    height: auto
  }
  .lg\:h-available {
    height: var(--h-available)
  }
  .lg\:max-h-\[initial\] {
    max-height: none
  }
  .lg\:min-h-available {
    min-height: var(--h-available)
  }
  .lg\:w-\[35\%\] {
    width: 35%
  }
  .lg\:w-\[40\%\] {
    width: 40%
  }
  .lg\:w-\[75\%\] {
    width: 75%
  }
  .lg\:flex-1 {
    flex: 1 1 0%
  }
  .lg\:grid-cols-16 {
    grid-template-columns: repeat(16, minmax(0, 1fr))
  }
  .lg\:flex-row {
    flex-direction: row
  }
  .lg\:flex-col {
    flex-direction: column
  }
  .lg\:items-center {
    align-items: center
  }
  .lg\:justify-center {
    justify-content: center
  }
  .lg\:overflow-y-scroll {
    overflow-y: scroll
  }
  .lg\:border-b-0 {
    border-bottom-width: 0
  }
  .lg\:border-b-px {
    border-bottom-width: 1px
  }
  .lg\:border-none {
    border-style: none
  }
  .lg\:p-0 {
    padding: 0
  }
  .lg\:px-0 {
    padding-left: 0;
    padding-right: 0
  }
  .lg\:px-10 {
    padding-left: 1rem;
    padding-right: 1rem
  }
  .lg\:px-20 {
    padding-left: 2rem;
    padding-right: 2rem
  }
  .lg\:py-10 {
    padding-bottom: 1rem;
    padding-top: 1rem
  }
  .lg\:py-15 {
    padding-bottom: 1.5rem;
    padding-top: 1.5rem
  }
  .lg\:pb-0 {
    padding-bottom: 0
  }
  .lg\:pb-\[1\.5rem\] {
    padding-bottom: 1.5rem
  }
  .lg\:pb-\[1\.6rem\] {
    padding-bottom: 1.6rem
  }
  .lg\:pl-20 {
    padding-left: 2rem
  }
  .lg\:pr-\[4\.2rem\] {
    padding-right: 4.2rem
  }
  .lg\:pt-0 {
    padding-top: 0
  }
  .lg\:pt-\[63\.5\%\] {
    padding-top: 63.5%
  }
  .lg\:text-\[8\.4rem\] {
    font-size: 8.4rem
  }
}
@media (min-width:1200px) and (hover:hover) {
  .xl\:absolute {
    position: absolute
  }
  .xl\:relative {
    position: relative
  }
  .xl\:sticky {
    position: sticky
  }
  .xl\:-right-\[2rem\] {
    right: -2rem
  }
  .xl\:-top-\[2\.1rem\] {
    top: -2.1rem
  }
  .xl\:bottom-\[2rem\] {
    bottom: 2rem
  }
  .xl\:bottom-\[calc\(3\.2rem\+1px\)\] {
    bottom: calc(3.2rem + 1px)
  }
  .xl\:left-0 {
    left: 0
  }
  .xl\:left-1\/2 {
    left: 50%
  }
  .xl\:left-\[20\.5\%\] {
    left: 20.5%
  }
  .xl\:left-\[8rem\] {
    left: 8rem
  }
  .xl\:top-0 {
    top: 0
  }
  .xl\:top-sticky {
    top: var(--spacing-sticky)
  }
  .xl\:order-1 {
    order: 1
  }
  .xl\:order-2 {
    order: 2
  }
  .xl\:order-last {
    order: 9999
  }
  .xl\:col-span-12 {
    grid-column: span 12/span 12
  }
  .xl\:col-span-18 {
    grid-column: span 18/span 18
  }
  .xl\:col-span-3 {
    grid-column: span 3/span 3
  }
  .xl\:col-span-6 {
    grid-column: span 6/span 6
  }
  .xl\:col-start-1 {
    grid-column-start: 1
  }
    .xl\:col-start-7 {
    grid-column-start: 7
  }
    .xl\:col-start-8 {
    grid-column-start: 8
  }
    .xl\:col-start-9 {
    grid-column-start: 9
  }
  .xl\:col-start-10 {
    grid-column-start: 10
  }
  .xl\:col-start-3 {
    grid-column-start: 3
  }
  .xl\:col-start-7 {
    grid-column-start: 7
  }
  .xl\:col-end-17 {
    grid-column-end: 17
  }
  .xl\:col-end-18 {
    grid-column-end: 18
  }
  .xl\:col-end-21 {
    grid-column-end: 21
  }
  .xl\:col-end-22 {
    grid-column-end: 22
  }
  .xl\:col-end-23 {
    grid-column-end: 23
  }
  .xl\:col-end-7 {
    grid-column-end: 7
  }
  .xl\:-ml-\[0\.5rem\] {
    margin-left: -.5rem
  }
  .xl\:-ml-\[1\.3rem\] {
    margin-left: -1.3rem
  }
  .xl\:-mt-\[2rem\] {
    margin-top: -2rem
  }
  .xl\:mr-0 {
    margin-right: 0
  }
  .xl\:mt-0 {
    margin-top: 0
  }
  .xl\:block {
    display: block
  }
  .xl\:flex {
    display: flex
  }
  .xl\:hidden {
    display: none
  }
  .xl\:h-\[39vh\] {
    height: 39vh
  }
  .xl\:h-\[calc\(var\(--h-available\)-1px\)\] {
    height: calc(var(--h-available) - 1px)
  }
  .xl\:h-auto {
    height: auto
  }
  .xl\:h-available {
    height: var(--h-available)
  }
  .xl\:h-full {
    height: 100%
  }
  .xl\:min-h-\[500px\] {
    min-height: 500px
  }
  .xl\:min-h-\[650px\] {
    min-height: 650px
  }
  .xl\:min-h-available {
    min-height: var(--h-available)
  }
  .xl\:w-\[17rem\] {
    width: 17rem
  }
  .xl\:w-\[43\%\] {
    width: 43%
  }
  .xl\:w-\[54\.3rem\] {
    width: 54.3rem
  }
  .xl\:w-\[70\%\] {
    width: 70%
  }
  .xl\:w-auto {
    width: auto
  }
  .xl\:w-full {
    width: 100%
  }
  .xl\:flex-1 {
    flex: 1 1 0%
  }
  .xl\:-translate-x-1\/2 {
    --tw-translate-x: -50%
  }
  .xl\:-translate-x-1\/2, .xl\:-translate-y-\[45\%\] {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
  }
  .xl\:-translate-y-\[45\%\] {
    --tw-translate-y: -45%
  }
  .xl\:translate-y-0 {
    --tw-translate-y: 0
  }
  .xl\:translate-y-0, .xl\:translate-y-full {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
  }
  .xl\:translate-y-full {
    --tw-translate-y: 100%
  }
  .xl\:grid-cols-18 {
    grid-template-columns: repeat(18, minmax(0, 1fr))
  }
  .xl\:flex-row {
    flex-direction: row
  }
  .xl\:flex-col {
    flex-direction: column
  }
  .xl\:items-end {
    align-items: flex-end
  }
  .xl\:gap-x-0 {
    -moz-column-gap: 0;
    column-gap: 0
  }
  .xl\:gap-y-\[0\.2rem\] {
    row-gap: .2rem
  }
  .xl\:whitespace-nowrap {
    white-space: nowrap
  }
  .xl\:border-0 {
    border-width: 0
  }
  .xl\:border-x-px {
    border-left-width: 1px;
    border-right-width: 1px
  }
  .xl\:border-b-px {
    border-bottom-width: 1px
  }
  .xl\:border-t-px {
    border-top-width: 1px
  }
  .xl\:border-none {
    border-style: none
  }
  .xl\:border-secondary {
    border-color: var(--color-secondary)
  }
  .xl\:bg-transparent {
    background-color: initial
  }
  .xl\:px-20 {
    padding-left: 2rem;
    padding-right: 2rem
  }
  .xl\:px-\[calc\(4rem\+1px\)\] {
    padding-left: calc(4rem + 1px);
    padding-right: calc(4rem + 1px)
  }
  .xl\:pb-10 {
    padding-bottom: 1rem
  }
  .xl\:pb-20 {
    padding-bottom: 2rem
  }
  .xl\:pb-\[1\.6rem\] {
    padding-bottom: 1.6rem
  }
  .xl\:pl-0 {
    padding-left: 0
  }
  .xl\:pr-\[11\.8rem\] {
    padding-right: 11.8rem
  }
  .xl\:pt-0 {
    padding-top: 0
  }
  .xl\:pt-10 {
    padding-top: 1rem
  }
  .xl\:text-\[31rem\] {
    font-size: 31rem
  }
  .xl\:transition-none {
    transition-property: none
  }
  .xl\:last\:pr-0:last-child {
    padding-right: 0
  }
  .xl\:hover\:bg-primary:hover {
    background-color: var(--color-primary)
  }
  .xl\:hover\:bg-secondary:hover {
    background-color: var(--color-secondary)
  }
  .xl\:hover\:text-primary:hover {
    color: var(--color-primary)
  }
  .xl\:hover\:text-secondary:hover {
    color: var(--color-secondary)
  }
  .group:hover .xl\:group-hover\:translate-y-0 {
    --tw-translate-y: 0
  }
  .group:hover .xl\:group-hover\:scale-105, .group:hover .xl\:group-hover\:translate-y-0 {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
  }
  .group:hover .xl\:group-hover\:scale-105 {
    --tw-scale-x: 1.05;
    --tw-scale-y: 1.05
  }
  .group:hover .xl\:group-hover\:scale-\[1\.03\] {
    --tw-scale-x: 1.03;
    --tw-scale-y: 1.03;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
  }
  .group:hover .xl\:group-hover\:border-primary-rgb\/15 {
    border-color: rgba(var(--color-primary-rgb)/.15)
  }
  .group:hover .xl\:group-hover\:text-primary {
    color: var(--color-primary)
  }
    
  .group:hover .xl\:group-hover\:opacity-0 {
    opacity: 0
  }
  .group:hover .xl\:group-hover\:opacity-100 {
    opacity: 1
 }
  .group:hover .group-hover\:text-primary\/55 {
  color: rgba(var(--color-primary-rgb), 0.55);
}
.group:hover .group-hover\:text-primary\/65 {
  color: rgba(var(--color-primary-rgb), 0.65);
}
.group:hover .group-hover\:text-primary\/60 {
  color: rgba(var(--color-primary-rgb), 0.60);
}
@media (min-width:1920px) {
  .hd\:pt-\[0\.1rem\] {
    padding-top: .1rem
  }
}
@media (min-width:1200px) and (max-height:700px) and (hover:hover) {
  .small-height\:bottom-20 {
    bottom: 2rem
  }
  .small-height\:top-\[initial\] {
    top: auto
  }
  .small-height\:h-0 {
    height: 0
  }
  .small-height\:h-auto {
    height: auto
  }
  .small-height\:items-end {
    align-items: flex-end
  }
  .small-height\:pt-\[56\.25\%\] {
    padding-top: 56.25%
  }
}
/* === hero === */
.hero-section {
    display: grid;
    grid-template-rows: 0.5fr 0.5fr 1fr;
    min-height: 100vh;
    max-height: 100vh;
    width: 100%;
    background-color: transparent;
    overflow-x: hidden;
    position: relative;
}

.hero-section .heading-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    grid-row: 2 / 3;
}

.hero-mask {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-rows: 1fr 1fr;
    z-index: 1;
    pointer-events: none;
}

.hero-mask-part {
    background-color: var(--white);
    transform-origin: bottom center;
}
.hero-heading {
    position: relative;
}

.hero-heading-mobile {
    visibility: hidden;
    display: none;
}

.hero-heading .heading-link {
    display: inline-block;
    position: relative;
    cursor: pointer;
    border-radius: 0.5rem;
}

.hero-heading span {
    position: relative;
}

.hero-heading .heading-link::after {
    content: "";
    position: absolute;
    width: calc(var(--animated-link-width) - 4px);
    opacity: var(--animated-link-opacity);
    height: .05em;
    bottom: .05em;
    left: 0;
    border: .05em solid var(--black);
    margin-left: 2px;
}
.heading-link {
    display: inline-block;
    position: relative;
    cursor: pointer;
    border-radius: 0.5rem;
    color: inherit; 
  text-decoration: underline;
  padding: 0.75rem 1rem;
  transition: all 0.3s ease-in-out;
}
.heading-link1 {
    display: inline-block;
    position: relative;
    cursor: pointer;
    border-radius: 0.5rem;
    color: inherit; 
  text-decoration: underline;
  padding: 0.75rem 1rem;
  transition: all 0.3s ease-in-out;
}
.heading-link2 {
    display: inline-block;
    position: relative;
    cursor: pointer;
    border-radius: 0.5rem;
    color: inherit; 
  text-decoration: underline;
  padding: 0.75rem 1rem;
  transition: all 0.3s ease-in-out;
}

.hero-heading span {
    position: relative;
}

.heading-link::after {
    content: "";
    position: absolute;
    width: calc(var(--animated-link-width) - 4px);
    opacity: var(--animated-link-opacity);
    height: .05em;
    bottom: .05em;
    left: 0;
    border: .05em solid var(--black);
  text-decoration: none;
  width: calc(var(--animated-link-width, 100%) - 4px);
  opacity: var(--animated-link-opacity, 1);
  margin-left: 2px;
}
.heading-link:hover {
  padding: 0.5rem 1.25rem;
  background-color: #0000ff;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  outline: 2px solid #0000ff;
   text-decoration: none;
    color: #fff;

}
.heading-link1:hover {
  padding: 0.5rem 1.25rem;
  background-color: #FCD617;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  outline: 2px solid #FCD617;
   text-decoration: none;
 color: #fff;
}
.heading-link2:hover {
  padding: 0.5rem 1.25rem;
  background-color: #9D17FC;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  outline: 2px solid #9D17FC;
   text-decoration: none;
 color: #fff;
}

.heading-link:hover::after {
  opacity: 0;
}
/* === slider === */
.icon {
  position: absolute;
  left: 40%;
  top: 15%;
  width: 85px;
  height: 42px;
}
.ellipseCanvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 42px;
  height: 42px;
  background: transparent;
}

.slider-auto {
  overflow: hidden;
  width: 100%;
}

.slider-track {
  display: flex;
  width: max-content;
  animation: scroll-left 30s linear infinite;
}

.normal-case {
    text-transform: none;
}

@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
/* === FIX SCROLL ANCHOR OFFSET === */
[id^="sec"] {
scroll-margin-top: 70px;

}

/* === spiral === */

.spiral-wrapper {
  width: 100vw;
  height: 100vh;
}

.spiral-svg text {
  font-weight: 500;
  font-size: 42px;
  letter-spacing: -0.06em;
    margin: 0;
    padding: 0;
    font-stretch: condensed; 
  filter:
    drop-shadow(0 0 4px #fff)
    drop-shadow(0 0 2px #0000ff);
  user-select: none;
  animation: subtleGlow 100s ease-in-out infinite alternate;
}

/* === siler up === */
@keyframes scroll-vertical {
  0%   { transform: translateY(50vh); }
  100% { transform: translateY(-100%); }
}


.animate-scroll-vertical {
  animation: scroll-vertical 35s ease-in-out infinite;
}

/* =========================
   loader
   ========================= */
loadzz {
  background: #fff;
  padding: 0;
  margin:0;
  min-height:100vh;
  display: flex;
  justify-content:center;
  align-items:center;
}
#outline {
  fill:none;
  stroke: #000;
  stroke-width: .1px;
}
#load {
  fill: #000;
  stroke-width: 0px;
  animation: loading 4.1s linear 1;
}
#load1 {
  fill: #000;
  stroke-width: 0px;
  animation: loading 2.9s linear 1;
}
#mask {
  fill: #fff;
  stroke-width: 0px;
}
@keyframes loading {
  from {
    y: -126px;
  }
  to {
    y: 151.5 px;
  }
}
/* 让 SVG 一开始在屏幕正中 */
/* 保证 SVG 尺寸不被外部样式改乱 */
#svg8 {
  position: fixed;           /* 相对视窗 */
  width: 942px;
  height: 163px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);  /* 居中 */
  pointer-events: none;      /* 不挡交互，可选 */
}

/* Loading 结束后：平滑滑到页面底部 */
body.loaded #svg8 {
  bottom: 0;  /* SVG 大小不变，只是贴到页面最下方 */
}

/* =========================
   rocket
   ========================= */

/* 确保父容器是定位上下文 */


/* =========================
   外层：位置 + 发射节奏
   ========================= */
.rocket-mover {
  --rocket-size: 30px;
  --start-x: 353px; /* 起点 X，可微调 */
  --start-y: 210px;  /* 起点 Y，可微调 */

  position: absolute;
  left: var(--start-x);
  top: var(--start-y);
  width: var(--rocket-size);
  height: var(--rocket-size);
  pointer-events: none;
  z-index: 30;

  animation: rocketFly 5.2s cubic-bezier(0.16, 1, 0.3, 1) infinite;
  will-change: left, top, opacity;
}

/* =========================
   内层：抖动 / 推进感
   ========================= */
.rocket-jitter {
  width: 100%;
  height: 100%;
  transform-origin: 50% 50%;
  animation: rocketShake 0.11s linear infinite;
  will-change: transform;
}

/* =========================
   发射路径关键帧
   ========================= */
@keyframes rocketFly {
  /* 0–10%：完全静止 */
  0% {
    opacity: 0;
    left: var(--start-x);
    top: var(--start-y);
  }

  10% {
    opacity: 1;
    left: var(--start-x);
    top: var(--start-y);
  }

  /* 10–22%：原地抖动蓄力 */
  22% {
    opacity: 1;
    left: var(--start-x);
    top: var(--start-y);
  }

  /* 22–72%：缓动发射到 box 右上角 */
  72% {
    opacity: 1;
    left: calc(100% - var(--rocket-size) - 12px);
    top: 12px;
  }

  /* 离场 */
  90% {
    opacity: 0;
    left: calc(100% - var(--rocket-size) - 12px);
    top: 12px;
  }

  /* 回到起点（不可见） */
  100% {
    opacity: 0;
    left: var(--start-x);
    top: var(--start-y);
  }
}

/* =========================
   抖动（发射感）
   ========================= */
@keyframes rocketShake {
  0%   { transform: translate(0,0) rotate(-25deg); }
  25%  { transform: translate(0.6px,-0.8px) rotate(-25deg); }
  50%  { transform: translate(-0.7px,0.6px) rotate(-25deg); }
  75%  { transform: translate(0.5px,-0.4px) rotate(-25deg); }
  100% { transform: translate(0,0) rotate(-25deg); }
}
/* =========================
   card
   ========================= */

.container1{
    width: 1000px;
    position: relative;
    display: flex;
    justify-content: space-between;
}

.container1 .card1{
    position: relative;
    cursor: pointer;
}

.container1 .card1 .face{
    width: 250px;
    height: 100px;
    transition: 0.5s;
}

.container1 .card1 .face.face1{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
    transform: translateY(0px);
}

.container1 .card1:hover .face.face1{
    transform: translateY(20px);
}

.container1 .card1 .face.face1 .content1{
    opacity: 0.2;
    transition: 0.5s;
}

.container1 .card1:hover .face.face1 .content1{
    opacity: 1;
}

.container1 .card1 .face.face1 .content1 img{
    max-width: 100px;
}

.container1 .card1 .face.face1 .content1 h3{
    margin: 10px 0 0;
    padding: 0;
    color: #fff;
    text-align: center;
    font-size: 1.5em;
}

.container1 .card1 .face.face2{
    position: relative;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    box-sizing: border-box;
    transform: translateY(20px);
}

.container1 .card1:hover .face.face2{
    transform: translateY(20);
}

.container1 .card1 .face.face2 .content1 p{
    margin: 0;
    padding: 0;
}

.container1 .card1 .face.face2 .content1 a{
    margin: 15px 0 0;
    display:  inline-block;
    text-decoration: none;
    font-weight: 900;
    color: #333;
    padding: 5px;
    border: 1px solid #333;
}

.container1 .card1 .face.face2 .content1 a:hover{
    background: #333;
    color: #fff;
}

/* =========================
   scroll arrow down
   ========================= */

.scroll-arrow{
  animation: arrowDown 2s infinite;
}

@keyframes arrowDown{
  0%{
    transform:translateY(-4px);
    opacity:0;
  }

  40%{
    opacity:1;
  }

  80%{
    transform:translateY(12px);
    opacity:0;
  }

  100%{
    opacity:0;
  }
}


/* =========================================================
   Activity page utility additions
   Tailwind-style utilities used directly in activity.php
   ========================================================= */

.min-h-screen { min-height: 100vh; }
.min-h-0 { min-height: 0; }
.h-\[calc\(100vh-var\(--padding-container\)\*2\)\] { height: calc(100vh - var(--padding-container) * 2); }
.min-h-\[calc\(100vh-var\(--padding-container\)\*2\)\] { min-height: calc(100vh - var(--padding-container) * 2); }
.h-\[5\.2rem\] { height: 5.2rem; }
.grid-cols-\[minmax\(28rem\2c 36\%\)_1fr\] { grid-template-columns: minmax(28rem, 36%) 1fr; }
.items-stretch { align-items: stretch; }
.inset-\[1\.2rem\] { inset: 1.2rem; }
.max-h-\[62\%\] { max-height: 62%; }
.max-h-\[52\%\] { max-height: 52%; }
.max-h-\[40\%\] { max-height: 40%; }
.max-h-\[38\%\] { max-height: 38%; }
.max-w-\[92rem\] { max-width: 92rem; }
.w-\[52\%\] { width: 52%; }
.leading-\[0\.82\] { line-height: .82; }
.leading-\[0\.88\] { line-height: .88; }
.leading-\[1\.2\] { line-height: 1.2; }
.leading-\[1\.35\] { line-height: 1.35; }
.tracking-\[-0\.08em\] { letter-spacing: -.08em; }
.tracking-\[0\.06em\] { letter-spacing: .06em; }
.tracking-\[0\.08em\] { letter-spacing: .08em; }
.tracking-\[0\.12em\] { letter-spacing: .12em; }
.text-\[1rem\] { font-size: 1rem; }
.text-\[1\.25rem\] { font-size: 1.25rem; }
.text-\[5\.2rem\] { font-size: 5.2rem; }
.text-\[18rem\] { font-size: 18rem; }
.text-\[clamp\(2\.8rem\2c 4\.2vw\2c 6rem\)\] { font-size: clamp(2.8rem, 4.2vw, 6rem);}
.opacity-8 { opacity: .08; }
.opacity-45 { opacity: .45; }
.opacity-55 { opacity: .55; }
.opacity-72 { opacity: .72; }
.opacity-82 { opacity: .82; }
.hover\:opacity-100:hover { opacity: 1; }
.border-secondary-rgb\/12 { border-color: rgba(var(--color-secondary-rgb)/.12); }
.border-secondary-rgb\/14 { border-color: rgba(var(--color-secondary-rgb)/.14); }
.border-secondary-rgb\/16 { border-color: rgba(var(--color-secondary-rgb)/.16); }
.border-secondary-rgb\/18 { border-color: rgba(var(--color-secondary-rgb)/.18); }
.border-secondary-rgb\/20 { border-color: rgba(var(--color-secondary-rgb)/.20); }
.border-secondary-rgb\/22 { border-color: rgba(var(--color-secondary-rgb)/.22); }
.border-r-0 { border-right-width: 0; }
.m-0 { margin: 0; }
.mb-9 { margin-bottom: .9rem; }
.mb-12 { margin-bottom: 1.2rem; }
.mb-24 { margin-bottom: 2.4rem; }
.mt-14 { margin-top: 1.4rem; }
.mt-26 { margin-top: 2.6rem; }
.p-14 { padding: 1.4rem; }
.p-18 { padding: 1.8rem; }
.p-24 { padding: 2.4rem; }
.p-30 { padding: 3rem; }
.p-40 { padding: 4rem; }
.px-9 { padding-left: .9rem; padding-right: .9rem; }
.px-\[1\.8rem\] { padding-left: 1.8rem; padding-right: 1.8rem; }
.py-\[0\.65rem\] { padding-top: .65rem; padding-bottom: .65rem; }
.pb-\[0\.5rem\] { padding-bottom: .5rem; }
.pb-\[1\.8rem\] { padding-bottom: 1.8rem; }
.pt-\[1\.6rem\] { padding-top: 1.6rem; }
.pt-14 { padding-top: 1.4rem; }
.pb-12 { padding-bottom: 1.2rem; }
.gap-8 { gap: .8rem; }
.gap-14 { gap: 1.4rem; }
.inline-flex { display: inline-flex; }
.items-baseline { align-items: baseline; }
.flex-\[1_1_18rem\] { flex: 1 1 18rem; }
.overscroll-contain { overscroll-behavior: contain; }
.overflow-visible { overflow: visible; }
.overflow-y-auto { overflow-y: auto; }
.shrink-0 { flex-shrink: 0; }
.font-bold { font-weight: 700; }
.font-medium { font-weight: 500; }
.hover\:bg-secondary:hover { background-color: var(--color-secondary); }
.hover\:text-primary:hover { color: var(--color-primary); }
.grayscale-\[10\%\] { filter: grayscale(10%); }
.body-15 { font-size: 1.5rem; line-height: 1.4; }

.richtext-compact p + p { margin-top: .7rem; }
.richtext-compact ul,
.richtext-compact ol {
  margin-top: .7rem;
  padding-left: 1.8rem;
}
.richtext-compact ul { list-style: disc; }
.richtext-compact ol { list-style: decimal; }
.richtext-compact li + li { margin-top: .4rem; }

@media (max-width: 1023px) {
  .md\:h-auto { height: auto; }
  .md\:min-h-\[calc\(100vh-var\(--padding-container\)\*2\)\] { min-height: calc(100vh - var(--padding-container) * 2); }
  .md\:overflow-visible { overflow: visible; }
  .md\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .md\:border-r-0 { border-right-width: 0; }
  .md\:border-b-px { border-bottom-width: 1px; }
  .md\:p-20 { padding: 2rem; }
  .md\:p-24 { padding: 2.4rem; }
  .md\:min-h-\[24rem\] { min-height: 24rem; }
  .md\:w-\[40\%\] { width: 40%; }
  .md\:max-h-\[40\%\] { max-height: 40%; }
  .md\:items-start { align-items: flex-start; }
  .md\:gap-10 { gap: 1rem; }
  .md\:flex-basis-full { flex-basis: 100%; }
  .md\:text-\[clamp\(3rem\2c 10vw\2c 6rem\)\] { font-size: clamp(3rem, 10vw, 6rem); }
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}




.difficulty-line {
  position: relative;
  width: 100%;
  height: 1px;
  background-color: rgba(var(--color-secondary-rgb)/.16);
  overflow: hidden;
}

.difficulty-line span {
  display: block;
  height: 1px;
  background-color: var(--color-secondary);
}


/* =========================================================
   Competitive Development page module
   Moved from CompetitiveDevelopment.php into main.css
   ========================================================= */

/* Section 2: strategy layout */
.cd-sec2-main {
  display: grid;
  grid-template-columns: minmax(24rem, 0.95fr) minmax(0, 1.65fr);
  gap: 2.4rem;
  flex: 1 1 auto;
  min-height: 0;
}

.cd-sec2-intro {
  min-width: 0;
}

.cd-sec2-strategy-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  height: 100%;
  min-height: 0;
}

.cd-sec2-card,
.cd-browse-card {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: rgba(var(--color-secondary-rgb), 0.018);
}

#sec2 {
  position: relative !important;
  isolation: isolate;
}

#sec2 .sec2-strategy-word {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  z-index: 0;
}

#sec2 .sec2-strategy-word svg {
  position: absolute;
  right: -4rem;
  bottom: 8%;
  width: 92%;
  height: auto;
  opacity: 0.085;
}

#sec2 .sec2-strategy-word text {
  font-size: 170px;
  font-weight: 700;
  letter-spacing: -10px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.2;
}

#sec2 > div:not(.sec2-strategy-word) {
  position: relative;
  z-index: 1;
}

/* Section 3: database cards */
.cd-browse-redesign {
  position: relative;
  isolation: isolate;
}

.cd-browse-db .cd-browse-card {
  min-height: 18rem;
}

.cd-browse-top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
}

.cd-browse-open-link {
  flex: 0 0 auto;
  margin-bottom: 0.25rem;
}

.cd-browse-art-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  min-height: 35rem;
}

.cd-browse-art-card {
  min-height: 17rem;
  padding: 1.35rem 1.2rem 1.15rem;
  background: rgba(var(--color-secondary-rgb), 0.012);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.cd-browse-art-card-a {
  grid-column: 1;
  grid-row: 1;
}

.cd-browse-art-card-b {
  grid-column: 2;
  grid-row: 1;
}

.cd-browse-art-card-c {
  grid-column: 1;
  grid-row: 2;
}

.cd-browse-art-card-d {
  grid-column: 2;
  grid-row: 2;
}

.cd-browse-art-no {
  font-weight: 400 !important;
  line-height: 1;
}

.cd-browse-art-card-b .body-11,
.cd-browse-art-card-d .body-11 {
  line-height: 1.18;
}

/* Section 3 metadata dot separators */
.cd-browse-dot-meta {
  display: flex;
  flex-wrap: wrap;
  column-gap: 0.7rem;
  row-gap: 0.35rem;
  align-items: center;
  font-size: 1rem;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(var(--color-secondary-rgb), 0.46);
}

.cd-browse-dot-meta span {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

.cd-browse-dot-meta span:not(:last-child)::after {
  content: "•";
  display: inline-block;
  margin-left: 0.7rem;
  color: rgba(var(--color-secondary-rgb), 0.38);
  font-size: 0.9em;
  line-height: 1;
  transform: translateY(-0.02em);
}

.group:hover .cd-browse-dot-meta {
  color: rgba(var(--color-primary-rgb), 0.66);
}

.group:hover .cd-browse-dot-meta span:not(:last-child)::after {
  color: rgba(var(--color-primary-rgb), 0.48);
}

.cd-browse-art-card-b .cd-browse-dot-meta,
.cd-browse-art-card-d .cd-browse-dot-meta {
  font-size: 0.92rem;
  column-gap: 0.62rem;
}

.cd-browse-art-card-b .cd-browse-dot-meta span:not(:last-child)::after,
.cd-browse-art-card-d .cd-browse-dot-meta span:not(:last-child)::after {
  margin-left: 0.62rem;
}

/* Animated database buttons */
.cd-browse-open-animated {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 1.2rem;
  min-height: 3.4rem;
  padding: 0.85rem 1.15rem 0.78rem;
  border: 1px solid rgba(0, 0, 0, 0.22);
  color: var(--color-secondary);
  background: rgba(var(--color-secondary-rgb), 0.012);
  overflow: hidden;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 1rem;
  line-height: 1;
  font-weight: 700;
  transition:
    color .28s var(--ease-out),
    border-color .28s var(--ease-out),
    background-color .28s var(--ease-out);
}

.cd-browse-open-animated::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--color-secondary);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .32s var(--ease-out);
  z-index: 0;
}

.cd-browse-open-animated:hover {
  color: var(--color-primary);
  border-color: var(--color-secondary);
}

.cd-browse-open-animated:hover::before {
  transform: scaleX(1);
}

.cd-browse-open-text,
.cd-browse-open-arrow {
  position: relative;
  z-index: 1;
}

.cd-browse-open-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.4rem;
  transform: translateX(0);
  transition: transform .28s var(--ease-out);
}

.cd-browse-open-animated:hover .cd-browse-open-arrow {
  transform: translateX(0.35rem);
}

.cd-browse-open-animated:focus-visible {
  outline: 2px solid rgba(var(--color-secondary-rgb), 0.45);
  outline-offset: 3px;
}

/* Tier 10 + Tier 9/8/7 shared rhythm */
.tier10-highlights-section,
.us-tier-list-section {
  background: rgba(var(--color-secondary-rgb), 0.002);
}

.tier10-highlights-section {
  height: calc(var(--h-available) - 1.2rem);
  min-height: 58rem;
}

.tier10-highlights-section .p-container,
.us-tier-list-section .p-container {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.tier10-unified-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  border-bottom: 1px solid rgba(var(--color-secondary-rgb), 0.14);
  padding-bottom: 0.95rem;
}

.tier10-unified-copy {
  max-width: 31rem;
  margin: 0 0 0.25rem;
  color: rgba(var(--color-secondary-rgb), 0.54);
}

.tier10-big-card-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-template-rows: repeat(4, minmax(0, 1fr));
  margin-top: 0.95rem !important;
}

.tier10-big-card-cell {
  background: rgba(var(--color-secondary-rgb), 0.006);
}

.tier10-big-card-link {
  justify-content: space-between;
  padding-top: 0.78rem !important;
  padding-bottom: 0.78rem !important;
}

.tier10-big-card-logo img {
  max-height: 58% !important;
  max-width: 66% !important;
  opacity: 0.92;
  transition: opacity .25s var(--ease-out), transform .25s var(--ease-out);
}

.tier10-big-card-link:hover .tier10-big-card-logo img {
  opacity: 1;
  transform: translateY(-0.12rem);
}

.tier10-big-card-title {
  color: var(--color-secondary);
  margin-top: 0.62rem !important;
  font-size: 1.16rem !important;
  line-height: 1.08 !important;
  letter-spacing: -0.015em;
  max-height: 3.24em !important;
  overflow: hidden;
}

.tier10-big-card-tags,
.tier10-big-card-meta {
  display: none !important;
}

.tier10-big-card-link:hover .tier10-big-card-title {
  color: var(--color-primary);
}

/* Tier 9 / 8 / 7 ranked index */
.us-tier-list-section {
  height: calc(var(--h-available) - 1.2rem);
  min-height: 50rem;
}

.us-tier-list-head {
  border-bottom: 1px solid rgba(var(--color-secondary-rgb), 0.14);
  padding-bottom: 0.85rem !important;
}

.us-tier-list-board {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 0.85rem !important;
}

.us-tier-list-column-head {
  padding: 0.62rem 1rem 0.58rem !important;
}

.us-tier-list-tier-number {
  margin: 0 0 0.22rem !important;
  font-size: clamp(2.45rem, 3.6vw, 4.7rem) !important;
  line-height: 0.82 !important;
  letter-spacing: -0.08em;
  font-weight: 700;
  color: rgba(var(--color-secondary-rgb), 0.18);
}

.us-tier-list-column-head .body-10 {
  color: rgba(var(--color-secondary-rgb), 0.46);
  line-height: 1.08;
}

.us-tier-list-item {
  min-height: 4.22rem !important;
  padding-top: 0.42rem !important;
  padding-bottom: 0.42rem !important;
  padding-left: 1.45rem !important;
  padding-right: 0.95rem !important;
  gap: 0.85rem !important;
  background: rgba(var(--color-secondary-rgb), 0.004);
}

.us-tier-list-icon {
  width: 2.65rem !important;
  height: 2.65rem !important;
  border: 1px solid rgba(var(--color-secondary-rgb), 0.09) !important;
  background: rgba(var(--color-secondary-rgb), 0.004) !important;
}

.us-tier-list-icon img {
  max-width: 1.9rem !important;
  max-height: 1.9rem !important;
  opacity: 0.9;
  transition: opacity .25s var(--ease-out), transform .25s var(--ease-out);
}

.us-tier-list-title {
  font-size: 1.16rem !important;
  line-height: 1.08 !important;
  letter-spacing: -0.015em;
  font-weight: 700 !important;
}

.us-tier-list-achievement {
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-transform: none;
  letter-spacing: 0;
  margin-top: 0.2rem !important;
  font-size: 0.78rem !important;
  line-height: 1.12 !important;
  color: rgba(var(--color-secondary-rgb), 0.42);
  -webkit-line-clamp: 1 !important;
}

.us-tier-list-item:hover .us-tier-list-title,
.us-tier-list-item:hover .us-tier-list-achievement {
  color: var(--color-primary) !important;
}

.us-tier-list-item:hover .us-tier-list-icon {
  border-color: rgba(var(--color-primary-rgb), 0.22) !important;
  background: rgba(var(--color-primary-rgb), 0.035) !important;
}

.us-tier-list-item:hover .us-tier-list-icon img {
  opacity: 1;
  transform: translateX(0.08rem);
}

.us-tier-list-more {
  border-top: 1px solid rgba(var(--color-secondary-rgb), 0.14);
  margin-top: 0.7rem !important;
  padding-top: 0.65rem !important;
}

.us-tier-list-more a {
  font-weight: 700;
}

/* Responsive */
@media (max-width: 1199px) {
  .cd-sec2 {
    height: auto !important;
    min-height: 0 !important;
  }

  .cd-sec2-main,
  .cd-browse-top {
    display: block;
  }

  .cd-sec2-main {
    grid-template-columns: 1fr;
  }

  .cd-sec2-strategy-grid {
    min-height: 36rem;
  }

  #sec2 .sec2-strategy-word svg {
    right: -6rem;
    bottom: 8%;
    width: 104%;
    opacity: 0.075;
  }

  .cd-browse-db,
  .cd-browse-redesign,
  .tier10-highlights-section,
  .us-tier-list-section {
    height: auto !important;
    min-height: 0 !important;
  }

  .cd-browse-open-link {
    margin-top: 1.5rem;
  }

  .cd-browse-art-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
    min-height: 0;
  }

  .cd-browse-art-card-a,
  .cd-browse-art-card-b,
  .cd-browse-art-card-c,
  .cd-browse-art-card-d {
    grid-column: auto;
    grid-row: auto;
    min-height: 18rem;
  }

  .tier10-unified-head {
    display: block;
  }

  .tier10-unified-copy {
    max-width: 34rem;
    margin-top: 1rem;
  }

  .tier10-big-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
  }

  .tier10-big-card-cell {
    min-height: 13rem;
  }

  .us-tier-list-board {
    grid-template-columns: 1fr;
  }

  .us-tier-list-column {
    min-height: 22rem;
  }

  .us-tier-list-item {
    min-height: 4.6rem !important;
  }
}

@media (max-width: 767px) {
  .cd-sec2-strategy-grid,
  .cd-browse-art-grid,
  .tier10-big-card-grid {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto;
    min-height: 0;
  }

  .cd-sec2-card,
  .cd-browse-card {
    min-height: 12rem;
  }

  #sec2 .sec2-strategy-word svg {
    right: -11rem;
    bottom: 8%;
    width: 135%;
    opacity: 0.065;
  }

  .cd-browse-art-card-a,
  .cd-browse-art-card-b,
  .cd-browse-art-card-c,
  .cd-browse-art-card-d {
    min-height: 15rem;
  }

  .cd-browse-open-animated {
    min-height: 3.2rem;
    padding: 0.8rem 1rem 0.72rem;
  }

  .tier10-big-card-cell {
    min-height: 12rem;
  }

  .tier10-big-card-title {
    font-size: 1.28rem !important;
  }

  .us-tier-list-title {
    font-size: 1.1rem !important;
  }

  .us-tier-list-tier-number {
    font-size: clamp(2.5rem, 11vw, 4.1rem) !important;
  }
}

/* End Competitive Development page module */


/* =========================================================
   Competitive Development final overrides
   - moved from CompetitiveDevelopment.php
   - Tier 10 wall header
   - Tier 9/8/7 ranking board
   ========================================================= */

/* Tier 10: edge-to-edge 5×4 grid wall */
.tier10-highlights-section .p-container {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.tier10-wall-head {
  margin-left: var(--padding-container);
  margin-right: var(--padding-container);
  padding-bottom: 1rem;
  display: grid;
  grid-template-columns: minmax(12rem, 0.55fr) minmax(0, 1fr) minmax(12rem, 0.55fr);
  align-items: end;
  gap: 1rem;
  border-bottom: 1px solid rgba(var(--color-secondary-rgb), 0.14);
}

.tier10-wall-kicker,
.tier10-wall-meta {
  font-size: 1rem;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: rgba(var(--color-secondary-rgb), 0.48);
  font-weight: 700;
}

.tier10-wall-title {
  display: block;
  text-align: center;
  font-size: clamp(2.8rem, 4.6vw, 5.8rem);
  line-height: 0.88;
  letter-spacing: -0.08em;
  text-transform: uppercase;
  font-weight: 700;
  transform: none;
}

.tier10-wall-meta {
  text-align: right;
}

.tier10-unified-head,
.tier10-unified-copy {
  display: none !important;
}

.tier10-big-card-grid {
  width: 100% !important;
  margin: 1.15rem 0 0 !important;
  border-left-width: 0 !important;
  border-right-width: 0 !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-template-rows: repeat(4, minmax(0, 1fr));
}

.tier10-big-card-cell {
  min-width: 0;
  background: rgba(var(--color-secondary-rgb), 0.004) !important;
}

.tier10-big-card-cell:nth-child(5n) {
  border-right-width: 0 !important;
}

.tier10-big-card-cell:nth-child(5n + 1) {
  border-left-width: 0 !important;
}

.tier10-big-card-link {
  padding: 0.75rem 0.85rem !important;
}

.tier10-big-card-logo img {
  max-height: 54% !important;
  max-width: 62% !important;
  opacity: 0.92;
  transition: opacity .25s var(--ease-out), transform .25s var(--ease-out);
}

.tier10-big-card-link:hover .tier10-big-card-logo img {
  opacity: 1;
  transform: translateY(-0.12rem);
}

.tier10-big-card-title {
  font-size: 1.12rem !important;
  line-height: 1.08 !important;
  letter-spacing: -0.01em !important;
  margin-top: 0.62rem !important;
  max-height: 3.24em !important;
  overflow: hidden;
}

/* Tier 9 / 8 / 7: ranking board */
.us-tier-list-head {
  border-bottom: 1px solid rgba(var(--color-secondary-rgb), 0.14);
  padding-bottom: 0.95rem !important;
}

.us-tier-list-head .body-12 {
  font-size: 1.15rem !important;
  line-height: 1 !important;
  letter-spacing: 0.12em !important;
  font-weight: 700 !important;
  color: rgba(var(--color-secondary-rgb), 0.56) !important;
}

.us-tier-list-board {
  margin-top: 0.85rem !important;
}

.us-tier-list-column-head {
  position: relative;
  min-height: 6.1rem;
  padding: 0.9rem 1.2rem 0.72rem !important;
  overflow: hidden;
}

/* Make 9 / 8 / 7 the same visual size family as "Tier 10 Highlights" */
.us-tier-list-tier-number {
  font-size: clamp(2.8rem, 4.6vw, 5.8rem) !important;
  line-height: 0.88 !important;
  color: rgba(var(--color-secondary-rgb), 0.13) !important;
  margin: 0 !important;
  letter-spacing: -0.08em !important;
  font-weight: 700 !important;
}

.us-tier-list-column-head .body-10 {
  position: relative;
  z-index: 1;
  margin-top: -0.35rem;
  max-width: 16rem;
  color: rgba(var(--color-secondary-rgb), 0.52) !important;
  line-height: 1.12 !important;
}

.us-tier-list-item {
  min-height: 4.05rem !important;
  padding-top: 0.38rem !important;
  padding-bottom: 0.38rem !important;
  padding-left: 1.55rem !important;
  padding-right: 0.95rem !important;
  gap: 0.85rem !important;
}

.us-tier-list-icon {
  width: 2.55rem !important;
  height: 2.55rem !important;
  border: 1px solid rgba(var(--color-secondary-rgb), 0.08) !important;
  background: rgba(var(--color-secondary-rgb), 0.004) !important;
}

.us-tier-list-icon img {
  max-width: 1.85rem !important;
  max-height: 1.85rem !important;
}

.us-tier-list-title {
  font-size: 1.12rem !important;
  line-height: 1.08 !important;
  letter-spacing: -0.01em !important;
}

.us-tier-list-achievement {
  margin-top: 0.18rem !important;
  font-size: 0.76rem !important;
  line-height: 1.1 !important;
  color: rgba(var(--color-secondary-rgb), 0.38) !important;
  -webkit-line-clamp: 1 !important;
}

.us-tier-list-more {
  margin-top: 0.7rem !important;
  padding-top: 0.65rem !important;
}

/* Reusable animated right-side navigation button */
.cd-browse-open-animated {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 1.2rem;
  min-height: 3.4rem;
  padding: 0.85rem 1.15rem 0.78rem;
  border: 1px solid rgba(0, 0, 0, 0.22);
  color: var(--color-secondary);
  background: rgba(var(--color-secondary-rgb), 0.012);
  overflow: hidden;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 1rem;
  line-height: 1;
  font-weight: 700;
  transition: color .28s var(--ease-out), border-color .28s var(--ease-out), background-color .28s var(--ease-out);
}

.cd-browse-open-animated::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--color-secondary);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .32s var(--ease-out);
  z-index: 0;
}

.cd-browse-open-animated:hover {
  color: var(--color-primary);
  border-color: var(--color-secondary);
}

.cd-browse-open-animated:hover::before {
  transform: scaleX(1);
}

.cd-browse-open-text,
.cd-browse-open-arrow {
  position: relative;
  z-index: 1;
}

.cd-browse-open-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.4rem;
  transform: translateX(0);
  transition: transform .28s var(--ease-out);
}

.cd-browse-open-animated:hover .cd-browse-open-arrow {
  transform: translateX(0.35rem);
}

.cd-browse-open-animated:focus-visible {
  outline: 2px solid rgba(var(--color-secondary-rgb), 0.45);
  outline-offset: 3px;
}

@media (max-width: 1199px) {
  .tier10-highlights-section .p-container {
    padding-left: var(--padding-container) !important;
    padding-right: var(--padding-container) !important;
  }

  .tier10-wall-head {
    display: block;
    margin-left: 0;
    margin-right: 0;
  }

  .tier10-wall-title {
    margin-top: 0.8rem;
    text-align: left;
    font-size: clamp(3rem, 10vw, 5.4rem);
  }

  .tier10-wall-meta {
    margin-top: 0.9rem;
    text-align: left;
  }

  .tier10-big-card-grid {
    border-left-width: 1px !important;
    border-right-width: 0 !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
  }

  .tier10-big-card-cell:nth-child(5n),
  .tier10-big-card-cell:nth-child(5n + 1) {
    border-left-width: inherit !important;
    border-right-width: inherit !important;
  }

  .us-tier-list-column-head {
    min-height: 6rem;
  }

  .us-tier-list-tier-number {
    font-size: clamp(3rem, 10vw, 5.4rem) !important;
  }

  .us-tier-list-item {
    min-height: 4.45rem !important;
  }
}

@media (max-width: 767px) {
  .tier10-wall-title {
    font-size: clamp(3rem, 13vw, 5rem);
  }

  .tier10-big-card-title {
    font-size: 1.25rem !important;
  }

  .us-tier-list-column-head {
    min-height: 5.6rem;
  }

  .us-tier-list-title {
    font-size: 1.08rem !important;
  }

  .cd-browse-open-animated {
    min-height: 3.2rem;
    padding: 0.8rem 1rem 0.72rem;
  }
}

/* End Competitive Development final overrides */


/* Competitive Development utility patch */
.max-w-\[11ch\] { max-width: 11ch; }
.max-w-\[30rem\] { max-width: 30rem; }
.max-w-\[23rem\] { max-width: 23rem; }
.max-w-\[24rem\] { max-width: 24rem; }
.min-w-0 { min-width: 0; }
.break-words { overflow-wrap: break-word; }
.opacity-85 { opacity: .85; }
.max-w-\[3\.2rem\] { max-width: 3.2rem; }
.max-h-\[3\.2rem\] { max-height: 3.2rem; }
.w-5rem { width: 5rem; }
.h-5rem { height: 5rem; }
.body-9 { font-size: .9rem; line-height: 1.1rem; }


/* =========================================================
   Competitive Development fine polish
   - stronger framed activity database CTA
   - section 1 / 2 / 3 card top rules set to 0.12rem
   ========================================================= */

/* Make Open Activity Database feel intentionally framed, not just a text link */
.cd-browse-open-animated {
  border: 1.2px solid rgba(var(--color-secondary-rgb), 0.72) !important;
  box-shadow:
    inset 0 0 0 1px rgba(var(--color-secondary-rgb), 0.055),
    0 0 0 1px rgba(var(--color-secondary-rgb), 0.035);
}

.cd-browse-open-animated::after {
  content: "";
  position: absolute;
  inset: 0.35rem;
  border: 1px solid rgba(var(--color-secondary-rgb), 0.12);
  pointer-events: none;
  z-index: 1;
  transition: border-color .28s var(--ease-out);
}

.cd-browse-open-animated:hover {
  border-color: var(--color-secondary) !important;
  box-shadow: none;
}

.cd-browse-open-animated:hover::after {
  border-color: rgba(var(--color-primary-rgb), 0.26);
}

/* Section 1: three principle cards top rule */
#sec1 .grid.grid-cols-3 > .border-t-px {
  border-top-width: 0.12rem !important;
}

/* Section 2: four principle cards top rule */
#sec2 .flex.gap-10 > .border-t-px {
  border-top-width: 0.12rem !important;
}

/* Section 3: four database cards top rule / card frame top edge */
#sec3 .cd-browse-art-card,
#sec3 .cd-browse-card,
#sec3 .border-t-px {
  border-top-width: 0.12rem !important;
}

/* End Competitive Development fine polish */


/* =========================================================
   Competitive Development CTA emphasis
   - more visible Open Activity Database button
   - solid text, no stroke
   - existing hover animation stays intact
   ========================================================= */

.cd-browse-open-animated {
  font-size: 1.08rem !important;
  letter-spacing: 0.105em !important;
  font-weight: 700 !important;
  min-height: 3.7rem !important;
  padding: 0.95rem 1.25rem 0.88rem !important;
  border: 1px solid rgba(var(--color-secondary-rgb), 0.72) !important;
  background: rgba(var(--color-secondary-rgb), 0.035) !important;
  color: var(--color-secondary) !important;
  box-shadow:
    inset 0 0 0 1px rgba(var(--color-secondary-rgb), 0.08),
    0 0 0 1px rgba(var(--color-secondary-rgb), 0.04);
}

.cd-browse-open-animated .cd-browse-open-text,
.cd-browse-open-animated .cd-browse-open-arrow {
  color: currentColor !important;
  -webkit-text-stroke: 0 !important;
  text-stroke: 0 !important;
}

.cd-browse-open-arrow {
  font-size: 1.22rem !important;
  width: 1.55rem !important;
  margin-left: 0.15rem;
}

.cd-browse-open-animated:hover {
  background: var(--color-secondary) !important;
  color: var(--color-primary) !important;
  border-color: var(--color-secondary) !important;
  box-shadow: none;
}

/* End Competitive Development CTA emphasis */



/* === Tailwind utility additions used by activity_database_all_tailwind.php === */
.min-h-0 { min-height: 0; }
.min-h-\[13\.2rem\] { min-height: 13.2rem; }
.min-h-\[34rem\] { min-height: 34rem; }
.max-h-\[54\%\] { max-height: 54%; }
.max-h-\[3\.6em\] { max-height: 3.6em; }
.max-h-\[3\.4rem\] { max-height: 3.4rem; }
.max-w-\[62\%\] { max-width: 62%; }
.max-w-\[11ch\] { max-width: 11ch; }
.inline-flex { display: inline-flex; }
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.gap-5 { gap: .5rem; }
.gap-8 { gap: .8rem; }
.gap-30 { gap: 3rem; }
.border-secondary-rgb\/20 { border-color: rgba(var(--color-secondary-rgb)/.20); }
.border-secondary-rgb\/25 { border-color: rgba(var(--color-secondary-rgb)/.25); }
.border-secondary-rgb\/40 { border-color: rgba(var(--color-secondary-rgb)/.40); }
.border-primary-rgb\/35 { border-color: rgba(var(--color-primary-rgb)/.35); }
.bg-secondary-rgb\/2 { background-color: rgba(var(--color-secondary-rgb)/.02); }
.text-\[0\.76rem\] { font-size: .76rem; }
.text-\[0\.82rem\] { font-size: .82rem; }
.text-\[0\.9rem\] { font-size: .9rem; }
.text-\[0\.92rem\] { font-size: .92rem; }
.text-\[1rem\] { font-size: 1rem; }
.text-\[1\.05rem\] { font-size: 1.05rem; }
.text-\[1\.35rem\] { font-size: 1.35rem; }
.leading-\[0\.92\] { line-height: .92; }
.leading-\[1\.08\] { line-height: 1.08; }
.leading-\[1\.15\] { line-height: 1.15; }
.tracking-\[-0\.01em\] { letter-spacing: -.01em; }
.tracking-\[0\.045em\] { letter-spacing: .045em; }
.tracking-\[0\.06em\] { letter-spacing: .06em; }
.tracking-\[0\.08em\] { letter-spacing: .08em; }
.tracking-\[0\.1em\] { letter-spacing: .1em; }
.tracking-\[0\.13em\] { letter-spacing: .13em; }
.normal-case { text-transform: none; }
.text-left { text-align: left; }
.opacity-90 { opacity: .9; }
.-translate-y-\[0\.12rem\] { --tw-translate-y: -.12rem; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.hover\:border-secondary:hover { border-color: var(--color-secondary); }
.hover\:bg-secondary:hover { background-color: var(--color-secondary); }
.hover\:text-primary:hover { color: var(--color-primary); }
.group:hover .group-hover\:opacity-100 { opacity: 1; }
.group:hover .group-hover\:-translate-y-\[0\.12rem\] { --tw-translate-y: -.12rem; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.group:hover .group-hover\:border-primary-rgb\/35 { border-color: rgba(var(--color-primary-rgb)/.35); }
.group:hover .group-hover\:text-primary\/65 { color: rgba(var(--color-primary-rgb)/.65); }
@media (min-width:768px) {
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md\:col-end-22 { grid-column-end: 22; }
  .md\:heading-72 { font-size: 7.2rem; line-height: 1; text-transform: uppercase; }
}
@media (min-width:1024px) {
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width:1200px) and (hover:hover) {
  .xl\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

/* === Tailwind utility additions used by activity_database_tailwind_v2.php === */
.mb-12 { margin-bottom: 1.2rem; }
.top-8 { top: .8rem; }
.left-8 { left: .8rem; }
.items-baseline { align-items: baseline; }
.min-w-\[2\.6rem\] { min-width: 2.6rem; }
.max-w-\[44rem\] { max-width: 44rem; }
.text-\[0\.78rem\] { font-size: .78rem; }
.text-\[1\.08rem\] { font-size: 1.08rem; }
.text-\[1\.15rem\] { font-size: 1.15rem; }
.leading-\[1\.18\] { line-height: 1.18; }
.tracking-\[0\.07em\] { letter-spacing: .07em; }
.tracking-\[0\.09em\] { letter-spacing: .09em; }
.text-primary\/70 { color: rgba(var(--color-primary-rgb)/.70); }
.text-secondary-rgb\/70 { color: rgba(var(--color-secondary-rgb)/.70); }
.group:hover .group-hover\:bg-secondary { background-color: var(--color-secondary); }
.group:hover .group-hover\:text-primary\/70 { color: rgba(var(--color-primary-rgb)/.70); }

/* === Tailwind utility additions used by activity_database_tailwind_v3.php === */
.mb-14 { margin-bottom: 1.4rem; }
.gap-20 { gap: 2rem; }
.pt-28 { padding-top: 2.8rem; }
.p-12 { padding: 1.2rem; }
.pb-12 { padding-bottom: 1.2rem; }
.min-h-\[14\.4rem\] { min-height: 14.4rem; }
.max-h-\[58\%\] { max-height: 58%; }
.max-h-\[3\.5em\] { max-height: 3.5em; }
.max-h-\[3\.2rem\] { max-height: 3.2rem; }
.max-w-\[66\%\] { max-width: 66%; }
.max-w-\[48rem\] { max-width: 48rem; }
.min-w-\[2\.8rem\] { min-width: 2.8rem; }
.text-\[0\.72rem\] { font-size: .72rem; }
.text-\[0\.94rem\] { font-size: .94rem; }
.text-\[1\.18rem\] { font-size: 1.18rem; }
.text-\[1\.32rem\] { font-size: 1.32rem; }
.border-secondary-rgb\/35 { border-color: rgba(var(--color-secondary-rgb)/.35); }
.bg-secondary-rgb\/2 { background-color: rgba(var(--color-secondary-rgb)/.02); }
.group:hover .group-hover\:bg-secondary { background-color: var(--color-secondary); }
@media (min-width:1024px) {
  .lg\:w-\[38\%\] { width: 38%; }
}
.gap-x-12 { -moz-column-gap: 1.2rem; column-gap: 1.2rem; }
@media (min-width:768px) {
  .md\:flex-row { flex-direction: row; }
  .md\:items-end { align-items: flex-end; }
}
@media (min-width:1024px) {
  .lg\:flex-row { flex-direction: row; }
}

/* === Tailwind utility additions used by activity_database_tailwind_v4.php === */
.mt-7 { margin-top: .7rem; }
.gap-y-2 { row-gap: .2rem; }
.text-\[0\.86rem\] { font-size: .86rem; }
.text-\[1\.02rem\] { font-size: 1.02rem; }
.text-\[1\.06rem\] { font-size: 1.06rem; }
.text-secondary-rgb\/65 { color: rgba(var(--color-secondary-rgb)/.65); }
.group:hover .group-hover\:text-primary\/60 { color: rgba(var(--color-primary-rgb)/.60); }

/* === Tailwind utility additions used by activity_database_tailwind_final.php === */
.min-h-\[15\.4rem\] { min-height: 15.4rem; }
.max-h-\[3\.2em\] { max-height: 3.2em; }
.max-h-\[2\.45em\] { max-height: 2.45em; }
.leading-\[1\.22\] { line-height: 1.22; }
.text-secondary-rgb\/55 { color: rgba(var(--color-secondary-rgb)/.55); }

/* === Tailwind utility additions used by current CompetitiveDevelopment_tailwind_v3.php === */
.mx-container { margin-left: var(--padding-container); margin-right: var(--padding-container); }
.isolate { isolation: isolate; }
.inline-flex { display: inline-flex; }
.grid-rows-2 { grid-template-rows: repeat(2, minmax(0, 1fr)); }
.grid-rows-4 { grid-template-rows: repeat(4, minmax(0, 1fr)); }
.min-h-\[3\.7rem\] { min-height: 3.7rem; }
.min-h-\[4\.05rem\] { min-height: 4.05rem; }
.min-h-\[6\.1rem\] { min-height: 6.1rem; }
.min-h-\[17rem\] { min-height: 17rem; }
.min-h-\[35rem\] { min-height: 35rem; }
.w-\[1\.55rem\] { width: 1.55rem; }
.w-\[2\.55rem\] { width: 2.55rem; }
.h-\[2\.55rem\] { height: 2.55rem; }
.max-w-\[1\.85rem\] { max-width: 1.85rem; }
.max-h-\[1\.85rem\] { max-height: 1.85rem; }
.max-h-\[1\.2rem\] { max-height: 1.2rem; }
.max-h-\[3\.24em\] { max-height: 3.24em; }
.max-w-\[16rem\] { max-width: 16rem; }
.max-w-\[62\%\] { max-width: 62%; }
.max-h-\[54\%\] { max-height: 54%; }
.gap-8 { gap: .8rem; }
.gap-12 { gap: 1.2rem; }
.gap-20 { gap: 2rem; }
.gap-x-7 { column-gap: .7rem; }
.gap-y-4 { row-gap: .4rem; }
.mt-3 { margin-top: .3rem; }
.mt-4 { margin-top: .4rem; }
.mt-12 { margin-top: 1.2rem; }
.mt-16 { margin-top: 1.6rem; }
.-mt-\[0\.35rem\] { margin-top: -.35rem; }
.mb-2 { margin-bottom: .2rem; }
.p-12 { padding: 1.2rem; }
.px-12 { padding-left: 1.2rem; padding-right: 1.2rem; }
.px-14 { padding-left: 1.4rem; padding-right: 1.4rem; }
.py-8 { padding-top: .8rem; padding-bottom: .8rem; }
.py-10 { padding-top: 1rem; padding-bottom: 1rem; }
.pt-14 { padding-top: 1.4rem; }
.pb-10 { padding-bottom: 1rem; }
.pb-12 { padding-bottom: 1.2rem; }
.text-\[0\.78rem\] { font-size: .78rem; }
.text-\[1rem\] { font-size: 1rem; }
.text-\[1\.08rem\] { font-size: 1.08rem; }
.text-\[1\.12rem\] { font-size: 1.12rem; }
.text-\[1\.15rem\] { font-size: 1.15rem; }
.text-\[1\.22rem\] { font-size: 1.22rem; }
.leading-\[1\.08\] { line-height: 1.08; }
.leading-\[1\.12\] { line-height: 1.12; }
.leading-\[1\.25\] { line-height: 1.25; }
.tracking-\[-0\.08em\] { letter-spacing: -.08em; }
.tracking-\[-0\.01em\] { letter-spacing: -.01em; }
.tracking-\[0\.05em\] { letter-spacing: .05em; }
.tracking-\[0\.08em\] { letter-spacing: .08em; }
.tracking-\[0\.105em\] { letter-spacing: .105em; }
.tracking-\[0\.12em\] { letter-spacing: .12em; }
.normal-case { text-transform: none; }
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.whitespace-normal { white-space: normal; }
.whitespace-nowrap { white-space: nowrap; }
.break-words { overflow-wrap: break-word; }
.transform-none { transform: none; }
.border-secondary-rgb\/8 { border-color: rgba(var(--color-secondary-rgb)/.08); }
.border-secondary-rgb\/10 { border-color: rgba(var(--color-secondary-rgb)/.10); }
.border-secondary-rgb\/15 { border-color: rgba(var(--color-secondary-rgb)/.15); }
.border-secondary-rgb\/70 { border-color: rgba(var(--color-secondary-rgb)/.70); }
.text-secondary-rgb\/45 { color: rgba(var(--color-secondary-rgb)/.45); }
.text-secondary-rgb\/46 { color: rgba(var(--color-secondary-rgb)/.46); }
.text-secondary-rgb\/50 { color: rgba(var(--color-secondary-rgb)/.50); }
.text-secondary-rgb\/52 { color: rgba(var(--color-secondary-rgb)/.52); }
.text-secondary-rgb\/60 { color: rgba(var(--color-secondary-rgb)/.60); }
.opacity-90 { opacity: .9; }
.transition-transform { transition-property: transform; transition-duration: .15s; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.group:hover .group-hover\:translate-x-\[0\.08rem\] { --tw-translate-x: .08rem; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.group:hover .group-hover\:translate-x-\[0\.35rem\] { --tw-translate-x: .35rem; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.group:hover .group-hover\:-translate-y-\[0\.12rem\] { --tw-translate-y: -.12rem; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.group:hover .group-hover\:opacity-100 { opacity: 1; }
.group:hover .group-hover\:border-primary-rgb\/22 { border-color: rgba(var(--color-primary-rgb)/.22); }
.group:hover .group-hover\:bg-primary-rgb\/4 { background-color: rgba(var(--color-primary-rgb)/.04); }
.group:hover .group-hover\:text-primary { color: var(--color-primary); }
.group:hover .group-hover\:text-primary\/60 { color: rgba(var(--color-primary-rgb)/.60); }
.group:hover .group-hover\:text-primary\/66 { color: rgba(var(--color-primary-rgb)/.66); }
.right-\[-4rem\] { right: -4rem; }
.bottom-\[-6\%\] { bottom: -6%; }
.w-\[92\%\] { width: 92%; }
.opacity-\[0\.085\] { opacity: 0.085; }
.text-\[170px\] { font-size: 170px; }
.tracking-\[-10px\] { letter-spacing: -10px; }
.fill-none { fill: none; }
.stroke-current { stroke: currentColor; }
.stroke-\[1\.2\] { stroke-width: 1.2; }
.border-secondary-rgb\/18 { border-color: rgba(var(--color-secondary-rgb)/.18); }
.text-secondary-rgb\/12 { color: rgba(var(--color-secondary-rgb)/.12); }
.group:hover .group-hover\:text-primary\/30 { color: rgba(var(--color-primary-rgb)/.30); }

/* CompetitiveDevelopment v5 retained Tailwind-like utilities */
.inset-0 { inset: 0; }
.right-\[-4rem\] { right: -4rem; }
.bottom-\[-12\%\] { bottom: -12%; }
.w-\[92\%\] { width: 92%; }
.opacity-\[0\.085\] { opacity: 0.085; }
.text-\[170px\] { font-size: 170px; }
.tracking-\[-10px\] { letter-spacing: -10px; }
.stroke-\[1\.2\] { stroke-width: 1.2; }

/* Competitive Development v6 utility additions */
.min-h-\[3rem\] { min-height: 3rem }
.min-h-\[5\.2rem\] { min-height: 5.2rem }
.min-h-\[58rem\] { min-height: 58rem }
.w-\[2\.4rem\] { width: 2.4rem }
.h-\[2\.4rem\] { height: 2.4rem }
.max-w-\[1\.75rem\] { max-width: 1.75rem }
.max-h-\[1\.75rem\] { max-height: 1.75rem }
.text-\[0\.92rem\] { font-size: 0.92rem }
.text-\[0\.62rem\] { font-size: 0.62rem }
.max-h-\[2\.25em\] { max-height: 2.25em }
.-right-\[0\.45rem\] { right: -0.45rem }
.top-6 { top: .6rem }
.py-6 { padding-top: .6rem; padding-bottom: .6rem }
.py-8 { padding-top: .8rem; padding-bottom: .8rem }
.px-6 { padding-left: .6rem; padding-right: .6rem }
.inset-0 { inset: 0 }


/* CompetitiveDevelopment v9 utility fixes */
.min-h-\[3\.45rem\]{min-height:3.45rem}
.min-h-\[4\.8rem\]{min-height:4.8rem}
.w-\[2\.15rem\]{width:2.15rem}
.h-\[2\.15rem\]{height:2.15rem}
.max-w-\[1\.5rem\]{max-width:1.5rem}
.max-h-\[1\.5rem\]{max-height:1.5rem}
.text-\[0\.94rem\]{font-size:.94rem}
.text-\[0\.62rem\]{font-size:.62rem}
.max-h-\[2\.16em\]{max-height:2.16em}
.whitespace-normal{white-space:normal}
.break-words{overflow-wrap:break-word}

/* CompetitiveDevelopment v10 utility additions */
.h-\[calc\(var\(--h-available\)-1\.2rem\)\] { height: calc(var(--h-available) - 1.2rem); }
.min-h-\[3\.6rem\] { min-height: 3.6rem; }
.w-\[2\.25rem\] { width: 2.25rem; }
.h-\[2\.25rem\] { height: 2.25rem; }
.max-w-\[1\.58rem\] { max-width: 1.58rem; }
.max-h-\[1\.58rem\] { max-height: 1.58rem; }
.text-\[1\.05rem\] { font-size: 1.05rem; }
.text-\[0\.72rem\] { font-size: 0.72rem; }
.max-h-\[2\.2em\] { max-height: 2.2em; }
.-top-\[0\.55rem\] { top: -0.55rem; }



/* === Competitive Development v17 adjustments ===
   Slower CTA motion using the earlier Open Database animation language. */
.cd-browse-open-animated,
.cd-browse-open-animated::before,
.cd-browse-open-animated::after,
.cd-browse-open-animated .cd-browse-open-text,
.cd-browse-open-animated .cd-browse-open-arrow {
  transition-duration: .72s !important;
  transition-timing-function: var(--ease-out) !important;
}
.cd-browse-open-animated:hover .cd-browse-open-arrow {
  transform: translateX(.48rem) !important;
}
/* End Competitive Development v17 adjustments */


/* === Competitive Development v18 adjustments ===
   Tier 9/8/7 note visibility, lower DIRECTION, stronger CTA frame. */
.mt-2 { margin-top: .2rem; }

.cd-browse-open-animated {
  border: 1.6px solid rgba(0, 0, 0, 0.82) !important;
  background: rgba(0, 0, 0, 0.025) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 0, 0, 0.12),
    0 0 0 1px rgba(0, 0, 0, 0.08) !important;
}
.cd-browse-open-animated::after {
  inset: .32rem !important;
  border-color: rgba(0, 0, 0, 0.22) !important;
}
.cd-browse-open-animated:hover::after {
  border-color: rgba(255, 255, 255, 0.34) !important;
}
body.dark .cd-browse-open-animated,
body.dark-force .cd-browse-open-animated {
  border-color: rgba(255, 255, 255, 0.82) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.14),
    0 0 0 1px rgba(255, 255, 255, 0.08) !important;
}
body.dark .cd-browse-open-animated::after,
body.dark-force .cd-browse-open-animated::after {
  border-color: rgba(255, 255, 255, 0.24) !important;
}
/* End Competitive Development v18 adjustments */

/* =========================================================
   Competitive Development CTA frame cleanup
   - keep the outer border and hover animation
   - remove the inner frame and inset shadow
   ========================================================= */
.cd-browse-open-animated {
  box-shadow: none !important;
}

.cd-browse-open-animated::after {
  content: none !important;
  display: none !important;
}
/* End Competitive Development CTA frame cleanup */


/* Competitive Development: thin outer frame for database links */
.cd-browse-open-animated {
  border: 1px solid rgba(0, 0, 0, 0.22) !important;
  box-shadow: none !important;
}

body.dark .cd-browse-open-animated,
body.dark-force .cd-browse-open-animated {
  border-color: rgba(255, 255, 255, 0.24) !important;
  box-shadow: none !important;
}

/* Section 3 refined tag chips */
.text-\[0\.92rem\] { font-size: 0.92rem; }


/* Section 3 compact tag utilities */
.gap-4 { gap: .4rem; }
.py-3 { padding-bottom: .3rem; padding-top: .3rem; }
.text-\[0\.76rem\] { font-size: .76rem; }
.max-h-\[5\.2rem\] { max-height: 5.2rem; }
.tracking-\[0\.075em\] { letter-spacing: .075em; }

/* Competitive Development responsive logo sizing utilities */
.w-\[1\.55rem\] { width: 1.55rem; }
.h-\[1\.55rem\] { height: 1.55rem; }
.w-\[2\.2rem\] { width: 2.2rem; }
.h-\[2\.2rem\] { height: 2.2rem; }
.min-w-\[2\.2rem\] { min-width: 2.2rem; }
.max-w-\[2\.2rem\] { max-width: 2.2rem; }
.max-w-\[1\.55rem\] { max-width: 1.55rem; }
.max-h-\[1\.55rem\] { max-height: 1.55rem; }
.border-primary-rgb\/25 { border-color: rgba(var(--color-primary-rgb)/.25); }

@media (max-width: 767px) {
  .w-\[2\.2rem\] { width: 2rem; }
  .h-\[2\.2rem\] { height: 2rem; }
  .min-w-\[2\.2rem\] { min-width: 2rem; }
  .max-w-\[2\.2rem\] { max-width: 2rem; }
  .w-\[1\.55rem\] { width: 1.35rem; }
  .h-\[1\.55rem\] { height: 1.35rem; }
  .max-w-\[1\.55rem\] { max-width: 1.35rem; }
  .max-h-\[1\.55rem\] { max-height: 1.35rem; }
}

/* Section 2 one-screen adjustment: keeps the admissions text + visual within one viewport and reduces the gap before section 3. */
@media (min-width: 1200px){
  #sec2.foundation-section2-one-screen,
  #sec3.foundation-section2-one-screen{
    height: var(--h-available);
    min-height: var(--h-available);
  }
  #sec2 .foundation-section2-content,
  #sec3 .foundation-section2-content{
    height: 100%;
    align-items: center;
    margin-top: 0;
    margin-bottom: 0;
  }
  #sec2 .foundation-section2-content svg,
  #sec3 .foundation-section2-content svg{
    width: min(26rem, 58vh);
    height: auto;
    max-height: 58vh;
  }
}
@media (min-width: 768px) and (max-width: 1199px){
  #sec2.foundation-section2-one-screen,
  #sec3.foundation-section2-one-screen{
    min-height: calc(var(--h-available) * .92);
  }
  #sec2 .foundation-section2-content,
  #sec3 .foundation-section2-content{
    margin-bottom: 2rem;
  }
}

/* =========================================================
   Foundation index final minimal styles
   Kept for the current index.html structure only.
   Removed obsolete page-specific variants from earlier drafts.
   ========================================================= */

#sec1 .foundation-card-hover{
  position:relative;
  overflow:hidden;
  background:var(--color-primary);
  color:var(--color-secondary);
}

#sec1 .foundation-card-hover::after,
#sec1.foundation-system-grid .foundation-card-hover::after{
  content:none !important;
  display:none !important;
}

@media (hover:hover){
  #sec1 .foundation-card-hover:hover{
    background:var(--color-primary) !important;
    color:var(--color-secondary) !important;
    transform:none !important;
  }
  #sec1 .foundation-card-hover:hover *,
  #sec1 .foundation-card-hover:hover svg{
    transform:none !important;
  }
}

@media (min-width:1200px){
  .foundation-section1-stage{
    height:var(--h-available) !important;
    min-height:var(--h-available) !important;
    max-height:var(--h-available) !important;
    overflow:hidden !important;
    display:flex !important;
    flex-direction:column !important;
  }

  .foundation-section1-stage > .foundation-system-grid,
  #sec1.foundation-system-grid{
    flex:1 1 auto !important;
    min-height:0 !important;
    height:100% !important;
    max-height:100% !important;
    overflow:hidden !important;
    align-items:stretch !important;
    align-content:stretch !important;
    gap:var(--foundation-card-gap, 1rem) !important;
  }

  #sec1.foundation-system-grid{
    --foundation-card-gap:1rem;
    --foundation-side-card-height:calc((var(--h-available) - 3rem) / 4);
  }

  #sec1 > .foundation-large-card,
  #sec1 > .foundation-main-card{
    height:calc((var(--foundation-side-card-height) * 2) + var(--foundation-card-gap)) !important;
    min-height:calc((var(--foundation-side-card-height) * 2) + var(--foundation-card-gap)) !important;
    max-height:calc((var(--foundation-side-card-height) * 2) + var(--foundation-card-gap)) !important;
  }

  #sec1 > .foundation-small-card,
  #sec1 > .foundation-side-card{
    height:var(--foundation-side-card-height) !important;
    min-height:var(--foundation-side-card-height) !important;
    max-height:var(--foundation-side-card-height) !important;
    padding-top:0 !important;
  }

  #sec1 .box-parent,
  #sec1 .box,
  #sec1 .box-inner{
    min-height:0 !important;
    max-height:100% !important;
  }
}

/* Foundation index visual polish */
.foundation-index-page .foundation-system-grid > a{
  text-decoration:none;
}

.foundation-index-page #sec1 .foundation-main-card .foundation-card-hover,
.foundation-index-page #sec1 .foundation-large-card .foundation-card-hover,
.foundation-index-page #sec1 > a .foundation-card-hover{
  transition:background-color .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease;
}

.foundation-index-page #sec1 > a .foundation-card-hover::before{
  content:"↗";
  position:absolute;
  right:1.4rem;
  top:1.2rem;
  z-index:3;
  border:1px solid color-mix(in srgb, var(--color-secondary) 18%, transparent);
  width:2.4rem;
  height:2.4rem;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  font-size:1.05rem;
  line-height:1;
  color:color-mix(in srgb, var(--color-secondary) 48%, transparent);
  background:var(--color-primary);
  transition:background-color .22s ease,color .22s ease,border-color .22s ease;
}

@media (hover:hover){
  .foundation-index-page #sec1 > a:hover .foundation-card-hover{
    background:var(--color-secondary) !important;
    color:var(--color-primary) !important;
    border-color:var(--color-secondary) !important;
    box-shadow:inset 0 0 0 1px var(--color-secondary);
  }

  .foundation-index-page #sec1 > a:hover .foundation-card-hover *,
  .foundation-index-page #sec1 > a:hover .foundation-card-hover svg{
    color:var(--color-primary) !important;
    border-color:color-mix(in srgb, var(--color-primary) 28%, transparent) !important;
  }

  .foundation-index-page #sec1 > a:hover .foundation-card-hover::before{
    color:var(--color-secondary);
    background:var(--color-primary);
    border-color:var(--color-primary);
  }
}

.foundation-index-page #sec1 .foundation-main-card .heading-24,
.foundation-index-page #sec1 .foundation-large-card .heading-24{
  line-height:.98;
}

.foundation-index-page #sec1 .foundation-main-card svg,
.foundation-index-page #sec1 .foundation-large-card svg,
.foundation-index-page #sec1 > a svg{
  opacity:.92;
}

.foundation-index-page .foundation-flow-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  border-top:1px solid color-mix(in srgb, var(--color-secondary) 18%, transparent);
  border-bottom:1px solid color-mix(in srgb, var(--color-secondary) 18%, transparent);
}

.foundation-index-page .foundation-flow-grid span{
  position:relative;
  display:flex;
  align-items:center;
  min-height:4.8rem;
  padding:0 1.2rem;
  border-right:1px solid color-mix(in srgb, var(--color-secondary) 18%, transparent);
  font-size:1.1rem;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.foundation-index-page .foundation-flow-grid span:last-child{
  border-right:0;
}

.foundation-index-page .foundation-flow-grid span:not(:last-child)::after{
  content:"";
  position:absolute;
  right:-.45rem;
  top:50%;
  width:.8rem;
  height:.8rem;
  border-top:1px solid var(--color-secondary);
  border-right:1px solid var(--color-secondary);
  background:var(--color-primary);
  transform:translateY(-50%) rotate(45deg);
  z-index:1;
}

.foundation-index-page .foundation-mini-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}

.foundation-index-page .foundation-mini-tags span{
  border:1px solid color-mix(in srgb, var(--color-secondary) 14%, transparent);
  padding:.18rem .5rem .12rem;
  font-size:.78rem;
  line-height:1;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:color-mix(in srgb, var(--color-secondary) 68%, transparent);
}

.foundation-index-page .foundation-card-lines{
  display:flex;
  flex-direction:column;
  gap:.65rem;
}

.foundation-index-page .foundation-card-lines > div{
  display:grid;
  grid-template-columns:6.2rem 1fr;
  gap:.7rem;
  align-items:start;
  border-top:1px solid color-mix(in srgb, var(--color-secondary) 14%, transparent);
  padding-top:.55rem;
}

.foundation-index-page .foundation-card-lines > div > div:first-child{
  font-size:.85rem;
  line-height:1;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:color-mix(in srgb, var(--color-secondary) 45%, transparent);
}

.foundation-index-page .main-column .box-inner{
  background:var(--color-primary);
}

.foundation-index-page .main-column .terms{
  padding:2.4rem 1.4rem 1.4rem !important;
}

.foundation-index-page .foundation-nav-kicker{
  font-size:.82rem;
  line-height:1;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--color-secondary);
  opacity:.45;
  margin-bottom:.85rem;
}

.foundation-index-page .foundation-nav-title{
  padding:.4rem 0 1.55rem;
  margin-bottom:.25rem;
  border-bottom:1px solid color-mix(in srgb, var(--color-secondary) 16%, transparent);
}

.foundation-index-page .foundation-nav-title h11{
  display:block;
  text-align:left;
  transform:none;
  font-size:2.1rem;
  line-height:.95;
  letter-spacing:0;
  font-weight:600;
}

.foundation-index-page .main-column h2{
  width:100%;
  max-width:25rem;
  line-height:.98;
  margin-bottom:1.8rem !important;
}

.foundation-index-page .main-column .anchor{
  margin-top:0 !important;
  padding:0 !important;
  border-top:1px solid color-mix(in srgb, var(--color-secondary) 14%, transparent);
}

.foundation-index-page .main-column .anchor:first-of-type{
  border-top:0;
}

.foundation-index-page .main-column .anchor a{
  display:grid;
  grid-template-columns:2.6rem 1fr 1.8rem;
  align-items:center;
  min-height:4.4rem;
  padding:.85rem .9rem;
  gap:.75rem;
  transition:background-color .18s ease,color .18s ease;
}

.foundation-index-page .main-column .anchor a span{
  font-size:.82rem;
  line-height:1;
  letter-spacing:.08em;
  opacity:.38;
}

.foundation-index-page .main-column .anchor a h10{
  font-size:1.28rem !important;
  line-height:1.05 !important;
  letter-spacing:0 !important;
}

.foundation-index-page .main-column .anchor a i{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  font-style:normal;
  font-size:1.05rem;
  line-height:1;
  opacity:.34;
  transition:color .18s ease,opacity .18s ease,transform .18s ease;
}

.foundation-index-page .main-column .anchor a span,
.foundation-index-page .main-column .anchor a h10{
  transition:color .18s ease,opacity .18s ease;
}

@media (hover:hover){
  .foundation-index-page .main-column .anchor a:hover{
    background:var(--color-secondary);
    color:var(--color-primary) !important;
  }

  .foundation-index-page .main-column .anchor a:hover span,
  .foundation-index-page .main-column .anchor a:hover h10,
  .foundation-index-page .main-column .anchor a:hover i{
    color:var(--color-primary) !important;
    opacity:1;
  }

  .foundation-index-page .main-column .anchor a:hover i{
    transform:translate(.12rem,-.12rem);
  }
}

.foundation-index-page .main-column h1{
  min-height:7.4rem;
  line-height:.9;
  font-size:clamp(3.4rem,4vw,4.8rem) !important;
  padding-bottom:1rem !important;
}

@media (max-width:1199px){
  .foundation-index-page #sec1 > a .foundation-card-hover::before{
    right:1rem;
    top:1rem;
  }

  .foundation-index-page .foundation-flow-grid{
    grid-template-columns:1fr;
  }

  .foundation-index-page .foundation-flow-grid span{
    min-height:3.8rem;
    border-right:0;
    border-bottom:1px solid color-mix(in srgb, var(--color-secondary) 14%, transparent);
  }

  .foundation-index-page .foundation-flow-grid span:last-child{
    border-bottom:0;
  }

  .foundation-index-page .foundation-flow-grid span:not(:last-child)::after{
    display:none;
  }

  .foundation-index-page .main-column h2{
    max-width:none;
  }
}

@media (max-width:1199px){
  .foundation-section1-stage,
  #sec1.foundation-system-grid{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:visible !important;
  }
}
    


/* =========================================================
   Foundation section 1 one-screen fit
   Keeps the six-card system inside the first desktop viewport.
   ========================================================= */
@media (min-width:1200px){
  .foundation-section1-stage{
    height:var(--h-available) !important;
    min-height:var(--h-available) !important;
    max-height:var(--h-available) !important;
    overflow:hidden !important;
    display:flex !important;
    flex-direction:column !important;
  }

  .foundation-section1-stage > .foundation-system-grid,
  #sec1.foundation-system-grid{
    height:100% !important;
    min-height:0 !important;
    max-height:100% !important;
    overflow:hidden !important;
    align-items:stretch !important;
    align-content:stretch !important;
    gap:1rem !important;
    --foundation-card-gap:1rem !important;
    --foundation-side-card-height:calc((var(--h-available) - 3rem) / 4) !important;
  }

  #sec1 > .foundation-small-card,
  #sec1 > .foundation-side-card{
    height:var(--foundation-side-card-height) !important;
    min-height:var(--foundation-side-card-height) !important;
    max-height:var(--foundation-side-card-height) !important;
    padding-top:0 !important;
    transform:none !important;
  }

  #sec1 > .foundation-large-card,
  #sec1 > .foundation-main-card{
    height:calc((var(--foundation-side-card-height) * 2) + var(--foundation-card-gap)) !important;
    min-height:calc((var(--foundation-side-card-height) * 2) + var(--foundation-card-gap)) !important;
    max-height:calc((var(--foundation-side-card-height) * 2) + var(--foundation-card-gap)) !important;
    padding-top:0 !important;
    transform:none !important;
  }

  #sec1 .box-parent,
  #sec1 .box,
  #sec1 .box-inner{
    height:100% !important;
    min-height:0 !important;
    max-height:100% !important;
  }

  .foundation-index-page #sec1 .p-container{
    padding-top:1.4rem !important;
    padding-bottom:1.4rem !important;
  }

  .foundation-index-page #sec1 .foundation-main-card .p-container,
  .foundation-index-page #sec1 .foundation-large-card .p-container{
    padding-top:1.6rem !important;
    padding-bottom:1.4rem !important;
  }

  .foundation-index-page #sec1 .foundation-main-card .heading-24,
  .foundation-index-page #sec1 .foundation-large-card .heading-24{
    font-size:2.05rem !important;
    line-height:1 !important;
  }

  .foundation-index-page #sec1 .foundation-main-card p,
  .foundation-index-page #sec1 .foundation-large-card p{
    margin-top:.8rem !important;
    line-height:1.42 !important;
  }

  .foundation-index-page .foundation-flow-grid span{
    min-height:3.6rem !important;
    padding-left:1rem !important;
    padding-right:1rem !important;
    font-size:.95rem !important;
  }

  .foundation-index-page .foundation-mini-tags{
    gap:.35rem !important;
  }

  .foundation-index-page .foundation-card-lines{
    gap:.45rem !important;
  }

  .foundation-index-page .foundation-card-lines > div{
    grid-template-columns:5.6rem 1fr !important;
    gap:.55rem !important;
    padding-top:.4rem !important;
  }

  .foundation-index-page #sec1 > a .foundation-card-hover::before{
    width:2rem !important;
    height:2rem !important;
    right:1rem !important;
    top:1rem !important;
  }
}

/* =========================================================
   Career Navigator minimal additions
   Most page layout now uses existing CompetitiveDevelopment/Tailwind utilities.
   ========================================================= */
.career-bg-word{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  user-select:none;
  z-index:0;
}
.career-bg-word svg{
  position:absolute;
  right:-4rem;
  bottom:12%;
  width:92%;
  height:auto;
  opacity:.14;
}
.career-bg-word text{
  font-size:170px;
  font-weight:700;
  letter-spacing:-10px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.2;
}
.career-bg-word-small svg{
  right:-3.4rem;
  bottom:9%;
  width:90%;
  opacity:.075;
}

@media (min-width:1200px){
  .career-grid-9{
    grid-template-rows:repeat(3,minmax(0,1fr));
  }
  .career-grid-9 article{
    height:100%;
  }
}

@media (max-width:1199px){
  #sec2 .grid[style*="grid-template-columns:minmax(0,.92fr)"]{
    grid-template-columns:1fr 11rem !important;
  }
  #sec2 .grid[style*="grid-template-columns:minmax(0,.92fr)"] > div:last-child{
    height:11rem !important;
  }
  #sec3 .career-grid-9{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  #sec4 .grid-cols-4{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:767px){
  #sec2 .grid[style*="grid-template-columns:minmax(0,.92fr)"]{
    grid-template-columns:1fr !important;
  }
  #sec2 .grid[style*="grid-template-columns:minmax(0,.92fr)"] > div:last-child{
    justify-content:flex-start;
    height:10.5rem !important;
    max-width:19rem;
  }
  #sec3 .career-grid-9,
  #sec4 .grid-cols-4{
    grid-template-columns:1fr;
  }
}


/* CareerNavigator: Section 2 card height tuning */
@media (max-width: 1199px){
  #sec2 .grid.grid-cols-2 > .relative.overflow-hidden[style*="min-height:16.2rem"]{
    min-height:15.6rem !important;
  }
}
@media (max-width: 767px){
  #sec2 .grid.grid-cols-2 > .relative.overflow-hidden[style*="min-height:16.2rem"]{
    min-height:17rem !important;
  }
}

/* =========================================================
   Career Navigator page styles
   Scoped to CareerNavigator.php via .career-navigator-page.
   ========================================================= */
.career-navigator-page{
  --career-paper:var(--color-primary);
  --career-ink:var(--color-secondary);
  --career-muted:rgba(var(--color-secondary-rgb)/.58);
  --career-line:var(--color-secondary);
  --career-card-line:rgba(var(--color-secondary-rgb)/.24);
  --career-strong-line:var(--color-secondary);
  background:var(--career-paper);
}
.career-navigator-page .box-parent,
.career-navigator-page .box,
.career-navigator-page .box-inner,
.career-navigator-page .career-section{
  border-color:var(--career-line) !important;
}
.career-navigator-page .career-hero,
.career-navigator-page .career-section{
  background:var(--career-paper);
}
.career-navigator-page .career-hero::before,
.career-navigator-page .career-section::before{
  content:none;
}
.career-navigator-page #sec1 .relative.z-1{
  padding-top:clamp(1rem,3vw,3rem);
}
.career-navigator-page #sec1 h11,
.career-navigator-page .career-section h11{
  color:var(--career-ink);
  max-width:12ch;
}
.career-navigator-page #sec1 p,
.career-navigator-page .career-section p,
.career-navigator-page #sec4 .body-14{
  color:var(--career-muted);
  font-size:clamp(1.18rem,.96vw,1.42rem);
  line-height:1.38;
}
.career-navigator-page .career-bg-word svg{
  right:-1.5rem;
  bottom:8%;
  width:min(90rem,88%);
  opacity:.09;
}
.career-navigator-page #sec2 .career-system-grid > a,
.career-navigator-page .career-data-card,
.career-navigator-page .career-pathway-grid > article{
  border:1px solid var(--career-card-line) !important;
  border-radius:0;
  background:var(--career-paper) !important;
}
.career-navigator-page .career-hero-points > div{
  border:0 !important;
  border-top:1px solid var(--career-card-line) !important;
  background:transparent !important;
}
.career-navigator-page #sec2 .career-system-grid > a,
.career-navigator-page .career-data-card,
.career-navigator-page .career-pathway-grid > article{
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease, background-color .28s ease;
}
.career-navigator-page #sec2 .career-system-grid > a:hover,
.career-navigator-page .career-data-card:hover,
.career-navigator-page .career-pathway-grid > article:hover{
  transform:translateY(-3px);
  border-color:var(--career-ink) !important;
  background:var(--career-ink) !important;
  color:var(--career-paper) !important;
}
.career-navigator-page #sec2 .career-system-grid > a:hover *,
.career-navigator-page .career-data-card:hover *,
.career-navigator-page .career-pathway-grid > article:hover *{
  color:var(--career-paper) !important;
}
.career-navigator-page #sec2 .career-system-grid > a:hover svg,
.career-navigator-page #sec2 .career-system-grid > a:hover svg *{
  color:var(--career-paper) !important;
  stroke:currentColor !important;
}
.career-navigator-page #sec2 .career-system-grid > a:hover .border-t-px,
.career-navigator-page .career-data-card:hover .border-t-px,
.career-navigator-page .career-data-card:hover .career-rank-badge,
.career-navigator-page .career-pathway-grid > article:hover .border-t-px{
  border-color:rgba(var(--color-primary-rgb)/.35) !important;
}
.career-navigator-page .career-data-card:hover::after,
.career-navigator-page .career-pathway-grid > article:hover::after{
  background:rgba(var(--color-primary-rgb)/.55);
}
.career-navigator-page #sec2 .career-system-grid > a{
  min-height:18rem;
}
.career-navigator-page #sec2 .career-system-grid > a svg{
  color:var(--career-ink);
}
.career-navigator-page #sec2 .flex.flex-wrap span{
  border-color:var(--career-card-line);
  border-radius:0;
  background:transparent;
  color:var(--career-muted);
}
.career-navigator-page #sec2 .career-system-grid > a p{
  margin-top:.45rem !important;
  font-size:1.05rem;
  line-height:1.08 !important;
}
.career-navigator-page #sec3{
  height:auto !important;
  min-height:var(--h-available);
  overflow:visible !important;
}
.career-navigator-page .career-data-grid{
  grid-template-rows:none !important;
  align-items:stretch;
}
.career-navigator-page .career-data-card{
  min-height:12.6rem;
  padding:1rem !important;
}
.career-navigator-page .career-rank-badge{
  border-color:var(--career-card-line);
  background:var(--career-ink);
  color:#fff;
}
.career-navigator-page .career-stat-grid b,
.career-navigator-page .career-pathway-grid b{
  color:var(--career-ink);
}
.career-navigator-page .career-data-card .body-18{
  font-size:1.42rem;
  line-height:1.08;
}
.career-navigator-page .career-data-card .career-stat-grid{
  gap:.45rem .65rem;
  margin-top:.65rem;
}
.career-navigator-page .career-data-card .career-stat-grid span{
  font-size:.82rem;
  letter-spacing:.04em;
}
.career-navigator-page .career-data-card .career-stat-grid b{
  font-size:1rem;
}
.career-navigator-page .career-data-card .border-t-px.mt-8{
  margin-top:.55rem;
  padding-top:.45rem;
}
.career-navigator-page .career-pathway-grid > article::after,
.career-navigator-page .career-data-card::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:1px;
  background:var(--career-strong-line);
  opacity:1;
}
.career-navigator-page .career-pathway-visual{
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.55rem;
  margin-top:1rem;
  padding-top:.9rem;
  border-top:1px solid var(--career-card-line);
}
.career-navigator-page .career-pathway-step{
  position:relative;
  min-height:5.8rem;
  border:1px solid var(--career-card-line);
  padding:.65rem .55rem;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.career-navigator-page .career-pathway-step::after{
  content:"";
  position:absolute;
  top:50%;
  right:-.58rem;
  width:.58rem;
  height:1px;
  background:var(--career-card-line);
}
.career-navigator-page .career-pathway-step:last-child::after{
  content:none;
}
.career-navigator-page .career-pathway-step span{
  display:block;
  font-size:.72rem;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.07em;
  color:var(--career-muted);
}
.career-navigator-page .career-pathway-step strong{
  display:block;
  margin-top:.5rem;
  font-size:.98rem;
  line-height:1.08;
  font-weight:700;
  color:var(--career-ink);
}
.career-navigator-page .career-pathway-grid > article:hover .career-pathway-step{
  border-color:rgba(var(--color-primary-rgb)/.38);
}
.career-navigator-page .career-pathway-grid > article:hover .career-pathway-step strong,
.career-navigator-page .career-pathway-grid > article:hover .career-pathway-step span{
  color:var(--career-paper) !important;
}
.career-navigator-page .career-pathway-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}
.career-navigator-page .career-pathway-grid > article{
  min-height:21rem;
}
.career-navigator-page .career-pathway-grid > article > div:first-child{
  top:-.55rem !important;
  right:0 !important;
  min-width:auto !important;
  height:auto !important;
  border:0 !important;
  background:transparent !important;
  font-size:3.2rem !important;
  line-height:1 !important;
  color:rgba(var(--color-secondary-rgb)/.08) !important;
}
.career-navigator-page .career-pathway-visual + .grid{
  display:none;
}
.career-navigator-page .career-guidance-section .p-container{
  position:relative;
}
.career-navigator-page .career-guidance-section .flex.items-end.justify-between,
.career-navigator-page .career-guidance-grid{
  position:relative;
  z-index:1;
}
.career-navigator-page .career-guidance-compass{
  position:absolute;
  top:12.8rem;
  right:clamp(.8rem,2vw,2.4rem);
  width:min(26rem,28%);
  color:var(--career-ink);
  opacity:.11;
  pointer-events:none;
  z-index:0;
}
.career-navigator-page .career-guidance-compass svg{
  width:100%;
  height:auto;
}
.career-navigator-page .career-guidance-compass text{
  fill:currentColor;
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.career-navigator-page .career-guidance-grid > article{
  position:relative;
  min-height:18rem;
  border:1px solid var(--career-card-line);
  padding:1rem;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;
  transition:background-color .28s ease, color .28s ease, border-color .28s ease, transform .28s ease;
}
.career-navigator-page .career-guidance-grid > article > span{
  position:absolute;
  top:-.55rem;
  right:0;
  font-size:3.2rem;
  line-height:1;
  font-weight:700;
  color:rgba(var(--color-secondary-rgb)/.08);
}
.career-navigator-page .career-guidance-grid h10{
  display:block;
  max-width:10rem;
  font-size:1.65rem;
  line-height:1.02;
  font-weight:700;
  text-align:left;
  letter-spacing:0;
  transform:none;
  font-stretch:normal;
}
.career-navigator-page .career-guidance-grid p{
  margin-top:2.4rem;
  max-width:13rem;
  font-size:1.05rem;
  line-height:1.18;
  color:var(--career-muted);
}
.career-navigator-page .career-guidance-grid > article:hover{
  transform:translateY(-3px);
  border-color:var(--career-ink);
  background:var(--career-ink);
  color:var(--career-paper);
}
.career-navigator-page .career-guidance-grid > article:hover h10,
.career-navigator-page .career-guidance-grid > article:hover p{
  color:var(--career-paper) !important;
}
.career-navigator-page .career-guidance-grid > article:hover > span{
  color:rgba(var(--color-primary-rgb)/.16);
}
.career-navigator-page .cd-browse-open-animated{
  border-radius:0;
  border:1px solid var(--career-ink) !important;
  background:var(--career-ink) !important;
  color:#fff !important;
  padding:.85rem 1.15rem;
}
.career-navigator-page .cd-browse-open-animated:hover{
  background:var(--career-paper) !important;
  border-color:var(--career-ink) !important;
  color:var(--career-ink) !important;
}
@media (max-width:1199px){
  .career-navigator-page .career-system-grid,
  .career-navigator-page .career-data-grid,
  .career-navigator-page .career-pathway-grid,
  .career-navigator-page .career-guidance-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    grid-template-rows:auto !important;
  }
  .career-navigator-page .career-section .flex.items-end.justify-between{
    align-items:flex-start;
    flex-direction:column;
  }
  .career-navigator-page .career-guidance-compass{
    position:relative;
    top:auto;
    right:auto;
    width:min(34rem,100%);
    margin-top:1.2rem;
    opacity:.16;
    z-index:1;
  }
}
@media (max-width:767px){
  .career-navigator-page #sec1 .relative.z-1{
    margin-top:4rem;
  }
  .career-navigator-page .career-hero-points,
  .career-navigator-page .career-system-grid,
  .career-navigator-page .career-data-grid,
  .career-navigator-page .career-pathway-grid,
  .career-navigator-page .career-guidance-grid{
    grid-template-columns:1fr !important;
    grid-template-rows:auto !important;
  }
  .career-navigator-page #sec2 .career-system-grid > a .relative.z-1.grid{
    grid-template-columns:1fr !important;
  }
  .career-navigator-page #sec2 .career-system-grid > a .relative.z-1.grid > div:last-child{
    height:9.5rem !important;
    justify-content:flex-start;
  }
  .career-navigator-page .career-pathway-visual{
    grid-template-columns:1fr;
  }
  .career-navigator-page .career-guidance-compass{
    width:100%;
  }
  .career-navigator-page .career-pathway-step::after{
    top:auto;
    right:50%;
    bottom:-.58rem;
    width:1px;
    height:.58rem;
  }
}