:root { font-family:Georgia,'Times New Roman',serif; font-synthesis:none; scroll-behavior:smooth; --line:#eed6c4; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; }
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
button,a { -webkit-tap-highlight-color:transparent; }
a:focus-visible,summary:focus-visible { outline:3px solid #c56867; outline-offset:4px; }
h1,h2,h3,p { margin-top:0; }
.container { margin-inline:auto; }
.skip-link { position:absolute; left:-9999px; top:5px; background:white; padding:12px; z-index:100; }
.skip-link:focus { left:12px; }
.site-header { border-bottom:1px solid #f0e7de; position:relative; z-index:10; }
.header-inner { display:flex; align-items:center; justify-content:space-between; height:100%; }
.logo { position:relative; font-weight:bold; white-space:nowrap; }
.logo-mark { font-size:17px; margin-right:7px; }
.brand-underline { bottom:-9px; left:25px; }
.desktop-nav { display:flex; align-items:center; }
.desktop-nav a { border-radius:25px; transition:background .2s,color .2s; }
.desktop-nav a:hover,.desktop-nav a[aria-current=page] { background:#f9e5df; color:#a43e42; }
.header-youtube { color:white; border-radius:9px; font-weight:600; white-space:nowrap; }
.header-youtube span { margin-right:8px; }
.header-youtube:hover,.btn-primary:hover { background:var(--rose-dark); }
.mobile-nav { display:none; }
.hero { position:relative; overflow:hidden; }
.hero-photo { position:absolute; }
.hero:after { content:""; position:absolute; inset:0; pointer-events:none; }
.hero-inner { position:relative; z-index:1; display:flex; align-items:center; height:100%; }
.eyebrow { color:#70412f; text-transform:uppercase; font-family:Arial,sans-serif; font-size:11px; font-weight:700; letter-spacing:.23em; line-height:1.6; }
.hero .eyebrow { display:flex; align-items:center; }
.hero .eyebrow span { display:inline-block; height:1px; }
.hero h1 em { font-style:normal; }
.hero-heart { font-family:Arial,sans-serif; font-weight:normal; }
.hero-subtitle { font-style:italic; margin-bottom:29px; }
.hero-actions { display:flex; flex-wrap:wrap; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:48px; padding:11px 24px; font-size:17px; border-radius:40px; transition:background .2s; white-space:nowrap; }
.btn-primary { background:var(--rose); color:#fff; }
.btn-outline { border:1.5px solid #a36d41; color:#6a3d2a; }
.btn-outline:hover { background:white; }
.categories { display:grid; grid-template-columns:repeat(4,1fr); }
.category { border:1px solid #f1d1c3; display:flex; align-items:center; box-shadow:0 3px 16px #ad77500b; transition:transform .2s,box-shadow .2s; }
.category:hover { transform:translateY(-3px); box-shadow:0 7px 17px #ad77502c; }
.category-icon { line-height:1; flex:none; text-align:center; }
.category-chevron { margin-left:auto; border-radius:50%; color:var(--rose); font-family:Arial,sans-serif; display:grid; place-items:center; }
.latest-section { padding-bottom:65px; }
.section-heading { display:flex; align-items:center; justify-content:center; }
.section-heading h2 { margin:0; }
.ornament { color:#c99b5b; font-size:24px; display:flex; align-items:center; gap:20px; }
.ornament:before,.ornament:after { content:""; display:block; width:80px; height:1px; background:#d7ae76; }
.video-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.video-image { display:block; position:relative; overflow:hidden; border:1px solid #e8d7c7; background:#f5e9dc; }
.video-image img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.video-image:hover img { transform:scale(1.04); }
.duration { position:absolute; border-radius:5px; background:#2c2829e0; color:#fff; font:12px Arial,sans-serif; }
.video-card h3 a:hover { color:var(--rose-dark); }
.more-videos { text-align:right; font-size:17px; margin-top:30px; }
.more-videos a,.text-link { color:var(--rose-dark); text-decoration:underline; text-underline-offset:5px; }
.welcome-section { background:#f9e9e0; padding:65px 0; }
.welcome-inner { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:70px; }
.welcome-inner h2,.subscribe-section h2 { font-size:clamp(34px,3vw,50px); font-weight:500; line-height:1.12; }
.welcome-inner p:not(.eyebrow),.subscribe-section p:not(.eyebrow) { font-size:19px; line-height:1.65; color:#6e524a; }
.welcome-inner img { height:315px; width:100%; object-fit:cover; border-radius:24px; }
.subscribe-section { text-align:center; padding:78px 0 90px; }
.subscribe-section h2 { margin-bottom:15px; }
.subscribe-section .btn { margin-top:15px; }
.site-footer { background:#4c3028; color:#fffbf5; padding-top:50px; }
.footer-inner { display:flex; align-items:start; justify-content:space-between; gap:50px; }
.footer-brand { font-size:25px; letter-spacing:.1em; }
.site-footer p { color:#eadbd1; max-width:460px; line-height:1.6; }
.site-footer nav { display:flex; gap:30px; flex-wrap:wrap; padding-top:10px; }
.copyright { text-align:center; font-size:12px; border-top:1px solid #715249; margin:36px 0 0; padding:20px; }
.page-heading { text-align:center; padding-top:75px; padding-bottom:35px; }
.page-heading h1 { font-size:clamp(45px,5vw,70px); font-weight:normal; margin:8px 0 13px; }
.page-heading>p:last-child { font-size:20px; color:#77584d; }
.page-list { padding-bottom:90px; }
.grouped-section { padding-bottom:65px; scroll-margin-top:40px; }
.grouped-section h2 { font-size:35px; font-weight:normal; margin-bottom:8px; }
.grouped-section>p { color:#78584b; font-size:18px; }
.grouped-section .video-grid { margin-top:26px; }
.muted { font-style:italic; }
.character-page { padding:95px 0; display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:70px; }
.character-page img { width:100%; height:370px; object-fit:cover; border-radius:22px; }
.character-page h1 { font-size:clamp(46px,5vw,70px); font-weight:normal; margin:0 0 15px; }
.character-page p:not(.eyebrow) { font-size:20px; line-height:1.6; color:#725448; margin-bottom:32px; }
.parents-copy { max-width:840px; padding-bottom:95px; }
.parents-copy h2 { margin-top:35px; font-size:30px; font-weight:normal; }
.parents-copy p { line-height:1.8; font-size:19px; color:#725448; }
@media(max-width:1180px) {
  .desktop-nav { gap:3px; }
  .desktop-nav a { padding:10px 9px; font-size:15px; }
  .header-youtube { font-size:13px; padding:11px; }
  .logo { font-size:22px; }
  .category { gap:9px; padding:10px 14px; font-size:16px; }
  .category-icon { font-size:30px; }
  .hero-photo { left:42%; }
}
@media(max-width:820px) {
  .desktop-nav,.header-youtube { display:none; }
  .mobile-nav { display:block; position:relative; font-family:Arial,sans-serif; }
  .mobile-nav summary { list-style:none; cursor:pointer; padding:10px 12px; background:#fff0e8; border-radius:8px; }
  .mobile-nav summary::-webkit-details-marker { display:none; }
  .mobile-nav nav { position:absolute; right:0; top:45px; width:220px; display:flex; flex-direction:column; background:white; border:1px solid var(--line); box-shadow:0 8px 22px #52271820; border-radius:10px; overflow:hidden; }
  .mobile-nav nav a { padding:13px 16px; border-bottom:1px solid #f6e9e3; }
  .hero-photo { background-size:cover; }
  .hero-inner { min-height:550px; align-items:flex-end; }
  .hero-copy { max-width:450px; }
  .categories { grid-template-columns:repeat(2,1fr); }
  .video-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ornament:before,.ornament:after { width:35px; }
  .welcome-inner,.character-page { grid-template-columns:1fr; gap:30px; }
  .welcome-inner img { height:260px; }
  .footer-inner { flex-direction:column; }
}
@media(max-width:520px) {
  .logo { font-size:19px; }
  .logo-mark { font-size:15px; }
  .hero-inner { align-items:flex-end; }
  .btn { padding:10px 16px; font-size:15px; min-height:44px; }
  .categories { gap:10px; padding-top:18px; padding-bottom:35px; }
  .category-chevron { display:none; }
  .section-heading { margin-bottom:20px; }
  .section-heading h2 { white-space:nowrap; }
  .ornament:before,.ornament:after { width:12px; }
  .video-grid { gap:16px 12px; }
  .latest-section { padding-bottom:45px; }
  .welcome-section { padding:45px 0; }
  .subscribe-section { padding:60px 0; }
  .page-heading { padding:56px 0 30px; }
  .page-heading h1 { font-size:45px; }
  .page-heading>p:last-child { font-size:17px; }
  .character-page { padding:55px 0; }
  .character-page img { height:250px; }
  .site-footer nav { gap:18px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after { scroll-behavior:auto!important; transition:none!important; }
}
:root { --brown:#592711; --rose:#c74f59; --rose-dark:#ae3641; --cream:#fffaf5; --gold:#bc822d; color:var(--brown); background:#fffaf6; }
body { background:radial-gradient(ellipse at 50% 45%,#fffdfa,transparent 75%),#fff9f4; }
.container { width:min(1512px,calc(100% - 9.5%)); }
.site-header { height:89px; background:#fffcf8f5; border:0; }
.header-inner { width:min(1250px,calc(100% - 64px)); gap:25px; }
.logo { display:flex; flex-direction:column; align-items:center; font-size:30px; letter-spacing:.075em; line-height:1; min-width:220px; }
.logo-mark { display:flex; align-items:center; justify-content:center; gap:7px; margin:0 0 2px; color:var(--gold); height:26px; }
.logo-mark svg { width:33px; height:29px; }
.logo-mark:before,.logo-mark:after { content:""; height:1px; width:29px; background:var(--gold); }
.brand-underline { position:static; width:162px; height:20px; display:flex; align-items:center; gap:9px; background:none; margin-top:3px; }
.brand-underline:before,.brand-underline:after { content:""; height:1px; background:#d8a25a; flex:1; }
.brand-underline span { font-size:25px; letter-spacing:0; }
.desktop-nav { gap:13px; flex:1; justify-content:space-between; }
.desktop-nav a { font-size:20px; padding:7px 22px; }
.desktop-nav a[aria-current=page] { background:#fce0d7; color:#b02c2b; }
.header-youtube { background:linear-gradient(#ed2936,#d71d2d); font-family:Georgia,serif; font-size:16px; padding:10px 17px; position:relative; box-shadow:0 2px 10px #c92b2b50; border:1px solid #ff6871; }
.header-youtube:before { content:""; position:absolute; left:-33px; top:0; height:100%; width:1px; background:#c69b7c; }
.header-youtube span { display:inline-block; background:white; color:#d92232; border-radius:4px; font-size:12px; padding:2px 7px; }
.hero { height:400px; background:#fff0e0; }
.hero-photo { inset:0 0 0 43.7%; background-image:url('images/pakita-garden.webp'); background-position:center; background-size:cover; }
.hero:after { background:linear-gradient(90deg,#fff1e3 0%,#fff2e6 28%,#fff1e5ed 36%,#fff1e563 45%,transparent 57%); }
.hero-inner { width:min(1260px,calc(100% - 9.5%)); }
.hero-copy { padding:20px 0 27px; max-width:650px; }
.hero .eyebrow { font-size:13px; letter-spacing:.22em; gap:21px; margin-bottom:11px; color:#762e17; }
.hero .eyebrow span { width:36px; background:#ba822d; }
.hero h1 { font-size:74px; font-weight:700; line-height:.91; letter-spacing:-.035em; margin:12px 0 17px; color:#60290f; }
.hero-heart { display:inline-block; transform:rotate(12deg); font-size:55px; color:#da7980; margin-left:13px; vertical-align:16px; }
.hero-subtitle { font-size:26px; line-height:1.25; color:#71321b; margin:0 0 25px 5px; }
.hero-actions { gap:15px; }
.hero .btn { font-size:22px; min-height:53px; padding:10px 29px; }
.btn-outline { border-color:#a86d24; background:#fff9efbd; }
.categories { gap:24px; padding-top:19px; padding-bottom:42px; }
.category { min-height:78px; border-radius:23px; background:linear-gradient(120deg,#fff0e8,#fcece6); border-color:#f6d2c2; font-size:23px; padding:10px 25px; gap:24px; }
.category-icon { font-size:57px; width:72px; color:#d7953d; }
.category:first-child .category-icon { color:#ca535c; }
.category-chevron { width:31px; height:31px; font-size:27px; background:#ffe0d4; }
.blocks { position:relative; height:58px; font-family:Arial,sans-serif; font-weight:bold; }
.blocks i { position:absolute; font-style:normal; font-size:21px; border:3px solid #c8756c; border-radius:8px; width:31px; height:31px; line-height:26px; background:#fff8ed; color:#c75b61; box-shadow:inset 0 0 0 2px #f1d2ba; }
.blocks i:first-child { left:17px; top:0; transform:rotate(-5deg); }
.blocks i:nth-child(2) { left:0; top:27px; color:#99836e; border-color:#b29a7f; transform:rotate(4deg); }
.blocks i:last-child { left:33px; top:28px; transform:rotate(-3deg); }
.seasons { font-size:46px; display:flex; align-items:center; width:88px; letter-spacing:-14px; }
.seasons small { font-size:43px; color:#bf8a40; transform:translateY(8px); }
.latest-section { padding-top:0; }
.section-heading { position:relative; margin-bottom:20px; gap:33px; }
.section-heading h2 { font-size:47px; font-weight:700; letter-spacing:-.035em; }
.section-heading:before,.section-heading:after { content:""; width:143px; height:1px; background:#cb922d; }
.heading-paw { position:absolute; left:50%; top:-31px; transform:translateX(-50%); display:flex; align-items:center; gap:14px; color:#b78028; }
.heading-paw svg { width:29px; height:29px; }
.heading-paw:before,.heading-paw:after { content:""; width:65px; height:1px; background:#e5bc7b; }
.video-grid { gap:18px; }
.video-image { border-radius:18px; aspect-ratio:1.94; border-color:#e7c9b6; }
.duration { font-size:16px; bottom:8px; right:8px; padding:4px 7px; }
.duration:before { content:'▶ '; font-size:13px; }
.video-card h3 { font-size:19px; line-height:1.3; margin:8px 5px; font-weight:500; }
@media(min-width:1500px) {
  .hero { height:400px; }
  .hero-inner { width:1260px; }
  .header-inner { width:1250px; }
}
@media(min-width:821px) and (max-width:1250px) {
  .header-inner { width:94%; gap:18px; }
  .logo { font-size:23px; min-width:180px; }
  .desktop-nav { gap:0; }
  .desktop-nav a { font-size:16px; padding:9px 10px; }
  .header-youtube { font-size:13px; padding:10px; }
  .header-youtube:before { left:-12px; }
  .category { font-size:18px; gap:12px; padding:12px 15px; }
  .category-icon { width:50px; }
  .hero h1 { font-size:66px; }
  .hero-subtitle { font-size:23px; }
  .hero .btn { font-size:19px; padding-inline:22px; }
}
@media(max-width:820px) {
  .container { width:calc(100% - 34px); }
  .header-inner { width:calc(100% - 34px); }
  .site-header { height:83px; }
  .logo { font-size:23px; min-width:0; }
  .logo-mark { height:20px; }
  .logo-mark svg { height:23px; }
  .brand-underline { height:16px; }
  .brand-underline span { font-size:20px; }
  .hero { height:auto; min-height:550px; }
  .hero-inner { width:calc(100% - 44px); }
  .hero-photo { inset:0 0 0 20%; background-position:55% center; }
  .hero:after { background:linear-gradient(90deg,#fff1e3fa,#fff2e6cd 45%,#fff1e530 80%); }
  .hero-copy { padding-bottom:60px; }
  .hero h1 { font-size:61px; }
  .hero-heart { font-size:40px; vertical-align:10px; }
  .hero .eyebrow { font-size:10px; gap:10px; }
  .hero-subtitle { font-size:23px; }
  .hero .btn { font-size:18px; padding:11px 20px; }
  .categories { padding-bottom:47px; gap:12px; }
  .category { font-size:19px; gap:15px; padding:12px 16px; }
  .category-icon { width:55px; font-size:45px; }
  .section-heading h2 { font-size:38px; }
  .section-heading:before,.section-heading:after { width:60px; }
  .video-card h3 { font-size:17px; }
}
@media(max-width:520px) {
  .hero { min-height:640px; }
  .hero-photo { inset:0; background-size:auto 360px; background-position:59% top; background-repeat:no-repeat; }
  .hero:after { background:linear-gradient(0deg,#fff5ea 6%,#fff2e6 37%,#fff1e570 57%,transparent 75%); }
  .hero-inner { min-height:640px; }
  .hero-copy { padding-bottom:32px; }
  .hero h1 { font-size:49px; line-height:.97; }
  .hero-heart { font-size:34px; }
  .hero-subtitle { font-size:20px; margin-left:0; margin-bottom:21px; }
  .hero .eyebrow { letter-spacing:.1em; font-size:9px; }
  .hero .eyebrow span { width:19px; }
  .hero .btn { font-size:16px; padding:11px 16px; min-height:47px; }
  .hero-actions { gap:9px; }
  .category { font-size:15px; gap:9px; padding:10px; border-radius:17px; min-height:74px; }
  .category-icon { width:39px; font-size:36px; }
  .blocks { transform:scale(.75); transform-origin:left center; margin-right:1px; }
  .seasons { letter-spacing:-18px; font-size:31px; }
  .seasons small { font-size:30px; }
  .section-heading { gap:15px; }
  .section-heading h2 { font-size:35px; }
  .section-heading:before,.section-heading:after { width:35px; }
  .heading-paw:before,.heading-paw:after { width:40px; }
  .video-image { border-radius:12px; }
  .video-card h3 { font-size:14px; margin-inline:0; }
  .duration { font-size:11px; padding:3px 5px; bottom:5px; right:5px; }
  .duration:before { font-size:10px; }
}
.music-note svg,.moon-icon svg { display:block; width:100%; height:64px; }
@media(min-width:1251px) {
  .reference-home .site-header { height:5.323vw; max-height:none; }
  .reference-home .header-inner { width:74.16%; margin-left:15.19%; margin-right:10.65%; gap:2vw; }
  .reference-home .logo { font-size:1.795vw; min-width:12.68vw; }
  .reference-home .logo-mark { height:1.56vw; }
  .reference-home .logo-mark svg { height:1.73vw; width:1.97vw; }
  .reference-home .desktop-nav { gap:.72vw; }
  .reference-home .desktop-nav a { font-size:1.196vw; padding:.36vw 1.38vw; }
  .reference-home .header-youtube { font-size:1.016vw; padding:.48vw .96vw; }
  .reference-home .header-youtube:before { left:-2.03vw; }
  .reference-home .hero { height:24.043vw; }
  .reference-home .hero-inner { width:75.36%; margin-inline:auto; }
  .reference-home .hero-photo { left:43.66%; background-position:center; background-size:100% 100%; }
  .reference-home .hero:after { background:linear-gradient(90deg,#fff1e3 0%,#fff2e6 29%,#fff1e5df 36%,#fff1e550 44%,transparent 52%); }
  .reference-home:before,.reference-home:after { content:""; position:absolute; top:0; z-index:11; pointer-events:none; background-size:100% 100%; background-repeat:no-repeat; }
  .reference-home:before { left:0; width:11.15vw; height:30.8vw; background-image:url('images/floral-left.jpg'); background-position:0 0; }
  .reference-home:after { right:0; width:7.25vw; height:5.33vw; background-image:url('images/floral-right.jpg'); background-position:right top; }
  .reference-home .hero-copy { padding:0 0 .6vw; max-width:38.9vw; }
  .reference-home .hero .eyebrow { font-size:.838vw; gap:1.25vw; letter-spacing:.22em; margin:0 0 .66vw; }
  .reference-home .hero .eyebrow span { width:2.16vw; }
  .reference-home .hero h1 { font-size:4.545vw; line-height:.89; margin:.72vw 0 1.02vw; letter-spacing:-.035em; }
  .reference-home .hero-heart { font-size:3.29vw; margin-left:.78vw; vertical-align:.96vw; }
  .reference-home .hero-subtitle { font-size:1.615vw; line-height:1.18; margin:0 0 1.61vw .3vw; }
  .reference-home .hero-actions { gap:.9vw; }
  .reference-home .hero .btn { font-size:1.375vw; padding:.6vw 1.73vw; min-height:3.17vw; }
  .reference-home .container.categories,.reference-home .latest-section { width:90.5%; max-width:none; }
  .reference-home .categories { gap:1.38vw; padding-top:1.02vw; padding-bottom:2.45vw; }
  .reference-home .category { min-height:4.66vw; border-radius:1.38vw; gap:1.44vw; padding:.59vw 1.5vw; font-size:1.435vw; }
  .reference-home .category-icon { width:4.31vw; }
  .reference-home .category-icon svg { height:3.83vw; }
  .reference-home .category-chevron { width:1.85vw; height:1.85vw; font-size:1.61vw; }
  .reference-home .section-heading { margin-bottom:1.08vw; gap:2vw; }
  .reference-home .section-heading h2 { font-size:2.87vw; line-height:1.2; }
  .reference-home .section-heading:before,.reference-home .section-heading:after { width:8.55vw; }
  .reference-home .heading-paw { top:-1.85vw; }
  .reference-home .heading-paw svg { width:1.74vw; height:1.74vw; }
  .reference-home .video-grid { gap:1.02vw; }
  .reference-home .video-image { border-radius:1.08vw; aspect-ratio:1.96; }
  .reference-home .video-card h3 { font-size:1.195vw; line-height:1.3; margin:.42vw .3vw; }
  .reference-home .duration { font-size:.96vw; }
}

/* Keyboard, touch and layout refinements. */
:root { --rose:#bc4651; --rose-dark:#a43440; }
.btn-primary { background:var(--rose); }
.mobile-nav summary { min-height:44px; min-width:44px; display:flex; align-items:center; }
.mobile-nav nav a { min-height:44px; }
.video-card { min-width:0; }
.video-image img { aspect-ratio:380 / 194; }
.category > span:nth-child(2) { min-width:0; }
.category-chevron { flex-shrink:0; }
.site-footer a:hover { text-decoration:underline; text-underline-offset:4px; }
@media(min-width:1251px) {
  .reference-home .category { padding-inline:1.3vw; gap:.95vw; }
  .reference-home .category-icon { width:3.65vw; }
  .reference-home .category > span:nth-child(2) { white-space:nowrap; }
  .reference-home .hero-photo { mask-image:linear-gradient(90deg,transparent,#000 19%); }
}
@media(max-width:520px) {
  .hero-actions .btn { flex:1; }
  .category > span:nth-child(2) { line-height:1.25; }
  .video-card h3 { line-height:1.45; }
}
@media(max-width:520px) {
  .hero-photo { background-position:32% top; }
  .category .blocks { width:48px; flex-basis:48px; }
}
