@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@600;700&display=swap');

/* ---- YouGrowIT portal skin — matches www.yougrowit.com.au ---- */
:root{
  --ygi-teal:#0E7C7B; --ygi-teal-deep:#0A5C5B; --ygi-teal-ink:#063E3D;
  --ygi-wash:#E8F3F3; --ygi-ink:#1E293B; --ygi-slate:#475569; --ygi-line:#CBD5E1;
}

/* Brand typeface on every heading */
h1,h2,h3,h4,
.BlurNav__blurbTitle,.ArticleWidgets__HeadTitle,.CommunityWidgets__HeadTitle,
.ArticlesCard__articleCardTitle,.Header__welcomeHeading{
  font-family:'Archivo',system-ui,-apple-system,sans-serif;
  font-weight:700; letter-spacing:-0.015em;
}

/* Logo reads white on the dark teal header */
.Header__brandLogoImg{ filter:brightness(0) invert(1); }
.Header__brandName{ letter-spacing:-0.02em; }

/* Search field: quiet, on-brand, obvious focus */
.Header__headerSearch input,.Input__searchPanelInput{
  background:rgba(255,255,255,0.12) !important;
  border:1px solid rgba(255,255,255,0.28) !important;
  border-radius:10px !important; color:#ffffff !important;
}
.Header__headerSearch input::placeholder{ color:rgba(255,255,255,0.75) !important; }
.Header__headerSearch input:focus,.Input__searchPanelInput:focus{
  background:rgba(255,255,255,0.18) !important; border-color:#ffffff !important;
  outline:2px solid rgba(255,255,255,0.55); outline-offset:1px;
}

/* Nav tabs */
.Header__tabsLink{ opacity:0.85; }
.Header__tabsTab:hover .Header__tabsLink{ opacity:1; }
.Header__tabsTabActive .Header__tabsLink{ opacity:1; font-weight:600; }

/* The three entry cards — the site's card language */
.BlurNav__blurbNavItem{
  background:#ffffff; border:1px solid var(--ygi-line); border-radius:12px;
  box-shadow:0 1px 2px rgba(15,23,42,0.04);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.BlurNav__blurbNavItem:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px -12px rgba(6,62,61,0.35);
  border-color:var(--ygi-teal);
}
.BlurNav__blurbDescription{ color:var(--ygi-slate); }

/* Article rows */
.ArticlesCard__articleCard{ border-radius:8px; transition:background .15s ease; }
.ArticlesCard__articleCard:hover{ background:var(--ygi-wash); }
.ArticlesCard__articleLink:focus-visible{
  outline:2px solid var(--ygi-teal); outline-offset:2px; border-radius:6px;
}

/* Section headings */
.ArticleWidgets__HeadTitle,.CommunityWidgets__HeadTitle{ color:var(--ygi-ink); }

/* Footer */
.Footer__footer{ border-top:1px solid var(--ygi-line); color:var(--ygi-slate); }
.Footer__footerLink{ color:var(--ygi-teal-deep); }

/* A tradie's phone is a first-class citizen */
@media (max-width:640px){
  .BlurNav__blurbNavItem{ border-radius:10px; }
}

@media (prefers-reduced-motion:reduce){
  .BlurNav__blurbNavItem,.ArticlesCard__articleCard{ transition:none; }
  .BlurNav__blurbNavItem:hover{ transform:none; }
}

/* ---- Layout: drop the empty right column, let content breathe ---- */
.Layout__layout2:empty{ display:none; }
.Layout__twoColumn{ margin-left:auto; margin-right:auto; }
.Layout__layout1{ flex:1 1 auto; width:auto; }

/* Entry cards sit on an even grid instead of an orphaned third */
.BlurNav__blurbNav{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:20px;
}
.BlurNav__blurbNavItem{ width:auto !important; margin:0 !important; position:relative; overflow:hidden; }

/* Signature: a teal hairline that wakes up on hover */
.BlurNav__blurbNavItem::before{
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,var(--ygi-teal),var(--ygi-teal-ink));
  opacity:0; transition:opacity .18s ease;
}
.BlurNav__blurbNavItem:hover::before{ opacity:1; }

/* Section headings get the site's understated rule */
.ArticleWidgets__HeadTitle,.CommunityWidgets__HeadTitle{
  border-bottom:2px solid var(--ygi-wash); padding-bottom:.5rem;
}

@media (prefers-reduced-motion:reduce){
  .BlurNav__blurbNavItem::before{ transition:none; }
}

/* ---- Make the whole entry card clickable, not just its title ---- */
.BlurNav__blurbNavItem{ cursor:pointer; }
.BlurNav__blurbNavItemTitle a::after{
  content:""; position:absolute; top:0; right:0; bottom:0; left:0; z-index:2;
}
.BlurNav__blurbNavItemTitle a:focus-visible::after{
  outline:2px solid var(--ygi-teal); outline-offset:-3px; border-radius:12px;
}
/* ---- Sign-in page: say what to enter and why ---- */
.Button__primary{ background:var(--ygi-teal) !important; border-color:var(--ygi-teal) !important; }
.Button__primary:hover{ background:var(--ygi-teal-deep) !important; }

/* ---- Custom footer (theme HTML tab) ---- */
.ygi-footer{ max-width:1180px; margin:0 auto; padding:2rem 1.25rem 1.25rem; text-align:left; }
.ygi-footer__row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1.75rem; }
.ygi-footer__col p{ margin:0 0 .45rem; color:var(--ygi-slate); font-size:.9rem; line-height:1.55; }
.ygi-footer__head{ font-family:"Archivo",system-ui,sans-serif; font-weight:700; letter-spacing:-.015em;
  color:var(--ygi-ink) !important; font-size:1rem !important; margin-bottom:.5rem !important; }
.ygi-footer__link{ color:var(--ygi-teal-deep); text-decoration:none; border-bottom:1px solid rgba(10,92,91,.35); }
.ygi-footer__link:hover{ color:var(--ygi-teal); border-bottom-color:var(--ygi-teal); }
.ygi-footer__legal{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem 1.5rem;
  margin-top:1.5rem; padding-top:1rem; border-top:1px solid var(--ygi-line);
  color:var(--ygi-slate); font-size:.78rem; }
/* Sign-in: the form itself is inside Zoho's IAM iframe, so we speak to its wrapper */
.UserSigninContainer__signInIframe{ position:relative; }
.UserSigninContainer__signInIframe::before{
  content:"Sign in with your work email address — the one we support you on. From here you can log a ticket and follow it through to done.";
  display:block; max-width:352px; margin:0 0 1rem;
  color:var(--ygi-slate); font-size:0.92rem; line-height:1.55;
}
