*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

  :root {
    --parchment: #F5F1EA;
    --parchment-dark: #EDE8DF;
    --ink: #1C1A16;
    --ink-soft: #2F2C27;
    --gold: #9A7B3A;
    --gold-light: #C4A55A;
    --sand: #C9B99A;
    --mist: #4E4A43;
    --white: #FDFCFA;
    --sand-light: #E4DAC4;
  }

  html { scroll-behavior: smooth; }

  body {
    font-family: 'Jost', sans-serif;
    background: var(--parchment);
    color: var(--ink);
    overflow-x: hidden;
    cursor: none;
  }

  /* Custom cursor */
  .cursor {
    position: fixed;
    width: 8px; height: 8px;
    background: var(--gold);
    border-radius: 50%;
    pointer-events: none;
    z-index: 9999;
    transform: translate(-50%, -50%);
    transition: transform 0.1s ease;
  }
  .cursor-ring {
    position: fixed;
    width: 32px; height: 32px;
    border: 1px solid var(--gold);
    border-radius: 50%;
    pointer-events: none;
    z-index: 9998;
    transform: translate(-50%, -50%);
    transition: transform 0.25s ease, width 0.3s, height 0.3s;
    opacity: 0.6;
  }
  body:hover .cursor-ring { opacity: 1; }

  /* ——— NAVIGATION ——— */
  nav {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 100;
    padding: 28px 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    mix-blend-mode: multiply;
    transition: background 0.4s, padding 0.4s;
  }
  nav.scrolled {
    background: rgba(245, 241, 234, 0.96);
    backdrop-filter: blur(12px);
    padding: 18px 48px;
    border-bottom: 1px solid var(--sand);
    mix-blend-mode: normal;
  }

  .nav-logo {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.25rem;
    font-weight: 500;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--ink);
    text-decoration: none;
    line-height: 1.1;
  }
  .nav-logo span {
    display: block;
    font-size: 0.52rem;
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    letter-spacing: 0.38em;
    color: var(--gold);
    text-transform: uppercase;
    margin-top: 2px;
  }

  .nav-links {
    display: flex;
    gap: 36px;
    list-style: none;
  }
  .nav-links a {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.7rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--ink-soft);
    text-decoration: none;
    position: relative;
    transition: color 0.3s;
  }
  .nav-links a::after {
    content: '';
    position: absolute;
    bottom: -3px; left: 0;
    width: 0; height: 1px;
    background: var(--gold);
    transition: width 0.35s ease;
  }
  .nav-links a:hover { color: var(--ink); }
  .nav-links a:hover::after { width: 100%; }

  .nav-cta {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.68rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--white);
    background: var(--ink);
    padding: 10px 22px;
    text-decoration: none;
    border: 1px solid var(--ink);
    transition: background 0.3s, color 0.3s;
  }
  .nav-cta:hover { background: transparent; color: var(--ink); }

  /* ——— HERO ——— */
  .hero {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1fr 1fr;
    overflow: hidden;
    position: relative;
  }

  .hero-left {
    background: var(--ink);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 80px 64px 72px;
    position: relative;
    overflow: hidden;
  }
  .hero-left::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: url('/assets/images/hero-atelier-960.jpg') center/cover no-repeat;
    background-image: image-set(
      url('/assets/images/hero-atelier-960.avif') type('image/avif'),
      url('/assets/images/hero-atelier-960.webp') type('image/webp'),
      url('/assets/images/hero-atelier-960.jpg') type('image/jpeg'));
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 0.18;
  }

  .hero-eyebrow {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.65rem;
    letter-spacing: 0.42em;
    text-transform: uppercase;
    color: var(--gold-light);
    margin-bottom: 28px;
    animation: fadeUp 1s ease 0.2s both;
  }

  .hero-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(3.5rem, 6vw, 5.8rem);
    font-weight: 300;
    line-height: 1.02;
    color: var(--white);
    letter-spacing: -0.01em;
    animation: fadeUp 1s ease 0.4s both;
  }
  .hero-title em {
    font-style: italic;
    color: var(--gold-light);
    display: block;
  }

  .hero-rule {
    width: 48px;
    height: 1px;
    background: var(--gold);
    margin: 36px 0;
    animation: fadeUp 1s ease 0.6s both;
  }

  .hero-desc {
    font-weight: 300;
    font-size: 0.88rem;
    line-height: 1.85;
    color: var(--sand-light);
    max-width: 360px;
    animation: fadeUp 1s ease 0.8s both;
  }

  .hero-bottom-strip {
    position: absolute;
    bottom: 72px; right: -1px;
    width: 1px;
    height: 80px;
    background: var(--gold);
    animation: expandH 1.2s ease 1s both;
  }

  .hero-right {
    background: var(--parchment-dark);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 120px 64px 72px;
    position: relative;
  }

  .hero-since {
    position: absolute;
    top: 48px; right: 48px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 0.72rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--mist);
    writing-mode: vertical-rl;
    animation: fadeIn 1s ease 1.2s both;
  }

  .hero-manifesto {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.4rem, 2.6vw, 2.1rem);
    font-weight: 300;
    line-height: 1.55;
    color: var(--ink);
    letter-spacing: 0.01em;
    max-width: 400px;
    animation: fadeUp 1s ease 0.6s both;
  }
  .hero-manifesto strong {
    font-weight: 600;
    color: var(--gold);
    font-style: italic;
  }

  .hero-stats {
    display: flex;
    gap: 48px;
    margin-top: 56px;
    animation: fadeUp 1s ease 0.9s both;
  }
  .stat-item { display: flex; flex-direction: column; gap: 6px; }
  .stat-num {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.8rem;
    font-weight: 300;
    color: var(--ink);
    line-height: 1;
  }
  .stat-label {
    font-family: 'Jost', sans-serif;
    font-size: 0.62rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--mist);
  }

  .hero-cta-group {
    display: flex;
    gap: 20px;
    margin-top: 48px;
    animation: fadeUp 1s ease 1.1s both;
  }
  .btn-primary {
    font-family: 'Jost', sans-serif;
    font-weight: 400;
    font-size: 0.7rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--white);
    background: var(--ink);
    padding: 14px 32px;
    text-decoration: none;
    border: 1px solid var(--ink);
    transition: all 0.35s;
    display: inline-block;
  }
  .btn-primary:hover { background: var(--gold); border-color: var(--gold); }
  .btn-ghost {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.7rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--ink);
    background: transparent;
    padding: 14px 32px;
    text-decoration: none;
    border: 1px solid var(--sand);
    transition: all 0.35s;
    display: inline-block;
  }
  .btn-ghost:hover { border-color: var(--ink); }

  /* ——— MARQUEE ——— */
  .marquee-strip {
    background: #846A2E;
    overflow: hidden;
    padding: 14px 0;
    position: relative;
  }
  .marquee-track {
    display: flex;
    gap: 0;
    white-space: nowrap;
    animation: marquee 28s linear infinite;
  }
  .marquee-item {
    font-family: 'Cormorant Garamond', serif;
    font-size: 0.85rem;
    font-weight: 400;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--white);
    padding: 0 48px;
  }
  .marquee-dot {
    color: rgba(255,255,255,0.5);
    padding: 0;
    font-size: 0.6rem;
    vertical-align: middle;
  }

  /* ——— SECTION COMMONS ——— */
  section { padding: 110px 0; }

  .section-tag {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.62rem;
    letter-spacing: 0.42em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 16px;
  }
  .section-tag::before {
    content: '';
    width: 32px; height: 1px;
    background: var(--gold);
    display: block;
  }

  .section-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(2.4rem, 4vw, 3.8rem);
    font-weight: 300;
    line-height: 1.1;
    color: var(--ink);
    letter-spacing: -0.01em;
  }
  .section-title em {
    font-style: italic;
    color: var(--gold);
  }

  /* ——— ABOUT SECTION ——— */
  .about-section {
    background: var(--white);
    padding: 120px 0;
  }
  .about-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 64px;
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 100px;
    align-items: center;
  }
  .about-left { position: relative; }

  .about-image-frame {
    position: relative;
    padding-top: 125%;
    overflow: hidden;
  }
  .about-image-frame img {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    filter: saturate(0.7) contrast(1.05);
    transition: transform 0.8s ease, filter 0.6s ease;
  }
  .about-image-frame:hover img {
    transform: scale(1.04);
    filter: saturate(0.9) contrast(1.05);
  }

  .about-badge {
    position: absolute;
    bottom: -28px; right: -28px;
    width: 88px; height: 88px;
    background: var(--gold);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
  }
  .about-badge .year {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.5rem;
    font-weight: 300;
    color: var(--white);
    line-height: 1;
  }
  .about-badge .label {
    font-family: 'Jost', sans-serif;
    font-size: 0.5rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.8);
  }

  .about-right { padding-left: 20px; }
  .about-body {
    font-size: 0.95rem;
    font-weight: 300;
    line-height: 1.95;
    color: var(--ink-soft);
    margin-top: 32px;
  }
  .about-body p + p { margin-top: 20px; }

  .about-pull-quote {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.55rem;
    font-weight: 300;
    font-style: italic;
    line-height: 1.5;
    color: var(--ink);
    border-left: 2px solid var(--gold);
    padding-left: 28px;
    margin: 40px 0;
  }

  /* ——— SERVICES ——— */
  .services-section {
    background: var(--parchment);
    padding: 120px 0;
  }
  .services-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 64px;
  }
  .services-header {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: end;
    margin-bottom: 72px;
  }
  .services-intro {
    font-weight: 300;
    font-size: 0.9rem;
    line-height: 1.85;
    color: var(--mist);
    max-width: 380px;
    margin-top: 20px;
  }

  .services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2px;
  }

  .service-card {
    background: var(--parchment-dark);
    padding: 48px 40px;
    position: relative;
    overflow: hidden;
    transition: background 0.4s;
    cursor: none;
  }
  .service-card::before {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 100%; height: 2px;
    background: var(--gold);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.45s ease;
  }
  .service-card:hover { background: var(--white); }
  .service-card:hover::before { transform: scaleX(1); }

  .service-num {
    font-family: 'Cormorant Garamond', serif;
    font-size: 0.7rem;
    letter-spacing: 0.22em;
    color: var(--gold);
    margin-bottom: 32px;
    display: block;
  }
  .service-icon {
    font-size: 2rem;
    margin-bottom: 20px;
    display: block;
    filter: saturate(0);
    transition: filter 0.3s;
  }
  .service-card:hover .service-icon { filter: saturate(1); }

  .service-name {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--ink);
    line-height: 1.2;
    margin-bottom: 14px;
  }
  .service-desc {
    font-size: 0.82rem;
    font-weight: 300;
    line-height: 1.8;
    color: var(--mist);
  }
  .service-arrow {
    display: inline-block;
    margin-top: 28px;
    font-size: 0.68rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--gold);
    text-decoration: none;
    transition: gap 0.3s;
  }
  .service-arrow::after { content: ' →'; }

  /* ——— PROCESS ——— */
  .process-section {
    background: var(--ink);
    padding: 120px 0;
    position: relative;
    overflow: hidden;
  }
  .process-section::before {
    content: 'CRAFT';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'Cormorant Garamond', serif;
    font-size: 18vw;
    font-weight: 300;
    color: rgba(255,255,255,0.025);
    white-space: nowrap;
    pointer-events: none;
  }

  .process-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 64px;
    position: relative;
    z-index: 1;
  }
  .process-inner .section-tag { color: var(--gold-light); }
  .process-inner .section-tag::before { background: var(--gold-light); }
  .process-inner .section-title { color: var(--white); }

  .process-steps {
    margin-top: 72px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2px;
  }
  .process-step {
    padding: 48px 36px;
    border: 1px solid rgba(255,255,255,0.06);
    position: relative;
    transition: border-color 0.4s, background 0.4s;
  }
  .process-step:hover {
    border-color: rgba(154, 123, 58, 0.4);
    background: rgba(154, 123, 58, 0.06);
  }
  .step-number {
    font-family: 'Cormorant Garamond', serif;
    font-size: 3.5rem;
    font-weight: 300;
    color: rgba(196, 165, 90, 0.75);
    line-height: 1;
    margin-bottom: 20px;
    display: block;
  }
  .step-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--white);
    margin-bottom: 14px;
  }
  .step-desc {
    font-size: 0.8rem;
    font-weight: 300;
    line-height: 1.85;
    color: var(--sand-light);
  }

  /* ——— HERITAGE ——— */
  .heritage-section {
    background: var(--parchment-dark);
    padding: 0;
    overflow: hidden;
  }
  .heritage-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 560px;
  }
  .heritage-visual {
    background: var(--ink);
    position: relative;
    overflow: hidden;
  }
  .heritage-visual img {
    width: 100%; height: 100%;
    object-fit: cover;
    opacity: 0.55;
    filter: sepia(0.2);
  }
  .heritage-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(28,26,22,0.6) 0%, transparent 70%);
  }
  .heritage-year-overlay {
    position: absolute;
    bottom: 48px; left: 48px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 6rem;
    font-weight: 300;
    color: rgba(255,255,255,0.12);
    line-height: 1;
  }

  .heritage-content {
    padding: 80px 72px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .heritage-content .section-title { margin-top: 20px; }
  .heritage-text {
    font-size: 0.9rem;
    font-weight: 300;
    line-height: 1.95;
    color: var(--ink-soft);
    margin-top: 28px;
    max-width: 420px;
  }
  .heritage-values {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 40px;
  }
  .value-row {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px solid var(--sand);
  }
  .value-row:first-child { border-top: 1px solid var(--sand); }
  .value-dot {
    width: 6px; height: 6px;
    background: var(--gold);
    border-radius: 50%;
    flex-shrink: 0;
  }
  .value-name {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--ink);
    flex: 1;
  }
  .value-desc {
    font-size: 0.75rem;
    font-weight: 300;
    letter-spacing: 0.06em;
    color: var(--mist);
  }

  /* ——— SPECIALITIES BENTO ——— */
  .specialities-section {
    background: var(--white);
    padding: 120px 0;
  }
  .specialities-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 64px;
  }
  .bento-grid {
    margin-top: 64px;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 260px 260px;
    gap: 2px;
  }
  .bento-card {
    position: relative;
    overflow: hidden;
    background: var(--parchment-dark);
  }
  .bento-card img {
    width: 100%; height: 100%;
    object-fit: cover;
    filter: saturate(0.65);
    transition: transform 0.7s ease, filter 0.5s;
  }
  .bento-card:hover img { transform: scale(1.06); filter: saturate(0.85); }
  .bento-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 40%, rgba(28,26,22,0.82) 100%);
    display: flex;
    align-items: flex-end;
    padding: 28px 28px;
  }
  .bento-label {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.2rem;
    font-weight: 400;
    color: var(--white);
  }
  .bento-label small {
    display: block;
    font-family: 'Jost', sans-serif;
    font-size: 0.6rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--gold-light);
    margin-bottom: 4px;
  }

  .bento-a { grid-column: 1 / 5; grid-row: 1; }
  .bento-b { grid-column: 5 / 9; grid-row: 1; }
  .bento-c { grid-column: 9 / 13; grid-row: 1; }
  .bento-d { grid-column: 1 / 7; grid-row: 2; }
  .bento-e { grid-column: 7 / 13; grid-row: 2; }

  /* ——— CSR ——— */
  .csr-section {
    background: var(--parchment);
    padding: 120px 0;
  }
  .csr-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 64px;
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 80px;
    align-items: center;
  }
  .csr-text .section-title { margin-top: 20px; }
  .csr-body {
    font-size: 0.9rem;
    font-weight: 300;
    line-height: 1.95;
    color: var(--ink-soft);
    margin-top: 28px;
    max-width: 480px;
  }
  .csr-visual {
    position: relative;
  }
  .csr-image-wrap {
    padding-top: 120%;
    position: relative;
    overflow: hidden;
  }
  .csr-image-wrap img {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    filter: saturate(0.6);
    transition: transform 0.8s, filter 0.5s;
  }
  .csr-image-wrap:hover img { transform: scale(1.04); filter: saturate(0.8); }
  .csr-accent {
    position: absolute;
    top: -20px; left: -20px;
    width: 80px; height: 80px;
    border-top: 2px solid var(--gold);
    border-left: 2px solid var(--gold);
    pointer-events: none;
  }
  .csr-accent-br {
    position: absolute;
    bottom: -20px; right: -20px;
    width: 80px; height: 80px;
    border-bottom: 2px solid var(--gold);
    border-right: 2px solid var(--gold);
    pointer-events: none;
  }

  /* ——— CONTACT ——— */
  .contact-section {
    background: var(--ink);
    padding: 120px 0;
    position: relative;
    overflow: hidden;
  }
  .contact-section::after {
    content: '';
    position: absolute;
    bottom: -100px; right: -100px;
    width: 400px; height: 400px;
    border: 1px solid rgba(154, 123, 58, 0.15);
    border-radius: 50%;
    pointer-events: none;
  }
  .contact-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 64px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: start;
    position: relative;
    z-index: 1;
  }
  .contact-left .section-tag { color: var(--gold-light); }
  .contact-left .section-tag::before { background: var(--gold-light); }
  .contact-left .section-title { color: var(--white); margin-top: 20px; }
  .contact-sub {
    font-size: 0.9rem;
    font-weight: 300;
    line-height: 1.85;
    color: var(--sand-light);
    margin-top: 24px;
    max-width: 400px;
  }
  .contact-details {
    margin-top: 48px;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  .contact-row {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
  }
  .contact-row-label {
    font-size: 0.62rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--gold-light);
    min-width: 70px;
    padding-top: 2px;
  }
  .contact-row-value {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.05rem;
    font-weight: 300;
    color: rgba(245,241,234,0.96);
    line-height: 1.55;
  }
  .contact-row-value a { color: inherit; text-decoration: none; transition: color 0.3s; }
  .contact-row-value a:hover { color: var(--gold-light); }

  .contact-form { padding-top: 10px; }
  .form-group { margin-bottom: 24px; }
  .form-group label {
    display: block;
    font-size: 0.62rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--gold-light);
    margin-bottom: 10px;
  }
  .form-group input,
  .form-group textarea,
  .form-group select {
    width: 100%;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.1);
    color: var(--white);
    padding: 14px 18px;
    font-family: 'Jost', sans-serif;
    font-size: 0.88rem;
    font-weight: 300;
    outline: none;
    transition: border-color 0.3s;
    -webkit-appearance: none;
  }
  .form-group input:focus,
  .form-group textarea:focus,
  .form-group select:focus {
    border-color: var(--gold);
  }
  .form-group textarea { resize: none; height: 120px; }
  .form-group select option { background: var(--ink); }
  .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  .btn-submit {
    width: 100%;
    background: var(--gold);
    border: none;
    color: var(--white);
    font-family: 'Jost', sans-serif;
    font-weight: 400;
    font-size: 0.7rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    padding: 16px;
    cursor: none;
    transition: background 0.35s;
  }
  .btn-submit:hover { background: var(--gold-light); }

  /* ——— FOOTER ——— */
  footer {
    background: #141210;
    padding: 60px 0 32px;
  }
  .footer-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 64px;
  }
  .footer-top {
    display: grid;
    grid-template-columns: 1.8fr 1fr 1fr 1fr;
    gap: 48px;
    padding-bottom: 48px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
  }
  .footer-brand {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
    font-weight: 300;
    color: var(--white);
    letter-spacing: 0.08em;
    margin-bottom: 16px;
  }
  .footer-tagline {
    font-size: 0.78rem;
    font-weight: 300;
    line-height: 1.85;
    color: #DCD2BD;
    max-width: 280px;
  }
  .footer-socials {
    display: flex;
    gap: 20px;
    margin-top: 24px;
  }
  .footer-socials a {
    font-size: 0.62rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--gold);
    text-decoration: none;
    transition: color 0.3s;
  }
  .footer-socials a:hover { color: var(--gold-light); }

  .footer-col-title {
    font-family: 'Jost', sans-serif;
    font-size: 0.6rem;
    letter-spacing: 0.36em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 20px;
  }
  .footer-links { list-style: none; display: flex; flex-direction: column; gap: 12px; }
  .footer-links a {
    font-size: 0.82rem;
    font-weight: 300;
    color: #DCD2BD;
    text-decoration: none;
    transition: color 0.3s;
    letter-spacing: 0.04em;
  }
  .footer-links a:hover { color: var(--white); }

  .footer-bottom {
    padding-top: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .footer-copy {
    font-size: 0.72rem;
    font-weight: 300;
    color: rgba(220,210,189,0.75);
    letter-spacing: 0.04em;
  }
  .footer-copy a { color: var(--gold); text-decoration: none; }
  .footer-cert {
    font-size: 0.62rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: rgba(220,210,189,0.75);
  }

  /* ——— ANIMATIONS ——— */
  @keyframes fadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
  }
  @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  @keyframes expandH {
    from { height: 0; }
    to { height: 80px; }
  }
  @keyframes marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
  }

  .reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
  }
  .reveal.visible {
    opacity: 1;
    transform: translateY(0);
  }
  .reveal-delay-1 { transition-delay: 0.1s; }
  .reveal-delay-2 { transition-delay: 0.2s; }
  .reveal-delay-3 { transition-delay: 0.3s; }
  .reveal-delay-4 { transition-delay: 0.4s; }

  /* ——— SCROLL INDICATOR ——— */
  .scroll-indicator {
    position: absolute;
    bottom: 36px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    animation: fadeIn 1.5s ease 2s both;
  }
  .scroll-line {
    width: 1px;
    height: 48px;
    background: linear-gradient(180deg, var(--gold) 0%, transparent 100%);
    animation: scrollPulse 2s ease infinite;
  }
  .scroll-text {
    font-size: 0.55rem;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: var(--mist);
    writing-mode: vertical-rl;
  }
  @keyframes scrollPulse {
    0%, 100% { opacity: 1; transform: scaleY(1); }
    50% { opacity: 0.4; transform: scaleY(0.6); }
  }

  /* ——— MOBILE NAV TOGGLE ——— */
  .nav-mobile-toggle {
    display: none;
    flex-direction: column;
    gap: 5px;
    cursor: none;
    background: none;
    border: none;
    padding: 4px;
  }
  .nav-mobile-toggle span {
    display: block;
    width: 24px; height: 1px;
    background: var(--ink);
    transition: transform 0.3s, opacity 0.3s;
  }

  /* ——— RESPONSIVE ——— */
  @media (max-width: 1100px) {
    .hero { grid-template-columns: 1fr; }
    .hero-left { min-height: 65vh; padding: 120px 40px 60px; }
    .hero-right { padding: 60px 40px 80px; }
    .about-inner { grid-template-columns: 1fr; gap: 60px; }
    .services-grid { grid-template-columns: 1fr 1fr; }
    .process-steps { grid-template-columns: 1fr 1fr; }
    .bento-grid {
      grid-template-columns: 1fr 1fr;
      grid-template-rows: auto;
    }
    .bento-a,.bento-b,.bento-c,.bento-d,.bento-e {
      grid-column: auto; grid-row: auto; height: 220px;
    }
    .bento-d { grid-column: span 2; }
    .heritage-inner { grid-template-columns: 1fr; }
    .heritage-visual { min-height: 300px; }
    .contact-inner { grid-template-columns: 1fr; gap: 60px; }
    .footer-top { grid-template-columns: 1fr 1fr; }
  }

  @media (max-width: 768px) {
    nav { padding: 20px 24px; }
    nav.scrolled { padding: 14px 24px; }
    .nav-links { display: none; }
    .nav-cta { display: none; }
    .nav-mobile-toggle { display: flex; }
    .hero-left { padding: 100px 24px 60px; }
    .hero-right { padding: 48px 24px 60px; }
    .about-inner, .services-inner, .process-inner,
    .heritage-content, .specialities-inner, .csr-inner,
    .contact-inner, .footer-inner { padding: 0 24px; }
    .services-header { grid-template-columns: 1fr; }
    .services-grid { grid-template-columns: 1fr; }
    .process-steps { grid-template-columns: 1fr; }
    .csr-inner { grid-template-columns: 1fr; }
    .footer-top { grid-template-columns: 1fr; }
    .footer-bottom { flex-direction: column; gap: 12px; text-align: center; }
    .hero-stats { gap: 28px; flex-wrap: wrap; }
    .form-row { grid-template-columns: 1fr; }
    body { cursor: auto; }
    .cursor, .cursor-ring { display: none; }
  }

/* ===== Inner-page supplementary styles (cohesive with home) ===== */
.page-hero{
  background:var(--parchment);
  padding:200px 0 110px;
  border-bottom:1px solid var(--parchment-dark);
}
.page-hero-inner{max-width:1320px;margin:0 auto;padding:0 64px;}
.page-hero .section-tag{margin-bottom:24px;}
.page-hero h1{
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:clamp(2.8rem,6vw,5rem);
  line-height:1.05;
  letter-spacing:-0.01em;
  color:var(--ink);
  max-width:16ch;
}
.page-hero .page-lead{
  font-family:'Jost',sans-serif;
  font-weight:300;
  font-size:1.02rem;
  line-height:1.9;
  color:var(--ink-soft);
  max-width:60ch;
  margin-top:30px;
}
.page-section{padding:110px 0;background:var(--white);}
.page-section.alt{background:var(--parchment);}
.page-inner{max-width:1320px;margin:0 auto;padding:0 64px;}
.page-inner.narrow{max-width:880px;}
.prose p{
  font-family:'Jost',sans-serif;font-weight:300;font-size:1rem;
  line-height:1.95;color:var(--ink-soft);margin-bottom:24px;
}
.prose h2{
  font-family:'Cormorant Garamond',serif;font-weight:300;
  font-size:clamp(2rem,3.4vw,3rem);line-height:1.15;color:var(--ink);
  margin:56px 0 22px;letter-spacing:-0.01em;
}
.prose h3{
  font-family:'Cormorant Garamond',serif;font-weight:500;
  font-size:1.5rem;color:var(--ink);margin:40px 0 14px;
}
.feature-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1px;background:var(--parchment-dark);margin-top:64px;
  border:1px solid var(--parchment-dark);
}
.feature-card{background:var(--white);padding:48px 42px;}
.page-section.alt .feature-card{background:var(--parchment);}
.feature-card .fc-num{
  font-family:'Jost',sans-serif;font-weight:300;font-size:0.7rem;
  letter-spacing:0.4em;color:var(--gold);text-transform:uppercase;
}
.feature-card h3{
  font-family:'Cormorant Garamond',serif;font-weight:500;font-size:1.7rem;
  color:var(--ink);margin:18px 0 14px;line-height:1.15;
}
.feature-card p{
  font-family:'Jost',sans-serif;font-weight:300;font-size:0.92rem;
  line-height:1.85;color:var(--ink-soft);
}
.split{
  display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center;
}
.split .split-media{
  width:100%;aspect-ratio:4/5;background:var(--parchment-dark);
  border:1px solid var(--sand);
}
.split.reverse .split-media{order:2;}
.collection-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:40px;margin-top:64px;
}
.collection-item .ci-media{
  width:100%;aspect-ratio:3/4;background:var(--parchment-dark);
  border:1px solid var(--sand);margin-bottom:22px;
}
.collection-item h3{
  font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.6rem;
  color:var(--ink);margin-bottom:10px;
}
.collection-item p{
  font-family:'Jost',sans-serif;font-weight:300;font-size:0.9rem;
  line-height:1.8;color:var(--ink-soft);
}
.contact-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:80px;margin-top:64px;
}
.contact-block h3{
  font-family:'Jost',sans-serif;font-weight:400;font-size:0.72rem;
  letter-spacing:0.32em;text-transform:uppercase;color:var(--gold-light);
  margin-bottom:10px;
}
.contact-block p{
  font-family:'Cormorant Garamond',serif;font-weight:400;font-size:1.4rem;
  color:var(--ink);line-height:1.4;margin-bottom:34px;
}
.page-cta{
  background:var(--ink);padding:120px 0;text-align:center;
}
.page-cta h2{
  font-family:'Cormorant Garamond',serif;font-weight:300;
  font-size:clamp(2.2rem,4vw,3.4rem);color:var(--white);line-height:1.15;
}
.page-cta p{
  font-family:'Jost',sans-serif;font-weight:300;font-size:1rem;
  color:var(--sand-light);margin:22px auto 40px;max-width:52ch;line-height:1.8;
}
@media(max-width:860px){
  .page-hero-inner,.page-inner{padding:0 28px;}
  .page-hero{padding:150px 0 80px;}
  .split,.contact-grid{grid-template-columns:1fr;gap:48px;}
  .split.reverse .split-media{order:0;}
}

/* ——— ADDED COMPONENTS (PHP build) ——— */
.skip-link{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--white);padding:10px 18px;z-index:1000;font-size:0.8rem;letter-spacing:0.1em;text-decoration:none}
.skip-link:focus{left:0}

/* Mobile menu open state */
@media (max-width: 768px) {
  nav.nav-open{background:rgba(245,241,234,0.98);mix-blend-mode:normal}
  nav.nav-open .nav-links{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(245,241,234,0.98);backdrop-filter:blur(12px);padding:24px;gap:20px;border-bottom:1px solid var(--sand)}
  nav.nav-open .nav-mobile-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  nav.nav-open .nav-mobile-toggle span:nth-child(2){opacity:0}
  nav.nav-open .nav-mobile-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
}

/* Footer address */
.footer-address{font-style:normal;font-size:0.78rem;font-weight:300;line-height:1.85;color:#DCD2BD;margin-top:20px}
.footer-address a{color:#DCD2BD;text-decoration:none}
.footer-address a:hover{color:var(--white)}

/* WhatsApp float */
.whatsapp-float{position:fixed;bottom:24px;right:24px;z-index:90;width:54px;height:54px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(0,0,0,0.25);transition:transform 0.25s}
.whatsapp-float:hover{transform:scale(1.08)}

/* Sticky mobile CTA bar */
.mobile-cta-bar{display:none}
@media (max-width: 768px) {
  .mobile-cta-bar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:95}
  .mobile-cta-btn{flex:1;text-align:center;padding:15px 8px;font-family:'Jost',sans-serif;font-size:0.7rem;letter-spacing:0.22em;text-transform:uppercase;text-decoration:none;color:var(--ink);background:var(--parchment);border-top:1px solid var(--sand);min-height:44px}
  .mobile-cta-primary{background:var(--ink);color:var(--white);border-top:1px solid var(--ink)}
  body{padding-bottom:52px}
  .whatsapp-float{bottom:68px}
}

/* FAQ block */
.faq-section{background:var(--white);padding:110px 0}
.page-section.alt + .faq-section, .csr-section + .faq-section{background:var(--parchment)}
.faq-list{margin-top:48px;border-top:1px solid var(--parchment-dark)}
.faq-item{border-bottom:1px solid var(--parchment-dark)}
.faq-item summary{font-family:'Cormorant Garamond',serif;font-size:1.35rem;font-weight:500;color:var(--ink);padding:24px 40px 24px 0;cursor:pointer;list-style:none;position:relative;min-height:44px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';position:absolute;right:8px;top:50%;transform:translateY(-50%);font-family:'Jost',sans-serif;font-weight:200;font-size:1.6rem;color:var(--gold);transition:transform 0.3s}
.faq-item[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq-item p{font-family:'Jost',sans-serif;font-weight:300;font-size:0.95rem;line-height:1.9;color:var(--ink-soft);padding:0 0 28px;max-width:65ch}

/* Specification table */
.spec-table-wrap{margin-top:48px;overflow-x:auto}
.spec-table{width:100%;border-collapse:collapse}
.spec-table th,.spec-table td{text-align:left;padding:18px 22px;border:1px solid var(--parchment-dark);font-family:'Jost',sans-serif;font-weight:300;font-size:0.92rem;line-height:1.7;color:var(--ink-soft)}
.spec-table th{font-weight:400;font-size:0.68rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--gold);background:var(--parchment);white-space:nowrap}

/* Picture elements fill their frames like the imgs they replace */
.about-image-frame picture img,.csr-image-wrap picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bento-card picture,.heritage-visual picture{display:block;width:100%;height:100%}
.bento-card picture img,.heritage-visual picture img{width:100%;height:100%;object-fit:cover}
.ci-media img,.split-media img{width:100%;height:100%;object-fit:cover;display:block}
.hp-field{display:none}
.csr-link{margin-top:36px;display:inline-block}
.form-feedback{font-family:'Jost',sans-serif;font-weight:300;font-size:0.9rem;line-height:1.7;padding:14px 18px;margin-bottom:24px;border:1px solid}
.form-success{color:#9BD49B;border-color:rgba(155,212,155,0.4);background:rgba(42,106,42,0.15)}
.form-error{color:#E8A0A0;border-color:rgba(232,160,160,0.4);background:rgba(120,40,40,0.15)}