/* Web Tasarımı: responsive live examples and transform-based motion. */
.web-page main{padding-bottom:48px}
.web-page section{scroll-margin-top:108px}
.icon-desktop{mask-image:url('../assets/icons/desktop.svg')}
.icon-device-tablet{mask-image:url('../assets/icons/device-tablet.svg')}
.icon-device-mobile{mask-image:url('../assets/icons/device-mobile.svg')}
.icon-lightning{mask-image:url('../assets/icons/lightning.svg')}
.icon-arrows-clockwise{mask-image:url('../assets/icons/arrows-clockwise.svg')}
.icon-shopping-bag{mask-image:url('../assets/icons/shopping-bag.svg')}
.icon-crosshair{mask-image:url('../assets/icons/crosshair.svg')}
.icon-pen-nib{mask-image:url('../assets/icons/pen-nib.svg')}
.icon-check-circle{mask-image:url('../assets/icons/check-circle.svg')}
.icon-magnifying-glass{mask-image:url('../assets/icons/magnifying-glass.svg')}
.icon-arrow-down{mask-image:url('../assets/icons/arrow-right.svg');transform:rotate(90deg)}
.web-breadcrumbs{display:flex;flex-wrap:wrap;gap:11px;align-items:center;padding-block:27px 15px;font-size:13px;line-height:1.7;color:var(--muted)}
.web-breadcrumbs a:hover{color:var(--accent-text)}
.web-breadcrumbs [aria-current]{color:var(--ink)}
.web-hero{display:grid;grid-template-columns:.86fr 1.14fr;gap:5%;align-items:center;padding-block:22px 40px}
.web-hero-copy{min-width:0;padding-bottom:38px}
.web-hero h1{font-size:clamp(44px,4.8vw,68px);font-weight:400;line-height:1.1;letter-spacing:-.064em}
.web-hero h1>span,.web-hero h1>strong{display:block}
.web-hero h1>strong{font-weight:650;margin-top:9px}
.web-hero-copy>p{font-size:17px;line-height:1.85;color:var(--muted);max-width:420px;margin-top:28px}
.web-hero-copy>.button{margin-top:29px;min-height:54px;padding:17px 23px;font-size:14px;gap:21px;border-radius:14px}
.web-hero-copy>.button .icon{width:18px;height:18px}
.web-hero-copy>.button:hover .icon-arrow-down{transform:translateY(3px) rotate(90deg)}
.web-preview{min-width:0}
.device-controls{display:flex;justify-content:center;gap:5px;margin-bottom:16px}
.device-controls button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 16px;border:1px solid transparent;border-radius:12px;background:transparent;font:600 13px var(--font);color:var(--muted);cursor:pointer;transition:transform .25s}
.device-controls button .icon{width:19px;height:19px}
.device-controls button[aria-pressed="true"]{background:var(--ink);color:#fff}
.device-controls button:hover{transform:translateY(-2px)}
.device-controls button:not([aria-pressed="true"]):hover{background:#f1f1ed;color:var(--ink)}
.preview-stage{position:relative;height:448px;overflow:hidden;border-radius:28px;background:#e8ece5;border:1px solid #e3e6dd}
.live-browser{position:absolute;left:50%;top:50%;width:720px;height:448px;transform:translate(-50%,-50%) scale(var(--preview-scale,.8));transform-origin:center;border:1px solid #d3d9d0;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 20px 35px #303b2420;transition:transform .55s cubic-bezier(.22,1,.36,1)}
.browser-bar{display:flex;align-items:center;gap:8px;padding:10px 16px;height:37px;background:#fff;color:#525c50;font-size:11px;font-weight:500;border-bottom:1px solid #e4e8e0;white-space:nowrap}
.browser-bar .icon{width:15px;height:15px}
.browser-line{height:1px;flex:1;margin-left:12px;background:#e3e7df}
.live-browser iframe{display:block;width:100%;height:410px;border:0;background:#f5f4ec}
.preview-caption{font-size:12px;color:var(--ink);line-height:1.7;text-align:center;margin-top:14px}
.web-section{padding-block:95px}
.web-manifesto{border-top:1px solid var(--line);margin-top:39px;text-align:center}
.web-manifesto h2{font-size:clamp(35px,4vw,55px);font-weight:400;line-height:1.2;letter-spacing:-.055em}
.web-manifesto h2 strong{font-weight:650}
.web-manifesto>p{font-size:17px;line-height:1.85;color:var(--muted);max-width:640px;margin:25px auto 0}
.web-section-title{font-size:clamp(33px,4.05vw,55px);font-weight:500;line-height:1.22;letter-spacing:-.055em;margin-bottom:31px}
.web-section-title>span{color:var(--muted)}
.web-bento{display:grid;grid-template-columns:1.08fr .92fr;gap:20px}
.web-tile{min-width:0;padding:37px 38px 35px;border-radius:26px;position:relative;overflow:hidden;transition:transform .4s cubic-bezier(.22,1,.36,1)}
.web-tile:hover{transform:translateY(-5px)}
.tile-journey{background:#e4ebdb;display:flex;flex-direction:column;justify-content:space-between}
.tile-cms{background:#f3efe4}
.tile-speed{background:#e8edf0}
.tile-seo{background:#f8e4d6}
.tile-symbol{display:block;width:34px;height:34px;margin-bottom:27px;transition:transform .4s cubic-bezier(.22,1,.36,1)}
.web-tile:hover .tile-symbol{transform:translateY(-3px) rotate(-8deg)}
.web-tile h3{font-size:clamp(25px,2.5vw,32px);font-weight:600;line-height:1.22;letter-spacing:-.045em;max-width:410px}
.web-tile p{font-size:15px;line-height:1.85;color:#525650;margin-top:16px;max-width:490px}
.visitor-journey{list-style:none;padding:0;display:flex;flex-direction:column;gap:0;margin-top:34px;position:relative}
.visitor-journey::before{content:"";position:absolute;width:1px;background:#a8b497;left:8px;top:16px;bottom:18px;transform-origin:top;transition:transform .9s cubic-bezier(.22,1,.36,1)}
.visitor-journey li{position:relative;padding:12px 0 12px 35px;display:flex;align-items:baseline;gap:12px;justify-content:space-between}
.visitor-journey li::before{content:"";position:absolute;width:17px;height:17px;border:1px solid #667753;border-radius:50%;background:#e4ebdb;left:0;top:16px;box-shadow:inset 0 0 0 5px #e4ebdb}
.visitor-journey li:last-child::before{background:#667753}
.visitor-journey li>span{font-size:17px;font-weight:600;letter-spacing:-.025em}
.visitor-journey small{font-size:12px;color:#53614a}
.content-editor{margin-top:27px;border-top:1px solid #ded9ca;padding-top:22px}
.content-editor label{font-size:12px;font-weight:600;display:block;margin-bottom:10px}
.editor-input{display:flex;gap:6px;padding:6px 7px 6px 13px;background:#fff;border:1px solid #d6d0c0;border-radius:12px;min-width:0}
.editor-input input{width:100%;min-width:0;background:transparent;border:0;font:500 13px var(--font);color:var(--ink)}
.editor-input input:focus-visible{outline:0}
.editor-input:focus-within{outline:2px solid var(--accent-text);outline-offset:3px}
.editor-input button{display:grid;place-items:center;flex:0 0 38px;min-height:38px;background:#f5f3ec;border:0;border-radius:8px;color:var(--ink);cursor:pointer;transition:transform .35s}
.editor-input button:hover{transform:rotate(-25deg)}
.editor-input button .icon{width:20px;height:20px}
.edited-preview{padding:21px 0 0}
.edited-preview>span{font-size:11px;color:#646257}
.edited-preview p{color:var(--ink);font-size:23px;line-height:1.35;letter-spacing:-.045em;font-weight:600;margin-top:10px;overflow-wrap:anywhere;min-height:62px}
.speed-steps{list-style:none;padding:0;margin-top:30px;display:grid;gap:14px}
.speed-steps li{display:flex;align-items:center;gap:11px;font-size:14px;line-height:1.6}
.speed-steps .icon{width:21px;height:21px;flex-shrink:0}
.search-example{margin-top:27px;background:#fff;border-radius:16px;padding:21px 24px}
.search-example>span{display:block;font-size:11px;color:var(--muted)}
.search-example strong{display:block;font-size:18px;line-height:1.4;font-weight:600;margin-top:10px;letter-spacing:-.025em;overflow-wrap:anywhere}
.search-example p{font-size:12px;line-height:1.8;margin-top:8px}
.example-note{display:block;font-size:11px;color:#6b5548;margin-top:10px}
.web-section-copy{font-size:16px;line-height:1.85;max-width:600px;color:var(--muted);margin-top:-8px;margin-bottom:33px}
.solution-deck{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.solution-deck.is-ready[data-active="0"]{grid-template-columns:1.55fr 1fr 1fr}
.solution-deck.is-ready[data-active="1"]{grid-template-columns:1fr 1.55fr 1fr}
.solution-deck.is-ready[data-active="2"]{grid-template-columns:1fr 1fr 1.55fr}
.solution-card{min-width:0;border-radius:24px;padding:30px 28px;transform-origin:top left;position:relative}
.solution-corporate{background:#eef0e9}
.solution-commerce{background:#f7eade}
.solution-renew{background:#edecf0}
.solution-icon{width:38px;height:38px;display:block;margin-bottom:38px;transition:transform .4s}
.solution-card:hover .solution-icon{transform:rotate(-8deg) translateY(-3px)}
.solution-card h3{font-size:25px;font-weight:600;line-height:1.3;letter-spacing:-.04em}
.solution-card h3 button{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;background:none;border:0;padding:0;text-align:left;font:inherit;color:inherit;width:100%;min-height:68px;cursor:pointer;letter-spacing:inherit}
.solution-card h3 button>.icon{flex:0 0 22px;margin-top:5px;transition:transform .3s}
.solution-card h3 button:hover>.icon{transform:translate(3px,-3px)}
.solution-card.is-active h3 button>.icon{color:var(--accent-text)}
.solution-body{padding-top:23px}
.solution-body p{font-size:14px;line-height:1.85;color:#525350}
.solution-body ul{display:grid;gap:10px;list-style:none;padding:20px 0 0;margin:0}
.solution-body li{position:relative;padding-left:17px;font-size:13px;line-height:1.8}
.solution-body li::before{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:#646861;left:0;top:9px}
.solution-deck.is-ready .solution-card{min-height:395px}

.web-seo-section{display:grid;grid-template-columns:.92fr 1.08fr;gap:10%;border-top:1px solid var(--line);padding-block:77px 12px}
.seo-foundation> .icon{display:block;width:33px;height:33px;margin-bottom:23px}
.seo-foundation h2{font-size:clamp(33px,3.5vw,47px);font-weight:400;line-height:1.25;letter-spacing:-.055em}
.seo-foundation h2 strong{font-weight:650}
.seo-foundation p{font-size:15px;line-height:1.9;color:var(--muted);margin-top:24px;max-width:420px}
.seo-foundation .text-link{font-size:14px;margin-top:23px}
.seo-practices{display:grid;grid-template-columns:1fr 1fr;gap:29px 32px}
.seo-practices article{min-width:0;border-top:1px solid var(--line);padding-top:21px}
.seo-practices h3{font-size:20px;line-height:1.4;font-weight:600;letter-spacing:-.035em}
.seo-practices p{font-size:14px;line-height:1.9;color:var(--muted);margin-top:13px}
.web-faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);column-gap:8%;align-items:start;padding-bottom:87px}
.web-faq .web-section-title{font-size:clamp(30px,3.15vw,44px);line-height:1.27;margin-bottom:0}
.web-faq .faq-list{width:100%;max-width:none;margin:0}
.web-faq .faq-list summary{font-size:17px;padding-block:26px;min-height:80px}
.web-faq .faq-list p{font-size:15px;line-height:1.9;max-width:870px}
.web-faq .faq-list .disclosure-inner{padding-top:18px;padding-bottom:26px}
.web-faq .faq-list .disclosure-inner>p{padding:0 24px 0 0}
.web-final-cta{display:grid;grid-template-columns:1.5fr 1fr;gap:8%;align-items:center;background:#f9ede3;border:1px solid #f0dfd2;border-radius:28px;padding:49px 55px;margin-bottom:20px}
.web-final-cta h2{font-size:clamp(30px,3.5vw,47px);font-weight:400;line-height:1.24;letter-spacing:-.05em}
.web-final-cta h2 strong{font-weight:650}
.web-final-cta p{font-size:15px;line-height:1.9;margin-top:21px;color:#645d56;max-width:520px}
.web-final-actions{display:flex;flex-direction:column;gap:20px;align-items:flex-end;min-width:0}
.web-final-actions .button{font-size:14px;min-height:54px;padding:17px 25px;gap:23px}
.web-final-actions .text-link{font-size:13px;gap:19px}
.web-page.web-motion-ready [data-web-reveal]{opacity:0;transform:translateY(27px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1);transition-delay:var(--reveal-delay,0ms)}
.web-page.web-motion-ready [data-web-reveal].is-in-view{opacity:1;transform:translateY(0)}
.web-page.web-motion-ready .web-tile.is-in-view:hover{transform:translateY(-5px)}
.web-motion-ready .web-bento .web-tile:nth-child(even){--reveal-delay:85ms}
.web-motion-ready .seo-practices article:nth-child(even){--reveal-delay:80ms}
.web-motion-ready .web-hero-copy{animation:web-hero-enter .8s cubic-bezier(.22,1,.36,1) both}
.web-motion-ready .web-hero-copy>.button{animation:web-enter .65s .1s cubic-bezier(.22,1,.36,1) both}
.web-motion-ready .web-preview{animation:web-enter 1.05s .12s cubic-bezier(.22,1,.36,1) both}
.web-motion-ready .visitor-journey li,.web-motion-ready .speed-steps li{opacity:0;transform:translateY(12px);transition:opacity .5s,transform .6s cubic-bezier(.22,1,.36,1)}
.web-motion-ready .is-in-view .visitor-journey li,.web-motion-ready .is-in-view .speed-steps li{opacity:1;transform:translateY(0)}
.web-motion-ready .is-in-view li:nth-child(1){transition-delay:.2s}
.web-motion-ready .is-in-view li:nth-child(2){transition-delay:.32s}
.web-motion-ready .is-in-view li:nth-child(3){transition-delay:.44s}
.web-motion-ready .visitor-journey::before{transform:scaleY(0)}
.web-motion-ready .is-in-view .visitor-journey::before{transform:scaleY(1)}
@keyframes web-enter{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}
@keyframes web-hero-enter{from{transform:translateY(20px)}to{transform:translateY(0)}}
@media(min-width:1600px){.web-hero h1{font-size:71px}.web-hero{gap:4%}.web-hero-copy>p{max-width:460px}}
@media(max-width:1100px){.web-hero{grid-template-columns:.92fr 1.08fr;gap:4%}.web-hero h1{font-size:clamp(42px,5vw,55px)}.web-hero-copy>p{font-size:16px}.preview-stage{height:410px}.web-tile{padding:30px}.visitor-journey li{display:block}.visitor-journey small{display:block;margin-top:3px}.solution-card{padding:28px 23px}.solution-card h3{font-size:23px}.web-seo-section{gap:7%}.seo-practices{gap:24px}.web-final-cta{padding:40px}}
@media(max-width:860px){.web-hero{grid-template-columns:1fr;gap:25px;padding-top:24px}.web-hero-copy{padding-bottom:0;max-width:680px}.web-hero h1{font-size:clamp(47px,7.5vw,65px)}.web-hero-copy>p{max-width:570px;margin-top:23px}.web-hero-copy>.button{margin-top:24px}.web-preview{margin-top:8px}.preview-stage{height:448px}.web-manifesto{margin-top:23px;gap:7%;grid-template-columns:1fr 1fr}.web-section{padding-block:73px}.web-bento{gap:16px}.web-tile{padding:28px 25px}.web-tile h3{font-size:27px}.web-tile p{font-size:14px}.solution-deck{gap:12px}.solution-card{padding:27px 20px}.solution-card h3{font-size:22px}.solution-body p{font-size:13px}.solution-body li{font-size:12px}.solution-deck.is-ready .solution-card{min-height:420px}.web-seo-section{grid-template-columns:1fr;gap:38px;padding-top:60px}.seo-foundation p{max-width:620px}.seo-practices{gap:28px 35px}.seo-practices p{font-size:15px}.web-final-cta{grid-template-columns:1.5fr 1fr;gap:5%;padding:35px}.web-final-actions .button{padding:17px 21px;gap:14px}.web-final-actions .text-link{font-size:12px;gap:10px}}
@media(max-width:760px){.web-bento{grid-template-columns:1fr}.web-tile{padding:32px}.web-tile h3{font-size:30px}.web-tile p{font-size:15px;max-width:570px}.visitor-journey li{display:flex}.tile-symbol{margin-bottom:24px}.solution-deck,.solution-deck.is-ready[data-active]{grid-template-columns:1fr;gap:14px}.solution-deck.is-ready .solution-card{min-height:0;padding:29px}.solution-icon{width:30px;height:30px;margin-bottom:20px}.solution-card h3{font-size:26px}.solution-card h3 button{min-height:44px;align-items:center}.solution-card h3 br{display:none}.solution-card h3 br::after{content:" "}.solution-body{padding-top:22px}.solution-body p{font-size:15px}.solution-body li{font-size:14px}.web-final-cta{grid-template-columns:1fr;gap:28px}.web-final-actions{align-items:flex-start}.web-final-actions .text-link{font-size:13px}.web-faq .faq-list summary{font-size:16px;padding-block:24px}.web-faq .faq-list p{font-size:15px}}
@media(max-width:600px){.web-page main{padding-bottom:25px}.web-breadcrumbs{padding-block:20px 8px;font-size:12px;gap:9px}.web-hero{padding-block:21px 23px;gap:31px}.web-hero h1{font-size:clamp(39px,10.3vw,54px);line-height:1.13;letter-spacing:-.06em}.web-hero h1>strong{margin-top:6px}.web-hero-copy>p{font-size:16px;line-height:1.85;margin-top:23px}.web-hero-copy>.button{min-height:51px;font-size:13px;padding:15px 20px}.web-preview{margin-top:0}.device-controls{gap:2px;margin-bottom:12px}.device-controls button{font-size:12px;padding:10px 11px;gap:6px;flex:1}.device-controls button .icon{width:18px;height:18px}.preview-stage{height:448px;border-radius:22px}.preview-caption{font-size:11px;margin-top:13px}.preview-caption>span{font-size:10px}.web-section{padding-block:57px}.web-manifesto{grid-template-columns:1fr;gap:23px;margin-top:22px}.web-manifesto h2{font-size:35px}.web-manifesto p{font-size:16px;line-height:1.85}.web-section-title{font-size:clamp(29px,8.1vw,37px);margin-bottom:27px}.web-bento{gap:14px}.web-tile{padding:29px 25px;border-radius:22px}.web-tile h3{font-size:27px}.web-tile p{font-size:14px}.visitor-journey{margin-top:27px}.visitor-journey li{display:block;padding-block:11px}.visitor-journey li>span{font-size:17px}.visitor-journey small{font-size:12px}.content-editor{margin-top:23px}.editor-input input{font-size:12px}.edited-preview p{font-size:24px;min-height:0}.speed-steps{margin-top:27px}.speed-steps li{font-size:13px}.search-example{padding:20px}.web-section-copy{font-size:15px;margin-top:-4px}.solution-deck.is-ready .solution-card{padding:25px;border-radius:22px}.solution-card h3{font-size:25px}.solution-body p{font-size:14px}.solution-body li{font-size:13px}.web-seo-section{padding-top:49px;gap:32px}.seo-foundation h2{font-size:34px}.seo-foundation p{font-size:15px}.seo-practices{grid-template-columns:1fr;gap:26px}.seo-practices h3{font-size:21px}.seo-practices p{font-size:14px}.web-faq .web-section-title{margin-bottom:26px}.web-faq .faq-list summary{font-size:15px;line-height:1.7;gap:20px;min-height:77px}.web-faq .faq-list p{font-size:14px}.web-faq .faq-list .disclosure-inner{padding-top:17px;padding-bottom:24px}.web-final-cta{padding:31px 25px;border-radius:22px;gap:27px;margin-bottom:20px}.web-final-cta h2{font-size:clamp(27px,7.6vw,34px)}.web-final-cta p{font-size:14px;margin-top:21px}.web-final-actions{gap:18px}.web-final-actions .button{min-height:52px;font-size:13px}}
@media(max-width:359px){.web-hero h1{font-size:clamp(32px,10.2vw,36px)}.device-controls button{padding-inline:6px;font-size:11px;gap:5px}.preview-stage{height:417px}.web-tile{padding:27px 22px}.web-tile h3{font-size:25px}.solution-card h3{font-size:23px}.web-final-cta{padding:28px 23px}.web-final-actions .text-link{font-size:12px}}
@media(prefers-reduced-motion:reduce){.web-page [data-web-reveal],.web-motion-ready .visitor-journey li,.web-motion-ready .speed-steps li{opacity:1!important;transform:none!important}.web-motion-ready .visitor-journey::before{transform:none}.web-page .web-hero-copy,.web-page .web-preview{animation:none}.web-page .live-browser{transition:none}.web-tile:hover,.web-page.web-motion-ready .web-tile.is-in-view:hover{transform:none}}

/* Balanced FAQ, complete service cards and a stronger SEO symbol. */
.web-faq-heading{position:sticky;top:120px}
.web-faq-heading>p{font-size:15px;line-height:1.9;color:var(--muted);max-width:330px;margin-top:24px}
.seo-emblem{display:grid;place-items:center;width:54px;height:54px;border:1px solid #efdbca;border-radius:17px;background:#fff0e4;margin-bottom:24px;transform:rotate(-6deg);transition:transform .45s cubic-bezier(.22,1,.36,1)}
.seo-emblem .icon{width:28px;height:28px;color:var(--accent-text);transform:rotate(6deg);transition:transform .45s cubic-bezier(.22,1,.36,1)}
.seo-foundation:hover .seo-emblem{transform:rotate(0deg)}
.seo-foundation:hover .seo-emblem .icon{transform:rotate(0deg) scale(1.08)}
.solution-card{border:1px solid transparent}
.solution-card.is-active{border-color:#d4c2b4}
.solution-card h3 button[aria-pressed="true"]>.icon{transform:translate(3px,-3px)}
@media(max-width:950px){.web-faq{grid-template-columns:1fr;gap:29px}.web-faq-heading{position:static}.web-faq .web-section-title{margin-bottom:0}.web-faq-heading>p{max-width:520px;margin-top:19px}}
@media(max-width:600px){.web-faq .web-section-title{font-size:32px}.web-faq-heading>p{font-size:14px;margin-top:19px}.seo-emblem{width:50px;height:50px;border-radius:16px}.seo-emblem .icon{width:26px;height:26px}}
@media(prefers-reduced-motion:reduce){.seo-emblem,.seo-emblem .icon,.seo-foundation:hover .seo-emblem,.seo-foundation:hover .seo-emblem .icon{transform:none}}
