/* Our Collections (rebuilt 5 Nov 2026, "make this page nicer too"): the home page's own parts. The title and one line centred; the four
   collections two to a row, each a room photograph (the same wide interiors as Room Inspirations, cut to 4:3), the name in the headline
   face, one line of words, the outlined button and the catalogue as a quiet link; at the foot, two outlined buttons. */
.tm-colls{--ink:#2a1f18;--text:#3c3a34;--mute:#8a847b;--line:#302f2a;background:#f3efe7;color:var(--text);
  padding:clamp(48px,5vw,88px) var(--tm-edge,24px) clamp(72px,7vw,120px)}
.tm-colls a{color:inherit;text-decoration:none}
@layer tomita-type{
  .tm-colls :is(h1,h2).co-h{font-family:"Cormorant Garamond","Playfair Display",Georgia,serif!important;font-weight:500!important;font-style:normal!important;
    text-transform:none!important;letter-spacing:0!important;font-size-adjust:.44!important;line-height:1.2!important}
}
.tm-colls .co-head{max-width:640px;margin:0 auto;text-align:center}
.tm-colls .co-label{margin:0 0 16px;font:500 11px/1.4 Inter,Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#6b655c}
.tm-colls h1.co-h{margin:0;font-size:clamp(30px,2.6vw,40px)!important;color:var(--ink)}
.tm-colls .co-lede{margin:16px auto 0;max-width:34em;font:400 16px/1.8 "PT Serif",Georgia,serif;color:var(--text)}
.tm-colls .co-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(56px,6vw,96px) clamp(24px,3vw,48px);
  max-width:1320px;margin:clamp(48px,5vw,80px) auto 0}
.tm-colls .co-pic{display:block;aspect-ratio:4/3;overflow:hidden;background:#e6dfd3}
.tm-colls .co-pic img{display:block;width:100%;height:100%;max-height:none!important;object-fit:cover;transition:scale 1.2s cubic-bezier(.33,0,.2,1)}
.tm-colls .co-pic:hover img{scale:1.03}
.tm-colls h2.co-h{margin:24px 0 0;font-size:clamp(24px,2vw,30px)!important;color:var(--ink)}
.tm-colls .co-p{margin:8px 0 0;max-width:32em;font:400 16px/1.7 "PT Serif",Georgia,serif;color:var(--text)}
.tm-colls .co-acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:22px}
.tm-colls .co-btn{display:inline-block;padding:15px 30px;border:1px solid var(--line);color:var(--line);font:500 11px/1 Inter,Arial,sans-serif;
  letter-spacing:.2em;text-transform:uppercase;transition:background-color .3s,color .3s}
.tm-colls .co-btn:hover,.tm-colls .co-btn:focus-visible{background:var(--line);color:#f3efe7}
.tm-colls .co-link{padding-bottom:3px;border-bottom:1px solid var(--ink);font:400 14px/1.4 "PT Serif",Georgia,serif;color:var(--ink)}
.tm-colls .co-link span{color:var(--mute)}
.tm-colls .co-more{max-width:1320px;margin:clamp(72px,7vw,120px) auto 0;padding-top:clamp(48px,5vw,72px);border-top:1px solid rgba(48,47,42,.16);text-align:center}
.tm-colls .co-more .co-acts{justify-content:center;margin-top:24px}
@media (max-width:767px){
  .tm-colls{padding:40px 24px 72px}
  .tm-colls .co-grid{grid-template-columns:1fr;gap:56px}
  .tm-colls .co-more .co-btn{width:100%;text-align:center}
}

/* The catalogue covers back (user, 5 Nov 2026: "got rid of our signature collection image and logos"): the four covers, each with its
   collection's own title and the tomita mark, four to a row as before, lifted a little on hover like a book picked up; the words under
   each as above, the button and the catalogue one under the other so the narrow columns stay tidy. */
.tm-colls .co-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:64px clamp(24px,2.6vw,44px);max-width:1180px}
.tm-colls .co-cover{display:block}
.tm-colls h2.co-h{margin-top:28px;font-size:clamp(22px,1.7vw,26px)!important}
.tm-colls .co-p{font-size:15px;line-height:1.7}
.tm-colls .co-item .co-acts{flex-direction:column;align-items:flex-start;gap:16px;margin-top:20px}
@media (max-width:1023px){.tm-colls .co-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){.tm-colls .co-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 16px}
  .tm-colls h2.co-h{margin-top:18px;font-size:21px!important}.tm-colls .co-p{font-size:14px}
  .tm-colls .co-item .co-btn{padding:13px 18px;letter-spacing:.16em}}

/* Every row lined up across the four (user, 5 Nov 2026: "unsatisfying"): each collection takes five rows of one shared grid (cover,
   name, words, button, catalogue), so the names, the buttons and the catalogue links sit on the same lines whatever the length of
   the words; the button and the catalogue are laid straight into those rows. */
@supports (grid-template-rows:subgrid){
  .tm-colls .co-grid{grid-auto-rows:auto;row-gap:0}
  .tm-colls .co-item{display:grid;grid-row:span 5;grid-template-rows:subgrid;align-items:start;margin-bottom:64px}
  .tm-colls .co-item .co-acts{display:contents}
  .tm-colls .co-item .co-btn{justify-self:start;margin-top:22px}
  .tm-colls .co-item .co-link{justify-self:start;margin-top:16px}
  @media (max-width:767px){.tm-colls .co-item{margin-bottom:48px}}
}

/* The covers alone (user, 5 Nov 2026: "remove all the texts below, make the images the hero of the page, add the button inside the
   image"): the title, then the four covers as large as the window allows, nothing beneath them; each cover is the link, and a quiet
   paper button sits inside it, between the collection's title and the tomita mark. */
.tm-colls{display:flex;flex-direction:column;justify-content:center;min-height:calc(100svh - 104px);padding-top:clamp(36px,4vw,64px);padding-bottom:clamp(56px,6vw,96px)}
.tm-colls .co-head{max-width:none}
.tm-colls .co-grid{max-width:none;width:100%;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:clamp(16px,1.8vw,32px);margin-top:clamp(28px,3vw,48px)}
@supports (grid-template-rows:subgrid){.tm-colls .co-item{display:block;grid-row:auto;margin-bottom:0}}
.tm-colls .co-cover{position:relative;display:block}
.tm-colls .co-in{position:absolute;left:50%;top:69%;z-index:2;translate:-50% 0;padding:13px 24px;white-space:nowrap;
  background:rgba(243,239,231,.92);color:#2a1f18;font:500 11px/1 Inter,Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;
  box-shadow:0 6px 20px rgba(0,0,0,.12);transition:background-color .35s,color .35s}
.tm-colls .co-cover:hover .co-in,.tm-colls .co-cover:focus-visible .co-in{background:#2a1f18;color:#f3efe7}
.tm-colls .co-cover:focus-visible{outline:1px solid #2a1f18;outline-offset:6px}
@media (max-width:1023px){.tm-colls .co-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}}
@media (max-width:767px){
  .tm-colls{min-height:0;padding:32px 16px 56px}
  .tm-colls .co-grid{column-gap:12px;row-gap:16px;margin-top:24px}
  .tm-colls .co-in{padding:10px 14px;font-size:9.5px;letter-spacing:.16em}
}

/* A few words under each cover (user, 5 Nov 2026, after Dedar's collection list: "at least some text, not too much"): the name, what it
   is made of, how many designs, three plain lines; and a deeper ground: the indigo of the collection pages' band (#213752), the covers
   lifted on it, the words in white. */
.tm-colls{background:#213752!important;color:#f3efe7}
.tm-colls h1.co-h{color:#f3efe7!important}
.tm-colls .co-note{margin:20px 0 0;font:400 16px/1.5 "PT Serif",Georgia,serif}
.tm-colls .co-note a{display:block;color:inherit}
.tm-colls .co-note b{display:block;margin-bottom:2px;font:500 24px/1.2 "Cormorant Garamond",Georgia,serif;font-size-adjust:.44;color:#fff}
.tm-colls .co-note span{display:block;color:rgba(243,239,231,.68)}
.tm-colls .co-note a:hover b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.tm-colls .co-cover:focus-visible{outline-color:#f3efe7}
.tm-colls .co-cover>div{box-shadow:0 30px 60px -30px rgba(0,0,0,.6),0 2px 6px rgba(0,0,0,.25)!important}
@media (max-width:767px){.tm-colls .co-note{margin-top:12px;font-size:14px}.tm-colls .co-note b{font-size:20px}}
/* the year first (user, 5 Nov 2026), above the name */
.tm-colls .co-note .co-year{margin-bottom:4px}
/* (user, 5 Nov 2026) the year the largest of the three, and the words centred under each cover */
.tm-colls .co-note{text-align:center}
.tm-colls .co-note .co-year{margin-bottom:2px;font:500 clamp(30px,2.6vw,40px)/1.1 "Cormorant Garamond",Georgia,serif;font-size-adjust:.44;color:#fff}
.tm-colls .co-note b{font-size:22px}
@media (max-width:767px){.tm-colls .co-note .co-year{font-size:28px}.tm-colls .co-note b{font-size:19px}}
.tm-colls .co-lede{color:rgba(243,239,231,.8)}
