/* Hotels & Tourismus, Läden & Unternehmen (includes/industry-page.php).
   Builds on site.css (frame, phone) and home.css (conversation and formats). */

/* Conversation: the homepage demo on a white surface, with a visible title. */
.industry-chat { background: var(--surface); }
.industry-chat .section-heading { margin-bottom: 56px; }

/* Läden: Claude first imports the product images from the shop. */
.prompt-import { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 18px; padding-top: 16px; border-top: 1px solid rgb(0 0 61 / 8%); }
.prompt-import-source { color: var(--muted); font-size: 11px; font-weight: 700; line-height: 1.4; letter-spacing: .16em; text-transform: uppercase; }
.prompt-import-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.prompt-import-item { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 14px; background: linear-gradient(160deg, #f7f8fb, #e6ebf2); box-shadow: inset 0 0 0 1px rgb(0 0 61 / 6%); }
.prompt-import-item > svg { width: 86%; height: auto; }
.prompt-import-done { display: inline-flex; align-items: center; gap: 6px; margin-left: 6px; color: #248348; font-size: 14px; font-weight: 650; line-height: 1.4; letter-spacing: -.01em; }
.prompt-import-done .icon { width: 16px; height: 16px; stroke-width: 2.4; }

/* Motion (only once home.js has taken over): words and images at .is-import, the reply waits for .is-reply. */
.prompt-animated.is-thinking.is-import .prompt-tool .prompt-thinking { opacity: 0; }
.prompt-animated.is-import .prompt-tool .prompt-word { opacity: 1; filter: none; transform: none; }
.prompt-animated .prompt-import-item, .prompt-animated .prompt-import-done { opacity: 0; transform: translateY(10px) scale(.85); transition: opacity .5s var(--ease), transform .7s var(--spring); }
.prompt-animated .prompt-import-item { transition-delay: calc(.7s + var(--i) * .3s); }
.prompt-animated .prompt-import-done { transition-delay: 1.5s; }
.prompt-animated.is-import .prompt-import-item, .prompt-animated.is-import .prompt-import-done { opacity: 1; transform: none; }
.prompt-animated.is-thinking:not(.is-reply) .prompt-tool ~ .prompt-reply { opacity: 0; filter: blur(10px); transform: translateY(26px) scale(.95); }

/* Hotel draft: the Wallis panorama in the entrance layout of the homepage. */
.hike-slide .entry-media > img { object-position: 50% 55%; }

/* Shop draft: two imported products, laid out per format. */
.shop-slide { position: absolute; inset: 0; display: grid; overflow: hidden; background: radial-gradient(circle at 88% 12%, #fff 0, transparent 50%), #eef1f6; color: #122549; }
.shop-copy { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; min-height: 0; }
.shop-brand { font-weight: 700; line-height: 1; letter-spacing: .16em; }
.shop-brand > span { font-weight: 450; opacity: .55; }
.shop-pill { padding: .5em 1em .45em; border-radius: 99px; background: #d8253a; color: #fff; font-weight: 700; line-height: 1.2; letter-spacing: .12em; text-transform: uppercase; }
.shop-title { font-weight: 760; line-height: .98; letter-spacing: -.055em; }
.shop-foot { margin-top: auto; color: #5b6a82; font-weight: 600; line-height: 1.3; }
.shop-products { display: grid; min-width: 0; min-height: 0; }
.shop-product { display: grid; min-width: 0; min-height: 0; overflow: hidden; background: #fff; box-shadow: 0 1px 2px rgb(18 37 73 / 8%); }
.shop-product-art { display: grid; place-items: center; min-width: 0; min-height: 0; background: linear-gradient(160deg, #f7f8fb, #e6ebf2); }
.shop-product-art > svg { width: 100%; height: 100%; }
.shop-product-copy { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.shop-product-copy > strong { font-weight: 700; line-height: 1.1; letter-spacing: -.035em; }
.shop-price { color: #d8253a; font-weight: 760; line-height: 1; letter-spacing: -.05em; white-space: nowrap; }
.shop-price > small { color: #122549; font-size: .4em; font-weight: 650; letter-spacing: .04em; }
.shop-price > s { display: block; margin-top: .35em; color: #8190a6; font-size: .38em; font-weight: 500; letter-spacing: 0; }

.format-portrait .shop-slide { grid-template-rows: auto minmax(0, 1fr); gap: 7cqw; padding: 8cqw 7cqw 7cqw; }
.format-portrait .shop-brand { font-size: 3.4cqw; }
.format-portrait .shop-pill { margin-top: 8cqw; font-size: 2.9cqw; }
.format-portrait .shop-title { margin-top: 4cqw; font-size: 12cqw; }
.format-portrait .shop-foot { margin-top: 3.5cqw; font-size: 3.8cqw; }
.format-portrait .shop-products { grid-template-rows: 1fr 1fr; gap: 4cqw; }
.format-portrait .shop-product { grid-template-columns: 46% minmax(0, 1fr); border-radius: 4cqw; }
.format-portrait .shop-product-art { padding: 3cqw; }
.format-portrait .shop-product-copy { gap: 2.5cqw; padding: 4cqw; }
.format-portrait .shop-product-copy > strong { font-size: 4.6cqw; }
.format-portrait .shop-price { font-size: 8.5cqw; }

.format-landscape .shop-slide { grid-template-columns: 37% minmax(0, 1fr); gap: 3.4cqw; padding: 4.6cqw; }
.format-landscape .shop-brand { font-size: 1.5cqw; }
.format-landscape .shop-pill { margin-top: 5cqw; font-size: 1.3cqw; }
.format-landscape .shop-title { margin-top: 2.2cqw; font-size: 5cqw; }
.format-landscape .shop-foot { font-size: 1.6cqw; }
.format-landscape .shop-products { grid-template-columns: 1fr 1fr; gap: 2cqw; }
.format-landscape .shop-product { grid-template-rows: minmax(0, 1fr) auto; border-radius: 1.8cqw; }
.format-landscape .shop-product-art { padding: 1.5cqw; }
.format-landscape .shop-product-copy { gap: 1cqw; padding: 1.6cqw 1.8cqw 1.9cqw; }
.format-landscape .shop-product-copy > strong { font-size: 1.9cqw; }
.format-landscape .shop-price { font-size: 3.6cqw; }

.format-banner .shop-slide { grid-template-columns: 30% minmax(0, 1fr); gap: 3cqw; padding: 3.4cqw 3.6cqw; }
.format-banner .shop-brand { font-size: 1.2cqw; }
.format-banner .shop-pill { margin-top: 2.4cqw; font-size: 1.05cqw; }
.format-banner .shop-title { margin-top: 1.6cqw; font-size: 4.2cqw; }
.format-banner .shop-foot { font-size: 1.25cqw; }
.format-banner .shop-products { grid-template-columns: 1fr 1fr; gap: 2cqw; }
.format-banner .shop-product { grid-template-columns: 44% minmax(0, 1fr); border-radius: 1.6cqw; }
.format-banner .shop-product-art { padding: 1cqw; }
.format-banner .shop-product-copy { gap: .9cqw; padding: 1.4cqw 1.8cqw; }
.format-banner .shop-product-copy > strong { font-size: 1.8cqw; }
.format-banner .shop-price { font-size: 3.4cqw; }

.prompt-animated .shop-copy > *, .prompt-animated .shop-product { opacity: 0; transform: translateY(14px); transition: opacity .7s var(--ease), transform .8s var(--ease); transition-delay: calc(.45s + var(--d) * 110ms); }
.prompt-animated .format-landscape :is(.shop-copy > *, .shop-product) { transition-delay: calc(.6s + var(--d) * 110ms); }
.prompt-animated .format-banner :is(.shop-copy > *, .shop-product) { transition-delay: calc(.75s + var(--d) * 110ms); }
.prompt-animated.is-screens :is(.shop-copy > *, .shop-product) { opacity: 1; transform: none; }

/* Places: a small screen, a title and one sentence each. */
.place-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px 28px; margin: 0; padding: 0; list-style: none; }
.place { min-width: 0; }
.js-motion .place.reveal { transition-delay: calc(var(--i) * 90ms); }
.place-screen { aspect-ratio: 16 / 9; }
.place h3 { margin: 28px 0 10px; font-size: 21px; font-weight: 700; line-height: 1.25; letter-spacing: -.03em; }
.place p { margin: 0; color: var(--muted); font-size: 15.5px; line-height: 1.7; }

.mini-slide { position: absolute; inset: 0; display: grid; overflow: hidden; background: #fff; color: #17191b; }
.mini-slide > img { width: 100%; height: 100%; min-height: 0; object-fit: cover; }
.mini-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-width: 0; padding: 0 6cqw; }
.mini-copy > strong { font-size: 7.4cqw; font-weight: 760; line-height: 1; letter-spacing: -.05em; }
.mini-copy > strong + span { margin-top: 2.6cqw; color: #5b5f66; font-size: 3cqw; line-height: 1.3; }
.mini-pill { margin-bottom: 3cqw; padding: .45em 1em .4em; border-radius: 99px; background: #0e7a58; color: #fff; font-size: 2.1cqw; font-weight: 700; line-height: 1.2; letter-spacing: .14em; text-transform: uppercase; }
.mini-pill.is-red { background: #d8253a; }
.mini-kicker { margin-bottom: 2.6cqw; font-size: 2.3cqw; font-weight: 700; line-height: 1.3; letter-spacing: .14em; text-transform: uppercase; opacity: .6; }
.mini-logo { display: flex; align-items: center; gap: 1.4cqw; margin-bottom: 4cqw; color: #17191b; font-size: 2.8cqw; font-weight: 760; letter-spacing: -.03em; }
.mini-logo > svg { width: 5cqw; height: auto; color: #0e7a58; }

.mini-lobby { grid-template-columns: 56% 44%; }
.mini-lobby ul { margin: 4cqw 0 0; padding: 0; list-style: none; }
.mini-lobby li { display: flex; gap: 2cqw; font-size: 2.8cqw; line-height: 1.7; }
.mini-lobby li > b { color: #0e7a58; font-weight: 700; }

.mini-photo { background: #1a120c; color: #fff; }
.mini-photo > img { position: absolute; inset: 0; }
.mini-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(12 8 4 / 84%), rgb(12 8 4 / 55%) 45%, transparent 78%); }
.mini-photo .mini-copy { position: relative; z-index: 1; }
.mini-photo .mini-pill { background: #fff; color: #0e7a58; }
.mini-photo .mini-copy > span:last-child { color: rgb(255 255 255 / 82%); }
.mini-price { position: absolute; z-index: 1; top: 50%; right: 6cqw; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 19cqw; aspect-ratio: 1; border-radius: 50%; background: #d8253a; font-size: 5.4cqw; font-weight: 760; line-height: 1; letter-spacing: -.04em; transform: translateY(-50%); box-shadow: 0 2cqw 5cqw -2cqw rgb(0 0 0 / 45%); }
.mini-price > small { margin-bottom: .6cqw; font-size: 1.8cqw; font-weight: 600; letter-spacing: .06em; }

.mini-split { grid-template-columns: 50% 50%; }

.mini-product { grid-template-columns: 56% 44%; align-items: center; padding-right: 3cqw; background: radial-gradient(circle at 80% 30%, #fff, transparent 60%), #eef1f6; color: #122549; }
.mini-product > svg { width: 100%; height: auto; }
.mini-copy > .mini-product-price { margin-top: 3cqw; color: #d8253a; font-size: 5.6cqw; font-weight: 760; letter-spacing: -.05em; white-space: nowrap; }
.mini-product-price > small, .mini-product-price > s { color: #122549; font-size: 2cqw; font-weight: 600; letter-spacing: .04em; }
.mini-product-price > s { color: #8190a6; font-weight: 500; }

.mini-voucher { grid-template-columns: 58% 42%; background: #122549; color: #fff; }
.mini-voucher .mini-copy > span:last-child { color: rgb(255 255 255 / 75%); }
.mini-voucher-card { display: flex; flex-direction: column; justify-content: space-between; align-self: center; justify-self: center; width: 30cqw; aspect-ratio: 1.6; padding: 2.6cqw 3cqw; border-radius: 2cqw; background: linear-gradient(135deg, #e0354a, #b51d30); box-shadow: 0 3cqw 6cqw -2cqw rgb(0 0 0 / 55%); transform: rotate(-8deg); }
.mini-voucher-card > b { font-size: 3.2cqw; letter-spacing: .16em; }
.mini-voucher-card > i { font-size: 2.3cqw; font-style: normal; font-weight: 600; opacity: .85; }

.mini-reception { align-content: center; padding: 0 7cqw; background: linear-gradient(135deg, #fff 55%, #eef1f6); color: #122549; }
.mini-reception > strong { font-size: 8.4cqw; font-weight: 760; line-height: 1; letter-spacing: -.05em; }
.mini-brand { position: absolute; top: 7cqw; left: 7cqw; font-size: 2.4cqw; font-weight: 700; letter-spacing: .16em; }
.mini-brand > span { font-weight: 450; opacity: .55; }
.mini-foot { position: absolute; right: 7cqw; bottom: 6cqw; left: 7cqw; padding-top: 2.4cqw; border-top: 1px solid rgb(18 37 73 / 18%); font-size: 2.4cqw; }

.mini-team { grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding-right: 7cqw; background: linear-gradient(135deg, #2c1618, #121212 60%); color: #fff; }
.mini-team .mini-kicker { color: #e8664f; opacity: 1; }
.mini-time { display: flex; flex-direction: column; padding-left: 5cqw; border-left: 1px solid rgb(255 255 255 / 20%); font-size: 9cqw; font-weight: 700; line-height: 1; letter-spacing: -.04em; }
.mini-time > small { margin-top: 1.8cqw; font-size: 2.2cqw; font-weight: 500; letter-spacing: .02em; opacity: .7; }

/* On the go: copy on the left, the Claude phone from the launch film on the right. */
.industry-phone-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; gap: 80px; }
.industry-phone .vy-title { margin-bottom: 36px; font-size: clamp(44px, 4.6vw, 80px); }
.industry-phone-copy > p:not(.vy-eyebrow) { max-width: 540px; margin: 0 0 18px; color: var(--muted); font-size: 17px; line-height: 1.75; }
.industry-phone-copy > .industry-phone-principle { color: var(--primary); font-weight: 650; }
.industry-phone-copy .text-link { margin-top: 10px; }
.industry-phone-figure { margin: 0; text-align: center; }
.industry-phone-figure > figcaption { margin-top: 30px; color: var(--vy-sub); font-size: 15px; }
.industry-phone-figure > figcaption strong { color: var(--primary); font-weight: 750; }
.industry-phone-figure > figcaption span { margin-left: 4px; color: var(--muted); font-size: 12px; }

/* Price: two worked examples with the monthly amount. */
.price-example { max-width: 900px; margin: 0 auto; padding: 12px 44px 36px; }
.price-example-list { margin: 0; padding: 0; list-style: none; }
.price-example-list > li { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; align-items: center; gap: 28px; padding: 28px 0; border-bottom: 1px solid var(--line); }
.price-example-count { display: flex; flex-direction: column; color: var(--muted); font-size: 13px; font-weight: 600; letter-spacing: .02em; }
.price-example-count > b { font-size: 48px; font-weight: 800; line-height: 1.05; letter-spacing: -.05em; background: var(--vy-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; }
.price-example-copy { color: var(--muted); font-size: 15.5px; line-height: 1.6; }
.price-example-copy > strong { display: block; margin-bottom: 4px; color: var(--primary); font-size: 21px; font-weight: 700; line-height: 1.3; letter-spacing: -.03em; }
.price-example-amount { display: flex; align-items: baseline; gap: 7px; color: var(--primary); font-size: 46px; font-weight: 600; line-height: 1; letter-spacing: -.05em; white-space: nowrap; }
.price-example-amount > small { font-size: 15px; font-weight: 650; letter-spacing: 0; }
.price-example-amount > small:last-child { color: var(--muted); font-size: 13px; font-weight: 500; }
.price-example-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-top: 32px; }

@media (max-width: 1050px) {
  .place-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 32px; }
  .industry-phone-grid { gap: 48px; }
}
@media (max-width: 760px) {
  .industry-chat .section-heading { margin-bottom: 40px; }
  .prompt-import { margin-top: 14px; padding-top: 12px; }
  .prompt-import-item { width: 50px; height: 50px; border-radius: 11px; }
  .prompt-import-done { margin-left: 2px; font-size: 13px; }
  .place-grid { gap: 40px 20px; }
  .place h3 { margin-top: 20px; font-size: 19px; }
  .place p { font-size: 15px; }
  .industry-phone-grid { grid-template-columns: 1fr; gap: 56px; }
  .industry-phone .vy-title { font-size: clamp(36px, 10vw, 52px); }
  .industry-phone-copy > p:not(.vy-eyebrow) { font-size: 16px; }
  .price-example { padding: 4px 22px 26px; }
  .price-example-list > li { grid-template-columns: 64px minmax(0, 1fr); gap: 6px 18px; padding: 22px 0; }
  .price-example-count > b { font-size: 38px; }
  .price-example-copy > strong { font-size: 19px; }
  .price-example-amount { grid-column: 2; margin-top: 8px; font-size: 36px; }
  .price-example-actions { flex-direction: column; align-items: stretch; text-align: center; }
  .price-example-actions .text-link { justify-content: center; }
}
@media (max-width: 560px) {
  .place-grid { grid-template-columns: 1fr; }
}
