:root {
  --lily-gold: #a9905f;
  --lily-gold-light: #d8c59a;
  --lily-gold-pale: #efe4c8;
  --lily-ink: #171512;
  --lily-heading-color: #171512;
  --lily-body-color: #171512;
  --lily-muted: #6e6658;
  --lily-paper: #fff;
  --lily-canvas: #f3f1ed;
  --lily-placeholder: #b19a6b;
  --lily-button-bg: #171512;
  --lily-button-text: #fff;
  --lily-button-secondary-bg: #fff;
  --lily-button-secondary-text: #171512;
  --lily-button-secondary-border: #171512;
  --lily-line: rgba(23,21,18,.12);
  --lily-radius: 1.35rem;
  --lily-shadow: 0 24px 80px rgba(38,31,20,.09);
  --lily-font: "Avenir Next", "Trebuchet MS", Arial, sans-serif;
  --lily-heading-font: "Avenir Next", "Segoe UI", Arial, sans-serif;
  --lily-body-font: "Avenir Next", "Segoe UI", Arial, sans-serif;
  --lily-button-radius: 999px;
  --lily-reveal-duration: 650ms;
  --lily-reveal-distance: 24px;
  --lily-reveal-stagger: 90ms;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--lily-body-color); background: var(--lily-paper); font-family: var(--lily-body-font); font-size: 16px; line-height: 1.6; }
h1,h2,h3,h4,h5,h6 { color: var(--lily-heading-color); font-family: var(--lily-heading-font); }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: .25em; }
button,input,textarea,select { font: inherit; }
button,a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--lily-gold); outline-offset: 4px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 9999; padding: .8rem 1rem; background: var(--lily-ink); color: #fff; }
.skip-link:focus { top: 1rem; }
.lily-container { width: min(1280px, calc(100% - 2.5rem)); margin-inline: auto; }
.narrow-copy { max-width: 880px; }
.site-main { overflow: clip; }
.lily-grid-bg { background-image: linear-gradient(to right, transparent calc(25% - .5px), var(--lily-line) 25%, transparent calc(25% + .5px)), linear-gradient(to right, transparent calc(50% - .5px), var(--lily-line) 50%, transparent calc(50% + .5px)), linear-gradient(to right, transparent calc(75% - .5px), var(--lily-line) 75%, transparent calc(75% + .5px)); }
.site-header { position: sticky; top: 0; z-index: 100; background: var(--lily-paper); border-bottom: 1px solid var(--lily-line); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.site-header__inner { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.site-brand { display: inline-flex; align-items: center; width: 190px; }
.site-brand img { width: 100%; height: auto; }
.primary-nav { display: flex; align-items: center; gap: 2rem; }
.primary-nav .menu { display: flex; align-items: center; gap: 1.8rem; list-style: none; margin: 0; padding: 0; }
.primary-nav a { text-decoration: none; font-weight: 700; font-size: .86rem; letter-spacing: .06em; text-transform: uppercase; }
.primary-nav a:hover { color: var(--lily-gold); }
.primary-nav__client { padding: .85rem 1.15rem; border: 1px solid var(--lily-gold); border-radius: var(--lily-button-radius); }
.nav-toggle { display: none; background: transparent; border: 0; width: 46px; padding: .5rem; }
.nav-toggle > span:not(.screen-reader-text) { display: block; height: 2px; background: var(--lily-ink); margin: 6px 0; }
.home-hero { padding: clamp(4rem,8vw,8rem) 0 0; overflow: hidden; background-color: var(--lily-paper); background-image: radial-gradient(circle at 35% 25%, rgba(239,228,200,.65), transparent 38%), radial-gradient(circle at 70% 30%, rgba(216,197,154,.28), transparent 35%), linear-gradient(to right, transparent calc(20% - .5px), rgba(23,21,18,.08) 20%, transparent calc(20% + .5px)), linear-gradient(to right, transparent calc(40% - .5px), rgba(23,21,18,.08) 40%, transparent calc(40% + .5px)), linear-gradient(to right, transparent calc(60% - .5px), rgba(23,21,18,.08) 60%, transparent calc(60% + .5px)), linear-gradient(to right, transparent calc(80% - .5px), rgba(23,21,18,.08) 80%, transparent calc(80% + .5px)); }
.home-hero__copy { position: relative; z-index: 5; max-width: 1080px; text-align: center; }
.eyebrow { margin: 0 0 1rem; color: var(--lily-gold); font-size: .78rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.home-hero h1,.page-hero h1 { margin: 0; font-size: clamp(3rem,8vw,7.2rem); line-height: .95; letter-spacing: -.055em; }
.home-hero__copy > p:not(.eyebrow) { max-width: 760px; margin: 2rem auto 0; color: var(--lily-muted); font-size: clamp(1rem,2vw,1.25rem); }
.button-row { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; margin-top: 2rem; }
.lily-button { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; padding: .8rem 1.35rem; border: 1px solid var(--lily-button-bg); border-radius: var(--lily-button-radius); background: var(--lily-button-bg); color: var(--lily-button-text); text-decoration: none; font-weight: 800; cursor: pointer; transition: transform .2s ease, background .2s ease, color .2s ease; }
.lily-button:hover { transform: translateY(-2px); background: var(--lily-gold); border-color: var(--lily-gold); }
.lily-button--ghost { background: var(--lily-button-secondary-bg); color: var(--lily-button-secondary-text); border-color: var(--lily-button-secondary-border); }
/* Marquee hero: track berbaris horizontal digerakkan JS (requestAnimationFrame)
   agar berjalan mulus & pasti di semua perangkat, tidak bergantung pada CSS
   animation yang bisa dimatikan oleh pengaturan sistem atau optimasi cache. */
.hero-showcase { position: relative; width: 100%; margin-top: clamp(2.5rem,6vw,5.5rem); isolation: isolate; }
.hero-showcase::after { content: ""; position: absolute; z-index: 8; inset: auto 0 0; height: 16%; pointer-events: none; background: linear-gradient(to bottom, transparent, var(--lily-paper) 82%, var(--lily-paper)); }
.hero-showcase__viewport { position: relative; width: 100%; overflow: hidden; perspective: 1200px; perspective-origin: 50% 50%; height: clamp(360px,42vw,560px); }
.hero-showcase__track { position: absolute; inset: 0; top:0; left:0; right:0; bottom:0; display: block; width: 100%; height: 100%; transform-style: preserve-3d; }
/* Setiap foto dimiringkan pada sumbu Y sesuai posisinya terhadap tengah layar,
   menghasilkan efek "dinding foto" tiga dimensi yang mengalir. */
/* Mode langkah: setiap foto diposisikan relatif terhadap foto aktif sehingga
   foto terbesar SELALU tepat di tengah halaman. */
.hero-showcase__slide { position: absolute; top: 50%; left: 50%; width: clamp(210px,23vw,330px); margin-left: calc(clamp(210px,23vw,330px) / -2); margin-top: calc(clamp(210px,23vw,330px) * -0.625); will-change: transform, opacity; backface-visibility: hidden; transform-origin: 50% 50%; transition: transform .95s cubic-bezier(.22,.61,.36,1), opacity .95s ease; }
.hero-showcase__media { display: block; width: 100%; box-shadow: 0 30px 80px rgba(38,31,20,.22); border-radius: clamp(.75rem,1.2vw,1.25rem); }
.hero-showcase__media::after { border-color: rgba(255,255,255,.3); }
.lily-media-slot { position: relative; overflow: hidden; aspect-ratio: var(--lily-ratio,4/3); margin: 0; border-radius: var(--lily-radius); background: var(--lily-placeholder,#b19a6b); }
.lily-media-slot::after { content: ""; position: absolute; inset: 0; pointer-events: none; border: 1px solid rgba(255,255,255,.25); border-radius: inherit; }
.lily-media-slot__image { width: 100%; height: 100%; object-fit: cover; }
.section { padding: clamp(5rem,9vw,9rem) 0; }
.section-title { margin: 0; max-width: 920px; font-size: clamp(2.4rem,5.5vw,5.4rem); line-height: 1; letter-spacing: -.05em; }
.service-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 2rem; margin-top: 4rem; }
.service-card { display: grid; grid-template-columns: 1.25fr .75fr; min-height: 360px; background: var(--lily-paper); border: 1px solid var(--lily-line); border-radius: var(--lily-radius); overflow: hidden; }
.service-card__media { border-radius: 0; height: 100%; aspect-ratio: auto; }
.service-card__body { padding: 2.2rem; display: flex; flex-direction: column; justify-content: flex-end; }
.service-card__body > span { color: var(--lily-gold); font-size: .78rem; letter-spacing: .15em; }
.service-card h3 { margin: .75rem 0; font-size: clamp(1.6rem,3vw,2.6rem); line-height: 1.05; }
.service-card p { margin: 0; color: var(--lily-muted); }
.editorial-copy { font-family: Georgia,"Times New Roman",serif; font-size: clamp(1.18rem,2.2vw,1.65rem); line-height: 1.7; color: #3e382f; }
.editorial-copy p:first-child { margin-top: 0; }
.section-split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(3rem,8vw,8rem); align-items: start; }
.why-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--lily-line); }
.why-list li { display: grid; grid-template-columns: 70px 1fr; gap: 1rem; padding: 1.4rem 0; border-bottom: 1px solid var(--lily-line); font-size: clamp(1.2rem,2vw,1.8rem); font-weight: 700; }
.why-list span { color: var(--lily-gold); font-size: .8rem; letter-spacing: .1em; }
.section-heading-row { display: flex; gap: 2rem; align-items: end; justify-content: space-between; margin-bottom: 3rem; }
.section-heading-row > a { white-space: nowrap; font-weight: 800; }
.portfolio-grid { columns: 3; column-gap: 1.3rem; }
.portfolio-card { break-inside: avoid; margin: 0 0 1.3rem; position: relative; overflow: hidden; border-radius: 1rem; background: var(--lily-canvas); }
.portfolio-card img { width: 100%; }
.portfolio-card__overlay { position: absolute; inset: auto 0 0; padding: 4rem 1.4rem 1.3rem; background: linear-gradient(transparent,rgba(0,0,0,.72)); color: white; }
.portfolio-card__overlay h3 { margin: 0; font-size: 1.4rem; }
.portfolio-card__overlay p { margin: .35rem 0 0; font-size: .9rem; }
.portfolio-card a::after { content:""; position:absolute; inset:0; }
.testimonial-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 1.4rem; margin-top: 3rem; }
.testimonial-card { padding: 2rem; background: var(--lily-paper); border: 1px solid var(--lily-line); border-radius: var(--lily-radius); }
.testimonial-card blockquote { margin: 0 0 1.5rem; font-family: Georgia,serif; font-size: 1.25rem; }
.testimonial-card__person { display: flex; align-items: center; gap: .9rem; }
.testimonial-card__avatar { width: 56px; aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: var(--lily-gold-light); }
.contact-cta { display: grid; grid-template-columns: 1fr .9fr; gap: 2rem; align-items: center; padding: clamp(2rem,5vw,5rem); border-radius: 2rem; background: var(--lily-gold-pale); }
.contact-cta h2 { font-size: clamp(2.2rem,5vw,4.8rem); line-height: 1; margin: 0; }
.contact-cta__media { grid-row: span 2; }
.contact-cta .lily-button { width: max-content; }
.page-hero { position: relative; isolation: isolate; display: flex; align-items: center; min-height: clamp(420px,58vw,680px); padding: clamp(5rem,10vw,10rem) 0; overflow: hidden; background-color: var(--lily-canvas); }
.page-hero__media,.page-hero__shade { position: absolute; inset: 0; }
.page-hero__media { z-index: -3; background: var(--lily-placeholder); }
.page-hero__image { width: 100%; height: 100%; object-fit: cover; transform: scale(1.002); }
.page-hero__shade { z-index: -2; background: linear-gradient(90deg,rgba(12,10,8,.72) 0%,rgba(12,10,8,.48) 42%,rgba(12,10,8,.16) 76%,rgba(12,10,8,.24) 100%); }
.page-hero__content { position: relative; z-index: 1; }
.page-hero p:not(.eyebrow) { max-width: 700px; color: var(--lily-muted); font-size: 1.15rem; }
.page-hero--has-image { background-image: none; }
.page-hero--has-image h1,.page-hero--has-image .eyebrow,.page-hero--has-image p:not(.eyebrow) { color: #fff; text-shadow: 0 2px 28px rgba(0,0,0,.34); }
.page-hero--has-image .eyebrow { color: var(--lily-gold-light); }
.page-hero--has-image .page-hero__content { max-width: 1120px; }
.about-composition { display: grid; grid-template-columns: 1.1fr .55fr 1fr; gap: 2rem; align-items: center; }
.about-composition__secondary { align-self: end; transform: translateY(4rem); }
.about-composition__copy { padding-left: 2rem; }
.center-cta { text-align: center; }
.center-cta h2 { max-width: 800px; margin: 0 auto 2rem; font-size: clamp(2rem,5vw,4.8rem); line-height: 1.05; }
.contact-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2rem,8vw,7rem); align-items: start; }
.lily-form { display: grid; gap: 1.2rem; }
.lily-form label { display: grid; gap: .5rem; font-weight: 800; }
.lily-form input,.lily-form textarea,.lily-form select { width: 100%; padding: .95rem 1rem; border: 1px solid #bdb5a8; border-radius: .75rem; background: #fff; color: var(--lily-ink); }
.lily-form small { font-weight: 400; color: var(--lily-muted); }
.lily-hp { position: absolute !important; left: -9999px !important; }
.project-meta { display: grid; grid-template-columns: repeat(4,1fr); gap: 1rem; margin-top: 3rem; }
.project-meta div { padding-top: 1rem; border-top: 1px solid var(--lily-line); }
.project-meta dt { color: var(--lily-gold); font-size: .75rem; text-transform: uppercase; letter-spacing: .12em; }
.project-meta dd { margin: .4rem 0 0; }
.project-gallery { columns: 3; column-gap: 1rem; margin-top: 4rem; }
.project-gallery figure { break-inside: avoid; margin: 0 0 1rem; }
.project-nav { display: flex; justify-content: space-between; gap: 1rem; padding-block: 2rem; border-block: 1px solid var(--lily-line); }
.post-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 2rem; }
.entry-card { border: 1px solid var(--lily-line); border-radius: var(--lily-radius); padding: 1.4rem; }
.entry-card h2 { line-height: 1.15; }
.article-single { max-width: 850px; }
.article-single > h1 { font-size: clamp(2.6rem,6vw,5.8rem); line-height: 1; }
.empty-notice { padding: 2rem; border: 1px dashed var(--lily-gold); border-radius: 1rem; color: var(--lily-muted); }
.site-footer { padding: 5rem 0 2rem; background: var(--lily-ink); color: #f7f2e8; }
.site-footer__grid { display: grid; grid-template-columns: 1.4fr .7fr .7fr; gap: 3rem; }
.site-footer__logo { width: 220px; filter: brightness(1.45); }
.site-footer h2 { color: var(--lily-gold-light); font-size: .85rem; letter-spacing: .15em; text-transform: uppercase; }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer__bottom { margin-top: 4rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.15); font-size: .85rem; color: #bfb8ad; }
/* Subtle viewport reveals. Elements remain visible until JavaScript adds lily-motion-ready. */
.lily-animations-enabled.lily-motion-ready [data-lily-reveal] {
  opacity: 0;
  transition-property: opacity, transform;
  transition-duration: var(--lily-reveal-duration);
  transition-timing-function: cubic-bezier(.22,.61,.36,1);
  transition-delay: calc(var(--lily-reveal-index,0) * var(--lily-reveal-stagger));
  will-change: opacity, transform;
}
.lily-animations-enabled.lily-motion-ready.lily-animation-fade-up [data-lily-reveal] { transform: translate3d(0,var(--lily-reveal-distance),0); }
.lily-animations-enabled.lily-motion-ready.lily-animation-fade-scale [data-lily-reveal] { transform: translate3d(0,calc(var(--lily-reveal-distance) * .55),0) scale(.975); }
.lily-animations-enabled.lily-motion-ready.lily-animation-fade-in [data-lily-reveal] { transform: none; }
.lily-animations-enabled.lily-motion-ready [data-lily-reveal].is-visible { opacity: 1; transform: none; }
.home-hero__copy > * { transition-delay: calc(var(--lily-reveal-index,0) * 90ms); }
.portfolio-card,.service-card,.testimonial-card,.contact-cta { transition-property: transform, box-shadow; transition-duration: .25s; }
@media (hover:hover) {
  .portfolio-card:hover,.service-card:hover,.testimonial-card:hover { transform: translateY(-4px); box-shadow: var(--lily-shadow); }
  .contact-cta--full:hover { transform: none; box-shadow: none; }
}
@media (max-width: 1000px) {
  .nav-toggle { display: block; }
  .primary-nav { position: absolute; top: 100%; left: 0; right: 0; display: none; padding: 1.5rem; background: #fff; border-bottom: 1px solid var(--lily-line); }
  .primary-nav.is-open { display: grid; }
  .primary-nav .menu { display: grid; gap: 1rem; }
  .hero-showcase__slide { width: clamp(230px,35vw,350px); margin-left: calc(clamp(230px,35vw,350px) / -2); margin-top: calc(clamp(230px,35vw,350px) * -0.625); }
  .service-card { grid-template-columns: 1fr; }
  .service-card__media { aspect-ratio: 9/16; }
  .about-composition { grid-template-columns: 1fr 1fr; }
  .about-composition__copy { grid-column: 1/-1; padding-left: 0; }
  .project-meta { grid-template-columns: repeat(2,1fr); }
  .portfolio-grid,.project-gallery { columns: 2; }
}
@media (max-width: 760px) {
  .lily-container { width: min(100% - 1.5rem, 1280px); }
  .site-header__inner { min-height: 72px; }
  .site-brand { width: 150px; }
  .home-hero { padding-top: 4rem; }
  .home-hero h1,.page-hero h1 { font-size: clamp(2.8rem,14vw,5rem); }
  .page-hero { min-height: clamp(440px,120vw,620px); align-items: flex-end; padding-bottom: 4.5rem; }
  .page-hero__shade { background: linear-gradient(180deg,rgba(12,10,8,.16) 0%,rgba(12,10,8,.42) 48%,rgba(12,10,8,.78) 100%); }
  .hero-showcase__slide { width: min(72vw,310px); margin-left: calc(min(72vw,310px) / -2); margin-top: calc(min(72vw,310px) * -0.625); }
  .section { padding: 4.5rem 0; }
  .service-grid,.section-split,.testimonial-list,.contact-layout,.contact-cta,.site-footer__grid,.post-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 0; }
  .section-heading-row { align-items: start; flex-direction: column; }
  .about-composition { grid-template-columns: 1fr 1fr; gap: .75rem; }
  .about-composition__secondary { transform: translateY(2rem); }
  .contact-cta__media { grid-row: auto; }
  .contact-cta .lily-button { width: 100%; }
  .portfolio-grid,.project-gallery { columns: 2; column-gap: .75rem; }
  .portfolio-card,.project-gallery figure { margin-bottom: .75rem; }
  .project-meta { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 380px) {
  .portfolio-grid,.project-gallery { columns: 1; }
  .hero-showcase__slide { width: min(76vw,290px); margin-left: calc(min(76vw,290px) / -2); margin-top: calc(min(76vw,290px) * -0.625); }
  .button-row { flex-direction: column; }
  .lily-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
.portfolio-filters{display:flex;flex-wrap:wrap;gap:.7rem;margin-bottom:2rem}.portfolio-filters a,.works-pagination a{padding:.65rem 1rem;border:1px solid var(--lily-line);border-radius:999px;text-decoration:none}.works-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;margin-top:2.5rem}.works-pagination a.current{background:var(--lily-ink);color:#fff}.youtube-lite{aspect-ratio:16/9;display:grid;place-items:center;margin:3rem 0;background:var(--lily-ink);border-radius:var(--lily-radius);overflow:hidden}.youtube-lite button{padding:1rem 1.4rem;border:1px solid #fff;border-radius:999px;background:transparent;color:#fff;font:inherit;font-weight:800;cursor:pointer}.youtube-lite iframe{width:100%;height:100%;border:0}

/* Contact WhatsApp action */
.lily-contact-whatsapp{width:100%;display:flex;align-items:center;justify-content:center;gap:.6rem}
.lily-contact-whatsapp .lily-wa-icon{width:1.35rem;height:1.35rem;flex:0 0 auto;fill:currentColor}

/* 1.5.2 — preserve source image proportions and visual sharpness */
.portfolio-card__image,.portfolio-card img,.project-gallery__image,.project-gallery img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;image-rendering:auto}.portfolio-card{background:#f4f1eb}.project-gallery figure{overflow:hidden;background:#f7f5f1;border-radius:.75rem}.project-gallery figure img{margin:0 auto}.lily-media-slot__image,.page-hero__image{image-rendering:auto}

/* 1.5.3 — non-destructive visual crop and higher-density responsive imagery */
.lily-media-slot__image,.page-hero__image{object-position:var(--lily-crop-x,50%) var(--lily-crop-y,50%);transform:scale(var(--lily-crop-zoom,1));transform-origin:var(--lily-crop-x,50%) var(--lily-crop-y,50%);will-change:transform,object-position}.page-hero__media,.lily-media-slot{isolation:isolate}.testimonial-card__person{margin-bottom:1.1rem}.testimonial-card blockquote{margin:0}.testimonial-card__avatar img{width:100%;height:100%;object-fit:cover}.portfolio-card__image,.project-gallery__image{image-rendering:auto}
@media(max-width:760px){.lily-media-slot__image,.page-hero__image{object-position:var(--lily-crop-mobile-x,var(--lily-crop-x,50%)) var(--lily-crop-mobile-y,var(--lily-crop-y,50%));transform:scale(var(--lily-crop-mobile-zoom,var(--lily-crop-zoom,1)));transform-origin:var(--lily-crop-mobile-x,var(--lily-crop-x,50%)) var(--lily-crop-mobile-y,var(--lily-crop-y,50%))}}

/* 1.5.4 — readable portfolio overlays and contact form without side image */
.portfolio-card__overlay{padding:5.5rem 1.45rem 1.4rem;background:linear-gradient(180deg,rgba(80,59,20,0) 0%,rgba(91,68,27,.58) 42%,rgba(49,35,12,.96) 100%);color:#fff}
.portfolio-card__overlay h3{margin:0;color:#fff;font-size:clamp(1.15rem,2vw,1.55rem);line-height:1.18;text-shadow:0 2px 18px rgba(0,0,0,.28)}
.portfolio-card__overlay h3 a{color:#fff!important;text-decoration:none}
.portfolio-grid--count-1{column-count:1;width:100%;max-width:620px;margin-inline:auto}
.portfolio-grid--count-2{column-count:2;width:100%;max-width:1040px;margin-inline:auto}
.contact-layout--form-only{display:block;max-width:900px;margin-inline:auto}
.lily-form--contact{padding:clamp(24px,5vw,56px);border:1px solid rgba(169,144,95,.28);border-radius:clamp(20px,3vw,36px);background:linear-gradient(180deg,#fff 0%,#fdfbf7 100%);box-shadow:0 24px 70px rgba(63,48,22,.07)}
.section--contact-form{background:#fff}
@media(max-width:760px){
  .portfolio-grid--count-2{column-count:2}
  .lily-form--contact{padding:24px 18px}
}
@media(max-width:380px){.portfolio-grid--count-2{column-count:1}}

/* 1.5.5 — responsive Our Works masonry, centered gold overlay, and device page sizes */
.portfolio-browser{width:100%}
.portfolio-grid--archive{column-count:4;column-gap:1rem}
.portfolio-grid--archive.portfolio-grid--archive-count-1{column-count:1;max-width:320px;margin-inline:auto}
.portfolio-grid--archive.portfolio-grid--archive-count-2{column-count:2;max-width:660px;margin-inline:auto}
.portfolio-grid--archive.portfolio-grid--archive-count-3{column-count:3;max-width:980px;margin-inline:auto}
.portfolio-grid--archive .portfolio-card{margin-bottom:1rem;border-radius:.8rem;background:#eee8dc;box-shadow:0 8px 24px rgba(45,34,15,.06);transform:translateZ(0)}
.portfolio-card__link{position:relative;display:block;overflow:hidden;color:#fff;text-decoration:none;border-radius:inherit}
.portfolio-card__link::after{content:none}
.portfolio-grid--archive .portfolio-card__image{display:block;width:100%;height:auto;transition:transform .42s cubic-bezier(.22,.61,.36,1),filter .42s ease}
.portfolio-card__placeholder{display:block;width:100%;aspect-ratio:4/5}
.portfolio-grid--archive .portfolio-card__overlay{position:absolute;inset:0;display:grid;place-items:center;padding:1rem;background:linear-gradient(180deg,rgba(169,144,95,.08),rgba(95,69,22,.32));color:#fff;transition:background-color .32s ease,background .32s ease,opacity .32s ease}
.portfolio-grid--archive .portfolio-card__overlay h3{max-width:88%;margin:0;padding:.62rem .85rem;border:1px solid rgba(255,255,255,.42);border-radius:.45rem;background:rgba(31,23,8,.48);color:#fff;font-size:clamp(.92rem,1.35vw,1.2rem);line-height:1.2;text-align:center;text-shadow:0 2px 14px rgba(0,0,0,.28);transition:transform .32s ease,background-color .32s ease,border-color .32s ease}
.portfolio-responsive-pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:.55rem;margin-top:2.3rem}
.portfolio-responsive-pagination[hidden]{display:none}
.portfolio-page-button{min-width:42px;min-height:42px;padding:.62rem .85rem;border:1px solid var(--lily-line);border-radius:999px;background:#fff;color:var(--lily-ink);font:inherit;font-weight:750;cursor:pointer;transition:transform .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease}
.portfolio-page-button:hover:not(:disabled),.portfolio-page-button:focus-visible{transform:translateY(-2px);border-color:var(--lily-gold);outline:none}
.portfolio-page-button.is-current{background:var(--lily-gold);border-color:var(--lily-gold);color:#fff}
.portfolio-page-button:disabled{opacity:.42;cursor:not-allowed}
[data-responsive-portfolio]:not(.is-pager-ready) .portfolio-card:nth-child(n+21){display:none}

@media(hover:hover) and (pointer:fine){
  .portfolio-grid--archive .portfolio-card:hover{transform:translateY(-4px);box-shadow:0 16px 38px rgba(70,50,15,.15)}
  .portfolio-grid--archive .portfolio-card:hover .portfolio-card__image,.portfolio-grid--archive .portfolio-card:focus-within .portfolio-card__image{transform:scale(1.035);filter:saturate(.92)}
  .portfolio-grid--archive .portfolio-card:hover .portfolio-card__overlay,.portfolio-grid--archive .portfolio-card:focus-within .portfolio-card__overlay{background:rgba(169,144,95,.72)}
  .portfolio-grid--archive .portfolio-card:hover .portfolio-card__overlay h3,.portfolio-grid--archive .portfolio-card:focus-within .portfolio-card__overlay h3{transform:translateY(-2px);background:rgba(52,37,9,.12);border-color:rgba(255,255,255,.72)}
}

@media(max-width:1199px){
  .portfolio-grid--archive{column-count:3;column-gap:.9rem}
  .portfolio-grid--archive.portfolio-grid--archive-count-1{column-count:1;max-width:320px}
  .portfolio-grid--archive.portfolio-grid--archive-count-2{column-count:2;max-width:660px}
  .portfolio-grid--archive .portfolio-card{margin-bottom:.9rem}
  [data-responsive-portfolio]:not(.is-pager-ready) .portfolio-card:nth-child(n+16){display:none}
}

@media(max-width:767px){
  .portfolio-grid--archive,.portfolio-grid--archive.portfolio-grid--archive-count-2,.portfolio-grid--archive.portfolio-grid--archive-count-3{column-count:2;column-gap:.7rem;max-width:none}
  .portfolio-grid--archive.portfolio-grid--archive-count-1{column-count:1;max-width:300px}
  .portfolio-grid--archive .portfolio-card{margin-bottom:.7rem;border-radius:.65rem}
  .portfolio-grid--archive .portfolio-card__overlay{background:linear-gradient(180deg,rgba(169,144,95,.18),rgba(88,62,16,.46));padding:.6rem}
  .portfolio-grid--archive .portfolio-card__overlay h3{max-width:94%;padding:.48rem .58rem;font-size:clamp(.78rem,3.7vw,.98rem);background:rgba(31,23,8,.5)}
  [data-responsive-portfolio]:not(.is-pager-ready) .portfolio-card:nth-child(n+11){display:none}
  .portfolio-page-button{min-width:38px;min-height:38px;padding:.52rem .7rem;font-size:.88rem}
}

@media(prefers-reduced-motion:reduce){
  .portfolio-grid--archive .portfolio-card,.portfolio-grid--archive .portfolio-card__image,.portfolio-grid--archive .portfolio-card__overlay,.portfolio-grid--archive .portfolio-card__overlay h3,.portfolio-page-button{transition:none!important;transform:none!important}
}

/* 1.6.0 — responsive portfolio masonry, seamless testimonials, project photo viewer */
.portfolio-browser{width:100%}
.portfolio-grid{column-gap:clamp(.65rem,1.1vw,1rem)}
.portfolio-grid--home{column-count:3}
.portfolio-grid--archive{column-count:5}
.portfolio-card{break-inside:avoid;margin:0 0 clamp(.65rem,1.1vw,1rem);border-radius:.75rem;overflow:hidden;background:#eee8dc;box-shadow:0 8px 22px rgba(54,40,15,.055);transition:transform .32s cubic-bezier(.22,.61,.36,1),box-shadow .32s ease}
.portfolio-card__link{position:relative;display:block;overflow:hidden;border-radius:inherit;color:#fff;text-decoration:none}
.portfolio-card__image,.portfolio-card__placeholder{display:block;width:100%;height:auto;transition:transform .42s cubic-bezier(.22,.61,.36,1),filter .42s ease}
.portfolio-card__overlay{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-start;padding:clamp(.72rem,1.2vw,1.05rem);background:linear-gradient(180deg,rgba(96,70,20,.03) 32%,rgba(83,58,13,.72) 100%);color:#fff;transition:background .34s ease,align-items .34s ease,justify-content .34s ease}
.portfolio-card__overlay h3{max-width:94%;margin:0;color:#fff;font-size:clamp(.78rem,1.1vw,1.08rem);line-height:1.18;text-align:left;text-shadow:0 2px 16px rgba(0,0,0,.34);transform:translate3d(0,0,0);transition:transform .34s ease,font-size .34s ease,text-align .34s ease}
.portfolio-responsive-pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:.55rem;margin-top:2.2rem}
.portfolio-responsive-pagination[hidden]{display:none}
.portfolio-page-button{min-width:42px;min-height:42px;border:1px solid rgba(169,144,95,.42);border-radius:999px;background:#fff;color:var(--lily-heading-color);cursor:pointer;font:inherit;font-weight:750}
.portfolio-page-button.is-current{background:var(--lily-gold);border-color:var(--lily-gold);color:#fff}
.portfolio-page-button:disabled{opacity:.38;cursor:not-allowed}
[data-responsive-portfolio]:not(.is-pager-ready) .portfolio-card:nth-child(n+21){display:none}
@media(hover:hover) and (pointer:fine){
  .portfolio-card:hover,.portfolio-card:focus-within{transform:translateY(-3px);box-shadow:0 16px 38px rgba(70,50,15,.14)}
  .portfolio-card:hover .portfolio-card__image,.portfolio-card:focus-within .portfolio-card__image{transform:scale(1.025);filter:saturate(.96)}
  .portfolio-card:hover .portfolio-card__overlay,.portfolio-card:focus-within .portfolio-card__overlay{align-items:center;justify-content:center;background:rgba(169,144,95,.72)}
  .portfolio-card:hover .portfolio-card__overlay h3,.portfolio-card:focus-within .portfolio-card__overlay h3{text-align:center;transform:translateY(-1px);font-size:clamp(.88rem,1.22vw,1.15rem)}
}
@media(max-width:1399px){.portfolio-grid--archive{column-count:4}}
@media(max-width:1199px){
  .portfolio-grid--home,.portfolio-grid--archive{column-count:3}
  [data-responsive-portfolio]:not(.is-pager-ready) .portfolio-card:nth-child(n+16){display:none}
}
@media(max-width:767px){
  .portfolio-grid--home,.portfolio-grid--archive{column-count:2;column-gap:.65rem}
  .portfolio-card{margin-bottom:.65rem;border-radius:.62rem}
  .portfolio-card__overlay{padding:.65rem;background:linear-gradient(180deg,rgba(169,144,95,.08) 28%,rgba(77,53,12,.72) 100%)}
  .portfolio-card__overlay h3{font-size:clamp(.72rem,3.45vw,.92rem)}
  [data-responsive-portfolio]:not(.is-pager-ready) .portfolio-card:nth-child(n+11){display:none}
}

.home-testimonial-ticker{--ticker-gap:18px;position:relative;width:100%;overflow:hidden;margin-top:2.2rem}
.home-testimonial-ticker::before,.home-testimonial-ticker::after{content:"";position:absolute;top:0;bottom:0;width:5%;z-index:2;pointer-events:none}
.home-testimonial-ticker::before{left:0;background:linear-gradient(90deg,var(--lily-paper),transparent)}
.home-testimonial-ticker::after{right:0;background:linear-gradient(270deg,var(--lily-paper),transparent)}
.testimonial-ticker__track{display:flex;width:-moz-max-content;width:max-content;will-change:transform;animation:lily-theme-testimonial-marquee var(--ticker-duration,55s) linear infinite}
.home-testimonial-ticker.is-js-ticker .testimonial-ticker__track{animation:none!important}
.testimonial-ticker__group{display:flex;gap:var(--ticker-gap);padding-right:var(--ticker-gap)}
.testimonial-ticker__card{flex:0 0 min(var(--ticker-card-desktop,340px),82vw);min-height:160px;padding:1rem;border:1px solid rgba(169,144,95,.26);border-radius:18px;background:var(--lily-paper);box-shadow:0 12px 30px rgba(73,54,20,.055)}
.testimonial-ticker__identity{display:flex;align-items:center;gap:.75rem;color:#79623c}
.testimonial-ticker__avatar{display:block;flex:0 0 46px;width:46px;height:46px;overflow:hidden;border-radius:50%;background:var(--lily-gold-light)}
.testimonial-ticker__avatar img{width:100%;height:100%;object-fit:cover}
.testimonial-ticker__card blockquote{margin:.9rem 0 0;color:var(--lily-muted);font-family:inherit;font-size:.92rem;line-height:1.55}
.testimonial-ticker__card blockquote p{margin:.4rem 0}
.testimonial-ticker--pause:hover .testimonial-ticker__track,.testimonial-ticker--pause:focus-within .testimonial-ticker__track{animation-play-state:paused}
@keyframes lily-theme-testimonial-marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media(max-width:1199px){.testimonial-ticker__card{flex-basis:min(var(--ticker-card-tablet,280px),78vw)}}
@media(max-width:767px){
  .home-testimonial-ticker{--ticker-gap:13px;width:calc(100% + 2rem);margin-inline:-1rem}
  .testimonial-ticker__card{flex-basis:min(var(--ticker-card-mobile,235px),75vw);min-height:145px;padding:.9rem;border-radius:15px}
  .testimonial-ticker__avatar{flex-basis:40px;width:40px;height:40px}
  .testimonial-ticker__card blockquote{font-size:.84rem}
}

.project-gallery{columns:3;column-gap:1rem;margin-top:4rem}
.project-gallery figure{break-inside:avoid;margin:0 0 1rem;overflow:hidden;border-radius:.75rem;background:#f7f5f1}
.project-gallery__open{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in;overflow:hidden;border-radius:inherit}
.project-gallery__image{display:block;width:100%;height:auto;transition:transform .3s cubic-bezier(.22,.61,.36,1),filter .3s ease}
@media(hover:hover) and (pointer:fine){.project-gallery__open:hover .project-gallery__image,.project-gallery__open:focus-visible .project-gallery__image{transform:scale(1.012);filter:brightness(1.015)}}
.project-lightbox[hidden]{display:none}
.project-lightbox{position:fixed;z-index:99999;inset:0;display:grid;grid-template-columns:1fr;place-items:center;background:rgba(10,9,7,.96);color:#fff;overscroll-behavior:contain}
.project-lightbox figure{grid-column:1;display:flex;flex-direction:column;align-items:center;justify-content:center;justify-self:center;align-self:center;width:100%;max-width:100%;max-height:100vh;margin:0;padding:clamp(18px,3vw,42px) clamp(56px,8vw,110px);box-sizing:border-box;text-align:center}
.project-lightbox img{display:block;max-width:min(90vw,1600px);max-height:88vh;width:auto;height:auto;margin-inline:auto;object-fit:contain;-webkit-user-select:none;user-select:none}
.project-lightbox figcaption{max-width:min(86vw,900px);margin-top:.7rem;color:rgba(255,255,255,.74);font-size:.84rem;text-align:center}
.project-lightbox__close,.project-lightbox__nav{position:absolute;border:1px solid rgba(255,255,255,.28);background:rgba(26,23,18,.55);color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.project-lightbox__close{top:18px;right:18px;width:48px;height:48px;border-radius:50%;font-size:2rem;line-height:1}
.project-lightbox__nav{top:50%;transform:translateY(-50%);width:56px;height:72px;border-radius:999px;font-size:3rem;line-height:.7}
.project-lightbox__nav--prev{left:16px}.project-lightbox__nav--next{right:16px}
.project-lightbox__counter{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);padding:.35rem .72rem;border-radius:999px;background:rgba(0,0,0,.42);font-size:.78rem}
body.is-lightbox-open{overflow:hidden}
@media(max-width:900px){.project-gallery{columns:2}.project-lightbox{grid-template-columns:1fr}.project-lightbox__nav{width:46px;height:60px;font-size:2.5rem}.project-lightbox__nav--prev{left:8px}.project-lightbox__nav--next{right:8px}.project-lightbox__close{top:10px;right:10px;width:44px;height:44px}}
@media(max-width:520px){.project-gallery{columns:2;column-gap:.65rem}.project-gallery figure{margin-bottom:.65rem}.project-lightbox figure{padding:16px 8px}.project-lightbox img{max-width:100vw;max-height:82vh}.project-lightbox figcaption{display:none}}
@media(prefers-reduced-motion:reduce){
  .testimonial-ticker__track{animation:none}
  .home-testimonial-ticker{overflow:hidden}
  .portfolio-card,.portfolio-card__image,.portfolio-card__overlay,.portfolio-card__overlay h3,.project-gallery__image{transition:none!important;transform:none!important}
}

/* 1.6.1 - subtle portfolio overlay and public image download deterrence */
.portfolio-card__overlay,
.portfolio-grid--archive .portfolio-card__overlay,
.portfolio-grid--home .portfolio-card__overlay{
  position:absolute;
  inset:0;
  display:flex;
  align-items:flex-end;
  justify-content:flex-start;
  padding:clamp(.7rem,1.15vw,1.05rem);
  background:linear-gradient(180deg,rgba(169,144,95,0) 0%,rgba(169,144,95,0) 72%,rgba(169,144,95,.10) 100%);
  transition:background .34s ease,align-items .34s ease,justify-content .34s ease;
}
.portfolio-card__overlay h3,
.portfolio-grid--archive .portfolio-card__overlay h3,
.portfolio-grid--home .portfolio-card__overlay h3{
  max-width:94%;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#fff;
  font-size:clamp(.78rem,1.1vw,1.08rem);
  line-height:1.18;
  text-align:left;
  text-shadow:0 2px 14px rgba(0,0,0,.72),0 1px 3px rgba(0,0,0,.55);
  transform:translate3d(0,0,0);
  transition:transform .34s ease,font-size .34s ease,text-align .34s ease;
}
@media(hover:hover) and (pointer:fine){
  .portfolio-card:hover .portfolio-card__overlay,
  .portfolio-card:focus-within .portfolio-card__overlay,
  .portfolio-grid--archive .portfolio-card:hover .portfolio-card__overlay,
  .portfolio-grid--archive .portfolio-card:focus-within .portfolio-card__overlay{
    align-items:center;
    justify-content:center;
    background:rgba(169,144,95,.20);
  }
  .portfolio-card:hover .portfolio-card__overlay h3,
  .portfolio-card:focus-within .portfolio-card__overlay h3,
  .portfolio-grid--archive .portfolio-card:hover .portfolio-card__overlay h3,
  .portfolio-grid--archive .portfolio-card:focus-within .portfolio-card__overlay h3{
    padding:0;
    border:0;
    background:transparent;
    text-align:center;
    transform:translateY(-1px);
  }
}
.lily-site img,.lily-site [data-protected-media]{-webkit-user-drag:none;user-drag:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}

/* --------------------------------------------------------------------------
   Lily Graduation 1.0.1 stability layer
   These final rules intentionally come last to prevent older cached/legacy
   selectors from changing hero crop ratios or portfolio title placement.
   -------------------------------------------------------------------------- */


/* Frontend root isolation. The theme owns the frontend canvas, so stale block
   theme/grid rules must never split pages into columns or constrain width. */
html{width:100%!important;max-width:none!important;min-width:0!important;margin:0!important;padding:0!important;display:block!important;grid-template-columns:none!important;grid-template-rows:none!important;overflow-x:clip!important}
body.lily-site{width:100%!important;max-width:none!important;min-width:0!important;margin:0!important;padding:0!important;display:block!important;grid-template-columns:none!important;grid-template-rows:none!important;overflow-x:clip!important}
body.lily-site .site-main{width:100%!important;max-width:none!important;min-width:0!important;margin:0!important;display:block!important}

/* Page hero keeps one desktop ratio at every desktop/window width. Only the
   dedicated mobile breakpoint changes to the mobile crop/ratio. */
.page-hero{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  aspect-ratio:16 / 6.2!important;
  padding:0!important;
  display:grid!important;
  align-items:center;
  overflow:hidden;
}
.page-hero__media,.page-hero__shade{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important}
.page-hero__image{
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:cover!important;
  object-position:var(--lily-crop-x,50%) var(--lily-crop-y,50%)!important;
  transform:scale(var(--lily-crop-zoom,1))!important;
  transform-origin:var(--lily-crop-x,50%) var(--lily-crop-y,50%)!important;
}
.page-hero__content{width:min(1280px,calc(100% - 2.5rem));max-width:1280px;padding-block:clamp(2.5rem,5vw,5.75rem)}
.page-hero h1{max-width:1080px;font-size:clamp(2.7rem,6.35vw,7.1rem);line-height:.95}
.page-hero p:not(.eyebrow){max-width:720px;margin-bottom:0}

/* Home showcase frames always remain 4:5 and use the crop saved in dashboard. */
.hero-showcase__slide{aspect-ratio:4/5}
.hero-showcase__media{width:100%;height:100%;aspect-ratio:4/5}
.hero-showcase__media .lily-media-slot__image{width:100%;height:100%;object-fit:cover}

/* Portfolio title: no box/background. Normal state is lower-left with only a
   subtle 10% bottom tint. Hover/focus uses a full 20% gold veil and centers it. */
.portfolio-card__overlay,
.portfolio-grid--archive .portfolio-card__overlay,
.portfolio-grid--home .portfolio-card__overlay{
  position:absolute!important;
  inset:0!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:flex-start!important;
  padding:clamp(.7rem,1.15vw,1.05rem)!important;
  background:linear-gradient(180deg,rgba(169,144,95,0) 0%,rgba(169,144,95,0) 82%,rgba(169,144,95,.10) 100%)!important;
  color:#fff!important;
  pointer-events:none;
  transition:background .34s ease,align-items .34s ease,justify-content .34s ease!important;
}
.portfolio-card__overlay h3,
.portfolio-grid--archive .portfolio-card__overlay h3,
.portfolio-grid--home .portfolio-card__overlay h3,
.portfolio-card__overlay h3 a{
  max-width:94%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#fff!important;
  font-size:clamp(.78rem,1.1vw,1.08rem)!important;
  line-height:1.18!important;
  text-align:left!important;
  text-decoration:none!important;
  text-shadow:0 2px 14px rgba(0,0,0,.78),0 1px 3px rgba(0,0,0,.60)!important;
  transform:translate3d(0,0,0)!important;
  transition:transform .34s ease,font-size .34s ease,text-align .34s ease!important;
}
@media(hover:hover) and (pointer:fine){
  .portfolio-card:hover .portfolio-card__overlay,
  .portfolio-card:focus-within .portfolio-card__overlay,
  .portfolio-grid--archive .portfolio-card:hover .portfolio-card__overlay,
  .portfolio-grid--archive .portfolio-card:focus-within .portfolio-card__overlay,
  .portfolio-grid--home .portfolio-card:hover .portfolio-card__overlay,
  .portfolio-grid--home .portfolio-card:focus-within .portfolio-card__overlay{
    align-items:center!important;
    justify-content:center!important;
    background:rgba(169,144,95,.20)!important;
  }
  .portfolio-card:hover .portfolio-card__overlay h3,
  .portfolio-card:focus-within .portfolio-card__overlay h3,
  .portfolio-grid--archive .portfolio-card:hover .portfolio-card__overlay h3,
  .portfolio-grid--archive .portfolio-card:focus-within .portfolio-card__overlay h3,
  .portfolio-grid--home .portfolio-card:hover .portfolio-card__overlay h3,
  .portfolio-grid--home .portfolio-card:focus-within .portfolio-card__overlay h3{
    text-align:center!important;
    transform:translateY(-1px)!important;
  }
}

@media(max-width:1100px) and (min-width:761px){
  .page-hero h1{font-size:clamp(2.55rem,6.2vw,4.7rem)}
  .page-hero__content{padding-block:clamp(2rem,4vw,3.5rem)}
}
@media(max-width:760px){
  .page-hero{
    aspect-ratio:4 / 5!important;
    min-height:0!important;
    height:auto!important;
    align-items:flex-end;
    padding:0;
  }
  .page-hero__content{width:calc(100% - 2rem);padding-block:3rem 3.75rem}
  .page-hero h1{font-size:clamp(2.45rem,12vw,4.5rem)}
  .page-hero__image{
    object-position:var(--lily-crop-mobile-x,var(--lily-crop-x,50%)) var(--lily-crop-mobile-y,var(--lily-crop-y,50%))!important;
    transform:scale(var(--lily-crop-mobile-zoom,var(--lily-crop-zoom,1)))!important;
    transform-origin:var(--lily-crop-mobile-x,var(--lily-crop-x,50%)) var(--lily-crop-mobile-y,var(--lily-crop-y,50%))!important;
  }
  .portfolio-card__overlay,
  .portfolio-grid--archive .portfolio-card__overlay,
  .portfolio-grid--home .portfolio-card__overlay{
    padding:.65rem!important;
    background:linear-gradient(180deg,rgba(169,144,95,0) 0%,rgba(169,144,95,0) 78%,rgba(169,144,95,.10) 100%)!important;
  }
  .portfolio-card__overlay h3,
  .portfolio-grid--archive .portfolio-card__overlay h3,
  .portfolio-grid--home .portfolio-card__overlay h3{font-size:clamp(.72rem,3.45vw,.92rem)!important}
}

/* --------------------------------------------------------------------------
   1.0.6 — Blog portal, article editor output, and exact page-hero crop ratio
   -------------------------------------------------------------------------- */
.blog-hero{padding:clamp(5rem,9vw,9rem) 0;background:linear-gradient(135deg,#fff 0%,#fbf7ee 56%,#e8d8b4 100%)}
.blog-hero__inner{max-width:980px}.blog-hero h1{margin:.25rem 0 1rem;font-size:clamp(3.2rem,8vw,7.4rem);line-height:.9;letter-spacing:-.055em;color:var(--lily-heading-color)}.blog-hero p:last-child{max-width:720px;margin:0;color:var(--lily-muted);font-size:clamp(1rem,1.5vw,1.2rem)}
.blog-portal__section{background:#fff}.blog-portal__layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:clamp(2rem,5vw,5rem);align-items:start}.blog-section-title{margin-bottom:2rem}.blog-section-title h2{margin:.3rem 0 0;font-size:clamp(2rem,4vw,3.6rem);line-height:1}
.blog-feed__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1rem,2.2vw,1.8rem)}.blog-card{min-width:0;border:1px solid rgba(169,144,95,.24);border-radius:1.1rem;overflow:hidden;background:#fff;box-shadow:0 14px 42px rgba(66,48,17,.06);transition:transform .28s ease,box-shadow .28s ease}.blog-card--featured{grid-column:1/-1}.blog-card__link{display:grid;height:100%;color:inherit;text-decoration:none}.blog-card--featured .blog-card__link{grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr)}.blog-card__media,.blog-single__media,.blog-related-card__media{position:relative;display:block;width:100%;margin:0;overflow:hidden;background:linear-gradient(135deg,#f6f0e3,#c7ac73);aspect-ratio:16/10;isolation:isolate}.blog-card__image{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--lily-crop-x,50%) var(--lily-crop-y,50%);transform:scale(var(--lily-crop-zoom,1));transform-origin:var(--lily-crop-x,50%) var(--lily-crop-y,50%);transition:transform .45s cubic-bezier(.22,.61,.36,1)}.blog-card__placeholder{position:absolute;inset:0;background:linear-gradient(135deg,#fff 0%,#efe2c5 50%,#ad9057 100%)}.blog-card__body{display:flex;min-width:0;flex-direction:column;padding:clamp(1rem,2.4vw,1.8rem)}.blog-card__meta{display:flex;flex-wrap:wrap;gap:.5rem 1rem;color:#927849;font-size:.74rem;font-weight:750;letter-spacing:.05em;text-transform:uppercase}.blog-card h2{margin:.9rem 0 .7rem;font-size:clamp(1.25rem,2vw,2rem);line-height:1.08}.blog-card p{margin:0;color:var(--lily-muted)}.blog-card__read{margin-top:auto;padding-top:1.2rem;color:#7d6332;font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}@media(hover:hover){.blog-card:hover{transform:translateY(-4px);box-shadow:0 22px 54px rgba(66,48,17,.12)}.blog-card:hover .blog-card__image{transform:scale(calc(var(--lily-crop-zoom,1) * 1.018))}}
.blog-sidebar{position:sticky;top:110px;display:grid;gap:1rem}.blog-widget{padding:1.35rem;border:1px solid rgba(169,144,95,.25);border-radius:1rem;background:linear-gradient(180deg,#fff,#fdfaf4)}.blog-widget h2{margin:0 0 1rem;font-size:1.15rem}.blog-widget h3{font-size:.92rem}.blog-popular-list{margin:0;padding:0;list-style:none;counter-reset:popular}.blog-popular-list li{counter-increment:popular;border-top:1px solid rgba(169,144,95,.2)}.blog-popular-list li:first-child{border-top:0}.blog-popular-list a{position:relative;display:grid;gap:.25rem;padding:.8rem 0 .8rem 2rem;color:inherit;text-decoration:none}.blog-popular-list a::before{content:counter(popular,decimal-leading-zero);position:absolute;left:0;top:.82rem;color:var(--lily-gold);font-size:.72rem;font-weight:900}.blog-popular-list span{font-weight:750;line-height:1.3}.blog-popular-list small{color:var(--lily-muted)}.blog-category-list{display:grid;gap:.45rem;margin:0;padding:0;list-style:none}.blog-category-list a{display:flex;justify-content:space-between;gap:1rem;padding:.62rem .75rem;border-radius:.65rem;background:#fff;color:inherit;text-decoration:none}.blog-category-list b{color:var(--lily-gold)}.blog-tag-filter{display:grid;gap:.65rem}.blog-tag-filter label{font-size:.8rem;font-weight:800}.blog-tag-filter select{width:100%;min-height:44px;padding:.55rem;border:1px solid var(--lily-line);border-radius:.6rem;background:#fff}.blog-tag-filter .lily-button{min-height:42px}.blog-tag-results{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--lily-line)}.blog-tag-results ul{margin:0;padding-left:1.1rem}.blog-tag-results li{margin:.45rem 0}.blog-tag-results a{color:inherit}.blog-widget__empty{color:var(--lily-muted);font-size:.88rem}.blog-pagination{margin-top:2.5rem}.blog-pagination .nav-links{display:flex;flex-wrap:wrap;gap:.45rem}.blog-pagination a,.blog-pagination span{display:inline-grid;min-width:42px;min-height:42px;place-items:center;padding:.5rem .75rem;border:1px solid var(--lily-line);border-radius:999px;text-decoration:none}.blog-pagination .current{background:var(--lily-gold);border-color:var(--lily-gold);color:#fff}.blog-empty{grid-column:1/-1;display:grid;min-height:420px;place-items:center;align-content:center;gap:.85rem;padding:3rem;border-radius:1.5rem;background:linear-gradient(145deg,#fff 0%,#fff 40%,#f6edd8 75%,#c5a66b 140%);text-align:center}.blog-empty .dashicons{width:52px;height:52px;color:var(--lily-gold);font-size:52px}.blog-empty h2{margin:0;color:#8a7040;font-size:clamp(1.5rem,4vw,2.8rem)}
.blog-single{max-width:960px;padding-top:clamp(4rem,8vw,8rem);padding-bottom:clamp(4rem,7vw,7rem)}.blog-single__header{text-align:center}.blog-single__meta{display:flex;justify-content:center;gap:1rem;color:#907647;font-size:.8rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.blog-single h1{max-width:920px;margin:1rem auto;font-size:clamp(2.7rem,6.5vw,6.2rem);line-height:.94;letter-spacing:-.05em}.blog-single__categories a,.blog-single__tags a{color:#846a39}.blog-single__media{margin:clamp(2rem,5vw,4rem) 0;aspect-ratio:16/10;border-radius:1.25rem}.blog-single__media .blog-card__image{width:100%;height:100%}.blog-single__content{max-width:790px;margin-inline:auto;font-size:clamp(1rem,1.2vw,1.12rem);line-height:1.82}.blog-single__content img{height:auto;border-radius:.65rem}.blog-single__content h2,.blog-single__content h3{margin-top:2em}.blog-single__tags{max-width:790px;margin:2.5rem auto 0;padding-top:1.5rem;border-top:1px solid var(--lily-line)}.blog-related{background:var(--lily-canvas)}.blog-related h2{margin:.25rem 0 2rem;font-size:clamp(2rem,4vw,3.5rem)}.blog-related__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}.blog-related-card{overflow:hidden;border-radius:1rem;background:#fff}.blog-related-card a{color:inherit;text-decoration:none}.blog-related-card h3{margin:0;padding:1rem;font-size:1rem;line-height:1.3}.blog-related-card__media{aspect-ratio:16/10}.blog-related-card__media .blog-card__image{width:100%;height:100%}
@media(max-width:980px){.blog-portal__layout{grid-template-columns:1fr}.blog-sidebar{position:static;grid-template-columns:repeat(3,minmax(0,1fr))}.blog-card--featured .blog-card__link{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.blog-feed__grid{grid-template-columns:1fr}.blog-card--featured .blog-card__link{grid-template-columns:1fr}.blog-sidebar{grid-template-columns:1fr}.blog-related__grid{grid-template-columns:1fr}.blog-card__image{object-position:var(--lily-crop-mobile-x,var(--lily-crop-x,50%)) var(--lily-crop-mobile-y,var(--lily-crop-y,50%));transform:scale(var(--lily-crop-mobile-zoom,var(--lily-crop-zoom,1)));transform-origin:var(--lily-crop-mobile-x,var(--lily-crop-x,50%)) var(--lily-crop-mobile-y,var(--lily-crop-y,50%))}}

/* Public page hero is 16:6.2 on desktop/tablet and 4:5 on phones. These values
   exactly match the dashboard crop preview in Lily Core 1.0.6. */
.page-hero{aspect-ratio:16 / 6.2!important}
@media(max-width:760px){.page-hero{aspect-ratio:4 / 5!important}}

/* Dashboard crop ratios and public frames use the same values. */
.contact-cta__media{height:auto!important;aspect-ratio:16/10!important}
/* Our Services: kartu foto & video memakai rasio 9:16 yang sama di semua perangkat. */
.service-card__media{height:auto!important;aspect-ratio:9/16!important}
.blog-empty__mark{display:grid;width:52px;height:52px;place-items:center;color:var(--lily-gold);font-size:44px;line-height:1}
.lily-text-underline{text-decoration:underline}
.blog-portal__layout.is-empty{display:block}.blog-portal__layout.is-empty .blog-feed{width:100%}.blog-portal__layout.is-empty .blog-section-title{display:none}

/* --------------------------------------------------------------------------
   1.0.6 — Our Services media fills the card on desktop. Dashboard crop ratio:
   desktop 15:16, mobile/tablet stacked card 16:10.
   -------------------------------------------------------------------------- */
@media(min-width:1001px){
  /* Media 9:16 (portrait) — kolom media dibuat lebih sempit agar tinggi kartu
     tetap proporsional dan teks punya ruang baca yang cukup. */
  .service-card{
    grid-template-columns:9fr 11fr!important;
    min-height:0!important;
    aspect-ratio:auto!important;
    align-items:stretch!important;
  }
  .service-card__media{
    align-self:stretch!important;
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
    aspect-ratio:9 / 16!important;
    border-radius:0!important;
  }
  .service-card__media .lily-media-slot__image{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
}
@media(max-width:1000px){
  .service-card{
    aspect-ratio:auto!important;
  }
  .service-card__media{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:9 / 16!important;
  }
}
@media(max-width:1000px){
  .service-card__media .lily-media-slot__image{
    object-position:var(--lily-crop-mobile-x,var(--lily-crop-x,50%)) var(--lily-crop-mobile-y,var(--lily-crop-y,50%))!important;
    transform:scale(var(--lily-crop-mobile-zoom,var(--lily-crop-zoom,1)))!important;
    transform-origin:var(--lily-crop-mobile-x,var(--lily-crop-x,50%)) var(--lily-crop-mobile-y,var(--lily-crop-y,50%))!important;
  }
}


/* 1.0.6 — stable mobile form controls without disabling pinch zoom. */
.lily-form label{min-width:0}
.lily-form input:not([type="checkbox"]),.lily-form select,.lily-form textarea{
  display:block;width:100%;min-width:0;min-height:54px;font-size:16px;line-height:1.35;touch-action:manipulation;
}
.lily-form input[type="date"],.lily-form input[type="time"],.lily-form select{height:54px}
.lily-form input[type="checkbox"]{appearance:auto;-webkit-appearance:checkbox;width:20px;height:20px;min-width:20px;min-height:20px;padding:0;border-radius:3px;accent-color:var(--lily-gold)}
.lily-form-errors{padding:.85rem 1rem;border:1px solid #c86b65;border-radius:.75rem;background:#fff0ef;color:#7e211c;font-weight:750}
@media(max-width:820px){input,select,textarea{font-size:16px!important}}

/* 1.0.12 — Contact submission and responsive form safeguards. */
.lily-form--contact,.lily-form--contact *{box-sizing:border-box}
.lily-form--contact input,.lily-form--contact select,.lily-form--contact textarea{max-width:100%;min-width:0}
.lily-form--contact button[aria-busy=true]{cursor:wait;opacity:.72}
.lily-form--contact :is(button,input,select,textarea):focus-visible{outline:3px solid currentColor;outline-offset:3px}
@media(max-width:700px){.lily-form--contact .lily-contact-whatsapp{width:100%;min-height:48px;display:inline-flex;align-items:center;justify-content:center;text-align:center}}

/* ===== Our Services: Graduation Video (looping, muted) ===== */
/* Video memakai .service-card__media agar rasio & crop identik foto (15/16
   desktop, 16/10 mobile). iframe/video mengisi penuh bingkai. */
.service-card__video{position:relative;overflow:hidden}
.service-card__video-native{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#000}
.service-card__video-frame{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover;pointer-events:none;transform:scale(1.35)}
.service-card__video-thumb{position:absolute;inset:0;z-index:2;width:100%;height:100%;transition:opacity .6s ease}
.service-card__video-thumb.is-hidden{opacity:0;pointer-events:none}
.service-card__video-thumb img{width:100%;height:100%;object-fit:cover}

/* ===== Kompatibilitas lintas-perangkat & browser (1.0.24) ===== */
@supports not (aspect-ratio: 1 / 1) {
  .hero-showcase__slide{height:0;padding-bottom:125%;overflow:hidden}
  .hero-showcase__media{position:absolute;top:0;left:0;width:100%;height:100%}
  .service-card__media{height:0;padding-bottom:177.78%;position:relative;overflow:hidden}
  .service-card__media .lily-media-slot__image,
  .service-card__video-native,
  .service-card__video-frame,
  .service-card__video-thumb{position:absolute;top:0;left:0;width:100%;height:100%}
}
/* Sasaran sentuh minimal & pencegahan zoom otomatis iOS pada form. */
@media (max-width:820px){
  .site-nav a,.lily-button,button{min-height:44px}
  input,select,textarea{font-size:16px}
}

/* ===== 1.0.24 — Header 3 kolom & latar animatif (palet Lily) ===== */
.site-header__inner{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(1rem,3vw,2.5rem)}
.site-header__actions{display:flex;align-items:center;gap:.85rem;justify-self:end}
.primary-nav__client--inline{display:none}
@media(min-width:1001px){
  .primary-nav{justify-self:center}
  .primary-nav ul{display:flex;align-items:center;gap:clamp(1rem,2.4vw,2.4rem);margin:0;padding:0;list-style:none}
  .primary-nav a{position:relative;text-decoration:none;letter-spacing:.08em;text-transform:uppercase;font-size:.82rem;font-weight:700}
  .primary-nav ul a::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1.5px;background:var(--lily-gold,#a9905f);transition:right .28s ease}
  .primary-nav ul a:hover::after,.primary-nav ul a:focus-visible::after{right:0}
  .site-header__login{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 1.35rem;border:1px solid var(--lily-gold,#a9905f);border-radius:999px;text-decoration:none;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;transition:background .25s ease,color .25s ease}
  .site-header__login:hover{background:var(--lily-gold,#a9905f);color:#fff}
  .nav-toggle{display:none}
}
@media(max-width:1000px){
  .site-header__inner{grid-template-columns:auto auto;justify-content:space-between}
  .site-header__login{display:none}
  .primary-nav__client--inline{display:inline-flex}
}

/* Latar animatif lembut: gumpalan warna Lily yang bergerak perlahan. */
.lily-ambient{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.lily-ambient span{position:absolute;display:block;border-radius:50%;filter:blur(60px);opacity:.5;will-change:transform}
.lily-ambient span:nth-child(1){width:46vw;height:46vw;left:-8vw;top:-12vw;background:radial-gradient(circle at 30% 30%,#efe0bd,#f6efe0 60%,transparent 70%);animation:lily-drift-a 26s ease-in-out infinite}
.lily-ambient span:nth-child(2){width:38vw;height:38vw;right:-6vw;top:-6vw;background:radial-gradient(circle at 60% 40%,#f3dcd2,#faf2ea 60%,transparent 70%);animation:lily-drift-b 32s ease-in-out infinite}
.lily-ambient span:nth-child(3){width:42vw;height:42vw;left:28vw;bottom:-18vw;background:radial-gradient(circle at 50% 50%,#e8dfc9,#f7f3e8 62%,transparent 72%);animation:lily-drift-c 38s ease-in-out infinite}
@keyframes lily-drift-a{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(4vw,3vw,0) scale(1.08)}}
@keyframes lily-drift-b{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-5vw,4vw,0) scale(1.12)}}
@keyframes lily-drift-c{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(3vw,-4vw,0) scale(1.06)}}
/* Sorotan lembut mengikuti kursor (hanya perangkat berpenunjuk presisi). */
.hero,.section--hero,.site-main>section:first-child{position:relative;z-index:1}

/* ===== Cahaya yang melintasi garis latar (elemen nyata, tanpa mask) =====
   Teknik mask sebelumnya sering diabaikan peramban sehingga cahaya tidak
   terlihat. Versi ini memakai elemen sungguhan pada tiap garis, sehingga
   berkas cahaya pasti tampil dan berulang tanpa henti di semua peramban. */
.lily-grid-bg{position:relative;isolation:isolate}
.lily-grid-bg>*:not(.lily-ambient):not(.lily-lightlines){position:relative;z-index:1}
.lily-lightlines{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.lily-lightlines i{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;overflow:hidden}
.lily-lightlines i:nth-child(1){left:25%}
.lily-lightlines i:nth-child(2){left:50%}
.lily-lightlines i:nth-child(3){left:75%}
.lily-lightlines i::after{
  content:"";position:absolute;left:0;right:0;top:0;height:24%;
  background:linear-gradient(180deg,rgba(169,144,95,0) 0%,rgba(199,169,106,.85) 45%,rgba(233,209,158,1) 55%,rgba(169,144,95,0) 100%);
  box-shadow:0 0 14px rgba(199,169,106,.75);
  animation:lily-beam 5.2s linear infinite;
}
.lily-lightlines i:nth-child(2)::after{animation-duration:6.4s;animation-delay:-2.1s}
.lily-lightlines i:nth-child(3)::after{animation-duration:4.6s;animation-delay:-3.4s}
@keyframes lily-beam{
  0%{transform:translateY(-130%)}
  100%{transform:translateY(520%)}
}
@media(prefers-reduced-motion:reduce){ .lily-lightlines{display:none} }

/* ===== 1.0.25b — Contact CTA lebar penuh dengan foto latar ===== */
.section--contact-cta{padding-inline:0}
.contact-cta--full{position:relative;display:grid;grid-template-columns:1fr!important;align-items:center;width:100%;min-height:clamp(430px,50vw,660px);border-radius:0;padding:0;overflow:hidden;background:var(--lily-gold-pale)}
.contact-cta__bg{position:absolute!important;inset:0;width:100%;height:100%;aspect-ratio:auto!important;border-radius:0;margin:0}
.contact-cta__bg .lily-media-slot__image,.contact-cta__bg img{width:100%;height:100%;object-fit:cover}
.contact-cta__scrim{position:absolute;inset:0;background:linear-gradient(100deg,rgba(24,20,14,.78) 0%,rgba(24,20,14,.55) 42%,rgba(24,20,14,.18) 72%,rgba(24,20,14,.05) 100%)}
.contact-cta__content{position:relative;z-index:2;display:grid;gap:1.1rem;justify-items:start;max-width:min(760px,92%);padding-block:clamp(2.5rem,6vw,5rem);color:#fff}
.contact-cta__content .eyebrow{color:#e6cf9c}
.contact-cta__content h2{margin:0;color:#fff;font-size:clamp(2.2rem,5.4vw,4.6rem);line-height:1.02}
.contact-cta__content p{margin:0;color:rgba(255,255,255,.9);max-width:52ch}
.contact-cta__content .lily-button{margin-top:.5rem;background:#fff;color:var(--lily-ink,#171512);border-color:#fff}
.contact-cta__content .lily-button:hover{background:var(--lily-gold,#a9905f);border-color:var(--lily-gold,#a9905f);color:#fff}
@media(max-width:700px){
  .contact-cta--full{min-height:clamp(380px,92vw,520px)}
  .contact-cta__scrim{background:linear-gradient(180deg,rgba(24,20,14,.35) 0%,rgba(24,20,14,.72) 55%,rgba(24,20,14,.86) 100%)}
  .contact-cta__content{max-width:100%;justify-items:start}
}

/* ===== 1.0.25b — Header minimalis ===== */
.site-header{border-bottom:1px solid rgba(169,144,95,.16);background:rgba(255,255,255,.82)}
.site-header__inner{min-height:74px;padding-block:.55rem}
.site-brand img{width:auto;height:clamp(38px,4.4vw,52px)}
@media(min-width:1001px){
  .primary-nav ul{gap:clamp(1.1rem,2.6vw,2.6rem)}
  .primary-nav a{font-size:.74rem;letter-spacing:.14em;font-weight:600;color:var(--lily-ink,#171512);opacity:.82;transition:opacity .2s ease}
  .primary-nav a:hover{opacity:1}
  .primary-nav ul a::after{bottom:-7px;height:1px;background:var(--lily-ink,#171512)}
  /* Client Login: tautan halus, bukan tombol besar. */
  .site-header__login{min-height:36px;padding:0 .1rem;border:0;border-radius:0;font-size:.74rem;letter-spacing:.14em;font-weight:600;opacity:.82;position:relative}
  .site-header__login::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:1px;background:var(--lily-gold,#a9905f);transform:scaleX(0);transform-origin:right;transition:transform .28s ease}
  .site-header__login:hover{background:transparent;color:var(--lily-ink,#171512);opacity:1}
  .site-header__login:hover::after{transform:scaleX(1);transform-origin:left}
}

/* ===== 1.0.25b — Kursor estetik (pengganti sorotan besar) ===== */
.lily-cursor,.lily-cursor-dot{position:fixed;top:0;left:0;z-index:99998;pointer-events:none;opacity:0;transition:opacity .25s ease}
.lily-cursor{width:34px;height:34px;margin:-17px 0 0 -17px;border:1.5px solid var(--lily-gold,#a9905f);border-radius:50%;transition:opacity .25s ease,width .22s ease,height .22s ease,margin .22s ease,background .22s ease,border-color .22s ease}
.lily-cursor-dot{width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--lily-ink,#171512)}
.lily-cursor.is-visible,.lily-cursor-dot.is-visible{opacity:1}
/* Saat menyentuh tautan/tombol: lingkaran membesar & terisi lembut. */
.lily-cursor.is-active{width:56px;height:56px;margin:-28px 0 0 -28px;background:rgba(169,144,95,.16);border-color:var(--lily-gold,#a9905f)}
.lily-cursor-dot.is-active{opacity:0}
html.lily-has-cursor,html.lily-has-cursor *{cursor:none!important}
@media(hover:none),(pointer:coarse){.lily-cursor,.lily-cursor-dot{display:none}html.lily-has-cursor,html.lily-has-cursor *{cursor:auto!important}}
@media(prefers-reduced-motion:reduce){.lily-cursor{transition:opacity .2s ease}}

/* Crop khusus HP untuk foto latar Contact (mengikuti tab HP pada Edit Crop). */
@media(max-width:1000px){
  .contact-cta__bg .lily-media-slot__image{
    object-position:var(--lily-crop-mobile-x,var(--lily-crop-x,50%)) var(--lily-crop-mobile-y,var(--lily-crop-y,50%))!important;
    transform:scale(var(--lily-crop-mobile-zoom,var(--lily-crop-zoom,1)))!important;
    transform-origin:var(--lily-crop-mobile-x,var(--lily-crop-x,50%)) var(--lily-crop-mobile-y,var(--lily-crop-y,50%))!important;
  }
}

/* ===== Header menyatu di puncak halaman, tampil saat digulir ===== */
.site-header{background:transparent;border-bottom:1px solid transparent;-webkit-backdrop-filter:none;backdrop-filter:none;transition:background .35s ease,border-color .35s ease,transform .35s ease,opacity .35s ease,box-shadow .35s ease}
.site-header.is-stuck{background:rgba(255,255,255,.9);border-bottom-color:rgba(169,144,95,.18);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 8px 30px rgba(60,48,26,.06)}
.site-header.is-hidden{transform:translateY(-100%);opacity:0;pointer-events:none}

/* ===== Footer: busur cahaya, brand di tengah, menu kiri, sosial kanan ===== */
.site-footer{position:relative;overflow:hidden;background:#191712;color:#efe7d8;padding:clamp(4rem,9vw,7.5rem) 0 clamp(1.5rem,3vw,2.5rem)}
.site-footer__arc{position:absolute;left:50%;bottom:0;width:min(680px,46%);transform:translateX(-50%);pointer-events:none;z-index:0}
.site-footer__arc svg{display:block;width:100%;height:auto;overflow:visible}
.site-footer__arc-base{fill:none;stroke:rgba(199,169,106,.28);stroke-width:1.2}
.site-footer__arc-beam{fill:none;stroke:url(#lilyArcGlow);stroke-width:2.4;stroke-linecap:round;
  stroke-dasharray:520 2140;stroke-dashoffset:2660;
  animation:lily-arc-run 7s linear infinite;filter:drop-shadow(0 0 6px rgba(233,209,158,.7))}
@keyframes lily-arc-run{from{stroke-dashoffset:2660}to{stroke-dashoffset:0}}

.site-footer__inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr minmax(280px,46%) 1fr;align-items:center;gap:clamp(1.5rem,4vw,3rem)}
.site-footer__menu ul{display:grid;gap:.85rem;margin:0;padding:0;list-style:none}
.site-footer__menu a{color:#efe7d8;text-decoration:none;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;opacity:.78;transition:opacity .2s ease,color .2s ease}
.site-footer__menu a:hover{opacity:1;color:#e9d19e}
.site-footer__brand{display:grid;justify-items:center;text-align:center;gap:.9rem}
.site-footer__logo{width:auto;height:clamp(56px,7vw,84px);filter:brightness(0) invert(1) sepia(.35) saturate(1.4) hue-rotate(3deg);opacity:.95}
.site-footer__tagline{margin:0;max-width:34ch;color:rgba(239,231,216,.72);font-size:.95rem;line-height:1.55}
.site-footer__side{display:grid;justify-items:end;gap:1rem;text-align:right}
.site-footer__social{display:grid;gap:.85rem;margin:0;padding:0;list-style:none}
.site-footer__social a{color:#efe7d8;text-decoration:none;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;opacity:.78;transition:opacity .2s ease,color .2s ease}
.site-footer__social a:hover{opacity:1;color:#e9d19e}
.site-footer__login{display:inline-block;color:#efe7d8;text-decoration:none;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;opacity:.78;transition:opacity .2s ease,color .2s ease}
.site-footer__login:hover{opacity:1;color:#e9d19e}
.site-footer__legal{position:relative;z-index:1;margin:clamp(3rem,7vw,5rem) 0 0;text-align:center;color:rgba(239,231,216,.5);font-size:.8rem}
@media(max-width:900px){
  .site-footer__inner{grid-template-columns:1fr;justify-items:center;text-align:center;gap:2.2rem}
  .site-footer__arc{width:min(420px,86%)}
  .site-footer__menu ul,.site-footer__social{justify-items:center;grid-auto-flow:row}
  .site-footer__side{justify-items:center;text-align:center}

}
@media(prefers-reduced-motion:reduce){.site-footer__arc-beam{animation:none;opacity:.5}}

/* ===== Header mengambang: benar-benar menyatu di puncak halaman =====
   Header dibuat mengambang di atas konten sehingga latar bagian pertama
   memanjang sampai ke belakangnya — tidak ada lagi pita putih maupun garis
   pemisah ketika halaman berada di posisi paling atas. */
body .site-header{position:fixed;top:0;left:0;right:0;z-index:100;background:transparent!important;border-bottom:1px solid transparent!important;box-shadow:none!important;-webkit-backdrop-filter:none;backdrop-filter:none}
body .site-header.is-stuck{background:rgba(255,255,255,.92)!important;border-bottom-color:rgba(169,144,95,.18)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 8px 30px rgba(60,48,26,.06)!important}
body .site-header.is-hidden{transform:translateY(-100%);opacity:0;pointer-events:none}
/* Beri ruang agar konten pertama tidak tertutup header mengambang. */
.site-main>*:first-child{padding-top:calc(var(--lily-header-h,86px) + clamp(.5rem,2vw,1.5rem))}
.admin-bar body .site-header,body.admin-bar .site-header{top:32px}
@media screen and (max-width:782px){body.admin-bar .site-header{top:46px}}

/* ===== 1.0.29 — Carousel lebar penuh & proporsi seperti contoh ===== */
.hero-showcase{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.hero-showcase__viewport{height:clamp(400px,34vw,620px);perspective:1600px}
.hero-showcase__slide{width:clamp(230px,19vw,380px);margin-left:calc(clamp(230px,19vw,380px) / -2);margin-top:calc(clamp(230px,19vw,380px) * -0.625)}
.hero-showcase__media{box-shadow:0 22px 60px rgba(38,31,20,.20)}
@media(max-width:1000px){
  .hero-showcase__viewport{height:clamp(340px,58vw,470px)}
  .hero-showcase__slide{width:min(46vw,300px);margin-left:calc(min(46vw,300px) / -2);margin-top:calc(min(46vw,300px) * -0.625)}
}
@media(max-width:700px){
  .hero-showcase__viewport{height:clamp(320px,86vw,420px)}
  .hero-showcase__slide{width:min(58vw,260px);margin-left:calc(min(58vw,260px) / -2);margin-top:calc(min(58vw,260px) * -0.625)}
}

/* Jarak lega antara header mengambang dan judul, tanpa garis pemisah. */
.site-main>*:first-child{padding-top:calc(var(--lily-header-h,86px) + clamp(2.5rem,6vw,5.5rem))}

/* ===== Footer: busur mengikuti tinggi footer, diberi jarak dari tepi atas ===== */
.site-footer__arc{position:absolute;left:50%;bottom:0;top:auto;height:calc(100% - clamp(.9rem,1.8vw,1.6rem));width:auto;aspect-ratio:2 / 1;transform:translateX(-50%)}
.site-footer__arc svg{width:100%;height:100%}
@media(max-width:900px){
  .site-footer__arc{height:calc(100% - .9rem);max-width:none;width:auto}
}
/* Cadangan untuk peramban tanpa aspect-ratio. */
@supports not (aspect-ratio: 1 / 1){ .site-footer__arc{height:auto;width:min(900px,70%)} }
/* Pastikan bagian hero tidak memotong carousel lebar penuh. */
.section--hero,.site-main>*:first-child{overflow-x:clip}

/* ===== 1.0.31 — Busur footer di HP: puncak busur DI ATAS logo =====
   Penguncian max-width sebelumnya membuat tinggi busur ikut menyusut sehingga
   puncaknya jatuh tepat pada logo. Kini tinggi busur dihitung dari tinggi
   footer sehingga puncaknya selalu berada di atas blok logo. */
@media(max-width:900px){
  .site-footer{overflow:hidden}
  .site-footer__arc{height:calc(100% - 1.25rem);width:auto;max-width:none;aspect-ratio:2 / 1}
}
@media(max-width:600px){
  .site-footer__arc{height:calc(100% - 1rem)}
}

/* ===== 1.0.31 — Masonry portfolio: 4 kolom desktop, 3 kolom tablet & HP =====
   Memakai CSS multi-column (bukan grid/JS) agar tinggi kartu mengikuti rasio
   asli foto dan bekerja di semua peramban: Chrome, Edge, Firefox, Safari
   (Windows, macOS, iOS, Android). */
.portfolio-grid{columns:4;column-gap:clamp(.65rem,1.1vw,1.1rem)}
.portfolio-card{break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;display:inline-block;width:100%;margin:0 0 clamp(.65rem,1.1vw,1.1rem)}
@media(max-width:1100px){.portfolio-grid{columns:3}}
@media(max-width:640px){.portfolio-grid{columns:3;column-gap:.45rem}.portfolio-card{margin-bottom:.45rem}}