@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400..800&family=Manrope:wght@400;500;600;700;800&family=JetBrains+Mono:wght@500&display=swap');

  :root{
    --bg:#FFF7FA;
    --bg-card:#FFFFFF;
    --ink:#17151F;
    --ink-soft:#57536A;
    --pink:#FF3E7F;
    --cyan:#14C6E0;
    --yellow:#FFC53D;
    --violet:#6C4CF1;
    --line:#E1E0EF;
    --max:1180px;
  }

  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    background:
      radial-gradient(circle at 4% 8%,rgba(255,62,127,.18) 0,transparent 25rem),
      radial-gradient(circle at 96% 30%,rgba(23,21,31,.11) 0,transparent 24rem),
      radial-gradient(circle at 15% 88%,rgba(255,197,61,.10) 0,transparent 22rem),
      linear-gradient(135deg,#FFF7FA 0%,#F7F7FB 52%,#FFF0F5 100%);
    color:var(--ink);
    font-family:'Manrope',sans-serif;
    font-size:16px;
    line-height:1.6;
    overflow-x:hidden;
  }
  .adobe-chaos{
    position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;
  }
  section,.film-strip,.ticker-band,footer{position:relative;z-index:1;}
  .adobe-logo{
    position:absolute;display:flex;align-items:center;justify-content:center;
    width:86px;height:86px;border:3px solid currentColor;
    font-family:'Bricolage Grotesque',sans-serif;font-size:34px;font-weight:800;
    letter-spacing:-.08em;opacity:.13;mix-blend-mode:multiply;
    box-shadow:8px 8px 0 currentColor;
  }
  .adobe-logo.ps{top:17%;left:5%;color:#31A8FF;transform:rotate(-14deg);}
  .adobe-logo.ai{top:31%;right:7%;color:#FF9A00;transform:rotate(11deg);}
  .adobe-logo.ae{top:62%;left:8%;color:#9999FF;transform:rotate(9deg);}
  .adobe-logo.pr{bottom:12%;right:9%;color:#EA77FF;transform:rotate(-12deg);}
  .adobe-logo::after{
    content:'Adobe';position:absolute;right:-24px;bottom:-23px;
    font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.04em;
    color:currentColor;transform:rotate(-6deg);
  }
  img,svg{display:block;max-width:100%;}
  a{color:inherit;text-decoration:none;}
  ul{list-style:none;}
  .wrap{max-width:var(--max);margin:0 auto;padding:0 28px;}
  h1,h2,h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;letter-spacing:-0.01em;}

  ::selection{background:var(--pink);color:#fff;}

  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
  }

  /* ---------- FILM PERFORATION DIVIDER ---------- */
  .film-strip{
    height:22px;
    background:var(--ink);
    position:relative;
    background-image:
      repeating-radial-gradient(circle at 18px 11px, var(--bg) 0 4.5px, transparent 4.6px 18px);
    background-size:36px 22px;
  }
  .adobe-marquee{
    height:92px;background:var(--ink);overflow:hidden;position:relative;
  }
  .adobe-marquee-track{
    display:flex;width:max-content;align-items:center;height:100%;
    animation:adobe-slide 24s linear infinite;
  }
  .adobe-marquee-set{display:flex;align-items:center;gap:22px;padding-right:22px;}
  .adobe-marquee-logo{
    width:58px;height:58px;display:flex;align-items:center;justify-content:center;
    border:2px solid currentColor;font-family:'Bricolage Grotesque',sans-serif;
    font-size:23px;font-weight:800;letter-spacing:-.08em;flex:none;
  }
  .adobe-marquee-logo.ps{color:#31A8FF;}
  .adobe-marquee-logo.ai{color:#FF9A00;}
  .adobe-marquee-logo.ae{color:#9999FF;}
  .adobe-marquee-logo.pr{color:#EA77FF;}
  @keyframes adobe-slide{from{transform:translateX(0);}to{transform:translateX(-50%);}}

  /* ---------- NAV ---------- */
  header{
    position:sticky;top:0;z-index:50;
    background:rgba(255,247,250,0.88);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  nav{
    display:flex;align-items:center;justify-content:space-between;
    padding:16px 28px;max-width:var(--max);margin:0 auto;
  }
  .mark{
    font-family:'Bricolage Grotesque',sans-serif;
    font-weight:800;font-size:22px;
    position:relative;
    letter-spacing:-0.02em;
  }
  .mark span{position:relative;}
  .mark::before,.mark::after{
    content:'bbahrum.';position:absolute;left:0;top:0;
  }
  .mark::before{color:var(--pink);mix-blend-mode:multiply;transform:translate(1.5px,1px);}
  .mark::after{color:var(--cyan);mix-blend-mode:multiply;transform:translate(-1.5px,-1px);}

  .nav-links{display:flex;gap:30px;align-items:center;}
  .nav-links a{font-weight:600;font-size:15px;color:var(--ink-soft);transition:color .15s;}
  .nav-links a:hover{color:var(--pink);}

  .btn{
    display:inline-flex;align-items:center;gap:8px;
    font-weight:700;font-size:14.5px;
    padding:11px 22px;
    background:var(--ink);color:#fff;
    clip-path:polygon(6% 0,100% 0,94% 100%,0 100%);
    border:none;cursor:pointer;
    transition:transform .15s ease, background .15s ease;
  }
  .btn:hover{background:var(--pink);transform:translateY(-2px);}
  .btn-outline{background:transparent;color:var(--ink);border:2px solid var(--ink);clip-path:none;padding:9px 20px;}
  .btn-outline:hover{background:var(--ink);color:#fff;}

  .burger{display:none;background:none;border:none;font-size:24px;cursor:pointer;color:var(--ink);}

  /* ---------- HERO ---------- */
  .hero{
    padding:90px 0 70px;
    position:relative;
  }
  .hero .wrap{display:grid;grid-template-columns:1fr;gap:26px;}
  .role-line{
    font-size:15px;font-weight:700;color:var(--violet);
    display:flex;align-items:center;gap:10px;
  }
  .role-line .dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);display:inline-block;}

  .name{
    font-size:clamp(48px,9vw,108px);
    line-height:0.98;
    position:relative;
    color:var(--ink);
    display:inline-block;
  }
  .name .layer{
    position:absolute;left:0;top:0;
    width:100%;
    mix-blend-mode:multiply;
    animation:converge 1.1s cubic-bezier(.2,.8,.2,1) both;
  }
  .name .layer.p{color:var(--pink);animation-name:conv-pink;}
  .name .layer.c{color:var(--cyan);animation-name:conv-cyan;}
  .name .base{position:relative;color:var(--ink);}

  @keyframes conv-pink{from{transform:translate(10px,6px);}to{transform:translate(0,0);}}
  @keyframes conv-cyan{from{transform:translate(-10px,-5px);}to{transform:translate(0,0);}}

  .tagline{
    max-width:560px;
    font-size:18px;
    color:var(--ink-soft);
    margin-top:6px;
  }

  .hero-actions{display:flex;gap:16px;margin-top:8px;flex-wrap:wrap;}

  .stats{
    display:flex;gap:38px;margin-top:34px;flex-wrap:wrap;
    border-top:1px solid var(--line);padding-top:24px;
  }
  .stat b{
    display:block;font-family:'Bricolage Grotesque',sans-serif;
    font-size:26px;color:var(--ink);
  }
  .stat span{font-size:13.5px;color:var(--ink-soft);}
  .stat:nth-child(1) b{color:var(--pink);}
  .stat:nth-child(2) b{color:var(--cyan);}
  .stat:nth-child(3) b{color:var(--violet);}

  /* ---------- SECTION HEADS ---------- */
  section{padding:80px 0;}
  .sec-head{margin-bottom:44px;max-width:640px;}
  .sec-head h2{font-size:clamp(30px,4vw,42px);margin-bottom:10px;}
  .sec-head p{color:var(--ink-soft);font-size:16px;}

  /* ---------- FILTER CHIPS ---------- */
  .chips{display:flex;gap:10px;margin-bottom:32px;flex-wrap:wrap;}
  .chip{
    font-size:14px;font-weight:600;padding:8px 18px;
    border:2px solid var(--ink);border-radius:100px;
    background:transparent;cursor:pointer;color:var(--ink);
    transition:background .15s,color .15s;
  }
  .chip.active,.chip:hover{background:var(--ink);color:#fff;}

  /* ---------- PORTFOLIO GRID ---------- */
  .grid{
    display:flex;
    flex-direction:column;
    gap:18px;
  }
  .grid-row{
    display:grid;
    gap:18px;
    align-items:start;
  }
  .grid-top{grid-template-columns:repeat(5,1fr);}
  .grid-middle{grid-template-columns:1fr;}
  .grid-bottom{grid-template-columns:repeat(4,1fr);}
  .rosejas-feed-top,.rosejas-feed-bottom{grid-template-columns:repeat(5,1fr);}
  .rosejas-reels{grid-template-columns:repeat(4,1fr);}
  .rosejas-video-bottom{grid-template-columns:repeat(5,1fr);}
  .griya-long-row{grid-template-columns:1fr;}
  .taman-long-row{grid-template-columns:1fr;}
  .grid-top .ratio-feed,.grid-middle .ratio-landscape,
  .grid-bottom .ratio-portrait{grid-column:auto;}
  .grid-row:has(.card.hidden){display:none;}
  .grid-row:has(.card:not(.hidden)){display:grid;}
  .card{
    position:relative;overflow:hidden;
    border:1px solid var(--line);
    aspect-ratio:4 / 5;
    display:flex;flex-direction:column;justify-content:flex-end;
    transition:border-color .2s;
    cursor:pointer;
  }
  .card.hidden{display:none;}
  .card .thumb{position:absolute;inset:0;}
  .card img.thumb{width:100%;height:100%;object-fit:cover;object-position:center;}
  .card video.thumb{width:100%;height:100%;object-fit:cover;object-position:center;background:#17151F;}
  .card .meta{
    position:relative;z-index:2;padding:14px;
    background:linear-gradient(to top, rgba(0,0,0,.55), transparent 70%);
  }
  .card .meta h3{font-size:15.5px;color:#fff;font-weight:700;font-family:'Manrope',sans-serif;}
  .card .tag{
    display:inline-block;margin-top:6px;font-size:11.5px;font-weight:700;
    padding:3px 10px;border-radius:100px;color:#17151F;
  }
  .card[data-cat="video"]{border-radius:2px;}
  .card[data-cat="desain"]{border-radius:14px;}
 
  .card.ratio-landscape{grid-column:span 2;aspect-ratio:16 / 9;}
  .card.ratio-feed{aspect-ratio:1 / 1;}
  .card.ratio-portrait{aspect-ratio:9 / 16;}

  .griya-long-card{aspect-ratio:auto;display:block;background:#fff;}
  .griya-long-card img.thumb{position:relative;width:100%;height:auto;object-fit:contain;}
  .taman-long-card{aspect-ratio:auto;display:block;background:#fff;}
  .taman-long-card img.thumb{position:relative;width:100%;height:auto;object-fit:contain;}
  .rosejas-long-card{aspect-ratio:auto;display:block;background:#fff;}
  .rosejas-long-card img.thumb{position:relative;width:100%;height:auto;object-fit:contain;}


  .rosejas-feed-placeholder,
  .rosejas-reels-placeholder{
    align-items:center;justify-content:center;text-align:center;
    background:linear-gradient(135deg,#fff 0%,#F4F2FA 100%);
    border:2px dashed #B9B5CB;color:var(--ink-soft);
    font-size:14px;font-weight:700;
  }
  .rosejas-feed-placeholder{aspect-ratio:4 / 5;}
  .rosejas-feed-card{aspect-ratio:4 / 5;}
  .rosejas-reels-placeholder{aspect-ratio:9 / 16;}
  .rosejas-reels-card{aspect-ratio:9 / 16;}
  .rosejas-video-card{aspect-ratio:9 / 16;}
  .rosejas-feed-placeholder::before,
  .rosejas-reels-placeholder::before{
    position:absolute;top:14px;left:14px;
    font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:500;
    color:var(--violet);opacity:.8;
  }
  .rosejas-feed-placeholder::before{content:'1080 x 1350';}
  .rosejas-reels-placeholder::before{content:'1080 x 1920';}
  .rosejas-feed-placeholder span,
  .rosejas-reels-placeholder span{line-height:1.5;}

  .project-placeholder{
    align-items:center;justify-content:center;text-align:center;
    background:linear-gradient(135deg,#fff 0%,#F4F2FA 100%);
    border:2px dashed #B9B5CB;color:var(--ink-soft);
    font-size:14px;font-weight:700;
  }
  .project-placeholder::before{
    content:'1080 x 1080';position:absolute;top:14px;left:14px;
    font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:500;
    color:var(--violet);opacity:.8;
  }
  .project-placeholder span{line-height:1.5;}

  .empty-project{
    padding:28px;border:1px dashed var(--line);color:var(--ink-soft);
    text-align:center;
  }

  .timecode{
    position:absolute;left:12px;bottom:44px;z-index:3;
    font-family:'JetBrains Mono',monospace;font-size:11px;color:#fff;
    background:rgba(0,0,0,.45);padding:2px 7px;border-radius:4px;letter-spacing:.02em;
  }
  .play{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    width:52px;height:52px;border-radius:50%;
    background:rgba(255,255,255,.9);
    display:flex;align-items:center;justify-content:center;z-index:3;
    opacity:0;transition:opacity .2s, transform .2s;
    padding:0;border:0;cursor:pointer;
  }
  .card[data-cat="video"] .play{opacity:.9;}
  .card[data-cat="video"]:hover .play,.card[data-cat="video"] .play:focus-visible{opacity:1;transform:translate(-50%,-50%) scale(1.05);}
  .play::after{content:'';border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent var(--ink);margin-left:3px;}
  .play[data-playing="true"]::after{content:'||';border:0;font-size:20px;font-weight:800;margin:0;color:var(--ink);}
  .card .play[data-playing="true"],
  .card:hover .play[data-playing="true"]{
    display:none;
  }

  .scrub{
    position:absolute;left:0;bottom:0;height:3px;width:0%;
    background:var(--pink);z-index:3;transition:width .5s ease;
  }
  .card[data-cat="video"]:hover .scrub{width:64%;}

  .card:hover{border-color:var(--ink);}

  /* thumbnail textures */
  .thumb-1{background:linear-gradient(120deg,var(--pink),var(--violet));}
  .thumb-2{background:linear-gradient(120deg,var(--yellow),var(--pink));}
  .thumb-3{background:linear-gradient(160deg,var(--violet),#1c1730);}
  .thumb-4{background:linear-gradient(120deg,var(--cyan),var(--pink));}
  .thumb-5{background:linear-gradient(120deg,var(--cyan),var(--yellow));}
  .thumb-6{background:linear-gradient(140deg,var(--yellow),var(--violet));}
  .thumb-7{background:linear-gradient(120deg,#8fe3ef,var(--yellow));}
  .thumb-8{background:linear-gradient(100deg,var(--pink),var(--yellow) 50%,var(--cyan));}
  .thumb-9{background:linear-gradient(140deg,var(--cyan),var(--violet));}
  .thumb-10{background:linear-gradient(120deg,var(--yellow),var(--cyan));}
  .thumb-11{background:linear-gradient(120deg,var(--violet),var(--pink));}

  .pattern-dots::before{
    content:'';position:absolute;inset:0;
    background-image:radial-gradient(rgba(255,255,255,.55) 1.6px, transparent 1.6px);
    background-size:13px 13px;mix-blend-mode:overlay;opacity:.7;
  }
  .pattern-bars::before{
    content:'';position:absolute;inset:0;
    background-image:repeating-linear-gradient(100deg, rgba(255,255,255,.35) 0 3px, transparent 3px 16px);
    mix-blend-mode:overlay;opacity:.6;
  }

  /* ---------- SERVICES / STICKY NOTES ---------- */
  .sticky-wrap{display:flex;flex-wrap:wrap;gap:26px;padding:20px 0 10px;}
  .sticky{
    width:250px;min-height:190px;background:var(--bg-card);
    border:1px solid var(--line);
    box-shadow:0 10px 24px rgba(23,21,31,.08);
    padding:22px 20px;position:relative;
  }
  .sticky::before{
    content:'';position:absolute;top:-9px;left:26px;width:38px;height:16px;
    border-radius:3px;opacity:.9;
  }
  .sticky:nth-child(1){transform:rotate(-2.5deg);}
  .sticky:nth-child(2){transform:rotate(1.8deg);}
  .sticky:nth-child(3){transform:rotate(-1.2deg);}
  .sticky:nth-child(4){transform:rotate(2.4deg);}
  .sticky:nth-child(1)::before{background:var(--pink);}
  .sticky:nth-child(2)::before{background:var(--cyan);}
  .sticky:nth-child(3)::before{background:var(--yellow);}
  .sticky:nth-child(4)::before{background:var(--violet);}
  .sticky:hover{transform:rotate(0deg) translateY(-4px);transition:transform .2s;}
  .sticky h3{font-size:18px;margin-bottom:10px;}
  .sticky ul li{font-size:14px;color:var(--ink-soft);margin-bottom:5px;padding-left:14px;position:relative;}
  .sticky ul li::before{content:'';position:absolute;left:0;top:8px;width:5px;height:5px;background:var(--ink);border-radius:50%;}

  /* ---------- PROCESS ---------- */
  .process{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
  .proc-item{border-left:3px solid var(--line);padding-left:18px;}
  .proc-item b{
    font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--pink);
  }
  .proc-item h3{font-size:18px;margin:8px 0 8px;}
  .proc-item p{font-size:14.5px;color:var(--ink-soft);}
  .proc-item:nth-child(1){border-color:var(--pink);}
  .proc-item:nth-child(2){border-color:var(--cyan);}
  .proc-item:nth-child(3){border-color:var(--yellow);}
  .proc-item:nth-child(4){border-color:var(--violet);}

  /* ---------- ABOUT ---------- */
  .about{display:grid;grid-template-columns:0.8fr 1.2fr;gap:56px;align-items:center;}
  .avatar{
    aspect-ratio:1;border-radius:24px;
    background:conic-gradient(from 200deg,var(--pink),var(--yellow),var(--cyan),var(--violet),var(--pink));
    position:relative;overflow:hidden;
  }
  .avatar::after{
    content:'';position:absolute;inset:14px;border-radius:16px;
    background:var(--bg);
    display:flex;
  }
  .avatar img{
    position:absolute;inset:14px;width:calc(100% - 28px);height:calc(100% - 28px);
    border-radius:16px;object-fit:cover;object-position:center;z-index:1;
  }
  .avatar .initials{
    position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
    font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:64px;color:var(--ink);z-index:2;
  }
  .about-text p{color:var(--ink-soft);font-size:16.5px;margin-bottom:16px;max-width:60ch;}
  .about-text p:first-child{font-size:19px;color:var(--ink);font-weight:600;}

  /* ---------- TOOLS TICKER ---------- */
  .ticker-band{background:var(--ink);padding:22px 0;overflow:hidden;}
  .ticker{display:flex;gap:56px;white-space:nowrap;animation:scroll 22s linear infinite;width:max-content;}
  .ticker span{
    font-family:'Bricolage Grotesque',sans-serif;font-size:22px;font-weight:700;color:#fff;opacity:.85;
  }
  .ticker span:nth-child(4n+1){color:var(--pink);}
  .ticker span:nth-child(4n+2){color:var(--cyan);}
  .ticker span:nth-child(4n+3){color:var(--yellow);}
  .ticker span:nth-child(4n+4){color:var(--violet);}
  @keyframes scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

  /* ---------- TESTIMONIALS ---------- */
  .testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .testi{
    background:var(--bg-card);border:1px solid var(--line);padding:26px;border-radius:4px;
  }
  .testi p{font-size:15.5px;color:var(--ink);margin-bottom:16px;}
  .testi .who{font-size:13.5px;color:var(--ink-soft);font-weight:600;}
  .testi:nth-child(1){border-top:4px solid var(--pink);}
  .testi:nth-child(2){border-top:4px solid var(--cyan);}
  .testi:nth-child(3){border-top:4px solid var(--yellow);}

  /* ---------- CONTACT ---------- */
  .contact{
    background:var(--ink);color:#fff;border-radius:28px;
    padding:70px 50px;position:relative;overflow:hidden;
    margin:0 28px;
  }
  .contact::before{
    content:'';position:absolute;width:340px;height:340px;border-radius:50%;
    background:var(--pink);opacity:.35;filter:blur(70px);top:-120px;right:-80px;
  }
  .contact::after{
    content:'';position:absolute;width:260px;height:260px;border-radius:50%;
    background:var(--cyan);opacity:.3;filter:blur(70px);bottom:-100px;left:-60px;
  }
  .contact-in{position:relative;z-index:2;max-width:640px;}
  .contact h2{font-size:clamp(30px,5vw,46px);margin-bottom:14px;color:#fff;}
  .contact p{color:#D7D5E6;font-size:17px;margin-bottom:30px;}
  .contact-links{display:flex;gap:16px;flex-wrap:wrap;margin-top:30px;}
  .contact-links a{
    font-size:14.5px;font-weight:600;color:#fff;border:1px solid rgba(255,255,255,.3);
    padding:9px 18px;border-radius:100px;transition:background .15s,border-color .15s;
  }
  .contact-links a:hover{background:rgba(255,255,255,.12);border-color:#fff;}

  footer{padding:34px 0;text-align:center;}
  footer p{font-size:13.5px;color:var(--ink-soft);}

  @media(max-width:960px){
    .nav-links{display:none;}
    .burger{display:block;}
    .grid-top,.grid-bottom{grid-template-columns:repeat(2,1fr);}
    .rosejas-feed-top,.rosejas-feed-bottom{grid-template-columns:repeat(2,1fr);}
    .rosejas-reels{grid-template-columns:repeat(2,1fr);}
    .rosejas-video-bottom{grid-template-columns:repeat(2,1fr);}
    .about{grid-template-columns:1fr;}
    .avatar{max-width:280px;margin:0 auto;}
    .process{grid-template-columns:repeat(2,1fr);}
    .testi-grid{grid-template-columns:1fr;}
    .contact{margin:0 16px;padding:50px 28px;}
  }
@media(max-width:560px){
    .grid-top,.grid-bottom{grid-template-columns:repeat(2,1fr);}
    .stats{gap:26px;}
    .process{grid-template-columns:1fr;}
  }

/* Landing page composition based on the supplied e-learning reference. */
:root{--bg:#fbf5ff;--bg-card:#fff;--ink:#29213a;--ink-soft:#71677f;--pink:#d76be8;--cyan:#8d77eb;--yellow:#ffc5e8;--violet:#a967ed;--line:#eadcf4;--max:1180px}
body{background:linear-gradient(180deg,#fbf7ff 0%,#fff7fc 48%,#faf4ff 100%)}
.adobe-chaos{display:none}
header{background:rgba(255,255,255,.88);border-color:#efe4f5}
.mark::before,.mark::after{display:none}.mark span{color:#a45dde}
.hero{padding:76px 0 68px;background:radial-gradient(ellipse at 78% 40%,rgba(206,123,235,.19),transparent 34%),linear-gradient(110deg,#fff 0%,#fbf3ff 100%)}
.hero .wrap{grid-template-columns:1.05fr .95fr;align-items:center;gap:40px;max-width:1180px}
.hero-copy{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.role-line{color:#a454d7}.role-line .dot{background:#dc70cf}
.name{font-size:clamp(48px,6vw,76px);line-height:.98;color:#30263f}
.name .layer{display:none}
.tagline{max-width:510px;font-size:17px;margin:0}
.hero-actions{margin-top:0}.stats{margin-top:8px}
.hero-visual{position:relative;min-height:460px;display:flex;align-items:center;justify-content:center}
.visual-orbit{position:absolute;width:min(390px,85%);aspect-ratio:1;border-radius:50%;background:linear-gradient(145deg,#f0d4ff,#f9d5ef);border:1px dashed #c477e3;transform:rotate(-9deg)}
.visual-main{position:relative;width:72%;height:390px;border:10px solid #fff;border-radius:28px 28px 80px 28px;overflow:hidden;box-shadow:0 24px 55px rgba(95,54,119,.2);transform:rotate(3deg);background:#eee}
.visual-main img{width:100%;height:100%;object-fit:cover}
.visual-float{position:absolute;z-index:2;display:flex;align-items:center;gap:10px;background:#fff;padding:12px 16px;border-radius:14px;box-shadow:0 12px 32px rgba(75,43,92,.17);font-size:12px;line-height:1.2;color:#5c4768}
.visual-float span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#f4e4ff;color:#a54ed0;font-size:18px}
.visual-float-top{top:65px;right:0}.visual-float-bottom{bottom:62px;left:0}.visual-sparkle{position:absolute;top:55px;left:45px;color:#bf6ce0;font-size:38px}
.btn{clip-path:none;border-radius:8px;background:#bb65df;box-shadow:0 8px 20px rgba(172,92,211,.18)}
.btn:hover{background:#9855ce}.btn-outline{background:#fff;color:#754a91;border:1px solid #ddc5eb;box-shadow:none}
.stats{max-width:650px;border-color:#eadcf4}.stat:nth-child(n) b{color:#a45dde}
.adobe-marquee{height:62px;background:linear-gradient(90deg,#b361e8,#d66bd5);}
.adobe-marquee-logo{width:42px;height:42px;border:0;color:#fff!important;font-size:18px}
section{padding:76px 0}
.sec-head{margin-bottom:32px}.sec-head h2{color:#392d49}
.chips{gap:9px}.chip{border:1px solid #e4d2ef;color:#72577f;background:#fff;border-radius:999px}.chip.active,.chip:hover{background:#b361db;color:#fff;border-color:#b361db}
.project-search{max-width:480px;margin:-10px 0 26px;display:flex;align-items:center;gap:10px;padding:11px 16px;background:#fff;border:1px solid #eadcf4;border-radius:10px;color:#a45dde;box-shadow:0 8px 22px rgba(75,43,92,.06)}
.project-search span{font-size:22px;line-height:1}.project-search input{width:100%;border:0;outline:0;background:transparent;font:inherit;color:var(--ink)}
.card{border:1px solid #eadcf4;box-shadow:0 10px 28px rgba(75,43,92,.09);border-radius:14px!important}
.sticky{border-radius:16px;box-shadow:0 12px 30px rgba(75,43,92,.09);transform:none!important}.sticky::before{border-radius:9px}
.process{gap:18px}.proc-item{padding:20px;border:1px solid #eadcf4;border-left:3px solid #c274df;border-radius:12px;background:#fff}
.about{grid-template-columns:.8fr 1.2fr}.avatar{border-radius:50%;max-width:340px;box-shadow:0 16px 40px rgba(120,67,154,.15)}.avatar::after{border-radius:50%}.avatar img{border-radius:50%}
.testi{border:1px solid #eadcf4;border-top:4px solid #c274df!important;border-radius:14px;box-shadow:0 10px 26px rgba(75,43,92,.06)}
.contact{border-radius:22px;background:linear-gradient(115deg,#9b5dd2,#d46bc8)}.contact::before,.contact::after{display:none}.contact p{color:#fff}
footer{background:#fff}
@media(max-width:960px){
  header{position:sticky}.nav-links{display:none;position:absolute;top:calc(100% + 8px);right:18px;left:18px;align-items:stretch;background:#fff;padding:18px;border:1px solid var(--line);border-radius:14px;box-shadow:0 16px 32px #31213a20;z-index:60}.nav-links.open{display:flex;flex-direction:column;gap:12px}
  .nav-links a{padding:8px 4px}.burger{display:block;color:#694583}
  .hero{padding:58px 0 48px}.hero .wrap{grid-template-columns:1fr 1fr;gap:20px}.hero-visual{min-height:360px}.visual-main{height:320px}.about{grid-template-columns:1fr}.avatar{margin:0 auto 12px}
}
@media(max-width:760px){
  .hero .wrap{grid-template-columns:1fr;gap:0}.hero-copy{gap:15px}.hero-visual{min-height:390px}.visual-main{height:330px;width:min(62%,360px)}
  .process{grid-template-columns:repeat(2,minmax(0,1fr))}.testi-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .wrap{padding:0 20px}.hero{padding:48px 0}.hero .wrap{grid-template-columns:1fr;gap:4px}.hero-copy{gap:15px}.name{font-size:clamp(42px,12vw,64px)}.hero-visual{min-height:330px;margin-top:2px}.visual-main{height:290px;width:67%}.visual-orbit{width:72%}.visual-float-top{top:30px;right:4px}.visual-float-bottom{bottom:35px;left:4px}.visual-sparkle{top:22px;left:26px}
  section{padding:58px 0}.sec-head{margin-bottom:24px}.chips{overflow-x:auto;flex-wrap:nowrap;padding-bottom:6px}.chip{white-space:nowrap}
  .grid-top,.grid-bottom,.rosejas-feed-top,.rosejas-feed-bottom,.rosejas-reels,.rosejas-video-bottom{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .grid{gap:12px}.sticky-wrap{gap:16px}.sticky{width:100%;min-height:0}.process{grid-template-columns:1fr}.contact{margin:0 12px;padding:38px 24px}
}
@media(max-width:380px){
  .wrap{padding:0 16px}.nav-links{left:12px;right:12px}.name{font-size:clamp(38px,11vw,48px)}
  .hero-actions{gap:10px}.hero-actions .btn{padding:10px 14px;font-size:13px}.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.stat span{font-size:12px}
  .hero-visual{min-height:300px}.visual-main{height:260px;width:68%}.visual-float{padding:9px 11px;font-size:11px}.project-search{padding:10px 12px}.chip{font-size:12px;padding:7px 12px}.contact{padding:32px 18px}
}

/* Reference-inspired page composition: clear hero, discovery panel, featured work, creator and stories. */
html{scroll-padding-top:84px;overflow-x:clip}
header{border-bottom:1px solid #eee4f4}
nav{max-width:1120px;padding:13px 28px}
.nav-links{gap:26px}
.hero{padding:54px 0 48px;background:linear-gradient(105deg,#fff 0%,#fcf7ff 58%,#f8efff 100%)}
.hero .wrap{max-width:1120px;min-height:455px;grid-template-columns:1fr .9fr;gap:48px}
.hero-copy{gap:18px}
.role-line{font-size:13px;letter-spacing:.02em}
.name{max-width:580px;font-size:clamp(48px,6.2vw,78px);line-height:.99;letter-spacing:-.055em}
.name em{font-style:normal;color:#a957d7}
.tagline{max-width:470px;font-size:16px;line-height:1.75}
.hero-actions{gap:12px}
.hero-visual{min-height:430px}
.visual-orbit{width:min(365px,86%);background:linear-gradient(145deg,#f3ddff,#ffdef4);border-color:#be78df}
.visual-main{width:68%;height:355px;border:8px solid white;border-radius:48% 48% 26px 26px;transform:rotate(0);box-shadow:0 18px 46px #76518a2b}
.visual-main img{object-position:center;object-fit:cover}
.visual-float{border:1px solid #f0e5f6;border-radius:12px;padding:10px 13px;font-size:11px}
.visual-float-top{top:58px;right:2px}.visual-float-bottom{bottom:55px;left:0}
.stats{gap:30px;border-top:0;padding-top:5px}
.stat b{font-size:22px}.stat span{font-size:11px}
.adobe-marquee{height:58px;background:linear-gradient(90deg,#a85bdd,#c962dc 52%,#ed83c5)}
.adobe-marquee-set{gap:38px;padding-right:38px}
.adobe-marquee-logo{font-family:'Manrope',sans-serif;font-size:12px!important;font-weight:800;letter-spacing:.01em;width:auto;height:auto;color:#fff!important;opacity:.94}
.adobe-marquee-logo.ps::after{content:' Photoshop'}.adobe-marquee-logo.ai::after{content:' Illustrator'}.adobe-marquee-logo.ae::after{content:' After Effects'}.adobe-marquee-logo.pr::after{content:' Premiere Pro'}
#karya{padding:76px 0 0;background:#fff}
.sec-head-center{text-align:center;max-width:680px;margin:0 auto 25px}
.eyebrow{display:block;margin-bottom:9px;color:#ac5fd2;font-size:10px;font-weight:800;letter-spacing:.16em}
.sec-head-center h2,.gallery-heading h2{font-size:clamp(28px,4vw,39px);letter-spacing:-.04em}
.sec-head-center p{max-width:560px;margin:auto}
.project-search{max-width:435px;margin:0 auto 38px;border-radius:8px;padding:10px 14px;box-shadow:0 5px 18px #4529540c}
.project-feature{max-width:1000px;margin:0 auto 72px;display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}
.feature-art{position:relative;height:330px;border-radius:24px 24px 72px 24px;background:#f3e2ff;padding:13px;overflow:visible}
.feature-art img{width:100%;height:100%;object-fit:cover;object-position:center 28%;border-radius:17px 17px 60px 17px;box-shadow:0 14px 32px #4a2e601f}
.feature-sticker{position:absolute;right:-20px;bottom:22px;padding:11px 15px;background:#fff;color:#8c4bb4;border-radius:9px;font-family:'JetBrains Mono',monospace;font-size:9px;line-height:1.5;box-shadow:0 8px 24px #4a2e6020}
.feature-copy h3{max-width:430px;margin-bottom:13px;font-size:clamp(24px,3vw,34px);line-height:1.13;letter-spacing:-.035em}
.feature-copy>p{margin-bottom:18px;color:var(--ink-soft);font-size:14px;line-height:1.75}
.feature-list{display:grid;gap:12px;margin:0 0 17px}
.feature-list li{display:flex;align-items:center;gap:12px}
.feature-list li>span{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:10px;background:#f5e7fb;color:#ad59d2;font-size:15px}
.feature-list b,.feature-list small{display:block}.feature-list b{font-size:12px}.feature-list small{margin-top:2px;color:#81758c;font-size:10px}
.text-link{color:#9e51c8;font-size:12px;font-weight:800}.text-link span{padding-left:6px}
.portfolio-gallery{position:relative;left:50%;width:100vw;transform:translateX(-50%);padding:58px max(24px,calc((100vw - 1120px)/2)) 72px;background:linear-gradient(115deg,#a95ee0 0%,#ca69da 52%,#ed83c0 100%);overflow:hidden}
.portfolio-gallery::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 12% 8%,#fff3 0 2px,transparent 3px);background-size:22px 22px;opacity:.18;pointer-events:none}
.gallery-wrap{position:relative;max-width:1120px;margin:auto}
.gallery-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:24px;color:white}
.gallery-heading .eyebrow{color:#f9e7ff}.gallery-heading h2{color:white}.gallery-heading>p{max-width:340px;margin:0;color:#fff;font-size:12px;line-height:1.6}
.portfolio-categories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:0 0 28px}
.portfolio-category{position:relative;min-width:0;padding:9px 9px 15px;text-align:left;border:0;border-radius:13px;background:#fff;color:#382942;box-shadow:0 12px 28px #662d7624;cursor:pointer;transition:transform .2s,box-shadow .2s}
.portfolio-category:hover{transform:translateY(-5px);box-shadow:0 18px 34px #662d7638}
.portfolio-category img{width:100%;height:145px;object-fit:cover;border-radius:8px;background:#f4edf7}
.portfolio-category .category-label{display:block;margin:12px 4px 4px;color:#aa61ca;font-size:8px;font-weight:800;letter-spacing:.13em}
.portfolio-category strong{display:block;margin:0 4px;color:#382942;font-size:14px;line-height:1.35}
.portfolio-category small{display:block;margin:5px 4px 0;color:#887b90;font-size:9px}
.category-arrow{position:absolute;right:17px;bottom:14px;color:#b461d2;font-size:16px}
.filter-hint{margin:0 0 10px;color:#fff;font-size:10px;font-weight:700;letter-spacing:.06em}
.chips{margin:0 0 26px;gap:8px}.chip{padding:7px 15px;background:#fff2;border-color:#fff8;color:#fff;font-size:11px}.chip.active,.chip:hover{background:white;color:#9b4cc2;border-color:white}
.grid{gap:14px}.grid-row{gap:14px}.grid-top,.rosejas-feed-top,.rosejas-feed-bottom{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-bottom,.rosejas-reels,.rosejas-video-bottom{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{border:4px solid #ffffffbf;border-radius:12px!important;box-shadow:0 8px 22px #5b2a6b26}.card[data-cat="desain"]{border-radius:12px!important}.card:hover{transform:translateY(-3px);transition:transform .2s,border-color .2s}
.grid-row:has(.card:not(.hidden)){display:grid}
.empty-project{background:#fff;border-radius:12px}
#layanan{background:#fff;padding-top:78px;padding-bottom:60px}
#layanan .sec-head h2,#proses .sec-head h2{font-size:clamp(28px,4vw,38px)}
.sticky-wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:0}
.sticky{width:auto;min-height:178px;padding:26px 18px 22px;border:1px solid #eee2f3;box-shadow:0 8px 24px #44284f0b}
.sticky::before{top:12px;left:18px;width:35px;height:4px;border-radius:5px}
.sticky:nth-child(n){transform:none!important}.sticky h3{margin-bottom:9px;font-size:16px}.sticky ul li{font-size:11px;line-height:1.55}
#proses{padding:55px 0 72px;background:#fbf7fd}
#proses .sec-head{margin-bottom:24px}
.process{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.proc-item{padding:17px 15px;border:1px solid #eadcf4;border-top:3px solid #c274df;border-left:0;border-radius:10px;background:#fff}
.proc-item h3{font-size:15px}.proc-item p{font-size:11px;line-height:1.65}
#tentang{padding:78px 0;background:white}
.about{max-width:1000px;grid-template-columns:.9fr 1.1fr;gap:72px}
.avatar{max-width:360px;border-radius:50% 50% 18px 50%;background:linear-gradient(145deg,#bd67e3,#ed91cf);padding:12px;aspect-ratio:1}
.avatar::after{display:none}.avatar img{inset:12px;width:calc(100% - 24px);height:calc(100% - 24px);border:7px solid #fff;border-radius:50% 50% 14px 50%;object-fit:cover;object-position:center}
.about-text h2{font-size:clamp(32px,4vw,44px);margin-bottom:14px;letter-spacing:-.04em}
.about-text p{font-size:14px;line-height:1.8}.about-text .btn{margin-top:4px}
body>section:has(.testi-grid){padding:64px 0;background:linear-gradient(110deg,#a75cdb,#cf6bd5 55%,#ef8ac2)}
body>section:has(.testi-grid) .wrap{max-width:1120px}
body>section:has(.testi-grid) .sec-head{text-align:center;margin:0 auto 28px;color:#fff}
body>section:has(.testi-grid) .sec-head .eyebrow{color:#ffe8ff}
body>section:has(.testi-grid) .sec-head h2,body>section:has(.testi-grid) .sec-head p{color:white}
.testi-grid{gap:14px}.testi{min-height:145px;padding:22px;border:1px solid #ffffffa8!important;border-radius:12px;background:#fff!important;box-shadow:0 8px 22px #682e7420}
.testi p{font-size:12px;line-height:1.7}.testi .who{font-size:10px;color:#a253c8;text-transform:uppercase;letter-spacing:.06em}
#kontak{padding:55px 0;background:#fff}.contact{max-width:1120px;margin:0 auto;background:linear-gradient(110deg,#362544,#5b3b6d);border-radius:18px;padding:45px 48px}
footer{background:#fff}
@media(max-width:900px){
  .hero .wrap{grid-template-columns:1fr .85fr;gap:22px}.name{font-size:clamp(44px,6.4vw,62px)}.project-feature{gap:38px}.sticky-wrap{grid-template-columns:repeat(2,minmax(0,1fr))}.process{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .hero .wrap{grid-template-columns:1fr;gap:10px}.hero-copy{max-width:560px}.hero-visual{min-height:350px}.visual-main{height:305px;width:min(60%,310px)}
  .project-feature{grid-template-columns:1fr;gap:32px;margin-bottom:55px}.feature-art{height:300px;max-width:520px;width:100%;margin:auto}.feature-copy{max-width:540px;margin:auto}.gallery-heading{align-items:start;flex-direction:column;gap:7px}.gallery-heading>p{max-width:500px}
  .grid-top,.rosejas-feed-top,.rosejas-feed-bottom{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-bottom,.rosejas-reels,.rosejas-video-bottom{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about{grid-template-columns:1fr;gap:32px}.avatar{max-width:290px}.about-text{max-width:540px;margin:auto}
}
@media(max-width:480px){
  nav{padding:12px 18px}.hero{padding:40px 0 32px}.hero .wrap{padding:0 22px}.name{font-size:clamp(42px,11vw,54px)}.tagline{font-size:14px}.stats{gap:16px}.stat b{font-size:18px}.stat span{font-size:9px}
  .hero-visual{min-height:300px}.visual-main{height:265px;width:68%}.visual-float-top{right:-3px;top:27px}.visual-float-bottom{left:-2px;bottom:25px}
  #karya{padding-top:56px}.sec-head-center{padding:0 12px}.project-search{margin-bottom:30px}.portfolio-gallery{padding:44px 18px 54px}.portfolio-categories{gap:10px}.portfolio-category{padding:7px 7px 13px}.portfolio-category img{height:105px}.portfolio-category strong{font-size:11px}.portfolio-category small{font-size:8px}.category-arrow{right:13px;bottom:11px}.chips{overflow-x:auto;flex-wrap:nowrap;padding-bottom:8px}.chip{white-space:nowrap;flex:none}
  .grid{gap:10px}.grid-row{gap:10px}.sticky-wrap{grid-template-columns:1fr 1fr;gap:10px}.sticky{padding:23px 14px 17px;min-height:160px}.sticky h3{font-size:14px}.sticky ul li{font-size:10px}
  #proses{padding:44px 0 52px}.proc-item{padding:14px 12px}.testi{padding:18px;min-height:0}body>section:has(.testi-grid){padding:48px 0}
  .contact{margin:0 14px;padding:34px 22px}.contact h2{font-size:30px}.contact p{font-size:14px}.contact-links{gap:8px}.contact-links a{padding:8px 12px;font-size:12px}
}

@media(max-width:360px){
  .hero .wrap{padding:0 18px}.name{font-size:40px}.hero-actions .btn{padding:10px 13px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-art{height:260px}.portfolio-categories{grid-template-columns:1fr}.portfolio-category{padding:9px 9px 13px}.portfolio-category img{height:160px}.portfolio-category strong{font-size:14px}.portfolio-category small{font-size:9px}.sticky-wrap{grid-template-columns:1fr}.sticky{min-height:0}.process{grid-template-columns:1fr}.about-text h2{font-size:32px}
}

/* Hero portrait layered over a circular backdrop, like the supplied reference. */
.visual-main{width:min(340px,74%);height:350px;aspect-ratio:auto;border-radius:28px;transform:rotate(2deg)}
@media(max-width:760px){.visual-main{width:min(300px,68%);height:315px}}
@media(max-width:480px){.visual-main{width:68%;height:280px;border-radius:24px}}

/* Quiet, white-first visual system shared by every section. */
:root{--bg:#fff;--bg-card:#fff;--ink:#171717;--ink-soft:#666;--pink:#171717;--cyan:#555;--yellow:#aaa;--violet:#444;--line:#e8e8e8}
html{background:#fff}
body{background:#fff;color:var(--ink)}
:where(a,button,input):focus-visible{outline:2px solid #333;outline-offset:3px}
header{background:rgba(255,255,255,.94);border-color:var(--line)}
.mark span{color:var(--ink)}
.nav-links a:hover,.role-line,.eyebrow,.text-link,.portfolio-category .category-label,.category-arrow{color:#555}
.nav-links a.btn{color:#fff}
.nav-links a.btn:hover{color:#fff}
.hero{background:#fff}
.role-line .dot{background:#888}
.name,.name em{color:var(--ink)}
.visual-orbit{background:#f6f6f5;border:1px solid #e8e8e6;box-shadow:none}
.visual-main{box-shadow:0 18px 42px rgba(0,0,0,.09)}
.visual-float{color:#333;border-color:#eee;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.visual-float span,.feature-list li>span{background:#f2f2f1;color:#333}
.visual-sparkle{color:#777}
.btn{background:#171717;color:#fff;box-shadow:none}
.btn:hover{background:#444}
.btn-outline{background:#fff;color:#171717;border-color:#d8d8d8}
.btn-outline:hover{background:#f5f5f5;color:#171717}
.stats{border-color:var(--line)}
.stat:nth-child(n) b{color:var(--ink)}
.adobe-marquee{background:#f5f5f4}
.adobe-marquee-logo{color:#222!important}
.adobe-marquee-logo.ps::after{content:' · Photoshop'}
.adobe-marquee-logo.ai::after{content:' · Illustrator'}
.adobe-marquee-logo.ae::after{content:' · After Effects'}
.adobe-marquee-logo.pr::after{content:' · Premiere Pro'}
.sec-head h2,.gallery-heading h2{color:var(--ink)}
.chip,.chips .chip{border-color:#dedede;color:#555;background:#fff}
.chip.active,.chip:hover,.chips .chip.active,.chips .chip:hover{background:#171717;border-color:#171717;color:#fff}
.project-search{border-color:#e5e5e5;color:#555;box-shadow:0 4px 16px rgba(0,0,0,.04)}
.card{border-color:#eee;box-shadow:0 5px 18px rgba(0,0,0,.06)}
.sticky{border-color:#e9e9e9;box-shadow:0 5px 18px rgba(0,0,0,.04)}
.sticky::before{background:#999!important}
.process{gap:18px}
.proc-item{border-color:#e9e9e9;border-left:3px solid #888;background:#fff}
.proc-item:nth-child(n){border-color:#e9e9e9}
.proc-item{border-top-color:#888}
.avatar{background:#f1f1f0}
.about .avatar{box-shadow:0 10px 30px rgba(0,0,0,.07)}
.testi{border-color:#e9e9e9;border-top-color:#999!important;box-shadow:0 5px 18px rgba(0,0,0,.04)}
.testi .who{color:#666}
.contact{background:#f5f5f4;color:var(--ink)}
.contact::before,.contact::after{display:none}
.contact h2{color:var(--ink)}
.contact p{color:#666}
.contact .btn{background:#171717!important;color:#fff}
.contact .btn:hover{background:#444!important}
.contact-links a{border-color:#ddd;color:#333}
.contact-links a:hover{background:#fff;border-color:#aaa}
footer,#karya,#layanan,#proses,#tentang,#kontak,body>section:has(.testi-grid){background:#fff}
.eyebrow{color:#666}
.feature-art{background:#f4f4f2}
.feature-sticker{color:#333;box-shadow:0 5px 16px rgba(0,0,0,.08)}
.text-link{color:#333}
.portfolio-gallery{background:#f6f6f5}
.portfolio-gallery::before{display:none}
.gallery-heading,.gallery-heading h2,.gallery-heading>p{color:var(--ink)}
.gallery-heading .eyebrow{color:#666}
.portfolio-category{color:var(--ink);box-shadow:0 4px 16px rgba(0,0,0,.05)}
.portfolio-category:hover{box-shadow:0 8px 22px rgba(0,0,0,.09)}
.portfolio-category img{background:#f1f1f0}
.portfolio-category strong{color:var(--ink)}
body>section:has(.testi-grid) .sec-head,
body>section:has(.testi-grid) .sec-head h2,
body>section:has(.testi-grid) .sec-head p{color:var(--ink)}
body>section:has(.testi-grid) .sec-head .eyebrow{color:#666}