:root { --brand: #007d86; --accent: #38dfcf; --ink: #15282c; --panel: #eff4f3; }
.experience .site-header { gap: 20px; padding-block: 18px; }
.experience .brand { flex-shrink: 0; }
.experience .main-nav { align-items: center; gap: clamp(12px,1.8vw,25px); font-size: .9rem; white-space: nowrap; }
.experience .header-contact { flex-shrink: 0; font-size: .86rem; }
.experience h1,.experience h2 { letter-spacing: -.045em; line-height: 1.08; }
.experience h2 { font-size: clamp(2rem,3.5vw,3.6rem); }
.experience h3 { line-height: 1.25; margin-bottom: 16px; }
.experience .hero { min-height: 690px; padding-block: 74px; background: #09282b; color: #fff; gap: 45px; grid-template-columns: 1.05fr 1fr; }
.experience .hero h1 { font-size: clamp(2.6rem,4.9vw,5rem); }
.experience .hero h1 span { color: #55e5d0; }
.experience .hero-lead { color: #c7d9db; font-size: 1.1rem; line-height: 1.8; max-width: 590px; }
.experience .partner-badge { color: #a4f8e8; border: 1px solid #3c6a68; display: inline-block; padding: 9px 14px; border-radius: 100px; margin-bottom: 28px; }
.experience .hero-media { margin: 0; border: 1px solid #38524f; border-radius: 28px; box-shadow: 0 28px 70px #0004; position: relative; background: #030807; }
.experience .hero-media img { min-height: 480px; object-fit: cover; object-position: center; padding: 0; }
.experience .hero-media figcaption { position: absolute; inset: auto 22px 22px; background: #eafff2ed; color: #133b38; padding: 18px 22px; border-radius: 14px; display: grid; gap: 6px; }
.experience figcaption span { font-size: .75rem; text-transform: uppercase; letter-spacing: .1em; }
.experience figcaption a { text-decoration: none; font-weight: 800; }
.experience .button { border-radius: 100px; padding: 15px 25px; font-weight: 750; }
.experience .hero .primary { background: #57e4ca; color: #08332b; border-color: #57e4ca; }
.experience .hero .secondary { background: transparent; border-color: #6a908e; color: #fff; }
.experience .hero-points { color: #bad3d1; font-size: .85rem; }
.platform-paths { display: grid; grid-template-columns: repeat(3,1fr); background: #d6efe8; }
.platform-paths a { display: grid; padding: 32px clamp(24px,4vw,60px); gap: 12px; text-decoration: none; border-right: 1px solid #adcdc4; transition: background .25s; }
.platform-paths a:hover { background: #b9e5d8; }
.platform-paths span { text-transform: uppercase; font-size: .7rem; letter-spacing: .1em; }
.platform-paths strong { font-size: 1.35rem; letter-spacing: -.03em; }
.platform-paths small { font-size: .88rem; }
.experience .section { padding-block: 84px; }
.experience .section-heading { align-items: end; }
.experience .service-card,.experience .room-card,.experience .faq-item,.experience .step { border-radius: 20px; box-shadow: none; transition: transform .3s,border-color .3s; }
.experience .service-card { overflow: hidden; }
.experience .service-card-image { border-radius: 14px; }
.experience .service-card .icon { display: none; }
.experience .service-card:hover,.experience .room-card:hover { transform: translateY(-5px); border-color: #008b7c; }
.experience .steps { counter-reset: process; }
.experience .step::before { counter-increment: process; content: '0' counter(process); background: #d6efe8; color: #14594d; font-size: 1.2rem; font-weight: 800; display: grid; place-items: center; border: 0; border-radius: 50%; }
.experience .contact { background: #e0eee8; }
.experience .contact-card { border-radius: 24px; box-shadow: none; }
.experience .footer { background: #09282b; }
.experience .text-link::after { content: ' ↗'; }
.experience .product-tile { border-radius: 14px; }
.experience .mobile-contact-bar { border-radius: 18px; }
.ai-section { display:grid; grid-template-columns:1fr 1fr; gap:60px; background:#09282b; color:#fff; }
.ai-section .eyebrow { color:#57e4ca; }
.ai-section h2 { margin-bottom:24px; }
.ai-notice { font-size:.85rem; color:#bad3d1; }
.ai-card { background:white; border-radius:24px; padding:28px; color:#15282c; }
.ai-card textarea { margin-block:12px; }
#ai-log { max-height:400px; overflow:auto; }
#ai-log p { white-space:pre-wrap; padding:14px; background:#eff4f3; border-radius:12px; font-size:.95rem; }
#ai-status { margin:14px 0 0; font-size:.85rem; }
[hidden] { display:none!important; }
@media(max-width:980px) { .ai-section { grid-template-columns:1fr; gap:28px; } }
.experience [data-enter] { animation: enter .45s ease both; }
@keyframes enter { from { opacity: .3; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media(max-width:1180px) {
 .experience .main-nav,.experience .header-contact { display:none; }
 .experience .nav-toggle { display:block; }
 .experience .main-nav.open { display:flex; position:absolute; top:100%; inset-inline:24px; flex-direction:column; align-items:stretch; background:#fff; padding:16px; border:1px solid #d8e4ec; border-radius:16px; box-shadow:0 20px 40px #0002; }
 .experience .main-nav.open a { padding:10px; }
}
@media(max-width:980px) { .experience .hero { grid-template-columns:1fr; } .experience .hero-media img { min-height:0; max-height:520px; object-fit:cover; } .platform-paths { grid-template-columns:1fr; } }
@media(max-width:720px) { .experience .hero { padding-block:44px; min-height:0; } .experience .hero h1 { font-size:2.55rem; overflow-wrap:normal; word-break:normal; } .experience .hero-media img { padding:0; } .experience .hero-media figcaption { inset-inline:12px; bottom:12px; padding:12px; } .experience .section { padding-block:54px; } .experience .hero-actions .button { width:100%; } }
@media(prefers-reduced-motion:reduce) { .experience [data-enter] { animation:none; } .experience * { scroll-behavior:auto!important; transition:none!important; } }