/* Concept 1+ — a focused enhancement layer for the local review mock. */
:root {
  --ink: #090a14;
  --plum: #24162f;
  --violet: #a978ff;
  --violet-bright: #d7c2ff;
  --hairline: rgba(202, 174, 255, .2);
  --section-index: rgba(213, 191, 255, .42);
}

html { scroll-behavior: auto; scrollbar-color: #7650b3 #0b0c15; }
body.concept-one {
  background:
    radial-gradient(900px 560px at 88% 2%, rgba(103, 53, 157, .25), transparent 68%),
    radial-gradient(760px 520px at -8% 38%, rgba(83, 42, 124, .14), transparent 72%),
    var(--ink);
}
body.concept-one::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.012) 1px, transparent 1px);
  background-size: 100% 6px;
  mask-image: linear-gradient(to bottom, black, transparent 78%);
}

.concept-one .site-nav { background: rgba(9, 10, 20, .88); border-color: rgba(198, 166, 255, .13); }
.concept-one .nav-inner { height: 72px; }
.concept-one .nav-progress { position: absolute; inset: auto 0 -1px; height: 1px; overflow: hidden; }
.concept-one .nav-progress > span { display: block; width: var(--page-progress, 0%); height: 100%; background: linear-gradient(90deg, #7c4dff, #c79cff, #7fa5ff); box-shadow: 0 0 14px #9c6cff; }
.concept-one .nav-links { gap: clamp(17px, 2vw, 28px); font-size: 12px; }
.concept-one .nav-links a { min-height: 44px; display: inline-flex; align-items: center; position: relative; }
.concept-one .nav-links a::after { content: ''; position: absolute; left: 0; right: 100%; bottom: 5px; height: 1px; background: #c7a9ff; transition: right .2s ease; }
.concept-one .nav-links a:hover::after,
.concept-one .nav-links a[aria-current="location"]::after { right: 0; }
.concept-one button:not(.real-capture):not(.video-poster),
.concept-one .product-topbar a { min-height: 44px; }
.concept-one .product-topbar a,
.concept-one .dialog-close,
.concept-one .mobile-nav { min-width: 44px; }
.concept-one .authentic-profile .product-topbar { min-height: 44px; }

.concept-one .hero { min-height: min(800px, calc(100vh - 72px)); padding-top: 56px; padding-bottom: 72px; }
.concept-one .hero-copy { max-width: 620px; }
.concept-one .hero h1 { font-size: clamp(62px, 7.15vw, 104px); line-height: .94; letter-spacing: -.066em; text-wrap: balance; }
.concept-one .hero-intro { border-left: 1px solid rgba(195, 159, 255, .48); padding-left: 18px; max-width: 430px; color: #cbc4da; }
.concept-one .hero-stage::after { content: ''; position: absolute; width: 7px; height: 7px; right: 8%; top: 13%; border-radius: 50%; background: #d1b8ff; box-shadow: 0 0 8px #d1b8ff, 0 0 34px 12px rgba(149,100,255,.35); }
.concept-one .main-profile .product-frame { border-color: rgba(198, 163, 255, .43); box-shadow: 0 42px 120px rgba(1, 3, 14, .76), 0 0 80px rgba(133, 73, 218, .16); }

.concept-one .audience-paths { position: relative; margin-top: 0; border-radius: 0; border-width: 1px 0; background: rgba(24, 20, 38, .72); }
.concept-one .audience-paths::before { content: ''; position: absolute; left: 8%; right: 8%; top: 39px; height: 1px; background: linear-gradient(90deg, transparent, rgba(179,139,255,.35) 12%, rgba(179,139,255,.35) 88%, transparent); pointer-events: none; }
.concept-one .audience-paths > a { position: relative; min-height: 178px; padding: 30px 32px 27px; isolation: isolate; }
.concept-one .audience-paths > a::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #a978ff; box-shadow: 0 0 16px rgba(169,120,255,.8); margin: 6px 0 4px; order: -1; }
.concept-one .audience-paths strong { font-size: clamp(21px, 2vw, 27px); }
.concept-one .ecosystem-line { display: flex; align-items: center; gap: 16px; padding: 20px 0 0; color: #aaa3b9; font-size: 11px; letter-spacing: .035em; }
.concept-one .ecosystem-line::before { content: 'ONE SYSTEM'; color: #cdb4ff; letter-spacing: .16em; font-size: 9px; white-space: nowrap; }
.concept-one .ecosystem-line::after { content: ''; height: 1px; flex: 1; background: linear-gradient(90deg, var(--hairline), transparent); }

.concept-one .section { position: relative; }
.concept-one .section[data-chapter]::before { content: attr(data-chapter); position: absolute; top: 58px; left: max(22px, calc((100vw - 1340px) / 2)); font: 500 10px/1 Inter, sans-serif; letter-spacing: .17em; color: var(--section-index); writing-mode: vertical-rl; }
.concept-one .section-head { margin-bottom: 48px; }
.concept-one .section-head h2 { line-height: 1.01; text-wrap: balance; }
.concept-one .section-head > p { color: #aaa5b7; max-width: 330px; }

.concept-one .real-product-section { padding-top: 118px; }
.concept-one .tour-tabs { gap: 2px; padding: 0 0 15px; }
.concept-one .tour-tabs button { min-height: 48px; border-radius: 7px; padding-inline: 18px; }
.concept-one .tour-tabs button[aria-selected="true"] { background: #a87aff; box-shadow: 0 8px 30px rgba(149, 100, 255, .18); }
.concept-one .tour-browser,
.concept-one [data-agency-scene] { position: relative; border-color: rgba(184, 144, 255, .42); box-shadow: 0 34px 110px rgba(0, 2, 14, .62), 0 0 90px rgba(110, 58, 173, .12); }
.concept-one .tour-browser::after,
.concept-one [data-agency-scene]::after { content: none; position: absolute; right: 14px; top: 11px; z-index: 4; pointer-events: none; color: #a99abf; font: 600 8px/1 Inter, sans-serif; letter-spacing: .14em; }
.concept-one .tour-browser .product-topbar { background: #12131e; }
.concept-one .real-capture:focus-visible { outline-offset: -4px; }
.concept-one .capture-enlarge { opacity: 1; background: rgba(16,14,30,.86); }

.concept-one .fan-section { background: radial-gradient(800px 520px at 17% 45%, rgba(87,44,143,.27), transparent 68%), #10111c; }
.concept-one .fan-copy > p:not(.eyebrow) { color: #c0b9cb; }
.concept-one .fan-opportunities button { min-height: 58px; }
.concept-one .fan-opportunity-panel { border-left: 1px solid rgba(181, 143, 244, .25); padding-left: 20px; }
.concept-one .fan-reputation { display: flex; gap: 10px; flex-wrap: wrap; margin: 8px 0 20px; }
.concept-one .fan-reputation span { color: #bdb2ce; font-size: 10px; border: 1px solid rgba(170,134,224,.3); padding: 6px 9px; border-radius: 999px; }

.concept-one .rights-shell { border-radius: 8px; padding: clamp(32px, 5vw, 64px); background: radial-gradient(ellipse at 81% 60%, rgba(103,66,186,.25), transparent 60%), linear-gradient(145deg, #191525, #11131f); }
.concept-one .rights-art { isolation: isolate; }
.concept-one .rights-halo { animation: none; }
.concept-one .shield-art img { border-radius: 31px; }

.concept-one .calls-proof { gap: clamp(50px, 7vw, 96px); }
.concept-one .call-phone { border-radius: 31px; box-shadow: 0 34px 100px rgba(0,2,18,.75), 0 0 80px rgba(120,68,194,.18); }
.concept-one .call-availability { font-size: 11px !important; color: #9f96ae; }
.concept-one .agency-proof { background: radial-gradient(900px 560px at 17% 52%, rgba(72,40,123,.27), transparent 72%), #0d101b; }
.concept-one .agency-features { margin-bottom: 28px; }
.concept-one .agency-features span { border-radius: 999px; background: rgba(44,35,61,.55); }

.concept-one .ai-proof { align-items: stretch; }
.concept-one .ai-story { align-self: center; }
.concept-one .ai-prompts { border-radius: 8px; background: radial-gradient(ellipse at 10% 0, rgba(93,63,149,.26), transparent 64%), #14141f; }
.concept-one .ai-prompts > button { border-radius: 6px; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.concept-one .ai-prompts > button:hover { transform: translateX(3px); }

.concept-one .calculator-shell { border-radius: 8px; box-shadow: 0 34px 110px rgba(0,2,18,.66), 0 0 80px rgba(113,65,192,.08); }
.concept-one .calc-controls,
.concept-one .calc-results { padding: clamp(26px, 3vw, 42px); }
.concept-one .calc-kicker { margin: 4px 0 9px; color: #9f96ae; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.concept-one .calc-guide { margin: -13px 0 24px; font-size: 12px; line-height: 1.6; color: #9f98ad; max-width: 420px; }
.concept-one .calc-presets { margin-bottom: 24px; }
.concept-one .calc-options { margin-top: 8px; }

.concept-one .closing { padding-block: 112px; background: radial-gradient(ellipse at 50% 105%, rgba(102, 42, 202, .42), transparent 65%), #0b0c15; }
.concept-one .closing-copy { max-width: 520px; margin: -12px auto 27px; font-size: 13px; }
.concept-one .closing h2 { font-size: clamp(52px, 7vw, 94px); }

@keyframes rights-breathe {
  from { opacity: .62; transform: scale(.97); }
  to { opacity: 1; transform: scale(1.025); }
}

@media (min-width: 1440px) {
  .concept-one .wrap { width: min(1280px, calc(100% - 96px)); }
  .concept-one .hero { grid-template-columns: 1fr 1.08fr; gap: 56px; }
  .concept-one .hero-stage { min-height: 610px; }
  .concept-one .tour-browser .real-capture,
  .concept-one .tour-browser .real-capture img { max-height: 620px; }
}

@media (max-width: 1100px) {
  .concept-one .section[data-chapter]::before { display: none; }
  .concept-one .nav-links { gap: 15px; }
}

@media (max-width: 760px) {
  .concept-one .wrap { width: min(100% - 36px, 620px); }
  .concept-one .nav-inner { height: 70px; }
  .concept-one .hero { min-height: 0; padding-top: 42px; padding-bottom: 35px; }
  .concept-one .hero h1 { font-size: clamp(51px, 14vw, 75px); }
  .concept-one .hero-intro { margin-top: 25px; }
  .concept-one .audience-paths { grid-template-columns: 1fr; width: 100%; }
  .concept-one .audience-paths::before { top: 34px; bottom: 34px; left: 26px; width: 1px; height: auto; right: auto; background: linear-gradient(transparent, rgba(179,139,255,.36) 12%, rgba(179,139,255,.36) 88%, transparent); }
  .concept-one .audience-paths > a { min-height: 0; padding: 23px 24px 23px 49px; }
  .concept-one .audience-paths > a + a { border-left: 0; border-top: 1px solid rgba(73,64,92,.45); }
  .concept-one .audience-paths > a::before { position: absolute; left: 23px; top: 29px; }
  .concept-one .audience-paths strong { font-size: 22px; }
  .concept-one .ecosystem-line { width: calc(100% - 36px); margin-inline: auto; align-items: flex-start; line-height: 1.55; }
  .concept-one .section { padding-block: 76px; }
  .concept-one .real-product-section { padding-top: 86px; }
  .concept-one .section-head { margin-bottom: 34px; }
  .concept-one .tour-caption { align-items: flex-start; }
  .concept-one .tour-browser::after,
  .concept-one [data-agency-scene]::after { display: none; }
  .concept-one .fan-opportunity-panel { min-height: 196px; }
  .concept-one .rights-shell { border-radius: 8px; }
  .concept-one .ai-prompts { border-radius: 8px; }
  .concept-one .calculator-shell { border-radius: 8px; }
  .concept-one .closing { padding-block: 84px; }
  .concept-one .closing .actions .btn { flex: 1 1 150px; }
}

@media (max-width: 390px) {
  .concept-one .wrap { width: calc(100% - 30px); }
  .concept-one .hero h1 { font-size: clamp(49px, 13.2vw, 58px); }
  .concept-one .hero-stage { min-height: 470px; }
  .concept-one .audience-paths > a { padding-right: 18px; }
  .concept-one .tour-tabs button { padding-inline: 13px; }
  .concept-one .fan-opportunities button { min-width: 82px; }
  .concept-one .fan-opportunity-panel { padding-left: 15px; }
  .concept-one .call-phone { width: min(270px, 82vw); }
}

@media (max-width: 330px) {
  .concept-one .wrap { width: calc(100% - 24px); }
  .concept-one .hero h1 { font-size: 45px; }
  .concept-one .hero-stage { min-height: 450px; }
  .concept-one .hero .actions > * { width: 100%; justify-content: space-between; }
  .concept-one .ecosystem-line::after { display: none; }
  .concept-one .fan-opportunities { overflow-x: auto; }
  .concept-one .fan-opportunities button { flex: 0 0 86px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .concept-one *, .concept-one *::before, .concept-one *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .concept-one .rights-halo { animation: none; }
  .concept-one .ai-prompts > button:hover { transform: none; }
}

/* Product proof follows the layout of its container, not a shrunken desktop canvas. */
.concept-one .real-insights .real-capture { height: auto; aspect-ratio: 716 / 1075; overflow: hidden; }
.concept-one .real-insights .real-capture img { width: 100%; min-width: 0; max-width: 100%; height: auto; object-fit: contain; }
.concept-one .real-insights .text-link { margin-top: 16px; }
.concept-one [data-agency-scene] .real-capture { max-height: none; }
.concept-one [data-agency-scene] { border: 1px solid #66527f77; border-radius: 22px; overflow: hidden; }
.concept-one .capture-enlarge { min-width: 44px; min-height: 44px; }
@media (max-width: 760px) {
  .concept-one .tour-panel:is([data-screen=crm],[data-screen=agency]) .real-capture { height: auto; max-height: none; overflow: hidden; }
  .concept-one .tour-panel[data-screen=crm] .real-capture { aspect-ratio: 716 / 1075; }
  .concept-one .tour-panel[data-screen=agency] .real-capture,
  .concept-one [data-agency-scene] .real-capture { height: auto; max-height: none; aspect-ratio: 716 / 1300; overflow: hidden; }
  .concept-one .tour-panel:is([data-screen=crm],[data-screen=agency]) .real-capture img,
  .concept-one [data-agency-scene] .real-capture img { display: block; width: 100%; min-width: 0; max-width: 100%; height: auto; max-height: none; object-fit: contain; }
  .concept-one .tour-browser .product-topbar { min-height: 38px; }
  .concept-one .section-head > p { font-size: 14px; }
}

@media(max-width:760px){
.concept-one .tour-panel[data-screen=portfolio] .real-capture {height:auto;max-height:none;overflow:hidden}
.concept-one .tour-panel[data-screen=portfolio] .real-capture img {width:100%;min-width:0;max-width:100%;height:auto;max-height:none;object-fit:contain}
}

/* Preserve the paired artwork while keeping both play targets exposed. */
.fan-duet .duet-back{width:72%;top:0}
.fan-duet .duet-front{width:64%;bottom:42px}
.fan-duet .duet-back .play-circle{left:30%;top:34%}
.fan-duet .duet-back:focus-within{z-index:2}
@media(max-width:760px){.fan-duet .duet-back{width:75%}.fan-duet .duet-front{width:65%;bottom:44px}}

/* A compact phone picker replaces the horizontal strip, while desktop keeps tabs. */
.tour-mobile-picker { display: none; }
.concept-one .agency-intro { max-width: 330px; }
.concept-one .agency-intro p { color: #aaa5b7; }
.concept-one .agency-intro .text-link { margin-top: 16px; }
.concept-one [data-agency-scene] { max-width: 1080px; margin-inline: auto; }
.concept-one .agency-proof .section-head { align-items: end; }
.fan-connection { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.fan-connection path { fill: none; stroke: #ab83f0; stroke-width: 1; stroke-dasharray: 1; stroke-dashoffset: 0; opacity: .45; vector-effect: non-scaling-stroke; }
.scroll-scene { --assembly: 1; }
.scroll-scene .main-profile { transform: perspective(1600px) rotateY(calc(-11deg + var(--assembly) * 6deg)) rotateZ(calc(3deg - var(--assembly) * 2deg)); transition: none; }
.scroll-scene .floating-video { translate: calc((1 - var(--assembly)) * 18px) calc((1 - var(--assembly)) * 38px); transition: box-shadow .2s; }
.scroll-scene .float-credit { translate: calc((1 - var(--assembly)) * -25px) calc((1 - var(--assembly)) * 18px); transition: box-shadow .2s; }
.scroll-scene .duet-back { transform: translate(calc((1 - var(--assembly)) * -18px), calc((1 - var(--assembly)) * 26px)) rotate(calc(-12deg + var(--assembly) * 4deg)) rotateY(13deg); }
.scroll-scene .duet-front { transform: translate(calc((1 - var(--assembly)) * 24px), calc((1 - var(--assembly)) * 40px)) rotate(calc(12deg - var(--assembly) * 5deg)) rotateY(-9deg); }
.scroll-scene .duet-credit { translate: 0 calc((1 - var(--assembly)) * 20px); }
.scroll-scene .fan-connection path { stroke-dashoffset: calc(1 - var(--assembly)); }
.scroll-scene .rights-chip.top { translate: calc((1 - var(--assembly)) * -15px) calc((1 - var(--assembly)) * -12px); }
.scroll-scene .rights-chip.bottom { translate: calc((1 - var(--assembly)) * 17px) calc((1 - var(--assembly)) * 15px); }
.scroll-scene .rights-chip.side { translate: calc((1 - var(--assembly)) * 22px) 0; }
.scroll-scene .rights-halo { scale: calc(.88 + var(--assembly) * .12); }

@media (max-width: 760px) {
  .concept-one .tour-tabs { display: none; }
  .tour-mobile-picker { display: grid; gap: 9px; }
  .tour-mobile-picker label { color: #bda9dc; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
  .tour-mobile-select { width: 100%; min-height: 52px; padding: 12px 15px; border: 1px solid #72539b; border-radius: 12px; background: #211b32; color: #f3ebff; font: 500 16px Inter, sans-serif; color-scheme: dark; }
  .concept-one .tour-panel[data-screen=profile] .real-capture { height: auto; max-height: none; overflow: hidden; }
  .concept-one .tour-panel[data-screen=profile] .real-capture img { width: 100%; min-width: 0; max-width: 100%; height: auto; max-height: none; object-fit: contain; }
  .concept-one .agency-intro { max-width: none; margin-top: 18px; }
  .concept-one .agency-proof .section-head { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  .scroll-scene .main-profile, .scroll-scene .duet-back, .scroll-scene .duet-front { transform: none; }
  .scroll-scene .floating-video, .scroll-scene .float-credit, .scroll-scene .duet-credit, .scroll-scene .rights-chip { translate: none; }
  .scroll-scene .rights-halo { scale: 1; }
  .scroll-scene .fan-connection path { stroke-dashoffset: 0; }
}

.tour-caption .tour-note { font-size: 11px; color: #aaa1b9; margin-top: 10px; }
.real-insights .capture-note { font-size: 11px; color: #aaa1b9; margin-top: 12px; }