/* Debbie Ikpe UGC portfolio | Cloudflare Pages-ready static site */
:root{--paper:#f6f2eb;--ink:#24231f;--muted:#716c64;--plum:#56344f;--rose:#d98c82;--lime:#d6df9a;--blue:#9ebbc1;--line:#d9d1c6;--serif:"DM Serif Display",Georgia,serif;--sans:"DM Sans",Arial,sans-serif;--script:"Caveat",cursive;--max:1240px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:92px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit}.section-wrap{width:min(var(--max),calc(100% - 72px));margin-inline:auto}.skip-link{position:absolute;left:-999px;top:10px;background:#fff;padding:12px;z-index:99}.skip-link:focus{left:10px}.page-progress{height:3px;position:fixed;z-index:80;top:0;left:0;width:100%;pointer-events:none}.page-progress span{display:block;width:0;height:100%;background:var(--plum)}.site-header{height:84px;padding:0 max(36px,calc((100vw - var(--max))/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(36,35,31,.1);position:sticky;top:0;z-index:50;background:rgba(246,242,235,.92);backdrop-filter:blur(14px)}.wordmark,.footer-mark{font-family:var(--serif);font-size:25px;letter-spacing:-1px}.wordmark>span:first-child,.footer-mark span{color:var(--rose)}.wordmark-dot{color:var(--plum)!important}.site-nav{display:flex;gap:34px;align-items:center;font-size:13px;font-weight:600}.site-nav a{transition:color .2s}.site-nav a:hover,.footer-bottom a:hover{color:var(--plum)}.nav-contact{border-bottom:1px solid var(--ink);padding-bottom:5px}.menu-toggle{display:none}
.hero{min-height:680px;padding-top:76px;padding-bottom:78px;display:grid;grid-template-columns:1.02fr .98fr;gap:7%;align-items:center;position:relative}.hero-copy{padding:0 0 24px 4%}.handwritten{font-family:var(--script);font-size:25px;color:var(--plum);font-weight:600}.hero-note{margin:0 0 22px;transform:rotate(-3deg);display:inline-block}.hero h1,.about h2,.work-heading h2,.photo-heading h2,.approach-intro h2,.contact-copy h2{font-family:var(--serif);font-weight:400;letter-spacing:-2.8px;line-height:.99;font-size:clamp(52px,6.3vw,88px);margin:0}.hero h1 em,.about h2 em,.work-heading h2 em,.photo-heading h2 em,.approach-intro h2 em,.contact-copy h2 em{font-weight:400;color:var(--plum)}.hero-intro{max-width:490px;font-size:17px;line-height:1.75;margin:28px 0 18px;color:#49463f}.location-line{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:9px}.location-dot{width:7px;height:7px;border-radius:50%;background:#829d77}.hero-actions{display:flex;align-items:center;gap:25px;margin-top:30px}.button{display:inline-flex;align-items:center;gap:20px;padding:15px 21px;font-size:13px;font-weight:700;transition:transform .25s,background .25s}.button:hover{transform:translateY(-3px)}.button-dark{background:var(--ink);color:#fff}.button-dark:hover{background:var(--plum)}.button span{font-size:18px}.text-link,.underlined-link{font-size:12px;font-weight:700;border-bottom:1px solid var(--rose);padding-bottom:5px}.hero-social{display:flex;gap:12px;margin-top:36px;font-size:11px;color:var(--muted)}.hero-visual{height:520px;position:relative;display:flex;align-items:center;justify-content:center}.hero-frame{width:min(100%,420px);height:500px;position:relative;z-index:1;clip-path:polygon(7% 0,95% 2%,100% 94%,4% 100%,0 8%);background:#ddd}.hero-frame:after{content:"";position:absolute;inset:12px;border:1px solid rgba(255,255,255,.8);pointer-events:none;clip-path:polygon(7% 0,95% 2%,100% 94%,4% 100%,0 8%)}.hero-frame img{width:100%;height:100%;object-fit:cover;object-position:center 43%}.hero-stamp{position:absolute;z-index:2;right:-4px;top:75px;border:1px solid var(--plum);color:var(--plum);border-radius:50%;width:91px;height:91px;display:grid;place-content:center;text-align:center;font-size:9px;font-weight:700;line-height:1.5;transform:rotate(12deg);background:var(--paper)}.hero-sparkle{position:absolute;color:var(--rose);z-index:2}.sparkle-one{font-size:46px;left:0;top:76px}.sparkle-two{font-size:28px;right:4px;bottom:65px;color:var(--plum)}.hero-caption{position:absolute;bottom:-7px;left:6%;transform:rotate(-5deg)}.scroll-cue{position:absolute;bottom:28px;left:4%;display:flex;align-items:center;gap:12px;color:var(--muted);font-size:10px}.scroll-cue i{display:block;width:45px;height:1px;background:var(--rose)}
.intro-band{overflow:hidden;background:var(--lime);padding:13px 0;white-space:nowrap}.intro-band p{margin:0;text-align:center;font-size:12px;font-weight:700;letter-spacing:.04em}.intro-band span{color:var(--plum);padding:0 20px}
.section-kicker{display:flex;gap:16px;align-items:center;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.section-kicker span:first-child{color:var(--rose);font-family:var(--serif);font-size:17px}.about{padding-top:112px;padding-bottom:118px}.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:11%;align-items:center;margin-top:52px}.about-photo-wrap{position:relative;width:100%;max-width:390px;padding:0 24px 25px 0}.about-photo-wrap:before{content:"";position:absolute;inset:22px 0 0 22px;background:var(--blue);z-index:0}.about-photo-wrap img{position:relative;z-index:1;width:100%;height:460px;object-fit:cover;object-position:center 30%;display:block}.photo-note{position:absolute;z-index:2;bottom:4px;right:-22px;transform:rotate(-5deg)}.doodle-star{position:absolute;right:-20px;top:14px;color:var(--plum);font-size:45px}.about h2{font-size:clamp(48px,5vw,68px)}.about-copy .lead{font-family:var(--serif);font-size:25px;line-height:1.25;margin:30px 0 15px;max-width:510px}.about-copy>p:not(.lead){color:#5d5851;max-width:520px;font-size:14px;line-height:1.85}.underlined-link{display:inline-block;margin-top:20px}.creator-film{margin-top:105px;background:var(--plum);color:#fff;min-height:310px;padding:55px 8%;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden}.creator-film:after{content:"";position:absolute;width:380px;height:380px;border:1px solid rgba(255,255,255,.2);border-radius:50%;right:16%;top:-120px;box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 58px rgba(255,255,255,.025)}.film-copy,.film-play,.film-decoration{position:relative;z-index:1}.film-label{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#e5c4c1}.film-copy h3{font:400 52px/.95 var(--serif);letter-spacing:-1.5px;margin:14px 0}.film-copy h3 em{color:#e8b5ac}.film-copy p{font-size:13px;color:#e4d9df;max-width:310px}.film-play{border:1px solid rgba(255,255,255,.65);width:120px;height:120px;border-radius:50%;background:transparent;color:white;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer;transition:background .2s,transform .2s}.film-play:hover{background:rgba(255,255,255,.13);transform:scale(1.04)}.film-play span{font-size:23px}.film-play small{font-size:10px}.film-decoration{position:absolute;bottom:24px;right:8%;color:#f0c7be;transform:rotate(-7deg)}
.work-section{background:#ece6dc;padding:105px 0 110px}.work-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin:35px 0 38px}.work-heading h2,.photo-heading h2,.approach-intro h2{font-size:clamp(48px,5.8vw,74px)}.work-heading>p,.photo-heading>p,.approach-intro>p{max-width:360px;font-size:14px;line-height:1.8;color:#625d55;margin:0 2% 5px 0}.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:27px}.filter-chip{background:transparent;border:1px solid #c9c0b4;border-radius:50px;padding:9px 15px;font-size:11px;color:#514c45;cursor:pointer;transition:all .2s}.filter-chip:hover,.filter-chip.is-active{background:var(--ink);border-color:var(--ink);color:white}.video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 20px}.video-card{min-width:0}.video-thumb{display:block;position:relative;width:100%;aspect-ratio:4/5;background:#d7d0c7;overflow:hidden;border:0;padding:0;cursor:pointer;text-align:left}.video-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}.video-thumb:hover img{transform:scale(1.045)}.video-thumb:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.28))}.play-disc{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border:1px solid rgba(255,255,255,.85);border-radius:50%;display:grid;place-items:center;color:white;background:rgba(30,25,28,.22);backdrop-filter:blur(4px);transition:transform .2s,background .2s}.video-thumb:hover .play-disc{transform:translate(-50%,-50%) scale(1.1);background:rgba(86,52,79,.8)}.play-disc span{font-size:17px;margin-left:3px}.video-index{position:absolute;z-index:2;left:15px;bottom:12px;color:white;font-size:10px;letter-spacing:.08em}.video-meta{padding:13px 1px 0;display:flex;justify-content:space-between;gap:10px;align-items:start}.video-meta h3{font:400 22px/1.12 var(--serif);margin:0;letter-spacing:-.3px}.video-category{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:#81786d;text-align:right;max-width:110px}.video-desc{font-size:11px;color:#716a60;line-height:1.55;margin:7px 0 0}.work-footnote{font-size:10px;color:#7d756a;margin:30px 0 0}
.photo-section{padding-top:110px;padding-bottom:120px}.photo-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin:34px 0 42px}.photo-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:70px;gap:14px}.photo-item{position:relative;overflow:hidden;border:0;padding:0;background:#ddd;cursor:zoom-in;grid-column:span 3;grid-row:span 5}.photo-item:nth-child(1){grid-column:span 4;grid-row:span 7}.photo-item:nth-child(2){grid-column:span 3;grid-row:span 5}.photo-item:nth-child(3){grid-column:span 5;grid-row:span 6}.photo-item:nth-child(4){grid-column:span 3;grid-row:span 6}.photo-item:nth-child(5){grid-column:span 3;grid-row:span 5}.photo-item:nth-child(6){grid-column:span 3;grid-row:span 6}.photo-item:nth-child(7){grid-column:span 3;grid-row:span 5}.photo-item:nth-child(8){grid-column:span 3;grid-row:span 6}.photo-item:nth-child(9){grid-column:span 4;grid-row:span 6}.photo-item:nth-child(10){grid-column:span 3;grid-row:span 5}.photo-item:nth-child(11){grid-column:span 3;grid-row:span 5}.photo-item:nth-child(12){grid-column:span 3;grid-row:span 6}.photo-item:nth-child(13){grid-column:span 4;grid-row:span 5}.photo-item:nth-child(14){grid-column:span 3;grid-row:span 6}.photo-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}.photo-item:hover img{transform:scale(1.05)}.photo-item:focus-visible,.video-thumb:focus-visible,.filter-chip:focus-visible,.film-play:focus-visible{outline:3px solid var(--plum);outline-offset:3px}
.approach-section{background:var(--blue);padding:105px 0 100px}.approach-intro{display:flex;justify-content:space-between;align-items:end;gap:30px;margin:35px 0 55px}.approach-intro>p{color:#39484a}.approach-list{border-top:1px solid rgba(36,35,31,.3)}.approach-list article{display:grid;grid-template-columns:90px 1fr 70px;gap:20px;align-items:center;padding:27px 0;border-bottom:1px solid rgba(36,35,31,.3)}.approach-number{font:italic 32px var(--serif);color:var(--plum)}.approach-list h3{font:400 28px var(--serif);margin:0 0 4px}.approach-list p{margin:0;font-size:12px;color:#3e4b4c;max-width:590px}.approach-mark{text-align:right;font-size:30px;color:var(--plum)}.service-line{margin-top:48px;display:grid;grid-template-columns:180px 1fr;gap:20px}.service-line span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:700}.service-line p{margin:0;font-size:13px;max-width:760px}
.contact-section{padding-top:115px;padding-bottom:120px;display:grid;grid-template-columns:.8fr 1.2fr;gap:11%;align-items:center}.contact-art{position:relative;max-width:350px;padding:0 0 20px 20px}.contact-art:before{content:"";position:absolute;left:0;bottom:0;width:85%;height:86%;background:var(--rose)}.contact-art img{position:relative;width:100%;height:420px;object-fit:cover;object-position:center;display:block;filter:saturate(.85)}.contact-doodle{position:absolute;right:-24px;top:-25px;color:var(--plum);font-size:55px}.contact-copy h2{font-size:clamp(58px,6vw,82px);margin:30px 0 20px}.contact-copy>p:not(.contact-small){font-size:14px;color:#615b53;max-width:420px;line-height:1.8}.email-link{display:inline-block;font:400 clamp(19px,2.3vw,27px) var(--serif);border-bottom:1px solid var(--rose);padding:8px 0;margin-top:14px}.email-link span{font:400 16px var(--sans);color:var(--plum);margin-left:12px}.contact-small{font-size:10px;color:#8a8177;margin-top:25px}
.site-footer{background:#282522;color:#f6f2eb;padding:42px max(36px,calc((100vw - var(--max))/2)) 24px}.footer-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.2)}.footer-mark{font-size:31px}.footer-mark span{color:#e8aaa1}.footer-top p{font:italic 19px/1.25 var(--serif);color:#d9cec4;margin:0}.back-top{font-size:11px;border-bottom:1px solid #d9aaa2;padding-bottom:5px}.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:20px;color:#bdb5ac;font-size:10px}.footer-bottom div{display:flex;gap:22px}.footer-bottom .handwritten{color:#e5b4ac;font-size:19px}
.media-dialog,.lightbox{border:0;padding:0;background:#181615;color:white;max-width:min(1000px,94vw);width:100%;max-height:90vh;overflow:visible}.media-dialog::backdrop,.lightbox::backdrop{background:rgba(19,17,17,.88);backdrop-filter:blur(6px)}.dialog-inner{padding:22px}.dialog-inner video{display:block;width:100%;max-height:78vh;background:#000}.dialog-close{position:absolute;right:-15px;top:-17px;width:38px;height:38px;border:0;border-radius:50%;background:var(--paper);color:var(--ink);font-size:26px;line-height:1;cursor:pointer;z-index:3}.lightbox{width:auto;max-width:92vw;background:transparent;display:none;align-items:center;justify-content:center;flex-direction:column}.lightbox[open]{display:flex}.lightbox img{max-width:86vw;max-height:82vh;object-fit:contain}.lightbox-caption{font-size:12px;color:#eee;margin:12px 0}.lightbox-prev,.lightbox-next{position:fixed;top:50%;border:1px solid rgba(255,255,255,.5);background:rgba(30,30,30,.45);color:#fff;width:42px;height:42px;border-radius:50%;font-size:26px;cursor:pointer}.lightbox-prev{left:25px}.lightbox-next{right:25px}
@media(max-width:900px){.section-wrap{width:calc(100% - 48px)}.site-header{padding-inline:24px}.site-nav{gap:20px}.hero{gap:3%;grid-template-columns:1fr .9fr}.hero-frame{height:440px}.hero-visual{height:470px}.hero h1{font-size:clamp(48px,7vw,68px)}.video-grid{grid-template-columns:repeat(2,1fr)}.photo-grid{grid-auto-rows:55px;gap:10px}.photo-item:nth-child(n){grid-column:span 4;grid-row:span 5}.photo-item:nth-child(1),.photo-item:nth-child(3),.photo-item:nth-child(9),.photo-item:nth-child(13){grid-column:span 6;grid-row:span 6}.about-grid{gap:7%}.contact-section{gap:7%}}
@media(max-width:640px){html{scroll-padding-top:72px}.section-wrap{width:calc(100% - 38px)}.site-header{height:70px;padding-inline:19px}.wordmark{font-size:23px}.menu-toggle{display:flex;width:42px;height:42px;border:0;background:transparent;flex-direction:column;justify-content:center;gap:6px;padding:8px}.menu-toggle span{height:1px;background:var(--ink);width:24px}.site-nav{display:none;position:absolute;top:69px;left:0;right:0;background:var(--paper);padding:22px 20px 28px;flex-direction:column;align-items:flex-start;gap:19px;border-bottom:1px solid var(--line)}.site-nav.is-open{display:flex}.hero{display:flex;flex-direction:column;align-items:stretch;padding-top:49px;padding-bottom:72px;gap:28px}.hero-copy{padding:0}.hero-note{font-size:22px;margin-bottom:17px}.hero h1{font-size:clamp(49px,13vw,67px);letter-spacing:-2px}.hero-intro{font-size:15px;margin:21px 0 14px}.hero-actions{gap:17px;margin-top:23px;flex-wrap:wrap}.button{padding:13px 16px}.hero-social{margin-top:25px}.hero-visual{height:390px;margin:0 8px}.hero-frame{height:375px;width:min(82%,340px)}.hero-stamp{right:0;top:28px;width:76px;height:76px;font-size:8px}.sparkle-one{left:0;top:35px;font-size:35px}.sparkle-two{right:2px;bottom:43px}.hero-caption{left:3%;bottom:-5px;font-size:21px}.scroll-cue{left:0;bottom:21px}.intro-band{padding:12px 0}.intro-band p{font-size:10px}.intro-band span{padding:0 9px}.about{padding-top:76px;padding-bottom:80px}.about-grid{display:flex;flex-direction:column;align-items:stretch;gap:43px;margin-top:35px}.about-photo-wrap{max-width:330px;width:90%;margin-left:3%}.about-photo-wrap img{height:390px}.about h2,.work-heading h2,.photo-heading h2,.approach-intro h2{font-size:clamp(46px,11vw,59px);letter-spacing:-1.7px}.about-copy .lead{font-size:23px;margin-top:22px}.about-copy>p:not(.lead){font-size:13px}.creator-film{margin-top:70px;min-height:370px;padding:35px 27px;align-items:flex-start;flex-direction:column;justify-content:center;gap:20px}.film-copy h3{font-size:45px}.film-play{width:86px;height:86px;position:absolute;right:26px;bottom:48px}.film-play small{font-size:8px}.film-decoration{right:25px;bottom:14px;font-size:19px}.work-section{padding:77px 0 78px}.work-heading,.photo-heading,.approach-intro{display:block;margin:30px 0}.work-heading>p,.photo-heading>p,.approach-intro>p{margin-top:18px;font-size:13px}.filter-row{gap:7px;margin-bottom:22px}.filter-chip{font-size:10px;padding:8px 11px}.video-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 12px}.video-thumb{aspect-ratio:3/4}.video-meta{display:block}.video-meta h3{font-size:19px}.video-category{text-align:left;display:block;max-width:none;margin-top:6px;font-size:8px}.video-desc{font-size:10px}.play-disc{width:43px;height:43px}.work-footnote{line-height:1.6}.photo-section{padding-top:78px;padding-bottom:82px}.photo-grid{grid-template-columns:repeat(6,1fr);grid-auto-rows:54px;gap:8px}.photo-item:nth-child(n){grid-column:span 3;grid-row:span 5}.photo-item:nth-child(1),.photo-item:nth-child(4),.photo-item:nth-child(9),.photo-item:nth-child(13){grid-column:span 6;grid-row:span 6}.photo-item:nth-child(3),.photo-item:nth-child(8){grid-column:span 3;grid-row:span 6}.approach-section{padding:77px 0 75px}.approach-intro{margin-bottom:35px}.approach-list article{grid-template-columns:48px 1fr 28px;gap:10px;padding:22px 0}.approach-number{font-size:26px}.approach-list h3{font-size:23px}.approach-list p{font-size:11px;line-height:1.6}.approach-mark{font-size:22px}.service-line{grid-template-columns:1fr;gap:9px;margin-top:35px}.service-line p{font-size:12px;line-height:1.8}.contact-section{padding-top:78px;padding-bottom:80px;display:flex;flex-direction:column;align-items:stretch;gap:43px}.contact-art{width:82%;max-width:300px;margin-left:7%}.contact-art img{height:360px}.contact-copy h2{font-size:65px;margin:25px 0 16px}.contact-copy>p:not(.contact-small){font-size:13px}.email-link{font-size:21px;overflow-wrap:anywhere}.site-footer{padding:33px 19px 20px}.footer-top{align-items:flex-start;gap:18px;flex-wrap:wrap;padding-bottom:27px}.footer-mark{font-size:26px}.footer-top p{font-size:16px}.back-top{margin-left:auto;align-self:center}.footer-bottom{flex-wrap:wrap;gap:15px}.footer-bottom div{order:3;width:100%;gap:20px}.footer-bottom .handwritten{font-size:17px}.dialog-inner{padding:10px}.dialog-close{right:-6px;top:-42px}.lightbox-prev{left:8px}.lightbox-next{right:8px}.lightbox-prev,.lightbox-next{width:35px;height:35px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
