.trip-section .trip-demo{margin:34px 0 36px;padding:36px 20px;border:1px solid #e8edf5;border-radius:26px;background:radial-gradient(circle at 50% 30%, rgba(255, 255, 255, 0.8), transparent 75%), linear-gradient(135deg, #f8fafc 0%, #edf2f7 50%, #e2e8f0 100%);box-shadow:0 16px 36px rgba(45, 55, 72, 0.06)}.real-demo{display:flex;justify-content:center;min-height:0}
/* ── Tripsy-Inspired Metallic iPhone Chassis (Global) ── */
.demo-video-frame{position:relative;width:268px;max-width:100%;margin:0 auto;box-sizing:border-box;padding:8px 8px 10px 8px;border-radius:46px;background:linear-gradient(#08070b, #08070b) padding-box, linear-gradient(145deg, #ffffff 0%, #e2e6ee 14%, #8c96a7 32%, #d0d6e2 48%, #5a6373 66%, #9da6b6 82%, #f5f7fa 100%) border-box;border:3.5px solid transparent;box-shadow:0 0 0 1px rgba(255, 255, 255, 0.5), 0 0 0 2px rgba(35, 40, 52, 0.55), 0 20px 48px -10px rgba(0, 0, 0, 0.5), 0 35px 80px -15px rgba(0, 0, 0, 0.4), inset 0 0 0 1px rgba(255, 255, 255, 0.12);overflow:visible}
.trip-demo .demo-video-frame video{display:block;width:100%;height:auto;max-height:none;aspect-ratio:1/2;object-fit:cover;border-radius:36px;background:#000000;box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.08)}
/* Dynamic Island Pill */
.demo-video-frame::before{content:"";position:absolute;top:14px;left:50%;transform:translateX(-50%);width:76px;height:20px;background:#000000;border-radius:20px;z-index:10;pointer-events:none;box-shadow:0 0 0 0.5px rgba(255, 255, 255, 0.14), inset 0 0 2px rgba(255, 255, 255, 0.06)}
/* Front Camera Lens Dot */
.demo-video-frame::after{content:"";position:absolute;top:19px;right:calc(50% - 24px);width:9px;height:9px;background:radial-gradient(circle at 35% 35%, #24354d 20%, #0e141f 70%);border-radius:50%;z-index:11;pointer-events:none;box-shadow:inset 0 0 1.5px rgba(110, 165, 255, 0.5)}
/* ── Physical Metallic Hardware Buttons (Tripsy Pro Style) ── */
.phone-buttons{position:absolute;inset:0;pointer-events:none;z-index:9}
.phone-btn{position:absolute;display:block;box-sizing:border-box;background:linear-gradient(180deg, #ffffff 0%, #d8dee9 20%, #8c96a7 45%, #eef2f7 55%, #6a7384 85%, #3f4755 100%) !important}
.phone-btn-action{left:-5.5px !important;top:76px !important;width:3.5px !important;height:22px !important;border-radius:3px 0 0 3px !important;box-shadow:-1.5px 0 2.5px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.8), inset 0 -1px 0 rgba(0,0,0,0.5) !important}
.phone-btn-vol-up{left:-5.5px !important;top:112px !important;width:3.5px !important;height:44px !important;border-radius:3px 0 0 3px !important;box-shadow:-1.5px 0 2.5px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.8), inset 0 -1px 0 rgba(0,0,0,0.5) !important}
.phone-btn-vol-down{left:-5.5px !important;top:168px !important;width:3.5px !important;height:44px !important;border-radius:3px 0 0 3px !important;box-shadow:-1.5px 0 2.5px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.8), inset 0 -1px 0 rgba(0,0,0,0.5) !important}
.phone-btn-power{right:-5.5px !important;top:122px !important;width:3.5px !important;height:64px !important;border-radius:0 3px 3px 0 !important;box-shadow:1.5px 0 2.5px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.8), inset 0 -1px 0 rgba(0,0,0,0.5) !important}
/* ── Screenshot Phone Frame Wrapper (Single Metallic Chassis) ── */
.phone-mockup-frame{position:relative !important;display:inline-block !important;margin:0 auto !important;box-sizing:border-box !important;padding:8px 8px 10px 8px !important;border-radius:46px !important;background:linear-gradient(#08070b, #08070b) padding-box, linear-gradient(145deg, #ffffff 0%, #e2e6ee 14%, #8c96a7 32%, #d0d6e2 48%, #5a6373 66%, #9da6b6 82%, #f5f7fa 100%) border-box !important;border:3.5px solid transparent !important;box-shadow:0 0 0 1px rgba(255, 255, 255, 0.5), 0 0 0 2px rgba(35, 40, 52, 0.55), 0 20px 48px -10px rgba(0, 0, 0, 0.5), 0 35px 80px -15px rgba(0, 0, 0, 0.4), inset 0 0 0 1px rgba(255, 255, 255, 0.12) !important;overflow:visible !important}
.phone-mockup-frame img, .trip-shot-mobile .phone-mockup-frame img, .trip-shots-duo .trip-shot .phone-mockup-frame img{display:block !important;width:auto !important;max-width:100% !important;height:480px !important;max-height:80vh !important;object-fit:cover !important;border-radius:36px !important;padding:0 !important;border:none !important;background:transparent !important;box-shadow:none !important}
.trip-section .trip-creation-flow{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:9px;margin:0 0 34px;padding:0;list-style:none}
.trip-creation-flow li{display:flex;align-items:center;gap:9px;color:#352342;font-size:12px;font-weight:800;line-height:1.4}
.trip-creation-flow li:not(:last-child)::after{content:'→';color:#6f9c00;font-size:16px;font-weight:700}
.trip-creation-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:8px}
.trip-creation-details section{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid #fae7f1;border-radius:14px;background:#fff}
.trip-creation-details section:has(p){align-items:flex-start}
.trip-creation-details section:nth-child(odd):last-child{grid-column:1/-1}
.trip-creation-details>section>span{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:#8ACE00;color:#112403;font-size:10.5px;font-weight:800;box-shadow:0 3px 10px rgba(138,206,0,.4)}
.trip-creation-details h3{margin:0;font:800 14px/1.3 'Bricolage Grotesque',sans-serif;color:#382747}
.trip-creation-details p{margin:5px 0 0!important;color:#796b86!important;font-size:12px!important;line-height:1.6!important}
.trip-shot, .trip-section .trip-shot{margin:26px 0 10px;padding:32px 20px;border:1px solid #e8edf5;border-radius:26px;background:radial-gradient(circle at 50% 30%, rgba(255, 255, 255, 0.8), transparent 75%), linear-gradient(135deg, #f8fafc 0%, #edf2f7 50%, #e2e8f0 100%);box-shadow:0 16px 36px rgba(45, 55, 72, 0.06);text-align:center}
.trip-shot img{display:block;width:auto;max-width:100%;height:380px;object-fit:contain;margin:auto;border:none !important;box-shadow:none !important}
.trip-shot-mobile > img, .trip-shots-duo .trip-shot > img{height:480px;max-height:80vh;object-fit:cover;border-radius:36px;border:none !important;box-shadow:none !important;padding:0 !important;background:transparent !important}
.trip-shot figcaption{color:#8f6d88;font-size:11px;font-weight:700;margin-top:16px}
.trip-shots-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:28px 0 32px}.trip-shots-duo .trip-shot{margin:0;padding:26px 16px}
.trip-shot-essentials{margin:32px 0 34px}
.trip-shot-essentials img{width:min(440px,100%);height:auto;border-radius:24px;box-shadow:0 18px 42px rgba(41,33,57,.14);background:#fff;border:3px solid transparent;background:linear-gradient(#fff, #fff) padding-box, linear-gradient(145deg, #ffffff 0%, #cbd2e0 30%, #6e7789 60%, #e2e7f0 100%) border-box}
.trip-checklist{list-style:none;padding:0!important}
.trip-checklist li{padding:8px 0;display:flex;align-items:center}
.trip-checklist li:before{content:'✓';display:inline-grid;place-items:center;flex:0 0 20px;width:20px;height:20px;border-radius:50%;background:#8ACE00;color:#112403;font-size:11px;font-weight:900;margin-right:12px;box-shadow:0 2px 8px rgba(138,206,0,.4)}
.trip-toc ol li::marker{color:#6f9c00;font-weight:800}
.trip-toc-sub{list-style:none;margin:4px 0 0;padding-left:14px}
.trip-toc-sub li{margin:3px 0 0;font-size:11.5px;color:#8b62ab}
.trip-toc-sub a{color:#8b62ab;font-weight:600}
.trip-section ul:not(.trip-checklist) li::marker{color:#8ACE00}
.trip-section ol:not(.trip-creation-flow) li::marker{color:#6f9c00;font-weight:800}
.trip-launchpad-card{display:flex;align-items:center;gap:24px;margin:28px 0 32px;padding:22px 26px;border:1px solid #fae9f2;border-radius:20px;background:linear-gradient(135deg,#feeff6 0%,#fff5ef 50%,#fffdeb 100%);box-shadow:0 12px 30px rgba(230,80,140,.04)}
.trip-launchpad-visual{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:6px}
.trip-launchpad-pill{display:inline-flex;align-items:center;justify-content:center;background:#fff;padding:8px 16px;border-radius:9999px;border:1.5px solid #fae7f1;box-shadow:0 6px 18px rgba(41,33,57,.08)}
.trip-launchpad-pill img{height:36px;width:auto;display:block}
.trip-launchpad-hint{font-size:10.5px;font-weight:700;color:#9b6b98;letter-spacing:.02em}
.trip-launchpad-info{flex:1 1 auto}
.trip-launchpad-tag{display:inline-block;margin-bottom:6px;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#456b00;background:#f4fce8;border:1px solid #d4f099;border-radius:99px;padding:2px 10px}
.trip-launchpad-info h3{margin:0 0 5px;font:800 16px/1.25 'Bricolage Grotesque',sans-serif;color:#382747}
.trip-launchpad-info p{margin:0!important;color:#796b86!important;font-size:12.5px!important;line-height:1.6!important}
.trip-tools-pills-bar{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:26px 0 28px;padding:20px;border:1px solid #fae9f2;border-radius:20px;background:linear-gradient(135deg,#feeff6 0%,#fff5ef 50%,#fffdeb 100%);box-shadow:0 12px 30px rgba(230,80,140,.03)}
.trip-tools-pill-item{display:inline-flex;align-items:center;justify-content:center;background:#fff;padding:6px 14px;border-radius:9999px;border:1.5px solid #fae7f1;box-shadow:0 6px 16px rgba(41,33,57,.06)}
.trip-tools-pill-item img{height:30px;width:auto;display:block}
.trip-tools-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:12px}
.trip-tool-card{display:flex;flex-direction:column;gap:8px;padding:18px 20px;border:1px solid #fae7f1;border-radius:16px;background:#fff;box-shadow:0 4px 16px rgba(41,33,57,.03)}
.trip-tool-header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.trip-tool-header img{height:28px;width:auto;display:block}
.trip-tool-tag{font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#456b00;background:#f4fce8;border:1px solid #d4f099;border-radius:99px;padding:2px 8px}
.trip-tool-card h3{margin:2px 0 0;font:800 15px/1.25 'Bricolage Grotesque',sans-serif;color:#382747}
.trip-reservations-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:14px}
.trip-reservation-card{display:flex;flex-direction:column;padding:18px 20px;border:1px solid #fae7f1;border-radius:16px;background:#fff;box-shadow:0 4px 16px rgba(41,33,57,.03)}
.trip-reservation-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.trip-reservation-header img{height:28px;width:auto;display:block}
.trip-reservation-card h3{margin:0 0 12px;font:800 16px/1.25 'Bricolage Grotesque',sans-serif;color:#382747}
.trip-reservation-card ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.trip-reservation-card ul li{display:flex;align-items:flex-start;gap:8px;color:#5d486e;font-size:12.5px;line-height:1.45}
.trip-reservation-card ul li strong{color:#382747}
.trip-reservation-card ul li::before{content:'•';color:#8ACE00;font-size:18px;line-height:1;flex-shrink:0}
.expense-table-wrap{width:100%;overflow-x:auto;margin:24px 0 28px;border:1px solid #fae7f1;border-radius:18px;background:#fff;box-shadow:0 4px 16px rgba(41,33,57,.03)}
.expense-table{width:100%;border-collapse:collapse;font-size:13px;text-align:left}
.expense-table th{padding:14px 18px;background:#fdf8fb;color:#553b66;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:12px;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid #fae7f1}
.expense-table td{padding:14px 18px;color:#635272;border-bottom:1px solid #fae7f1;line-height:1.6}
.expense-table tr:last-child td{border-bottom:none}
.expense-table strong{color:#382747}
.expense-method-badge{display:inline-block;padding:3px 10px;border-radius:99px;font-size:11px;font-weight:800;background:#f4fce8;color:#456b00;border:1px solid #d4f099}
@media(max-width:760px){.trip-section .trip-demo{padding:24px 14px;border-radius:20px}.demo-video-frame{width:min(250px,100%) !important;border-radius:40px !important;padding:6px 6px 8px 6px !important}.trip-demo .demo-video-frame video{height:auto !important;border-radius:32px !important}.demo-video-frame::before{top:11px !important;width:66px !important;height:18px !important}.demo-video-frame::after{top:15px !important;right:calc(50% - 21px) !important;width:8px !important;height:8px !important}.phone-btn-action{left:-4.5px !important;top:62px !important;width:3px !important;height:18px !important}.phone-btn-vol-up{left:-4.5px !important;top:92px !important;width:3px !important;height:36px !important}.phone-btn-vol-down{left:-4.5px !important;top:138px !important;width:3px !important;height:36px !important}.phone-btn-power{right:-4.5px !important;top:100px !important;width:3px !important;height:52px !important}.phone-mockup-frame{border-radius:40px !important;padding:6px 6px 8px 6px !important}.phone-mockup-frame img{height:380px !important;border-radius:32px !important}.trip-section .trip-creation-flow{gap:6px 8px}.trip-creation-flow li{font-size:11px}.trip-creation-details{grid-template-columns:1fr}.trip-creation-details section:nth-child(odd):last-child{grid-column:auto}.trip-shot, .trip-section .trip-shot{padding:22px 14px;border-radius:20px}.trip-shots-duo{grid-template-columns:1fr}.trip-shots-duo .trip-shot img, .trip-shot-mobile img{height:380px !important;border-radius:32px !important;padding:0 !important;border:none !important;box-shadow:none !important}.trip-shot-essentials img{width:min(340px,100%)}.trip-launchpad-card{flex-direction:column;text-align:center;gap:14px;padding:18px 14px}.trip-launchpad-pill img{height:32px}.trip-tools-grid{grid-template-columns:1fr}.trip-reservations-grid{grid-template-columns:1fr}.trip-tools-pills-bar{gap:8px;padding:14px}}
