/* Страница «Ателье». Использует переменные сайта (:root). Префикс .at- */

/* Первый экран */
.at-hero{position:relative;display:grid;place-items:center;min-height:clamp(200px,30vh,320px);padding:clamp(32px,5vw,52px) 0;text-align:center;overflow:hidden;isolation:isolate}
.at-hero__bg{position:absolute;inset:0;z-index:-2}
.at-hero__bg img,.at-hero__bg .ph{width:100%;height:100%;object-fit:cover;object-position:center 40%;    display: block;}
.at-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,10,10,.5),rgba(10,10,10,.8) 88%,var(--bg))}
.at-hero__in{padding:0 var(--pad)}
.at-hero h1{font:500 clamp(34px,5.5vw,64px)/1.05 var(--serif)}
.at-hero h1::after{content:"";display:block;width:clamp(72px,10vw,130px);height:5px;margin:16px auto 0;background:var(--accent);transform:skewX(-30deg)}
.at-hero p{max-width:620px;margin:14px auto 0;font-size:clamp(16px,2vw,20px);color:#e6e2d9}

/* Секции */
.at{padding:clamp(40px,6vw,80px) 0}
.at-hero + .at{padding-top:clamp(32px,5vw,64px)}
.at-h{font:500 clamp(28px,4vw,44px)/1.1 var(--serif);text-align:center;margin-bottom:clamp(24px,4vw,44px)}

/* О ателье */
.at-intro{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(28px,6vw,88px);align-items:center;max-width:1000px}
.at-intro h2{font:500 clamp(26px,3.6vw,40px)/1.15 var(--serif);margin-bottom:22px}
.at-intro p{max-width:62ch;line-height:1.75;color:#d9d5cc}
.at-intro p+p{margin-top:1em}
.at-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.at-cta .btn{cursor:pointer}
.at-stat{padding-left:clamp(20px,3vw,36px);border-left:3px solid var(--accent)}
.at-stat b{display:block;font:500 clamp(34px,4.4vw,52px)/1.05 var(--serif)}
.at-stat span{display:block;margin-top:8px;color:var(--muted);font-size:15px}

/* Прайс */
.at-price{border-top:1px solid var(--line)}
.at-price .wrap{max-width:960px}
.at-tabs{display:flex;justify-content:safe center;gap:4px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line)}
.at-tabs::-webkit-scrollbar{display:none}
.at-tab{flex:none;margin-bottom:-1px;padding:16px 22px;background:none;border:0;border-bottom:3px solid transparent;color:var(--muted);font:500 15px var(--sans);white-space:nowrap;cursor:pointer;transition:color .2s,border-color .2s}
.at-tab:hover{color:var(--text)}
.at-tab[aria-selected="true"]{color:var(--text);border-bottom-color:var(--accent)}
.at-panel{animation:atfade .35s ease}
.at-panel[hidden]{display:none}
@keyframes atfade{from{opacity:0;transform:translateY(8px)}}
.at-table{width:100%;border-collapse:collapse}
.at-table th{padding:20px 12px 14px;color:var(--muted);font:500 13px var(--sans);text-align:left;border-bottom:1px solid var(--text)}
.at-table td{padding:15px 12px;border-bottom:1px solid var(--line);transition:background .2s}
.at-table th:last-child,.at-table td:last-child{text-align:right;white-space:nowrap;padding-left:20px}
.at-table td:last-child{font-weight:700;font-variant-numeric:tabular-nums}
@media(hover:hover){.at-table tbody tr:hover td{background:rgba(255,255,255,.035)}.at-table tbody tr:hover td:last-child{color:var(--accent)}}

/* Вопросы и ответы */
.at-faq{border-top:1px solid var(--line)}
.at-faq__list{max-width:820px;margin:0 auto;border-top:1px solid var(--line)}
.at-faq__item{position:relative;border-bottom:1px solid var(--line)}
.at-faq__item::before{content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:3px;background:var(--accent);transform:scaleY(0);transform-origin:top;transition:transform .35s}
.at-faq__item.is-open::before{transform:none}
.at-faq__item h3{font:inherit}
.at-faq__q{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;padding:24px clamp(16px,3vw,28px);background:none;border:0;color:var(--text);font:500 clamp(18px,2vw,22px)/1.3 var(--serif);text-align:left;cursor:pointer;transition:color .2s}
.at-faq__q:hover{color:var(--accent)}
.at-faq__q:focus-visible{outline:2px solid var(--text);outline-offset:-2px}
.at-faq__ico{position:relative;flex:none;width:18px;height:18px}
.at-faq__ico::before,.at-faq__ico::after{content:"";position:absolute;left:0;top:50%;width:100%;height:2px;margin-top:-1px;background:currentColor;transition:transform .35s}
.at-faq__ico::after{transform:rotate(90deg)}
.is-open .at-faq__ico::after{transform:rotate(0)}
.at-faq__a>div{overflow:hidden}
.at-faq__body{padding:0 clamp(16px,3vw,28px) 26px;max-width:68ch;color:#d9d5cc;line-height:1.75}
.at-faq__body p+p{margin-top:.9em}
/* С включённым JS ответы сворачиваются плавно; без JS всё раскрыто */
.at-js .at-faq__a{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .4s cubic-bezier(.2,.7,.2,1),visibility 0s .4s}
.at-js .is-open .at-faq__a{grid-template-rows:1fr;visibility:visible;transition-delay:0s}

@media(max-width:1049px){
  .at-intro{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:599px){
  .at-tab{padding:14px 16px;font-size:14px}
  .at-table td,.at-table th{padding-left:6px;padding-right:6px}
  .at-table td{padding-top:13px;padding-bottom:13px;font-size:15px}
  .at-cta .btn{flex:1 1 100%;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  .at-panel{animation:none}
  .at-js .at-faq__a,.at-faq__item::before,.at-faq__ico::before,.at-faq__ico::after{transition:none}
}