/* Approved benefits layout, kept in the existing production stylesheet. */
#agency-site .taste-benefit-showcase {
  padding:clamp(66px,6cqi,96px) clamp(22px,6cqi,88px) clamp(76px,8cqi,116px);
  background:var(--taste-page);
}
#agency-site .taste-benefit-showcase__heading {
  max-width:980px; color:var(--taste-ink);
  font-size:clamp(45px,5.5cqi,76px); font-weight:650;
  letter-spacing:-.06em; line-height:1.01; text-wrap:balance;
}
#agency-site .taste-benefit-showcase__grid {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px 22px; margin-top:52px;
}
#agency-site .taste-benefit-card {
  min-width:0; padding:14px; border:1px solid #dce8e0; border-radius:30px;
  background:linear-gradient(135deg,#f6faf7,#eaf4ef);
  box-shadow:inset 0 2px 1px #fff,0 4px 0 #d9e6dd,0 15px 30px #143e3809;
}
#agency-site .taste-benefit-card__media { overflow:hidden; border-radius:19px; aspect-ratio:4/3; background:var(--taste-tint); }
#agency-site .taste-benefit-card__media img { display:block; width:100%; height:100%; object-fit:cover; }
#agency-site .taste-benefit-card h3 {
  margin:21px 7px 10px; color:var(--taste-ink);
  font-size:clamp(22px,2.3cqi,34px); font-weight:550;
  letter-spacing:-.045em; line-height:1.09; text-wrap:balance;
}
#agency-site .taste-benefit-retention {
  grid-column:1/-1; display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,2fr);
  align-items:center; gap:32px;
  position:relative; isolation:isolate; overflow:hidden;
  min-width:0; padding:44px 38px; border:1px solid #edece7; border-radius:40px;
  background:#fff;
  box-shadow:inset 0 2px 1px #fff,0 4px 0 #eeeae4,0 18px 42px #4c392b08;
}
#agency-site .taste-benefit-retention::before,
#agency-site .taste-benefit-retention::after {
  content:''; position:absolute; z-index:-1; filter:blur(54px); pointer-events:none;
}
#agency-site .taste-benefit-retention::before {
  width:95%; height:135%; left:-23%; bottom:-50%;
  background:radial-gradient(ellipse,#ffb17a33 0%,#ffd2ad22 30%,transparent 70%);
}
#agency-site .taste-benefit-retention::after {
  width:85%; height:125%; right:-25%; top:-44%;
  background:radial-gradient(ellipse,#95dbc74d 0%,#ccefe433 32%,transparent 70%);
}
#agency-site .taste-benefit-retention__copy { min-width:0; }
#agency-site .taste-benefit-retention__copy h3 {
  font-size:clamp(38px,3.5cqi,54px); font-weight:550; line-height:1.04;
  letter-spacing:-.05em; text-wrap:balance;
}
#agency-site .taste-benefit-retention__desktop p {
  max-width:340px; margin:22px 0 26px;
  color:var(--taste-muted); font-size:18px; line-height:1.5;
}
#agency-site .taste-benefit-retention .quote-pill { min-height:60px; padding:8px 8px 8px 24px; gap:24px; font-size:21px; }
#agency-site .taste-benefit-retention .quote-pill .site-contact-arrow { width:44px; height:44px; font-size:25px; }
#agency-site .taste-benefit-retention__art { min-width:0; container:benefit-art / inline-size; }
@container (max-width:1200px) {
  #agency-site .taste-benefit-retention { grid-template-columns:minmax(0,1fr); gap:32px; padding:36px; }
  #agency-site .taste-benefit-retention__copy { max-width:700px; }
  #agency-site .taste-benefit-retention__copy h3 { font-size:clamp(38px,5cqi,54px); }
  #agency-site .taste-benefit-retention__desktop p { max-width:520px; }
}
@container (max-width:1000px) {
  #agency-site .taste-benefit-showcase__grid { gap:26px 15px; margin-top:36px; }
  #agency-site .taste-benefit-card { padding:10px; border-radius:25px; }
  #agency-site .taste-benefit-card__media { border-radius:17px; }
  #agency-site .taste-benefit-card h3 { margin:17px 5px 9px; font-size:24px; }
}
@container (max-width:650px) {
  #agency-site .taste-benefit-showcase { padding:66px 5% 76px; }
  #agency-site .taste-benefit-showcase__heading { font-size:clamp(38px,9.8cqi,52px); }
  #agency-site .taste-benefit-showcase__grid { grid-template-columns:minmax(0,1fr); gap:24px; margin-top:30px; }
  #agency-site .taste-benefit-card { padding:12px; border-radius:30px; }
  #agency-site .taste-benefit-card__media { border-radius:21px; }
  #agency-site .taste-benefit-card h3 { margin:20px 8px 11px; font-size:29px; }
  #agency-site .taste-benefit-retention { gap:22px; padding:28px 20px 30px; border-radius:30px; }
  #agency-site .taste-benefit-retention__copy h3 { font-size:clamp(33px,8.5cqi,46px); }
  #agency-site .taste-benefit-retention__desktop { display:none; }
}
@container (max-width:360px) { #agency-site .taste-benefit-retention { padding-inline:16px; } }

/* Connected retention: editable glass tiles around a customer icon. */
.br-icon-library { position:absolute; width:0; height:0; overflow:hidden; }
.br-retention-network {
  isolation:isolate;
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 240px minmax(0,1fr);
  grid-template-rows:repeat(3,104px);
  gap:24px 60px;
  align-items:center;
  max-width:1120px;
  margin:0 auto;
  padding:12px 0;
}
.br-network-lines {
  position:absolute; inset:0; width:100%; height:100%;
  fill:none; stroke:#8bad9a; stroke-width:1.3; z-index:-1;
}
.br-network-lines circle { fill:#e7a67d; stroke:#e7a67d; }
.br-network-lines-mobile { display:none; }
.br-customer-core {
  grid-area:1 / 2 / 4 / 3;
  align-self:center;
  display:grid;
  place-items:center;
  position:relative;
  padding:26px 10px;
}
.br-customer-medallion {
  position:relative;
  width:124px; height:124px;
  display:grid; place-items:center;
  border-radius:50%; border:1px solid #fff;
  background:radial-gradient(circle at 28% 20%,#ffffffed,transparent 60%),linear-gradient(150deg,#eef8f0b3,#b3d7c0a6);
  box-shadow:inset 0 0 0 6px #ffffff38,inset 0 -5px 6px #72957c38,0 6px 0 #b4cebc,0 18px 26px #28543d1c;
  backdrop-filter:blur(12px);
}
.br-customer-medallion svg { width:76px; height:76px; fill:none; stroke:#286149; stroke-width:2; stroke-linecap:round; }
.br-customer-medallion::before { content:''; position:absolute; inset:6px; border:1px solid #ffffff75; border-radius:50%; pointer-events:none; }
.br-customer-medallion::after { content:''; position:absolute; left:23%; right:23%; height:5px; bottom:-18px; border-radius:50%; background:#63957328; filter:blur(5px); }
.br-network-tool {
  display:flex; align-items:center; gap:15px;
  position:relative; min-height:96px; padding:20px;
  border-radius:22px; border:1px solid #ffffffef;
  background:linear-gradient(120deg,#ffffffb3,#f8fcf880);
  box-shadow:inset 0 1px 1px #fff,0 3px 0 #cadccfc9,0 12px 22px #254c3610;
  backdrop-filter:blur(14px);
}
.br-network-tool h4 { position:relative; z-index:1; margin:0; font-size:20px; font-weight:500; line-height:1.2; letter-spacing:-.025em; }
.br-tool-icon {
  position:relative; width:45px; height:49px; flex:0 0 45px;
  display:grid; place-items:center;
  color:#336b56; border:1px solid #c8ddcd; border-radius:13px;
  background:linear-gradient(135deg,#eff9f1,#d5e9da);
  box-shadow:inset 0 1px 1px #fff,0 2px 0 #c3d8c8;
  transform:rotate(-4deg);
}
.br-tool-icon svg { width:30px; height:30px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 1px 0 #fff); }
.br-tool-calendar .br-tool-icon, .br-tool-sms .br-tool-icon { transform:rotate(4deg); }
.br-tool-payment { grid-area:1 / 1; }
.br-tool-calendar { grid-area:3 / 3; }
.br-tool-bell { grid-area:3 / 1; }
.br-tool-cart { grid-area:1 / 3; }
.br-tool-sms { grid-area:2 / 3; }
.br-tool-reorder { grid-area:2 / 1; }
/* Soft apricot across the entire card, matching the retained calendar concept. */
.br-tool-payment, .br-tool-bell, .br-tool-calendar {
  background:linear-gradient(120deg,#f8eddddd,#f7f4e8b5);
  border-color:#fffaf1;
  box-shadow:inset 0 1px 1px #fff,0 3px 0 #dfd4bec9,0 12px 22px #73563210;
}
.br-tool-payment .br-tool-icon, .br-tool-bell .br-tool-icon, .br-tool-calendar .br-tool-icon {
  color:#a55a2e; border-color:#ecc2a4;
  background:linear-gradient(135deg,#fff0e2,#ffd2b2);
  box-shadow:inset 0 1px 1px #fff,0 2px 0 #dfb393;
}
@container benefit-art (min-width:651px) {
  .br-tool-payment { transform:translateY(10px) rotate(-1deg); }
  .br-tool-calendar { transform:translate(8px,2px) rotate(.7deg); }
  .br-tool-bell { transform:translate(-8px,-6px) rotate(-.7deg); }
  .br-tool-cart { transform:translateY(-6px) rotate(.9deg); }
  .br-tool-sms { transform:translate(-10px,6px) rotate(-.8deg); }
  .br-tool-reorder { transform:translate(12px,-3px) rotate(1deg); }
}
@container benefit-art (max-width:1250px) {
  .br-retention-network { grid-template-columns:minmax(0,1fr) 170px minmax(0,1fr); column-gap:25px; }
  .br-network-tool { padding:20px 15px; gap:10px; }
  .br-network-tool h4 { font-size:18px; }
  .br-tool-icon { width:42px; flex-basis:42px; height:45px; }
}
@container benefit-art (max-width:900px) {
  .br-retention-network { grid-template-columns:minmax(0,1fr) 126px minmax(0,1fr); column-gap:15px; row-gap:16px; }
  .br-network-tool { padding:20px 12px; gap:9px; }
  .br-network-tool h4 { font-size:17px; }
  .br-tool-icon { width:34px; flex-basis:34px; height:39px; }
  .br-tool-icon svg { width:27px; height:27px; }
  .br-customer-medallion { width:96px; height:96px; }
  .br-customer-medallion svg { width:61px; }
}
@container benefit-art (max-width:650px) {
  .br-retention-network {
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:auto repeat(3,auto);
    gap:15px 12px; padding:0;
  }
  .br-network-lines { display:none; }
  .br-network-lines-mobile {
    display:block; position:absolute; z-index:-1;
    top:82px; left:0; width:100%; height:calc(100% - 145px);
    fill:none; stroke:#9ebba9; stroke-width:1.3;
  }
  .br-network-lines-mobile path { vector-effect:non-scaling-stroke; }
  .br-customer-core { grid-area:1 / 1 / 2 / 3; padding:12px 0 20px; }
  .br-customer-medallion { width:70px; height:70px; }
  .br-customer-medallion svg { width:45px; height:45px; }
  .br-customer-medallion::after { display:none; }
  .br-network-tool { min-height:136px; flex-direction:column; align-items:flex-start; gap:9px; padding:16px 13px; border-radius:18px; }
  .br-network-tool h4 { font-size:17px; line-height:1.16; }
  .br-tool-icon { width:39px; height:39px; flex-basis:auto; }
  .br-tool-payment { grid-area:2 / 1; }
  .br-tool-calendar { grid-area:4 / 2; }
  .br-tool-bell { grid-area:3 / 1; }
  .br-tool-cart { grid-area:3 / 2; }
  .br-tool-sms { grid-area:4 / 1; }
  .br-tool-reorder { grid-area:2 / 2; }
}
@container benefit-art (max-width:360px) {
  .br-network-tool { padding:13px 10px; }
  .br-network-tool h4 { font-size:16px; }
}
@media(prefers-reduced-transparency:reduce) {
  .br-network-tool { background:#f5faf6; backdrop-filter:none; }
  .br-tool-payment, .br-tool-bell, .br-tool-calendar { background:#f7eddc; }
  .br-customer-medallion { background:#dceee0; backdrop-filter:none; }
}
