#app:has(.otw-hotels-grid),#app:has(.otw-hotel-detail){background:#1a212c;color:#ffffff}.otw-stay-intro{background:#1a212c;color:#ffffff}.otw-stay-intro h1,.otw-hotel-detail h1,.otw-hotel-detail h2,.otw-hotel-detail h3{color:#ffffff}.otw-stay-intro p,.otw-hotel-detail p,.otw-hotel-detail .otw-stay-fine,.otw-hotel-note{color:#cbd3df!important}
.otw-stay-box{border:1px solid var(--line,#c3c8d0);margin-bottom:28px;background:#293148;color:#ffffff}
.otw-stay-box>div{padding:25px}.otw-stay-box h3{font:500 30px 'Playfair Display',Georgia,serif;margin:10px 0}.otw-stay-box p{font-size:15px;line-height:1.65}.otw-stay-box .button{margin:15px 0}
.otw-stay-fine{font-size:12px!important;line-height:1.6;color:#58647a;margin-top:15px}
.otw-stay-box{background:#293148;color:#ffffff;border-color:#8391a5}.otw-stay-box h3{color:#ffffff}.otw-stay-box p,.otw-stay-box .eyebrow,.otw-stay-box .otw-stay-fine{color:#cbd3df}.otw-stay-box .button,.otw-hotels-grid .button{background:#d9dde4;border-color:#d9dde4;color:#1a212c}.otw-stay-box .button:hover,.otw-hotels-grid .button:hover{background:#fff;color:#1a212c}.otw-hotels-grid article{color:#ffffff;background:#293148;border-color:#8391a5}.otw-hotels-grid h2{color:#ffffff}.otw-hotels-grid .eyebrow,.otw-hotels-grid article p{color:#cbd3df}
.otw-hotels-grid{max-width:1280px;margin:0 auto;padding:0 5vw 70px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;align-items:start}.otw-hotels-grid article{border:1px solid #8391a5;background:#293148;color:#ffffff;min-width:0}.otw-hotels-grid article>div{padding:24px}.otw-hotels-grid h2{font:500 26px/1.25 'Playfair Display',Georgia,serif;min-height:65px;margin:10px 0}.otw-hotels-grid .eyebrow{font-size:11px;min-height:30px}.otw-hotels-grid article p:not(.eyebrow){font-size:15px;line-height:1.6;min-height:74px}.otw-hotel-note{padding:0 5vw 65px;max-width:1280px;margin:auto;color:#58647a;font-size:13px}
.otw-hotel-detail{padding:145px 6vw 80px;max-width:1350px;margin:auto}.otw-hotel-detail h1{font:500 52px/1.15 'Playfair Display',Georgia,serif;margin:20px 0}.otw-hotel-detail>p{font-size:17px;line-height:1.6}.otw-hotel-columns{display:grid;grid-template-columns:1.1fr 1fr;gap:50px}.otw-hotel-columns h2{font:500 34px/1.2 'Playfair Display',Georgia,serif;margin-bottom:25px}.otw-hotel-columns h3{font-size:20px;margin:28px 0 12px}.otw-hotel-columns ul{padding-left:20px;line-height:1.9;margin-bottom:25px}.otw-hotel-columns .button{max-width:100%;white-space:normal}.otw-stay-intro{min-height:0;padding-bottom:50px}
@media(max-width:1000px){.otw-hotels-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.otw-hotels-grid,.otw-hotel-columns{grid-template-columns:1fr}.otw-hotel-detail{padding:125px 6vw 50px}.otw-hotel-detail h1{font-size:36px}.otw-hotels-grid h2,.otw-hotels-grid article p:not(.eyebrow){min-height:0}.otw-hotel-columns{gap:32px}}
/* A real <button> takes the browser's light-grey face under white text (1.1:1).
   The same reset the enquiry form's button has, so it reads like the link beside it. */
.otw-hotel-detail button.button{background:transparent;cursor:pointer;font-family:var(--sans)}
.otw-hotel-detail button.button:hover{background:#d9dde4;border-color:#d9dde4;color:#1a212c}
/* The card's text column, with Explore the Hotel centred at its foot at the
   same distance from the edge on every card (David, 1 Oct 2026). */
.otw-hotels-grid{align-items:stretch}
.otw-hotels-grid article{display:flex;flex-direction:column}
.otw-hotels-grid article>div{display:flex;flex-direction:column;flex:1 1 auto}
.otw-hotels-grid article>div .button{align-self:center;margin:auto 0 0;min-width:200px}
/* The city, and the distance to the stadium on the right, on one line that
   wraps when narrow. Understated: the eyebrow's size, a hairline pill. */
.otw-place{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px}
.otw-place .eyebrow{margin:0}
.otw-miles{flex:none;margin-left:auto;padding:4px 9px;border:1px solid rgba(217,221,228,.4);border-radius:999px;font:500 10.5px/1.3 var(--sans,'Manrope',sans-serif);letter-spacing:.04em;color:#cbd3df;white-space:nowrap}
.otw-hotels-grid h2{margin-top:14px}
.otw-hotel-detail .otw-place{justify-content:flex-start;gap:6px 16px;margin-top:6px}
.otw-hotel-detail .otw-miles{margin-left:0}
/* "Four-Star Hotel", silver, above the hotel's name (cards and hotel page).
   Only where docs/hotel-assets.md records the class; an empty row on a card
   keeps the names level. The stay box's button is centred like the
   cards'. */
.otw-class{margin:16px 0 0;min-height:14px;font:600 10.5px/1.3 var(--sans,'Manrope',sans-serif);letter-spacing:.2em;text-transform:uppercase;color:#d9dde4}
.otw-hotels-grid .otw-class+h2{margin-top:6px}
.otw-hotel-detail .otw-class{margin:18px 0 0}
.otw-hotel-detail .otw-class+h1{margin-top:8px}
.otw-stay-box>div{display:flex;flex-direction:column}
.otw-stay-box>div .button{align-self:center;min-width:200px;text-align:center}
.otw-hotels-grid article p.otw-class,.otw-hotel-detail p.otw-class{min-height:14px;font:600 10.5px/1.3 var(--sans,'Manrope',sans-serif);color:#d9dde4!important}
@media(min-width:651px){.otw-hotels-grid .otw-place{min-height:60px;align-content:flex-start}}
/* The hotel's image with its name over the lower part (David, 2 Oct 2026),
   identical on all five cards and pages: a subtle navy gradient rises only
   behind the name, which is live silver type with a short, fine silver
   accent above it. No logo. The image is the same for all five, the SoFi
   Stadium destination photograph, labelled along its top so it is never
   taken for a picture of the hotel. */
.otw-photo{display:block;width:100%;object-fit:cover;object-position:center 45%;background:#1a212c}
.otw-shot{position:relative;display:block;overflow:hidden;background:#1a212c}
.otw-shot .otw-photo{height:100%}
.otw-shot:before{content:'';position:absolute;left:0;right:0;top:0;height:64px;pointer-events:none;background:linear-gradient(to bottom,rgba(3,22,53,.78),rgba(3,22,53,0))}
.otw-shot:after{content:'';position:absolute;left:0;right:0;bottom:0;height:62%;pointer-events:none;background:linear-gradient(to top,rgba(3,22,53,.86) 0%,rgba(3,22,53,.62) 30%,rgba(3,22,53,.22) 64%,rgba(3,22,53,0) 100%)}
p.otw-shot-tag{position:absolute;z-index:1;left:0;right:0;top:0;margin:0;padding:11px 14px;min-height:0!important;font:600 9px/1.4 var(--sans,'Manrope',sans-serif)!important;letter-spacing:.12em;white-space:nowrap;text-transform:uppercase;color:#d9dde4!important;text-shadow:0 1px 6px rgba(3,22,53,.8)}
p.otw-shot-name{position:absolute;z-index:1;left:0;right:0;bottom:0;margin:0;padding:0 24px 24px;text-align:center;font:500 25px/1.2 'Playfair Display',Georgia,serif!important;letter-spacing:.01em;color:#e3e7ed!important;text-shadow:0 1px 12px rgba(3,22,53,.55);text-wrap:balance;min-height:0!important}
.otw-shot-rule{display:block;width:34px;height:1px;margin:0 auto 12px;background:linear-gradient(90deg,rgba(217,221,228,0),#d9dde4 30%,#d9dde4 70%,rgba(217,221,228,0))}
.otw-shot-card{height:230px}
/* The stadium's own lit sign sits above the name, not under it. */
.otw-shot .otw-photo{object-position:center 92%}
.otw-shot-hero .otw-photo{object-position:center 78%}
.otw-shot-hero{height:clamp(340px,42vw,560px);margin:28px 0 35px}
.otw-shot-hero p.otw-shot-tag{padding:16px 22px;font-size:10.5px!important}
.otw-shot-hero p.otw-shot-name{padding:0 32px 40px;font-size:clamp(32px,3.6vw,50px)!important}
.otw-shot-hero .otw-shot-rule{width:56px;margin-bottom:18px}
@media(max-width:650px){p.otw-shot-tag{white-space:normal}.otw-shot-card{height:220px}.otw-shot-hero{height:280px}.otw-shot-hero p.otw-shot-tag{padding:12px 16px;font-size:9.5px!important}.otw-shot-hero p.otw-shot-name{padding:0 20px 26px;font-size:30px!important}.otw-shot-hero .otw-shot-rule{width:40px;margin-bottom:12px}}
.otw-hotels-grid article{position:relative}
.otw-hotels-grid article>a{display:block;overflow:hidden}
.otw-hotel-columns h3:first-of-type{margin-top:0}
/* The stay box on both packages: the same destination image, whole, with its
   label beneath. */
.otw-stay-media{position:relative;margin:0;background:#293148}
.otw-stay-media figcaption{padding:10px 25px 0}
.otw-media-tag{display:inline-block;font:600 9.5px/1.4 var(--sans,'Manrope',sans-serif);letter-spacing:.16em;text-transform:uppercase;color:#d9dde4}
.otw-destination .otw-photo-box{height:230px}
@media(max-width:650px){.otw-destination .otw-photo-box{height:200px}}
/* Five-star hotel options (David, 11 Oct 2026): a box of its own, above the
   nine cards, in the right-hand column over Hotel Figueroa. Stacks to full
   width on a phone. */
.otw-five-row{max-width:1280px;margin:0 auto;padding:0 5vw 28px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.otw-five-box{grid-column:3;background:#293148;border:1px solid #8391a5;padding:24px 24px 26px;color:#ffffff}
.otw-five-box .eyebrow{color:#e3e8ef;margin:0 0 10px}
.otw-five-box p{font-size:15px;line-height:1.65;color:#cbd3df;margin:0 0 16px}
.otw-five-box button.button{width:100%;background:#d9dde4;border:1px solid #d9dde4;color:#1a212c;cursor:pointer;font-family:var(--sans)}
.otw-five-box button.button:hover{background:#fff;border-color:#fff}
@media(max-width:1000px){.otw-five-row{grid-template-columns:repeat(2,minmax(0,1fr))}.otw-five-box{grid-column:2}}
@media(max-width:650px){.otw-five-row{grid-template-columns:1fr}.otw-five-box{grid-column:1}}

