.about-section.about-with-order {
  display:grid;
  grid-template-columns:minmax(0,1fr) 340px;
  gap:32px;
  align-items:center;
  padding:44px 14px;
}
.studio-story {
  min-width:0;
  display:grid;
  grid-template-columns:minmax(120px,.58fr) minmax(0,1fr);
  align-items:center;
  gap:28px;
}
.about-with-order .about-mark {
  min-width:0;
  min-height:250px;
  position:relative;
  isolation:isolate;
  margin:0;
  order:0;
  background:none;
}
.about-with-order .about-mark::before {
  content:"";
  position:absolute;
  inset:-5%;
  z-index:-1;
  border-radius:50%;
  background:radial-gradient(ellipse,#cb842127 0%,#b7721210 40%,transparent 70%);
  animation:studio-ember 6s ease-in-out infinite alternate;
  pointer-events:none;
}
.about-with-order .about-mark img { width:190px; height:220px; }
.about-with-order .about-mark span { font-size:7px; letter-spacing:2.5px; text-align:center; }
.about-with-order .about-copy h2 { font-size:35px; }
.about-with-order .about-copy .eyebrow { font-size:8px; letter-spacing:1.6px; }
.about-with-order .about-copy h2 em {
  color:#f4c568;
  background:linear-gradient(100deg,#e4a94a 10%,#f4c568 35%,#ffe9b0 50%,#f4c568 65%,#e4a94a 90%);
  background-size:220% 100%;
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:studio-gold 9s ease-in-out infinite;
}
.studio-order-card {
  position:relative;
  overflow:hidden;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  gap:24px;
  min-width:0;
  padding:27px 24px 24px;
  border:1px solid #5a5131;
  border-radius:24px;
  background:linear-gradient(135deg,#2e2e1e,#1c2118 80%);
  box-shadow:0 12px 35px #0002;
  transition:border-color .3s,box-shadow .3s;
}
.studio-order-card::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:radial-gradient(ellipse at 100% 0%,#efb95825,transparent 68%);
  opacity:.45;
  transition:opacity .6s;
  pointer-events:none;
}
.studio-order-card:hover,.studio-order-card:focus-within { border-color:#a98c4b; box-shadow:0 12px 40px #c2871610; }
.studio-order-card:hover::before,.studio-order-card:focus-within::before { opacity:1; }
.studio-order-top { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:20px; }
.studio-order-top .eyebrow { color:#c8b37d; font-size:8px; letter-spacing:1.35px; }
.studio-order-card h2 { margin:0 0 16px; color:#f3eee0; font-size:28px; font-weight:650; line-height:1.2; letter-spacing:-.7px; }
.studio-order-card p { margin:0; color:#b7bea8; font-size:13px; line-height:1.8; }
.studio-order-card p.studio-order-note { margin-top:13px; color:#d4bf88; font-size:11px; }
.studio-soundwave { display:flex; align-items:center; gap:3px; height:20px; flex-shrink:0; color:#e8bb69; }
.studio-soundwave span { width:3px; height:8px; border-radius:4px; background:currentColor; animation:studio-voice 1.8s ease-in-out infinite alternate; }
.studio-soundwave span:nth-child(2) { height:14px; animation-delay:-.8s; }
.studio-soundwave span:nth-child(3) { height:20px; animation-delay:-.3s; }
.studio-soundwave span:nth-child(4) { height:14px; animation-delay:-1.1s; }
.studio-soundwave span:nth-child(5) { animation-delay:-.5s; }

.studio-order-button.contact-telegram,
.contact-with-order .contact-telegram { width:290px; min-width:0; flex-shrink:0; }
.studio-order-button.contact-telegram {
  margin-top:auto;
  background:#f4c568;
  border-color:#f4c568;
  color:#211a0d;
  transition:background .25s,transform .25s,box-shadow .25s;
}
.studio-order-button.contact-telegram:visited { color:#211a0d; }
.studio-order-button.contact-telegram small { color:#685329; }
.studio-order-button.contact-telegram:hover { background:#ffda90; border-color:#ffda90; color:#211a0d; transform:translateY(-2px); box-shadow:0 7px 20px #eab44f1c; }
.studio-order-button.contact-telegram > svg:last-child { transition:transform .25s; }
.studio-order-button.contact-telegram:hover > svg:last-child { transform:translate(2px,-2px); }
[data-studio-reveal] { transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .3s; }
[data-studio-reveal].studio-waiting { opacity:0; transform:translateY(22px); }
[data-studio-reveal].studio-visible { opacity:1; transform:none; }
.studio-order-card.studio-visible { transition-delay:.12s,.12s,0s,0s; }
@keyframes studio-ember { from { opacity:.45; transform:scale(.93); } to { opacity:1; transform:scale(1.05); } }
@keyframes studio-gold { 0%,100% { background-position:0% 50%; } 50% { background-position:100% 50%; } }
@keyframes studio-voice { from { transform:scaleY(.4); opacity:.55; } to { transform:scaleY(1); opacity:1; } }
@media(max-width:1100px) {
  .studio-story { grid-template-columns:140px minmax(0,1fr); gap:20px; }
  .about-with-order .about-mark img { width:140px; height:180px; }
  .about-with-order .about-copy h2 { font-size:32px; }
  .about-with-order .about-mark span { font-size:6px; letter-spacing:1.6px; }
}
@media(max-width:960px) {
  .about-section.about-with-order { grid-template-columns:1fr; padding:35px 0 30px; gap:30px; }
  .studio-story { grid-template-columns:minmax(150px,.5fr) minmax(0,1fr); padding:0 28px; gap:30px; }
  .about-with-order .about-mark img { width:180px; height:200px; }
  .studio-order-card { flex-direction:row; align-items:center; padding:28px 38px; gap:30px; }
  .studio-order-copy { min-width:0; flex:1; }
  .studio-order-top { margin-bottom:14px; }
  .studio-order-button.contact-telegram { margin-top:0; }
}
@media(max-width:780px) {
  .studio-order-card { flex-direction:column; align-items:stretch; padding:27px; gap:24px; }
  .studio-order-button.contact-telegram,
  .contact-with-order .contact-telegram { width:100%; }
  .studio-order-top { justify-content:flex-start; gap:20px; }
  .studio-story { padding:0 10px; gap:20px; }
}
@media(max-width:480px) {
  .about-section.about-with-order { padding-top:28px; gap:26px; }
  .studio-story { grid-template-columns:1fr; gap:16px; padding:0 9px; }
  .about-with-order .about-mark { min-height:160px; }
  .about-with-order .about-mark img { width:135px; height:150px; }
  .about-with-order .about-mark span { margin-top:7px; }
  .about-with-order .about-copy h2 { font-size:35px; }
  .studio-order-card { padding:26px 23px; border-radius:22px; }
  .studio-order-card h2 { font-size:27px; }
}
@media(prefers-reduced-motion:reduce) {
  .about-with-order .about-mark::before,
  .about-with-order .about-copy h2 em,
  .studio-soundwave span { animation:none; }
  [data-studio-reveal],
  .studio-order-card::before,
  .studio-order-button.contact-telegram,
  .studio-order-button.contact-telegram > svg:last-child { transition:none; }
  [data-studio-reveal].studio-waiting { opacity:1; transform:none; }
  .studio-order-button.contact-telegram:hover,
  .studio-order-button.contact-telegram:hover > svg:last-child { transform:none; }
}
