
/* v65 — redesigned premium hero banner */
.hero-atelier{
  padding:42px 0 38px;
}
.shell-atelier{
  width:min(calc(100% - 56px), 1710px);
  margin-inline:auto;
}
.hero-atelier-stage{
  position:relative;
  display:grid;
  grid-template-columns:minmax(320px,.9fr) minmax(420px,1.12fr) minmax(260px,.66fr);
  gap:24px;
  align-items:stretch;
}
.hero-atelier-copy,
.hero-atelier-visual,
.hero-atelier-aside{
  min-height:780px;
}
.hero-atelier-copy{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(66,48,31,.12);
  background:linear-gradient(180deg,#fffdf8 0%, #f5eee5 100%);
  box-shadow:0 24px 70px rgba(41,28,17,.10);
  padding:54px 42px 38px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.hero-atelier-copy:before{
  content:"";
  position:absolute;
  inset:auto -16% -22% auto;
  width:56%;
  aspect-ratio:1/1;
  border-radius:50%;
  background:radial-gradient(circle at center, rgba(223,209,190,.68) 0%, rgba(223,209,190,0) 72%);
}
.hero-atelier-copy:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(145deg, rgba(255,255,255,.62), rgba(255,255,255,0) 46%);
  pointer-events:none;
}
.hero-atelier-copy-inner,
.hero-atelier-copy-bottom{position:relative;z-index:1}
.hero-atelier-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:11px;
  padding:10px 18px;
  border-radius:999px;
  border:1px solid rgba(66,48,31,.12);
  color:#896b4c;
  background:rgba(255,251,245,.76);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.78rem;
  font-weight:800;
  margin-bottom:28px;
}
.hero-atelier-eyebrow:before{
  content:"";
  width:9px;
  height:9px;
  border-radius:50%;
  background:#cba06f;
  box-shadow:0 0 0 4px rgba(203,160,111,.14);
}
.hero-atelier-copy h1{
  margin:0;
  max-width:7ch;
  font-size:clamp(3.4rem, 7vw, 7rem);
  letter-spacing:-.085em;
  line-height:.92;
}
.hero-atelier-copy p{
  margin:28px 0 0;
  max-width:34rem;
  font-size:1.18rem;
  line-height:1.62;
  color:#6b645d;
}
.hero-atelier-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.hero-atelier-primary,
.hero-atelier-secondary{
  min-height:56px;
  padding:14px 24px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
}
.hero-atelier-primary{
  background:#1b1511;
  color:#fff7ef;
  box-shadow:0 16px 28px rgba(20,13,9,.15);
}
.hero-atelier-secondary{
  border:1px solid rgba(66,48,31,.14);
  background:rgba(255,255,255,.58);
  color:#2a2118;
}
.hero-atelier-primary:hover,
.hero-atelier-secondary:hover,
.hero-atelier-tail:hover{transform:translateY(-2px)}
.hero-atelier-copy-footer{
  margin-top:26px;
  padding-top:18px;
  border-top:1px solid rgba(66,48,31,.12);
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:10px 22px;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.77rem;
  color:#7d705f;
}
.hero-atelier-copy-footer strong{
  color:#2a2118;
}
.hero-atelier-monogram{
  position:absolute;
  right:24px;
  bottom:-2px;
  font-size:clamp(8rem, 14vw, 13rem);
  line-height:.8;
  font-weight:800;
  letter-spacing:-.09em;
  color:rgba(111,91,69,.08);
  z-index:0;
}
.hero-atelier-visual{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  box-shadow:0 28px 80px rgba(32,20,12,.22);
  background:#1d1511;
}
.hero-atelier-media,
.hero-atelier-visual-overlay,
.hero-atelier-visual-frame{position:absolute;inset:0}
.hero-atelier-media{
  background-size:cover;
  background-position:center;
  transform:scale(1.03);
}
.hero-atelier-visual-overlay{
  background:
    linear-gradient(180deg, rgba(13,9,7,.12) 0%, rgba(13,9,7,.44) 62%, rgba(13,9,7,.72) 100%),
    radial-gradient(circle at top right, rgba(248,233,210,.16), rgba(248,233,210,0) 34%),
    linear-gradient(90deg, rgba(18,13,10,.4) 0%, rgba(18,13,10,.1) 38%, rgba(18,13,10,0) 65%);
}
.hero-atelier-visual-frame{
  inset:14px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:26px;
}
.hero-atelier-visual:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:34%;
  background:linear-gradient(90deg, rgba(20,14,10,.72), rgba(20,14,10,0));
}
.hero-atelier-visual-label{
  position:absolute;
  top:26px;
  left:30px;
  z-index:2;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,248,238,.16);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.2);
  color:#f8efe2;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.74rem;
  font-weight:700;
}
.hero-atelier-visual-footer{
  position:absolute;
  left:30px;
  right:30px;
  bottom:28px;
  z-index:2;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.hero-atelier-visual-footer span{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,249,241,.18);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(12px);
  color:#fff6ea;
  font-size:.83rem;
  font-weight:700;
}
.hero-atelier-aside{
  display:grid;
  grid-template-rows:auto 1fr auto;
  gap:20px;
}
.hero-atelier-note,
.hero-atelier-spec-grid,
.hero-atelier-tail{
  border-radius:30px;
  border:1px solid rgba(66,48,31,.12);
  box-shadow:0 20px 54px rgba(38,26,17,.09);
}
.hero-atelier-note{
  padding:30px 28px;
  background:linear-gradient(180deg,#1f1712 0%, #17110d 100%);
  color:#f8efe5;
}
.hero-atelier-note-kicker{
  color:#caa57a;
  text-transform:uppercase;
  letter-spacing:.2em;
  font-size:.74rem;
  font-weight:800;
  margin-bottom:16px;
}
.hero-atelier-note h2{
  font-size:clamp(1.8rem,2.8vw,3rem);
  line-height:1.02;
  letter-spacing:-.05em;
  margin:0 0 14px;
}
.hero-atelier-note p{
  margin:0;
  color:rgba(248,239,229,.78);
  font-size:1rem;
  line-height:1.7;
}
.hero-atelier-spec-grid{
  background:linear-gradient(180deg,#f8f3ec 0%, #eee4d7 100%);
  padding:16px;
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  align-content:start;
}
.hero-atelier-spec-card{
  min-height:120px;
  border-radius:22px;
  background:rgba(255,255,255,.74);
  border:1px solid rgba(66,48,31,.08);
  padding:20px 18px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.hero-atelier-spec-card small{
  font-size:.74rem;
  letter-spacing:.18em;
  color:#9a7e62;
  font-weight:800;
}
.hero-atelier-spec-card strong{
  font-size:1.18rem;
  line-height:1.2;
}
.hero-atelier-tail{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:20px 22px;
  background:linear-gradient(180deg,#fffdf8 0%, #f3eadf 100%);
  color:#211914;
  font-weight:800;
}
.hero-atelier-tail span{max-width:15ch}
.hero-atelier-tail b{
  display:inline-grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:50%;
  background:#1f1712;
  color:#fff7ef;
  flex:0 0 auto;
}
@media (max-width: 1280px){
  .hero-atelier-stage{grid-template-columns:1fr 1fr;}
  .hero-atelier-copy{grid-column:1/2;min-height:700px}
  .hero-atelier-visual{grid-column:2/3;min-height:700px}
  .hero-atelier-aside{grid-column:1/3;grid-template-columns:1.1fr .9fr .7fr;grid-template-rows:auto;min-height:auto}
  .hero-atelier-note,.hero-atelier-spec-grid,.hero-atelier-tail{height:100%}
  .hero-atelier-spec-grid{grid-template-columns:repeat(3,1fr)}
  .hero-atelier-spec-card{min-height:150px}
}
@media (max-width: 980px){
  .shell-atelier{width:min(calc(100% - 28px), 100%)}
  .hero-atelier-stage{grid-template-columns:1fr;gap:18px}
  .hero-atelier-copy,.hero-atelier-visual{min-height:auto}
  .hero-atelier-copy{padding:32px 24px 24px;border-radius:28px}
  .hero-atelier-copy h1{max-width:none;font-size:clamp(2.5rem, 13vw, 4.8rem)}
  .hero-atelier-copy p{font-size:1rem;margin-top:20px}
  .hero-atelier-copy-footer{font-size:.68rem}
  .hero-atelier-monogram{font-size:7rem;right:10px;bottom:8px}
  .hero-atelier-visual{min-height:520px;border-radius:28px}
  .hero-atelier-visual-label{top:18px;left:18px;font-size:.68rem;padding:8px 12px}
  .hero-atelier-visual-footer{left:18px;right:18px;bottom:18px}
  .hero-atelier-aside{grid-template-columns:1fr;grid-template-rows:auto;min-height:auto}
  .hero-atelier-note{padding:24px 20px;border-radius:24px}
  .hero-atelier-spec-grid{grid-template-columns:1fr 1fr 1fr;border-radius:24px}
  .hero-atelier-spec-card{min-height:110px;padding:16px 14px}
  .hero-atelier-tail{border-radius:24px;padding:16px 18px}
}
@media (max-width: 640px){
  .hero-atelier{padding-top:24px}
  .hero-atelier-copy{padding:24px 18px 20px}
  .hero-atelier-eyebrow{font-size:.64rem;letter-spacing:.14em;padding:9px 12px;gap:8px;margin-bottom:18px}
  .hero-atelier-copy h1{font-size:clamp(2.25rem, 15vw, 4rem);letter-spacing:-.08em}
  .hero-atelier-actions{flex-direction:column;align-items:stretch}
  .hero-atelier-primary,.hero-atelier-secondary{width:100%;min-height:50px;padding-inline:16px}
  .hero-atelier-visual{min-height:420px}
  .hero-atelier-visual-footer{display:grid;grid-template-columns:1fr;gap:8px}
  .hero-atelier-spec-grid{grid-template-columns:1fr;gap:10px}
  .hero-atelier-spec-card{min-height:86px}
}
