/* Proposta C (22/10/2026): o site em três portas. A home apresenta a tela única, a Central de Atendimento e o
   ArtONE Saúde, e cada uma tem a sua página. Este arquivo vem depois do b.css (e do sol.css, onde ele entra). */

/* ---------- topo: as três portas também no computador ---------- */
.topo-nav{gap:26px}
.topo-nav a[aria-current="page"]{border-color:var(--navy)}
@media (min-width:900px) and (max-width:1179px){.topo-nav{display:none}}
.menu-lista a[aria-current="page"]{color:var(--verde-texto)}

/* ---------- home: a primeira tela é o hub das soluções (pedido do Fabio, 22/10) ----------
   A tela única, sob medida, fica no bloco largo e navy; a Central e o Saúde, soluções prontas, lado a lado.
   O bloco inteiro é clicável: o botão principal estende a área de clique sobre o cartão. */
.hub{padding-block:clamp(16px,3vw,36px) var(--sec)}
.hub.faixa{justify-content:flex-start}
.hub-cab{display:grid;gap:14px;align-items:end;margin-bottom:clamp(24px,3vw,36px)}
.hub-h{font-size:clamp(40px,5.2vw,74px);font-stretch:70%;font-weight:650;line-height:.95;letter-spacing:-.02em;text-wrap:balance;max-width:12em}
.ini-p{font-size:clamp(17px,1.4vw,20px);line-height:1.5;color:var(--ardosia);max-width:26em;text-wrap:pretty}
@media (min-width:900px){.hub-cab{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:56px}.ini-p{padding-bottom:8px}}

.hub-grade{display:grid;gap:16px}
@media (min-width:900px){.hub-grade{grid-template-columns:1fr 1fr}.hub-tu{grid-column:1 / -1}}
.hub-c{position:relative;display:flex;flex-direction:column;border-radius:24px;background:var(--nevoa);overflow:hidden;transition:background-color .2s}
.hub-c:hover{background:#E3E9EF}
.hub-txt{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:28px 24px 0}
.hub-selo{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:620;color:var(--verde-texto)}
.hub-selo::before{content:"";width:28px;height:2px;background:currentColor}
.hub-n{font-size:clamp(34px,3.2vw,46px);font-stretch:70%;font-weight:650;line-height:.95;letter-spacing:-.015em}
.hub-d{font-size:16.5px;line-height:1.5;color:var(--ardosia);max-width:32em;text-wrap:pretty}
.hub-c .s-preco{margin-top:2px}
.hub-acoes{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.hub-acoes .bt{min-height:48px;padding:0 22px;font-size:16px}
.hub-acoes .bt-contorno{position:relative;z-index:2}
.hub-ir::after{content:"";position:absolute;inset:0;z-index:1;border-radius:24px}
.hub-ir:focus-visible{box-shadow:none;outline:0}
.hub-ir:focus-visible::after{box-shadow:inset 0 0 0 3px var(--navy),inset 0 0 0 6px var(--lima)}
.hub-vis{margin-top:auto;padding:28px 24px 0}
.hub-vis .cx{border-radius:16px 16px 0 0;box-shadow:0 -1px 0 #D3DBE3,0 20px 40px -24px rgba(0,27,61,.35)}
.hub-vis .cx-lista li:last-child{border-bottom:0}
.hub-cels{display:flex;justify-content:center;gap:14px;height:clamp(220px,22vw,300px);overflow:hidden}
.hub-cels img{width:min(44%,190px);height:auto;align-self:flex-start;border-radius:16px;border:1px solid var(--linha);box-shadow:var(--sombra)}

/* a tela única: o bloco largo, em navy */
.hub-tu{background:var(--navy);color:#fff}
.hub-tu:hover{background:#00234D}
.hub-tu .hub-selo{color:var(--lima)}
.hub-tu .hub-d{color:#C9D4E2}
.hub-tu .bt-cheio{background:var(--lima);color:var(--navy)}
.hub-tu .bt-contorno{color:#fff;border-color:rgba(255,255,255,.7)}
.hub-tu .bt-contorno:hover{background:rgba(255,255,255,.1)}
.hub-tu .hub-vis img{border-radius:14px 14px 0 0;background:#fff}
.hub-tu .hub-n{font-size:clamp(44px,4.6vw,68px)}
@media (min-width:900px){
  .hub-tu{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:end;column-gap:40px}
  .hub-tu .hub-txt{align-self:center;padding:44px 0 44px 44px}
  .hub-tu .hub-vis{padding:44px 44px 0 0}
  .hub-txt{padding:34px 34px 0}
  .hub-vis{padding:30px 34px 0}
}
@media (prefers-reduced-motion:reduce){.hub-c{transition:none}}

.porta-acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.faixa-navy .s-preco,.faixa-navy .s-preco span,.hub-tu .s-preco span{color:#C9D4E2}
.faixa-navy .s-preco b{color:#fff}

/* consultoria e quem somos, mais curtos na home */
.ini-cons .mapa-bloco{margin-block:8px 28px}

/* ---------- Central: Visão geral e Planos ---------- */
.sub{display:flex;gap:6px;margin-bottom:clamp(20px,3vw,32px);padding:4px;border-radius:999px;background:var(--nevoa);width:max-content;max-width:100%}
.sub a{padding:9px 18px;border-radius:999px;font-size:15px;font-weight:600;text-decoration:none;white-space:nowrap}
.sub a[aria-current="page"]{background:#fff;box-shadow:0 1px 3px rgba(0,27,61,.16)}
.sub a:not([aria-current]):hover{background:#E1E8EE}

/* o aviso de que os valores são de exemplo (só na proposta) */
.pl-aviso{background:var(--lima);color:var(--navy);font-size:15px;line-height:1.4}
.pl-aviso p{padding:10px 0}
.pl-aviso b{font-weight:650}

/* a faixa dos planos na Visão geral */
.pl-resumo{display:grid;border-top:2px solid var(--navy)}
.pl-resumo li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--linha)}
.pl-resumo b{font-size:clamp(24px,2.4vw,32px);font-stretch:74%;font-weight:640;line-height:1}
.pl-resumo .pr-v{font-size:clamp(22px,2.2vw,30px);font-stretch:74%;font-weight:640;font-variant-numeric:tabular-nums;white-space:nowrap}
.pl-resumo small{grid-column:1 / -1;font-size:15px;color:var(--ardosia)}
.pl-resumo .pr-v small{display:inline;font-size:14px;font-stretch:100%;font-weight:400;color:var(--ardosia)}
@media (min-width:900px){
  .pl-resumo{grid-template-columns:repeat(4,1fr);border-top:0}
  .pl-resumo li{grid-template-columns:1fr;align-content:start;padding:18px 22px 22px 0;margin-right:22px;border-bottom:0;border-top:2px solid var(--navy)}
  .pl-resumo small{grid-column:auto}
}

/* ---------- Planos: os cartões ---------- */
.pl-capa{padding-block:clamp(20px,3vw,40px) var(--sec)}
.pl-capa .h1{max-width:13em}
.pl-capa .lead{margin-top:18px}
.pl-cards{display:grid;gap:16px;margin-top:clamp(28px,4vw,48px)}
@media (min-width:640px){.pl-cards{grid-template-columns:1fr 1fr}}
@media (min-width:1180px){.pl-cards{grid-template-columns:repeat(4,1fr);gap:14px}}
.pl-card{position:relative;display:flex;flex-direction:column;gap:14px;padding:26px 22px 24px;border-radius:22px;background:#fff;border:1px solid var(--linha)}
.pl-card.dest{background:var(--navy);color:#fff;border-color:var(--navy)}
.pl-tag{position:absolute;top:-12px;left:22px;padding:4px 12px;border-radius:999px;background:var(--lima);color:var(--navy);font-size:13px;font-weight:650}
.pl-n{font-size:clamp(28px,2.4vw,34px);font-stretch:74%;font-weight:650;line-height:1}
.pl-para{font-size:15px;line-height:1.4;color:var(--ardosia);min-height:2.8em}
.pl-card.dest .pl-para,.pl-card.dest .pl-pv span,.pl-card.dest .pl-impl{color:#C9D4E2}
.pl-pv{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;padding-top:14px;border-top:1px solid var(--linha)}
.pl-card.dest .pl-pv{border-top-color:rgba(255,255,255,.22)}
.pl-pv b{font-size:clamp(40px,3.6vw,52px);font-stretch:70%;font-weight:660;line-height:.9;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.pl-pv span{font-size:15px;color:var(--ardosia)}
.pl-us{display:flex;flex-wrap:wrap;gap:6px}
.pl-us span{padding:4px 10px;border-radius:999px;background:var(--nevoa);font-size:14px;font-weight:600}
.pl-card.dest .pl-us span{background:rgba(255,255,255,.12)}
.pl-chave{display:grid;gap:8px;flex:1}
.pl-chave li{display:grid;grid-template-columns:18px 1fr;gap:10px;font-size:15px;line-height:1.4}
.pl-chave li::before{content:"";width:14px;height:14px;margin-top:3px;border-radius:50%;background:var(--lima);box-shadow:inset 0 0 0 4px var(--navy)}
.pl-card.dest .pl-chave li::before{background:var(--navy);box-shadow:inset 0 0 0 4px var(--lima)}
.pl-impl{font-size:14px;color:var(--ardosia)}
.pl-card .bt{min-height:48px;font-size:16px}
.pl-card.dest .bt-contorno{color:var(--navy);background:var(--lima);border-color:var(--lima)}
.pl-card.dest .bt-contorno:hover{background:#D3FF99}
.pl-todos{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:22px;font-size:15px;color:var(--ardosia)}
.pl-todos b{color:var(--navy)}

/* ---------- Planos: quanto fica a sua central ---------- */
.calc{display:grid;gap:clamp(28px,4vw,56px);align-items:start}
@media (min-width:980px){.calc{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.calc-cab{display:grid;gap:16px;margin-bottom:clamp(24px,3vw,40px)}
.calc-ctl{display:grid;gap:0;border-top:1px solid rgba(255,255,255,.22)}
.calc-lin{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.22)}
.calc-lin>span:first-child{display:flex;flex-direction:column;gap:2px;font-size:17px;font-weight:600}
.calc-lin small{font-size:14px;font-weight:400;color:#9FB0C4}
.passo{display:flex;align-items:center;gap:4px;flex:none}
.passo button{appearance:none;width:44px;height:44px;border-radius:50%;border:1.5px solid rgba(255,255,255,.6);background:none;color:#fff;font:inherit;font-size:22px;line-height:1;cursor:pointer}
.passo button:hover{background:rgba(255,255,255,.1)}
.passo output{min-width:2.6ch;text-align:center;font-size:26px;font-stretch:74%;font-weight:650;font-variant-numeric:tabular-nums}
.chave{position:relative;flex:none;width:56px;height:32px}
.chave input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.chave i{position:absolute;inset:0;border-radius:999px;background:rgba(255,255,255,.2);transition:background-color .15s;pointer-events:none}
.chave i::after{content:"";position:absolute;top:4px;left:4px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .2s}
.chave input:checked+i{background:var(--lima)}
.chave input:checked+i::after{transform:translateX(24px);background:var(--navy)}
.chave input:focus-visible+i{box-shadow:0 0 0 2px var(--navy),0 0 0 4px var(--lima)}
.calc-res{padding:clamp(24px,3vw,36px);border-radius:24px;background:#fff;color:var(--navy)}
.calc-rot{font-size:15px;color:var(--ardosia)}
.calc-plano{margin-top:4px;font-size:clamp(34px,3.4vw,46px);font-stretch:70%;font-weight:660;line-height:1}
.calc-total{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin-top:18px}
.calc-total b{font-size:clamp(52px,5.6vw,80px);font-stretch:66%;font-weight:680;line-height:.88;letter-spacing:-.015em;font-variant-numeric:tabular-nums}
.calc-total span{font-size:16px;color:var(--ardosia)}
.calc-itens{display:grid;margin-top:22px;border-top:1px solid var(--linha);font-size:15px}
.calc-itens li{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid #EEF1F5}
.calc-itens li span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.calc-impl{margin-top:14px;font-size:15px;color:var(--ardosia)}
.calc-impl b{color:var(--navy)}
.calc-alt{margin-top:6px;font-size:15px;color:var(--ardosia)}
.calc-res .bt{margin-top:22px;width:100%}
.calc-res .bt-cheio{background:var(--navy);color:#fff}

/* ---------- Planos: a comparação ---------- */
.cmp-esc{display:none;gap:10px;margin-bottom:16px}
.cmp-esc label{display:flex;flex-direction:column;gap:4px;flex:1;font-size:13px;font-weight:600;color:var(--ardosia)}
.cmp-esc select{appearance:none;min-height:46px;padding:0 36px 0 14px;border:1.5px solid var(--navy);border-radius:12px;background:#fff url("img/ic-seta.svg") no-repeat right 14px center/12px;font:inherit;font-size:16px;font-weight:620;color:var(--navy)}
.cmp{width:100%;border-collapse:collapse;font-size:15px;line-height:1.35}
.cmp thead th{position:sticky;top:var(--topo);z-index:2;background:#fff;padding:14px 10px;border-bottom:2px solid var(--navy);text-align:center;vertical-align:bottom}
.cmp thead th:first-child{text-align:left}
.cmp thead b{display:block;font-size:22px;font-stretch:74%;font-weight:650;line-height:1}
.cmp thead small{display:block;margin-top:4px;font-size:14px;font-weight:500;color:var(--ardosia);font-variant-numeric:tabular-nums}
.cmp thead .dest b{color:var(--verde-texto)}
.cmp tbody th{padding:12px 10px 12px 0;text-align:left;font-weight:500}
.cmp tbody td{padding:12px 10px;text-align:center;font-variant-numeric:tabular-nums}
.cmp tbody tr{border-bottom:1px solid #E6EBF0}
.cmp tbody td.dest{background:#F6F9FB}
.cmp .grp th{padding:28px 0 10px;border-bottom:1px solid var(--navy);font-size:18px;font-stretch:84%;font-weight:650}
.cmp .grp{border-bottom:0}
.sim{display:inline-block;width:16px;height:16px;border-radius:50%;background:var(--lima);box-shadow:inset 0 0 0 4.5px var(--navy);vertical-align:middle}
.nao{display:inline-block;width:12px;height:1.5px;background:#A9B6C4;vertical-align:middle}
.adic{display:inline-block;padding:2px 9px;border-radius:999px;background:var(--nevoa);font-size:13px;font-weight:600;color:var(--ardosia)}
.cmp .nao-txt,.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* no celular, dois planos lado a lado, escolhidos nos seletores; sem rolagem para o lado */
@media (max-width:759px){
  .js .cmp-esc{display:flex}
  .js .cmp [data-p]{display:none}
  .js .cmp[data-a="0"] [data-p="0"],.js .cmp[data-b="0"] [data-p="0"],
  .js .cmp[data-a="1"] [data-p="1"],.js .cmp[data-b="1"] [data-p="1"],
  .js .cmp[data-a="2"] [data-p="2"],.js .cmp[data-b="2"] [data-p="2"],
  .js .cmp[data-a="3"] [data-p="3"],.js .cmp[data-b="3"] [data-p="3"]{display:table-cell}
  .cmp tbody th{width:52%}
  .cmp thead b{font-size:19px}
}

/* ---------- Planos: adicionais e o que se paga à parte ---------- */
.ad-grade{display:grid;gap:clamp(32px,5vw,64px)}
@media (min-width:980px){.ad-grade{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}}
.ad-lista{border-top:2px solid var(--navy)}
.ad-lista div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 16px;padding:14px 0;border-bottom:1px solid var(--linha)}
.ad-lista dt{font-weight:620}
.ad-lista dd{text-align:right;font-weight:620;font-variant-numeric:tabular-nums;white-space:nowrap}
.ad-lista dd+dd{grid-column:1 / -1;text-align:left;font-weight:400;font-size:15px;color:var(--ardosia);white-space:normal}
.ad-fora{display:flex;flex-direction:column;gap:16px;padding:clamp(22px,3vw,32px);border-radius:22px;background:#fff}
.ad-fora .h3{margin-bottom:2px}
.ad-fora p{color:var(--ardosia);line-height:1.5}
.ad-fora b{color:var(--navy)}

/* 22/10: sem os subtítulos com o tracinho acima dos títulos (o Fabio: "marca de IA"). Nas páginas copiadas de
   Soluções, o selo some aqui; no site no ar ele ainda existe em Soluções e nas landings. */
.s-selo{display:none}

/* 22/10: as imagens da Central e do Saúde no hub mostram a função, em causa e efeito (pedido do Fabio) */
.fx-central{display:flex;flex-direction:column}
.fx-central .cx{border-radius:16px 16px 0 0}
.fx-par{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:-46px 14px 0;align-items:start}
.fx-card{display:flex;flex-direction:column;gap:8px;padding:14px 14px 16px;border-radius:14px;background:#fff;box-shadow:0 18px 36px -18px rgba(0,27,61,.45),0 0 0 1px #E3E8EF;font-size:13px;line-height:1.35;color:#1B2433}
.fx-cab{display:flex;align-items:center;gap:8px}
.fx-cab b{font-weight:650}
.fx-cab small{margin-left:auto;color:#5D6B80;font-variant-numeric:tabular-nums}
.fx-ic{flex:none;width:22px;height:22px;border-radius:50%;background:var(--navy) center/12px no-repeat}
.fx-voz{background-image:url("img/ic-voz.svg")}
.fx-funil{background-image:url("img/ic-funil.svg")}
.fx-onda{height:22px;background:repeating-linear-gradient(90deg,var(--navy) 0 2px,transparent 2px 5px);-webkit-mask:radial-gradient(ellipse 60% 100% at 40% 50%,#000 40%,rgba(0,0,0,.35) 75%,transparent);mask:radial-gradient(ellipse 60% 100% at 40% 50%,#000 40%,rgba(0,0,0,.35) 75%,transparent)}
.fx-rot{font-size:11.5px;font-weight:650;color:var(--verde-texto)}
.fx-txt{color:#3A4757}
.fx-etapas{display:flex;gap:4px}
.fx-etapas li{flex:1;padding:4px 0;border-radius:6px;background:#EEF1F5;text-align:center;font-size:11px;font-weight:600;color:#5D6B80}
.fx-etapas .feito{background:#DCEFE4;color:#146E46}
.fx-etapas .agora{background:var(--navy);color:#fff}
.fx-op{display:flex;flex-direction:column;padding:8px 10px;border-radius:10px;background:#F5F8FB;box-shadow:inset 3px 0 0 var(--navy)}
.fx-op small{color:#5D6B80}
.fx-tag{align-self:flex-start;padding:3px 9px;border-radius:999px;background:var(--lima);font-size:11.5px;font-weight:650;color:var(--navy)}

.fx-saude{display:flex;align-items:flex-start;justify-content:center;gap:10px;height:clamp(300px,25vw,350px);overflow:hidden}
.fx-fone{flex:none;width:min(42%,200px);margin:0}
.fx-seta{flex:none;align-self:center;width:34px;height:34px;margin-top:-30px;border-radius:50%;background:var(--lima);display:flex;align-items:center;justify-content:center}
.fx-seta svg{width:16px;height:16px;fill:none;stroke:var(--navy);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.fx-agenda{flex:1;max-width:250px;margin-top:22px;padding:14px;border-radius:16px;background:#fff;box-shadow:0 18px 36px -18px rgba(0,27,61,.45),0 0 0 1px #E3E8EF;font-size:13px;line-height:1.3;color:#1B2433}
.fx-ag-cab{display:flex;flex-direction:column;padding-bottom:10px;border-bottom:1px solid #E6EBF0}
.fx-ag-cab b{font-size:16px;font-weight:650}
.fx-ag-cab small{color:#5D6B80}
.fx-agenda ul{display:grid}
.fx-agenda li{display:grid;grid-template-columns:44px 1fr;grid-template-areas:"h n" "h e";column-gap:8px;padding:8px 0 8px 8px;border-bottom:1px solid #EEF1F5;box-shadow:inset 3px 0 0 #1A8C59}
.fx-agenda li span{grid-area:h;font-weight:600;font-variant-numeric:tabular-nums;color:#5D6B80}
.fx-agenda li b{grid-area:n;font-weight:620}
.fx-agenda li em{grid-area:e;font-style:normal;font-size:11.5px;font-weight:600}
.fx-agenda em.ok{color:#146E46}
.fx-agenda em.zap{justify-self:start;margin-top:2px;padding:1px 8px;border-radius:999px;background:var(--lima);color:var(--navy)}
.fx-agenda li.nova{background:#F3FBE8}
.fx-agenda li.livre{box-shadow:inset 3px 0 0 #D3DBE3}
.fx-agenda li.livre b{font-weight:400;color:#8592A3}
.fx-lem{display:flex;gap:8px;align-items:flex-start;margin-top:10px;font-size:12px;color:#3A4757}
.fx-lem i{flex:none;width:14px;height:14px;margin-top:1px;border-radius:50%;background:var(--lima);box-shadow:inset 0 0 0 4px var(--navy)}
@media (max-width:440px){.fx-par{grid-template-columns:1fr;margin-inline:10px}.fx-par .fx-card+.fx-card{display:none}.fx-seta{display:none}}

/* o lado do paciente: a conversa no WhatsApp, legível, no lugar do celular pequeno */
.fx-saude{align-items:center;height:auto;overflow:visible;padding-bottom:28px}
.fx-zap{flex:1;max-width:240px;border-radius:16px;overflow:hidden;background:#EFEAE2;box-shadow:0 18px 36px -18px rgba(0,27,61,.45),0 0 0 1px #E3E8EF;font-size:13px;line-height:1.35;color:#1B2433}
.fx-zap-cab{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#fff;border-bottom:1px solid #E6EBF0}
.fx-zap-cab i{width:26px;height:26px;border-radius:50%;background:var(--nevoa);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:10px;font-weight:650}
.fx-zap-cab b{font-weight:650}
.fx-zap-cab small{margin-left:auto;color:#1A8C59;font-size:11.5px}
.fx-zap-corpo{display:flex;flex-direction:column;gap:8px;padding:12px}
.fx-b{max-width:92%;padding:8px 10px;border-radius:10px;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.fx-b-c{align-self:flex-end;background:#D9FDD3}
.fx-b-e{align-self:flex-start;display:flex;flex-direction:column;background:#fff}
.fx-b-e b{display:flex;align-items:center;gap:6px;margin-bottom:3px;font-weight:650}
.fx-b-e b i{width:14px;height:14px;border-radius:50%;background:#1A8C59 url("img/ic-ok-branco.svg") center/10px no-repeat}
.fx-b-e small{margin-top:6px;font-size:11.5px;color:#5D6B80}
.fx-seta{margin-top:0}
.fx-agenda{margin-top:0}
@media (max-width:540px){
  .fx-saude{flex-direction:column;align-items:stretch;gap:10px}
  .fx-zap,.fx-agenda{max-width:none}
  .fx-seta{display:flex;align-self:center;transform:rotate(90deg)}
}