/*
Theme Name: FORM / STILL
Author: Growyoo
Description: Fictional Commercial / Product Photographer design with two interactive portfolio tools.
Version: 2.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: form-still
*/
:root{--paper:#E7E6E0;--ink:#111211;--accent:#D0E86A;--muted:#585D54;--line:#11121144;--surface:#E7E6E0}
@font-face{font-family:Studio Sans;src:url(assets/sans.ttf);font-display:swap}@font-face{font-family:Studio Serif;src:url(assets/serif.ttf);font-display:swap}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 "Studio Sans",Arial,sans-serif}img,svg{display:block;max-width:100%}img{object-fit:cover}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button,a,input,select{touch-action:manipulation}button:disabled{opacity:.4;cursor:default}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px}h1,h2,h3,p{margin-top:0}h1,h2,h3{overflow-wrap:break-word}h1{font:400 clamp(4rem,7.5vw,8rem)/.95 "Studio Serif";letter-spacing:-.045em;margin-bottom:28px}h2{font:400 clamp(3rem,5vw,5.2rem)/1.02 "Studio Serif";letter-spacing:-.04em;margin-bottom:25px}h3{font:400 28px/1.12 "Studio Serif";margin-bottom:14px}p{margin-bottom:24px}.wrap{max-width:1280px;width:calc(100% - 80px);margin:auto}.demo{font-size:11px;background:var(--ink);color:var(--paper);padding:8px 20px;text-align:center}.demo strong{letter-spacing:.1em;margin-right:10px}.demo a{margin-left:12px}.skip{position:fixed;top:-100px;left:15px;z-index:100;padding:15px;background:var(--ink);color:var(--paper)}.skip:focus{top:10px}.nav{position:sticky;top:0;z-index:30;background:var(--paper);border-bottom:1px solid var(--line)}.nav>.wrap{display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:88px}.logo{text-decoration:none;font-size:26px;letter-spacing:-.055em;line-height:1.1}.logo small{display:block;font-size:8px;letter-spacing:.14em;text-transform:uppercase;margin-top:6px}.navlinks{display:flex;gap:28px;align-items:center}.navlinks a{text-decoration:none;font-size:12px;min-height:48px;display:flex;align-items:center}.menu{display:none;min-height:48px;padding:10px 16px;background:transparent;border:1px solid var(--line)}.btn{display:inline-flex;min-height:50px;align-items:center;justify-content:center;padding:13px 22px;border:1px solid var(--ink);background:var(--ink);color:var(--paper);text-decoration:none;font-size:13px;font-weight:600;text-align:center}.btn.secondary{background:transparent;color:var(--ink)}.actions{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-top:30px}.eyebrow{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:20px}.lead{font-size:19px;line-height:1.6;max-width:520px}.note{font-size:12px;color:var(--muted);line-height:1.7}.section{padding:95px 0}.split{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:start}.split>*,.cards>*,.hero-grid>*{min-width:0}.feature-head{max-width:760px;margin-bottom:40px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}.card{border-top:1px solid var(--line);padding:25px 0}.card>span{font-size:12px}.card h3{margin-top:25px}.pills{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}.pills button{min-height:48px;padding:11px 16px;border:1px solid var(--line);background:transparent}.pills button[aria-pressed=true]{background:var(--ink);color:var(--paper)}label{display:block;font-size:14px;font-weight:600;margin:20px 0 10px}select,input[type=time],input[type=date]{width:100%;min-height:48px;border:1px solid var(--line);background:var(--paper);padding:12px;display:block;margin-top:8px;min-width:0;max-width:100%}input[type=range]{display:block;width:100%;accent-color:var(--ink);min-height:36px;margin-top:12px}.panel{padding:35px;border:1px solid var(--line);background:var(--surface)}.row{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid var(--line)}.row b,.row small{display:block}.row small{font-size:11px;color:var(--muted);margin-top:5px}.row p{margin:0}.result{margin-top:25px}.result h3{font-size:26px}.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.photo-card{margin:0;position:relative;min-width:0}.photo-card button{display:block;width:100%;border:0;background:transparent;padding:0;text-align:left;color:inherit}.photo-card img{width:100%;height:340px;transition:transform .3s}.photo-card button:hover img{transform:scale(.98)}.photo-card figcaption{font-size:11px;display:flex;justify-content:space-between;padding-top:14px;gap:12px}.photo-card figcaption strong{font-weight:400}.faq details{border-bottom:1px solid var(--line);padding:20px 0}.faq summary{font-size:18px;min-height:44px;cursor:pointer}.faq details p{max-width:760px;margin:20px 0}.contact{padding:65px 0;background:var(--accent);color:var(--ink)}.contact .wrap{display:flex;align-items:center;justify-content:space-between;gap:30px}.contact h2{max-width:730px;margin:0}.footer{padding:45px 0}.footer .wrap{display:flex;justify-content:space-between;gap:50px}.footer p{max-width:620px;font-size:11px;color:var(--muted);margin:0}.status{font-size:12px;min-height:24px;margin-top:16px}.asset-bank{display:none}dialog{background:#111;color:#fff;border:1px solid #fff4;max-width:96vw;width:1050px;padding:20px}dialog::backdrop{background:#000d}dialog img{width:100%;max-height:70vh;object-fit:contain}dialog .dialog-actions{display:flex;justify-content:space-between;gap:10px;margin-top:20px}dialog button{min-height:48px;border:1px solid #fff8;background:transparent;color:white;padding:10px 20px}dialog p{font-size:12px;margin:0}.site-content{max-width:780px;padding:70px 0}.site-content img{height:auto}button[hidden],[hidden]{display:none!important}@media(max-width:950px){.wrap{width:calc(100% - 48px)}.nav>.wrap>.btn{display:none}.navlinks{gap:20px}.split{gap:35px}}@media(max-width:760px){.wrap{width:calc(100% - 40px)}.demo{font-size:9px;padding:7px 10px}.demo a{margin-left:7px}.nav>.wrap{min-height:66px}.nav .logo{font-size:22px}.navlinks{flex-wrap:wrap}.nav.ready .menu{display:block}.nav.ready .navlinks{display:none;position:absolute;left:20px;right:20px;top:calc(100% + 6px);padding:22px;background:var(--paper);border:1px solid var(--line);box-shadow:0 12px 30px #0002;flex-direction:column;align-items:stretch;max-height:70vh;overflow:auto}.nav.ready.open .navlinks{display:flex}.section{padding:60px 0}.split,.cards{grid-template-columns:1fr}.panel{padding:25px}h1{font-size:3.4rem}h2{font-size:2.7rem}.lead{font-size:16px}.gallery{grid-template-columns:1fr 1fr;gap:12px}.photo-card img{height:250px}.photo-card figcaption{font-size:9px}.photo-card:last-child{grid-column:1/-1}.photo-card:last-child img{height:270px}.contact .wrap,.footer .wrap{display:block}.contact .btn{margin-top:25px}.footer .logo{display:inline-block;margin-bottom:24px}.row{flex-wrap:wrap;gap:10px}.feature-head{margin-bottom:28px}.pills button{padding:10px 13px}dialog{padding:12px}dialog .dialog-actions button{padding:10px 14px;font-size:12px}}@media(max-width:360px){.wrap{width:calc(100% - 32px)}.panel{padding:20px}.btn{max-width:100%}h2{font-size:2.4rem}.nav .logo{font-size:20px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
.logo{font-weight:700;letter-spacing:-.07em;font-size:28px}.logo small{letter-spacing:.16em}.btn{background:#D0E86A;color:#171917;border-color:#171917}.nav{border-bottom:2px solid #171917}.studio-hero{padding:35px 0 0;background:#EAEAE4;overflow:clip}.studio-topline,.studio-bottomline{display:flex;justify-content:space-between;font-size:9px;letter-spacing:.15em;gap:20px}.studio-topline{border-bottom:1px solid #171917;padding-bottom:22px}.studio-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:45px 0}.studio-heading h1{font:600 clamp(5rem,7.7vw,8.4rem)/.87 "Studio Sans";letter-spacing:-.08em;max-width:680px}.studio-heading .eyebrow{font-size:8px}.studio-heading .lead{font-size:16px;max-width:420px;line-height:1.65}.object-stage{position:relative;padding:30px 30px 25px;background:#D0E86A;isolation:isolate}.hero-object{width:100%;height:480px;object-position:center 60%}.object-number{position:absolute;font:600 190px/.8 "Studio Sans";letter-spacing:-.1em;right:-18px;top:-20px;z-index:2;mix-blend-mode:multiply;pointer-events:none}.object-caption{display:flex;justify-content:space-between;gap:20px;padding-top:25px;font-size:8px;letter-spacing:.06em}.object-caption b{font-weight:600}.object-caption span{max-width:170px}.object-open{position:absolute;left:10px;top:10px;width:62px;height:62px;border:1px solid #171917;background:#D0E86A;display:grid;place-items:center;text-decoration:none;font-size:32px;z-index:3}.studio-bottomline{padding:25px 0;border-top:1px solid #171917}.studio-approach h2,.crop-zone h2,#matrix h2{font-family:"Studio Sans";font-weight:500;letter-spacing:-.06em}.crop-zone{background:#171917;color:#EAEAE4}.crop-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:70px;align-items:center}.crop-board{padding:25px;border:1px solid #EAEAE455}.crop-frame{position:relative;width:100%;aspect-ratio:1;max-width:520px;max-height:520px;overflow:hidden;background:#D0E86A;margin:auto}.crop-photo{width:100%;height:100%;object-fit:cover;object-position:50% 60%}.crop-safe{position:absolute;inset:8%;border:1px solid #fff7;pointer-events:none}.crop-safe::before,.crop-safe::after{content:'';position:absolute;background:#fff7}.crop-safe::before{width:1px;height:100%;left:50%}.crop-safe::after{height:1px;width:100%;top:50%}.crop-caption{display:flex;justify-content:space-between;font-size:9px;padding-top:20px;letter-spacing:.12em;gap:20px}.crop-control .pills button{color:#EAEAE4;border-color:#EAEAE455}.crop-control .pills button[aria-pressed=true]{background:#D0E86A;color:#171917}.crop-control input{accent-color:#D0E86A}.crop-control .lead{font-size:22px;margin-top:30px}.crop-control .note{color:#B8BEB2}.matrix-channels label{display:flex;align-items:center;gap:15px;border-bottom:1px solid #17191755;padding:18px 0;font-size:13px}.matrix-channels input{width:20px;height:20px;accent-color:#171917;flex-shrink:0}.matrix-panel{background:#D0E86A;border:1px solid #171917;padding:32px}.matrix-head{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid #171917;padding-bottom:25px;font-size:10px;letter-spacing:.06em}.matrix-head b{font-weight:400;font-size:14px}.matrix-head b>span{font:40px "Studio Sans";font-weight:600;letter-spacing:-.05em}.matrix-panel .row{border-color:#17191755}.matrix-panel .row b{font-size:16px}.matrix-panel .btn{background:#171917;color:#D0E86A;margin-top:25px}.matrix-panel small{color:#465423}.contact{background:#171917;color:#EAEAE4}.contact .btn{background:#D0E86A;color:#171917}.contact h2{font-family:"Studio Sans";font-size:3.8rem;font-weight:500}@media(max-width:760px){.nav{background:#171917;color:#EAEAE4}.nav .logo{font-size:23px}.nav .menu{font-size:0;border:1px solid #D0E86A;width:48px;height:48px;padding:0;border-radius:0;color:#D0E86A}.nav .menu::after{content:'☰';font-size:21px}.nav.ready .navlinks{background:#171917;color:#EAEAE4;border-color:#D0E86A;left:0;right:0;top:100%;padding:28px}.navlinks a{border-bottom:1px solid #EAEAE455;padding:14px;font-size:15px}.studio-hero{padding-top:20px}.studio-topline{font-size:7px;padding-bottom:15px}.studio-grid{display:flex;flex-direction:column;gap:0;align-items:stretch;padding:25px 0}.studio-heading{display:contents}.studio-heading .eyebrow{order:0;font-size:7px;margin-bottom:12px}.studio-heading h1{order:1;font-size:3.9rem;line-height:.9;margin-bottom:28px;max-width:340px}.object-stage{order:2;padding:20px 20px 15px;margin-bottom:25px}.hero-object{height:310px;object-position:center 65%}.object-number{font-size:118px;top:-12px;right:-5px}.object-open{width:48px;height:48px;top:10px;left:10px;font-size:25px}.object-caption{font-size:7px;padding-top:14px;gap:12px}.object-caption span{max-width:125px}.studio-heading .lead{order:3;font-size:14px;margin-bottom:20px}.studio-heading .btn{order:4;align-self:start;font-size:12px;padding:12px 20px}.studio-bottomline{font-size:7px;padding:19px 0;gap:10px}.studio-bottomline span:last-child{display:none}.gallery{grid-template-columns:1fr}.photo-card img{height:360px}.photo-card:last-child img{height:300px}.crop-grid{grid-template-columns:1fr;gap:20px}.crop-board{padding:15px}.crop-frame{max-height:420px}.crop-caption{font-size:7px}.crop-control .pills{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.crop-control .pills button{font-size:11px;padding:12px 5px}.crop-control .lead{font-size:19px}.matrix-panel{padding:25px 20px}.matrix-head{flex-wrap:wrap;gap:10px}.contact h2{font-size:2.7rem}}
body{position:relative}.demo{font-size:9px;padding:6px 10px;background:#171917;color:#eee;min-height:27px}.nav{position:absolute;top:27px;left:0;width:100%;background:transparent;color:#fff;border:0}.nav>.wrap{min-height:105px;width:calc(100% - 80px);max-width:none}.nav .logo{font-size:32px}.nav .logo small{font-size:7px}.nav .navlinks{gap:30px}.nav .navlinks a{font-size:11px}.nav>.wrap>.btn{background:none;color:inherit;border-bottom:1px solid currentColor;border-top:0;border-left:0;border-right:0;padding:10px 0}.art-hero{position:relative;isolation:isolate;overflow:hidden;height:calc(100svh - 27px);min-height:760px;max-height:1100px}.art-hero img{width:100%;height:100%;object-fit:cover}.art-hero .eyebrow{font-size:9px;letter-spacing:.18em}.art-hero h1{margin:0;line-height:.84;letter-spacing:-.045em}.art-hero-meta{position:absolute;bottom:28px;left:40px;right:40px;display:flex;justify-content:space-between;gap:20px;font-size:8px;letter-spacing:.16em}.art-work{overflow:hidden}.art-work .gallery{gap:0}.art-work .photo-card button{position:relative;overflow:hidden}.art-work .photo-card img{transition:transform .8s cubic-bezier(.2,.65,.2,1),filter .5s}.art-work .photo-card button:hover img{transform:scale(1.045)}.art-work .photo-card figcaption{font-size:12px;min-height:50px}.tool-divider{padding:28px 5vw;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:10px;letter-spacing:.1em}.tool-divider a{min-height:44px;display:flex;align-items:center}.faq{padding:45px 0!important;max-width:900px}.faq h2{font:400 26px "Studio Sans";letter-spacing:-.03em}.faq summary{font-size:13px}.faq details p{font-size:13px}.contact{padding:100px 0}.contact .wrap{gap:80px}.contact h2{font-size:clamp(3rem,7vw,7rem);line-height:.95}.contact .btn{border-radius:50%;width:150px;height:150px;padding:25px;flex-shrink:0;transform:rotate(-10deg);transition:transform .3s}.contact .btn:hover{transform:rotate(0deg)}dialog{width:100vw;height:100svh;max-width:100vw;max-height:100svh;margin:0;border:0;background:#111;padding:25px;overflow:hidden}dialog img{height:calc(100svh - 125px);max-height:none}dialog .dialog-actions{margin-top:16px}dialog p{position:absolute;bottom:12px;left:25px;color:#ddd}.skip:not(:focus){clip-path:inset(50%);width:1px;height:1px;padding:0;overflow:hidden;top:0}@media(max-width:760px){html{scroll-padding-top:20px}.nav>.wrap{min-height:82px;width:calc(100% - 36px)}.nav .logo{font-size:27px}.nav .logo small{font-size:6px}.nav .menu{color:inherit;border-color:currentColor}.nav.ready .navlinks{top:100%;left:18px;right:18px;background:#151515;color:#fff;border:1px solid #fff4}.nav>.wrap>.btn{display:none}.art-hero{min-height:700px;height:calc(100svh - 27px);max-height:1000px}.art-hero .eyebrow{font-size:7px;letter-spacing:.12em}.art-hero-meta{left:18px;right:18px;bottom:19px;font-size:6px;letter-spacing:.08em}.tool-divider{display:block;padding:20px}.tool-divider a{margin-top:8px}.contact{padding:65px 0}.contact .btn{width:115px;height:115px;margin-top:35px;font-size:12px}dialog{padding:10px}dialog img{height:calc(100svh - 135px)}dialog p{bottom:16px;left:10px;font-size:10px}.art-work .photo-card figcaption{font-size:9px}}
.nav{background:none;border:0;color:#fff}.nav .logo{font-size:29px;letter-spacing:-.065em}.nav .logo small{display:none}.form-art{background:#111211;color:#fff}.campaign-panels{position:absolute;inset:0;display:flex;gap:5px}.campaign-panel{position:relative;width:24%;height:100%;transition:width .8s cubic-bezier(.2,.65,.2,1),filter .8s;filter:brightness(.58) saturate(.65)}.campaign-panel.active{width:52%;filter:brightness(.9) saturate(.95)}.campaign-panel img{object-position:center}.campaign-panel::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0008,transparent 40%,#0009)}.form-title{position:absolute;left:4%;right:4%;top:27%;pointer-events:none}.form-title h1{font:600 clamp(7rem,15.8vw,16rem)/.82 "Studio Sans";letter-spacing:-.06em;color:#fff;max-width:1100px;text-shadow:0 0 45px #0002}.form-title .eyebrow{font-size:8px;letter-spacing:.14em;margin-bottom:25px}.campaign-selector{position:absolute;bottom:19%;right:4%;width:25%;color:#fff}.campaign-selector button{display:flex;align-items:center;justify-content:space-between;gap:15px;background:#111211cc;color:#fff;border:0;border-top:1px solid #fff6;width:100%;min-height:58px;padding:15px;font-size:9px;text-align:left;transition:background .25s,color .25s}.campaign-selector button span{opacity:.6}.campaign-selector button[aria-pressed=true]{background:#D0E86A;color:#111211}.campaign-selector b{font-size:19px;font-weight:400}.form-hero-foot{position:absolute;left:4%;right:4%;bottom:4%;display:flex;align-items:end;justify-content:space-between;gap:30px;border-top:1px solid #fff6;padding-top:22px}.form-hero-foot p{font-size:12px;max-width:260px;margin:0}.form-hero-foot a{font-size:9px;text-decoration:none;min-height:48px;display:flex;align-items:center;gap:25px}.form-hero-foot a b{font-size:30px;font-weight:400}.form-hero-foot>span{font-size:8px;letter-spacing:.15em;line-height:1.8;text-align:right}.form-manifesto{padding:120px 6vw;background:#111211;color:#E7E6E0}.form-manifesto h2{font:600 clamp(4.5rem,10vw,11rem)/.92 "Studio Sans";letter-spacing:-.07em;margin:40px 0}.form-manifesto h2 span{color:#D0E86A}.form-manifesto p{max-width:360px;font-size:14px;margin-left:54%;margin-bottom:0}.form-work{background:#111211;color:#E7E6E0;padding:0 0 80px}.campaign-heading{padding:28px 4vw;display:flex;justify-content:space-between;font-size:8px;letter-spacing:.12em;border-top:1px solid #ffffff44}.form-work .gallery{display:block}.form-work .photo-card{position:relative}.form-work .photo-card button{display:block;width:100%;border-top:1px solid #fff4}.form-work .photo-card img{height:750px;width:100%;object-position:50% 50%}.form-work .photo-card:nth-child(2){width:80%;margin:100px 0 100px auto}.form-work .photo-card:nth-child(2) img{height:650px}.form-work .photo-card:nth-child(3){width:80%;margin:0 auto 0 0}.form-work .photo-card:nth-child(3) img{height:620px}.form-work .photo-card figcaption{position:absolute;left:5%;right:5%;bottom:6%;color:#fff;padding:18px;border-top:1px solid #fff8;background:#11121188;font:500 clamp(2rem,4.5vw,5rem)/1 "Studio Sans";letter-spacing:-.06em;align-items:center}.form-work .photo-card figcaption span{font:12px "Studio Sans";letter-spacing:0}.form-work .photo-card:nth-child(3) figcaption{color:#111211;background:#E7E6E099;border-color:#11121166}.tool-divider{background:#D0E86A;color:#111211}.crop-zone{background:#252623}.contact{background:#111211;color:#E7E6E0}.contact h2{font-size:clamp(4rem,7.5vw,8rem)}@media(max-width:760px){.nav{background:none;color:#fff}.nav .menu{background:#11121199;color:#D0E86A;border:1px solid #D0E86A}.form-art{min-height:760px}.campaign-panels{gap:3px}.campaign-panel{width:12%}.campaign-panel.active{width:76%}.form-title{top:23%;left:5%;right:5%}.form-title .eyebrow{font-size:6px;max-width:220px;line-height:1.8}.form-title h1{font-size:clamp(5rem,21vw,6rem);line-height:.87;letter-spacing:-.06em;max-width:350px}.campaign-selector{bottom:16%;left:5%;right:5%;width:auto}.campaign-selector button{min-height:45px;font-size:8px;padding:9px 12px}.form-hero-foot{left:5%;right:5%;bottom:3%;gap:20px;padding-top:14px;align-items:center}.form-hero-foot p{font-size:9px;width:55%;max-width:180px}.form-hero-foot a{font-size:6px;gap:7px;max-width:40%}.form-hero-foot a b{font-size:22px}.form-hero-foot>span{display:none}.form-manifesto{padding:70px 6vw}.form-manifesto .eyebrow{font-size:8px}.form-manifesto h2{font-size:3.7rem;margin:30px 0}.form-manifesto p{margin-left:15%;font-size:12px}.campaign-heading{font-size:6px;padding:20px 5vw;gap:15px}.form-work .photo-card:nth-child(1) img{height:500px}.form-work .photo-card:nth-child(2){width:91%;margin:55px 0 55px auto}.form-work .photo-card:nth-child(2) img{height:420px}.form-work .photo-card:nth-child(3){width:91%;margin:0 auto 0 0}.form-work .photo-card:nth-child(3) img{height:360px}.form-work .photo-card figcaption{font-size:1.8rem;padding:12px}.form-work .photo-card figcaption span{font-size:8px}.form-work{padding-bottom:55px}.contact h2{font-size:3.7rem}}