{"id":2119,"date":"2026-04-15T00:07:32","date_gmt":"2026-04-14T21:07:32","guid":{"rendered":"https:\/\/pandasticstudio.com\/?page_id=2119"},"modified":"2026-04-18T23:15:10","modified_gmt":"2026-04-18T20:15:10","slug":"web-design","status":"publish","type":"page","link":"https:\/\/pandasticstudio.com\/en\/our-services\/web-design\/","title":{"rendered":"Web Design"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"2119\" class=\"elementor elementor-2119\">\n\t\t\t\t<div class=\"elementor-element elementor-element-de59aa0 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-equal-height-no e-con e-parent\" data-id=\"de59aa0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-094194d elementor-widget elementor-widget-html\" data-id=\"094194d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<style>\r\n    \/* --- STRICT BRAND COLORS --- *\/\r\n    :root {\r\n        --ps-black: #1E1E1C;    \/* Eerie Black *\/\r\n        --ps-yellow: #F6AE2D;   \/* Hunyadi Yellow *\/\r\n        --ps-red: #E0563B;      \/* Cinnabar *\/\r\n        --ps-platinum: #DADADA; \/* Platinum *\/\r\n        --text-white: #ffffff;\r\n        --main-font: 'FF Neuwelt', 'Inter', sans-serif;\r\n    }\r\n\r\n    \/* --- GLOBAL RESET & UTILS --- *\/\r\n    * { box-sizing: border-box; margin: 0; padding: 0; }\r\n    \r\n    html, body {\r\n        height: 100%;\r\n        overflow: hidden;\r\n    }\r\n\r\n    body {\r\n        font-family: var(--main-font);\r\n        background: var(--ps-black);\r\n        color: var(--text-white);\r\n    }\r\n\r\n    #ps-main-container {\r\n        height: 100vh;\r\n        width: 100%;\r\n        overflow-y: scroll;\r\n        overflow-x: hidden;\r\n        scroll-snap-type: y mandatory;\r\n        scroll-behavior: smooth;\r\n        position: relative;\r\n    }\r\n\r\n    \/* --- NOISE OVERLAY (TEXTURE) --- *\/\r\n    .ps-noise {\r\n        position: fixed; top: 0; left: 0; width: 100%; height: 100%;\r\n        background: url('data:image\/svg+xml;utf8,%3Csvg viewBox=\"0 0 200 200\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"%3E%3Cfilter id=\"noiseFilter\"%3E%3CfeTurbulence type=\"fractalNoise\" baseFrequency=\"0.65\" numOctaves=\"3\" stitchTiles=\"stitch\"\/%3E%3C\/filter%3E%3Crect width=\"100%25\" height=\"100%25\" filter=\"url(%23noiseFilter)\" opacity=\"0.05\"\/%3E%3C\/svg%3E');\r\n        pointer-events: none; z-index: 999; opacity: 0.4;\r\n    }\r\n\r\n    \/* --- SECTION STRUCTURE --- *\/\r\n    .ps-section {\r\n        height: 100vh;\r\n        width: 100%;\r\n        scroll-snap-align: start;\r\n        position: relative;\r\n        overflow: hidden;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        border-bottom: 1px solid rgba(255,255,255,0.05);\r\n    }\r\n\r\n    \/* HERO *\/\r\n    .ps-design-hero {\r\n        background: var(--ps-black);\r\n        perspective: 1000px;\r\n    }\r\n\r\n    .ps-marquee-wrapper {\r\n        position: absolute; width: 100%; top: 50%; transform: translateY(-50%);\r\n        display: flex; flex-direction: column; gap: 30px; pointer-events: none;\r\n    }\r\n    .ps-marquee {\r\n        white-space: nowrap; overflow: hidden; display: flex;\r\n    }\r\n    .ps-marquee-content {\r\n        display: flex; animation: marquee 30s linear infinite;\r\n    }\r\n    .ps-marquee-content.reverse {\r\n        animation: marquee-rev 30s linear infinite;\r\n    }\r\n\r\n    \/* H\u0131zl\u0131 Renk De\u011fi\u015ftiren Animasyon (0.5s) *\/\r\n    @keyframes text-color-cycle {\r\n        0%   { color: #fff; -webkit-text-stroke: 0px; }\r\n        25%  { color: var(--ps-yellow); -webkit-text-stroke: 0px; }\r\n        50%  { color: var(--ps-red); -webkit-text-stroke: 0px; }\r\n        75%  { color: var(--ps-platinum); -webkit-text-stroke: 0px; }\r\n        100% { color: #fff; -webkit-text-stroke: 0px; }\r\n    }\r\n\r\n    .ps-big-text {\r\n        font-size: 10vw;\r\n        font-weight: 900; text-transform: uppercase;\r\n        padding: 0 30px; \r\n        line-height: 1.3;\r\n        animation: text-color-cycle 0.5s infinite;\r\n    }\r\n\r\n    @keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }\r\n    @keyframes marquee-rev { 0% { transform: translateX(-50%); } 100% { transform: translateX(0); } }\r\n\r\n    .ps-hero-overlay-text {\r\n        position: absolute; bottom: 8%; left: 50%; transform: translateX(-50%);\r\n        font-size: 1.2rem; color: #fff; font-weight: 700; text-transform: uppercase;\r\n        z-index: 11; text-align: center; letter-spacing: 2px;\r\n        text-shadow: 0 2px 10px rgba(0,0,0,0.8);\r\n    }\r\n\r\n    \/* MANIFESTO *\/\r\n    .ps-manifesto-sec {\r\n        background: var(--ps-platinum); color: var(--ps-black);\r\n        display: flex; align-items: center; justify-content: center;\r\n        padding: 0;\r\n    }\r\n    \r\n    .ps-mask-container {\r\n        position: relative; width: 90%; height: 100%;\r\n        display: flex; align-items: center; flex-direction: column; justify-content: center; text-align: center;\r\n    }\r\n    .ps-mask-text {\r\n        font-size: clamp(3rem, 6vw, 7rem); font-weight: 900; \r\n        line-height: 1.3;\r\n        text-transform: uppercase; color: var(--ps-black);\r\n        position: relative; z-index: 2; mix-blend-mode: multiply;\r\n        width: 100%;\r\n    }\r\n\r\n    .ps-line-sep {\r\n        width: 150px; height: 6px; background: var(--ps-red); margin: 40px auto;\r\n    }\r\n    .ps-manifesto-p {\r\n        font-size: 1.4rem; max-width: 1200px; margin-top: 20px; font-weight: 600; line-height: 1.7;\r\n    }\r\n\r\n    \/* TECH STACK *\/\r\n    .ps-tech-sec {\r\n        background: var(--ps-black); height: 100vh; padding: 0;\r\n    }\r\n    .ps-tech-stripes {\r\n        display: flex; width: 100%; height: 100%;\r\n    }\r\n    .ps-stripe {\r\n        flex: 1; height: 100%;\r\n        border-right: 1px solid rgba(255,255,255,0.1);\r\n        display: flex; flex-direction: column; justify-content: center; align-items: center;\r\n        position: relative; transition: background 0.3s;\r\n    }\r\n    .ps-stripe:last-child { border-right: none; }\r\n    \r\n    .ps-stripe:hover { background: var(--ps-red); }\r\n\r\n    .ps-stripe-num {\r\n        font-size: 4rem; font-weight: 900; color: rgba(255,255,255,0.1);\r\n        position: absolute; top: 40px; left: 50%; transform: translateX(-50%);\r\n    }\r\n    .ps-stripe-text {\r\n        font-size: 3rem; font-weight: 900; text-transform: uppercase;\r\n        writing-mode: vertical-rl;\r\n        text-orientation: mixed;\r\n        transform: rotate(180deg);\r\n        letter-spacing: 5px; color: #fff;\r\n    }\r\n\r\n    \/* CTA *\/\r\n    .ps-cta-sec {\r\n        background-color: var(--ps-red);\r\n        color: #fff; text-align: center;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n    }\r\n    \r\n    \/* CTA *\/\r\n    @keyframes cta-color-cycle {\r\n        0%   { color: #fff; -webkit-text-stroke: 0px; }\r\n        25%  { color: var(--ps-yellow); -webkit-text-stroke: 0px; }\r\n        50%  { color: var(--ps-black); -webkit-text-stroke: 0px; } \r\n        75%  { color: transparent; -webkit-text-stroke: 2px #fff; } \r\n        100% { color: #fff; -webkit-text-stroke: 0px; }\r\n    }\r\n\r\n    .ps-cta-big {\r\n        font-size: clamp(5rem, 12vw, 15rem); font-weight: 900; \r\n        line-height: 1;\r\n        text-transform: uppercase; margin-bottom: 60px;\r\n        animation: cta-color-cycle 0.5s infinite;\r\n    }\r\n\r\n    .ps-magnetic-btn {\r\n        display: inline-block; padding: 30px 80px; border: 2px solid #fff;\r\n        font-size: 1.5rem; font-weight: 700; text-transform: uppercase;\r\n        color: #fff; text-decoration: none; transition: all 0.3s;\r\n        position: relative; overflow: hidden; z-index: 1;\r\n    }\r\n    .ps-magnetic-btn::before {\r\n        content: ''; position: absolute; top: 0; left: 0; width: 0; height: 100%;\r\n        background: #fff; z-index: -1; transition: width 0.4s cubic-bezier(0.7, 0, 0.3, 1);\r\n    }\r\n    .ps-magnetic-btn:hover::before { width: 100%; }\r\n    .ps-magnetic-btn:hover { color: var(--ps-red); }\r\n\r\n\r\n    \/* RESPONSIVE *\/\r\n\r\n    \/* 1. LARGE SCREENS (> 1600px) *\/\r\n    @media (min-width: 1600px) {\r\n    }\r\n\r\n    \/* 2. LAPTOP \/ SMALL DESKTOP (1025px - 1440px) *\/\r\n    @media (min-width: 1025px) and (max-width: 1440px) {\r\n        .ps-big-text { font-size: 12vw; }\r\n        .ps-manifesto-p { font-size: 1.2rem; }\r\n    }\r\n\r\n    \/* 3. TABLET LANDSCAPE (Horizontal) (900px - 1024px) *\/\r\n    @media (min-width: 900px) and (max-width: 1024px) and (orientation: landscape) {\r\n        .ps-manifesto-sec { padding: 60px; text-align: center; }\r\n        .ps-tech-stripes { flex-direction: row; }\r\n        .ps-stripe-text { font-size: 2rem; }\r\n    }\r\n\r\n    \/* 4. TABLET PORTRAIT (Vertical) (600px - 1024px) *\/\r\n    @media (max-width: 1024px) and (orientation: portrait) {\r\n        #ps-main-container {\r\n            scroll-snap-type: none;\r\n            height: auto;\r\n            overflow-y: auto;\r\n        }\r\n        html, body { height: auto; overflow: auto; }\r\n\r\n        .ps-section {\r\n            height: auto;\r\n            min-height: 100vh;\r\n            overflow: visible;\r\n            padding-top: 60px;\r\n            padding-bottom: 60px;\r\n        }\r\n\r\n        .ps-manifesto-sec { flex-direction: column; padding: 40px; text-align: center; }\r\n        .ps-mask-container { width: 100%; }\r\n        .ps-mask-text { font-size: 3.5rem; width: 100%; margin-bottom: 20px; }\r\n        .ps-line-sep { margin: 30px auto; }\r\n        \r\n        .ps-tech-sec { padding: 0; }\r\n        .ps-tech-stripes { flex-direction: column; height: auto; }\r\n        .ps-stripe { \r\n            width: 100%; \r\n            min-height: 200px;\r\n            border-right: none; \r\n            border-bottom: 1px solid rgba(255,255,255,0.1); \r\n        }\r\n        .ps-stripe-text { \r\n            writing-mode: horizontal-tb; \r\n            transform: none; \r\n            font-size: 2.5rem; \r\n            margin-top: 20px;\r\n        }\r\n        .ps-stripe-num { \r\n            top: auto; left: 20px; right: auto; \r\n            transform: none; \r\n            position: absolute; \r\n            font-size: 2.5rem; \r\n        }\r\n\r\n        \/* CTA *\/\r\n        .ps-cta-sec {\r\n            height: 60vh;\r\n            justify-content: center;\r\n            align-items: center;\r\n        }\r\n    }\r\n\r\n    \/* 5. MOBILE LANDSCAPE (Yatay Mobil) *\/\r\n    @media (max-width: 900px) and (orientation: landscape) {\r\n        #ps-main-container { scroll-snap-type: none; height: auto; overflow-y: auto; }\r\n        html, body { height: auto; overflow: auto; }\r\n\r\n        .ps-section { height: auto; min-height: 100vh; display: flex; padding: 40px 20px; }\r\n\r\n        .ps-mask-text { font-size: 3rem; }\r\n\r\n        .ps-tech-sec { padding: 0; display: block; }\r\n        .ps-tech-stripes { flex-direction: column; height: auto; }\r\n        .ps-stripe { min-height: 150px; border-bottom: 1px solid rgba(255,255,255,0.1); border-right: none; }\r\n        .ps-stripe-text { writing-mode: horizontal-tb; transform: none; }\r\n\r\n        \/* CTA *\/\r\n        .ps-cta-sec { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100vh; }\r\n    }\r\n\r\n    \/* 6. MOBILE PORTRAIT (Dikey Mobil - En K\u00fc\u00e7\u00fck Ekranlar) *\/\r\n    @media (max-width: 600px) {\r\n        #ps-main-container { scroll-snap-type: none; height: auto; overflow-y: auto; }\r\n        html, body { height: auto; overflow: auto; }\r\n\r\n        .ps-section { height: auto; min-height: 100vh; padding: 60px 20px; }\r\n\r\n        .ps-big-text { font-size: 2.5rem; padding: 0 10px; }\r\n        .ps-marquee-wrapper { gap: 15px; }\r\n        .ps-mask-text { font-size: 2.5rem; }\r\n        .ps-manifesto-p { font-size: 1.1rem; }\r\n        \r\n        .ps-tech-sec { padding: 0; }\r\n        .ps-tech-stripes { flex-direction: column; }\r\n        .ps-stripe { \r\n            min-height: 180px; \r\n            border-right: none; \r\n            border-bottom: 1px solid rgba(255,255,255,0.1); \r\n            padding: 20px;\r\n        }\r\n        .ps-stripe-text { \r\n            writing-mode: horizontal-tb; \r\n            transform: none; \r\n            font-size: 2rem; \r\n            margin: 0;\r\n        }\r\n        .ps-stripe-num { \r\n            top: 20px; left: 20px; transform: none; font-size: 1.5rem; \r\n        }\r\n\r\n        \/* CTA *\/\r\n        .ps-cta-sec {\r\n            height: 100vh;\r\n            justify-content: center;\r\n            align-items: center;\r\n        }\r\n        .ps-cta-big { font-size: 3rem; margin-bottom: 40px; }\r\n        .ps-magnetic-btn { padding: 20px 50px; font-size: 1.2rem; }\r\n    }\r\n\r\n<\/style>\r\n\r\n<div id=\"ps-noise\" class=\"ps-noise\"><\/div>\r\n\r\n<div id=\"ps-main-container\">\r\n\r\n    \r\n    <section class=\"ps-section ps-design-hero\">\r\n        <div class=\"ps-marquee-wrapper\">\r\n            \r\n            <div class=\"ps-marquee\">\r\n                <div class=\"ps-marquee-content\">\r\n                    <span class=\"ps-big-text\">Digital Architecture<\/span>\r\n                    <span class=\"ps-big-text\">User Experience<\/span>\r\n                    <span class=\"ps-big-text\">User Interface Design<\/span>\r\n                <\/div>\r\n                <div class=\"ps-marquee-content\">\r\n                    <span class=\"ps-big-text\">Digital Architecture<\/span>\r\n                    <span class=\"ps-big-text\">User Experience<\/span>\r\n                    <span class=\"ps-big-text\">User Interface Design<\/span>\r\n                <\/div>\r\n            <\/div>\r\n            \r\n            <div class=\"ps-marquee\">\r\n                <div class=\"ps-marquee-content reverse\">\r\n                    <span class=\"ps-big-text\">Creative Coding<\/span>\r\n                    <span class=\"ps-big-text\">Interaction<\/span>\r\n                    <span class=\"ps-big-text\">Visual Storytelling<\/span>\r\n                <\/div>\r\n                <div class=\"ps-marquee-content reverse\">\r\n                    <span class=\"ps-big-text\">Creative Coding<\/span>\r\n                    <span class=\"ps-big-text\">Interaction<\/span>\r\n                    <span class=\"ps-big-text\">Visual Storytelling<\/span>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n        \r\n        \r\n        <div class=\"ps-hero-overlay-text\">\r\n            Code x Art<br>\r\n            <span style=\"font-size:0.8rem; font-weight:400; opacity:0.7;\">SCROLL DOWN TO EXPLORE<\/span>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    \r\n    <section class=\"ps-section ps-manifesto-sec\">\r\n        <div class=\"ps-mask-container\">\r\n            <div style=\"z-index:2;\">\r\n                <h2 class=\"ps-mask-text\">\r\n                    Not Just Pixels,<br> It's \r\n                    <span style=\"color:var(--ps-red);\">Vision.<\/span>\r\n                <\/h2>\r\n                <div class=\"ps-line-sep\"><\/div>\r\n                <p class=\"ps-manifesto-p\">\r\n                    Websites are not just digital business cards. They are living, breathing brand ambassadors. \r\n                    We reject standard templates; we build bespoke digital worlds with their own unique character for every brand.\r\n                <\/p>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    \r\n    <section class=\"ps-section ps-tech-sec\">\r\n        <div class=\"ps-tech-stripes\">\r\n            \r\n            <div class=\"ps-stripe\">\r\n                <span class=\"ps-stripe-num\">01<\/span>\r\n                <span class=\"ps-stripe-text\">Research<\/span>\r\n            <\/div>\r\n            \r\n            <div class=\"ps-stripe\">\r\n                <span class=\"ps-stripe-num\">02<\/span>\r\n                <span class=\"ps-stripe-text\">UX Des\u0131gn<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"ps-stripe\">\r\n                <span class=\"ps-stripe-num\">03<\/span>\r\n                <span class=\"ps-stripe-text\">UI V\u0131sual<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"ps-stripe\">\r\n                <span class=\"ps-stripe-num\">04<\/span>\r\n                <span class=\"ps-stripe-text\">Front-End<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"ps-stripe\">\r\n                <span class=\"ps-stripe-num\">05<\/span>\r\n                <span class=\"ps-stripe-text\">Mot\u0131on<\/span>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/section>\r\n\r\n    \r\n    <section class=\"ps-section ps-cta-sec\">\r\n        <div class=\"ps-cta-big\">Let's<br>Begin.<\/div>\r\n        <div>\r\n            <a href=\"https:\/\/pandasticstudio.com\/en\/contact\/\" class=\"ps-magnetic-btn\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/section>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-01712f4 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-equal-height-no e-con e-parent\" data-id=\"01712f4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-92accd8 elementor-widget elementor-widget-wpr-elementor-template\" data-id=\"92accd8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"wpr-elementor-template.default\">\n\t\t\t\t\t<style>.elementor-1928 .elementor-element.elementor-element-7c6490ba{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1928 .elementor-element.elementor-element-210f5e1d{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}<\/style>\t\t<div data-elementor-type=\"container\" data-elementor-id=\"1928\" class=\"elementor elementor-1928\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7c6490ba e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-equal-height-no e-con e-parent\" data-id=\"7c6490ba\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-210f5e1d elementor-widget elementor-widget-html\" data-id=\"210f5e1d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<style>\r\n    \/* --- FOOTER STYLES --- *\/\r\n    .ps-footer-section {\r\n        height: 100vh; \r\n        width: 100%;\r\n        scroll-snap-align: start;\r\n        background-color: var(--bg-dark);\r\n        color: var(--bg-light);\r\n        font-family: var(--main-font);\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: space-between;\r\n        position: relative;\r\n        border-top: 1px solid rgba(255,255,255,0.1);\r\n        overflow: hidden; \r\n        flex-shrink: 0;\r\n    }\r\n\r\n    \/* Mobil Scroll *\/\r\n    @media (max-height: 800px) {\r\n        .ps-footer-section {\r\n            height: auto;\r\n            min-height: 100vh;\r\n            padding-bottom: 50px;\r\n        }\r\n    }\r\n\r\n    \/* 1. KAYAN YAZI & RENK AN\u0130MASYONU *\/\r\n    .ps-footer-marquee {\r\n        width: 100%;\r\n        padding: 30px 0;\r\n        border-bottom: 1px solid rgba(255,255,255,0.1);\r\n        overflow: hidden;\r\n        white-space: nowrap;\r\n        background: var(--bg-dark);\r\n        flex-shrink: 0;\r\n    }\r\n\r\n    .ps-marquee-content {\r\n        display: inline-block;\r\n        font-family: var(--main-font);\r\n        font-weight: 900;\r\n        font-size: clamp(3rem, 5vw, 6rem);\r\n        text-transform: uppercase;\r\n        animation: \r\n            scrollText 20s linear infinite,\r\n            colorCycle 1.5s infinite; \r\n    }\r\n\r\n    \/* Sa\u011fa Sola Kayma Efekti *\/\r\n    @keyframes scrollText {\r\n        from { transform: translateX(0); }\r\n        to { transform: translateX(-50%); }\r\n    }\r\n\r\n    \/* 3 A\u015famal\u0131 HIZLI Renk De\u011fi\u015fimi *\/\r\n    @keyframes colorCycle {\r\n        0%, 30% { \r\n            color: var(--primary-cinnabar); \r\n            -webkit-text-stroke: 0 var(--primary-cinnabar); \r\n        }\r\n        33%, 63% { \r\n            color: var(--accent-yellow); \r\n            -webkit-text-stroke: 0 var(--accent-yellow); \r\n        }\r\n        66%, 100% { \r\n            color: var(--bg-light); \r\n            -webkit-text-stroke: 0 var(--bg-light); \r\n        }\r\n    }\r\n\r\n    \/* 2. FOOTER \u0130\u00c7ER\u0130K GRID *\/\r\n    .ps-footer-grid {\r\n        display: grid;\r\n        grid-template-columns: 1.5fr 1fr 1fr 1fr;\r\n        gap: 40px;\r\n        padding: 40px clamp(40px, 8vw, 80px);\r\n        flex-grow: 1;\r\n        align-items: start;\r\n    }\r\n\r\n    .ps-footer-col h4 a{font-size: 1.2rem;color: var(--accent-yellow);margin-bottom: 20px;text-transform: uppercase;font-weight: 900;}\r\n    .ps-footer-col h4 a:hover {color:var(--primary-cinnabar)}\r\n\r\n    .ps-footer-col ul { list-style: none; padding: 0; margin: 0; }\r\n    .ps-footer-col ul li { margin-bottom: 10px; }\r\n\r\n    .ps-footer-col ul li a {\r\n        color: var(--bg-light); text-decoration: none; font-size: 1rem;\r\n        font-weight: 400; transition: color 0.3s, padding-left 0.3s; display: inline-block;\r\n    }\r\n\r\n    .ps-footer-col ul li a:hover { color: var(--primary-cinnabar); padding-left: 5px; }\r\n\r\n    .ps-address p { font-size: 1rem; line-height: 1.6; color: #888; margin-bottom: 20px; }\r\n    \r\n    \/* Adres Link Stilleri *\/\r\n    .ps-address a.ps-map-link, .ps-address a.ps-tel-link {\r\n        color: var(--bg-light); \r\n        text-decoration: none; \r\n        border-bottom: 1px solid transparent;\r\n        transition: all 0.3s;\r\n        display: inline-block;\r\n    }\r\n    .ps-address a.ps-map-link:hover, .ps-address a.ps-tel-link:hover {\r\n        color: var(--accent-yellow);\r\n    }\r\n\r\n    .ps-footer-brand h3 {\r\n        font-size: clamp(2rem, 3vw, 3rem); font-weight: 900; line-height: 1.1;\r\n        color: var(--text-color); margin-bottom: 20px;\r\n    }\r\n    .ps-footer-brand p { color: #888; max-width: 300px; margin-bottom: 20px; }\r\n\r\n    \/* Sosyal Medya \u0130konlar\u0131 *\/\r\n    .ps-brand-socials {\r\n        display: flex; gap: 15px; margin-top: 25px;\r\n    }\r\n    .ps-brand-socials a {\r\n        color: var(--bg-light);\r\n        transition: transform 0.3s, color 0.3s;\r\n        display: flex; align-items: center; justify-content: center;\r\n    }\r\n    .ps-brand-socials a:hover {\r\n        color: var(--primary-cinnabar);\r\n        transform: translateY(-3px);\r\n    }\r\n    .ps-brand-socials svg {\r\n        width: 24px; height: 24px; fill: currentColor;\r\n    }\r\n\r\n    \/* 3. COPYRIGHT BAR *\/\r\n    .ps-footer-bottom {\r\n        padding: 20px clamp(40px, 8vw, 80px);\r\n        border-top: 1px solid rgba(255,255,255,0.1);\r\n        display: flex; justify-content: space-between; align-items: center;\r\n        font-size: 0.9rem; color: #666;\r\n        flex-shrink: 0;\r\n        background: var(--bg-dark);\r\n    }\r\n\r\n    \/* RESPONSIVE *\/\r\n    @media (max-width: 1024px) {\r\n        .ps-footer-grid { grid-template-columns: 1fr 1fr; padding: 30px; }\r\n        .ps-footer-section { height: auto; min-height: 100vh; } \r\n    }\r\n    @media (max-width: 768px) {\r\n        .ps-footer-grid { grid-template-columns: 1fr; gap: 30px; }\r\n        .ps-footer-bottom { flex-direction: column; gap: 15px; text-align: center; }\r\n        .ps-marquee-content { font-size: 3rem; }\r\n        .ps-brand-socials { justify-content: flex-start; }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"ps-footer-section\" id=\"ps-footer\">\r\n    \r\n    \r\n    <div class=\"ps-footer-marquee\">\r\n        <div class=\"ps-marquee-content\">\r\n            GET READY FOR A PANDASTIC WORLD \u2014 LET'S CREATE TOGETHER \u2014 PANDASTIC STUDIO \u2014 \r\n            GET READY FOR A PANDASTIC WORLD \u2014 LET'S CREATE TOGETHER \u2014 PANDASTIC STUDIO \u2014\r\n        <\/div>\r\n    <\/div>\r\n\r\n    \r\n    <div class=\"ps-footer-grid\">\r\n        \r\n        <div class=\"ps-footer-col ps-footer-brand\">\r\n            <h3>LET\u2019S PUSH THE BOUNDARIES OF THE DIGITAL WORLD TOGETHER.<\/h3>\r\n            <p>We\u2019re rewriting your brand\u2019s story through technology and creativity.<\/p>\r\n            \r\n            <a href=\"https:\/\/pandasticstudio.com\/en\/iletisim\/\" style=\"display: inline-block; background: var(--primary-cinnabar); color: #fff; padding: 15px 30px; text-decoration: none; font-weight: bold; text-transform: uppercase;\">\r\n                Contact Us \u2794\r\n            <\/a>\r\n\r\n            \r\n            <div class=\"ps-brand-socials\">\r\n                \r\n                <a href=\"https:\/\/www.linkedin.com\/company\/pandasticstudio\/posts\/?feedView=all\" target=\"_blank\" aria-label=\"LinkedIn\" rel=\"noopener\">\r\n                    <svg viewbox=\"0 0 24 24\"><path d=\"M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z\"\/><\/svg>\r\n                <\/a>\r\n                \r\n                <a href=\"https:\/\/www.instagram.com\/pandasticstudio\/\" target=\"_blank\" aria-label=\"Instagram\" rel=\"noopener\">\r\n                    <svg viewbox=\"0 0 24 24\"><path d=\"M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z\"\/><\/svg>\r\n                <\/a>\r\n                \r\n                <a href=\"https:\/\/www.tiktok.com\/@pandasticsocial\" target=\"_blank\" aria-label=\"TikTok\" rel=\"noopener\">\r\n                    <svg viewbox=\"0 0 24 24\"><path d=\"M19.59 6.69a4.83 4.83 0 0 1-3.77-4.25V2h-3.45v13.67a2.89 2.89 0 0 1-5.2 1.74 2.89 2.89 0 0 1 2.31-4.64 2.93 2.93 0 0 1 .88.13V9.4a6.84 6.84 0 0 0-1-.05A6.33 6.33 0 0 0 5 20.1a6.34 6.34 0 0 0 10.86-4.43v-7a8.16 8.16 0 0 0 4.77 1.52v-3.4a4.85 4.85 0 0 1-1-.1z\"\/><\/svg>\r\n                <\/a>\r\n                \r\n                <a href=\"https:\/\/www.facebook.com\/pandasticstudio\" target=\"_blank\" aria-label=\"Facebook\" rel=\"noopener\">\r\n                    <svg viewbox=\"0 0 24 24\"><path d=\"M9 8h-3v4h3v12h5v-12h3.642l.358-4h-4v-1.667c0-.955.192-1.333 1.115-1.333h2.885v-5h-3.808c-3.596 0-5.192 1.583-5.192 4.615v3.385z\"\/><\/svg>\r\n                <\/a>\r\n                \r\n                <a href=\"https:\/\/x.com\/pandasticstudio\" target=\"_blank\" aria-label=\"X\">\r\n                    <svg viewbox=\"0 0 24 24\"><path d=\"M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932ZM17.61 20.644h2.039L6.486 3.24H4.298Z\"\/><\/svg>\r\n                <\/a>\r\n                \r\n                <a href=\"https:\/\/www.youtube.com\/@pandasticstudio\" target=\"_blank\" aria-label=\"Youtube\" rel=\"noopener\">\r\n                    <svg viewbox=\"0 0 24 24\"><path d=\"M19.615 3.184c-3.604-.246-11.631-.245-15.23 0-3.897.266-4.356 2.62-4.385 8.816.029 6.185.484 8.549 4.385 8.816 3.6.245 11.626.246 15.23 0 3.897-.266 4.356-2.62 4.385-8.816-.029-6.185-.484-8.549-4.385-8.816zm-10.615 12.816v-8l8 3.993-8 4.007z\"\/><\/svg>\r\n                <\/a>\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n        <div class=\"ps-footer-col\">\r\n            <h4><a href=\"https:\/\/pandasticstudio.com\/en\/our-services\/\">Services<\/a><\/h4>\r\n            <ul>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/our-services\/360-marketing\/digital-marketing\/\">Digital Marketing<\/a><\/li>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/our-services\/360-marketing\/social-media-management\/\">Social Media Management<\/a><\/li>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/our-services\/360-marketing\/seo-service\/\">SEO Service<\/a><\/li>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/our-services\/production\/\">Production<\/a><\/li>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/our-services\/web-design\/\">Web Design<\/a><\/li>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/our-services\/e-commerce-management\/\">E-commerce Management<\/a><\/li>\r\n            <\/ul>\r\n        <\/div>\r\n\r\n        <div class=\"ps-footer-col\">\r\n            <h4><a href=\"https:\/\/pandasticstudio.com\/en\/corporate\/\">Corporate<\/a><\/h4>\r\n            <ul>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/corporate\/about-us\/\">About Us<\/a><\/li>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/references\/\">References<\/a><\/li>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/pblog-en\/\">PBlog<\/a><\/li>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/partners\/\">Partners<\/a><\/li>\r\n                <li><a href=\"https:\/\/pandasticstudio.com\/en\/contact\/\">Contact<\/a><\/li>\r\n            <\/ul>\r\n        <\/div>\r\n\r\n        <div class=\"ps-footer-col ps-address\">\r\n            <h4><a href=\"https:\/\/pandasticstudio.com\/en\/contact\/\">Offices<\/a><\/h4>\r\n            <p>\r\n                <strong style=\"color:#fff;\">\u0130STANBUL (Centre)<\/strong><br>\r\n                <a href=\"https:\/\/maps.app.goo.gl\/Sg3UyuVuft7GF5Gv5\" target=\"_blank\" class=\"ps-map-link\" rel=\"noopener\">\r\n                    Balmumcu, Morbasan Sk. Koza \u0130\u015f Merkezi No:12 B Blok Kat:5 D:11-13, 34349 Be\u015fikta\u015f \/ \u0130stanbul\r\n                <\/a><br>\r\n                <br>\r\n                <a href=\"tel:+905326992632\" class=\"ps-tel-link\">+90 532 699 26 32<\/a><br>\r\n                <a href=\"mailto:info@pandasticstudio.com\" class=\"ps-tel-link\">info@pandasticstudio.com<\/a>\r\n            <\/p>\r\n            <p>\r\n                <strong style=\"color:#fff;\">VIENNA<\/strong><br>\r\n                <a href=\"https:\/\/www.google.com\/maps\/search\/?api=1&amp;query=Linke+Wienzeile+64+1060+Wien+\u00d6sterreich\" target=\"_blank\" class=\"ps-map-link\" rel=\"noopener\">\r\n                    European Office GL3 Linke Wienzeile 64 1060 Wien, \u00d6sterreich\r\n                <\/a>\r\n            <\/p>\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n    \r\n    <div class=\"ps-footer-bottom\">\r\n        <div class=\"ps-copy\">\r\n            &copy; 2026 Pandastic Studio Media Ltd. All rights reserved. \r\n        <\/div>\r\n        \r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<script>\r\n    document.addEventListener('DOMContentLoaded', () => {\r\n        const footer = document.getElementById('ps-footer');\r\n        \r\n        const mainContainer = document.getElementById('ps-main-container');\r\n\r\n        if (footer && mainContainer) {\r\n            mainContainer.appendChild(footer);\r\n            \r\n            console.log(\"Pandastic Footer: Snap-Scroll ak\u0131\u015f\u0131na entegre edildi.\");\r\n        } else {\r\n            console.log(\"Pandastic Footer: Standart yerle\u015fimde.\");\r\n        }\r\n    });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<span class=\"wpr-template-edit-btn\" data-permalink=\"https:\/\/pandasticstudio.com\/en\/?elementor_library=eng-footer-menu\">Edit Template<\/span>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Digital Architecture User Experience User Interface Design Digital Architecture User Experience User Interface Design Creative Coding Interaction Visual Storytelling Creative Coding Interaction Visual Storytelling Code x Art SCROLL DOWN TO EXPLORE Not Just Pixels, It&#8217;s Vision. Websites are not just digital business cards. They are living, breathing brand ambassadors. We reject standard templates; we build bespoke digital worlds with their own unique character for every brand. 01 Research 02 UX Des\u0131gn 03 UI V\u0131sual 04 Front-End 05 Mot\u0131on Let&#8217;sBegin. Contact Us GET READY FOR A PANDASTIC WORLD \u2014 LET&#8217;S CREATE TOGETHER \u2014 PANDASTIC STUDIO \u2014 GET READY FOR A PANDASTIC WORLD \u2014 LET&#8217;S CREATE TOGETHER \u2014 PANDASTIC STUDIO \u2014 LET\u2019S PUSH THE BOUNDARIES OF THE DIGITAL WORLD TOGETHER. We\u2019re rewriting your brand\u2019s story through technology and creativity. Contact Us \u2794 Services Digital Marketing Social Media Management SEO Service Production Web Design E-commerce Management Corporate About Us References PBlog Partners Contact Offices \u0130STANBUL (Centre) Balmumcu, Morbasan Sk. Koza \u0130\u015f Merkezi No:12 B Blok Kat:5 D:11-13, 34349 Be\u015fikta\u015f \/ \u0130stanbul +90 532 699 26 32 info@pandasticstudio.com VIENNA European Office GL3 Linke Wienzeile 64 1060 Wien, \u00d6sterreich &copy; 2026 Pandastic Studio Media Ltd. All rights reserved. Edit Template<\/p>","protected":false},"author":1,"featured_media":0,"parent":1940,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"googlesitekit_rrm_CAowqNq2DA:productID":"","footnotes":""},"class_list":["post-2119","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/pandasticstudio.com\/en\/wp-json\/wp\/v2\/pages\/2119","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pandasticstudio.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/pandasticstudio.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/pandasticstudio.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pandasticstudio.com\/en\/wp-json\/wp\/v2\/comments?post=2119"}],"version-history":[{"count":7,"href":"https:\/\/pandasticstudio.com\/en\/wp-json\/wp\/v2\/pages\/2119\/revisions"}],"predecessor-version":[{"id":2414,"href":"https:\/\/pandasticstudio.com\/en\/wp-json\/wp\/v2\/pages\/2119\/revisions\/2414"}],"up":[{"embeddable":true,"href":"https:\/\/pandasticstudio.com\/en\/wp-json\/wp\/v2\/pages\/1940"}],"wp:attachment":[{"href":"https:\/\/pandasticstudio.com\/en\/wp-json\/wp\/v2\/media?parent=2119"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}<!-- This website is optimized by Airlift. Learn more: https://airlift.net. Template:. Learn more: https://airlift.net. Template: 69e38c8ed36f73be38ae3b56. Config Timestamp: 2026-04-18 13:52:13 UTC, Cached Timestamp: 2026-04-19 16:01:20 UTC -->