.d001{background: #A3A1B1; color: #17233F; font-family: 'Space Grotesk', 'Helvetica Neue', sans-serif; overflow: hidden}
.d002{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px 32px; padding: 26px clamp(20px, 5vw, 80px); border-bottom: 1px solid #17233F}
.d003{display: flex; align-items: center; gap: 14px; text-decoration: none; color: #17233F; font-weight: 500; font-size: 24px; line-height: 1; letter-spacing: 0.5px}
.d004{position: relative; width: 34px; height: 34px; flex: 0 0 auto}
.d005{position: absolute; left: 0; bottom: 0; width: 24px; height: 24px; border-radius: 50%; background: #4433E0}
.d006{position: absolute; right: 0; top: 0; width: 18px; height: 18px; border: 1.5px solid #EC6453; transform: rotate(45deg); box-sizing: border-box}
.d007{display: block; font-weight: 400; font-size: 11px; letter-spacing: 3.5px; margin-top: 6px}
.d008{display: flex; flex-wrap: wrap; align-items: center; gap: 8px 30px; font-size: 16px}
.d009{color: #17233F; text-decoration: none; padding: 12px 0}
.d010{background: #4433E0; color: #FFFFFF; text-decoration: none; padding: 13px 22px}
.d011{display: flex; flex-wrap: wrap; align-items: center; gap: 48px 64px; padding: clamp(48px, 6vw, 96px) clamp(20px, 5vw, 80px)}
.d012{flex: 1 1 520px; min-width: 0}
.d013{margin: 0 0 26px; font-size: 13px; letter-spacing: 2px; line-height: 1.7}
.d014{margin: 0; font-weight: 400; font-size: clamp(52px, 6.8vw, 106px); line-height: 1; letter-spacing: -0.035em}
.d015{margin: 34px 0 34px; max-width: 480px; font-size: 20px; line-height: 1.55}
.d016{display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px}
.d017{background: #4433E0; color: #FFFFFF; text-decoration: none; font-weight: 500; font-size: 18px; padding: 18px 28px}
.d018{color: #17233F; font-weight: 500; font-size: 18px; text-underline-offset: 6px; text-decoration-thickness: 1px; padding: 12px 0}
.d019{flex: 1 1 440px; min-width: 0}
.d020{display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(10px, 1.6vw, 22px); max-width: 520px; margin: 0 auto}
.d021{aspect-ratio: 1; border-radius: 50%; border: 1.5px solid #17233F; box-sizing: border-box}
.d022{aspect-ratio: 1; border-radius: 50%; background: #EC6453; transform: scale(1.35)}
.d023{display: flex; flex-wrap: wrap; border-top: 1px solid #17233F; border-bottom: 1px solid #17233F; font-size: 19px}
.d024{flex: 1 1 240px; display: flex; align-items: center; gap: 14px; padding: 22px clamp(20px, 3vw, 40px); border-right: 1px solid #17233F}
.d025{width: 16px; height: 16px; border-radius: 50%; background: #4433E0; flex: 0 0 auto}
.d026{width: 16px; height: 16px; background: #EC6453; flex: 0 0 auto}
.d027{width: 13px; height: 13px; border: 1.5px solid #17233F; transform: rotate(45deg); box-sizing: border-box; flex: 0 0 auto}
.d028{flex: 1 1 240px; display: flex; align-items: center; gap: 14px; padding: 22px clamp(20px, 3vw, 40px)}
.d029{width: 18px; height: 9px; border-radius: 0 0 18px 18px; background: #D9BE1B; flex: 0 0 auto}
.d030{background: #4433E0; color: #FFFFFF; display: flex; flex-wrap: wrap; align-items: center; gap: 48px 80px; padding: clamp(48px, 6vw, 88px) clamp(20px, 5vw, 80px) clamp(72px, 8vw, 120px)}
.d031{flex: 0 1 400px; min-width: 0; margin: 0; text-align: center}
.d032{display: block; width: 100%; aspect-ratio: 1; object-fit: cover; object-position: 50% 20%; border-radius: 50%; border: 10px solid #D9BE1B; box-sizing: border-box}
.d033{margin-top: 22px; font-size: 16px; line-height: 1.55; color: #FFFFFF}
.d034{flex: 1 1 480px; min-width: 0; max-width: 680px}
.d035{margin: 0 0 16px; font-size: 13px; letter-spacing: 2px; color: #FFFFFF}
.d036{margin: 0 0 28px; font-weight: 400; font-size: clamp(40px, 4.8vw, 72px); line-height: 1.02; letter-spacing: -0.03em}
.d037{margin: 0 0 18px; font-size: 19px; line-height: 1.7}
.d038{margin: 0 0 26px; font-size: 19px; line-height: 1.7}
.d039{margin: 0; font-weight: 500; font-size: 22px; line-height: 1.4; color: #D9BE1B; max-width: 520px}
.d040{background: #17233F; color: #FFFFFF; padding: clamp(64px, 8vw, 112px) clamp(20px, 5vw, 80px)}
.d041{max-width: 760px}
.d042{margin: 0 0 18px; font-size: 13px; letter-spacing: 2px; color: #D9BE1B}
.d043{margin: 0; font-weight: 400; font-size: clamp(38px, 4.6vw, 70px); line-height: 1.03; letter-spacing: -0.03em}
.d044{margin: 22px 0 0; font-size: 19px; line-height: 1.6; max-width: 520px}
.d045{display: flex; flex-wrap: wrap; gap: 28px; margin-top: 64px}
.d046{flex: 1 1 340px; min-width: 0; background: #4433E0; color: #FFFFFF; padding: 28px; display: flex; flex-direction: column; gap: 32px; min-height: 420px; box-sizing: border-box}
.d047{display: flex; justify-content: space-between; align-items: flex-start; gap: 16px}
.d048{margin: 0; font-weight: 400; font-size: 30px; line-height: 1.12; letter-spacing: -0.02em}
.d049{font-size: 15px}
.d050{width: 56%; margin: auto; display: flex; flex-direction: column; align-items: center}
.d051{width: 72%; aspect-ratio: 2 / 1; border-radius: 999px 999px 0 0; background: #D9BE1B}
.d052{width: 100%; height: 1.5px; background: #FFFFFF}
.d053{margin: 0; font-size: 16px; line-height: 1.5}
.d054{flex: 1 1 340px; min-width: 0; background: #EC6453; color: #17233F; padding: 28px; display: flex; flex-direction: column; gap: 32px; min-height: 420px; box-sizing: border-box}
.d055{width: 44%; height: 130px; margin: auto; display: flex; align-items: flex-end; gap: 10%; border-bottom: 1.5px solid #17233F}
.d056{flex: 1 1 0; height: 38%; background: #17233F}
.d057{flex: 1 1 0; height: 64%; background: #17233F}
.d058{flex: 1 1 0; height: 100%; background: #17233F}
.d059{flex: 1 1 340px; min-width: 0; background: #D9BE1B; color: #17233F; padding: 28px; display: flex; flex-direction: column; gap: 32px; min-height: 420px; box-sizing: border-box}
.d060{width: 58%; margin: auto; display: flex; align-items: center; justify-content: center}
.d061{width: 58%; aspect-ratio: 1; border-radius: 50%; background: #17233F}
.d062{width: 58%; aspect-ratio: 1; border-radius: 50%; border: 1.5px solid #17233F; box-sizing: border-box; margin-left: -22%}
.d063{flex: 1 1 340px; min-width: 0; background: #C9C8CE; color: #17233F; padding: 28px; display: flex; flex-direction: column; gap: 32px; min-height: 420px; box-sizing: border-box}
.d064{width: 40%; aspect-ratio: 1; margin: auto; border-radius: 50%; border: 1.5px solid #17233F; box-sizing: border-box; padding: 13%; display: flex}
.d065{flex: 1 1 auto; border-radius: 50%; border: 1.5px solid #17233F; box-sizing: border-box; padding: 18%; display: flex}
.d066{flex: 1 1 auto; border-radius: 50%; background: #4433E0}
.d067{flex: 1 1 340px; min-width: 0; background: #A3A1B1; color: #17233F; padding: 28px; display: flex; flex-direction: column; gap: 32px; min-height: 420px; box-sizing: border-box}
.d068{width: 30%; aspect-ratio: 1; margin: auto; border: 1.5px solid #17233F; box-sizing: border-box; display: flex; align-items: center; justify-content: center; transform: rotate(45deg)}
.d069{width: 56%; aspect-ratio: 1; border-radius: 50%; background: #EC6453}
.d070{flex: 1 1 340px; min-width: 0; background: #F1F0F4; color: #17233F; padding: 28px; display: flex; flex-direction: column; gap: 32px; min-height: 420px; box-sizing: border-box}
.d071{width: 62%; margin: auto; display: flex; align-items: center; gap: 8%}
.d072{flex: 1 1 0; aspect-ratio: 1; border-radius: 50%; background: #EC6453}
.d073{flex: 1 1 0; aspect-ratio: 1; background: #4433E0}
.d074{flex: 1 1 0; aspect-ratio: 1; border-radius: 999px 999px 0 0; background: #D9BE1B}
.d075{padding: clamp(40px, 5vw, 72px) clamp(20px, 5vw, 80px) clamp(72px, 8vw, 120px)}
.d076{margin: 0 0 16px; font-size: 13px; letter-spacing: 2px; color: #17233F}
.d077{margin: 0; font-weight: 400; font-size: clamp(40px, 4.8vw, 72px); line-height: 1.02; letter-spacing: -0.03em}
.d078{display: flex; flex-wrap: wrap; gap: 48px 0; margin-top: 64px}
.d079{flex: 1 1 280px; min-width: 0}
.d080{display: flex; align-items: center}
.d081{flex: 0 0 auto; width: 76px; height: 76px; border-radius: 50%; background: #FFFFFF; border: 1.5px solid #17233F; box-sizing: border-box; display: flex; align-items: center; justify-content: center; font-weight: 500; font-size: 26px}
.d082{flex: 1 1 auto; border-top: 1.5px solid #17233F}
.d083{margin: 24px 32px 10px 0; font-weight: 500; font-size: 28px; line-height: 1.15; letter-spacing: -0.02em}
.d084{margin: 0 40px 0 0; font-size: 17px; line-height: 1.65}
.d085{flex: 0 0 auto; width: 76px; height: 76px; border-radius: 50%; background: #D9BE1B; border: 1.5px solid #17233F; box-sizing: border-box; display: flex; align-items: center; justify-content: center; font-weight: 500; font-size: 26px}
.d086{position: relative; background: #EC6453; color: #17233F; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-end; gap: 40px 72px; padding: clamp(72px, 9vw, 128px) clamp(20px, 5vw, 80px)}
.d087{position: absolute; right: -9%; top: -32%; width: 38%; aspect-ratio: 1; border-radius: 50%; background: #17233F}
.d088{position: relative; flex: 1 1 520px; min-width: 0}
.d089{margin: 0 0 18px; font-size: 13px; letter-spacing: 2px}
.d090{margin: 0; font-size: 19px; line-height: 1.55}
.d091{margin: 0; font-weight: 400; font-size: clamp(48px, 6.6vw, 104px); line-height: 1; letter-spacing: -0.035em}
.d092{position: relative; flex: 1 1 360px; min-width: 0; max-width: 460px; display: flex; flex-direction: column; align-items: flex-start; gap: 20px}
.d093{background: #17233F; color: #FFFFFF; text-decoration: none; font-weight: 500; font-size: 20px; padding: 18px 36px}
.d094{color: #17233F; font-weight: 500; font-size: 17px; text-underline-offset: 5px; overflow-wrap: anywhere; padding: 8px 0}
.d095{font-size: 15px; line-height: 1.5}
.d096{background: #17233F; color: #FFFFFF; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; padding: 30px clamp(20px, 5vw, 80px) 38px}
.d097{font-weight: 500; font-size: 22px; line-height: 1; letter-spacing: 0.5px}
.d098{display: block; font-weight: 400; font-size: 10px; letter-spacing: 3.5px; margin-top: 6px; color: #D9BE1B}
.d099{margin: 0; font-size: 15px; line-height: 1.55}
.d100{display: flex; gap: 28px; font-size: 15px}
.d101{color: #FFFFFF; padding: 12px 0}

/* Layout: preserve the supplied design while making each breakpoint deliberate. */
:root{--gutter:max(clamp(20px,5vw,80px),calc((100vw - 1440px)/2));color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:24px}
body{min-width:280px}
.site-shell{overflow:visible}
img{max-width:100%;height:auto}
section,article,figure{min-width:0}
h1,h2,h3,p{overflow-wrap:break-word}
a{touch-action:manipulation}
a:focus-visible{outline:3px solid currentColor;outline-offset:5px}
.skip-link{position:absolute;left:20px;top:-80px;z-index:10;background:white;color:#17233f;padding:14px}
.skip-link:focus{top:12px}
.site-header,main>section,.site-footer{padding-inline:var(--gutter)}
.hero{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(32px,5vw,72px);align-items:center}
.hero h1{font-size:clamp(48px,6.1vw,96px);line-height:1.03;max-width:12ch}
.hero>.hero-art{width:100%;max-width:520px;justify-self:center}
.hero>.hero-art>div{width:100%}
.service-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));font-size:clamp(15px,1.35vw,19px)}
.service-strip>span{padding:22px clamp(16px,2.3vw,36px);min-width:0}
#about{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.4fr);gap:clamp(40px,6vw,80px)}
#about figure{width:100%;max-width:400px;justify-self:center}
#about>div{max-width:680px}
#services>div:last-child{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:48px}
#services article{min-height:430px;padding:28px;gap:28px;display:grid;grid-template-rows:auto minmax(130px,1fr) auto}
#services article h3{font-size:clamp(25px,2.2vw,30px)}
#services article>div[aria-hidden]{align-self:center;justify-self:center;margin:auto}
/* Percentage padding was stretching this concentric-circle illustration. */
#services article:nth-child(4)>div[aria-hidden]{width:140px;max-width:70%;padding:26px;aspect-ratio:1}
#services article:nth-child(4)>div[aria-hidden]>div{padding:16px}
.process>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:48px}
.process article p{margin-right:28px}
#contact{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,5vw,72px);isolation:isolate}
#contact>div[aria-hidden]{width:clamp(160px,22vw,360px);right:-10%;top:-25%;z-index:-1;pointer-events:none}
#contact h2{font-size:clamp(42px,5.1vw,80px);line-height:1.04;margin-top:24px}
#contact>div:not([aria-hidden]){max-width:none;min-width:0}
#contact a{max-width:100%;overflow-wrap:anywhere}
.site-footer{gap:24px 40px}
@media(hover:hover) and (pointer:fine){#services .pr-cover:hover{transform:translateY(-6px)}}
@media(hover:none){.pr-cover:hover{transform:none}}
@media(min-width:701px) and (max-width:1100px){
.service-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
.service-strip>span:nth-child(2){border-right:0}
.service-strip>span:nth-child(-n+2){border-bottom:1px solid #17233F}
#services>div:last-child{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1000px){
#about{grid-template-columns:minmax(200px,.7fr) minmax(0,1.3fr);gap:36px}
#about h2{font-size:clamp(38px,4.8vw,52px)}
#about p:not(:first-child){font-size:18px}
#contact{grid-template-columns:1fr;gap:32px}
#contact>div:not([aria-hidden]){max-width:680px}
#contact>div[aria-hidden]{width:180px;top:-95px;right:-70px}
}
@media(max-width:800px){
.site-header{gap:22px;padding-block:24px}
.site-header nav{gap:8px 20px}
.hero{grid-template-columns:1fr;gap:42px;padding-block:48px}
.hero h1{font-size:clamp(46px,8.4vw,68px);max-width:16ch}
.hero>div:first-child>p:nth-of-type(2){max-width:600px;font-size:18px;margin-block:26px}
.hero>.hero-art{max-width:380px}
#about{grid-template-columns:1fr;gap:36px;padding-block:56px}
#about figure{max-width:300px}
#about>div{max-width:680px;justify-self:center}
#about h2{font-size:clamp(38px,6vw,54px)}
}
@media(max-width:700px){
.service-strip{grid-template-columns:repeat(2,minmax(0,1fr));font-size:15px}
.service-strip>span{padding:18px 16px;gap:10px}
.service-strip>span:nth-child(2){border-right:0}
.service-strip>span:nth-child(-n+2){border-bottom:1px solid #17233F}
#services{padding-block:56px}
#services>div:last-child{grid-template-columns:1fr;gap:24px;margin-top:36px}
#services article{min-height:360px;gap:24px}
#services article h3{font-size:28px;max-width:18ch}
#services article>div[aria-hidden]{max-width:170px}
.process{padding-block:56px}
.process>div{grid-template-columns:1fr;gap:32px;margin-top:36px}
.process article{display:grid;grid-template-columns:60px minmax(0,1fr);column-gap:22px;align-items:start}
.process article>div{grid-row:1 / 3}
.process article>div>span:first-child{width:60px;height:60px;font-size:22px}
.process article>div>span[aria-hidden]{display:none}
.process article h3{margin:0 0 12px;font-size:26px}
.process article p{margin:0}
#contact{padding-block:56px}
#contact h2{font-size:clamp(40px,8.5vw,58px)}
.site-footer{align-items:flex-start;flex-direction:column}
}
@media(max-width:480px){
.site-header nav{width:100%;justify-content:space-between;font-size:15px;gap:10px}
.site-header nav .pr-btn{padding:12px 18px}
.hero>div:first-child>p:first-child{font-size:11px;letter-spacing:1.4px}
.hero>div:first-child>div{align-items:flex-start;gap:12px}
.hero .pr-btn{padding:16px 20px;font-size:16px}
.hero>.hero-art{max-width:280px}
#about figure{max-width:260px}
#about h2{font-size:38px}
#about p:not(:first-child){font-size:17px;line-height:1.65}
#services article{padding:24px}
.process h2{font-size:38px}
#contact>div>p:not(:first-child){font-size:17px}
#contact a[href^="mailto:"]:not(:first-child){font-size:16px}
}
@media(max-width:350px){
.service-strip{grid-template-columns:1fr}
.service-strip>span{border-right:0;border-bottom:1px solid #17233F}
.service-strip>span:last-child{border-bottom:0}
.hero h1{font-size:42px}
#about h2{font-size:34px}
}
@media(prefers-reduced-motion:reduce){.pr-cover:hover{transform:none}.pr-cover,.pr-btn{transition:none}}

/* Compact, text-led introduction — October 8 content revision. */
.hero{display:block;padding-block:clamp(32px,4vw,56px)}
.hero>.hero-copy{width:100%;max-width:1100px;margin:0}
.hero h1{max-width:23ch;font-size:clamp(44px,5.6vw,80px);line-height:1.03;text-wrap:balance}
.hero>.hero-copy>p:first-child{margin-bottom:20px}
.hero>.hero-copy>p:nth-of-type(2){max-width:700px;font-size:19px;line-height:1.55;margin-block:24px}
@media(max-width:700px){
.hero{padding-block:32px 36px}
.hero h1{font-size:clamp(40px,8.5vw,58px);max-width:19ch}
.hero>.hero-copy>p:nth-of-type(2){font-size:17px;margin-block:22px}
}
