.ty-layout{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:clamp(32px,5vw,72px);align-items:start;padding-top:clamp(40px,6vw,84px);padding-bottom:28px}
.ty-intro{display:flex;flex-direction:column;gap:20px}
.ty-callus{display:flex;align-items:center;gap:16px;max-width:520px;background:#16151A;color:#F7F6F2;border-radius:22px;padding:16px 20px;text-decoration:none;transition:transform .2s ease, background .2s ease}
.ty-callus:hover{color:#F7F6F2;background:#1F6B4E;transform:translateY(-2px)}
.ty-callus:focus-visible{outline:3px solid #1F6B4E;outline-offset:3px}
.ty-callus-ico{position:relative;width:52px;height:52px;flex:none;border-radius:50%;background:#D9E85A;color:#16151A;display:flex;align-items:center;justify-content:center}

.ty-callus-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.ty-callus-txt small{font-size:13px;color:#B9B5C2;letter-spacing:.02em}
.ty-callus-txt strong{font-family:Fraunces,Georgia,serif;font-weight:500;font-size:24px;letter-spacing:.01em}
.ty-callus-txt em{font-style:normal;font-size:13px;color:#B9B5C2;line-height:1.4}
.ty-plan{background:#FFFFFF;border:1px solid rgba(22,21,26,0.08);border-radius:22px;padding:20px 22px;display:flex;flex-direction:column;gap:10px;max-width:520px}
.ty-plan-t{margin:0;font-weight:600;font-size:16px}
.ty-plan ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.ty-plan li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;font-size:15px;line-height:1.4}
.ty-plan li span{font-family:'JetBrains Mono',monospace;font-size:12px;color:#55525C;padding-top:2px}
.ty-plan-n{margin:4px 0 0;font-size:13.5px;color:#7A5420;line-height:1.5}

.ty-phone{background:#F7F6F2;border:1px solid rgba(22,21,26,0.1);border-radius:34px;padding:18px;display:flex;flex-direction:column;gap:14px;box-shadow:0 50px 100px -60px rgba(22,21,26,0.5)}
.ty-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ty-who{display:flex;align-items:center;gap:8px;font-weight:600;font-size:16px}
.ty-who img{width:22px;height:22px}
.ty-langs{display:flex;padding:3px;border-radius:999px;background:#FFFFFF;border:1px solid rgba(22,21,26,0.12)}
.ty-langs button{height:34px;padding:0 12px;border-radius:999px;border:none;background:transparent;font:500 14px Outfit,sans-serif;color:#55525C;cursor:pointer}
.ty-langs button[aria-pressed="true"]{background:#16151A;color:#F7F6F2}

.ty-you{margin:0;align-self:flex-end;max-width:85%;background:#FFFFFF;border:1px solid rgba(22,21,26,0.1);border-radius:18px 18px 4px 18px;padding:10px 14px;font-size:15px;line-height:1.4;animation:rhmsg .3s ease-out}
.ty-card{background:#16151A;color:#F7F6F2;border-radius:24px;padding:18px 18px 20px;display:flex;flex-direction:column;gap:10px;min-height:150px;transition:background .3s}
.ty-card.is-alert{background:#3A1110}
.ty-state{display:flex;align-items:center;gap:8px;font-size:11.5px;letter-spacing:.08em;color:#D9E85A;font-family:'JetBrains Mono',monospace}
.ty-bars{display:flex;align-items:flex-end;gap:3px;height:14px}
.ty-bars span{width:3px;height:14px;background:currentColor;border-radius:2px;transform-origin:bottom;transform:scaleY(.3);transition:transform .3s}
.ty-card.is-speaking .ty-bars span{animation:pgbar .9s ease-in-out infinite}
.ty-card.is-speaking .ty-bars span:nth-child(2){animation-delay:.12s}.ty-card.is-speaking .ty-bars span:nth-child(3){animation-delay:.3s}.ty-card.is-speaking .ty-bars span:nth-child(4){animation-delay:.05s}.ty-card.is-speaking .ty-bars span:nth-child(5){animation-delay:.22s}
.ty-text{margin:0;font-family:Fraunces,Georgia,serif;font-size:clamp(19px,1.8vw,21px);line-height:1.42;font-weight:400}
.ty-text .w{opacity:.35;transition:opacity .15s}
.ty-text .w.on{opacity:1}
.ty-alert{display:flex;align-items:center;gap:12px;background:#B3261E;color:#FFFFFF;border-radius:16px;padding:12px 14px;animation:rhpop .3s ease-out}
.ty-alert strong{display:block;font-size:17px}
.ty-alert small{display:block;font-size:13px;opacity:.9}
.ty-note{margin:0;font-size:12.5px;color:#B9B5C2}

.ty-talk{display:flex;flex-direction:column;align-items:center;gap:10px;padding:6px 0}
.ty-orb-wrap{position:relative;width:232px;height:232px}
.ty-orb{--lvl:0;position:relative;width:100%;height:100%;border-radius:50%;border:none;padding:0;background:#6FA48C;cursor:pointer;overflow:hidden;isolation:isolate;transform:scale(calc(1 + var(--lvl) * .07));transition:transform .09s linear, box-shadow .3s;box-shadow:0 30px 60px -30px rgba(31,107,78,.55), inset 0 0 40px rgba(255,255,255,.18)}
.ty-orb:focus-visible{outline:3px solid #1F6B4E;outline-offset:6px}
.ty-blob{position:absolute;inset:-25%;border-radius:50%;filter:blur(22px);will-change:transform}
.ty-blob1{background:radial-gradient(circle at 28% 30%,#D9E85A 0,rgba(217,232,90,0) 42%),radial-gradient(circle at 74% 30%,#C4B5F7 0,rgba(196,181,247,0) 46%),radial-gradient(circle at 50% 78%,#1F6B4E 0,rgba(31,107,78,0) 52%),radial-gradient(circle at 18% 72%,#EDE7FF 0,rgba(237,231,255,0) 38%);animation:tyswirl 16s linear infinite}
.ty-blob2{background:radial-gradient(circle at 70% 70%,#8FC9B7 0,rgba(143,201,183,0) 45%),radial-gradient(circle at 35% 55%,#2E7D5E 0,rgba(46,125,94,0) 40%),radial-gradient(circle at 60% 18%,#F1F6E3 0,rgba(241,246,227,0) 34%);mix-blend-mode:soft-light;animation:tyswirl 11s linear infinite reverse}
.ty-grain{position:absolute;inset:0;opacity:.28;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.ty-shine{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 32% 24%,rgba(255,255,255,.38),rgba(255,255,255,0) 42%),radial-gradient(circle at 50% 50%,rgba(0,0,0,0) 62%,rgba(22,21,26,.18) 100%)}
@keyframes tyswirl{0%{transform:rotate(0deg) scale(1)}50%{transform:rotate(180deg) scale(1.08)}100%{transform:rotate(360deg) scale(1)}}
@keyframes tybreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
.ty-orb-wrap{animation:tybreathe 5s ease-in-out infinite}
.ty-pill{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:10px;padding:6px 18px 6px 6px;border-radius:999px;background:rgba(247,246,242,.86);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font:500 16px Outfit,'Noto Sans',sans-serif;color:#16151A;white-space:nowrap;box-shadow:0 8px 24px -10px rgba(22,21,26,.35)}
.ty-pill-ico{width:38px;height:38px;border-radius:50%;background:#16151A;color:#F7F6F2;display:flex;align-items:center;justify-content:center}



.ty-phone.is-listening .ty-blob1{animation-duration:3s}
.ty-phone.is-listening .ty-blob2{animation-duration:2.2s}

.ty-phone.is-talking .ty-blob1{animation-duration:6s}
.ty-phone.is-talking .ty-blob2{animation-duration:4.5s}
.ty-phone.is-listening .ty-orb-wrap,.ty-phone.is-talking .ty-orb-wrap{animation:none}

.ty-hint{margin:0;font-size:14px;color:#55525C;text-align:center}

.ty-chips{display:flex;flex-wrap:wrap;gap:8px}
.ty-chips button{min-height:40px;padding:8px 14px;border-radius:999px;border:1px solid rgba(22,21,26,0.14);background:#FFFFFF;font:400 14.5px Outfit,'Noto Sans',sans-serif;color:#16151A;cursor:pointer;text-align:left;transition:border-color .2s, background .2s}
.ty-chips button:hover{border-color:#1F6B4E;background:#F1F6E3}
.ty-chips button.ty-red{border-color:rgba(179,38,30,0.35);color:#8C1D18}
.ty-chips button.ty-red:hover{background:#FBE9E7}
.ty-form{display:flex;gap:8px}
.ty-form .rh-input{background:#FFFFFF;border-radius:999px;padding:12px 18px}
.ty-form .rh-btn{width:48px;min-width:48px;padding:0}
.ty-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:lang(yo) .ty-text, .ty-yo .ty-text{font-family:'Noto Sans',Outfit,sans-serif;font-size:18px}

@media (max-width: 900px){
  .ty-layout{grid-template-columns:minmax(0,1fr);padding-top:28px;gap:16px}
  .ty-intro{display:contents}
  .ty-phone{order:2;margin-top:6px}
  .ty-plan{order:3}
}
@media (max-width: 640px){
  .ty-intro .rh-lead{font-size:15px}
  .ty-phone{border-radius:28px;padding:14px;margin:0 -4px}
  .ty-langs button{padding:0 10px;font-size:13.5px}
  .ty-plan li{grid-template-columns:84px minmax(0,1fr);font-size:14px}
  .ty-orb-wrap{width:200px;height:200px}
}
@media (prefers-reduced-motion: reduce){.ty-card.is-speaking .ty-bars span,.ty-blob,.ty-orb-wrap{animation:none !important}.ty-orb{transform:none !important}}
