/* The original page uses only styles.css. These refinements are opt-in. */
.heritage .site-footer{padding-bottom:90px}
.button:disabled{opacity:.7;cursor:wait;transform:none}
.form-status[data-state="error"]{background:#f5e8df;border-color:#9a3930}
.information-page{max-width:800px;padding-block:65px}
.information-page h1{font-size:clamp(42px,6vw,64px);margin:18px 0 30px}
.information-page h2{font-size:30px;margin:32px 0 12px}
.information-page p{margin-bottom:20px;color:var(--muted)}
.information-page .button{margin-top:16px}
.motion-toggle{border:0;border-bottom:1px solid #c6ab74;padding:5px 0;background:transparent;color:inherit;font-size:12px}
.motion-toggle[hidden]{display:none}
@keyframes welcome-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes portrait-float{0%,100%{transform:translateY(0) rotate(-.6deg)}50%{transform:translateY(-7px) rotate(.6deg)}}
@keyframes rule-in{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(prefers-reduced-motion:no-preference){
  .motion .heritage-copy>.eyebrow{animation:welcome-in .65s .05s both}
  .motion .heritage-copy>h1{animation:welcome-in .8s .15s both}
  .motion .heritage-copy>.intro{animation:welcome-in .8s .28s both}
  .motion .local-rule{animation:rule-in .9s .35s both;transform-origin:left}
  .motion .meet-small{animation:welcome-in .8s .4s both}
  .motion #connect{animation:welcome-in .9s .3s both}
  .motion .meet-small .portrait{animation:portrait-float 7s 1.3s ease-in-out infinite}
  .motion .form-card{transition:box-shadow .4s ease,border-color .4s ease}
  .motion .form-card:hover,.motion .form-card:focus-within{box-shadow:11px 13px 0 #e9e1d1;border-color:#b29c71}
  .motion .arrow{transition:transform .25s ease}
  .motion .button:hover .arrow,.motion .button:focus-visible .arrow{transform:translate(3px,-3px)}
  .motion .header-link{transition:letter-spacing .25s ease}
  .motion .header-link:hover{letter-spacing:.04em}
}
.motion[data-motion="paused"] *,.motion[data-motion="paused"] *:before,.motion[data-motion="paused"] *:after{animation-play-state:paused!important;transition:none!important}
.motion[data-motion="paused"] .heritage-copy>.eyebrow,.motion[data-motion="paused"] .heritage-copy>h1,.motion[data-motion="paused"] .heritage-copy>.intro,.motion[data-motion="paused"] .local-rule,.motion[data-motion="paused"] .meet-small,.motion[data-motion="paused"] #connect{animation:none!important}
@media(prefers-reduced-motion:reduce){.motion-toggle{display:none}}

/* Same invitation, with the introduction above and the people beside the form. */
.rearranged-main{padding:54px 0 65px}
.rearranged-hero{text-align:center;max-width:900px;margin:0 auto 43px}
.rearranged-hero h1{font-size:clamp(48px,5.2vw,72px)}
.rearranged .rearranged-hero .intro{max-width:650px;margin-inline:auto}
.rearranged-content{display:grid;grid-template-columns:1.1fr .9fr;gap:90px;align-items:center;max-width:1040px;margin:auto}
.rearranged-welcome{padding:24px 0;text-align:center}
.rearranged .meet-small{display:flex;flex-direction:column;gap:24px}
.rearranged .meet-small img{width:330px;max-width:100%}
.rearranged .meet-small h2{font-size:36px;margin-bottom:13px}
.rearranged .meet-small p{font-size:18px;line-height:1.6;max-width:280px;margin:auto}
.rearranged .meet-small>div:before{content:'✦';display:block;color:var(--gold);font-size:18px;margin-bottom:22px}
@media(max-width:1050px){.rearranged-content{gap:45px}.rearranged .meet-small img{width:285px}}
@media(max-width:900px){.rearranged-main{padding-top:35px}.rearranged-hero{margin-bottom:30px}.rearranged-hero h1{font-size:clamp(44px,7.5vw,63px)}.rearranged-content{grid-template-columns:1fr;gap:33px;max-width:640px}.rearranged-welcome{grid-row:1;padding:0 0 6px}.rearranged .meet-small{flex-direction:row;gap:25px;justify-content:center;text-align:left}.rearranged .meet-small img{width:200px}.rearranged .meet-small h2{font-size:29px}.rearranged .meet-small p{font-size:16px}.rearranged .meet-small>div:before{margin-bottom:12px}}
@media(max-width:500px){.rearranged .meet-small{gap:16px}.rearranged .meet-small img{width:145px}.rearranged .meet-small h2{font-size:25px}.rearranged .meet-small p{font-size:15px}.rearranged .meet-small>div:before{display:none}.rearranged-hero h1{font-size:44px;letter-spacing:-1.8px}.motion .preview-links{gap:13px;align-items:center}.motion .preview-links>span{display:none}}
@media(max-width:380px){.rearranged .meet-small img{width:120px}.rearranged-hero h1{font-size:39px}.rearranged .meet-small h2{font-size:23px}}

/* All comparison cards now belong to the chosen heritage family. */
.heritage-mini{background:#f1eadc;height:310px;padding:25px 28px}
.heritage-mini .mini-logo{width:42px;margin-bottom:16px}
.heritage-mini h2{font-family:var(--display);font-size:29px;max-width:none;letter-spacing:-.6px}
.mini-layout{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:18px}
.mini-portraits{width:80px;height:auto;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500'%3E%3Ccircle cx='159' cy='160' r='144' fill='white'/%3E%3Ccircle cx='342' cy='342' r='144' fill='white'/%3E%3C/svg%3E");mask-size:100% 100%}
.mini-form{width:115px;padding:12px;background:#fffdf8;border:1px solid var(--line);box-shadow:4px 4px 0 #e3dac7}
.mini-form i{display:block;height:8px;margin-bottom:5px;border:1px solid #d7cfbd}
.mini-form b{display:block;height:10px;background:var(--ink);margin-top:8px}
.mini-motion-new .mini-portraits{transform:translateY(-6px) rotate(-4deg)}
.mini-motion-new .mini-layout:before{content:'↗';position:absolute;bottom:49px;left:114px;color:var(--gold);font-size:29px}
.mini-rearranged-new{text-align:center}
.mini-rearranged-new .mini-logo{margin-inline:auto}
.mini-rearranged-new .mini-layout{flex-direction:row-reverse;justify-content:center}
.mini-rearranged-new .mini-portraits{width:93px}
.heritage-comparison .concept-info h2{font-size:28px}
.heritage-comparison .concept-info p{min-height:106px}
@media(max-width:1050px) and (min-width:901px){.heritage-mini{padding-inline:20px}.heritage-mini h2{font-size:25px}.heritage-comparison .concept-info h2{font-size:25px}.heritage-comparison .concept-info p{min-height:160px}}
@media(max-width:900px){.heritage-mini{height:310px}.heritage-mini h2{font-size:32px;max-width:none}.mini-layout{max-width:300px}.mini-rearranged-new .mini-layout{margin-inline:auto}.heritage-comparison .concept-info p{min-height:0}}
