/* Tigerlily agreed desktop and mobile presentation. Loaded after legacy styles. */
html { overflow-x: clip; }
body { margin: 0; overflow-x: clip; background: #050505; }
#top { box-sizing: border-box; max-width: 100%; }
#content { box-sizing: border-box; width: 100% !important; max-width: none !important; min-height: 0 !important; margin: 0 !important; background-color: #d4d1cd !important; background-image: url('images/tigerlily-wallpaper.svg') !important; background-repeat: repeat !important; background-size: auto !important; }
#trio { box-sizing: border-box; width: min(100%, 1050px) !important; max-width: 1050px !important; height: auto !important; margin: 0 auto !important; padding: 25px 18px !important; }
#content #trio > ul { display: flex !important; flex-direction: column !important; gap: 16px !important; padding: 0 !important; margin: 0 !important; }
#content #trio > ul > li.tigerlily-service { display: flow-root !important; box-sizing: border-box !important; float: none !important; clear: both !important; width: 100% !important; min-height: 0 !important; height: auto !important; margin: 0 !important; padding: 12px !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; overflow: visible !important; }
#trio > ul > li.tattooing { order: 1; }
#trio > ul > li.Piercing { order: 2; }
#trio > ul > li.fashion { order: 3; }
#trio .service-photo { box-sizing: border-box; float: left !important; display: block !important; width: 36% !important; max-width: 350px !important; height: 195px !important; object-fit: cover !important; margin: 0 24px 8px 0 !important; border: 3px solid #272727; }
#trio .tigerlily-service h1 { width: auto !important; height: auto !important; font-size: clamp(27px,3vw,38px) !important; line-height: 1.12 !important; color: #111; margin: 0 0 6px !important; }
#trio .tigerlily-service h2 { width: auto !important; height: auto !important; font-size: 19px !important; line-height: 1.25 !important; color: #c54d0d !important; margin: 0 0 10px !important; }
#trio .tigerlily-service p { width: auto !important; height: auto !important; max-height: none !important; font-size: 16px !important; line-height: 1.5 !important; color: #262626 !important; margin: 0 0 10px !important; }
.tigerlily-brands { background: transparent !important; }
#footer, #footer-content { background: #050505 !important; color: #eee !important; }
@media (max-width: 768px) {
 html, body { width: 100% !important; min-width: 0 !important; overflow-x: clip !important; }
 #top { display: flex !important; flex-direction: column !important; width: 100% !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; padding: 0 0 10px !important; background: #050505 !important; }
 #header { display: flex !important; flex-direction: column !important; align-items: stretch !important; box-sizing: border-box !important; width: 100% !important; height: auto !important; min-height: 0 !important; padding: 12px 12px 4px !important; background: #050505 !important; }
 #header .mobile-brand { display: block !important; width: calc(100% - 65px) !important; max-width: 310px !important; height: auto !important; margin: 0 !important; flex: none !important; }
 #header .mobile-brand img { display: block !important; width: 100% !important; height: auto !important; max-height: none !important; object-fit: contain !important; }
 .tigerlily-menu-toggle { display: block !important; position: absolute !important; right: 12px !important; top: 14px !important; }
 #header #menu1 { display: none !important; position: static !important; height: auto !important; }
 #header #menu1.mobile-menu-open { display: block !important; }
 #one { display: block !important; order: 2 !important; box-sizing: border-box !important; position: static !important; width: calc(100% - 20px) !important; max-width: calc(100% - 20px) !important; height: auto !important; min-height: 0 !important; margin: 8px auto !important; }
 #one ol { display: flex !important; flex-direction: row !important; width: 100% !important; max-width: 100% !important; height: auto !important; overflow-x: auto !important; overflow-y: hidden !important; scroll-snap-type: x mandatory; }
 #one ol > li { display: block !important; flex: 0 0 100% !important; height: auto !important; min-height: 0 !important; scroll-snap-align: start; }
 #one ol > li > div, #one figure { position: static !important; display: block !important; width: 100% !important; height: auto !important; }
 #one figure img { display: block !important; width: 100% !important; height: auto !important; aspect-ratio: 16 / 9; object-fit: cover; }
 .studio-contact { order: 3 !important; width: 100% !important; box-sizing: border-box !important; }
 #content { display: block !important; width: 100% !important; min-height: 0 !important; height: auto !important; padding: 0 !important; }
 #trio { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; padding: 14px 12px !important; }
 #content #trio > ul { display: flex !important; flex-direction: column !important; gap: 18px !important; }
 #content #trio > ul > li.tigerlily-service { display: block !important; width: 100% !important; height: auto !important; padding: 0 0 12px !important; margin: 0 !important; }
 #trio .service-photo { display: block !important; float: none !important; width: 100% !important; max-width: none !important; height: auto !important; aspect-ratio: 16 / 9; object-fit: cover !important; margin: 0 0 12px !important; }
 #trio .tigerlily-service h1 { clear: both !important; font-size: 28px !important; }
 #trio .tigerlily-service h2 { font-size: 17px !important; }
 #trio .tigerlily-service p { font-size: 15px !important; }
 #footer, #footer-content { width: 100% !important; height: auto !important; min-height: 0 !important; }
 #footer-content { padding: 20px 12px !important; }
}