/* UI-BIRTHDAY-OVERFLOW-R1: Birthday Yacht Party package grid at enlarged text, desktop widths (reviewed, hand-written;
   loaded LAST by /birthday-yacht-party-dubai/ only; page-root selectors as in service-layout.css).
   Cause (measured on the installed page, Chromium and WebKit): service-birthday.css lays the four package cards out as
   repeat(4,1fr) from 901px. A 1fr track never shrinks below its card's min-content width, and the shared text-fit rule that
   lets a card shrink (service-layout.css: .pkg-card min-width 0, overflow-wrap) applies only through 900px. With every text
   size doubled the four columns grew past their 837px container at 901px, so the fourth card ran 191px past the viewport
   (92px at 1000px) and the page scrolled sideways; two card buttons also let their labels run outside them. The hero
   photograph is clipped by its section and is not the cause.
   Correction: from 901px the grid takes as many equal columns as fit at a minimum of 12em each (never wider than the grid),
   so at normal text size it keeps exactly its four equal columns (each is at least 197px from 901px, more than 12em) and
   with enlarged text the cards wrap to two or three columns instead of running off the page; and each card may shrink to
   its column with long words wrapping inside it, the treatment service-layout.css already gives through 900px. No size,
   colour, spacing, wording or order change; nothing is clipped or hidden. */
@media (min-width:901px){
.uirh-service.uirh-service.uirh-service.uirh-service .pkg-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,12em),1fr))}
.uirh-service.uirh-service.uirh-service.uirh-service .pkg-card{min-width:0;overflow-wrap:break-word}
}
/* Revision 2 (UI-CONSOLIDATED-R2): the "Recommended" badge at enlarged text, all widths. service-birthday.css positions it
   absolutely (top 12px, right 12px) inside the card's fixed 36px top padding. With doubled text the badge grows from 20.8 to
   35.7px tall (bottom edge 48.7px), so it covered the first line of "Recommended Birthday Package" (measured at 320 to 1366px,
   Chromium and WebKit; also on the installed page). The badge now takes part in the card's column layout in the same place:
   negative margins put it exactly at top 12px / right 12px, and its bottom margin is max(10px - 1lh, .2lh - 8px). At normal
   text size the first term wins and the heading starts exactly where it did (36px padding; geometry unchanged); when the
   badge grows the second term keeps a gap of .2lh (about 3px at normal size, 6px doubled) and the heading, price and button
   move down below it instead of being covered. Nothing is hidden, clipped or resized. */
.uirh-service.uirh-service.uirh-service.uirh-service .pkg-badge{position:static;align-self:flex-end;margin:-24px -8px 0 0;margin-bottom:-4.85px;margin-bottom:max(10px - 1lh,.2lh - 8px)}