.mas-fraternite-page { --fraternite-green: #123b31; }
.mas-fraternite-hero { padding-top:clamp(38px,6vw,90px); background:var(--fraternite-green); color:#fff; }
.mas-fraternite-title > .mas-text-link { margin-bottom:clamp(32px,5vw,64px); font-size:11px; }
.mas-fraternite-title h1 { max-width:1200px; margin:20px 0 28px; font-size:clamp(42px,6.2vw,96px); font-weight:450; line-height:1; letter-spacing:-.055em; text-wrap:balance; }
.mas-fraternite-lead { max-width:46ch; margin:0 0 45px; color:#d8e7de; font-size:clamp(17px,1.8vw,24px); line-height:1.5; }
.mas-fraternite-cover { margin-block:0; padding-bottom:24px; }
.mas-fraternite-cover img { display:block; width:100%; height:auto; border-radius:3px; }
.mas-fraternite-cover figcaption { margin-top:14px; font-size:12px; line-height:1.6; color:#d8e7de; }
.mas-fraternite-page .mas-case-overview { padding-block:clamp(64px,9vw,125px); }
.mas-fraternite-page .mas-case-copy dl div { grid-template-columns:minmax(0,130px) minmax(0,1fr); }
.mas-fraternite-page .mas-case-copy dt { letter-spacing:.04em; overflow-wrap:anywhere; }
.mas-fraternite-transformation { padding-bottom:clamp(70px,9vw,120px); }
.mas-fraternite-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(22px,3vw,44px); }
.mas-fraternite-image { margin:0; min-width:0; }
.mas-fraternite-image .mas-project-visual { display:block; position:relative; width:100%; border-radius:6px; }
.mas-fraternite-image img { display:block; width:100%; height:auto; aspect-ratio:3/4; object-fit:contain; }
.mas-fraternite-label { position:absolute; top:16px; left:16px; padding:9px 16px; background:var(--fraternite-green); color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:30px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.mas-fraternite-image figcaption { margin-top:16px; max-width:50ch; color:#4e5a55; font-size:14px; line-height:1.65; }
.mas-fraternite-method { border-top:1px solid var(--mas-line,#dde3df); padding-top:clamp(40px,6vw,80px); }
.mas-fraternite-method > h2 { max-width:800px; font-size:clamp(36px,4.5vw,66px); line-height:1.05; font-weight:450; letter-spacing:-.045em; }
.mas-fraternite-method ol { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(26px,4vw,60px); list-style:none; margin:44px 0; padding:0; }
.mas-fraternite-method li { padding-top:24px; border-top:2px solid var(--fraternite-green); }
.mas-fraternite-method li > span { font-size:12px; color:#64736b; }
.mas-fraternite-method h3 { margin:18px 0 12px; font-size:25px; font-weight:500; letter-spacing:-.02em; }
.mas-fraternite-method li p { margin:0; color:#4e5a55; line-height:1.7; }
.mas-fraternite-page button:focus-visible { outline:3px solid #e4b737; outline-offset:5px; }
@media(max-width:760px) {
 .mas-fraternite-pair,.mas-fraternite-method ol { grid-template-columns:minmax(0,1fr); }
 .mas-fraternite-hero { padding-top:32px; }
 .mas-fraternite-title h1 { font-size:clamp(37px,10.5vw,64px); }
 .mas-fraternite-title > .mas-text-link { margin-bottom:34px; }
 .mas-fraternite-lead { margin-bottom:30px; }
 .mas-fraternite-page .mas-case-copy dl div { grid-template-columns:110px minmax(0,1fr); }
 .mas-fraternite-method ol { gap:30px; }
}
