/* WebAdım brand harmony / live case study / mobile polish — 09 Oct 2026 */
:root{--brand-navy:#152436;--brand-stone:#e9dac7;--brand-warm:#b7956c}
.brand-logo{object-fit:cover;flex-shrink:0}
.live-work{position:relative;margin-top:22px;display:grid;grid-template-columns:.86fr 1.14fr;align-items:stretch;overflow:hidden;border:1px solid #e4dfd7;background:#fff;border-radius:24px;box-shadow:0 19px 55px #17263813}
.live-work-visual{position:relative;isolation:isolate;min-height:295px;overflow:hidden;background:radial-gradient(circle at 27% 20%,#fff9ef 0%,transparent 44%),linear-gradient(125deg,#f3ded9,#e8d4c6 48%,#cab7a6);display:flex;flex-direction:column;justify-content:space-between;padding:22px;color:#6d4e4a}
.live-work-visual:before,.live-work-visual:after{content:"";position:absolute;border-radius:50%;border:1px solid #fff8;pointer-events:none;z-index:-1}
.live-work-visual:before{width:285px;height:285px;right:-120px;top:-134px}.live-work-visual:after{width:240px;height:240px;left:-115px;bottom:-145px}
.live-work-visual-top{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:750;letter-spacing:.19em;text-transform:uppercase}
.live-work-visual-top span:last-child{font-size:21px;color:#fffaf3}
.live-work-illustration{position:absolute;inset:35px 0 23px;display:grid;place-items:center;pointer-events:none}
.live-work-globe{position:relative;width:165px;height:165px;margin-top:19px;border-radius:50%;border:3px solid #fffaf1bb;background:radial-gradient(circle at 25% 18%,#ffffffc0,transparent 35%),linear-gradient(135deg,#ffffff70,#f8eee840 62%,#ffffffc0);box-shadow:inset -14px -13px 32px #a5827730,0 30px 40px #6b4c4930}
.live-work-globe:after{content:"";position:absolute;bottom:-12px;left:calc(50% - 39px);width:78px;height:18px;border-radius:50%;background:linear-gradient(#b78d72,#8f6d60);box-shadow:0 6px 10px #7b5e5530}
.live-work-stem{position:absolute;width:3px;height:66px;background:#61775e;left:calc(50% - 1px);bottom:23px;transform:rotate(9deg)}
.live-work-flower{position:absolute;left:calc(50% - 24px);top:35px;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;font:48px/1 Georgia,serif;color:#b66672;text-shadow:1px 4px 6px #ffffff80}
.live-work-visual-bottom{position:relative;z-index:2;display:flex;justify-content:space-between;gap:8px;align-items:end;font-size:10px;font-weight:750;letter-spacing:.15em;text-transform:uppercase}
.live-work-visual-bottom span:last-child{font-size:10px;letter-spacing:.08em;text-transform:none}
.live-work-content{position:relative;padding:34px 36px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:16px}
.live-work-kicker{display:inline-flex;align-items:center;gap:8px;color:#4e6744;font-size:10px;letter-spacing:.12em;font-weight:800;text-transform:uppercase}
.live-work-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#699562;box-shadow:0 0 0 4px #eaf2e4}
.live-work-content h3{font-size:clamp(29px,3.2vw,41px);line-height:1.12;letter-spacing:-.06em;margin:0;color:var(--ink)}
.live-work-content p{font-size:14px;line-height:1.77;color:#5a6571;margin:0;max-width:510px}
.live-work-tags{display:flex;gap:7px;flex-wrap:wrap}.live-work-tags span{font-size:10px;color:#655e56;padding:7px 10px;border:1px solid #e4dcd0;background:#faf7f2;border-radius:100px}
.live-work-cta{margin-top:3px;min-height:46px;background:var(--brand-navy);color:#fff}
.live-work-cta:hover{background:#273f55}
.about-page{background:#fbfaf8}
.about-page .nav{background:#fffefded;border-bottom:1px solid #e8e2db}
.about-page .brand-logo{width:46px;height:46px;border-radius:11px;box-shadow:0 4px 11px #15243620}
.about-page .brand{font-size:24px;gap:12px;color:#172638}
.about-page .brand small{color:#647283;letter-spacing:.12em;font-size:8px;margin-top:4px}
.about-page .founder{background:linear-gradient(140deg,#1c3147,#111e2d);border:1px solid #283f54}
.about-page .founder-mark{display:block;background:transparent;padding:0;border-radius:17px;width:68px;height:68px;box-shadow:none}
.about-page .founder-mark img{display:block;width:68px;height:68px;border-radius:17px}
.about-page .founder .eyebrow{color:#ead6b8!important}
.about-page .button.lime{background:#ead8c0;color:#172638}
.about-page .eyebrow{color:#92734c}
.about-page .eyebrow:before{background:#ba9e77}
.about-page .about-copy p{line-height:1.87;margin-bottom:18px;color:#586779}
@media(max-width:780px){
 .live-work{grid-template-columns:1fr;border-radius:20px;margin-top:18px}
 .live-work-visual{min-height:236px;padding:18px 20px}
 .live-work-illustration{inset:15px 0 12px}
 .live-work-globe{width:132px;height:132px;margin-top:13px}
 .live-work-stem{height:52px;bottom:18px}
 .live-work-flower{width:48px;height:48px;left:calc(50% - 20px);top:25px;font-size:39px}
 .live-work-content{padding:25px 23px 26px;gap:13px}
 .live-work-content h3{font-size:31px}
 .live-work-content p{font-size:13px;line-height:1.7}
 .live-work-cta{width:100%;justify-content:space-between;padding-inline:19px}
 .live-work-tags{gap:6px}
 .live-work-tags span{font-size:9px}
 .about-page .nav{height:68px}
 .about-page .brand-logo{width:40px;height:40px}
 .about-page .brand{font-size:21px}
 .about-page .founder{padding:25px}
}
@media(max-width:360px){.live-work-visual{min-height:205px}.live-work-content{padding:21px 18px}.live-work-tags span{padding:5px 8px}.about-page .brand small{font-size:7px}}
@media(prefers-reduced-motion:reduce){.live-work-cta{transition:none}}