/* Mature Play FC Draft — scoped Studio 149 portfolio styles */
/* Project overview */
.fpl-feature{margin-top:18px;min-height:600px;background:#0b2039;border-color:#183c5c;color:#edf7ff}
.fpl-feature .project-story{padding:42px 46px 44px}
.fpl-feature .project-index{color:#8daccd}
.fpl-feature .project-index .line{border-color:#547392}
.fpl-feature .app-identity{margin:64px 0 23px;color:#abc4df}
.fpl-feature .app-identity>span{color:#abc4df}
.fpl-emblem{display:grid;place-items:center;width:54px;height:54px;border-radius:15px;background:#c9eaff;color:#102e4c;font-size:24px;font-weight:800;letter-spacing:-.08em;box-shadow:0 8px 25px #0003}
.fpl-feature .app-identity>.fpl-emblem{color:#102e4c;font-size:24px;font-weight:800}
.fpl-feature .project-story h3{color:#fff;font-size:clamp(45px,5.1vw,72px)}
.fpl-feature .punctuation{color:#85d9ff}
.fpl-feature .project-description{color:#bed0e3}
.fpl-feature .project-link{color:#fff;border-bottom-color:#9ac9ea}
.fpl-feature .project-link span{color:#85d9ff}
.fpl-feature .stores{color:#b7cee2}
.fpl-feature .stores a{color:inherit}
.fpl-feature .stores a:hover{color:#fff}
.fpl-artwork{position:relative;min-height:600px;display:flex;align-items:center;justify-content:center;padding:58px 34px;background:radial-gradient(ellipse at 52% 45%,#285679 0%,#12314e 48%,#071c32 100%);overflow:hidden}
.fpl-artwork:before{content:"";position:absolute;inset:0;opacity:.24;background-image:linear-gradient(90deg,#91b4d3 1px,transparent 1px),linear-gradient(#91b4d3 1px,transparent 1px);background-size:36px 36px;mask-image:radial-gradient(ellipse,#000,transparent 75%)}
.fpl-art-label{position:absolute;right:24px;top:22px;z-index:3;font-size:10px;color:#a5c8e5;text-transform:uppercase;letter-spacing:.12em}
.fpl-home-capture{position:relative;z-index:2;width:100%;max-width:560px;margin:0;transform:rotate(-2.5deg);border:1px solid #9cbed144;border-radius:12px;overflow:hidden;background:#08090b;box-shadow:0 25px 65px #0006}
.fpl-home-capture a{display:block}
.fpl-home-capture img{display:block;width:100%;height:auto}
.fpl-capture-link{display:block;border-radius:12px}
.fpl-capture-link:focus-visible{outline:3px solid #9bdcff;outline-offset:5px}
.fpl-capture{width:100%;height:auto;border-radius:12px;border:1px solid #b1c8da33;background:#08090b}
.fpl-screen-figure{position:relative;margin:0}
.fpl-access-note{font-size:12px;line-height:1.6;color:#71849b;margin:-34px 0 28px}
.fpl-product-capture{margin:42px 0 0;padding:30px;background:#0b223b;border-radius:20px}
.fpl-product-capture figcaption{max-width:850px;margin:20px 0 0;color:#adc7df;font-size:13px;line-height:1.7}
.fpl-product-capture figcaption strong{color:#eef8ff}
.fpl-implementation{margin-top:38px}
.fpl-implementation h3{margin:0 0 18px;font-size:25px;letter-spacing:-.035em;color:#244666}
.fpl-implementation table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:14px;line-height:1.7;color:#526b86}
.fpl-implementation caption{text-align:left;font-size:12px;color:#778ba4;margin-bottom:10px}
.fpl-implementation th,.fpl-implementation td{text-align:left;vertical-align:top;border-top:1px solid #dfe8f0;padding:17px 0;overflow-wrap:anywhere}
.fpl-implementation th{width:24%;padding-right:24px;color:#244666;font-weight:650}
.fpl-preview-note{position:absolute;bottom:16px;right:22px;color:#a6c0d8;font-size:10px;z-index:2}
.fpl-case-link{color:#9bdcff!important}
.fpl-case .site-header nav a[aria-current]{color:var(--blue)}
.fpl-case{--fpl-line:#dfe8f0}
.fpl-hero{padding:75px 0 0}
.fpl-breadcrumb{display:flex;align-items:center;gap:10px;color:#778ba4;font-size:12px;font-weight:600;margin-bottom:56px}
.fpl-breadcrumb a:hover{color:var(--blue)}
.fpl-breadcrumb span{color:#b3c1d1}
.fpl-eyebrow{font-size:11px;letter-spacing:.17em;font-weight:700;text-transform:uppercase;color:#5481ac}
.fpl-hero h1{font-size:clamp(68px,9.6vw,136px);line-height:.92;letter-spacing:-.083em;max-width:1050px;margin:23px 0 32px;color:#0c2340;font-weight:620}
.fpl-hero h1 em{color:#3270ad;font-style:normal}
.fpl-hero-intro{display:grid;grid-template-columns:1fr 340px;gap:45px;align-items:end;padding-bottom:57px}
.fpl-hero-lead{max-width:710px;font-size:clamp(20px,2.4vw,28px);line-height:1.4;letter-spacing:-.032em;color:#526a84;margin:0}
.fpl-cta-group{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.fpl-cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:14px 18px;border-radius:8px;font-size:13px;font-weight:650;background:#163d63;color:#fff;border:1px solid #163d63;white-space:nowrap}
.fpl-cta:hover{background:#245a87}
.fpl-cta.secondary{background:transparent;color:#21486d;border-color:#bacbdc}
.fpl-cta.secondary:hover{background:#e7f0f7}
.fpl-hero-stage{background:#0b223b;border-radius:21px;overflow:hidden;padding:55px max(30px,5.5vw) 34px;position:relative}
.fpl-hero-stage:before{content:"";pointer-events:none;position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,#22577f 0%,transparent 64%)}
.fpl-stage-foot{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#a9c7e0;font-size:11px;margin-top:20px}
.fpl-stage-foot strong{color:#e4f5ff;font-weight:600}
.fpl-number-strip{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--fpl-line);gap:20px;padding:43px 0}
.fpl-number-strip div+div{border-left:1px solid var(--fpl-line);padding-left:23px}
.fpl-number-strip strong{display:block;color:#0c2e50;font-size:clamp(29px,4vw,54px);letter-spacing:-.07em;line-height:1}
.fpl-number-strip span{display:block;color:#7c8ea4;font-size:12px;margin-top:12px}
.fpl-case-section{padding:102px 0;border-bottom:1px solid var(--fpl-line)}
.fpl-section-label{color:#4a779f;font-size:11px;letter-spacing:.15em;text-transform:uppercase;font-weight:720;margin:0 0 17px}
.fpl-section-title{font-size:clamp(38px,5.6vw,72px);line-height:1.02;letter-spacing:-.07em;font-weight:610;color:#0e2c4c;margin:0 0 25px}
.fpl-section-lead{font-size:clamp(17px,2vw,21px);line-height:1.65;max-width:700px;color:#526b86;margin:0}
.fpl-story-grid{display:grid;grid-template-columns:1fr 1fr;gap:8vw;margin-top:38px}
.fpl-story-grid p{font-size:16px;color:#60758b;line-height:1.83;margin:0}
.fpl-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
.fpl-feature-card{min-height:270px;border:1px solid #e0e8f0;border-radius:16px;padding:30px;background:#fff;display:flex;flex-direction:column}
.fpl-feature-card .number{color:#8da7c2;font-size:12px;font-weight:700}
.fpl-feature-card h3{font-size:24px;letter-spacing:-.04em;color:#173a5d;line-height:1.1;margin:auto 0 14px}
.fpl-feature-card p{font-size:14px;line-height:1.7;color:#647991;margin:0}
.fpl-process{margin-top:50px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:1px solid #cfdde9;border-radius:16px;overflow:hidden}
.fpl-process-step{padding:28px;background:#f3f7fa;border-right:1px solid #cfdde9}
.fpl-process-step:last-child{border-right:0}
.fpl-process-step .number{color:#4675a0;font-size:11px;font-weight:800;letter-spacing:.13em}
.fpl-process-step h3{font-size:18px;color:#153554;margin:22px 0 9px;letter-spacing:-.035em}
.fpl-process-step p{font-size:13px;line-height:1.65;color:#697f94;margin:0}
.fpl-architecture{background:#0c243f;color:#edf6ff;border-radius:20px;margin-top:45px;padding:44px;overflow:hidden}
.fpl-architecture-heading{display:flex;justify-content:space-between;gap:24px;align-items:baseline;margin-bottom:38px}
.fpl-architecture-heading h3{font-size:28px;letter-spacing:-.05em;margin:0;color:#fff}
.fpl-architecture-heading p{font-size:11px;letter-spacing:.08em;color:#9ab9d6;text-transform:uppercase;margin:0}
.fpl-architecture-layers{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.fpl-architecture-node{position:relative;border:1px solid #486988;border-radius:11px;background:#123250;padding:24px 19px;min-height:151px}
.fpl-architecture-node:not(:last-child):after{content:"→";position:absolute;right:-12px;top:42%;z-index:2;color:#a0d7f8;font-size:21px}
.fpl-architecture-node span{font-size:11px;color:#89b7d5;letter-spacing:.05em}
.fpl-architecture-node h4{font-size:16px;color:#f4f9fc;margin:14px 0 8px;line-height:1.2}
.fpl-architecture-node p{font-size:12px;line-height:1.5;color:#a9bed3;margin:0}
.fpl-architecture-note{color:#91b1cb;font-size:12px;line-height:1.6;margin:25px 0 0}
.fpl-principles{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-top:40px}
.fpl-principles h3{font-size:22px;letter-spacing:-.04em;margin:0 0 14px;color:#244666}
.fpl-principles p{font-size:15px;line-height:1.8;color:#5d7389;margin:0}
.fpl-disclaimer{border-left:3px solid #5f9dcc;padding:3px 0 3px 19px;margin-top:36px;max-width:820px;color:#5d7288;font-size:14px;line-height:1.8}
.fpl-bottom-banner{background:#0a2340;color:#fff;border-radius:20px;margin:65px 0 100px;padding:52px 55px;display:flex;gap:30px;align-items:center;justify-content:space-between}
.fpl-bottom-banner p{font-size:12px;letter-spacing:.14em;color:#93bcda;margin:0 0 15px;text-transform:uppercase}
.fpl-bottom-banner h2{font-size:clamp(30px,4vw,52px);letter-spacing:-.058em;line-height:1.08;max-width:670px;margin:0}
.fpl-bottom-banner .fpl-cta{background:#eff8ff;color:#103657;border-color:#eff8ff}
.fpl-bottom-banner .fpl-cta:hover{background:#cae8fc}
@media(max-width:980px){
 .fpl-feature .project-story{padding:35px 35px 40px}
 .fpl-feature .app-identity{margin-top:31px}
 .fpl-artwork{min-height:435px}
 .fpl-home-capture{max-width:640px}
 .fpl-hero-intro{grid-template-columns:1fr;gap:24px}
 .fpl-cta-group{justify-content:flex-start}
 .fpl-process{grid-template-columns:repeat(2,1fr)}
 .fpl-process-step:nth-child(2){border-right:0}
 .fpl-process-step:nth-child(-n+2){border-bottom:1px solid #cfdde9}
 .fpl-architecture-layers{grid-template-columns:repeat(2,1fr)}
 .fpl-architecture-node:nth-child(2):after{display:none}
}
@media(max-width:650px){
 .fpl-feature .project-story{padding:28px 26px 35px}
 .fpl-feature .project-story h3{font-size:57px}
 .fpl-artwork{min-height:360px;padding:40px 20px}
 .fpl-hero{padding-top:33px}
 .fpl-breadcrumb{margin-bottom:45px;flex-wrap:wrap;row-gap:8px}
 .fpl-hero h1{font-size:clamp(55px,14vw,82px)}
 .fpl-hero-stage{border-radius:15px;padding:35px 17px 24px}
 .fpl-stage-foot{font-size:10px;flex-wrap:wrap;line-height:1.6}
 .fpl-product-capture{padding:14px;border-radius:15px}
 .fpl-product-capture figcaption{font-size:12px;margin-top:15px}
 .fpl-implementation th{width:29%;padding-right:12px}
 .fpl-implementation table{font-size:13px}
 .fpl-number-strip{grid-template-columns:repeat(2,1fr);row-gap:30px;padding:34px 0}
 .fpl-number-strip div:nth-child(3){border-left:0;padding-left:0}
 .fpl-number-strip div+div{padding-left:15px}
 .fpl-number-strip div:nth-child(3){padding-left:0}
 .fpl-case-section{padding:70px 0}
 .fpl-story-grid,.fpl-principles{grid-template-columns:1fr;gap:20px}
 .fpl-feature-grid{grid-template-columns:1fr}
 .fpl-feature-card{min-height:205px}
 .fpl-process{grid-template-columns:1fr}
 .fpl-process-step{border-right:0;border-bottom:1px solid #cfdde9}
 .fpl-process-step:nth-child(2){border-bottom:1px solid #cfdde9}
 .fpl-process-step:last-child{border-bottom:0}
 .fpl-architecture{padding:27px 20px}
 .fpl-architecture-heading{flex-direction:column;gap:9px}
 .fpl-architecture-layers{grid-template-columns:1fr}
 .fpl-architecture-node:not(:last-child):after{display:block;content:"↓";top:auto;bottom:-15px;right:50%}
 .fpl-bottom-banner{padding:32px 27px;flex-direction:column;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){.fpl-home-capture{transform:none}}
