/* ============================================================================
   GECE MOBİLYA — V6.2 PREMIUM REFINEMENT
   Loaded last (after brand-system.css) so it re-tunes the V6.1 system without
   changing its identity. No layout structure is altered; only type rhythm,
   spacing, header, theme control, project/catalogue presentation and motion.
   Light remains the default (handled by the inline head bootstrap in each page).
   ========================================================================== */

:root{
  /* Refined type rhythm tokens (V6.2) */
  --v62-track-display:-.030em;
  --v62-track-tight:-.018em;
  --v62-lead-heading:1.03;
  --v62-label-track:.135em;
}

/* ---------------------------------------------------------------------------
   5B — TYPOGRAPHY : calmer, more confident, less editorial squeeze.
   Everything stays on the locally hosted GM Manrope variable family.
   ------------------------------------------------------------------------- */
.hero h1,.display,.dual-copy h2,.cta-copy h2,.about-live-page h1,
.about-live-page h2,.process-page h1,.process-page h2,.content-title,
.gm-display,.gm-category h2,.gm-custom h2,.gm-final h2,.gm-project-desk h2,
.gm-hero h1,.gm-hero-card strong,.gm-pdf-card h3,.gm-category-index-card strong,
.gm-master-pdf h3,.gm-product-meta h3,.gm-dialog h3,.prj-info h3,
.prj-hero h1,.prj-cta h2,.search-dialog h2{
  font-family:var(--font-display)!important;
  font-weight:540!important;
  letter-spacing:var(--v62-track-display)!important;
  line-height:var(--v62-lead-heading)!important;
  font-style:normal!important;
}

/* Confidence without shouting: measured display scale + wider measure. */
.hero h1{font-size:clamp(62px,5.9vw,96px)!important;max-width:12.8ch!important}
.about-live-page h1{font-size:clamp(58px,5.7vw,90px)!important;max-width:13.2ch!important}
.display{font-size:clamp(44px,3.85vw,60px)!important}
.dual-copy h2{font-size:clamp(35px,2.85vw,47px)!important;line-height:1.07!important}
.cta-copy h2{font-size:clamp(39px,3.6vw,56px)!important}
.content-title{line-height:1.05!important}

/* Accent emphasis is colour + weight, never a decorative serif italic. */
.hero h1 em,.editorial-accent,.contact-hero h1 em,.gm-hero h1 em{
  font-family:var(--font-display)!important;
  font-weight:520!important;
  font-style:normal!important;
  letter-spacing:-.018em!important;
}

/* Product / project / catalogue titles: modern, tactile, readable. */
.project-title,.prj-info h3,.collection-body h3,.collection-name,
.gm-product-meta h3{font-weight:550!important;letter-spacing:-.022em!important}
.gm-product-meta h3{font-size:20px!important;line-height:1.2!important}
.collection-body h3,.collection-name{font-size:17.5px!important}

/* Body copy: comfortable Turkish reading measure and rhythm. */
body{font-weight:450!important;line-height:1.7}
.copy,.content-copy,.gm-copy{font-size:16.5px!important;line-height:1.78!important;letter-spacing:-.004em!important}
.hero .copy{font-size:16.5px!important;line-height:1.76!important}

/* Interface micro-labels: precise, not shouty. */
.eyebrow,.content-kicker,.gm-kicker,.pp-eyebrow,.prj-eyebrow,
.al-experience span,.al-timeline h3,.al-process-grid article>span{
  letter-spacing:var(--v62-label-track)!important;
  font-weight:680!important;
}
.nav>a,.nav-trigger{letter-spacing:.06em!important;font-weight:600!important}
.btn,.gm-btn,.text-link,.collection-action{letter-spacing:.06em!important;font-weight:670!important}
.footer-col h3{letter-spacing:.12em!important;font-weight:650!important}

/* ---------------------------------------------------------------------------
   5C — LIGHT / DARK : keep light primary, make the switch unmistakable.
   ------------------------------------------------------------------------- */
/* Smooth, restrained theme cross-fade (still no flash — data-theme is set
   before first paint by the inline bootstrap). */
body,.gm-catalog{transition:background-color .3s ease,color .3s ease}

/* Theme control: clearer affordance, refined symbols, real focus ring. */
.theme-btn{
  border:1px solid color-mix(in srgb,currentColor 30%,transparent)!important;
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.theme-btn:hover{border-color:var(--gold)!important;transform:translateY(-1px)}
.theme-btn:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:999px}
.theme-btn .sun,.theme-btn .moon{stroke-width:1.5}
.theme-btn .sun,.theme-btn .moon{transition:opacity .2s ease,background-color .2s ease,color .2s ease}

/* Light-mode catalogue was leaving a dark page ground behind the panel. */
html[data-theme="light"] body.page-catalog{background:#f1ede6!important}

/* ---------------------------------------------------------------------------
   5D — HEADER / NAVIGATION : stronger presence, precise alignment.
   ------------------------------------------------------------------------- */
.brand>img{width:148px!important;max-height:46px!important}
.header .nav{gap:28px}
.header .nav>a{position:relative;padding-bottom:2px}
.header .nav>a:after{
  content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;
  background:var(--gold);transform:scaleX(0);transform-origin:left;
  transition:transform .28s var(--ease);
}
.header .nav>a:hover:after,
.header .nav>a[aria-current="page"]:after{transform:scaleX(1)}
.header .icon-btn{border-radius:999px}
.header .dropdown a{border-radius:2px}

/* Mobile drawer typography stays readable, never oversized. */
@media(max-width:1180px){
  .nav.open>a,.nav.open .nav-trigger{font-size:16.5px!important;letter-spacing:-.01em!important}
}

/* ---------------------------------------------------------------------------
   5E — HOME : intentional vertical rhythm and section transitions.
   ------------------------------------------------------------------------- */
:root{--section-space:120px}
@media(max-width:1180px){:root{--section-space:92px}}
@media(max-width:720px){:root{--section-space:74px}}

.hero-copy{padding:58px 0 44px!important;max-width:620px!important}
.hero .copy{margin:22px 0 30px!important}
.hero-stats{margin-top:48px!important;gap:0}
.collections-head,.projects-head{margin-bottom:40px!important}
.collections-head>div,.projects-head>div:first-child{max-width:820px!important}

/* Collections: the six-card strip gets calmer geometry and image focus. */
.collection-grid{gap:2px}
.collection-card{border:0}
.collection-card img{transition:transform .5s var(--ease)}
.collection-card:hover img{transform:scale(1.03)}

/* Sections read as one composition: subtle separators, no card piles. */
.section{border-bottom:1px solid var(--line)}

/* ---------------------------------------------------------------------------
   5F — PROJECTS / REFERENCES : image-first, understated metadata.
   ------------------------------------------------------------------------- */
.project-card,.prj-card,.prj-gallery-card{border-radius:2px}
.project-info{
  padding:16px 18px!important;
  border-top:1px solid var(--line-dark);
  background:transparent;
}
.project-no,.prj-counter,.prj-card-label{
  font-weight:700;
  letter-spacing:.12em;
  background:transparent;
}
.project-title{font-size:20px!important;line-height:1.14!important}
.project-arrow{border-width:1px}
.prj-detail-points span{border-color:var(--line)}
.prj-info{padding:34px 34px 30px!important}

/* ---------------------------------------------------------------------------
   5G — CATALOGUE : commercial clarity, efficient desktop density.
   ------------------------------------------------------------------------- */
.gm-catalog{font-family:var(--font-text)!important}
.gm-catalog .gm-display,.gm-catalog .gm-hero h1,.gm-catalog .gm-hero-card strong,
.gm-catalog .gm-pdf-card h3,.gm-catalog .gm-category-index-card strong,
.gm-catalog .gm-master-pdf h3,.gm-catalog .gm-product-meta h3,
.gm-catalog .gm-custom h2,.gm-catalog .gm-final h2,.gm-catalog .gm-dialog h3,
.gm-catalog .gm-category h2{
  font-family:var(--font-display)!important;
  font-weight:520!important;
  letter-spacing:var(--v62-track-display)!important;
  line-height:1.05!important;
  font-style:normal!important;
}
.gm-hero h1{font-size:clamp(50px,6.1vw,88px)!important;line-height:1.02!important;max-width:15ch}
.gm-category h2{font-size:clamp(34px,4vw,56px)!important}
.gm-category-index-card strong{font-size:24px!important}
.gm-product-grid{gap:18px}
.gm-product-card{border-radius:16px}
.gm-product-meta{padding:16px 16px 18px}
.gm-product-code{letter-spacing:.14em}
.gm-search input,.gm-nav a,.gm-nav button{font-family:var(--font-text)}
/* Use available width on very large desktops. */
@media(min-width:1560px){
  .gm-product-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
  :root{--gm-shell:min(1440px,calc(100vw - 96px))}
}

/* ---------------------------------------------------------------------------
   5H — RESPONSIVE : contain overflow, protect logo/text, sane density.
   ------------------------------------------------------------------------- */
html,body{overflow-x:clip}
img,svg,video{max-width:100%}
.shell{min-width:0}
/* Tablet catalogue: 3-up remains scannable, never oversized. */
@media(min-width:821px) and (max-width:1100px){
  .gm-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px}
}
/* Small phones: keep type from clipping and buttons from wrapping oddly. */
@media(max-width:430px){
  .hero h1{font-size:clamp(46px,12.6vw,54px)!important}
  .display,.about-live-page h2{font-size:clamp(37px,10.2vw,45px)!important}
  .gm-product-grid{gap:12px}
  .btn,.gm-btn{white-space:normal}
}

/* ---------------------------------------------------------------------------
   5I — MOTION : only what improves perceived quality; reduced-motion safe.
   ------------------------------------------------------------------------- */
.collection-card,.project-card,.gm-product-card,.gm-btn,.prj-arrow,.project-arrow{
  transition-timing-function:var(--ease);
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{
    transition-duration:.001ms!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
  }
}