/* Canecas-only composition; global header, footer, grids and buttons are reused. */
.mugs-page .mugs-stage { background:transparent; padding:0; border-radius:0; aspect-ratio:1; position:relative; }
.mugs-page .mugs-stage img { width:112%; max-width:none; max-height:none; height:auto; object-fit:contain; transform:translateY(2rem); }
.mug-concepts .editorial-grid { gap:2.5rem; }
.mug-concept-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.5rem; }
.mug-concept-top .eyebrow { margin:0; }
.mug-icon { color:var(--navy); flex-shrink:0; }
.mug-icon .icon-accent { stroke:var(--green); }
.mug-concepts h3 { font-size:1.1rem; }
.mug-personalization,.mug-process { padding-block:var(--space); }
.mug-intro { max-width:47rem; margin-top:1.5rem; }
.mug-personalization-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); align-items:center; gap:3.5rem; margin-top:3rem; }
.mug-photo { border-radius:var(--radius); overflow:hidden; }
.mug-photo img { display:block; width:100%; height:auto; object-fit:contain; }
.mug-choices { display:grid; gap:2rem; }
.mug-choice { border-top:1px solid #f3eee430; padding-top:1.5rem; }
.mug-choice h3 { display:flex; gap:.9rem; align-items:center; font-size:1.1rem; margin-bottom:1rem; }
.mug-choice h3 span { color:var(--green); font-size:.85rem; }
.mug-choice ul { display:grid; gap:.5rem; margin:0; padding:0; list-style:none; }
.mug-choice li { display:flex; align-items:baseline; gap:.75rem; }
.mug-choice li::before { content:""; background:var(--green); width:.4rem; height:.4rem; border-radius:50%; flex-shrink:0; }
.mug-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:2rem; padding:0; margin:3rem 0 0; list-style:none; }
.mug-steps li { border-top:1px solid #001c4d30; padding-top:1.5rem; }
.mug-steps .step-number { display:block; font-size:3rem; font-weight:700; letter-spacing:-.05em; line-height:1; margin-bottom:1.5rem; }
.mug-steps .step-number::after { content:""; display:inline-block; width:.5rem; height:.5rem; background:var(--green); border-radius:50%; margin-left:.5rem; }
.mug-steps h3 { font-size:1rem; margin-bottom:.8rem; }
.mug-steps p { font-size:.95rem; }
.mugs-page .cta { border-top:1px solid #001c4d20; }
.mugs-page .button>span { display:inline-block; transition:transform 250ms ease; }
@media(hover:hover) and (pointer:fine) { .mugs-page .button:hover>span { transform:translate(3px,-3px); } }
@media(min-width:951px) { .mugs-page .brand-hero h1 { font-size:clamp(3.3rem,5.3vw,5.1rem); } }
@media(max-width:950px) {
  .mugs-page .brand-hero .two-col { grid-template-columns:minmax(0,1fr); gap:2rem; }
  .mugs-page .brand-hero .two-col>div { width:100%; max-width:40rem; justify-self:center; }
  .mugs-page .mugs-stage { aspect-ratio:4/3; }
  .mugs-page .mugs-stage img { width:100%; transform:none; }
  .mug-concepts .editorial-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; }
  .mug-personalization-grid { grid-template-columns:minmax(0,1fr); gap:2rem; }
  .mug-choices { grid-template-columns:1fr 1fr; gap:2rem; }
  .mug-steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mugs-page .cta .two-col { gap:2rem; }
  .mugs-page .cta h2 { font-size:2rem; }
}
@media(max-width:650px) {
  .mugs-page .brand-hero h1 { font-size:clamp(2.8rem,10vw,3.4rem); }
  .mug-concepts .editorial-grid,.mug-choices,.mug-steps { grid-template-columns:minmax(0,1fr); }
  .mug-concepts .editorial-grid { gap:2rem; }
  .mug-concept-top { margin-bottom:1rem; }
  .mug-personalization-grid { margin-top:2rem; }
  .mug-steps li { display:grid; grid-template-columns:3.5rem minmax(0,1fr); column-gap:1rem; }
  .mug-steps .step-number { grid-row:1/3; font-size:2rem; }
  .mug-steps .step-number::after { width:.35rem; height:.35rem; margin-left:.25rem; }
  .mug-steps h3,.mug-steps p { grid-column:2; }
  .mugs-page .cta .two-col { grid-template-columns:minmax(0,1fr); }
}
@media(prefers-reduced-motion:reduce) {
  .mugs-page .button>span { transition:none; }
  .mugs-page .button:hover>span { transform:none; }
}