/* V80 · An open, three-step investment story. Shared header and calculator stay independent. */
.flow-v80{--sh:max(690px,calc(100svh - var(--header-height)));--art-h:clamp(180px,calc(var(--sh) - 555px),410px)}
.flow-v80 .flow-stage:before{display:none}
.flow-v80 .flow-ui{display:grid;grid-template-rows:24px 56px minmax(0,1fr) 32px;gap:18px;padding:28px 0 18px}
.flow-top{display:flex;align-items:center;justify-content:space-between;gap:14px}
.flow-eyebrow{margin:0;font-size:10px;font-weight:500;letter-spacing:.18em;color:var(--text-gray)}
.flow-contact{pointer-events:auto;display:inline-flex;align-items:center;gap:22px;font-size:13px;font-weight:500;color:var(--text-dark);text-decoration:none}
.flow-contact>span{color:var(--primary-dark);font-size:19px;transition:transform .2s}
.flow-contact:hover>span{transform:translate(3px,-3px)}
.flow-contact:focus-visible{outline:2px solid var(--primary-dark);outline-offset:5px;border-radius:2px}
.flow-v80 .flow-track{justify-self:start;display:grid;grid-template-columns:repeat(3,1fr);gap:0;width:min(430px,38vw);padding:0;border:0;border-radius:0;box-shadow:none;background:transparent;backdrop-filter:none;align-items:stretch;flex-wrap:nowrap}
.flow-v80 .flow-track [role=tab]{position:relative;flex-direction:row;justify-content:flex-start;gap:10px;border:0;border-radius:0;padding:0 8px 12px 0;min-height:48px;font-size:14px;line-height:1.2;background:transparent;color:var(--text-gray)}
.flow-v80 .flow-track [role=tab] b{width:auto;height:auto;border-radius:0;background:transparent;font-size:11px;font-weight:400;color:var(--text-muted)}
.flow-v80 .flow-track [role=tab]:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--brand-line);transition:background .3s}
.flow-v80 .flow-track [aria-selected=true],.flow-v80 .flow-track [aria-selected=true]:hover{color:var(--primary-dark);background:none}
.flow-v80 .flow-track [aria-selected=true] b{color:var(--primary-dark);background:none}
.flow-v80 .flow-track [aria-selected=true]:after{background:var(--primary-dark)}
.flow-v80 .flow-track [role=tab]:hover{background:none;color:var(--primary-dark)}
.flow-v80 .flow-progress{display:none}
.flow-v80 .flow-copy{width:min(430px,37%);opacity:1;align-self:center;padding:10px 0 18px}
.flow-v80 .flow-panel .step-kicker{font-size:10px;letter-spacing:.18em;line-height:1.5;color:var(--text-gray);font-weight:450;margin:0 0 18px}
.info-page .flow-v80 .flow-panel h3{font-size:clamp(35px,3.6vw,58px);font-weight:500;line-height:1.05;letter-spacing:-.055em;margin:0 0 18px}
.flow-v80 .flow-panel h3 em{color:var(--primary-dark);font-style:normal}
.flow-v80 .flow-panel p{font-size:15px;line-height:1.6;color:var(--text-gray);font-weight:400}
.flow-v80 .flow-panel .flow-lead,.flow-v80 .loc-info>p{max-width:350px;min-height:48px}
.flow-v80 .location-choices{margin-top:28px}
.flow-v80 .flow-panel .choice-label{font-size:11px;margin:0 0 12px;color:var(--text-gray)}
.flow-v80 .loc-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:0;overflow:visible}
.flow-v80 .loc-picker button{display:flex;justify-content:flex-start;min-width:0;gap:7px;min-height:42px;padding:8px;border-radius:10px;font-size:12px;background:#fff;color:var(--text-gray);border:1px solid var(--brand-line)}
.flow-v80 .loc-picker svg{flex:none;width:22px;height:22px;padding:2px;border-radius:0;background:transparent;stroke:currentColor;stroke-width:1.5}
.flow-v80 .loc-picker button[aria-pressed=true]{background:var(--brand-tint);border-color:var(--primary);color:var(--primary-dark)}
.flow-v80 .loc-picker button[aria-pressed=true] svg{background:none;stroke:currentColor}
.flow-v80 .loc-picker button:hover{border-color:var(--primary)}
.flow-v80 .zone-note{align-items:center;margin:24px 0 0!important;padding-top:18px;font-size:12px!important;line-height:1.5!important;gap:18px;border-color:var(--brand-line)}
.flow-v80 .zone-note b{font-size:29px;color:var(--primary-dark);font-weight:450;letter-spacing:-.05em}
.flow-v80 .zone-note small{font-size:17px;font-weight:400;letter-spacing:0}
.flow-bottom{display:flex;justify-content:space-between;align-items:center;color:var(--text-gray);font-size:11px}
.flow-scroll{display:flex;align-items:center;gap:10px}
.flow-scroll i{font-style:normal;color:var(--primary-dark);font-size:18px;animation:flow-scroll 2s ease-in-out infinite}
.flow-step-count{font-size:11px;letter-spacing:.12em}.flow-step-count b{font-weight:500;color:var(--primary-dark);font-size:17px;margin-right:5px}
.flow-art{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .55s,visibility 0s .55s;pointer-events:none}
.flow-v80 .flow-stage[data-step=lokasyon] .location-art,.flow-v80 .flow-stage[data-step=kurulum] .setup-art,.flow-v80 .flow-stage[data-step=belgeler] .documents-art{opacity:1;visibility:visible;transition:opacity .55s,visibility 0s}
.flow-v80 .location-art .frame-box{--fw:calc(var(--sh)*2.05);--px:68%;--py:.52;transform:none;translate:none;scale:none}
.flow-v80 .stage-frame{mask-image:radial-gradient(ellipse 48% 52% at 53% 46%,#000 48%,#0000 95%)}
.flow-v80 .stage-product{left:41.797%;top:35.56%;width:16.363%;opacity:1;transform:none;transition:none}
.flow-v80 .location-art:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#fff 0,#fffffff5 22%,#fff0 49%);pointer-events:none}
.flow-v80 .setup-svg,.flow-v80 .documents-svg{position:absolute;left:40%;top:60px;width:60%;height:calc(100% - 110px);overflow:visible}
.setup-caption{position:absolute;top:82%;left:69%;transform:translateX(-50%);display:flex;align-items:center;gap:9px;font-size:12px;color:var(--text-dark);white-space:nowrap}
.setup-caption>span:last-child{padding-left:10px;margin-left:3px;border-left:1px solid var(--brand-line);color:var(--text-gray);font-size:11px}
.live-dot{width:6px;height:6px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px color-mix(in srgb,var(--success) 10%,transparent);animation:connection-pulse 2.4s ease-in-out infinite}
.utility-stream{animation:utility-flow 2s linear infinite}
.utility-drain .utility-stream{animation:drain-flow 2.7s linear infinite}
.utility-energy .utility-stream{animation-duration:1.1s}
.utility-line{opacity:.65;transition:opacity .25s}
.flow-stage[data-hot=sebeke] [data-utility=sebeke],.flow-stage[data-hot=atik] [data-utility=atik],.flow-stage[data-hot=elektrik] [data-utility=elektrik]{opacity:1}
.flow-v80 .hot-list{gap:0;margin:24px 0 0}
.flow-v80 .hot-list li{min-width:0}
.flow-v80 .hot-list button{position:relative;display:grid;grid-template-columns:26px minmax(0,1fr) 20px;gap:3px 12px;min-height:65px;padding:10px 0;border:0;border-bottom:1px solid var(--brand-line);border-radius:0;background:transparent;box-shadow:none;transition:color .2s}
.flow-v80 .hot-list button:hover,.flow-v80 .hot-list button.is-lit{background:transparent;box-shadow:none}
.flow-v80 .hot-list button b{grid-column:2;font-size:15px;font-weight:450;color:var(--text-gray)}
.flow-v80 .hot-list button span{display:block;grid-column:2;font-size:12px;line-height:1.4;color:var(--text-gray)}
.flow-v80 .hot-list button svg{grid-column:3;grid-row:1/3;width:18px;height:18px;fill:none;stroke:var(--primary-dark);stroke-width:1.5;opacity:0;transform:translateX(-5px);transition:opacity .2s,transform .2s}
.flow-v80 .hot-list button.is-lit b,.flow-v80 .hot-list button:hover b{color:var(--text-dark)}
.flow-v80 .hot-list button.is-lit svg{opacity:1;transform:none}
.flow-v80 .line-list{grid-template-columns:1fr}
.flow-v80 .line-list i{grid-column:1;grid-row:1/3;width:10px;height:10px;box-shadow:0 0 0 5px var(--line-wash);background:var(--line-ink)}
.flow-v80 [data-hot=sebeke]{--line-ink:var(--primary);--line-wash:#f0f9ff}
.flow-v80 [data-hot=atik]{--line-ink:var(--text-muted);--line-wash:#f1f5f9}
.flow-v80 [data-hot=elektrik]{--line-ink:var(--warning);--line-wash:#fffbeb}
.flow-v80 .doc-list i{grid-column:1;grid-row:1/3;width:auto;height:auto;background:none;color:var(--text-muted);font-size:12px;font-weight:400}
.flow-v80 .doc-list button.is-lit i{background:none;color:var(--primary-dark)}
.flow-v80 .document-contact{margin-top:25px}
.art-hint{position:absolute;left:70%;top:81%;transform:translateX(-50%);font-size:12px;white-space:nowrap;color:var(--text-gray)}
.art-hint span{margin-left:12px;color:var(--primary-dark)}
.documents-svg .iso-document{cursor:pointer;pointer-events:auto;outline:none}
.iso-lift{transform:translateY(0);transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.iso-document.is-lit .iso-lift{transform:translateY(-28px)}
.iso-document:focus-visible .document-marker{stroke:var(--primary-dark);stroke-width:3}
.iso-document.is-lit .document-marker{fill:var(--brand-tint);stroke:var(--primary-dark)}
.paper-ink path{stroke-dasharray:1;stroke-dashoffset:0}
.iso-document.is-lit .paper-ink path{animation:ink-draw 3.6s ease-in-out infinite;animation-delay:.1s}
.iso-document.is-lit .paper-ink path:nth-child(2){animation-delay:.25s}
.iso-document.is-lit .paper-ink path:nth-child(3){animation-delay:.4s}
.iso-document.is-lit .paper-sign{stroke-dasharray:1;animation:ink-draw 3.6s ease-in-out .6s infinite}
.iso-document.is-lit .card-signal{animation:signal-blink 2s ease-in-out infinite}
.iso-document.is-lit .paper-seal{animation:seal-stamp 3.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.document-route{animation:route-flow 18s linear infinite}
.flow-visual-space{display:none}
.flow-stage:not(.is-on-screen) .utility-stream,.flow-stage:not(.is-on-screen) .iso-document *,.flow-stage:not(.is-on-screen) .document-route,.flow-stage:not(.is-on-screen) .live-dot,.flow-stage:not(.is-on-screen) .flow-scroll i{animation-play-state:paused!important}
.flow-stage:not([data-step=kurulum]) .setup-art *,.flow-stage:not([data-step=belgeler]) .documents-art *{animation-play-state:paused!important}
@keyframes utility-flow{to{stroke-dashoffset:-156}}
@keyframes drain-flow{to{stroke-dashoffset:129}}
@keyframes route-flow{to{stroke-dashoffset:-260}}
@keyframes ink-draw{0%,9%{stroke-dashoffset:1}45%,100%{stroke-dashoffset:0}}
@keyframes seal-stamp{0%,15%{opacity:.45;scale:.86}35%,100%{opacity:1;scale:1}}
@keyframes signal-blink{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes connection-pulse{50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--success) 5%,transparent)}}
@keyframes flow-scroll{50%{transform:translateY(4px)}}
@media(min-width:901px) and (max-height:800px){
 .flow-v80 .flow-ui{gap:10px;padding-top:18px;grid-template-rows:20px 48px minmax(0,1fr) 26px}
 .flow-v80 .flow-panel .step-kicker{margin-bottom:12px}.info-page .flow-v80 .flow-panel h3{font-size:clamp(32px,3.4vw,48px);margin-bottom:12px}
 .flow-v80 .hot-list{margin-top:16px}.flow-v80 .hot-list button{min-height:58px}
 .flow-v80 .location-choices{margin-top:18px}.flow-v80 .zone-note{margin-top:18px!important}
}
@media(max-width:1100px) and (min-width:901px){
 .flow-v80 .flow-copy{width:40%}.flow-v80 .loc-picker button{font-size:11px;padding:6px;gap:4px}
 .flow-v80 .loc-picker svg{width:18px;height:18px}.flow-v80 .flow-panel p{font-size:14px}
}
@media(max-width:900px){
 .flow-v80{--sh:max(660px,calc(100svh - var(--header-height)))}
 .flow-v80 .flow-ui{padding:16px 0 12px;grid-template-rows:18px 42px minmax(0,1fr) 24px;gap:12px}
 .flow-v80 .flow-top{gap:10px}.flow-v80 .flow-eyebrow{font-size:8px;letter-spacing:.13em}
 .flow-v80 .flow-contact{font-size:11px;gap:10px}.flow-v80 .flow-contact>span{font-size:16px}
 .flow-v80 .flow-track{width:100%;justify-self:stretch;gap:0}
 .flow-v80 .flow-track [role=tab]{min-height:42px;justify-content:center;font-size:13px;gap:9px;padding:0 4px 10px}
 .flow-v80 .flow-track [role=tab] b{font-size:10px}
 .flow-v80 .flow-copy{align-self:center;width:100%;max-width:none;padding:0}
 .flow-v80 .flow-panel .step-kicker{font-size:9px;letter-spacing:.16em;margin-bottom:9px}
 .info-page .flow-v80 .flow-panel h3{font-size:clamp(28px,4.8vw,42px);line-height:1.08;margin:0 0 8px}
 .flow-v80 .flow-panel p{font-size:13px;line-height:1.5}
 .flow-v80 .flow-panel .flow-lead,.flow-v80 .loc-info>p{min-height:0;max-width:530px}
 .flow-v80 .flow-visual-space{display:block;height:var(--art-h);min-height:180px;pointer-events:none}
 .flow-v80 .flow-art{top:var(--art-top,215px);height:var(--art-height,240px);bottom:auto}
 .flow-v80 .location-art .frame-box{--fw:calc(var(--art-height,240px)*2.9);--px:50%;--py:0;left:calc(50% - var(--fw)*.4998);top:calc(var(--art-height,240px)*.51 - var(--fw)*.427)}
 .flow-v80 .stage-frame{mask-image:radial-gradient(ellipse 49% 44% at 50% 44%,#000 46%,#0000 88%)}
 .flow-v80 .location-art{overflow:hidden}
 .flow-v80 .location-art:after{background:linear-gradient(0deg,#fff 0,#fff0 28%),linear-gradient(180deg,#fff 0,#fff0 22%)}
 .flow-v80 .location-choices{margin:0}
 .flow-v80 .flow-panel .choice-label{font-size:10px;margin:0 0 8px}
 .flow-v80 .loc-picker{gap:6px}
 .flow-v80 .loc-picker button{justify-content:center;min-height:37px;font-size:11px;padding:5px;gap:5px;border-radius:8px}
 .flow-v80 .loc-picker svg{width:20px;height:20px}
 .flow-v80 .zone-note{padding-top:12px;margin-top:12px!important;font-size:11px!important;gap:14px}
 .flow-v80 .zone-note b{font-size:25px}.flow-v80 .zone-note small{font-size:15px}
 .flow-v80 .hot-list{margin:0}.flow-v80 .hot-list button{min-height:49px;padding:7px 0;grid-template-columns:22px minmax(0,1fr) 18px;gap:2px 9px}
 .flow-v80 .hot-list button b{font-size:13px}.flow-v80 .hot-list button span{display:block;font-size:11px}
 .flow-v80 .hot-list button i{font-size:11px}
 .flow-v80 .document-contact{margin-top:16px}
 .flow-v80 .setup-svg,.flow-v80 .documents-svg{left:0;top:-10%;width:100%;height:125%;overflow:visible}
 .flow-v80 .setup-svg{top:-28%;height:145%}
 .flow-v80 .setup-caption{left:62%;top:90%;font-size:10px;gap:6px}
 .flow-v80 .setup-caption>span:last-child{font-size:9px;padding-left:6px;margin-left:0}
 .flow-v80 .documents-svg{top:-16%;height:142%}
 .flow-v80 .art-hint{left:50%;top:auto;bottom:5px;font-size:10px;margin:0}
 .flow-v80 .flow-bottom{font-size:9px}.flow-v80 .flow-scroll{gap:7px}
 .flow-v80 .flow-step-count{font-size:9px}.flow-v80 .flow-step-count b{font-size:14px}
}
@media(min-width:601px) and (max-width:900px){
 .flow-v80 .flow-copy{max-width:580px;justify-self:center}.flow-v80 .flow-panel .step-kicker{font-size:10px}
 .flow-v80 .flow-panel p{font-size:15px}.flow-v80 .loc-picker button{font-size:13px;min-height:42px}
 .flow-v80 .hot-list button{min-height:55px}.flow-v80 .hot-list button b{font-size:15px}.flow-v80 .hot-list button span{font-size:13px}
 .flow-v80 .flow-track{max-width:580px;justify-self:center}
}
@media(max-width:360px){
 .flow-v80 .flow-eyebrow{font-size:7px}.flow-v80 .flow-contact{font-size:10px;gap:6px}
 .flow-v80 .loc-picker button{font-size:10px;gap:3px}.flow-v80 .loc-picker svg{width:17px;height:17px}
 .flow-v80 .flow-panel p{font-size:12px}.info-page .flow-v80 .flow-panel h3{font-size:27px}
}
@media(prefers-reduced-motion:reduce){
 .flow-v80 *,.flow-v80 *:before,.flow-v80 *:after{animation:none!important;transition:none!important;scroll-behavior:auto}
 .flow-v80 .iso-document.is-lit .iso-lift{transform:translateY(-16px)}
}
/* Short viewports retain ordinary page scrolling, so no controls are trapped below the fold. */
@media(max-height:720px){
 .js .flow-v80{height:auto}.js .flow-v80 .flow-stage{position:relative;top:0}
 .flow-v80 .flow-scroll{visibility:hidden}
}
/* The empty mobile illustration slot must pass taps to the SVG underneath. */
.flow-v80 .flow-copy{pointer-events:none}
.flow-v80 .flow-copy button,.flow-v80 .flow-copy a,.flow-v80 .flow-copy h3,.flow-v80 .flow-copy p:not(.art-hint){pointer-events:auto}

@media(max-width:900px){.flow-v80 .flow-stage[data-step=lokasyon]{--art-h:clamp(180px,calc(var(--sh) - 510px),430px)}}
@media(max-width:600px){.flow-v80 .setup-mark{display:none}}
.flow-v80 .iso-document:hover .document-marker{stroke:var(--primary-dark);stroke-width:2}
