.project-art.corners{position:relative;background:#a82532;color:#fff;isolation:isolate}.project-art.corners .meta,.project-art.corners .art-bottom{position:relative;z-index:2}.project-art.corners .art-bottom{align-items:end}.project-art.corners h3{font-size:58px;letter-spacing:-3px}.project-art.corners p{max-width:190px}.project-art.corners .project-arrow{background:#a82532}.corners-card-phones{position:absolute;inset:58px 65px -74px auto;width:180px;transform:rotate(12deg);z-index:1;pointer-events:none}.corners-card-phones img{position:absolute;width:115px;border:4px solid #272323;border-radius:16px;box-shadow:0 16px 28px #3f0a1455}.corners-card-phones img:first-child{inset:0 auto auto 0}.corners-card-phones img:last-child{inset:54px 0 auto auto;transform:rotate(-8deg)}
.corners-case{max-width:1440px;margin:auto;padding:0 6%}.corners-hero{padding:40px 0 72px;border-bottom:1px solid var(--line)}.corners-hero-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;gap:55px;min-height:650px}.corners-hero-copy h1{font-size:clamp(70px,8vw,120px);font-weight:500;letter-spacing:-.07em;line-height:1;margin:30px 0 20px}.corners-hero-copy h2{font-size:clamp(30px,3vw,44px);font-weight:400;line-height:1.15;margin:0 0 22px;letter-spacing:-.04em}.corners-hero-copy p{color:var(--muted);font-size:18px;line-height:1.75;max-width:460px}.corners-meta{font-size:13px;color:var(--muted);border-top:1px solid var(--line);margin-top:28px;padding-top:18px;line-height:1.7}.corners-hero-phones{display:flex;align-items:center;justify-content:center;gap:16px;padding:60px 22px;background:linear-gradient(135deg,#ffede7,#f7d7d2);border-radius:12px;overflow:hidden;direction:ltr}.corners-hero-phones img{display:block;width:30%;min-width:0;border:5px solid #242020;border-radius:25px;box-shadow:0 22px 30px #4a121a33;height:auto}.corners-hero-phones img:first-child{transform:translateY(30px) rotate(-5deg)}.corners-hero-phones img:last-child{transform:translateY(30px) rotate(5deg)}
.corners-intro,.corners-section{padding:80px 0;border-bottom:1px solid var(--line)}.corners-intro h2,.corners-section h2,.corners-closing h2{font-size:clamp(32px,4vw,56px);font-weight:500;line-height:1.14;letter-spacing:-.04em;margin:24px 0}.corners-intro>p,.corners-section-head p,.corners-closing p{max-width:780px;color:var(--muted);font-size:18px;line-height:1.85;margin:0 0 32px}.corners-journey{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}.corners-journey span{padding:11px 20px;border:1px solid var(--line);border-radius:30px;font-size:14px}.corners-section-head{max-width:850px;margin-bottom:38px}.corners-screen-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:40px;background:#f3eeeb;border-radius:12px;align-items:start}.corners-screen{margin:0;min-width:0}.corners-screen-button{position:relative;display:block;padding:0;width:100%;border:1px solid #dfd8d4;border-radius:22px;overflow:hidden;background:#fff;color:#fff;cursor:zoom-in}.corners-screen img{display:block;width:100%;height:auto}.corners-screen-grid .corners-screen-button{aspect-ratio:428/926}.corners-screen-grid .corners-screen img{object-fit:cover;object-position:top}.corners-enlarge{position:absolute;inset:auto 10px 10px;background:#242020e8;border:1px solid #ffffff33;border-radius:24px;padding:9px 10px;text-align:center;font:12px system-ui;backdrop-filter:blur(6px)}.corners-screen figcaption{font-size:13px;color:var(--muted);line-height:1.7;margin-top:16px}.corners-closing{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,300px);gap:80px;align-items:center;padding:80px 0;border-bottom:1px solid var(--line)}.corners-closing .corners-screen{width:100%}.corners-next{padding:60px 0}.corners-dialog{border:1px solid var(--line);border-radius:18px;padding:14px;width:min(94vw,700px);max-height:94vh;background:var(--paper);color:var(--ink)}.corners-dialog::backdrop{background:#0b0809df}.corners-dialog img{display:block;width:100%;height:auto}.corners-dialog-close{position:sticky;top:0;float:right;z-index:1;background:#a82532;color:white;border:0;border-radius:30px;padding:12px 22px;font:inherit;cursor:pointer}
html[dir="rtl"] .corners-case h1,html[dir="rtl"] .corners-case h2,html[dir="rtl"] .project-art.corners h3{letter-spacing:0;line-height:1.3}html[data-theme="dark"] .corners-hero-phones{background:linear-gradient(135deg,#3d2526,#282321)}html[data-theme="dark"] .corners-screen-grid{background:#26211f}html[data-theme="dark"] .corners-screen-button{border-color:#4a3533}html[data-theme="dark"] .project-art.corners{background:#79232d}
@media(max-width:1000px){.corners-card-phones{right:38px;width:138px}.corners-card-phones img{width:92px}.project-art.corners h3{font-size:48px}.corners-hero-grid{gap:30px}.corners-screen-grid{gap:18px;padding:24px}}
@media(max-width:760px){.corners-hero-grid{grid-template-columns:1fr;gap:28px;min-height:0}.corners-hero{padding:30px 0 44px}.corners-hero-copy h1{font-size:76px}.corners-hero-copy h2{font-size:32px}.corners-hero-phones{padding:38px 16px 58px;gap:12px}.corners-hero-phones img{border-width:3px;border-radius:18px}.corners-intro,.corners-section{padding:48px 0}.corners-intro>p,.corners-section-head p,.corners-closing p{font-size:17px}.corners-screen-grid{grid-template-columns:1fr;padding:24px;gap:34px}.corners-screen-grid .corners-screen{max-width:340px;width:100%;margin-inline:auto}.corners-closing{grid-template-columns:1fr;gap:28px;padding:48px 0}.corners-closing .corners-screen{max-width:280px;margin-inline:auto}.corners-case .eyebrow{font-size:11px}.corners-journey{gap:8px}.corners-journey span{padding:9px 14px}.corners-card-phones{right:48px;width:160px}.corners-card-phones img{width:106px}.project-art.corners h3{font-size:52px}}
html[dir="rtl"] .corners-card-phones{right:auto;left:36px}.project-art.corners .art-bottom>div{max-width:52%}.project-art.corners .project-arrow{position:absolute;bottom:0;right:0}html[dir="rtl"] .project-art.corners .project-arrow{right:auto;left:0}@media(max-width:760px){.corners-card-phones{right:22px;width:128px}.corners-card-phones img{width:86px}html[dir="rtl"] .corners-card-phones{left:22px}.project-art.corners h3{font-size:48px}}

/* Follow the Fittpub visual case-study composition. */
.project-art.corners .art-bottom>div{max-width:none}.project-art.corners .art-bottom{position:static}.project-art.corners .project-arrow{position:static}
.corners-hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:clamp(48px,7vw,108px)}
.corners-hero-phone img{width:min(100%,340px);border-radius:30px;box-shadow:0 22px 50px #0002}
.corners-section-head{max-width:none}.corners-section-head h2{margin:0;max-width:920px}.corners-section-head p{margin:-20px 0 0}
.corners-section .corners-screen-grid{padding:72px clamp(28px,5vw,72px);gap:clamp(20px,3vw,44px)}
.corners-screen-grid .corners-screen-button{border-radius:30px;box-shadow:0 22px 50px #0002}
.corners-section .corners-screen-grid figure:first-child{transform:translateY(28px) rotate(-3deg)}
.corners-section .corners-screen-grid figure:last-child{transform:translateY(28px) rotate(3deg)}
.corners-screen-grid .corners-screen img{width:100%;height:auto;object-fit:cover}
.corners-page .visual-marquee .screen-marquee img{object-position:top;object-fit:cover}
@media(max-width:760px){.corners-hero-grid{grid-template-columns:1fr;gap:28px;min-height:0}.corners-hero-phone{padding:20px 0 0}.corners-hero-phone img{max-width:280px}.corners-section-head{display:block}.corners-section-head>span{display:block;margin-bottom:20px}.corners-section-head h2{margin-bottom:22px}.corners-section-head p{margin:0}.corners-section .corners-screen-grid{grid-template-columns:1fr;padding:32px 24px;gap:34px}.corners-section .corners-screen-grid figure:first-child,.corners-section .corners-screen-grid figure:last-child{transform:none}}
.corners-hero-copy h1 span{font-family:inherit;color:inherit;letter-spacing:inherit}.corners-hero-copy>p{letter-spacing:normal}

.corners-screen-button{cursor:default}

/* Each figure owns a phone viewport followed by its caption. */
.corners-section .corners-screen-grid{align-items:start}
.corners-screen-grid figure.corners-screen{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch}
.corners-screen-grid .corners-screen-button{aspect-ratio:428/926;flex:none;width:100%;overflow:hidden}
.corners-screen-grid .corners-screen img{display:block;width:100%;max-width:none;height:auto;border:0;border-radius:0;box-shadow:none}
.corners-screen-grid .corners-screen figcaption{display:block;width:100%;margin:20px 0 0;text-align:center;min-height:3.4em}

.corners-journey>span>span{padding:0;border:0;border-radius:0}

/* Match the reference phone proportions; never stretch screens to the tallest item. */
.corners-page .screen-marquee-set{align-items:flex-start}
.corners-page .visual-marquee .screen-marquee img{width:clamp(180px,19vw,262px);height:calc(clamp(180px,19vw,262px) * 926 / 428);aspect-ratio:428/926;object-fit:cover;object-position:top;align-self:flex-start;flex-shrink:0}
.corners-pro-max{position:relative;width:min(100%,390px);aspect-ratio:769/1586;filter:drop-shadow(0 28px 34px rgba(71,42,29,.16));animation:visual-phone-float 6s ease-in-out infinite;direction:ltr}
.corners-hero-phone .corners-pro-max img{display:block;width:100%;max-width:none;height:auto;animation:none;filter:none;box-shadow:none;border:0;border-radius:0}
.corners-phone-frame{position:relative;z-index:0}
.corners-phone-display{position:absolute;left:4.16%;top:1.77%;width:91.68%;height:96.46%;border-radius:17.5% / 8.1%;overflow:hidden;z-index:1;background:#c03139}
.corners-phone-display img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover}
.corners-phone-island{position:absolute;left:35.24%;top:3.03%;width:29%;height:4.3%;border-radius:999px;background:#050505;box-shadow:inset 0 0 0 1px #1c1b1b;z-index:2}
.corners-phone-island::after{content:"";position:absolute;right:9%;top:26%;width:14%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 42% 40%,#202740,#090d1d 40%,#030406 72%);box-shadow:0 0 0 3px #0b0b0b}
@media(max-width:760px){.corners-pro-max{width:min(72vw,330px)}.corners-page .visual-marquee .screen-marquee img{width:168px;height:calc(168px * 926 / 428)}}
@media(prefers-reduced-motion:reduce){.corners-pro-max{animation:none}}

.corners-phone-status{position:absolute;z-index:2;top:0;left:0;width:100%;height:5.8%;background:#cc3b43;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 7.7%;font-family:Arial,sans-serif;font-size:clamp(10px,1.3vw,15px);font-weight:600;box-sizing:border-box}.corners-phone-status svg{width:25%;height:auto}.corners-phone-island{z-index:3}

/* Static presentation mockups: the artwork never scrolls or receives focus. */
.corners-page .corners-screen-button.corners-static-mockup{position:relative;aspect-ratio:769/1586;border:0;border-radius:0;overflow:visible;background:transparent url('/assets/fiitpub/iphone-17-pro-max.png') center/100% 100% no-repeat;box-shadow:none;filter:drop-shadow(0 20px 24px #0003);pointer-events:none;direction:ltr}
.corners-mockup-display{position:absolute;left:4.16%;top:1.77%;width:91.68%;height:96.46%;border-radius:17.5% / 8.1%;overflow:clip;background:white}
.corners-page .corners-static-mockup .corners-mockup-display>img{display:block;width:100%;max-width:none;height:100%;object-fit:cover;object-position:top;border:0;border-radius:0;box-shadow:none}
.corners-static-mockup .corners-phone-status{height:6%;background:#fff;color:#151515;font-size:clamp(10px,1vw,13px)}
.corners-static-mockup .corners-phone-island{top:3%;height:3.5%;width:25%;left:37.5%}