/* A full website demonstration alongside the existing design collection. */
.home-page .featured-project{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);border:1px solid #dce3ec;border-radius:14px;overflow:hidden;background:#fff;margin-bottom:44px}
.home-page .featured-project-visual{display:flex;flex-direction:column;position:relative;background:#f8eaf1;padding:28px;justify-content:center;min-width:0;overflow:hidden;text-decoration:none}
.home-page .project-browser-bar{border-radius:8px 8px 0 0;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid #e1dce4;border-bottom:0;color:#617184;font-size:10px;font-weight:500;line-height:1.5}
.home-page .browser-dots{display:flex;gap:4px}
.home-page .browser-dots i{width:5px;height:5px;background:#c7c0cb;border-radius:50%;display:block}
.home-page .project-design-preview{background:#fff;border:1px solid #e1dce4;border-radius:0 0 8px 8px;overflow:hidden;box-shadow:0 18px 32px -22px #542e465e;color:#192f43;font-family:'Trebuchet MS',Arial,sans-serif}
.home-page .project-demo-brand{padding:14px 18px;border-bottom:1px solid #edf0f3;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;line-height:1.3}
.home-page .project-demo-brand img{width:32px;height:32px;border-radius:50%;object-fit:cover}
.home-page .project-demo-brand small{display:block;font-size:6px;letter-spacing:.17em;color:#c82f72;margin-top:3px}
.home-page .project-mini-nav{margin-left:auto;font-size:7px;color:#53647a;font-weight:500}
.home-page .project-mini-hero{display:grid;grid-template-columns:1.15fr 1fr;gap:16px;align-items:center;padding:34px 22px 36px}
.home-page .project-mini-hero>div{min-width:0}
.home-page .project-mini-eyebrow{display:block;color:#c82f72;font-size:6px;font-weight:800;letter-spacing:.07em;margin-bottom:15px}
.home-page .project-mini-title{display:block;font-family:'Trebuchet MS',Arial,sans-serif;font-weight:900;font-size:clamp(23px,2.8vw,38px);letter-spacing:-.06em;line-height:1.02}
.home-page .project-mini-title em{color:#c82f72;font-style:normal}
.home-page .project-mini-description{display:block;color:#526371;font-size:8px;line-height:1.7;margin-top:14px}
.home-page .project-mini-cta{display:inline-flex;background:#c82f72;border-radius:4px;color:#fff;font-size:7px;font-weight:800;padding:8px 10px;margin-top:18px}
.home-page .project-mini-hero>img{display:block;width:100%;height:auto;aspect-ratio:.92;object-fit:cover;object-position:left center;border:6px solid #fff0f6;border-radius:46% 46% 8px 8px;transform:rotate(3deg)}
.home-page .project-mini-ribbon{display:flex;align-items:center;justify-content:center;gap:16px;padding:14px 10px;background:#eaf6fc;color:#064a76;font-size:7px;letter-spacing:.09em;font-weight:800;line-height:1.5}
.home-page .project-mini-ribbon span{color:#c82f72}
.home-page .project-preview-label{align-self:flex-end;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #e1dce4;border-radius:6px;margin-top:18px;padding:9px 12px;color:#173453;font-size:.6875rem;font-weight:600;line-height:1.5}
.home-page .featured-project-visual:hover .project-preview-label{background:#173453;color:#fff;border-color:#173453}
.home-page .featured-project-visual:focus-visible{outline-offset:-6px;outline:3px solid #9b772c;border-radius:0}
.home-page .featured-project-copy{padding:40px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0}
.home-page .project-eyebrow{font-size:.625rem;color:#95652e;font-weight:600;letter-spacing:.12em;line-height:1.8;margin-bottom:18px}
.home-page .featured-project h3{font-family:'Sora',system-ui,sans-serif;font-size:clamp(1.5rem,2.6vw,2rem);font-weight:600;letter-spacing:-.045em;line-height:1.3;margin:0 0 22px;color:#173453}
.home-page .featured-project h3 span{color:#6b7b8e;font-weight:500}
.home-page .featured-project-copy>p:not(.project-eyebrow):not(.project-demo-note){color:#53647a;font-size:.9375rem;line-height:1.85;margin:0 0 22px}
.home-page .project-features{display:flex;flex-wrap:wrap;list-style:none;gap:8px;margin:0 0 26px;padding:0}
.home-page .project-features li{font-size:.6875rem;font-weight:500;line-height:1.5;padding:7px 10px;border-radius:5px;background:#f1f5f9;color:#53647a;border:1px solid #e2e8ef}
.home-page .featured-project-copy>.btn{font-size:.875rem;padding:13px 20px;min-height:48px;gap:14px}
.home-page .featured-project-copy .project-demo-note{font-size:.6875rem;line-height:1.8;margin:16px 0 0;color:#65758a;max-width:48ch}
.home-page .more-designs-heading{font-family:'Sora',system-ui,sans-serif;font-size:1.125rem;font-weight:600;letter-spacing:-.025em;line-height:1.5;margin:0 0 22px;color:#173453}
@media(max-width:1050px){
  .home-page .featured-project{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
  .home-page .featured-project-visual{padding:24px}
  .home-page .featured-project-copy{padding:30px}
}
@media(max-width:860px){
  .home-page .featured-project{grid-template-columns:1fr;max-width:680px;margin-inline:auto}
  .home-page .featured-project-visual{padding:32px}
  .home-page .project-mini-title{font-size:clamp(28px,5.3vw,42px)}
  .home-page .featured-project-copy{padding:32px}
  .home-page .featured-project h3{font-size:1.75rem}
  .home-page .featured-project-copy>p:not(.project-eyebrow):not(.project-demo-note){max-width:55ch}
}
@media(max-width:560px){
  .home-page .featured-project{border-radius:10px;margin-bottom:36px}
  .home-page .featured-project-visual{padding:20px}
  .home-page .project-browser-bar{padding:9px 10px;font-size:8px;gap:8px}
  .home-page .project-demo-brand{padding:10px 12px;font-size:9px;gap:6px}
  .home-page .project-demo-brand img{width:25px;height:25px}
  .home-page .project-demo-brand small{font-size:5px}
  .home-page .project-mini-nav{display:none}
  .home-page .project-mini-hero{padding:24px 14px 26px;gap:10px}
  .home-page .project-mini-title{font-size:clamp(21px,5.8vw,29px)}
  .home-page .project-mini-eyebrow{font-size:5px;margin-bottom:11px}
  .home-page .project-mini-description{font-size:6px;margin-top:12px}
  .home-page .project-mini-cta{font-size:6px;padding:7px 8px;margin-top:13px}
  .home-page .project-mini-hero>img{border-width:4px}
  .home-page .project-mini-ribbon{font-size:6px;gap:10px;padding:11px 6px}
  .home-page .project-preview-label{font-size:.625rem;padding:8px 10px;margin-top:14px}
  .home-page .featured-project-copy{padding:26px 24px}
  .home-page .project-eyebrow{font-size:.5625rem;margin-bottom:16px}
  .home-page .featured-project h3{font-size:1.5rem;margin-bottom:18px}
  .home-page .featured-project-copy>p:not(.project-eyebrow):not(.project-demo-note){font-size:.875rem;line-height:1.8}
  .home-page .project-features{gap:7px;margin-bottom:22px}
  .home-page .project-features li{font-size:.625rem;padding:7px 9px}
  .home-page .featured-project-copy>.btn{width:100%}
  .home-page .more-designs-heading{font-size:1rem}
}
