/*
Theme Name: Vow & Vale
Author: Growyoo
Description: Fictional Wedding 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: vow-and-vale
*/
:root{--paper:#F4EFE7;--ink:#35242B;--accent:#D9B9A1;--muted:#6A5660;--line:#35242B44;--surface:#F4EFE7}
@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:28px "Studio Serif";letter-spacing:.02em}.logo small{font:8px "Studio Sans";letter-spacing:.18em}.wedding-hero{position:relative;isolation:isolate;min-height:780px;display:flex;align-items:center;color:#F4EFE7;padding:80px 0 145px}.wedding-cover{position:absolute;inset:0;width:100%;height:100%;z-index:-3;object-position:60% center}.wedding-shadow{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#25161ed9,transparent 90%),linear-gradient(0deg,#25161e99,transparent 70%)}.wedding-copy h1{font-size:clamp(5rem,9.2vw,9.5rem);font-weight:400;max-width:800px}.wedding-copy .lead{font-size:16px;max-width:370px;color:#E9DEDB}.wedding-copy .eyebrow{font-size:9px;letter-spacing:.23em}.wedding-link{display:flex;align-items:center;justify-content:space-between;width:350px;max-width:100%;font-size:9px;letter-spacing:.2em;border-top:1px solid #F4EFE766;padding-top:18px;text-decoration:none;margin-top:35px}.wedding-link b{font:40px "Studio Serif"}.film-mark{position:absolute;right:35px;top:50%;writing-mode:vertical-rl;font-size:8px;letter-spacing:.18em}.hero-rail{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:28px 5.5%;border-top:1px solid #F4EFE755;font-size:11px;background:#35242B44}.hero-rail>span{font-size:8px;letter-spacing:.2em}.wedding-intro{text-align:center;max-width:900px}.wedding-intro .lead{margin:0 auto}.wedding-intro h2 i{font-weight:400;color:#8C626C}.story-zone{background:#35242B;color:#F4EFE7}.chapter-choices{display:grid;grid-template-columns:1fr 1fr;gap:20px}.chapter-choices button{padding:0;background:transparent;border:1px solid #F4EFE755;color:#F4EFE7;text-align:left}.chapter-choices button:first-child{grid-column:1/-1}.chapter-choices img{width:100%;height:205px}.chapter-choices button:first-child img{height:240px}.chapter-choices span{display:flex;justify-content:space-between;align-items:center;font-size:10px;padding:16px}.chapter-choices b{font-size:24px;font-weight:400}.chapter-choices button[aria-pressed=true]{border:2px solid #D9B9A1}.chapter-choices button[aria-pressed=true] b{font-size:0}.chapter-choices button[aria-pressed=true] b::after{content:'✓';font-size:18px}.story-paper{padding:40px;background:#F4EFE7;color:#35242B;transform:rotate(1deg);box-shadow:15px 15px 0 #D9B9A155;min-height:380px}.story-entry{display:flex;align-items:center;gap:18px;border-top:1px solid #35242B33;padding:22px 0}.story-entry>span{font:35px "Studio Serif";color:#8C626C}.story-entry h3{font-size:26px;margin:0;flex:1}.story-entry button{border:1px solid #35242B44;min-width:42px;min-height:48px;background:transparent;font-size:19px}.story-move{display:flex;gap:5px}.timeline-paper{border-left:2px solid #8C626C;padding:32px 35px;background:#EAE2DB}.timeline-step{padding:20px 0;border-bottom:1px solid #35242B33;display:flex;gap:30px}.timeline-step>span{font:31px "Studio Serif";min-width:75px}.timeline-step h3{font-size:27px;margin:0 0 8px}.timeline-step p{font-size:12px;margin:0}.timeline-warning{padding:15px;background:#D9B9A1;font-size:13px;margin-top:20px}.timeline-paper .btn{margin-top:25px}.story-paper .btn{margin-top:20px}@media(max-width:760px){.nav .logo{font-size:25px}.nav .menu{border-radius:50%;width:48px;height:48px;padding:0;font-size:0;border-color:#8C626C}.nav .menu::after{content:'☰';font-size:18px}.nav.ready .navlinks{background:#35242B;color:#F4EFE7;border:0}.wedding-hero{min-height:680px;align-items:flex-end;padding:170px 0 125px}.wedding-cover{object-position:59% center}.wedding-shadow{background:linear-gradient(0deg,#25161ef2,#25161e66 65%,#25161e22)}.wedding-copy h1{font-size:3.65rem;line-height:1.01;margin-bottom:23px;max-width:340px}.wedding-copy .eyebrow{font-size:7px;letter-spacing:.13em;max-width:240px}.wedding-copy .lead{font-size:13px;max-width:285px;line-height:1.7}.wedding-link{margin-top:22px;font-size:8px;width:280px}.film-mark{display:none}.hero-rail{padding:18px 20px;gap:14px;font-size:10px}.hero-rail>span{display:none}.hero-rail a{max-width:48%;min-height:44px;display:flex;align-items:center}.wedding-intro h2{font-size:3rem}.gallery .photo-card:first-child{grid-column:1/-1}.gallery .photo-card:first-child img{height:240px}.gallery .photo-card:last-child{grid-column:auto}.gallery .photo-card:last-child img{height:250px}.chapter-choices{gap:12px}.chapter-choices img{height:180px}.chapter-choices button:first-child img{height:210px}.chapter-choices span{font-size:9px;padding:10px}.story-paper{padding:28px 22px;transform:none;box-shadow:7px 7px 0 #D9B9A155;margin-right:7px}.story-entry{gap:8px}.story-entry>span{font-size:28px}.story-entry h3{font-size:22px}.story-entry button{min-width:35px}.timeline-paper{padding:25px 20px}.timeline-step{gap:18px}.timeline-step>span{font-size:25px;min-width:62px}.timeline-step h3{font-size:24px}}
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}}
body{background:#EDE5D8;color:#302723}.vow-art{background:#151D1C;color:#FAF0DE}.vow-panorama{position:absolute;left:0;top:0;width:77%;height:100%}.vow-panorama::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#101c1c66,transparent 50%,#101c1c99)}.vow-panorama img{object-position:70% center;filter:saturate(.8)}.vow-portrait{position:absolute;right:5%;top:21%;height:62%;width:28%;box-shadow:0 25px 65px #0004}.vow-portrait img{object-position:center 65%}.vow-portrait span{position:absolute;left:0;right:0;bottom:-25px;font-size:7px;letter-spacing:.12em;text-align:right}.vow-title{position:absolute;left:5%;right:3%;bottom:17%;z-index:2}.vow-title h1{font-size:clamp(6rem,13vw,13rem);font-style:italic;white-space:nowrap;text-shadow:0 2px 20px #0003}.vow-title p{margin:28px 0 0;font-size:13px;letter-spacing:.02em}.orbit-link{position:absolute;bottom:5%;right:8%;width:105px;height:105px;display:flex;justify-content:center;align-items:center;gap:6px;border:1px solid #FAF0DE;border-radius:50%;text-decoration:none;font-size:8px;line-height:1.5;letter-spacing:.07em;background:#151D1C66;z-index:3}.orbit-link b{font:38px "Studio Serif";font-weight:400}.vow-manifesto{padding:140px 8vw 120px;display:grid;grid-template-columns:1.2fr 1fr;column-gap:9vw;align-items:center;position:relative}.vow-manifesto>.eyebrow{grid-column:1/-1;letter-spacing:.2em}.vow-manifesto h2{font-size:clamp(5rem,9vw,9rem);line-height:.94}.vow-manifesto h2 i{color:#796951}.vow-manifesto>div img{height:420px;width:70%;margin-left:auto;transform:rotate(3deg)}.vow-manifesto>div p{font-size:13px;max-width:300px;margin:40px 0 0 auto}.vow-work{padding:20px 6vw 100px}.journal-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;margin-bottom:50px}.journal-heading .eyebrow{grid-column:1/-1}.journal-heading h2{font-size:clamp(4rem,6.5vw,7rem)}.journal-heading p{font-size:12px;justify-self:end;text-align:right;line-height:2.2}.vow-work .gallery{grid-template-columns:repeat(12,1fr);gap:80px 30px}.vow-work .photo-card:nth-child(1){grid-column:1/9}.vow-work .photo-card:nth-child(1) img{height:650px}.vow-work .photo-card:nth-child(2){grid-column:8/13;margin-top:100px}.vow-work .photo-card:nth-child(2) img{height:560px}.vow-work .photo-card:nth-child(3){grid-column:1/8;margin-top:-290px}.vow-work .photo-card:nth-child(3) img{height:450px}.vow-work figcaption{border-bottom:1px solid #30272355;padding-bottom:15px}.journal-end{font:italic clamp(3.5rem,6vw,6rem)/1 "Studio Serif";text-align:center;margin:130px auto 30px;max-width:800px}.story-zone{background:#202C28}.story-paper{transform:none;box-shadow:none}.chapter-choices button[aria-pressed=true]{border-color:#C8AD8C}.timeline-paper{background:#DDD1C0}.contact{background:#202C28;color:#F4EFE7}.contact .btn{background:#D9B9A1;color:#302723}@media(max-width:760px){.nav{color:#FAF0DE;background:none}.nav .menu{border:1px solid #FAF0DE}.vow-panorama{width:100%;height:100%}.vow-panorama img{object-position:60% center}.vow-panorama::after{background:linear-gradient(0deg,#101c1cbb,transparent 65%,#101c1c66)}.vow-portrait{top:20%;right:5%;width:43%;height:39%;box-shadow:0 15px 35px #0005;transform:rotate(4deg)}.vow-portrait span{bottom:-22px;font-size:5px}.vow-title{left:5%;right:5%;bottom:22%}.vow-title .eyebrow{max-width:140px;margin-bottom:18px;line-height:1.8}.vow-title h1{font-size:clamp(4rem,16vw,5.4rem);white-space:normal;max-width:320px;line-height:.85}.vow-title p{font-size:11px;max-width:210px;line-height:1.7;margin-top:20px}.orbit-link{right:6%;bottom:7%;width:90px;height:90px;font-size:7px}.art-hero-meta span:last-child{display:none}.vow-manifesto{padding:80px 7vw;display:block}.vow-manifesto h2{font-size:4.8rem;margin:25px 0 40px}.vow-manifesto>div img{width:65%;height:270px}.vow-manifesto>div p{font-size:12px;width:68%;margin:25px 0 0 auto}.vow-work{padding:20px 5vw 70px}.journal-heading{display:block;margin-bottom:25px}.journal-heading h2{font-size:3.4rem}.journal-heading p{text-align:left;font-size:11px}.vow-work .gallery{display:block}.vow-work .photo-card:nth-child(1){margin:0 0 55px}.vow-work .photo-card:nth-child(1) img{height:310px}.vow-work .photo-card:nth-child(2){width:75%;margin:0 0 55px auto}.vow-work .photo-card:nth-child(2) img{height:370px}.vow-work .photo-card:nth-child(3){width:87%;margin:0}.vow-work .photo-card:nth-child(3) img{height:250px}.journal-end{font-size:3rem;margin-top:65px}}
