:root{color-scheme:dark;--bg:#081722;--panel:#0d202c;--ink:#f0f3ef;--muted:#a7b7bd;--teal:#8ac9bc;--line:#243944;--serif:Georgia,'Times New Roman',serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:radial-gradient(ellipse at 100% 0%,#102a36 0,transparent 37%),var(--bg);color:var(--ink);font-family:Inter,'Segoe UI',Arial,sans-serif;font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,summary:focus-visible{outline:2px solid var(--teal);outline-offset:6px}img{max-width:100%;display:block}svg{flex-shrink:0}::selection{color:var(--bg);background:var(--teal)}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.15}h2{font-size:clamp(29px,3.3vw,40px);letter-spacing:-1.2px}h2 em{color:var(--teal);font-weight:400}strong{font-weight:600;color:var(--ink)}.teal{color:var(--teal)}.site-shell{width:min(1120px,calc(100% - 80px));margin:auto}.eyebrow{font-size:10px;font-weight:600;line-height:1.6;letter-spacing:2.1px;text-transform:uppercase;color:var(--teal)}.skip-link{position:absolute;top:-100px;left:20px;padding:12px;background:var(--teal);color:var(--bg);z-index:10}.skip-link:focus{top:10px}.site-header{min-height:104px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:30px}.brand{display:inline-flex;align-items:center;gap:14px;font-size:12px;font-weight:650;letter-spacing:2px;text-transform:uppercase;white-space:nowrap}.monogram{font-family:var(--serif);font-size:24px;letter-spacing:-1px;display:grid;grid-auto-flow:column;place-content:center;width:44px;height:44px;border:1px solid #4d7778;border-radius:12px;color:var(--teal);font-weight:400}.monogram span{color:var(--ink)}nav{display:flex;gap:28px;align-items:center;font-size:12px;color:#b9c7cb}nav a{padding:10px 0}nav a:hover,.text-link:hover{color:var(--teal)}nav .nav-contact{display:inline-flex;gap:12px;align-items:center;color:var(--teal)}nav svg{width:16px}.hero{display:grid;grid-template-columns:1fr 340px;gap:90px;padding:76px 0 68px;align-items:center}.hero .eyebrow{display:flex;align-items:center;gap:12px}.little-line{display:block;width:25px;height:1px;background:var(--teal)}h1{font-size:clamp(76px,8.5vw,108px);letter-spacing:-5px;margin:15px 0 15px}.hero-subtitle{font-family:var(--serif);font-size:32px;line-height:1.3;letter-spacing:-.6px}.intro{max-width:530px;color:var(--muted);margin:22px 0 17px;font-size:15px;line-height:1.85}.location{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px}.location svg{width:15px;height:15px;color:var(--teal)}.hero-actions{display:flex;align-items:center;gap:27px;margin-top:28px}.button{display:inline-flex;justify-content:center;align-items:center;gap:23px;padding:12px 19px;border-radius:5px;font-size:12px;font-weight:650;line-height:1.7;transition:background .18s,transform .18s}.button:hover{transform:translateY(-2px)}.primary{background:var(--teal);color:#102a2b}.primary:hover{background:#a8dfd2}.text-link{display:inline-flex;align-items:center;gap:12px;font-size:12px}.social-strip{display:flex;align-items:center;gap:17px;margin-top:33px;font-size:10px;color:#a6b7bd}.social-strip>a{display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:36px;color:#d2dedf;gap:8px}.social-strip>a:hover{color:var(--teal)}.social-strip svg{height:16px;width:16px}.social-divider{height:15px;width:1px;background:var(--line);margin:0 1px}.portrait-card{padding:12px;border:1px solid #2a424b;border-radius:16px;background:linear-gradient(150deg,#132b36,#0c1c28);box-shadow:0 24px 60px #0002;transform:rotate(2deg)}.portrait-image{position:relative;overflow:hidden;border-radius:9px;background:#20363e}.portrait-image>img{width:100%;height:auto;aspect-ratio:1/1.02;object-fit:cover;image-rendering:auto}.portrait-image:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#081722b3);pointer-events:none}.photo-corner{position:absolute;bottom:5px;left:17px;z-index:1;color:#fff;font-family:var(--serif);font-size:16px;font-style:italic}.portrait-caption{padding:23px 13px 12px}.portrait-caption .eyebrow{font-size:8px;letter-spacing:1.6px}.portrait-caption h2{font-size:29px;margin:10px 0 9px;letter-spacing:-.5px}.portrait-caption>p{font-size:12px;line-height:1.7;color:var(--muted);max-width:245px}.portrait-signature{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:14px;margin-top:20px;font-family:var(--serif);font-style:italic;font-size:14px;color:var(--teal)}.portrait-signature>span{font-family:Arial;font-size:19px;font-style:normal}.about-section{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:46px 0;display:grid;grid-template-columns:1fr 1.35fr;gap:80px}.about-section h2{margin-top:14px;font-size:33px;line-height:1.3}.about-copy>p{font-size:13px;color:var(--muted);line-height:1.9}.about-copy>p+p{margin-top:12px}.interest-list{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}.interest-list span{font-size:9px;border:1px solid #2d444b;border-radius:4px;padding:4px 9px;color:#bbcccd}.section-space{margin-top:65px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:25px}.section-heading h2{margin-top:9px}.section-note{display:flex;align-items:center;gap:8px;color:#8da3ad;font-size:10px;padding-bottom:4px}.section-note svg{width:14px;height:14px}.website-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.website-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#0c1d29;transition:transform .2s,border-color .2s}.website-card:hover{transform:translateY(-5px);border-color:#5b8e87}.website-image{position:relative;aspect-ratio:1.9;overflow:hidden;background-size:cover;background-position:center;border-bottom:1px solid var(--line)}.website-image>img{width:100%;height:100%;object-fit:cover}.image-label{position:absolute;top:13px;left:13px;font-size:8px;padding:3px 8px;background:#061820bd;border:1px solid #ffffff20;border-radius:3px;text-transform:uppercase;letter-spacing:1px;color:#d4e4e3}.image-arrow{position:absolute;right:13px;bottom:13px;width:27px;height:27px;display:grid;place-items:center;background:#0817225e;border:1px solid #ffffff29;border-radius:50%;color:#d0e5df}.image-arrow svg{width:14px;height:14px}.website-copy{padding:22px;display:flex;flex-direction:column;flex:1}.card-role{font-size:9px;color:var(--teal);letter-spacing:.4px}.website-copy h3{font-size:27px;margin:8px 0 12px;letter-spacing:-.6px}.website-copy>p:not(.card-role){font-size:12px;line-height:1.85;color:var(--muted);margin-bottom:25px}.domain{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#c2d2d4;border-top:1px solid var(--line);padding-top:15px;margin-top:auto}.domain svg{height:14px;width:14px;color:var(--teal)}.art-link{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 0;border-bottom:1px solid var(--line);font-size:11px;color:var(--muted)}.art-link>span{display:flex;align-items:center;gap:9px}.art-link>svg{width:16px;height:16px;color:var(--teal)}.art-symbol{font-size:25px;color:var(--teal);margin-right:6px}.art-link:hover strong{color:var(--teal)}.recommend-card{display:grid;grid-template-columns:300px 1fr;gap:42px;padding:27px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(110deg,#122934,#0c1e29);align-items:center}.hosting-banner{display:block;width:300px;max-width:100%;border-radius:5px;overflow:hidden}.hosting-banner img{height:auto;width:300px}.recommend-copy h3{font-size:31px;letter-spacing:-.6px;margin:9px 0 13px}.recommend-copy>p:not(.eyebrow):not(.affiliate-note){font-size:13px;line-height:1.85;color:var(--muted);max-width:470px}.secondary{border:1px solid #537b78;color:var(--teal);margin-top:20px;background:transparent;font-size:11px}.secondary:hover{background:#19383c}.recommend-copy .affiliate-note{font-size:10px;line-height:1.7;color:#a1b2b9;margin-top:18px;max-width:450px}.contact-section{display:grid;grid-template-columns:1fr 1.15fr;gap:80px;padding:48px;border:1px solid #2a4148;border-radius:12px;background:radial-gradient(ellipse at 0 100%,#18393655,transparent 70%),#0d202a}.contact-intro h2{font-size:42px;line-height:1.15;margin:14px 0 20px}.contact-intro>p:not(.eyebrow){font-size:12px;color:var(--muted);line-height:1.85;max-width:300px}.contact-intro>.location{margin-top:24px}.contact-links{display:flex;flex-direction:column;justify-content:center}.contact-links>a{display:flex;align-items:center;gap:15px;padding:17px 0;border-bottom:1px solid var(--line)}.contact-links>a:last-child{border-bottom:0}.contact-icon{width:38px;height:38px;border:1px solid #35534f;border-radius:7px;display:grid;place-items:center;color:var(--teal);flex-shrink:0}.contact-icon svg{width:17px;height:17px}.contact-links>a>svg{width:16px;height:16px;color:var(--teal);margin-left:auto}.contact-links small{display:block;font-size:9px;color:var(--muted)}.contact-links strong{display:block;font-size:12px;font-weight:500;overflow-wrap:anywhere}.contact-links>a:hover strong{color:var(--teal)}.faq-section{display:grid;grid-template-columns:1fr 1.35fr;gap:80px}.faq-section h2{font-size:30px;margin-top:10px;max-width:270px}.faq-list details{border-bottom:1px solid var(--line)}.faq-list details:first-child{border-top:1px solid var(--line)}summary{padding:17px 0;list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px}summary::-webkit-details-marker{display:none}summary svg{width:16px;height:16px;color:var(--teal);transition:transform .2s}details[open] summary svg{transform:rotate(180deg)}details>p{font-size:12px;color:var(--muted);line-height:1.9;padding:0 20px 20px 0}.site-footer{margin-top:65px;padding:30px 0;display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid var(--line);color:var(--muted)}.site-footer .brand{font-size:9px;letter-spacing:1px;text-transform:none;font-weight:400}.site-footer .monogram{width:34px;height:34px;font-size:20px;border-radius:9px}.site-footer>p,.back-top{font-size:10px}.back-top{display:flex;align-items:center;gap:9px}.back-top svg{width:14px;height:14px;color:var(--teal)}
.small {font-size: 40%;}
.tm {margin-left:-1px;}
strong a {color: var(--teal); text-decoration:underline;}
strong a:hover {color: #a8dfd2;}
@media(min-width:1500px){.hero{padding-top:90px;padding-bottom:85px}}
@media(max-width:1000px){.site-shell{width:calc(100% - 56px)}.hero{gap:45px;grid-template-columns:1fr 290px;padding:58px 0}.hero-subtitle{font-size:29px}.intro{font-size:13px}.about-section,.faq-section{gap:40px}.website-grid{gap:14px}.website-copy{padding:18px}.website-copy h3{font-size:24px}.contact-section{gap:35px;padding:30px}nav{gap:20px}.recommend-card{gap:28px}.hero-actions{gap:20px}.section-note{display:none}}
@media(max-width:760px){.site-shell{width:calc(100% - 40px)}.site-header{min-height:86px;gap:20px}.brand{font-size:10px;gap:10px}nav{gap:17px}nav a{font-size:10px}nav a:first-child,nav a:nth-child(2){display:none}.hero{grid-template-columns:1fr;gap:40px;padding:44px 0}.hero-copy{max-width:560px}h1{font-size:clamp(58px,18vw,86px);letter-spacing:-3px}.hero-subtitle{font-size:31px}.intro{font-size:14px}.portrait-card{transform:none;width:100%;display:grid;grid-template-columns:145px 1fr;gap:10px;border-radius:12px}.portrait-image>img{height:100%;aspect-ratio:1;min-height:190px}.photo-corner{display:none}.portrait-caption{padding:15px 8px}.portrait-caption h2{font-size:25px}.portrait-caption>p{font-size:11px}.portrait-caption .eyebrow{font-size:7px;letter-spacing:1px}.portrait-signature{margin-top:15px;padding-top:10px;font-size:19px}.about-section{grid-template-columns:1fr;gap:24px;padding:35px 0}.about-section h2{font-size:31px}.about-copy>p{font-size:13px}.section-space{margin-top:45px}.section-heading h2{font-size:32px}.website-grid{grid-template-columns:1fr;gap:18px}.website-card{display:grid;grid-template-columns:36% 1fr}.website-image{aspect-ratio:auto;border-bottom:0;border-right:1px solid var(--line);background-size:cover}.image-label{font-size:6px;letter-spacing:.5px;left:8px;top:9px;padding:3px 5px}.image-arrow{display:none}.website-copy{padding:20px}.website-copy h3{font-size:25px;margin:7px 0 10px}.website-copy>p:not(.card-role){margin-bottom:17px}.art-link>span{display:block;line-height:1.9}.art-symbol{display:none}.art-link strong{display:block}.recommend-card{grid-template-columns:1fr;gap:24px;padding:25px}.hosting-banner{margin:auto}.recommend-copy h3{font-size:30px}.contact-section{grid-template-columns:1fr;gap:22px;padding:28px}.contact-intro h2{font-size:39px}.contact-links>a{padding:15px 0}.faq-section{grid-template-columns:1fr;gap:24px}.faq-section h2{max-width:none;font-size:30px}.site-footer{margin-top:45px;flex-wrap:wrap;gap:20px;padding:25px 0}.site-footer .brand{flex-basis:100%}.social-strip{margin-top:24px}}
@media(max-width:390px){.site-shell{width:calc(100% - 32px)}nav{gap:14px}.nav-contact svg{display:none}h1{font-size:clamp(54px,18vw,70px)}.hero-subtitle{font-size:28px}.hero-actions{gap:22px}.button{padding:12px 15px;gap:14px}.portrait-card{grid-template-columns:115px 1fr}.portrait-caption h2{font-size:22px}.portrait-caption>p{font-size:10px}.website-card{grid-template-columns:1fr}.website-image{aspect-ratio:2.1;border-right:0;border-bottom:1px solid var(--line)}.image-label{font-size:8px;top:12px;left:12px}.contact-section{padding:23px}.contact-links>a{gap:10px}.contact-links strong{font-size:11px}.recommend-card{padding:18px}.section-heading h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

@media(max-width:540px){.website-card{grid-template-columns:1fr}.website-image{aspect-ratio:1.9;border-right:0;border-bottom:1px solid var(--line)}.image-label{font-size:8px;top:12px;left:12px}.image-arrow{display:grid}}
@media(max-width:760px){.recommend-card{grid-template-columns:minmax(0,1fr)}.recommend-card>*{min-width:0}}

/* Affiliate recommendations */
.recommend-card + .recommend-card { margin-top: 24px; }
.software-artwork { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; min-height: 250px; padding: 23px; background: radial-gradient(ellipse at top left, #553e76, #211e38 70%); border: 1px solid #ffffff1a; }
.hosting-banner.software-artwork .product-logo { width: 200px; height: auto; object-fit: contain; }
.hosting-banner.software-artwork .product-image { width: 100%; height: 185px; object-fit: contain; }
.artistly .software-artwork .product-image { border-radius: 6px; height: 200px; object-fit: cover; object-position: center; }
.aivideobuilder .software-artwork { padding: 18px; background: radial-gradient(ellipse at bottom left, #453174, #161c35 75%); }
.aivideobuilder .software-artwork .product-image { height: auto; }
.recommend-copy > .payment-badge { display: inline-block; margin: 0 0 16px; padding: 7px 11px; border: 1px solid #669f91; border-radius: 5px; color: #b5f0d9 !important; background: #183c35; font-size: 12px !important; font-weight: 650; line-height: 1.5 !important; }
.product-features { display: flex; flex-wrap: wrap; gap: 6px 17px; margin: 15px 0 12px; padding: 0; list-style: none; color: #c4d4d7; font-size: 11px; }
.product-features li::before { content: '✓'; margin-right: 6px; color: var(--teal); }
.recommend-copy > .payment-note { color: #c6d9d2 !important; font-size: 11px !important; }
.recommend-disclosure { margin-top: 18px; color: var(--muted); font-size: 11px; line-height: 1.8; }
@media (max-width: 760px) { .software-artwork { width: 100%; max-width: 360px; }.hosting-banner.software-artwork .product-image { max-width: 300px; }.artistly .software-artwork .product-image { height: 215px; } }

/* Calgary skyline at golden hour, kept beneath the hero content. */
.hero { position: relative; isolation: isolate; }
.hero::before {
    content: '';
    position: absolute;
    z-index: -1;
    inset: 0 -38px;
    pointer-events: none;
    background:
        linear-gradient(90deg, #081722d9 0%, #081722b8 40%, #08172270 70%, #081722a6 100%),
        linear-gradient(0deg, #081722 0%, transparent 26%, transparent 78%, #081722 100%),
        url('../img/calgary-skyline-golden-hour.jpg') center 45% / cover no-repeat;
    mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
}
.hero-copy { position: relative; }
.hero .intro { color: #c0ced2; }
@media (max-width: 760px) {
    .hero::before { inset: 0 -20px; background-position: center, center, 46% top; background-size: auto, auto, auto 660px; }
}
@media (max-width: 390px) {
    .hero::before { left: -16px; right: -16px; }
}

/* Keep the service phrase in the main heading without changing the name styling. */
.hero-specialty { display: block; margin-top: 22px; }

/* Progressive section reveals: content is visible unless JS opts it in. */
.scroll-reveal {
    opacity: 0;
    transform: translateY(48px);
    transition: opacity 650ms ease, transform 650ms cubic-bezier(0.22, 1, 0.36, 1);
}
.scroll-reveal.is-revealed, .scroll-reveal:focus-within {
    opacity: 1;
    transform: translateY(0);
}

/* The answer clips inside its own wrapper, preserving the summary focus outline. */
.faq-answer { display: flow-root; overflow: hidden; }
.faq-answer > p { font-size: 12px; color: var(--muted); line-height: 1.9; padding: 0 20px 20px 0; }
.faq-list details.is-enhanced summary svg {
    transform: rotate(0deg);
    transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}
.faq-list details.is-expanded summary svg { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) {
    .scroll-reveal { opacity: 1; transform: none; transition: none; }
}