/* The bean is a repeated brand shape. Source photographs stay unchanged. */
.bean-definitions{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.hero-visual.bean-hero{isolation:isolate;min-height:560px}
.hero-visual.bean-hero:before{content:"";position:absolute;inset:7px -7px -8px 4px;background:var(--lime);clip-path:url(#pilas-bean-frame);transform:rotate(4deg);z-index:-1}
.hero-visual.bean-hero>img{clip-path:url(#pilas-bean-frame);border-radius:0;object-position:52% center}
.bean-hero .hero-tag{left:7px;bottom:39px;max-width:80%;font-size:28px;box-shadow:3px 5px 0 var(--ink)}
.bean-hero .photo-label{color:var(--muted);text-shadow:none;right:42px;bottom:-21px;font-size:7px}
.bean-story-photo{position:relative;isolation:isolate}
.bean-story-photo:before{content:"";position:absolute;inset:-8px 7px 8px -7px;background:var(--soft);clip-path:url(#pilas-bean-frame-soft);transform:rotate(-3deg);z-index:-1}
.story .bean-story-photo>img{clip-path:url(#pilas-bean-frame-soft);border-radius:0;object-position:50% center;height:490px}
.pilas-kit{background:var(--soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.kit-heading .section-title{margin-top:20px}
.kit-heading .section-title em{color:var(--muted)}
.kit-heading>div:last-child{max-width:395px;align-self:end;padding-bottom:2px}
.kit-heading>div:last-child>p{font-size:13px;line-height:1.9;margin:15px 0 12px}
.kit-edition{display:inline-block;border:1px solid var(--line);padding:7px 10px;font-size:8px;font-weight:800;letter-spacing:.12em;border-radius:3px}
.kit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}
.kit-product{min-width:0}
.kit-product-image{display:block;position:relative;width:100%;aspect-ratio:1/1;border:0;padding:0;overflow:hidden;background:var(--soft);border-radius:7px;text-align:left}
.kit-product-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.kit-product-image:hover img{transform:scale(1.035)}
.kit-product-image:focus-visible{outline:3px solid var(--blue);outline-offset:5px}
.kit-bean img{object-position:43% center}
.kit-number{position:absolute;top:17px;left:17px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb, var(--paper) 87%, transparent);border:1px solid color-mix(in srgb, var(--paper) 53%, transparent);font:700 18px Display}
.kit-image-arrow{position:absolute;right:16px;bottom:16px;width:38px;height:38px;border-radius:50%;background:color-mix(in srgb, var(--paper) 94%, transparent);color:var(--ink);display:grid;place-items:center}
.kit-scale{position:absolute;left:17px;bottom:18px;background:var(--ink);padding:7px 9px;font-size:8px;font-weight:800;letter-spacing:.09em;transform:rotate(-3deg);color:var(--paper)}
.kit-product-copy{padding:23px 0 0}
.kit-kicker{display:block;font-size:8px;letter-spacing:.13em;font-weight:800;color:var(--muted)}
.kit-product-copy h3{font:700 clamp(27px,2.6vw,36px)/1.1 Display;margin:11px 0}
.kit-product-copy>p{font-size:12px;line-height:1.85;color:var(--muted);max-width:325px;min-height:46px}
.kit-detail{padding:7px 0;margin-top:13px;border:0;border-bottom:1px solid var(--blue);border-radius:0;background:transparent;font-size:11px;min-height:40px;color:var(--blue)}
.kit-footnote{display:flex;gap:11px;align-items:baseline;margin-top:38px;padding-top:21px;border-top:1px solid var(--line)}
.kit-footnote p{font-size:10px;line-height:1.8;color:var(--muted)}
.kit-dot{width:7px;height:7px;background:var(--ink);border-radius:50%;flex-shrink:0}
.kit-dialog>img{width:100%;aspect-ratio:1.6;object-fit:cover;object-position:center;border-radius:7px;margin-bottom:22px}
.kit-dialog>p{font-size:13px;line-height:1.9;margin:17px 0 22px}
.kit-dialog .notice{font-size:11px}
.kit-dialog-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:22px}
.kit-dialog-bottom>span{font-size:10px;color:var(--muted)}
@media(min-width:1450px){.hero-visual.bean-hero{min-height:590px}}
@media(max-width:1100px){.hero-visual.bean-hero{min-height:485px}.bean-hero .hero-tag{font-size:24px;padding:16px}.kit-grid{gap:18px}.story .bean-story-photo>img{height:440px}}
@media(max-width:850px){.hero-visual.bean-hero{min-height:450px}.kit-heading{gap:27px}.kit-heading>div:last-child{max-width:340px}.kit-grid{gap:15px}.kit-product-copy h3{font-size:27px}.kit-product-copy>p{font-size:11px;min-height:65px}.kit-kicker{font-size:7px;min-height:24px}.kit-number{top:12px;left:12px}.kit-scale{font-size:7px;left:12px}.kit-image-arrow{width:33px;height:33px;right:12px}}
@media(max-width:650px){.hero-visual.bean-hero{min-height:390px;margin:7px 0 10px}.bean-hero .hero-tag{left:15px;bottom:37px;font-size:25px;padding:16px 19px}.bean-hero .photo-label{bottom:-18px;right:25px;font-size:7px}.hero-visual.bean-hero:before{inset:4px -2px -6px 4px}.story .bean-story-photo>img{height:370px}.bean-story-photo{width:100%;margin:8px 0}.kit-grid{grid-template-columns:1fr;gap:38px}.kit-heading>div:last-child{align-self:start;max-width:420px}.kit-heading>div:last-child>p{font-size:12px}.kit-product-image{aspect-ratio:1.16}.kit-product-copy{padding-top:19px}.kit-product-copy h3{font-size:34px;margin:9px 0}.kit-kicker{font-size:8px;min-height:0}.kit-product-copy>p{font-size:12px;min-height:0;max-width:360px}.kit-number{width:32px;height:32px;top:16px;left:16px}.kit-scale{font-size:8px;left:16px;bottom:18px}.kit-image-arrow{width:38px;height:38px;right:16px;bottom:16px}.kit-footnote{margin-top:29px}.kit-dialog-bottom{align-items:flex-start;flex-direction:column}.kit-dialog>img{aspect-ratio:1.3}.kit-dialog-bottom .btn{width:100%}}
@media(prefers-reduced-motion:reduce){.kit-product-image img{transition:none}.kit-product-image:hover img{transform:none}}
@media(max-width:420px){.hero h1{font-size:clamp(56px,17vw,70px);line-height:.92}.bean-hero .hero-tag{font-size:23px;max-width:86%}.hero-visual.bean-hero{min-height:370px}}

/* Each frame follows its subject. The product detail always shows the full object. */
.hero-kit-photo { margin: 0; min-width: 0; align-self: center; width: 100%; }
.hero-kit-frame { position: relative; isolation: isolate; aspect-ratio: 1.22; }
.hero-kit-frame::before { content: ""; position: absolute; inset: 6px 0 -4px 4px; background: var(--ink); clip-path: url(#pilas-practice-frame); transform: rotate(2deg); z-index: -1; }
.hero-kit-frame img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; clip-path: url(#pilas-practice-frame); }
.hero-kit-photo figcaption, .bench-scene figcaption, .kit-cover figcaption { display: flex; align-items: center; gap: 12px; justify-content: space-between; color: var(--muted); font-size: 12px; }
.hero-kit-photo figcaption { width: 89%; margin: 7px auto 0; }
.hero-kit-photo button, .kit-link { display: inline-flex; align-items: center; gap: 8px; padding: 0 4px; border: 0; background: transparent; min-height: 44px; text-decoration: underline; text-underline-offset: 4px; font-weight: 800; }
.hero-kit-photo button .ico, .kit-link .ico { width: 17px; }
.kit-bench { padding: clamp(32px, 5vw, 66px) 0; background: var(--soft); border-block: 1px solid var(--line); }
.bench-heading h2, .gear-gallery-title { margin: 10px 0 22px; }
.bench-layout, .kit-cover { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(20px, 4vw, 60px); align-items: center; }
.bench-scene, .kit-cover figure { margin: 0; min-width: 0; }
.bench-scene > img, .kit-cover figure > img { display: block; width: 100%; height: auto; border-radius: 8px; }
.bench-scene figcaption, .kit-cover figcaption { padding-top: 7px; }
.bench-tool { width: 100%; border: 0; border-top: 1px solid var(--line); background: none; text-align: left; display: grid; grid-template-columns: clamp(63px, 6vw, 85px) 1fr 20px; align-items: center; gap: 14px; padding: 12px 0; color: var(--ink); }
.bench-tool > img { width: 100%; height: auto; border-radius: 6px; }
.bench-tool > span { display: grid; gap: 3px; }
.bench-tool strong { font: 700 clamp(23px,2.4vw,32px)/1.08 Display, sans-serif; text-transform: uppercase; }
.bench-tool small { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.bench-tool span span { font-size: 14px; line-height: 1.45; }
.bench-tool:hover strong, .bench-tool:focus-visible strong { text-decoration: underline; text-underline-offset: 3px; }
.bench-guide .text-link, .roots-note .text-link { min-height: 44px; }
.kit-cover, .roots-note { padding-block: clamp(30px,5vw,74px); }
.kit-cover h1 { margin: 12px 0; }
.kit-cover p, .roots-note p { max-width: 54ch; line-height: 1.6; }
.kit-cover figure { max-width: 560px; }
.roots-note h2 { font: 700 clamp(27px,4vw,45px)/1.1 Display,sans-serif; text-transform: uppercase; margin: 10px 0; }
.kit-product-image { aspect-ratio: auto; background: transparent; }
.kit-product-image img { height: auto; object-fit: contain; }
.kit-product-image:hover img { transform: none; }
.kit-product-copy h3, .kit-product-copy .kit-kicker { text-transform: uppercase; }
.kit-product-copy .kit-detail { min-height: 44px; }
.kit-dialog > img { aspect-ratio: auto; object-fit: contain; height: auto; max-height: 46vh; background: var(--paper); }
.kit-footnote { font-size: 13px; }
@media(min-width: 651px) {
  .kit-product { display: grid; grid-template-rows: subgrid; grid-row: span 2; row-gap: 0; }
  .kit-product-image { align-self: center; }
}
@media(max-width: 650px) {
  .hero-kit-frame { aspect-ratio: 1.55; }
  .hero-kit-photo figcaption { width: 95%; margin-top: 1px; }
  .bench-layout, .kit-cover { grid-template-columns: 1fr; gap: 16px; }
  .bench-tool { gap: 10px; }
  .hero-kit-photo figcaption, .bench-scene figcaption, .kit-cover figcaption { font-size: 11px; }
}

.practice-lead .hero-kit-frame { aspect-ratio:1.5; }
.practice-lead figcaption { align-items:flex-start; gap:8px 18px; width:94%; margin:12px auto 0; flex-wrap:wrap; }
.practice-lead figcaption > div { flex:1 1 235px; }
.practice-index { display:block; text-transform:uppercase; letter-spacing:.1em; font-size:10px; font-weight:800; color:var(--blue); }
.practice-lead figcaption strong { display:block; font:700 clamp(23px,2.5vw,32px)/1.03 Display,sans-serif; text-transform:uppercase; color:var(--ink); margin:5px 0; }
.practice-lead figcaption p { font-size:14px; line-height:1.45; color:var(--muted); max-width:49ch; }
.practice-lead figcaption button { font-size:12px; align-self:end; }
@media(max-width:650px){
  .practice-lead figcaption { width:96%; gap:0 8px; }
  .practice-lead figcaption > div { flex:1 1 auto; }
}

.merch-intro {
  display: grid; grid-template-columns: minmax(0,1.6fr) minmax(215px,.65fr);
  gap: clamp(24px,5vw,72px); align-items: end;
  padding-block: clamp(32px,5vw,68px) 22px;
}
.merch-intro h1 { margin: 12px 0 10px; font-size: clamp(55px,7.5vw,102px); }
.merch-intro > div p { font-size: clamp(16px,1.7vw,22px); max-width: 40ch; }
.merch-intro aside { padding: 8px 0 8px 16px; border-left: 4px solid var(--blue); }
.merch-intro aside p { margin-top: 4px; font-size: 14px; line-height: 1.5; }
.collection-links { display: flex; gap: 8px; flex-wrap: wrap; }
.collection-links a {
  display:inline-flex; align-items:center; min-height:44px; padding:6px 15px;
  border:1px solid var(--line); border-radius:24px; font-size:14px; font-weight:750;
}
.collection-links a:hover, .collection-links a:focus-visible { background:var(--soft); }
.apparel-section { padding-block: clamp(30px,4vw,54px); }
.apparel-section h2 { font:700 clamp(34px,4.6vw,59px)/1 Display,sans-serif; text-transform:uppercase; margin:10px 0 18px; }
.apparel-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(16px,2vw,28px); }
.apparel-photo { width:100%; padding:0; border:0; border-radius:7px; overflow:hidden; background:var(--soft); display:block; }
.apparel-photo img { width:100%; height:auto; display:block; }
.apparel-info { display:flex; align-items:center; gap:14px; justify-content:space-between; padding-block:13px; border-bottom:1px solid var(--line); }
.apparel-info small { color:var(--muted); font-weight:700; font-size:12px; }
.apparel-info h3 { margin:4px 0 0; font:700 clamp(25px,3vw,35px)/1 Display,sans-serif; text-transform:uppercase; }
.apparel-info .kit-detail { min-height:44px; margin:0; flex-shrink:0; }
.collection-end { padding-block:24px 38px; }
.collection-end a, .kit-dialog-bottom a { min-height:44px; }
@media(max-width:650px){
  .merch-intro,.apparel-grid { grid-template-columns:1fr; }
  .merch-intro { gap:16px; padding-bottom:16px; }
}
.kit-dialog-bottom a, .kit-link, .collection-links a{color:var(--blue)}
