/*
Theme Name: Tom Schuller Photography
Description: Approved Tom Schuller designs with preserved classic WordPress posts.
Author: Die Marketing Nerds
Version: 0.1.0
Template: blocksy
Text Domain: tom-schuller
Requires at least: 6.3
Requires PHP: 8.0
*/
body.ts-site{margin:0;background:#faf8f1;color:#1a1510;font-family:Manrope,sans-serif}body.ts-site a{color:inherit;text-decoration:none}body.ts-site a:visited{color:inherit}body.ts-site h1,body.ts-site h2,body.ts-site h3{font-family:Caslon,serif;font-weight:400;color:inherit}body.ts-site a:focus-visible,body.ts-site button:focus-visible{outline:2px solid #d8c089;outline-offset:5px}body.ts-site blockquote{border:0;box-shadow:none}body.ts-site blockquote:before,body.ts-site blockquote:after{content:none}body.ts-site .ts-post-content a:not(.gallery-link){text-decoration:underline;text-decoration-color:#d8c089;text-underline-offset:5px}body.ts-site .ts-post-content a:not(.gallery-link):hover{color:#1a1510;text-decoration-thickness:2px}
.ts-post-content{margin:90px auto;width:100%}.ts-post-content>p,.ts-post-content>h2,.ts-post-content>h3,.ts-post-content>ul,.ts-post-content>ol,.ts-post-content>div:not(.gallery-row){width:calc(100% - 160px);max-width:750px;margin:0 auto 26px}.ts-post-content p{font-size:18px;line-height:1.75}.ts-post-content>h2{font-size:48px}.ts-post-content>h3{font-size:36px}.ts-post-content>.gallery-row{width:calc(100% - 160px);max-width:1280px;margin:45px auto}.ts-post-content>.gallery-row--portrait{max-width:742px}.ts-post-content>.gallery-row--pair{max-width:1280px}.ts-post-content .gallery-row p{margin:0;width:100%;max-width:none}.ts-post-content .gallery-row img{display:block;width:100%;height:auto;margin:0}.ts-post-content blockquote{background:#1a1510;color:#faf8f1;padding:85px max(8%,calc((100vw - 1090px)/2));margin:65px 0;font:400 48px/1.16 Caslon,serif}.ts-post-content blockquote p{font:inherit;color:inherit;margin-bottom:25px}.ts-post-content blockquote p:first-child,.ts-post-content blockquote p:last-child{font-family:Caveat,cursive;color:#d8c089;font-size:34px}.ts-post-content blockquote p:last-child{margin-bottom:0}.ts-generic{padding-block:55px 85px}.ts-generic>h1{font-size:clamp(42px,6vw,90px);line-height:1.05}.ts-generic .ts-post-content{margin-block:45px}.ts-generic .ts-post-content>p{width:100%;margin-left:0}.ts-generic img{height:auto;max-width:100%}.ts-post-meta{font-size:15px;line-height:1.5;margin-top:30px}.ts-no-results{padding-block:60px}.ts-pagination .page-numbers{padding:8px}.ts-pagination .current{border-bottom:1px solid #d8c089}
.ts-fluent-letter{font:16px/1.7 Manrope,sans-serif;color:#1a1510}.ts-fluent-letter .ff-el-group{margin-bottom:28px}.ts-fluent-letter .ff-el-input--label label{font:17px/1.5 Caslon,serif;color:#1a1510}.ts-fluent-letter .ff-el-form-control{font:16px/1.6 Manrope,sans-serif!important;border:0!important;border-bottom:1px solid #c9bfae!important;border-radius:0!important;background:transparent!important;color:#1a1510!important;box-shadow:none!important;padding:12px 0!important}.ts-fluent-letter textarea.ff-el-form-control{min-height:150px}.ts-fluent-letter input:focus,.ts-fluent-letter textarea:focus,.ts-fluent-letter select:focus{outline:2px solid #d8c089!important;outline-offset:4px}.ts-fluent-letter .ff-btn-submit{border:1px solid #30251f!important;border-radius:0!important;padding:16px 30px!important;background:#30251f!important;color:#faf8f1!important;font:24px/1.2 Caslon,serif!important;box-shadow:none!important}.ts-fluent-letter .ff-btn-submit:hover,.ts-fluent-letter .ff-btn-submit:focus-visible{background:transparent!important;color:#30251f!important}.ts-fluent-letter .ff-el-is-error .ff-el-form-control{border-color:#9e2d2d!important}.ts-fluent-letter .ff-el-form-check-label{font-size:15px;color:#1a1510}.ts-fluent-letter .ff-el-form-check input{accent-color:#1a1510}.ts-fluent-letter input[type=file]{max-width:100%}.ts-fluent-letter .ff-message-success{color:#1a1510;border-color:#d8c089;background:#faf8f1}.ts-form-unavailable{font-size:17px;line-height:1.7}.ts-site .ts-fluent-letter a{color:#1a1510;text-decoration:underline;text-decoration-color:#d8c089}.ts-site .ts-fluent-letter a:visited{color:#1a1510}
@media(max-width:1100px){.ts-post-content{margin-block:70px}.ts-post-content>p,.ts-post-content>h2,.ts-post-content>h3,.ts-post-content>ul,.ts-post-content>ol{width:78%}.ts-post-content p{font-size:17px}.ts-post-content>.gallery-row{width:88%;margin-block:32px}.ts-post-content blockquote{font-size:42px;padding:70px 9%}}
@media(max-width:760px){.ts-post-content{margin-block:45px}.ts-post-content>p,.ts-post-content>h2,.ts-post-content>h3,.ts-post-content>ul,.ts-post-content>ol,.ts-post-content>div:not(.gallery-row){width:88%}.ts-post-content p{font-size:16px;line-height:1.7}.ts-post-content>.gallery-row{width:88%;margin-block:22px}.ts-post-content>.gallery-row--portrait{width:77.44%}.ts-post-content .gallery-row--pair p{width:88%;align-self:center}.ts-post-content blockquote{font-size:32px;padding:50px 6%;margin-block:45px}.ts-post-content blockquote p:first-child,.ts-post-content blockquote p:last-child{font-size:30px}}
/* Keep approved light headings on the homepage's dark video/story bands.
   The WordPress heading reset above must not inherit the body ink here. */
body.ts-site.ts-surface-home .video-section h2,
body.ts-site.ts-surface-home .story h2{color:#faf8f1}
/* A quieter shared masthead; keep the logo recognizable without sizing the page around it. */
body.ts-site .site-header{height:112px;padding-block:18px}
body.ts-site .header{height:112px}
body.ts-site .site-header .brand,body.ts-site .header .brand{width:220px}
body.ts-site .site-footer .brand,body.ts-site .footer .brand{width:200px}
/* The photograph follows the viewing window rather than growing with an ultrawide screen. */
@media(min-width:761px){
 body.ts-site.ts-surface-home .hero__photo{height:min(58svh,720px);max-height:none;aspect-ratio:auto;max-width:1920px;margin-inline:auto}
 body.ts-site.ts-surface-home .hero__photo img{object-position:50% 25%}
 body.ts-site.ts-surface-home .hero__photo::after{height:calc(var(--hero-overlap) + 80px);background:linear-gradient(0deg,var(--paper) 0%,oklch(97.8% .009 88 / .96) 65%,transparent 100%);mask-image:linear-gradient(to right,#000 0%,#000 65%,transparent 100%);-webkit-mask-image:linear-gradient(to right,#000 0%,#000 65%,transparent 100%)}
 body.ts-site.ts-surface-home .hero h1{font-size:clamp(64px,6vw,96px)}
}
/* A shallow, eased fade along the whole lower edge leaves no hard photo edge; the deeper left fade still carries the headline. */
@media(min-width:761px){
 body.ts-site.ts-surface-home .hero__photo::before{content:"";position:absolute;z-index:1;left:0;right:0;bottom:0;height:clamp(80px,9vw,140px);background:linear-gradient(0deg,var(--paper) 0%,oklch(97.8% .009 88 / .9) 18%,oklch(97.8% .009 88 / .55) 45%,oklch(97.8% .009 88 / .2) 72%,transparent 100%);pointer-events:none}
}
/* Espresso actions site-wide; hover and focus invert to an outline. On the dark closings of portfolio, wedding, couples and about the action turns paper. */
body.ts-site .button,body.ts-site a.button:visited{background:#30251f;border-color:#30251f;color:#faf8f1;border-radius:3px}
body.ts-site .button:hover,body.ts-site .button:focus-visible{background:transparent;border-color:#30251f;color:#30251f}
body.ts-site.ts-surface-portfolio .closing .button,body.ts-site.ts-surface-wedding .closing .button,body.ts-site.ts-surface-couples .closing .button,body.ts-site.ts-surface-about .closing .button,body.ts-site.ts-surface-portfolio .closing a.button:visited,body.ts-site.ts-surface-wedding .closing a.button:visited,body.ts-site.ts-surface-couples .closing a.button:visited,body.ts-site.ts-surface-about .closing a.button:visited{background:#faf8f1;border-color:#faf8f1;color:#30251f}
body.ts-site.ts-surface-portfolio .closing .button:hover,body.ts-site.ts-surface-wedding .closing .button:hover,body.ts-site.ts-surface-couples .closing .button:hover,body.ts-site.ts-surface-about .closing .button:hover,body.ts-site.ts-surface-portfolio .closing .button:focus-visible,body.ts-site.ts-surface-wedding .closing .button:focus-visible,body.ts-site.ts-surface-couples .closing .button:focus-visible,body.ts-site.ts-surface-about .closing .button:focus-visible{background:transparent;border-color:#faf8f1;color:#faf8f1;outline-color:#faf8f1}
@media(max-width:760px){
 body.ts-site .site-header,body.ts-site .header{height:90px}
 body.ts-site .site-header .brand,body.ts-site .header .brand{width:170px}
 body.ts-site .site-footer .brand,body.ts-site .footer .brand{width:170px}
}

.ts-site .form-privacy{font:13px/1.7 Manrope,sans-serif;color:#514c44;margin-top:28px}.ts-site .form-privacy a{color:#1a1510;text-decoration:underline;text-decoration-color:#d8c089;text-underline-offset:4px}

.ts-site .video-privacy{font:13px/1.65 Manrope,sans-serif;margin-top:18px;max-width:65ch;color:#514c44}.ts-site .video-privacy a{color:inherit;text-decoration:underline;text-decoration-color:#d8c089;text-underline-offset:4px}.ts-site .video-section .video-privacy{color:#faf8f1}.ts-site .video-section .video-privacy a:visited{color:#faf8f1}
body.ts-site.ts-surface-contact .ink h2{color:#faf8f1}

/* Video consent note sits small inside the overlay and disappears with it once the player loads. */
.ts-site .video-stage .video-privacy{position:absolute;z-index:2;left:18px;bottom:14px;margin:0;max-width:min(62%,52ch);font:12px/1.5 Manrope,sans-serif;color:#faf8f1;text-shadow:0 1px 6px rgb(0 0 0 / .6);pointer-events:auto}
.ts-site .video-stage .video-privacy a,.ts-site .video-stage .video-privacy a:visited{color:#faf8f1;text-decoration-color:#faf8f1}
.ts-site .video-stage .video-privacy a:hover,.ts-site .video-stage .video-privacy a:focus-visible{color:#faf8f1;text-decoration-color:#d8c089;outline-color:#faf8f1}
@media(max-width:760px){.ts-site .video-stage .video-privacy{left:12px;bottom:10px;max-width:calc(100% - 24px);font-size:11px;line-height:1.4}}

/* Signed motto with a hand-drawn arrow from the words to Tom in the photographs. */
.ts-site .about__visual .personal-quote{position:relative;max-width:100%;margin-top:80px}
.ts-site .personal-quote blockquote p{white-space:nowrap}
.ts-site .personal-quote__arrow{position:absolute;z-index:2;left:-84px;top:-76px;width:90px;height:72px;overflow:visible;pointer-events:none}
.ts-site .personal-quote__arrow path{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0}
.ts-site .personal-quote__arrow.is-pending path{stroke-dashoffset:1}
.ts-site .personal-quote__arrow.is-drawn path{stroke-dashoffset:0;transition:stroke-dashoffset .9s cubic-bezier(.65,0,.35,1)}
.ts-site .personal-quote__arrow.is-drawn path+path{transition-duration:.3s;transition-delay:.85s}
/* When the photo column gets narrow, the arrow flips so its tip still lands under the photographs. */
.ts-site .about__visual{container-type:inline-size}
@container (max-width:500px){.ts-site .personal-quote__arrow{left:4px;transform:scaleX(-1)}}
@media(max-width:760px){.ts-site .about__visual .personal-quote{margin-top:62px}.ts-site .personal-quote blockquote p{font-size:clamp(20px,6.6vw,27px)}.ts-site .personal-quote__arrow{left:4px;top:-58px;width:66px;height:53px;transform:scaleX(-1)}}

/* The menu action is a button, not a text link: no hover underline in any header. */
body.ts-site .nav a.button:hover,body.ts-site .nav a.button:focus-visible,body.ts-site .navigation a.button:hover,body.ts-site .navigation a.button:focus-visible{text-decoration:none}
/* While the menu is open, page and footer softly blur under a light tint; header and menu stay sharp above it. */
body.ts-site>:is(main,footer){transition:filter .2s ease-out}
body.ts-site:has(.menu-toggle[aria-expanded="true"])>:is(main,footer){filter:blur(6px)}
body.ts-site:has(.menu-toggle[aria-expanded="true"])::after{content:"";position:fixed;inset:0;z-index:35;background:rgb(26 21 16 / .16);animation:ts-menu-scrim .2s ease-out}
/* Paper behind the header reaches both screen edges through offset shadows, which never widen the page. */
body.ts-site:has(.menu-toggle[aria-expanded="true"]) :is(.header,.site-header){z-index:40;background:#faf8f1;box-shadow:-50vw 0 0 #faf8f1,50vw 0 0 #faf8f1}
@keyframes ts-menu-scrim{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){body.ts-site>:is(main,footer){transition:none}body.ts-site:has(.menu-toggle[aria-expanded="true"])::after{animation:none}}