/* TIRHAB / Editorial Site Edition 2026
   Source-of-truth mobile responsive layout; no misleading legacy screenshots. */
html{scroll-padding-top:88px}
body{font-feature-settings:"kern" 1}
.shell{max-width:1420px}
.site-header{box-shadow:none}
.site-nav{height:73px}
.site-nav nav a{font-weight:750;font-size:13px}
.nav-cta{min-height:46px;padding-inline:19px}
.hero{background:
 radial-gradient(ellipse at 67% 0,rgba(255,90,60,.11),transparent 39%),
 radial-gradient(ellipse at 13% 100%,rgba(221,212,178,.08),transparent 33%),#111317}
.hero-inner{min-height:640px}
.hero h1{font-size:clamp(45px,4.75vw,73px);font-weight:800;line-height:1.46;letter-spacing:0}
.hero-copy>p{font-size:15px;line-height:2.1;max-width:540px}
.hero-kicker{font-weight:760}
.hero .actions{gap:12px}
.button{font-weight:780;min-height:52px;padding-inline:23px}
.button:hover{transform:translateY(-1px)}
.signature-atelier h2{font-weight:800;font-size:clamp(32px,4vw,56px);letter-spacing:0;line-height:1.5}
.signature-atelier .atelier-sub{font-size:14px;line-height:2.15}
.signature-atelier .atelier-visual{border-radius:14px}
.signature-atelier .atelier-visual strong{font-weight:760;letter-spacing:0}
.signature-atelier .atelier-work figcaption strong{font-weight:760}
.signature-atelier .atelier-summary{border-radius:15px}
.journey h2{font-weight:800;letter-spacing:0;line-height:1.5}
.story-panels h3{font-weight:750}
.app-download{border-radius:19px}
.role-stories{background:#FCFBF7;padding:clamp(63px,8vw,112px) 0;border-block:1px solid #11131712}
.role-stories-header{max-width:780px;margin-bottom:28px}
.role-stories-header span{font-size:12px;color:#B7472F;font-weight:750;letter-spacing:.02em}
.role-stories-header h2{margin:11px 0;font-size:clamp(32px,3.6vw,54px);line-height:1.5;font-weight:800}
.role-stories-header p{color:#565F5A;font-size:15px;line-height:2}
.role-stories-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.role-story{background:#F3F1EA;border-radius:22px;padding:26px;min-height:292px;display:flex;flex-direction:column;align-items:flex-start}
.role-story:first-child{background:#111317;color:#F3F1EA}
.role-story:nth-child(2){background:#E5EAE1}
.role-story:nth-child(3){background:#E5D3BC}
.role-story .role-index{font:700 11px Arial,sans-serif;letter-spacing:.15em;opacity:.7}
.role-story h3{font-size:clamp(21px,2vw,27px);margin:26px 0 10px;font-weight:800;line-height:1.5}
.role-story p{margin:0;font-size:13px;line-height:2;opacity:.78}
.role-story a{display:inline-flex;align-items:center;gap:9px;margin-top:auto;padding-top:22px;
  color:inherit;text-decoration:underline;text-underline-offset:6px;font-weight:750;font-size:13px}
.role-story a:focus-visible{outline:3px solid #FF5A3C;outline-offset:4px}
@media(max-width:980px){.role-stories-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
 .site-nav{height:69px}
 .hero-copy{padding-top:38px}
 .hero h1{font-size:clamp(34px,8.8vw,50px);line-height:1.55}
 .hero-copy>p{font-size:14px;line-height:2}
 .hero-object{margin-top:8px}
 .signature-atelier h2{font-size:clamp(29px,8vw,46px)}
 .role-stories{padding-block:60px}
 .role-stories-header h2{font-size:33px}
 .role-stories-grid{grid-template-columns:1fr;gap:12px}
 .role-story{min-height:220px;padding:23px;border-radius:18px}
 .role-story h3{margin:17px 0 8px}
}
@media(prefers-reduced-motion:reduce){.role-story a,.button{transition:none!important;transform:none!important}}
