.cui-page{
  background:#fdfdfb;
  color:#111;
  font-family:"Source Sans 3",Arial,sans-serif;
}
.cui-page .home-brand{
  color:#c98a00;
  flex-direction:column;
  gap:2px;
  letter-spacing:.14em;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:13px;
}
.cui-page .home-brand img{
  width:44px;
  height:44px;
  object-fit:cover;
  border-radius:0;
}
.cui-page .home-nav>a[aria-current="page"]{
  color:#c98a00;
  box-shadow:inset 0 -2px 0 #c98a00;
}
.cui-page .nav-auth{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.cui-page .nav-auth svg{
  width:16px;
  height:16px;
}

.cui-title{
  margin:36px auto 28px;
  text-align:center;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(28px,4vw,42px);
  font-weight:700;
  letter-spacing:.04em;
  color:#111;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
}
.cui-title::before,
.cui-title::after{
  content:"";
  height:1px;
  width:min(16vw,120px);
  background:#c98a00;
}

.cui-list{
  max-width:1080px;
  margin:0 auto;
  padding:0 24px 48px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.cui-card{
  display:grid;
  grid-template-columns:190px 56px 1fr 72px;
  gap:16px;
  align-items:center;
  background:#fff;
  border:1px solid #d4b56a;
  border-radius:14px;
  padding:10px 14px 10px 10px;
}
.cui-card img{
  width:100%;
  height:108px;
  object-fit:cover;
  border-radius:10px;
  display:block;
}
.cui-ico,
.cui-mark{
  width:48px;
  height:48px;
  border:1.5px solid #c98a00;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#c98a00;
  justify-self:center;
}
.cui-mark{
  width:58px;
  height:58px;
  border:0;
}
.cui-ico svg,
.cui-mark svg{
  width:26px;
  height:26px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.cui-mark svg{width:34px;height:34px}
.cui-copy h2{
  margin:0 0 6px;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(16px,2vw,22px);
  font-weight:700;
  letter-spacing:.03em;
  color:#111;
}
.cui-copy p{
  margin:0;
  color:#444;
  font-size:15px;
  line-height:1.55;
}

.cui-foot{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:16px;
  padding:22px 28px 28px;
  background:#fff;
}
.cui-foot p{
  margin:0;
  text-align:center;
  color:#333;
  font-size:14px;
}
.cui-social{display:flex;gap:8px;flex-wrap:wrap}
.cui-social a{
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#c98a00;
  border:1.5px solid #c98a00;
  text-decoration:none;
}
.cui-social svg{width:16px;height:16px;fill:currentColor}
.cui-social .is-unset{opacity:.55;cursor:not-allowed}
.cui-foot-brand{
  justify-self:end;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  text-decoration:none;
  color:#c98a00;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-weight:700;
  letter-spacing:.12em;
  font-size:12px;
}
.cui-foot-brand img{width:42px;height:42px;object-fit:cover}

@media (max-width:980px){
  .cui-card{grid-template-columns:150px 48px 1fr 56px;gap:10px}
  .cui-card img{height:92px}
}
@media (max-width:720px){
  .cui-title{flex-wrap:wrap;gap:10px}
  .cui-card{
    grid-template-columns:1fr auto;
    grid-template-areas:"img mark" "ico ico" "copy copy";
    padding:12px;
  }
  .cui-card img{grid-area:img;height:160px}
  .cui-ico{grid-area:ico;justify-self:start}
  .cui-copy{grid-area:copy}
  .cui-mark{grid-area:mark}
  .cui-foot{grid-template-columns:1fr;text-align:center}
  .cui-social,.cui-foot-brand{justify-self:center}
}