/* Seren O'Toole — contemporary studio direction / Oct 2026
   Neutral canvas, clear typography and restrained blue from the existing signature.
   The images are the colour; there are no tinted cards or large coloured panels.
*/
:root{--paper:#f7f8f6;--paper-light:#f7f8f6;--blue-paper:#f7f8f6;--blue-soft:#f7f8f6;--blue:#3e6698;--blue-dark:#3e6698;--ink:#252a2c;--muted:#737978;--line:#dfe2df;--wide:1390px}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:Inter,Arial,Helvetica,sans-serif;font-size:14px;line-height:1.6;letter-spacing:-.005em}
p{line-height:1.65}
h1,h2,h3{font-family:Inter,Arial,Helvetica,sans-serif!important;font-weight:450!important;letter-spacing:-.047em!important;color:var(--ink)!important}
.wrap{width:min(calc(100% - 112px),var(--wide))}
.site-header{background:var(--paper);border-bottom:1px solid var(--line)}
.header-row{height:94px}
.brand{width:191px}
.brand img{mix-blend-mode:multiply}
.nav{gap:32px}
.nav a{color:#454e52;font-size:13px;letter-spacing:0;padding:10px 0}
.nav a.active{color:var(--blue);font-weight:600}
.nav a.active:after{bottom:5px;height:1px;background:var(--blue)}
.overline{font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:600;color:var(--blue);margin-bottom:13px}
.quiet-link,.text-link{color:var(--ink);font-size:12px;font-weight:550;letter-spacing:0;border-bottom:1px solid #aeb7b6}
.quiet-link:hover,.text-link:hover{color:var(--blue);border-color:var(--blue)}
.paper-blend{mix-blend-mode:multiply}
/* Modern homepage */
.m-hero{padding:40px 0 100px}
.m-hero-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted);margin:0 0 42px}
.m-hero-top .line-id{color:var(--ink)}
.m-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(350px,.78fr);gap:clamp(50px,8vw,145px);align-items:center}
.m-hero-image{display:block;position:relative;min-width:0}
.m-hero-image img{width:100%;height:min(65vw,700px);max-height:700px;object-fit:contain;mix-blend-mode:multiply;transition:transform .35s ease}
.m-hero-image:hover img{transform:translateY(-3px)}
.m-hero-copy{max-width:455px;padding:0 0 45px}
.m-hero-copy .overline{margin-bottom:21px}
.m-hero-copy h1{font-size:clamp(48px,4.65vw,74px);font-weight:400!important;line-height:1.11;letter-spacing:-.065em!important;margin:0 0 23px}
.m-hero-copy .m-subtitle{max-width:340px;color:#68706e;font-size:15px;line-height:1.65;margin:0 0 39px}
.m-hero-meta{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#7b8180;padding-top:16px;border-top:1px solid var(--line)}
.m-home-selected{padding:28px 0 105px;border-top:1px solid var(--line)}
.m-section-header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:33px;gap:15px}
.m-section-header h2{margin:0;font-size:22px;letter-spacing:-.04em!important;font-weight:450!important}
.m-section-header a{font-size:12px;color:var(--blue);border-bottom:1px solid #a4b6c2}
.m-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:36px;align-items:start}
.m-work{min-width:0;display:block}
.m-work .m-image{height:365px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.m-work img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .3s ease}
.m-work:hover img{transform:translateY(-4px)}
.m-work:nth-child(2) .m-image{height:365px}
.m-work .m-work-text{display:flex;justify-content:space-between;gap:14px;align-items:baseline;border-top:1px solid var(--line);padding-top:15px;margin-top:12px}
.m-work strong{font-size:13px;font-weight:550;color:var(--ink)}
.m-work small{font-size:11px;color:var(--muted);white-space:nowrap}
.m-photo-row{border-top:1px solid var(--line);padding:88px 0 105px}
.m-photo-inner{display:grid;grid-template-columns:1.27fr .73fr;gap:8%;align-items:center}
.m-photo-inner img{width:100%;height:450px;object-fit:cover}
.m-photo-inner .overline{margin-bottom:18px}
.m-photo-inner h2{font-size:clamp(27px,3vw,44px);line-height:1.22;margin-bottom:20px;max-width:410px}
.m-photo-inner p:not(.overline){color:var(--muted);font-size:14px;max-width:370px;margin-bottom:25px}
.m-shop-row{padding:32px 0 104px;border-top:1px solid var(--line)}
.m-shop-row .m-section-header{margin-bottom:34px}
.m-shop-row-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}
.m-shop-row-grid a{display:block}
.m-shop-row-grid img{width:100%;height:370px;object-fit:contain;mix-blend-mode:multiply;transition:transform .2s}
.m-shop-row-grid a:hover img{transform:translateY(-3px)}
.m-shop-row-grid .m-work-text{border-top:1px solid var(--line);padding-top:13px;margin-top:14px;display:flex;justify-content:space-between;font-size:12px}
.m-shop-row-grid .m-work-text span:last-child{color:var(--muted)}
.m-footer-note{border-top:1px solid var(--line);padding:55px 0 70px}
.m-footer-note .wrap{display:flex;justify-content:space-between;align-items:center;gap:25px}
.m-footer-note p{font-size:22px;letter-spacing:-.03em;max-width:510px;margin:0;line-height:1.35}
/* General pages */
.page-intro{padding:70px 0 48px}
.page-intro h1{font-size:clamp(38px,4.2vw,59px);font-weight:400!important;line-height:1.15;margin-bottom:14px}
.page-intro>p:last-child{font-size:14px;color:var(--muted)}
.section-head h2,.shop-end h2{font-size:22px!important;letter-spacing:-.035em!important}
.portfolio-feature{padding-bottom:112px}
.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:64px 38px}
.project-card img{height:420px;mix-blend-mode:multiply}
.project-label{border-top:1px solid var(--line);margin-top:8px;padding-top:13px}
.project-label strong{font-size:14px;font-weight:550}
.project-label span{color:var(--muted);font-size:11px}
.product-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px}
.product-image{height:330px}
.product-image img{mix-blend-mode:multiply}
.product-info{border-top:1px solid var(--line);margin-top:12px;padding:14px 0 8px}
.product-name{font-size:13px;font-weight:550}
.product-info p{font-size:11px}
.shop-controls{border-color:var(--line);margin-bottom:35px}
.shop-filter{font-size:12px}
.shop-filter.selected{color:var(--blue);border-color:var(--blue)}
.shop-end{border-color:var(--line)}
.shop-end h2{color:var(--ink)}
.btn-dark{background:var(--blue);border-color:var(--blue);color:white}
.btn-dark:hover{background:#2e4f7e}
.btn-outline{background:transparent;border-color:var(--line);color:var(--ink)}
.btn-outline:hover{background:#e9efed}
.project-hero img{mix-blend-mode:multiply}
.project-text-new h2,.commission-two h2,.art-detail-info h1,.about-copy h2,.details-section h2,.contact-new h2{font-family:Inter,Arial,sans-serif!important;color:var(--ink)!important;font-weight:450!important}
.project-text-new p,.about-copy p{color:var(--muted)}
.art-detail-info h1{font-size:clamp(30px,3vw,44px)}
.art-detail-image img{mix-blend-mode:multiply}
.contact-big{color:var(--blue)}
/* No background panels at the bottom of each page */
.home-feature,.home-closing,.site-footer{background:var(--paper)}
.site-footer{border-top:1px solid var(--line)}
.footer-upper{padding:48px 0 43px}
.footer-brand{font-family:Inter,Arial,sans-serif!important;font-size:15px;letter-spacing:-.02em;font-weight:600;color:var(--blue)}
.footer-upper p,.footer-links a{font-size:12px;color:var(--muted)}
.footer-bottom{border-top:1px solid var(--line);color:#89918c;padding:16px 0 22px}
.lightbox{background:rgba(248,249,247,.985)}
.lightbox img{mix-blend-mode:multiply}
@media(max-width:1050px){
 .wrap{width:calc(100% - 72px)}
 .m-hero-grid{grid-template-columns:1fr .85fr;gap:35px}
 .m-hero-image img{height:570px}
 .m-work .m-image{height:270px}
 .m-photo-inner img{height:380px}
 .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:780px){
 .wrap{width:calc(100% - 40px)}
 .header-row{height:80px}.brand{width:166px}
 .nav-toggle span{background:var(--ink)}
 .nav{background:var(--paper);box-shadow:0 14px 23px #18232309}
 .m-hero{padding:22px 0 60px}
 .m-hero-top{margin-bottom:26px}
 .m-hero-grid{display:flex;flex-direction:column-reverse;gap:22px;align-items:stretch}
 .m-hero-image img{height:440px}
 .m-hero-copy{padding:10px 0 0;max-width:100%}
 .m-hero-copy h1{font-size:44px;margin-bottom:16px;max-width:570px}
 .m-hero-copy .m-subtitle{font-size:14px;margin-bottom:20px}
 .m-hero-meta{margin-top:18px}
 .m-home-selected{padding:28px 0 65px}
 .m-grid{gap:26px 18px;grid-template-columns:repeat(2,minmax(0,1fr))}
 .m-work .m-image,.m-work:nth-child(2) .m-image{height:250px}
 .m-work-text{display:block!important}.m-work-text small{display:block;padding-top:3px}
 .m-photo-row{padding:60px 0 70px}
 .m-photo-inner{display:block}
 .m-photo-inner img{height:auto;max-height:460px;object-fit:contain;margin-bottom:25px}
 .m-photo-inner h2{font-size:28px}
 .m-shop-row{padding:28px 0 70px}
 .m-shop-row-grid{gap:19px}
 .m-shop-row-grid img{height:260px}
 .m-footer-note{padding:35px 0 50px}.m-footer-note .wrap{display:block}.m-footer-note p{font-size:20px;margin-bottom:22px}
 .page-intro{padding:55px 0 39px}
 .page-intro h1{font-size:41px}
 .project-grid{gap:42px 22px}.project-card img{height:325px}
 .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.product-image{height:270px}
 .footer-upper{padding:45px 0 35px}
}
@media(max-width:490px){
 .wrap{width:calc(100% - 32px)}
 .m-hero-top{font-size:10px}
 .m-hero-image img{height:390px}
 .m-hero-copy h1{font-size:38px}
 .m-grid{gap:24px 14px}
 .m-work .m-image,.m-work:nth-child(2) .m-image{height:208px}
 .m-section-header h2{font-size:20px}
 .m-work strong,.m-shop-row-grid .m-work-text{font-size:12px}
 .m-shop-row-grid img{height:210px}
 .project-card img{height:250px}
 .product-image{height:210px}
 .site-footer{margin-top:0}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
/* Small refinements after responsive review */
.project-label strong,.product-name,.m-work strong,.m-shop-row-grid .m-work-text,.shop-end h2,.footer-brand {font-family:Inter,Arial,Helvetica,sans-serif!important}
.project-label strong,.product-name{font-weight:550!important;letter-spacing:-.02em}
@media(max-width:780px){
  .m-shop-row-grid .m-work-text{display:flex!important;flex-direction:column;align-items:flex-start;gap:5px}
  .m-shop-row-grid .m-work-text span{display:block;font-size:11px}
}
